/* Full-scene battle v3.2. The command window floats above a single continuous world. */
:root{--window-bg:rgba(13,25,49,.94);--window-line:#8b9bb9;--ink:#f4f0e7;--ink-soft:#c6cddd;--gold:#f0c477}
html,body{width:100%;height:100%;margin:0}
body{background:#0b1019;color:var(--ink);overflow:hidden;image-rendering:auto}
#gc{width:100%;height:100vh;height:100dvh;border:0;box-shadow:none;isolation:isolate;--command-height:210px;--arena-height:340px}
#bs{display:none;position:absolute;inset:0;overflow:hidden}
.battle-top{position:absolute;inset:0;display:block;overflow:hidden}
.scene{background:#222937;isolation:isolate}
.scene>div:not(.scene-stars){display:none!important}
#bg-canvas{filter:saturate(.92) brightness(.86);image-rendering:auto}
.scene::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(7,12,24,.65),transparent 32%,transparent 60%,rgba(7,12,24,.75)),radial-gradient(ellipse at 50% 45%,transparent 20%,rgba(5,10,20,.45));z-index:1}
.scene-stars{display:none}
.stage-bar{height:52px;padding:0 28px;background:rgba(9,16,28,.76);border:0;border-bottom:1px solid #8291a03b;gap:20px;z-index:10}
.stage-bar .stage-text{font-size:13px;letter-spacing:.1em;color:var(--gold);white-space:nowrap}
.stage-bar .stage-name{font-family:'Yu Gothic',Meiryo,sans-serif;font-size:12px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.stage-route{display:flex;gap:5px;align-items:center;margin-right:12px}
.stage-route i{display:block;width:18px;height:4px;background:#65708655;transform:skewX(-20deg)}
.stage-route i.done{background:#a7b5bc}.stage-route i.current{background:var(--gold);box-shadow:0 0 8px #f0c47755}
.fullscreen-btn{background:transparent;color:var(--ink-soft);border:1px solid #8393ab80;font:12px var(--pixel-font);padding:7px 12px;cursor:pointer;white-space:nowrap}
.fullscreen-btn:hover{border-color:var(--gold);color:var(--gold)}
.target-status{position:absolute;left:28px;top:76px;z-index:8;max-width:38%;min-width:220px;text-shadow:0 2px 3px #070d19}
.target-kicker,.status-kicker{font:10px var(--pixel-font);letter-spacing:.18em;color:var(--gold);margin-bottom:6px}
.monster-name-tag{padding:0;margin:0 0 10px;background:none;border:0;display:block}
.monster-name-tag span{font:600 clamp(14px,1.6vw,20px) 'Yu Gothic',Meiryo,sans-serif;color:var(--ink)}
.monster-hp-wrap{display:flex;align-items:center;gap:10px;margin:0}
.monster-hp-bar{width:180px;height:7px;background:#0c1221;border:1px solid #9aa7b14d;box-shadow:none}
.monster-hp-fill{background:#d88e73}.monster-hp-fill.low{background:#e5b965}
.monster-hp-text{font-size:11px;color:var(--ink-soft);margin:0;white-space:nowrap}
.hero-status-panel{position:absolute;top:76px;right:28px;width:220px;padding:0;border:0;z-index:8;text-shadow:0 2px 3px #070d19}
.hero-status-panel .hs-name{font-size:15px;color:var(--ink);margin-bottom:8px;overflow-wrap:anywhere}
.hero-status-panel .hs-bar{height:7px;border:1px solid #9aa7b14d;background:#0c1221}
.hero-status-panel .hs-numbers{font-size:11px;color:var(--ink-soft);margin-top:6px;text-align:right}
.hs-fill.healthy{background:#9dc7a6}.hs-fill.warning{background:#e5b965}.hs-fill.danger{background:#e08579}
.monster-area,.hero-area{bottom:calc(var(--command-height) + 35px);height:auto;z-index:3;display:flex;align-items:center;justify-content:center;transform-origin:bottom center;pointer-events:none}
.monster-area{left:11%;width:min(42vw,480px)}
.hero-area{right:12%;width:min(29vw,360px)}
.monster-area::before,.hero-area::before{content:'';position:absolute;bottom:-7px;left:15%;width:70%;height:26px;border-radius:50%;background:#05091285;filter:blur(6px);z-index:-1}
.monster-sprite{display:block;width:min(40vw,calc(var(--arena-height)*.92),430px);height:min(40vw,calc(var(--arena-height)*.92),430px);filter:drop-shadow(0 10px 2px #060b144d);image-rendering:auto}
#bs[data-tier="mid"] .monster-sprite{width:min(43vw,var(--arena-height),480px);height:min(43vw,var(--arena-height),480px)}
#bs[data-tier="boss"] .monster-sprite,#bs[data-tier="demon"] .monster-sprite{width:min(46vw,calc(var(--arena-height)*1.05),540px);height:min(46vw,calc(var(--arena-height)*1.05),540px)}
.hero-sprite{display:block;height:min(var(--arena-height),460px);width:min(calc(var(--arena-height)*.75),345px);filter:drop-shadow(0 10px 2px #060b144d);image-rendering:auto}
.hero-name-tag{display:none}
.hero-idle{animation:guardianBreath 3.5s ease-in-out infinite}.monster-idle{animation:creatureBreath 3.3s ease-in-out infinite}
@keyframes guardianBreath{50%{transform:translateY(-3px)}}
@keyframes creatureBreath{50%{transform:translateY(-5px)}}
.hero-area.damage-flash,.monster-area.damage-flash{animation:dShake .3s}
.hero-area.hero-victory{animation:vBounce .4s ease 4}
.msg-panel{position:absolute;z-index:9;top:160px;left:50%;transform:translateX(-50%);width:min(620px,64%);padding:10px 18px;border:1px solid #b9c4d040;background:rgba(11,20,36,.9);text-align:center;display:block;max-height:100px;overflow:auto}
.msg-panel:has(.msg-text:empty){display:none}
.msg-panel .msg-text{font-family:'Yu Gothic',Meiryo,sans-serif;font-size:13px;line-height:1.65;color:var(--ink);text-shadow:none;overflow-wrap:anywhere}
.msg-panel[data-result="correct"]{border-color:#a4cbae80}.msg-panel[data-result="wrong"]{border-color:#e39b8580}
.battle-bottom{position:absolute;left:24px;right:24px;bottom:max(20px,env(safe-area-inset-bottom));height:auto;z-index:12;padding:18px 22px;background:var(--window-bg);border:1px solid var(--window-line);border-radius:3px;box-shadow:inset 0 0 0 3px #071329,inset 0 0 0 4px #7185a455,0 12px 36px #03081380;display:block;max-height:55%;overflow:auto;scrollbar-width:thin}
.battle-bottom::before{display:none}
.quiz-panel{padding:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);column-gap:28px;align-items:center}
.command-heading{font-size:10px;letter-spacing:.19em;color:var(--gold);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.command-heading::before{content:'';width:16px;height:1px;background:var(--gold)}
.quiz-q{font:600 clamp(15px,1.35vw,20px)/1.65 'Yu Gothic',Meiryo,sans-serif;color:var(--ink);margin:0;min-height:0;overflow-wrap:anywhere;text-shadow:none}
.command-hint{font:11px/1.5 'Yu Gothic',Meiryo,sans-serif;color:#b8c6d8;margin-top:14px}
.quiz-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;counter-reset:choice;align-items:stretch;min-width:0}
.quiz-btn{counter-increment:choice;display:flex;align-items:center;min-width:0;min-height:56px;padding:10px 12px;border:1px solid #8295b466;background:#24365366;color:var(--ink);font:500 clamp(13px,1.1vw,16px)/1.5 'Yu Gothic',Meiryo,sans-serif;box-shadow:none;overflow-wrap:anywhere;text-align:left;transition:background .15s,border-color .15s;overflow:visible}
.quiz-btn::before{content:counter(choice,decimal-leading-zero);position:static;display:block;background:none;opacity:1;color:#b1c0d4;font:11px var(--pixel-font);width:24px;height:auto;flex-shrink:0;margin-right:8px}
.quiz-btn:hover:not(:disabled){background:#4b5c7777;border-color:var(--gold)}
.quiz-btn:hover:not(:disabled)::before{content:'▸';color:var(--gold);font-size:19px}
.quiz-btn.correct{background:#2b594b;border-color:#b0d8ba;box-shadow:none}.quiz-btn.correct::before{content:'○';background:none;color:#d5efda}
.quiz-btn.wrong{background:#613c40;border-color:#e5aaa1;box-shadow:none}.quiz-btn.wrong::before{content:'×';background:none;color:#f4c9c3}
button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.attack-effect{width:80%;height:5px;font-size:0;background:#fae4b8;box-shadow:0 0 14px #ffcc77;animation:scanStrike .5s forwards}
@keyframes scanStrike{0%{opacity:0;transform:translateX(-50%) scaleX(.1) rotate(-20deg)}35%{opacity:1;transform:translateX(-50%) scaleX(1) rotate(-20deg)}100%{opacity:0;transform:translateX(-50%) scaleX(.4) rotate(-20deg)}}
.damage-popup{font-size:30px}
#stage-transition{background:rgba(7,14,29,.9);backdrop-filter:blur(5px)}
#stage-transition .st-text{font-size:clamp(22px,4vw,40px);letter-spacing:.15em;color:var(--gold)}
#stage-transition .st-sub{font-size:15px;color:var(--ink-soft);margin-top:16px}
#equip-preview{width:108px;height:144px;border:0!important;background:transparent!important;image-rendering:auto!important}
#ts{background:linear-gradient(90deg,rgba(10,19,33,.96),rgba(10,19,33,.78) 48%,rgba(10,19,33,.35)),url("assets/backgrounds/bg01_warehouse.webp?v=4") center/cover no-repeat;align-items:stretch}
#ts::before{height:1px;background:#c5b38c66}
#ts::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 79px,#bdc8d204 80px);pointer-events:none}
.title-left{align-items:flex-start;max-width:850px;padding:clamp(28px,7vw,120px);z-index:2}
#ts h1{font-size:clamp(30px,4vw,56px);line-height:1.35;text-align:left;letter-spacing:.01em;margin:20px 0 10px;max-width:660px;overflow-wrap:normal;word-break:keep-all}
#ts h1 span{color:var(--gold)}
#ts .sub{font-size:12px;letter-spacing:.24em;color:#c8b68f;margin-bottom:36px}
.amz-logo{font-size:16px;color:var(--gold)}
.lang-toggle{margin-bottom:22px}.lang-btn{font-size:13px;padding:9px 17px;border-width:1px}
.ni-area{text-align:left;margin-bottom:18px}.ni-area label{font:13px 'Yu Gothic',Meiryo,sans-serif;color:var(--ink-soft);margin-bottom:9px}.ni-area input{font-size:16px;text-align:left;width:280px;padding:12px 14px;border:1px solid #8796ae;background:#0d1728aa}
.start-btn{font-size:16px;padding:14px 36px;background:var(--gold);letter-spacing:.08em}.start-btn:hover{transform:none;background:#f5d79e}
.title-art{position:absolute;right:5%;bottom:4%;width:min(41vw,610px);height:85%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 20px 30px #030a1966);pointer-events:none}
.title-version{bottom:20px;left:28px;right:auto;font-size:10px;color:#93a2b3}
#cs{background:linear-gradient(rgba(9,24,31,.82),rgba(9,24,31,.86)),url("assets/backgrounds/bg04_greenyard.webp?v=4") center/cover no-repeat}
#go h1,#cs h1{font-size:clamp(28px,4vw,48px)}
#go p,.clear-msg{font:16px/1.8 'Yu Gothic',Meiryo,sans-serif;color:var(--ink-soft)}
.btn-amz,.btn-outline{font-size:14px;padding:14px 26px}
@media(min-width:1500px){.battle-bottom{left:5%;right:5%;bottom:28px;padding:24px 30px}.quiz-btn{min-height:68px}.quiz-q{font-size:22px}.quiz-panel{column-gap:48px}.msg-panel{top:176px}}
@media(max-width:900px){.stage-bar{padding:0 18px}.target-status{left:18px;min-width:185px}.hero-status-panel{right:18px;width:180px}.monster-area{left:6%;width:44vw}.hero-area{right:7%;width:30vw}.stage-route{display:none}.battle-bottom{left:14px;right:14px;padding:16px}.quiz-panel{column-gap:18px;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr)}.quiz-btn{font-size:13px;padding:9px;min-height:55px}.quiz-btn::before{width:17px;margin-right:6px}.msg-panel{width:75%;top:155px}.title-art{right:0;opacity:.75}.title-left{padding:7vw}.title-left>*{position:relative}.ni-area,.lang-toggle{z-index:3}}
@media(max-width:600px) and (orientation:portrait){
.stage-bar{height:44px;padding:0 14px;gap:12px}.stage-bar .stage-text{font-size:11px}.stage-bar .stage-name{font-size:10px}.fullscreen-btn{padding:5px 7px;font-size:10px}
.target-status{top:61px;left:15px;min-width:0;max-width:52%;width:52%}.target-kicker,.status-kicker{font-size:8px;margin-bottom:6px;letter-spacing:.1em}.monster-name-tag{margin-bottom:8px}.monster-name-tag span{font-size:13px}.monster-hp-bar{width:90px;flex-shrink:1}.monster-hp-text{font-size:9px}.monster-hp-wrap{gap:7px}
.hero-status-panel{top:61px;right:15px;width:30%;padding:0}.hero-status-panel .hs-name{font-size:12px;margin-bottom:7px}.hero-status-panel .hs-numbers{font-size:9px}
.monster-area{left:2%!important;bottom:calc(var(--command-height) + 36px)!important;width:54vw}.hero-area{right:3%!important;bottom:calc(var(--command-height) + 30px)!important;width:35vw}
#mc.monster-sprite{width:min(53vw,var(--arena-height))!important;height:min(53vw,var(--arena-height))!important}#hc.hero-sprite{height:min(57vw,var(--arena-height))!important;width:min(42.75vw,calc(var(--arena-height)*.75))!important}
.msg-panel{top:128px;width:calc(100% - 28px);padding:8px 12px;max-height:84px}.msg-panel .msg-text{font-size:11px;line-height:1.6}
.battle-bottom{left:10px;right:10px;bottom:max(12px,env(safe-area-inset-bottom));padding:15px;max-height:52%}.quiz-panel{display:block;padding:0}.command-heading{font-size:9px;margin-bottom:7px}.quiz-q{font-size:15px;line-height:1.6}.command-hint{display:none}.quiz-grid{margin-top:14px;gap:7px}.quiz-btn{font-size:12px;min-height:58px;padding:8px}.quiz-btn::before{font-size:9px;width:15px;margin-right:4px}
#ts h1{font-size:33px;max-width:290px;margin-top:18px;word-break:normal}#ts .sub{font-size:10px;letter-spacing:.12em;margin-bottom:24px}.title-left{padding:32px 26px;justify-content:center}.title-art{right:-23%;height:68%;width:85%;bottom:0;opacity:.28}.ni-area input{width:250px}.title-left{background:linear-gradient(90deg,#111c2b88,transparent)}
}
@media(max-height:560px) and (orientation:landscape){
.stage-bar{height:36px;padding:0 15px}.stage-bar .stage-text{font-size:10px}.stage-bar .stage-name{font-size:10px}.fullscreen-btn{font-size:10px;padding:4px 8px}.stage-route i{width:12px;height:3px}
.target-status{top:49px;left:18px;min-width:180px;max-width:30%}.target-kicker,.status-kicker{font-size:8px;margin-bottom:4px}.monster-name-tag{margin-bottom:5px}.monster-name-tag span{font-size:13px}.monster-hp-text{font-size:9px}.monster-hp-bar{width:110px;height:5px}.hero-status-panel{top:49px;right:18px;width:150px}.hero-status-panel .hs-name{font-size:12px;margin-bottom:5px}.hero-status-panel .hs-numbers{font-size:9px}.hero-status-panel .hs-bar{height:5px}
.msg-panel{top:46px;width:40%;padding:6px 9px;max-height:62px}.msg-panel .msg-text{font-size:10px;line-height:1.5}
.monster-area{left:13%!important;bottom:calc(var(--command-height) + 17px)!important;width:29vw}.hero-area{right:17%!important;bottom:calc(var(--command-height) + 17px)!important;width:22vw}
#mc.monster-sprite{width:min(30vw,var(--arena-height))!important;height:min(30vw,var(--arena-height))!important}#hc.hero-sprite{height:var(--arena-height)!important;width:calc(var(--arena-height)*.75)!important}
.battle-bottom{left:12px;right:12px;bottom:8px;padding:12px 15px;max-height:48%}.quiz-panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:15px;padding:0}.command-heading{font-size:8px;margin-bottom:6px}.quiz-q{font-size:12px;line-height:1.5}.command-hint{display:none}.quiz-grid{gap:5px;margin:0}.quiz-btn{font-size:11px;min-height:40px;padding:6px 8px;line-height:1.4}.quiz-btn::before{font-size:9px;width:16px;margin-right:5px}
.title-left{padding:20px 7vw}#ts h1{font-size:30px;margin:10px 0 4px}#ts .sub{margin-bottom:15px;font-size:10px}.amz-logo{font-size:12px}.lang-toggle{margin-bottom:12px}.lang-btn{padding:5px 12px;font-size:11px}.ni-area{margin-bottom:10px}.ni-area label{font-size:11px}.ni-area input{font-size:13px;padding:8px 12px}.start-btn{font-size:13px;padding:10px 25px}.title-art{height:90%;right:4%;width:36%;opacity:.8}.title-version{font-size:8px;left:auto;right:15px;bottom:10px}
#equip-get{margin-top:8px!important}#equip-get-text{font-size:12px!important;margin-bottom:4px!important}#equip-preview{width:66px;height:88px}#equip-name{font-size:10px!important}#stage-transition .st-sub{margin-top:8px;font-size:12px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.monster-death{opacity:0}}
/* Give a 320px-wide phone enough room for all four answers without hiding row two. */
@media(max-width:350px) and (orientation:portrait){
.target-status{top:54px}.hero-status-panel{top:54px}.msg-panel{top:118px}
.battle-bottom{padding:10px 12px;max-height:56%}
.command-heading{margin-bottom:4px}.quiz-q{font-size:12px;line-height:1.35}
.quiz-grid{margin-top:6px;gap:4px}
.quiz-btn{font-size:10px;line-height:1.25;min-height:42px;padding:5px 4px}
.quiz-btn::before{font-size:8px;width:11px;margin-right:3px}
.monster-area{bottom:calc(var(--command-height) + 18px)!important}.hero-area{bottom:calc(var(--command-height) + 15px)!important}
}
/* Old width-only sprite rules must not leak into short, near-square viewports. */
@media(max-width:600px) and (orientation:landscape) and (min-height:561px){
.monster-area{left:8%!important;bottom:calc(var(--command-height) + 24px)!important;width:40vw}
.hero-area{right:9%!important;bottom:calc(var(--command-height) + 20px)!important;width:30vw}
#mc.monster-sprite{width:min(40vw,var(--arena-height))!important;height:min(40vw,var(--arena-height))!important}
#hc.hero-sprite{height:var(--arena-height)!important;width:calc(var(--arena-height)*.75)!important}
}

/* Enemy stature v3.2: actual character heights, not same-size canvas boxes. */
#bs .monster-area,#bs .hero-area{bottom:var(--scene-foot)!important;height:auto;transform-origin:bottom center}
#bs .monster-area{left:3%!important;width:50%;right:auto}
#bs .hero-area{right:7%!important;width:32%;left:auto}
#bs #mc.monster-sprite{width:var(--monster-display-width)!important;height:var(--monster-display-height)!important;max-width:none;max-height:none;flex-shrink:0}
#bs #hc.hero-sprite{width:var(--hero-display-width)!important;height:var(--hero-display-height)!important;max-width:none;max-height:none;flex-shrink:0}
#bs .monster-area::before,#bs .hero-area::before{left:50%;transform:translateX(-50%);bottom:-6px;width:calc(var(--monster-display-width)*.72);max-width:90%;height:18px}
#bs .hero-area::before{width:calc(var(--hero-display-width)*.9)}
@media(min-width:601px) and (min-height:561px){
 .msg-panel{left:auto;right:28px;transform:none;width:42%;max-width:620px}
}
@media(max-width:600px) and (orientation:landscape) and (min-height:561px){
 .msg-panel{left:auto;right:14px;transform:none;top:160px;width:43%;max-height:100px}
}
@media(max-width:600px) and (orientation:portrait){
 #bs .monster-area{left:2%!important;width:62%}
 #bs .hero-area{right:2%!important;width:28%}
}
@media(max-height:560px) and (orientation:landscape){
 #bs .monster-area{left:4%!important;width:44%}
 #bs .hero-area{right:10%!important;width:28%}
}
@media(max-width:350px) and (orientation:portrait){.msg-panel{max-height:64px}}

/* v3.4: readable battle information, with the existing midnight/gold identity. */
.stage-bar .stage-text{font-size:15px}.stage-bar .stage-name{font-size:15px}.fullscreen-btn{font-size:13px;min-height:36px}
.target-status,.hero-status-panel{top:68px;padding:13px 17px 14px;background:linear-gradient(110deg,#0b1529f5,#0b1529dc);border:1px solid #a3afc45c;border-top:2px solid #e8c184;box-shadow:0 5px 18px #050b194d;min-width:0;width:clamp(280px,28vw,400px);max-width:43%}
.hero-status-panel{border-top-color:#b4d4b6}
.target-kicker,.status-kicker{font-size:11px;line-height:1.3;letter-spacing:.12em;color:#edd0a2;margin-bottom:7px}
.monster-name-tag{margin-bottom:10px}.monster-name-tag span,.hero-status-panel .hs-name{font:700 clamp(20px,1.8vw,27px)/1.35 'Yu Gothic',Meiryo,sans-serif;color:#f8f3e8;overflow-wrap:anywhere}
.hero-status-panel .hs-name{margin-bottom:10px}
.monster-hp-wrap{gap:12px;flex-wrap:wrap}.monster-hp-bar{flex:1;min-width:60px;width:auto;height:13px;border:1px solid #c3cfdf77}
.hero-status-panel .hs-bar{height:13px;border-color:#c3cfdf77}
.monster-hp-fill{background:linear-gradient(90deg,#b8614c,#e7aa87)}.hs-fill.healthy{background:linear-gradient(90deg,#699b78,#c0dfae)}
.monster-hp-text,.hero-status-panel .hs-numbers{font:700 18px/1.2 'Yu Gothic',Meiryo,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.03em;color:#f5eee0}
.hero-status-panel .hs-numbers{margin-top:7px}.hero-status-panel #hhc{font-size:23px;color:#d5edbf}
.hero-status-panel:has(.danger){border-top-color:#f5aa9a}.hero-status-panel:has(.danger) #hhc{color:#ffb3a3}
.msg-panel{top:var(--status-message-top,210px);padding:10px 15px;max-height:108px;background:#0a162bf5;border-color:#bcc7d366}
.msg-panel .msg-text{font-size:16px;line-height:1.6}
.command-heading{font-size:12px;margin-bottom:10px}.command-hint{font-size:13px;color:#c3cddd}
.quiz-q{font-size:clamp(19px,1.65vw,26px);line-height:1.55}.quiz-btn{font-size:clamp(16px,1.4vw,21px);font-weight:600;min-height:66px;padding:12px 14px;background:#243653cc;border-color:#a1b2ca88}
.quiz-btn::before{font-size:13px;width:25px}.quiz-btn:disabled{opacity:1!important}.quiz-btn:disabled:not(.correct):not(.wrong){color:#c1cad7;background:#19273e}
#stage-transition .st-sub{font-size:21px}.clear-msg strong{font-size:1.3em}
#ts .ni-area label{font-size:15px;color:#e1e7ef}#ts .ni-area input{font-size:18px;height:54px}#ts .start-btn{font-size:16px;min-height:54px}#ts .opening-copy{font-size:17px}#ts .opening-meta{font-size:13px}
@media(max-width:900px){.target-status,.hero-status-panel{width:32%;max-width:44%;padding:11px 13px}.monster-name-tag span,.hero-status-panel .hs-name{font-size:20px}.quiz-btn{font-size:16px;padding:10px;min-height:62px}.quiz-q{font-size:19px}}
@media(max-width:600px) and (orientation:portrait){
 .stage-bar{height:44px;gap:8px}.stage-bar .stage-text{font-size:12px}.stage-bar .stage-name{font-size:11px}.fullscreen-btn{font-size:11px;min-height:30px;padding:4px 6px}
 .target-status,.hero-status-panel{top:55px;width:calc(50% - 15px);max-width:none;padding:9px 10px;min-width:0}.target-status{left:10px}.hero-status-panel{right:10px}
 .target-kicker,.status-kicker{font-size:9px;letter-spacing:.03em;margin-bottom:6px}.monster-name-tag span,.hero-status-panel .hs-name{font-size:17px;line-height:1.4}.monster-name-tag,.hero-status-panel .hs-name{margin-bottom:7px}
 .monster-hp-wrap{gap:6px}.monster-hp-bar{flex-basis:100%;height:11px}.hero-status-panel .hs-bar{height:11px}.monster-hp-text,.hero-status-panel .hs-numbers{font-size:15px;line-height:1.2}.hero-status-panel #hhc{font-size:18px}
 .msg-panel{width:calc(100% - 20px);max-height:76px;padding:7px 10px}.msg-panel .msg-text{font-size:13px;line-height:1.5}
 .battle-bottom{padding:13px;max-height:56%}.command-heading{font-size:10px;margin-bottom:6px}.quiz-q{font-size:17px;line-height:1.5}.quiz-grid{margin-top:10px;gap:7px}.quiz-btn{font-size:15px;line-height:1.4;min-height:58px;padding:9px 7px}.quiz-btn::before{font-size:11px;width:16px;margin-right:5px}
 #ts .opening-copy{font-size:15px}#ts .opening-meta{font-size:12px}#ts .ni-area label{font-size:14px}
}
@media(max-width:350px) and (orientation:portrait){
 .target-status,.hero-status-panel{padding:7px 8px}.monster-name-tag span,.hero-status-panel .hs-name{font-size:15px}.target-kicker,.status-kicker{font-size:8px}
 .battle-bottom{padding:10px;max-height:56%}.quiz-q{font-size:15px;line-height:1.4}.quiz-grid{margin-top:7px;gap:5px}.quiz-btn{font-size:13px;line-height:1.35;min-height:48px;padding:7px 5px}.quiz-btn::before{font-size:10px;width:13px;margin-right:4px}.msg-panel{max-height:54px}.msg-panel .msg-text{font-size:12px}
}
@media(max-height:560px) and (orientation:landscape){
 .stage-bar .stage-text,.stage-bar .stage-name{font-size:12px}.fullscreen-btn{font-size:11px;min-height:28px;padding:3px 7px}
 .target-status,.hero-status-panel{top:45px;width:27%;max-width:27%;padding:7px 10px}.target-status{left:12px}.hero-status-panel{right:12px}
 .target-kicker,.status-kicker{font-size:9px;margin-bottom:3px}.monster-name-tag span,.hero-status-panel .hs-name{font-size:16px;line-height:1.25}.monster-name-tag,.hero-status-panel .hs-name{margin-bottom:5px}
 .monster-hp-bar,.hero-status-panel .hs-bar{height:9px}.monster-hp-text,.hero-status-panel .hs-numbers{font-size:13px}.hero-status-panel #hhc{font-size:16px}.monster-hp-wrap{gap:6px}.monster-hp-bar{min-width:40px}
 .msg-panel{top:45px;left:50%;right:auto;transform:translateX(-50%);width:37%;max-height:73px;padding:6px 8px}.msg-panel .msg-text{font-size:12px;line-height:1.45}
 .battle-bottom{padding:10px 12px;max-height:47%}.quiz-q{font-size:15px;line-height:1.4}.quiz-btn{font-size:13px;min-height:44px;padding:7px;line-height:1.35}.quiz-btn::before{font-size:10px;width:15px}.command-heading{font-size:9px;margin-bottom:5px}.quiz-panel{gap:14px}
 #ts .opening-copy{font-size:13px}#ts .ni-area label{font-size:13px}#ts .opening-meta{font-size:11px}
}
/* Impact stays inside the world, behind text and command controls. No full-screen flash. */
.combat-fx-layer{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:hidden;--fx:#ffd38a;--fx-core:#fff0cd}
.combat-fx-layer.received{--fx:#e59e8b;--fx-core:#fbe1d8}
.strike-trail{position:absolute;height:5px;background:linear-gradient(90deg,transparent,var(--fx),var(--fx-core));box-shadow:0 0 10px var(--fx);transform-origin:0 50%;animation:bladeTravel 360ms cubic-bezier(.16,1,.3,1) both}
@keyframes bladeTravel{0%{opacity:0;transform:rotate(var(--angle)) scaleX(.04)}22%{opacity:1}70%{opacity:.9;transform:rotate(var(--angle)) scaleX(1)}100%{opacity:0;transform:rotate(var(--angle)) scaleX(1)}}
.strike-impact{position:absolute;width:var(--impact-size);height:var(--impact-size);transform:translate(-50%,-50%)}
.strike-blade{position:absolute;left:0;top:45%;width:100%;height:12%;background:var(--fx-core);clip-path:polygon(0 55%,68% 0,100% 45%,30% 100%);filter:drop-shadow(0 0 5px var(--fx));animation:crossCut 490ms 75ms cubic-bezier(.16,1,.3,1) both;--cut:-32deg}
.strike-blade.secondary{--cut:36deg;width:85%;left:8%;animation-delay:155ms}
@keyframes crossCut{0%{opacity:0;transform:rotate(var(--cut)) scaleX(.1)}20%{opacity:1;transform:rotate(var(--cut)) scaleX(1.08)}60%{opacity:1}100%{opacity:0;transform:rotate(var(--cut)) scaleX(1.15) scaleY(.1)}}
.strike-ring{position:absolute;inset:20%;border:3px solid var(--fx);border-radius:50%;animation:impactRing 540ms 90ms cubic-bezier(.16,1,.3,1) both}
@keyframes impactRing{0%{opacity:0;transform:scale(.15)}20%{opacity:.85}100%{opacity:0;transform:scale(1.65)}}
.strike-spark{position:absolute;left:50%;top:50%;width:7px;height:3px;background:var(--fx-core);animation:impactSpark 590ms 100ms cubic-bezier(.16,1,.3,1) both}
@keyframes impactSpark{0%{opacity:0;transform:translate(0,0) rotate(var(--turn))}12%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--turn))}}
.combat-fx-layer.finisher .strike-blade{height:17%}.combat-fx-layer.finisher .strike-ring{border-width:5px}
/* A new answer can arrive while the previous impact is fading; keep old layers behind the latest. */
.combat-fx-layer:not(:last-child){z-index:5}
#bs .hero-area.attack-lunge{animation:heroStrike 380ms cubic-bezier(.25,1,.5,1)}
@keyframes heroStrike{0%,100%{transform:translateX(0)}36%{transform:translateX(-19px) rotate(-3deg)}65%{transform:translateX(-11px)}}
#bs .damage-popup{font:800 clamp(27px,3vw,44px)/1 'Yu Gothic',Meiryo,sans-serif;top:0;text-shadow:0 2px 1px #071120,2px 0 #071120,-2px 0 #071120,0 0 12px #071120;animation:impactNumber 950ms cubic-bezier(.16,1,.3,1) both;color:#ffe4ad}
#bs .damage-popup.hero-dmg{color:#ffb2a3}
@keyframes impactNumber{0%{opacity:0;transform:translate(-50%,0) scale(.7)}16%{opacity:1;transform:translate(-50%,-18px) scale(1.1)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-48px) scale(1)}}
@media(prefers-reduced-motion:reduce){.combat-fx-layer{display:none}#bs .damage-popup{animation:none!important;top:-24px}.hit-flash{filter:none!important}}
/* Near-square small windows: reserve the battle arena, keep answer text fully visible. */
@media(min-width:501px) and (max-width:700px) and (min-height:561px) and (max-height:650px){
 .stage-bar{height:42px;padding:0 14px}.stage-bar .stage-text{font-size:12px}.stage-bar .stage-name{font-size:12px}.fullscreen-btn{font-size:11px;min-height:29px;padding:3px 7px}
 .target-status,.hero-status-panel{top:53px;width:30%;max-width:30%;padding:8px 10px}.target-status{left:14px}.hero-status-panel{right:14px}
 .target-kicker,.status-kicker{font-size:9px;margin-bottom:4px}.monster-name-tag span,.hero-status-panel .hs-name{font-size:16px;line-height:1.3}.monster-name-tag,.hero-status-panel .hs-name{margin-bottom:5px}
 .monster-hp-bar,.hero-status-panel .hs-bar{height:10px}.monster-hp-wrap{gap:4px}.monster-hp-text,.hero-status-panel .hs-numbers{font-size:13px}.hero-status-panel #hhc{font-size:16px}
 .msg-panel{width:43%;max-height:68px;padding:5px 8px}.msg-panel .msg-text{font-size:12px;line-height:1.4}
 .battle-bottom{left:12px;right:12px;bottom:10px;padding:11px 12px;max-height:44%}.quiz-panel{grid-template-columns:minmax(0,.85fr) minmax(0,1.45fr);gap:13px}
 .command-heading{font-size:9px;margin-bottom:5px}.command-hint{display:none}.quiz-q{font-size:14px;line-height:1.45}.quiz-grid{gap:5px}.quiz-btn{font-size:12px;line-height:1.35;min-height:42px;padding:6px}.quiz-btn::before{font-size:9px;width:13px;margin-right:4px}
}

/* v3.5: English UI uses solid lettering, not thin pixel glyphs. */
:root{--reading-font:'Trebuchet MS','Yu Gothic',Meiryo,sans-serif}
html:lang(en){--pixel-font:var(--reading-font)}
html:lang(en) :is(.quiz-q,.quiz-btn,.msg-text,.stage-name,.monster-name-tag span,.hs-name,.hs-numbers,.monster-hp-text,.clear-msg,#go p){font-family:var(--reading-font)}
.target-kicker,.status-kicker,.command-heading{font-family:var(--reading-font);font-weight:700;letter-spacing:.08em}
.target-kicker,.status-kicker{font-size:13px}.command-heading{font-size:14px}
.stage-bar .stage-text{font-family:var(--reading-font);font-weight:700}
.quiz-btn::before{font-family:var(--reading-font);font-weight:700}
html:lang(en) :is(.fullscreen-btn,.btn-amz,.btn-outline){font-weight:700}
@media(max-width:600px) and (orientation:portrait){
 .target-kicker,.status-kicker{font-size:11px}.command-heading{font-size:12px}
 html:lang(en) .quiz-q{font-size:18px}html:lang(en) .quiz-btn{font-size:16px}
}
@media(max-width:350px) and (orientation:portrait){
 html:lang(en) .quiz-q{font-size:16px}html:lang(en) .quiz-btn{font-size:14px}
}
@media(max-height:560px) and (orientation:landscape){
 .target-kicker,.status-kicker{font-size:11px;letter-spacing:.04em}.command-heading{font-size:12px}
 html:lang(en) .quiz-q{font-size:16px}html:lang(en) .quiz-btn{font-size:14px}
}
@media(min-width:501px) and (max-width:700px) and (min-height:561px) and (max-height:650px){
 .target-kicker,.status-kicker{font-size:11px}.command-heading{font-size:12px}
 html:lang(en) .quiz-q{font-size:16px}html:lang(en) .quiz-btn{font-size:14px}
}

/* Keep English answers whole; use one column on narrow portrait phones. */
html:lang(en) .quiz-btn{overflow-wrap:normal;word-break:normal}
@media(min-width:501px) and (max-width:700px) and (min-height:561px) and (max-height:650px){html:lang(en) .quiz-btn{font-size:12px;letter-spacing:-.02em}}
@media(max-width:600px) and (orientation:portrait){
 html:lang(en) .quiz-grid{grid-template-columns:minmax(0,1fr);gap:4px}
 html:lang(en) .quiz-btn{min-height:37px;padding:5px 9px}
}