:root{
  --forest:#173f35;
  --forest-2:#245b4a;
  --mint:#eaf5ef;
  --cream:#fffaf0;
  --paper:#ffffff;
  --ink:#15382f;
  --muted:#63776e;
  --line:#d9e7df;
  --gold:#f2c14e;
  --shadow:0 18px 50px rgba(20,61,49,.10);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#eef6f1 0%,#fffaf0 100%);color:var(--ink)}
body{min-width:0}
button,input{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible{outline:3px solid rgba(242,193,78,.85);outline-offset:3px}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.animal-app{min-height:100%;position:relative;overflow:hidden}
.animal-topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--forest);color:#fff;padding:10px clamp(12px,3vw,24px);box-shadow:0 3px 14px rgba(0,0,0,.13);position:relative;z-index:5}
.animal-brand{display:flex;align-items:center;gap:10px;min-width:0}.animal-brand strong{display:block;letter-spacing:.08em;font-size:1rem}.animal-brand small{display:block;color:#d9ebe2;font-size:.72rem;margin-top:1px}.animal-mark{width:38px;height:38px;display:grid;place-items:center;background:#fff;color:var(--forest);border-radius:50%;font-size:20px;flex:0 0 auto}
.back-button,.secondary-button{border:1px solid rgba(255,255,255,.38);background:transparent;color:#fff;border-radius:11px;padding:9px 12px;font-weight:800;min-height:42px}.back-button:hover{background:rgba(255,255,255,.1)}
.animal-stage{width:min(980px,calc(100% - 28px));margin:0 auto;padding:clamp(28px,5vw,56px) 0 56px;position:relative;z-index:2}
.hero-copy{text-align:center;margin-bottom:22px}.eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.13em;font-weight:900;color:var(--forest-2);text-transform:uppercase}.hero-copy h1{font-size:clamp(2.35rem,7vw,5rem);line-height:.92;letter-spacing:-.045em;margin:8px 0 10px}.hero-copy p{margin:0;color:var(--muted);font-weight:700;font-size:clamp(.95rem,2vw,1.15rem)}.hq-badge{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:13px;padding:8px 11px;border:1px solid #cfe2d7;border-radius:999px;background:rgba(255,255,255,.78);font-size:.7rem;font-weight:900;letter-spacing:.045em;color:var(--forest)}.hq-badge span:last-child{color:var(--muted);font-weight:800;letter-spacing:0}.hq-badge strong{font-size:.7rem}
.setup-card,.game-card,.results-card,.trainer-card{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:clamp(18px,3.4vw,34px)}
.setup-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:28px}.setup-card h2{font-size:1rem;margin:0 0 10px;text-transform:uppercase;letter-spacing:.06em;color:var(--forest)}
.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mode-button,.range-button,.notation-button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:14px;min-height:52px;padding:10px 12px;font-weight:850;transition:.15s ease}.mode-button{display:flex;align-items:center;gap:9px}.mode-button span{font-size:1.35rem}.mode-button.beast{grid-column:1/-1}.mode-button.active,.range-button.active,.notation-button.active{background:var(--forest);color:#fff;border-color:var(--forest);transform:translateY(-1px)}
.range-grid{display:grid;grid-template-columns:1fr;gap:9px}.notation-panel{margin-top:14px;padding:13px;border:1px solid var(--line);border-radius:16px;background:#f7faf8}.notation-copy strong,.notation-copy small{display:block}.notation-copy strong{font-size:.84rem;text-transform:uppercase;letter-spacing:.05em}.notation-copy small{font-size:.72rem;color:var(--muted);margin-top:3px;line-height:1.35}.notation-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}.notation-button{min-height:44px;padding:8px 10px;font-size:.75rem}.notation-button:disabled{cursor:not-allowed;opacity:.55}.teacher-lock{font-size:.7rem;color:#715d2d;background:#fff7dd;border:1px solid #ead9ac;border-radius:10px;padding:7px 8px;margin-top:8px;font-weight:800}
.ram-rule{margin-top:14px;border-radius:16px;background:var(--cream);border:1px solid #ead9ac;padding:12px;display:flex;gap:10px;align-items:center}.ram-rule>span{font-size:2rem}.ram-rule strong,.ram-rule small{display:block}.ram-rule strong{font-size:.82rem;letter-spacing:.05em}.ram-rule small{font-size:.72rem;color:#725f38;margin-top:2px;line-height:1.3}
.start-button,.trainer-button{width:100%;border:0;border-radius:15px;background:var(--forest);color:#fff;padding:15px 18px;font-size:1rem;font-weight:950;letter-spacing:.035em;margin-top:24px;min-height:54px;box-shadow:0 10px 24px rgba(23,63,53,.17)}.start-button:hover,.trainer-button:hover{background:var(--forest-2)}.trainer-button{background:#6f4b16;margin:0;box-shadow:none}.trainer-button:hover{background:#855d1d}.tiny-note{text-align:center;margin:9px 0 0;color:var(--muted);font-size:.72rem;font-weight:700}
.score-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-bottom:1px solid var(--line);padding-bottom:16px}.score-strip>div,.result-stats>div{text-align:center;border-radius:14px;background:#f5f9f6;padding:10px 8px}.score-strip span,.result-stats span{display:block;color:var(--muted);font-size:.66rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.score-strip strong{display:block;font-size:clamp(1.45rem,4vw,2.25rem);margin-top:2px;font-variant-numeric:tabular-nums}
.problem-zone{text-align:center;padding:clamp(26px,5vw,54px) 0 18px}.mode-label{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--mint);color:var(--forest);font-size:.72rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.problem{font-size:clamp(2.6rem,9vw,6.2rem);font-weight:950;line-height:1;letter-spacing:-.04em;margin:20px 0;white-space:nowrap}.answer-form{display:flex;gap:9px;width:min(430px,100%);margin:0 auto}.answer-form input{width:100%;min-width:0;border:2px solid var(--line);background:#fff;border-radius:14px;padding:12px 14px;text-align:center;font-size:1.65rem;font-weight:900;color:var(--ink);min-height:56px}.answer-form button{border:0;border-radius:14px;background:var(--forest);color:#fff;padding:0 20px;font-weight:950;min-width:84px}.answer-form .sign-button{min-width:58px;padding:0 12px;background:#fff;color:var(--forest);border:2px solid var(--forest);font-size:2rem;line-height:1}.answer-form .sign-button[aria-pressed="true"]{background:var(--forest);color:#fff}.answer-form .sign-button:active{transform:scale(.97)}.feedback{min-height:28px;margin-top:12px;font-weight:900}.feedback.good{color:#137347}.feedback.miss{color:#a5483f}.best-line{text-align:center;border-top:1px solid var(--line);padding-top:14px;color:var(--muted);font-size:.78rem;font-weight:800}
.results-card{text-align:center;position:relative;overflow:hidden}.result-icon{font-size:4rem;line-height:1;margin-bottom:8px}.results-card h2{font-size:clamp(2.1rem,6vw,4.7rem);line-height:.95;letter-spacing:-.04em;margin:8px 0 12px}.results-card>p{width:min(680px,100%);margin:0 auto;color:var(--muted);font-weight:750;line-height:1.45}.growth-callout,.ram-gap{width:min(760px,100%);margin:15px auto 0;border-radius:14px;padding:11px 13px;font-weight:900;line-height:1.35}.growth-callout{background:#edf8f1;border:1px solid #cce5d5;color:#1c6946}.ram-gap{background:#fff7dd;border:1px solid #ead9ac;color:#705415}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:22px}.result-stats strong{display:block;font-size:1.65rem;margin-top:3px}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.result-actions .start-button{margin:0}.result-actions .trainer-button{grid-column:1/-1}.secondary-button{border-color:var(--forest);color:var(--forest);background:#fff;min-height:54px}.secondary-button:hover{background:var(--mint)}.secondary-button.dark{border-color:var(--forest);color:var(--forest)}
.miss-map{margin-top:24px;text-align:left;border-top:1px solid var(--line);padding-top:20px}.section-head h3{margin:5px 0 0;font-size:1.25rem}.miss-map-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.track-card{border:1px solid var(--line);border-radius:14px;background:#f7faf8;padding:11px}.track-card strong,.track-card span{display:block}.track-card strong{font-size:.85rem}.track-card span{font-size:1.1rem;font-weight:950;margin-top:4px}.track-card.target{border-color:#e7c873;background:#fff9e9}.track-card.target strong::after{content:'  ← TRAIN THIS';font-size:.62rem;color:#765d16}.miss-map-note{margin:9px 0 0;color:var(--muted);font-size:.76rem;font-weight:750}
.trainer-card{text-align:left}.trainer-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.trainer-head h2{font-size:clamp(1.8rem,4vw,3rem);margin:5px 0 8px;line-height:1}.trainer-head p{margin:0;color:var(--muted);font-weight:700;line-height:1.45}.trainer-progress{flex:0 0 auto;background:var(--forest);color:#fff;border-radius:999px;padding:8px 11px;font-size:.76rem;font-weight:900}.trainer-miss,.trainer-try{margin-top:20px;border:1px solid var(--line);border-radius:17px;padding:16px;background:#f8fbf9}.trainer-label{font-size:.65rem;font-weight:950;letter-spacing:.1em;color:var(--muted)}.trainer-original,.trainer-problem{font-size:clamp(2rem,5vw,3.4rem);font-weight:950;margin-top:7px;letter-spacing:-.03em}.trainer-response{font-size:.8rem;color:#8b473e;font-weight:800;margin-top:6px}.strategy-card{margin-top:14px;border-left:6px solid var(--gold);border-radius:14px;background:#fff9e8;padding:15px}.strategy-title{font-weight:950;font-size:1.05rem}.strategy-body{margin-top:8px;line-height:1.55;font-weight:750;color:#4e4b3e}.strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.strategy-quantity{border:1px solid #ead9ac;border-radius:12px;background:#fff;padding:9px}.strategy-quantity span,.strategy-quantity strong{display:block}.strategy-quantity span{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:#7a6840;font-weight:900}.strategy-quantity strong{font-size:1.35rem;margin-top:3px}.strategy-answer{margin-top:8px;font-weight:950}.trainer-form{margin:12px 0 0}.trainer-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.trainer-actions .start-button{margin:0}
.perfect-warning{position:fixed;inset:0;z-index:31;pointer-events:none;display:grid;place-items:start center;padding-top:95px;background:rgba(15,42,35,.06)}.perfect-warning-card{background:rgba(23,63,53,.97);color:#fff;border:2px solid rgba(255,255,255,.7);border-radius:18px;padding:16px 22px;text-align:center;box-shadow:0 16px 50px rgba(0,0,0,.25);max-width:min(92%,760px)}.perfect-warning-line{font-size:clamp(1.1rem,4vw,2.4rem);font-weight:950;letter-spacing:.03em}.ram-counter{margin-top:7px;color:#ffe29c;font-size:.8rem;font-weight:950;letter-spacing:.07em}.ramageddon{font-size:clamp(1.6rem,5vw,3.2rem)!important;color:#ffe29c}
.celebration-layer{position:fixed;inset:0;z-index:20;overflow:hidden;pointer-events:none}.falling-thing{position:absolute;top:-90px;filter:drop-shadow(0 3px 2px rgba(0,0,0,.16));user-select:none;animation-fill-mode:forwards}.falling-thing.stack{animation-name:animal-stack;animation-timing-function:cubic-bezier(.22,.75,.38,1)}.falling-thing.bounce{animation-name:animal-bounce-out;animation-timing-function:cubic-bezier(.18,.78,.34,1)}.falling-thing.reward-squirrel{filter:drop-shadow(0 3px 2px rgba(0,0,0,.18))}.falling-thing.reward-lion,.falling-thing.reward-ram{filter:drop-shadow(0 5px 3px rgba(0,0,0,.2))}.falling-thing.golden{filter:drop-shadow(0 0 12px #f2c14e);background:#fff4bd;border:2px solid #f2c14e;border-radius:50%;padding:4px;z-index:8}.falling-thing.evacuate{animation:animal-evacuate .95s cubic-bezier(.55,.02,.85,.3) forwards!important;animation-delay:0s!important}.giant-ram{position:absolute;top:-210px;left:50%;font-size:clamp(110px,21vw,230px);transform:translateX(-50%);animation:giant-ram-drop 1.45s cubic-bezier(.18,.88,.36,1.15) forwards;z-index:9;filter:drop-shadow(0 9px 7px rgba(0,0,0,.23))}.giant-ram.giant-escape{animation:giant-ram-escape .9s cubic-bezier(.55,.02,.85,.3) forwards!important}.big-ram-label{position:absolute;top:112px;left:50%;transform:translateX(-50%);background:rgba(23,63,53,.96);color:#fff;padding:8px 12px;border-radius:999px;font-weight:950;font-size:.78rem;white-space:nowrap;z-index:10}.static-celebration{position:absolute;inset:70px 12px auto;display:flex;flex-wrap:wrap;justify-content:center;gap:7px;font-size:2rem;opacity:.95}
@keyframes animal-stack{0%{transform:translate3d(0,-120px,0) rotate(0deg)}58%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin))}70%{transform:translate3d(var(--bounce-x),var(--bounce-y),0) rotate(var(--bounce-spin))}82%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin))}91%{transform:translate3d(var(--bounce-x),calc(var(--bounce-y) + 52px),0) rotate(var(--bounce-spin))}100%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin))}}
@keyframes animal-bounce-out{0%{transform:translate3d(0,-120px,0) rotate(0deg)}43%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin))}57%{transform:translate3d(var(--bounce-x),var(--bounce-y),0) rotate(var(--bounce-spin))}69%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin))}79%{transform:translate3d(var(--bounce-x),calc(var(--bounce-y) + 68px),0) rotate(var(--bounce-spin))}100%{transform:translate3d(var(--exit-x),var(--exit-y),0) rotate(var(--exit-spin))}}
@keyframes animal-evacuate{0%{transform:translate3d(var(--land-x),var(--land-y),0) rotate(var(--land-spin));opacity:1}100%{transform:translate3d(var(--escape-x),var(--escape-y),0) rotate(var(--escape-spin));opacity:.15}}
@keyframes giant-ram-drop{0%{transform:translate(-50%,-160px) rotate(-5deg)}62%{transform:translate(-50%,315px) rotate(5deg)}78%{transform:translate(-50%,245px) rotate(-3deg)}100%{transform:translate(-50%,275px) rotate(0deg)}}
@keyframes giant-ram-escape{0%{transform:translate(-50%,275px) rotate(0deg)}100%{transform:translate(70vw,-260px) rotate(720deg);opacity:.1}}
@media(max-width:720px){.animal-stage{width:min(100% - 18px,980px);padding-top:24px}.setup-grid{grid-template-columns:1fr;gap:20px}.score-strip,.result-stats{grid-template-columns:repeat(2,1fr)}.problem{white-space:normal}.result-actions,.trainer-actions{grid-template-columns:1fr}.result-actions .trainer-button{grid-column:auto}.back-button{font-size:.75rem;padding:8px 9px}.animal-brand small{display:none}.miss-map-grid{grid-template-columns:repeat(2,1fr)}.trainer-head{display:block}.trainer-progress{display:inline-block;margin-top:10px}}
@media(max-width:390px){.animal-topbar{align-items:center}.animal-brand strong{font-size:.85rem}.animal-mark{width:34px;height:34px}.back-button{max-width:150px;line-height:1.1}.mode-grid{grid-template-columns:1fr 1fr}.notation-grid{grid-template-columns:1fr}.setup-card,.game-card,.results-card,.trainer-card{border-radius:20px;padding:16px}.answer-form{gap:6px}.answer-form button{min-width:70px;padding:0 14px}.answer-form .sign-button{min-width:52px;padding:0 10px}.problem{font-size:2.55rem}.strategy-grid{grid-template-columns:1fr}}
@media(max-width:720px){
  body.round-active{background:#f6faf7;overflow-x:hidden}
  body.round-active .animal-topbar,body.round-active .hero-copy{display:none}
  body.round-active .animal-stage{width:100%;margin:0;padding:calc(env(safe-area-inset-top,0px) + 6px) 8px 12px}
  body.round-active .game-card{margin:0;border-radius:18px;padding:10px 12px 8px;box-shadow:none}
  body.round-active .score-strip{gap:5px;padding-bottom:8px}
  body.round-active .score-strip>div{padding:6px 5px;border-radius:11px}
  body.round-active .score-strip span{font-size:.58rem}
  body.round-active .score-strip strong{font-size:1.35rem;margin-top:0}
  body.round-active .problem-zone{padding:11px 0 7px}
  body.round-active .mode-label{font-size:.62rem;padding:5px 8px}
  body.round-active .problem{font-size:clamp(2.35rem,12vw,3.35rem);margin:12px 0 13px;white-space:nowrap}
  body.round-active .answer-form{gap:6px;max-width:100%}
  body.round-active .answer-form input{min-height:52px;font-size:1.45rem;padding:9px 10px}
  body.round-active .answer-form button{min-height:52px}
  body.round-active .feedback{min-height:20px;margin-top:6px;font-size:.72rem}
  body.round-active .best-line{padding-top:7px;font-size:.67rem}
  body.round-active input{font-size:16px}
  .answer-form button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.mode-button,.range-button,.notation-button{transition:none}.falling-thing,.giant-ram{animation:none!important}.celebration-layer{overflow:auto}}

/* =========================================================
   v20.0 — HEADQUARTERS WORLD / FOCUSED ARENA VISUAL SYSTEM
   Existing v19.2 interaction + iPhone stability rules above are preserved.
   ========================================================= */
:root{--hq-night:#06130f;--hq-panel:#101d18;--hq-panel2:#1d2d26;--hq-neon:#63ff4e;--hq-cyan:#42d9ff;--hq-purple:#c36dff;--hq-gold:#ffd04b;--hq-line:#425d50}
html,body{background:radial-gradient(circle at 50% -5%,#17372b 0,#071510 42%,#030806 100%);color:#effff5}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 22%,rgba(55,255,111,.08),transparent 25%),radial-gradient(circle at 88% 16%,rgba(66,217,255,.07),transparent 24%);z-index:0}
.animal-app{position:relative;z-index:1}.animal-topbar{background:linear-gradient(#0b2a20,#071812);border-bottom:1px solid #416252;box-shadow:0 8px 24px rgba(0,0,0,.38)}.animal-mark{box-shadow:inset 0 -5px 10px rgba(0,0,0,.16),0 0 0 2px #4a6b5b}.back-button{background:#0b2119;border-color:#55786a;box-shadow:inset 0 -5px 12px rgba(0,0,0,.18)}
.hero-copy .eyebrow{color:var(--hq-cyan)}.hero-copy h1{color:#f7fff9;text-shadow:0 3px 0 #17362b,0 12px 30px rgba(0,0,0,.35)}.hero-copy p{color:#a4bcb0}.hq-badge{background:#0a1a14;border-color:#315849;color:#baffcc;box-shadow:inset 0 0 20px rgba(68,255,111,.04)}.hq-badge span:last-child{color:#8da99b}
.setup-card,.game-card,.results-card,.trainer-card{background:linear-gradient(155deg,rgba(28,44,37,.98),rgba(7,13,10,.99));border-color:#466257;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -18px 35px rgba(0,0,0,.28),0 24px 65px rgba(0,0,0,.42);color:#effff5;position:relative}.setup-card:before,.game-card:before,.results-card:before,.trainer-card:before{content:"";position:absolute;inset:6px;border:1px solid rgba(255,255,255,.045);border-radius:20px;pointer-events:none}
.setup-card h2{color:#b7ffd0}.mode-button,.range-button,.notation-button{background:linear-gradient(#17261f,#0c1511);border-color:#3e584c;color:#dff8e8;box-shadow:inset 0 -7px 14px rgba(0,0,0,.18)}.mode-button.active,.range-button.active,.notation-button.active{background:linear-gradient(#2c8c45,#0f562a);border-color:#69ff75;color:#fff;box-shadow:0 0 22px rgba(82,255,105,.14),inset 0 -7px 12px rgba(0,0,0,.22)}.notation-panel{background:#08150f;border-color:#304c3f}.notation-copy small,.tiny-note{color:#8fa69a}.ram-rule{background:#211a08;border-color:#76612b}.ram-rule small{color:#d2b96f}.start-button{background:linear-gradient(#70ff55,#2ad84a);color:#07120b;border:1px solid #a2ff86;box-shadow:0 0 28px rgba(72,255,85,.19),inset 0 -6px 0 rgba(5,86,25,.2)}.start-button:hover{background:linear-gradient(#89ff6c,#38e653)}
.game-card{overflow:visible;border-color:#536b60}.arena-frame{position:absolute;inset:-17px -13px;z-index:-1;border:3px solid #263d33;border-radius:34px;background:linear-gradient(90deg,#111a16,#26372f 14%,transparent 22% 78%,#26372f 86%,#111a16);box-shadow:0 0 0 5px #070c09,0 22px 55px rgba(0,0,0,.5)}.arena-frame:before,.arena-frame:after{content:"🐾";position:absolute;top:45%;font-size:2.3rem;color:#294b3c;text-shadow:0 0 17px rgba(99,255,78,.18)}.arena-frame:before{left:16px}.arena-frame:after{right:16px}.arena-light{position:absolute;top:12%;bottom:12%;width:5px;border-radius:99px;background:#39ff6c;box-shadow:0 0 14px #39ff6c;opacity:.28;transition:.25s}.arena-light.left{left:8px}.arena-light.right{right:8px}.score-strip{border-color:#354f43}.score-strip>div,.result-stats>div{background:#07140f;border:1px solid #294337;color:#effff5;box-shadow:inset 0 -9px 15px rgba(0,0,0,.18)}.score-strip span,.result-stats span{color:#8ba395}.score-strip strong{color:var(--hq-neon);text-shadow:0 0 16px rgba(99,255,78,.18)}.problem-zone{position:relative}.mode-label{background:#13251d;color:#a8ffc1;border:1px solid #325b47}.problem{color:#f7fff9;text-shadow:0 4px 0 #1c3128,0 0 25px rgba(99,255,78,.08)}.answer-form{width:min(540px,100%);align-items:end}.answer-form input{background:#eef5f0;color:#17362c;border-color:#667e72;box-shadow:inset 0 4px 10px rgba(0,0,0,.11);min-height:62px}.answer-form>button{min-height:62px;background:linear-gradient(#64ed5b,#1b9d45);color:#fff;border:1px solid #80ff7c;box-shadow:inset 0 -6px 0 rgba(0,0,0,.13),0 0 18px rgba(66,255,87,.09)}.sign-control{display:flex;flex-direction:column;align-items:center;justify-content:end;gap:5px;flex:0 0 auto}.sign-help{display:block;color:#ffe47b;background:#171305;border:1px solid #6d5a20;padding:4px 6px;border-radius:6px;font-size:.62rem;font-weight:900;line-height:1.1;white-space:nowrap;box-shadow:0 0 12px rgba(255,206,69,.07)}.answer-form .sign-control .sign-button{min-width:62px;min-height:62px;padding:0 12px;background:linear-gradient(#2d372f,#121814);color:#ffe163;border:2px solid #d0a82a;font-size:2rem;box-shadow:inset 0 -6px 0 rgba(0,0,0,.18)}.answer-form .sign-control .sign-button[aria-pressed="true"]{background:linear-gradient(#ffce45,#c28717);color:#10130b;border-color:#ffe383}.feedback.good{color:#68ff8e}.feedback.miss{color:#ff9c82}.best-line{border-color:#344c41;color:#8da397}
.streak-signal{height:22px;margin:8px 0 -3px;font-size:.62rem;font-weight:1000;letter-spacing:.1em;color:#8ba295;transition:.2s}.streak-signal:after{content:"HEADQUARTERS IS QUIET. BUILD THE STREAK."}.game-card .arena-light{opacity:.22}body[data-energy="warm"] .game-card .arena-light{opacity:.45}body[data-energy="alive"] .game-card .arena-light{opacity:.7}body[data-energy="charged"] .game-card .arena-light{opacity:1;box-shadow:0 0 22px #39ff6c}body[data-energy="hooves"] .game-card .arena-light{background:#ffc83d;box-shadow:0 0 25px #ffc83d;opacity:1}body[data-energy="gate"] .game-card .arena-light{background:#ffc83d;box-shadow:0 0 30px #ffc83d;opacity:1;animation:hq-flicker .45s steps(2,end) infinite}body[data-energy="warm"] .streak-signal:after{content:"HEADQUARTERS LIGHTS ARE COMING ONLINE."}body[data-energy="alive"] .streak-signal:after{content:"THE ANIMALS HAVE NOTICED."}body[data-energy="charged"] .streak-signal:after{content:"THE ARENA IS GETTING LOUD."}body[data-energy="hooves"] .streak-signal:after{content:"WE CAN HEAR HOOVES.";color:#ffd565}body[data-energy="gate"] .streak-signal:after{content:"THE RAMS ARE AT THE GATE.";color:#ffd565;text-shadow:0 0 14px rgba(255,208,75,.3)}@keyframes hq-flicker{50%{opacity:.52}}
.results-card h2{color:#fff;text-shadow:0 0 22px rgba(195,109,255,.16)}.results-card>p,.miss-map-note,.trainer-head p{color:#9eb3a8}.growth-callout{background:#0e2b1d;border-color:#287343;color:#8effaa}.ram-gap{background:#251d08;border-color:#735f27;color:#ffe383}.track-card{background:#091610;border-color:#365046;color:#e9fff2}.track-card.target{background:#261d07;border-color:#a3842e}.secondary-button{background:#0a1711;border-color:#5c7b6e;color:#dff8e8}.secondary-button.dark{border-color:#5c7b6e;color:#dff8e8}.trainer-button{background:linear-gradient(#7740a2,#4d216c);border:1px solid #b174d2}.trainer-miss,.trainer-try{background:#091610;border-color:#365046}.trainer-label{color:#8ca295}.trainer-response{color:#ffad95}.strategy-card{background:#211a08;border-color:#6f5b22}.strategy-body{color:#e8dca9}.strategy-quantity{background:#0b1711;border-color:#665728}.strategy-quantity span{color:#c9b87d}.strategy-answer{color:#fff}.trainer-progress{background:#482263;border:1px solid #a367c3}.perfect-warning-card{border-color:#8cff85;box-shadow:0 0 45px rgba(69,255,91,.2),0 18px 45px rgba(0,0,0,.55)}
@media(max-width:720px){.arena-frame{display:none}.streak-signal{display:none}.hero-copy{margin-bottom:17px}.setup-card,.game-card,.results-card,.trainer-card{box-shadow:0 12px 35px rgba(0,0,0,.32)}.sign-help{font-size:.58rem}.answer-form{align-items:end}.answer-form input{min-height:56px}.answer-form>button,.answer-form .sign-control .sign-button{min-height:56px}.trainer-form{align-items:end}}
@media(max-width:430px){.answer-form{gap:5px}.sign-help{max-width:64px;white-space:normal;text-align:center;padding:3px 4px}.answer-form .sign-control .sign-button{min-width:52px;padding:0 7px}.answer-form>button{min-width:68px;padding-left:12px;padding-right:12px}.hero-copy h1{font-size:2.55rem}}
@media(max-width:720px){body.round-active{background:#06110d}body.round-active:before{display:none}body.round-active .game-card{background:#07130e;border-color:#355246}body.round-active .score-strip>div{background:#0c1c15}body.round-active .problem{color:#fff;text-shadow:none}body.round-active .sign-help{display:block;color:#ffe272;background:transparent;border:0;box-shadow:none;padding:0;font-size:.56rem}body.round-active .answer-form{align-items:end}body.round-active .answer-form input{background:#f3f7f4;color:#14352b}body.round-active .best-line{color:#8fa498}}
/* v21 official Headquarters character drops */
.falling-thing.image-drop{display:block;overflow:hidden;border-radius:32%;background:#071119;border:2px solid rgba(135,244,255,.72);box-shadow:0 5px 13px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.12)}
.falling-thing.image-drop img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}
.falling-thing.reward-squirrel.image-drop{border-color:#ffad48}.falling-thing.reward-shark.image-drop{border-color:#4ce0ff}.falling-thing.reward-lion.image-drop{border-color:#ffb12d}.falling-thing.reward-unicorn.image-drop{border-color:#e68cff}.falling-thing.reward-ram.image-drop{border-color:#ffc93b;box-shadow:0 6px 16px rgba(0,0,0,.5),0 0 12px rgba(255,201,59,.22)}
.falling-thing.golden.image-drop{border:3px solid #ffe561!important;background:#3c2b02!important;box-shadow:0 0 24px #ffd42f,0 0 45px rgba(255,189,25,.65)!important;padding:0!important}
.giant-ram{width:clamp(150px,25vw,300px);height:clamp(125px,21vw,250px);font-size:0!important;border-radius:26px;overflow:hidden;border:4px solid #ffc837;background:#120e03;box-shadow:0 12px 36px rgba(0,0,0,.58),0 0 32px rgba(255,200,55,.35)}
.giant-ram img{width:100%;height:100%;object-fit:cover;display:block}
.static-celebration span.image-drop{width:56px;height:46px;display:block;border-radius:12px;overflow:hidden;border:2px solid #6adfff;background:#071119}
.static-celebration span.image-drop img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:600px){.falling-thing.image-drop{border-width:1px}.giant-ram{width:155px;height:130px}}
.result-icon.official-result-animal{width:96px;height:80px;margin:0 auto 10px;border-radius:18px;overflow:hidden;border:2px solid #3c7a68;background:#06120e;box-shadow:0 12px 30px rgba(0,0,0,.2),0 0 22px rgba(59,255,135,.1)}
.result-icon.official-result-animal img{width:100%;height:100%;object-fit:cover;display:block}

/* =========================================================
   v22.0 — TOTAL SITE VISUAL SYSTEM
   Bright Headquarters world from Elementary through High School.
   Interaction, scoring, iPhone keyboard stability, and celebration
   physics above are intentionally preserved.
   ========================================================= */
:root{
  --v22-navy:#041b2d;
  --v22-blue:#0e7fc7;
  --v22-blue-deep:#064a80;
  --v22-sky:#47bff2;
  --v22-green:#76ff42;
  --v22-gold:#ffd248;
  --v22-wood:#6c421f;
  --v22-wood-light:#b67733;
  --v22-cyan:#48e3ff;
  --v22-purple:#d66dff;
}

html,body{
  background:
    linear-gradient(180deg,rgba(6,67,104,.15),rgba(3,42,72,.82)),
    url('assets/headquarters-scenic-wash-v22.webp') center top/cover fixed,
    #0b659b;
  color:#f8fdff;
}
body:before{
  display:block;
  background:
    radial-gradient(circle at 15% 8%,rgba(255,232,132,.18),transparent 24%),
    radial-gradient(circle at 86% 10%,rgba(71,225,255,.2),transparent 25%),
    linear-gradient(180deg,rgba(19,139,211,.06),rgba(2,35,61,.58));
}

.animal-topbar{
  min-height:68px;
  background:linear-gradient(180deg,#061c2f,#03131f);
  border-bottom:2px solid rgba(103,192,233,.42);
  box-shadow:0 8px 28px rgba(0,20,38,.34);
}
.animal-mark{
  background:linear-gradient(#fff8dd,#e7c168);
  color:#21170a;
  border:2px solid #70491f;
  box-shadow:0 0 0 2px rgba(255,229,151,.2),inset 0 -6px 11px rgba(94,57,19,.15);
}
.animal-brand small{color:#c7deea}
.back-button{
  background:linear-gradient(180deg,#0c3b61,#082944);
  border:1px solid #61a9cf;
  color:#e8f8ff;
  box-shadow:inset 0 -5px 10px rgba(0,0,0,.18);
}
.back-button:hover{background:linear-gradient(180deg,#10507e,#0a3555)}

.animal-stage{width:min(1080px,calc(100% - 28px));padding-top:32px}
.hero-copy{
  position:relative;
  max-width:900px;
  margin:0 auto 20px;
  padding:18px 18px 16px;
  border:3px solid var(--v22-wood);
  outline:1px solid rgba(255,213,112,.7);
  border-radius:14px;
  background:
    linear-gradient(180deg,rgba(19,139,214,.86),rgba(6,76,129,.93)),
    url('assets/headquarters-scenic-wash-v22.webp') center/cover;
  box-shadow:0 15px 34px rgba(0,32,58,.28),inset 0 0 0 2px rgba(255,255,255,.08);
  text-shadow:0 2px 4px rgba(0,0,0,.58);
}
.hero-copy:before{content:"";position:absolute;inset:6px;border:1px solid rgba(255,228,147,.28);border-radius:8px;pointer-events:none}
.hero-copy .eyebrow{color:#d5f8ff}
.hero-copy h1{font-size:clamp(2rem,5.4vw,4.1rem);color:#fff;margin:7px 0 8px;text-shadow:0 3px 0 #074c79,0 10px 24px rgba(0,0,0,.24)}
.hero-copy p{color:#e3f4fa}
.hq-badge{
  background:linear-gradient(180deg,rgba(3,55,91,.92),rgba(3,35,61,.95));
  border:2px solid #7a4b22;
  outline:1px solid rgba(255,215,111,.58);
  color:#caffb2;
  box-shadow:0 5px 14px rgba(0,0,0,.2),inset 0 0 12px rgba(73,223,255,.05);
}
.hq-badge span:last-child{color:#c6e2ed}

/* Shared framed surface for setup, arena, results, trainer */
.setup-card,.game-card,.results-card,.trainer-card{
  position:relative;
  overflow:hidden;
  color:#fff;
  border:4px solid var(--v22-wood);
  outline:1px solid rgba(255,213,111,.78);
  border-radius:16px;
  background:
    linear-gradient(180deg,rgba(15,122,192,.91),rgba(5,62,108,.97)),
    url('assets/headquarters-scenic-wash-v22.webp') center/cover;
  box-shadow:0 18px 42px rgba(0,29,54,.32),inset 0 0 0 2px rgba(255,255,255,.08);
  text-shadow:0 2px 3px rgba(0,0,0,.44);
}
.setup-card:before,.game-card:before,.results-card:before,.trainer-card:before{
  inset:7px;
  border:1px solid rgba(255,230,150,.26);
  border-radius:9px;
}
.setup-card:after,.game-card:after,.results-card:after,.trainer-card:after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  background-size:contain;
  background-repeat:no-repeat;
  opacity:.96;
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.24));
}
.setup-card:after{right:-12px;bottom:-16px;width:145px;height:118px;background-image:url('assets/scout-squirrel.webp');background-position:right bottom}
.game-card:after{right:-20px;bottom:-15px;width:150px;height:124px;background-image:url('assets/coach-shark.webp');background-position:right bottom;opacity:.72}
.results-card:after{right:-14px;bottom:-12px;width:150px;height:124px;background-image:url('assets/ram-champion.webp');background-position:right bottom;opacity:.88}
.trainer-card:after{right:-13px;bottom:-10px;width:142px;height:118px;background-image:url('assets/scout-squirrel.webp');background-position:right bottom;opacity:.88}
.setup-card>*,.game-card>*,.results-card>*,.trainer-card>*{position:relative;z-index:1}

.setup-card h2{color:#fff7c5;text-shadow:0 2px 3px rgba(0,0,0,.65)}
.mode-button,.range-button,.notation-button{
  background:linear-gradient(180deg,rgba(5,55,94,.95),rgba(3,35,62,.98));
  border:2px solid rgba(112,195,232,.58);
  color:#effaff;
  box-shadow:inset 0 -5px 10px rgba(0,0,0,.18),0 4px 10px rgba(0,0,0,.12);
}
.mode-button:hover,.range-button:hover,.notation-button:hover{border-color:#91e8ff;background:linear-gradient(180deg,#0b6da7,#074e7b)}
.mode-button.active,.range-button.active,.notation-button.active{
  background:linear-gradient(180deg,#89ff59,#37c84b);
  border-color:#c7ff9a;
  color:#07160b;
  box-shadow:0 0 18px rgba(104,255,68,.2),inset 0 -5px 0 rgba(18,94,28,.2);
  text-shadow:none;
}
.notation-panel{
  background:linear-gradient(180deg,rgba(4,55,92,.86),rgba(3,34,59,.92));
  border:2px solid #6e99af;
  box-shadow:inset 0 0 12px rgba(66,219,255,.05);
}
.notation-copy small,.tiny-note{color:#d6e8f0}
.teacher-lock{color:#4e3a08;background:#fff4bd;border-color:#e7bf43;text-shadow:none}
.ram-rule{
  background:linear-gradient(180deg,rgba(131,84,18,.88),rgba(80,47,10,.94));
  border:2px solid #e1a639;
  color:#fff7c9;
}
.ram-rule small{color:#ffe6a1}
.start-button,.trainer-button{
  background:linear-gradient(#9bff65,#47df50 52%,#2fbd42);
  color:#061509;
  border:2px solid #d8ffa5;
  box-shadow:0 0 0 3px rgba(95,56,24,.88),0 0 0 5px rgba(222,161,63,.84),0 9px 20px rgba(0,0,0,.2),inset 0 -6px 0 rgba(18,91,27,.2);
  text-shadow:none;
}
.start-button:hover,.trainer-button:hover{background:linear-gradient(#adff79,#59e75e 52%,#37c749);filter:brightness(1.03)}
.trainer-button{background:linear-gradient(#e390ff,#a849cf 54%,#7a289e);color:#fff;border-color:#f2bcff;box-shadow:0 0 0 3px rgba(73,34,81,.9),0 0 0 5px rgba(193,107,227,.65),0 9px 20px rgba(0,0,0,.18)}
.trainer-button:hover{background:linear-gradient(#eaa4ff,#bb5edd 54%,#8b36ae)}

/* FOCUSED ARENA: dramatic but still bright-world coherent */
.game-card{
  background:
    linear-gradient(180deg,rgba(5,67,111,.96),rgba(2,31,55,.98)),
    url('assets/headquarters-scenic-wash-v22.webp') center/cover;
}
.arena-frame{
  border:4px solid #6c421f;
  background:linear-gradient(90deg,#3d2411,#7a4b22 13%,transparent 22% 78%,#7a4b22 87%,#3d2411);
  box-shadow:0 0 0 2px #dfa351,0 0 0 6px #071928,0 22px 48px rgba(0,0,0,.34);
}
.arena-frame:before,.arena-frame:after{color:#e0b251;text-shadow:0 0 17px rgba(255,210,80,.16)}
.arena-light{background:#62ff52;box-shadow:0 0 17px #62ff52}
.score-strip{border-color:rgba(154,213,239,.38)}
.score-strip>div,.result-stats>div{
  background:linear-gradient(180deg,#092f50,#061f36);
  border:1px solid #4e92b6;
  color:#fff;
  box-shadow:inset 0 -7px 12px rgba(0,0,0,.14),0 4px 9px rgba(0,0,0,.1);
}
.score-strip span,.result-stats span{color:#b9dcea}
.score-strip strong{color:var(--v22-green);text-shadow:0 0 12px rgba(112,255,68,.2)}
.mode-label{
  background:linear-gradient(180deg,#735024,#3f2810);
  color:#fff1b1;
  border:2px solid #d6a044;
  box-shadow:0 4px 10px rgba(0,0,0,.18);
}
.problem{
  display:inline-block;
  min-width:min(620px,92%);
  padding:18px 24px;
  border-radius:12px;
  background:linear-gradient(180deg,rgba(4,32,55,.94),rgba(2,19,34,.98));
  border:3px solid #6e4520;
  outline:1px solid rgba(255,211,111,.72);
  color:#fff;
  text-shadow:0 3px 0 rgba(0,0,0,.45),0 0 22px rgba(85,214,255,.12);
  box-shadow:inset 0 0 18px rgba(66,219,255,.05),0 8px 18px rgba(0,0,0,.2);
}
.answer-form input{
  background:#fffdf2;
  color:#082338;
  border:3px solid #795028;
  outline:1px solid #e5bc62;
  box-shadow:inset 0 4px 10px rgba(0,0,0,.1),0 4px 10px rgba(0,0,0,.1);
}
.answer-form>button{
  background:linear-gradient(#8cff5d,#38ca49);
  color:#07150a;
  border:2px solid #d0ffa3;
  box-shadow:0 0 0 2px rgba(102,61,27,.9),0 0 0 4px #d6a346,inset 0 -5px 0 rgba(14,81,23,.2);
  text-shadow:none;
}
.sign-help{
  color:#2e2106;
  background:#ffe65f;
  border:2px solid #704b16;
  box-shadow:0 4px 9px rgba(0,0,0,.18);
  text-shadow:none;
}
.answer-form .sign-control .sign-button{
  background:linear-gradient(#ffdf54,#d69e1f);
  color:#241600;
  border:2px solid #6e4518;
  box-shadow:0 0 0 2px #f5c74c,inset 0 -5px 0 rgba(90,54,8,.18);
  text-shadow:none;
}
.answer-form .sign-control .sign-button[aria-pressed="true"]{background:linear-gradient(#fff182,#e9bd30);color:#171000;border-color:#754716}
.feedback.good{color:#a6ff9b}.feedback.miss{color:#ffd0c5}.best-line{border-color:rgba(143,205,233,.36);color:#c4dce7}
.streak-signal{color:#c7e0ea}.streak-signal:after{content:"HEADQUARTERS IS QUIET. BUILD THE STREAK."}

/* RESULTS */
.results-card{
  background:
    linear-gradient(180deg,rgba(16,128,199,.91),rgba(5,63,108,.97)),
    url('assets/headquarters-scenic-wash-v22.webp') 72% center/cover;
}
.result-icon.official-result-animal{
  border:3px solid #7a4a21;
  outline:1px solid #e9b851;
  background:#0b6a9d;
  box-shadow:0 8px 20px rgba(0,0,0,.22),0 0 20px rgba(74,224,255,.12);
}
.results-card h2{color:#fff7bd;text-shadow:0 3px 0 rgba(81,47,11,.75),0 8px 18px rgba(0,0,0,.18)}
.results-card>p,.miss-map-note,.trainer-head p{color:#e3f3f9}
.growth-callout{
  background:linear-gradient(180deg,rgba(28,149,87,.9),rgba(12,91,54,.94));
  border:2px solid #a7ff9a;
  color:#f3fff0;
  box-shadow:inset 0 0 12px rgba(255,255,255,.07);
}
.ram-gap{
  background:linear-gradient(180deg,rgba(150,96,20,.91),rgba(91,54,11,.95));
  border:2px solid #f0c04c;
  color:#fff5bf;
}
.track-card{
  background:linear-gradient(180deg,#0a4f82,#06375f);
  border:2px solid #5bbbe8;
  color:#fff;
  box-shadow:inset 0 -5px 9px rgba(0,0,0,.12);
}
.track-card.target{background:linear-gradient(180deg,#8e6819,#59400b);border-color:#ffd667}
.track-card.target strong::after{color:#fff08a}
.secondary-button{
  background:linear-gradient(180deg,#0b4d7b,#073252);
  border:2px solid #65b9df;
  color:#f2fbff;
  box-shadow:inset 0 -5px 9px rgba(0,0,0,.14);
}
.secondary-button:hover{background:linear-gradient(180deg,#116397,#084066)}

/* ANIMAL TRAINER */
.trainer-card{
  background:
    linear-gradient(180deg,rgba(20,124,194,.92),rgba(6,60,104,.97)),
    url('assets/headquarters-scenic-wash-v22.webp') 20% center/cover;
}
.trainer-progress{
  background:linear-gradient(180deg,#d675f6,#8f36b2);
  border:2px solid #efb1ff;
  color:#fff;
  box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.trainer-miss,.trainer-try{
  background:linear-gradient(180deg,rgba(4,50,84,.92),rgba(3,29,51,.96));
  border:2px solid #5da8ce;
  color:#fff;
  box-shadow:inset 0 0 14px rgba(63,211,255,.04);
}
.trainer-label{color:#b9e5f5}
.trainer-response{color:#ffd1c6}
.strategy-card{
  border-left:7px solid var(--v22-gold);
  border-top:2px solid #d99e34;
  border-right:2px solid #d99e34;
  border-bottom:2px solid #d99e34;
  background:linear-gradient(180deg,#fff3b8,#f4d46f);
  color:#382707;
  text-shadow:none;
  box-shadow:0 6px 14px rgba(0,0,0,.13);
}
.strategy-title{color:#2d2106}.strategy-body{color:#4d3c10}.strategy-quantity{background:#fff9d8;border:2px solid #c99935;color:#302205}.strategy-quantity span{color:#735818}.strategy-answer{color:#271b02}

/* Celebration overlays match the bright world */
.perfect-warning{background:rgba(6,85,132,.04)}
.perfect-warning-card{
  background:linear-gradient(180deg,#0b6094,#063d69);
  border:3px solid #75481f;
  outline:2px solid #e6b24a;
  color:#fff;
  box-shadow:0 0 34px rgba(72,225,255,.16),0 18px 40px rgba(0,0,0,.3);
}
.ram-counter{color:#fff08a}
.big-ram-label{
  background:linear-gradient(180deg,#7e4e21,#4c2c10);
  color:#fff4b7;
  border:2px solid #e1a749;
  box-shadow:0 5px 14px rgba(0,0,0,.2);
}
.falling-thing.image-drop{
  background:#0a6698;
  border-color:#a0ecff;
  box-shadow:0 5px 13px rgba(0,0,0,.3),0 0 0 2px rgba(255,218,112,.28);
}
.giant-ram{
  border:4px solid #ffd24a;
  outline:2px solid #77461d;
  background:#0c6a99;
  box-shadow:0 12px 32px rgba(0,0,0,.34),0 0 28px rgba(255,211,67,.32);
}

/* Tablet/mobile and the sacred stable-round rule */
@media(max-width:720px){
  .animal-stage{width:min(100% - 16px,1080px);padding-top:16px}
  .hero-copy{padding:14px 12px;margin-bottom:13px;border-width:3px}
  .hero-copy h1{font-size:2.45rem}
  .setup-card:after,.game-card:after,.results-card:after,.trainer-card:after{display:none}
  .setup-card,.game-card,.results-card,.trainer-card{border-width:3px;outline:0}
  .arena-frame{display:none}
  .problem{min-width:0;width:100%;padding:14px 10px}
  body.round-active{
    background:linear-gradient(180deg,#0b5c8d,#063a60);
  }
  body.round-active:before{display:none}
  body.round-active .game-card{
    background:linear-gradient(180deg,#075181,#052f50);
    border-color:#6d431f;
    outline:0;
    box-shadow:none;
  }
  body.round-active .score-strip>div{background:linear-gradient(180deg,#073a62,#052843);border-color:#4d93b7}
  body.round-active .problem{
    color:#fff;
    background:linear-gradient(180deg,#062842,#041a2c);
    border:2px solid #6d421d;
    outline:1px solid #dba847;
    text-shadow:none;
    margin:10px 0 12px;
    padding:11px 8px;
  }
  body.round-active .answer-form input{background:#fffdf2;color:#082338;border-color:#71471f;outline:0}
  body.round-active .sign-help{display:block;color:#3b2a03;background:#ffe667;border:1px solid #6c4717;padding:3px 4px;font-size:.56rem}
  body.round-active .best-line{color:#b8d6e2;border-color:rgba(121,193,224,.32)}
}
@media(max-width:430px){
  .animal-topbar{padding-left:8px;padding-right:8px}.back-button{max-width:155px;font-size:.69rem}.hero-copy h1{font-size:2rem}.hero-copy p{font-size:.82rem}
  .problem{font-size:2.45rem}.answer-form .sign-control .sign-button{min-width:52px}.sign-help{max-width:70px}
}