:root{--sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--bg:#0b0c0e;--panel:#161719;--panel-2:#1c1d20;--border:#ffffff17;--border-strong:#ffffff26;--text:#e3e3e6;--text-muted:#8b8b92;--text-dim:#65656c;--accent:#5e6ad2;--accent-hover:#6b76e0;--accent-bg:#5e6ad224;--danger:#e5484d;--danger-bg:#e5484d1f;--green-bg:#4cb7821f;--yellow-bg:#e2b53e1f;--radius:6px;--radius-lg:8px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:14px;line-height:1.5}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);min-height:100vh;margin:0;padding:0}#root{min-height:100vh}p{margin:0}code{font-family:var(--mono);background:var(--panel-2);border:1px solid var(--border);color:#c7c7cd;border-radius:4px;padding:1px 6px;font-size:.85em}.app-wrapper{min-height:100vh;padding:var(--sp-6) var(--sp-4);justify-content:center;display:flex}.content-column{gap:var(--sp-4);text-align:left;flex-direction:column;width:100%;max-width:720px;display:flex}.app-header{gap:var(--sp-2);flex-direction:column;display:flex}.app-header__logo{align-items:center;gap:var(--sp-2);display:flex}.app-header__icon{background:var(--accent);color:#fff;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;font-size:15px;display:flex}.app-header h1{color:#fff;letter-spacing:-.02em;margin:0;font-size:19px;font-weight:600}.app-header__subtitle{color:var(--text-muted);font-size:13px}.app-header__badges{gap:var(--sp-2);margin-top:var(--sp-1);display:flex}.badge{border:1px solid var(--border);color:var(--text-muted);background:var(--panel-2);letter-spacing:.02em;border-radius:5px;padding:2px 8px;font-size:11px;font-weight:500}.badge-accent{color:#aab2f5;background:var(--accent-bg);border-color:#5e6ad266}.badge-error{color:#f4a7a9;background:var(--danger-bg);border-color:#e5484d66}.badge-version{font-family:var(--mono)}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-5);flex-direction:column;display:flex}.auth-header{margin-bottom:var(--sp-4)}.auth-header h2{color:#fff;margin:0 0 4px;font-size:17px;font-weight:600}.auth-header p{color:var(--text-muted);font-size:13px}.auth-switch{margin-top:var(--sp-4);color:var(--text-muted);text-align:center;font-size:13px}.auth-switch button{color:var(--accent);cursor:pointer;font:inherit;background:0 0;border:none;padding:0}.auth-switch button:hover{text-decoration:underline}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{color:var(--text-muted);font-size:12px;font-weight:500}.form-input,.form-select,.edit-input,.edit-select{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);font:inherit;outline:none;padding:8px 10px;font-size:13px;transition:border-color .15s,box-shadow .15s}.form-input:focus,.form-select:focus,.edit-input:focus,.edit-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}.form-input::placeholder{color:var(--text-dim)}.form-select{cursor:pointer}.btn{border-radius:var(--radius);font:inherit;cursor:pointer;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:6px;padding:8px 14px;font-size:13px;font-weight:500;transition:background .15s,border-color .15s,opacity .15s,color .15s;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-ghost{color:var(--text-muted);border-color:var(--border);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--panel-2);color:var(--text)}.btn-danger{color:#f4a7a9;background:0 0;border-color:#e5484d4d}.btn-danger:hover:not(:disabled){background:var(--danger-bg);color:#fff;border-color:var(--danger)}.btn-sm{padding:5px 9px;font-size:12px}.btn-full{width:100%}.alert{align-items:center;gap:var(--sp-2);border-radius:var(--radius);border:1px solid var(--border);padding:10px 12px;font-size:13px;display:flex}.alert-error{background:var(--danger-bg);color:#f4a7a9;border-color:#e5484d4d}.alert-success{background:var(--green-bg);color:#86d6ab;border-color:#4cb7824d}.alert__icon{flex-shrink:0}.user-bar{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;padding:10px 14px;font-size:13px;display:flex}.user-bar__greeting{color:var(--text-muted)}.user-bar__greeting strong{color:var(--text);font-weight:600}.stats-grid{gap:var(--sp-2);grid-template-columns:repeat(4,1fr);display:grid}.stat-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4);flex-direction:column;gap:2px;display:flex}.stat-card__value{color:#fff;font-variant-numeric:tabular-nums;font-size:22px;font-weight:600}.stat-card__label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:11px}.stat-active .stat-card__value{color:#aab2f5}.stat-done .stat-card__value{color:#86d6ab}.stat-progress .stat-card__value{color:var(--accent)}.controls-bar{gap:var(--sp-3);flex-direction:column;display:flex}.controls-row{gap:var(--sp-2);display:flex}.filter-tabs{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);gap:2px;padding:2px;display:flex}.filter-tab{color:var(--text-muted);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:4px;padding:5px 10px;font-size:12px;font-weight:500;transition:background .15s,color .15s}.filter-tab:hover{color:var(--text)}.filter-tab.active{background:var(--panel);color:#fff;box-shadow:0 1px 2px #0000004d}.loading-state,.empty-state{justify-content:center;align-items:center;gap:var(--sp-3);padding:var(--sp-6);color:var(--text-muted);text-align:center;flex-direction:column;display:flex}.empty-state__icon{opacity:.55;font-size:26px}.empty-state__title{color:var(--text);font-size:14px;font-weight:600}.empty-state__sub{color:var(--text-muted);font-size:13px}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.task-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.task-item{align-items:center;gap:var(--sp-3);border-bottom:1px solid var(--border);padding:10px 8px;transition:background .12s;display:flex}.task-item:last-child{border-bottom:none}.task-item:hover{background:#ffffff05}.task-item.completed .task-text{color:var(--text-dim);text-decoration:line-through}.task-checkbox{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;flex-shrink:0}.task-content{justify-content:space-between;align-items:center;gap:var(--sp-3);flex:1;min-width:0;display:flex}.task-text{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;overflow:hidden}.task-meta{align-items:center;gap:var(--sp-2);flex-shrink:0;display:flex}.task-actions{opacity:.5;flex-shrink:0;gap:4px;transition:opacity .12s;display:flex}.task-item:hover .task-actions{opacity:1}.priority-pill{border:1px solid var(--border);white-space:nowrap;border-radius:5px;padding:2px 8px;font-size:11px;font-weight:500}.priority-pill.high{color:#f4a7a9;background:var(--danger-bg);border-color:#e5484d4d}.priority-pill.medium{color:#e6c869;background:var(--yellow-bg);border-color:#e2b53e4d}.priority-pill.low{color:#86d6ab;background:var(--green-bg);border-color:#4cb7824d}.edit-row{gap:var(--sp-2);flex:1;align-items:center;display:flex}.edit-input{flex:1}.edit-select{width:auto}.app-footer{padding-top:var(--sp-4);margin-top:var(--sp-2);border-top:1px solid var(--border);color:var(--text-dim);flex-direction:column;gap:2px;font-size:12px;display:flex}.app-footer code{font-size:11px}@media (width<=560px){.app-wrapper{padding:var(--sp-4) var(--sp-3)}.stats-grid{grid-template-columns:repeat(2,1fr)}.controls-row{flex-direction:column}}
