:root{
  --bg:#0a0f0a;
  --panel:#0e1310;
  --text:#e7ffe7;
  --muted:#a6bfa6;
  --neon:#39ff14;
  --neon-dim:#1e7f0b;
  --pill:#0f1f11;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Helvetica,Arial,sans-serif;}

body.graffiti{
  /* Dark base with subtle radial glow */
  background:
    radial-gradient(1200px 600px at 50% -20%, rgba(57,255,20,0.08), transparent 60%),
    #050806;
}
/* Gray graffiti wallpaper repeating text */
body.graffiti::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; opacity:.20; mix-blend:normal;
  background-image:
    url("data:image/svg+xml;utf8,<?xml version='1.0'?>
      <svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'>
        <defs>
          <style>
            @font-face{font-family:Graff;src:local('Impact');}
          </style>
        </defs>
        <rect width='100%' height='100%' fill='black'/>
        <g fill='none' stroke='rgba(180,180,180,0.20)' stroke-width='8' opacity='0.9'>
          <text x='40' y='180' transform='rotate(-20 40 180)' font-size='120' font-family='Graff'>BAY2LA</text>
          <text x='120' y='360' transform='rotate(-20 120 360)' font-size='120' font-family='Graff'>CITY2CITY</text>
          <text x='-40' y='540' transform='rotate(-20 -40 540)' font-size='120' font-family='Graff'>BAY2LA</text>
        </g>
      </svg>");
  background-size:600px 600px;
  background-repeat:repeat;
  z-index:0;
}

.header{
  position:sticky;top:0;z-index:10;
  background:linear-gradient(180deg, rgba(0,0,0,.85), rgba(0,0,0,.35) 90%, transparent);
  backdrop-filter: blur(8px);
  border-bottom:1px solid rgba(57,255,20,.08);
}
.nav{
  display:flex;align-items:center;gap:18px;padding:14px 18px;max-width:1100px;margin:0 auto;
}
.nav .brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:2px;color:var(--neon);}
.brand img{width:34px;height:34px;border-radius:10px;box-shadow:0 0 22px rgba(57,255,20,.55); background:#031; padding:4px;}
.nav a{color:#cfe9cf;text-decoration:none;font-weight:600;opacity:.85}
.nav a.active{color:var(--neon)}
.nav .cart-pill{margin-left:auto;background:rgba(57,255,20,.12);padding:8px 14px;border-radius:14px;border:1px solid rgba(57,255,20,.25);color:#dfffe0;}

.hero{position:relative;z-index:1;max-width:1100px;margin:36px auto;padding:40px 18px;}
h1.title{font-size:64px;margin:0 0 12px;text-shadow:0 0 18px rgba(57,255,20,.55);letter-spacing:2px}
.sub{font-size:22px;color:var(--muted);margin-bottom:20px}
.btn{display:inline-block;background:var(--neon);color:#021a05;font-weight:800;padding:14px 20px;border-radius:16px;text-decoration:none;box-shadow:0 8px 30px rgba(57,255,20,.35), 0 0 40px rgba(57,255,20,.25) inset}

.section{max-width:1100px;margin:0 auto;padding:18px}
.card{background:linear-gradient(180deg, rgba(18,25,19,.85), rgba(9,13,11,.85)); border:1px solid rgba(57,255,20,.12); border-radius:20px; overflow:hidden; margin-bottom:18px; position:relative}
.card .tag{position:absolute;top:14px;left:14px;background:rgba(57,255,20,.12); color:var(--neon);padding:6px 12px;border-radius:999px;font-weight:700;border:1px solid rgba(57,255,20,.25);}
.card .content{padding:16px 18px 18px}
.card h3{margin:0 0 8px}
.price{font-weight:900;margin:8px 0 0}
.actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.small{font-size:13px;color:var(--muted)}

.gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;padding:8px;background:#0a0f0c;border-bottom:1px solid rgba(57,255,20,.18)}
.gallery img{height:280px;width:auto;border-radius:14px;scroll-snap-align:center;object-fit:cover}

.footer{border-top:1px solid rgba(57,255,20,.12);margin-top:24px;padding:30px;color:var(--muted);text-align:center}

.cart-table{width:100%;border-collapse:collapse}
.cart-table th,.cart-table td{padding:10px;border-bottom:1px solid rgba(57,255,20,.15);text-align:left}
.total{font-size:22px;font-weight:900;text-align:right;margin-top:12px}

@media (max-width:640px){
  h1.title{font-size:48px}
  .gallery img{height:220px}
}