/* ==========================================================================
   game zon — mobile-first base stylesheet
   Palette: #1A1A2E (canvas) | #9932CC (signal purple) | #BBBBBB (body text)
   Direction: tech-feel titles + open body, stroke-led restrained corners,
   grouped cover cards, conclusion-first rhythm, light press feedback,
   square high-contrast CTAs. Console / control-panel visual language.
   ========================================================================== */

/* ---------- Design tokens ---------- */
:root{
  --layer2b9d7-canvas:#1A1A2E;
  --layer2b9d7-canvas-deep:#12121F;
  --layer2b9d7-canvas-raised:#20203A;
  --layer2b9d7-signal:#9932CC;
  --layer2b9d7-signal-bright:#B25FE6;
  --layer2b9d7-signal-dim:#5E2A7A;
  --layer2b9d7-ink:#BBBBBB;
  --layer2b9d7-ink-bright:#EDEDF6;
  --layer2b9d7-ink-faint:#7A7A92;
  --layer2b9d7-line:#34344F;
  --layer2b9d7-line-strong:#4A4A6A;
  --layer2b9d7-warn:#E6C84B;

  --layer2b9d7-font-tech:"SFMono-Regular",Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --layer2b9d7-font-body:"Segoe UI",Roboto,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;

  --layer2b9d7-frame-max:444px;
  --layer2b9d7-press:120ms cubic-bezier(.2,.7,.3,1);
  --layer2b9d7-radius:3px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  margin:0;
  background:#07070F;
  color:var(--layer2b9d7-ink);
  font-family:var(--layer2b9d7-font-body);
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:var(--layer2b9d7-signal-bright); text-decoration:none; }
a:hover{ color:var(--layer2b9d7-ink-bright); }
button{ font-family:inherit; cursor:pointer; border:0; background:none; color:inherit; }
h1,h2,h3,h4{ font-family:var(--layer2b9d7-font-tech); color:var(--layer2b9d7-ink-bright); letter-spacing:.02em; line-height:1.25; margin:0; }
p{ margin:0 0 1em; }
ul,ol{ margin:0 0 1em; padding-left:1.15em; }
:focus-visible{ outline:2px solid var(--layer2b9d7-signal-bright); outline-offset:2px; }

/* ---------- Mobile frame on wide screens ---------- */
.layer2b9d7-shell{
  position:relative;
  max-width:var(--layer2b9d7-frame-max);
  margin:0 auto;
  background:var(--layer2b9d7-canvas);
  min-height:100vh;
  border-left:1px solid var(--layer2b9d7-line);
  border-right:1px solid var(--layer2b9d7-line);
  box-shadow:0 0 80px rgba(0,0,0,.6);
}

/* ==========================================================================
   Header — tab-style top bar
   ========================================================================== */
.layer2b9d7-header{
  position:sticky;
  top:0;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 12px;
  background:linear-gradient(180deg,#1F1F38 0%, var(--layer2b9d7-canvas) 100%);
  border-bottom:1px solid var(--layer2b9d7-line-strong);
}
.layer2b9d7-brand{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.layer2b9d7-logo{
  width:34px;
  height:34px;
  object-fit:contain;
  border:1px solid var(--layer2b9d7-signal-dim);
  background:#0D0D1C;
  border-radius:var(--layer2b9d7-radius);
}
.layer2b9d7-brand-name{
  font-family:var(--layer2b9d7-font-tech);
  color:var(--layer2b9d7-ink-bright);
  font-size:16px;
  letter-spacing:.14em;
  text-transform:lowercase;
  white-space:nowrap;
}
.layer2b9d7-brand-tag{
  display:none;
}

/* Action cluster */
.layer2b9d7-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.layer2b9d7-btn{
  font-family:var(--layer2b9d7-font-tech);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:8px 12px;
  border-radius:var(--layer2b9d7-radius);
  transition:background var(--layer2b9d7-press), color var(--layer2b9d7-press), transform var(--layer2b9d7-press);
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.layer2b9d7-btn:active{ transform:translateY(1px); }
.layer2b9d7-btn-register{
  background:var(--layer2b9d7-signal);
  color:#fff;
  border:1px solid var(--layer2b9d7-signal-bright);
  box-shadow:0 0 0 1px rgba(178,95,230,.15) inset;
}
.layer2b9d7-btn-register:hover{ background:var(--layer2b9d7-signal-bright); color:#fff; }
.layer2b9d7-btn-login{
  background:transparent;
  color:var(--layer2b9d7-ink-bright);
  border:1px solid var(--layer2b9d7-line-strong);
}
.layer2b9d7-btn-login:hover{ border-color:var(--layer2b9d7-signal); color:#fff; }

/* Menu toggle */
.layer2b9d7-menu-toggle{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--layer2b9d7-line-strong);
  border-radius:var(--layer2b9d7-radius);
  color:var(--layer2b9d7-ink-bright);
  font-family:var(--layer2b9d7-font-tech);
  font-size:18px;
  transition:border-color var(--layer2b9d7-press), color var(--layer2b9d7-press);
}
.layer2b9d7-menu-toggle:hover{ border-color:var(--layer2b9d7-signal); }
.layer2b9d7-menu-toggle[aria-expanded="true"]{
  border-color:var(--layer2b9d7-signal);
  color:var(--layer2b9d7-signal-bright);
}

/* ==========================================================================
   Layered dropdown menu
   ========================================================================== */
.layer2b9d7-menu{
  position:absolute;
  top:54px;
  left:0;
  right:0;
  z-index:39;
  background:var(--layer2b9d7-canvas-deep);
  border-bottom:1px solid var(--layer2b9d7-line-strong);
  border-top:1px solid var(--layer2b9d7-line);
  padding:6px 0 14px;
  display:none;
}
.layer2b9d7-menu[data-open="true"]{ display:block; }
.layer2b9d7-menu-section{
  padding:0 14px;
  margin-top:8px;
}
.layer2b9d7-menu-label{
  font-family:var(--layer2b9d7-font-tech);
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-faint);
  padding:8px 0 4px;
  border-bottom:1px dashed var(--layer2b9d7-line);
  margin-bottom:4px;
}
.layer2b9d7-menu-link{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 4px;
  color:var(--layer2b9d7-ink);
  font-size:14px;
  border-bottom:1px solid rgba(52,52,79,.4);
  transition:color var(--layer2b9d7-press), padding-left var(--layer2b9d7-press);
}
.layer2b9d7-menu-link:last-child{ border-bottom:0; }
.layer2b9d7-menu-link::before{
  content:">";
  font-family:var(--layer2b9d7-font-tech);
  color:var(--layer2b9d7-signal);
  font-size:12px;
}
.layer2b9d7-menu-link:hover,
.layer2b9d7-menu-link[aria-current="page"]{
  color:var(--layer2b9d7-ink-bright);
  padding-left:6px;
}
.layer2b9d7-menu-link[aria-current="page"]{
  background:linear-gradient(90deg, rgba(153,50,204,.18), transparent);
}

/* ==========================================================================
   Main + sections
   ========================================================================== */
.layer2b9d7-main{
  padding:14px 12px 24px;
  /* Space for fixed bottom nav */
  padding-bottom:96px;
}
.layer2b9d7-section{
  margin-bottom:26px;
}
.layer2b9d7-section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding-bottom:6px;
  margin-bottom:12px;
  border-bottom:1px solid var(--layer2b9d7-line-strong);
}
.layer2b9d7-section-title{
  font-size:15px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-bright);
}
.layer2b9d7-section-title::before{
  content:"//";
  color:var(--layer2b9d7-signal);
  margin-right:6px;
  font-weight:700;
}
.layer2b9d7-section-meta{
  font-family:var(--layer2b9d7-font-tech);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-faint);
  white-space:nowrap;
}

/* ==========================================================================
   Hero
   ========================================================================== */
.layer2b9d7-hero{
  margin:0 -12px 22px;
  padding:18px 14px 16px;
  background:
    radial-gradient(120% 90% at 80% 0%, rgba(153,50,204,.22), transparent 60%),
    linear-gradient(180deg,#1D1D36, var(--layer2b9d7-canvas));
  border-top:1px solid var(--layer2b9d7-line);
  border-bottom:1px solid var(--layer2b9d7-line-strong);
}
.layer2b9d7-hero-eyebrow{
  font-family:var(--layer2b9d7-font-tech);
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--layer2b9d7-signal-bright);
  margin-bottom:8px;
  display:flex;
  align-items:center;
  gap:6px;
}
.layer2b9d7-hero-eyebrow::before{
  content:"";
  width:7px; height:7px;
  background:var(--layer2b9d7-signal);
  border-radius:50%;
  box-shadow:0 0 8px var(--layer2b9d7-signal);
}
.layer2b9d7-hero h1{
  font-size:24px;
  line-height:1.15;
  margin-bottom:10px;
  color:#fff;
}
.layer2b9d7-hero-lede{
  color:var(--layer2b9d7-ink);
  font-size:14px;
  margin:0 0 14px;
  max-width:42ch;
}
.layer2b9d7-hero-cta-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.layer2b9d7-hero-cta-row .layer2b9d7-btn{ flex:1 1 auto; }
.layer2b9d7-btn-primary{
  background:var(--layer2b9d7-signal);
  color:#fff;
  border:1px solid var(--layer2b9d7-signal-bright);
  padding:12px 16px;
  font-size:13px;
}
.layer2b9d7-btn-primary:hover{ background:var(--layer2b9d7-signal-bright); color:#fff; }
.layer2b9d7-btn-ghost{
  background:transparent;
  color:var(--layer2b9d7-ink-bright);
  border:1px solid var(--layer2b9d7-line-strong);
  padding:12px 16px;
  font-size:13px;
}
.layer2b9d7-btn-ghost:hover{ border-color:var(--layer2b9d7-signal); }

/* ==========================================================================
   Carousel
   ========================================================================== */
.layer2b9d7-carousel{
  position:relative;
  margin:0 -2px 8px;
  border:1px solid var(--layer2b9d7-line-strong);
  background:#0D0D1C;
  overflow:hidden;
}
.layer2b9d7-carousel-track{
  display:flex;
  scroll-snap-type:x mandatory;
  overflow-x:auto;
  scrollbar-width:none;
  scroll-behavior:smooth;
}
.layer2b9d7-carousel-track::-webkit-scrollbar{ display:none; }
.layer2b9d7-slide{
  flex:0 0 100%;
  scroll-snap-align:center;
  position:relative;
  display:block;
  cursor:pointer;
}
.layer2b9d7-slide img{
  width:100%;
  height:170px;
  object-fit:cover;
  filter:saturate(1.05);
}
.layer2b9d7-slide-caption{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:8px 12px;
  background:linear-gradient(0deg, rgba(7,7,15,.92) 0%, rgba(7,7,15,.0) 100%);
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-bright);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}
.layer2b9d7-slide-caption span:last-child{
  color:var(--layer2b9d7-signal-bright);
}
.layer2b9d7-carousel-dots{
  display:flex;
  justify-content:center;
  gap:6px;
  padding:8px 0 2px;
}
.layer2b9d7-carousel-dot{
  width:18px;
  height:4px;
  background:var(--layer2b9d7-line-strong);
  border-radius:1px;
  transition:background var(--layer2b9d7-press);
  cursor:pointer;
}
.layer2b9d7-carousel-dot[data-active="true"]{ background:var(--layer2b9d7-signal); }

/* ==========================================================================
   Game grid + grouped cover cards
   ========================================================================== */
.layer2b9d7-game-block{
  margin-bottom:24px;
}
.layer2b9d7-game-block-head{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  background:var(--layer2b9d7-canvas-raised);
  border:1px solid var(--layer2b9d7-line-strong);
  border-left:3px solid var(--layer2b9d7-signal);
  margin-bottom:10px;
}
.layer2b9d7-game-block-title{
  font-family:var(--layer2b9d7-font-tech);
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-bright);
  flex:1;
}
.layer2b9d7-game-block-count{
  font-family:var(--layer2b9d7-font-tech);
  font-size:10px;
  letter-spacing:.18em;
  color:var(--layer2b9d7-signal-bright);
}
.layer2b9d7-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:7px;
}
.layer2b9d7-card{
  display:flex;
  flex-direction:column;
  background:var(--layer2b9d7-canvas-deep);
  border:1px solid var(--layer2b9d7-line);
  border-radius:var(--layer2b9d7-radius);
  overflow:hidden;
  text-align:left;
  padding:0;
  transition:border-color var(--layer2b9d7-press), transform var(--layer2b9d7-press), background var(--layer2b9d7-press);
  min-width:0;
  cursor:pointer;
}
.layer2b9d7-card:hover{
  border-color:var(--layer2b9d7-signal);
  background:#16162B;
}
.layer2b9d7-card:active{ transform:translateY(1px); }
.layer2b9d7-card-thumb{
  position:relative;
  aspect-ratio:1 / 1;
  background:#0B0B17;
  border-bottom:1px solid var(--layer2b9d7-line);
}
.layer2b9d7-card-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.layer2b9d7-card-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 -14px 18px -10px rgba(7,7,15,.7);
  pointer-events:none;
}
.layer2b9d7-card-name{
  font-size:10.5px;
  line-height:1.2;
  color:var(--layer2b9d7-ink);
  padding:5px 6px 6px;
  font-family:var(--layer2b9d7-font-tech);
  letter-spacing:.01em;
  word-break:break-word;
  min-height:30px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.layer2b9d7-card:hover .layer2b9d7-card-name{ color:var(--layer2b9d7-ink-bright); }

@media (min-width:360px){
  .layer2b9d7-grid{ grid-template-columns:repeat(4, 1fr); gap:8px; }
}
@media (min-width:395px){
  .layer2b9d7-grid{ grid-template-columns:repeat(5, 1fr); }
  .layer2b9d7-card-name{ font-size:11px; }
}

/* ==========================================================================
   Editorial content sections (guide, styles, promos, facts, answer)
   ========================================================================== */
.layer2b9d7-prose{
  background:var(--layer2b9d7-canvas-deep);
  border:1px solid var(--layer2b9d7-line);
  border-left:3px solid var(--layer2b9d7-signal-dim);
  padding:14px 14px 6px;
}
.layer2b9d7-prose p,
.layer2b9d7-prose li{
  font-size:14px;
  color:var(--layer2b9d7-ink);
}
.layer2b9d7-prose strong{ color:var(--layer2b9d7-ink-bright); }
.layer2b9d7-prose a{
  color:var(--layer2b9d7-signal-bright);
  border-bottom:1px solid var(--layer2b9d7-signal-dim);
  padding-bottom:1px;
}
.layer2b9d7-prose a:hover{ border-bottom-color:var(--layer2b9d7-signal-bright); }
.layer2b9d7-prose h2{
  font-size:17px;
  margin-bottom:8px;
  color:#fff;
}

/* Definition-style comparison rows */
.layer2b9d7-rows{
  border:1px solid var(--layer2b9d7-line);
  background:var(--layer2b9d7-canvas-deep);
}
.layer2b9d7-row{
  display:grid;
  grid-template-columns:96px 1fr;
  gap:10px;
  padding:11px 12px;
  border-bottom:1px solid var(--layer2b9d7-line);
  align-items:start;
}
.layer2b9d7-row:last-child{ border-bottom:0; }
.layer2b9d7-row-key{
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--layer2b9d7-signal-bright);
  padding-top:1px;
}
.layer2b9d7-row-val{
  font-size:13.5px;
  color:var(--layer2b9d7-ink);
}

/* Stat strip */
.layer2b9d7-stats{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:8px;
}
.layer2b9d7-stat{
  background:var(--layer2b9d7-canvas-deep);
  border:1px solid var(--layer2b9d7-line);
  padding:12px;
  position:relative;
}
.layer2b9d7-stat-num{
  font-family:var(--layer2b9d7-font-tech);
  font-size:20px;
  color:#fff;
  letter-spacing:.02em;
}
.layer2b9d7-stat-label{
  font-size:11px;
  color:var(--layer2b9d7-ink-faint);
  letter-spacing:.04em;
  margin-top:3px;
}
.layer2b9d7-stat::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:2px;
  background:var(--layer2b9d7-signal);
}

/* Inline promo CTA inside content */
.layer2b9d7-inline-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:10px 0 4px;
  padding:11px 12px;
  background:linear-gradient(90deg, rgba(153,50,204,.18), rgba(153,50,204,.04));
  border:1px solid var(--layer2b9d7-signal-dim);
}
.layer2b9d7-inline-cta-text{
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-bright);
  flex:1;
}
.layer2b9d7-inline-cta .layer2b9d7-btn-primary{
  padding:9px 12px;
  font-size:12px;
  white-space:nowrap;
}

/* Steps */
.layer2b9d7-steps{ list-style:none; padding:0; margin:0; counter-reset:step; }
.layer2b9d7-steps li{
  position:relative;
  padding:8px 0 8px 30px;
  border-bottom:1px dashed var(--layer2b9d7-line);
  font-size:13.5px;
  counter-increment:step;
}
.layer2b9d7-steps li:last-child{ border-bottom:0; }
.layer2b9d7-steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute;
  left:0; top:8px;
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  color:var(--layer2b9d7-signal-bright);
  border:1px solid var(--layer2b9d7-signal-dim);
  padding:1px 4px;
}

/* Answer callout */
.layer2b9d7-answer{
  background:var(--layer2b9d7-canvas-deep);
  border:1px solid var(--layer2b9d7-signal-dim);
  padding:14px;
}
.layer2b9d7-answer-tag{
  font-family:var(--layer2b9d7-font-tech);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--layer2b9d7-signal-bright);
  margin-bottom:6px;
}
.layer2b9d7-answer p{ font-size:14px; color:var(--layer2b9d7-ink); }

/* ==========================================================================
   Extended footer (brand > promotions > page directory > disclaimer)
   ========================================================================== */
.layer2b9d7-extended{
  margin:8px -12px 0;
  padding:22px 14px 18px;
  background:var(--layer2b9d7-canvas-deep);
  border-top:1px solid var(--layer2b9d7-line-strong);
}
.layer2b9d7-ext-block{ margin-bottom:20px; }
.layer2b9d7-ext-block:last-child{ margin-bottom:0; }
.layer2b9d7-ext-title{
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--layer2b9d7-ink-bright);
  margin-bottom:9px;
  padding-bottom:5px;
  border-bottom:1px solid var(--layer2b9d7-line);
}
.layer2b9d7-ext-title::before{
  content:">";
  color:var(--layer2b9d7-signal);
  margin-right:6px;
}
.layer2b9d7-brand-blurb{
  font-size:13px;
  color:var(--layer2b9d7-ink);
  margin:0 0 10px;
}
.layer2b9d7-brand-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
}
.layer2b9d7-brand-row img{
  width:28px; height:28px; object-fit:contain;
  border:1px solid var(--layer2b9d7-signal-dim);
  background:#0D0D1C;
}

/* Promotion cluster: 7 compact entries */
.layer2b9d7-promo-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:7px;
}
.layer2b9d7-promo-grid .layer2b9d7-btn{
  font-size:11px;
  padding:9px 8px;
  letter-spacing:.04em;
  text-transform:none;
  font-family:var(--layer2b9d7-font-body);
  text-align:left;
  min-height:40px;
  border:1px solid var(--layer2b9d7-signal-dim);
  background:rgba(153,50,204,.08);
  color:var(--layer2b9d7-ink-bright);
}
.layer2b9d7-promo-grid .layer2b9d7-btn:hover{
  border-color:var(--layer2b9d7-signal-bright);
  background:rgba(153,50,204,.16);
}

/* Page directory */
.layer2b9d7-directory{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:4px 12px;
}
.layer2b9d7-directory a{
  font-size:12.5px;
  color:var(--layer2b9d7-ink);
  padding:6px 0;
  border-bottom:1px solid rgba(52,52,79,.5);
  display:flex;
  gap:6px;
  align-items:center;
}
.layer2b9d7-directory a::before{
  content:"›";
  color:var(--layer2b9d7-signal);
  font-family:var(--layer2b9d7-font-tech);
}
.layer2b9d7-directory a:hover{ color:var(--layer2b9d7-ink-bright); }

.layer2b9d7-disclaimer{
  font-size:11.5px;
  line-height:1.5;
  color:var(--layer2b9d7-ink-faint);
  padding:10px 12px;
  border:1px dashed var(--layer2b9d7-line);
  background:rgba(0,0,0,.15);
}

/* ==========================================================================
   Footer (common) — brand-emphasis band + copyright
   ========================================================================== */
.layer2b9d7-footer{
  background:#0B0B17;
  border-top:1px solid var(--layer2b9d7-line-strong);
  padding:14px 14px calc(14px);
  text-align:center;
}
.layer2b9d7-footer-mark{
  font-family:var(--layer2b9d7-font-tech);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--layer2b9d7-signal-bright);
  margin-bottom:4px;
}
.layer2b9d7-footer-copy{
  font-size:11.5px;
  color:var(--layer2b9d7-ink-faint);
  margin:0;
}

/* ==========================================================================
   Mobile bottom nav — 5 roles, fixed, brand-emphasis band
   ========================================================================== */
.layer2b9d7-bottom{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom:0;
  width:100%;
  max-width:var(--layer2b9d7-frame-max);
  z-index:45;
  background:linear-gradient(180deg, #1C1C36 0%, #0E0E1C 100%);
  border-top:1px solid var(--layer2b9d7-signal-dim);
  box-shadow:0 -8px 22px rgba(0,0,0,.45);
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
}
.layer2b9d7-bottom-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:6px 2px 4px;
  color:var(--layer2b9d7-ink-faint);
  border-radius:var(--layer2b9d7-radius);
  transition:color var(--layer2b9d7-press), background var(--layer2b9d7-press);
  min-height:48px;
  position:relative;
}
.layer2b9d7-bottom-item:hover{ color:var(--layer2b9d7-ink-bright); }
.layer2b9d7-bottom-item[aria-current="page"]{
  color:var(--layer2b9d7-ink-bright);
  background:rgba(153,50,204,.16);
}
.layer2b9d7-bottom-item[aria-current="page"]::before{
  content:"";
  position:absolute;
  left:50%; top:0;
  transform:translateX(-50%);
  width:22px; height:2px;
  background:var(--layer2b9d7-signal-bright);
}
.layer2b9d7-bottom-item[data-role="promo"]{ color:var(--layer2b9d7-signal-bright); }
.layer2b9d7-bottom-icon{
  width:22px; height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.layer2b9d7-bottom-icon svg{
  width:20px; height:20px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.layer2b9d7-bottom-label{
  font-family:var(--layer2b9d7-font-tech);
  font-size:9px;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* ==========================================================================
   Utilities + responsive
   ========================================================================== */
.layer2b9d7-visually-hidden{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.layer2b9d7-lead{ color:var(--layer2b9d7-ink-bright); font-size:14.5px; }

@media (min-width:430px){
  .layer2b9d7-promo-grid{ grid-template-columns:repeat(3, 1fr); }
  .layer2b9d7-directory{ grid-template-columns:repeat(3, 1fr); }
  .layer2b9d7-stats{ grid-template-columns:repeat(4, 1fr); }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; scroll-behavior:auto !important; }
}

/* ---------- Help-page instruments ---------- */
.layer2b9d7-help-intro{
  padding:16px 14px 14px;
  margin:0 -2px 18px;
  border:1px solid var(--layer2b9d7-line-strong);
  background:linear-gradient(135deg,#242442 0%,#17172B 70%);
}
.layer2b9d7-help-intro h1{font-size:23px; margin-bottom:9px;}
.layer2b9d7-help-intro p{font-size:14px; margin-bottom:0;}
.layer2b9d7-checklist{list-style:none; padding:0; margin:0; display:grid; gap:8px;}
.layer2b9d7-checklist li{padding:11px 12px 11px 38px; position:relative; border:1px solid var(--layer2b9d7-line); background:#151526; font-size:13px;}
.layer2b9d7-checklist li::before{content:"✓"; position:absolute; left:13px; top:10px; color:var(--layer2b9d7-signal-bright); font-family:var(--layer2b9d7-font-tech); font-size:16px;}
.layer2b9d7-troubles{display:grid; gap:9px;}
.layer2b9d7-trouble{border-left:3px solid var(--layer2b9d7-signal); background:#151526; padding:11px 12px;}
.layer2b9d7-trouble strong{display:block; color:#fff; font-family:var(--layer2b9d7-font-tech); font-size:12px; letter-spacing:.04em; margin-bottom:4px;}
.layer2b9d7-trouble p{font-size:13px; margin:0 0 5px;}
.layer2b9d7-trouble p:last-child{margin-bottom:0;}
.layer2b9d7-help-table{width:100%; border-collapse:collapse; font-size:12.5px; background:#151526;}
.layer2b9d7-help-table th,.layer2b9d7-help-table td{padding:9px 8px; border:1px solid var(--layer2b9d7-line); text-align:left; vertical-align:top;}
.layer2b9d7-help-table th{color:var(--layer2b9d7-signal-bright); font-family:var(--layer2b9d7-font-tech); font-size:10px; letter-spacing:.08em; text-transform:uppercase;}
.layer2b9d7-help-steps{counter-reset:helpstep; display:grid; gap:8px;}
.layer2b9d7-help-step{counter-increment:helpstep; padding:11px 12px 11px 42px; border-bottom:1px dashed var(--layer2b9d7-line); position:relative; font-size:13.5px;}
.layer2b9d7-help-step::before{content:counter(helpstep); position:absolute; left:0; top:9px; width:25px; height:25px; display:grid; place-items:center; border:1px solid var(--layer2b9d7-signal); color:#fff; font-family:var(--layer2b9d7-font-tech);}
.layer2b9d7-answer-list{display:grid; gap:6px;}
.layer2b9d7-answer-list details{border:1px solid var(--layer2b9d7-line); background:#151526; padding:10px 11px;}
.layer2b9d7-answer-list summary{cursor:pointer; color:var(--layer2b9d7-ink-bright); font-family:var(--layer2b9d7-font-tech); font-size:12px; padding-right:6px;}
.layer2b9d7-answer-list p{font-size:13px; margin:8px 0 0;}
.layer2b9d7-entity-map{display:flex; flex-wrap:wrap; gap:7px;}
.layer2b9d7-entity-map span{padding:7px 9px; border:1px solid var(--layer2b9d7-signal-dim); background:rgba(153,50,204,.1); color:var(--layer2b9d7-ink-bright); font-size:12px;}
.layer2b9d7-callout-link{display:block; padding:12px; border:1px solid var(--layer2b9d7-signal-dim); background:rgba(153,50,204,.1); color:var(--layer2b9d7-ink-bright); font-size:13px;}
.layer2b9d7-callout-link:hover{background:rgba(153,50,204,.2);}
.layer2b9d7-about-panel{padding:13px 14px; border-top:2px solid var(--layer2b9d7-signal); background:#151526;}
.layer2b9d7-about-panel h3{font-size:14px; margin-bottom:6px; color:#fff;}
.layer2b9d7-about-panel p{font-size:13.5px; margin-bottom:8px;}
.layer2b9d7-about-panel p:last-child{margin-bottom:0;}