:root{--navy:#0b1f3a;--navy-2:#12294c;--steel:#1e3a5f;--amber:#ffb703;--amber-2:#fb8500;--road:#2b3440;--line:#ffd166;--ink:#e8eef6;--muted:#8ea3bd;--panel:hsla(0,0%,100%,.04);--panel-border:hsla(0,0%,100%,.08);--ok:#2dd4bf;--danger:#ef4444}*{box-sizing:border-box;margin:0;padding:0}body,html{min-height:100%}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 80% -10%,rgba(255,183,3,.12),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(45,212,191,.1),transparent 60%),var(--navy);-webkit-font-smoothing:antialiased}.wrap{max-width:1080px;margin:0 auto;padding:32px 20px 64px}.masthead{display:flex;align-items:center;gap:16px;padding:20px 24px;border-radius:18px;background:linear-gradient(120deg,var(--navy-2),var(--steel));border:1px solid var(--panel-border);position:relative;overflow:hidden}.masthead:after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:repeating-linear-gradient(90deg,var(--line) 0 34px,transparent 34px 68px);opacity:.8}.logo{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:30px;background:linear-gradient(135deg,var(--amber),var(--amber-2));box-shadow:0 8px 24px rgba(251,133,0,.35);flex-shrink:0}.masthead h1{font-size:22px;letter-spacing:.3px}.masthead p{color:var(--muted);font-size:13px;margin-top:2px}.badge{margin-left:auto;font-size:12px;font-weight:600;color:var(--navy);background:var(--amber);padding:6px 12px;border-radius:999px;white-space:nowrap}.grid{display:grid;grid-template-columns:1.2fr 1fr;grid-gap:20px;gap:20px;margin-top:24px}@media (max-width:820px){.grid{grid-template-columns:1fr}}.card{background:var(--panel);border:1px solid var(--panel-border);border-radius:18px;padding:22px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.card-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}.card-head .ic{font-size:20px}.card-head h2{font-size:16px;letter-spacing:.3px}.card-head .count{margin-left:auto;font-size:12px;color:var(--muted)}.todo-form{display:flex;gap:8px;margin-bottom:16px}input[type=text]{flex:1 1;background:rgba(0,0,0,.25);border:1px solid var(--panel-border);color:var(--ink);padding:12px 14px;border-radius:12px;font-size:14px;outline:none}input[type=text]:focus{border-color:var(--amber)}.btn{border:none;cursor:pointer;font-weight:600;border-radius:12px;padding:12px 16px;font-size:14px;color:var(--navy);background:linear-gradient(135deg,var(--amber),var(--amber-2));transition:transform .05s ease,filter .15s ease}.btn:hover{filter:brightness(1.05)}.btn:active{transform:translateY(1px)}.todo-list{list-style:none;display:flex;flex-direction:column;gap:8px}.todo-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.2);border:1px solid var(--panel-border)}.todo-item.done .txt{text-decoration:line-through;color:var(--muted)}.check{width:22px;height:22px;border-radius:7px;border:2px solid var(--muted);display:grid;place-items:center;cursor:pointer;flex-shrink:0;font-size:13px;color:var(--navy);background:transparent}.todo-item.done .check{background:var(--ok);border-color:var(--ok)}.todo-item .txt{flex:1 1;font-size:14px}.del{background:transparent;border:none;color:var(--muted);cursor:pointer;font-size:16px;padding:4px;border-radius:8px}.del:hover{color:var(--danger)}.empty{color:var(--muted);font-size:13px;text-align:center;padding:20px 0}.calc-display{background:rgba(0,0,0,.35);border:1px solid var(--panel-border);border-radius:14px;padding:16px 18px;text-align:right;margin-bottom:14px}.calc-display .expr{color:var(--muted);font-size:13px;min-height:18px;word-break:break-all}.calc-display .now{font-size:34px;font-weight:600;word-break:break-all}.calc-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:8px;gap:8px}.key{border:1px solid var(--panel-border);background:hsla(0,0%,100%,.05);color:var(--ink);font-size:18px;padding:16px 0;border-radius:12px;cursor:pointer;transition:filter .12s ease,transform .05s ease}.key:hover{filter:brightness(1.25)}.key:active{transform:translateY(1px)}.key.op{color:var(--amber);font-weight:700}.key.acc{background:linear-gradient(135deg,var(--amber),var(--amber-2));color:var(--navy);font-weight:700}.key.wide{grid-column:span 2}.foot{margin-top:32px;text-align:center;color:var(--muted);font-size:12px}