:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--accent: #f97316;--accent-light: #fb923c;--surface: rgba(255, 255, 255, .04);--surface-hover: rgba(255, 255, 255, .08);--border: rgba(255, 255, 255, .08);--border-hover: rgba(255, 255, 255, .15);--text-primary: #fafafa;--text-secondary: rgba(255, 255, 255, .6);--text-muted: rgba(255, 255, 255, .4)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#0a0a0a;color:var(--text-primary)}.header{border-bottom:1px solid var(--border);padding:1.25rem 2rem;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:.625rem;font-weight:700;font-size:1.1rem;letter-spacing:-.02em}.logo-icon{width:2rem;height:2rem;background:var(--accent);border-radius:.5rem;display:grid;place-items:center;font-size:1rem}.header-nav{display:flex;gap:1.75rem;list-style:none}.header-nav a{color:var(--text-secondary);text-decoration:none;font-size:.875rem;transition:color .2s}.header-nav a:hover,.header-nav a.active{color:var(--text-primary)}.hero{text-align:center;padding:4rem 2rem 3rem;max-width:42rem;margin:0 auto}.hero-tag{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(249,115,22,.25);background:#f9731614;padding:.25rem .75rem;border-radius:2rem;margin-bottom:1.25rem}.hero h1{font-size:2.5rem;font-weight:700;letter-spacing:-.03em;line-height:1.15;margin-bottom:.75rem}.hero p{color:var(--text-secondary);font-size:1.05rem;max-width:32rem;margin:0 auto}.categories{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;padding:0 2rem 2.5rem}.category-btn{background:var(--surface);border:1px solid var(--border);color:var(--text-secondary);padding:.5rem 1.125rem;border-radius:2rem;font-size:.8125rem;cursor:pointer;transition:all .2s;font-family:inherit}.category-btn:hover{background:var(--surface-hover);border-color:var(--border-hover);color:var(--text-primary)}.category-btn.active{background:#f973161f;border-color:#f973164d;color:var(--accent-light)}.products-section{max-width:72rem;margin:0 auto;padding:0 2rem 4rem}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1.25rem}.product-card{background:var(--surface);border:1px solid var(--border);border-radius:.75rem;overflow:hidden;transition:all .25s ease;cursor:pointer}.product-card:hover{border-color:var(--border-hover);transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.product-image{height:12rem;background:linear-gradient(135deg,#ffffff08,#ffffff0f);display:grid;place-items:center;position:relative;overflow:hidden}.product-emoji{font-size:3.5rem;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}.product-badge{position:absolute;top:.75rem;right:.75rem;background:var(--accent);color:#fff;font-size:.65rem;font-weight:600;letter-spacing:.04em;padding:.2rem .5rem;border-radius:.25rem;text-transform:uppercase}.product-info{padding:1rem 1.25rem 1.25rem}.product-category{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:var(--accent);margin-bottom:.375rem}.product-name{font-size:1rem;font-weight:600;letter-spacing:-.01em;margin-bottom:.375rem}.product-desc{font-size:.8125rem;color:var(--text-secondary);line-height:1.5;margin-bottom:1rem}.product-footer{display:flex;align-items:center;justify-content:space-between}.product-price{font-size:1.125rem;font-weight:700;letter-spacing:-.02em}.product-price .original{font-size:.8125rem;color:var(--text-muted);text-decoration:line-through;font-weight:400;margin-left:.375rem}.add-btn{background:var(--accent);border:none;color:#fff;width:2.25rem;height:2.25rem;border-radius:.5rem;font-size:1.125rem;cursor:pointer;display:grid;place-items:center;transition:background .2s}.add-btn:hover{background:var(--accent-light)}.empty-state{grid-column:1 / -1;text-align:center;padding:3rem;color:var(--text-muted)}.empty-state p{font-size:.95rem}.footer{border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--text-muted);font-size:.8125rem}@media(max-width:640px){.hero h1{font-size:1.75rem}.header-nav{display:none}.products-grid{grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}}
