:root{--bg: #0b0f17;--fg: #e7ecf3;--muted: #9aa4b2;--primary: #7c5cff;--accent: #31e6c9;--card: #0f1522cc;--glass: rgba(255, 255, 255, .06);--border: rgba(255, 255, 255, .12);--danger: #ff5c7a}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--fg);background:radial-gradient(1200px 600px at 10% -10%,#1a2440 0%,transparent 60%),radial-gradient(900px 500px at 110% 10%,#0c302c 0%,transparent 60%),linear-gradient(180deg,#0a0f18,#06080f 80%)}.container{max-width:1200px;margin:0 auto;padding:24px}header{position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(180deg,#0a0f18e6,#0a0f1866);border-bottom:1px solid var(--border)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.4px}.brand .logo{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--accent));box-shadow:0 8px 30px #7c5cff59}.search{flex:1;display:flex;align-items:center;gap:10px;max-width:560px;background:var(--glass);border:1px solid var(--border);padding:10px 12px;border-radius:14px}.search input{flex:1;background:transparent;border:none;outline:none;color:var(--fg);font-size:14px}.pill{border:1px solid var(--border);background:#ffffff1a;padding:9px 14px;border-radius:12px;font-weight:600;font-size:14px;color:var(--fg);cursor:pointer;transition:all .2s}.pill:hover{transform:translateY(-1px);border-color:var(--accent);background:#ffffff26;box-shadow:0 0 6px var(--accent)}.pill.active{border-color:var(--accent);background:linear-gradient(135deg,var(--accent),var(--primary));color:#fff;box-shadow:0 0 10px #31e6c999}.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));align-items:stretch}.card{position:relative;background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;padding:16px;display:flex;flex-direction:column;gap:12px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.card:hover{transform:translateY(-4px);border-color:#3b4251;box-shadow:0 10px 40px #10152399}.shoe{height:160px;display:grid;place-items:center;isolation:isolate}.shoe img{width:auto;max-height:150px;filter:drop-shadow(0 22px 30px rgba(0,0,0,.5));transform:rotate(-12deg);transition:transform .2s ease}.card:hover .shoe img{transform:rotate(-8deg) scale(1.02)}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.title{font-size:15px;font-weight:700}.price{font-weight:800}.muted{color:var(--muted);font-size:12px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:10px 12px;border-radius:12px;font-weight:700;transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 8px 30px #7c5cff59}.btn:hover{transform:translateY(-1px)}.btn.ghost{background:transparent;border:1px solid var(--border);color:var(--fg);box-shadow:none}.qty{display:flex;align-items:center;border:1px solid var(--border);border-radius:12px;overflow:hidden}.qty button{background:transparent;border:none;color:var(--fg);padding:8px 10px;cursor:pointer;font-weight:800}.qty span{padding:0 10px;font-weight:700}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:none;opacity:0;transition:opacity .2s ease}.drawer{position:fixed;top:0;right:-420px;width:400px;height:100vh;background:#0e1422;border-left:1px solid var(--border);transition:right .3s ease;display:flex;flex-direction:column}.drawer.open{right:0}.drawer-backdrop.open{display:block;opacity:1}.drawer header{padding:18px 16px;border-bottom:1px solid var(--border)}.drawer .items{flex:1;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:14px}.cart-item{display:flex;gap:12px;background:var(--glass);border:1px solid var(--border);padding:10px;border-radius:12px}.cart-item img{width:58px;height:58px;object-fit:contain;border-radius:10px;background:#0b0f17}.cart-item .name{font-weight:700;font-size:14px}.cart-item .remove{color:var(--danger);font-size:12px;cursor:pointer}.drawer footer{padding:14px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px}.total-row{display:flex;justify-content:space-between;font-weight:800}.checkout{padding:12px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--primary));color:#fff;font-weight:800;border:none;cursor:pointer}.empty{color:var(--muted);text-align:center;padding:18px}.category-bar{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.footer-note{color:var(--muted);text-align:center;margin-top:30px;font-size:12px}