/* Runefall's two entry screens. Shared UI tokens and all gameplay styles remain
   owned by their existing files; these overrides are deliberately scoped. */
:is(#authScreen,#modeScreen) {
  --entry-gold:var(--ui-gold,#ead09a); --entry-muted:#b6c0c5;
  --entry-line:#a58b5e59; --entry-ink:#0b141b;
  color:var(--ui-text); font-family:var(--ui-font); color-scheme:dark;
}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) {position:relative;background:#08121b;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) > .page {width:100%;max-width:none;padding:0;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) > .page::before {display:none;}
:is(#authScreen,#modeScreen) :is(button,input,select) {font:inherit;}
:is(#authScreen,#modeScreen) :is(button,input,select,summary):focus-visible {outline:2px solid var(--ui-focus);outline-offset:4px;}
:is(#authScreen,#modeScreen) :is(button,summary) {touch-action:manipulation;}
:is(#authScreen,#modeScreen) :is(p,small,strong) {overflow-wrap:anywhere;}
:is(#authScreen,#modeScreen) .eyebrow {color:var(--entry-gold);font-size:10px;font-weight:600;letter-spacing:.2em;line-height:1.6;}
:is(#authScreen,#modeScreen) button {transition:border-color .18s,background-color .18s,box-shadow .18s,transform .18s;}
:is(#authScreen,#modeScreen) button:disabled {cursor:wait;opacity:.55;transform:none;}

/* A single static painting supplies the world; six small sparks add depth. */
#authScreen.authScreen {isolation:isolate;position:relative;width:100%;margin:0;padding:0;min-height:100svh;border:0;border-radius:0;box-shadow:none;overflow:hidden;background:#101d29 url('/art/brand/elderglen-keyart.webp') 45% center/cover no-repeat;}
#authScreen.authScreen::before {content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#06101a25 0%,#08121b05 38%,#08121b80 68%,#071018d9 100%),linear-gradient(0deg,#06101aef 0%,transparent 32%,#06101a73 100%);}
#authScreen.authScreen::after {content:"";position:absolute;inset:auto 0 0;height:22%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 35% 100%,#8eaeb020,transparent 67%);}
#authScreen .authShell {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(350px,405px);align-items:center;gap:clamp(40px,7vw,120px);max-width:1440px;min-height:100svh;margin:auto;padding:40px clamp(30px,5vw,84px) 60px;}
#authScreen .authBrand {position:relative;margin:0;padding:0 0 140px;max-width:700px;width:100%;text-align:left;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;}
#authScreen .authBrand h1 {margin:22px 0 8px;font-size:inherit;line-height:1;}
#authScreen .authBrand::after {display:none;}
.runefallWordmark {display:block;width:100%;height:auto;filter:drop-shadow(0 3px 9px #03101dcc);}
#authScreen .authBrand .runefallTagline {font:italic clamp(21px,2.1vw,30px)/1.4 Georgia,serif;letter-spacing:.015em;color:#ecdfc4;margin:15px 0 0;text-shadow:0 2px 12px #000;}
#authScreen .authBrand > .eyebrow {font-size:10px;letter-spacing:.32em;text-shadow:0 1px 10px #000;}
.runefallPrologue {position:relative;top:108px;max-width:360px;text-shadow:0 2px 10px #03101d;}
.runefallRule {display:block;width:46px;height:1px;background:var(--entry-gold);margin-bottom:20px;}
#authScreen .runefallPrologue p {font:18px/1.6 Georgia,serif;color:#e4e4d8;margin:0 0 24px;}
.runefallChapter {font-size:9px;letter-spacing:.22em;color:#c4b48f;}
.runefallSceneCaption {position:absolute;left:clamp(30px,5vw,84px);bottom:22px;display:flex;gap:18px;align-items:center;color:#aab8bd;pointer-events:none;font-size:11px;}
.runefallSceneCaption span:first-child {font-size:9px;letter-spacing:.24em;color:#dec99e;}
.runefallAtmosphere {position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.runefallAtmosphere i {position:absolute;left:18%;top:72%;width:3px;height:3px;background:#eed3a0;border-radius:50%;opacity:0;box-shadow:0 0 8px #d9a65d;animation:runefallSpark 17s linear infinite;}
.runefallAtmosphere i:nth-child(2) {left:37%;top:81%;animation-delay:-5s;animation-duration:24s;}
.runefallAtmosphere i:nth-child(3) {left:8%;top:57%;animation-delay:-13s;animation-duration:26s;}
.runefallAtmosphere i:nth-child(4) {left:55%;top:74%;animation-delay:-9s;animation-duration:22s;}
.runefallAtmosphere i:nth-child(5) {left:27%;top:49%;animation-delay:-4s;animation-duration:20s;}
.runefallAtmosphere i:nth-child(6) {left:42%;top:62%;animation-delay:-16s;animation-duration:29s;}
@keyframes runefallSpark {0%,100%{transform:translate(0,20px);opacity:0;}25%{opacity:.5;}75%{opacity:.25;}95%{transform:translate(30px,-105px);opacity:0;}}

/* Keep both supported authentication paths together, with a quiet reading surface. */
#authScreen .authGrid {display:block;min-width:0;}
#authScreen .authCard {position:relative;display:grid;gap:15px;min-height:0;padding:28px 30px;border:1px solid var(--entry-line);border-top-color:#b99967a0;border-radius:6px;background:linear-gradient(145deg,#101d27f5,#0b131cf5);backdrop-filter:none;box-shadow:0 24px 80px #02081088;}
#authScreen .authCard::before {inset:5px;border:1px solid #c5a46c0e;border-radius:2px;background:none;}
#authScreen .authCardHeading {display:flex;align-items:center;gap:13px;margin-bottom:3px;}
#authScreen .authCardHeading img {width:36px;height:44px;}
#authScreen .authCardHeading h2 {font:25px/1.2 Georgia,serif;color:#ede3cd;margin:4px 0 0;}
#authScreen .authTabs {display:grid;grid-template-columns:1fr 1fr;gap:0;border-bottom:1px solid #40505d;}
#authScreen .authTab {padding:10px 5px;min-height:42px;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:#aab6c0;font-size:13px;font-weight:500;}
#authScreen .authTab.active {color:#f2dfb4;border-color:#dbc08b;background:#eac48405;}
#authScreen .authTab:hover {color:#fff0d1;background:#eac4840b;}
#authScreen label {display:grid;gap:7px;margin:0;color:#cfd6d6;font-size:12px;font-weight:500;}
#authScreen input {width:100%;min-width:0;min-height:44px;padding:11px 13px;border:1px solid #465560;border-radius:4px;background:#080f16bb;color:#f5f1e8;box-shadow:inset 0 1px 4px #0003;font:14px/1.4 var(--ui-font);}
#authScreen input::placeholder {color:#899aa7;}
#authScreen input:hover {border-color:#7b857c;}
#authScreen input:focus {border-color:#cbb789;}
#authScreen .runefallPasswordField {display:flex;position:relative;}
#authScreen .runefallPasswordField input {padding-right:63px;}
#authScreen #authPasswordToggle {position:absolute;right:2px;top:2px;bottom:2px;min-width:55px;padding:8px;border:0;border-radius:3px;color:#c8c1ac;background:transparent;font-size:11px;cursor:pointer;}
#authScreen #authPasswordToggle:hover {color:#fff0d0;background:#cfb57413;}
#authScreen .authPrimary {position:relative;display:block;width:100%;min-height:46px;padding:12px 16px;margin:0;border:1px solid #d2b67c;border-radius:4px;background:linear-gradient(115deg,#e6cea0,#c4a36e);color:#16232b;font-size:13px;font-weight:750;letter-spacing:.025em;box-shadow:0 3px 12px #0003;}
#authScreen .authPrimary:hover:not(:disabled) {border-color:#faeac2;background:#e9d8b5;box-shadow:0 3px 16px #dbc08724;}
#authScreen .authPrimary[aria-busy="true"]::after {content:"";display:inline-block;width:11px;height:11px;margin-left:9px;vertical-align:-1px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:runefallWait 1s linear infinite;}
@keyframes runefallWait {to{transform:rotate(360deg);}}
#authScreen .accountAuthLinks {margin:-3px 0 0;gap:8px 16px;}
#authScreen .accountAuthLinks button {font-size:11px;color:#c7bc9f;min-height:28px;}
#authScreen .authStatus {display:block;min-height:18px;margin:0;padding:0;font:12px/1.6 var(--ui-font);color:#a9b9c5;overflow-wrap:anywhere;}
#authScreen .authStatus.error {padding:10px 12px;color:#ffd5cc;border-left:2px solid #d88378;background:#d8837812;}
#authScreen .authStatus.success {color:#bfe9d3;}
#authScreen .guestAuthCard {display:grid;gap:11px;min-height:0;padding:0;margin:0;border:0;border-radius:0;box-shadow:none;background:none;}
.runefallDivider {display:flex;align-items:center;gap:12px;margin:1px 0 2px;color:#9fafaF;font-size:8px;font-weight:600;letter-spacing:.17em;white-space:nowrap;}
.runefallDivider::before,.runefallDivider::after {content:"";height:1px;flex:1;background:#a78e6238;}
#authScreen #guestLoginButton {background:#172832;border-color:#607779;color:#e0d9c8;box-shadow:none;}
#authScreen #guestLoginButton:hover:not(:disabled) {background:#213a45;border-color:#bba779;}
#authScreen #guestAuthDescription,#authScreen #guestResumeHint {margin:0;color:#a8b5be;font-size:10px;line-height:1.55;}
#authScreen #guestResumeHint {color:#91a1af;font-size:10px;}
#authScreen .accountCaptchaMount {margin:0;}

/* Activity board: exploration leads, three supported arenas follow. */
#modeScreen.modeScreen {position:relative;isolation:isolate;overflow:hidden;width:100%;min-height:100svh;margin:0;padding:30px max(28px,calc((100vw - 1376px)/2)) 56px;border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse at 10% 10%,#233e4a80,transparent 60%),#0a141c;}
#modeScreen.modeScreen::before {content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#12232b38,transparent 32%);}
#modeScreen.modeScreen::after {display:none;}
.runefallHubHeader {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 23px;margin:0 0 27px;border-bottom:1px solid var(--entry-line);}
.runefallHubHeader img {width:190px;height:auto;}
.runefallHubHeader > span {font-size:9px;letter-spacing:.24em;color:#bca783;margin-right:110px;}
#modeScreen .modeDashboard {display:grid;grid-template-columns:minmax(0,1fr) 276px;gap:30px;align-items:start;max-width:1376px;margin:auto;}
#modeScreen .modeMainColumn {display:grid;gap:24px;min-width:0;}
#modeScreen .modeIntro {margin:0;padding:0;text-align:left;max-width:none;}
#modeScreen .modeIntro h1 {margin:7px 0 9px;color:#f0e6d2;font:clamp(30px,3vw,42px)/1.15 Georgia,serif;font-weight:400;}
#modeScreen .modeIntro p {margin:0;color:#acbbc4;font-size:13px;line-height:1.6;}
#modeScreen .modeSection {padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none;}
#modeScreen .phase75ModeCards {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start;}
#modeScreen .runefallActivity {position:relative;display:flex;align-items:flex-start;flex-direction:column;gap:11px;width:100%;min-width:0;min-height:305px!important;height:100%;padding:145px 19px 19px;border:1px solid #53615c;border-radius:5px;background:#111e27;box-shadow:0 7px 24px #0003;overflow:hidden;text-align:left;}
#modeScreen .runefallActivity::before {inset:0;width:auto;height:auto;border-radius:0;background:linear-gradient(180deg,transparent 25%,#101b259c 46%,#101b25 65%);z-index:0;}
#modeScreen .runefallActivity > :not(.runefallActivityArt) {position:relative;z-index:1;flex-shrink:0;}
#modeScreen .runefallActivity .runefallActivityArt {position:absolute;inset:0 0 35%;background-size:cover;background-position:center 38%;transition:transform .35s;z-index:-1;}
#modeScreen .runefallActivity {isolation:isolate;}
#modeScreen:not(.hidden) #pvpButton .runefallActivityArt {background-image:url('/art/brand/duel-card.webp');}
#modeScreen:not(.hidden) #siegeButton .runefallActivityArt {background-image:url('/art/brand/siege-card.webp');}
#modeScreen:not(.hidden) #trainingButton .runefallActivityArt {background-image:url('/art/brand/training-card.webp');}
#modeScreen .runefallActivity:hover:not(:disabled) {border-color:#d4bd8a;transform:translateY(-3px);box-shadow:0 10px 28px #0005;}
#modeScreen .runefallActivity:hover:not(:disabled) .runefallActivityArt {transform:scale(1.035);}
#modeScreen .runefallActivity strong {font:22px/1.2 Georgia,serif;font-weight:400;color:#f0e2c7;}
#modeScreen .runefallActivity .runefallActivityMeta {font-size:9px;letter-spacing:.11em;font-weight:650;line-height:1.5;color:#d0bd98;}
.runefallActivityMeta > span {margin:0 4px;color:#819193;}
#modeScreen .runefallActivity .runefallActivityDescription {display:block;font:12px/1.65 var(--ui-font);color:#bdc8ce;}
#modeScreen .runefallActivity .runefallActivityAction {display:flex;gap:10px;align-items:center;justify-content:space-between;width:100%;margin-top:auto;padding-top:12px;border-top:1px solid #98835e38;font-size:12px;font-weight:650;line-height:1.4;color:#ead4a8;}
.runefallActivityAction > span {font-size:18px;}
#modeScreen .exploreCard.runefallActivity {grid-column:1/-1;min-height:310px!important;padding:24px 30px;border-color:#9e8d626e!important;background:linear-gradient(90deg,#071622f7 0%,#0c1d28d1 33%,#0d1e2960 68%,#0d1d2630),url('/art/brand/elderglen-keyart.webp') 60% 56%/cover!important;}
#modeScreen .exploreCard::before {display:none;}
#modeScreen .runefallExploreCopy {display:grid;gap:12px;max-width:420px;margin:auto 0;}
#modeScreen .runefallExploreCopy strong {font-size:36px;line-height:1.1;}
#modeScreen .runefallExploreCopy .runefallActivityDescription {font-size:13px;line-height:1.65;color:#d3d9d6;}
#modeScreen .runefallExploreCopy .runefallActivityAction {width:160px;border:1px solid #d6ba80;border-radius:3px;padding:10px 14px;margin:4px 0 0;background:#ddc293;color:#162932;box-shadow:0 4px 18px #0003;}
#modeScreen .runefallActivity .runefallActivityFoot {display:flex;gap:12px;color:#a9babf;font-size:8px;letter-spacing:.12em;line-height:1.5;}
.runefallActivityFoot > span {color:#bea473;}
.runefallActivitySection {display:flex;align-items:center;justify-content:space-between;gap:12px;grid-column:1/-1;margin:10px 0 0;font-size:10px;color:#bda67c;letter-spacing:.17em;}
.runefallActivitySection > span:last-child {font-size:11px;letter-spacing:0;color:#92a6b1;}
.runefallTraining {position:relative;height:100%;min-width:0;}
#modeScreen .trainingDifficultyControl {display:flex;align-items:center;gap:9px;justify-content:space-between;flex-direction:row;margin:10px 0 0;padding:0;border:0;background:none;font-size:10px;color:#a9b8c0;}
#modeScreen .trainingDifficultyControl select {width:calc(100% - 66px);min-width:0;max-width:190px;min-height:34px;margin:0;padding:6px 8px;background:#13212c;border:1px solid #4c626b;border-radius:3px;color:#dbe0dc;font-size:10px;}

/* Compact supporting panels reuse the established controls and data hooks. */
#modeScreen .modeSidebar {gap:18px;min-width:0;padding-top:4px;align-items:start;}
#modeScreen :is(.menuPanel,.partyPanel) {padding:20px;border:1px solid #4d5c5a99;border-radius:5px;background:#0f1c26;box-shadow:0 5px 20px #0002;backdrop-filter:none;}
#modeScreen .menuPanelHeader h2 {font:24px/1.2 Georgia,serif;color:#eddfc3;margin:5px 0 16px;}
#modeScreen .accountStrip {display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;}
#modeScreen .accountStrip > div:first-child {grid-column:1/-1;}
#modeScreen .accountStrip > div {min-width:0;padding:0;border:0;background:none;}
#modeScreen .accountStrip span {font-size:9px;letter-spacing:.11em;color:#96a9b4;}
#modeScreen .accountStrip strong {display:block;font-size:18px;color:#e6d6b2;line-height:1.6;}
#modeScreen #accountUsernameDisplay {font:23px/1.5 Georgia,serif;color:#f0e4cf;}
#modeScreen .accountStrip small {font-size:10px;color:#a8b8c1;line-height:1.5;}
#modeScreen .accountStrip .xpBlock {grid-column:1/-1;}
#modeScreen .accountXpTrack {height:4px;margin:9px 0;border-radius:0;background:#293d48;}
#modeScreen #accountXpFill {background:#b99f67;}
#modeScreen #logoutButton {justify-self:start;width:auto;margin-top:3px;min-height:30px;padding:5px 0;border:0;background:none;font-size:11px;color:#b7c1c6;text-decoration:underline;text-underline-offset:3px;}
#modeScreen .runefallWizardSettings {margin-top:15px;padding-top:13px;border-top:1px solid #455452;}
#modeScreen .runefallWizardSettings summary {color:#c9bc9c;font-size:11px;cursor:pointer;padding:5px 0;}
#modeScreen :is(.usernameChoice,.mapChoice) {margin:14px 0 0;padding:0;border:0;border-radius:0;background:none;display:grid;grid-template-columns:1fr;gap:8px;text-align:left;}
#modeScreen :is(.usernameChoice,.mapChoice) > span {font-size:11px;color:#c5cece;}
#modeScreen :is(input,select) {color:#e3e7e3;background:#0a151d;border:1px solid #53676e;border-radius:3px;padding:9px 11px;min-height:40px;font-size:12px;width:100%;min-width:0;}
#modeScreen :is(.usernameChoice small,.menuHint) {font-size:10px;line-height:1.55;color:#93a7b3;}
#modeScreen .menuHint {margin:9px 0 0;}
#modeScreen .lobbyBuildCard h2 {font:22px/1.2 Georgia,serif;margin:6px 0;color:#e5d5b7;}
#modeScreen #lobbyBuildSummary {font-size:11px;line-height:1.65;color:#a9bac6;margin:6px 0 0;}
#modeScreen .lobbyBuildCard {justify-content:stretch;align-content:start;}
#modeScreen .menuShortcutGrid {grid-template-columns:minmax(0,1fr);gap:8px;width:100%;}
#modeScreen .menuShortcutGrid>button {width:100%;min-height:44px;white-space:normal;}
#modeScreen :is(.primaryButton,.secondaryButton,.smallButton) {font-size:11px;border-radius:3px;padding:9px 12px;min-height:38px;border:1px solid #607574;background:#1b303a;color:#e3d6b9;box-shadow:none;margin:0;}
#modeScreen :is(.primaryButton,.secondaryButton,.smallButton):hover:not(:disabled) {background:#29414a;border-color:#c5ac76;}
#modeScreen .menuShortcutGrid .primaryButton {background:#304749;border-color:#8e997e;}
#modeScreen .menuShortcutGrid :is(.primaryButton,.secondaryButton) {font-size:13px;}
.runefallHallNote {text-align:center;color:#8eabae;padding:6px;}
.runefallHallNote p {font:italic 13px/1.7 Georgia,serif;margin:8px 0;}
#modeScreen #partyPanel {padding:18px 20px;}
#modeScreen .partyPanelHead {align-items:center;}
#modeScreen .partyPanelHead h2 {font:21px/1.3 Georgia,serif;margin:3px 0 5px;color:#e9dabb;}
#modeScreen .partyPanelHead p {font-size:11px;line-height:1.5;color:#9fb0bb;margin:0;}
#modeScreen .partyStatusBadge {font-size:9px;padding:5px 8px;color:#c6bea5;background:#29413e;border:1px solid #597169;border-radius:3px;}
#modeScreen .partySoloControls {display:flex;align-items:center;gap:14px;margin-top:15px;}
#modeScreen .partyJoinRow {flex:1;max-width:340px;gap:8px;}
#modeScreen .partyJoinRow input {flex:1;min-width:0;letter-spacing:.1em;}
#modeScreen .partyInviteRow {flex-wrap:wrap;gap:12px;}
#modeScreen .partyStatusText {font-size:11px;line-height:1.5;color:#becbd0;}
#modeScreen :is(.accountIdentityNotice,.accountSessionNotice) {margin-top:14px;}

/* Existing recovery and guest-security dialogs keep their native form behavior. */
body:has(:is(#authScreen,#modeScreen):not(.hidden)) .accountAuthDialog {border-color:#a58b5e99;border-radius:6px;background:linear-gradient(145deg,#14232e,#0b141d);box-shadow:0 24px 80px #02081099;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) .accountAuthDialog h2 {font:27px/1.2 Georgia,serif;color:#eddfc3;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) .accountAuthDialog :is(input,button) {border-radius:4px;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) .accountAuthDialog button[type=submit] {background:#ddc293;color:#162932;border-color:#d6ba80;}
body:has(:is(#authScreen,#modeScreen):not(.hidden)) .accountAuthDialog::backdrop {backdrop-filter:none;}

/* Keep all four activity actions in view on normal laptop displays. Supporting
   account and party details may scroll naturally, never inside tiny panels. */
#modeScreen.modeScreen {padding-top:22px;}
.runefallHubHeader {padding-bottom:18px;margin-bottom:22px;}
.runefallHubHeader > span {margin-right:300px;}
#modeScreen .modeMainColumn {gap:20px;}
#modeScreen .modeIntro h1 {font-size:36px;}
#modeScreen .exploreCard.runefallActivity {min-height:266px!important;padding:22px 28px;}
#modeScreen .runefallExploreCopy {gap:9px;}
#modeScreen .runefallActivity:not(.exploreCard) {padding:113px 18px 16px;gap:8px;min-height:292px!important;height:292px;}
#modeScreen .runefallActivity:not(.exploreCard) .runefallActivityArt {inset:0 0 38%;}
#modeScreen .runefallActivity:not(.exploreCard) .runefallActivityAction {padding-top:9px;}
#modeScreen .runefallTraining {height:auto;}
body:has(#modeScreen:not(.hidden)) #wizardAudioControls {position:absolute!important;top:14px!important;bottom:auto!important;right:28px!important;border-radius:4px!important;border-color:#66756a80!important;background:#0c1921e8!important;backdrop-filter:none!important;}
body:has(#authScreen:not(.hidden)) #wizardAudioControls {position:absolute!important;bottom:14px!important;top:auto!important;right:20px!important;border-radius:4px!important;border-color:#66756a80!important;background:#0c1921e8!important;backdrop-filter:none!important;}

@media (max-height:850px) and (min-width:941px) {
  #modeScreen.modeScreen {padding-top:17px;}
  .runefallHubHeader {padding-bottom:13px;margin-bottom:17px;}
  .runefallHubHeader img {width:174px;}
  #modeScreen .modeIntro h1 {font-size:31px;margin:5px 0 6px;}
  #modeScreen .modeMainColumn {gap:16px;}
  #modeScreen .exploreCard.runefallActivity {min-height:230px!important;padding:18px 25px;}
  #modeScreen .runefallExploreCopy {gap:6px;}
  #modeScreen .runefallExploreCopy strong {font-size:30px;}
  #modeScreen .runefallExploreCopy .runefallActivityDescription {font-size:12px;line-height:1.5;}
  #modeScreen .runefallActivity:not(.exploreCard) {padding-top:96px;height:272px;min-height:272px!important;}
  #modeScreen .runefallActivitySection {margin-top:5px;}
}
@media (max-height:780px) and (min-width:1151px) {
  #modeScreen .modeMainColumn {gap:12px;}
  #modeScreen .modeIntro h1 {font-size:29px;}
  #modeScreen .modeIntro p {font-size:12px;}
  #modeScreen .exploreCard.runefallActivity {min-height:210px!important;padding-block:13px;gap:7px;}
  #modeScreen .runefallExploreCopy strong {font-size:28px;}
  #modeScreen .runefallExploreCopy .runefallActivityDescription {font-size:12px;line-height:1.4;}
  #modeScreen .runefallActivity:not(.exploreCard) {padding-top:84px;min-height:260px!important;height:260px;}
}

/* Short reveals never hold up a functional control or a game transition. */
:is(#authScreen,#modeScreen):not(.hidden) :is(.authGrid,.modeDashboard) {animation:runefallReveal .28s ease-out both;}
@keyframes runefallReveal {from{opacity:0;transform:translateY(5px);}to{opacity:1;transform:none;}}
.runefallPageHidden .runefallAtmosphere i,#authScreen.hidden .runefallAtmosphere i {animation-play-state:paused;}

@media (min-width:1800px) {
  #authScreen .authShell {max-width:1660px;grid-template-columns:minmax(0,1fr) 430px;gap:180px;}
  #authScreen .authBrand {max-width:750px;}
}
@media (max-width:1150px) {
  .runefallHubHeader > span {display:none;}
  #modeScreen .modeDashboard {grid-template-columns:1fr;gap:22px;}
  #modeScreen .modeSidebar {grid-template-columns:1fr 1fr;gap:18px;}
  .runefallHallNote {display:none;}
  #modeScreen .phase75ModeCards {gap:12px;}
  #modeScreen .runefallActivity {padding-inline:14px;}
  #modeScreen .runefallActivity strong {font-size:20px;}
  #modeScreen :is(.menuPanel,.partyPanel) {padding:16px;}
  #authScreen .authShell {gap:40px;padding-inline:36px;grid-template-columns:minmax(0,1fr) 375px;}
}
@media (max-width:940px) {
  #modeScreen .modeDashboard {grid-template-columns:1fr;}
  #modeScreen .modeSidebar {grid-template-columns:1fr 1fr;gap:18px;}
  .runefallHallNote {display:none;}
  #modeScreen .modeIntro h1 {font-size:34px;}
  #modeScreen .runefallActivity:not(.exploreCard) {height:320px;min-height:320px!important;}
  #authScreen .authShell {gap:28px;padding-inline:26px;grid-template-columns:minmax(0,1fr) 350px;}
  #authScreen .authCard {padding:24px;}
  #authScreen .authBrand > .eyebrow {font-size:8px;letter-spacing:.18em;}
}
@media (max-width:700px) {
  #authScreen.authScreen {background-position:36% top;background-size:auto 100svh;background-color:#09141d;}
  #authScreen .authShell {grid-template-columns:1fr;gap:26px;padding:44px 20px 94px;min-height:100svh;max-width:490px;}
  #authScreen .authBrand {padding:0;text-align:center;max-width:370px;justify-self:center;}
  #authScreen .authBrand h1 {margin:18px 0 7px;}
  #authScreen .authBrand .runefallTagline {font-size:20px;}
  #authScreen .runefallPrologue,.runefallSceneCaption {display:none;}
  #authScreen .authCard {padding:24px;}
  #authScreen input {font-size:16px;}
  #modeScreen.modeScreen {padding:24px 20px 40px;}
  .runefallHubHeader {margin-bottom:23px;padding-bottom:74px;}
  body:has(#modeScreen:not(.hidden)) #wizardAudioControls {top:72px!important;right:20px!important;}
  .runefallHubHeader img {width:158px;}
  .runefallHubHeader > span {display:none;}
  #modeScreen .phase75ModeCards {grid-template-columns:1fr;gap:16px;}
  #modeScreen .runefallActivity {min-height:245px!important;padding:120px 22px 20px;}
  #modeScreen .runefallActivity:not(.exploreCard) {height:auto;min-height:278px!important;}
  #modeScreen .exploreCard.runefallActivity {min-height:320px!important;padding:24px;}
  #modeScreen .runefallExploreCopy strong {font-size:32px;}
  #modeScreen .runefallActivitySection {align-items:flex-start;flex-direction:column;gap:5px;margin:14px 0 0;}
  #modeScreen .modeSidebar {grid-template-columns:1fr;}
  #modeScreen .trainingDifficultyControl {justify-content:flex-end;font-size:12px;}
  #modeScreen .trainingDifficultyControl select {font-size:12px;}
  #modeScreen .partySoloControls {align-items:stretch;flex-direction:column;gap:10px;}
  #modeScreen .partyJoinRow {max-width:none;}
}
@media (max-height:780px) and (min-width:701px) {
  #authScreen .authShell {padding-top:24px;padding-bottom:42px;}
  #authScreen .authCard {gap:11px;padding-block:22px;}
  #authScreen .authCardHeading h2 {font-size:23px;}
  #authScreen .guestAuthCard {gap:9px;}
}
@media (prefers-reduced-motion:reduce) {
  :is(#authScreen,#modeScreen),:is(#authScreen,#modeScreen) *,:is(#authScreen,#modeScreen) *::after {animation:none!important;transition:none!important;scroll-behavior:auto;}
  #modeScreen .runefallActivity:hover:not(:disabled) {transform:none;}
}