:root{color-scheme:dark;--bg: #0c0d10;--surface: #15171c;--surface-raised: #1c1f25;--surface-pressed: #22252c;--hairline: rgba(255, 255, 255, .08);--hairline-strong: rgba(255, 255, 255, .14);--text: #f4f4f5;--text-2: #a1a1aa;--text-3: #82868f;--accent: #ffb454;--accent-ink: #1a1206;--accent-soft: rgba(255, 180, 84, .14);--danger: #ff6b6b;--danger-soft: rgba(255, 107, 107, .16);--font-text: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-6: 24px;--s-8: 32px;--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--r-pill: 999px;--shadow-sm: 0 1px 0 0 rgba(255, 255, 255, .04) inset, 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 0 0 1px rgba(0, 0, 0, .5), 0 4px 8px -2px rgba(0, 0, 0, .5), 0 16px 32px -8px rgba(0, 0, 0, .6);--ease-out: cubic-bezier(.23, 1, .32, 1);--ease-in-out: cubic-bezier(.77, 0, .175, 1);--ease-drawer: cubic-bezier(.32, .72, 0, 1);--t-press: .16s;--t-pop: .2s;--t-move: .25s;--column: 640px;--margin: var(--s-4);--touch: 44px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-start: env(safe-area-inset-left, 0px);--safe-end: env(safe-area-inset-right, 0px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-text);font-size:16px;line-height:1.45;min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-y:none}button,input,select{font:inherit;color:inherit}button{background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}input{border:0;background:none;outline:none}img{display:block;max-width:100%}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-sm)}::selection{background:var(--accent-soft)}.display{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;line-height:1.05;text-wrap:balance}.tnum{font-variant-numeric:tabular-nums}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.shell{min-height:100dvh;display:flex;flex-direction:column;max-width:var(--column);margin-inline:auto;padding-inline:calc(var(--margin) + var(--safe-start)) calc(var(--margin) + var(--safe-end))}.shell--center{justify-content:center;align-items:center;padding-block:calc(var(--s-8) + var(--safe-top)) calc(var(--s-8) + var(--safe-bottom))}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;min-height:56px;padding-top:var(--safe-top);background:var(--bg)}.wordmark{display:inline-flex;align-items:center;gap:var(--s-2);font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:-.02em}.wordmark__tick{width:22px;height:22px;display:grid;place-items:center;border-radius:6px;background:var(--accent);color:var(--accent-ink)}.account{position:relative}.account__trigger{width:var(--touch);height:var(--touch);display:grid;place-items:center;border-radius:var(--r-pill);transition:transform var(--t-press) var(--ease-out)}.account__trigger:active{transform:scale(.96)}.avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;border:1px solid var(--hairline-strong);background:var(--surface-raised)}.avatar--fallback{display:grid;place-items:center;font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--text-2)}.popover{position:absolute;top:calc(100% + var(--s-1));inset-inline-end:0;min-width:220px;max-width:calc(100vw - 2 * var(--margin));padding:var(--s-2);border-radius:var(--r-lg);background:var(--surface-raised);border:1px solid var(--hairline);box-shadow:var(--shadow-md);z-index:30;transform-origin:top right;transition:opacity var(--t-pop) var(--ease-out),transform var(--t-pop) var(--ease-out)}[dir=rtl] .popover{transform-origin:top left}.popover[data-state=closed]{opacity:0;transform:scale(.95);pointer-events:none}.popover__identity{padding:var(--s-2) var(--s-3) var(--s-3);border-bottom:1px solid var(--hairline);margin-bottom:var(--s-2);min-width:0}.popover__name{font-weight:600;font-size:14px}.popover__email{font-size:12px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.popover__action{width:100%;min-height:var(--touch);display:flex;align-items:center;gap:var(--s-2);padding-inline:var(--s-3);border-radius:var(--r-sm);font-size:14px;font-weight:500;color:var(--text-2);transition:background-color var(--t-press) var(--ease-out),color var(--t-press) var(--ease-out)}.popover__action:active{background:var(--surface-pressed)}.popover__action--danger{color:var(--danger)}@media(hover:hover)and (pointer:fine){.popover__action:hover{background:var(--surface-pressed);color:var(--text)}.popover__action--danger:hover{background:var(--danger-soft);color:var(--danger)}}.chips{display:flex;gap:var(--s-2);overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * (var(--margin) + var(--safe-start))) calc(-1 * (var(--margin) + var(--safe-end)));padding-inline:calc(var(--margin) + var(--safe-start)) calc(var(--margin) + var(--safe-end) + var(--s-6));padding-block:var(--s-3) var(--s-4);scroll-padding-inline:calc(var(--margin) + var(--safe-start));scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 40px),transparent)}[dir=rtl] .chips{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 40px),transparent)}.chips::-webkit-scrollbar{display:none}.chip{flex:0 0 auto;scroll-snap-align:start;display:inline-flex;align-items:center;gap:var(--s-2);min-height:40px;padding-inline:var(--s-4);border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--hairline);color:var(--text-2);font-size:14px;font-weight:500;white-space:nowrap;max-width:60vw;transition:background-color var(--t-press) var(--ease-out),border-color var(--t-press) var(--ease-out),color var(--t-press) var(--ease-out),transform var(--t-press) var(--ease-out)}.chip:active{transform:scale(.96)}.chip__name{overflow:hidden;text-overflow:ellipsis}.chip__count{font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}.chip[aria-current=true]{background:var(--text);border-color:var(--text);color:var(--bg)}.chip[aria-current=true] .chip__count{color:#0c0d1099}.chip--new{border-style:dashed;color:var(--text-3)}.chip--input{padding-inline:var(--s-3) var(--s-2);gap:var(--s-1)}.chip__input{min-width:8ch;max-width:40vw;font-size:16px;color:var(--text)}.chip__input::placeholder{color:var(--text-3)}.chip__ok{width:28px;height:28px;display:grid;place-items:center;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-ink)}@media(hover:hover)and (pointer:fine){.chip:hover:not([aria-current=true]){border-color:var(--hairline-strong);color:var(--text)}}.hero{display:flex;flex-direction:column;gap:var(--s-3);padding-block:var(--s-2) 0}.hero__row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-4);min-width:0}.hero__title{font-size:clamp(32px,9vw,44px);min-width:0;overflow-wrap:anywhere;padding:0;text-align:start;border-radius:var(--r-sm)}.hero__title-input{width:100%;font:inherit;color:var(--text);border-bottom:2px solid var(--accent);border-radius:0}.hero__count{flex:0 0 auto;display:flex;align-items:baseline;gap:var(--s-1);color:var(--text-3);font-size:14px;padding-bottom:6px}.hero__count strong{font-family:var(--font-display);font-weight:600;font-size:24px;color:var(--text);letter-spacing:-.02em}.hero__actions{display:flex;align-items:center;gap:var(--s-6)}.hero__action{display:inline-flex;align-items:center;gap:6px;min-height:var(--touch);font-size:13px;font-weight:500;color:var(--text-3);transition:color var(--t-press) var(--ease-out)}.hero__action:active{color:var(--text)}@media(hover:hover)and (pointer:fine){.hero__action:hover{color:var(--text)}}.progress{position:relative;height:2px;border-radius:2px;background:var(--hairline);overflow:hidden}.progress__fill{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--accent);transform-origin:0 50%;transition:transform var(--t-move) var(--ease-in-out)}[dir=rtl] .progress__fill{transform-origin:100% 50%}.items{display:flex;flex-direction:column;gap:var(--s-6);padding-bottom:calc(96px + var(--safe-bottom))}.group{display:flex;flex-direction:column;gap:var(--s-1)}.group__list{list-style:none;display:flex;flex-direction:column;gap:var(--s-1)}.row{position:relative;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hairline);overflow:hidden}.row--done{background:transparent;border-color:transparent}.row__reveal{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:flex-end;padding-inline-end:var(--s-4);background:var(--danger);color:var(--bg);font-size:13px;font-weight:600;gap:6px}.row__body{position:relative;display:flex;align-items:center;gap:var(--s-3);min-height:52px;padding-inline:var(--s-2) var(--s-3);background:var(--surface);border-radius:inherit}.row--done .row__body{background:var(--bg)}.row--dragging .row__body{background:var(--surface-raised)}.row--dragging{box-shadow:var(--shadow-md);border-color:var(--hairline-strong);z-index:2}.check{flex:0 0 var(--touch);height:var(--touch);display:grid;place-items:center;border-radius:var(--r-pill);color:var(--text-3);transition:transform var(--t-press) var(--ease-out)}.check:active{transform:scale(.96)}.check__ring{width:22px;height:22px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center;transition:background-color var(--t-pop) var(--ease-out),border-color var(--t-pop) var(--ease-out),color var(--t-pop) var(--ease-out)}.check__mark{width:14px;height:14px;opacity:0;transform:scale(.6);transition:opacity var(--t-press) var(--ease-out),transform var(--t-pop) var(--ease-out)}.check[aria-checked=true]{color:var(--accent)}.check[aria-checked=true] .check__ring{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.check[aria-checked=true] .check__mark{opacity:1;transform:scale(1)}@media(hover:hover)and (pointer:fine){.check:hover{color:var(--text-2)}}.row__text{flex:1 1 auto;min-width:0;min-height:var(--touch);display:flex;align-items:center;text-align:start;font-size:16px;line-height:1.4;overflow-wrap:anywhere;color:var(--text);transition:color var(--t-pop) var(--ease-out);border-radius:var(--r-sm)}.row--done .row__text{color:var(--text-3);text-decoration:line-through;text-decoration-color:var(--hairline-strong)}.row__input{flex:1 1 auto;min-width:0;min-height:var(--touch);font-size:16px;color:var(--text);caret-color:var(--accent)}.row__handle{flex:0 0 var(--touch);height:var(--touch);display:grid;place-items:center;color:var(--text-3);cursor:grab;touch-action:none;border-radius:var(--r-pill)}.row__handle:active{cursor:grabbing}.row__delete{flex:0 0 var(--touch);height:var(--touch);display:grid;place-items:center;color:var(--text-3);border-radius:var(--r-pill)}.row__text:focus-visible{outline-offset:-2px}@media(hover:hover)and (pointer:fine){.row__delete:hover{color:var(--danger)}.row__text:hover,.row__text:focus-visible{text-decoration:underline;text-decoration-color:var(--hairline-strong);text-underline-offset:3px}.row__handle:hover{color:var(--text-2)}}.disclosure{display:inline-flex;align-items:center;gap:var(--s-2);min-height:var(--touch);padding-inline:var(--s-2);margin-inline-start:calc(-1 * var(--s-2));border-radius:var(--r-sm);font-size:13px;font-weight:500;color:var(--text-3);transition:color var(--t-press) var(--ease-out)}.disclosure svg{transition:transform var(--t-pop) var(--ease-out)}.disclosure[aria-expanded=true] svg{transform:rotate(180deg)}@media(hover:hover)and (pointer:fine){.disclosure:hover{color:var(--text-2)}}.notice{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-block:var(--s-2) var(--s-3);padding:var(--s-2) var(--s-2) var(--s-2) var(--s-4);border-radius:var(--r-md);background:var(--danger-soft);color:var(--danger);font-size:14px;line-height:1.4}.notice__dismiss{flex:0 0 auto;min-height:36px;padding-inline:var(--s-3);border-radius:var(--r-sm);font-weight:600;color:var(--danger)}.empty{padding-block:var(--s-8);color:var(--text-3);font-size:15px;text-wrap:balance}.empty--hero{display:flex;flex-direction:column;gap:var(--s-4);padding-block:var(--s-8) 0}.empty__title{font-size:clamp(32px,9vw,44px);color:var(--text)}.composer{position:fixed;inset-inline:0;bottom:0;z-index:20;padding-inline:calc(var(--margin) + var(--safe-start)) calc(var(--margin) + var(--safe-end));padding-bottom:calc(var(--s-3) + var(--safe-bottom));padding-top:var(--s-6);background:linear-gradient(to top,var(--bg) 60%,transparent);pointer-events:none}.composer__form{pointer-events:auto;max-width:var(--column);margin-inline:auto;display:flex;align-items:center;gap:var(--s-2);min-height:56px;padding-inline:var(--s-4) var(--s-2);border-radius:var(--r-pill);background:var(--surface-raised);border:1px solid var(--hairline-strong);box-shadow:var(--shadow-md);transition:border-color var(--t-press) var(--ease-out)}.composer__form:focus-within{border-color:var(--accent)}.composer__input{flex:1 1 auto;min-width:0;min-height:var(--touch);font-size:16px;color:var(--text);caret-color:var(--accent);text-overflow:ellipsis}.composer__input::placeholder{color:var(--text-3)}.composer__send{flex:0 0 40px;height:40px;display:grid;place-items:center;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-ink);transition:transform var(--t-press) var(--ease-out),opacity var(--t-press) var(--ease-out)}.composer__send:active{transform:scale(.96)}.composer__send:disabled{opacity:.35;cursor:default}.hold{position:relative;overflow:hidden;isolation:isolate}.hold__fill{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--danger-soft);clip-path:inset(0 100% 0 0);transition:clip-path .2s var(--ease-out);z-index:-1}[dir=rtl] .hold__fill{clip-path:inset(0 0 0 100%)}.hold[data-holding=true] .hold__fill{clip-path:inset(0 0 0 0);transition:clip-path var(--hold-duration, 1.2s) linear}.hold[data-holding=true]{color:var(--danger)}.auth{width:100%;max-width:400px;display:flex;flex-direction:column;gap:var(--s-6)}.auth__title{font-size:clamp(36px,10vw,56px)}.auth__lede{color:var(--text-2);font-size:16px;max-width:34ch}.auth__error{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--danger-soft);color:var(--danger);font-size:14px;line-height:1.4}.auth__google{min-height:48px;display:flex;align-items:center}.auth__status{display:inline-flex;align-items:center;gap:var(--s-2);color:var(--text-2);font-size:14px}.auth__dev{display:flex;flex-direction:column;gap:var(--s-3);padding-top:var(--s-6);border-top:1px solid var(--hairline)}.auth__dev-label{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3)}.field{display:flex;flex-direction:column;gap:var(--s-2)}.field__label{font-size:13px;color:var(--text-2)}.select{min-height:var(--touch);padding-inline:var(--s-3);border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hairline);color:var(--text);-moz-appearance:none;appearance:none;-webkit-appearance:none}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);padding-inline:var(--s-6);border-radius:var(--r-md);font-weight:600;font-size:15px;transition:transform var(--t-press) var(--ease-out),background-color var(--t-press) var(--ease-out)}.button:active:not(:disabled){transform:scale(.96)}.button:disabled{opacity:.5;cursor:default}.button--primary{background:var(--text);color:var(--bg)}.button--secondary{background:var(--surface-raised);border:1px solid var(--hairline);color:var(--text)}.spinner{width:18px;height:18px;border-radius:50%;border:2px solid var(--hairline-strong);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--s-3);color:var(--text-3);font-size:14px;padding-block:var(--s-8)}@media(prefers-reduced-motion:reduce){.popover,.progress__fill,.check__mark,.check__ring,.disclosure svg{transition-duration:1ms}.chip:active,.check:active,.account__trigger:active,.composer__send:active,.button:active:not(:disabled){transform:none}.hold[data-holding=true] .hold__fill{transition:clip-path var(--hold-duration, 1.2s) linear}.spinner{animation-duration:1.6s}}
