:root{--text:#3f3a45;--text-h:#1a1720;--bg:#faf9fb;--surface:#fff;--border:#e5e4e7;--accent:#7a3bff;--accent-soft:#9b6bff;--accent-strong:#5f22e0;--accent-contrast:#fff;--danger:#c4432b;--shadow-sm:0 1px 2px #170f290f;--shadow-md:0 6px 20px #170f2914;--shadow-lg:0 16px 40px #170f2924;--ring:0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent);--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--ease:cubic-bezier(.16, 1, .3, 1);--sans:system-ui, "Segoe UI", Roboto, sans-serif;font:16px/1.5 var(--sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);-webkit-tap-highlight-color:transparent}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#d3d0d8;--text-h:#f5f4f7;--bg:#17151b;--surface:#201e26;--border:#322f3a;--accent:#a988ff;--accent-soft:#c3aeff;--accent-strong:#8a5cf5;--accent-contrast:#17151b;--danger:#e28b7a;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 6px 24px #00000059;--shadow-lg:0 20px 50px #00000073}}*{box-sizing:border-box}body{margin:0;overflow-x:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}h1,h2{color:var(--text-h);letter-spacing:-.02em;font-weight:700}h1{margin:0 0 1rem;font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem)}h2{letter-spacing:-.01em;margin:1.75rem 0 .6rem;font-size:1.1rem}a{color:var(--accent);transition:color .15s var(--ease)}section{margin-bottom:2rem}button{font:inherit;background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:var(--accent-contrast);border-radius:var(--radius-sm);cursor:pointer;min-height:2.5rem;box-shadow:var(--shadow-sm);transition:transform .15s var(--ease), box-shadow .15s var(--ease), filter .15s var(--ease), opacity .15s var(--ease);border:none;padding:.6rem 1.1rem;font-weight:600}button:hover:not(:disabled){filter:brightness(1.08);box-shadow:var(--shadow-md);transform:translateY(-1px)}button:active:not(:disabled){transform:translateY(0)scale(.98)}button:disabled{opacity:.55;cursor:default;box-shadow:none;transform:none}.card button,.chip-remove{background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:none}.card button:hover:not(:disabled){background:var(--bg);border-color:var(--accent);color:var(--accent);box-shadow:none;transform:none}.chip-remove:hover{background:var(--bg);border-color:var(--danger);color:var(--danger);box-shadow:none;transform:none}a,button,input[type=checkbox],input[type=radio]{outline-offset:2px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{box-shadow:var(--ring);border-radius:var(--radius-sm);outline:none}input,select{font:inherit;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);min-height:2.5rem;color:var(--text);width:100%;transition:border-color .15s var(--ease), box-shadow .15s var(--ease);padding:.55rem .7rem}input:focus,select:focus{border-color:var(--accent);box-shadow:var(--ring);outline:none}.app-shell{flex-direction:column;min-height:100vh;display:flex}.app-header{z-index:20;background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);position:sticky;top:0}.app-header-row{justify-content:space-between;align-items:center;padding:.9rem 1.25rem;display:flex}.app-header .brand{color:#0000;background:linear-gradient(135deg, var(--accent), var(--accent-strong));-webkit-background-clip:text;background-clip:text;font-size:1.15rem;font-weight:800;text-decoration:none}.menu-toggle{border:1px solid var(--border);width:2.5rem;height:2.5rem;box-shadow:none;background:0 0;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:0;display:none}.menu-toggle span{background:var(--text-h);width:18px;height:2px;transition:transform .25s var(--ease), opacity .2s var(--ease);border-radius:2px;display:block}.menu-toggle.open span:first-child{transform:translateY(6px)rotate(45deg)}.menu-toggle.open span:nth-child(2){opacity:0}.menu-toggle.open span:nth-child(3){transform:translateY(-6px)rotate(-45deg)}.app-header-collapsible{justify-content:space-between;align-items:center;gap:1rem;padding:0 1.25rem .9rem;display:flex}.app-header nav{gap:1.25rem;display:flex}.app-header nav a{color:var(--text);padding:.25rem 0;font-weight:500;text-decoration:none;position:relative}.app-header nav a:after{content:"";background:var(--accent);height:2px;transition:right .25s var(--ease);border-radius:2px;position:absolute;bottom:-2px;left:0;right:100%}.app-header nav a:hover:after{right:0}.app-header nav a.active{color:var(--accent);font-weight:700}.app-header nav a.active:after{right:0}.app-header-user{align-items:center;gap:.75rem;font-size:.9rem;display:flex}@media (width<=720px){.menu-toggle{display:flex}.app-header-collapsible{opacity:0;max-height:0;transition:max-height .3s var(--ease), opacity .25s var(--ease), padding .3s var(--ease);flex-direction:column;align-items:stretch;gap:1rem;padding:0 1.25rem;overflow:hidden}.app-header-collapsible.open{opacity:1;max-height:20rem;padding:0 1.25rem 1rem}.app-header nav{flex-direction:column;gap:.25rem}.app-header nav a{padding:.6rem .25rem}.app-header-user{border-top:1px solid var(--border);justify-content:space-between;padding-top:.5rem}}.app-main{flex:1;width:100%;max-width:760px;margin:0 auto;padding:2rem 1.25rem 4rem}@media (width<=480px){.app-main{padding:1.25rem 1rem 3rem}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.page-transition{animation:fadeInUp .45s var(--ease) both}.card-list li{animation:fadeInUp .4s var(--ease) both}.card-list li:first-child{animation-delay:20ms}.card-list li:nth-child(2){animation-delay:60ms}.card-list li:nth-child(3){animation-delay:.1s}.card-list li:nth-child(4){animation-delay:.14s}.card-list li:nth-child(5){animation-delay:.18s}.card-list li:nth-child(n+6){animation-delay:.2s}.spinner-wrap{color:var(--text);opacity:.75;animation:fadeIn .3s var(--ease) both;justify-content:center;align-items:center;gap:.6rem;padding:3rem 1rem;display:flex}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:1.15rem;height:1.15rem;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.auth-page{background:radial-gradient(60% 50% at 15% 10%, color-mix(in srgb, var(--accent) 16%, transparent), transparent), radial-gradient(50% 45% at 90% 85%, color-mix(in srgb, var(--accent-strong) 14%, transparent), transparent);justify-content:center;align-items:center;min-height:100vh;padding:1.25rem;display:flex;position:relative;overflow:hidden}.auth-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:380px;box-shadow:var(--shadow-lg);animation:fadeInUp .5s var(--ease) both;flex-direction:column;gap:.85rem;padding:2rem;display:flex}.auth-form h1{margin-bottom:0}.auth-subtitle{color:var(--text);opacity:.75;margin-bottom:.5rem}.auth-form label{flex-direction:column;gap:.3rem;font-size:.9rem;font-weight:500;display:flex}.auth-switch{margin-top:.5rem;font-size:.9rem}.form-error{background:color-mix(in srgb, var(--danger) 15%, transparent);color:var(--danger);border-radius:var(--radius-sm);animation:fadeInUp .3s var(--ease) both;padding:.55rem .75rem;font-size:.9rem}.inline-form{flex-wrap:wrap;gap:.5rem;margin:.75rem 0;display:flex}.inline-form input,.inline-form select{flex:10rem}@media (width<=480px){.inline-form{flex-direction:column}.inline-form input,.inline-form select,.inline-form button{flex:none;width:100%}.card:has(>button){flex-direction:column;align-items:stretch}.card:has(>button)>button{width:100%}}.storage-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);flex-direction:column;gap:.5rem;padding:1rem;display:flex}.storage-form .inline-form{animation:fadeInUp .3s var(--ease) both}.checkbox-label{align-items:center;gap:.4rem;font-size:.9rem;display:flex}.radio-group{flex-direction:column;gap:.6rem;display:flex}.card-list{flex-direction:column;gap:.6rem;margin:0;padding:0;list-style:none;display:flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 1.1rem;display:flex}.card:has(>a):hover{box-shadow:var(--shadow-md);border-color:color-mix(in srgb, var(--accent) 35%, var(--border));transform:translateY(-2px)}.card>a{color:inherit;flex-direction:column;flex:1;gap:.2rem;min-width:0;text-decoration:none;display:flex}.card-meta{opacity:.7;font-size:.85rem;display:block}.card-meta.overdue{color:var(--danger);opacity:1;font-weight:600}.card.unread{border-left:3px solid var(--accent);position:relative}.card.unread:before{content:"";background:var(--accent);width:8px;height:8px;animation:pulse 2s var(--ease) infinite;border-radius:50%;position:absolute;top:1.1rem;left:-6px;box-shadow:0 0 #7a3bff80}@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent)}70%{box-shadow:0 0 0 8px #0000}to{box-shadow:0 0 #0000}}.storage-card{flex-direction:column;align-items:stretch}.storage-card:hover{box-shadow:var(--shadow-sm);border-color:var(--border);transform:none}.chip-list{flex-wrap:wrap;gap:.4rem;margin:.4rem 0;padding:0;list-style:none;display:flex}.chip{background:var(--bg);border:1px solid var(--border);transition:border-color .15s var(--ease);border-radius:999px;padding:.3rem .8rem;font-size:.85rem}.chip-removable{align-items:center;gap:.35rem;padding-right:.4rem;display:inline-flex}.chip-remove{border-radius:999px;justify-content:center;align-items:center;width:1.2rem;height:1.2rem;min-height:0;padding:0;font-size:.95rem;line-height:1;display:inline-flex}.empty-state{opacity:.7;font-style:italic}
