/* =====================================================================
   xxking.click — interface stylesheet
   Mobile-first casino lobby drawn for a 320–430px canvas, centered
   as a phone frame on wider screens.
   Class prefix : mobilea88d4-
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Design tokens
   --------------------------------------------------------------------- */
:root{
  --mobilea88d4-night:#1A1A2E;              /* canvas base */
  --mobilea88d4-night-2:#212138;            /* raised panel */
  --mobilea88d4-night-3:#2A2A46;            /* card body */
  --mobilea88d4-cream:#FDF5E6;              /* primary text */
  --mobilea88d4-cream-dim:rgba(253,245,230,.74);
  --mobilea88d4-cream-faint:rgba(253,245,230,.52);
  --mobilea88d4-tan:#D2B48C;                /* brand accent */
  --mobilea88d4-tan-deep:#B9946B;
  --mobilea88d4-tan-soft:rgba(210,180,140,.16);
  --mobilea88d4-line:rgba(210,180,140,.24);
  --mobilea88d4-hair:rgba(253,245,230,.09);
  --mobilea88d4-good:#9AD9B0;
  --mobilea88d4-radius:12px;
  --mobilea88d4-radius-lg:18px;
  --mobilea88d4-font-head:"Century Gothic","Avenir Next","Trebuchet MS","Segoe UI",system-ui,sans-serif;
  --mobilea88d4-font-body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mobilea88d4-topbar-h:60px;
  --mobilea88d4-bnav-h:62px;
}

/* ---------------------------------------------------------------------
   2. Base
   --------------------------------------------------------------------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:#0F0F1D;
  color:var(--mobilea88d4-cream);
  font-family:var(--mobilea88d4-font-body);
  font-size:14px;
  line-height:1.62;
}
img{display:block;max-width:100%}
a{color:var(--mobilea88d4-tan);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--mobilea88d4-tan);outline-offset:2px;border-radius:4px}
.mobilea88d4-locked{overflow:hidden}

/* ---------------------------------------------------------------------
   3. Phone canvas
   --------------------------------------------------------------------- */
.mobilea88d4-shell{
  position:relative;
  max-width:430px;
  margin:0 auto;
  min-height:100vh;
  background:
    radial-gradient(120% 46% at 18% -4%, rgba(210,180,140,.10), transparent 62%),
    linear-gradient(180deg,#1C1C31 0%,#1A1A2E 42%,#17172B 100%);
  box-shadow:0 0 0 1px rgba(210,180,140,.12),0 26px 70px rgba(0,0,0,.55);
  overflow-x:clip;
}

/* skip link */
.mobilea88d4-skip{
  position:absolute;left:10px;top:-52px;z-index:90;
  padding:9px 14px;border-radius:10px;
  background:var(--mobilea88d4-tan);color:#1A1A2E;
  font-weight:700;font-size:13px;transition:top .18s ease;
}
.mobilea88d4-skip:focus{top:66px}

/* ---------------------------------------------------------------------
   4. Top bar — logo-led action strip
   --------------------------------------------------------------------- */
.mobilea88d4-topbar{
  position:fixed;top:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:430px;height:var(--mobilea88d4-topbar-h);z-index:70;
  display:flex;align-items:center;gap:8px;
  padding:0 10px 0 12px;
  background:rgba(24,24,42,.94);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--mobilea88d4-line);
}
.mobilea88d4-brand{
  display:flex;align-items:center;gap:8px;min-width:0;
  text-decoration:none;color:var(--mobilea88d4-cream);
}
.mobilea88d4-brand:hover{text-decoration:none}
.mobilea88d4-logo{
  width:36px;height:36px;flex:0 0 auto;
  border-radius:10px;border:1px solid var(--mobilea88d4-line);
  background:var(--mobilea88d4-night-3);object-fit:cover;
}
.mobilea88d4-brand__name{
  font-family:var(--mobilea88d4-font-head);
  font-size:19px;font-weight:700;letter-spacing:.05em;line-height:1;
  white-space:nowrap;
}
.mobilea88d4-brand__name::after{
  content:"";display:block;width:22px;height:3px;margin-top:5px;
  border-radius:99px;background:var(--mobilea88d4-tan);
}
.mobilea88d4-actions{display:flex;align-items:center;gap:8px;margin-left:auto}

/* segmented action pair */
.mobilea88d4-duo{
  display:flex;align-items:stretch;
  border:1px solid var(--mobilea88d4-tan);
  border-radius:12px;overflow:hidden;
}
.mobilea88d4-duo__btn{
  min-height:36px;padding:0 13px;
  font-family:var(--mobilea88d4-font-head);
  font-size:12.5px;font-weight:700;letter-spacing:.04em;
  transition:background .16s ease,color .16s ease;
  white-space:nowrap;
}
.mobilea88d4-duo__btn--fill{background:var(--mobilea88d4-tan);color:#1A1A2E}
.mobilea88d4-duo__btn--fill:active{background:var(--mobilea88d4-tan-deep)}
.mobilea88d4-duo__btn--edge{color:var(--mobilea88d4-tan)}
.mobilea88d4-duo__btn--edge:active{background:var(--mobilea88d4-tan-soft)}
.mobilea88d4-duo__btn--edge:not(:last-child){
  border-left:1px solid var(--mobilea88d4-line);
}

/* menu trigger */
.mobilea88d4-menubtn{
  width:38px;height:38px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--mobilea88d4-line);border-radius:10px;
  color:var(--mobilea88d4-cream);background:var(--mobilea88d4-night-2);
  transition:background .16s ease,border-color .16s ease;
}
.mobilea88d4-menubtn:active{background:var(--mobilea88d4-night-3);border-color:var(--mobilea88d4-tan)}
.mobilea88d4-menubtn svg{width:20px;height:20px}

/* ---------------------------------------------------------------------
   5. Sectioned menu page (drawer under the top bar)
   --------------------------------------------------------------------- */
.mobilea88d4-menu{
  position:fixed;top:var(--mobilea88d4-topbar-h);left:50%;transform:translateX(-50%);
  width:100%;max-width:430px;z-index:65;
  max-height:calc(100dvh - var(--mobilea88d4-topbar-h));
  overflow-y:auto;overscroll-behavior:contain;
  display:none;
  background:#1D1D33;border-bottom:1px solid var(--mobilea88d4-line);
  padding:14px 14px 20px;
}
.mobilea88d4-menu--open{display:block;animation:mobilea88d4menuIn .18s ease both}
@keyframes mobilea88d4menuIn{from{opacity:0;transform:translateX(-50%) translateY(-8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.mobilea88d4-menu__head{
  display:flex;align-items:center;justify-content:space-between;
  margin:2px 2px 10px;
}
.mobilea88d4-menu__title{
  font-family:var(--mobilea88d4-font-head);font-size:13px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--mobilea88d4-tan);
}
.mobilea88d4-menu__close{
  width:32px;height:32px;border-radius:9px;
  border:1px solid var(--mobilea88d4-line);color:var(--mobilea88d4-cream-dim);
  display:flex;align-items:center;justify-content:center;
}
.mobilea88d4-menu__close svg{width:15px;height:15px}
.mobilea88d4-menu__group{margin-top:12px}
.mobilea88d4-menu__label{
  margin:0 2px 6px;font-size:10.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mobilea88d4-cream-faint);
}
.mobilea88d4-menu__list{display:grid;gap:5px}
.mobilea88d4-menu__link{
  display:flex;align-items:center;gap:9px;min-height:44px;
  padding:9px 12px;border-radius:11px;
  color:var(--mobilea88d4-cream);background:var(--mobilea88d4-night-2);
  border:1px solid var(--mobilea88d4-hair);
  transition:background .15s ease,border-color .15s ease;
}
.mobilea88d4-menu__link:hover{text-decoration:none;border-color:var(--mobilea88d4-tan)}
.mobilea88d4-menu__link:active{background:var(--mobilea88d4-night-3)}
.mobilea88d4-menu__dot{
  width:7px;height:7px;flex:0 0 auto;border-radius:99px;
  background:var(--mobilea88d4-tan);opacity:.55;
}
.mobilea88d4-menu__text{font-size:13.5px;line-height:1.35}
.mobilea88d4-menu__text small{
  display:block;font-size:11px;color:var(--mobilea88d4-cream-faint);font-weight:400;
}
.mobilea88d4-menu__link.mobilea88d4-here{
  background:var(--mobilea88d4-tan-soft);
  border-color:var(--mobilea88d4-tan);
  box-shadow:inset 3px 0 0 var(--mobilea88d4-tan);
}
.mobilea88d4-menu__link.mobilea88d4-here .mobilea88d4-menu__dot{opacity:1}

/* ---------------------------------------------------------------------
   6. Main canvas + hero
   --------------------------------------------------------------------- */
.mobilea88d4-main{
  padding:calc(var(--mobilea88d4-topbar-h) + 16px) 14px
          calc(var(--mobilea88d4-bnav-h) + 34px);
}
.mobilea88d4-kicker{
  display:inline-flex;align-items:center;gap:7px;
  font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mobilea88d4-tan);
}
.mobilea88d4-kicker::before{
  content:"";width:16px;height:2px;border-radius:99px;background:var(--mobilea88d4-tan);
}
.mobilea88d4-hero{padding-top:2px}
.mobilea88d4-hero__title{
  margin:9px 0 10px;
  font-family:var(--mobilea88d4-font-head);
  font-size:clamp(22px,6.4vw,27px);
  line-height:1.22;font-weight:700;letter-spacing:.01em;
}
.mobilea88d4-hero__lead{
  margin:0 0 14px;color:var(--mobilea88d4-cream-dim);font-size:13.5px;
}
.mobilea88d4-metrics{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
}
.mobilea88d4-metric{
  padding:9px 11px;border-radius:var(--mobilea88d4-radius);
  background:var(--mobilea88d4-night-2);
  border:1px solid var(--mobilea88d4-hair);
}
.mobilea88d4-metric__value{
  font-family:var(--mobilea88d4-font-head);
  font-size:17px;font-weight:700;color:var(--mobilea88d4-tan);line-height:1.15;
}
.mobilea88d4-metric__label{
  font-size:10.5px;color:var(--mobilea88d4-cream-faint);
  letter-spacing:.03em;line-height:1.35;margin-top:2px;
}
.mobilea88d4-ctarow{display:flex;gap:9px;margin:15px 0 4px}
.mobilea88d4-ctarow .mobilea88d4-btn{flex:1 1 0;min-width:0}
.mobilea88d4-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:46px;padding:11px 16px;border-radius:13px;
  font-family:var(--mobilea88d4-font-head);font-size:13.5px;font-weight:700;
  letter-spacing:.03em;text-align:center;
  transition:transform .15s ease,background .18s ease,color .18s ease,border-color .18s ease;
}
.mobilea88d4-btn:active{transform:scale(.965)}
.mobilea88d4-btn--tan{background:var(--mobilea88d4-tan);color:#1A1A2E}
.mobilea88d4-btn--tan:active{background:var(--mobilea88d4-tan-deep)}
.mobilea88d4-btn--line{border:1px solid var(--mobilea88d4-tan);color:var(--mobilea88d4-tan)}
.mobilea88d4-btn--line:active{background:var(--mobilea88d4-tan-soft)}
.mobilea88d4-btn--wide{width:100%}
.mobilea88d4-hero__assure{
  margin:10px 2px 0;font-size:11.5px;color:var(--mobilea88d4-cream-faint);
}

/* ---------------------------------------------------------------------
   7. Promo carousel
   --------------------------------------------------------------------- */
.mobilea88d4-carousel{
  position:relative;margin:18px 0 4px;
  border-radius:var(--mobilea88d4-radius-lg);
  overflow:hidden;border:1px solid var(--mobilea88d4-line);
  background:var(--mobilea88d4-night-2);
}
.mobilea88d4-track{display:flex;transition:transform .42s cubic-bezier(.22,.61,.36,1)}
.mobilea88d4-slide{
  position:relative;flex:0 0 100%;width:100%;display:block;
}
.mobilea88d4-slide img{width:100%;height:172px;object-fit:cover}
.mobilea88d4-slide::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(26,26,46,.05) 46%,rgba(26,26,46,.55) 100%);
  pointer-events:none;
}
.mobilea88d4-slide__tag{
  position:absolute;left:10px;bottom:10px;z-index:2;max-width:78%;
  padding:5px 10px;border-radius:9px;
  background:rgba(26,26,46,.82);border:1px solid var(--mobilea88d4-line);
  font-size:10.5px;font-weight:700;letter-spacing:.05em;color:var(--mobilea88d4-cream);
  text-align:left;
}
.mobilea88d4-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(20,20,38,.74);border:1px solid var(--mobilea88d4-line);
  color:var(--mobilea88d4-cream);
  transition:background .16s ease;
}
.mobilea88d4-arrow:active{background:rgba(210,180,140,.4)}
.mobilea88d4-arrow svg{width:15px;height:15px}
.mobilea88d4-arrow--prev{left:8px}
.mobilea88d4-arrow--next{right:8px}
.mobilea88d4-dots{
  position:absolute;left:0;right:0;bottom:9px;z-index:3;
  display:flex;justify-content:center;gap:6px;
}
.mobilea88d4-dot{
  width:7px;height:7px;border-radius:99px;padding:0;
  background:rgba(253,245,230,.44);
  transition:width .24s ease,background .24s ease;
}
.mobilea88d4-dot--on{width:20px;background:var(--mobilea88d4-tan)}

/* ---------------------------------------------------------------------
   8. Section scaffolding
   --------------------------------------------------------------------- */
.mobilea88d4-section{margin-top:26px;scroll-margin-top:calc(var(--mobilea88d4-topbar-h) + 12px)}
.mobilea88d4-section__head{
  padding-bottom:10px;margin-bottom:13px;
  border-bottom:1px solid var(--mobilea88d4-hair);
  position:relative;
}
.mobilea88d4-section__head::after{
  content:"";position:absolute;left:0;bottom:-1px;width:44px;height:2px;
  border-radius:99px;background:var(--mobilea88d4-tan);
}
.mobilea88d4-h2{
  margin:7px 0 6px;
  font-family:var(--mobilea88d4-font-head);
  font-size:19px;line-height:1.3;font-weight:700;letter-spacing:.01em;
}
.mobilea88d4-blurb{margin:0;color:var(--mobilea88d4-cream-dim);font-size:13px}

/* ---------------------------------------------------------------------
   9. Game grids — image tile with a bottom name bar
   --------------------------------------------------------------------- */
.mobilea88d4-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px 8px;
}
.mobilea88d4-gamecard{
  display:flex;flex-direction:column;
  border-radius:var(--mobilea88d4-radius);
  border:1px solid rgba(210,180,140,.15);
  background:var(--mobilea88d4-night-3);
  overflow:hidden;min-width:0;
  transition:transform .16s ease,border-color .18s ease;
}
.mobilea88d4-gamecard:active{transform:scale(.95);border-color:var(--mobilea88d4-tan)}
.mobilea88d4-gamecard__frame{aspect-ratio:1/1;background:#232341}
.mobilea88d4-gamecard__frame img{width:100%;height:100%;object-fit:cover}
.mobilea88d4-gamecard__name{
  display:block;min-height:37px;
  padding:5px 4px 6px;
  background:rgba(210,180,140,.10);
  border-top:1px solid rgba(210,180,140,.12);
  font-size:10.5px;font-weight:600;line-height:1.28;color:var(--mobilea88d4-cream);
  text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.mobilea88d4-count{
  display:inline-block;margin-top:10px;
  font-size:11px;color:var(--mobilea88d4-cream-faint);
}

/* ---------------------------------------------------------------------
   10. Activity feed (compact metric rows)
   --------------------------------------------------------------------- */
.mobilea88d4-feed{
  border:1px solid var(--mobilea88d4-hair);border-radius:14px;
  background:var(--mobilea88d4-night-2);overflow:hidden;
}
.mobilea88d4-feed__row{
  display:grid;grid-template-columns:56px minmax(0,1fr) auto;
  align-items:center;gap:8px;padding:9px 12px;
  border-top:1px solid var(--mobilea88d4-hair);
}
.mobilea88d4-feed__row:first-child{border-top:0}
.mobilea88d4-feed__time{
  font-family:var(--mobilea88d4-font-head);font-size:11.5px;font-weight:700;
  color:var(--mobilea88d4-cream-faint);
}
.mobilea88d4-feed__game{font-size:12.5px;color:var(--mobilea88d4-cream);line-height:1.3}
.mobilea88d4-feed__game small{
  display:block;font-size:10.5px;color:var(--mobilea88d4-cream-faint);font-weight:400;
}
.mobilea88d4-feed__amt{
  font-family:var(--mobilea88d4-font-head);font-size:13px;font-weight:700;
  color:var(--mobilea88d4-good);white-space:nowrap;
}
.mobilea88d4-note{
  margin-top:12px;padding:10px 12px;border-radius:11px;
  border-left:3px solid var(--mobilea88d4-tan);
  background:var(--mobilea88d4-tan-soft);
  font-size:11.5px;color:var(--mobilea88d4-cream-dim);
}
.mobilea88d4-p{margin:11px 0 0;color:var(--mobilea88d4-cream-dim);font-size:13px}
.mobilea88d4-p strong{color:var(--mobilea88d4-cream);font-weight:600}

/* ---------------------------------------------------------------------
   11. Numbered steps with a rail
   --------------------------------------------------------------------- */
.mobilea88d4-steps{list-style:none;margin:14px 0 0;padding:0;position:relative}
.mobilea88d4-steps::before{
  content:"";position:absolute;left:17px;top:14px;bottom:14px;width:2px;
  border-radius:99px;background:rgba(210,180,140,.22);
}
.mobilea88d4-step{position:relative;display:flex;gap:12px;padding:0 0 16px}
.mobilea88d4-step:last-child{padding-bottom:2px}
.mobilea88d4-step__no{
  position:relative;z-index:1;flex:0 0 auto;
  width:35px;height:35px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--mobilea88d4-tan);color:#1A1A2E;
  font-family:var(--mobilea88d4-font-head);font-size:14px;font-weight:700;
}
.mobilea88d4-step__body{min-width:0;padding-top:2px}
.mobilea88d4-step__title{
  font-family:var(--mobilea88d4-font-head);font-size:13.5px;font-weight:700;
  color:var(--mobilea88d4-cream);line-height:1.35;
}
.mobilea88d4-step__text{
  margin:3px 0 0;font-size:12.5px;color:var(--mobilea88d4-cream-dim);line-height:1.55;
}

/* ---------------------------------------------------------------------
   12. Category fit rows
   --------------------------------------------------------------------- */
.mobilea88d4-fit{
  display:grid;gap:9px;margin-top:13px;
}
.mobilea88d4-fit__row{
  display:grid;grid-template-columns:minmax(0,1fr);gap:7px;
  padding:11px 12px;border-radius:13px;
  background:var(--mobilea88d4-night-2);
  border:1px solid var(--mobilea88d4-hair);
}
.mobilea88d4-fit__top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.mobilea88d4-fit__name{
  font-family:var(--mobilea88d4-font-head);font-size:14px;font-weight:700;
  color:var(--mobilea88d4-tan);
}
.mobilea88d4-fit__for{
  font-size:11px;color:var(--mobilea88d4-cream-faint);
}
.mobilea88d4-fit__text{margin:0;font-size:12.5px;color:var(--mobilea88d4-cream-dim);line-height:1.55}
.mobilea88d4-chips{display:flex;flex-wrap:wrap;gap:6px}
.mobilea88d4-chip{
  padding:3px 9px;border-radius:99px;
  background:var(--mobilea88d4-tan-soft);border:1px solid var(--mobilea88d4-line);
  font-size:10.5px;font-weight:600;color:var(--mobilea88d4-tan);
  white-space:nowrap;
}

/* ---------------------------------------------------------------------
   13. Milestone bars
   --------------------------------------------------------------------- */
.mobilea88d4-goals{display:grid;gap:12px;margin-top:13px}
.mobilea88d4-goal{padding:11px 12px;border-radius:13px;background:var(--mobilea88d4-night-2);border:1px solid var(--mobilea88d4-hair)}
.mobilea88d4-goal__top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.mobilea88d4-goal__name{
  font-family:var(--mobilea88d4-font-head);font-size:13px;font-weight:700;
  color:var(--mobilea88d4-cream);
}
.mobilea88d4-goal__pct{
  font-family:var(--mobilea88d4-font-head);font-size:12.5px;font-weight:700;
  color:var(--mobilea88d4-tan);white-space:nowrap;
}
.mobilea88d4-goal__rail{
  margin-top:8px;height:8px;border-radius:99px;
  background:rgba(253,245,230,.10);overflow:hidden;
}
.mobilea88d4-goal__fill{
  height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--mobilea88d4-tan-deep),var(--mobilea88d4-tan));
}
.mobilea88d4-goal__note{margin:7px 0 0;font-size:11.5px;color:var(--mobilea88d4-cream-faint);line-height:1.5}

/* ---------------------------------------------------------------------
   14. RTP table
   --------------------------------------------------------------------- */
.mobilea88d4-table{
  margin-top:13px;border:1px solid var(--mobilea88d4-hair);
  border-radius:13px;overflow:hidden;background:var(--mobilea88d4-night-2);
}
.mobilea88d4-table__row{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:8px;align-items:center;
  padding:10px 12px;border-top:1px solid var(--mobilea88d4-hair);
}
.mobilea88d4-table__row:first-child{border-top:0;background:rgba(210,180,140,.10)}
.mobilea88d4-table__row--head{
  font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mobilea88d4-tan);
}
.mobilea88d4-table__cell{font-size:12.5px;color:var(--mobilea88d4-cream);line-height:1.4}
.mobilea88d4-table__cell--num{
  font-family:var(--mobilea88d4-font-head);font-weight:700;font-size:12.5px;
  color:var(--mobilea88d4-good);text-align:right;
}

/* ---------------------------------------------------------------------
   15. Glossary
   --------------------------------------------------------------------- */
.mobilea88d4-gloss{
  margin:13px 0 0;padding:0 2px;
  display:grid;gap:10px;
}
.mobilea88d4-gloss__item{
  padding:0 0 10px;border-bottom:1px solid var(--mobilea88d4-hair);
}
.mobilea88d4-gloss__item:last-child{border-bottom:0;padding-bottom:0}
.mobilea88d4-gloss__term{
  font-family:var(--mobilea88d4-font-head);font-size:13px;font-weight:700;
  color:var(--mobilea88d4-tan);
}
.mobilea88d4-gloss__def{margin:3px 0 0;font-size:12.5px;color:var(--mobilea88d4-cream-dim);line-height:1.55}

/* ---------------------------------------------------------------------
   16. Extended footer (brand > promotions > directory > disclaimer)
   --------------------------------------------------------------------- */
.mobilea88d4-xfooter{
  margin:30px -14px 0;padding:20px 16px 6px;
  background:#17172B;border-top:1px solid var(--mobilea88d4-line);
}
.mobilea88d4-xfooter__brand{display:flex;gap:10px;align-items:flex-start}
.mobilea88d4-xfooter__logo{
  width:40px;height:40px;flex:0 0 auto;border-radius:11px;
  border:1px solid var(--mobilea88d4-line);background:var(--mobilea88d4-night-3);
  object-fit:cover;
}
.mobilea88d4-xfooter__about{margin:0;font-size:12.5px;color:var(--mobilea88d4-cream-dim);line-height:1.58}
.mobilea88d4-xfooter__block{margin-top:18px}
.mobilea88d4-xfooter__label{
  font-family:var(--mobilea88d4-font-head);font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--mobilea88d4-tan);
  margin:0 0 9px;
}
.mobilea88d4-xpromo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mobilea88d4-xpromo__btn{
  display:flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;padding:9px 10px;border-radius:11px;
  border:1px solid var(--mobilea88d4-line);background:var(--mobilea88d4-night-2);
  font-size:11.5px;font-weight:600;color:var(--mobilea88d4-cream);line-height:1.3;
  text-align:center;
  transition:transform .15s ease,background .16s ease,border-color .16s ease;
}
.mobilea88d4-xpromo__btn:active{transform:scale(.96);background:var(--mobilea88d4-tan-soft);border-color:var(--mobilea88d4-tan)}
.mobilea88d4-xpromo__btn svg{width:14px;height:14px;flex:0 0 auto;color:var(--mobilea88d4-tan)}
.mobilea88d4-dir{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 10px}
.mobilea88d4-dir__link{
  display:flex;align-items:center;gap:7px;min-height:34px;
  font-size:12.5px;color:var(--mobilea88d4-cream-dim);
  border-bottom:1px dashed rgba(210,180,140,.18);
  transition:color .15s ease;
}
.mobilea88d4-dir__link:hover{color:var(--mobilea88d4-tan)}
.mobilea88d4-dir__link svg{width:12px;height:12px;flex:0 0 auto;color:var(--mobilea88d4-tan)}
.mobilea88d4-disclaim{
  margin:16px 0 0;padding:11px 12px;border-radius:11px;
  background:rgba(253,245,230,.05);border:1px solid var(--mobilea88d4-hair);
  font-size:11px;color:var(--mobilea88d4-cream-faint);line-height:1.55;
}

/* ---------------------------------------------------------------------
   17. Common footer (copyright only) + fixed bottom rail
   --------------------------------------------------------------------- */
.mobilea88d4-footer{
  padding:16px 0 10px;text-align:center;
  font-size:11.5px;color:var(--mobilea88d4-cream-faint);
}
.mobilea88d4-footer strong{color:var(--mobilea88d4-cream-dim);font-weight:600}

.mobilea88d4-bnav{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:430px;z-index:70;
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;
  height:calc(var(--mobilea88d4-bnav-h) + env(safe-area-inset-bottom,0px));
  padding:5px 5px calc(5px + env(safe-area-inset-bottom,0px));
  background:rgba(23,23,41,.96);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-top:1px solid var(--mobilea88d4-line);
}
.mobilea88d4-bnav__item{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  min-height:44px;border-radius:12px;
  color:var(--mobilea88d4-cream-faint);
  font-size:9.5px;font-weight:600;letter-spacing:.02em;
  text-decoration:none;
  transition:background .18s ease,color .18s ease;
}
.mobilea88d4-bnav__item:hover{text-decoration:none;color:var(--mobilea88d4-cream)}
.mobilea88d4-bnav__item:active{transform:scale(.94)}
.mobilea88d4-bnav__icon{width:22px;height:22px;transition:transform .18s ease}
.mobilea88d4-bnav__label{
  line-height:1;transition:transform .2s ease,opacity .2s ease,font-weight .2s ease;
}
.mobilea88d4-bnav__item--on{
  background:var(--mobilea88d4-tan);color:#1A1A2E;
}
.mobilea88d4-bnav__item--on .mobilea88d4-bnav__label{
  transform:translateY(-1px);font-weight:800;
}
.mobilea88d4-bnav__item--on .mobilea88d4-bnav__icon{transform:scale(1.06)}
.mobilea88d4-bnav__badge{
  position:absolute;top:5px;right:calc(50% - 21px);
  width:7px;height:7px;border-radius:99px;
  background:var(--mobilea88d4-good);
  border:2px solid #17172B;
}

/* ---------------------------------------------------------------------
   18. Reveal-on-scroll helper
   --------------------------------------------------------------------- */
.mobilea88d4-reveal{opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}
.mobilea88d4-reveal--in{opacity:1;transform:none}

/* ---------------------------------------------------------------------
   19. Width refinements inside the 320–430px band
   --------------------------------------------------------------------- */
@media (min-width:360px){
  .mobilea88d4-xpromo__btn{font-size:12px}
}
@media (min-width:380px){
  .mobilea88d4-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:400px){
  .mobilea88d4-grid{gap:11px 10px}
  .mobilea88d4-slide img{height:182px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .mobilea88d4-reveal{opacity:1;transform:none}
}