:root{color-scheme:light;--bg:#f4f5f7;--surface:#ffffff;--input:#f8f9fb;--text:#202d42;--muted:#626f80;--border:#d7dde5;--divider:#e9ecf0;--accent:#19365c;--accent-hover:#112846;--on-accent:#ffffff;--accent-text:#284a76;--soft:#e9edf3;--soft-hover:#dce3ed;--track:#e5e9ef;--progress:#5276a5;--focus:#7899c2;--danger:#a63e38;--danger-soft:#faeae8;--toast:#202d42;--toast-text:#ffffff;--backdrop:#101c3066;--shadow:#14263d08}
:root[data-theme="dark"]{color-scheme:dark;--bg:#111824;--surface:#192332;--input:#141e2c;--text:#e1e6ed;--muted:#a4afbf;--border:#364355;--divider:#2a3545;--accent:#294f7f;--accent-hover:#356091;--on-accent:#ffffff;--accent-text:#b2c9e7;--soft:#222f42;--soft-hover:#2e4059;--track:#2b3748;--progress:#799bc6;--focus:#92b3dd;--danger:#f0a49c;--danger-soft:#422b30;--toast:#dce5f1;--toast-text:#192332;--backdrop:#060c16aa;--shadow:#00000020}
@font-face{font-family:Vazirmatn;src:url('/fonts/Vazirmatn.woff2') format('woff2');font-weight:100 900;font-display:swap}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Vazirmatn,Tahoma,sans-serif;font-size:14px;line-height:1.8}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;border-radius:10px;padding:10px 18px;transition:background .15s}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}input{width:100%;border:1px solid var(--border);background:var(--surface);padding:12px 14px;border-radius:10px;min-width:0;color:var(--text)}input:focus{outline:2px solid var(--focus);border-color:var(--accent)}input::placeholder{color:var(--muted)}label{display:block;margin:12px 0 6px;font-size:13px}h1,h2,p{margin-top:0}h1{font-size:32px;font-weight:650;letter-spacing:-1px;margin-bottom:0}h2{font-size:21px;font-weight:650;margin-bottom:4px}.primary{background:var(--accent);color:var(--on-accent)}.primary:hover{background:var(--accent-hover)}.secondary{background:var(--soft);color:var(--accent-text);white-space:nowrap}.secondary:hover{background:var(--soft-hover)}.text-button{background:transparent;color:var(--muted)}.icon-button{background:transparent;color:var(--muted);font-size:23px;padding:4px 12px}.icon-button:hover{background:var(--danger-soft);color:var(--danger)}.full{width:100%;margin-top:24px}.hint{color:var(--muted);font-size:12px;margin-bottom:0}.eyebrow{font-size:11px;color:var(--muted)}header{height:90px;max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 36px;border-bottom:1px solid var(--border)}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--text);font-family:Arial,sans-serif;font-weight:700;font-size:30px;direction:ltr;letter-spacing:-1.5px}.brand-mark{background:var(--accent);color:var(--on-accent);font-size:21px;width:33px;height:33px;border-radius:11px;text-align:center;line-height:33px}.dot{color:var(--accent-text)}#account{display:flex;align-items:center;gap:12px;font-size:12px}main{max-width:1108px;margin:0 auto;padding:40px 0 20px}.welcome{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.layout{display:grid;grid-template-columns:232px minmax(0,1fr);gap:36px}aside{padding-top:3px}#list-nav{display:flex;flex-direction:column;gap:7px}.nav-item{display:flex;width:100%;align-items:center;gap:12px;background:transparent;text-align:right;padding:14px;color:var(--muted);border:1px solid transparent}.nav-item.active{background:var(--soft);border-color:var(--border);color:var(--accent-text)}.nav-item .nav-name{flex:1;overflow-wrap:anywhere}.nav-item small{font-size:11px;color:var(--muted)}.nav-item .nav-icon{font-size:19px;color:var(--muted)}.aside-note{border-top:1px solid var(--border);margin:32px 14px;padding:27px 8px;color:var(--muted);display:flex;gap:13px;font-size:13px}.aside-note>span{font-size:28px;color:var(--muted)}.list-panel{background:var(--surface);border:1px solid var(--border);border-radius:18px;min-height:360px;padding:30px 32px;box-shadow:0 4px 20px var(--shadow)}.list-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:10px}.list-heading h2{font-size:26px;overflow-wrap:anywhere}.list-actions{display:flex;align-items:center;gap:5px}.add-row,.command-row{display:flex;gap:8px}.add-row input{background:var(--input)}.item{display:flex;align-items:center;gap:13px;min-height:61px;border-bottom:1px solid var(--divider);padding:7px 2px}.item label{display:flex;gap:13px;align-items:center;flex:1;cursor:pointer;margin:0;font-size:14px;overflow-wrap:anywhere}.item input{appearance:none;width:21px;height:21px;flex-shrink:0;border:1.5px solid var(--border);border-radius:7px;padding:0;cursor:pointer}.item input:checked{background:var(--accent);border-color:var(--accent)}.item input:checked:after{content:'✓';display:block;color:var(--on-accent);font-size:15px;line-height:19px;text-align:center}.item.done .item-text{text-decoration:line-through;color:var(--muted)}.item .icon-button{font-size:20px}.progress{height:4px;border-radius:5px;background:var(--track);overflow:hidden;margin-top:24px}.progress span{display:block;background:var(--progress);height:100%;width:0;transition:width .2s}.voice-panel{margin-top:20px;background:var(--soft);border:1px solid var(--border);border-radius:18px;padding:24px 30px}.voice-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:17px}.voice-heading h2{font-size:17px}.voice-heading p{font-size:12px;color:var(--muted);margin:4px 0 0}.mic{width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;background:var(--surface);color:var(--accent-text);border:1px solid var(--border);border-radius:50%;padding:12px}.mic svg{width:22px;height:22px}.mic.recording{background:#c75746;color:var(--on-accent);animation:pulse 1s infinite}.command-row input{border-color:var(--border);font-size:12px}.command-row button{background:var(--soft-hover);font-size:12px}details{font-size:11px;color:var(--muted);margin-top:15px}summary{cursor:pointer}details p{padding-top:10px;margin:0}.empty{text-align:center;padding:40px 10px}.empty-icon{font-size:40px;color:var(--muted)}.empty h2{margin:12px 0;font-size:21px}.empty p,.empty-small{color:var(--muted);font-size:13px}.empty-small{text-align:center;padding:30px 0}.empty .primary{margin-top:10px}footer{text-align:center;color:var(--muted);font-size:11px;margin:28px 0}.auth{max-width:410px;margin:18px auto;text-align:center}.auth h1{font-size:37px;line-height:1.55;margin-top:12px}.auth h1 span{color:var(--accent-text)}.intro{font-size:13px;color:var(--muted);margin:18px 0 24px}.auth-card{text-align:right;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:25px 30px}.tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:18px}.tabs button{background:transparent;border-radius:0;flex:1;color:var(--muted)}.tabs .active{color:var(--accent);border-bottom:2px solid var(--accent)}.auth-foot{font-size:11px;color:var(--muted);margin-top:22px}.error{color:var(--danger);font-size:12px;margin:10px 0 0}.error:empty{display:none}dialog{width:min(440px,calc(100% - 32px));border:1px solid var(--border);border-radius:18px;padding:28px;color:var(--text)}dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}.dialog-actions{display:flex;gap:8px;margin-top:24px}.member{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding:10px 0}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:var(--toast);color:var(--toast-text);padding:12px 24px;border-radius:12px;max-width:90vw;z-index:10;box-shadow:0 5px 25px #0002}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@keyframes pulse{50%{box-shadow:0 0 0 7px #c7574620}}@media(max-width:1180px){main{padding:32px 30px}}@media(max-width:700px){header{height:72px;padding:0 20px}main{padding:25px 16px}.welcome{margin-bottom:20px}h1{font-size:27px}.layout{display:block}#list-nav{flex-direction:row;overflow:auto;padding-bottom:12px}.nav-item{width:auto;min-width:135px;flex-shrink:0;padding:10px 13px}.aside-note{display:none}.list-panel{padding:23px 18px;margin-top:8px;min-height:320px}.list-heading{margin-bottom:20px}.list-heading h2{font-size:23px}.list-actions .secondary{font-size:11px;padding:9px}.voice-panel{padding:20px 18px}.command-row{flex-wrap:wrap}.command-row input{flex:1 1 100%}.command-row button{margin-right:auto}.auth{margin-top:5px}.auth h1{font-size:32px}.auth-card{padding:22px}.add-row button{padding:10px 12px;white-space:nowrap}.empty{padding:35px 0}.empty h2{font-size:18px}.welcome .primary{font-size:12px}.eyebrow{font-size:10px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.add-row button{flex-shrink:0;white-space:nowrap}

.header-actions{display:flex;align-items:center;gap:16px}.theme-toggle{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;padding:10px;border:1px solid var(--border);border-radius:50%;background:var(--surface);color:var(--accent-text)}.theme-toggle:hover{background:var(--soft)}.theme-toggle svg{width:22px;height:22px}.theme-sun{display:none}:root[data-theme="dark"] .theme-moon{display:none}:root[data-theme="dark"] .theme-sun{display:block}dialog{background:var(--surface)}@media(max-width:700px){.header-actions{gap:8px}#account{gap:4px}#username{max-width:75px;overflow:hidden;text-overflow:ellipsis}.theme-toggle{padding:8px}.brand{font-size:26px}}
/* Phone-first app shell and persistent bottom navigation. */
body{min-height:100dvh}header{max-width:560px;height:76px;padding:0 20px}main{max-width:560px;padding:28px 18px 120px;padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}.layout{display:block}.aside-note{display:none}#list-nav{flex-direction:row;overflow:auto;padding-bottom:12px;scrollbar-width:none}.nav-item{width:auto;min-width:130px;flex-shrink:0;padding:10px 13px}.list-panel{padding:24px 18px;margin-top:8px;min-height:320px}.list-heading{flex-wrap:wrap}.welcome{gap:12px}.welcome h1,.page-heading h1{font-size:27px}.welcome .primary{font-size:12px;white-space:nowrap}.list-actions .secondary{font-size:12px}.page-heading{margin-bottom:26px}.page-heading .hint{margin-top:10px}.app-page{min-width:0}.app-page h1:focus{outline:none}.voice-panel{margin-top:0;padding:26px 20px}.voice-heading{align-items:flex-start}.voice-heading h2{font-size:21px}.voice-heading p{line-height:2;max-width:250px}.mic{width:58px;height:58px}.command-row{flex-wrap:wrap}.command-row input{flex:1 1 100%;font-size:16px}.command-row button{margin-right:auto;min-height:44px;padding-inline:24px}.voice-panel details{font-size:13px;margin-top:24px}.profile-card{padding:32px 24px;border:1px solid var(--border);border-radius:22px;background:var(--surface);text-align:center}.profile-avatar{display:grid;place-items:center;width:72px;height:72px;border-radius:24px;background:var(--soft);color:var(--accent-text);margin:0 auto 20px}.profile-avatar svg{width:32px;height:32px}#account{flex-direction:column;gap:16px;margin:8px 0 24px}#username{font-size:20px;font-weight:600;max-width:100%;overflow-wrap:anywhere}#logout{color:var(--danger);background:var(--danger-soft);min-height:44px;min-width:120px}footer{display:none}input{font-size:16px}.item label{min-height:44px}.item .icon-button{min-width:44px;min-height:44px}.bottom-nav{--nav-index:0;position:fixed;z-index:5;bottom:calc(12px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);width:calc(100% - 28px);max-width:524px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:7px;border:1px solid var(--border);border-radius:26px;background:var(--surface);box-shadow:0 12px 36px #00000018;isolation:isolate}.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:62px;padding:7px 4px;background:transparent;color:var(--muted);font-size:11px;border-radius:20px;transition:color .2s,transform .2s}.bottom-nav button:active{transform:scale(.94)}.bottom-nav svg{width:23px;height:23px;transition:transform .35s cubic-bezier(.22,1,.36,1)}.bottom-nav button[aria-current="page"]{color:var(--accent-text);font-weight:650}.bottom-nav button[aria-current="page"] svg{transform:translateY(-2px)}.nav-indicator{position:absolute;z-index:-1;top:7px;right:7px;bottom:7px;width:calc((100% - 14px)/3);border-radius:20px;background:var(--soft);transform:translateX(calc(var(--nav-index)*-100%));transition:transform .38s cubic-bezier(.22,1,.36,1)}.toast{bottom:calc(104px + env(safe-area-inset-bottom,0px))}@media(prefers-reduced-motion:reduce){.bottom-nav *{transition:none!important}}
#workspace:has(.mic.recording) [data-page="voice"] svg{color:var(--danger)}#workspace:has(.mic.recording) [data-page="voice"] span::after{content:' •';color:var(--danger)}

/* Searchable list selection. */
#list-switcher{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:16px;margin-bottom:12px;background:var(--surface);border:1px solid var(--border);color:var(--text);text-align:start;border-radius:14px}#list-switcher:hover{background:var(--soft)}#selected-list-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:650}#list-switcher>span:last-child{flex-shrink:0;color:var(--accent-text);font-size:12px}
#switch-dialog{width:min(480px,calc(100% - 24px));max-height:85dvh;padding:22px;overflow:hidden}#switch-dialog[open]{display:flex;flex-direction:column;gap:12px}.switch-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.switch-heading h2{margin:0}#list-search{flex-shrink:0}#switch-dialog #list-nav{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;min-height:0;scrollbar-width:thin;padding:4px;gap:6px;overscroll-behavior:contain}#switch-dialog .nav-item{width:100%;min-width:0;flex-shrink:0;min-height:56px;text-align:start}#switch-dialog .nav-item:hover{background:var(--soft)}#switch-dialog .nav-name{min-width:0}#switch-dialog small{flex-shrink:0}#switch-create{flex-shrink:0}#switch-dialog .empty-small{margin:0;padding:24px 0}
@media(max-width:700px){#switch-dialog{margin:auto auto 0;width:100%;max-height:85dvh;border-radius:22px 22px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom,0px))}}

#profile-form { text-align: right; margin-top: 24px; }
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.profile-avatar [hidden] { display: none; }
.avatar-fieldset { border: 0; padding: 0; margin: 22px 0; min-width: 0; }
.avatar-fieldset legend { margin-bottom: 12px; }
.avatar-options { display: flex; flex-wrap: wrap; gap: 12px; }
.avatar-option { position: relative; display: inline-flex; cursor: pointer; margin: 0; }
.avatar-option input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.avatar-option img, .avatar-option span { width: 60px; height: 60px; border-radius: 50%; object-fit: cover; border: 3px solid transparent; display: grid; place-items: center; font-size: 32px; }
.avatar-option input:checked + * { border-color: var(--accent, #277d68); }
.avatar-option input:focus-visible + * { outline: 2px solid currentColor; outline-offset: 3px; }
.profile-credit { margin-top: 26px; font-size: 12px; }
.profile-credit a { color: inherit; }
#avatar-dialog { max-height: 80dvh; overflow-y: auto; } #avatar-dialog .avatar-options { margin-top: 16px; }
.item-avatar { width: 32px; height: 32px; flex: 0 0 32px; object-fit: cover; border-radius: 50%; margin-inline-end: 10px; }

/* Home screen installation guide. */
#install-dialog{max-height:85dvh;overflow-y:auto;line-height:2}#install-dialog h2{font-size:21px}#install-dialog ol{padding-inline-start:24px}#install-dialog li{margin-block:12px}#install-app{font-size:12px;white-space:nowrap;padding:8px}header{padding-top:env(safe-area-inset-top,0px);height:calc(76px + env(safe-area-inset-top,0px))}
