
:root{
  --choc:#4a2b1a;--choc2:#6b3f24;--cream:#fff3dc;--cream2:#f6dfbd;
  --gold:#f7bd3a;--gold2:#eb9224;--ink:#3d291e;--muted:#846b57;--white:#fffdf8;
  --shadow:0 18px 44px rgba(57,34,20,.16)
}
*{box-sizing:border-box}
html{background:#f4e5cf;color:var(--ink);font-family:ui-rounded,"Trebuchet MS",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{margin:0;min-width:320px;background:
  radial-gradient(circle at 15% 0,#fff9ed 0 18%,transparent 42%),
  radial-gradient(circle at 85% 15%,#f8dbad 0 10%,transparent 36%),
  linear-gradient(180deg,#f8ecd9,#ecd7bb);min-height:100vh}
.app{width:min(1440px,100%);margin:auto;padding:16px clamp(12px,3vw,36px) 44px}
button{font-family:inherit}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.brand{border:0;background:transparent;padding:0;cursor:pointer;color:inherit}
.brand-bone{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(#fff6e5,#f8dfb8);border:3px solid #d9b47f;border-radius:999px;padding:9px 22px;font-weight:900;box-shadow:0 5px 0 #b78955;letter-spacing:.2px}
.brand-bone strong{font-size:1.25em}.brand-paw{font-size:1.1rem}
.top-actions{display:flex;align-items:center;gap:9px}.monthly-chip{font-size:.72rem;font-weight:1000;letter-spacing:.08em;color:#6e4327;background:#fff1cf;border:2px solid #d5aa72;padding:9px 13px;border-radius:999px}
.icon-btn,.back-btn,.primary-btn,.secondary-btn{font:inherit;cursor:pointer;border:0;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}
.icon-btn:active,.back-btn:active,.primary-btn:active,.secondary-btn:active{transform:translateY(2px)}
.icon-btn{width:46px;height:46px;border-radius:14px;background:var(--choc);color:#fff;border:2px solid rgba(255,255,255,.16);box-shadow:0 5px 0 #2f1b11;font-weight:900}
.screen{display:none}.screen.active{display:block}
.hero-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);min-height:620px;background:linear-gradient(135deg,#fff6e4,#f6d8a8);border:3px solid #d5ae77;border-radius:34px;overflow:hidden;box-shadow:var(--shadow);position:relative}
.hero-card:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,#b9854a 2px,transparent 2.5px);background-size:44px 44px;opacity:.07;pointer-events:none}
.hero-copy{padding:clamp(30px,5vw,68px);display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.eyebrow{font-size:.76rem;letter-spacing:.14em;font-weight:1000;color:#99642f}
.hero-copy h1{font-size:clamp(3.1rem,7.2vw,6.8rem);line-height:.84;letter-spacing:-.055em;margin:14px 0 20px;color:var(--choc);text-shadow:0 4px 0 #fff3d8}
.gold{color:var(--gold2);text-shadow:0 3px 0 #6e3c20}
.hero-copy p{font-size:clamp(1.03rem,2vw,1.28rem);max-width:570px;line-height:1.5}
.hero-art{position:relative;min-height:430px;background:#d2a26f}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;filter:saturate(.98) contrast(1.02)}
.hero-art:after{content:"";position:absolute;inset:0;box-shadow:inset 25px 0 45px rgba(80,44,22,.18)}
.home-actions,.result-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.primary-btn{background:linear-gradient(#ffd863,#f2a429);color:#4b2a17;font-weight:1000;font-size:1.05rem;border-radius:18px;padding:15px 26px;box-shadow:0 6px 0 #a65b22;border:2px solid #fff2b7}
.primary-btn:hover{filter:brightness(1.03)}
.secondary-btn,.back-btn{background:var(--cream);color:var(--choc);font-weight:900;border-radius:16px;padding:13px 18px;box-shadow:0 4px 0 #c6a170;border:2px solid #dfc49e}
.mini-stats{display:flex;gap:12px;margin-top:28px}.mini-stats>div{display:grid;grid-template-columns:auto auto;column-gap:8px;align-items:center;background:rgba(255,255,255,.58);border:2px solid rgba(111,72,35,.14);border-radius:18px;padding:12px 15px;min-width:145px}
.mini-stats span{grid-row:1/3;font-size:1.5rem}.mini-stats strong{font-size:1.05rem}.mini-stats small{color:var(--muted)}
.evolving-note{margin-top:18px;max-width:520px;background:#fff7e8;border-left:5px solid var(--gold2);padding:11px 14px;border-radius:12px;color:#6b4c36;font-size:.9rem}
.tagline{text-align:center;color:#76553e;font-weight:800;margin:18px 0 0}
.section-heading{display:flex;align-items:center;gap:20px;margin:10px 0 22px}.section-heading h2{font-size:clamp(1.9rem,4vw,3.2rem);margin:4px 0;color:var(--choc)}.section-heading p{margin:3px 0;color:var(--muted)}
.phase-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.phase-card{position:relative;background:#fff6e6;border:3px solid #d8b483;border-radius:22px;padding:10px;box-shadow:0 6px 0 #c09a68;transition:transform .16s ease,filter .16s ease;text-align:left;color:inherit}
button.phase-card{cursor:pointer}.phase-card:hover:not(.locked){transform:translateY(-3px);filter:brightness(1.01)}
.phase-card.locked{filter:grayscale(.9);opacity:.62;cursor:not-allowed}
.phase-thumb{position:relative}.phase-card img{width:100%;aspect-ratio:4/5;border-radius:14px;object-fit:cover;object-position:center;display:block;background:#ead5b4}
.phase-card h3{margin:10px 6px 4px;font-size:1rem}.phase-card .phase-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 6px 5px;color:#8a6c55;font-size:.77rem}.phase-card .stars{letter-spacing:1px;color:#dda72e}
.phase-card .lock{position:absolute;inset:10px 10px 57px;border-radius:14px;background:rgba(66,42,28,.5);display:grid;place-items:center;font-size:2.5rem}
.new-badge{position:absolute;top:9px;right:9px;background:#f0a72d;color:#4b2817;border:2px solid #fff1b8;border-radius:999px;padding:6px 9px;font-size:.68rem;font-weight:1000;box-shadow:0 3px 0 #9c5b23}
.coming-soon{display:flex;min-height:310px;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-style:dashed;background:rgba(255,247,231,.63);box-shadow:none}.coming-soon .soon-icon{font-size:3rem}.coming-soon p{margin:4px 0 12px;color:var(--muted)}.coming-soon>span{font-size:.72rem;letter-spacing:.12em;font-weight:1000;color:#99642f}
.monthly-banner{margin-top:24px;border:3px solid #d7b07b;background:linear-gradient(90deg,#fff5df,#f3d7aa);border-radius:22px;padding:18px 22px;display:flex;align-items:center;gap:14px;color:#64442e}.monthly-banner>span{font-size:2.2rem}
.game-hud{display:grid;grid-template-columns:auto 1fr auto auto auto;gap:10px;align-items:center;background:var(--choc);color:#fff;border-radius:20px;padding:10px 12px;box-shadow:0 6px 0 #2e1b12}
.phase-pill{display:flex;align-items:center;gap:9px;min-width:0}.phase-pill strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-stat{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);border-radius:13px;padding:10px 12px;white-space:nowrap}.pause-btn{background:#db7a32}
.instruction{text-align:center;color:#735239;margin:20px 0 14px}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.scene-wrap{position:relative;background:#fff5e3;padding:8px;border:3px solid #d7b381;border-radius:24px;box-shadow:0 8px 0 #b88f61;overflow:hidden;cursor:crosshair;touch-action:manipulation}.scene-wrap img{display:block;width:100%;height:auto;border-radius:16px;user-select:none;-webkit-user-drag:none}
.scene-label{position:absolute;left:18px;bottom:18px;background:rgba(76,46,29,.88);color:white;padding:7px 11px;border-radius:999px;font-size:.75rem;font-weight:900;pointer-events:none}
.marker-layer{position:absolute;inset:8px;pointer-events:none}.marker{position:absolute;width:clamp(30px,5.4vw,68px);height:clamp(30px,5.4vw,68px);border:4px solid #f2bb31;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 3px rgba(255,255,255,.95),0 5px 14px rgba(54,32,18,.25);animation:pop .25s ease-out}.marker:after{content:"🐾";position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(.8rem,1.7vw,1.35rem)}
@keyframes pop{from{transform:translate(-50%,-50%) scale(.3);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
.game-footer{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin-top:18px}.paw-progress{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}.paw{font-size:1.45rem;filter:grayscale(1);opacity:.28;transition:.2s}.paw.found{filter:none;opacity:1;transform:scale(1.08)}
.mobile-tip{text-align:center;margin-top:12px;color:#8b705a;font-size:.8rem;display:none}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#3c281d;color:#fff;padding:12px 18px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s;z-index:30;font-weight:800;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.scene-wrap.miss{animation:shake .22s}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.result-screen{padding:20px 0}.result-card{max-width:900px;margin:10px auto;background:linear-gradient(#fff4d9,#f5d7a5);border:4px solid #d3a567;border-radius:34px;box-shadow:var(--shadow);position:relative;overflow:hidden;display:grid;grid-template-columns:.9fr 1.1fr}
.result-art{min-height:520px;background:#d6a669}.result-art img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}.result-content{padding:clamp(24px,4vw,44px);text-align:center;display:flex;flex-direction:column;justify-content:center}
.celebrate{font-size:2rem}.result-card h2{font-size:clamp(2rem,5vw,3.7rem);line-height:1;margin:14px auto;max-width:620px}.result-content>p{color:#76563f;font-weight:800}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.result-stats div{background:rgba(255,255,255,.65);border:2px solid #d8b683;border-radius:18px;padding:14px}.result-stats small{display:block;color:#80654f}.result-stats strong{font-size:1.3rem}.result-actions{justify-content:center}
.modal-backdrop,.pause-overlay{position:fixed;inset:0;background:rgba(46,28,18,.72);display:grid;place-items:center;padding:20px;z-index:40}.modal-backdrop[hidden],.pause-overlay[hidden]{display:none}
.modal,.pause-card{position:relative;width:min(560px,100%);background:#fff2dc;border:4px solid #d6b07b;border-radius:30px;padding:30px;box-shadow:0 25px 80px rgba(0,0,0,.3)}.modal h2{font-size:2.2rem;margin:6px 0 18px}.modal-close{position:absolute;right:16px;top:14px;border:0;background:#e69b3d;color:#4d2d1a;width:42px;height:42px;border-radius:50%;font-size:1.7rem;font-weight:900;cursor:pointer}
.rules{list-style:none;padding:0;margin:0 0 24px}.rules li{display:flex;align-items:flex-start;gap:14px;padding:12px 0;border-bottom:1px solid #dfc39f}.rules li span{font-size:1.4rem}.rules p{margin:0;line-height:1.45}.pause-card{text-align:center}.pause-card>span{font-size:4rem}.pause-card h2{font-size:2.2rem}
.hint-ring{position:absolute;border:5px dashed #72b164;border-radius:50%;transform:translate(-50%,-50%);width:86px;height:86px;animation:pulse 1s infinite;pointer-events:none}@keyframes pulse{50%{transform:translate(-50%,-50%) scale(1.12);opacity:.55}}
@media(max-width:1100px){.phase-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:980px){
  .hero-card{grid-template-columns:1fr;min-height:0}.hero-art{height:430px;order:-1}.hero-copy{padding:30px}
  .phase-grid{grid-template-columns:repeat(3,1fr)}.game-hud{grid-template-columns:auto 1fr auto auto}.game-hud .hud-stat:nth-of-type(2){display:none}
  .compare-grid{grid-template-columns:1fr}.scene-wrap{cursor:pointer}.scene-label{bottom:14px}.mobile-tip{display:block}
  .game-footer{grid-template-columns:1fr 1fr}.paw-progress{grid-column:1/-1;grid-row:1}.game-footer .secondary-btn{width:100%}
  .result-card{grid-template-columns:1fr}.result-art{min-height:330px;max-height:390px}
}
@media(max-width:680px){.monthly-chip{display:none}.phase-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){
  .app{padding:10px 10px 30px}.topbar{margin-bottom:10px}.brand-bone{padding:8px 14px;font-size:.82rem}.icon-btn{width:43px;height:43px}
  .hero-card{border-radius:24px}.hero-art{height:330px}.hero-copy{padding:24px}.hero-copy h1{font-size:3.45rem}.home-actions{display:grid}.home-actions button{width:100%}
  .mini-stats{display:grid;grid-template-columns:1fr 1fr}.mini-stats>div{min-width:0;padding:10px}.phase-grid{gap:11px}.phase-card{border-width:2px;border-radius:17px}.phase-card h3{font-size:.9rem}.phase-card .phase-meta{display:block;line-height:1.4}.phase-card .stars{display:block}
  .section-heading{align-items:flex-start}.section-heading .back-btn{padding:10px}.game-hud{grid-template-columns:auto 1fr auto;padding:8px;border-radius:15px}.game-hud #gameBack{font-size:0;padding:11px}.game-hud #gameBack:after{content:"←";font-size:1rem}.game-hud .hud-stat{padding:8px}.game-hud .hud-stat:nth-of-type(1){display:flex}.pause-btn{display:none}.phase-pill strong{font-size:.85rem}
  .instruction{font-size:.92rem}.compare-grid{gap:12px}.scene-wrap{padding:5px;border-width:2px;border-radius:16px;box-shadow:0 5px 0 #b88f61}.scene-wrap img{border-radius:11px}.marker-layer{inset:5px}.scene-label{font-size:.62rem;padding:5px 8px;left:11px;bottom:10px}
  .result-stats{grid-template-columns:1fr}.result-actions{display:grid}.result-actions button{width:100%}.modal{padding:24px 18px}.toast{max-width:90%;text-align:center}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Resgate 2026-10: uma base preservada e sete regiões controladas por fase. */
[hidden]{display:none!important}
button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.rescue-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 12px}
.compact-btn{min-width:44px;min-height:44px;padding:8px 13px}
.zoom-controls{display:flex;align-items:center;gap:7px}.zoom-controls strong{min-width:44px;text-align:center}
.hint-card{margin:0 0 12px;padding:11px 14px;border:2px solid #e5bc63;border-radius:14px;background:#fff4cb;color:#5c371f}
.hint-card span{display:block;color:#a95617;font-size:.72rem;font-weight:1000;letter-spacing:.08em}.hint-card strong{display:block;margin-top:2px}.hint-card p{margin:3px 0 0}
.scene-panel{margin:0;min-width:0}.scene-panel figcaption,.blink-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 7px 7px;color:#654631}.scene-panel figcaption span,.blink-heading span{font-size:.76rem;color:var(--muted)}
.scene-viewport{position:relative;width:100%;height:clamp(210px,calc(100dvh - 370px),690px);overflow:auto;overscroll-behavior:contain;border:3px solid #d7b381;border-radius:20px;background:#251c17;box-shadow:0 7px 0 #b88f61;scrollbar-width:thin;touch-action:pan-x pan-y}
.scene-canvas{display:block;width:100%;height:auto;cursor:crosshair;transform-origin:top left;user-select:none;-webkit-user-drag:none}
.scene-viewport.is-fit{display:grid;place-items:center}
.scene-canvas.miss{animation:shake .22s}
.blink-area{width:min(760px,100%);margin:0 auto}.scene-viewport--blink{height:clamp(260px,calc(100dvh - 330px),760px)}
.switch-btn{display:block;width:100%;min-height:48px;margin-top:10px}
body.in-game{height:100dvh;overflow:hidden}.in-game .app{height:100dvh;padding-bottom:8px}.in-game #gameScreen.active{height:calc(100dvh - 96px);display:flex;flex-direction:column;overflow:hidden}.in-game .compare-grid{flex:1 1 auto;min-height:0;overflow:hidden}.in-game .scene-panel{display:flex;min-height:0;overflow:hidden;flex-direction:column}.in-game .scene-viewport{flex:1 1 auto;height:auto;min-height:90px}.in-game .game-footer{flex:0 0 auto}.in-game .blink-area{flex:1 1 auto;min-height:0}.in-game #gameBack{min-width:44px;min-height:44px}

html[data-theme="night"]{--ink:#fff1db;--muted:#c7ae96;--cream:#30241c;--cream2:#3d2d21;--white:#251c16;color-scheme:dark;background:#120f0d}
html[data-theme="night"] body{background:radial-gradient(circle at 15% 0,#33251a 0 18%,transparent 42%),radial-gradient(circle at 85% 15%,#2a1d14 0 10%,transparent 36%),linear-gradient(180deg,#18120e,#0f0c0a);color:var(--ink)}
html[data-theme="night"] .brand-bone,html[data-theme="night"] .hero-card,html[data-theme="night"] .phase-card,html[data-theme="night"] .monthly-banner,html[data-theme="night"] .result-card,html[data-theme="night"] .modal,html[data-theme="night"] .pause-card{background:#2b211a;color:var(--ink);border-color:#805c39}
html[data-theme="night"] .hero-copy h1,html[data-theme="night"] .section-heading h2{color:#ffe2b2;text-shadow:none}
html[data-theme="night"] .hero-copy p,html[data-theme="night"] .section-heading p,html[data-theme="night"] .instruction,html[data-theme="night"] .tagline,html[data-theme="night"] .mobile-tip,html[data-theme="night"] .result-content>p{color:#cbb29a}
html[data-theme="night"] .evolving-note,html[data-theme="night"] .mini-stats>div,html[data-theme="night"] .result-stats div,html[data-theme="night"] .hint-card{background:#35271e;color:#f4ddc4;border-color:#8b6037}
html[data-theme="night"] .secondary-btn,html[data-theme="night"] .back-btn{background:#30241c;color:#ffe6c0;border-color:#805c39;box-shadow:0 4px 0 #130d09}
html[data-theme="night"] .scene-panel figcaption,html[data-theme="night"] .blink-heading{color:#f6dcc0}

@media(max-width:980px){.scene-viewport{height:clamp(220px,43vh,620px)}}
@media(max-width:700px){
  body.in-game{height:100dvh;overflow:hidden}.in-game .topbar{display:none}.in-game .app{height:100dvh;padding:5px 7px}.in-game #gameScreen.active{height:calc(100dvh - 10px);display:flex;flex-direction:column;overflow:hidden}
  .game-hud{flex:0 0 auto}.instruction{flex:0 0 auto;margin:9px 0 7px;line-height:1.2}.rescue-tools{flex:0 0 auto;margin-bottom:7px}.rescue-tools>.secondary-btn{font-size:.78rem;padding-inline:9px}.zoom-controls{gap:4px}.zoom-controls .compact-btn{padding:7px 10px}.zoom-controls strong{min-width:34px;font-size:.8rem}
  .blink-area{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.blink-area[hidden]{display:none!important}.blink-heading{flex:0 0 auto;padding-bottom:4px}.scene-viewport--blink{flex:1 1 auto;height:auto;min-height:170px}.switch-btn{flex:0 0 46px;margin-top:7px;padding:8px}
  .compare-grid{flex:1 1 auto;min-height:0;grid-template-columns:1fr 1fr;gap:7px;overflow:hidden}.scene-panel{display:flex;min-height:0;overflow:hidden;flex-direction:column}.scene-panel figcaption{font-size:.72rem}.scene-panel figcaption span{display:none}.compare-grid .scene-viewport{flex:1 1 auto;height:auto;min-height:80px;border-width:2px;border-radius:13px}
  .game-footer{position:relative;z-index:2;flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px;background:inherit}.game-footer .paw-progress{display:none}.game-footer .secondary-btn{min-height:44px;padding:8px;font-size:.8rem}.mobile-tip{display:none}.hint-card{position:relative;z-index:2;flex:0 0 auto;margin-bottom:7px;padding:7px 10px;font-size:.78rem}.hint-card p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:620px){
  .game-hud{grid-template-columns:44px minmax(0,1fr) auto auto auto;gap:5px}
  .game-hud .hud-stat.found-stat,.game-hud .hud-stat.timer-stat{display:flex!important;padding:7px 6px;font-size:.76rem}
  .game-hud .hud-stat span{display:none}.game-hud .pause-btn{display:block!important;width:44px;height:44px}.phase-pill{gap:4px}.phase-pill strong{font-size:.74rem}
}
@media(max-height:500px) and (orientation:landscape){
  body.in-game{height:100dvh;overflow:hidden}.in-game .topbar{display:none}.in-game .app{height:100dvh;padding:3px 7px}.in-game #gameScreen.active{height:calc(100dvh - 6px);display:flex;flex-direction:column;overflow:hidden}
  .instruction{margin:6px 0}.rescue-tools{margin-bottom:5px}.compare-grid{flex:1 1 auto;min-height:0;grid-template-columns:1fr 1fr;overflow:hidden}.scene-panel{display:flex;flex-direction:column;min-height:0;overflow:hidden}.scene-viewport{flex:1 1 auto;height:auto;min-height:80px}.game-footer{margin-top:7px}.game-footer .paw-progress{display:none}.mobile-tip{display:none}
}

/* 22/10/2026 — Claude: cena inteira visível em qualquer tela, preferências na partida e ajustes finos */
.rescue-tools{flex-wrap:wrap}
.game-prefs{display:flex;gap:6px}
.icon-compact{min-width:44px;padding-left:0;padding-right:0}
.in-game .topbar{display:none}
.in-game .app{padding-top:8px}
.in-game #gameScreen.active{height:calc(100dvh - 16px)}
.in-game .compare-grid{grid-template-rows:minmax(0,1fr);align-items:stretch}
.in-game .compare-grid .scene-panel{height:100%}
.in-game .scene-viewport{min-height:0;overflow:auto}
.scene-canvas{margin:0 auto;max-width:none}
.hint-card p{white-space:normal!important;overflow:visible!important}
.toast{bottom:auto;top:12px;transform:translateX(-50%) translateY(-12px)}
.toast.show{transform:translateX(-50%) translateY(0)}
@media(max-height:820px){.in-game .instruction{display:none}}
@media(max-height:500px) and (orientation:landscape){.in-game .scene-panel figcaption{padding-bottom:3px;font-size:.7rem}}
@media(max-height:500px) and (orientation:landscape){
  .in-game #gameScreen.active{display:grid!important;grid-template-columns:minmax(0,1fr) 188px;grid-template-rows:auto minmax(0,1fr) auto;column-gap:8px;row-gap:6px}
  .in-game .game-hud{grid-column:1/-1;grid-row:1;padding:5px 8px}
  .in-game .instruction,.in-game .mobile-tip{display:none}
  .in-game .compare-grid,.in-game .blink-area{grid-column:1;grid-row:2/4;min-height:0;height:100%;margin:0}
  .in-game .rescue-tools{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:6px;margin:0;overflow:auto}
  .in-game .rescue-tools>.secondary-btn,.in-game .game-prefs{width:100%}
  .in-game .zoom-controls{justify-content:space-between}
  .in-game .game-prefs{justify-content:space-between}
  .in-game .game-prefs .icon-compact{flex:1}
  .in-game .hint-card{grid-column:1;grid-row:2;align-self:start;justify-self:center;z-index:4;max-width:min(360px,92%);margin:6px 0 0;padding:6px 10px;font-size:.72rem;box-shadow:0 4px 14px rgba(0,0,0,.25);pointer-events:none}
  .in-game .game-footer{grid-column:2;grid-row:3;grid-template-columns:1fr 1fr;gap:6px;margin:0}
  .in-game .game-footer .paw-progress{display:none}
  .in-game .scene-panel figcaption{display:none}
  .in-game .blink-area:not([hidden]){display:flex;flex-direction:column;width:100%}
  .in-game .blink-heading{display:none}
  .in-game .scene-viewport--blink{flex:1 1 auto;height:auto;min-height:0}
  .in-game .switch-btn{min-height:44px;margin-top:6px;padding:6px}
  .in-game .rescue-tools{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start}
  .in-game .zoom-controls,.in-game .game-prefs{display:contents}
  .in-game #modeBtn{grid-column:1/-1}
  .in-game .rescue-tools .compact-btn{min-height:44px;padding:4px 2px;font-size:.74rem}
  .in-game #zoomLabel{align-self:center;text-align:center}
  .in-game .game-footer{grid-template-columns:1fr}
  .in-game .game-footer .secondary-btn{min-height:44px;padding:6px;font-size:.78rem}
  .in-game .game-hud{grid-template-columns:auto 1fr auto auto auto}
  .in-game .game-hud .hud-stat{display:flex!important}
}
.pause-prefs{display:flex;justify-content:center;gap:10px;margin:0 0 14px}.pause-prefs .secondary-btn{min-width:56px;min-height:48px;font-size:1.2rem}
@media(max-width:700px) and (orientation:portrait){.in-game .game-prefs{display:none}}

/* Integração Clube do Salsicha Games — Codex, 22/10/2026. */
.brand{text-decoration:none}.brand-bone>span:last-child{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}.brand-bone small{margin-top:4px;font-size:.55rem;letter-spacing:.16em;color:#8b5b37}.header-stat{display:grid;min-width:84px;padding:6px 11px;border:2px solid #d5aa72;border-radius:14px;background:#fff1cf;text-align:center;color:#6e4327}.header-stat small{font-size:.58rem;letter-spacing:.12em;font-weight:1000}.header-stat strong{font-size:.88rem}
.game-guide{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:16px;margin:24px 0 4px}.game-guide>div{padding:20px 22px;border:2px solid #d8b483;border-radius:20px;background:rgba(255,246,230,.82);box-shadow:0 5px 0 rgba(184,143,97,.7)}.game-guide h2,.game-guide h3{margin:5px 0 8px;color:var(--choc)}.game-guide h2{font-size:1.55rem}.game-guide h3{font-size:1.05rem}.game-guide p{margin:0;line-height:1.55;color:#735239}
#gameScreen{position:relative}.mascot-hud{position:absolute;z-index:8;left:10px;bottom:66px;width:190px;display:flex;align-items:center;gap:4px;padding:5px 9px 5px 2px;border:2px solid #d7aa63;border-radius:18px;background:rgba(255,247,229,.94);box-shadow:0 5px 18px rgba(52,30,17,.2);pointer-events:none;transition:transform .18s ease}.mascot-sprite{flex:0 0 82px;width:82px;height:46px;background-image:url(../shared/assets/dachshund/poses-v2.png);background-repeat:no-repeat;background-size:246px 82px;background-position:0 0}.mascot-hud>span:last-child{font-size:.69rem;font-weight:900;line-height:1.15;color:#62412d}.mascot-hud[data-mood="happy"]{transform:translateY(-5px)}.mascot-hud[data-mood="happy"] .mascot-sprite{background-position:-82px 0}.mascot-hud[data-mood="confused"] .mascot-sprite{background-position:-164px 0}
.result-card{max-width:1080px;grid-template-columns:.75fr 1.25fr}.result-content{justify-content:flex-start}.result-ranking{margin-top:24px;padding:17px;border:2px solid #d5aa72;border-radius:20px;background:rgba(255,255,255,.5);text-align:left}.ranking-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.ranking-heading h3{margin:3px 0;font-size:1.18rem}.ranking-heading>span{padding:6px 10px;border-radius:999px;background:var(--choc);color:#fff;font-size:.75rem;font-weight:900}.ranking-list{display:grid;gap:6px;margin:13px 0;padding:0;list-style:none}.ranking-list li{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:8px;padding:8px 10px;border-radius:11px;background:rgba(255,255,255,.62)}.ranking-list li>span{color:#9d642f;font-weight:1000}.ranking-list li>b{font-variant-numeric:tabular-nums}.ranking-list .ranking-empty{display:block;color:#76563f;text-align:center}.ranking-form label{display:block;margin-bottom:5px;font-size:.72rem;font-weight:1000;letter-spacing:.08em}.ranking-form>div{display:flex;gap:8px}.ranking-form input{min-width:0;flex:1;border:2px solid #c99d65;border-radius:13px;padding:11px 12px;background:#fffdf8;color:#3d291e;font:inherit}.ranking-form button{padding:9px 12px;font-size:.72rem}.ranking-form p{min-height:1.2em;margin:8px 0 0;color:#76563f;font-size:.76rem;font-weight:800}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px max(18px,calc((100% - 940px)/2));border-top:1px solid #d8b78d;background:rgba(255,248,236,.84);color:#64442e;font-size:.75rem;font-weight:800}.site-footer a{color:inherit;text-decoration:none}.site-footer>a{font-weight:1000}.site-footer nav{display:flex;gap:10px}.site-footer nav a+a:before{content:"·";margin-right:10px}
html[data-theme="night"] .header-stat,html[data-theme="night"] .game-guide>div,html[data-theme="night"] .mascot-hud,html[data-theme="night"] .result-ranking{background:#30241c;color:var(--ink);border-color:#805c39}html[data-theme="night"] .game-guide h2,html[data-theme="night"] .game-guide h3{color:#ffe2b2}html[data-theme="night"] .game-guide p,html[data-theme="night"] .mascot-hud>span:last-child,html[data-theme="night"] .ranking-form p{color:#cbb29a}html[data-theme="night"] .ranking-list li{background:#251b15}html[data-theme="night"] .ranking-form input{background:#1d1612;color:#fff1db;border-color:#805c39}html[data-theme="night"] .site-footer{background:#17110d;color:#e8d0b8;border-color:#5b402b}
@media(max-width:980px){.game-guide{grid-template-columns:1fr}.result-card{grid-template-columns:1fr}.result-content{justify-content:center}}
@media(max-width:700px){.header-stat{display:none}.brand-bone strong{font-size:.95rem}.brand-bone small{font-size:.46rem}.mascot-hud{left:6px;bottom:57px;width:150px;padding:3px 6px 3px 0}.mascot-sprite{flex-basis:64px;width:64px;height:38px;background-size:192px 64px}.mascot-hud[data-mood="happy"] .mascot-sprite{background-position:-64px 0}.mascot-hud[data-mood="confused"] .mascot-sprite{background-position:-128px 0}.mascot-hud>span:last-child{font-size:.59rem}.site-footer{flex-direction:column;text-align:center;gap:8px}.result-ranking{padding:12px}.ranking-form>div{display:grid}.ranking-form button{min-height:44px}}
@media(max-height:500px) and (orientation:landscape){.mascot-hud{left:auto;right:7px;bottom:58px;width:178px}.mascot-hud>span:last-child{font-size:.62rem}}

/* 22/10/2026 — Claude: mascote sem cobrir botões, patinhas, revisão dos 7 erros, acessibilidade e animações */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mascot-hud.is-inline{position:static;flex:0 1 auto;width:auto;max-width:64%;margin-left:auto;padding:1px 8px 1px 0;border-width:1px;border-radius:12px;box-shadow:none;transform:none!important;gap:2px}
.mascot-hud.is-inline .mascot-sprite{flex:0 0 46px;width:46px;height:27px;background-size:138px 46px}
.mascot-hud.is-inline[data-mood="happy"] .mascot-sprite{background-position:-46px 0}
.mascot-hud.is-inline[data-mood="confused"] .mascot-sprite{background-position:-92px 0}
.mascot-hud.is-inline>span:last-child{font-size:.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blink-heading:has(.mascot-hud.is-inline)>span:not(.mascot-hud):not(.mascot-sprite),.scene-panel figcaption:has(.mascot-hud.is-inline)>span:not(.mascot-hud):not(.mascot-sprite){display:none}
.blink-heading,.scene-panel figcaption{min-width:0}
.result-paws{display:flex;flex-direction:column;align-items:center;gap:2px;margin:4px 0 0}
.paws-big{font-size:2rem;letter-spacing:.12em;color:#dda72e}
.result-paws small{color:#80654f;font-weight:800;font-size:.8rem}
.review-btn{margin:14px auto 0;display:block}
.review-panel{margin-top:16px;padding:14px;border:2px solid #d5aa72;border-radius:20px;background:rgba(255,255,255,.55);text-align:left}
.review-panel h3{margin:0 0 2px;font-size:1.1rem}.review-help{margin:0 0 10px;color:#76563f;font-size:.8rem;font-weight:800}
.review-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:12px;align-items:start}
.review-scene{width:100%;height:auto;border-radius:12px;cursor:pointer;display:block}
.review-zoom{width:100%;height:auto;border-radius:12px;display:block}
.review-caption{margin:6px 0 8px;font-weight:900}
.review-list{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.review-list button{width:100%;min-height:44px;display:flex;align-items:center;gap:9px;padding:6px 9px;border:2px solid #d8b683;border-radius:12px;background:#fffaf0;color:#4b3122;font:inherit;font-size:.82rem;font-weight:800;text-align:left;cursor:pointer}
.review-list button b{flex:0 0 26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#e1782f;color:#fff;font-size:.8rem}
.review-list button[aria-current="true"]{border-color:#e1782f;background:#ffe9cf}
html[data-theme="night"] .review-panel{background:#30241c;border-color:#805c39}html[data-theme="night"] .review-list button{background:#3a2b21;color:#f4ddc4;border-color:#805c39}html[data-theme="night"] .review-help,html[data-theme="night"] .result-paws small{color:#cbb29a}
@media(max-width:700px){.review-grid{grid-template-columns:1fr}}
.confetti-layer{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}
.confetti-paw{position:fixed;font-size:18px;transform:translate(-50%,-50%);animation:pawburst .7s ease-out forwards}
@keyframes pawburst{0%{opacity:1;transform:translate(-50%,-50%) scale(.6)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--rot)) scale(1.1)}}
.paw.pop{animation:pawpop .45s ease-out}
@keyframes pawpop{0%{transform:scale(.4)}60%{transform:scale(1.45)}100%{transform:scale(1.08)}}
#foundCounter.bump{display:inline-block;animation:bump .4s ease-out}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.35);color:#ffd34d}100%{transform:scale(1)}}
kbd{display:inline-block;min-width:1.6em;padding:0 5px;border:1px solid #c99d65;border-bottom-width:2px;border-radius:5px;background:#fffaf0;color:#3d291e;font:inherit;font-size:.8em;text-align:center}
@media(prefers-reduced-motion:reduce){.confetti-paw,.paw.pop,#foundCounter.bump{animation:none}}
.scene-panel figcaption .mascot-hud.is-inline>span{display:block}
.mascot-hud.is-inline.in-tools{margin:0 auto 0 10px;max-width:260px}
@media(max-height:500px) and (orientation:landscape){.in-game .mascot-hud.is-inline.in-tools{grid-column:1/-1;margin:0;max-width:none;justify-self:stretch}}
