:root{--bg: #0b1120;--card: #111827;--fg: #f9fafb;--muted: #9ca3af;--accent: #22c55e;--error: #f87171;--border: #374151;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;background:var(--bg)}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.screen{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.card{width:100%;max-width:420px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:12px}.card h1{margin:0 0 8px;font-size:1.5rem}.card label{font-size:.9rem;color:var(--muted)}.card input,.card button{font-size:1.05rem;padding:14px 16px;border-radius:12px;border:1px solid var(--border);width:100%}.card input{background:#0b1120;color:var(--fg)}.card input:focus{outline:2px solid var(--accent);border-color:var(--accent)}.card button{margin-top:8px;background:var(--accent);color:#06210f;font-weight:600;border:none;min-height:52px;cursor:pointer}.card button:disabled{opacity:.6;cursor:default}.muted{color:var(--muted)}.error{color:var(--error);margin:0;font-size:.95rem}.app{min-height:100dvh;max-width:560px;margin:0 auto;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));background:var(--bg);border-bottom:1px solid var(--border)}.title{font-size:1.25rem;font-weight:700}.subtitle{font-size:.85rem;color:var(--muted)}.link{background:none;border:none;color:var(--muted);font-size:.95rem;padding:10px 4px;cursor:pointer}.pad{padding:12px 16px 0}.items{list-style:none;margin:0;padding:0 env(safe-area-inset-right) 96px env(safe-area-inset-left);flex:1}.item{display:flex;align-items:center;border-bottom:1px solid var(--border)}.toggle{flex:1;display:flex;align-items:center;gap:14px;min-height:60px;padding:10px 12px 10px 16px;background:none;border:none;color:var(--fg);font-size:1.1rem;text-align:left;cursor:pointer}.box{flex:0 0 auto;width:30px;height:30px;border:2px solid var(--border);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#06210f}.item.checked .box{background:var(--accent);border-color:var(--accent)}.name{line-height:1.25}.qty{color:var(--muted);font-weight:600}.item.checked .name{color:var(--muted);text-decoration:line-through}.delete{flex:0 0 auto;width:48px;height:48px;margin-right:6px;background:none;border:none;color:var(--muted);font-size:1.6rem;line-height:1;cursor:pointer}.empty{padding:40px 16px;text-align:center;color:var(--muted)}.addbar{position:sticky;bottom:0;z-index:2;display:flex;gap:10px;padding:12px max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:var(--card);border-top:1px solid var(--border)}.addinput{flex:1;min-width:0;font-size:1.05rem;padding:14px 16px;border-radius:12px;border:1px solid var(--border);background:#0b1120;color:var(--fg)}.addinput:focus{outline:2px solid var(--accent);border-color:var(--accent)}.add{flex:0 0 auto;width:56px;border:none;border-radius:12px;background:var(--accent);color:#06210f;font-size:1.8rem;line-height:1;font-weight:700;cursor:pointer}
