.illustrated-duel{position:fixed;inset:0;z-index:45;overflow:hidden;background:radial-gradient(ellipse at 50% 70%,#23333d,#080f17 75%);color:#f1dfb3;padding:clamp(6px,1.4vh,18px) clamp(10px,2vw,26px);display:grid;place-items:stretch}.illustrated-wrap{width:min(1500px,100%);margin:0 auto;text-align:center;height:100%;display:flex;flex-direction:column;gap:clamp(2px,.8vh,10px);min-height:0}
/* 선수는 남는 높이를 전부 먹고, 그림 비율(3:4)은 그대로 둔다 */
.illustrated-wrap header{flex:none}
.illustrated-wrap header small{font-size:clamp(10px,1.1vh,13px);letter-spacing:4px;color:#bdaa80}.illustrated-wrap h2{font-size:clamp(24px,3.4vh,44px);font-weight:400;margin:clamp(2px,.7vh,10px)}.illustrated-instruction{font-size:clamp(13px,1.7vh,19px);line-height:1.5;word-break:keep-all;margin:0}.illustrated-clock{display:block;font-size:clamp(17px,2.4vh,30px);color:#ffe4a3;min-height:1.4em;margin:clamp(2px,.8vh,10px) 0}.illustrated-fighters{display:flex;gap:clamp(10px,2.5vw,46px);align-items:stretch;justify-content:center;flex:1;min-height:0}.illustrated-player{flex:1;min-width:0;max-width:640px;display:flex;flex-direction:column;min-height:0}.illustrated-player h3{font-size:clamp(15px,2.1vh,26px);font-weight:400;color:#99c5ed;flex:none;margin:0}.illustrated-player[data-side=H] h3{color:#edb29b}.fighter-sprite{flex:1 1 0;min-height:0;width:auto;max-width:100%;aspect-ratio:3/4;margin:0 auto;background-size:400% 100%;background-repeat:no-repeat;background-position:0 0;transform-origin:bottom center}.illustrated-player.waiting .fighter-sprite{filter:brightness(.45)}.illustrated-score{font:clamp(20px,3vh,38px) Georgia,serif;display:block;margin:clamp(2px,.6vh,8px);flex:none}
.illustrated-meter{flex:none;height:clamp(14px,2.2vh,26px);border:1px solid #c0a66c;position:relative;overflow:hidden;background:#10161c;margin:8px 0}.illustrated-meter>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#95703d,#f6d880)}.illustrated-meter>span{position:absolute;top:0;height:100%;width:5%;right:0;background:#fff4b64d;border-left:2px solid #fff6c7}.illustrated-meter>em{display:none}.illustrated-player button{flex:none;width:100%;padding:clamp(9px,1.6vh,18px) 5px;background:linear-gradient(#ccb071,#9a763f);border:1px solid #dec798;color:#19212a;font:clamp(16px,2.4vh,26px) YutChronicle,serif;cursor:pointer;touch-action:manipulation}.illustrated-player button:disabled{opacity:.35;cursor:default}.illustrated-feedback{display:block;flex:none;min-height:1.8em;margin-top:5px;font-size:clamp(11px,1.4vh,15px);color:#c9c3b3}.illustrated-rule{flex:none;font-size:clamp(11px,1.4vh,15px);line-height:1.6;color:#bdb7a8;margin:clamp(2px,.7vh,10px) 0 0}.illustrated-duel[data-game=spin] .illustrated-meter i{display:none}.illustrated-duel[data-game=spin] .illustrated-center{left:50%;right:auto;transform:translateX(-50%);border:1px solid #ffe5a0;background:#cdb56c77}.illustrated-duel[data-game=spin] .illustrated-meter em{display:block;position:absolute;top:0;height:100%;width:4px;background:#fff;transform:translateX(-50%)}.illustrated-duel[data-phase=strike] .illustrated-player:not(.waiting){animation:duelImpact .18s ease-in-out}.illustrated-duel[data-phase=outcome] .illustrated-meter,.illustrated-duel[data-phase=outcome] .illustrated-player button{display:none}@keyframes duelImpact{0%,100%{transform:translateX(0)}30%{transform:translateX(7px)}60%{transform:translateX(-5px)}}@media(max-width:600px){.illustrated-duel{padding:8px 6px}.illustrated-fighters{gap:8px}}@media(max-height:760px) and (min-width:601px){.illustrated-rule{margin-top:4px}}@media(prefers-reduced-motion:reduce){.illustrated-duel[data-phase=strike] .illustrated-player:not(.waiting){animation:none}}
/* 전자칠판·태블릿에서는 기합 버튼을 손가락에 맞춰 키운다 */
:root[data-device=board] .illustrated-player button{padding:clamp(16px,2.8vh,30px) 5px;font-size:clamp(22px,3.2vh,34px)}
:root[data-device=tablet] .illustrated-player button{padding:clamp(12px,2.1vh,23px) 5px;font-size:clamp(19px,2.8vh,29px)}