@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Dela+Gothic+One&family=Noto+Sans+JP:wght@700;900&display=swap";*{box-sizing:border-box;margin:0;padding:0;touch-action:manipulation}html,body{height:100%;background:#f5f0e8;color:#0d0d0d;transition:background 1.2s ease;font-family:Dela Gothic One,Noto Sans JP,sans-serif;overflow:hidden;touch-action:manipulation;user-select:none;-webkit-user-select:none}html.no-zoom,body.no-zoom{touch-action:manipulation!important}button{touch-action:manipulation}#title-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;background:#f5f0e8;z-index:200;opacity:0;pointer-events:none;transition:opacity .6s ease}#title-screen.show{opacity:1;pointer-events:auto}#title-screen #title-visual{max-width:min(800px,90vw);max-height:50vh;width:auto;height:auto;object-fit:contain;animation:title-float 3s ease-in-out infinite alternate;filter:drop-shadow(0 10px 20px rgba(0,0,0,.15))}#title-screen #btn-start{font-family:Outfit,sans-serif;font-weight:700;font-size:clamp(1.2rem,4vw,1.6rem);color:#2a2a2a;background:transparent;border:none;border-bottom:2px solid #2a2a2a;padding:.4rem 1.5rem .6rem;cursor:pointer;letter-spacing:.3em;transition:all .2s ease;-webkit-tap-highlight-color:transparent}#title-screen #btn-start:hover{opacity:.6;border-bottom-width:4px;padding-bottom:.4rem}#title-screen #btn-start:active{transform:scale(.97)}#title-screen #title-hint{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin-top:-1rem}#title-screen #title-hint p{font-family:Outfit,sans-serif;font-size:clamp(.65rem,2.8vw,.8rem);color:#00000059;letter-spacing:.04em;line-height:1.6}#title-screen #title-hint p:before{content:"— "}#title-screen #title-hint p:after{content:" —"}#title-screen #title-footer{position:absolute;bottom:0;left:0;right:0;font-family:Outfit,sans-serif;display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 1.2rem;padding:.6rem 1rem;font-size:.62rem;color:#0000004d;letter-spacing:.05em}#title-screen #title-footer span{white-space:nowrap}#title-screen #title-footer a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(0,0,0,.15);transition:color .2s,border-color .2s}#title-screen #title-footer a:hover{color:#0009;border-bottom-color:#0006}.btn-sound-toggle{padding:.4rem .8rem;min-width:6.5rem;height:clamp(2.2rem,8vw,2.5rem);border-radius:2rem;border:1px solid rgba(0,0,0,.15);background:#fff9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#2a2a2a;font-family:inherit;font-size:clamp(.7rem,3.5vw,.8rem);display:flex;align-items:center;justify-content:center;gap:.4rem;cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 8px #0000000d;font-weight:700;letter-spacing:.02em}#title-screen .btn-sound-toggle{margin-top:-1.5rem;min-width:8rem;font-size:.85rem}#sub-controls .btn-sound-toggle{min-width:auto;width:auto;height:auto;padding:6px 12px;border-radius:4px;background:transparent;border:1px solid rgba(0,0,0,.2);box-shadow:none;opacity:.6;font-size:.75rem}#sub-controls .btn-sound-toggle:hover{opacity:1;transform:none;box-shadow:none}.btn-sound-toggle:hover{background:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.btn-sound-toggle:active{transform:translateY(0) scale(.96)}.btn-sound-toggle.is-muted{opacity:.5;background:#c8c8c866}#flash-overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;z-index:50;transition:opacity .1s}#flash-overlay.flash-win{background:#ffd70080}#flash-overlay.flash-lose{background:#c8000080}#flash-overlay.flash-draw{background:#b4b4b466}#flash-overlay.active{opacity:1;animation:flash 1.5s ease-out forwards}@keyframes flash{0%{opacity:1}40%{opacity:.8}to{opacity:0}}#judgement-banner{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:60;opacity:0}#judgement-banner.show{animation:banner-pop 1.5s ease forwards}#judgement-banner #judgement-text{font-size:clamp(3rem,10vw,7rem);letter-spacing:.1em;text-shadow:0 0 20px currentColor,4px 4px 0 #000}#judgement-banner.win #judgement-text{color:gold}#judgement-banner.lose #judgement-text{color:#c00}#judgement-banner.draw #judgement-text{color:#aaa}@keyframes banner-pop{0%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1.15)}35%{transform:scale(.95)}50%{transform:scale(1.05)}65%{transform:scale(1)}85%{opacity:1}to{opacity:0}}#start-banner{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:60;opacity:0}#start-banner.show{animation:banner-pop 1.2s ease forwards}#start-banner #start-text{font-family:Dela Gothic One,sans-serif;font-size:clamp(3.5rem,15vw,10rem);color:#c00;letter-spacing:.05em;text-shadow:3px 3px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 0 40px rgba(204,0,0,.8);transform:rotate(-2deg);display:inline-block}#gameover-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;background:#000000d9;z-index:100;opacity:0;pointer-events:none;transition:opacity .4s}#gameover-screen.show{opacity:1;pointer-events:auto}#gameover-screen #gameover-message{font-size:clamp(2.5rem,8vw,5rem);text-shadow:4px 4px 0 #000;transition:opacity 1s ease}#gameover-screen #gameover-sub-message{font-size:clamp(1rem,3.5vw,1.6rem);color:#fff9;text-align:center;line-height:2;letter-spacing:.15em;opacity:0;transition:opacity 1.5s ease;max-width:80vw}#gameover-screen #gameover-sub-message.show{opacity:1}#gameover-screen.win #gameover-message{color:gold}#gameover-screen.lose #gameover-message{color:#c00}#gameover-screen.perfect-win{background:#14141ef2;transition:opacity 2s ease}#gameover-screen.perfect-win #gameover-message{color:#ffffffb3;font-size:clamp(1.5rem,5vw,3rem);text-shadow:none;letter-spacing:.2em;font-weight:500}#gameover-screen.perfect-win #gameover-sub-message{color:#ffffff59;font-size:clamp(.85rem,3vw,1.2rem);letter-spacing:.3em}#gameover-screen.perfect-win #gameover-actions{opacity:0;transition:opacity 1.5s ease}#gameover-screen.perfect-win #gameover-actions.show{opacity:1}#gameover-screen.perfect-win #btn-restart{background:transparent;color:#ffffff80;border:1px solid rgba(255,255,255,.2)}#gameover-screen.perfect-win #btn-restart:hover{color:#fffc;border-color:#fff6;background:#ffffff0d}#gameover-screen.perfect-win #btn-to-title-over{color:#ffffff59;border-color:#ffffff26}#gameover-screen.perfect-win #btn-to-title-over:hover{color:#fff9;border-color:#ffffff4d}#gameover-screen #gameover-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem}#gameover-screen #btn-restart,#gameover-screen #btn-to-title-over{padding:1rem 2rem;font-size:1.1rem;font-family:inherit;cursor:pointer;letter-spacing:.1em;transition:transform .15s,background .15s;border-radius:4px;-webkit-tap-highlight-color:transparent}#gameover-screen #btn-restart:hover,#gameover-screen #btn-to-title-over:hover{transform:scale(1.05)}#gameover-screen #btn-restart:active,#gameover-screen #btn-to-title-over:active{transform:scale(.95)}#gameover-screen #btn-restart{background:#c00;color:#fff;border:3px solid #FFD700}#gameover-screen #btn-restart:hover{background:#b80000}#gameover-screen #btn-to-title-over{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.4)}#gameover-screen #btn-to-title-over:hover{background:#ffffff1a;border-color:#fff}#game-container{width:100%;height:100dvh;display:none;flex-direction:column}#game-container.show{display:flex}#battle-screen{flex:1;display:flex;flex-direction:column}#arena{flex:1;display:flex;align-items:stretch;gap:8px;padding:12px 8px 0}.hp-bar-wrap{display:flex;flex-direction:column;align-items:center;width:44px;flex-shrink:0}.hp-bar-wrap .hp-label{font-size:.75rem;font-weight:900;letter-spacing:.1em;color:#0d0d0d;margin-bottom:6px;text-transform:uppercase}.hp-bar-wrap .hp-bar{flex:1;display:flex;flex-direction:column;gap:6px;width:100%}.hp-bar-wrap .hp-pip{flex:1;border-radius:4px;border:2px solid #FFD700;background:#3a1a1a;transition:background .3s,box-shadow .3s}.hp-bar-wrap .hp-pip.active{background:#ff3b30;box-shadow:0 0 10px #ff3b30}#faces-area{flex:1;display:flex;align-items:stretch;justify-content:center;gap:0;overflow:hidden;position:relative}.character{flex:1;display:flex;align-items:center;justify-content:center;container-type:size;opacity:0}.character.is-visible,.character.walk-in{opacity:1}.character.is-player{justify-content:flex-end}.character.is-cpu{justify-content:flex-start}.character.is-player.walk-in{animation:player-walk-in 2s cubic-bezier(.2,0,.2,1) forwards}.character.is-cpu.walk-in{animation:cpu-walk-in 2s cubic-bezier(.2,0,.2,1) forwards}.character.sweating .face-stage{animation:shake .6s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}@keyframes player-walk-in{0%{transform:translate(-150%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes cpu-walk-in{0%{transform:translate(150%);opacity:0}to{transform:translate(0);opacity:1}}.face-stage{position:relative;width:min(100%,100cqh);aspect-ratio:1;overflow:hidden}.face-stage .face-base{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:bottom}.face-stage .face-effect{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.face-stage .face-part{position:absolute;left:0;width:100%;object-fit:contain}#player-face-stage .face-part.eyebrow{top:25%;height:25%}#player-face-stage .face-part.eye{top:32.75%;height:32.5%}#player-face-stage .face-part.mouth{top:59.1%;height:30%}#cpu-face-stage .face-part.eyebrow{top:25%;height:25%}#cpu-face-stage .face-part.eye{top:32.75%;height:32.5%}#cpu-face-stage .face-part.mouth{top:64.75%;height:30%}#timer-display{position:absolute;top:0;left:50%;transform:translate(-50%);z-index:10;pointer-events:none}#timer-display #time-left{font-size:clamp(1.6rem,5vw,2.4rem);color:#0d0d0d;letter-spacing:-.02em;transition:color .3s}#timer-display #time-left.danger{color:#ff3b30;animation:blink .5s step-start infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}#score-bar{position:relative;height:6px;margin:6px 12px 0;background:#0d0d0d1f;border-radius:3px;overflow:hidden}#score-bar #score-bar-fill{position:absolute;top:0;left:0;height:100%;width:50%;background:linear-gradient(to right,#c00,#ff1a1a);border-radius:3px;transition:width .4s ease}#score-bar:after{content:"";position:absolute;top:-2px;left:50%;transform:translate(-50%);width:2px;height:10px;background:#0d0d0d4d;border-radius:1px}#controls{padding:12px 10px 16px;display:flex;gap:10px;justify-content:center}#controls .part-btn{flex:1;max-width:140px;height:clamp(80px,20vw,100px);display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#fffffff2,#f0e6cfcc);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid #2a2a2a;box-shadow:0 4px 10px #00000026,inset 0 1px #fffc;border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.25,.8,.25,1);-webkit-tap-highlight-color:transparent;position:relative;overflow:hidden}#controls .part-btn picture,#controls .part-btn img{width:85%;height:85%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.05));transition:transform .4s cubic-bezier(.175,.885,.32,1.275)}#controls .part-btn:hover:not(:disabled){background:#fff;border-color:#000;box-shadow:0 6px 15px #0003,inset 0 1px #fff}#controls .part-btn:hover:not(:disabled) img{transform:scale(1.1) translateY(-2px)}#controls .part-btn:active:not(:disabled){background:#c00;border-color:#c00;transform:scale(.94);box-shadow:0 2px 4px #0000001a}#controls .part-btn:active:not(:disabled) img{transform:scale(.9);filter:brightness(0) invert(1)}#controls .part-btn:active:not(:disabled) .key-hint{color:#fff}#controls .part-btn .part-gauge{display:flex;align-items:center;gap:4px;width:calc(100% - 12px);padding:0 2px;margin-bottom:4px}#controls .part-btn .part-gauge .part-gauge-track{flex:1;height:3px;background:#0000001a;border-radius:2px;position:relative}#controls .part-btn .part-gauge .part-gauge-track .part-gauge-dot{position:absolute;top:50%;left:0%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#0d0d0d;transition:left .15s ease;z-index:1}#controls .part-btn .key-hint{position:absolute;bottom:8px;left:0;right:0;font-size:.6rem;color:#00000080;font-weight:900;letter-spacing:.1em;pointer-events:none;text-transform:uppercase}#controls .part-btn:disabled{opacity:.3;filter:grayscale(1);background:#dcdcdc80;border-color:#0003;cursor:not-allowed}#controls .part-btn.bounce{animation:btn-bounce .22s ease}#sub-controls{display:flex;justify-content:center;gap:12px;padding:6px 10px 10px}#sub-controls button{font-family:inherit;font-size:.75rem;letter-spacing:.1em;color:#0d0d0d;background:transparent;border:1px solid rgba(13,13,13,.3);border-radius:4px;padding:6px 16px;cursor:pointer;opacity:.6;transition:opacity .15s;-webkit-tap-highlight-color:transparent}#sub-controls button:hover{opacity:1}#sub-controls button:active{opacity:.4}@keyframes btn-bounce{0%{transform:scale(1)}40%{transform:scale(.88)}70%{transform:scale(1.08)}to{transform:scale(1)}}@media (orientation: portrait){#start-banner{bottom:50%}#battle-screen{display:grid;grid-template-rows:1fr auto 1fr;grid-template-columns:1fr}#arena{grid-row:1;flex-direction:row;align-items:stretch;padding:8px 4px 4px;gap:4px}.hp-bar-wrap{width:28px}#faces-area{flex-direction:row;align-items:stretch}#score-bar{grid-row:2;margin:4px 12px}#controls{grid-row:3;align-items:center;padding:12px;gap:8px}#controls .part-btn{max-width:none;height:74px;padding:0;background:linear-gradient(135deg,#fffffff2,#f0e6cfcc);border:2px solid #2a2a2a;border-radius:12px}#controls .part-btn picture,#controls .part-btn img{width:75%;height:75%;filter:drop-shadow(0 1px 1px rgba(0,0,0,.05))}#controls .part-btn .key-hint{display:none}#sub-controls{display:flex;justify-content:center;gap:8px;padding:10px 4px}#sub-controls button{padding:10px 14px;font-size:.85rem;flex:0 1 auto;white-space:nowrap}}
