/* Rumble Dug website — "Carnival Arcade Neon" (games, detail, about, app, help) and "Heritage Veranda" (home).
   Fonts (SIL OFL 1.1, self-hosted in /site/fonts): Outfit (display), Plus Jakarta Sans (body), Cinzel (veranda
   headings), Baloo Thambi 2 (Tamil). No third-party requests. */
@font-face{font-family:"Outfit";src:url(/site/fonts/outfit.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(/site/fonts/plus-jakarta-sans.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cinzel";src:url(/site/fonts/cinzel.woff2) format("woff2");font-weight:600 800;font-style:normal;font-display:swap}
@font-face{font-family:"Baloo Thambi 2";src:url(/site/fonts/baloo-thambi-2.woff2) format("woff2");font-weight:500 800;font-style:normal;font-display:swap}

:root{
  --bg:#0b111e;--bg-deep:#080d19;--card:#111c2e;--card-2:#16233b;--card-3:#1e293b;--line:#1e293b;--line-soft:#ffffff12;
  --text:#e8edf8;--muted:#a3b1c8;--dim:#64748b;
  --lime:#48d926;--lime-hi:#79ff57;--lime-lo:#22c55e;--lime-lip:#166534;
  --sun:#ffae00;--sun-hi:#ffd395;--sun-lo:#f97316;--sun-lip:#9a3412;
  --sky:#00b4ff;--sky-hi:#89ceff;--sky-lo:#0284c7;--sky-lip:#075985;
  --red:#ff3b30;--red-hi:#ff8b7a;
  --terracotta:#ea580c;--brass:#f59e0b;
  --radius:24px;--radius-sm:16px;--gutter:16px;--max:1200px;--top:72px;
  --display:"Outfit","Baloo Thambi 2",system-ui,sans-serif;
  --body:"Plus Jakarta Sans","Baloo Thambi 2",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Cinzel","Baloo Thambi 2",Georgia,serif;
  --tamil:"Baloo Thambi 2","Noto Sans Tamil","Latha",sans-serif;
  color-scheme:dark;
}
@media (min-width:700px){:root{--gutter:28px}}
@media (min-width:1100px){:root{--gutter:40px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--top) + 16px);background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:400 16px/1.65 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.theme-veranda{--bg:#080d19;--lime:#22c55e;--lime-hi:#4ade80;--lime-lo:#16a34a;background:var(--bg)}
[lang="ta"]{font-family:var(--tamil)}
img,svg{display:block;max-width:100%}
a{color:var(--sky-hi);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:#fff}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:800;line-height:1.1;letter-spacing:-.015em;text-wrap:balance}
h1 [lang="ta"],h2 [lang="ta"],h3 [lang="ta"],h1[lang="ta"],h2[lang="ta"]{font-family:var(--tamil);letter-spacing:0}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
kbd{font:700 13px/1 var(--display)}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:10px}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:900px}
.center{text-align:center}
.muted{color:var(--muted)}
.small{font-size:13px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:12px;background:var(--sun);color:#1a0f00;font-weight:800;text-decoration:none}
.skip:focus{top:12px}
.i{width:20px;height:20px;flex:none}
.sep{margin:0 6px;color:var(--dim)}

/* Language: both languages are in the HTML; the inactive one is hidden. */
html[data-lang="en"] .l-ta,html[data-lang="ta"] .l-en{display:none}
html[data-lang="ta"] body{line-height:1.75}

/* ——— Header ——— */
.topbar{position:fixed;inset:0 0 auto;z-index:50;background:#080d19e6;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid #ffae0022;box-shadow:0 4px 30px #000a}
.topbar-inner{display:flex;align-items:center;gap:16px;height:var(--top);max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.brandmark{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;margin-right:auto}
.brand-orb{display:grid;place-items:center;padding:2px;border-radius:14px;background:linear-gradient(135deg,#ffae0055,#ea580c33,#48d92633)}
.brand-orb img{width:38px;height:38px;border-radius:12px}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text b{font:800 18px/1.1 var(--display);letter-spacing:.06em}
.brand-text small{font-size:11px;color:var(--muted);font-weight:600}
.nav{display:none;gap:2px;padding:5px;border-radius:18px;background:#0d1424;border:1px solid #ffae001a}
.nav a{padding:8px 14px;border-radius:12px;color:var(--muted);font:600 14px/1.2 var(--display);text-decoration:none;white-space:nowrap}
.nav a:hover{color:var(--sun);background:#16233b}
.nav a[aria-current="page"]{color:var(--sun);background:#ffae001f;box-shadow:inset 0 0 0 1px #ffae0040,0 0 14px #ffae0026}
@media (min-width:1060px){.nav{display:flex}.brandmark{margin-right:0}.nav{margin:0 auto}}
.top-actions{display:flex;align-items:center;gap:10px}
.lang-toggle{display:flex;align-items:center;padding:3px;border-radius:999px;border:1px solid #ffae0033;background:#121a2d;cursor:pointer}
.lang-toggle span{padding:4px 10px;border-radius:999px;font:700 12px/1.2 var(--display);color:var(--muted)}
.lang-toggle .lt-ta{font-family:var(--tamil)}
html[data-lang="ta"] .lang-toggle .lt-ta,html[data-lang="en"] .lang-toggle .lt-en{background:var(--sun);color:#442b00}
.lang-toggle:hover{border-color:#ffae0080}
.top-actions .top-play{display:none}
@media (min-width:560px){.top-actions .top-play{display:inline-flex}}
@media (max-width:420px){.brand-text small{display:none}.brand-text b{font-size:16px}}
@media (max-width:560px){.pill-soft,.pill-sep{display:none}}
.menu-toggle{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:#121a2d;color:var(--text);cursor:pointer}
.bars{display:grid;gap:4px}.bars i{display:block;width:18px;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] .bars i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .bars i:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .bars i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media (min-width:1060px){.menu-toggle{display:none}}
.mobile-nav{display:grid;gap:4px;padding:12px var(--gutter) 20px;border-top:1px solid var(--line);background:#080d19f7}
.mobile-nav[hidden]{display:none}
.mobile-nav a:not(.btn){padding:12px 14px;border-radius:12px;color:var(--text);font:600 17px/1.2 var(--display);text-decoration:none}
.mobile-nav a[aria-current="page"]{color:var(--sun);background:#ffae001a}
.mobile-nav .btn{margin-top:8px}
@media (min-width:1060px){.mobile-nav{display:none!important}}
.page-top{padding-top:calc(var(--top) + 8px)}
main#main:not(.page-top){padding-top:var(--top)}

/* ——— Buttons: tactile arcade extrusion ——— */
.btn{--c1:var(--lime-hi);--c2:var(--lime);--c3:var(--lime-lo);--lip:var(--lime-lip);--glow:#48d92659;--fg:#052e16;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 22px;border:0;border-radius:18px;background:linear-gradient(180deg,var(--c1),var(--c2) 45%,var(--c3));color:var(--fg);font:800 16px/1.15 var(--display);letter-spacing:.01em;text-decoration:none;text-align:center;cursor:pointer;box-shadow:inset 0 2px 0 #ffffff59,0 5px 0 var(--lip),0 12px 22px var(--glow);transition:transform .12s,box-shadow .12s,filter .15s;-webkit-tap-highlight-color:transparent}
.btn:hover{color:var(--fg);filter:brightness(1.07) saturate(1.08);transform:translateY(-1px)}
.btn:active{transform:translateY(4px);box-shadow:inset 0 2px 0 #ffffff40,0 1px 0 var(--lip),0 4px 10px var(--glow)}
.btn .i{width:22px;height:22px}
.btn-sun{--c1:#ffcf5a;--c2:var(--sun);--c3:var(--sun-lo);--lip:var(--sun-lip);--glow:#f9731659;--fg:#2b1400}
.theme-veranda .btn-sun{--c1:#fbbf24;--c2:var(--brass);--c3:var(--terracotta);--lip:#7c2d12;--fg:#fff;text-shadow:0 1px 0 #7c2d12}
.btn-sky{--c1:var(--sky-hi);--c2:var(--sky);--c3:var(--sky-lo);--lip:var(--sky-lip);--glow:#00b4ff4d;--fg:#00202f}
.btn-ghost{--fg:var(--text);background:#1e293b;box-shadow:inset 0 0 0 1.5px #00b4ff66,0 4px 0 #0b1322;color:var(--text)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--sky),0 4px 0 #0b1322,0 0 18px #00b4ff55;color:#fff}
.btn-small{min-height:40px;padding:8px 16px;font-size:14px;border-radius:14px}
.btn-small .i{width:18px;height:18px}
.btn-big{min-height:56px;padding:14px 28px;font-size:18px}
.btn-block{width:100%}
.btn.is-soon{cursor:not-allowed;filter:saturate(.35) brightness(.8);transform:none}
.soon-wrap{position:relative;display:inline-flex}
.soon{position:absolute;top:-10px;right:-6px;padding:2px 9px;border-radius:999px;background:var(--red);color:#fff;font:800 11px/1.5 var(--display);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 3px 10px #0008;transform:rotate(4deg)}
.link-more{display:inline-flex;align-items:center;gap:6px;color:var(--lime-hi);font:700 15px/1.2 var(--display);text-decoration:none}
.link-more:hover{color:#fff}

/* ——— Pills, chips, badges ——— */
.pill{display:inline-flex;align-items:center;gap:10px;padding:7px 16px;border-radius:999px;background:#121a2d;border:1px solid #ffae004d;box-shadow:0 0 24px #ffae0026;font:700 12px/1.3 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--sun)}
html[data-lang="ta"] .pill{letter-spacing:.02em;text-transform:none;font-size:13px}
.pill-soft{color:var(--muted);letter-spacing:.02em;text-transform:none}
.pill-sep{width:5px;height:5px;border-radius:50%;background:var(--dim)}
.led{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime);animation:pulse 1.8s ease-in-out infinite}
.led-sun{background:var(--sun);box-shadow:0 0 10px var(--sun)}
@keyframes pulse{50%{opacity:.45;transform:scale(.8)}}
.eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--lime-hi);font:800 12px/1.4 var(--display);letter-spacing:.14em;text-transform:uppercase}
.eyebrow::before{content:"";width:18px;height:2px;border-radius:2px;background:currentColor;box-shadow:0 0 8px currentColor}
.eyebrow-sun{color:var(--sun)}
html[data-lang="ta"] .eyebrow{letter-spacing:.02em;text-transform:none;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;background:#111c2ed9;border:1.5px solid #00b4ff55;color:var(--sky-hi);font:700 12px/1.4 var(--display)}
.chip .i{width:15px;height:15px}
.chip-online{border-color:#48d92666;color:var(--lime-hi)}
.chip-local{border-color:#ffae0066;color:var(--sun-hi)}
.chip-career,.chip-solo,.chip-timetrial{border-color:#ff8b7a66;color:var(--red-hi)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;background:#0b111ee6;border:1.5px solid #48d92699;color:var(--lime-hi);font:800 11px/1.4 var(--display);letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 14px #48d92640}
.badge .led{width:7px;height:7px}
.cat{display:inline-block;color:var(--sun);font:800 11px/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase;font-style:normal}
html[data-lang="ta"] .cat{letter-spacing:0;text-transform:none;font-size:12px}
.cat-sport{color:var(--lime-hi)}.cat-skill{color:var(--sky-hi)}.cat-racing{color:var(--red-hi)}.cat-board{color:var(--sun)}.cat-festival{color:#ffb86b}
.pill-live{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;background:#48d9261a;border:1px solid #48d92640;color:var(--lime-hi);font:700 12px/1.4 var(--display)}
.pill-sun{background:#ffae001a;border-color:#ffae0040;color:var(--sun)}

/* Accent helper */
.accent-lime{--a:var(--lime);--a-hi:var(--lime-hi)}
.accent-orange{--a:var(--sun);--a-hi:var(--sun-hi)}
.accent-blue{--a:var(--sky);--a-hi:var(--sky-hi)}
.accent-red{--a:var(--red);--a-hi:var(--red-hi)}

/* ——— Headings & sections ——— */
.section{position:relative;padding:72px 0}
.section-tight{padding:40px 0}
.section-alt{background:linear-gradient(180deg,#0d1424,#0b111e);border-block:1px solid var(--line)}
.theme-veranda .section-alt{background:linear-gradient(180deg,#0d1424,#080d19);border-color:#ffae0014}
.section-head{max-width:760px;margin:0 auto 40px;text-align:center}
.section-head.split{max-width:none;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;text-align:left}
.section-head.split>div{max-width:640px}
.section-head p:not(.eyebrow){margin-top:12px;color:var(--muted);font-size:17px}
.split-note{max-width:420px;color:var(--muted)}
.row-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin-bottom:24px}
.section-head h2,.h-lg{font-size:clamp(28px,4.4vw,44px)}
.h-md{font-size:clamp(24px,3.2vw,34px)}
.h-sm{font-size:clamp(19px,2.2vw,22px)}
.serif{font-family:var(--serif);font-weight:700;letter-spacing:.01em;text-transform:uppercase}
.serif [lang="ta"]{text-transform:none}
.display{font-size:clamp(38px,7vw,72px);font-weight:800;line-height:1.02;text-transform:uppercase;letter-spacing:-.02em}
.display em{font-style:normal;color:var(--lime-hi);text-shadow:0 0 30px #48d92666}
.display [lang="ta"]{text-transform:none;font-size:.72em;line-height:1.3}
.lead{color:var(--muted);font-size:clamp(16px,1.8vw,19px);line-height:1.65}
.sub-ta{margin-top:10px;color:var(--sun);font:700 clamp(18px,2.6vw,26px)/1.4 var(--tamil)}
.h-en{display:block}.h-ta{display:block;margin-top:8px;font-size:.62em;line-height:1.35}

/* ——— Heroes ——— */
.hero{position:relative;overflow:hidden;padding:48px 0 64px;background:#060913;border-bottom:1px solid #ffae0026}
.glows{position:absolute;inset:0;pointer-events:none}
.glow{position:absolute;width:560px;height:560px;border-radius:50%;filter:blur(120px);opacity:.22}
.g-terracotta{background:var(--terracotta);top:-160px;left:12%}
.g-brass{background:var(--brass);top:30%;right:-160px;opacity:.16}
.g-green{background:var(--lime);bottom:-220px;left:-140px;opacity:.12}
.g-blue{background:var(--sky);top:-120px;right:8%;opacity:.14}
.kolam{position:absolute;inset:0;opacity:.09;pointer-events:none;color:var(--sun);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cg fill='none' stroke='%23fbbf24' stroke-width='.8'%3E%3Cpath d='M32 8C20 8 8 20 8 32s12 24 24 24 24-12 24-24S44 8 32 8z'/%3E%3Cpath stroke-dasharray='2 3' stroke-width='.5' d='M0 32Q32 0 64 32Q32 64 0 32z'/%3E%3C/g%3E%3Cg fill='%23fbbf24'%3E%3Ccircle cx='32' cy='32' r='1.5'/%3E%3Ccircle cx='0' cy='0' r='1.5'/%3E%3Ccircle cx='64' cy='0' r='1.5'/%3E%3Ccircle cx='0' cy='64' r='1.5'/%3E%3Ccircle cx='64' cy='64' r='1.5'/%3E%3C/g%3E%3C/svg%3E");-webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 40%,#000 30%,transparent 75%)}
.hero-center{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.hero-center .lead{max-width:720px}
.hero-logo{width:min(70vw,340px);height:auto;filter:drop-shadow(0 14px 34px #ea580c66);animation:bob 6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
.hero-veranda h1{max-width:960px;font-size:clamp(32px,6vw,62px);line-height:1.12}
.hero-veranda .h-ta{background:linear-gradient(90deg,#fbbf24,#fcd34d,var(--terracotta));-webkit-background-clip:text;background-clip:text;color:transparent;font-size:.66em}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 18px}
.facts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;margin-top:4px}
.facts li{display:flex;align-items:baseline;gap:6px;padding:7px 14px;border-radius:12px;background:#121a2dcc;border:1px solid #ffae0026;color:var(--muted);font:600 13px/1.3 var(--display)}
.facts b{color:var(--sun);font-size:17px}

/* ——— Filters ——— */
.filters{display:flex;flex-wrap:wrap;gap:6px;padding:5px;border-radius:18px;background:#0d1424;border:1px solid var(--line)}
.filter{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:0;border-radius:13px;background:transparent;color:var(--muted);font:700 13px/1.2 var(--display);cursor:pointer}
.filter b{padding:1px 7px;border-radius:999px;background:#1e293b;color:var(--text);font-size:11px}
.filter:hover{color:var(--text);background:#16233b}
.filter.is-on{background:var(--lime);color:#052e16;box-shadow:0 0 14px #48d92659}
.filter.is-on b{background:#052e1633;color:#052e16}
.theme-veranda .filters{border-color:#ffae001f}
.theme-veranda .filter.is-on{background:#fbbf24;color:#451a03;box-shadow:0 0 14px #fbbf2459}
.theme-veranda .filter.is-on b{background:#451a0322;color:#451a03}
[data-filter-list] .is-hidden{display:none!important}

/* ——— Art (artwork or icon tile) ——— */
.art-img{width:100%;height:100%;object-fit:cover}
.art-tile{position:relative;display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--a,var(--lime)) 26%,transparent),transparent 62%),repeating-linear-gradient(45deg,#ffffff05 0 12px,transparent 12px 24px),#0f1829;overflow:hidden}
.art-tile img{position:relative;width:34%;max-width:120px;height:auto;filter:drop-shadow(0 8px 20px #000a)}
.art-ring{position:absolute;width:58%;aspect-ratio:1;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--a,var(--lime)) 55%,transparent);box-shadow:0 0 0 14px color-mix(in srgb,var(--a,var(--lime)) 8%,transparent)}

/* ——— Home: legends ——— */
.legends{display:grid;gap:20px}
@media (min-width:900px){.legends{grid-template-columns:1fr 1fr}}
.legend{display:grid;grid-template-columns:1fr;overflow:hidden;border-radius:var(--radius);background:linear-gradient(160deg,#121a2d,#0d1424);border:1px solid #ffae001f;box-shadow:0 18px 40px #0008;transition:border-color .2s,box-shadow .2s,transform .2s}
.legend:hover{border-color:#ffae0066;box-shadow:0 18px 40px #0008,0 0 24px #ea580c33;transform:translateY(-2px)}
@media (min-width:560px){.legend{grid-template-columns:42% 1fr}}
.legend-art{position:relative;display:block;min-height:200px;aspect-ratio:16/10;overflow:hidden}
@media (min-width:560px){.legend-art{aspect-ratio:auto}}
.legend-art .art-img{position:absolute;inset:0;transition:transform .5s}
.legend:hover .legend-art .art-img{transform:scale(1.05)}
.legend-art .badge{position:absolute;left:12px;top:12px}
.legend-body{display:flex;flex-direction:column;gap:10px;padding:20px}
.legend h3{font-size:24px}
.legend h3 a{color:var(--text);text-decoration:none}
.legend h3 a:hover{color:var(--sun)}
.name-ta{color:var(--sun);font-family:var(--tamil);font-size:.8em;font-weight:700}
.legend-tag{color:var(--sun-hi);font:600 15px/1.4 var(--display)}
.legend-card{color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.legend-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:6px}

/* ——— Home: steps, styles, devices, lore ——— */
.scrolls{display:grid;gap:18px}
@media (min-width:820px){.scrolls{grid-template-columns:repeat(3,1fr)}}
.scroll{position:relative;padding:28px 24px;border-radius:var(--radius);background:#0d1424;border:1px solid #ffae001f;text-align:center}
.scroll-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 12px;border-radius:18px;background:#ffae001a;border:1px solid #ffae0040;color:var(--sun);font:800 26px/1 var(--tamil)}
.scroll-icon .i{width:26px;height:26px}
.scroll-no{display:inline-block;margin-bottom:8px;padding:2px 10px;border-radius:999px;background:#ffae001a;color:var(--sun);font:800 11px/1.6 var(--serif);letter-spacing:.14em;text-transform:uppercase}
.scroll h3{font-size:20px;margin-bottom:8px}
.scroll p{color:var(--muted);font-size:15px}
.styles{display:grid;gap:16px}
@media (min-width:640px){.styles{grid-template-columns:1fr 1fr}}
@media (min-width:1020px){.styles{grid-template-columns:repeat(4,1fr)}}
.style{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px 20px;border-radius:var(--radius);background:#0d1424;border:1px solid var(--line);border-top:3px solid var(--a)}
.style-tag{align-self:flex-end;padding:2px 9px;border-radius:8px;background:color-mix(in srgb,var(--a) 16%,transparent);color:var(--a-hi);font:800 10px/1.6 var(--display);letter-spacing:.1em;text-transform:uppercase}
.style-i{width:30px;height:30px;color:var(--a-hi)}
.style h3{font-size:19px}
.style p{color:var(--muted);font-size:14px}
.style-games{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);font-size:13px!important;line-height:1.7}
.style-games .sep{display:none}
.style-games a{color:var(--text);text-decoration:none;font-weight:600}
.style-games a:hover{color:var(--a-hi)}
.style-games .name-ta{display:none}
.devices{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:0;max-width:760px;margin:0 auto;padding-bottom:10px}
.laptop{width:78%}
.laptop-screen{position:relative;aspect-ratio:16/10;padding:10px;border-radius:18px 18px 4px 4px;background:#0d1424;border:2px solid #334155;overflow:hidden;box-shadow:0 0 40px #ffae0022}
.laptop-screen img{width:100%;height:100%;object-fit:cover;border-radius:10px}
.laptop-base{height:14px;margin:0 -6%;border-radius:0 0 18px 18px;background:linear-gradient(#334155,#1e293b)}
.phone{position:relative;width:24%;min-width:118px;margin-left:-8%;z-index:1}
.phone-screen{position:relative;aspect-ratio:9/18.5;padding:8px;border-radius:26px;background:#0d1424;border:3px solid #475569;overflow:hidden;box-shadow:0 20px 50px #000c,0 0 30px #00b4ff33}
.phone-screen>img{width:100%;height:100%;object-fit:cover;border-radius:18px}
.screen-chip{position:absolute;left:18px;bottom:18px;padding:3px 10px;border-radius:999px;background:#0b111ee6;border:1px solid #48d92666;color:var(--lime-hi);font:700 11px/1.5 var(--display)}
.chip-sun{left:14px;bottom:16px;border-color:#ffae0066;color:var(--sun)}
.lore{position:relative;max-width:860px;margin:0 auto;padding:40px 28px;border-radius:var(--radius);background:linear-gradient(135deg,#121a2d,#0d1424);border:1px solid #ffae0026;text-align:center}
.lore-mark{display:grid;place-items:center;width:64px;height:64px;margin:-72px auto 16px;border-radius:50%;background:#080d19;border:1px solid #ffae004d;color:var(--sun)}
.lore-mark .i{width:34px;height:34px}
.lore blockquote{margin:0}
.lore blockquote p{font:600 clamp(19px,2.6vw,26px)/1.45 var(--display);color:var(--text)}
.lore figcaption{margin-top:16px;color:var(--muted);font-size:14px}

/* ——— CTA band & footer ——— */
.cta-band{position:relative;padding:72px 0;overflow:hidden}
.cta-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;padding:44px 24px;border-radius:32px;background:radial-gradient(circle at 20% 0,#ea580c33,transparent 55%),radial-gradient(circle at 90% 100%,#48d92626,transparent 55%),#0d1424;border:1px solid #ffae0033;text-align:center}
.cta-inner h2{font-size:clamp(26px,4vw,40px)}
.cta-inner p:not(.eyebrow){max-width:620px;color:var(--muted)}
.cta-row-inner{flex-direction:row;flex-wrap:wrap;justify-content:space-between;text-align:left}
.cta-row-inner p{margin-top:6px}
.footer{padding:48px 0 28px;background:#060913;border-top:1px solid var(--line)}
.footer-grid{display:grid;gap:28px}
@media (min-width:760px){.footer-grid{grid-template-columns:1.6fr 1fr 1fr 1.2fr}}
.footer-brand p{margin-top:12px;color:var(--muted);font-size:14px;max-width:340px}
.footer-facts{display:flex;flex-wrap:wrap;gap:8px}
.footer-col{display:flex;flex-direction:column;gap:8px;font-size:14px}
.footer-col h2{margin-bottom:4px;color:var(--lime-hi);font:800 13px/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase}
.footer-col a{color:var(--muted);text-decoration:none}
.footer-col a:hover{color:#fff}
.footer-col p{color:var(--muted)}
.placeholder{color:var(--dim);font-style:italic}
.footer-small{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;margin-top:32px;padding-top:20px;border-top:1px solid var(--line);color:var(--dim);font-size:12px}
.footer-small a{color:var(--muted)}

/* ——— Games catalogue ——— */
.spotlight{display:grid;gap:20px}
@media (min-width:900px){.spotlight{grid-template-columns:1fr 1fr}}
.spot{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:28px;background:#111c2e;border:1px solid var(--line);box-shadow:0 18px 40px #0009;transition:box-shadow .2s,border-color .2s}
.spot:hover{border-color:color-mix(in srgb,var(--a) 60%,transparent);box-shadow:0 18px 40px #0009,0 0 24px color-mix(in srgb,var(--a) 35%,transparent)}
.spot-art{display:block;aspect-ratio:16/8;overflow:hidden}
.spot-art .art-img{transition:transform .5s}
.spot:hover .art-img{transform:scale(1.04)}
.spot-body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px}
.spot h3{font-size:26px}
.spot h3 a{color:var(--text);text-decoration:none}
.spot p{color:var(--muted);font-size:15px}
.spot-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.catalog-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}
.catalog-head h1{font-size:clamp(36px,6vw,58px)}
.catalog-head .h-en,.catalog-head .h-ta{display:inline}
.catalog-head .h-ta{margin-left:10px;color:var(--lime-hi);font-size:.55em}
.catalog-head .lead{max-width:640px;margin-top:10px}
.stat-chips{display:flex;gap:10px}
.stat-chips li{display:flex;flex-direction:column;padding:10px 16px;border-radius:16px;background:#111c2e;border:1px solid var(--line);min-width:96px}
.stat-chips span{color:var(--muted);font:700 11px/1.3 var(--display);letter-spacing:.08em;text-transform:uppercase}
.stat-chips b{color:var(--lime-hi);font:800 24px/1.2 var(--display)}
.toolbar{position:sticky;top:calc(var(--top) + 8px);z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:22px;padding:8px;border-radius:22px;background:#0b111ee6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line)}
.toolbar .filters{border:0;background:transparent;padding:0}
.search{display:flex;align-items:center;gap:8px;flex:1 1 220px;max-width:340px;padding:0 14px;border-radius:16px;background:#080d19;border:1px solid var(--line);box-shadow:inset 0 2px 4px #0008;color:var(--dim)}
.search:focus-within{border-color:var(--sky);box-shadow:0 0 12px #00b4ff66}
.search input{flex:1;min-width:0;height:42px;border:0;outline:0;background:transparent;color:#f8fafc;font:500 15px var(--body)}
.search input::placeholder{color:var(--dim)}
.search-big{max-width:620px;width:100%;flex:none}
.search-big input{height:54px;font-size:16px}
.grid{display:grid;gap:18px}
@media (min-width:600px){.grid{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1180px){.grid-4{grid-template-columns:repeat(4,1fr)}}
.gcard{position:relative;display:flex;flex-direction:column;gap:8px;padding:12px 12px 16px;border-radius:var(--radius);background:#16233b;border:1.5px solid var(--line);box-shadow:0 8px 24px -4px #0009;transition:transform .2s,box-shadow .2s,border-color .2s}
.gcard:hover{transform:translateY(-3px) rotate(-.4deg);border-color:color-mix(in srgb,var(--a) 70%,transparent);box-shadow:0 8px 24px -4px #0009,0 0 16px color-mix(in srgb,var(--a) 45%,transparent)}
.gcard-art{display:block;aspect-ratio:16/10;border-radius:18px;overflow:hidden;border:1px solid color-mix(in srgb,var(--a) 30%,transparent)}
.gcard-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;margin-top:4px;padding:0 4px}
.gcard h3{padding:0 4px;font-size:21px}
.gcard h3 a{color:var(--text);text-decoration:none}
.gcard h3 a:hover{color:var(--a-hi)}
.gcard p{padding:0 4px;color:var(--muted);font-size:14px}
.gcard-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:auto;font:600 12px/1.4 var(--display)!important;color:var(--sky-hi)!important}
.gcard-meta .i{width:16px;height:16px}
.gcard .btn{margin-top:6px}
.empty{padding:40px 0;text-align:center;color:var(--muted)}
.room-band{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px 20px;margin-top:40px;padding:22px 24px;border-radius:var(--radius);background:linear-gradient(90deg,#00b4ff14,#111c2e);border:1px solid #00b4ff40}
.room-band p{color:var(--muted);font-size:15px;margin-top:4px}
.room-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#00b4ff1f;color:var(--sky-hi)}
.room-icon .i{width:28px;height:28px}
.code-demo{display:flex;gap:6px;grid-column:1/-1}
@media (min-width:820px){.room-band{grid-template-columns:auto 1fr auto}.code-demo{grid-column:auto}}
.code-demo span{display:grid;place-items:center;width:36px;height:44px;border-radius:10px;background:#080d19;border:1.5px solid #00b4ff66;color:var(--sky-hi);font:800 20px/1 var(--display);box-shadow:inset 0 2px 4px #0008}
.code-big{justify-content:center}
.code-big span{width:clamp(40px,11vw,60px);height:clamp(52px,13vw,72px);font-size:clamp(24px,6vw,34px);border-color:#48d92680;color:var(--lime-hi)}
.suggest{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;padding:28px 24px;border-radius:var(--radius);background:radial-gradient(circle at 100% 0,#48d9261f,transparent 55%),#111c2e;border:1px solid var(--line)}
.suggest>div{max-width:640px}
.suggest p:not(.eyebrow){color:var(--muted);margin-top:8px}
.suggest-contact{font:700 16px/1.4 var(--display)}

/* ——— Game detail ——— */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:14px 0 16px;font:600 13px/1.4 var(--display);color:var(--dim)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--lime-hi)}
.crumbs [aria-current]{color:var(--text)}
.crumbs .name-ta{font-size:1em}
.ghero{position:relative;display:grid;min-height:min(62vh,560px);overflow:hidden;border-radius:32px;border:1px solid var(--line);background:#0d1424;box-shadow:0 24px 60px #000a}
.ghero-art{position:absolute;inset:0}
.ghero-art .art-tile{height:58%}
.ghero-art .art-tile img{width:30%;max-width:170px}
.ghero-art .art-tile .art-ring{width:auto;height:74%}
@media (min-width:760px){.ghero-art .art-tile{width:48%;height:100%;margin-left:auto;-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%);mask-image:linear-gradient(90deg,transparent,#000 30%)}.ghero-art .art-tile img{width:34%}.ghero-art .art-tile .art-ring{height:62%}}
.ghero-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0b111e00 20%,#0b111ecc 62%,#0b111e 100%),linear-gradient(90deg,#0b111ecc,#0b111e00 70%)}
.ghero-body{position:relative;align-self:end;display:flex;flex-direction:column;gap:14px;padding:28px 22px;max-width:760px}
@media (min-width:700px){.ghero-body{padding:40px}}
.ghero h1{font-size:clamp(40px,7vw,76px);text-transform:uppercase;letter-spacing:-.02em;text-shadow:0 4px 24px #000}
.ghero h1 .name-ta{display:inline-block;font-size:.6em;text-transform:none;color:var(--lime-hi)}
.ghero .lead{color:#dbe4f3;text-shadow:0 2px 12px #000}
.ghero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.chip-cat{border-color:#ffae0066}
.modes{display:grid;gap:16px}
@media (min-width:700px){.modes{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.mode{padding:22px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line);border-top:3px solid var(--lime)}
.mode .i{width:30px;height:30px;color:var(--lime-hi);margin-bottom:10px}
.mode h3{font-size:19px;margin-bottom:6px}
.mode p{color:var(--muted);font-size:15px}
.steps{display:grid;gap:16px}
@media (min-width:640px){.steps{grid-template-columns:1fr 1fr}}
@media (min-width:1060px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{position:relative;padding:22px 20px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line)}
.step-no{display:inline-grid;place-items:center;width:44px;height:44px;margin-bottom:12px;border-radius:14px;background:color-mix(in srgb,var(--a) 18%,transparent);border:1.5px solid color-mix(in srgb,var(--a) 55%,transparent);color:var(--a-hi);font:800 17px/1 var(--display)}
.step h3{font-size:18px;margin-bottom:6px}
.step p{color:var(--muted);font-size:14px}
.controls{display:grid;gap:18px}
@media (min-width:820px){.controls{grid-template-columns:1fr 1fr}}
.panel{padding:24px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line);box-shadow:inset 0 1px 0 #ffffff0f}
.panel>h3{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-size:19px}
.panel>h3 .i{width:24px;height:24px;color:var(--sun)}
.ctl-list{display:grid;gap:10px}
.ctl-list li{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border-radius:14px;background:#0b111e;border:1px solid var(--line);font-size:15px}
.ctl-list .i{margin-top:2px;color:var(--lime-hi)}
.keys{display:flex;flex-wrap:wrap;gap:4px;flex:none;min-width:92px}
kbd{display:inline-grid;place-items:center;min-width:30px;height:30px;padding:0 7px;border-radius:9px;background:linear-gradient(#2a3650,#1e293b);border:1px solid #475569;box-shadow:0 3px 0 #0b1322;color:#fff}
.heritage{display:grid;gap:24px}
@media (min-width:900px){.heritage{grid-template-columns:1.4fr 1fr;align-items:start}}
.heritage-text{margin-top:12px;color:#cdd6e6;font-size:17px;line-height:1.75}
.adapt{border-color:#ffae0033}
.adapt h3{margin-bottom:10px;color:var(--sun);font-size:18px}
.adapt p{color:var(--muted)}
.adapt p+p{margin-top:12px}

/* ——— About ——— */
.hero-about,.hero-help{padding:56px 0 64px}
.stat-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;width:100%;max-width:820px;margin-top:10px}
@media (min-width:700px){.stat-tiles{grid-template-columns:repeat(4,1fr)}}
.stat-tiles li{display:flex;flex-direction:column;align-items:center;gap:2px;padding:16px 10px;border-radius:18px;background:#111c2e;border:1px solid var(--line)}
.stat-tiles b{color:var(--a-hi);font:800 34px/1.1 var(--display);text-shadow:0 0 18px color-mix(in srgb,var(--a) 50%,transparent)}
.stat-tiles span{color:var(--muted);font:700 11px/1.3 var(--display);letter-spacing:.1em;text-transform:uppercase}
html[data-lang="ta"] .stat-tiles span{letter-spacing:0;text-transform:none;font-size:13px}
.mandate{display:grid;gap:32px}
@media (min-width:960px){.mandate{grid-template-columns:1fr 1fr;align-items:center}}
.mandate-copy{display:flex;flex-direction:column;gap:14px}
.mandate-copy>p{color:var(--muted)}
.note h3{margin-bottom:6px;font-size:17px;color:var(--sun)}
.note p{color:var(--muted);font-size:14px}
.ticks{display:flex;flex-direction:column;gap:8px}
.ticks li{display:flex;align-items:center;gap:8px;color:var(--text);font:600 14px/1.4 var(--display)}
.ticks li::before{content:"✓";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#48d92626;color:var(--lime-hi);font-size:12px;flex:none}
.ticks-row{flex-direction:row;flex-wrap:wrap;gap:8px 18px}
.mosaic{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:20px;border:1px solid var(--line);color:var(--text);text-decoration:none}
.tile-wide{grid-column:1/-1;aspect-ratio:16/7}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
a.tile:hover img{transform:scale(1.05)}
.tile-cap .cat{display:block;margin-bottom:2px}
.tile-cap{position:absolute;inset:auto 0 0;display:block;padding:26px 14px 12px;background:linear-gradient(transparent,#080d19ee);font:700 15px/1.3 var(--display)}
.groups{display:grid;gap:18px}
@media (min-width:760px){.groups{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}}
.group{padding:22px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line);border-top:3px solid var(--a)}
.group header{margin-bottom:14px}
.group header .i{width:28px;height:28px;color:var(--a-hi);margin-bottom:8px}
.group h3{font-size:20px}
.group header p{margin-top:6px;color:var(--muted);font-size:14px}
.group li{padding:10px 0;border-top:1px solid var(--line)}
.group li a{color:var(--text);font:700 15px/1.3 var(--display);text-decoration:none}
.group li a:hover{color:var(--a-hi)}
.group li>span{display:block;color:var(--muted);font-size:13px}
.tenets{display:grid;gap:16px}
@media (min-width:640px){.tenets{grid-template-columns:1fr 1fr}}
@media (min-width:1060px){.tenets{grid-template-columns:repeat(4,1fr)}}
.tenet{padding:24px 20px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line)}
.orb{display:grid;place-items:center;width:52px;height:52px;margin-bottom:14px;border-radius:16px;background:color-mix(in srgb,var(--a,var(--lime)) 18%,transparent);border:1px solid color-mix(in srgb,var(--a,var(--lime)) 45%,transparent);color:var(--a-hi,var(--lime-hi));box-shadow:0 0 18px color-mix(in srgb,var(--a,var(--lime)) 25%,transparent);flex:none}
.orb .i{width:26px;height:26px}
.orb-sun{--a:var(--sun);--a-hi:var(--sun-hi)}
.orb-sky{--a:var(--sky);--a-hi:var(--sky-hi)}
.tenet h3{font-size:18px;text-transform:uppercase;letter-spacing:.02em}
.tenet-ta{color:var(--a-hi);font-size:14px;margin:2px 0 8px}
html[data-lang="ta"] .tenet-ta{display:none}
.tenet p:last-child{color:var(--muted);font-size:14px}
.section-tamil{background:radial-gradient(circle at 0 0,#48d92614,transparent 45%),#0d1424;border-block:1px solid var(--line)}
.tamil{display:grid;gap:28px}
@media (min-width:900px){.tamil{grid-template-columns:1.5fr 1fr;align-items:center}}
.tamil-display{font:800 clamp(36px,5.6vw,64px)/1.2 var(--tamil);margin:6px 0 10px}
.tamil-display em{font-style:normal;color:var(--lime-hi)}
.tamil-sub{color:var(--sun);font:700 17px/1.4 var(--display);margin-bottom:12px}
.tamil p:last-child{color:var(--muted)}
.switcher h3{margin-bottom:8px;font-size:19px}
.switcher p{color:var(--muted);margin-bottom:16px;font-size:15px}
.variant{display:flex;flex-direction:column;align-items:center;gap:6px;padding:40px 24px;text-align:center}
.variant>p:not(.eyebrow):not(.sub-ta){color:var(--muted);max-width:620px;margin-top:6px}
.variant-contact{margin-top:14px;font:700 17px/1.4 var(--display)}

/* ——— Get the app ——— */
.app-hero{position:relative;display:grid;gap:36px;align-items:center}
@media (min-width:900px){.app-hero{grid-template-columns:1.3fr 1fr}}
.app-copy{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.app-copy .cta-row{justify-content:flex-start}
.app-copy .display [lang="ta"]{font-size:.8em}
.phone-hero{width:min(300px,78vw);min-width:0;margin:0 auto}
.phone-hero .phone-screen{display:flex;flex-direction:column;gap:10px;aspect-ratio:auto;padding:14px 12px;border-radius:34px}
.phone-hero .phone-screen>img{height:auto;aspect-ratio:16/10;border-radius:14px}
.ph-bar{display:flex;align-items:center;justify-content:space-between;font:800 14px/1.2 var(--display)}
.chip-mini{padding:2px 8px;border-radius:999px;background:#ffae001f;color:var(--sun);font-size:11px}
.ph-title{font:800 17px/1.2 var(--display)}
.ph-title span{color:var(--sun);font-size:.85em}
.ph-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ph-row span{display:flex;align-items:center;gap:6px;padding:8px;border-radius:12px;background:#111c2e;border:1px solid var(--line);font:700 12px/1.2 var(--display)}
.ph-row img{width:24px;height:24px}
.ph-btn{margin-top:auto;padding:10px;border-radius:14px;background:linear-gradient(var(--lime-hi),var(--lime-lo));color:#052e16;text-align:center;font:800 13px/1.2 var(--display);box-shadow:0 4px 0 var(--lime-lip)}
.ways{display:grid;gap:20px}
@media (min-width:900px){.ways{grid-template-columns:1fr 1fr}}
.way{display:flex;flex-direction:column;gap:16px;padding:26px;border-radius:28px;background:#111c2e;border:1px solid var(--line)}
.way-app{border-color:#ffae0033;background:radial-gradient(circle at 0 0,#ffae0014,transparent 50%),#111c2e}
.way-web{border-color:#48d92633;background:radial-gradient(circle at 100% 0,#48d92614,transparent 50%),#111c2e}
.way header{display:flex;align-items:center;gap:14px}
.way header .orb{margin:0}
.way h3{font-size:24px}
.way-sub{color:var(--sun);font:700 12px/1.4 var(--display);letter-spacing:.06em;text-transform:uppercase}
.way-web .way-sub{color:var(--lime-hi)}
.way>p{color:var(--muted)}
.feature-list{display:grid;gap:10px}
.feature-list li{display:flex;flex-direction:column;padding:12px 14px;border-radius:14px;background:#0b111e;border:1px solid var(--line)}
.feature-list b{font:700 15px/1.4 var(--display)}
.feature-list span{color:var(--muted);font-size:14px}
.browsers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.browsers li{padding:10px 4px;border-radius:12px;background:#0b111e;border:1px solid var(--line);text-align:center;font:700 13px/1.2 var(--display);color:var(--muted)}
.way-cta{margin-top:auto}
.room-steps{display:grid;gap:16px;margin-bottom:28px}
@media (min-width:820px){.room-steps{grid-template-columns:repeat(3,1fr)}}
.room-steps li{padding:26px 22px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line);text-align:center}
.num{display:inline-grid;place-items:center;width:52px;height:52px;margin-bottom:12px;border-radius:50%;background:color-mix(in srgb,var(--a) 20%,transparent);border:2px solid var(--a);color:var(--a-hi);font:800 22px/1 var(--display);box-shadow:0 0 18px color-mix(in srgb,var(--a) 40%,transparent)}
.room-steps h3{font-size:19px;margin-bottom:6px}
.room-steps p{color:var(--muted);font-size:14px}
.code-card{max-width:560px;margin:0 auto 20px;padding:24px;border-radius:28px;background:#0b111e;border:1px solid #48d92633;text-align:center}
.code-label{margin-bottom:14px;color:var(--sun);font:800 12px/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase}
.code-card .muted{margin-top:14px}
.req{display:grid;gap:18px;align-items:center;padding:24px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line)}
@media (min-width:820px){.req{grid-template-columns:auto 1fr auto}}
.req .orb{margin:0}
.req p{color:var(--muted);margin-top:4px}

/* ——— FAQ ——— */
.faq{display:grid;gap:10px}
.faq details{border-radius:18px;background:#111c2e;border:1px solid var(--line);transition:border-color .2s}
.faq details[open]{border-color:#48d92659}
.faq summary{display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer;list-style:none;font:700 16px/1.4 var(--display)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";margin-left:auto;width:10px;height:10px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s;flex:none}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq details>p{padding:0 18px 18px;color:var(--muted)}
.faq-numbered details>p{padding-left:62px}
.q-no{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#ffae001f;border:1px solid #ffae0066;color:var(--sun);font:800 13px/1 var(--display);flex:none}

/* ——— Help ——— */
.ticker{overflow:hidden;padding:7px 0;background:linear-gradient(90deg,#ffae00,#f97316);color:#2b1400;font:800 12px/1.4 var(--display);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.ticker span{display:inline-block;padding-left:100%;animation:ticker 28s linear infinite}
@keyframes ticker{to{transform:translateX(-100%)}}
.h-ta.sun{color:var(--sun)}
.hero-help .display{font-size:clamp(34px,6vw,64px);text-transform:none}
.quick{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;font:600 13px/1.3 var(--display);color:var(--muted)}
.quick a{padding:5px 12px;border-radius:999px;background:#111c2e;border:1px solid var(--line);color:var(--text);text-decoration:none}
.quick a:hover{border-color:var(--sun);color:var(--sun)}
.subjects{display:grid;gap:14px}
@media (min-width:640px){.subjects{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.subjects{grid-template-columns:repeat(3,1fr)}}
.subject a{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;padding:22px;border-radius:var(--radius);background:#111c2e;border:1px solid var(--line);color:var(--text);text-decoration:none;transition:border-color .2s,transform .2s}
.subject a:hover{border-color:#ffae0066;transform:translateY(-2px)}
.subject .orb{margin-bottom:6px}
.subject-no{position:absolute;top:18px;right:18px;color:var(--dim);font:700 11px/1.3 var(--display)}
.subject h3{font-size:19px}
.subject p{color:var(--muted);font-size:14px}
.oral{display:grid;gap:24px;align-items:center;padding:28px;border-radius:32px;background:linear-gradient(135deg,#1a1408,#111c2e);border:1px solid #ffae0033}
@media (min-width:900px){.oral{grid-template-columns:1fr 1.1fr;padding:40px}}
.oral-copy{display:flex;flex-direction:column;gap:14px}
.oral-copy h2{font-style:italic}
.oral-copy>p{color:var(--muted)}
.oral-img{width:100%;height:auto;border-radius:22px;box-shadow:0 18px 40px #000a}
.contact{display:grid;gap:24px;align-items:center;padding:28px;border-radius:32px;background:#111c2e;border:1px solid var(--line)}
@media (min-width:900px){.contact{grid-template-columns:1.2fr 1fr;padding:40px}}
.contact h2 + p{margin-top:10px;color:var(--muted)}
.contact-box{background:#0b111e}
.contact-label{color:var(--sun);font:800 12px/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase}
.contact-mail{margin:6px 0 10px;font:700 19px/1.4 var(--display);word-break:break-word}

/* ——— Privacy / docs ——— */
.doc{padding-bottom:72px}
.doc h1{margin:10px 0 6px;font-size:clamp(32px,5vw,46px)}
.doc h2{margin:30px 0 8px;font-size:22px;color:var(--sun)}
.doc p{color:#cdd6e6}
.doc .lead{margin:18px 0 8px}
.back-link{display:inline-block;margin-top:24px;color:var(--lime-hi);font-weight:700;text-decoration:none}

/* ——— Scroll reveal ——— */
.reveal-ready .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease var(--delay,0ms),transform .6s cubic-bezier(.2,.8,.2,1) var(--delay,0ms)}
.reveal-ready .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}