:root{--ink:#24334c;--paper:#fff8e7;--gold:#ffc644;--blue:#70b0cc;--ice:#a7d6e5;--coral:#bb5033;--shadow:#31394d;--green:#2f8b62}
*{box-sizing:border-box}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.game-main{width:min(100%,1180px);margin:0 auto;padding:0 8px 44px}
.feature-label{width:max-content;margin:10px auto 0;padding:4px 8px;color:#fff;background:var(--coral);border:2px solid var(--ink);border-radius:4px;font-size:.68rem;font-weight:950;letter-spacing:.08em}
.hero-stage{width:min(100%,840px);margin:18px auto 0;aspect-ratio:16/9;background:var(--ice)}
.hero-stage img{display:block;width:100%;height:100%;object-fit:cover}
.intro-copy{text-align:center}
.intro-copy h1{margin:4px 0 8px;font-size:clamp(2.15rem,7vw,4.7rem);letter-spacing:-.045em}
.intro-copy .dek{width:min(100%,760px);margin:0 auto 12px;font-weight:850;line-height:1.6}
.news-brief,.rule-card{width:min(100%,760px);margin:10px auto;padding:13px 15px;background:#fff;border:1px solid #a9b8c5;border-left:6px solid var(--blue);border-radius:8px;text-align:left;line-height:1.55}
.rule-card{border-left-color:var(--gold)}
.news-brief strong,.rule-card strong{font-size:.82rem;letter-spacing:.05em}
.news-brief p,.rule-card p{margin:5px 0 0}
#start,.result-actions button{min-height:48px;padding:10px 18px;color:var(--ink);background:var(--gold);border:3px solid var(--ink);border-radius:10px;box-shadow:0 5px 0 var(--ink);font:950 1rem/1.15 inherit;cursor:pointer}
#start{width:min(100%,430px);margin:10px auto 6px}
#start:disabled,.result-actions button:disabled{cursor:wait;opacity:.55}
#start:active,.result-actions button:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ink)}
.unofficial{display:block;width:min(100%,760px);margin:10px auto 0;color:#5c6876;line-height:1.5}

#play{width:min(100%,620px);margin:4px auto 16px}
.play-panel{padding:7px;background:var(--paper);border:4px solid var(--ink);border-radius:16px;box-shadow:0 7px 0 rgba(36,51,76,.2)}
.play-hud{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:6px}
.status-ticket{padding:5px 9px;background:#fff;border:1px solid #a9b8c5;border-left:5px solid var(--blue);border-radius:7px;color:#536174;font-size:.66rem;line-height:1.05;text-transform:uppercase}
.status-ticket b{display:block;margin-top:2px;color:var(--ink);font-size:1.04rem;white-space:nowrap}
.board-frame{position:relative;width:100%;aspect-ratio:600/650;overflow:hidden;background:var(--ice);border:4px solid var(--ink);border-radius:12px;box-shadow:4px 4px 0 rgba(36,51,76,.18);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab}
.board-frame:active{cursor:grabbing}
#mapArt,#shadowCanvas{position:absolute;inset:0;width:100%;height:100%}
#mapArt{object-fit:cover;opacity:.72;transform:scale(1.04)}
#shadowCanvas{z-index:2}
.eclipse-source{position:absolute;z-index:3;left:50%;top:29%;width:54px;height:54px;margin-left:-27px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px var(--ink),0 0 0 11px var(--paper);pointer-events:none}
.eclipse-source:before,.eclipse-source:after{content:"";position:absolute;left:50%;top:-17px;z-index:-1;width:5px;height:88px;background:var(--gold);transform:translateX(-50%)}.eclipse-source:after{transform:translateX(-50%) rotate(90deg)}.eclipse-source i{position:absolute;inset:9px;border:4px solid var(--ink);border-radius:50%;background:var(--shadow)}
.data-flow{position:absolute;z-index:4;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}.data-flow path{fill:none;stroke:var(--gold);stroke-width:7;stroke-dasharray:11 9}
#jet{position:absolute;z-index:5;width:64px;height:64px;left:50%;top:74%;margin:-32px 0 0 -32px;transform-origin:50% 50%;filter:drop-shadow(0 3px 0 rgba(36,51,76,.22));pointer-events:none}
#corona{position:absolute;z-index:4;top:12px;right:10px;width:150px;opacity:.28;transform:scale(.93);transform-origin:top right;transition:opacity .12s,transform .12s;pointer-events:none}
.observation-ribbon{position:absolute;z-index:5;right:16px;top:118px;width:112px;height:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:3px;background:var(--paper);border:3px solid var(--ink);opacity:0;pointer-events:none}.observation-ribbon i{background:var(--gold)}
.contact-ring{position:absolute;z-index:4;width:68px;height:68px;margin:-34px 0 0 -34px;border:8px double var(--gold);border-radius:50%;left:50%;top:74%;opacity:0;pointer-events:none}
.recovery-cue{position:absolute;z-index:7;top:59%;color:var(--coral);font:950 66px/1 system-ui;filter:drop-shadow(0 3px var(--paper));opacity:0;pointer-events:none}.recovery-cue[data-direction="left"]{right:57px}.recovery-cue[data-direction="right"]{left:57px}.recovery-cue[data-direction="left"]:after{content:"←"}.recovery-cue[data-direction="right"]:after{content:"→"}
.airflow{position:absolute;z-index:4;top:62%;display:grid;gap:7px;opacity:0;pointer-events:none}.airflow i{display:block;width:72px;height:6px;background:var(--coral);border-left:15px solid var(--gold);transform:skewX(-25deg)}
.board-frame[data-zone="core"] :is(#corona,.data-flow,.observation-ribbon,.contact-ring){opacity:1}.board-frame[data-zone="core"] #corona{transform:scale(1)}
.board-frame[data-zone="edge"] #corona{opacity:.52}
.board-frame[data-zone="edge"] .recovery-cue,.board-frame[data-zone="lost"] .recovery-cue{opacity:1}
.board-frame[data-max="left"] .airflow{left:7%;opacity:1}.board-frame[data-max="right"] .airflow{right:7%;opacity:1}.board-frame[data-max="left"] .airflow i{transform:scaleX(-1) skewX(-25deg)}
.gesture-copy{position:absolute;z-index:6;left:50%;bottom:10px;width:calc(100% - 26px);transform:translateX(-50%);padding:7px 9px;color:var(--ink);background:rgba(255,248,231,.92);border:2px solid var(--ink);border-radius:6px;font-size:.69rem;font-weight:950;text-align:center;letter-spacing:.025em;pointer-events:none}
.edge-tension{position:absolute;z-index:7;top:0;bottom:0;width:0;background:var(--coral);pointer-events:none;transition:width .08s}
.edge-tension.left{left:0}.edge-tension.right{right:0}
.board-frame[data-max="left"] .edge-tension.left,.board-frame[data-max="right"] .edge-tension.right{width:10px}
.feedback-panel{display:flex;align-items:center;gap:8px;min-height:38px;margin:6px 0 0;padding:7px 10px;background:#fff;border-left:6px solid var(--blue);border-radius:6px;font-weight:900;font-size:.82rem;line-height:1.2;pointer-events:none}
.feedback-panel[data-zone="core"]{border-left-color:var(--green)}
.feedback-panel[data-zone="edge"]{border-left-color:var(--gold)}
.feedback-panel[data-zone="lost"]{border-left-color:var(--coral)}
#feedbackIcon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;color:#fff;background:var(--ink);border-radius:50%;font-size:.72rem}

#result{width:min(100%,760px);margin:10px auto 24px}
.result-card{padding:18px;color:var(--ink);background:var(--paper);border:4px solid var(--ink);border-radius:20px;box-shadow:0 8px 0 rgba(36,51,76,.2);text-align:center}
#trace{display:block;width:100%;height:auto;aspect-ratio:600/210;background:var(--ice);border:4px solid var(--ink);border-radius:12px}
.result-time{margin:12px 0 0;font-weight:950;line-height:.9}
.result-time span{font-size:clamp(3.8rem,15vw,6.8rem)}
.result-time small{font-size:1rem}
.result-card h2{margin:7px 0;font-size:clamp(1.55rem,5vw,2.7rem)}
.result-card>p:not(.result-time){max-width:620px;margin:8px auto;line-height:1.55}
.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}
.result-actions button:nth-child(2),.result-actions button:nth-child(3){background:#fff}
#editorial{width:min(100%,820px);margin:25px auto 0}
#editorial section{padding:15px 0;border-top:1px solid #a9b8c5}
#editorial h2{margin:0 0 5px;font-size:1rem}
#editorial p{margin:0;line-height:1.7}
#editorial a{color:#174f7d}

@media(max-width:680px){
  .game-main{padding:0 2px 24px}.feature-label{margin-top:5px}.hero-stage{margin-top:7px}.intro-copy h1{font-size:2.1rem}.intro-copy .dek{font-size:.91rem}
  #play{margin:2px auto 8px}.play-panel{padding:4px;border-width:3px;border-radius:11px;box-shadow:0 4px 0 rgba(36,51,76,.18)}.play-hud{gap:4px;margin-bottom:4px}.status-ticket{padding:4px 5px;border-left-width:3px;font-size:.55rem}.status-ticket b{font-size:.9rem}
  .board-frame{border-width:3px;border-radius:9px}.feedback-panel{min-height:34px;margin-top:4px;padding:5px 7px;font-size:.7rem}.gesture-copy{bottom:7px;font-size:.59rem;padding:5px}.result-card{padding:11px;border-width:3px}.result-actions{grid-template-columns:1fr}
}
@media(max-width:360px) and (max-height:650px){.board-frame{aspect-ratio:600/620}#jet{width:58px;height:58px;margin:-29px 0 0 -29px}#corona{width:128px}.gesture-copy{font-size:.55rem}.feedback-panel{font-size:.65rem}}
@media(min-width:681px) and (max-height:800px){#play{width:500px}}
@media(prefers-reduced-motion:reduce){#mapArt{transform:none}#corona{transition:none}}