:root{
  --bg:#0d0f14;--sf:#13161e;--sf2:#1a1e29;--sf3:#20253a;
  --border:#232737;--border2:#2d3350;
  --accent:#5b6af0;--accent2:#818cf8;
  --text:#e8eaf6;--text2:#9097b8;--muted:#5a6180;
  --green:#22c55e;--blue:#3b82f6;--purple:#a855f7;
  --yellow:#f59e0b;--red:#ef4444;
  --radius:10px;--radius-sm:7px;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--text);font-family:'DM Mono',monospace;min-height:100vh;overflow-x:hidden;}
body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(91,106,240,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(91,106,240,0.03) 1px,transparent 1px);background-size:48px 48px;pointer-events:none;z-index:0;}

/* LAYOUT */
.app{display:flex;height:100vh;overflow:hidden;position:relative;z-index:1;}

/* SIDEBAR */
.sidebar{width:256px;flex-shrink:0;background:var(--sf);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;}
.brand{padding:20px 18px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;}
.brand-logo{width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--purple));display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:800;font-size:.85rem;color:#fff;flex-shrink:0;}
.brand-name{font-family:'Syne',sans-serif;font-weight:800;font-size:.95rem;letter-spacing:-.02em;}
.brand-name span{color:var(--accent2);}
.user-panel{padding:12px;border-bottom:1px solid var(--border);}
.user-card{background:var(--sf2);border:1px solid var(--border2);border-radius:var(--radius);padding:10px 12px;display:flex;align-items:center;gap:10px;}
.user-avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.62rem;font-family:'Syne',sans-serif;font-weight:700;flex-shrink:0;background:linear-gradient(135deg,var(--accent),var(--purple));color:#fff;}
.user-info .name{font-size:.72rem;color:var(--text);}
.user-info .role{font-size:.58rem;color:var(--muted);margin-top:1px;letter-spacing:.05em;text-transform:uppercase;}
.nav{flex:1;overflow-y:auto;padding:10px 8px;}
.nav-label{font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:10px 8px 6px;}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);cursor:pointer;transition:background .15s;margin-bottom:2px;}
.nav-item:hover{background:var(--sf2);}
.nav-item.active{background:rgba(91,106,240,.15);border:1px solid rgba(91,106,240,.25);}
.nav-item.active .ni{color:var(--accent2);}
.nav-item.active .nl{color:var(--text);}
.ni{font-size:1rem;width:20px;text-align:center;flex-shrink:0;color:var(--muted);}
.nl{font-size:.72rem;color:var(--text2);}
.nc{margin-left:auto;background:var(--sf3);border:1px solid var(--border2);color:var(--muted);font-size:.58rem;padding:1px 6px;border-radius:4px;}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.topbar{height:56px;flex-shrink:0;background:var(--sf);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:14px;}
.topbar-title{font-family:'Syne',sans-serif;font-weight:700;font-size:.95rem;}
.topbar-sub{font-size:.63rem;color:var(--muted);}
.spacer{flex:1;}
.search-box{background:var(--sf2);border:1px solid var(--border);border-radius:var(--radius-sm);display:flex;align-items:center;gap:8px;padding:6px 12px;width:210px;transition:border-color .2s;}
.search-box:focus-within{border-color:var(--accent);}
.search-box input{background:none;border:none;outline:none;color:var(--text);font-family:'DM Mono',monospace;font-size:.7rem;width:100%;}
.search-box input::placeholder{color:var(--muted);}
.content{flex:1;overflow-y:auto;padding:24px;}
.content::-webkit-scrollbar{width:5px;}
.content::-webkit-scrollbar-thumb{background:var(--border2);border-radius:99px;}

/* STAT CARDS */
.stats-row{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:26px;}
.stat-card{background:var(--sf);border:1px solid var(--border);border-radius:var(--radius);padding:16px 16px 12px;position:relative;overflow:hidden;transition:transform .2s;}
.stat-card:hover{transform:translateY(-2px);}
.stat-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;}
.sc-total::after{background:var(--accent);}
.sc-ip::after{background:var(--blue);}
.sc-rfa::after{background:var(--green);}
.sc-qa::after{background:var(--purple);}
.sc-paused::after{background:var(--red);}
.sc-set::after{background:#f59e0b;}
.sc-label{font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;}
.sc-num{font-family:'Syne',sans-serif;font-weight:800;font-size:2rem;line-height:1;letter-spacing:-.04em;}
.sc-sub{font-size:.58rem;color:var(--muted);margin-top:4px;}

/* SECTION TITLE */
.sec-title{font-family:'Syne',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.sec-title::after{content:'';flex:1;height:1px;background:var(--border);}

/* FILTERS */
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;align-items:center;justify-content:space-between;}
.filter-group{display:flex;gap:5px;flex-wrap:wrap;}
.fbtn{background:var(--sf2);border:1px solid var(--border);color:var(--text2);padding:4px 11px;border-radius:6px;font-family:'DM Mono',monospace;font-size:.63rem;letter-spacing:.06em;cursor:pointer;transition:all .2s;text-transform:uppercase;}
.fbtn:hover,.fbtn.active{background:var(--accent);border-color:var(--accent);color:#fff;}

/* TASK TABLE */
.ttable{width:100%;border-collapse:separate;border-spacing:0 4px;}
.ttable thead th{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:5px 12px;text-align:left;font-weight:400;}
.ttable tbody tr{background:var(--sf);cursor:pointer;transition:transform .12s,background .12s;}
.ttable tbody tr:hover{background:var(--sf2);transform:translateX(2px);}
.ttable tbody td{padding:9px 12px;font-size:.68rem;color:var(--text2);border-top:1px solid transparent;border-bottom:1px solid transparent;}
.ttable tbody td:first-child{border-left:1px solid transparent;border-radius:var(--radius) 0 0 var(--radius);color:var(--text);font-weight:500;}
.ttable tbody td:last-child{border-right:1px solid transparent;border-radius:0 var(--radius) var(--radius) 0;}
.ttable tbody tr:hover td{border-color:var(--border);}

/* STATUS BADGE */
.sbadge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:5px;font-size:.58rem;font-weight:500;white-space:nowrap;}
.sbadge::before{content:'';width:5px;height:5px;border-radius:50%;flex-shrink:0;}

/* ASSIGNEE CHIPS */
.achip{display:inline-flex;align-items:center;gap:4px;border-radius:12px;padding:2px 7px 2px 4px;font-size:.57rem;margin-right:3px;}
.aav{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.44rem;font-family:'Syne',sans-serif;font-weight:700;flex-shrink:0;}

/* TEAM GRID */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
.team-card{background:var(--sf);border:1px solid var(--border);border-radius:var(--radius);padding:16px;transition:border-color .2s;cursor:default;}
.team-card:hover{border-color:var(--border2);}
.team-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:700;font-size:.75rem;flex-shrink:0;}

/* GANTT */
.gantt-wrap{background:var(--sf);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:24px;}
.gantt-scroll{overflow-x:auto;max-height:500px;overflow-y:auto;}
.gantt-scroll::-webkit-scrollbar{width:4px;height:4px;}
.gantt-scroll::-webkit-scrollbar-thumb{background:var(--border2);border-radius:99px;}
.gt{border-collapse:collapse;width:max-content;min-width:100%;}
.gt thead th{position:sticky;top:0;z-index:6;background:var(--sf2);border-bottom:1px solid var(--border);}
.gt .lcol{position:sticky;left:0;z-index:7;background:var(--sf2);border-right:1px solid var(--border);min-width:240px;width:240px;}
.gt tbody .lcol{z-index:5;background:var(--sf);transition:background .1s;}
.gt tbody tr:hover .lcol{background:#181b26;}
.gt tbody tr{border-bottom:1px solid rgba(35,39,55,.6);transition:background .1s;}
.gt tbody tr:hover{background:rgba(255,255,255,.015);}
.row-hdr th{font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:8px 0;text-align:center;}
.row-hdr .lcol{text-align:left;padding-left:14px;}
.row-days th{font-size:.54rem;color:var(--muted);padding:4px 0 7px;text-align:center;min-width:28px;width:28px;font-weight:400;}
.row-days .lcol{font-size:.58rem;text-align:left;padding-left:14px;}
.col-today{color:var(--accent)!important;font-weight:700;background:rgba(91,106,240,.07)!important;}
.col-we{color:#252838!important;}
.lcol-td{position:sticky;left:0;z-index:4;background:var(--sf);border-right:1px solid var(--border);min-width:240px;width:240px;vertical-align:middle;padding:0 8px 0 12px;cursor:pointer;}
.gt tbody tr:hover .lcol-td{background:#181b26;}
.linner{display:flex;align-items:center;gap:7px;padding:4px 0;}
.gav{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.5rem;font-weight:700;font-family:'Syne',sans-serif;flex-shrink:0;}
.gname{font-size:.6rem;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:155px;}
.gtask{font-size:.53rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:155px;margin-top:1px;}
.dcell{min-width:28px;width:28px;padding:3px 1px;vertical-align:middle;}
.dcell.col-we{background:rgba(255,255,255,.005);}
.dcell.col-today{background:rgba(91,106,240,.04);}
.sq{height:18px;width:100%;border-radius:0;cursor:pointer;transition:filter .15s;}
.sq:hover{filter:brightness(1.35);}
.sq.s-start{border-radius:5px 0 0 5px;}
.sq.s-end{border-radius:0 5px 5px 0;}
.sq.s-solo{border-radius:5px;}
.sq-ip{background:rgba(59,130,246,.65);border-top:1px solid rgba(59,130,246,.85);border-bottom:1px solid rgba(59,130,246,.85);}
.sq-rfa{background:rgba(34,197,94,.65);border-top:1px solid rgba(34,197,94,.85);border-bottom:1px solid rgba(34,197,94,.85);}
.sq-qa{background:rgba(168,85,247,.65);border-top:1px solid rgba(168,85,247,.85);border-bottom:1px solid rgba(168,85,247,.85);}
.sq-paused{background:rgba(239,68,68,.55);border-top:1px solid rgba(239,68,68,.75);border-bottom:1px solid rgba(239,68,68,.75);}
.sq-setting{background:rgba(99,102,241,.5);border-top:1px solid rgba(99,102,241,.7);border-bottom:1px solid rgba(99,102,241,.7);}
.sq-pending{background:rgba(245,158,11,.5);border-top:1px solid rgba(245,158,11,.7);border-bottom:1px solid rgba(245,158,11,.7);}
.sq-estimate{background:rgba(125,211,252,.3);border-top:1px solid rgba(125,211,252,.45);border-bottom:1px solid rgba(125,211,252,.45);}
.today-tick{position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);background:var(--accent);opacity:.9;pointer-events:none;border-radius:1px;}
.gantt-legend{display:flex;flex-wrap:wrap;gap:14px;padding:12px 16px;border-top:1px solid var(--border);background:var(--sf2);}
.leg{display:flex;align-items:center;gap:6px;font-size:.6rem;color:var(--text2);}
.leg-sq{width:12px;height:12px;border-radius:3px;flex-shrink:0;}

/* PANEL */
.panel-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:50;display:none;backdrop-filter:blur(3px);}
.panel-overlay.open{display:block;}
.task-panel{position:fixed;right:0;top:0;bottom:0;width:560px;background:var(--sf);border-left:1px solid var(--border2);z-index:51;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow:hidden;}
.task-panel.open{transform:translateX(0);}
.panel-head{padding:20px 22px 16px;border-bottom:1px solid var(--border);flex-shrink:0;display:flex;align-items:flex-start;gap:12px;}
.panel-close{background:var(--sf2);border:1px solid var(--border);border-radius:6px;color:var(--text2);cursor:pointer;padding:4px 8px;font-size:.7rem;transition:all .15s;flex-shrink:0;margin-top:2px;}
.panel-close:hover{border-color:var(--red);color:var(--red);}
.panel-title{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;letter-spacing:-.02em;line-height:1.3;}
.panel-meta{font-size:.62rem;color:var(--muted);margin-top:4px;}
.panel-body{flex:1;overflow-y:auto;padding:18px 22px;}
.panel-body::-webkit-scrollbar{width:4px;}
.panel-body::-webkit-scrollbar-thumb{background:var(--border2);border-radius:99px;}
.psec{margin-bottom:20px;}
.psec-title{font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:9px;padding-bottom:5px;border-bottom:1px solid var(--border);}
.kv{display:flex;gap:8px;margin-bottom:5px;align-items:flex-start;}
.kk{font-size:.6rem;color:var(--muted);min-width:86px;flex-shrink:0;padding-top:1px;}
.kv_{font-size:.67rem;color:var(--text2);}
.assignee-list{display:flex;flex-wrap:wrap;gap:6px;}
.assignee-chip{display:flex;align-items:center;gap:6px;background:var(--sf2);border:1px solid var(--border);border-radius:20px;padding:4px 10px 4px 5px;font-size:.63rem;color:var(--text2);}
.a-av{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.48rem;font-family:'Syne',sans-serif;font-weight:700;flex-shrink:0;}
.a-sh{font-size:.56rem;color:var(--muted);margin-left:2px;}
.timeline{position:relative;padding-left:16px;}
.timeline::before{content:'';position:absolute;left:4px;top:6px;bottom:6px;width:1px;background:var(--border2);}
.tl-item{position:relative;margin-bottom:9px;}
.tl-dot{position:absolute;left:-15px;top:4px;width:7px;height:7px;border-radius:50%;border:2px solid var(--bg);}
.tl-st{font-size:.65rem;color:var(--text);font-weight:500;}
.tl-dt{font-size:.56rem;color:var(--muted);margin-top:1px;}
.item-row{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;background:var(--sf2);border-radius:6px;margin-bottom:4px;font-size:.63rem;color:var(--text2);}
.item-pct{font-size:.58rem;color:var(--muted);background:var(--sf3);padding:1px 6px;border-radius:4px;}
.actq-row{display:flex;align-items:center;gap:9px;padding:6px 10px;background:var(--sf2);border-radius:6px;margin-bottom:4px;}
.actq-cat{font-size:.58rem;font-weight:700;padding:2px 6px;border-radius:4px;font-family:'Syne',sans-serif;flex-shrink:0;}
.actq-A1,.actq-A2,.actq-A3{background:rgba(34,197,94,.15);color:#4ade80;}
.actq-A0{background:rgba(107,114,128,.15);color:#9ca3af;}
.actq-Q1,.actq-Q2{background:rgba(168,85,247,.15);color:#c084fc;}
.actq-T1,.actq-T2{background:rgba(245,158,11,.15);color:#fbbf24;}
.status-update{background:var(--sf2);border:1px solid var(--border2);border-radius:var(--radius);padding:14px;margin-top:14px;}
.su-title{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}
.st-btns{display:flex;flex-wrap:wrap;gap:6px;}
.st-btn{padding:5px 11px;border-radius:6px;border:1px solid var(--border2);background:var(--sf3);color:var(--text2);font-family:'DM Mono',monospace;font-size:.6rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:4px;}
.st-btn:hover{border-color:var(--accent);color:var(--text);}
.st-btn.current{border-color:var(--accent2);color:var(--accent2);background:rgba(91,106,240,.12);}

/* TOOLTIP */
.tt{position:fixed;background:#1c2033;border:1px solid #2d3454;border-radius:8px;padding:9px 12px;font-size:.63rem;color:var(--text);pointer-events:none;z-index:9999;display:none;max-width:240px;box-shadow:0 12px 40px rgba(0,0,0,.6);line-height:1.8;}
.tt strong{font-family:'Syne',sans-serif;display:block;margin-bottom:2px;font-size:.7rem;}

/* EMPTY */
.empty{text-align:center;padding:48px 20px;color:var(--muted);font-size:.73rem;}
.empty-icon{font-size:1.8rem;margin-bottom:10px;}

@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:99px;}