/* ============================================================
   23Win Com - Mobile First Base Stylesheet
   Prefix: layer5e29f-
   Canvas: 320-430px phone, centered on wide screens
   Palette: salmon / sienna / peru on dark canvas
   ============================================================ */

/* ---------- Design tokens ---------- */
:root{
  --layer5e29f-bg:          #1E1E1E;
  --layer5e29f-bg-deep:     #14110F;
  --layer5e29f-surface:     #2A2320;
  --layer5e29f-surface-2:   #36291F;
  --layer5e29f-surface-3:   #43321F;
  --layer5e29f-line:        rgba(205,133,63,.22);
  --layer5e29f-line-strong: rgba(233,150,122,.45);

  --layer5e29f-text:        #EEEEEE;
  --layer5e29f-text-soft:   #D8C8B6;
  --layer5e29f-text-mute:   #B19A86;
  --layer5e29f-text-dim:    #8A7867;

  --layer5e29f-salmon:      #E9967A;
  --layer5e29f-sienna:      #A0522D;
  --layer5e29f-peru:        #CD853F;
  --layer5e29f-peru-soft:   #B8702E;
  --layer5e29f-cream:       #EEEEEE;

  --layer5e29f-cta-bg:      #E9967A;
  --layer5e29f-cta-ink:     #1E1E1E;
  --layer5e29f-cta-2-bg:    #CD853F;

  --layer5e29f-shadow-1: 0 6px 18px rgba(0,0,0,.35);
  --layer5e29f-shadow-2: 0 14px 32px rgba(0,0,0,.45);
  --layer5e29f-radius-s: 6px;
  --layer5e29f-radius-m: 10px;
  --layer5e29f-radius-l: 14px;

  --layer5e29f-header-h: 58px;
  --layer5e29f-bottomnav-h: 64px;

  --layer5e29f-font-head: "Trebuchet MS","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --layer5e29f-font-body: system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  --layer5e29f-canvas-max: 430px;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html,body{ margin:0; padding:0; }
body{
  background:var(--layer5e29f-bg-deep);
  color:var(--layer5e29f-text);
  font-family:var(--layer5e29f-font-body);
  font-size:15px;
  line-height:1.6;
  word-break:break-word;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; border:0; }
a{ color:var(--layer5e29f-salmon); text-decoration:none; }
a:hover{ color:var(--layer5e29f-cream); text-decoration:underline; }
button{ font-family:inherit; cursor:pointer; border:0; background:transparent; color:inherit; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--layer5e29f-font-head); font-weight:700; line-height:1.25; margin:0 0 .5em; letter-spacing:.2px; }
h1{ font-size:1.55rem; }
h2{ font-size:1.18rem; }
h3{ font-size:1.02rem; }
p{ margin:0 0 .85em; }
:focus-visible{ outline:2px solid var(--layer5e29f-salmon); outline-offset:2px; border-radius:4px; }

/* ---------- Phone canvas ---------- */
.layer5e29f-canvas{
  position:relative;
  max-width:var(--layer5e29f-canvas-max);
  margin:0 auto;
  background:var(--layer5e29f-bg);
  min-height:100vh;
  box-shadow:0 0 50px rgba(0,0,0,.55);
  overflow:hidden;
}
.layer5e29f-main{
  padding-top:calc(var(--layer5e29f-header-h) + 6px);
  padding-bottom:calc(var(--layer5e29f-bottomnav-h) + 16px);
}
.layer5e29f-skip{
  position:absolute;
  left:-999px;
  top:0;
  background:var(--layer5e29f-salmon);
  color:var(--layer5e29f-cta-ink);
  padding:8px 14px;
  z-index:300;
  border-radius:0 0 var(--layer5e29f-radius-s) 0;
}
.layer5e29f-skip:focus{ left:0; }

/* ---------- Top header ---------- */
.layer5e29f-header{
  position:fixed;
  top:0; left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:var(--layer5e29f-canvas-max);
  height:var(--layer5e29f-header-h);
  background:linear-gradient(180deg,#241a14 0%,#1c1410 100%);
  border-bottom:1px solid var(--layer5e29f-line);
  z-index:120;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 12px;
}
.layer5e29f-brand{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1;
}
.layer5e29f-brand-img{
  width:38px;
  height:38px;
  border-radius:var(--layer5e29f-radius-s);
  object-fit:cover;
  border:1px solid var(--layer5e29f-line-strong);
  background:#0e0a08;
  flex-shrink:0;
}
.layer5e29f-brand-name{
  font-family:var(--layer5e29f-font-head);
  font-weight:800;
  font-size:1.06rem;
  letter-spacing:.4px;
  color:var(--layer5e29f-cream);
  white-space:nowrap;
}
.layer5e29f-brand-name b{ color:var(--layer5e29f-salmon); }

.layer5e29f-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
}
.layer5e29f-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 12px;
  font-family:var(--layer5e29f-font-head);
  font-weight:700;
  font-size:.86rem;
  letter-spacing:.3px;
  border-radius:var(--layer5e29f-radius-s);
  transition:transform .12s ease, background .2s ease, color .2s ease;
  text-decoration:none;
  cursor:pointer;
  white-space:nowrap;
}
.layer5e29f-btn:active{ transform:translateY(1px); }
.layer5e29f-btn--primary{
  background:var(--layer5e29f-cta-bg);
  color:var(--layer5e29f-cta-ink);
}
.layer5e29f-btn--primary:hover{ background:var(--layer5e29f-cream); color:var(--layer5e29f-cta-ink); text-decoration:none; }
.layer5e29f-btn--ghost{
  background:transparent;
  color:var(--layer5e29f-cream);
  border:1px solid var(--layer5e29f-line-strong);
}
.layer5e29f-btn--ghost:hover{ background:var(--layer5e29f-surface-2); color:var(--layer5e29f-cream); text-decoration:none; }

.layer5e29f-menu-toggle{
  width:38px;
  height:38px;
  border-radius:var(--layer5e29f-radius-s);
  border:1px solid var(--layer5e29f-line);
  background:var(--layer5e29f-surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--layer5e29f-salmon);
}
.layer5e29f-menu-toggle:hover{ background:var(--layer5e29f-surface-2); }
.layer5e29f-menu-toggle-bars,
.layer5e29f-menu-toggle-bars::before,
.layer5e29f-menu-toggle-bars::after{
  content:"";
  display:block;
  width:18px;
  height:2px;
  background:currentColor;
  position:relative;
  border-radius:2px;
}
.layer5e29f-menu-toggle-bars::before{ position:absolute; top:-6px; }
.layer5e29f-menu-toggle-bars::after{ position:absolute; top:6px; }

/* ---------- Slide-in drawer ---------- */
.layer5e29f-drawer-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease;
  z-index:140;
}
.layer5e29f-drawer-overlay--open{ opacity:1; visibility:visible; }
.layer5e29f-drawer{
  position:fixed;
  top:0; right:0;
  width:min(82vw,340px);
  height:100%;
  background:linear-gradient(180deg,#241a14,#171010);
  border-left:1px solid var(--layer5e29f-line-strong);
  z-index:160;
  transform:translateX(105%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
  padding:18px 16px calc(var(--layer5e29f-bottomnav-h) + 18px);
}
.layer5e29f-drawer--open{ transform:translateX(0); }
.layer5e29f-locked{ overflow:hidden; }
.layer5e29f-drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid var(--layer5e29f-line);
}
.layer5e29f-drawer-title{
  font-family:var(--layer5e29f-font-head);
  font-weight:800;
  font-size:1.05rem;
  color:var(--layer5e29f-cream);
}
.layer5e29f-drawer-close{
  width:34px; height:34px;
  border-radius:var(--layer5e29f-radius-s);
  border:1px solid var(--layer5e29f-line);
  color:var(--layer5e29f-salmon);
  font-size:1.2rem;
  line-height:1;
}
.layer5e29f-drawer-close:hover{ background:var(--layer5e29f-surface-2); }
.layer5e29f-drawer-section-label{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:1.4px;
  color:var(--layer5e29f-text-dim);
  margin:14px 0 6px;
}
.layer5e29f-drawer-link{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 10px;
  border-radius:var(--layer5e29f-radius-s);
  color:var(--layer5e29f-text-soft);
  font-size:.95rem;
  border:1px solid transparent;
}
.layer5e29f-drawer-link:hover{
  background:var(--layer5e29f-surface-2);
  color:var(--layer5e29f-cream);
  text-decoration:none;
  border-color:var(--layer5e29f-line);
}
.layer5e29f-drawer-link .layer5e29f-drawer-ico{
  width:22px; text-align:center; color:var(--layer5e29f-peru); font-size:1rem;
}
.layer5e29f-drawer-cta-row{
  display:flex; gap:8px; margin-top:14px;
}
.layer5e29f-drawer-cta-row .layer5e29f-btn{ flex:1; min-height:42px; }

/* ---------- Hero carousel ---------- */
.layer5e29f-hero{ padding:6px 12px 0; }
.layer5e29f-carousel{
  position:relative;
  border-radius:var(--layer5e29f-radius-l);
  overflow:hidden;
  background:#0e0a08;
  border:1px solid var(--layer5e29f-line);
  box-shadow:var(--layer5e29f-shadow-1);
}
.layer5e29f-carousel-track{
  position:relative;
  aspect-ratio:16/9;
  min-height:170px;
}
.layer5e29f-carousel-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .5s ease;
  cursor:pointer;
}
.layer5e29f-carousel-slide--active{ opacity:1; }
.layer5e29f-carousel-slide img{
  width:100%; height:100%;
  object-fit:cover;
}
.layer5e29f-carousel-cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:18px 14px 12px;
  background:linear-gradient(180deg,transparent,rgba(10,7,5,.92));
  color:var(--layer5e29f-cream);
}
.layer5e29f-carousel-cap-title{
  font-family:var(--layer5e29f-font-head);
  font-weight:800;
  font-size:1.02rem;
  margin:0 0 2px;
}
.layer5e29f-carousel-cap-sub{
  font-size:.78rem;
  color:var(--layer5e29f-text-soft);
  margin:0;
}
.layer5e29f-carousel-dots{
  position:absolute;
  right:10px; bottom:10px;
  display:flex; gap:6px;
  z-index:2;
}
.layer5e29f-carousel-dot{
  width:8px; height:8px;
  border-radius:50%;
  background:rgba(238,238,238,.45);
  border:0; padding:0;
  cursor:pointer;
  transition:background .2s,transform .2s;
}
.layer5e29f-carousel-dot--active{
  background:var(--layer5e29f-salmon);
  transform:scale(1.25);
}

/* ---------- Intro band ---------- */
.layer5e29f-intro{
  padding:14px 14px 4px;
}
.layer5e29f-intro h1{
  color:var(--layer5e29f-cream);
  margin-bottom:8px;
}
.layer5e29f-intro h1 b{ color:var(--layer5e29f-salmon); }
.layer5e29f-intro p{
  color:var(--layer5e29f-text-soft);
  font-size:.92rem;
  margin:0;
}
.layer5e29f-quick-row{
  display:flex;
  gap:8px;
  margin-top:12px;
  flex-wrap:wrap;
}
.layer5e29f-quick-row .layer5e29f-btn{ flex:1; min-width:120px; min-height:42px; }

/* ---------- Section shell ---------- */
.layer5e29f-section{
  padding:18px 14px 6px;
}
.layer5e29f-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  padding-bottom:8px;
  border-bottom:1px solid var(--layer5e29f-line);
}
.layer5e29f-section-title{
  font-family:var(--layer5e29f-font-head);
  font-weight:800;
  font-size:1.1rem;
  color:var(--layer5e29f-cream);
  margin:0;
}
.layer5e29f-section-title b{ color:var(--layer5e29f-salmon); }
.layer5e29f-section-tag{
  font-size:.7rem;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--layer5e29f-peru);
  padding:3px 8px;
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  white-space:nowrap;
}
.layer5e29f-section-lead{
  color:var(--layer5e29f-text-soft);
  font-size:.9rem;
  margin:0 0 12px;
}

/* ---------- Game grid + card ---------- */
.layer5e29f-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.layer5e29f-card{
  background:var(--layer5e29f-surface);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-m);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  text-align:center;
  cursor:pointer;
  transition:transform .14s ease, border-color .2s ease, box-shadow .2s ease;
  -webkit-tap-highlight-color:transparent;
}
.layer5e29f-card:hover{
  transform:translateY(-2px);
  border-color:var(--layer5e29f-line-strong);
  box-shadow:var(--layer5e29f-shadow-1);
  text-decoration:none;
}
.layer5e29f-card:active{ transform:translateY(0); }
button.layer5e29f-card{
  width:100%;
  padding:0;
  text-align:center;
  font:inherit;
  color:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.layer5e29f-card-img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  background:#0e0a08;
  display:block;
}
.layer5e29f-card-name{
  font-size:.72rem;
  line-height:1.15;
  padding:6px 4px 7px;
  color:var(--layer5e29f-cream);
  background:linear-gradient(180deg,#241a14,#1a1310);
  border-top:1px solid var(--layer5e29f-line);
  min-height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
}
.layer5e29f-card-hot{
  position:relative;
}
.layer5e29f-card-hot::before{
  content:"HOT";
  position:absolute;
  top:5px; left:5px;
  background:var(--layer5e29f-salmon);
  color:var(--layer5e29f-cta-ink);
  font-family:var(--layer5e29f-font-head);
  font-weight:800;
  font-size:.58rem;
  letter-spacing:.6px;
  padding:2px 5px;
  border-radius:4px;
  z-index:1;
}

/* ---------- Content modules ---------- */
.layer5e29f-module{
  background:var(--layer5e29f-surface);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-l);
  padding:14px;
  margin-bottom:14px;
}
.layer5e29f-module h2{ color:var(--layer5e29f-cream); }
.layer5e29f-module h2 b{ color:var(--layer5e29f-salmon); }
.layer5e29f-module h3{ color:var(--layer5e29f-peru); margin-top:14px; }
.layer5e29f-module p{ color:var(--layer5e29f-text-soft); font-size:.92rem; }
.layer5e29f-module a{ color:var(--layer5e29f-salmon); font-weight:600; }

.layer5e29f-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 4px;
}
.layer5e29f-pill{
  font-size:.74rem;
  padding:4px 10px;
  border-radius:999px;
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  color:var(--layer5e29f-text-soft);
}

/* category highlight cards */
.layer5e29f-cat-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  margin-top:10px;
}
.layer5e29f-cat{
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-left:3px solid var(--layer5e29f-salmon);
  border-radius:var(--layer5e29f-radius-s);
  padding:10px 11px;
}
.layer5e29f-cat h3{
  margin:0 0 4px;
  font-size:.92rem;
  color:var(--layer5e29f-cream);
}
.layer5e29f-cat p{
  margin:0;
  font-size:.8rem;
  color:var(--layer5e29f-text-mute);
  line-height:1.45;
}

/* steps list */
.layer5e29f-steps{ counter-reset:step; margin-top:8px; }
.layer5e29f-step{
  position:relative;
  padding:8px 10px 8px 42px;
  margin-bottom:8px;
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  counter-increment:step;
  min-height:44px;
}
.layer5e29f-step::before{
  content:counter(step);
  position:absolute;
  left:8px; top:50%;
  transform:translateY(-50%);
  width:26px; height:26px;
  background:var(--layer5e29f-salmon);
  color:var(--layer5e29f-cta-ink);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:800;
  font-family:var(--layer5e29f-font-head);
  font-size:.85rem;
}
.layer5e29f-step strong{ color:var(--layer5e29f-cream); }
.layer5e29f-step span{ color:var(--layer5e29f-text-mute); font-size:.85rem; display:block; }

/* mobile access summary */
.layer5e29f-access-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:10px;
}
.layer5e29f-access{
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  padding:10px 6px;
  text-align:center;
}
.layer5e29f-access-ico{
  font-size:1.2rem;
  color:var(--layer5e29f-peru);
  display:block;
  margin-bottom:4px;
}
.layer5e29f-access strong{
  display:block;
  color:var(--layer5e29f-cream);
  font-size:.82rem;
  font-family:var(--layer5e29f-font-head);
}
.layer5e29f-access span{
  display:block;
  font-size:.72rem;
  color:var(--layer5e29f-text-mute);
  margin-top:2px;
}

/* winners ticker */
.layer5e29f-winners{
  margin-top:8px;
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  overflow:hidden;
}
.layer5e29f-winner{
  display:grid;
  grid-template-columns:32px 1fr auto;
  align-items:center;
  gap:10px;
  padding:9px 11px;
  border-bottom:1px solid var(--layer5e29f-line);
  font-size:.85rem;
}
.layer5e29f-winner:last-child{ border-bottom:0; }
.layer5e29f-winner-ava{
  width:30px; height:30px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--layer5e29f-salmon),var(--layer5e29f-peru));
  color:var(--layer5e29f-cta-ink);
  display:flex; align-items:center; justify-content:center;
  font-weight:800;
  font-family:var(--layer5e29f-font-head);
  font-size:.85rem;
}
.layer5e29f-winner-name{ color:var(--layer5e29f-cream); font-weight:600; }
.layer5e29f-winner-game{ display:block; color:var(--layer5e29f-text-mute); font-size:.74rem; }
.layer5e29f-winner-amt{
  color:var(--layer5e29f-salmon);
  font-weight:800;
  font-family:var(--layer5e29f-font-head);
  white-space:nowrap;
}

/* features list */
.layer5e29f-feat{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  margin-top:8px;
}
.layer5e29f-feat-item{
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  padding:10px 11px;
}
.layer5e29f-feat-item h3{
  margin:0 0 4px;
  font-size:.86rem;
  color:var(--layer5e29f-cream);
}
.layer5e29f-feat-item p{
  margin:0;
  font-size:.78rem;
  color:var(--layer5e29f-text-mute);
  line-height:1.45;
}

/* scenario Q&A */
.layer5e29f-qa{
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-s);
  padding:11px 12px;
  margin-top:8px;
}
.layer5e29f-qa summary{
  cursor:pointer;
  font-weight:700;
  color:var(--layer5e29f-cream);
  font-family:var(--layer5e29f-font-head);
  font-size:.92rem;
  list-style:none;
  position:relative;
  padding-right:18px;
}
.layer5e29f-qa summary::-webkit-details-marker{ display:none; }
.layer5e29f-qa summary::after{
  content:"+";
  position:absolute;
  right:0; top:50%;
  transform:translateY(-50%);
  color:var(--layer5e29f-salmon);
  font-size:1.1rem;
  font-weight:800;
}
.layer5e29f-qa[open] summary::after{ content:"–"; }
.layer5e29f-qa-body{
  margin-top:8px;
  color:var(--layer5e29f-text-soft);
  font-size:.88rem;
}

/* ---------- Extended footer ---------- */
.layer5e29f-ext{
  margin:18px 14px 8px;
  background:linear-gradient(180deg,#1f1712,#15100d);
  border:1px solid var(--layer5e29f-line);
  border-radius:var(--layer5e29f-radius-l);
  overflow:hidden;
}
.layer5e29f-ext-promos{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  padding:14px;
  border-bottom:1px solid var(--layer5e29f-line);
  background:rgba(233,150,122,.05);
}
.layer5e29f-promo{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px 11px;
  border-radius:var(--layer5e29f-radius-s);
  background:var(--layer5e29f-surface-2);
  border:1px solid var(--layer5e29f-line);
  cursor:pointer;
  min-height:44px;
  transition:transform .12s ease, border-color .2s;
}
.layer5e29f-promo:hover{
  transform:translateY(-2px);
  border-color:var(--layer5e29f-line-strong);
  text-decoration:none;
}
.layer5e29f-promo-ico{
  font-size:1rem;
  color:var(--layer5e29f-salmon);
}
.layer5e29f-promo-title{
  font-family:var(--layer5e29f-font-head);
  font-weight:700;
  color:var(--layer5e29f-cream);
  font-size:.88rem;
}
.layer5e29f-promo-sub{
  font-size:.72rem;
  color:var(--layer5e29f-text-mute);
}
.layer5e29f-ext-brand{
  padding:14px;
  border-bottom:1px solid var(--layer5e29f-line);
}
.layer5e29f-ext-brand h3{
  margin:0 0 6px;
  color:var(--layer5e29f-cream);
  font-size:1rem;
}
.layer5e29f-ext-brand p{
  margin:0;
  font-size:.85rem;
  color:var(--layer5e29f-text-mute);
}
.layer5e29f-ext-dir{
  padding:14px;
  border-bottom:1px solid var(--layer5e29f-line);
}
.layer5e29f-ext-dir-title{
  font-family:var(--layer5e29f-font-head);
  font-weight:700;
  color:var(--layer5e29f-peru);
  font-size:.82rem;
  letter-spacing:.6px;
  text-transform:uppercase;
  margin:0 0 8px;
}
.layer5e29f-ext-dir-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px 10px;
}
.layer5e29f-ext-dir-grid a{
  font-size:.82rem;
  color:var(--layer5e29f-text-soft);
  padding:5px 0;
  border-bottom:1px dotted var(--layer5e29f-line);
}
.layer5e29f-ext-dir-grid a:hover{ color:var(--layer5e29f-salmon); }
.layer5e29f-ext-disclaimer{
  padding:12px 14px;
  font-size:.74rem;
  color:var(--layer5e29f-text-dim);
  line-height:1.5;
  background:rgba(0,0,0,.25);
}

/* ---------- Common footer ---------- */
.layer5e29f-foot{
  padding:12px 14px 6px;
  text-align:center;
  font-size:.76rem;
  color:var(--layer5e29f-text-dim);
  border-top:1px solid var(--layer5e29f-line);
  margin-top:6px;
}
.layer5e29f-foot a{ color:var(--layer5e29f-text-mute); }

/* ---------- Bottom nav ---------- */
.layer5e29f-bottomnav{
  position:fixed;
  bottom:0; left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:var(--layer5e29f-canvas-max);
  height:var(--layer5e29f-bottomnav-h);
  background:linear-gradient(180deg,#1c1410,#120d0a);
  border-top:1px solid var(--layer5e29f-line-strong);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  z-index:130;
  box-shadow:0 -8px 22px rgba(0,0,0,.4);
}
.layer5e29f-bottomnav-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:6px 4px;
  color:var(--layer5e29f-text-mute);
  font-size:.66rem;
  text-decoration:none;
  border-top:3px solid transparent;
  min-height:44px;
  position:relative;
  transition:color .2s, background .2s;
}
.layer5e29f-bottomnav-item:hover{
  color:var(--layer5e29f-cream);
  text-decoration:none;
}
.layer5e29f-bottomnav-item--active{
  color:var(--layer5e29f-salmon);
  background:rgba(233,150,122,.10);
  border-top-color:var(--layer5e29f-salmon);
}
.layer5e29f-bottomnav-ico{
  font-size:1.15rem;
  line-height:1;
}
.layer5e29f-bottomnav-label{
  font-weight:600;
  letter-spacing:.2px;
}
.layer5e29f-bottomnav-item--promo{
  color:var(--layer5e29f-salmon);
}
.layer5e29f-bottomnav-item--promo .layer5e29f-bottomnav-ico{
  color:var(--layer5e29f-peru);
}

/* ---------- Utility ---------- */
.layer5e29f-hidden-visually{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.layer5e29f-cta-inline{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 14px;
  margin:6px 0;
  background:var(--layer5e29f-cta-bg);
  color:var(--layer5e29f-cta-ink);
  font-family:var(--layer5e29f-font-head);
  font-weight:700;
  font-size:.86rem;
  border-radius:var(--layer5e29f-radius-s);
  min-height:40px;
}
.layer5e29f-cta-inline:hover{
  background:var(--layer5e29f-cream);
  color:var(--layer5e29f-cta-ink);
  text-decoration:none;
}

/* ---------- Responsive (>320 -> 430) ---------- */
@media (min-width:360px){
  .layer5e29f-card-name{ font-size:.76rem; }
}
@media (min-width:375px){
  body{ font-size:15.5px; }
  .layer5e29f-grid{ gap:10px; }
  .layer5e29f-card-name{ font-size:.8rem; }
  .layer5e29f-section-title{ font-size:1.18rem; }
}
@media (min-width:414px){
  .layer5e29f-grid{ grid-template-columns:repeat(5,1fr); }
  .layer5e29f-ext-dir-grid{ grid-template-columns:repeat(3,1fr); }
}

/* Wide screens: keep phone canvas centered, nav still reachable */
@media (min-width:480px){
  .layer5e29f-canvas{
    border-left:1px solid #0a0706;
    border-right:1px solid #0a0706;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    transition:none !important;
    animation:none !important;
  }
}