:root{color-scheme:dark;font-family:system-ui,"Yu Gothic",sans-serif;background:#101013;color:#fff}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% 15%,#332027 0,#151419 40%,#0c0c0e 100%)}button{font:inherit;cursor:pointer}.game{width:min(1000px,94vw);margin:28px auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}h1{font-size:clamp(30px,5vw,53px);letter-spacing:.05em;margin:1px 0;font-weight:1000;line-height:1.1}header p{margin:6px 0;color:#b5aeb2;font-size:13px}.eyebrow,.label{font-size:10px;font-weight:900;letter-spacing:.22em;color:#ffb02e}.sound,#restart{background:transparent;border:1px solid #51484c;color:#c8c2c3;border-radius:6px;padding:9px 13px;font-size:12px}.arena{height:500px;position:relative;overflow:hidden;border:1px solid #594449;border-radius:12px;background:radial-gradient(ellipse at 50% 70%,#9f3c24 0,#55252a 34%,#211c27 75%);box-shadow:0 20px 60px #0008}.grid{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 79px,#ffffff08 80px),repeating-linear-gradient(0deg,transparent 0 79px,#ffffff08 80px)}.topline{position:absolute;top:20px;left:24px;right:24px;display:flex;justify-content:space-between;color:#f4d3b7;font-size:12px;font-weight:800;letter-spacing:.12em}.topline b{font-size:19px;color:white}.boss-label{position:absolute;top:62px;left:50%;transform:translateX(-50%);width:min(380px,70%);text-align:center;z-index:2}.boss-label span{display:block;color:#ffb02e;font-size:10px;letter-spacing:.2em;font-weight:900}.boss-label strong{font-size:21px}.bar{height:12px;border-radius:99px;background:#241b20;border:1px solid #ffffff33;overflow:hidden}.bar i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#ff4d36,#ffab37);transition:width .15s}.boss-label small{font-size:10px;color:#ffddd0}.boss{position:absolute;z-index:1;bottom:-96px;left:50%;transform:translateX(-50%);width:330px;height:390px;border:0;background:none;padding:0;touch-action:manipulation;filter:drop-shadow(0 15px 25px #0008)}.boss img{width:100%;height:100%;object-fit:contain;object-position:bottom}.boss.hit{animation:hit .13s}.quote{position:absolute;z-index:3;right:7%;top:155px;max-width:200px;background:#fff;color:#282025;padding:12px 16px;border-radius:14px;font-size:13px;font-weight:900;box-shadow:0 5px 0 #0003}.ground{position:absolute;bottom:0;width:100%;height:60px;background:linear-gradient(transparent,#120d12aa)}.effects{position:absolute;inset:0;z-index:5;pointer-events:none}.float{position:absolute;font-weight:1000;font-size:27px;color:#fff18e;text-shadow:2px 3px #d33322;animation:float .65s forwards}.overlay{position:absolute;z-index:10;inset:0;background:#100d14ca;display:grid;place-items:center}.overlay.hidden{display:none}.modal{text-align:center;padding:25px}.modal-kicker{color:#ffad31;font-size:11px;font-weight:900;letter-spacing:.25em}.modal h2{font-size:clamp(35px,6vw,58px);line-height:1.15;margin:15px 0}.modal h2 em{font-style:normal;color:#ffaf36}.modal p{color:#e0d7d3;line-height:1.8}.primary{border:0;border-radius:6px;background:#ffab2e;color:#22130e;font-weight:1000;padding:15px 25px;min-width:220px;box-shadow:0 5px #a85a1b}.primary span{float:right}.modal small{display:block;margin-top:20px;color:#aaa;font-size:11px}.controls{display:flex;align-items:center;gap:24px;padding:20px 4px}.player{flex:1}.playerbar{margin:7px 0;height:10px}.playerbar i{background:linear-gradient(90deg,#49bfff,#8cf0e0)}.player strong{font-size:11px;color:#b7d6dd}.stats{display:flex;gap:25px}.stats span{display:block;color:#aaa;font-size:10px}.stats strong{font-size:26px}.skill{min-width:130px;border:0;border-radius:8px;background:#f4a629;color:#24150d;padding:9px 15px;box-shadow:0 4px #9e5a16}.skill:disabled{background:#383337;color:#928b8c;box-shadow:none;cursor:default}.skill span,.skill small{display:block;font-size:10px}.skill strong{display:block;font-size:17px}footer{display:flex;justify-content:space-between;align-items:center;color:#999;font-size:11px;border-top:1px solid #ffffff15;padding-top:14px}@keyframes hit{50%{transform:translateX(-50%) scale(.96) rotate(-3deg);filter:brightness(2)}}@keyframes float{to{transform:translateY(-75px) scale(1.3);opacity:0}}@media(max-width:600px){.game{margin:16px auto}.arena{height:470px}.boss{width:270px}.quote{right:3%;top:160px;font-size:11px;max-width:150px}.controls{gap:10px;flex-wrap:wrap}.player{min-width:130px}.stats{gap:12px}.stats strong{font-size:20px}.skill{min-width:105px}footer span{max-width:70%}}

.warning{position:absolute;z-index:6;top:140px;left:50%;transform:translateX(-50%);background:#f33;color:white;padding:8px 18px;border-radius:4px;font-weight:1000;letter-spacing:.08em;white-space:nowrap;display:none;box-shadow:0 0 25px #ff2424;animation:pulse .35s infinite alternate}.warning.show{display:block}.dodge{min-width:120px;border:1px solid #5fe8ff;border-radius:8px;background:#153d54;color:#a8f5ff;padding:10px;box-shadow:0 4px #092637}.dodge strong,.dodge small{display:block}.dodge small{font-size:10px}.dodge:disabled{opacity:.45;cursor:default}.dodge.ready{background:#20bee3;color:#081b25;animation:pulse .35s infinite alternate}.boss{transition:filter .15s}.boss.taunt{animation:taunt .7s infinite alternate}.boss.windup{animation:windup .4s infinite alternate;filter:drop-shadow(0 0 25px #ff3924)}.boss.strike{animation:strike .5s}.arena.shake{animation:shake .35s}.arena.fury{box-shadow:0 0 35px #fa3030,0 20px 60px #0008}.arena.fury .grid{background-color:#e8171730}.flash{position:absolute;inset:0;background:#fff;animation:flash .45s forwards}.burst{position:absolute;width:16px;height:16px;border-radius:50%;background:#ffda51;box-shadow:0 0 12px #ff542a;animation:burst .55s ease-out forwards}.ring{position:absolute;border:8px solid #ffe388;border-radius:50%;width:70px;height:70px;animation:ring .55s ease-out forwards}.float.crit{font-size:43px;color:#fff;text-shadow:3px 4px #f0273b,0 0 20px #ffb000}.quote{transition:transform .2s}.arena.fury .quote{transform:rotate(4deg);background:#ffdd55}@keyframes pulse{to{transform:translateX(-50%) scale(1.1);filter:brightness(1.4)}}.dodge.ready{animation:dodgepulse .35s infinite alternate}@keyframes dodgepulse{to{transform:scale(1.06);filter:brightness(1.3)}}@keyframes taunt{to{transform:translateX(-50%) rotate(5deg) scale(1.04)}}@keyframes windup{to{transform:translateX(-50%) rotate(-12deg) scale(.9)}}@keyframes strike{40%{transform:translateX(-50%) scale(1.35) rotate(8deg);filter:brightness(1.8)}}@keyframes shake{25%{translate:8px -4px}50%{translate:-9px 4px}75%{translate:5px 3px}}@keyframes flash{to{opacity:0}}@keyframes burst{to{transform:translate(var(--x),var(--y)) scale(.1);opacity:0}}@keyframes ring{to{transform:translate(-50%,-50%) scale(5);opacity:0}}@media(max-width:600px){.dodge{min-width:105px}.warning{top:145px;font-size:12px}}

.site-projectile{position:absolute;z-index:7;left:50%;top:45%;width:150px;height:105px;border:4px solid #273447;border-radius:5px;background:#f5f7ff;color:#24324d;box-shadow:0 5px 0 #111a2c,0 0 24px #ffbc39;overflow:hidden;transform-origin:center;animation:siteThrow .8s cubic-bezier(.2,.65,.4,1) forwards}.site-top{height:17px;background:#3a4a65;display:flex;align-items:center;gap:4px;padding:0 5px}.site-top i{width:5px;height:5px;border-radius:50%;background:#f98972}.site-top span{font-size:7px;color:white;margin-left:5px}.site-body{padding:5px 8px}.site-body b{font-size:8px;display:block}.site-hero{height:20px;background:linear-gradient(120deg,#7ccaff,#8e71ec);margin:3px 0}.site-body em{display:block;width:80%;height:3px;background:#c4ccda;margin:3px 0}.site-body strong{position:absolute;right:5px;bottom:7px;color:#df263d;border:2px solid #df263d;font-size:12px;transform:rotate(-15deg)}@keyframes siteThrow{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(-20deg)}20%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--offset)),110%) scale(2.7) rotate(18deg)}}

.site-projectile{animation-duration:.8s}.flying-taunt{position:absolute;color:#fff;background:#e72c42;padding:5px 8px;font-size:clamp(11px,1.5vw,16px);font-weight:1000;text-shadow:1px 2px #741226;box-shadow:2px 3px #0007;white-space:nowrap;animation:tauntFly 2.2s ease-out forwards}.flare{position:absolute;width:70px;height:70px;background:conic-gradient(transparent,#fff98c,transparent,#ff8e30,transparent,#fff98c,transparent);animation:flare .7s forwards}.ranking{border-top:1px solid #ffffff20;padding:10px 4px 15px}.ranking h2{font-size:16px;margin:4px 0}.ranking small{font-size:10px;color:#aaa;font-weight:normal}.ranking ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}.ranking li{font-size:11px;color:#ffdb8c;background:#31252a;border-radius:5px;padding:5px 9px}.victory h2{color:#fff;text-shadow:0 0 18px #ffbd27}.victory{animation:victoryGlow 1s infinite alternate}.confetti{position:absolute;z-index:12;top:-5%;width:8px;height:15px;animation:confetti 3s linear forwards}.overlay:has(.victory){background:#100d14a8}.victory{position:relative;z-index:13}@keyframes tauntFly{0%{opacity:0;scale:.3}15%{opacity:1;scale:1.1}80%{opacity:1}100%{opacity:0;translate:0 -35px}}@keyframes flare{to{transform:rotate(180deg) scale(3);opacity:0}}@keyframes confetti{to{transform:translate(70px,550px) rotate(800deg);opacity:0}}@keyframes victoryGlow{to{filter:drop-shadow(0 0 12px #ffc933)}}

.modal{max-height:100%;overflow:auto}.modal h2{font-size:clamp(30px,5vw,48px);margin:8px 0}.modal p{line-height:1.5;margin:8px 0}.difficulty-label{display:block;color:#ffd369;font-size:12px;font-weight:bold;margin:10px 0 4px}#difficulty{display:block;width:min(310px,85vw);margin:0 auto;background:#22202c;color:white;border:1px solid #ffb02e;border-radius:5px;padding:8px;font:inherit;font-size:13px}.modal .rules{font-size:11px;color:#c9d9df}.modal small{margin-top:8px}.title-button{display:block;margin:10px auto 0;background:none;border:0;color:#ddd;text-decoration:underline}.axe-projectile{position:absolute;z-index:8;left:20%;top:90%;font-size:55px;filter:drop-shadow(0 0 12px #ffe13b);animation:axeThrow .65s ease-in forwards}.player-shout{position:absolute;z-index:9;left:5%;bottom:12%;font-weight:1000;color:#fff;font-size:clamp(16px,3vw,25px);text-shadow:2px 3px #e62222,0 0 14px #ff9e00;animation:shout 1s forwards}@keyframes axeThrow{to{left:49%;top:40%;transform:rotate(1000deg) scale(.45);opacity:0}}@keyframes shout{0%{transform:scale(.3);opacity:0}20%{transform:scale(1.1);opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}

.enemy-site{animation:enemyScatter .85s cubic-bezier(.18,.65,.32,1) forwards;left:50%;top:45%;width:120px;height:90px}@keyframes enemyScatter{0%{opacity:0;transform:translate(-50%,-50%) scale(.12) rotate(0)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--end-x)),calc(-50% + var(--end-y))) scale(1.8) rotate(var(--spin))}}.player-site{position:absolute;z-index:8;left:var(--start-x);top:92%;width:115px;height:82px;background:#f5f7ff;color:#24324d;border:3px solid #38e7fa;border-radius:5px;overflow:hidden;box-shadow:0 0 18px #41e8ff;animation:playerSite .65s ease-in forwards}.player-site .site-body strong{color:#078264;border-color:#078264}@keyframes playerSite{to{left:50%;top:43%;transform:rotate(var(--rotation)) scale(.5);opacity:0}}.counter-banner{position:absolute;z-index:9;left:0;right:0;top:43%;padding:20px 4px;text-align:center;font-size:clamp(25px,5vw,48px);font-weight:1000;color:#fff;letter-spacing:.04em;background:linear-gradient(90deg,transparent,#e72440e8 15%,#e72440e8 85%,transparent);text-shadow:3px 4px #7c0b1d,0 0 25px white;animation:counterBanner 1.5s forwards}@keyframes counterBanner{0%{transform:scale(2);opacity:0}12%{transform:scale(1);opacity:1}80%{opacity:1}100%{opacity:0;transform:scale(1.1)}}

/* 色で攻撃側と操作のタイミングを区別 */
.warning.show{background:#ffcb35;color:#312400;box-shadow:0 0 25px #ffc43b}.warning.show.go{background:#2ee6ce;color:#072f37;box-shadow:0 0 26px #18ffe0}.flying-taunt{background:#59268f;color:#fff;text-shadow:1px 2px #271046}.player-shout{color:#e7ffff;text-shadow:2px 3px #005e93,0 0 14px #00dfff}.counter-banner{background:linear-gradient(90deg,transparent,#0877b7ef 15%,#0877b7ef 85%,transparent);text-shadow:3px 4px #003c69,0 0 25px #b5ffff}.skill:not(:disabled){background:#d887ff;color:#2a093b;box-shadow:0 4px #6b298a}.stats div:last-child strong{color:#ffdf60}.arena{background:radial-gradient(ellipse at 50% 70%,#8b3e36 0,#473040 34%,#1b2236 75%)}

.final-shout{font-size:clamp(28px,6vw,58px)!important;color:#fff!important;text-shadow:0 0 10px #fff,0 0 26px #31dfff,3px 4px #0877b7;animation:finalShout 1.1s ease-out forwards}.victory:has(.final-shout){background:#10172bef;border:1px solid #55eaff;border-radius:12px;padding:30px;box-shadow:0 0 45px #30dfff88}@keyframes finalShout{0%{transform:scale(.35);opacity:0}22%{transform:scale(1.12);opacity:1}75%{transform:scale(1);opacity:1}100%{transform:scale(.96);opacity:0}}

/* 吹き出しと画面端の煽りをスマホでも読みやすく */
.flying-taunt{font-size:clamp(16px,2.25vw,24px);padding:8px 12px;max-width:44%;white-space:normal;line-height:1.35}.quote{font-size:clamp(17px,2vw,21px);max-width:min(300px,38%);padding:15px 19px;line-height:1.4}.quote:after{font-size:inherit}@media(max-width:600px){.flying-taunt{font-size:clamp(16px,4vw,20px);max-width:47%;padding:7px 9px}.quote{font-size:17px;max-width:46%;right:3%;top:155px;padding:12px 13px}}

/* ニキの吹き出しを煽り字幕より手前に固定 */
.flying-taunt{z-index:2!important}.quote{z-index:9!important}.boss-label{z-index:8}.warning{z-index:10}
.share-x{display:block;margin:12px auto 0;padding:10px 16px;border:1px solid #43bdf5;border-radius:6px;background:#132b43;color:#e9f8ff;font-weight:800}.share-x:hover{background:#1d4770}

.stamina-line{margin-top:9px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;font-size:9px;color:#d8d5a1}.staminabar{height:8px;border-color:#c9bd5b}.staminabar i{background:linear-gradient(90deg,#b9e54a,#fff27b);transition:width .18s}.staminabar i.low{background:linear-gradient(90deg,#ff7b36,#ffd45b);animation:pulse .35s infinite alternate}.site-projectile.triple{animation-duration:.66s}.site-projectile.burst{animation-duration:.52s}.site-projectile.meteor{width:180px;height:125px;border-width:6px;box-shadow:0 0 40px #ff8b32;animation-duration:.7s}.warning.show{max-width:90%;text-align:center;white-space:normal}.warning.go{outline:none}.dodge.ready{background:#2ee6ce;color:#072c34;box-shadow:0 0 18px #29ffe3,0 4px #11797c}

.phase-banner{position:absolute;z-index:11;left:0;right:0;top:39%;padding:15px;text-align:center;background:linear-gradient(90deg,transparent,#304eb9ed 12%,#304eb9ed 88%,transparent);color:#fff;animation:phasePop 2.4s forwards;pointer-events:none}.phase-banner b,.phase-banner span{display:block}.phase-banner b{font-size:clamp(24px,5vw,44px);color:#fff2a8;text-shadow:0 0 15px #ffb52e}.phase-banner span{font-size:clamp(13px,2.2vw,19px)}.final-phase{box-shadow:inset 0 0 90px #8a163b,0 0 45px #ff315b}.final-phase .grid{background-color:#b3213a28}.final-phase .boss-label span{color:#ff526b}@keyframes phasePop{0%{transform:scale(.5);opacity:0}12%,78%{transform:scale(1);opacity:1}100%{transform:scale(1.08);opacity:0}}

.fever-line{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:7px;margin-top:6px;color:#c5aaff;font-size:9px;font-weight:800}.feverbar{height:7px;border-color:#8059bd}.feverbar i{background:linear-gradient(90deg,#a258ff,#42eaff);transition:width .2s}.fever-active .arena{animation:feverAura .6s infinite alternate;box-shadow:0 0 50px #be4dff, inset 0 0 75px #4434b855}.fever-active .grid{background-color:#7647d545}.fever-banner{position:absolute;z-index:13;left:0;right:0;top:35%;text-align:center;padding:15px;background:linear-gradient(90deg,transparent,#812ceeee 12%,#2679ffed 88%,transparent);color:#fff;text-shadow:0 0 18px #fff;animation:feverPop 2.2s forwards;pointer-events:none}.fever-banner b,.fever-banner span{display:block}.fever-banner b{font-size:clamp(32px,7vw,64px);font-style:italic}.fever-banner span{font-size:clamp(14px,3vw,22px)}.fever-spark{position:absolute;z-index:12;left:var(--x);top:100%;width:4px;height:32px;background:linear-gradient(transparent,#fff,#b658ff);box-shadow:0 0 14px #68eaff;animation:sparkRise 1.5s var(--delay) ease-out forwards}.fever-spark:nth-child(odd){background:linear-gradient(transparent,#fff,#ffdb55)}@keyframes feverAura{to{filter:hue-rotate(35deg);box-shadow:0 0 80px #4ceaff,inset 0 0 85px #973bff88}}@keyframes feverPop{0%{transform:scale(.2) rotate(-4deg);opacity:0}14%,75%{transform:scale(1);opacity:1}100%{transform:scale(1.2);opacity:0}}@keyframes sparkRise{to{transform:translateY(-600px) rotate(15deg);opacity:0}}
.fever-cheer{position:absolute;z-index:9;left:28%;top:63%;font-size:clamp(17px,3vw,30px);font-weight:1000;color:#b9fcff;text-shadow:0 0 10px #793bff,2px 3px #123e89;animation:shout .65s forwards}.dodge.ready{outline:3px solid #d7fffd;outline-offset:3px}.stats div:first-child strong{transition:color .2s}.fever-active .stats div:first-child strong{color:#ffe95e;text-shadow:0 0 12px #b650ff}

.timing-cue{position:absolute;z-index:7;left:50%;top:59%;width:118px;height:118px;transform:translate(-50%,-50%);display:none;pointer-events:none}.timing-cue.active{display:block}.timing-cue i{position:absolute;inset:0;border-radius:50%;box-sizing:border-box}.target-ring{border:4px solid #54f7ff;box-shadow:0 0 12px #54f7ff,inset 0 0 10px #54f7ff66}.approach-ring{border:5px solid #ffdb4f;animation:ringApproach var(--cue-time,1s) cubic-bezier(.18,.65,.32,1) forwards;box-shadow:0 0 15px #ff9f32}.timing-cue.hit-window .approach-ring{animation:hitPulse .24s infinite alternate;border-color:#fff;box-shadow:0 0 24px #fff}.timing-cue span{position:absolute;top:124px;left:50%;transform:translateX(-50%);color:#e9ffff;font-size:11px;font-weight:900;text-shadow:0 2px 5px #000;white-space:nowrap}.timing-cue.hit-window .target-ring{border-color:#fff;background:#59fff222;box-shadow:0 0 35px #5fffff}.timing-cue.hit-window{filter:drop-shadow(0 0 12px #5effff)}@keyframes ringApproach{0%{transform:scale(2.8);opacity:.15}15%{opacity:1}100%{transform:scale(1);opacity:1}}@keyframes hitPulse{to{transform:scale(1.12);filter:brightness(1.8)}}

.boss:focus,.boss:focus-visible{outline:none}.timing-cue.hit-window .approach-ring{border-color:#63fff0;box-shadow:0 0 24px #43ffed}.timing-cue.hit-window .target-ring{border-color:#fff;background:#59fff222;box-shadow:0 0 35px #5fffff}.timing-cue.hit-window{filter:drop-shadow(0 0 12px #5effff)}
.timing-cue.hit-window .approach-ring{border-color:#5dffde;box-shadow:0 0 30px #5dffde;animation:hitPulse .24s infinite alternate}.warning.go{background:#35d9c2;color:#032d34;text-shadow:none}
.timing-cue[data-pattern="crossfire"] .approach-ring{border-color:#ff5fa2;box-shadow:0 0 22px #ff5fa2}.timing-cue[data-pattern="stamp"] .approach-ring{border-width:9px;border-color:#ffb12f;box-shadow:0 0 32px #ff6b30}.timing-cue.miss .target-ring,.timing-cue.miss .approach-ring{border-color:#ff334e;box-shadow:0 0 28px #ff334e}.warning:has(+ .timing-cue.miss){background:#bd1930;color:white}
.ranking{display:grid;grid-template-columns:1fr auto;gap:7px 12px;align-items:center}.ranking h2{grid-column:1/-1}.rank-filter-label{font-size:11px;color:#ccc}.ranking select{background:#22202c;color:white;border:1px solid #ffb02e;border-radius:5px;padding:6px;font:inherit;font-size:11px}.ranking ol{grid-column:1/-1}