:root{color-scheme:light;--bg:#eef3f4;--surface:#fff;--text:#17313a;--muted:#667f88;--line:#d5e1e4;--accent:#da6d16;--shadow:0 12px 35px rgba(20,50,60,.1)}:root[data-theme=dark]{color-scheme:dark;--bg:#07171d;--surface:#0d252e;--text:#edf4f6;--muted:#a8bbc1;--line:#294650;--shadow:0 12px 35px rgba(0,0,0,.28)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}.topbar{position:sticky;top:0;z-index:10;height:74px;padding:0 max(20px,calc((100% - 1160px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:18px;color:inherit;text-decoration:none;font-weight:700}.brand img{width:145px;max-height:48px;object-fit:contain}.brand span{padding-left:18px;border-left:1px solid var(--line)}nav,.filters{display:flex;gap:8px}.nav-button,.theme,.filter{padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font:inherit;cursor:pointer}.nav-button.active,.filter.active{border-color:var(--accent);color:var(--accent)}main{width:min(1160px,calc(100% - 40px));margin:auto;padding:45px 0 70px}.hero{max-width:680px;margin-bottom:30px}.eyebrow{color:var(--accent);font-weight:800;text-transform:uppercase;letter-spacing:.08em}.hero h1{margin:5px 0;font-size:clamp(38px,6vw,62px);line-height:1}.hero p:last-child{color:var(--muted);font-size:18px}.filters{margin:25px 0;overflow:auto}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card{padding:0;overflow:hidden;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:inherit;box-shadow:var(--shadow);cursor:pointer}.card-media{aspect-ratio:4/3;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 75%,var(--surface))}.card-media img{width:100%;height:100%;object-fit:contain}.placeholder{font-size:60px;color:var(--muted)}.card-body{padding:20px}.category{color:var(--accent);font-size:12px;font-weight:800;text-transform:uppercase}.card h2{margin:7px 0;font-size:22px}.card p{margin:0;color:var(--muted)}.price{display:block;margin-top:18px;color:var(--accent);font-size:21px;font-weight:800}.state{padding:70px 25px;text-align:center;border-radius:12px;background:var(--surface)}dialog{width:min(900px,calc(100% - 30px));padding:0;border:0;border-radius:14px;background:var(--surface);color:var(--text);box-shadow:0 25px 90px rgba(0,0,0,.35)}dialog::backdrop{background:rgba(3,15,19,.7);backdrop-filter:blur(4px)}.dialog-close{position:absolute;top:14px;right:14px;z-index:2;width:42px;height:42px;border:0;border-radius:50%;font-size:27px;cursor:pointer}.detail{display:grid;grid-template-columns:1fr 1fr}.detail-media{min-height:480px;display:grid;place-items:center;background:var(--bg)}.detail-media img{width:100%;height:100%;max-height:600px;object-fit:contain}.detail-body{padding:50px 38px}.detail-body h2{margin:7px 0;font-size:36px}.options{display:grid;gap:8px;margin-top:28px}.option{padding:12px;border:1px solid var(--line);border-radius:8px}.option input{margin-right:8px}.total{margin-top:25px;padding:18px;border-top:3px solid var(--accent);background:var(--bg);font-size:26px;font-weight:800;color:var(--accent)}@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}.detail{grid-template-columns:1fr}.detail-media{min-height:300px}.brand span{display:none}}@media(max-width:520px){main{width:calc(100% - 24px)}.grid{grid-template-columns:1fr}.topbar{padding:0 12px}.brand img{width:120px}.nav-button{padding:9px}.detail-body{padding:30px 22px}}

