:root{--lalo-orange: #F6921F;--lalo-magenta: #DD67B0;--lalo-purple: #9C53F6;--lalo-grad: linear-gradient(90deg, #F6921F 0%, #F28038 35%, #DD67B0 55%, #B25CE2 72%, #9C53F6 100%);--font-display: "Jost", "Futura", "Avenir Next", "Century Gothic", "Montserrat", "Trebuchet MS", sans-serif;--bg: #01030E;--panel: #0C0E1C;--panel-2: #12142a;--line: rgba(247, 247, 247, .09);--card: #12142a;--card-hover: #181b34;--card-line: rgba(247, 247, 247, .16);--ink: #F7F7F7;--muted: #9BA0B8;--accent: var(--lalo-orange);--accent-2: var(--lalo-magenta);--danger: #f87171;--good: #4ade80;--warn: #fb923c;--tap: 44px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Inter,Segoe UI,system-ui,sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}html{-webkit-tap-highlight-color:transparent;overscroll-behavior:none}body{background:var(--bg);color:var(--ink);font-size:14px;line-height:1.4;-webkit-font-smoothing:antialiased;overscroll-behavior:none}.loading{padding:40px;color:var(--muted)}.login{max-width:360px;margin:80px auto;padding:24px;background:var(--panel);border-radius:12px;border:1px solid var(--line)}.login-lockup{display:flex;flex-direction:column;align-items:center;text-align:center;margin:6px 0 20px}.login-lockup svg{width:150px}.login-lockup .wm{font-family:var(--font-display);font-weight:400;font-size:23px;letter-spacing:.42em;text-indent:.42em;margin-top:8px}.login-lockup .descriptor{font-family:var(--font-display);font-size:12.5px;letter-spacing:.42em;text-indent:.42em;margin-top:1px}.login form{display:flex;flex-direction:column;gap:12px}.login label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.login button[type=submit]{padding:10px;font-size:14px}.hint{color:var(--muted);font-size:12px;margin-top:12px}.hint-actions{display:flex;flex-wrap:wrap;align-items:center;gap:0 20px;margin-top:4px}.linklike{background:none;border:none;padding:0 2px;font-family:inherit;font-size:13px;color:var(--accent);text-decoration:underline;cursor:pointer;min-height:var(--tap);display:inline-flex;align-items:center;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.linklike:active{opacity:.6}.field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.pw-wrap{position:relative;display:flex;min-height:var(--tap)}.pw-input{flex:1;min-width:0;padding-right:calc(var(--tap) + 2px)}.pw-toggle{position:absolute;top:0;right:0;bottom:0;width:var(--tap);display:flex;align-items:center;justify-content:center;padding:0;background:none;border:none;border-radius:0 6px 6px 0;color:var(--muted)}.pw-toggle:active{color:var(--accent)}@media(hover:hover){.pw-toggle:hover{color:var(--ink)}}input,select,textarea,button{font-family:inherit;font-size:16px;color:var(--ink);background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:8px 10px;min-height:var(--tap);touch-action:manipulation}button{cursor:pointer;font-size:14px;-webkit-user-select:none;user-select:none}button:active{filter:brightness(1.18)}button:disabled:active{filter:none}input[type=checkbox],input[type=radio]{min-height:0;width:22px;height:22px;margin:0;padding:0;flex:0 0 auto;accent-color:var(--accent)}button.primary{background:var(--accent);color:#01030e;border-color:transparent;font-weight:600}button.primary:disabled{opacity:.5;cursor:not-allowed}button.ghost{background:transparent}button.ghost.danger{color:var(--danger)}.file-label{display:inline-flex;align-items:center;cursor:pointer;padding:8px 10px;border:1px solid var(--line);border-radius:6px;min-height:var(--tap);touch-action:manipulation;-webkit-user-select:none;user-select:none}.file-label input{display:none}.app{display:flex;flex-direction:column;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom)}.topbar{position:sticky;top:0;z-index:10;background:var(--panel);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}.topbar-main{display:flex;align-items:center;gap:10px;padding:10px 16px 8px}.brand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;white-space:nowrap;min-height:var(--tap);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.brand svg{width:36px;height:19px;flex-shrink:0}.brand-wm{font-family:var(--font-display);font-weight:400;font-size:14px;letter-spacing:.3em}.gtx{background:var(--lalo-grad);-webkit-background-clip:text;background-clip:text;color:transparent}.view-switcher{max-width:200px;flex:1 1 auto;min-width:0}.topbar-nav{display:flex;gap:8px;padding:0 12px 10px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}.topbar-nav::-webkit-scrollbar{display:none}.topbar-nav a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:var(--tap);color:var(--muted);text-decoration:none;padding:0 14px;border-radius:22px;font-size:13px;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.topbar-nav a.active{background:var(--accent);color:#01030e}.topbar-nav a:active{background:var(--panel-2);color:var(--ink)}.topbar-nav a.active:active{background:var(--accent);color:#01030e;filter:brightness(1.18)}.topbar-right{display:flex;align-items:center;gap:8px;margin-left:auto}.sync{color:var(--accent);font-size:10px;line-height:1}.who{color:var(--muted);font-size:12px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}button.ghost.icon{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);padding:0;font-size:16px;line-height:1}button.ghost.icon:active{color:var(--accent);filter:none}.quick-capture{display:flex;align-items:center;gap:12px;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));border-bottom:1px solid var(--line)}.quick-capture-collapsed{justify-content:flex-end}.quick-capture input{flex:1;min-width:0;padding:12px;font-size:16px}.quick-capture button{padding-left:16px;padding-right:16px}main{padding:16px;max-width:920px;width:100%;margin:0 auto}.section{margin-bottom:24px}.section h3{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 8px}.section .count{background:var(--panel-2);border-radius:10px;padding:1px 8px;margin-left:6px;color:var(--ink);font-weight:400;font-size:11px}.task-list{display:flex;flex-direction:column;gap:10px}.task-card{display:flex;align-items:flex-start;gap:14px;background:var(--card);border:1px solid var(--card-line);border-radius:12px;padding:16px 18px;cursor:pointer;box-shadow:0 1px 2px #00000040,0 2px 8px #0000002e;transition:border-color .12s,box-shadow .12s,transform .12s,background .12s}@media(hover:hover){.task-card:hover{border-color:var(--accent);background:var(--card-hover);box-shadow:0 2px 4px #0000004d,0 6px 18px #00000040;transform:translateY(-1px)}}.task-swipe:not(.pending):not(.collapsing) .task-card:active{background:var(--card-hover)}.task-card.overdue{border-left:3px solid var(--danger)}.task-card.status-blocked{opacity:.85}.task-card.status-done{opacity:.55}.task-card.status-done .task-card-title{text-decoration:line-through}.task-swipe{display:grid;grid-template-rows:1fr;grid-template-columns:minmax(0,1fr);transition:grid-template-rows .25s ease,opacity .25s ease,margin-bottom .25s ease}.task-swipe-inner{position:relative;min-height:0;min-width:0}.task-swipe.collapsing{grid-template-rows:0fr;opacity:0;margin-bottom:-10px}.task-swipe.collapsing .task-swipe-inner{overflow:hidden}.task-swipe-action{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:flex-end;padding-right:22px;border-radius:12px;font-weight:600;font-size:14px;pointer-events:none;background:#4ade8024;color:var(--good);transition:background .12s,color .12s}.task-swipe-action.armed{background:var(--good);color:#06210f}.task-swipe-action.restore{background:#9c53f624;color:var(--lalo-purple)}.task-swipe-action.restore.armed{background:var(--lalo-purple);color:#01030e}.task-swipe .task-card{position:relative;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.task-swipe.pending .task-card,.task-swipe.collapsing .task-card{border-color:var(--good);background:#4ade800f;cursor:default}.task-swipe.pending.restore-dir .task-card,.task-swipe.collapsing.restore-dir .task-card{border-color:var(--lalo-purple);background:#9c53f60f}.task-swipe.pending .task-card-body,.task-swipe.collapsing .task-card-body{opacity:.35}.task-swipe.pending .task-card.status-done,.task-swipe.collapsing .task-card.status-done{opacity:1}.task-undo{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:0 16px;border-radius:12px;background:linear-gradient(to right,transparent 25%,var(--bg) 55%)}.task-undo-label{font-weight:700;font-size:14px;color:var(--good)}.task-swipe.restore-dir .task-undo-label{color:var(--lalo-purple)}.task-undo-btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--tap);min-width:var(--tap);border:1px solid var(--card-line);background:var(--panel-2);color:var(--ink);font-weight:600;font-size:13px;border-radius:9px;padding:0 16px;cursor:pointer;touch-action:manipulation}.task-undo-btn:active{border-color:var(--accent);color:var(--accent)}@media(hover:hover){.task-undo-btn:hover{border-color:var(--accent);color:var(--accent)}}.task-undo-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--good);border-radius:0 0 12px 12px;transform-origin:left;animation:undo-drain linear forwards}.task-swipe.restore-dir .task-undo-progress{background:var(--lalo-purple)}@keyframes undo-drain{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.task-swipe{transition:none}}.task-card-body{flex:1;min-width:0}.task-card-title{font-weight:600;font-size:15.5px;line-height:1.35}.task-card-notes{color:var(--muted);font-size:13px;line-height:1.4;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task-card-meta{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}.pill{font-size:11px;background:var(--panel-2);color:var(--muted);padding:1px 8px;border-radius:10px;border:1px solid var(--line)}.pill.p-critical{background:#f8717126;color:var(--danger)}.pill.p-important{background:#dd67b026;color:var(--accent-2)}.pill.p-background{background:#9ba0b826}.pill.p-due{background:#f6921f26;color:var(--accent)}.pill.p-overdue{background:#f8717133;color:var(--danger)}.pill.p-recur{background:#4ade8026;color:var(--good)}.pill.p-domain{background:#9c53f626;color:var(--lalo-purple)}.pill.p-blocked{background:#fb923c26;color:var(--warn)}.pill.p-assignee{background:#dd67b01f;color:var(--accent-2)}.pill.p-shared{background:#2dd4bf26;color:#2dd4bf}.empty{color:var(--muted);font-style:italic;padding:8px 4px}.error-banner{background:#f8717126;color:var(--danger);padding:8px 16px}.error{color:var(--danger);margin:0;font-size:12px}.ok{color:var(--good);font-size:12px}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}.toolbar>*{flex:0 0 auto}.toolbar>input[type=text],.toolbar>input:not([type]){flex:1 1 220px;min-width:0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));touch-action:manipulation}.modal{background:var(--panel);border:1px solid var(--line);border-radius:12px;width:480px;max-width:100%;padding:20px;max-height:90dvh;overflow:auto;overscroll-behavior:contain}.modal h2{margin:0 0 12px;font-size:16px}.modal label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);margin-bottom:10px}.modal label.inline{flex-direction:row;align-items:center;gap:10px;font-size:13px;color:var(--ink);min-height:var(--tap);margin-bottom:4px;-webkit-user-select:none;user-select:none}.modal label.inline:active{color:var(--accent)}.modal .row{display:flex;gap:12px}.modal .row>label{flex:1}.modal textarea{min-height:auto;-webkit-user-select:text;user-select:text}.modal fieldset{border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin:8px 0}.modal fieldset legend{color:var(--muted);font-size:12px;padding:0 4px}.modal-actions{display:flex;justify-content:space-between;gap:12px;margin-top:16px;position:sticky;bottom:-20px;background:var(--panel);border-top:1px solid var(--line);padding:12px 0 20px;margin-bottom:-20px;z-index:1}.modal-actions>div{display:flex;gap:12px}.dashboard{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px}.card h3{margin:0 0 8px;font-size:14px}.card h4{margin:0 0 8px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.kv{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}.kv li{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px dashed var(--line)}.kv li:last-child{border-bottom:0}.kv li.empty{border-bottom:0;color:var(--muted);font-style:italic}.kv strong{font-weight:600}.settings{display:grid;gap:16px;max-width:640px}.settings .row{display:flex;gap:12px}.settings .row>input{flex:1;min-width:0}.invites{list-style:none;padding:0;margin:0}.invites li{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:10px 0;border-bottom:1px dashed var(--line)}.invites li:last-child{border-bottom:0}.invites .row{gap:12px}.hint-list{color:var(--muted);padding-left:18px}.meta{color:var(--muted);font-size:12px}code{background:var(--panel-2);padding:2px 6px;border-radius:4px}.hint-inline{color:var(--muted);font-weight:400;font-size:11px}@media(max-width:600px){.topbar-main{padding:6px max(12px,env(safe-area-inset-right)) 6px max(12px,env(safe-area-inset-left));gap:12px}.topbar-nav{padding:0 max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left))}.brand svg{width:30px;height:16px}.brand-wm{font-size:12.5px}.view-switcher{max-width:none}.topbar-right .who{display:none}.quick-capture{padding:10px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left))}main{padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}.modal fieldset .row{flex-wrap:wrap}.modal fieldset .row>label{flex:1 1 100%}}
