*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--c-bg: #080808;--c-surface: rgba(15, 15, 20, .85);--c-border: rgba(255, 255, 255, .15);--c-text: #ffffff;--c-text-muted: #888888;--c-accent: #e60012;--c-accent-glow: rgba(230, 0, 18, .35);--c-success: #00ffcc;--c-success-glow: rgba(0, 255, 204, .25);--c-warning: #ff9f0a;--c-climax: #ff0040;--c-climax-glow: rgba(255, 0, 64, .4);--c-result-gold: #ffd700;--font-mono: "Orbitron", "Share Tech Mono", "SF Mono", "Fira Code", "Cascadia Code", monospace;--font-sans: "Noto Sans JP", "Inter", "Helvetica Neue", sans-serif}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}body{background:var(--c-bg);color:var(--c-text);font-family:var(--font-sans);min-height:100dvh;display:flex;justify-content:center;align-items:flex-start;overflow-y:auto;overscroll-behavior-y:none;touch-action:pan-y;-webkit-overflow-scrolling:touch}#app{position:relative;width:100%;max-width:560px;min-height:100dvh;padding:2rem 1.5rem 4rem;display:flex;flex-direction:column;gap:1.5rem;overflow:visible}.scanlines{pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.015) 2px,rgba(255,255,255,.015) 4px);z-index:1000}.header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem}.header__badge{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.3em;color:var(--c-accent);border:1px solid var(--c-accent);padding:.2em .8em;border-radius:2px;animation:pulse-border 2s ease-in-out infinite}.header__title{font-family:var(--font-mono);font-size:clamp(2rem,8vw,3.5rem);font-weight:700;letter-spacing:.15em;color:#fff;text-shadow:0 0 30px var(--c-accent-glow),0 0 60px var(--c-accent-glow)}.header__sub{font-family:var(--font-mono);font-size:.75rem;color:var(--c-text-muted);letter-spacing:.1em}.global-progress{width:100%;max-width:600px;margin-top:1.5rem;text-align:center;display:none}.global-progress__track{width:100%;height:20px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:10px;overflow:hidden;box-shadow:inset 0 0 10px #000c;position:relative}.global-progress__fill{height:100%;width:0%;background:linear-gradient(90deg,#ff0040,var(--c-accent));transition:width 1s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 15px var(--c-accent-glow)}.global-progress__text{margin-top:.75rem;font-family:var(--font-mono);font-size:1.1rem;font-weight:700;color:var(--c-accent);text-shadow:0 0 10px var(--c-accent-glow)}.status-bar{display:flex;justify-content:center;gap:1.5rem;font-family:var(--font-mono);font-size:.65rem;color:var(--c-text-muted);letter-spacing:.1em}.status-bar__item{display:flex;align-items:center;gap:.4rem}.status-bar__dot{width:6px;height:6px;border-radius:50%;background:var(--c-text-muted);transition:background .3s,box-shadow .3s}.status-bar__dot--online{background:var(--c-success);box-shadow:0 0 6px var(--c-success)}.status-bar__dot--connecting{background:var(--c-warning);animation:blink 1s step-end infinite}.status-bar__dot--offline{background:var(--c-accent);animation:blink 1s step-end infinite}.phase{display:none}.phase--active{display:block;animation:fade-in .4s ease-out}.panel{background:var(--c-surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--c-border);border-radius:6px;padding:1.25rem 1.5rem;transition:border-color .4s ease,box-shadow .4s ease}.panel--online{border-color:var(--c-success);box-shadow:0 0 20px var(--c-success-glow),inset 0 0 20px var(--c-success-glow)}.panel--error{border-color:var(--c-accent);box-shadow:0 0 20px var(--c-accent-glow),inset 0 0 20px var(--c-accent-glow)}.panel__header{display:flex;align-items:center;gap:.6rem;margin-bottom:.75rem}.panel__dot{width:8px;height:8px;border-radius:50%;background:var(--c-text-muted);transition:background .3s ease,box-shadow .3s ease}.panel__dot--online{background:var(--c-success);box-shadow:0 0 8px var(--c-success)}.panel__dot--error{background:var(--c-accent);box-shadow:0 0 8px var(--c-accent);animation:blink 1s step-end infinite}.panel__label{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;color:var(--c-text-muted);text-transform:uppercase}.panel__message{font-family:var(--font-mono);font-size:.95rem;font-weight:600;letter-spacing:.05em}.panel__message--online{color:var(--c-success)}.panel__message--error{color:var(--c-accent)}.panel__detail{font-family:var(--font-mono);font-size:.7rem;color:var(--c-text-muted);margin-top:.4rem}.phase__hint{font-family:var(--font-mono);font-size:.75rem;color:var(--c-text-muted);text-align:center;margin-top:1rem;animation:pulse-border 3s ease-in-out infinite}.climax{display:flex;flex-direction:column;align-items:center;gap:.8rem;text-align:center}.climax__label{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.3em;color:var(--c-climax);animation:pulse-border 1s ease-in-out infinite}.climax__counter{font-family:var(--font-mono);font-size:clamp(3rem,12vw,5rem);font-weight:800;color:#fff;text-shadow:0 0 40px var(--c-climax-glow),0 0 80px var(--c-climax-glow);line-height:1}.climax__unit{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;color:var(--c-text-muted)}.click-btn{width:140px;height:140px;border-radius:50%;border:3px solid var(--c-climax);background:#ff004014;color:#fff;font-family:var(--font-mono);font-size:1.4rem;font-weight:700;letter-spacing:.15em;cursor:pointer;transition:transform .08s,box-shadow .08s,background .08s;box-shadow:0 0 30px var(--c-climax-glow),inset 0 0 30px var(--c-climax-glow);animation:pulse-glow 2s ease-in-out infinite;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.click-btn:active{transform:scale(.92);background:#ff004040;box-shadow:0 0 50px var(--c-climax-glow),inset 0 0 50px var(--c-climax-glow)}.click-btn--flash{transform:scale(.95);background:#ff004033}.climax__hint{font-family:var(--font-mono);font-size:.8rem;color:var(--c-text-muted);letter-spacing:.05em}.result{display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center;padding:2rem 0}.result__label{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.3em;color:var(--c-result-gold)}.result__count{font-family:var(--font-mono);font-size:clamp(3rem,12vw,5rem);font-weight:800;color:var(--c-result-gold);text-shadow:0 0 40px rgba(255,215,0,.3),0 0 80px rgba(255,215,0,.15);line-height:1}.result__unit{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;color:var(--c-text-muted)}.result__message{font-family:var(--font-mono);font-size:.85rem;color:var(--c-text);margin-top:1rem}.banner{display:flex;align-items:center;gap:.6rem;background:#ff95001a;border:1px solid var(--c-warning);border-radius:6px;padding:.8rem 1.2rem;font-family:var(--font-mono);font-size:.8rem;color:var(--c-warning);animation:slide-in .3s ease-out}.banner--hidden{display:none}.banner__icon{margin-right:.5rem;font-size:1.2rem}.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.8rem;margin-bottom:1.5rem}.choice-btn{background:var(--c-surface);border:1px solid var(--c-border);border-radius:8px;padding:1.25rem .5rem;color:var(--c-text);font-family:var(--font-sans);font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.2,.8,.2,1);text-align:center;box-shadow:inset 0 0 10px #00000080;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.choice-btn:hover{border-color:var(--c-accent);background:#ff2a2a1a;box-shadow:inset 0 0 15px #ff2a2a33}.choice-btn:active{transform:scale(.95);background:#ff2a2a33}.choice-btn--img{padding:.5rem;display:flex;justify-content:center;align-items:center;height:140px}.choice-btn--img img{max-width:100%;max-height:100%;object-fit:contain}.mission-grid{display:flex;flex-direction:column;gap:1.2rem;margin-top:1.5rem}.mission-btn{background:var(--c-surface);border:1px solid var(--c-border);border-radius:10px;padding:1.8rem 1rem;color:var(--c-text);font-family:var(--font-sans);font-size:1.3rem;font-weight:700;text-align:center;cursor:pointer;transition:all .2s cubic-bezier(.2,.8,.2,1);box-shadow:inset 0 0 10px #00000080;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.mission-btn:hover{border-color:var(--c-accent);box-shadow:inset 0 0 15px #ff2a2a33}.mission-btn:active{transform:scale(.96);background:#ff2a2a1a}.mission-btn--cleared{background:#00ff881a;border-color:var(--c-success);color:var(--c-success);pointer-events:none}.text-input{width:100%;padding:1.2rem;border-radius:8px;border:1px solid var(--c-border);background:var(--c-bg);color:var(--c-text);font-size:1.2rem;text-align:center;margin-bottom:1.2rem;transition:border-color .3s}.text-input:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 10px var(--c-accent-glow)}.primary-btn{width:100%;padding:1.2rem;background:var(--c-accent);color:#fff;border:none;border-radius:8px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;box-shadow:0 4px 15px var(--c-accent-glow);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.primary-btn:active{transform:scale(.95);box-shadow:0 2px 5px var(--c-accent-glow);background:#ff4a4a}.secondary-btn{width:100%;padding:1rem;background:var(--c-surface);color:var(--c-text);border:1px solid var(--c-border);border-radius:8px;font-size:1.1rem;cursor:pointer;transition:transform .2s,background .2s;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin-top:.5rem}.secondary-btn:active{transform:scale(.95);background:#222}.step-progress{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;position:relative}.step-progress:before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:var(--c-border);z-index:0}.step-dot{width:24px;height:24px;border-radius:50%;background:var(--c-bg);border:2px solid var(--c-border);z-index:1;display:flex;justify-content:center;align-items:center;font-size:.8rem;color:var(--c-muted)}.step-dot--active{border-color:var(--c-accent);color:var(--c-accent);box-shadow:0 0 10px #00ffcc80}.step-dot--cleared{background:var(--c-success);border-color:var(--c-success);color:#000}@keyframes shake{0%{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-5px)}to{transform:translate(0)}}.anim-shake{animation:shake .4s ease-in-out}.footer{text-align:center;font-size:.65rem;color:var(--c-text-muted);font-family:var(--font-mono);letter-spacing:.05em}@keyframes pulse-border{0%,to{opacity:1}50%{opacity:.4}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes slide-in{0%{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 30px var(--c-climax-glow),inset 0 0 30px var(--c-climax-glow)}50%{box-shadow:0 0 50px var(--c-climax-glow),inset 0 0 50px var(--c-climax-glow)}}body[data-phase=CLIMAX]{background:#050005}body[data-phase=CLIMAX] .scanlines{background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,0,64,.02) 2px,rgba(255,0,64,.02) 4px)}body[data-phase=RESULT] .header__title{text-shadow:0 0 30px rgba(255,215,0,.3),0 0 60px rgba(255,215,0,.15)}.custom-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;transition:opacity .3s;pointer-events:none}.custom-modal-overlay--active{opacity:1;pointer-events:auto}.custom-modal{background:var(--c-surface);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid var(--c-accent);box-shadow:0 0 40px var(--c-accent-glow),inset 0 0 20px #e600121a;padding:2rem;border-radius:8px;text-align:center;width:90%;max-width:400px;transform:scale(.9);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.custom-modal-overlay--active .custom-modal{transform:scale(1)}.custom-modal__title{font-family:var(--font-sans);font-size:1.1rem;font-weight:700;line-height:1.5;color:#fff;margin-bottom:1rem}.custom-modal__actions{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.custom-modal__btn{padding:1rem 1.5rem;border-radius:6px;border:none;font-family:var(--font-sans);font-weight:700;font-size:1rem;cursor:pointer;flex:1;transition:all .2s}.custom-modal__btn--cancel{background:#333;color:#fff}.custom-modal__btn--cancel:hover{background:#444}.custom-modal__btn--confirm{background:var(--c-accent);color:#fff}.custom-modal__btn--confirm:hover{background:#ff4a4a;box-shadow:0 0 15px var(--c-accent-glow)}