/* Campaign UI: comfortable in portrait and landscape, including short displays. */
h1{font-size:clamp(58px,6.6vw,90px);letter-spacing:-4px}.panel{top:20%;width:380px;max-height:calc(100dvh - 150px);overflow-y:auto;scrollbar-width:none;touch-action:pan-y;padding:4px 10px 12px 0}.panel::-webkit-scrollbar{display:none}.intro{margin-bottom:16px}.levelSummary{font-size:12px;letter-spacing:.5px;margin:10px 0 12px;color:#526b5d}.night .levelSummary{color:#d4decc}.subactions{gap:12px}.subactions span{margin-left:4px}.hint{margin:12px 0 8px}.characterGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.characterGrid .option{margin:0;padding:10px 7px;text-align:center}.characterGrid canvas{display:block;width:100%;height:85px;object-fit:contain}.characterGrid b{font-size:13px}.characterGrid small{line-height:1.45;font-size:11px}.levelGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.levelGrid button{background:#e1e7d3;border-radius:10px;padding:15px 5px;min-height:67px}.levelGrid .selected{background:#315b45;color:#f4f0dc}.levelGrid b{font:24px Georgia,serif;display:block}.levelGrid small{font-size:10px;margin-top:5px;display:block}.stat{min-width:165px}.stat strong small{font:12px Arial}.bar{margin:8px 0 5px}.controlset button{min-height:60px;min-width:82px}.controlset .sprint{min-width:120px}#hud{pointer-events:none}.networkButton{margin-bottom:8px}.night #toast{color:#294737}.night .levelGrid button{color:#25432f}dialog{touch-action:pan-y}#dialogContent{touch-action:pan-y}
@media(max-width:699px){.panel{left:7%;width:86%;top:17%;max-height:calc(100dvh - 155px)}h1{font-size:64px;letter-spacing:-3px;margin:18px 0}.intro{font-size:13px}.eyebrow{font-size:9px;letter-spacing:1.8px}.stat{min-width:0;flex:1;padding:9px 11px}.stat strong{font-size:23px}.stat small{font-size:9px;letter-spacing:.4px}#hud{top:82px;gap:8px}.characterGrid{grid-template-columns:repeat(2,1fr)}.controlset{left:4%;right:4%}.controlset button{padding:10px 12px;min-width:65px;min-height:56px;font-size:11px}.controlset .sprint{min-width:105px}.rightcontrols{gap:7px}.levelGrid{gap:7px}dialog{padding:30px 20px}.levelGrid button{padding:10px 3px}}
@media(max-height:600px) and (min-width:700px){header{top:12px}#brand img{height:32px;width:32px}#brand{font-size:18px}#brand small{font-size:8px}.panel{top:17%;width:325px;max-height:calc(100dvh - 110px)}h1{font-size:49px;margin:12px 0;letter-spacing:-2px}.intro{font-size:11px;margin-bottom:9px}.eyebrow{font-size:8px}.modes{margin-bottom:6px}.modes button{padding:7px}.primary{padding:11px 16px;font-size:13px}.levelSummary{margin:5px 0 8px;font-size:10px}.subactions{margin-top:3px}.subactions button{padding:6px 0;font-size:10px}.hint{font-size:8px;margin:7px 0}.networkButton{font-size:10px}.stat{min-width:150px;padding:8px 12px}.stat strong{font-size:23px}.stat small{font-size:9px}#hud{top:59px}.bar{height:3px;margin:6px 0}.controlset button{min-height:44px;padding:8px 16px}.controlset .sprint{min-width:120px}footer{bottom:12px}}

.jonahPortrait{width:100%;height:85px;object-fit:cover;object-position:50% 48%;border-radius:6px;display:block;margin-bottom:6px}
@media(max-height:450px) and (min-width:700px){.panel{top:16%;max-height:calc(100dvh - 105px)}h1{font-size:43px;margin:9px 0}.intro{display:none}.subactions button{padding:5px 0}.hint{margin:5px 0}.networkButton{margin-bottom:0}}
#hud.split{inset:0;display:block}#hud.split .stat{position:absolute;left:4%;top:84px;width:155px;min-width:0}#hud.split .stat:nth-child(2){top:calc(50% + 12px)}
@media(max-height:600px) and (min-width:700px){#hud.split .stat{top:57px;width:145px;padding:7px 10px}#hud.split .stat:nth-child(2){top:calc(50% + 8px)}}

.characterGrid canvas{background:white;border-radius:6px;margin-bottom:6px}

#menu .modes button,#menu .primary,#menu .subactions button,#menu .networkButton,#skies button{font-weight:700}#menu .eyebrow,#menu .levelSummary{font-weight:600}

#brand{font-family:Georgia,'Times New Roman',serif;font-size:27px;letter-spacing:-.6px;font-weight:600}#brand b{font-weight:400;font-style:italic}#brand small{font-family:Arial,sans-serif;font-size:8px;font-weight:600;letter-spacing:3.4px;text-transform:uppercase;margin-top:7px}#brand img{box-shadow:0 3px 14px #244a3422}@media(max-width:699px){#brand{font-size:23px}#brand small{font-size:7px;letter-spacing:2.8px}}

#brand,#brand b{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400}#brand small{font-family:Georgia,'Times New Roman',serif;font-style:normal;font-weight:400;font-size:10px;letter-spacing:2.7px;text-transform:none;margin-top:5px}@media(max-width:699px){#brand small{font-size:9px;letter-spacing:2.2px}}

#brand>span{display:block;text-align:center}#brand small{text-align:center;width:100%;padding-left:2.7px}
.stat .travelerName{display:block;font:700 15px/1.2 Arial,sans-serif;letter-spacing:.3px;margin-bottom:7px}@media(max-width:699px),(max-height:600px){.stat .travelerName{font-size:12px;margin-bottom:4px}}
#brand img{object-fit:contain;border-radius:9px;width:56px;height:56px}@media(max-width:699px){#brand img{width:42px;height:42px}}@media(max-height:600px) and (min-width:700px){#brand img{width:38px;height:38px}}
#footer{flex-wrap:nowrap}#footer .copyright{display:block;position:absolute;left:50%;transform:translateX(-50%);text-align:center;font:12px Georgia,serif;letter-spacing:1px;white-space:nowrap}@media(max-width:699px){#footer>span:first-child{display:none}#footer .copyright{position:static;transform:none;order:-1;font-size:10px}#footer{gap:12px}}
#footer .copyrightYear{font-family:Arial,sans-serif;font-size:.9em;font-weight:400;font-variant-numeric:lining-nums tabular-nums;letter-spacing:.5px}

/* Shared touch symbols retain accessible action names and generous hit targets. */
.controlset button{display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:transform .12s ease,background-color .12s ease}
.controlIcon{display:block;width:64px;height:64px;opacity:.3;pointer-events:none;filter:drop-shadow(0 2px 2px #233d2918)}
.controlset button{padding:3px 13px;min-height:72px;border:1.5px solid #e7efdbb3;border-radius:999px;background:transparent;box-shadow:0 0 0 1px #294c3940;backdrop-filter:none}
.controlset .sprint{background:transparent}
.night .controlset button{background:transparent;border-color:#d9e9d5bf}
.controlset .jumpCount{margin-top:12px}
.controlPlayer,.jumpCount{font:600 11px/1 Arial,sans-serif;pointer-events:none}
.jumpCount{align-self:flex-start;margin-top:3px;opacity:.8}
.controlset button:active{background:transparent;border-color:#fff0bd;transform:translateY(2px) scale(.97)}
@media(max-height:600px){.controlIcon{width:47px;height:47px}.controlset button{min-height:54px;padding:2px 12px}.controlset .jumpCount{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.controlset button{transition:none}}

/* Keep the full home menu above the footer on desktop. */
#menu h1 span,#menu h1 em{white-space:nowrap}
#footer #skies{margin-left:auto}
@media(min-width:700px){
 #menu.panel{top:clamp(96px,16vh,145px);width:clamp(380px,40vw,480px);max-height:calc(100dvh - clamp(96px,16vh,145px) - 70px);padding:2px 8px 8px 0}
 #menu h1{font-size:clamp(44px,min(5.4vw,9vh),70px);line-height:1.03;letter-spacing:-2.5px;margin:20px 0 24px}
 #menu .intro{display:block;font-size:13px;line-height:1.75;margin:0 0 24px}
 #menu .journeyReward{display:inline-block;margin-top:10px}
 #menu .modes{margin-bottom:16px}
 #menu .levelSummary{margin:12px 0}
 #menu .primary{padding:14px 20px}
 #menu .subactions{margin-top:14px}
 #menu .networkButton{margin:12px 0 0}
}
@media(min-width:700px) and (max-height:620px){
 #menu.panel{top:86px;max-height:calc(100dvh - 142px)}
 #menu h1{font-size:42px;margin:14px 0 18px}
 #menu .intro{font-size:12px;line-height:1.6;margin-bottom:16px}
 #menu .primary{padding:11px 16px}
 #menu .subactions button{padding:7px 0}
}
@media(min-width:700px) and (max-height:460px){
 #menu.panel{top:76px;left:6%;width:88%;max-height:calc(100dvh - 126px);display:grid;grid-template-columns:1fr 1fr;column-gap:28px;align-content:start}
 #menu .eyebrow,#menu h1,#menu .intro{grid-column:1}
 #menu h1{font-size:40px;margin:14px 0 18px}
 #menu .intro{grid-row:3 / span 3}
 #menu .modes{grid-column:2;grid-row:1 / span 2;align-self:start}
 #menu .levelSummary{grid-column:2;grid-row:3;margin:0 0 8px}
 #menu .primary{grid-column:2;grid-row:4}
 #menu .subactions{grid-column:2;grid-row:5}
 #menu .networkButton{grid-column:2;grid-row:6}
}

@media(max-width:699px){#menu h1{font-size:56px;margin:22px 0 24px}#menu .intro{margin-bottom:24px}#menu .journeyReward{display:inline-block;margin-top:9px}#menu .modes{margin-bottom:16px}#menu .subactions{margin-top:16px}#menu .networkButton{margin-top:12px}}

/* Give the opening eyebrow its own breathing room. */
#menu .eyebrow{margin-bottom:0;padding-bottom:0}
@media(min-width:700px) and (max-height:460px){#menu .eyebrow{margin-bottom:0;padding-bottom:0}}

/* Move the complete introduction, including its eyebrow, down together. */
@media(min-width:700px) and (min-height:621px){#menu.panel{top:calc(clamp(96px,16vh,145px) + 32px);max-height:calc(100dvh - clamp(96px,16vh,145px) - 102px)}}
@media(min-width:700px) and (min-height:461px) and (max-height:620px){#menu.panel{top:110px;max-height:calc(100dvh - 166px)}}
@media(min-width:700px) and (max-height:460px){#menu.panel{top:84px;max-height:calc(100dvh - 134px)}}
@media(max-width:699px){#menu.panel{top:calc(17% + 24px);max-height:calc(83dvh - 90px)}}

/* A single-line title and aligned, deliberately separated supporting copy. */
#menu h1{white-space:nowrap;font-size:clamp(30px,3.6vw,46px);line-height:1.15;letter-spacing:-1.5px;margin:22px 0 24px}
#menu .intro{text-align:left;line-height:1.8}
#menu .introLead{display:block}
#menu .journeyReward{display:block;max-width:42ch;margin-top:14px;line-height:1.65}
@media(max-width:699px){#menu h1{font-size:clamp(26px,8.1vw,46px);letter-spacing:-1px;margin:22px 0}#menu .journeyReward{margin-top:14px}}
@media(min-width:700px) and (max-height:460px){#menu h1{font-size:clamp(26px,3.5vw,38px);letter-spacing:-1px;margin:14px 0 18px}#menu .journeyReward{margin-top:10px}}

@media(max-width:699px) and (max-height:700px){#menu h1{margin:16px 0}#menu .intro{font-size:12px;line-height:1.65;margin-bottom:16px}#menu .journeyReward{margin-top:10px}#menu .modes{margin-bottom:10px}#menu .subactions{margin-top:8px}#menu .networkButton{margin-top:6px}}

/* Bring the start action up and align secondary navigation in two tidy rows. */
#menu .modes{margin-bottom:8px}
#menu .levelSummary{margin:6px 0 8px}
#menu .subactions{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:12px}
#menu .subactions button{text-align:left}
#menu .subactions button:last-child{text-align:right}
#menu .menuExtras{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px}
#menu .menuExtras button{padding:9px 0;font-size:11px;font-weight:600;color:#3e5b4f;white-space:nowrap}
#menu .menuExtras .networkButton{order:-1;margin:0}
#menu .menuExtras #records{text-align:right}
#menu .menuExtras #records span{margin-left:5px}
.night #menu .menuExtras button{color:#d4decc}
@media(min-width:700px) and (max-height:460px){#menu .menuExtras{grid-column:2;grid-row:6;margin-top:4px}#menu .menuExtras button{font-size:10px}}

#menu .subactions{display:flex;justify-content:flex-start;align-items:center;gap:32px}#menu .subactions button:last-child{text-align:left}
@media(max-width:699px){#menu .subactions{gap:26px}}

#menu .menuExtras{justify-content:flex-start;gap:32px}#menu .menuExtras #records{text-align:left}#menu .menuExtras .networkButton{order:0}
@media(max-width:699px){#menu .menuExtras{gap:26px}}

#menu .menuExtras{flex-direction:column;align-items:flex-start;gap:2px}#menu .menuExtras .networkButton{text-align:left}


/* A quiet serif introduction that echoes the Lantern wordmark. */
#menu .eyebrow{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;font-size:clamp(16px,1.6vw,21px);line-height:1.3;letter-spacing:.3px;gap:10px;text-transform:none;transform:translateX(-14px)}
#menu .eyebrow .journeyBullet{flex:0 0 auto;width:auto;height:auto;background:none;border-radius:0;font-family:Arial,sans-serif;font-style:normal;font-size:18px;line-height:1;color:#718c63}
@media(max-height:460px){#menu .eyebrow{font-size:16px}}