:root { --ink:#101611; --ink2:#1a211b; --cream:#f4f0e7; --red:#b6262e; --gold:#d3a24e; --green:#4f9b72; --muted:#9ca097; }
* { box-sizing:border-box; }
html,body { width:100%; min-height:100%; margin:0; }
body { overflow:hidden; color:var(--cream); background:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
button,a { -webkit-tap-highlight-color:transparent; }
button { font:inherit; }
.game-shell { height:100dvh; min-height:690px; display:flex; flex-direction:column; }
.topbar { position:relative; z-index:5; height:102px; flex:0 0 102px; display:grid; grid-template-columns:270px 1fr auto; align-items:center; gap:24px; padding:0 36px; border-bottom:1px solid rgba(244,240,231,.12); background:rgba(16,22,17,.97); }
.brand img { display:block; width:215px; max-height:74px; filter:brightness(0) invert(1); }
.edition { text-align:center; letter-spacing:.19em; }
.edition span { display:block; font-size:11px; font-weight:800; }
.edition small { display:block; margin-top:7px; color:#91968d; font-size:9px; letter-spacing:.13em; }
.top-actions { display:flex; align-items:center; gap:18px; }
.top-actions a { color:var(--cream); font-size:9px; font-weight:800; letter-spacing:.14em; text-decoration:none; text-transform:uppercase; border-bottom:1px solid rgba(244,240,231,.35); padding-bottom:6px; }
.sound-toggle { border:0; padding:5px 0; color:#c6c9c1; background:transparent; cursor:pointer; font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.sound-toggle span { display:inline-grid; place-items:center; width:25px; height:25px; margin-right:6px; border:1px solid rgba(244,240,231,.22); border-radius:50%; color:var(--gold); }
.sound-toggle.muted { opacity:.5; }

.game-layout { min-height:0; flex:1; display:grid; grid-template-columns:minmax(0,1fr) 340px; }
.question-stage { position:relative; min-width:0; overflow:auto; display:flex; flex-direction:column; justify-content:center; padding:35px clamp(35px,5vw,80px); background:radial-gradient(circle at 50% 48%,#273128 0,#151c16 52%,#0d120e 100%); }
.atmosphere { position:absolute; inset:0; opacity:.14; pointer-events:none; background:linear-gradient(90deg,rgba(16,22,17,.65),transparent,rgba(16,22,17,.7)),url('/images/hero-lion.jpg') center/cover; mix-blend-mode:luminosity; }
.atmosphere::after { content:''; position:absolute; inset:0; background:repeating-radial-gradient(circle at center,transparent 0 72px,rgba(211,162,78,.1) 74px,transparent 76px); }
.question-stage > *:not(.atmosphere) { position:relative; z-index:1; }
.stage-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; width:min(930px,100%); margin:0 auto 23px; }
.stage-header > div:first-child span { display:block; color:var(--gold); font-size:9px; font-weight:800; letter-spacing:.24em; }
.stage-header > div:first-child small { display:block; margin-top:8px; color:#a6aaa1; font-size:8px; letter-spacing:.15em; }
.current-value { text-align:right; }
.current-value small,.current-value span { display:block; color:#9da198; font-size:7px; font-weight:800; letter-spacing:.16em; }
.current-value strong { color:var(--gold); font:34px/1 Georgia,serif; }
.question-card { width:min(930px,100%); min-height:140px; display:grid; place-items:center; margin:0 auto 19px; padding:28px 40px; border:1px solid rgba(211,162,78,.56); background:rgba(11,16,12,.76); box-shadow:0 24px 80px rgba(0,0,0,.25),inset 0 0 50px rgba(211,162,78,.035); text-align:center; }
.question-card p { margin:0; font:clamp(25px,2.7vw,42px)/1.2 Georgia,'Times New Roman',serif; }
.answers { width:min(930px,100%); display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 auto; }
.answer { position:relative; min-height:76px; padding:15px 18px 15px 54px; border:1px solid rgba(244,240,231,.27); color:var(--cream); background:rgba(19,26,20,.87); cursor:pointer; text-align:left; font-size:13px; line-height:1.35; transition:transform .16s ease,border-color .16s ease,background .16s ease; }
.answer::before { content:attr(data-letter); position:absolute; left:20px; top:50%; transform:translateY(-50%); color:var(--gold); font:20px Georgia,serif; }
.answer:hover { transform:translateY(-2px); border-color:var(--gold); }
.answer.selected { border-color:var(--gold); background:#43351e; box-shadow:inset 4px 0 var(--gold); }
.answer.correct { border-color:var(--green); background:#2b6948; box-shadow:inset 4px 0 #8ed0a8; }
.answer.wrong { border-color:var(--red); background:#76252b; box-shadow:inset 4px 0 #d95a60; }
.answer.eliminated { opacity:.13; pointer-events:none; }
.explanation { width:min(930px,100%); min-height:62px; margin:16px auto 0; padding:12px 17px; border-left:2px solid var(--gold); background:rgba(8,13,9,.55); }
.explanation span { color:var(--gold); font-size:7px; font-weight:800; letter-spacing:.2em; }
.explanation p { margin:6px 0 0; color:#c0c3bb; font:13px/1.4 Georgia,serif; }
.decision-row { width:min(930px,100%); display:flex; justify-content:space-between; gap:15px; margin:18px auto 0; }
.walk-button,.lock-button,.primary-button { cursor:pointer; font-size:9px; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.walk-button { padding:15px 18px; border:1px solid rgba(244,240,231,.25); color:#b8bbb4; background:transparent; }
.lock-button { min-width:220px; padding:16px 24px; border:0; color:white; background:var(--red); }
.lock-button:disabled { opacity:.35; cursor:not-allowed; }
.lock-button.next-ready { background:var(--green); }

.game-sidebar { min-height:0; display:flex; flex-direction:column; padding:27px 25px 18px; color:var(--ink); background:var(--cream); border-left:1px solid rgba(0,0,0,.1); }
.lifelines-title { display:flex; justify-content:space-between; align-items:center; }
.lifelines-title span { color:var(--red); font-size:8px; font-weight:800; letter-spacing:.2em; }
.lifelines-title small { color:#858980; font-size:8px; }
.lifelines { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin:13px 0 21px; }
.lifelines button { min-width:0; min-height:67px; padding:9px 5px; border:1px solid #cbc4b8; color:var(--ink); background:transparent; cursor:pointer; }
.lifelines button:hover { border-color:var(--gold); background:#eee5d5; }
.lifelines button.used { opacity:.3; text-decoration:line-through; pointer-events:none; }
.lifelines strong { display:block; font:12px Georgia,serif; }
.lifelines span { display:block; margin-top:5px; color:#878a82; font-size:6px; line-height:1.25; }
.prize-ladder { flex:1; min-height:0; display:flex; flex-direction:column; justify-content:space-between; margin:0; padding:0; list-style:none; counter-reset:item 16; }
.prize-ladder li { counter-increment:item -1; min-height:23px; display:grid; grid-template-columns:25px 1fr auto; align-items:center; padding:3px 8px; color:#777b72; font-size:9px; font-weight:800; letter-spacing:.08em; }
.prize-ladder li::before { content:counter(item,decimal-leading-zero); color:#9a9c95; font:10px Georgia,serif; }
.prize-ladder li::after { content:'WILD POINTS'; color:#a8a79f; font-size:5px; letter-spacing:.12em; }
.prize-ladder li.milestone { color:var(--red); border-left:2px solid var(--red); background:#ece1d6; }
.prize-ladder li.active { color:white; background:var(--red); box-shadow:0 7px 18px rgba(182,38,46,.2); }
.prize-ladder li.active::before,.prize-ladder li.active::after { color:white; }
.prize-ladder li.cleared { color:var(--green); }
.no-prize { margin:13px 0 0; color:#96978f; font:italic 9px Georgia,serif; text-align:center; }

.overlay-screen { position:fixed; z-index:20; inset:0; display:grid; overflow:auto; color:var(--cream); background:#101611; }
.overlay-screen[hidden] { display:none; }
.start-screen { grid-template-columns:minmax(330px,.85fr) minmax(580px,1.15fr); }
.start-visual { min-height:100%; display:grid; place-items:center; background:linear-gradient(rgba(12,18,13,.15),rgba(12,18,13,.7)),url('/images/safari-hero.jpg') center/cover; }
.million-mark { width:min(360px,62%); aspect-ratio:1; display:grid; place-content:center; text-align:center; border:1px solid rgba(244,240,231,.55); border-radius:50%; background:rgba(13,18,14,.28); box-shadow:0 0 0 18px rgba(211,162,78,.14),0 0 0 19px rgba(244,240,231,.27),0 0 0 65px rgba(16,22,17,.2); backdrop-filter:blur(8px); }
.million-mark small,.million-mark span { font-size:9px; font-weight:800; letter-spacing:.28em; }
.million-mark strong { color:var(--gold); font:clamp(86px,10vw,150px)/.85 Georgia,serif; }
.overlay-card { align-self:center; max-width:780px; padding:50px clamp(45px,7vw,110px); }
.eyebrow { margin:0 0 17px; color:var(--red); font-size:9px; font-weight:800; letter-spacing:.25em; }
.overlay-card h1 { margin:0; font:clamp(50px,5.3vw,86px)/.98 Georgia,'Times New Roman',serif; font-weight:400; }
.overlay-card h1 em { color:var(--red); font-weight:400; }
.overlay-card > p:not(.eyebrow) { max-width:600px; margin:25px 0; color:#b6bab1; font:18px/1.55 Georgia,serif; }
.start-rules { display:flex; gap:1px; max-width:560px; margin:29px 0; background:rgba(244,240,231,.16); }
.start-rules div { flex:1; padding:16px; background:var(--ink); }
.start-rules strong { display:block; color:var(--gold); font:30px Georgia,serif; }
.start-rules span { display:block; margin-top:5px; color:#8f948b; font-size:7px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.primary-button { min-width:285px; padding:20px 26px; border:0; color:white; background:var(--red); }
.primary-button:hover { background:#8e1d23; }
.walk-button:disabled { opacity:.3; cursor:not-allowed; }
.overlay-card > a { display:block; width:max-content; margin-top:20px; color:#aeb2a9; font-size:8px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; text-underline-offset:6px; }
.result-screen { place-items:center; padding:35px; background:radial-gradient(circle,#1c271e,#0d120e 70%); }
.result-card { width:min(800px,100%); padding:30px; text-align:center; }
.result-card > p { margin-inline:auto !important; }
.result-stats { display:grid; grid-template-columns:repeat(3,1fr); max-width:620px; margin:30px auto; border-top:1px solid rgba(244,240,231,.17); border-bottom:1px solid rgba(244,240,231,.17); }
.result-stats div { padding:21px 10px; }
.result-stats strong { display:block; font:24px Georgia,serif; }
.result-stats span { display:block; margin-top:6px; color:#8f948b; font-size:7px; letter-spacing:.16em; }
.result-card > a { margin-inline:auto; }

@media (max-width:900px) {
  body { overflow:auto; }
  .game-shell { min-height:100dvh; height:auto; }
  .topbar { height:84px; flex-basis:84px; grid-template-columns:1fr auto; padding:0 17px; }
  .brand img { width:170px; max-height:62px; }
  .edition,.top-actions > a:not(.exit-link) { display:none; }
  .top-actions { gap:8px; }
  .sound-toggle { font-size:0; }
  .sound-toggle span { margin:0; }
  .exit-link { font-size:0 !important; border:0 !important; padding:10px !important; }
  .exit-link::after { content:'×'; display:block; font:30px/1 Georgia,serif; }
  .game-layout { display:flex; flex-direction:column; }
  .question-stage { min-height:calc(100dvh - 84px); padding:24px 18px 30px; overflow:visible; }
  .stage-header { margin-bottom:15px; }
  .current-value strong { font-size:28px; }
  .question-card { min-height:125px; padding:23px 18px; }
  .question-card p { font-size:25px; }
  .answers { grid-template-columns:1fr; gap:7px; }
  .answer { min-height:59px; padding-block:11px; }
  .explanation { min-height:60px; }
  .decision-row { position:sticky; bottom:0; padding:10px 0 calc(8px + env(safe-area-inset-bottom)); background:linear-gradient(transparent,var(--ink) 22%); }
  .lock-button { min-width:0; flex:1; }
  .game-sidebar { padding:23px 18px; }
  .prize-ladder { gap:4px; }
  .prize-ladder li { min-height:29px; }
  .start-screen { display:block; }
  .start-visual { min-height:34dvh; }
  .million-mark { width:170px; }
  .overlay-card { padding:34px 23px 46px; }
  .overlay-card h1 { font-size:clamp(48px,14vw,68px); }
  .overlay-card > p:not(.eyebrow) { font-size:16px; }
  .primary-button { width:100%; }
}

@media (max-height:740px) and (min-width:901px) {
  .topbar { height:80px; flex-basis:80px; }
  .brand img { width:180px; max-height:60px; }
  .question-stage { padding-block:22px; }
  .question-card { min-height:110px; }
  .answer { min-height:60px; }
  .game-sidebar { padding-block:19px 13px; }
  .lifelines { margin-bottom:13px; }
}

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; } }

/* mini-selector de língua no topo: discreto, a activa acesa */
.lang-mini { display:flex; gap:10px; margin-right:14px; }
.lang-mini a { font-size:11px; letter-spacing:.12em; opacity:.5; text-decoration:none; color:inherit; }
.lang-mini a:hover { opacity:.85; }
.lang-mini a.on { opacity:1; border-bottom:1px solid currentColor; padding-bottom:2px; }
@media (max-width:760px){ .lang-mini { margin-right:8px; } }
