:root{--game-navy:var(--hm-bg);--game-ink:#071024;--game-paper:#f8f9fb;--game-cyan:var(--hm-cyan);--game-magenta:var(--hm-magenta)}
body.mode-select-page{min-height:100svh;background:var(--hm-bg);color:var(--hm-white);font-family:var(--body)}
.mode-select-page:before{content:"";position:fixed;inset:70px 0 0;pointer-events:none;background:radial-gradient(circle at 14% 18%,rgba(0,234,246,.08),transparent 28%),radial-gradient(circle at 88% 72%,rgba(255,41,216,.06),transparent 30%),var(--hm-bg)}
.mode-shell{position:relative;min-height:calc(100svh - 72px);padding:clamp(120px,13vh,160px) clamp(20px,6vw,110px) clamp(70px,8vh,110px);display:grid;place-items:center}
.mode-panel{position:relative;width:min(1320px,100%);min-height:620px;padding:clamp(70px,8vw,118px) clamp(24px,7vw,110px) clamp(72px,7vw,98px);background:var(--game-paper);color:var(--game-ink);border:1px solid rgba(255,255,255,.72);box-shadow:0 0 0 1px rgba(0,219,233,.24),0 0 42px rgba(0,219,233,.15);clip-path:polygon(0 22px,22px 0,calc(100% - 44px) 0,calc(100% - 30px) 14px,100% 14px,100% calc(100% - 24px),calc(100% - 24px) 100%,30px 100%,0 calc(100% - 30px))}
.mode-panel:before,.mode-panel:after{content:"";position:absolute;pointer-events:none}
.mode-panel:before{inset:14px;border:1px solid rgba(7,16,36,.17)}
.mode-panel:after{left:0;top:72px;width:5px;height:145px;background:var(--game-cyan);box-shadow:0 0 16px var(--game-cyan)}
.mode-panel__tag{position:absolute;left:clamp(24px,4vw,64px);top:0;display:flex;gap:18px;align-items:center;padding:14px 18px;background:#071024;color:#fff;font-size:9px;letter-spacing:.14em}
.mode-panel__tag b{color:var(--game-cyan)}.mode-panel__tag span{opacity:.6}
.mode-heading{text-align:center;animation:modeEnter .48s cubic-bezier(.2,.8,.2,1) both}
.mode-heading p{margin:0 0 8px;color:#008fa0;font-size:11px;font-weight:900;letter-spacing:.3em}
.mode-heading h1{margin:0;font-family:"Black Han Sans",sans-serif;font-size:clamp(48px,6vw,84px);line-height:1;color:#071024;letter-spacing:-.03em}
.mode-heading>span{display:block;margin-top:16px;color:#697083;font-size:12px;font-weight:600}
.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,38px);margin-top:clamp(44px,6vw,72px)}
.mode-card{position:relative;min-height:150px;padding:28px 30px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:20px;background:rgba(255,255,255,.6);border:1px solid rgba(7,16,36,.25);color:#071024;overflow:hidden;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;animation:modeEnter .52s cubic-bezier(.2,.8,.2,1) both}
.mode-card--easy{--mode-accent:var(--game-cyan);animation-delay:.24s}.mode-card--hard{--mode-accent:var(--game-magenta);animation-delay:.34s}
.mode-card:before,.mode-card:after{content:"";position:absolute;transition:.24s ease}.mode-card:before{left:0;top:0;width:62px;height:4px;background:var(--mode-accent)}.mode-card:after{right:-38px;top:-38px;width:90px;height:90px;border:1px solid var(--mode-accent);transform:rotate(45deg);opacity:.42}
.mode-card__index{position:absolute;right:20px;top:16px;color:#6d7482;font-size:8px;font-weight:800;letter-spacing:.14em}
.mode-card small{display:block;margin-bottom:8px;color:#6d7482;font-size:9px;font-weight:800;letter-spacing:.18em}.mode-card strong{display:block;font-family:"Black Han Sans",sans-serif;font-size:clamp(28px,3vw,44px);line-height:1}.mode-card strong i{display:inline-block;width:0;color:var(--mode-accent);font-size:.55em;font-style:normal;opacity:0;transform:translateX(-8px);transition:.22s ease}.mode-card p{margin:12px 0 0;color:#646b79;font-size:10px;font-weight:600;letter-spacing:.04em}.mode-card__enter{align-self:end;color:var(--mode-accent);font-size:9px;letter-spacing:.13em}.mode-card__enter span{font-size:18px}
.mode-card:hover,.mode-card:focus-visible{transform:translateY(-4px) scale(1.015);border-color:var(--mode-accent);box-shadow:0 0 24px color-mix(in srgb,var(--mode-accent) 27%,transparent);outline:none}.mode-card:hover strong i,.mode-card:focus-visible strong i{width:1em;opacity:1;transform:none}
.mode-panel__status{position:absolute;left:28px;right:28px;bottom:20px;display:flex;justify-content:space-between;color:#7b8290;font-size:8px;font-weight:800;letter-spacing:.13em}.mode-panel__status span:first-child{color:#008fa0}
.mode-select-page .site-footer{position:relative}.mode-select-page .brand-logo-image{display:block;max-width:145px;max-height:52px;object-fit:contain}
.game-notice[hidden]{display:none}.game-notice{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:20px}.game-notice__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58);backdrop-filter:blur(3px)}.game-notice__dialog{--notice-accent:var(--game-cyan);position:relative;width:min(90vw,520px);max-height:calc(100svh - 40px);overflow:auto;padding:clamp(30px,5vw,48px);border:1px solid color-mix(in srgb,var(--notice-accent) 70%,transparent);background:var(--hm-surface-2);color:var(--hm-white);box-shadow:0 24px 70px rgba(0,0,0,.48);outline:none}.game-notice.is-hard .game-notice__dialog{--notice-accent:var(--game-magenta)}.game-notice__dialog>small{color:var(--notice-accent);font-size:9px;font-weight:800;letter-spacing:.16em}.game-notice__dialog h2{margin:14px 0 28px;font-size:clamp(28px,5vw,40px);line-height:1.2;letter-spacing:-.03em}.game-notice__copy{color:var(--hm-muted);font-size:14px;line-height:1.75}.game-notice__copy p{margin:0 0 18px}.game-notice__copy strong{color:var(--hm-white);font-weight:800;box-shadow:inset 0 -1px var(--notice-accent)}.game-notice__actions{display:grid;grid-template-columns:1fr 1.7fr;gap:10px;margin-top:32px}.game-notice__actions button{min-height:48px;padding:0 16px;border:1px solid rgba(245,247,250,.28);background:transparent;color:var(--hm-white);font-size:12px;font-weight:700;cursor:pointer}.game-notice__confirm{border-color:var(--notice-accent)!important;background:var(--notice-accent)!important;color:var(--hm-bg)!important}.game-notice__actions button:hover,.game-notice__actions button:focus-visible{border-color:var(--notice-accent);outline:2px solid color-mix(in srgb,var(--notice-accent) 45%,transparent);outline-offset:2px}.is-modal-open{overflow:hidden}
@keyframes modeEnter{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media(max-width:820px){.mode-grid{grid-template-columns:1fr}.mode-panel{padding-top:90px}.mode-card{min-height:132px}.mode-panel__status span:nth-child(2){display:none}}
@media(max-width:560px){.mode-shell{padding:98px 14px 54px}.mode-panel{min-height:0;padding:82px 20px 70px}.mode-panel__tag span{display:none}.mode-card{padding:24px 20px;grid-template-columns:1fr}.mode-card__enter{display:none}.mode-heading>span{line-height:1.6}.mode-panel__status{left:20px;right:20px}.mode-select-page:before{inset:64px 0 0}.game-notice{padding:14px}.game-notice__dialog{width:min(100%,520px);max-height:calc(100svh - 28px);padding:28px 22px}.game-notice__actions{grid-template-columns:1fr}.game-notice__actions button{min-height:46px}}
@media(prefers-reduced-motion:reduce){.mode-heading,.mode-card{animation:none}.mode-card{transition:border-color .2s ease}}