:root{--bg:#0f1115;--fg:#f2f3f5;--mut:#9aa0aa;--card:#1a1d24;--line:#2a2f3a;--acc:#4ade80;--accfg:#06240f;color-scheme:dark light}
@media (prefers-color-scheme:light){:root{--bg:#f6f7f9;--fg:#14161a;--mut:#5d6470;--card:#fff;--line:#dfe2e8;--acc:#16a34a;--accfg:#fff}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
main{max-width:560px;margin:0 auto;padding:max(20px,env(safe-area-inset-top)) 16px max(24px,env(safe-area-inset-bottom))}
h1{font-size:1.6rem;margin:24px 0 4px}h2{font-size:1rem;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin:24px 0 8px}
.sub{color:var(--mut);margin:0 0 16px}
textarea{width:100%;font:inherit;color:inherit;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;resize:vertical;min-height:150px}
textarea:focus{outline:2px solid var(--acc);outline-offset:1px}
.row{display:flex;gap:10px;margin-top:12px}
button{font:inherit;border:0;border-radius:14px;min-height:52px;cursor:pointer;color:var(--fg)}
.primary{flex:1;background:var(--acc);color:var(--accfg);font-weight:600}
.icon{width:56px;background:var(--card);border:1px solid var(--line);font-size:1.4rem}
.icon.on{background:#dc2626;border-color:#dc2626;animation:pulse 1.2s infinite}
.ghost{width:100%;background:transparent;border:1px solid var(--line);margin-top:24px}
button:disabled{opacity:.5}
#err{color:#f87171;margin-top:10px}
.dots{display:flex;gap:8px;justify-content:center;margin:96px 0 12px}
.dots i{width:12px;height:12px;border-radius:50%;background:var(--acc);animation:b 1s infinite ease-in-out}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
#loading-view{text-align:center;color:var(--mut)}
.noise{text-align:center;margin:20px 0 4px}
.noise span{font-size:4rem;font-weight:700;color:var(--acc);line-height:1}
.noise small{display:block;color:var(--mut)}
#msg{text-align:center}
.cards{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cards li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:flex-start}
#vital li{border-color:var(--acc);border-width:2px;font-size:1.1rem;font-weight:500}
.cards.muted li{color:var(--mut);font-size:.95rem}
.cards li.done .t{text-decoration:line-through;opacity:.5}
.t{flex:1}.t small{display:block;color:var(--mut);font-weight:400;font-size:.8rem;margin-top:2px}
.chk{width:28px;height:28px;min-height:0;border-radius:50%;border:2px solid var(--acc);background:transparent;flex:none;color:var(--acc);font-size:1rem;line-height:1}
.done .chk{background:var(--acc);color:var(--accfg)}
.rescue{min-height:36px;padding:0 12px;border-radius:10px;background:transparent;border:1px solid var(--line);color:var(--fg);font-size:.85rem;flex:none}
details{margin-top:24px}summary{cursor:pointer;color:var(--mut);padding:8px 0;min-height:44px}
details ul{margin-top:8px}
@keyframes b{0%,80%,100%{transform:scale(.5);opacity:.4}40%{transform:scale(1);opacity:1}}
@keyframes pulse{50%{opacity:.6}}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}