:root{
  --bg:#f6f7f9;--surface:#fff;--surface2:#f0f2f5;--text:#1d2330;--muted:#6a7387;--border:#e1e5ec;
  --accent:#3b6fe0;--danger:#c9372c;
  --todo:#7a8499;--in_progress:#d98a0b;--done:#2f9e5b;--canceled:#a0a6b3;
  --shadow:0 1px 2px rgba(20,30,50,.06),0 4px 14px rgba(20,30,50,.06);
}
@media (prefers-color-scheme:dark){:root{
  --bg:#13161c;--surface:#1b1f27;--surface2:#242933;--text:#e6e9ef;--muted:#8d96a8;--border:#2c323e;
  --accent:#6b93f0;--danger:#ef6b60;
  --todo:#8d96a8;--in_progress:#e8a63a;--done:#4cc27c;--canceled:#6b7384;
  --shadow:0 1px 2px rgba(0,0,0,.4);
}}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--text);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:flex;flex-direction:column}
button{font:inherit;color:inherit;cursor:pointer}
h1{font-size:16px;margin:0}
.topbar{display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--surface);border-bottom:1px solid var(--border);flex:none}
.spacer{flex:1}
.btn{background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:5px 12px}
.btn:hover{border-color:var(--accent)}
.btn.danger{color:var(--danger)}
.icon-btn{background:none;border:0;padding:4px 8px;border-radius:6px;color:var(--muted)}
.icon-btn:hover{background:var(--surface2)}
.menu-btn{display:none}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:6px;overflow:hidden}
.seg button{background:var(--surface);border:0;padding:5px 12px}
.seg button.active{background:var(--accent);color:#fff}
.live{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.live i{width:8px;height:8px;border-radius:50%;background:var(--done)}
.live.off i{background:var(--danger)}
.layout{display:flex;flex:1;min-height:0;position:relative}
.sidebar{width:230px;flex:none;background:var(--surface);border-right:1px solid var(--border);overflow:auto;padding:8px}
.proj{display:flex;align-items:center;gap:6px;border-radius:6px;padding:0 4px 0 10px;cursor:pointer}
.proj:hover{background:var(--surface2)}
.proj.active{background:var(--surface2);font-weight:600;box-shadow:inset 3px 0 var(--accent)}
.proj .pname{flex:1;min-width:0;padding:7px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:none;border:0;text-align:left;font-weight:inherit}
.badge{font-size:11px;color:var(--muted);background:var(--bg);border-radius:10px;padding:1px 7px;min-width:20px;text-align:center}
.proj .del{display:none;font-size:12px}
.proj:hover .del,.proj.active .del,.proj .del:focus{display:inline-block}
.main{flex:1;min-width:0;overflow:auto;padding:14px}
.board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;align-items:start;min-width:900px}
.col{background:var(--surface2);border-radius:8px;padding:8px;min-height:120px}
.col.over{outline:2px dashed var(--accent)}
.col h3{margin:2px 4px 8px;font-size:13px;display:flex;align-items:center;gap:6px}
.s-todo{--c:var(--todo)}.s-in_progress{--c:var(--in_progress)}.s-done{--c:var(--done)}.s-canceled{--c:var(--canceled)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:var(--c)}
.card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--c);border-radius:6px;padding:8px 10px;margin-bottom:8px;box-shadow:var(--shadow);cursor:pointer}
.card.dragging{opacity:.4}
.card.sel{border-color:var(--accent)}
.t-title{font-weight:600;overflow-wrap:anywhere}
.meta{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.preview{font-size:12px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.group{margin-bottom:18px}
.group h3{font-size:13px;margin:0 0 6px;display:flex;align-items:center;gap:6px}
.row{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--c);border-radius:6px;margin-bottom:6px}
.row-head{padding:8px 10px;cursor:pointer}
.row .detail{border-top:1px solid var(--border);padding:10px}
.row.open{border-color:var(--accent)}
.timeline{list-style:none;margin:8px 0;padding:0 0 0 14px;border-left:2px solid var(--border)}
.timeline li{position:relative;margin-bottom:10px;padding-left:8px}
.timeline li::before{content:"";position:absolute;left:-21px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--c)}
.tl-head{font-size:12px;color:var(--muted)}
.tl-head b{color:var(--c)}
.tl-note{white-space:pre-wrap;overflow-wrap:anywhere}
.actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0}
.actions .lbl{font-size:12px;color:var(--muted)}
.st-btn{background:var(--surface2);border:1px solid var(--border);border-radius:14px;padding:3px 10px;font-size:12px}
.st-btn.cur{background:var(--c);border-color:var(--c);color:#fff}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--surface);border-left:1px solid var(--border);box-shadow:-6px 0 24px rgba(0,0,0,.15);overflow:auto;padding:14px;z-index:20}
.panel[hidden]{display:none}
.panel h2{margin:0 0 4px;font-size:16px;overflow-wrap:anywhere}
.panel-top{display:flex;justify-content:flex-end}
.empty{max-width:480px;margin:60px auto;text-align:center;color:var(--muted)}
.empty button{margin-top:10px}
.dlg{border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);padding:0;width:min(680px,94vw);max-height:90vh}
.dlg::backdrop{background:rgba(0,0,0,.45)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border)}
.dlg-head h2{margin:0;font-size:16px}
.dlg-body{padding:12px 16px;overflow:auto;max-height:calc(90vh - 56px)}
.blk{margin-bottom:14px}
.blk-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-weight:600}
pre.code{margin:0;background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:8px 10px;white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.5 ui-monospace,Consolas,monospace;max-height:220px;overflow:auto}
.err{color:var(--danger);padding:8px 0}
.toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--danger);color:#fff;padding:8px 14px;border-radius:6px;z-index:50}
.backdrop{display:none}
@media (max-width:900px){
  .menu-btn{display:inline-block}
  .sidebar{width:min(300px,86vw);position:absolute;z-index:15;top:0;bottom:0;left:0;transform:translateX(-100%);transition:transform .15s}
  body.menu-open .sidebar{transform:none}
  body.menu-open .backdrop{display:block;position:absolute;inset:0;background:rgba(0,0,0,.35);z-index:14}
  .board{grid-template-columns:1fr;min-width:0}
  .topbar{flex-wrap:wrap}
  #liveText{display:none}
}

body.anon>header,body.anon .layout,body.anon .panel{display:none!important}
body:not(.anon) #login{display:none}
.login{flex:1;display:flex;align-items:center;justify-content:center;padding:16px}
.login-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:20px;width:min(340px,100%);display:flex;flex-direction:column;gap:12px}
.login-card label,.tok-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
input[type=text],input[type=password]{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:7px 9px;min-width:0}
input:focus{outline:2px solid var(--accent);outline-offset:-1px}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.user{font-size:12px;color:var(--muted)}
.tok-list{list-style:none;margin:6px 0;padding:0}
.tok-list li{display:flex;gap:8px;align-items:center;justify-content:space-between;border:1px solid var(--border);border-radius:6px;padding:6px 10px;margin-bottom:6px}
.tok-list .tm{font-size:12px;color:var(--muted)}
.tok-form{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.tok-form label{flex:1;min-width:160px}
.note{font-size:12px;color:var(--muted);margin:4px 0}
.warn{border:1px solid var(--in_progress);border-radius:6px;padding:8px 10px;margin:8px 0}
.sec{border-bottom:1px solid var(--border);padding-bottom:12px;margin-bottom:14px}
@media (max-width:900px){.user{display:none}}

.agents-btn.on{border-color:var(--done)}
.tok-sec{border:1px solid var(--border);border-radius:6px;padding:8px 10px;margin-top:8px}
.tok-sec summary{cursor:pointer;font-weight:600;margin-bottom:6px}
.agent{display:flex;gap:10px;align-items:center;border:1px solid var(--border);border-radius:6px;padding:8px 10px;margin-bottom:8px}
.ainfo{flex:1;min-width:0;overflow-wrap:anywhere}
.agent .tm{font-size:12px;color:var(--muted)}
.adot{width:10px;height:10px;border-radius:50%;background:var(--canceled);flex:none}
.adot.on{background:var(--done)}
.kind{font-size:11px;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:0 7px;margin-left:8px}
.by{font-style:italic}

.guide{max-width:900px;margin:0 auto;font-size:15px;line-height:1.65}
.guide .g-title{font-size:26px;margin:4px 0 12px}
.guide h2{font-size:19px;margin:0 0 8px}
.guide h3{font-size:15px;margin:12px 0 2px}
.g-sec{margin:34px 0;scroll-margin-top:8px}
.g-toc{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 16px}
.g-toc ol{margin:6px 0 0;padding-left:20px}
.g-toc a{color:var(--accent);text-decoration:none}
.g-toc a:hover{text-decoration:underline}
.guide code{background:var(--surface2);border-radius:4px;padding:1px 5px;font:13px ui-monospace,Consolas,monospace}
.guide li{margin-bottom:8px}
.guide pre.code{max-height:300px}
.guide .blk{margin:8px 0}
.guide .g-qa p{margin:0;color:var(--muted)}

.danger-sec{border:1px solid var(--danger);border-radius:6px;margin-top:16px;padding:0 10px 8px}
.danger-sec summary{cursor:pointer;font-weight:600;color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,transparent);margin:0 -10px 8px;padding:8px 10px;border-radius:5px}
.danger-sec h4{color:var(--danger);margin:14px 0 4px;font-size:14px}
.danger-sec p{margin:4px 0}
.danger-warn{border:1px solid var(--danger);background:color-mix(in srgb,var(--danger) 10%,transparent);color:var(--danger);border-radius:6px;padding:8px 10px;margin:6px 0;font-size:13px}
.danger-sec code{background:var(--surface2);border-radius:4px;padding:1px 5px;font:12px ui-monospace,Consolas,monospace}

.stale{font-size:11px;color:var(--in_progress);border:1px solid var(--in_progress);border-radius:10px;padding:0 6px}
.merge{border:1px solid var(--border);border-radius:6px;padding:8px;margin:8px 0;background:var(--surface2)}
.merge-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
input.merge-q{width:100%;margin-bottom:6px;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:7px 9px}
.merge-list{max-height:240px;overflow:auto;display:flex;flex-direction:column;gap:4px}
.merge-item{display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--c);border-radius:6px;padding:5px 8px}
.merge-item:hover:not(:disabled){border-color:var(--accent)}
.merge-item:disabled{opacity:.6;cursor:default}
.mi-title{overflow-wrap:anywhere}
.mi-meta{font-size:11px;color:var(--muted)}

.toolbar{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin-bottom:12px;font-size:12px;color:var(--muted)}
.toolbar label,.toolbar .range{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.toolbar select,.toolbar input[type=date]{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:4px 6px;max-width:100%}
.nofilter{text-align:center;color:var(--muted);margin:40px 0}
.linkbtn{background:none;border:0;padding:0;color:var(--accent);text-decoration:underline}
.sim{background:none;border:0;padding:2px 4px;color:var(--in_progress);font-size:10px;line-height:1}
.dlg-sm{width:min(440px,94vw)}
.proj .del{padding:4px 5px}

.badge.mail{color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);padding:1px 6px}
.tag{font-size:11px;border-radius:10px;padding:0 6px;border:1px solid var(--border);font-style:normal}
.handoff-tag{color:var(--in_progress);border-color:var(--in_progress)}
.mail-tag{color:var(--accent);border-color:var(--accent)}
.kind-tag{color:var(--muted)}
.k-handoff .kind-tag{color:var(--in_progress);border-color:var(--in_progress)}
.k-user_message .kind-tag{color:var(--accent);border-color:var(--accent)}
.handoff{border:1px solid var(--in_progress);border-left-width:4px;background:color-mix(in srgb,var(--in_progress) 10%,transparent);border-radius:6px;padding:8px 10px;margin:8px 0}
.handoff-head{font-size:12px;font-weight:600;color:var(--in_progress);margin-bottom:3px}
.handoff-text{white-space:pre-wrap;overflow-wrap:anywhere}
.msgbox{border-top:1px solid var(--border);margin-top:10px;padding-top:6px}
.msgbox h4,.dlg-body h4{margin:10px 0 4px;font-size:13px}
textarea.msg-ta{display:block;width:100%;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:7px 9px;resize:vertical;min-height:60px}
textarea.msg-ta:focus{outline:2px solid var(--accent);outline-offset:-1px}
.compose-row{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:4px}
.compose-row .note{flex:1;margin:0}
.compose-row .btn:disabled{opacity:.5;cursor:default}
.msg-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.msg{border:1px solid var(--border);border-radius:6px;padding:6px 9px;background:var(--surface2)}
.msg.pending{border-left:3px solid var(--accent)}
.msg-task{font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.msg-text{white-space:pre-wrap;overflow-wrap:anywhere}
.msg-foot{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:2px}
.proj-actions{display:inline-flex;gap:6px;margin-left:auto}
.proj-actions .btn{padding:3px 10px;font-size:12px}
.counter-row{text-align:right;font-size:12px;color:var(--muted)}
.counter.over{color:var(--danger)}
.repo-list{list-style:none;margin:6px 0;padding:0}
.repo-list li{display:flex;gap:8px;align-items:center;justify-content:space-between;border:1px solid var(--border);border-radius:6px;padding:3px 6px 3px 10px;margin-bottom:4px}
.repo-list code{overflow-wrap:anywhere;font:12px ui-monospace,Consolas,monospace}
.repo-list li.note{border:0}
.tok-form input[type=text]{flex:1;min-width:160px}
.ok{color:var(--done);padding:6px 0}
.proj .badge.mail{flex:none}

/* topics */
.toolbar label.chk{cursor:pointer}
.pill{display:inline-flex;align-items:center;gap:4px;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);border:1px solid var(--accent);border-radius:12px;padding:1px 4px 1px 10px}
.pill-x{background:none;border:0;padding:0 5px;color:inherit;line-height:1}
.tchip{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);border-radius:10px;padding:0 7px;font-size:11px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tchip:hover{border-color:var(--accent)}
.tgroup{margin-bottom:12px}
.tg-head{display:flex;align-items:center;gap:4px;margin-bottom:6px}
.tg-toggle{flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:6px;background:none;border:0;padding:4px 2px;font-weight:600;font-size:13px;text-align:left}
.tg-toggle .caret{color:var(--muted);width:12px}
.tg-name{overflow-wrap:anywhere}
.tg-proj{color:var(--muted);font-weight:400}
.tg-handoffs{border-left:3px solid var(--in_progress);margin:0 0 8px;padding:2px 10px;font-size:12px;color:var(--muted)}
.tg-ho{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-ho b{color:var(--text);font-weight:600}
.lane{margin-bottom:14px}
.lane-title{display:flex;align-items:center;gap:6px;font-weight:600;font-size:13px;margin:0 0 6px}
.lane-heads{margin-bottom:6px}
.lane-colhead{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:0 4px}
.lane-col h3{display:none}
.lane-col{min-height:40px}
.topic-field{margin:8px 0}
.topic-form{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.topic-form label{flex:1;min-width:160px;display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.ti-name{flex:1;min-width:0;overflow-wrap:anywhere;font-weight:600}
.repo-list li .note{margin:0}
.badge.sugg{color:var(--in_progress);background:color-mix(in srgb,var(--in_progress) 14%,transparent);border:0;padding:1px 6px;flex:none}
.sugg{border:1px solid var(--border);border-left:3px solid var(--in_progress);border-radius:6px;padding:6px 9px;margin:6px 0;background:var(--surface2)}
.sugg.done-accepted{border-left-color:var(--done)}
.sugg.done-rejected{border-left-color:var(--canceled)}
.sugg-text{white-space:pre-wrap;overflow-wrap:anywhere}
.sugg .actions{margin:6px 0 0}
.sugg .err{padding:2px 0}
.sugg-hist summary{cursor:pointer;font-size:12px;color:var(--muted);margin-top:6px}
@media (max-width:900px){
  .lane-heads{display:none}
  .lane-col.none{display:none}
  .lane-col h3{display:flex}
  .lane-col{min-height:0}
}

/* requests (İstekler) */
.cap{display:flex;align-items:center;gap:8px;flex:1 1 280px;max-width:460px;min-width:0}
.cap input{flex:1;min-width:0}
.cap-hint{font-size:11px;color:var(--muted);white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.badge.req{color:var(--done);background:color-mix(in srgb,var(--done) 14%,transparent);border:0;padding:1px 6px;flex:none}
button.badge.req{cursor:pointer}
.kb-wrap{display:flex;gap:12px;align-items:flex-start}
.kb-wrap>.board,.kb-wrap>.lanes{flex:1;min-width:900px}
.reqs{border:1px dashed var(--border);border-radius:8px;padding:8px;color:var(--text)}
.reqs-side{flex:none;width:250px;background:transparent}
.reqs-stack{margin-bottom:14px}
.reqs-head{display:flex;align-items:center;margin-bottom:4px}
.reqs-toggle{display:flex;align-items:center;gap:6px;background:none;border:0;padding:2px 4px;font-weight:600;font-size:13px;color:var(--muted)}
.reqs-toggle .caret{width:12px}
.reqs-help{font-size:12px;color:var(--muted);padding:4px}
.req{background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:6px 9px;margin-top:6px;opacity:.95}
.req-text{white-space:pre-wrap;overflow-wrap:anywhere;cursor:pointer;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.req-text.open{display:block;overflow:visible}
.req .meta{margin-top:3px}
.req-proj{font-weight:600}
.req-proj.none{font-weight:400;font-style:italic}
.req-actions{display:flex;align-items:center;gap:4px;margin-top:4px;flex-wrap:wrap}
.req-actions .req-move{font:inherit;font-size:12px;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:2px 4px;max-width:150px;margin-right:auto}
.reqs-done{margin-top:10px}
.reqs-done summary{cursor:pointer;font-size:12px;color:var(--muted)}
.req.resolved{opacity:.85}
.rchips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.rchip{display:inline-flex;align-items:center;gap:5px;font-size:11px;border:1px solid var(--border);border-radius:10px;padding:1px 8px;background:var(--surface);max-width:100%;text-align:left;overflow-wrap:anywhere}
button.rchip:hover{border-color:var(--accent)}
.rchip.plain{color:var(--muted)}
.rchip.rej{color:var(--danger);border-color:var(--danger)}
.tag.req-tag{color:var(--done);border-color:var(--done)}
.req-origin{border:1px dashed var(--border);border-radius:6px;padding:6px 9px;margin:8px 0;background:var(--surface2)}
.req-origin-head{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:2px}
.req-origin-text{white-space:pre-wrap;overflow-wrap:anywhere}
.req-origin-text+.req-origin-text{border-top:1px solid var(--border);margin-top:4px;padding-top:4px}
@media (max-width:900px){
  .cap{order:10;flex:1 1 100%;max-width:none}
  .kb-wrap{flex-direction:column;align-items:stretch}
  .kb-wrap>.board,.kb-wrap>.lanes{min-width:0;width:100%}
  .reqs-side{width:100%}
}

/* ===== v2: task numbers, sessions, prompts, colors, additions, shortcuts, mobile ===== */
html,body{max-width:100%;overflow-x:hidden}
.topbar{position:relative;z-index:12}
.top-actions{display:contents}
.cap-btn,.more-btn,.menu-only{display:none}
.col{min-width:0}

/* dialogs: fixed head, scrolling body */
.dlg[open]{display:flex;flex-direction:column}
.dlg-head{flex:none;position:sticky;top:0;z-index:2;background:var(--surface);border-radius:10px 10px 0 0}
.dlg-body{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;overflow-wrap:anywhere}
.stack-btns{display:flex;flex-direction:column;gap:8px;margin:12px 0}

/* toast */
.toast{max-width:calc(100vw - 32px);text-align:center;bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.toast.ok{background:var(--done)}

/* project color */
.pdot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;margin-right:6px;vertical-align:baseline}
.mproj{display:inline-flex;align-items:center}
.mproj .pdot,.meta .pdot{margin-right:5px}
.swatches{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:6px 0}
.sw{width:30px;height:30px;border-radius:50%;border:2px solid transparent;padding:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.sw[aria-pressed=true]{border-color:var(--text);box-shadow:0 0 0 2px var(--surface) inset}
.sw-custom{width:40px;height:32px;padding:0;border:1px solid var(--border);border-radius:6px;background:none;cursor:pointer}
.sw-custom.sel{outline:2px solid var(--text);outline-offset:1px}
.sw-none[aria-pressed=true]{border-color:var(--text)}

/* task number chip, card header, list row */
.card-top{display:flex;gap:6px;align-items:flex-start}
.card-top .t-title{flex:1;min-width:0}
.idchip{position:relative;flex:none;font:11px/1.5 ui-monospace,Consolas,monospace;color:var(--muted);background:none;border:1px solid transparent;border-radius:6px;padding:0 5px;cursor:copy}
.idchip:hover,.idchip:focus-visible{color:var(--accent);border-color:var(--border)}
.idchip::after{content:"";position:absolute;inset:-10px -6px}
.dt-title{display:flex;gap:8px;align-items:baseline}
.dt-title .idchip{font-size:13px;flex:none}
.dt-title span{min-width:0}
.row-head{display:flex;gap:8px;align-items:flex-start}
.row-head>.idchip{min-width:46px;text-align:right;margin-top:1px}
.rh-main{flex:1;min-width:0}

/* session badges */
.sbadges{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.sbadge{position:relative;display:inline-flex;gap:4px;align-items:center;max-width:100%;font-size:11px;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:0 7px}
.sbadge b{font-weight:600;color:var(--text);flex:none}
.sbadge .sb-l{min-width:0;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbadge:hover{border-color:var(--accent);color:var(--accent)}
.sbadge::after{content:"";position:absolute;inset:-9px -3px}
.sess-lbl{color:var(--muted);opacity:.85;overflow-wrap:anywhere}

/* session box in the detail */
.sess-box{border:1px solid var(--border);border-radius:6px;padding:4px 9px;margin:8px 0;background:var(--surface2)}
.sess-row{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:baseline;padding:5px 0}
.sess-row+.sess-row{border-top:1px solid var(--border)}
.sess-k{font-size:12px;color:var(--muted);flex:none;min-width:116px}
.sess-v{min-width:0;text-align:left;overflow-wrap:anywhere}
.sess-m{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.sess-wide{flex:1 1 100%;margin:0}
.resume-box{flex:1 1 100%;display:flex;gap:6px;align-items:flex-start;margin-top:3px}
.resume-box code{flex:1;min-width:0;font:12px/1.5 ui-monospace,Consolas,monospace;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:5px 8px;white-space:pre-wrap;overflow-wrap:anywhere}
.resume-box .btn{flex:none}
.dtools{margin-top:6px}

/* toolbar: search + session */
.search{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1 1 220px;max-width:380px}
.search-in{flex:1;min-width:120px}
.sess-sel{max-width:260px}
.pill-t{overflow-wrap:anywhere;min-width:0}

/* prompts */
.tpl-menu{display:flex;flex-direction:column;gap:6px}
.tpl-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;width:100%;min-height:44px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:8px 10px}
.tpl-item:hover{border-color:var(--accent)}
.tpl-item small{max-width:100%;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-fallback{margin-top:8px}
.tpl-edit{border:1px solid var(--border);border-radius:8px;padding:10px;margin:10px 0;background:var(--surface2)}
.tpl-edit .fld{display:flex;flex-direction:column;gap:3px;margin-bottom:6px}
.tpl-edit input[type=text]{width:100%}
.tpl-edit textarea.msg-ta{min-height:110px;font:13px/1.5 ui-monospace,Consolas,monospace}
.tpl-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tpl-row .spacer{flex:1}
.tpl-row .icon-btn:disabled{opacity:.3;cursor:default}
.ph-list{margin:6px 0;padding-left:18px}
.ph-list li{margin-bottom:3px;overflow-wrap:anywhere}
.ph-list code,.hook-sec code{background:var(--surface2);border-radius:4px;padding:1px 5px;font:12px ui-monospace,Consolas,monospace}
.hook-sec h4{margin-top:0}

/* request additions */
.add-badge{position:relative;border:0;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);border-radius:10px;padding:0 7px;font-size:11px;font-weight:600}
.add-badge::after{content:"";position:absolute;inset:-9px -4px}
.req-extras{margin-top:6px}
.adds{display:flex;flex-direction:column;gap:5px}
.add{border-left:2px solid var(--border);padding:1px 0 1px 8px}
.add.agent{border-left-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);font-style:italic}
.add-text{white-space:pre-wrap;overflow-wrap:anywhere}
.add-meta{font-size:11px;color:var(--muted)}
.add-form{display:flex;gap:6px;margin-top:6px}
.add-form input{flex:1;min-width:0}
.add-form .btn:disabled{opacity:.5;cursor:default}
.req-origin-item+.req-origin-item{border-top:1px solid var(--border);margin-top:4px;padding-top:4px}
.req-origin .adds{margin-top:4px}
.req-actions .add-btn{padding:2px 8px;font-size:12px}

/* shortcuts dialog */
.kgroup h3{font-size:13px;margin:14px 0 4px;color:var(--muted)}
.krow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 0;border-bottom:1px solid var(--border)}
.kkeys{flex:none;white-space:nowrap;color:var(--muted)}
kbd{font:12px ui-monospace,Consolas,monospace;color:var(--text);background:var(--surface2);border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:1px 7px}

/* status tabs (narrow screens) */
.m-tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:10px;padding:2px 0;position:sticky;top:0;z-index:5;background:var(--bg);scrollbar-width:none}
.m-tabs::-webkit-scrollbar{display:none}
.m-tab{flex:1 0 auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:0 12px}
.m-tab.active{border-color:var(--c);box-shadow:inset 0 -3px var(--c);font-weight:600}
.board-wrap{min-width:0}
.board-wrap .col>h3{display:none}

/* detail panel: sticky head */
.panel{padding-top:0;overflow-wrap:anywhere}
.panel-top{position:sticky;top:0;z-index:3;background:var(--surface);margin:0 -14px 8px;padding:6px 8px 6px 14px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
.panel-top .pt-id{font:12px ui-monospace,Consolas,monospace;color:var(--muted)}

@media (hover:none) and (pointer:coarse){#keysBtn{display:none}}

@media (max-width:900px){
  .topbar{flex-wrap:wrap;gap:6px 8px;padding:6px 10px}
  .spacer{order:2}
  .cap-btn{display:inline-block;order:3}
  .more-btn{display:inline-block;order:4}
  .seg{order:5;flex:1 1 100%}
  .seg button{flex:1;min-height:40px}
  #viewGuide{display:none}
  .menu-only{display:inline}
  button.menu-only{display:block}
  .cap{order:6;flex:1 1 100%;max-width:none;display:none}
  body.cap-open .cap{display:flex}
  .cap-hint{max-width:120px}
  .top-actions{display:none;position:absolute;right:8px;top:100%;margin-top:4px;flex-direction:column;gap:4px;min-width:210px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.4);z-index:40}
  body.more-open .top-actions{display:flex}
  .top-actions .btn{width:100%;text-align:left;min-height:44px}
  .top-actions .user{display:block;padding:4px 8px;order:-1}
  #agentsBtn{order:1}
  .sidebar{padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
  .proj{flex-wrap:wrap;min-height:44px;padding-right:4px}
  .proj .pname{flex:1 1 120px;padding:10px 0}
  .proj .del{padding:0;min-width:40px;min-height:40px}
  .board{grid-template-columns:minmax(0,1fr)}
  .main{padding:10px}
  .toolbar{gap:8px 12px}
  .search{flex:1 1 100%;max-width:none}
  .sess-sel{max-width:100%}
  .toolbar label{max-width:100%}
  .panel{width:100%;border-left:0}
  .proj-actions{margin-left:0;flex:1 1 100%}
  .kb-wrap>.board-wrap{width:100%}
}

@media (max-width:900px),(pointer:coarse){
  input[type=text],input[type=password],input[type=date],input[type=search],select,textarea,
  .toolbar select,.toolbar input[type=date],textarea.msg-ta,input.merge-q,.req-actions .req-move{font-size:16px!important}
  .btn,.st-btn,.seg button,.tpl-item,.merge-item{min-height:40px}
  .st-btn{padding:0 14px}
  .icon-btn{min-width:40px;min-height:40px}
  input[type=text],input[type=password],input[type=date],select{min-height:40px}
  .toolbar select,.toolbar input[type=date]{min-height:40px}
  .pill{min-height:40px;padding-left:12px}
  .pill-x{min-width:40px;min-height:40px}
  .toolbar label.chk{min-height:40px}
  .toolbar .chk input{width:20px;height:20px}
  .req-actions .req-move{min-height:40px;max-width:100%}
  .req-actions{gap:6px}
  .req-actions .add-btn{padding:0 12px;font-size:14px}
  .linkbtn{padding:10px 0}
  .reqs-toggle{min-height:40px}
  .reqs-done summary,.tok-sec summary,.sugg-hist summary,.danger-sec summary{min-height:40px;display:flex;align-items:center}
  .sw{width:40px;height:40px}
  .sw-custom{width:48px;height:40px}
  .m-tab{min-height:44px}
  .tg-toggle{min-height:40px}
  .row-head{padding:10px}
  .card{padding:10px 12px}
  .krow{padding:10px 0}
}

@media (max-width:640px){
  .dlg,.dlg-sm{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;margin:0;border:0;border-radius:0}
  .dlg-head{border-radius:0;padding:4px 6px 4px 16px;min-height:52px}
  .dlg-head .icon-btn{min-width:44px;min-height:44px;font-size:18px}
  .dlg-body{padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px))}
  .tok-form label{min-width:0}
  .krow{align-items:flex-start;flex-direction:column;gap:4px}
  .sess-k{min-width:0;flex:1 1 100%}
}

.tb-rest{display:contents}
.tb-filters{flex:1 1 100%;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--surface)}
.tb-filters summary{cursor:pointer;min-height:40px;display:flex;align-items:center;font-weight:600;color:var(--text)}
.tb-filters .tb-rest{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:4px 0 10px}

.tchip{position:relative}
.tchip::after{content:"";position:absolute;inset:-10px -3px}
button.badge.req,button.badge.sugg{position:relative}
@media (max-width:900px){button.badge.req,button.badge.sugg{min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center}.m-tab{padding:0 10px}}

@media (max-width:900px){#guideMenuBtn{order:0}#agentsBtn{order:1}#setupBtn{order:2}#keysBtn{order:3}#logoutBtn{order:9}}

.sidebar{overflow-x:hidden}
.proj{flex-wrap:wrap;min-width:0}
.proj .pname{flex:1 1 90px}

@media (max-width:900px),(pointer:coarse){
  .sbadges{gap:8px;margin-top:8px}
  .sbadge{min-height:32px;padding:0 10px;font-size:12px}
  .sbadge::after{inset:-4px -2px}
  .tchip{min-height:32px;display:inline-flex;align-items:center;padding:0 10px;font-size:12px}
  .tchip::after{inset:-4px -2px}
  .idchip{min-height:32px;min-width:40px;font-size:12px;display:inline-flex;align-items:center;justify-content:center}
  .idchip::after{inset:-4px -2px}
  .add-badge{min-height:32px;min-width:36px;padding:0 10px;font-size:12px}
  .add-badge::after{inset:-4px -2px}
  .meta{gap:6px 8px}
}

@media (max-width:900px),(pointer:coarse){.linkbtn{min-width:40px}}

@media (max-width:900px),(pointer:coarse){button.rchip{min-height:40px}}