/* ============================================================
   MORTAL GAME — PlayStation Club — Brend dizayn tokenləri və özəl stillər
   ============================================================ */

:root{
  --ink-950:#07060a;
  --ink-900:#0c0a08;
  --ink-800:#161210;
  --ink-700:#221c17;
  --gold-300:#fde08a;
  --gold-400:#fbbf24;
  --gold-500:#f0a827;
  --gold-600:#d97706;
  --ember-400:#f97316;
  --ember-500:#ea580c;
  --crimson-500:#dc2626;
  --dark-900:#0b0a08;

  --font-display:'Rajdhani', ui-sans-serif, system-ui, sans-serif;
  --font-body:'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;

  --radius-lg:1.5rem;
  --radius-md:1rem;
  --shadow-soft:0 20px 45px -20px rgba(4,3,2,.65);
  --shadow-gold:0 10px 30px -10px rgba(240,168,39,.5);
}

*{ -webkit-tap-highlight-color: transparent; }

html{ scroll-behavior:smooth; }
section[id]{ scroll-margin-top:150px; }
@media (min-width:1024px){ section[id]{ scroll-margin-top:90px; } }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}

body{
  font-family:var(--font-body);
  background:var(--ink-900);
  color:#f4ece0;
  overflow-x:hidden;
}

h1,h2,h3,.font-display{ font-family:var(--font-display); font-weight:700; letter-spacing:.01em; }

/* ---------- Scrollbar (category tabs) ---------- */
.scrollbar-none::-webkit-scrollbar{ display:none; }
.scrollbar-none{ -ms-overflow-style:none; scrollbar-width:none; }

/* ---------- Background textures ---------- */
.bg-noise{
  background-image:radial-gradient(circle at 20% 20%, rgba(240,168,39,.14), transparent 40%),
                    radial-gradient(circle at 80% 0%, rgba(220,38,38,.10), transparent 45%),
                    radial-gradient(circle at 50% 100%, rgba(249,115,22,.08), transparent 50%);
}

.hero-grid{ position:relative; }
.hero-grid::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(240,168,39,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(220,38,38,.06) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%, black 40%, transparent 85%);
  mask-image:radial-gradient(ellipse 70% 60% at 50% 30%, black 40%, transparent 85%);
}

.hero-blob{ position:absolute; border-radius:9999px; filter:blur(64px); pointer-events:none; }
@media (prefers-reduced-motion: no-preference){
  .hero-blob{ animation:heroBlobDrift 22s ease-in-out infinite; will-change:transform; }
  .hero-blob-a{ animation-duration:24s; }
  .hero-blob-b{ animation-duration:28s; animation-delay:-6s; }
  @keyframes heroBlobDrift{
    0%,100%{ transform:translate(0,0); }
    50%{ transform:translate(2%,-3%); }
  }
}

/* ---------- Buttons ---------- */
.btn-gold{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-600));
  color:var(--ink-900);
  box-shadow:var(--shadow-gold);
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.btn-gold:hover{ transform:translateY(-2px); filter:brightness(1.06); }
.btn-gold:active{ transform:translateY(0); }

.btn-ghost{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(6px);
  transition:background .25s ease, transform .25s ease, border-color .25s ease;
}
.btn-ghost:hover{ background:rgba(255,255,255,.12); transform:translateY(-2px); border-color:rgba(255,255,255,.32); }

.btn-hero-primary{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  color:var(--ink-900);
  box-shadow:0 12px 28px -10px rgba(240,168,39,.6);
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.btn-hero-primary:hover{ transform:translateY(-2px) scale(1.02); filter:brightness(1.05); }
.btn-hero-primary:active{ transform:translateY(0) scale(1); }

.btn-hero-ember{
  background:linear-gradient(135deg, var(--ember-400), var(--crimson-500));
  color:#fff;
  box-shadow:0 12px 28px -10px rgba(220,38,38,.5);
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.btn-hero-ember:hover{ transform:translateY(-2px) scale(1.02); filter:brightness(1.08); }
.btn-hero-ember:active{ transform:translateY(0) scale(1); }

.btn-hero-outline{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(251,191,36,.4);
  color:#fff;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
}
.btn-hero-outline:hover{ transform:translateY(-2px) scale(1.02); background:rgba(251,191,36,.12); border-color:rgba(251,191,36,.7); box-shadow:0 12px 28px -14px rgba(251,191,36,.5); }
.btn-hero-outline:active{ transform:translateY(0) scale(1); }

.btn-whatsapp{
  background:#25D366;
  color:#06301c;
  transition:transform .25s ease, filter .25s ease;
}
.btn-whatsapp:hover{ transform:translateY(-2px); filter:brightness(1.05); }

/* Minimum touch target */
.tap-target{ min-height:44px; min-width:44px; }

/* ---------- Cards ---------- */
.card-elevated{
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow-soft);
}

.menu-icon-circle{
  background:radial-gradient(circle at 35% 30%, var(--gold-300), var(--gold-500) 70%);
  box-shadow:inset 0 -6px 14px rgba(0,0,0,.15), 0 8px 18px -8px rgba(240,168,39,.55);
}

/* Category tab pill */
.tab-pill{
  border:1px solid rgba(255,255,255,.14);
  color:#e9dfd2;
  transition:background .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
  white-space:nowrap;
}
.tab-pill:hover{ transform:translateY(-1px); }
.tab-pill.active{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  color:var(--ink-900);
  border-color:transparent;
  font-weight:600;
}

/* ---------- Menu ---------- */
.bg-menu-dark{
  background:
    radial-gradient(circle at 8% 0%, rgba(240,168,39,.14), transparent 45%),
    radial-gradient(circle at 100% 100%, rgba(220,38,38,.10), transparent 40%),
    var(--ink-950);
}

#menu .text-ink-900{ color:#f4ece0; }
#menu .text-ink-900\/60{ color:rgba(244,236,224,.6); }
#menu-sticky-header .bg-white{ background:rgba(255,255,255,.08); }
#menu-sticky-header .border-black\/10{ border-color:rgba(255,255,255,.14); }

.menu-tab-pill{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:#e9dfd2;
  white-space:nowrap;
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.menu-tab-pill.active{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  border-color:transparent;
  color:var(--ink-900);
  font-weight:600;
  box-shadow:0 6px 14px -6px rgba(240,168,39,.55);
}

#menu-sticky-header{ position:sticky; }
#menu-sticky-header::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:14px;
  transform:translateY(100%);
  background:linear-gradient(180deg, rgba(12,10,8,.06), transparent);
  pointer-events:none;
}

.menu-tabs-nav-btn{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  color:#e9dfd2;
  transition:background .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease;
}
.menu-tabs-nav-btn:hover{ background:rgba(240,168,39,.18); border-color:rgba(240,168,39,.4); }
.menu-tabs-nav-btn:disabled{ opacity:.35; pointer-events:none; }

.view-toggle-btn{ color:rgba(255,255,255,.5); transition:background .2s ease, color .2s ease; }
.view-toggle-btn.active{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  color:var(--ink-900);
}

.menu-card-photo{
  background:rgba(255,255,255,.06);
  overflow:hidden;
  border-radius:1rem;
}

.menu-card-grid{
  background:var(--ink-800);
  border-radius:1.25rem;
  overflow:hidden;
  box-shadow:0 6px 18px -12px rgba(0,0,0,.5);
  border:1px solid rgba(240,168,39,.18);
  transition:box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
.menu-card-grid .menu-card-photo{ border-radius:0; }

.menu-card-list{
  background:var(--ink-800);
  border-radius:1.25rem;
  box-shadow:0 6px 18px -12px rgba(0,0,0,.5);
  border:1px solid rgba(240,168,39,.18);
  transition:box-shadow .25s ease, border-color .25s ease;
}

.menu-card-grid:hover, .menu-card-list:hover{
  border-color:rgba(240,168,39,.55);
  box-shadow:0 14px 28px -16px rgba(0,0,0,.6);
  transform:translateY(-2px);
}

.menu-price{ color:var(--gold-400); }

.menu-add-btn{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  color:var(--ink-900);
  font-size:1rem;
  box-shadow:0 4px 10px -4px rgba(217,119,6,.5);
  transition:transform .15s ease, background .2s ease, box-shadow .2s ease;
}
.menu-add-btn:hover{
  background:linear-gradient(135deg, var(--ember-400), var(--crimson-500));
  color:#fff;
  transform:scale(1.08);
  box-shadow:0 4px 12px -4px rgba(220,38,38,.6);
}

.line-clamp-1{ display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.menu-card-grid, .menu-card-list{ cursor:pointer; }

/* ---------- Menu item detail bottom sheet ---------- */
.item-sheet-backdrop{
  position:fixed; inset:0;
  background:rgba(12,10,8,.6);
  z-index:300;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.item-sheet-backdrop.open{ opacity:1; pointer-events:auto; }

.item-sheet{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:301;
  background:var(--ink-900);
  color:#f4ece0;
  border-radius:1.75rem 1.75rem 0 0;
  box-shadow:0 -20px 50px -20px rgba(0,0,0,.65);
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.22,1,.36,1);
  max-width:640px;
  margin:0 auto;
}
.item-sheet.open{ transform:translateY(0); }
@media (prefers-reduced-motion: reduce){
  .item-sheet{ transition:none; }
  .item-sheet-backdrop{ transition:none; }
}

.item-sheet .text-ink-900{ color:#f4ece0; }
.item-sheet .text-slate-500{ color:#a89a86; }
.item-sheet .border-black\/10{ border-color:rgba(255,255,255,.16); }
.item-sheet .bg-slate-100{ background-color:rgba(255,255,255,.06); }

.item-sheet-handle{
  width:44px; height:5px;
  border-radius:9999px;
  background:rgba(255,255,255,.2);
  margin:.75rem auto;
}

.item-sheet-photo{
  width:100%;
  aspect-ratio:16/10;
  background:#171310 center/cover no-repeat;
}

/* ---------- Cart bar ---------- */
.cart-bar-wrap{
  z-index:250;
  display:none;
}
body.modal-locked .cart-bar-wrap{ display:block; }

.cart-bar{
  width:100%;
  display:flex;
  align-items:center;
  gap:.75rem;
  background:var(--dark-900);
  color:#fff;
  font-weight:600;
  font-size:.9rem;
  padding:.9rem 1.25rem;
  border-radius:9999px;
  box-shadow:0 12px 30px -10px rgba(4,3,2,.6);
  transition:transform .2s ease, opacity .2s ease;
}
.cart-bar:hover{ transform:translateY(-2px); }
.cart-bar.hidden{ display:none; }
.cart-bar-count{
  display:grid;
  place-items:center;
  width:24px; height:24px;
  border-radius:9999px;
  background:var(--gold-400);
  color:var(--ink-900);
  font-size:.75rem;
  font-weight:700;
}
.menu-add-btn.added{ background:var(--gold-500); }

/* Set card */
.set-card{
  position:relative;
  border:1px solid rgba(240,168,39,.28);
  background:
    linear-gradient(165deg, rgba(7,6,10,.55) 0%, rgba(7,6,10,.9) 55%, rgba(7,6,10,.98) 100%),
    radial-gradient(circle at 12% 0%, rgba(240,168,39,.18), transparent 45%),
    radial-gradient(circle at 100% 0%, rgba(220,38,38,.14), transparent 50%);
  box-shadow:0 10px 26px -18px rgba(0,0,0,.75);
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
  cursor:pointer;
  isolation:isolate;
  overflow:hidden;
}
.set-card::after{
  content:"";
  position:absolute; left:-10%; right:-10%; bottom:0; height:60%;
  pointer-events:none; z-index:-1;
  background-image:
    linear-gradient(rgba(240,168,39,.22) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240,168,39,.22) 1px, transparent 1px);
  background-size:30px 30px;
  transform:perspective(180px) rotateX(60deg);
  transform-origin:bottom;
  -webkit-mask-image:linear-gradient(to top, black 5%, transparent 90%);
  mask-image:linear-gradient(to top, black 5%, transparent 90%);
  opacity:.5;
}
.set-card:hover{ transform:translateY(-3px); border-color:rgba(240,168,39,.6); box-shadow:0 18px 36px -16px rgba(240,168,39,.3); }

.set-icon-circle{
  background:radial-gradient(circle at 35% 30%, var(--gold-400), var(--gold-600) 70%);
  box-shadow:inset 0 -6px 14px rgba(0,0,0,.15), 0 8px 18px -8px rgba(240,168,39,.5);
}

.set-card-n{ font-family:var(--font-display); letter-spacing:.03em; }

.set-items-list{
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

.set-more-hint{ color:var(--gold-400); }

.set-add-cart-btn{
  background:linear-gradient(135deg, var(--gold-400), var(--gold-500));
  color:var(--ink-900);
  transition:transform .15s ease, box-shadow .2s ease;
  box-shadow:0 4px 10px -4px rgba(217,119,6,.5);
}
.set-add-cart-btn:hover{ transform:scale(1.06); }
.set-add-cart-btn.added{ background:var(--gold-500); }

/* ---------- Set detail sheet (poster-style hero) ---------- */
.set-sheet-hero{
  position:relative;
  padding:2.5rem 1.5rem;
  min-height:240px;
  background:
    linear-gradient(180deg, rgba(7,6,10,.35), rgba(7,6,10,.85) 70%, rgba(7,6,10,.97)),
    radial-gradient(circle at 20% 20%, rgba(240,168,39,.25), transparent 50%),
    radial-gradient(circle at 85% 10%, rgba(220,38,38,.18), transparent 45%),
    var(--ink-950);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.set-sheet-hero::before{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 60% at 50% 35%, rgba(240,168,39,.14), transparent 65%);
}
.set-sheet-hero-card{
  position:relative;
  z-index:1;
  text-align:center;
  padding:1.75rem 1.5rem;
  border-radius:1.5rem;
  border:1px solid rgba(240,168,39,.5);
  background:rgba(12,10,8,.5);
  backdrop-filter:blur(6px);
  box-shadow:0 0 30px rgba(240,168,39,.15), inset 0 0 20px rgba(240,168,39,.08);
  max-width:340px;
}
.set-sheet-icon{
  width:48px; height:48px;
  margin:0 auto .75rem;
  border-radius:9999px;
  display:grid; place-items:center;
  font-size:1.4rem;
  background:radial-gradient(circle at 35% 30%, var(--gold-400), var(--gold-600) 70%);
  color:var(--ink-900);
  box-shadow:0 8px 18px -8px rgba(240,168,39,.6);
}
.set-sheet-title{
  font-family:var(--font-display);
  font-size:1.6rem;
  color:var(--gold-400);
  letter-spacing:.04em;
}
.set-sheet-group{
  color:rgba(255,255,255,.55);
  font-size:.8rem;
  margin-top:.25rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.set-sheet-section-label{
  font-family:var(--font-display);
  font-size:1rem;
  color:#f4ece0;
  margin-bottom:.6rem;
}
.set-sheet-items{ display:flex; flex-direction:column; gap:.55rem; }
.set-sheet-items li{
  display:flex; align-items:flex-start; gap:.6rem;
  font-size:.9rem; line-height:1.4;
  color:#e9dfd2;
}
.set-sheet-items li i{ color:var(--gold-400); font-size:1rem; margin-top:.15rem; flex-shrink:0; }
.set-sheet-extra{
  margin-top:.9rem;
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.8rem; font-weight:600;
  color:var(--gold-400);
  background:rgba(240,168,39,.1);
  border:1px solid rgba(240,168,39,.28);
  padding:.4rem .8rem;
  border-radius:9999px;
}
.set-sheet-extra:empty{ display:none; }

/* ---------- Nav ---------- */
#site-nav{
  background-color:rgba(7,6,10,.4);
  backdrop-filter:blur(8px);
  transition:background-color .35s ease, box-shadow .35s ease, padding .35s ease;
}
#site-nav.scrolled{
  background-color:rgba(7,6,10,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 10px 30px -18px rgba(0,0,0,.65);
}

#mobile-menu{
  transition:max-height .4s ease, opacity .3s ease;
  max-height:0;
  opacity:0;
  overflow:hidden;
}
#mobile-menu.open{
  max-height:600px;
  opacity:1;
}

/* ---------- Hero entrance (pure CSS, zero JS/CDN dependency) ---------- */
@media (prefers-reduced-motion: no-preference){
  @keyframes heroFadeUp{
    from{ opacity:0; transform:translateY(22px); }
    to{ opacity:1; transform:translateY(0); }
  }
  #hero-title, #hero-sub, #hero-features li, #hero-ctas{
    animation:heroFadeUp .7s cubic-bezier(.22,1,.36,1) both;
  }
  #hero-title{ animation-delay:.1s; }
  #hero-sub{ animation-delay:.25s; }
  #hero-features li{ animation-delay:.35s; }
  #hero-features li:nth-child(2){ animation-delay:.43s; }
  #hero-features li:nth-child(3){ animation-delay:.51s; }
  #hero-ctas{ animation-delay:.38s; }
}

/* ---------- Logo mark ---------- */
.logo-mark{
  filter:drop-shadow(0 0 14px rgba(240,168,39,.4)) drop-shadow(0 0 6px rgba(220,38,38,.3));
}
.logo-mark-wrap{
  position:relative;
  border-radius:1.5rem;
  isolation:isolate;
}
.logo-mark-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:2.5px;
  background:conic-gradient(from 0deg,
    var(--gold-400), var(--ember-400), var(--crimson-500), var(--gold-600), var(--gold-400));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
@media (prefers-reduced-motion: no-preference){
  .logo-mark-wrap::before{ animation:logoEdgeSparkle 2.4s ease-in-out infinite; }
  @keyframes logoEdgeSparkle{
    0%,100%{ opacity:.55; filter:brightness(1); }
    50%{ opacity:1; filter:brightness(1.4); }
  }
}

/* ---------- Misc ---------- */
.text-gradient{
  background:linear-gradient(100deg, var(--gold-300), var(--gold-500) 45%, var(--ember-500) 75%, var(--crimson-500));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.divider-glow{
  height:1px;
  background:linear-gradient(90deg, transparent, var(--gold-400), var(--crimson-500), transparent);
  opacity:.5;
}

::selection{ background:var(--gold-400); color:#0c0a08; }

/* ---------- Theme toggle ---------- */
.theme-toggle-btn{
  width:40px; height:40px;
  border-radius:9999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  transition:background .2s ease, transform .2s ease, color .2s ease, border-color .2s ease;
}
.theme-toggle-btn:hover{ background:rgba(240,168,39,.18); border-color:rgba(240,168,39,.4); transform:translateY(-1px); }

/* ============================================================
   LIGHT MODE — scoped override for the dark (default) page
   ============================================================ */
html[data-theme="light"]{
  --lt-bg:#faf7f2;
  --lt-bg-alt:#f2ece1;
  --lt-text:#1a140d;
  --lt-body:#4a3f33;
  --lt-muted:#7a6d5c;
  --lt-gold:#b5730f;
  --lt-border:rgba(26,20,13,.10);
  --lt-border-soft:rgba(26,20,13,.06);
}

html[data-theme="light"] body{ background:var(--lt-bg) !important; color:var(--lt-body) !important; }

html[data-theme="light"] .bg-ink-900{ background-color:var(--lt-bg) !important; }
html[data-theme="light"] .bg-ink-950{ background-color:var(--lt-bg-alt) !important; }
html[data-theme="light"] .bg-ink-900\/98{ background-color:rgba(250,247,242,.98) !important; }
html[data-theme="light"] .bg-ink-950\/95{ background-color:rgba(242,236,225,.95) !important; }
html[data-theme="light"] #site-nav{ background-color:rgba(250,247,242,.8) !important; }
html[data-theme="light"] #site-nav.scrolled{
  background-color:rgba(250,247,242,.92) !important;
  box-shadow:0 10px 30px -18px rgba(26,20,13,.18) !important;
}

html[data-theme="light"] .text-white{ color:var(--lt-text) !important; }
html[data-theme="light"] .text-slate-100{ color:var(--lt-body) !important; }
html[data-theme="light"] .text-slate-200{ color:var(--lt-body) !important; }
html[data-theme="light"] .text-slate-300{ color:var(--lt-body) !important; }
html[data-theme="light"] .text-slate-400{ color:var(--lt-muted) !important; }
html[data-theme="light"] .text-slate-500{ color:var(--lt-muted) !important; }
html[data-theme="light"] .text-gold-300{ color:var(--lt-gold) !important; }
html[data-theme="light"] .text-gold-400{ color:var(--lt-gold) !important; }
html[data-theme="light"] .hover\:text-gold-300:hover{ color:var(--lt-gold) !important; }

html[data-theme="light"] .border-white\/5{ border-color:var(--lt-border-soft) !important; }
html[data-theme="light"] .border-white\/10{ border-color:var(--lt-border) !important; }
html[data-theme="light"] .bg-white\/5{ background-color:rgba(26,20,13,.05) !important; }

html[data-theme="light"] .btn-ghost{
  background:rgba(26,20,13,.05) !important;
  border-color:rgba(26,20,13,.16) !important;
}
html[data-theme="light"] .btn-ghost:hover{ background:rgba(26,20,13,.09) !important; border-color:rgba(26,20,13,.28) !important; }

html[data-theme="light"] .btn-hero-outline{
  background:rgba(217,119,6,.08) !important;
  border-color:rgba(217,119,6,.4) !important;
  color:var(--lt-text) !important;
}
html[data-theme="light"] .btn-hero-outline:hover{ background:rgba(217,119,6,.16) !important; border-color:rgba(217,119,6,.6) !important; }

html[data-theme="light"] .card-elevated{
  background:linear-gradient(180deg, rgba(26,20,13,.04), rgba(26,20,13,.015)) !important;
  border-color:rgba(26,20,13,.10) !important;
  box-shadow:0 20px 40px -24px rgba(26,20,13,.18) !important;
}

html[data-theme="light"] .tab-pill{
  border-color:rgba(26,20,13,.14) !important;
  color:var(--lt-body) !important;
}
html[data-theme="light"] .tab-pill.active{ color:var(--ink-900) !important; }

html[data-theme="light"] #mobile-menu{ background-color:rgba(250,247,242,.98) !important; }

html[data-theme="light"] .set-card .text-slate-300{ color:#e9dfd2 !important; }
html[data-theme="light"] .set-card .text-white{ color:#fff !important; }
html[data-theme="light"] .set-card .text-gold-300{ color:#fde08a !important; }
html[data-theme="light"] .set-card .text-gold-400{ color:#fbbf24 !important; }
html[data-theme="light"] .set-sheet-section-label{ color:var(--lt-text) !important; }
html[data-theme="light"] .set-sheet-items li{ color:rgba(26,20,13,.75) !important; }
html[data-theme="light"] .set-sheet-qty-el{ color:var(--lt-text) !important; }

html[data-theme="light"] .bg-menu-dark{
  background:
    radial-gradient(circle at 8% 0%, rgba(240,168,39,.10), transparent 45%),
    radial-gradient(circle at 100% 100%, rgba(220,38,38,.08), transparent 40%),
    #fbf8f3 !important;
}
html[data-theme="light"] .text-ink-900{ color:var(--lt-text) !important; }
html[data-theme="light"] .text-ink-900\/60{ color:rgba(26,20,13,.6) !important; }
html[data-theme="light"] .border-black\/10{ border-color:rgba(0,0,0,.1) !important; }
html[data-theme="light"] #menu-sticky-header .bg-white{ background:#fff !important; }

html[data-theme="light"] .menu-tabs-nav-btn{
  background:#fff !important;
  border-color:rgba(217,119,6,.2) !important;
  color:var(--lt-text) !important;
}
html[data-theme="light"] .menu-tab-pill{
  border-color:rgba(217,119,6,.2) !important;
  background:#fff !important;
  color:var(--lt-text) !important;
}
html[data-theme="light"] .view-toggle-btn{ color:rgba(26,20,13,.4) !important; }

html[data-theme="light"] .menu-card-photo{ background:#f2ece1 !important; }

html[data-theme="light"] .menu-card-grid,
html[data-theme="light"] .menu-card-list{
  background:#fff !important;
  border-color:rgba(217,119,6,.1) !important;
  box-shadow:0 6px 18px -12px rgba(26,20,13,.16) !important;
}
html[data-theme="light"] .menu-card-grid:hover,
html[data-theme="light"] .menu-card-list:hover{
  border-color:rgba(217,119,6,.35) !important;
  box-shadow:0 14px 28px -16px rgba(217,119,6,.3) !important;
}

html[data-theme="light"] .menu-price{ color:#b45309 !important; }

html[data-theme="light"] .item-sheet{ background:#fff !important; color:inherit !important; }
html[data-theme="light"] .item-sheet .bg-slate-100{ background-color:#f4efe6 !important; }
html[data-theme="light"] .item-sheet-handle{ background:rgba(26,20,13,.15) !important; }
html[data-theme="light"] .item-sheet-photo{ background-color:#efe6d5 !important; }

html[data-theme="light"] .theme-toggle-btn{
  background:rgba(26,20,13,.05) !important;
  border-color:rgba(26,20,13,.16) !important;
  color:var(--lt-text) !important;
}
html[data-theme="light"] .theme-toggle-btn:hover{ background:rgba(217,119,6,.12) !important; border-color:rgba(217,119,6,.4) !important; }

/* Persistent nav strip: glowing pill frame around each link */
.nav-chip{
  display:inline-flex;
  align-items:center;
  padding:.3rem .85rem;
  font-size:.75rem;
  border-radius:9999px;
  border:1px solid rgba(240,168,39,.35);
  box-shadow:0 0 10px rgba(240,168,39,.28), inset 0 0 8px rgba(240,168,39,.08);
  transition:box-shadow .25s ease, border-color .25s ease, color .25s ease, transform .2s ease;
  outline:none;
}
.nav-chip:hover{
  border-color:rgba(240,168,39,.75);
  box-shadow:0 0 18px rgba(240,168,39,.5), inset 0 0 10px rgba(240,168,39,.15);
  transform:translateY(-1px);
}
.nav-chip:focus{ outline:none; }
.nav-chip:focus-visible{
  outline:2px solid rgba(240,168,39,.7);
  outline-offset:2px;
}

/* ---------- Menu / Sets "separate view" modal ---------- */
.modal-header-controls{
  display:none;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
  position:sticky;
  top:1rem;
  height:0;
  overflow:visible;
  padding-right:1rem;
  z-index:20;
}
.section-modal .modal-header-controls{ display:flex; }

.modal-close-btn{ display:none; }

.modal-theme-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:9999px;
  background:rgba(12,10,8,.55);
  color:#fff;
  font-size:1.25rem;
  backdrop-filter:blur(6px);
  box-shadow:0 8px 20px -8px rgba(0,0,0,.5);
  transition:background .2s ease, transform .2s ease;
}
.modal-theme-toggle:hover{ background:rgba(217,119,6,.6); transform:translateY(-1px); }

#menu, #sets, #games{ display:none; }
.section-modal{
  display:block !important;
  position:fixed !important;
  inset:0;
  z-index:200;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  animation:modal-in .3s ease;
}
.section-modal .modal-close-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:9999px;
  background:rgba(12,10,8,.55);
  color:#fff;
  font-size:1.25rem;
  backdrop-filter:blur(6px);
  box-shadow:0 8px 20px -8px rgba(0,0,0,.5);
}
#menu.section-modal .modal-close-btn{ background:rgba(12,10,8,.7); }
#menu.section-modal .modal-theme-toggle{ background:rgba(12,10,8,.7); }
body.modal-locked{ overflow:hidden; }
@keyframes modal-in{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){ .section-modal{ animation:none; } }

/* ---------- Games showcase (poster grid) ---------- */
.game-card{
  position:relative;
  border-radius:1rem;
  overflow:hidden;
  aspect-ratio:2/3;
  border:1px solid rgba(240,168,39,.18);
  box-shadow:0 6px 18px -12px rgba(0,0,0,.6);
  cursor:zoom-in;
  transition:transform .3s cubic-bezier(.22,1,.36,1), border-color .25s ease, box-shadow .25s ease;
}
.game-card img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.game-card:hover{ transform:translateY(-4px); border-color:rgba(240,168,39,.6); box-shadow:0 16px 32px -16px rgba(240,168,39,.35); }
.game-card:hover img{ transform:scale(1.06); }

/* ---------- Photo lightbox ---------- */
.lightbox-backdrop{
  position:fixed; inset:0;
  background:rgba(2,2,1,.88);
  z-index:400;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.lightbox-backdrop.open{ opacity:1; pointer-events:auto; }

.lightbox{
  position:fixed; inset:0;
  z-index:401;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:4rem 1.25rem;
  opacity:0;
  pointer-events:none;
  transform:scale(.96);
  transition:opacity .3s ease, transform .3s cubic-bezier(.22,1,.36,1);
}
.lightbox.open{ opacity:1; pointer-events:auto; transform:scale(1); }
@media (prefers-reduced-motion: reduce){
  .lightbox, .lightbox-backdrop{ transition:none; }
}

.lightbox-figure{
  max-width:min(90vw, 1100px);
  max-height:88vh;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.lightbox-figure img{
  max-width:100%;
  max-height:78vh;
  width:auto;
  border-radius:1rem;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.7);
  object-fit:contain;
}
.lightbox-figure figcaption{
  margin-top:1rem;
  color:#fff;
  font-family:var(--font-display);
  font-size:1.1rem;
  letter-spacing:.02em;
  text-align:center;
}

.lightbox-close{
  position:absolute;
  top:1.25rem; right:1.25rem;
  width:44px; height:44px;
  border-radius:9999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  font-size:1.25rem;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(6px);
  transition:background .2s ease, transform .2s ease;
}
.lightbox-close:hover{ background:rgba(217,119,6,.35); transform:translateY(-1px); }