:root{--bg: #f7f5f2;--card: #ffffff;--text: #1e293b;--muted:#64748b;--border:#e7e1da;--accent:#0ea5a6;--accent-ink:#0b6b6c;--danger:#e11d48;--radius: 16px;--shadow: 0 10px 24px rgba(80, 60, 40, .1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);line-height:1.55;font-size:clamp(15px,1.5vw,16px)}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(900px 600px at 10% -10%,#f0eae2 0%,transparent 60%),radial-gradient(800px 500px at 100% 110%,#e8f6f6 0%,transparent 60%),var(--bg)}h1{margin:0 0 .9rem;text-align:center;letter-spacing:-.01em;font-weight:800}button{border:1px solid var(--accent);background:var(--accent);color:#fff;padding:.7rem 1.1rem;border-radius:12px;cursor:pointer;font-weight:700;transition:filter .15s ease,transform .06s ease,box-shadow .2s ease;box-shadow:0 6px 16px #0ea5a62e}button:hover{filter:brightness(1.05) saturate(1.02)}button:active{transform:translateY(1px)}button:focus-visible{outline:3px solid #99f6e4;outline-offset:2px}@media (prefers-color-scheme: dark){:root{--bg:#0b1013;--card:#11161a;--text:#e5e7eb;--muted:#93a1b2;--border:#27323a;--accent:#14b8a6;--accent-ink:#8bfff0;--danger:#fb7185;--shadow: 0 12px 28px rgba(0,0,0,.45)}body{background:radial-gradient(900px 600px at 0% -20%,rgba(20,184,166,.12),transparent 60%),radial-gradient(900px 600px at 100% 120%,rgba(232,246,246,.08),transparent 60%),var(--bg)}}.app-container{width:min(94vw,760px);background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem 1.3rem 1.1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:1rem;overflow:hidden}.app-container h1{position:relative;padding-bottom:.5rem;margin:0 0 .25rem;text-align:center}.app-container h1:after{content:"";position:absolute;left:50%;transform:translate(-50%);bottom:0;width:110px;height:2px;border-radius:999px;background:var(--accent);opacity:.6}.shop-form{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr) minmax(0,.9fr) auto;gap:.7rem;align-items:start}.shop-input{width:100%;padding:1rem 1.1rem;font-size:1.05rem;border:1px solid var(--border);border-radius:12px;background:#fff;color:inherit;transition:box-shadow .2s,border-color .15s}.shop-input::placeholder{color:var(--muted)}.shop-input:focus{border-color:#99f6e4;box-shadow:0 0 0 4px #0d948826;outline:none}.shop-form button{border:1px solid var(--accent);background:var(--accent);color:#fff;padding:.95rem 1.2rem;border-radius:12px;font-weight:700;cursor:pointer;transition:filter .15s,transform .06s}.shop-form button:hover{filter:brightness(1.05) saturate(1.02)}.shop-form button:active{transform:translateY(1px)}.shop-input::-webkit-outer-spin-button,.shop-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.shop-input[type=number] .shop-table{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff}@media (prefers-color-scheme: dark){.shop-table{background:#0f1519}}.shop-head{display:grid;grid-template-columns:1.5fr .8fr 1fr 1fr auto;gap:.6rem;align-items:center;padding:.75rem .9rem;font-weight:700;letter-spacing:.01em;background:#f4fbfb;border-bottom:1px solid var(--border)}@media (prefers-color-scheme: dark){.shop-head{background:#091416}}.shop-row{display:grid;grid-template-columns:1.5fr .8fr 1fr 1fr auto;gap:.7rem;align-items:center;padding:.85rem .9rem;border-bottom:1px solid var(--border);transition:background-color .15s ease}.shop-row:nth-child(odd){background:#faf8f5}.shop-row:hover{background:#f1fbfb}@media (prefers-color-scheme: dark){.shop-row:nth-child(odd){background:#0f1316}.shop-row:hover{background:#0b1b1b}}.shop-row:last-child{border-bottom:none}.shop-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shop-price,.shop-subtotal{font-variant-numeric:tabular-nums}.shop-qty{display:inline-flex;align-items:center;gap:.6rem}.pill{border:1px solid var(--border);background:#fff;color:var(--text);padding:.28rem .6rem;border-radius:999px;cursor:pointer;transition:background-color .15s,transform .06s}.pill:hover{background:#f0fdfa}.pill:active{transform:translateY(1px)}.qty{min-width:2ch;text-align:center;font-weight:600}.shop-remove{border:1px solid var(--danger);background:transparent;color:var(--danger);padding:.38rem .65rem;border-radius:10px;font-weight:800;cursor:pointer;transition:background-color .15s,transform .06s}.shop-remove:hover{background:color-mix(in oklab,var(--danger),#ffffff 90%)}.shop-remove:active{transform:translateY(1px)}.shop-footer{display:flex;align-items:center;justify-content:space-between;gap:.9rem;padding-top:.5rem}.shop-total{font-size:1.1rem}.shop-total strong{padding:.1rem .4rem;border-radius:.4rem;background:#ecfeff}.outline{background:transparent;color:var(--accent-ink);border:1px solid var(--accent);border-radius:12px;padding:.55rem 1rem}.outline:hover{background:#e6fffb}@media (max-width: 760px){.shop-form{grid-template-columns:1fr 1fr 1fr}.shop-form button{grid-column:1 / -1}.shop-head,.shop-row{grid-template-columns:1fr .9fr 1fr 1fr auto}}@media (max-width: 520px){.shop-head,.shop-row{grid-template-columns:1fr 1fr 1fr}.shop-price{display:none}.shop-subtotal{justify-self:end}}