:root { --ink:#10100e; --paper:#f6f3ea; --gold:#d6ad53; --muted:#aaa69b; --line:rgba(246,243,234,.14); --card:#1a1a17; }
* { box-sizing:border-box; } body { margin:0; min-width:320px; background:var(--ink); color:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
.page-shell { max-width:1080px; min-height:100vh; margin:auto; padding:24px 20px 64px; background:radial-gradient(circle at 82% 4%,rgba(214,173,83,.13),transparent 28%); }
.header { display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid var(--line); padding-bottom:20px; }.brand { color:var(--paper); text-decoration:none; font-size:1rem; font-weight:700; letter-spacing:.03em; }.brand span { display:inline-grid; place-items:center; width:35px; aspect-ratio:1; margin-right:7px; border:1px solid var(--gold); color:var(--gold); }.header p,.eyebrow,.badge { color:var(--gold); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; }.header p { margin:0; color:var(--muted); }
.hero { max-width:760px; padding:76px 0 44px; }.eyebrow { font-weight:800; } h1 { margin:13px 0 12px; font-family:Georgia,serif; font-size:clamp(2.6rem,8vw,5rem); line-height:.98; font-weight:500; } .hero>p { margin:0; color:#d0cdc4; font-size:1.12rem; }
.search-form { margin-top:42px; }.search-form label { display:block; margin-bottom:9px; font-size:.9rem; font-weight:700; }.input-row { display:grid; gap:10px; } input,button { min-height:54px; border-radius:3px; font:inherit; } input { width:100%; border:1px solid #626056; background:#141411; color:var(--paper); padding:0 16px; outline:none; } input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(214,173,83,.16); } button { border:0; background:var(--gold); padding:0 20px; color:#17140d; font-weight:800; font-size:.78rem; letter-spacing:.05em; cursor:pointer; } button:hover { background:#e5be6a; }
.results-section { border-top:1px solid var(--line); padding-top:25px; }.status { color:var(--muted); min-height:26px; }.status.error { color:#ee9992; }.status.success { color:#e4c475; }.status.empty { color:#d0cdc4; }.results { display:grid; gap:12px; margin-top:14px; }.result-card { display:flex; justify-content:space-between; gap:18px; padding:20px; border:1px solid var(--line); background:var(--card); }.result-card.best-price { border-color:var(--gold); box-shadow:inset 3px 0 var(--gold); }.badge { display:inline-block; margin-bottom:8px; font-weight:800; }.result-card h2 { margin:0 0 5px; font-size:1.05rem; }.store,.date { margin:4px 0 0; color:#c9c6bb; font-size:.9rem; }.date { color:var(--muted); font-size:.78rem; }.price { align-self:center; color:var(--gold); font-size:1.35rem; white-space:nowrap; }
@media (min-width:680px) { .page-shell { padding:32px 42px 80px; }.input-row { grid-template-columns:1fr auto; }.input-row button { min-width:240px; } }