:root{--brand:#c2410c;--brand-dark:#9a3412;--brand-light:#fff7ed;--ink:#1c1917;--muted:#78716c;--line:#e7e5e4;--bg:#fafaf9;--card:#fff;--ok:#15803d;--warn:#b45309;--danger:#b91c1c;--radius:14px;--shadow:0 2px 8px #0000000d, 0 10px 28px #0000000a;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}.card-pattern{background-color:var(--brand);color:#fff;position:relative;overflow:hidden}.card-pattern:before{content:"";pointer-events:none;background-image:repeating-linear-gradient(45deg,#ffffff0f 0 2px,#0000 2px 9px),repeating-linear-gradient(-45deg,#ffffff0d 0 2px,#0000 2px 11px);position:absolute;inset:0}.card-pattern:after{content:"";pointer-events:none;border:26px solid #ffffff12;border-radius:50%;width:210px;height:210px;position:absolute;top:-90px;right:-70px}.card-pattern>*{z-index:1;position:relative}.card-chip{background-color:#d6b45e;border-radius:6px;width:38px;height:28px;position:relative;overflow:hidden}.card-chip:before,.card-chip:after{content:"";background:#00000038;position:absolute}.card-chip:before{height:1.5px;top:50%;left:0;right:0}.card-chip:after{width:1.5px;top:0;bottom:0;left:50%}*{box-sizing:border-box}html,body{color:var(--ink);-webkit-font-smoothing:antialiased;background:#f4f4f5;margin:0;padding:0}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,textarea,select{font-family:inherit;font-size:15px}a{color:inherit;text-decoration:none}.phone-frame{background:var(--bg);flex-direction:column;max-width:460px;min-height:100vh;margin:0 auto;display:flex;position:relative;box-shadow:0 0 60px #00000014}.appbar{z-index:40;background:var(--card);border-bottom:1px solid var(--line);padding:14px 20px;position:sticky;top:0;box-shadow:0 2px 10px #00000005}.appbar-row{align-items:center;gap:14px;display:flex}.appbar-title{letter-spacing:-.3px;color:var(--ink);font-size:17px;font-weight:700}.appbar-sub{color:var(--muted);align-items:center;gap:6px;margin-top:3px;font-size:12.5px;display:flex}.icon-btn{width:40px;height:40px;color:var(--ink);background:#f5f5f4;border-radius:12px;place-items:center;font-size:17px;transition:background .15s,transform .1s;display:grid}.icon-btn:hover{background:#e7e5e4}.icon-btn:active{transform:scale(.95)}.icon-btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.page{flex-direction:column;flex:1;padding:18px 20px 110px;display:flex}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.section-title{letter-spacing:-.2px;justify-content:space-between;align-items:center;margin:22px 0 12px;font-size:15.5px;font-weight:700;display:flex}.chip{color:var(--muted);white-space:nowrap;background:#f5f5f4;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;display:inline-flex}.chip.brand{background:var(--brand-light);color:var(--brand-dark)}.chip.ok{color:var(--ok);background:#f0fdf4}.chip.warn{color:var(--warn);background:#fffbeb}.chip.danger{color:var(--danger);background:#fef2f2}.chip.info{color:#1d4ed8;background:#eff6ff}.btn{color:var(--ink);background:#f5f5f4;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:14px 20px;font-size:15px;font-weight:650;transition:transform 80ms,filter .15s,background .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.btn.primary{background:var(--brand);color:#fff}.btn.primary:hover{filter:brightness(1.06)}.btn.dark{background:var(--ink);color:#fff}.btn.outline{border:1.5px solid var(--line);background:0 0}.btn.block{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed}.bottom-nav{z-index:40;background:var(--card);border-top:1px solid var(--line);padding:10px 6px calc(10px + env(safe-area-inset-bottom));grid-template-columns:repeat(4,1fr);margin-top:auto;display:grid;position:sticky;bottom:0;box-shadow:0 -4px 20px #0000000a}.nav-item{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px 0;font-size:11px;font-weight:600;transition:color .15s;display:flex;position:relative}.nav-item.active{color:var(--brand)}.nav-item:hover{color:var(--ink)}.badge-dot{background:var(--brand);color:#fff;border-radius:999px;place-items:center;min-width:18px;height:18px;padding:0 5px;font-size:10.5px;font-weight:700;display:grid;position:absolute;top:2px;right:50%;transform:translate(18px)}.floating-cart-wrapper{z-index:50;animation:.3s cubic-bezier(.175,.885,.32,1.275) floatPop;position:fixed;bottom:74px;right:calc(50% - 214px)}@media (width<=460px){.floating-cart-wrapper{right:16px}}.floating-cart-btn{background:var(--brand);color:#fff;cursor:pointer;border:2px solid #fff;border-radius:999px;align-items:center;gap:10px;padding:12px 18px;font-size:13.5px;font-weight:700;transition:transform .15s cubic-bezier(.175,.885,.32,1.275),background .15s;display:flex;box-shadow:0 8px 24px #c2410c66}.floating-cart-btn:hover{background:var(--brand-dark);transform:scale(1.05)}.floating-cart-btn:active{transform:scale(.95)}.floating-cart-btn.bump{animation:.4s cartBump}@keyframes cartBump{0%{transform:scale(1)}40%{transform:scale(1.22)}to{transform:scale(1)}}@keyframes floatPop{0%{opacity:0;transform:translateY(12px)scale(.8)}}.flying-particle{z-index:9999;pointer-events:none;background:var(--brand);color:#fff;border-radius:50%;place-items:center;width:28px;height:28px;font-size:14px;animation:.65s cubic-bezier(.2,.8,.25,1) forwards flyToCart;display:grid;position:fixed;box-shadow:0 6px 16px #c2410c80}@keyframes flyToCart{0%{opacity:1;transform:translate(var(--start-x), var(--start-y)) scale(1.2)}50%{opacity:.95;transform:translate(calc((var(--start-x) + var(--end-x)) / 2 + 20px), calc((var(--start-y) + var(--end-y)) / 2 - 50px)) scale(1.1)}to{opacity:0;transform:translate(var(--end-x), var(--end-y)) scale(.2)}}.sheet-backdrop{z-index:90;background:#1c191780;justify-content:center;align-items:flex-end;animation:.18s fade;display:flex;position:fixed;inset:0}.sheet{background:var(--card);border-radius:20px 20px 0 0;flex-direction:column;width:100%;max-width:460px;max-height:92vh;animation:.22s cubic-bezier(.2,.8,.2,1) slideUp;display:flex}@keyframes fade{0%{opacity:0}}@keyframes slideUp{0%{transform:translateY(24px)}}.sheet-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.sheet-body{flex:1;padding:20px;overflow-y:auto}.sheet-foot{border-top:1px solid var(--line);background:var(--card);padding:16px 20px}.field{margin-bottom:16px}.field label{margin-bottom:7px;font-size:13.5px;font-weight:600;display:block}.field input,.field textarea,.field select{border:1.5px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:12px;padding:13px 14px}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--brand);outline:none}.row{justify-content:space-between;align-items:center;gap:10px;display:flex}.muted{color:var(--muted)}.tiny{font-size:12px}.small{font-size:13.5px}.bold{font-weight:700}.strike{color:var(--muted);text-decoration:line-through}.scroll-x{scrollbar-width:none;gap:10px;padding-bottom:6px;display:flex;overflow-x:auto}.scroll-x::-webkit-scrollbar{display:none}.divider{background:var(--line);height:1px;margin:14px 0}.toast{background:var(--ink);color:#fff;z-index:120;box-shadow:var(--shadow);border-radius:999px;padding:12px 20px;font-size:13.5px;font-weight:600;animation:.2s toastIn;position:fixed;bottom:88px;left:50%;transform:translate(-50%)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,10px)}}