:root {color-scheme:dark;--navy:#090f1d;--panel:#142139;--gold:#ffce6a;--ivory:#f6f5f0;--muted:#acb8c9;--red:#f15f69;--green:#43d6b5;--theme:var(--red);font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(ellipse at 50% 0,#1b2945,#080c16 70%);color:var(--ivory)}body{touch-action:pan-y}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}.hidden{display:none!important}
.shell{min-height:100dvh;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:10px 12px;gap:8px}.topbar{width:min(100%,430px,calc(100dvh * .527));display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:10px;font-weight:800;letter-spacing:1.5px}.topbar a{color:#d8e4f5;text-decoration:none;padding:7px 0}.topbar span{color:var(--muted)}.topbar strong{color:var(--gold)}.device{width:min(100%,430px,calc(100dvh * .527));aspect-ratio:390/740;position:relative;isolation:isolate;overflow:hidden;background:#0b1321;border-radius:26px;border:1px solid #33415a;box-shadow:0 22px 95px #0009,0 0 0 2px #ffffff0a;touch-action:none}.device.team22{--theme:var(--green)}.scene-decoration{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,#070e21ab 35%,#060b17 72%),url('../media/scene_castelo.jpg') center/cover;opacity:.34}.scene-decoration:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 5%,#e1bf6640,transparent 45%)}
.start-screen{position:absolute;inset:0;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;padding:clamp(13px,3.4%,23px);gap:clamp(6px,1vh,12px);background:linear-gradient(180deg,#08102070,#0a1020e0 75%);touch-action:pan-y}.game-brand{text-align:center;margin-bottom:2px}.eyebrow{font-size:clamp(9px,2.3vw,11px);font-weight:900;color:var(--gold);letter-spacing:2px}.signal{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 12px var(--green)}h1{font-family:'Arial Narrow',Impact,'Barlow Condensed',sans-serif;line-height:.98;letter-spacing:-.5px;font-size:clamp(29px,9.8vw,48px);font-weight:900;margin:9px 0 0;text-shadow:0 3px 0 #07101f,0 5px 20px #000}h1 em{font-style:normal;display:block;color:var(--gold);font-size:1.19em}.subtitle{font-weight:950;letter-spacing:2px;font-size:clamp(11px,3.4vw,16px);margin:7px 0 0;color:#f5f7ff}.description{font-size:12px;color:#c8d4e5;line-height:1.35;margin:6px auto 4px;max-width:330px}.campaign-picker{display:grid;grid-template-columns:1fr 1fr;gap:9px}.campaign{background:#101c32b8;color:white;border:1px solid #60718a88;display:flex;justify-content:center;gap:8px;align-items:center;padding:5px;border-radius:12px;min-height:54px}.campaign strong{font:900 30px Impact,sans-serif}.campaign small{font-size:9px;line-height:1.25;letter-spacing:.7px;text-align:left;font-weight:800}.campaign-13.selected{background:#6a232dc9;border-color:#ff7681;box-shadow:0 0 20px #c7213939}.campaign-22.selected{background:#104937c9;border-color:#56e5bd;box-shadow:0 0 20px #18d29840}.campaign:not(.selected){opacity:.72}.section-heading{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:1.3px;font-weight:850;color:#e5eaf3;margin-top:3px}.section-rule{height:1px;flex:1;background:linear-gradient(90deg,#5e708c88,transparent)}.roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-height:120px}.fighter{position:relative;border-radius:12px;border:1px solid #4e6280;background:linear-gradient(160deg,#273950,#10192c);overflow:hidden;min-height:122px;color:var(--ivory);display:flex;align-items:center;justify-content:flex-end;flex-direction:column;box-shadow:inset 0 2px 10px #ffffff0a;padding:4px}.fighter.selected{border:2px solid var(--gold);background:linear-gradient(180deg,#50401e,#151c30);box-shadow:0 0 22px #ffc96e2a}.fighter .fighter-picture{position:absolute;inset:1px 0 28px;display:flex;justify-content:center;align-items:flex-end}.fighter img{display:block;height:100%;max-width:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 4px 9px #0008)}.fighter .sprite-preview{width:54px;height:96px;background-repeat:no-repeat;background-position:0 center;background-size:600% 100%;filter:drop-shadow(0 4px 8px #0008)}.fighter .fighter-name{z-index:1;width:100%;background:linear-gradient(180deg,transparent,#060d1a 25%);padding:6px 1px 3px;font-size:13px;font-weight:900;letter-spacing:1.4px}.fighter .selected-mark{position:absolute;top:6px;right:7px;background:var(--gold);color:#101626;font-size:8px;padding:3px 5px;border-radius:5px;font-weight:950;z-index:2}.duration{display:grid;grid-template-columns:1fr 1fr;gap:9px}.duration-option{min-height:47px;color:white;border:1px solid #465670;background:#101c31d9;border-radius:10px;font-size:20px;font-weight:900}.duration-option span{font-size:9px;color:#c2cddd;margin-left:5px;letter-spacing:1px}.duration-option.selected{border-color:var(--gold);box-shadow:inset 0 0 0 1px #e7ad47;background:#4a3921b9}.primary-button,.secondary-button{width:100%;min-height:50px;border-radius:12px;border:0;font-weight:950;letter-spacing:1px;font-size:13px}.primary-button{background:linear-gradient(180deg,#ffe08c,#e9a941);box-shadow:0 5px 0 #9f6e23,0 9px 25px #0008;color:#192132}.primary-button:active{transform:translateY(3px);box-shadow:0 2px 0 #9f6e23}.secondary-button{background:#20324c;color:#f2f5ff;border:1px solid #5e7391;min-height:43px;margin-top:10px}.menu-footer{display:flex;justify-content:space-evenly;gap:8px}.text-button{background:none;border:0;color:#e1e6ee;font-size:11px;font-weight:850;letter-spacing:.7px;padding:6px}.legal{font-size:9px;line-height:1.3;color:#98a8bc;text-align:center;margin:1px auto 0;max-width:350px}.outer-footer{font-size:9px;text-align:center;letter-spacing:.85px;color:#8797b2;max-width:90%;padding:3px 0}
.game-screen{position:absolute;inset:0;touch-action:none;background:#081327}.game-screen canvas{width:100%;height:100%;display:block;touch-action:none}.game-hud{position:absolute;left:0;right:0;top:0;padding:15px 17px 5px;background:linear-gradient(180deg,#061121fa,#061121cb 70%,transparent);pointer-events:none}.hud-line{display:flex;justify-content:space-between;align-items:start;gap:5px}.hud-line>div{min-width:30%}.hud-line small,.result-stats small{display:block;font-size:10px;font-weight:800;color:#9fb0c5;letter-spacing:1.7px}.hud-line strong{font-size:27px;color:#fff;letter-spacing:.5px;font-variant-numeric:tabular-nums}.hud-center{text-align:center}.hud-right{text-align:right}.hud-right strong{font-size:20px;color:#ff7489}.timer-track{height:5px;border-radius:100px;background:#3a5065;overflow:hidden;margin-top:5px}.timer-fill{height:100%;width:0;background:var(--gold);border-radius:100px}.hud-detail{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;font-weight:850;letter-spacing:.65px;color:var(--gold);min-height:42px}.hud-detail button{pointer-events:auto;border:1px solid #5d6f86;border-radius:8px;background:#172a44;color:white;font-size:20px;min-width:43px;min-height:35px}.float-feedback{position:absolute;top:30%;left:0;right:0;text-align:center;color:var(--gold);font-size:22px;font-weight:900;text-shadow:0 3px 5px #000}.touch-hint{position:absolute;bottom:88px;left:0;right:0;color:#cbd7e7;font-weight:800;font-size:9px;letter-spacing:1px;text-align:center;pointer-events:none;opacity:.85}.game-controls{position:absolute;bottom:13px;left:0;right:0;display:flex;justify-content:space-between;padding:0 22px;pointer-events:none}.game-controls button{pointer-events:auto;touch-action:none;border:1px solid #7c8fa750;background:#14273aa8;color:#ffdf8d;border-radius:100px;width:60px;height:60px;font-size:21px;font-weight:900;user-select:none;backdrop-filter:blur(4px)}.overlay{position:absolute;inset:0;z-index:4;background:#06111ddd;display:flex;align-items:center;justify-content:center;padding:23px;overflow-y:auto}.overlay-panel{width:100%;max-width:360px;padding:28px 20px;background:linear-gradient(150deg,#293a55ed,#101a2ded);border:1px solid #62788d;border-radius:20px;text-align:center;box-shadow:0 18px 60px #000a}.overlay-panel h2{font:900 clamp(27px,9vw,39px)/1 Impact,'Arial Narrow',sans-serif;margin:14px 0 13px;letter-spacing:.5px;color:var(--gold)}.overlay-panel p{font-size:13px;color:#d1dbea;line-height:1.5}.overlay-panel .primary-button{margin-top:17px}.result-score{font:900 clamp(58px,14vw,80px) Impact,sans-serif;line-height:1.1;color:white;text-shadow:0 5px 16px #000}.result-score-label{font-weight:900;font-size:11px;letter-spacing:2px;color:var(--gold)}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:#08152b77;border:1px solid #54677a7d;border-radius:10px;padding:14px 8px;margin-top:18px}.result-stats strong{font-size:21px}.result-stats small{font-size:8px;letter-spacing:.3px}.result-copy{margin:13px 0 0}.tutorial-panel{text-align:left}.tutorial-panel>h2,.tutorial-panel>.eyebrow{text-align:center;display:block}.lesson{display:flex;gap:13px;align-items:center;margin:16px 0}.lesson span{font-size:30px;width:40px;text-align:center;flex-shrink:0}.lesson p{margin:0}.lesson strong{display:block;font-size:12px;letter-spacing:.5px;color:#ffda7b;margin-bottom:2px}
@media(max-height:630px){.shell{padding:0;gap:0}.topbar,.outer-footer{display:none}.device{width:min(100vw,calc(100dvh * .527));border-radius:0}.start-screen{gap:5px}.roster{min-height:94px}.fighter{min-height:96px}.fighter .fighter-picture{inset:0 0 24px}.game-brand .description{display:none}}
@media(max-width:350px){.start-screen{padding:11px;gap:5px}.game-brand h1{font-size:32px}.campaign small{font-size:8px}.fighter{min-height:105px}.roster{min-height:105px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Arcade 0.2 — habilidades originais, legibilidade e comandos móveis */
.ability-hint{margin:0;min-height:34px;padding:7px 9px;border-radius:9px;border:1px solid #eecb7c58;background:linear-gradient(110deg,#3a2d22c9,#132b3eae);font-size:10px;font-weight:850;line-height:1.35;color:#ffe3a9;text-align:center;letter-spacing:.25px}
.phase-pill{margin:7px auto 0;width:max-content;max-width:100%;font-size:9px;font-weight:950;letter-spacing:1.15px;color:#ffd992;text-align:center;text-shadow:0 2px 6px #000c}
.game-controls{align-items:end;gap:7px}
.game-controls .special-button{width:auto;min-width:135px;max-width:calc(100% - 146px);height:64px;padding:8px 12px;border:1px solid #b6b0ac70;border-radius:14px;background:linear-gradient(155deg,#273a53dc,#17233ade);font-size:11px;line-height:1.1;color:#d6d6df;opacity:.82;transition:box-shadow .18s,background .18s,transform .18s}
.game-controls .special-button span{display:block;font-size:11px;color:#c6af91;margin-top:4px}
.game-controls .special-button:disabled{cursor:default}
.game-controls .special-button.ready{opacity:1;background:linear-gradient(165deg,#ffe8a6,#e8a63b);border-color:#ffe8a8;box-shadow:0 0 24px #ffcf6d78;color:#152438;animation:power-pulse 1.1s ease-in-out infinite alternate}
.game-controls .special-button.ready span{color:#502d00}
.game-controls .special-button.ready:active{transform:scale(.95)}
.result-stats{grid-template-columns:repeat(4,minmax(0,1fr));padding:13px 4px}
.result-stats strong{font-size:clamp(16px,4.7vw,21px)}
.result-stats small{font-size:8px}
@keyframes power-pulse{from{box-shadow:0 0 10px #ffcf6d33}to{box-shadow:0 0 25px #ffcf6d99}}
@media(max-width:350px){.game-controls{padding:0 9px}.game-controls button:not(.special-button){width:53px;height:53px}.game-controls .special-button{min-width:125px;max-width:calc(100% - 115px)}.ability-hint{font-size:9px;padding:5px}}
@media(prefers-reduced-motion:reduce){.game-controls .special-button.ready{animation:none}}


/* Tutorial de comandos do desktop e atalho explícito da habilidade */
.desktop-howto,.desktop-ability-help{display:none}
@media (hover:hover) and (pointer:fine){
  .desktop-howto{display:block;border:1px solid #e8c27d80;border-radius:10px;background:#102636ed;color:#f4e7cb;padding:10px 12px;font-size:10.5px;line-height:1.7;margin:0;text-align:center}
  .desktop-howto strong{color:#ffdb91}
  .desktop-howto kbd,.desktop-ability-help kbd{background:#eacb8a;color:#182338;padding:3px 6px;border-radius:5px;font:900 11px system-ui;box-shadow:inset 0 -2px #ad905d;white-space:nowrap}
  .touch-hint{display:none}
  .desktop-ability-help{display:block;position:absolute;bottom:85px;left:12px;right:12px;text-align:center;color:#f6e6bc;text-shadow:0 2px 5px #000;background:#091725c8;border:1px solid #d2b5757e;padding:8px 6px;border-radius:8px;font-size:9px;line-height:1.65;font-weight:850;letter-spacing:.025em;pointer-events:none;margin:0}
}