/* CommandCenter | style.css | V_30 */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* ── PIN GATE ── */
#pinGate{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);}
.pin-box{display:flex;flex-direction:column;align-items:center;gap:20px;padding:36px 28px 32px;background:var(--sf);border:1px solid var(--br2);border-radius:var(--r);box-shadow:var(--sh);width:min(340px,92vw);}
.pin-logo{display:flex;flex-direction:column;align-items:center;gap:6px;}
.pin-logo-icon{width:44px;height:44px;background:linear-gradient(135deg,var(--ac),var(--pu));border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;}
.pin-logo-name{font-size:15px;font-weight:600;color:var(--tx);letter-spacing:-.01em;}
.pin-logo-ver{font-size:10px;color:var(--tx3);font-family:'DM Mono',monospace;}
.pin-title{font-size:13px;color:var(--tx2);font-weight:500;letter-spacing:.02em;}
.pin-dots{display:flex;gap:12px;margin:4px 0;}
.pin-dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--br2);background:transparent;transition:all .15s ease;}
.pin-dot.filled{background:var(--ac);border-color:var(--ac);transform:scale(1.15);box-shadow:0 0 8px rgba(108,142,255,.5);}
.pin-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;}
.pin-key{height:54px;border-radius:var(--r);border:1px solid var(--br);background:var(--sf2);color:var(--tx);font-family:'DM Sans',sans-serif;font-size:20px;font-weight:500;cursor:pointer;transition:all .12s;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;user-select:none;}
.pin-key:hover{background:var(--sf3);border-color:var(--br2);}
.pin-key:active{background:var(--ac2);border-color:var(--ac);color:#fff;transform:scale(.95);}
.pin-key-clear{font-size:16px;color:var(--tx2);}
.pin-key-clear:active{background:var(--rd);border-color:var(--rd);color:#fff;}
.pin-key-enter{font-size:16px;background:var(--ac2);border-color:var(--ac);color:#fff;}
.pin-key-enter:hover{background:var(--ac);}
.pin-key-enter:active{background:var(--ac2);transform:scale(.95);}
.pin-error{min-height:18px;font-size:12px;color:var(--rd);text-align:center;font-weight:500;animation:mIn .15s ease;}
@keyframes pin-shake{0%,100%{transform:translateX(0);}20%{transform:translateX(-8px);}40%{transform:translateX(8px);}60%{transform:translateX(-5px);}80%{transform:translateX(5px);}}
.pin-shake .pin-box{animation:pin-shake .4s ease;}

/* ── CHANGE PIN MODAL ── */
#changePinModal{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;animation:mIn .15s ease;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);}
.cpm-inner{background:var(--sf);border:1px solid var(--br2);border-radius:var(--r);padding:24px;width:min(340px,92vw);box-shadow:var(--sh);}

/* ══════════════════════════════════════════ ROOT TOKENS ══════════════════════════════════════════ */
:root{
  --bg:#0f1117;--sf:#181c27;--sf2:#1e2336;--sf3:#252b40;
  --br:#2a3050;--br2:#333d60;
  --tx:#e8eaf6;--tx2:#8b92b8;--tx3:#555e88;
  --ac:#6c8eff;--ac2:#4f6bdb;
  --gn:#34d399;--yw:#fbbf24;--rd:#f87171;
  --pu:#a78bfa;--or:#fb923c;--pk:#f472b6;--tl:#2dd4bf;
  --hh:50px;--fh:48px;--r:10px;--rs:6px;
  --sh:0 4px 24px rgba(0,0,0,.55);--ss:0 2px 8px rgba(0,0,0,.3);
  --p-urgent:#f87171;--p-high:#fb923c;--p-normal:#6c8eff;--p-low:#8b92b8;
}

/* ══════════════════════════════════════════
   V_16: LIGHT THEME — body.light overrides
   ══════════════════════════════════════════ */
body.light{
  --bg:#f0f2f8;--sf:#ffffff;--sf2:#f5f7fc;--sf3:#eceef6;
  --br:#dde0ed;--br2:#c5c9da;
  --tx:#1e2238;--tx2:#4a5178;--tx3:#8890b5;
  --ac:#4f6bdb;--ac2:#3a55c4;
  --sh:0 4px 24px rgba(0,0,0,.09);--ss:0 2px 8px rgba(0,0,0,.05);
}
/* Light theme specific overrides for hardcoded colors */
body.light .col-hdr:hover{background:rgba(0,0,0,.04)}
body.light .cc-spinner{background:rgba(255,248,220,.97);border-color:rgba(180,140,30,.45);box-shadow:0 2px 12px rgba(180,140,30,.12)}
body.light .trow.ghost-source{background:var(--sf3)!important}
body.light .col.ghost-source{background:var(--sf3)!important}
body.light .drag-clone.col-clone{background:var(--sf)}
body.light .drag-clone.row-clone{background:var(--sf2);border-color:var(--br2)}
body.light .drag-clone.nest-mode{background:rgba(79,107,219,.1)!important;border-color:rgba(79,107,219,.4)!important;box-shadow:0 8px 32px rgba(79,107,219,.2),inset 0 0 0 1px rgba(79,107,219,.4)}
body.light .drop-line{background:var(--ac);box-shadow:0 0 8px rgba(79,107,219,.45)}
body.light .tlist.drop-target{background:rgba(79,107,219,.07);box-shadow:inset 0 0 0 2px rgba(79,107,219,.35)}
body.light .trow.subtask-drop-target{background:rgba(107,79,219,.09);box-shadow:inset 0 0 0 2px rgba(107,79,219,.4)}
body.light .trow.today-hl{background:rgba(251,191,36,.1)}
body.light .trow.today-hl:hover{background:rgba(251,191,36,.18)}
/* V_27 (item #45): bumped opacity — .16/.26 gives visible tint on light bg */
body.light .trow.overdue-hl{background:rgba(248,113,113,.16)}
body.light .trow.overdue-hl:hover{background:rgba(248,113,113,.26)}
body.light .sdrawer{box-shadow:-4px 0 24px rgba(0,0,0,.12)}
body.light .modal{background:var(--sf2)}
body.light .debug-panel{background:#f0f2f8;border-top-color:var(--br2)}
body.light .debug-log{background:#f8f9fd}
body.light .di{color:#4a5178}.body.light .dok{color:#0e7a4d}.body.light .de{color:#c0392b}.body.light .dw{color:#b07d00}
body.light .toast{background:var(--sf2);border-color:var(--br2)}
body.light .pin-dot.filled{box-shadow:0 0 8px rgba(79,107,219,.4)}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--tx);height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;user-select:none;}

.load-bar{position:fixed;top:0;left:0;right:0;height:2px;z-index:900;pointer-events:none}
.load-bar-fill{height:100%;background:linear-gradient(90deg,var(--ac),var(--pu));width:0%;transition:width .3s;border-radius:0 2px 2px 0}

/* V_15 (item #4): spinner recolored amber/orange so it stands out on dark-blue dashboard */
.cc-spinner{position:fixed;top:calc(var(--hh) + 8px);left:50%;transform:translateX(-50%);z-index:850;display:none;pointer-events:none;background:rgba(42,28,4,0.92);border:1px solid rgba(251,191,36,0.55);border-radius:999px;padding:7px 14px 7px 10px;align-items:center;gap:8px;box-shadow:0 2px 12px rgba(251,191,36,0.18);backdrop-filter:blur(6px);animation:spinIn .18s ease;}
.cc-spinner.visible{display:inline-flex}
.cc-spinner-ring{width:14px;height:14px;border-radius:50%;border:2px solid rgba(251,191,36,0.25);border-top-color:var(--yw);animation:spinRing .7s linear infinite;}
.cc-spinner-lbl{font-size:11px;font-weight:500;color:var(--yw);font-family:'DM Sans',sans-serif;letter-spacing:.01em;}
@keyframes spinRing{to{transform:rotate(360deg)}}
@keyframes spinIn{from{opacity:0;transform:translate(-50%,-4px)}to{opacity:1;transform:translate(-50%,0)}}

header{
  height:var(--hh);min-height:var(--hh);
  background:var(--sf);border-bottom:1px solid var(--br);
  display:flex;align-items:center;padding:0;gap:0;z-index:200;flex-shrink:0;overflow:visible;position:relative;
}
.hdr-scroll{
  flex:1;min-width:0;height:100%;display:flex;align-items:center;gap:6px;
  overflow-x:auto;overflow-y:visible;padding:0 10px;
  padding-left:max(10px,min(env(safe-area-inset-left),14px));
  padding-right:max(10px,min(env(safe-area-inset-right),14px));
}
.hdr-scroll::-webkit-scrollbar{display:none}

.logo{display:flex;flex-direction:column;white-space:nowrap;margin-right:2px;flex-shrink:0}
.logo-name{font-weight:600;font-size:13px;color:var(--tx);display:flex;align-items:center;gap:5px}
.logo-icon{width:22px;height:22px;background:linear-gradient(135deg,var(--ac),var(--pu));border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0}
.logo-ver{font-size:9px;color:var(--tx3);font-family:'DM Mono',monospace;padding-left:27px;margin-top:1px}
.hd{width:1px;height:18px;background:var(--br);flex-shrink:0}
.hsp{flex:1}
.ibtn{width:26px;height:26px;border-radius:var(--rs);border:1px solid var(--br);background:transparent;color:var(--tx2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}
.ibtn:hover{background:var(--sf2);color:var(--tx)}
/* V_18 (item #10): toggled/engaged state — same yellow as filter/sort buttons */
.ibtn.active{background:rgba(251,191,36,.1);color:var(--yw);border-color:var(--yw)}
/* V_30 (item #51): refresh button countdown — disable background transition so conic-gradient updates are instant */
#refreshBtn{transition:color .15s}
.tbtn{display:flex;align-items:center;gap:4px;padding:3px 8px;border-radius:var(--rs);border:1px solid var(--br);background:transparent;color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}
.tbtn:hover{background:var(--sf2);color:var(--tx);border-color:var(--br2)}
/* V_18 (item #10): yellow-ish engaged state, matching filter/sort active style */
.tbtn.active{background:rgba(251,191,36,.1);color:var(--yw);border-color:var(--yw)}
.scroll-toggle{display:flex;align-items:center;gap:4px;padding:3px 8px;border-radius:var(--rs);border:1px solid var(--br);background:var(--sf3);color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}
/* V_18 (item #10): yellow-ish engaged state, matching filter/sort active style */
.scroll-toggle.scroll-on{background:rgba(251,191,36,.1);color:var(--yw);border-color:var(--yw)}

/* ══════════════════════════════════════════
   V_12 NEW — SEARCH INPUT (bug #6)
   ══════════════════════════════════════════ */
.search-wrap{
  position:relative;display:flex;align-items:center;flex-shrink:0;
  background:var(--sf2);border:1px solid var(--br);border-radius:var(--rs);
  padding:0 4px 0 6px;height:24px;transition:border-color .15s,background .15s;
  width:160px;
}
.search-wrap:focus-within{border-color:var(--ac);background:var(--sf3)}
.search-wrap .search-icon{font-size:10px;opacity:.55;pointer-events:none;margin-right:3px}
#searchInp{
  background:transparent;border:none;outline:none;flex:1;min-width:0;
  color:var(--tx);font-family:'DM Sans',sans-serif;font-size:11px;
  padding:0;height:22px;
}
#searchInp::placeholder{color:var(--tx3);opacity:.8}
.search-clear{
  display:none;background:transparent;border:none;color:var(--tx3);font-size:10px;
  cursor:pointer;padding:2px 4px;border-radius:3px;transition:color .12s,background .12s;
}
.search-clear:hover{color:var(--rd);background:rgba(248,113,113,.1)}
/* V_12: yellow border active state when the input has text */
.search-wrap:has(#searchInp.has-text){
  border-color:var(--yw);background:rgba(251,191,36,.08);
  box-shadow:0 0 0 1px rgba(251,191,36,.3);
}
.search-wrap:has(#searchInp.has-text) .search-icon{opacity:.9;color:var(--yw)}
#searchInp.has-text ~ .search-clear{display:inline-block}

.dd-wrap{position:relative;flex-shrink:0}
.dd-btn{display:flex;align-items:center;gap:4px;padding:3px 8px;border-radius:var(--rs);border:1px solid var(--br);background:transparent;color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}
.dd-btn:hover{background:var(--sf2);color:var(--tx);border-color:var(--br2)}
.dd-btn.filtering{border-color:var(--yw);color:var(--yw);background:rgba(251,191,36,.1)}
.dd-caret{font-size:8px;opacity:.6}
.dd-menu{position:absolute;top:calc(100% + 4px);left:0;background:var(--sf2);border:1px solid var(--br2);border-radius:var(--r);padding:5px;z-index:1000;min-width:220px;box-shadow:var(--sh);display:none}
.dd-menu.open{display:block;animation:mIn .12s ease}
.dd-menu.right{left:auto;right:0}
.dd-item{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:var(--rs);cursor:pointer;font-size:11px;color:var(--tx2);transition:background .1s;user-select:none}
.dd-item:hover{background:var(--sf3);color:var(--tx)}
.dd-item.all-item{border-bottom:1px solid var(--br);margin-bottom:3px;padding-bottom:8px}
.dd-item.cur-item{background:var(--sf3);color:var(--tx)}
.dd-cb{width:13px;height:13px;border-radius:3px;border:1.5px solid var(--br2);background:var(--sf3);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:8px;transition:all .15s}
.dd-cb.on{background:var(--ac2);border-color:var(--ac);color:#fff}
.dd-sep{height:1px;background:var(--br);margin:3px 0}
.mem-counts{display:flex;gap:4px;margin-left:auto;font-size:9px;font-family:'DM Mono',monospace;color:var(--tx3)}
.mc-open{color:var(--ac)}.mc-done{color:var(--gn)}
.av-stack-sm{display:flex;margin-left:2px}
.av-sm{width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:6px;font-weight:700;border:1.5px solid var(--sf);margin-left:-3px;flex-shrink:0}
.av-stack-sm .av-sm:first-child{margin-left:0}

main{
  flex:1;overflow-y:auto;overflow-x:auto;padding:7px 6px;
  display:flex;flex-direction:column;position:relative;
  padding-left:max(6px,min(env(safe-area-inset-left),14px));
  padding-right:max(6px,min(env(safe-area-inset-right),14px));
}
.filter-banner{display:none;align-items:center;gap:6px;padding:4px 10px;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.2);border-radius:var(--rs);margin-bottom:5px;font-size:11px;color:var(--yw);flex-shrink:0}
.filter-banner.visible{display:flex}
.filter-banner .fb-clr{margin-left:auto;cursor:pointer;font-size:10px;border:none;background:none;color:var(--yw)}

.cw{display:flex;gap:6px;align-items:flex-start;min-height:100%}
.cw.fit{width:100%}
.cw.scroll{min-width:max-content}
.col{background:var(--sf);border:1px solid var(--br);border-radius:var(--r);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;min-width:190px;transition:box-shadow .15s,opacity .2s,transform .12s ease}
.cw.fit .col{flex:1;min-width:0}
.col.ghost-source{opacity:.35;background:var(--sf3)!important;pointer-events:none;transition:opacity .1s ease}
.col-collapsed{background:var(--sf);border:1px solid var(--br);border-radius:var(--r);width:36px;min-width:36px;flex:0 0 36px;overflow:hidden;cursor:grab;position:relative;transition:all .12s ease;display:flex;flex-direction:column;align-items:center;touch-action:none;-webkit-touch-callout:none}
.cw.fit .col-collapsed{flex:0 0 36px}
.col-collapsed:hover{border-color:var(--br2);background:var(--sf2)}
.col-collapsed.ghost-source{opacity:.35;background:var(--sf3)!important;pointer-events:none}
.col-collapsed.drop-target{border-color:var(--ac);box-shadow:0 0 0 2px rgba(108,142,255,.25)}
.col-collapsed:active{cursor:grabbing}

.col-hdr{padding:7px 8px 5px;border-bottom:1px solid var(--br);display:flex;align-items:center;gap:5px;flex-shrink:0;cursor:grab;position:relative;user-select:none;touch-action:none;-webkit-touch-callout:none}
.col-hdr:hover{background:rgba(255,255,255,.025)}
.col-hdr:active{cursor:grabbing}
.col-bar{width:4px;height:14px;border-radius:2px;flex-shrink:0}
.col-title-wrap{flex:1;min-width:0}
.col-title{font-size:10px;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;border-radius:3px;padding:1px 3px;margin:-1px -3px;transition:background .12s}
.col-title:hover{background:var(--sf3)}
.col-title-inp{font-size:10px;font-weight:600;color:var(--tx);text-transform:uppercase;letter-spacing:.05em;background:var(--sf3);border:1px solid var(--ac);border-radius:3px;padding:1px 4px;width:100%;font-family:'DM Sans',sans-serif;outline:none}
.col-cnt{font-size:10px;color:var(--tx3);font-family:'DM Mono',monospace;background:var(--sf3);padding:1px 5px;border-radius:8px;white-space:nowrap}
.col-collapse-btn{width:16px;height:16px;border-radius:3px;border:1px solid var(--br2);background:transparent;color:var(--tx3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;transition:all .15s;flex-shrink:0}
.col-collapse-btn:hover{background:var(--sf3);color:var(--tx)}
.col-add{width:18px;height:18px;border-radius:4px;border:1px solid var(--br2);background:transparent;color:var(--tx3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}
.col-add:hover{background:var(--ac2);color:#fff;border-color:var(--ac)}
.col-overdue{font-size:9px;color:var(--rd);background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.2);padding:1px 4px;border-radius:8px;white-space:nowrap;font-family:'DM Mono',monospace}

.col-body{overflow:hidden}
.tlist{padding:3px;display:flex;flex-direction:column;gap:1px}
.trow{display:flex;align-items:center;gap:4px;padding:3px 4px;border-radius:var(--rs);cursor:pointer;transition:background .1s,transform .12s ease;min-height:25px;position:relative}
.trow:hover{background:var(--sf2)}
.trow.today-hl{background:rgba(251,191,36,.06)}
.trow.today-hl:hover{background:rgba(251,191,36,.12)}
/* V_27 (item #45): bumped opacity from .06/.12 to .15/.22 — was invisible on dark bg */
.trow.overdue-hl{background:rgba(248,113,113,.15)}
.trow.overdue-hl:hover{background:rgba(248,113,113,.22)}
.trow.ghost-source{opacity:.3;background:var(--sf3)!important;pointer-events:none;transition:opacity .1s ease}
/* V_12: cross-list drop target highlight (bug #4) */
.tlist.drop-target{background:rgba(108,142,255,.08);border-radius:var(--rs);box-shadow:inset 0 0 0 2px rgba(108,142,255,.4)}
/* V_12: subtask-zone highlight when dragging onto another task row (bug #3) */
.trow.subtask-drop-target{background:rgba(167,139,250,.12);box-shadow:inset 0 0 0 2px rgba(167,139,250,.5)}

.drop-line{height:3px;margin:1px 3px;border-radius:2px;background:var(--ac);box-shadow:0 0 8px rgba(108,142,255,.55);pointer-events:none;animation:dropLinePulse 1.1s ease-in-out infinite}
.drop-line.subtask-indent{margin-left:26px}
@keyframes dropLinePulse{0%,100%{opacity:.85}50%{opacity:1}}

.drag-clone.nest-mode{padding-left:20px;background:rgba(167,139,250,.14)!important;border-color:rgba(167,139,250,.55)!important;box-shadow:0 8px 32px rgba(167,139,250,.35),inset 0 0 0 1px rgba(167,139,250,.5);transition:padding-left .14s ease,background .14s ease}
.drag-clone.nest-mode::before{content:'↳';position:absolute;left:6px;top:50%;transform:translateY(-50%);color:rgba(167,139,250,.85);font-size:12px;font-weight:600;pointer-events:none}

.drag-clone{position:fixed;pointer-events:none;z-index:9999;opacity:.88;box-shadow:0 8px 32px rgba(0,0,0,.6);border-radius:var(--rs);transform:rotate(0deg);transition:none;will-change:left,top,transform}
.drag-clone.col-clone{border-radius:var(--r);min-width:190px;max-width:300px;overflow:hidden;background:var(--sf)}
/* V_28: collapsed column clones stay narrow — overrides the 190px min-width above */
.drag-clone.col-collapsed-clone{min-width:36px!important;max-width:36px!important;display:flex;flex-direction:column;align-items:center;overflow:hidden}
.drag-clone.row-clone{min-width:200px;max-width:340px;background:var(--sf2);border:1px solid var(--br2)}

.drag-handle-task{width:14px;height:16px;cursor:grab;display:flex;align-items:center;justify-content:center;color:var(--tx3);font-size:10px;opacity:0;transition:opacity .15s;flex-shrink:0;user-select:none;touch-action:none;-webkit-touch-callout:none}
.drag-handle-task:active{cursor:grabbing}
.trow:hover .drag-handle-task{opacity:.7}
@media (hover:none) and (pointer:coarse){.drag-handle-task{opacity:.45}}

.litem{transition:transform .12s ease;display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:var(--rs);cursor:default}
.litem:hover{background:var(--sf3)}
.litem.ghost-source{opacity:.3;background:var(--sf3)!important;transition:opacity .1s ease}

.trow.subtask{padding-left:24px;position:relative}
.trow.subtask::before{content:'';position:absolute;left:10px;top:0;bottom:0;width:2px;background:var(--br2);border-radius:1px;opacity:.6}
.trow.subtask:hover::before{background:var(--ac);opacity:.7}

.subtask-badge.collapsed{opacity:.85}
.subtask-badge.expanded{background:rgba(108,142,255,.12);border-color:rgba(108,142,255,.4);color:var(--ac)}

.sc{width:14px;height:14px;border-radius:50%;flex-shrink:0;cursor:pointer;border:2px solid #555e88;background:transparent;transition:all .15s;display:flex;align-items:center;justify-content:center}
.sc:hover{transform:scale(1.15);opacity:.8}
.sc.done{background:var(--c,#34d399);border-color:var(--c,#34d399)}
.sc.done::after{content:'✓';color:#000;font-size:7px;font-weight:800;line-height:1}

.tname{flex:1;font-size:11px;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.trow.done .tname{color:var(--tx3);text-decoration:line-through}

/* V_24 (item #29): floating tooltip for truncated task names */
#tt{position:fixed;z-index:9998;background:var(--sf2);border:1px solid var(--br2);border-radius:var(--rs);padding:5px 9px;font-size:11px;font-family:'DM Sans',sans-serif;color:var(--tx);box-shadow:var(--sh);pointer-events:none;max-width:320px;white-space:normal;word-break:break-word;line-height:1.4;display:none;animation:mIn .1s ease}
#tt.visible{display:block}

.subtask-badge{display:flex;align-items:center;gap:2px;font-size:9px;color:var(--tx3);background:var(--sf3);border:1px solid var(--br2);border-radius:8px;padding:1px 5px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:all .15s}
.subtask-badge:hover{border-color:var(--ac);color:var(--ac)}
.subtask-badge.has-subtasks{color:var(--ac);border-color:rgba(108,142,255,.3)}

.tmeta{display:flex;align-items:center;gap:3px;flex-shrink:0}
.dbadge{font-size:9px;font-family:'DM Mono',monospace;padding:1px 4px;border-radius:3px;white-space:nowrap}
.d-over{background:rgba(248,113,113,.15);color:var(--rd)}
.d-today{background:rgba(251,191,36,.15);color:var(--yw)}
.d-soon{background:rgba(108,142,255,.1);color:var(--ac)}
.d-norm{background:var(--sf3);color:var(--tx3)}

.avstack{display:flex;align-items:center}
.av{width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:6px;font-weight:700;border:1.5px solid var(--sf);margin-left:-3px;flex-shrink:0}
.avstack .av:first-child{margin-left:0}

.pflag{width:14px;height:14px;flex-shrink:0;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:3px;font-size:11px;transition:transform .1s;opacity:.85}
.pflag:hover{transform:scale(1.2);opacity:1}
.pflag.empty{opacity:.25}
.pflag.empty:hover{opacity:.6}
.pflag-col{width:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center}

.slabel{font-size:9px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.06em;padding:5px 4px 1px}

.comp-sec{border-top:1px solid var(--br);margin-top:2px}
.comp-hdr{display:flex;align-items:center;gap:5px;padding:4px 8px;cursor:pointer;color:var(--tx3);font-size:10px;font-weight:500;text-transform:uppercase;transition:color .15s;user-select:none}
.comp-hdr:hover{color:var(--tx2)}
.comp-hdr .chev{font-size:8px;transition:transform .2s}
.comp-hdr.open .chev{transform:rotate(90deg)}
.comp-tasks{display:none}
.comp-tasks.vis{display:flex;flex-direction:column;gap:1px;padding:0 3px 4px}
.empty{text-align:center;padding:14px 6px;color:var(--tx3);font-size:11px}

footer{
  height:var(--fh);min-height:var(--fh);
  background:var(--sf);border-top:1px solid var(--br);
  display:flex;align-items:center;padding:0 10px;gap:8px;
  z-index:100;flex-shrink:0;overflow:hidden;position:relative;
  padding-left:max(10px,min(env(safe-area-inset-left),14px));
  padding-right:max(10px,min(env(safe-area-inset-right),14px));
  padding-bottom:env(safe-area-inset-bottom);
}
.fstat{display:flex;align-items:center;gap:4px;font-size:10px;cursor:pointer;border-radius:var(--rs);padding:3px 6px;transition:background .12s;white-space:nowrap;border:1px solid transparent}
.fstat:hover{background:var(--sf2)}
.fstat.factive{background:var(--sf2);border-color:var(--br2)}
.fstat-lbl{color:var(--tx3);font-size:9px;text-transform:uppercase;letter-spacing:.04em}
.fstat-n{font-weight:600;font-family:'DM Mono',monospace;font-size:11px}
.fn-open{color:var(--tx)}.fn-today{color:var(--yw)}.fn-over{color:var(--rd)}.fn-done{color:var(--gn)}.fn-week{color:var(--tl)}
.fpbar{flex:1;max-width:100px;height:3px;background:var(--sf3);border-radius:2px;overflow:hidden}
.fpbar-fill{height:100%;background:var(--gn);border-radius:2px;transition:width .5s}
.fpct{font-size:9px;color:var(--tx3);font-family:'DM Mono',monospace}
.ftime{font-size:9px;color:var(--tx3);white-space:nowrap;margin-left:auto}
.conn-dot{width:6px;height:6px;border-radius:50%;background:var(--rd);flex-shrink:0}
.conn-dot.ok{background:var(--gn)}
.conntxt{font-size:9px;color:var(--tx3);white-space:nowrap}
.fhsp{flex:1}

body.focus-mode header{display:none}
body.focus-mode footer{display:none}
body.focus-mode main{padding-top:env(safe-area-inset-top)}

@media (display-mode:standalone){body{height:100dvh} #installHint{display:none!important}}

#installHint{display:none;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--fh) + 10px + env(safe-area-inset-bottom));z-index:880;background:linear-gradient(135deg,var(--ac2),var(--pu));color:#fff;border-radius:999px;padding:8px 14px 8px 10px;font-size:12px;font-weight:500;box-shadow:0 4px 18px rgba(108,142,255,.4);align-items:center;gap:8px;max-width:90vw;animation:spinIn .18s ease;}
#installHint.visible{display:inline-flex}
#installHint .ih-icon{font-size:14px}
#installHint .ih-close{background:rgba(255,255,255,.2);border:none;color:#fff;width:18px;height:18px;border-radius:50%;font-size:11px;cursor:pointer;margin-left:4px;display:flex;align-items:center;justify-content:center;}
#installHint .ih-close:hover{background:rgba(255,255,255,.35)}

@keyframes mIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@keyframes oIn{from{opacity:0}to{opacity:1}}
@keyframes sIn{from{transform:translateX(100%)}to{transform:translateX(0)}}

.overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:5000;display:none;align-items:center;justify-content:center;backdrop-filter:blur(2px)}
.overlay.open{display:flex;animation:oIn .15s ease}
.modal{background:var(--sf2);border:1px solid var(--br2);border-radius:14px;padding:20px;width:480px;max-width:95vw;max-height:88vh;overflow-y:auto;box-shadow:var(--sh);animation:mIn .18s ease;position:relative}
.modal::-webkit-scrollbar{width:4px}.modal::-webkit-scrollbar-thumb{background:var(--br2);border-radius:2px}
.mtitle{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.mtitle-lbl{font-size:11px;color:var(--tx3);flex:1}
.mclose{width:22px;height:22px;border-radius:5px;border:1px solid var(--br2);background:transparent;color:var(--tx3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s}
.mclose:hover{background:var(--rd);color:#fff;border-color:var(--rd)}
.fg{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.flbl{font-size:10px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.05em}
.finput{background:var(--sf3);border:1px solid var(--br2);border-radius:var(--rs);padding:7px 10px;color:var(--tx);font-family:'DM Sans',sans-serif;font-size:13px;outline:none;width:100%;transition:border-color .15s}
.finput:focus{border-color:var(--ac)}
select.finput{cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' stroke='%238b92b8' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}
textarea.finput{resize:vertical;min-height:60px;max-height:140px;font-size:12px;line-height:1.5}
.tiv{display:flex;gap:6px;align-items:center}
.tshow{background:var(--sf3);border:1px solid var(--br2);border-radius:var(--rs);padding:6px 9px;color:var(--tx3);cursor:pointer;font-size:12px;transition:all .15s;flex-shrink:0}
.tshow:hover{color:var(--tx)}
.chip-group{display:flex;flex-wrap:wrap;gap:5px}
.schip{display:flex;align-items:center;gap:5px;padding:4px 9px;border-radius:20px;border:1.5px solid var(--br2);font-size:11px;cursor:pointer;transition:all .15s;color:var(--tx2);user-select:none}
.schip:hover{border-color:var(--ac);color:var(--tx)}
.schip.sel{border-color:var(--ac);background:rgba(108,142,255,.15);color:var(--tx)}
.cdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
/* V_22 (item #24): mobile touch reliability */
.achip{display:flex;align-items:center;gap:5px;padding:4px 9px;border-radius:20px;border:1.5px solid var(--br2);font-size:11px;cursor:pointer;transition:all .15s;color:var(--tx2);touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.achip:hover{border-color:var(--ac);color:var(--tx)}
.achip.sel{border-color:var(--ac);background:rgba(108,142,255,.12);color:var(--tx)}
.achip .av{pointer-events:none}
.btn{padding:7px 18px;border-radius:var(--rs);border:1px solid var(--br2);background:var(--sf3);color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}
.btn:hover{background:var(--sf2);color:var(--tx)}
.btn-p{background:var(--ac2);border-color:var(--ac);color:#fff}
.btn-p:hover{background:var(--ac);color:#fff}
.btn-d{background:rgba(248,113,113,.12);border-color:var(--rd);color:var(--rd)}
.btn-d:hover{background:var(--rd);color:#fff}
.mactions{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;padding-top:12px;border-top:1px solid var(--br)}

.mstatus-row{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:4px 6px;border-radius:var(--rs);transition:background .12s}
.mstatus-row.clickable{cursor:pointer;border:1px solid transparent}
.mstatus-row.clickable:hover{background:var(--sf3);border-color:var(--br2)}
.mstatus-row.clickable .status-caret{transition:transform .12s}
.mstatus-row.clickable:hover .status-caret{color:var(--ac)}
.status-circle-modal{width:22px;height:22px;border-radius:50%;flex-shrink:0;cursor:pointer;border:2.5px solid #555e88;background:transparent;display:flex;align-items:center;justify-content:center;transition:all .15s}
.status-circle-modal:hover{transform:scale(1.1)}
.status-circle-modal.done{background:var(--c,#34d399);border-color:var(--c,#34d399)}
.status-circle-modal.done::after{content:'✓';color:#000;font-size:9px;font-weight:800}
.status-label-modal{font-size:11px;color:var(--tx2)}

.date-row{display:flex;gap:6px;align-items:center}
.date-row .finput{flex:1}
.cbtn{width:100%;margin-top:4px}

.subtask-section{margin-top:4px}
.subtask-row-modal{display:flex;align-items:center;gap:6px;padding:4px 2px;border-radius:var(--rs)}
.subtask-row-modal:hover{background:var(--sf3)}
.subtask-name-modal{flex:1;font-size:11px;color:var(--tx);cursor:pointer;padding:2px 4px;border-radius:3px;transition:background .12s,color .12s}
.subtask-name-modal:hover{background:var(--sf3);color:var(--ac)}
.subtask-name-modal.done{color:var(--tx3);text-decoration:line-through}
.subtask-name-modal.done:hover{color:var(--ac)}
.subtask-del{background:none;border:none;color:var(--tx3);cursor:pointer;font-size:11px;padding:1px 3px;border-radius:3px;transition:color .12s}
.subtask-del:hover{color:var(--rd)}
.subtask-inp-wrap{margin-top:6px}
#subtaskInput{display:none;background:var(--sf3);border:1px solid var(--ac);border-radius:var(--rs);padding:5px 8px;color:var(--tx);font-family:'DM Sans',sans-serif;font-size:12px;outline:none;width:100%}

.tparent-bc{display:flex;align-items:center;gap:6px;padding:7px 10px;margin:-4px 0 12px;background:rgba(167,139,250,.08);border:1px solid rgba(167,139,250,.25);border-radius:var(--rs);font-size:11px;color:var(--tx2);flex-wrap:wrap}
.tparent-bc-icon{color:var(--pu);font-size:13px;font-weight:600}
.tparent-bc-lbl{color:var(--tx3);font-size:10px;text-transform:uppercase;letter-spacing:.04em}
.tparent-bc-list{color:var(--tx2);font-weight:500}
.tparent-bc-sep{color:var(--tx3);font-size:11px}
.tparent-bc-parent{color:var(--ac);font-weight:600;cursor:pointer;padding:2px 6px;border-radius:3px;transition:background .12s,color .12s;text-decoration:underline;text-decoration-color:rgba(108,142,255,.3);text-underline-offset:2px}
.tparent-bc-parent:hover{background:rgba(108,142,255,.15);color:var(--tx);text-decoration-color:var(--ac)}

.mini-popup{position:fixed;background:var(--sf2);border:1px solid var(--br2);border-radius:var(--r);padding:4px;z-index:9000;box-shadow:var(--sh);min-width:140px;display:none;animation:mIn .1s ease}
.mini-popup.open{display:block}
.mini-item{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:var(--rs);cursor:pointer;font-size:11px;color:var(--tx2);transition:background .1s}
.mini-item:hover{background:var(--sf3);color:var(--tx)}
.mini-item.cur{background:var(--sf3);color:var(--tx)}
.mini-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.pmini-item{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:var(--rs);cursor:pointer;font-size:11px;color:var(--tx2);transition:background .1s}
.pmini-item:hover{background:var(--sf3);color:var(--tx)}
.pmini-item.cur{background:var(--sf3);color:var(--tx)}

.spanel{position:fixed;inset:0;z-index:400;display:none}
.spanel.open{display:block}
.sdrawer{
  position:absolute;top:0;right:0;bottom:0;width:340px;
  background:var(--sf2);border-left:1px solid var(--br2);
  box-shadow:-4px 0 24px rgba(0,0,0,.4);overflow-y:auto;padding:16px;
  animation:sIn .2s ease;
  padding-top:max(16px,env(safe-area-inset-top));
  padding-bottom:max(16px,env(safe-area-inset-bottom));
  padding-right:max(16px,env(safe-area-inset-right));
}
.sdrawer::-webkit-scrollbar{width:4px}.sdrawer::-webkit-scrollbar-thumb{background:var(--br2)}
.stitle{font-size:15px;font-weight:600;display:flex;align-items:center;margin-bottom:14px}
.stitle .mclose{margin-left:auto}
.ssec{margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--br)}
.ssec:last-child{border-bottom:none}
.ssec-t{font-size:10px;font-weight:600;color:var(--tx3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px}
.ssec-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--br)}
.ssec-grid-2 .ssec-half{display:flex;flex-direction:column;gap:6px}
.ssec-grid-2 .ssec-t{margin-bottom:4px}
.ssec-grid-2 .ssec-input-row{display:flex;gap:6px;align-items:center}
.ssec-grid-2 .ssec-input-row .finput{flex:1;min-width:0}
.ssec-grid-2 .ssec-unit{font-size:10px;color:var(--tx2);white-space:nowrap}
.ssec-grid-2 .ssec-desc{font-size:10px;color:var(--tx3);line-height:1.35}
.slink{display:block;font-size:12px;color:var(--ac);text-decoration:none;padding:6px 8px;border-radius:var(--rs);transition:background .12s;cursor:pointer}
.slink:hover{background:var(--sf3)}
.cstat{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:var(--rs);font-size:11px;margin-bottom:8px}
.cstat.ok{background:rgba(52,211,153,.1);color:var(--gn)}
.cstat.no{background:rgba(248,113,113,.1);color:var(--rd)}
.csdot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0}
.lname{font-size:11px;color:var(--tx)}
.lsub{font-size:9px;color:var(--tx3)}
.lhandle{cursor:grab;color:var(--tx3);font-size:12px;flex-shrink:0;user-select:none;padding:0 2px;touch-action:none;-webkit-touch-callout:none}
.lhandle:active{cursor:grabbing}
.sw{width:28px;height:16px;border-radius:8px;background:var(--sf3);border:1.5px solid var(--br2);cursor:pointer;position:relative;transition:all .2s;flex-shrink:0}
.sw::after{content:'';position:absolute;left:2px;top:1.5px;width:10px;height:10px;border-radius:50%;background:var(--tx3);transition:all .2s}
.sw.on{background:var(--ac2);border-color:var(--ac)}
.sw.on::after{left:14px;background:#fff}
.mrow{display:flex;align-items:center;gap:7px;padding:5px 2px}
.mcolor-sw{width:18px;height:18px;border-radius:50%;cursor:pointer;position:relative;overflow:hidden;flex-shrink:0}
.mcolor-sw input[type=color]{position:absolute;inset:-4px;opacity:0;cursor:pointer;width:calc(100%+8px);height:calc(100%+8px)}
.sync-row{display:flex;gap:8px;align-items:center}
.sync-row .finput{width:80px}
.theme-toggle-row{display:flex;align-items:center;gap:10px;padding:4px 2px}
.theme-toggle-label{flex:1;font-size:12px;color:var(--tx)}
.theme-toggle-sub{font-size:10px;color:var(--tx3);margin-top:1px}
.stabs{display:flex;gap:2px;margin-bottom:16px;background:var(--sf3);border-radius:var(--rs);padding:3px}
.stab{flex:1;padding:7px 4px;border:none;background:transparent;color:var(--tx2);font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;cursor:pointer;border-radius:calc(var(--rs) - 1px);transition:all .15s;white-space:nowrap}
.stab:hover{color:var(--tx);background:rgba(255,255,255,.06)}
.stab.active{background:var(--sf2);color:var(--tx);box-shadow:var(--ss)}
.stab-panel{display:none}
.stab-panel.active{display:block}

.instr-modal{max-width:560px}
.instr-section{margin-bottom:14px}
.instr-section h4{font-size:11px;font-weight:600;color:var(--ac);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.instr-row{display:flex;gap:8px;padding:3px 0;font-size:11px;color:var(--tx2);line-height:1.5}
kbd{background:var(--sf3);border:1px solid var(--br2);border-radius:4px;padding:1px 6px;font-family:'DM Mono',monospace;font-size:10px;color:var(--tx)}

.tc{position:fixed;z-index:700;display:flex;flex-direction:column;gap:5px;align-items:center;pointer-events:none;bottom:calc(var(--fh) + 8px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(420px,calc(100vw - 24px));}
.toast{padding:7px 14px;border-radius:var(--rs);font-size:11px;background:var(--sf2);border:1px solid var(--br2);color:var(--tx);animation:mIn .15s ease;box-shadow:var(--ss);pointer-events:auto;white-space:nowrap}
.toast.ok{background:rgba(52,211,153,.15);border-color:var(--gn);color:var(--gn)}
.toast.err{background:rgba(248,113,113,.15);border-color:var(--rd);color:var(--rd)}
.undo-item{display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:var(--rs);font-size:11px;background:var(--sf2);border:1px solid var(--br2);color:var(--tx);animation:mIn .15s ease;box-shadow:var(--ss);pointer-events:auto;white-space:nowrap;max-width:min(380px,calc(100vw - 24px))}
.undo-lbl{flex:1;overflow:hidden;text-overflow:ellipsis;min-width:0}
.undo-cd{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border-radius:9px;background:var(--sf3);color:var(--tx3);font-size:9px;font-family:'DM Mono',monospace;flex-shrink:0;padding:0 3px;font-weight:600}
.undo-btn{background:transparent;border:1px solid var(--ac2);color:var(--ac2);padding:2px 9px;border-radius:4px;font-size:10px;cursor:pointer;flex-shrink:0;font-family:'DM Sans',sans-serif;transition:background .12s}
.undo-btn:hover{background:rgba(108,142,255,.15)}
body.light .undo-item{background:var(--sf2);border-color:var(--br2)}

.debug-toggle{position:fixed;bottom:calc(var(--fh) + 4px);left:6px;z-index:800;width:22px;height:22px;border-radius:5px;border:1px solid var(--br2);background:var(--sf2);color:var(--tx3);cursor:pointer;font-size:10px;opacity:0.5;display:flex;align-items:center;justify-content:center;transition:opacity .15s}
.debug-toggle:hover{opacity:1;color:var(--tx)}
.debug-panel{position:fixed;bottom:var(--fh);left:0;right:0;height:220px;background:#0a0c12;border-top:1px solid var(--br2);z-index:750;display:none;flex-direction:column}
.debug-panel.open{display:flex}
.debug-drag-handle{height:5px;background:var(--br);cursor:ns-resize;flex-shrink:0}
.debug-drag-handle:hover{background:var(--ac)}
.debug-hdr{display:flex;align-items:center;padding:4px 8px;border-bottom:1px solid var(--br);gap:8px;flex-shrink:0}
.debug-title{font-size:10px;color:var(--tx3);font-family:'DM Mono',monospace;flex:1}
.debug-acts{display:flex;gap:4px}
.debug-btn{padding:2px 8px;border-radius:4px;border:1px solid var(--br2);background:var(--sf3);color:var(--tx3);font-size:10px;cursor:pointer}
.debug-btn:hover{color:var(--tx)}
.debug-log{flex:1;overflow-y:auto;padding:4px 8px;font-family:'DM Mono',monospace;font-size:10px;line-height:1.6}
.debug-log::-webkit-scrollbar{width:4px}.debug-log::-webkit-scrollbar-thumb{background:var(--br2)}
.di{color:#8b92b8}.dok{color:#34d399}.de{color:#f87171}.dw{color:#fbbf24}
.debug-inp-row{display:flex;align-items:center;gap:6px;padding:4px 8px;border-top:1px solid var(--br);flex-shrink:0}
.debug-prompt{color:var(--ac);font-family:'DM Mono',monospace;font-size:11px}
.debug-cmd{flex:1;background:transparent;border:none;color:var(--tx);font-family:'DM Mono',monospace;font-size:11px;outline:none}

#nomsg{display:none;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:10px;color:var(--tx3);font-size:13px}

.pin-forgot{font-size:11px;color:var(--tx3);text-align:center;cursor:pointer;text-decoration:underline;transition:color .15s;margin-top:-8px;}
.pin-forgot:hover{color:var(--ac);}
.logout-btn{font-size:13px!important;}
.logout-btn:hover{color:var(--rd)!important;border-color:var(--rd)!important;}

/* ══════════════════════════════════════════
   V_21 (item #22): UNIFIED TASK MODAL — header layout, text-style dropdowns
   ══════════════════════════════════════════ */
.modal-title-row{display:flex;align-items:center;gap:8px;margin-bottom:14px;min-width:0;flex-wrap:nowrap}
.mtitle-main{font-size:14px;font-weight:700;color:var(--tx);white-space:nowrap;flex-shrink:0;letter-spacing:.01em}
.mtitle-meta{display:flex;align-items:center;gap:5px;flex:1;min-width:0;font-size:11px;overflow:hidden}
.mtitle-list,.mtitle-child{display:inline-flex;align-items:center;gap:4px;color:var(--tx3);cursor:pointer;padding:3px 7px;border-radius:5px;border:1px solid transparent;transition:all .12s;min-width:0;max-width:140px}
.mtitle-list:hover,.mtitle-child:hover{background:var(--sf3);border-color:var(--br2);color:var(--tx2)}
.mtitle-list-lbl,.mtitle-child-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mtitle-pipe{color:var(--tx3);flex-shrink:0;font-weight:300;opacity:.6}
.mtitle-caret{font-size:8px;color:var(--tx3);flex-shrink:0;margin-top:1px}
.mtitle-list:hover .mtitle-caret,.mtitle-child:hover .mtitle-caret{color:var(--ac)}
.mtitle-childof-prefix{color:var(--tx3);font-size:11px;flex-shrink:0;letter-spacing:.02em}
.modal-title-row .mclose{flex-shrink:0;margin-left:auto}

.prio-status-row{display:flex;align-items:center;gap:8px;font-size:12px;flex-wrap:wrap}
.ps-pri,.ps-stat{display:inline-flex;align-items:center;gap:6px;cursor:pointer;padding:5px 10px;border-radius:var(--rs);border:1px solid var(--br2);background:var(--sf3);transition:all .12s;color:var(--tx2);user-select:none}
.ps-pri:hover,.ps-stat:hover{border-color:var(--ac);color:var(--tx)}
.ps-caret{font-size:8px;color:var(--tx3);margin-left:3px}
.ps-pri:hover .ps-caret,.ps-stat:hover .ps-caret{color:var(--ac)}
.ps-pipe{color:var(--tx3);font-weight:300;opacity:.6}
.ps-dot{width:9px;height:9px;border-radius:50%;background:#555e88;flex-shrink:0;border:1.5px solid currentColor;background:transparent}
.ps-pri-icon{font-size:13px;line-height:1}

.tmodal-dd{position:fixed;background:var(--sf2);border:1px solid var(--br2);border-radius:var(--r);padding:4px;z-index:9500;box-shadow:var(--sh);min-width:200px;max-width:280px;max-height:280px;overflow-y:auto;display:none}
.tmodal-dd.open{display:block;animation:mIn .12s ease}
.tmodal-dd::-webkit-scrollbar{width:4px}.tmodal-dd::-webkit-scrollbar-thumb{background:var(--br2);border-radius:2px}
.tmodal-dd-item{display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:var(--rs);cursor:pointer;font-size:11px;color:var(--tx2);transition:background .1s,color .1s;user-select:none}
.tmodal-dd-item:hover{background:var(--sf3);color:var(--tx)}
.tmodal-dd-item.cur{background:rgba(108,142,255,.12);color:var(--tx);font-weight:600}
.tmodal-dd-item .tmodal-dd-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tmodal-dd-item .tmodal-dd-check{color:var(--ac);font-size:10px;flex-shrink:0}
.tmodal-dd-sep{height:1px;background:var(--br);margin:3px 4px}

.subtask-pending{display:flex;flex-direction:column;gap:5px;margin-top:5px}
.subtask-pending-row{display:flex;align-items:center;gap:6px}
.subtask-pending-row .finput{flex:1;font-size:12px;padding:5px 8px}
.subtask-pending-del{background:none;border:none;color:var(--tx3);cursor:pointer;font-size:13px;padding:3px 6px;border-radius:3px;transition:color .12s,background .12s}
.subtask-pending-del:hover{color:var(--rd);background:rgba(248,113,113,.08)}

#fabAdd{position:fixed;bottom:calc(var(--fh) + 16px + env(safe-area-inset-bottom));right:max(16px,env(safe-area-inset-right));z-index:900;width:56px;height:56px;border-radius:50%;border:none;background:var(--ac);color:#fff;font-size:30px;font-weight:300;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(108,142,255,.45),0 2px 6px rgba(0,0,0,.35);transition:transform .15s,box-shadow .15s,background .15s;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent;}
#fabAdd:hover{background:var(--ac2);transform:scale(1.08);box-shadow:0 6px 20px rgba(108,142,255,.55),0 2px 8px rgba(0,0,0,.4);}
#fabAdd:active{transform:scale(.94);box-shadow:0 2px 8px rgba(108,142,255,.35);}
body.light #fabAdd{box-shadow:0 4px 16px rgba(79,107,219,.4),0 2px 6px rgba(0,0,0,.15);}

/* ══════════════════════════════════════════
   V_25 (item #12): UNSAVED CHANGES INLINE BAR
   ══════════════════════════════════════════ */
.modal-unsaved-bar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.35);border-radius:var(--rs);margin:0 0 8px;animation:mIn .15s ease;flex-wrap:wrap}
.unsaved-msg{font-size:11px;color:var(--yw);flex:1;white-space:nowrap;font-weight:500}
.unsaved-actions{display:flex;gap:6px;flex-shrink:0}
.unsaved-keep{padding:4px 12px;font-size:11px}
.unsaved-discard{padding:4px 12px;font-size:11px}
body.light .modal-unsaved-bar{background:rgba(180,130,0,.08);border-color:rgba(180,130,0,.3)}

@media(max-width:768px){
  :root{--hh:44px;--fh:44px;}
  header{padding:0;gap:0}
  .hdr-scroll{padding:0 6px;padding-left:max(6px,min(env(safe-area-inset-left),10px));padding-right:max(6px,min(env(safe-area-inset-right),10px));gap:4px}
  .logo-name{font-size:11px;}
  .logo-ver{padding-left:20px;}
  .hd{display:none;}
  .dd-btn{font-size:10px;padding:3px 6px;}
  .search-wrap{width:120px;height:22px}
  #searchInp{font-size:10px}
  main{padding:5px 3px;padding-left:max(3px,min(env(safe-area-inset-left),8px));padding-right:max(3px,min(env(safe-area-inset-right),8px));}
  .cw.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .cw.scroll .col{min-width:280px;max-width:280px}
  .cw.scroll .col-collapsed{min-width:32px;width:32px}
  .cw.fit{gap:3px}
  .cw.fit .col{flex:1 1 0;min-width:0;max-width:none}
  .cw.fit .col-collapsed{flex:0 0 28px;width:28px;min-width:28px}
  .cw.fit .col-hdr{padding:5px 4px 3px;gap:3px}
  .cw.fit .col-title{font-size:9px;letter-spacing:.03em}
  .cw.fit .col-cnt{font-size:9px;padding:1px 3px}
  .cw.fit .col-add,.cw.fit .col-collapse-btn{width:14px;height:14px;font-size:10px}
  .cw.fit .col-overdue{font-size:8px;padding:1px 3px}
  .cw.fit .tlist{padding:2px}
  .cw.fit .trow{padding:2px 3px;gap:3px;min-height:22px}
  .cw.fit .tname{font-size:10px}
  .cw.fit .pflag-col{width:12px}
  .cw.fit .pflag{width:12px;height:12px;font-size:10px}
  .cw.fit .dbadge{font-size:8px;padding:0 3px}
  .cw.fit .av{width:12px;height:12px;font-size:6px}
  .cw.fit .subtask-badge{font-size:8px;padding:0 3px}
  .cw.fit .sc{width:12px;height:12px}
  footer{padding:0 6px;padding-left:max(6px,min(env(safe-area-inset-left),10px));padding-right:max(6px,min(env(safe-area-inset-right),10px));}
  .fstat{padding:0 4px;}
  .fstat-lbl{font-size:9px;}
  .fstat-n{font-size:14px;}
  .pin-key{height:62px;font-size:22px;}
  .modal{width:95vw!important;max-width:95vw!important;margin:0;max-height:90vh;overflow-y:auto;}
  .overlay{align-items:flex-end;padding-bottom:calc(env(safe-area-inset-bottom) + 4px);}
  .sdrawer{width:94vw;}
  .cc-spinner{top:calc(var(--hh) + 4px);padding:5px 10px 5px 8px;}
  .cc-spinner-lbl{font-size:10px;}
  .ssec-grid-2{grid-template-columns:1fr 1fr;gap:10px}
}

@media(max-width:926px) and (orientation:landscape){
  .hdr-scroll{padding-left:max(4px,min(env(safe-area-inset-left),6px));padding-right:max(4px,min(env(safe-area-inset-right),6px));}
  main{padding-left:max(2px,min(env(safe-area-inset-left),4px));padding-right:max(2px,min(env(safe-area-inset-right),4px));}
  footer{padding-left:max(4px,min(env(safe-area-inset-left),6px));padding-right:max(4px,min(env(safe-area-inset-right),6px));}
}

@media(max-width:480px){
  .dd-btn span.dd-caret{display:none;}
  #dueBtnLbl,#grpBtnLbl,#sortBtnLbl{max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .search-wrap{width:90px}
}

/* CommandCenter | style.css | V_30 */