body.ch-game { background: radial-gradient(ellipse at 50% 0,#173848,#071219 70%); --ch-amber:#8ce4d0; --ch-ember:#8ce4d0; --ch-brass-dim:#29434f; --ch-line:rgba(157,211,217,.16); --ch-ink:#edf6f5; --ch-ink2:#acc1ca; --ch-ink3:#78929e; }
body.ch-game::before { opacity:.2; }
.ch-stage { max-width:1120px; gap:10px; margin:18px auto; }
.ch-topbar { background:#0b1b24; border-radius:12px; }
.ch-bezel { padding:10px; border-radius:14px; background:#0b1b24; box-shadow:0 0 0 1px #28424d,0 24px 70px #0005; }
.ch-bezel::after,.ch-coin { display:none; }
.ch-bezel #game-container { width:100%; max-height:none; aspect-ratio:auto; margin:0 auto; position:relative; overflow:hidden; border-radius:8px; }
.ch-bezel #game-container canvas { position:absolute; top:0; left:0; width:960px !important; height:640px !important; max-height:none; transform-origin:top left; image-rendering:auto; border-radius:0; }
#landing-panel { position:absolute; z-index:3; left:50%; top:48%; transform:translate(-50%,-50%); width:430px;max-width:94%; max-height:94%; overflow:auto; box-sizing:border-box; padding:28px; color:#edf6f5; text-align:center; border:1px solid #75949b55; border-radius:16px; background:linear-gradient(145deg,#122b36f5,#091923f5); box-shadow:0 18px 80px #0006; }
#landing-panel[hidden] { display:none; }
#landing-panel .mission-tag { font:500 10px 'JetBrains Mono',monospace; letter-spacing:3px; color:#9ed7cd; }
#landing-panel h2 { margin:13px 0 10px; font:700 38px/1.05 'Bricolage Grotesque',system-ui; letter-spacing:-1px; color:#fff; }
#landing-panel p { font:14px/1.65 Inter,system-ui; color:#b6cbd2; margin:12px 0 20px; }
#landing-panel button { background:#a0efdb; color:#09252d; border:0; border-radius:8px; padding:14px 26px; font:700 14px Inter,system-ui; cursor:pointer; min-width:180px; }
#landing-panel button:hover { background:#c4ffed; }
#landing-panel button:focus-visible { outline:3px solid white; outline-offset:4px; }
#landing-panel .panel-controls { display:block; font:10px/1.8 'JetBrains Mono',monospace; color:#87a4b1; margin-top:16px; }
#landing-panel .lg-board-slot[hidden] { display:none; }
/* The panel's ID-level button/paragraph rules would otherwise beat boards.js's class rules; mirror its own styles here. */
#landing-panel .lg-board button { min-width:0; padding:6px 12px; border-radius:8px; border:1px solid rgba(128,128,128,.5); background:rgba(128,128,128,.2); color:inherit; font:inherit; font-size:13px; }
#landing-panel .lg-board button:hover { background:rgba(128,128,128,.32); }
#landing-panel .lg-board .chg { background:none; border:0; padding:0 4px; font-size:12px; opacity:.7; }
#landing-panel .lg-board p { margin:8px 0 0; font-size:13px; line-height:1.5; }
#landing-panel .lg-board .hint, #landing-panel .lg-board .err { margin-top:6px; font-size:12px; }
.ch-paused canvas { filter:none; }
.ch-paused::after { display:none; }
.ch-touch-btn { touch-action:none; min-height:52px; }
.game-instructions { text-align:center; color:#a7bdc4; }
@media(max-width:600px) { .ch-stage {padding:0 8px; margin:8px auto;} .ch-bezel {padding:4px;} #landing-panel {padding:18px;} #landing-panel p {font-size:12px;margin:8px 0 12px;} #landing-panel h2 {margin:8px 0;} #landing-panel .panel-controls {margin-top:10px;font-size:9px;} }
@media(max-height:540px) and (orientation:landscape) { .ch-stage {margin:4px auto;} .ch-topbar {padding:5px 12px;} .ch-hint {display:none;} #landing-panel {padding:14px;top:50%;} #landing-panel h2 {font-size:26px;} #landing-panel p {margin:7px 0;font-size:12px;} #landing-panel .panel-controls {display:none;} }

.ch-title h1 { color:#edf6f5; }
@media(max-width:600px) {
 #landing-panel {width:96%;padding:12px;top:50%;}
 #landing-panel .mission-tag {font-size:8px;letter-spacing:1.5px;}
 #landing-panel h2 {font-size:24px;margin:6px 0;}
 #landing-panel p {font-size:11px;line-height:1.45;margin:7px 0 10px;}
 #landing-panel button {font-size:12px;padding:11px 18px;min-width:150px;}
 #landing-panel .panel-controls {font-size:8px;line-height:1.5;margin-top:7px;}
}

.lander-mobile-hud {display:none;}
.ch-touch-btn {background:#122c38;border-color:#33545f;color:#d7eee9;}


#deploy-payload {position:absolute;z-index:4;bottom:10%;left:50%;transform:translateX(-50%);border:1px solid #aff5dd;border-radius:8px;background:#a0efdb;color:#09252d;padding:12px 18px;font:700 13px Inter,system-ui;cursor:pointer;white-space:nowrap;}
#deploy-payload[hidden] {display:none;}
#deploy-payload:focus-visible {outline:3px solid white;outline-offset:3px;}
@media(max-width:600px) {#deploy-payload {padding:8px 12px;font-size:11px;bottom:8%;}}

/* Readable HTML instruments replace scaled canvas text on compact screens. */
#landing-report {margin-top:16px;text-align:left;}
#landing-report[hidden] {display:none;}
#landing-report h3 {margin:0;color:#edf6f5;font:600 14px Inter,system-ui;}
#landing-report p {font-size:11px;line-height:1.4;margin:6px 0;}
#landing-report table {width:100%;border-collapse:collapse;font:12px/1.5 'JetBrains Mono',monospace;}
#landing-report th,#landing-report td {padding:5px 3px;border-bottom:1px solid #75949b33;text-align:right;white-space:nowrap;}
#landing-report th:first-child {text-align:left;}
#landing-report thead th {font-size:10px;color:#a9bdc8;}
#landing-report .within-limit {color:#a5efcb;}
#landing-report .over-limit {color:#ffc294;}
.lander-compact .ch-stage {padding:0 8px;gap:8px;}
.lander-compact .ch-bezel {padding:4px;}
.lander-compact .lander-mobile-hud {display:grid;gap:8px;padding:4px 6px;text-align:left;color:#c7dfe2;font:13px/1.4 Inter,system-ui;}
.lander-mission {font-weight:600;color:#a5efcb;}
.lander-readouts {display:grid;grid-template-columns:1fr 1.25fr .6fr;gap:6px;}
.lander-readouts span {font-size:11px;color:#9bb9c3;}
.lander-readouts b {display:block;color:#edf6f5;font:600 15px/1.6 'JetBrains Mono',monospace;white-space:nowrap;}
.lander-compact .lander-cue {font-size:13px;line-height:1.4;color:#f0d3a4;}
.lander-nav {font-size:12px;color:#acc6d0;}
.lander-checks {display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.lander-checks>div {padding:5px 8px;border:1px solid #45616b;border-radius:6px;color:#ffc294;}
.lander-checks .check-pass {color:#a5efcb;border-color:#345d55;}
.lander-checks b {display:block;font-size:12px;font-weight:500;color:#d6e6e9;}
.lander-compact .ch-hint,.lander-compact .game-instructions {display:none;}
.lander-compact #landing-panel {top:50%;padding:12px;max-height:100%;}
.lander-compact #landing-panel h2 {font-size:24px;}
.lander-compact #landing-panel p {font-size:13px;line-height:1.4;}
.lander-compact #landing-panel .panel-controls {display:none;}
.lander-compact #landing-report p {font-size:11px;}
.lander-compact #deploy-payload {font-size:13px;bottom:8%;}

/* A short landscape screen uses the space beside the flight view. */
.lander-landscape .ch-stage {display:grid;grid-template-columns:minmax(0,1fr) 238px;grid-template-rows:auto auto;gap:6px;margin:4px auto;}
.lander-landscape .ch-topbar {grid-column:1 / -1;grid-row:1;grid-template-columns:auto 1fr auto auto;grid-template-areas:none;gap:10px;padding:5px 8px;}
.lander-landscape .ch-topbar>* {grid-area:auto;}
.lander-landscape .ch-eyebrow,.lander-landscape .ch-topbar .lg-tb {display:none;}
.lander-landscape .ch-title h1 {font-size:16px;white-space:nowrap;}
.lander-landscape .ch-scores {gap:10px;}
.lander-landscape .ch-score b {font-size:16px;}
.lander-landscape .ch-score .ch-l {font-size:8px;margin-bottom:3px;}
.lander-landscape .ch-btn {padding:8px 10px;}
.lander-landscape .ch-bezel {grid-column:1;grid-row:2;align-self:start;}
.lander-landscape .lander-mobile-hud {grid-column:2;grid-row:2;align-self:start;gap:6px;padding:2px 0 64px;}
.lander-landscape .lander-mission {font-size:12px;}
.lander-landscape .lander-readouts b {font-size:13px;}
.lander-landscape .lander-checks {grid-template-columns:1fr;gap:3px;}
.lander-landscape .lander-checks>div {display:flex;justify-content:space-between;align-items:center;padding:3px 5px;font-size:12px;}
.lander-landscape .lander-checks b {font-size:11px;}
.lander-landscape .ch-touch {display:flex;grid-column:2;grid-row:2;align-self:end;padding:0;gap:6px;}
.lander-landscape .ch-touch-group {gap:6px;flex-wrap:nowrap;}
.lander-landscape .ch-touch-btn {min-width:50px;height:54px;padding:0 10px;font-size:17px;}
@media(max-width:700px) { .lander-landscape .ch-stage {grid-template-columns:minmax(0,1fr) 220px;} }

/* Result cards can use the screen height, independent of the scaled flight view. */
.lander-compact #landing-panel.mission-result,.lander-compact #landing-panel.mission-menu {position:fixed;top:50%;left:50%;width:430px;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);z-index:1000;background:linear-gradient(145deg,#122b36,#091923);box-shadow:0 0 0 100vmax rgba(2,13,23,.75),0 18px 80px #0006;}

.lander-compact:not(.lander-landscape) .ch-topbar {grid-template-columns:112px minmax(0,1fr);padding:8px;gap:8px;}
.lander-compact:not(.lander-landscape) .ch-eyebrow {display:none;}
.lander-compact:not(.lander-landscape) .ch-controls {flex-wrap:nowrap;gap:4px;}
.lander-compact:not(.lander-landscape) .ch-btn {padding:8px;font-size:11px;}
.lander-compact:not(.lander-landscape) .ch-btn-icon {width:30px;}
.lander-compact:not(.lander-landscape) .ch-scores {gap:8px;flex-wrap:nowrap;padding-right:0;}
.lander-compact:not(.lander-landscape) .ch-score b {font-size:14px;}
.lander-compact:not(.lander-landscape) .ch-score .ch-l {font-size:8px;margin-bottom:4px;}
.lander-landscape .lander-checks>div {padding:1px 5px;line-height:1.25;}
.lander-compact:not(.lander-landscape) .ch-back:not(.lg-home) {font-size:0;width:32px;min-width:32px;padding:8px !important;box-sizing:border-box;}
.lander-compact:not(.lander-landscape) .ch-back:not(.lg-home)::before {content:'←';font-size:14px;}

/* Mission control remains readable outside the scaled flight canvas. */
#landing-panel .secondary-action {display:block;margin:10px auto 0;min-width:0;padding:9px 16px;background:transparent;border:1px solid #567a80;color:#b9e6da;font-size:12px;}
#landing-panel #career-award {font-size:12px;color:#efcf88;margin:10px 0;}
#career-award[hidden],#mission-hub[hidden] {display:none;}
.mission-hub-open {overflow:hidden;}
#mission-hub {position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;overflow:auto;padding:24px 16px;background:rgba(2,12,20,.93);color:#dcece9;box-sizing:border-box;}
.mission-hub-card {max-width:820px;margin:0 auto;padding:30px;border:1px solid #36545e;border-radius:20px;background:linear-gradient(145deg,#16323d,#091b24);box-shadow:0 30px 100px #0008;font:14px/1.5 Inter,system-ui;}
.mission-hub-card header {position:sticky;top:0;z-index:2;background:#16323d;padding:8px 0;display:flex;align-items:center;justify-content:space-between;}
.mission-hub-card .mission-tag {font:10px 'JetBrains Mono',monospace;letter-spacing:3px;color:#99d3c6;}
.mission-hub-card h2 {font:700 38px/1.1 'Bricolage Grotesque',system-ui;margin:8px 0;color:#f3fcf6;}
.mission-hub-card h3 {margin:24px 0 6px;color:#f0f7f4;font-size:19px;}
#mission-hub button {font:inherit;cursor:pointer;}
#mission-hub button:focus,#mission-hub summary:focus {outline:2px solid #b5f6df;outline-offset:3px;}
#close-hub {width:44px;height:44px;flex-shrink:0;border:1px solid #577883;border-radius:50%;background:#163440;color:#d5eee9;}
#career-summary {color:#afd6cf;margin:12px 0 22px;}
.operation-cards {display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.operation-cards button {text-align:left;padding:20px;border-radius:12px;border:1px solid #477667;background:linear-gradient(130deg,#244f4a,#153635);color:#e1f7e9;}
.operation-cards button:hover {border-color:#b1efcc;background:#295348;}
.operation-cards button>span {display:block;font:10px 'JetBrains Mono',monospace;letter-spacing:1.5px;color:#a4d6c9;}
.operation-cards strong {display:block;font-size:21px;margin:8px 0;}
.operation-cards small {display:block;font-size:12px;line-height:1.6;color:#bfd6d4;}
#start-daily {border-color:#867347;background:linear-gradient(135deg,#403e2e,#23352f);}
.hub-note {font-size:12px;color:#9db8c1;line-height:1.65;margin:8px 0 15px;}
#mission-list {display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.mission-choice {display:flex;align-items:center;text-align:left;min-height:82px;border:1px solid #34535f;border-radius:10px;background:#102a35;color:#e0eeed;padding:12px;}
.mission-choice:hover {background:#193e48;border-color:#7bb8b2;}
.mission-number {font:12px 'JetBrains Mono',monospace;color:#7397a5;margin-right:12px;}
.mission-choice strong {display:block;font-size:13px;font-weight:600;}
.mission-choice small {display:block;font-size:11px;line-height:1.5;color:#a2bec7;margin-top:4px;}
.mission-medal {margin-left:auto;padding-left:8px;font-size:12px;white-space:nowrap;}
.medal-0 {color:#577784;}.medal-1 {color:#e0a074;}.medal-2 {color:#cedee8;}.medal-3 {color:#f0cf72;}
.mission-hub-card details {margin-top:18px;border-top:1px solid #34535f;padding-top:15px;}
.mission-hub-card summary {cursor:pointer;font-weight:600;color:#e0eee9;}
.mission-hub-card summary span {font-weight:400;font-size:11px;color:#9db7c1;margin-left:10px;}
#livery-list {display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px;}
#livery-list button {display:flex;align-items:center;text-align:left;padding:12px;border:1px solid #42616a;background:#112e38;border-radius:8px;color:#dbeae7;font-size:12px;}
#livery-list button[aria-pressed="true"] {border-color:#9be8cc;background:#244b44;}
#livery-list button:disabled {opacity:.55;cursor:default;}
#livery-list i {width:12px;height:32px;flex-shrink:0;display:block;border-radius:6px 6px 2px 2px;margin-right:12px;}
#flight-log {padding:0;list-style:none;margin:10px 0;}
#flight-log li {padding:10px 0;border-bottom:1px solid #29434e;}
#flight-log strong {display:block;font-size:12px;font-weight:500;color:#d6e8e2;}
#flight-log span {display:block;font:10px/1.8 'JetBrains Mono',monospace;color:#a4bdc7;margin-top:3px;}
@media(max-width:600px) {
 #mission-hub {padding:10px;}
 .mission-hub-card {padding:18px 14px;border-radius:14px;}
 .mission-hub-card h2 {font-size:29px;}
 .operation-cards {grid-template-columns:1fr;gap:8px;}
 .operation-cards button {padding:15px;}
 .operation-cards strong {font-size:19px;margin:5px 0;}
 #mission-list,#livery-list {grid-template-columns:1fr;}
 .mission-choice {min-height:70px;}
 #landing-panel .secondary-action {margin-top:7px;padding:7px 12px;}
}

.ch-score[hidden] {display:none;}
/* the Armageddon mission's launch stage (?mission=armageddon): the game alone, the mission page tells the rest */
body.mission-stage .game-instructions,body.mission-stage .game-overview,body.mission-stage .ad-slot,body.mission-stage #fb-pill,body.mission-stage #mission-control,body.mission-stage #career-award,body.mission-stage [data-placement="below_game"]{display:none!important;}
