:root{
  --bg:#0e0e10;--panel:#1a1a1e;--field:#232329;--line:#2a2a30;--text:#ececed;--dim:#8a8a93;--hot:#d97757;
  --blocked:#e06a6a;--run:#5b9bd5;--return:#c586c0;--other:#57b894;--stale:#a07850;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-tap-highlight-color:transparent}
a{color:var(--hot);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{display:flex;min-height:100vh}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.side{width:320px;flex:none;border-left:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;transition:max-height .2s}
header{padding:12px 16px;border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:10}
header h1{font-size:15px;margin:0;font-weight:700}
header h1 span{color:var(--hot)}
header .sub{font-size:12px;color:var(--dim);margin-top:2px}
.top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.top .sp{flex:1}
.who{font-size:12px;color:var(--dim);text-align:right;line-height:1.25}
.who b{color:var(--text)}
nav{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px;align-items:center}
nav button,nav a.nav-btn{background:var(--panel);border:1px solid var(--line);color:var(--text);font-size:11px;font-weight:600;padding:6px 9px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-block}
nav button.on,nav a.nav-btn.on{border-color:var(--hot);color:var(--hot)}
.banner{font-size:11px;background:#2a2418;color:#e0c090;padding:6px 12px;border-bottom:1px solid var(--line)}
.content{padding:14px 16px 24px;flex:1;overflow:auto}
.status-panel{padding:24px 16px;text-align:center;color:var(--dim);font-size:14px}
.status-panel.error{color:var(--blocked)}
.status-panel button{margin-top:12px;background:var(--field);border:1px solid var(--line);color:var(--text);padding:8px 14px;border-radius:8px;cursor:pointer}
.panel-title{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);margin:0;font-weight:700}
.side-toggle{display:none;font-size:11px;padding:5px 10px;background:var(--field);border:1px solid var(--line);border-radius:8px;color:var(--text);cursor:pointer;margin-top:6px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer;transition:border-color .15s}
.card:hover{border-color:#3a3a44}
.card:focus-visible,.chip:focus-visible,.btn:focus-visible,.nav-view:focus-visible,.drag-handle:focus-visible{outline:2px solid var(--hot);outline-offset:2px}
.card.expanded{border-color:var(--hot)}
.card.dim{opacity:.78}
.card.dragging{opacity:.45}
.card-head{display:flex;gap:8px;align-items:flex-start}
.card-body{flex:1;min-width:0}
.drag-handle{flex:0 0 auto;cursor:grab;padding:2px 5px;margin:-2px 0 0 -2px;border:1px solid var(--line);border-radius:6px;background:var(--field);color:var(--dim);font-size:14px;line-height:1.1;letter-spacing:-1px;user-select:none;-webkit-user-select:none}
.drag-handle:active{cursor:grabbing}
.drag-handle:hover{border-color:var(--hot);color:var(--text)}
body.drag-active{user-select:none;cursor:grabbing}
body.drag-active .card.dragging{opacity:.45;outline:1px dashed var(--hot)}
.card .title{font-weight:600;font-size:14px;line-height:1.25}
.card .proj{font-size:11px;color:var(--dim);margin-top:2px}
.card .row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
.chip{font-size:11px;padding:3px 8px;border-radius:12px;border:1px solid var(--line);background:var(--field);color:var(--text)}
.chip.move-lane{cursor:pointer}
.chip.move-lane:hover{border-color:var(--hot)}
.chip.state-running{border-color:var(--run)}
.chip.state-returned{border-color:var(--return)}
.chip.state-other{border-color:var(--other)}
.chip.state-blocked{border-color:var(--blocked)}
.chip.state-stale{border-color:var(--stale);color:var(--stale)}
.chip.dur-unknown{color:var(--dim);border-style:dotted}
.detail{display:none;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--dim);line-height:1.5}
.detail .evidence{margin-top:6px}
.detail .evidence span{display:inline-block;font-size:10px;border:1px dashed var(--line);border-radius:8px;padding:1px 6px;margin:2px 4px 0 0}
.card.expanded .detail{display:block}
.kanban{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:10px;align-items:start}
@media(max-width:1200px){.kanban{grid-template-columns:repeat(2,minmax(140px,1fr))}}
.lane{background:var(--field);border:1px solid var(--line);border-radius:10px;padding:8px;min-height:120px}
.lane.drop-target{border-color:var(--hot);background:#252530}
.lane h3{font-size:11px;margin:0 0 8px;color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.section{margin-bottom:20px}
.section > h2{font-size:12px;margin:0 0 10px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em}
.bucket{border:1px dashed #5a4a3a;border-radius:10px;padding:10px;background:#1a1814;margin-top:16px}
.client-checkins .card{margin-bottom:8px;padding:8px 10px}
.client-checkins .card .title{font-size:13px}
.client-checkins .card .proj{font-size:11px}
.agent{padding:10px 12px;border-bottom:1px solid var(--line);font-size:13px}
.agent:last-child{border-bottom:0}
.agent .plat{font-weight:600;font-size:12px}
.agent .meta{font-size:11px;color:var(--dim);margin-top:3px}
.spinner{display:inline-block;width:8px;height:8px;border:2px solid var(--run);border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite;margin-right:4px;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}
.hint{font-size:12px;color:var(--dim);margin-bottom:12px;line-height:1.4}
.empty{font-size:12px;color:var(--dim);padding:12px;text-align:center;border:1px dashed var(--line);border-radius:8px}
.side header{padding:10px 12px;display:flex;flex-direction:column}
.side .agents-scroll{flex:1;overflow:auto}
.side.collapsed .agents-scroll{display:none}
.toast{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);background:#57b894;color:#0b0b0d;font-size:12px;font-weight:600;padding:8px 14px;border-radius:20px;opacity:0;transition:.25s;z-index:100;pointer-events:none}
.toast.show{opacity:1}
.toast.err{background:var(--blocked);color:#fff}
:root{--slot1:#d97757;--slot2:#e0a457;--slot3:#57b894}
.top-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
@media(max-width:720px){.top-row{grid-template-columns:1fr}}
.top-slot{border:1px solid var(--line);border-radius:10px;padding:8px;background:var(--field);display:flex;flex-direction:column}
.top-slot.slot-1{border-top:3px solid var(--slot1)}
.top-slot.slot-2{border-top:3px solid var(--slot2)}
.top-slot.slot-3{border-top:3px solid var(--slot3)}
.slot-label{font-size:18px;font-weight:700;line-height:1;margin-bottom:8px;color:var(--text)}
.slot-label small{display:block;font-size:10px;font-weight:600;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.drawer-toggle,.collapsible-toggle{width:100%;text-align:left;background:var(--field);border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:12px;font-weight:600;color:var(--text);cursor:pointer;margin-top:12px}
.drawer-toggle::before,.collapsible-toggle::before{content:'▶ ';color:var(--dim)}
.drawer-toggle.open::before,.collapsible-toggle.open::before{content:'▼ '}
.collapsible-toggle{font-size:11px;color:var(--dim);padding:8px 10px;margin-top:8px;border-radius:8px}
.drawer-body{display:none;margin-top:8px;padding:10px;border:1px dashed var(--line);border-radius:9px;background:#141418}
.drawer-body.open,.collapsible-body.open{display:block}
.collapsible-body{display:none;margin-top:8px}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.toolbar select,.toolbar button,.toolbar input{font-size:12px;padding:6px 10px;background:var(--field);border:1px solid var(--line);border-radius:8px;color:var(--text)}
.toolbar button.on{border-color:var(--hot);color:var(--hot)}

.ask-form{display:grid;gap:8px;max-width:480px;margin-bottom:16px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.ask-form label{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.ask-form input,.ask-form select,.ask-form textarea{font-size:13px;padding:8px 10px;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text)}
.ask-form .btn{margin-top:4px}
.rec-card{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px;background:var(--field)}
.rec-card.dim{opacity:.85}
.rec-card .title{font-weight:600;font-size:14px}
.rec-card .proj{font-size:12px;color:var(--dim);margin-bottom:6px}
.evidence-list{margin:6px 0 0 16px;padding:0;font-size:12px;color:var(--text);line-height:1.45}
.evidence-list li{margin-bottom:4px}
.rec-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;align-items:center}
.rec-actions-global{margin-top:14px;padding-top:10px;border-top:1px dashed var(--line)}
.rec-actions-confirm{margin-top:16px}
.rec-confirm-btn{background:var(--hot);border:1px solid var(--hot);color:#fff;font-weight:600;padding:10px 16px;border-radius:9px;cursor:pointer;font-size:14px}
.rec-confirm-btn[disabled]{opacity:.45;cursor:not-allowed}
.rec-slot-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.rec-slot{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--field)}
.rec-slot-head{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.rec-slot-num{font-weight:700;font-size:18px;color:var(--hot);min-width:1.5em}
.rec-slot-title{font-weight:600;font-size:14px}
.rec-slot-meta,.rec-slot-empty{font-size:12px;color:var(--dim);margin-top:2px}
.rec-slot-evidence{margin-top:6px}
.rec-warnings{font-size:11px;color:#e8a87c;margin-top:4px;line-height:1.4}
.review-banner{background:#1a2433;border:1px solid #3a5070;padding:10px 14px;margin-bottom:12px;border-radius:8px;font-size:12px;line-height:1.5}
.review-banner ul{margin:8px 0 0;padding-left:18px}
.review-banner li{margin-bottom:6px}
.review-banner .chip{margin-left:6px;font-size:10px;padding:3px 8px}
.duration-edit{margin-top:10px;padding:10px;background:var(--field);border:1px solid var(--line);border-radius:8px;font-size:12px}
.duration-edit .hint{font-size:11px;color:var(--dim);margin:4px 0 8px}
.duration-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dur-input{width:72px;padding:5px 8px;border-radius:6px;border:1px solid var(--line);background:var(--bg);color:var(--text)}
.chip.dur-derived,.dur-derived{border-color:#6a8caf;color:#9ec4e8}
.rec-exhausted{font-size:12px;color:var(--dim);font-style:italic;margin:6px 0 2px}
.personal-slot-warn{margin-top:6px}
.rec-slot-controls{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.rec-pick-select{font-size:12px;padding:6px 8px;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);min-width:min(100%,280px);flex:1 1 200px}
.rec-status{font-size:12px;padding:8px 10px;border-radius:8px;margin-bottom:12px;background:var(--field);border:1px solid var(--line)}
.rec-status.ok{border-color:var(--hot);color:var(--text)}
.rec-status.error{border-color:#c44;color:#f5a}
.chip[disabled],.chip[aria-disabled="true"],.btn[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}
.rec-pick-select:disabled{opacity:.45;cursor:not-allowed}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.detail .evidence{margin-top:6px}
.detail .evidence span{display:inline-block;font-size:10px;border:1px dashed var(--line);border-radius:8px;padding:1px 6px;margin:2px 4px 0 0}
#login{min-height:100vh;display:grid;place-items:center;padding:20px}
#login .box{width:min(380px,92vw);text-align:center}
#login h1{font-size:28px;margin:0 0 4px}
#login h1 span{color:var(--hot)}
#login p{color:var(--dim);margin:0 0 18px;font-size:13px}
#login input{width:100%;margin-bottom:10px;text-align:center;padding:10px;background:var(--field);border:1px solid var(--line);border-radius:9px;color:var(--text)}
#login .btn{background:var(--hot);border:1px solid var(--hot);color:#fff;font-weight:600;padding:12px;width:100%;border-radius:9px;cursor:pointer}
@media(max-width:960px){
  .wrap{flex-direction:column}
  .side{width:100%;border-left:0;border-top:1px solid var(--line)}
  .side.collapsed{max-height:52px;overflow:hidden}
  .side:not(.collapsed){max-height:280px}
  .side-toggle{display:inline-block}
}