/* Geist, served from this site (no Google Fonts request). SIL Open Font License: fonts/OFL.txt */
@font-face{font-family:"Geist";font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/geist-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist";font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/geist-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --paper:#FAFAF8;--panel:#FFFFFF;--ink:#1D1D1F;--muted:#86868B;--faint:#B8B8BD;--line:#E9E8E4;--line-2:#F1F0EC;
  --hover:#F4F3F0;--sel:#F2F1FE;--fixed-ink:#1D1D1F;
  --work:#4B5BD7;--life:#C8507E;
  --st-idea:#9B7FE0;--st-todo:#A9A9B0;--st-doing:#3E8FE0;--st-blocked:#E0603F;--st-done:#3FA884;
  --sun:#E3A33B;--violet-c:var(--accent);
  --accent:var(--work);--accent-soft:#EEF0FC;--on-accent:#FFFFFF;
  --shadow-s:0 1px 2px rgba(20,20,30,.04);
  --shadow-m:0 8px 30px -12px rgba(20,20,30,.18);
  --r:12px;--t:160ms;
  --display:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --body:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#111113;--panel:#1A1A1D;--ink:#EDEDEF;--muted:#8E8E93;--faint:#5A5A60;--line:#2A2A2E;--line-2:#222225;
  --hover:#232327;--sel:#24253A;--work:#8692F0;--life:#E07BA2;--accent-soft:#22243A;--on-accent:#111113;
  --shadow-s:none;--shadow-m:0 10px 30px -10px rgba(0,0,0,.6);color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#111113;--panel:#1A1A1D;--ink:#EDEDEF;--muted:#8E8E93;--faint:#5A5A60;--line:#2A2A2E;--line-2:#222225;
  --hover:#232327;--sel:#24253A;--work:#8692F0;--life:#E07BA2;--accent-soft:#22243A;--on-accent:#111113;
  --shadow-s:none;--shadow-m:0 10px 30px -10px rgba(0,0,0,.6);color-scheme:dark}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}
body{height:100%;margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 var(--body);-webkit-font-smoothing:antialiased;overflow:hidden;-webkit-tap-highlight-color:transparent;font-feature-settings:"tnum" 0}
body[data-space="life"]{--accent:var(--life);--accent-soft:#FBEFF4}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body[data-space="life"]{--accent-soft:#33202A}}
:root[data-theme="dark"] body[data-space="life"]{--accent-soft:#33202A}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
.app{height:100%;width:100%;display:grid;grid-template-rows:auto 1fr auto auto;grid-template-columns:minmax(0,1fr);max-width:1000px;margin:0 auto}
.app > *{min-width:0}
.geo,.geo2,.hero-shapes{display:none!important}
.pop-btn{transition:background var(--t),color var(--t)}

/* Header */
.top{padding:14px 20px 4px;display:grid;gap:14px}
.row1{display:flex;align-items:center;gap:6px}
.space{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--line-2);border-radius:10px;padding:3px;width:148px}
.space button{position:relative;z-index:1;padding:5px 0;font:500 14px var(--body);border-radius:8px;color:var(--muted);transition:color var(--t)}
.space button[aria-selected="true"]{color:var(--ink)}
.space .thumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);background:var(--panel);border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.08);transition:transform .22s ease}
body[data-space="life"] .space .thumb{transform:translateX(100%);width:calc(50% - 3px)}
.sync{width:6px;height:6px;border-radius:50%;background:var(--faint);margin:0 6px 0 auto;flex:0 0 auto}
.sync[data-s="cloud"]{background:var(--st-done)}
.sync[data-s="error"]{background:var(--st-blocked)}
.today-btn{font:500 14px var(--body);padding:6px 10px;border-radius:8px;color:var(--accent)}
.today-btn:hover{background:var(--hover)}
.row2{display:flex;align-items:center;gap:2px}
.row2 h1{font:600 24px/1.2 var(--display);margin:0;flex:1;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;color:var(--muted);flex:0 0 auto}
.nav:hover{background:var(--hover);color:var(--ink)}
.nav svg{width:16px;height:16px}
.row3{display:flex;gap:6px;align-items:center;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:2px 20px 8px}
.row3::-webkit-scrollbar{display:none}
.seg{display:flex;background:var(--line-2);border-radius:9px;padding:2px;flex:0 0 auto;margin-right:6px}
.seg button{padding:4px 12px;border-radius:7px;font:500 13px var(--body);color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.fchip{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font:500 13px var(--body);color:var(--muted);white-space:nowrap}
.fchip:hover{background:var(--hover)}
.fchip[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

/* Main */
main{min-height:0;min-width:0;position:relative;overflow:hidden}
.scroll{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 20px 140px}

.wgoal{margin:4px 20px 18px;display:flex;align-items:baseline;gap:12px;padding:0 0 14px;border-bottom:1px solid var(--line)}
.wgoal .wk{flex:0 0 auto;font:500 12px/1 var(--body);color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.wgoal textarea{flex:1;border:0;background:transparent;resize:none;font:500 16px/1.4 var(--body);padding:0;min-height:22px;outline:none;color:var(--ink)}
.wgoal textarea::placeholder{color:var(--faint)}

.board{height:100%;display:flex;flex-direction:column}
.lanes{flex:1;min-height:0;display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 20px;scrollbar-width:none;overscroll-behavior-x:contain}
.lanes::-webkit-scrollbar{display:none}
.lanes.dragging{scroll-snap-type:none}
.lane{position:relative;flex:0 0 100%;scroll-snap-align:center;display:flex;flex-direction:column;min-height:0;border-radius:14px;transition:background var(--t)}
.zoom-week .lane{flex-basis:min(70%,250px);scroll-snap-align:start}
.zoom-week .lanes{gap:16px}
.lane.over{background:var(--accent-soft)}
.lane-in{flex:1;overflow-y:auto;padding:0 2px 140px;overscroll-behavior:contain}
.lhead{display:flex;align-items:baseline;gap:8px;padding:2px 2px 16px}
.lhead .wd{font:600 17px var(--display);letter-spacing:-.01em}
.zoom-week .lhead .wd{font-size:15px}
.lhead .dt{font:400 15px var(--body);color:var(--muted)}
.lhead .tmark{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font:500 13px var(--body);color:var(--accent)}
.lhead .tmark svg{display:none}
.lhead .tmark::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}

.goal{position:relative;padding:2px 0 2px 14px;margin:0 0 22px;border-left:2px solid var(--accent)}
.goal small{display:block;font:500 12px var(--body);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px}
.goal textarea{display:block;width:100%;border:0;background:transparent;resize:none;outline:none;font:500 19px/1.35 var(--display);letter-spacing:-.01em;color:var(--ink);padding:0;min-height:26px}
.goal textarea::placeholder{color:var(--faint)}
.zoom-week .goal{margin-bottom:16px;padding-left:10px}
.zoom-week .goal textarea{font-size:16px}

.list{display:grid;gap:8px;min-height:12px}
.card{position:relative;display:flex;align-items:flex-start;gap:12px;padding:13px 4px 13px 14px;background:var(--panel);border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--shadow-s);transition:border-color var(--t)}
.card:hover{border-color:var(--faint)}
.card.st-done{background:transparent;box-shadow:none}
.card.st-done .title{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--faint)}
.card.st-blocked{border-color:color-mix(in srgb,var(--st-blocked) 35%,var(--line))}
.check{flex:0 0 auto;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--faint);display:grid;place-items:center;margin-top:1px;transition:background var(--t),border-color var(--t),transform var(--t)}
.check:hover{border-color:var(--pc,var(--accent))}
.check svg{width:11px;height:11px;opacity:0}
.check.on{background:var(--pc,var(--st-done));border-color:var(--pc,var(--st-done))}
.check.on svg{opacity:1;color:var(--fixed-ink)}
.check.pop{animation:pop .25s ease-out}
@keyframes pop{50%{transform:scale(1.15)}}
.cbody{flex:1;min-width:0;text-align:left}
.cbody .parent{font:400 13px var(--body);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:1px}
.cbody .title{font:500 15.5px/1.4 var(--body);overflow-wrap:anywhere}
.zoom-week .cbody .title{font-size:14.5px}
.meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:6px}
.meta:empty{display:none}
.ptag,.chip,.stp{display:inline-flex;align-items:center;gap:5px;font:400 13px/1.2 var(--body);color:var(--muted);white-space:nowrap}
.ptag svg,.stp svg,.chip svg{width:8px;height:8px}
.stp{color:var(--sc)}
.grip{flex:0 0 auto;width:26px;height:30px;display:grid;place-items:center;color:var(--faint);touch-action:none;cursor:grab;opacity:.7}
.grip svg{width:10px;height:15px}
.card.ghost{position:fixed;z-index:50;pointer-events:none;box-shadow:var(--shadow-m)}
.card.placeholder{background:transparent;border:1.5px dashed var(--faint);box-shadow:none}
.card.placeholder > *{visibility:hidden}
.card.ghost{transition:none;will-change:transform;cursor:grabbing}
.list:has(.card) > .empty{display:none}
body.is-dragging,body.is-dragging *{-webkit-user-select:none;user-select:none;cursor:grabbing}
.card,.grip{-webkit-touch-callout:none}
.grip{-webkit-user-select:none;user-select:none}
.qadd{width:100%;margin-top:8px;border:0;border-radius:var(--r);background:transparent;padding:11px 14px;font:400 16px var(--body);outline:none;color:var(--ink)}
.qadd::placeholder{color:var(--faint)}
.qadd:hover{background:var(--hover)}
.qadd:focus{background:var(--panel);box-shadow:0 0 0 1px var(--line)}
.sect{display:flex;align-items:center;gap:8px;margin:26px 2px 10px;font:500 13px var(--body);color:var(--muted)}
.sect svg{width:8px;height:8px}
.sect .n{color:var(--faint)}
.empty{color:var(--faint);font-size:15px;padding:4px 14px}

/* Month */
.mgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.mwd{font:500 12px var(--body);color:var(--muted);text-align:center;padding:4px 0 8px}
.mcell{aspect-ratio:1/1.1;min-height:44px;border-radius:10px;padding:6px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;transition:background var(--t)}
.mcell:hover{background:var(--hover)}
.mcell.out{opacity:.3}
.mcell.blank{pointer-events:none}
/* Roadmap */
.rm{--lw:118px;height:100%;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;position:relative}
.rm-canvas{position:relative;min-height:100%;padding-bottom:140px}
.rm-head{position:sticky;top:0;z-index:6;display:flex;background:var(--paper);border-bottom:1px solid var(--line)}
.rm-corner{position:sticky;left:0;z-index:2;flex:0 0 var(--lw);background:var(--paper);border-right:1px solid var(--line)}
.rm-scale{position:relative;flex:0 0 auto;height:46px}
.rm-scale .mo{position:absolute;top:8px;font:500 13px var(--body);color:var(--ink);white-space:nowrap;padding-left:6px}
.rm-scale .mo small{color:var(--muted);font-weight:400;margin-left:4px}
.rm-scale .wk{position:absolute;top:28px;font:400 11px var(--body);color:var(--faint);padding-left:4px}
.rm-scale .tdy{position:absolute;bottom:-1px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:var(--accent);transform:translateY(50%)}
.rm-body{position:relative}
.rm-lines{position:absolute;top:0;bottom:0;left:var(--lw);pointer-events:none;z-index:0}
.rm-lines .ml{position:absolute;top:0;bottom:0;border-left:1px solid var(--line)}
.rm-lines .wl{position:absolute;top:0;bottom:0;border-left:1px dashed var(--line-2)}
.rm-lines .now{position:absolute;top:0;bottom:0;border-left:1.5px solid var(--accent);opacity:.8}
.rm-row{display:flex;position:relative;border-bottom:1px solid var(--line-2)}
.rm-label{position:sticky;left:0;z-index:4;flex:0 0 var(--lw);background:var(--paper);border-right:1px solid var(--line);padding:10px 10px 10px 14px;display:flex;align-items:flex-start;gap:8px;min-width:0;text-align:left}
.rm-label .nm{font:500 14px/1.3 var(--body);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.rm-label .dot{width:8px;height:8px;border-radius:50%;background:var(--pc);flex:0 0 auto;margin-top:5px}
.rm-label .sq{width:10px;height:10px;border-radius:3px;background:var(--pc);flex:0 0 auto;margin-top:2px}
.rm-row.ghead{border-bottom:0}
.rm-row.ghead .rm-label{padding:16px 10px 4px 14px;font:500 12px var(--body);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;align-items:center}
.rm-row.ghead .rm-track{cursor:default}
.rm-row.ghead .rm-label{cursor:pointer;width:var(--lw)}
.rm-row.ghead .rm-label small{margin-left:auto;font-weight:400;letter-spacing:0;color:var(--faint)}
.rm-row.ghead .chev{width:12px;height:12px;flex:0 0 auto;transition:transform var(--t)}
.rm-row.ghead.closed .chev{transform:rotate(-90deg)}
.rm-row.ghead.closed{border-bottom:1px solid var(--line-2)}
.rm-track.sum{min-height:30px}
.rm-track.sum .sm{position:absolute;top:50%;height:4px;margin-top:2px;border-radius:2px;background:var(--pc);opacity:.7}
.rm-track.sum .sm.ms{width:7px;height:7px;margin-top:0;margin-left:-3.5px;transform:rotate(45deg);border-radius:1px}
.rm-row.drop{background:var(--hover)}
.rm-row.drop .rm-label{background:var(--hover)}
.rm-track{position:relative;flex:0 0 auto;cursor:copy;touch-action:pan-x pan-y}
.rm-bar{position:absolute;height:28px;border-radius:7px;background:var(--panel);border:1px solid var(--line);box-shadow:inset 3px 0 0 var(--pc),var(--shadow-s);display:flex;align-items:center;gap:6px;padding:0 8px 0 11px;font:500 13px var(--body);color:var(--ink);white-space:nowrap;overflow:hidden;cursor:pointer;z-index:1;touch-action:pan-x pan-y;-webkit-user-select:none;user-select:none}
.rm-bar .t{overflow:hidden;text-overflow:ellipsis;min-width:0}
.rm-bar .st{width:6px;height:6px;border-radius:50%;flex:0 0 auto;background:var(--st-doing)}
.rm-bar .pg{position:absolute;left:3px;bottom:0;height:2px;background:var(--pc);border-radius:0 2px 0 0}
.rm-bar.done{color:var(--muted);background:transparent;box-shadow:inset 3px 0 0 var(--pc)}
.rm-bar.done .t{text-decoration:line-through;text-decoration-color:var(--faint)}
.rm-bar.sel{border-color:var(--ink);box-shadow:inset 3px 0 0 var(--pc),0 0 0 1px var(--ink),var(--shadow-m);z-index:3;touch-action:none;cursor:grab;overflow:visible}
.rm-bar .hd{position:absolute;top:50%;width:18px;height:34px;margin-top:-17px;display:grid;place-items:center;cursor:ew-resize;touch-action:none}
.rm-bar .hd::after{content:"";width:4px;height:16px;border-radius:2px;background:var(--ink)}
.rm-bar .hd.l{left:-10px}.rm-bar .hd.r{right:-10px}
.rm-ms{position:absolute;height:28px;display:flex;align-items:center;gap:7px;font:500 13px var(--body);white-space:nowrap;cursor:pointer;z-index:1;margin-left:-7px;padding-right:6px;touch-action:pan-x pan-y;-webkit-user-select:none;user-select:none}
.rm-ms i{width:11px;height:11px;transform:rotate(45deg);background:var(--pc);border-radius:2px;flex:0 0 auto;margin-left:1.5px}
.rm-ms.done{color:var(--muted)}
.rm-ms.done i{background:transparent;box-shadow:inset 0 0 0 2px var(--pc)}
.rm-ms.sel{z-index:3;touch-action:none;cursor:grab}
.rm-ms.sel span{box-shadow:0 0 0 1px var(--ink);border-radius:5px;padding:2px 5px;background:var(--panel)}
.rm-hint{position:sticky;left:0;padding:14px 16px 0;color:var(--muted);font-size:14px;max-width:min(560px,100vw)}
.ptasks{display:grid;gap:4px}
.ptasks button{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;text-align:left;font:400 15px var(--body);color:var(--ink)}
.ptasks button:hover{background:var(--hover)}
.ptasks button i{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--faint);flex:0 0 auto;display:grid;place-items:center}
.ptasks button[aria-pressed="true"] i{background:var(--ink);border-color:var(--ink)}
.ptasks button[aria-pressed="true"] i::after{content:"";width:8px;height:4px;border-left:2px solid var(--paper);border-bottom:2px solid var(--paper);transform:rotate(-45deg) translate(1px,-1px)}
.ptasks button.isdone span{color:var(--muted);text-decoration:line-through}
@media (min-width:760px){.rm{--lw:190px}}
.mscroll{padding-top:0}
.mwdrow{position:sticky;top:0;z-index:3;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;background:var(--paper);padding-top:8px;border-bottom:1px solid var(--line-2)}
.mblock{padding-top:6px}
.mhead{font:600 20px/1.2 var(--display, var(--body));letter-spacing:-.01em;margin:18px 6px 10px}
.mblock:first-child .mhead{margin-top:10px}
.mcell .n{font:500 14px var(--body)}
.mcell.is-today .n{color:var(--accent);font-weight:600}
.mcell > svg{display:none}
.mcell .dots{display:flex;flex-wrap:wrap;gap:3px;margin-top:auto}
.mcell .dots svg{width:6px;height:6px}
.mcell .cnt{font:400 11px var(--body);color:var(--faint)}
.mweek{grid-column:1/-1;display:flex;gap:8px;align-items:center;padding:4px 6px 14px;margin-bottom:8px;font:400 13px var(--body);color:var(--faint);text-align:left;width:100%;border-bottom:1px solid var(--line-2)}
.mweek svg{display:none}
.mweek b{font-weight:500;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Schedule */
.sched{height:100%;display:flex;flex-direction:column}
.strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;padding:0 20px 14px}
.sday{display:grid;justify-items:center;gap:3px;padding:6px 0;border-radius:10px;font:500 12px var(--body);color:var(--muted)}
.sday:hover{background:var(--hover)}
.sday b{font:500 16px var(--body);color:var(--ink)}
.sday[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.sday[aria-pressed="true"] b{color:var(--paper)}
.sday i{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.6}
.sday i.none{opacity:0}
.tlwrap{flex:1;min-height:0;overflow:auto;margin:0 12px 0 8px;padding:0 0 140px;overscroll-behavior:contain}
.tlgrid{position:relative;min-width:100%}
.szoom-week .tlgrid{min-width:calc(46px + 7 * 112px)}
.tlhead{position:sticky;top:0;z-index:9;display:grid;grid-template-columns:46px repeat(var(--n),minmax(0,1fr));background:var(--paper);border-bottom:1px solid var(--line)}
.tlhead .corner{position:sticky;left:0;z-index:1;background:var(--paper)}
.colh{display:flex;align-items:baseline;justify-content:center;gap:5px;padding:8px 4px;font:500 13px var(--body);color:var(--muted)}
.colh b{font:500 15px var(--body);color:var(--ink)}
.colh.is-today,.colh.is-today b{color:var(--accent)}
.tlbody{position:relative;display:grid;grid-template-columns:46px repeat(var(--n),minmax(0,1fr));margin-top:14px}
.gutter{position:sticky;left:0;z-index:6;background:var(--paper)}
.gutter span{position:absolute;right:8px;transform:translateY(-50%);font:400 11.5px var(--body);color:var(--faint);white-space:nowrap}
.tlcol{position:relative;border-left:1px solid var(--line-2);background-image:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px var(--h))}
.szoom-day .tlcol{border-left:0}
.tlcol.is-today{background-color:transparent}
.nowl{position:absolute;left:0;right:0;border-top:1.5px solid var(--st-blocked);z-index:6;pointer-events:none}
.nowl::before{content:"";position:absolute;left:-4px;top:-4.5px;width:8px;height:8px;border-radius:50%;background:var(--st-blocked)}
.block{position:absolute;z-index:3;border-radius:8px;padding:5px 8px 5px 10px;overflow:hidden;background:color-mix(in srgb,var(--bc) 13%,var(--panel));border-left:3px solid var(--bc);text-align:left;font-size:13px;color:var(--ink)}
.block .bt{font:500 13.5px/1.3 var(--body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.block .btime{font:400 12px var(--body);color:var(--muted)}
.block ul{list-style:none;margin:5px 0 0;padding:0;display:grid;gap:3px}
.block li{display:flex;align-items:center;gap:6px;font:400 13px var(--body)}
.block li .check{width:15px;height:15px;border-width:1.5px}
.block li .check svg{width:8px;height:8px}
.block li.done span{text-decoration:line-through;color:var(--muted)}
.block.sel{z-index:7;box-shadow:0 0 0 1.5px var(--bc),var(--shadow-m);touch-action:none;cursor:grab}
.block.moving{z-index:12;cursor:grabbing;opacity:.95}
.szoom-week .block{padding:4px 5px 4px 7px}
.szoom-week .block .bt{font-size:12px;white-space:normal;overflow-wrap:anywhere}
.szoom-week .block ul{display:none}
.bh{position:absolute;left:50%;width:44px;height:20px;margin-left:-22px;display:grid;place-items:center;touch-action:none;cursor:ns-resize}
.bh::after{content:"";width:24px;height:4px;border-radius:2px;background:var(--bc)}
.bh.mv{top:0;cursor:move}
.bh.sz{bottom:0}
.ghostblk{position:absolute;z-index:2;border-radius:8px;padding:4px 8px;font:400 12px var(--body);color:var(--faint);pointer-events:none;background:var(--line-2)}
.flash{animation:pop .4s ease-out}

/* Projects */
.pgroup{margin:28px 2px 12px;display:flex;align-items:center;gap:8px;font:500 13px var(--body);color:var(--muted)}
.pgroup:first-child{margin-top:8px}
.pgroup span{color:var(--faint)}
.pgroup svg{width:8px;height:8px}
.proj{background:var(--panel);border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow-s);margin:0 0 10px}
.phead{display:flex;align-items:center;gap:14px;padding:16px;width:100%;text-align:left}
.pbadge{width:10px;height:10px;display:grid;place-items:center;flex:0 0 auto;align-self:flex-start;margin-top:7px}
.pbadge svg{width:10px;height:10px}
.pname{font:600 16px/1.3 var(--display);letter-spacing:-.01em}
.psub{display:flex;gap:4px 12px;align-items:center;margin-top:4px;flex-wrap:wrap}
.pbar{height:3px;border-radius:2px;background:var(--line-2);overflow:hidden;margin-top:12px}
.pbar i{display:block;height:100%;background:var(--pc)}
.pbody{padding:0 16px 14px}
.trow{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-top:1px solid var(--line-2)}
.trow.sub{padding-left:30px}
.trow .check{width:18px;height:18px}
.trow button.tt{flex:1;text-align:left;min-width:0}
.trow .tt span{display:block;font:400 15px/1.4 var(--body);overflow-wrap:anywhere}
.trow.st-done .tt span{text-decoration:line-through;color:var(--muted)}
.trow .tm{display:flex;gap:4px 12px;margin-top:3px;flex-wrap:wrap}
.trow .tm:empty{display:none}
.pacts{display:flex;gap:8px;margin-top:10px}
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:10px;font:500 15px var(--body);background:var(--line-2);color:var(--ink);transition:background var(--t),opacity var(--t)}
.btn:hover{background:var(--line)}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{opacity:.88}
.btn.danger{background:transparent;color:var(--st-blocked);padding-left:4px}
.btn.ghost{background:transparent;color:var(--muted);padding-left:4px}
.btn.ghost:hover{color:var(--ink)}
.hero-empty{display:grid;justify-items:start;gap:12px;padding:40px 2px}
.hero-empty h2{font:600 22px/1.25 var(--display);margin:0;letter-spacing:-.02em;max-width:18ch}
.hero-empty p{margin:0 0 6px;color:var(--muted);max-width:34ch;line-height:1.6}

/* Tabs, FAB */
.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:6px 84px 8px 8px;background:var(--paper);border-top:1px solid var(--line);position:relative;z-index:10}
.tabs button{display:grid;justify-items:center;gap:2px;padding:5px 0;font:500 11px var(--body);color:var(--faint);transition:color var(--t)}
.tabs svg{width:22px;height:22px;stroke-width:1.7}
.tabs button[aria-current="page"]{color:var(--ink)}
.fab{position:fixed;right:max(18px,calc(50% - 482px));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:11;width:52px;height:52px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;box-shadow:0 6px 16px -6px var(--accent);transition:transform var(--t)}
.fab:active{transform:scale(.94)}
.fab svg{width:22px;height:22px;stroke-width:2.2}

/* Sheet */
.sheet-wrap{position:fixed;inset:0;z-index:40}
.sheet-wrap[hidden]{display:none}
.scrim{position:absolute;inset:0;background:rgba(10,10,15,.28);opacity:0;transition:opacity .22s}
.sheet{position:absolute;left:0;right:0;bottom:0;max-width:600px;margin:0 auto;max-height:90%;overflow-y:auto;background:var(--paper);border-radius:20px 20px 0 0;padding:6px 22px calc(26px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .26s cubic-bezier(.2,.9,.3,1);overscroll-behavior:contain;box-shadow:var(--shadow-m)}
.sheet-wrap.open .scrim{opacity:1}
.sheet-wrap.open .sheet{transform:none}
.grab{width:36px;height:4px;border-radius:2px;background:var(--line);margin:6px auto 18px}
.sheet h3{font:600 20px/1.2 var(--display);letter-spacing:-.015em;margin:0 0 20px}
.sheet-head{position:sticky;top:-6px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 -22px 20px;padding:6px 22px 12px;background:var(--paper)}
.sheet-head h3{margin:0;min-width:0}
.sheet-head .btn{flex:0 0 auto}
@media (max-width:420px){.sheet-head{margin:0 -18px 18px;padding:6px 18px 12px}}
.field{margin-bottom:22px}
.field > span{display:block;font:500 13px var(--body);color:var(--muted);margin-bottom:8px}
.inp{width:100%;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:11px 12px;font:400 16px var(--body);outline:none;transition:border-color var(--t)}
.inp:focus{border-color:var(--accent)}
textarea.inp{resize:vertical;min-height:80px;line-height:1.5}
.inp.big{font:500 20px var(--display);letter-spacing:-.01em;border:0;background:transparent;padding:0 0 10px;border-radius:0;border-bottom:1px solid var(--line)}
.inp.big:focus{border-color:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font:400 14px var(--body);background:var(--panel);border:1px solid var(--line);color:var(--ink)}
.chips button svg{width:8px;height:8px}
.chips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.swatches{display:flex;flex-wrap:wrap;gap:12px}
.swatches button{width:28px;height:28px;border-radius:50%;background:var(--c)}
.swatches button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--paper),0 0 0 3.5px var(--c)}
.shapes button{width:40px;height:40px;border-radius:10px;padding:0;justify-content:center}
.shapes button svg{width:16px;height:16px}
.shapes button[aria-pressed="true"]{background:var(--sel);border-color:var(--accent);color:var(--ink)}
.timepair{display:flex;gap:10px;align-items:center;color:var(--muted)}
.timepair .inp{flex:1;min-width:0}
input[type="date"].inp,input[type="time"].inp{-webkit-appearance:none;appearance:none;display:block;min-width:0;max-width:100%;min-height:46px;text-align:left}
input.inp::-webkit-date-and-time-value{text-align:left}
.linklist{display:grid;gap:2px;max-height:260px;overflow-y:auto}
.linkrow{display:flex;align-items:center;gap:12px;padding:10px 10px;border-radius:10px;text-align:left;width:100%;font:400 15px var(--body)}
.linkrow:hover{background:var(--hover)}
.linkrow svg{width:8px;height:8px;flex:0 0 auto}
.linkrow[aria-pressed="true"]{background:var(--sel)}
.linkrow .box{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--faint);display:grid;place-items:center;flex:0 0 auto}
.linkrow .box svg{width:11px;height:11px;opacity:0}
.linkrow[aria-pressed="true"] .box{background:var(--accent);border-color:var(--accent);color:#fff}
.linkrow[aria-pressed="true"] .box svg{opacity:1}
.linkrow small{color:var(--muted);margin-left:auto;white-space:nowrap;font-size:13px}
.sheet-actions{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-top:8px}
.subl{display:grid;gap:2px}
.subl .linkrow .check{width:18px;height:18px}
.subl .linkrow .check svg{width:10px;height:10px}

.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translate(-50%,10px);opacity:0;z-index:60;background:var(--ink);color:var(--paper);padding:10px 8px 10px 16px;border-radius:12px;display:flex;gap:10px;align-items:center;font:400 14px var(--body);transition:.2s;pointer-events:none;white-space:nowrap;max-width:calc(100% - 32px);box-shadow:var(--shadow-m)}
.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast button{font-weight:600;color:var(--paper);padding:4px 8px;opacity:.85}
#toastMsg{overflow:hidden;text-overflow:ellipsis}

/* Timer */
.timerbar{display:flex;align-items:center;gap:12px;margin:0 80px 10px 16px;padding:8px 8px 8px 14px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-m);position:relative;z-index:11}
.timerbar[hidden]{display:none}
.tdot{width:8px;height:8px;border-radius:50%;background:var(--st-blocked);flex:0 0 auto;animation:blink 2s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
.tinfo{flex:1;min-width:0;text-align:left;display:grid;color:var(--ink)}
.tinfo b{font:500 17px/1.2 var(--body);font-variant-numeric:tabular-nums}
.tinfo span{display:flex;align-items:center;gap:6px;font:400 13px var(--body);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tinfo svg{width:7px;height:7px;flex:0 0 auto}
.tstop{padding:8px 12px;flex:0 0 auto;font-size:14px}
.tstop svg{width:9px;height:9px}
.timer-fab{position:fixed;right:max(24px,calc(50% - 476px));bottom:calc(80px + env(safe-area-inset-bottom,0px));z-index:11;width:40px;height:40px;border-radius:50%;background:var(--panel);color:var(--ink);display:grid;place-items:center;border:1px solid var(--line);box-shadow:var(--shadow-m)}
.timer-fab[hidden]{display:none}
.timer-fab svg{width:20px;height:20px;stroke-width:1.8}
.tchip svg{width:11px!important;height:11px!important}
.tchip.run{color:var(--st-blocked)}
.tchip.over{color:var(--st-blocked)}
.timegrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.timegrid label{display:grid;gap:6px;font:400 13px var(--body);color:var(--muted)}
.actual{border-radius:10px;padding:11px 12px;font:500 16px var(--body);color:var(--ink);min-height:46px;background:var(--line-2)}
.logrow{display:flex;gap:8px;margin-top:10px}
.logrow .inp{flex:1;min-width:0}
.wide{width:100%;justify-content:center;margin-top:10px}

/* Stats */
.stat-hero{padding:8px 2px 0;margin:0 0 8px}
.stat-hero .big{font:600 52px/1 var(--display);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.stat-hero .cap{margin-top:8px;color:var(--muted);font-size:15px;max-width:32ch;line-height:1.5}
.chartwrap{position:relative;padding:30px 0 28px}
.chart{display:flex;align-items:flex-end;gap:8px;height:140px;border-bottom:1px solid var(--line)}
.chart.month{gap:3px}
.ymax{position:absolute;top:6px;left:0;font:400 12px var(--body);color:var(--faint)}
.chart::before{content:"";position:absolute;left:0;right:0;top:30px;border-top:1px dashed var(--line)}
.bar{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.bar .stack{display:flex;flex-direction:column-reverse;border-radius:5px 5px 0 0;overflow:hidden;gap:1px}
.bar .stack i{display:block;min-height:2px}
.chart.month .stack{border-radius:3px 3px 0 0}
.bar small{position:absolute;bottom:-24px;left:-6px;right:-6px;text-align:center;font:400 12px var(--body);color:var(--faint)}
.bar.is-today small{color:var(--accent);font-weight:600}
.srow{border-bottom:1px solid var(--line)}
.shead{display:flex;align-items:center;gap:12px;width:100%;padding:14px 2px 8px;text-align:left}
.shead svg{flex:0 0 auto;width:8px;height:8px}
.sname{flex:1;min-width:0;font:500 15.5px var(--body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shead b{font:500 15.5px var(--body);font-variant-numeric:tabular-nums;white-space:nowrap}
.shead small{font:400 13px var(--body);color:var(--faint);min-width:34px;text-align:right}
.shead .chev{width:12px!important;height:12px!important;stroke:var(--faint);stroke-width:2;fill:none;transition:transform var(--t)}
.shead[aria-expanded="true"] .chev{transform:rotate(90deg)}
.sbar{height:3px;margin:0 2px 14px 22px;border-radius:2px;background:var(--line-2);overflow:hidden}
.sbar i{display:block;height:100%;background:var(--pc)}
.stasks{padding:0 2px 10px 22px}
.strow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;width:100%;text-align:left;padding:9px 0;border-top:1px solid var(--line-2)}
.strow span{font:400 15px/1.4 var(--body);overflow-wrap:anywhere}
.strow b{font:400 15px var(--body);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.strow small{grid-column:1/-1;color:var(--faint);font:400 13px var(--body)}
.sess{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 2px;border-bottom:1px solid var(--line-2)}
.sess svg{width:8px;height:8px;flex:0 0 auto}
.sess .sl{flex:1;min-width:0;display:grid}
.sess .sl b{font:400 15px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sess .sl small{color:var(--muted);font:400 13px var(--body)}
.sess .sd{font:500 15px var(--body);white-space:nowrap;font-variant-numeric:tabular-nums}
.sect.big{font-size:13px;margin:34px 2px 4px}
.empty-stat{padding:18px 2px;color:var(--muted);line-height:1.6}
.setcard{padding:18px 0;border-bottom:1px solid var(--line)}
.setcard:first-of-type{padding-top:0}
.setcard b{font:600 15px var(--body)}
.setcard p{margin:4px 0 14px;color:var(--muted);line-height:1.55;font-size:15px}
.setcard .seg{display:inline-flex}
.filebtn{cursor:pointer}
.filebtn input{display:none}
.rsmsg{margin-top:12px!important;color:var(--ink)!important}
.rsmsg:empty{display:none}

/* Colour layer: projects and states */
.card{box-shadow:inset 3px 0 0 var(--pc,transparent),var(--shadow-s);padding-left:16px}
.card .check{border-color:color-mix(in srgb,var(--pc) 60%,var(--faint))}
.card.st-doing{background:color-mix(in srgb,var(--st-doing) 6%,var(--panel));border-color:color-mix(in srgb,var(--st-doing) 28%,var(--line))}
.card.st-blocked{background:color-mix(in srgb,var(--st-blocked) 6%,var(--panel))}
.card.st-done{box-shadow:none}
.card .ptag{padding:3px 8px;border-radius:999px;background:color-mix(in srgb,var(--pc) 26%,transparent);color:color-mix(in srgb,var(--pc) 45%,var(--ink));font-weight:500}
.card .ptag svg{display:none}
.stp{padding:3px 8px;border-radius:999px;background:color-mix(in srgb,var(--sc) 15%,transparent);color:color-mix(in srgb,var(--sc) 80%,var(--ink));font-weight:500}
.stp svg{display:none}
.tchip.run{padding:3px 8px;border-radius:999px;background:color-mix(in srgb,var(--st-blocked) 13%,transparent);font-weight:500}
.goal{background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:12px 16px 14px}
.zoom-week .goal{padding:10px 12px}
.goal small,.wgoal .wk{color:var(--accent)}
.lane.is-today .lhead .wd{color:var(--accent)}
.fchip svg{width:9px;height:9px}
.fchip[aria-pressed="true"][style]{background:color-mix(in srgb,var(--pc) 32%,var(--panel));color:var(--ink)}
.chips button svg{width:9px;height:9px}
.chips button[aria-pressed="true"][style*="--sc"]{background:color-mix(in srgb,var(--sc) 16%,var(--panel));border-color:var(--sc);color:var(--ink)}
.proj{border:1.5px solid var(--pc,var(--line));box-shadow:none}
.picon{display:inline-block;width:11px;height:11px;border-radius:4px;background:var(--pc);margin-right:9px;vertical-align:0}
.pbadge,.pbadge svg{width:12px;height:12px}
.pbar{height:4px}
.pgroup svg,.shead svg,.sess svg,.linkrow svg{width:9px;height:9px}
.mcell .dots svg{width:7px;height:7px}
.mcell.is-today{background:var(--accent-soft)}
.block{background:color-mix(in srgb,var(--bc) 28%,var(--panel))}
.block .bt{color:var(--ink)}
.sday[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.sday[aria-pressed="true"] b{color:var(--on-accent)}
.tabs button[aria-current="page"],.space button[aria-selected="true"]{color:var(--accent)}
.timerbar{background:color-mix(in srgb,var(--accent) 7%,var(--panel));border-color:color-mix(in srgb,var(--accent) 25%,var(--line))}
.timer-fab{color:var(--accent)}
.stat-hero .big{color:var(--accent)}
.sbar{height:5px}
.sgrp .sname{color:color-mix(in srgb,var(--pc) 80%,var(--ink))}
/* Groups */
.gsec{margin:8px 0 30px;padding-left:14px;border-left:3px solid var(--gc)}
.gsec.plain{border-left-color:transparent;padding-left:0}
.ghead{display:flex;align-items:baseline;gap:10px;margin:0 2px 14px}
.ghead h2{font:600 19px/1.25 var(--display);letter-spacing:-.015em;margin:0;color:color-mix(in srgb,var(--gc,var(--ink)) 70%,var(--ink));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gsec.plain .ghead h2{color:var(--ink)}
.ghead small{color:var(--muted);font-size:13px;white-space:nowrap}
.gedit{margin-left:auto;color:var(--muted);font:500 13px var(--body);padding:4px 8px;border-radius:8px}
.gedit:hover{background:var(--hover);color:var(--ink)}
.gadd{display:block;width:100%;text-align:left;padding:10px 14px;border-radius:12px;color:var(--muted);font:400 15px var(--body)}
.gadd:hover{background:var(--hover);color:var(--ink)}
.gsq{width:12px;height:12px;border-radius:3px;background:var(--pc);flex:0 0 auto}
/* Routines */
.rlist{background:var(--panel);border:1px solid var(--line);border-radius:14px;margin:0 0 10px;padding:2px 0}
.rlh{padding:12px 16px 2px;font:500 12px var(--body);color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.rrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:11px 16px;border-top:1px solid var(--line-2)}
.rlh + .rrow,.rlist > .rrow:first-child{border-top:0}
.rrow .rico{width:16px;height:16px;color:var(--faint);flex:0 0 auto;display:grid;place-items:center}
.rrow .rico svg{width:15px;height:15px}
.rrow .rt{flex:1;min-width:0}
.rrow b{display:block;font:400 15px/1.4 var(--body);overflow-wrap:anywhere}
.rrow small{display:block;font:400 13px/1.4 var(--body);color:var(--muted);margin-top:2px}
.rrow .due{color:var(--ink);font-weight:500}
.rrow .late{color:var(--st-blocked)}
.chip.rep svg{width:11px;height:11px}
.ptag .asq{width:8px;height:8px;border-radius:2px;background:var(--ac);flex:0 0 auto}
.pgroup .rp{width:11px;height:11px}
.rlink{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border-radius:10px;background:var(--line-2);font:400 14px var(--body);color:var(--muted);text-align:left;margin:-4px 0 18px}
.rlink svg{width:14px;height:14px;flex:0 0 auto}
.rlink em{font-style:normal;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rlink span{margin-left:auto;color:var(--ink);font-weight:500;white-space:nowrap}
.wdays button{min-width:46px;justify-content:center}
.everyrow{display:flex;gap:8px;align-items:center;margin-top:10px;color:var(--muted)}
.everyrow input.inp{width:76px;flex:0 0 auto}
.everyrow select.inp{flex:1;min-width:0}
.rhist{color:var(--muted);font-size:14px;line-height:1.5}
.srep{width:16px;height:16px;display:grid;place-items:center;color:var(--faint);flex:0 0 auto}
.srep svg{width:14px;height:14px}
/* Radar */
.radar{margin:4px 0 0}
.radar svg{display:block;width:100%;max-width:400px;height:auto;margin:0 auto;overflow:visible}
.radar .ring{fill:none;stroke:var(--line);stroke-width:1}
.radar .ax{stroke:var(--line);stroke-width:1}
.radar .cur{fill:var(--accent);fill-opacity:.12;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}
.radar .prv{fill:none;stroke:var(--faint);stroke-width:1.2;stroke-dasharray:3 3;stroke-linejoin:round}
.radar .dot{stroke:var(--paper);stroke-width:1.5}
.radar text{font:500 12px var(--body);fill:var(--ink)}
.radar text .v{font-weight:400;fill:var(--muted)}
.radar .lg{display:flex;gap:16px;justify-content:center;font:400 12px var(--body);color:var(--muted);margin-top:6px}
.radar .lg i{display:inline-block;width:14px;border-top:2px solid var(--accent);vertical-align:middle;margin-right:6px}
.radar .lg i.prev{border-top:1.5px dashed var(--faint)}
.radar-cap,.radar-hint{color:var(--muted);font-size:14px;line-height:1.5;margin:10px 2px 0}
.sgrp .sname{font-weight:600}
.gsub{margin:-8px 2px 12px 24px;font-size:13px;color:var(--faint)}
.sgbody{margin:0 0 6px 24px;border-left:2px solid color-mix(in srgb,var(--pc) 35%,transparent);padding-left:10px}
.srow.nested{border-bottom:1px solid var(--line-2)}
.srow.nested:last-child{border-bottom:0}
/* Edit icons, notes, tags */
.proj .phead{display:flex;align-items:flex-start;gap:2px;padding:10px 14px 14px 6px;width:100%}
.ptoggle{flex:1;min-width:0;text-align:left;display:block;padding:6px 0 0 2px}
.pedit,.gpen{flex:0 0 auto;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:color-mix(in srgb,var(--pc,var(--gc)) 75%,var(--muted));transition:background var(--t)}
.gpen{color:color-mix(in srgb,var(--gc) 75%,var(--muted));margin:-6px -2px -6px -8px}
.pedit:hover,.gpen:hover{background:var(--hover)}
.pedit svg,.gpen svg{width:16px;height:16px}
.ghead{align-items:center}
.tagchip{display:inline-flex;font:500 12px/1.2 var(--body);color:var(--muted);background:var(--line-2);padding:3px 7px;border-radius:6px}
.pnotes{margin:4px 0 14px;padding:10px 12px;border-radius:10px;background:var(--line-2);color:var(--muted);font-size:14.5px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.gtags{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 2px 12px 28px}
.gnotes{margin:-4px 2px 16px 28px;color:var(--muted);font-size:14.5px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tagbox{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:7px 8px;border:1px solid var(--line);border-radius:10px;background:var(--panel);min-height:46px;cursor:text}
.tagbox:focus-within{border-color:var(--accent)}
.tagbox input{flex:1;min-width:120px;border:0;outline:none;background:transparent;font:400 16px var(--body);padding:4px 4px}
.tag{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font:500 13px var(--body);background:var(--line-2);color:var(--muted)}
.tag.on{background:var(--accent-soft);color:var(--accent)}
.tag.on span{opacity:.6;font-size:15px;line-height:1}
.tagsugg{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
/* Collapse + reorder */
.ghead{gap:8px}
.ghead h2{flex:0 1 auto;min-width:0;display:flex;align-items:center}
.gtoggle{display:inline-flex;align-items:center;gap:6px;min-width:0;font:inherit;color:inherit;letter-spacing:inherit;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gtoggle .chev{width:12px;height:12px;stroke:var(--faint);stroke-width:2.2;fill:none;flex:0 0 auto;transform:rotate(90deg);transition:transform var(--t)}
.gtoggle[aria-expanded="false"] .chev{transform:none}
.ghead .rgrip{margin-left:auto}
.gsec.closed{margin-bottom:16px}
.gsec.closed .ghead{margin-bottom:0}
.proj .phead .rgrip{align-self:center;margin-right:-8px}
.gempty{padding:10px 2px 4px}
.rdragging{opacity:.3}
.rghost{position:fixed;z-index:60;pointer-events:none;display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-m);font:600 15px var(--body);color:var(--ink);white-space:nowrap;overflow:hidden}
.rghost i{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.rghost span{overflow:hidden;text-overflow:ellipsis}
.rline{position:fixed;z-index:59;height:2px;border-radius:1px;background:var(--accent);pointer-events:none;display:none}
/* Drag between projects */
.trow .grip{align-self:center;margin-right:-6px}
.trow.placeholder{opacity:.3}
.trow-ghost{position:fixed;z-index:50;pointer-events:none;display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-m);font:500 15px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trow-ghost svg{width:9px;height:9px;flex:0 0 auto}
.proj{transition:box-shadow var(--t),background var(--t)}
.proj.drop-over{box-shadow:0 0 0 2px var(--pc,var(--accent));background:color-mix(in srgb,var(--pc,var(--accent)) 6%,var(--panel))}
.dropzone{position:fixed;left:16px;right:16px;max-width:560px;margin:0 auto;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:45;padding:18px;text-align:center;border:1.5px dashed var(--faint);border-radius:14px;background:var(--panel);color:var(--muted);font:500 14px var(--body);box-shadow:var(--shadow-m);transition:border-color var(--t),color var(--t)}
.dropzone.drop-over{border-color:var(--accent);color:var(--ink);background:var(--accent-soft)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (min-width:760px){.lane{flex-basis:440px}.zoom-week .lane{flex-basis:250px}.lanes{scroll-snap-type:x proximity}.row2 h1{font-size:28px}}
@media (max-width:420px){
  .top{padding:12px 16px 4px}.row3{margin:0 -16px;padding:2px 16px 8px}
  .lanes{padding:0 16px;gap:24px}.wgoal{margin:4px 16px 16px}.scroll{padding:8px 16px 140px}
  .strip{padding:0 16px 12px}.tlwrap{margin:0 8px 0 4px}
  .row2 h1{font-size:22px}.goal textarea{font-size:18px}
  .tabs{padding:6px 76px 8px 4px}.sheet{padding-left:18px;padding-right:18px}
  .stat-hero .big{font-size:46px}.timerbar{margin-left:12px;margin-right:74px}
}
@media (max-width:350px){.space{width:132px}.row2 h1{font-size:20px}.mcell .cnt{display:none}.mcell{padding:4px}}
/* ================= Theme: Lantern (light) + Night market (dark) ================= */
:root{
  --paper:#F3F2F9;--panel:#FFFFFF;--ink:#1B1A3A;--muted:#6E6B94;--faint:#A7A4C6;--line:#E3E1F0;--line-2:#ECEAF5;
  --hover:#EAE8F4;--sel:#ECEEFF;--fixed-ink:#1B1A3A;
  --work:#4D62F0;--life:#E2337F;--accent-soft:#ECEEFF;--on-accent:#FFFFFF;
  --st-idea:#8B6CF0;--st-todo:#A7A4C6;--st-doing:#2D6FDF;--st-blocked:#E0445A;--st-done:#12A07A;
  --chrome:var(--panel);--chrome-ink:var(--ink);--chrome-muted:var(--faint);--focus-text:var(--ink);
  --pmix:72%;--tile-tint:0%;--ring:0%;
  --shadow-s:0 1px 2px rgba(27,26,58,.05);--shadow-m:0 10px 30px -12px rgba(27,26,58,.28);
  --display:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;--body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  padding-bottom:0;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#14132A;--panel:#1E1D3B;--ink:#F3F1FF;--muted:#A19FCB;--faint:#6C69A0;--line:#2D2B55;--line-2:#25234A;
  --hover:#262451;--sel:#2A2C5E;--fixed-ink:#14132A;
  --work:#8CA4FF;--life:#FF8CC0;--accent-soft:#252A5C;--on-accent:#14132A;
  --st-idea:#C9B2FF;--st-todo:#6C69A0;--st-doing:#7FB2FF;--st-blocked:#FF7A8A;--st-done:#7DF2C9;
  --chrome:#1B1A3A;--chrome-muted:#8E8BBB;--focus-text:#F3F1FF;--pmix:100%;--tile-tint:0%;--ring:10%;
  --shadow-s:none;--shadow-m:0 12px 32px -12px rgba(0,0,0,.7);color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#14132A;--panel:#1E1D3B;--ink:#F3F1FF;--muted:#A19FCB;--faint:#6C69A0;--line:#2D2B55;--line-2:#25234A;
  --hover:#262451;--sel:#2A2C5E;--fixed-ink:#14132A;
  --work:#8CA4FF;--life:#FF8CC0;--accent-soft:#252A5C;--on-accent:#14132A;
  --st-idea:#C9B2FF;--st-todo:#6C69A0;--st-doing:#7FB2FF;--st-blocked:#FF7A8A;--st-done:#7DF2C9;
  --chrome:#1B1A3A;--chrome-muted:#8E8BBB;--focus-text:#F3F1FF;--pmix:100%;--tile-tint:0%;--ring:10%;
  --shadow-s:none;--shadow-m:0 12px 32px -12px rgba(0,0,0,.7);color-scheme:dark}
body[data-space="life"]{--accent-soft:#FDE7F1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body[data-space="life"]{--accent-soft:#3A2045}}
:root[data-theme="dark"] body[data-space="life"]{--accent-soft:#3A2045}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tabs{border-top-color:var(--line)}}
:root[data-theme="dark"] .tabs{border-top-color:var(--line)}

/* Night chrome in dark mode, quiet chrome in light mode */
body{--neon:var(--accent);--neon-ink:var(--on-accent);--focus-bg:var(--accent-soft);--focus-label:var(--accent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body{--focus-bg:#1B1A3A}}
:root[data-theme="dark"] body{--focus-bg:#1B1A3A}
.goal{background:var(--focus-bg);border-left:0;border-radius:16px;padding:14px 16px 16px}
.zoom-week .goal{padding:10px 12px 12px}
.goal small{color:var(--focus-label)}
.goal textarea{color:var(--focus-text);font-weight:700}
.goal textarea::placeholder{color:var(--chrome-muted)}
.tabs{background:var(--chrome);border-top:1px solid var(--line);padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
.tabs button{color:var(--chrome-muted)}
.tabs button[aria-current="page"]{color:var(--neon)}
.fab{background:var(--neon);color:var(--neon-ink);box-shadow:0 8px 20px -8px var(--neon);bottom:calc(14px + env(safe-area-inset-bottom,0px))}
.timerbar{background:var(--chrome);border-color:var(--line)}
.tinfo,.tinfo b{color:var(--chrome-ink)}
.tinfo span{color:var(--chrome-muted)}
.tstop{background:var(--neon);color:var(--neon-ink)}
.timer-fab{background:var(--chrome);border-color:var(--line);color:var(--neon);bottom:calc(80px + env(safe-area-inset-bottom,0px))}
.space .thumb{background:var(--chrome)}
.space button[aria-selected="true"]{color:var(--chrome-ink)}
.row2 h1,.pname,.ghead h2,.stat-hero .big,.lhead .wd{font-weight:800;letter-spacing:-.03em}

/* Pastel project colours: deepen edges on light, glow on dark */
.card{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--pc) var(--pmix),var(--ink)),var(--shadow-s)}
.card.st-done{box-shadow:none}
.card .check{border-color:color-mix(in srgb,var(--pc) var(--pmix),var(--ink))}
.card .ptag{background:color-mix(in srgb,var(--pc) 40%,transparent);color:var(--ink)}
.proj{border:1.5px solid color-mix(in srgb,var(--pc) var(--pmix),var(--ink));background:color-mix(in srgb,var(--pc) var(--tile-tint),var(--panel));box-shadow:0 0 0 4px color-mix(in srgb,var(--pc) var(--ring),transparent)}
.proj:not([style]){border-color:var(--line);background:var(--panel);box-shadow:none}
.picon,.pbar i{background:color-mix(in srgb,var(--pc) var(--pmix),var(--ink))}
.block{border-left-color:color-mix(in srgb,var(--bc) var(--pmix),var(--ink))}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .card .ptag{background:color-mix(in srgb,var(--pc) 22%,transparent);color:var(--pc)}
  :root:not([data-theme="light"]) .ghead h2,:root:not([data-theme="light"]) .sgrp .sname{color:color-mix(in srgb,var(--gc,var(--pc)) 65%,#fff)}}
:root[data-theme="dark"] .card .ptag{background:color-mix(in srgb,var(--pc) 22%,transparent);color:var(--pc)}
:root[data-theme="dark"] .ghead h2,:root[data-theme="dark"] .sgrp .sname{color:color-mix(in srgb,var(--gc,var(--pc)) 65%,#fff)}

/* ================= Minimal: colour only as small indicators ================= */
:root{
  --paper:#FAFAF9;--panel:#FFFFFF;--ink:#1D1D1F;--muted:#86868B;--faint:#B8B8BD;--line:#E9E8E4;--line-2:#F1F0EC;
  --hover:#F4F3F0;--sel:#F2F2F4;--fixed-ink:#1D1D1F;--work:#4B5BD7;--life:#C8507E;--accent-soft:#F2F2F4;
  --st-idea:#9B7FE0;--st-todo:#B8B8BD;--st-doing:#3E8FE0;--st-blocked:#E0603F;--st-done:#3FA884;--pmix:70%;
  --shadow-s:none;--shadow-m:0 10px 30px -12px rgba(20,20,30,.2);
  --display:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#14132A;--panel:#1C1B36;--ink:#EEEDF7;--muted:#9896BE;--faint:#5F5D8C;--line:#2A2850;--line-2:#22213F;
  --hover:#22213F;--sel:#26254A;--fixed-ink:#14132A;--work:#8CA4FF;--life:#FF8CC0;--accent-soft:#22213F;
  --st-idea:#C9B2FF;--st-todo:#5F5D8C;--st-doing:#7FB2FF;--st-blocked:#FF7A8A;--st-done:#7DF2C9;--pmix:100%;
  --shadow-m:0 12px 32px -12px rgba(0,0,0,.7)}}
:root[data-theme="dark"]{
  --paper:#14132A;--panel:#1C1B36;--ink:#EEEDF7;--muted:#9896BE;--faint:#5F5D8C;--line:#2A2850;--line-2:#22213F;
  --hover:#22213F;--sel:#26254A;--fixed-ink:#14132A;--work:#8CA4FF;--life:#FF8CC0;--accent-soft:#22213F;
  --st-idea:#C9B2FF;--st-todo:#5F5D8C;--st-doing:#7FB2FF;--st-blocked:#FF7A8A;--st-done:#7DF2C9;--pmix:100%;
  --shadow-m:0 12px 32px -12px rgba(0,0,0,.7)}
body[data-space="life"]{--accent-soft:var(--sel)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body[data-space="life"]{--accent-soft:var(--sel)}}
:root[data-theme="dark"] body[data-space="life"]{--accent-soft:var(--sel)}

.row2 h1,.pname,.ghead h2,.stat-hero .big,.lhead .wd{font-weight:600;letter-spacing:-.02em}
.goal{background:transparent;border-left:2px solid var(--accent);border-radius:0;padding:2px 0 2px 14px}
.zoom-week .goal{padding:2px 0 2px 10px}
.goal small,.wgoal .wk{color:var(--muted)}
.goal textarea{color:var(--ink);font-weight:500}
.lane.is-today .lhead .wd{color:var(--ink)}
.tabs{background:var(--paper);border-top:1px solid var(--line)}
.tabs button{color:var(--faint)}
.tabs button[aria-current="page"]{color:var(--ink)}
.fab{background:var(--ink);color:var(--paper);box-shadow:var(--shadow-m)}
.timerbar{background:var(--panel);border-color:var(--line)}
.tinfo,.tinfo b{color:var(--ink)}
.tinfo span{color:var(--muted)}
.tstop{background:var(--line-2);color:var(--ink)}
.timer-fab{background:var(--panel);border-color:var(--line);color:var(--ink)}
.space .thumb{background:var(--panel)}
.space button[aria-selected="true"]{color:var(--ink)}
.btn.primary{background:var(--ink);color:var(--paper)}

.card,.card.st-doing,.card.st-blocked{box-shadow:none;border-color:var(--line);background:var(--panel)}
.card.st-done{background:transparent}
.card .check{border-color:var(--faint)}
.check.on{background:var(--muted);border-color:var(--muted)}
.check.on svg{color:var(--paper)}
.card .ptag,.ptag,.stp{background:none;padding:0;color:var(--muted);font-weight:400}
.card .ptag svg,.ptag svg,.stp svg{display:inline-block;width:7px;height:7px}
.tchip.run{background:none;padding:0;color:var(--st-blocked)}
.tchip.over{color:var(--st-blocked)}

.proj,.proj:not([style]){border:1px solid var(--line);background:var(--panel);box-shadow:none}
.picon{width:9px;height:9px;border-radius:3px;background:color-mix(in srgb,var(--pc) var(--pmix),var(--ink))}
.pbar i,.sbar i{background:var(--muted)}
.pedit,.gpen{color:var(--faint)}
.gsec{border-left:0;padding-left:0}
.ghead h2,.sgrp .sname,.sname{color:var(--ink)}
.ghead h2::before{content:"";display:inline-block;width:9px;height:9px;border-radius:3px;background:var(--gc);margin-right:9px;vertical-align:1px}
.gsec.plain .ghead h2::before{display:none}
.gtags,.gnotes{margin-left:30px}

.fchip[aria-pressed="true"],.fchip[aria-pressed="true"][style]{background:var(--ink);color:var(--paper)}
.chips button[aria-pressed="true"],.chips button[aria-pressed="true"][style*="--sc"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.tag.on{background:var(--line-2);color:var(--ink)}
.sday[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.sday[aria-pressed="true"] b{color:var(--paper)}
.mcell.is-today{background:transparent}
.block{background:var(--panel);border:1px solid var(--line);border-left:3px solid color-mix(in srgb,var(--bc) var(--pmix),var(--ink))}
.block .bt{color:var(--ink)}
.stat-hero .big{color:var(--ink)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .card .ptag{background:none;color:var(--muted)}
  :root:not([data-theme="light"]) .ghead h2,:root:not([data-theme="light"]) .sgrp .sname{color:var(--ink)}}
:root[data-theme="dark"] .card .ptag{background:none;color:var(--muted)}
:root[data-theme="dark"] .ghead h2,:root[data-theme="dark"] .sgrp .sname{color:var(--ink)}

/* ---------- Sync between devices (sync/ui.js) ---------- */
.sync[data-s="syncing"]{background:var(--faint);animation:sy-pulse 1s ease-in-out infinite alternate}
@keyframes sy-pulse{from{opacity:.35}to{opacity:1}}
@media (prefers-reduced-motion: reduce){.sync[data-s="syncing"]{animation:none}}
.sy{display:flex;flex-direction:column;gap:12px}
.sy p{margin:0;line-height:1.55;font-size:15px}
.sy .btn{justify-content:center}
.sy-note{color:var(--muted);font-size:14px!important}
.sy-warn{color:var(--st-blocked);font-size:14px!important}
.sy-box{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.sy-box b{font:600 15px var(--body)}
.sy-box span{color:var(--muted);font-size:14px;line-height:1.5}
.sy-box span:empty{display:none}
.sy-list,.sy-steps{margin:0;padding-left:20px;color:var(--muted);font-size:14px;line-height:1.55;display:flex;flex-direction:column;gap:4px}
.sy-list b,.sy-steps b{color:var(--ink);font-weight:600}
.sy-code{font:600 22px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;text-align:center;padding:14px 8px;border:1px dashed var(--faint);border-radius:12px;word-break:break-all;user-select:all;-webkit-user-select:all}
.sy-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.sy-sep{display:flex;flex-direction:column;gap:8px;padding-top:14px;margin-top:4px;border-top:1px solid var(--line)}
.sy-check{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.45}
.sy-check input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink)}
.sy-input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);font:500 16px var(--body)}
.sy-input:focus{outline:none;border-color:var(--ink)}
.sy-input.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.04em}
.sy-input.big{font-size:24px;text-align:center;letter-spacing:.2em}
.sy .btn.primary.sy-danger{background:var(--st-blocked);color:#fff}
.sy .btn:disabled{opacity:.45;cursor:default}