:root {
  --ink: #090c0d;
  --coal: #111719;
  --fog: #8da4a0;
  --bone: #e9e0cf;
  --ember: #ff6a2a;
  --ember-hot: #ffc36b;
  --cyan: #68a9a3;
  --danger: #c84d43;
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #050708; }
body { color: var(--bone); font-family: "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif; }
button { font: inherit; }

#game-shell { position: relative; width: 100vw; height: 100dvh; isolation: isolate; background: var(--ink); }
#game { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: crosshair; outline: none; }

.screen { position: absolute; inset: 0; z-index: 20; display: none; }
.screen.active { display: flex; }
.screen.modal-top { z-index: 30; }

#title-screen {
  --city-glow: rgba(0,0,0,0);
  --repair-glow: rgba(255,113,48,.02);
  --morning-glow: rgba(0,0,0,0);
  align-items: center;
  padding: clamp(28px, 6vw, 88px);
  overflow: hidden;
  background: #07090a url("assets/title-key-art.png") center / cover no-repeat;
}
#title-screen::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background: radial-gradient(circle at 65% 18%,var(--morning-glow),transparent 37%),radial-gradient(circle at 74% 42%,var(--repair-glow),transparent 32%),linear-gradient(128deg,transparent 34%,var(--city-glow) 100%); transition: background .45s ease; }
#title-screen[data-city-direction="shelter"] { --city-glow: rgba(219,111,54,.2); }
#title-screen[data-city-direction="resolve"] { --city-glow: rgba(78,144,149,.2); }
#title-screen[data-city-direction="memory"] { --city-glow: rgba(116,142,126,.22); }
#title-screen.office-stage-1 { --repair-glow: rgba(255,113,48,.07); }
#title-screen.office-stage-2 { --repair-glow: rgba(255,130,55,.12); }
#title-screen.office-stage-3 { --repair-glow: rgba(255,151,73,.18); }
#title-screen.office-stage-4 { --repair-glow: rgba(255,180,94,.26); }
#title-screen[data-morning-shift="shelter"] { --morning-glow: rgba(255,165,88,.2); }
#title-screen[data-morning-shift="route"] { --morning-glow: rgba(90,181,190,.19); }
#title-screen[data-morning-shift="memory"] { --morning-glow: rgba(141,176,131,.2); }
.title-vignette { position: absolute; inset: 0; z-index:1; background: linear-gradient(90deg, rgba(3,5,6,.94) 0%, rgba(3,5,6,.58) 37%, rgba(3,5,6,.08) 72%), linear-gradient(0deg, rgba(3,5,6,.75), transparent 45%); }
.title-copy { position: relative; z-index:2; width: min(620px, 78vw); max-height: calc(100dvh - clamp(112px,12vw,176px)); margin: 0; padding: 8px 14px 20px 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; text-shadow: 0 2px 20px #000; }
.title-copy > .primary,.title-launch > .primary { display: block; }
.title-mode-section { width: min(540px,100%); margin-top: 10px; }
.title-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 1px 6px; }
.title-section-heading h2 { margin: 0; color: #d8d0be; font: 600 12px/1.3 Georgia,"STSong",serif; letter-spacing: .16em; }
.title-section-heading p { margin: 0; color: #6f8580; font-size: 9px; line-height: 1.35; text-align: right; letter-spacing: .04em; }
.title-mode-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; width: 100%; }
.title-mode-grid .mode-button { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 3px 8px; width: 100%; min-width: 0; min-height: 52px; margin: 0; padding: 7px 9px 7px 11px; line-height: 1.3; text-align: left; }
.title-mode-grid .mode-button strong { font: 600 13px/1.25 Georgia,"STSong",serif; letter-spacing: .08em; white-space: nowrap; }
.title-mode-grid .mode-button small { grid-column: 1 / -1; color: #718b87; font-size: 9px; line-height: 1.35; letter-spacing: .02em; overflow-wrap: anywhere; }
.title-mode-grid .mode-button.daily-mode small { color: #a99468; }
.title-mode-grid .mode-button.weekly-mode small { color: #a87e78; }
.title-mode-grid .mode-button:disabled small { color: #4c5b58; }
.title-mode-grid .mode-button > span { min-width: 42px; padding: 3px 6px; color: #9fc7c1; background: rgba(46,92,86,.3); border: 1px solid #4e716c; border-radius: 10px; font: 700 8px/1.1 "Microsoft YaHei",sans-serif; text-align: center; letter-spacing: .04em; white-space: nowrap; }
.title-mode-grid .mode-button[data-mode-state="locked"] > span { color: #78817e; background: rgba(30,35,35,.45); border-color: #46504e; }
.title-mode-grid .daily-mode > span { color: #e6d2a2; background: rgba(113,87,40,.26); border-color: #806c48; }
.title-mode-grid .weekly-mode > span { color: #e5bbb4; background: rgba(111,57,52,.28); border-color: #84534d; }
.title-mode-grid .assembly-mode { grid-column: 1 / -1; }
.title-utility-section { width: min(540px,100%); margin-top: 10px; }
.title-utility-heading h2 { color: #c7d3ce; }
.title-utilities { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; width: 100%; }
.title-utility-group { min-width: 0; }
.title-utility-group[open] { grid-column: 1 / -1; }
.title-utility-group > summary { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; align-content: center; gap: 3px 7px; min-height: 55px; padding: 8px 30px 8px 11px; color: #cfc3ad; background: rgba(7,12,13,.78); border: 1px solid #455653; cursor: pointer; list-style: none; transition: .18s ease; }
.title-utility-group > summary::-webkit-details-marker { display: none; }
.title-utility-group > summary::after { content: "+"; position: absolute; top: 50%; right: 13px; color: #79aaa3; font: 700 18px/1 Georgia,serif; transform: translateY(-50%); }
.title-utility-group[open] > summary::after { content: "−"; }
.title-utility-group > summary:hover,.title-utility-group > summary:focus-visible { color: var(--ember-hot); border-color: var(--ember); background: rgba(22,18,16,.9); }
.title-utility-group > summary span { grid-column: 1 / -1; font: 600 14px Georgia,"STSong",serif; letter-spacing: .08em; }
.title-utility-group > summary b { display: inline-grid; place-items: center; min-width: 20px; height: 16px; margin-left: 3px; padding: 0 4px; color: #9fc7c1; background: rgba(53,91,88,.32); border: 1px solid #4e716c; border-radius: 9px; font: 700 9px/1 "Microsoft YaHei",sans-serif; letter-spacing: 0; vertical-align: 2px; }
.title-utility-group[open] > summary { color: #f4d4a3; border-color: #9b6848; border-left-width: 3px; background: linear-gradient(90deg,rgba(68,36,24,.88),rgba(13,20,20,.9)); }
.title-utility-group[open] > summary b { color: #24130d; background: #e3a566; border-color: #ffc27c; }
.title-utility-group > summary small { display: -webkit-box; overflow: hidden; color: #748985; font-size: 9px; line-height: 1.35; text-align: left; letter-spacing: .03em; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.title-utility-toggle { align-self: center; color: #79aaa3; font: normal 700 8px/1.2 "Microsoft YaHei",sans-serif; letter-spacing: .08em; white-space: nowrap; }
.title-utility-group[open] .title-utility-toggle { color: #f1b777; }
.title-utility-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; max-height: min(26vh,220px); padding: 6px 5px 2px 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; counter-reset: title-utility-item; background: linear-gradient(#0a1011 30%,rgba(10,16,17,0)) center top / 100% 18px no-repeat local,linear-gradient(rgba(10,16,17,0),#0a1011 70%) center bottom / 100% 22px no-repeat local,linear-gradient(rgba(121,170,163,.24),rgba(121,170,163,0)) center top / 100% 8px no-repeat scroll,linear-gradient(rgba(121,170,163,0),rgba(121,170,163,.24)) center bottom / 100% 8px no-repeat scroll; }
.title-utility-grid .quiet { counter-increment: title-utility-item; display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: center; width: 100%; min-width: 0; margin: 0; padding: 9px 10px 9px 7px; font-size: 12px; text-align: left; }
.title-utility-grid .quiet::before { content: counter(title-utility-item,decimal-leading-zero); color: #72908b; font: 700 9px/1 "Microsoft YaHei",sans-serif; letter-spacing: .04em; }
.title-utility-grid .quiet:hover::before,.title-utility-grid .quiet:focus-visible::before { color: var(--ember-hot); }
.eyebrow { margin: 0 0 12px; color: var(--ember-hot); font-size: 13px; font-weight: 800; letter-spacing: .3em; text-transform: uppercase; }
h1 { margin: 0; font-family: Georgia, "STSong", serif; font-size: clamp(64px, 9vw, 132px); font-weight: 500; letter-spacing: -.08em; line-height: .84; }
h1 span { color: var(--ember); }
.latin { margin: 18px 0 24px; color: var(--fog); font: 600 clamp(14px, 1.4vw, 21px)/1 Georgia, serif; letter-spacing: .55em; }
.hook { width: 80%; color: #d2cbbb; font-family: Georgia, "STSong", serif; font-size: clamp(16px, 1.5vw, 22px); line-height: 1.8; }
.title-world-state { width: min(470px,100%); margin: -5px 0 13px; color: #91aaa5; background: rgba(7,12,13,.74); border: 1px solid #455653; border-left: 2px solid #8f5e42; font: 12px/1.65 Georgia,"STSong",serif; }
.title-world-state > summary { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 12px; min-height: 61px; padding: 8px 36px 8px 12px; cursor: pointer; list-style: none; }
.title-world-state > summary::-webkit-details-marker { display: none; }
.title-world-state > summary::after { content: "+"; position: absolute; top: 50%; right: 13px; color: #79aaa3; font: 700 18px/1 Georgia,serif; transform: translateY(-50%); }
.title-world-state[open] > summary::after { content: "−"; }
.title-world-state > summary:hover,.title-world-state > summary:focus-visible { color: var(--ember-hot); background: rgba(22,18,16,.88); }
.title-world-state-kicker { grid-column: 1; color: #73a59d; font: 700 9px/1.4 "Microsoft YaHei",sans-serif; letter-spacing: .16em; }
.title-world-state strong { grid-column: 1; overflow: hidden; color: #d8d0be; font-size: 12px; font-weight: 500; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.title-world-state small { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #788d88; font: 9px/1.35 "Microsoft YaHei",sans-serif; letter-spacing: .04em; white-space: nowrap; }
.title-world-state > p { margin: 0; padding: 10px 12px 12px; color: #91aaa5; border-top: 1px solid rgba(69,86,83,.72); }
.tracked-goal { display: block; width: min(470px,100%); margin: -3px 0 11px; padding: 9px 12px; color: #aab8b3; text-align: left; background: rgba(7,12,13,.72); border: 1px solid #455653; cursor: pointer; }
.tracked-goal:hover,.tracked-goal:focus-visible { border-color: #bd7047; background: rgba(22,18,16,.84); }
.tracked-goal small,.tracked-goal strong,.tracked-goal span { display: block; }
.tracked-goal small { color: #73a59d; font-size: 9px; letter-spacing: .14em; }
.tracked-goal strong { margin-top: 4px; color: #e4d7bf; font: 500 13px Georgia,"STSong",serif; }
.tracked-goal > span { height: 4px; margin-top: 7px; overflow: hidden; background: #10191a; }
.tracked-goal i { display: block; width: 0; height: 100%; background: linear-gradient(90deg,#9d5638,#ff9b52,#71aaa2); transition: width .35s ease; }
.tracked-goal.complete { border-color: #6e9f96; }
.title-footer { position: absolute; z-index:2; left: clamp(28px,6vw,88px); right: clamp(28px,6vw,88px); bottom: 24px; display: flex; justify-content: space-between; color: #71817f; font-size: 12px; letter-spacing: .12em; }

.primary, .quiet { min-width: 190px; padding: 13px 22px; border: 1px solid transparent; cursor: pointer; transition: .18s ease; }
.primary { margin-top: 22px; background: var(--ember); color: #170906; font-weight: 900; box-shadow: 0 8px 30px rgba(255,106,42,.2); }
.primary:hover, .primary:focus-visible { background: var(--ember-hot); transform: translateY(-2px); }
.primary:disabled { opacity: .38; cursor: not-allowed; transform: none; }
.quiet { margin-top: 10px; background: rgba(9,12,13,.62); border-color: #54615f; color: var(--bone); }
.quiet:hover, .quiet:focus-visible { border-color: var(--ember); color: var(--ember-hot); }
.mode-button { display: block; min-width: 270px; margin-top: 10px; padding: 11px 18px; color: #8fc5bf; background: rgba(8,20,21,.78); border: 1px solid #4a7773; cursor: pointer; letter-spacing: .08em; }
.mode-button:hover:not(:disabled), .mode-button:focus-visible:not(:disabled) { color: #d5fff8; border-color: #82c9c2; box-shadow: 0 0 24px rgba(104,169,163,.16); }
.mode-button:disabled { color: #596965; border-color: #384340; cursor: not-allowed; }
.mode-button.daily-mode { color: #e1c78f; border-color: #806c48; }
.mode-button.weekly-mode { color: #d8a8a0; border-color: #84534d; }
.hidden { display: none !important; }

.compact-screen, .story-screen { align-items: center; justify-content: center; background: rgba(2,4,5,.86); backdrop-filter: blur(10px); }
.performance-mode .compact-screen,.performance-mode .story-screen { backdrop-filter: none; }
.story-screen.event-art { background: linear-gradient(90deg,rgba(2,4,5,.78),rgba(2,4,5,.42)), url("assets/event-letter-still-life.png") center / cover no-repeat; backdrop-filter: none; }
.story-screen.event-art .story-card { background: linear-gradient(145deg,rgba(23,31,32,.93),rgba(8,12,13,.94)); box-shadow: 0 30px 100px #000, 0 0 0 1px rgba(255,135,66,.13); }
.story-screen.portrait-art { justify-content: flex-start; padding-left: 7vw; background: linear-gradient(90deg,rgba(2,4,5,.34),rgba(2,4,5,.18)), url("assets/courier-li-portrait.png") center / cover no-repeat; backdrop-filter: none; }
.story-screen.portrait-art .story-card { width: min(690px,55vw); background: linear-gradient(145deg,rgba(18,25,26,.95),rgba(6,10,11,.94)); }
.story-screen.station-art { background: linear-gradient(90deg,rgba(2,4,5,.7),rgba(2,4,5,.46)),url("assets/silent-station.png") center / cover no-repeat; backdrop-filter: none; }
.story-screen.station-art .story-card { background: linear-gradient(145deg,rgba(18,25,26,.95),rgba(6,10,11,.94)); }
.story-screen.resident-handover-art { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.38) 54%,rgba(2,4,5,.96)),url("assets/resident-lead-handover-selection.png") center / cover no-repeat; backdrop-filter: none; }
.story-screen.resident-handover-art .story-card { width: min(700px,54vw); background: linear-gradient(145deg,rgba(18,25,26,.96),rgba(6,10,11,.95)); }
.story-screen.resident-circuit-art { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.04),rgba(2,4,5,.34) 52%,rgba(2,4,5,.97)),url("assets/resident-three-district-circuit.png") center / cover no-repeat; backdrop-filter: none; }
.story-screen.resident-circuit-art .story-card { width: min(720px,55vw); background: linear-gradient(145deg,rgba(19,28,28,.96),rgba(6,10,11,.96)); border-color: #7a9f91; }
.panel, .story-card { width: min(760px, calc(100vw - 40px)); padding: clamp(28px,5vw,58px); border: 1px solid #475653; background: linear-gradient(145deg, rgba(23,31,32,.98), rgba(8,12,13,.98)); box-shadow: 0 30px 100px #000; }
.story-card { max-height: calc(100dvh - 40px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.story-card::-webkit-scrollbar { width: 8px; }
.story-card::-webkit-scrollbar-track { background: #11191a; }
.story-card::-webkit-scrollbar-thumb { background: #5b6e69; border-radius: 8px; }
.panel.small { width: min(430px, calc(100vw - 40px)); text-align: center; }
h2 { margin: 0 0 18px; font: 500 clamp(34px,5vw,68px)/1.05 Georgia, "STSong", serif; }
.story-body, .result-body, .tip { color: #bdc5bd; font: 16px/1.85 Georgia, "STSong", serif; }
.story-body p { margin: 0 0 12px; }
.choices { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 26px; }
.choice { position: relative; min-height: 124px; padding: 19px; text-align: left; color: var(--bone); background: #101718; border: 1px solid #3c4c49; cursor: pointer; }
.choice:hover, .choice.selected { border-color: var(--ember); background: #1d1b16; }
.choice strong { display: block; margin-bottom: 7px; color: var(--ember-hot); font-size: 17px; }
.choice span { color: #9cadab; font-size: 13px; line-height: 1.6; }
.choice em { display: block; margin-top: 10px; color: #d4c8b0; font-size: 12px; font-style: normal; }
.story-card > .primary { display: block; }

.controls-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px 28px; margin: 28px 0; }
.controls-grid div { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid #2d3a39; }
kbd { min-width: 96px; color: var(--ember-hot); font-family: ui-monospace, monospace; font-weight: 800; }

.hud { position: absolute; inset: 0; z-index: 10; display: none; pointer-events: none; padding: 28px 34px; font-size: 12px; letter-spacing: .08em; text-shadow: 0 2px 4px #000; }
.hud.active { display: block; }
.hud-left { width: min(320px, 28vw); }
.route-line { display: flex; justify-content: space-between; margin-bottom: 10px; color: #cfc7b8; }
.route-line span { font: 700 17px Georgia, "STSong", serif; }
.route-line b { color: var(--ember-hot); }
.meter { position: relative; height: 25px; margin-bottom: 7px; overflow: hidden; background: rgba(4,7,8,.82); border: 1px solid #40504e; }
.meter i { position: absolute; inset: 0 auto 0 0; width: 100%; transition: width .18s; }
.ember-meter i { background: linear-gradient(90deg, #7b2215, var(--ember), var(--ember-hot)); }
.guard-meter i { background: linear-gradient(90deg, #315c5b, var(--cyan)); }
.meter span, .meter strong { position: relative; z-index: 1; line-height: 23px; }
.meter span { margin-left: 9px; }
.meter strong { float: right; margin-right: 9px; }
.hud-center { position: absolute; top: 28px; left: 50%; transform: translateX(-50%); text-align: center; }
.hud-center p { margin: 0 0 4px; color: var(--bone); font: 700 17px Georgia, "STSong", serif; }
.hud-center span { color: var(--ember-hot); }
.hud-center small { display: block; margin-top: 5px; color: #8fc5bf; font-size: 9px; letter-spacing: .2em; }
.hud-right { position: absolute; top: 28px; right: 34px; display: flex; align-items: center; gap: 18px; }
.hud-right b { color: var(--ember-hot); }
#sound-btn, #memory-btn, #map-btn, #tool-btn { pointer-events: auto; padding: 6px 9px; color: #afbeb9; background: rgba(5,8,9,.6); border: 1px solid #43514f; cursor: pointer; }
#tool-btn { min-width: 58px; color: var(--ember-hot); border-color: #76523b; }
.hud-pause { position: absolute; top: 78px; right: 34px; min-width: 76px; min-height: 44px; padding: 8px 12px; pointer-events: auto; color: var(--bone); background: rgba(5,8,9,.88); border: 1px solid #a08260; font: 600 14px/1.3 "Microsoft YaHei",sans-serif; cursor: pointer; }
.hud-pause:hover { background: #27231b; border-color: var(--ember-hot); }
.touch-enabled .hud-pause { display: none; }
.touch-actions #touch-pause { grid-column: 1; grid-row: 2; align-self: end; font-size: 14px; line-height: 1.3; }
.message { position: absolute; left: 50%; bottom: 72px; transform: translateX(-50%); min-width: 260px; max-width: 650px; padding: 13px 22px; opacity: 0; text-align: center; color: var(--bone); background: rgba(5,8,9,.83); border-left: 3px solid var(--ember); font: 15px/1.5 Georgia, "STSong", serif; transition: opacity .25s; }
.message.show { opacity: 1; }
.tutorial-card { position: absolute; left: 50%; bottom: 28px; width: min(520px,calc(100vw - 40px)); transform: translateX(-50%); padding: 16px 18px; color: var(--bone); background: rgba(7,12,13,.94); border: 1px solid #8a6747; border-left: 4px solid var(--ember); box-shadow: 0 16px 55px #000; pointer-events: auto; text-shadow: none; }
.tutorial-card small,.tutorial-card strong { display: block; }
.tutorial-card small { color: var(--ember-hot); font-size: 10px; letter-spacing: .18em; }
.tutorial-card strong { margin-top: 6px; font: 500 21px Georgia,"STSong",serif; }
.tutorial-card p { margin: 7px 0 10px; color: #aebeb9; font: 13px/1.65 Georgia,"STSong",serif; }
.tutorial-card button { padding: 6px 9px; color: #8ca09c; background: transparent; border: 1px solid #455552; cursor: pointer; font-size: 11px; }
.hud:has(.tutorial-card:not(.hidden)) .message { bottom: clamp(220px,25vh,270px); }
.boss-bar { position: absolute; left: 50%; bottom: 28px; width: min(520px,55vw); height: 14px; transform: translateX(-50%); display: none; background: #0a0c0d; border: 1px solid #59463e; }
.boss-bar.active { display: block; }
.boss-bar span { position: absolute; left: 0; bottom: 17px; width: 100%; color: #d0bbb0; text-align: center; }
.boss-bar i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg,#6c1f23,#d75042); }

.result-stats { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; margin: 25px 0 8px; }
.result-stats div { padding: 15px 8px; background: #0e1415; border: 1px solid #303d3b; text-align: center; }
.result-stats span, .result-stats strong { display: block; }
.result-stats span { color: #7f9390; font-size: 11px; }
.result-stats strong { margin-top: 8px; color: var(--ember-hot); font-size: 22px; }
.pause-summary { min-height: 3.2em; margin: 0 0 14px; color: #b9c9c4; font: 14px/1.6 Georgia,"STSong",serif; }
.pause-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin: 0 0 22px; }
.pause-stats div { padding: 10px 7px; background: #0e1415; border: 1px solid #303d3b; text-align: center; }
.pause-stats span,.pause-stats strong { display: block; }
.pause-stats span { color: #7f9390; font-size: 10px; letter-spacing: .14em; }
.pause-stats strong { margin-top: 5px; color: var(--ember-hot); font-size: 17px; }
#restart-btn.armed,#endless-end-btn.armed { color: #fff1e6; background: #8c2d25; border-color: #ff7d67; }
.pause-action-status { min-height: 2.8em; margin: 12px 0 0; color: #c6a49d; font-size: 12px; line-height: 1.4; }
.pause-navigation-note { margin: 5px 0 0; color: #718783; font-size: 10px; letter-spacing: .08em; }
.pause-actions .primary,.pause-actions .quiet { display: block; margin-right: auto; margin-left: auto; }
.pause-panel { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.pause-quit-confirm { margin-top: 16px; padding: 14px; border: 1px solid #a08260; background: #161b1c; text-align: left; }
#pause-quit-heading { margin: 0 0 8px; color: var(--bone); font-size: 16px; }
#pause-quit-note { margin: 0 0 14px; color: #c9bfa9; font-size: 13px; line-height: 1.6; }
.pause-confirm-actions { display: grid; gap: 8px; }
.pause-actions .pause-confirm-actions .quiet { width: 100%; min-height: 44px; margin: 0; padding: 10px; white-space: normal; }
#pause-quit-accept { border-color: #be7667; color: #f1b6a8; }
.result-meta { margin: -5px 0 15px; color: #84aaa5; font-size: 12px; letter-spacing: .1em; }
.combat-stats { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; margin-top: 10px; }
.combat-stats div { padding: 10px 6px; text-align: center; background: rgba(9,16,17,.78); border: 1px solid #2a3937; }
.combat-stats span,.combat-stats strong { display: block; }
.combat-stats span { color: #718783; font-size: 10px; }
.combat-stats strong { margin-top: 5px; color: #b9d5cf; }
.result-advice { min-height: 22px; margin: 14px 0 0; color: #c9bfa9; font: 13px/1.6 Georgia,"STSong",serif; }
.result-panel { max-height: 90vh; overflow: auto; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.result-panel::-webkit-scrollbar { width: 8px; }
.result-panel::-webkit-scrollbar-track { background: #11191a; }
.result-panel::-webkit-scrollbar-thumb { background: #5b6e69; border-radius: 8px; }
.result-actions { position: sticky; z-index: 4; bottom: 0; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; padding: 12px 0 2px; background: linear-gradient(180deg,rgba(12,18,19,0),rgba(8,12,13,.98) 28%); }
.result-actions .primary,.result-actions .quiet { flex: 0 1 190px; margin: 0; }
.result-challenge-plan { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 14px; margin-top: 14px; padding: 12px 14px; background: rgba(7,13,14,.84); border: 1px solid #436d66; border-left: 3px solid #b86b3f; }
.result-challenge-plan small,.result-challenge-plan strong,.result-challenge-plan span { display: block; }
.result-challenge-plan small { color: #78938e; font-size: 9px; letter-spacing: .12em; }
.result-challenge-plan strong { margin-top: 5px; color: var(--ember-hot); font: 500 16px Georgia,"STSong",serif; }
.result-challenge-plan span { margin-top: 5px; color: #a8bbb6; font: 11px/1.5 Georgia,"STSong",serif; }
.result-challenge-plan .quiet { min-width: 170px; margin: 0; padding: 10px 14px; }
.result-circuit-plan { margin-top: 14px; padding: 12px 14px; background: rgba(7,13,14,.84); border: 1px solid #436d66; border-left: 3px solid #6faaa1; }
.result-circuit-plan small,.result-circuit-plan strong,.result-circuit-plan span { display: block; }
.result-circuit-plan small { color: #78938e; font-size: 9px; letter-spacing: .12em; }
.result-circuit-plan strong { margin-top: 5px; color: var(--ember-hot); font: 500 16px Georgia,"STSong",serif; }
.result-circuit-plan span { margin-top: 8px; color: #a8bbb6; font: 11px/1.5 Georgia,"STSong",serif; }
.result-circuit-plan .result-circuit-plan-context { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 5px 12px; margin-top: 8px; padding: 7px 9px; color: #93aaa4; background: rgba(11,21,21,.66); border-left: 2px solid #496d65; font: 10px/1.5 Georgia,"STSong",serif; }
.result-circuit-plan .result-circuit-plan-context span { margin: 0; color: inherit; font: inherit; }
.result-circuit-plan-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 9px; }
.result-circuit-plan-option { min-height: 38px; padding: 7px 9px; color: #91aaa4; background: rgba(8,16,17,.88); border: 1px solid #3d5a55; font: 10px/1.35 Georgia,"STSong",serif; }
.result-circuit-plan-option.selected { color: #fff0d3; border-color: #74b3a3; background: rgba(32,78,69,.72); }
.result-circuit-plan-option.recommended:not(.selected) { border-color: #a88655; box-shadow: inset 0 0 0 1px rgba(230,177,100,.12); }
.result-circuit-plan .quiet { width: 100%; margin: 9px 0 0; padding: 8px 12px; }
.result-circuit-diagnostics { margin-top: 9px; color: #8fb0aa; font: 10px/1.45 Georgia,"STSong",serif; }
.result-circuit-diagnostics summary { cursor: pointer; color: #b9cec8; }
.result-circuit-diagnostics summary span { display: inline; margin: 0; color: #d6b984; font: inherit; }
.result-circuit-diagnostics-filters { display: flex; gap: 6px; margin-top: 8px; }
.result-circuit-diagnostics-filters button { min-height: 30px; padding: 5px 10px; color: #829b95; background: rgba(5,11,12,.72); border: 1px solid #344b47; font: 9px/1.2 Georgia,"STSong",serif; }
.result-circuit-diagnostics-filters button.selected { color: #fff0d3; border-color: #74b3a3; background: rgba(32,78,69,.62); }
.result-circuit-diagnostics-legend { margin: 6px 0 0; color: #718c86; font-size: 9px; }
.result-circuit-diagnostics-legend span { display: inline; margin: 0 .16em; color: inherit; font: 700 10px/1 Georgia,"STSong",serif; }
.result-circuit-diagnostics-districts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.result-circuit-diagnostics-districts a { padding: 4px 8px; color: #9eb7b0; text-decoration: none; background: rgba(12,23,23,.68); border: 1px solid #405c56; }
.result-circuit-diagnostics-districts a:hover,.result-circuit-diagnostics-districts a:focus-visible { color: #fff0d3; border-color: #74b3a3; outline: none; }
.result-circuit-diagnostics-districts a[aria-disabled="true"] { color: #5f706c; pointer-events: none; border-color: #293c38; }
.result-circuit-diagnostics-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 8px; }
.result-circuit-diagnostic { padding: 8px; background: rgba(5,11,12,.76); border: 1px solid #344b47; }
.result-circuit-diagnostic h3,.result-circuit-diagnostic p { display: block; margin: 0; }
.result-circuit-diagnostic h3 { color: #dccbb1; font: 600 10px/1.4 Georgia,"STSong",serif; }
.result-circuit-diagnostic p { margin-top: 3px; color: #8fb0aa; font-size: 9px; }
.result-circuit-diagnostic ul { display: grid; gap: 3px; margin: 7px 0 0; padding: 0; list-style: none; }
.result-circuit-diagnostic li { padding-top: 4px; border-top: 1px solid rgba(84,112,105,.28); color: #8ea6a0; font-size: 9px; }
.result-circuit-diagnostic li.fail { color: #d8a796; }
.result-circuit-diagnostic li .result-circuit-diagnostic-mark { display: inline; margin: 0 .24em 0 0; color: inherit; font: 700 10px/1 Georgia,"STSong",serif; }
.result-circuit-diagnostic li:target,.result-circuit-diagnostic li:focus { color: #fff0d3; outline: 1px solid #74b3a3; outline-offset: 2px; }
.result-circuit-diagnostic-empty { grid-column: 1 / -1; padding: 10px; color: #9db7b0; text-align: center; border: 1px dashed #47645e; }
#result-screen.win { justify-content: flex-end; padding-right: 7vw; background: linear-gradient(90deg,rgba(2,4,5,.08),rgba(2,4,5,.3) 48%,rgba(2,4,5,.88)),url("assets/dawn-ending.png") center / cover no-repeat; backdrop-filter: none; }
#result-screen.win .result-panel { width: min(700px,52vw); background: linear-gradient(145deg,rgba(24,30,29,.94),rgba(7,11,12,.95)); }

.archive-panel { width: min(900px, calc(100vw - 40px)); max-height: 88vh; overflow: auto; }
.title-copy,.settings-panel,.archive-panel,.records-panel,.gear-panel,.oath-panel,.tools-panel,.challenge-panel,.gallery-panel,.city-panel,.negatives-panel,.memory-panel,.station-panel,.codex-panel { scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.title-copy::-webkit-scrollbar,.settings-panel::-webkit-scrollbar,.archive-panel::-webkit-scrollbar,.records-panel::-webkit-scrollbar,.gear-panel::-webkit-scrollbar,.oath-panel::-webkit-scrollbar,.tools-panel::-webkit-scrollbar,.challenge-panel::-webkit-scrollbar,.gallery-panel::-webkit-scrollbar,.city-panel::-webkit-scrollbar,.negatives-panel::-webkit-scrollbar,.memory-panel::-webkit-scrollbar,.station-panel::-webkit-scrollbar,.codex-panel::-webkit-scrollbar { width: 8px; }
.title-copy::-webkit-scrollbar-track,.settings-panel::-webkit-scrollbar-track,.archive-panel::-webkit-scrollbar-track,.records-panel::-webkit-scrollbar-track,.gear-panel::-webkit-scrollbar-track,.oath-panel::-webkit-scrollbar-track,.tools-panel::-webkit-scrollbar-track,.challenge-panel::-webkit-scrollbar-track,.gallery-panel::-webkit-scrollbar-track,.city-panel::-webkit-scrollbar-track,.negatives-panel::-webkit-scrollbar-track,.memory-panel::-webkit-scrollbar-track,.station-panel::-webkit-scrollbar-track,.codex-panel::-webkit-scrollbar-track { background: #11191a; }
.title-copy::-webkit-scrollbar-thumb,.settings-panel::-webkit-scrollbar-thumb,.archive-panel::-webkit-scrollbar-thumb,.records-panel::-webkit-scrollbar-thumb,.gear-panel::-webkit-scrollbar-thumb,.oath-panel::-webkit-scrollbar-thumb,.tools-panel::-webkit-scrollbar-thumb,.challenge-panel::-webkit-scrollbar-thumb,.gallery-panel::-webkit-scrollbar-thumb,.city-panel::-webkit-scrollbar-thumb,.negatives-panel::-webkit-scrollbar-thumb,.memory-panel::-webkit-scrollbar-thumb,.station-panel::-webkit-scrollbar-thumb,.codex-panel::-webkit-scrollbar-thumb { background: #5b6e69; border-radius: 8px; }
.archive-progress { margin: -8px 0 22px; color: #8ea4a0; font-size: 13px; letter-spacing: .12em; }
.archive-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.letter-card { min-height: 150px; padding: 19px; border: 1px solid #34423f; background: #0d1314; }
.letter-card.locked { display: flex; align-items: center; justify-content: center; color: #52605e; background: repeating-linear-gradient(135deg,#0b1011,#0b1011 8px,#0d1314 8px,#0d1314 16px); }
.letter-card small { display: block; margin-bottom: 8px; color: var(--ember); letter-spacing: .14em; }
.letter-card strong { display: block; margin-bottom: 10px; color: var(--bone); font: 500 21px Georgia,"STSong",serif; }
.letter-card p { margin: 0; color: #98aaa6; font: 14px/1.7 Georgia,"STSong",serif; }

.settings-panel { --settings-inset: clamp(20px,4vw,40px); display: flex; flex-direction: column; max-height: 90vh; max-height: min(90vh,calc(100dvh - 24px)); padding: 0; overflow: hidden; }
.settings-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--settings-inset); scroll-padding-block: 20px; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.settings-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 12px var(--settings-inset); border-top: 1px solid #475653; background: #101718; }
.settings-actions > span { color: #aebdb8; font-size: 12px; line-height: 1.5; }
.settings-actions > .primary { margin: 0; min-height: 44px; min-width: 0; }
.settings-panel h3 { margin: 26px 0 12px; color: #aebdb8; font-size: 13px; letter-spacing: .18em; }
.difficulty-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.difficulty { min-height: 112px; padding: 16px; color: var(--bone); text-align: left; background: #0d1314; border: 1px solid #34423f; cursor: pointer; }
.difficulty:hover, .difficulty.selected { border-color: var(--ember); background: #1d1915; }
.difficulty strong, .difficulty span { display: block; }
.difficulty strong { margin-bottom: 8px; color: var(--ember-hot); font-size: 17px; }
.difficulty span { color: #879995; font-size: 12px; line-height: 1.6; }
.toggle-row { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding: 15px; background: #0d1314; border: 1px solid #34423f; cursor: pointer; }
.toggle-row input { width: 20px; height: 20px; accent-color: var(--ember); }
.toggle-row strong, .toggle-row small { display: block; }
.toggle-row small { margin-top: 4px; color: #81918e; }
.render-profile-note { margin: 10px 0 0; padding: 9px 12px; color: #8eaaa5; background: rgba(10,17,18,.7); border-left: 2px solid #557d77; font-size: 11px; line-height: 1.55; }
.render-profile-status { color: #7fa9a2; }
.keybinding-tools { padding: 15px; background: #0d1314; border: 1px solid #34423f; }
.keybinding-tools > p { margin: 0 0 12px; color: #91a29e; font-size: 12px; line-height: 1.65; }
.keybinding-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-bottom: 10px; }
.keybinding-button { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 44px; padding: 9px 11px; color: #aebdb8; text-align: left; background: #090e0f; border: 1px solid #34423f; cursor: pointer; }
.keybinding-button:hover,.keybinding-button:focus-visible { color: var(--bone); border-color: #739086; }
.keybinding-button.listening { color: var(--ember-hot); border-color: var(--ember); background: #211914; box-shadow: inset 0 0 22px rgba(255,111,48,.07); }
.keybinding-button strong { color: var(--ember-hot); font: 700 11px ui-monospace,monospace; }
.keybinding-tools > .quiet { width: 100%; min-width: 0; margin: 0; }
.audio-settings { display: grid; gap: 9px; }
.audio-settings label { display: grid; grid-template-columns: minmax(150px,1fr) minmax(150px,1.35fr) 48px; align-items: center; gap: 16px; padding: 14px 15px; background: #0d1314; border: 1px solid #34423f; }
.audio-settings strong,.audio-settings small { display: block; }
.audio-settings small { margin-top: 4px; color: #81918e; font-size: 11px; }
.audio-settings input { width: 100%; accent-color: var(--ember); }
.audio-settings output { color: var(--ember-hot); text-align: right; font: 12px ui-monospace,monospace; }
.save-tools { padding: 15px; background: #0d1314; border: 1px solid #34423f; }
.save-tools p { margin: 0 0 12px; color: #91a29e; font-size: 12px; line-height: 1.65; }
.save-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.save-actions .quiet,.save-tools > .quiet { width: 100%; min-width: 0; margin: 0; }
.file-button,.danger-button { display: flex; align-items: center; justify-content: center; min-height: 43px; padding: 9px 14px; cursor: pointer; }
.file-button { color: var(--bone); background: rgba(9,12,13,.62); border: 1px solid #54615f; }
.file-button:hover,.file-button:focus-visible { color: var(--ember-hot); border-color: var(--ember); }
.danger-button { width: 100%; margin-top: 13px; color: #d59a91; background: rgba(42,13,13,.35); border: 1px solid #76413c; }
.danger-button.armed { color: #fff1e6; background: #8c2d25; border-color: #ff7d67; }
.save-recovery-history { display: grid; gap: 5px; margin-top: 10px; color: #83aaa3; font-size: 10px; }
.save-recovery-history select { width: 100%; color: #d9eee9; background: #101b1b; border: 1px solid #4f7c75; border-radius: 4px; padding: 8px; font: inherit; }
#save-recovery { margin-top: 9px; color: #b9d9d2; border-color: #4f7c75; }
#save-recovery.armed { color: #fff3d9; background: #704326; border-color: #e29a5d; }
#save-recovery-export { margin-top: 7px; color: #9ec7bf; border-color: #3f6862; }
.save-tools .save-recovery-note { margin: 8px 2px 0; color: #83aaa3; font-size: 10px; }
.save-tools .save-recovery-diff { margin: 7px 2px 0; padding: 8px 9px; color: #c7ddd8; background: rgba(22,48,46,.42); border-left: 2px solid #5b9188; font-size: 10px; line-height: 1.55; }
.visually-hidden { 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; }

#records-screen { background: linear-gradient(90deg,rgba(2,4,5,.94),rgba(2,4,5,.48)),url("assets/courier-li-portrait.png") center / cover no-repeat; backdrop-filter: none; }
.records-panel { --records-inset: clamp(16px,3vw,30px); display: flex; flex-direction: column; width: min(920px,calc(100vw - 40px)); max-height: 90vh; max-height: min(90vh,calc(100dvh - 24px)); padding: 0; overflow: hidden; background: linear-gradient(145deg,rgba(23,31,32,.94),rgba(8,12,13,.93)); }
.records-header { flex: 0 0 auto; padding: var(--records-inset) var(--records-inset) 14px; border-bottom: 1px solid #475653; }
.records-header h2 { margin: 0 0 14px; font-size: clamp(28px,4vw,44px); }
.records-navigation { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.records-navigation button { min-height: 44px; padding: 9px 12px; color: #afc2bc; background: #0b1213; border: 1px solid #50645f; cursor: pointer; }
.records-navigation button.selected { color: var(--ember-hot); border-color: #be764a; background: #281e17; }
.records-navigation button:hover { border-color: var(--ember-hot); }
.records-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px var(--records-inset); scroll-padding-block: 18px; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.records-panel h3 { margin: 0 0 12px; color: #9cafaa; letter-spacing: .15em; font-size: 13px; }
.records-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 12px var(--records-inset); border-top: 1px solid #475653; background: #101718; }
.records-actions > span { color: #aebdb8; font-size: 12px; line-height: 1.5; }
.records-actions > .primary { margin: 0; min-width: 0; min-height: 44px; }
.achievement-progress { margin: -4px 0 12px; color: #91a7a2; font: 13px/1.6 Georgia,"STSong",serif; }
.achievement-filters { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; margin-bottom: 12px; }
.achievement-filters button { padding: 9px 10px; color: #839793; background: rgba(7,12,13,.78); border: 1px solid #34423f; cursor: pointer; }
.achievement-filters button:hover,.achievement-filters button.selected { color: var(--ember-hot); background: rgba(34,24,18,.82); border-color: #a8643c; }
.career-stats { display: grid; grid-template-columns: repeat(5,1fr); gap: 9px; }
.career-stat { padding: 14px 8px; text-align: center; background: rgba(8,13,14,.82); border: 1px solid #33413f; }
.career-stat span, .career-stat strong { display: block; }
.career-stat span { color: #718582; font-size: 11px; }
.career-stat strong { margin-top: 6px; color: var(--ember-hot); font-size: 22px; }
.achievement-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.achievement { padding: 13px 15px; background: rgba(8,13,14,.82); border: 1px solid #33413f; }
.achievement.locked { opacity: .42; filter: grayscale(1); }
.achievement small { display: block; margin-bottom: 5px; color: #68827d; font-size: 9px; letter-spacing: .14em; }
.achievement strong { display: block; color: var(--bone); }
.achievement span { display: block; margin-top: 5px; color: #839692; font-size: 12px; }

#gear-screen { background: linear-gradient(90deg,rgba(2,4,5,.52),rgba(2,4,5,.9)),url("assets/courier-satchel-still-life.png") center / cover no-repeat; backdrop-filter: none; }
.gear-panel { width: min(980px,calc(100vw - 40px)); max-height: 90vh; overflow: auto; margin-left: 30vw; background: linear-gradient(145deg,rgba(22,29,29,.96),rgba(7,11,12,.96)); }
.gear-summary { margin: -8px 0 20px; color: #93aaa6; font: 14px/1.7 Georgia,"STSong",serif; }
.gear-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 11px; }
.gear-card { min-height: 126px; padding: 17px; color: var(--bone); text-align: left; background: rgba(8,14,15,.86); border: 1px solid #344542; cursor: pointer; }
.gear-card:hover,.gear-card.selected { border-color: var(--ember); background: rgba(29,25,20,.92); }
.gear-card.locked { opacity: .48; cursor: not-allowed; filter: grayscale(.8); }
.gear-card strong,.gear-card span,.gear-card em { display: block; }
.gear-card strong { color: var(--ember-hot); font-size: 17px; }
.gear-card span { margin-top: 7px; color: #9cafaa; font-size: 12px; line-height: 1.55; }
.gear-card em { margin-top: 9px; color: #d0c4ab; font-size: 11px; font-style: normal; }

#post-office-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.08),rgba(2,4,5,.48) 50%,rgba(2,4,5,.96)),url("assets/night-post-office-reconstruction.png") center / cover no-repeat; backdrop-filter: none; }
.post-office-panel { width: min(780px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.post-office-summary { margin: -8px 0 12px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.post-office-meter { height: 7px; margin-bottom: 18px; overflow: hidden; background: #10191a; border: 1px solid #33433f; }
.post-office-meter i { display: block; width: 0; height: 100%; background: linear-gradient(90deg,#9d5638,#ff9b52,#71aaa2); transition: width .35s ease; }
.post-office-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.post-office-card { min-height: 244px; padding: 17px; color: var(--bone); text-align: left; background: rgba(8,14,15,.9); border: 1px solid #40514d; }
.post-office-card.can-repair { cursor: pointer; border-color: #8f684c; box-shadow: inset 0 0 38px rgba(255,126,55,.035); }
.post-office-card.can-repair:hover { border-color: var(--ember); background: rgba(31,23,18,.94); }
.post-office-card.complete { border-color: #598079; background: rgba(12,25,24,.92); }
.post-office-card:disabled { cursor: not-allowed; }
.post-office-card > small,.post-office-card > strong,.post-office-card > span,.post-office-card > em { display: block; }
.post-office-card > small { color: #78a8a1; font-size: 9px; letter-spacing: .14em; }
.post-office-card > strong { margin-top: 7px; color: var(--ember-hot); font: 500 20px Georgia,"STSong",serif; }
.post-office-card > span { min-height: 72px; margin-top: 8px; color: #a9b7b3; font: 12px/1.62 Georgia,"STSong",serif; }
.post-office-card > em { margin-top: 10px; color: #d6c7aa; font-size: 11px; line-height: 1.55; font-style: normal; }
.facility-pips { display: flex; gap: 6px; margin-top: 13px; }
.facility-pips i { width: 24px; height: 4px; background: #273330; }
.facility-pips i.on { background: #e2854d; box-shadow: 0 0 8px rgba(255,135,71,.3); }

#visitors-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.08),rgba(2,4,5,.5) 52%,rgba(2,4,5,.96)),url("assets/night-post-office-visitors.png") center / cover no-repeat; backdrop-filter: none; }
.visitors-panel { width: min(760px,53vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.visitors-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.visitor-profile { padding: 16px 18px; background: rgba(8,14,15,.91); border-left: 3px solid #bd7047; }
.visitor-profile small,.visitor-profile strong,.visitor-profile span { display: block; }
.visitor-profile small { color: #75a59e; font-size: 9px; letter-spacing: .14em; }
.visitor-profile strong { margin-top: 6px; color: var(--ember-hot); font: 500 22px Georgia,"STSong",serif; }
.visitor-profile span { margin-top: 8px; color: #a9b7b3; font: 12px/1.65 Georgia,"STSong",serif; }
.visitor-commission { margin-top: 12px; padding: 14px 16px; color: #b8c5c1; background: rgba(9,15,16,.93); border: 1px solid #4a5a56; }
.visitor-commission.active { color: #dfd2ba; border-color: #bd7047; background: rgba(31,23,18,.94); }
.visitor-commission small,.visitor-commission strong,.visitor-commission span,.visitor-commission em { display: block; }
.visitor-commission small { color: #77a9a1; font-size: 9px; letter-spacing: .14em; }
.visitor-commission strong { margin-top: 5px; color: var(--ember-hot); font: 500 18px Georgia,"STSong",serif; }
.visitor-commission span { margin-top: 7px; font: 11px/1.6 Georgia,"STSong",serif; }
.visitor-commission em { margin-top: 7px; color: #d09a75; font: normal 10px/1.55 Georgia,"STSong",serif; }
.visitor-commission button { width: 100%; margin-top: 10px; }
.visitor-topics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.visitor-topic { min-height: 72px; padding: 12px 14px; color: #b8c5c1; text-align: left; background: rgba(8,14,15,.88); border: 1px solid #394a46; cursor: pointer; }
.visitor-topic:hover,.visitor-topic.selected { color: var(--ember-hot); border-color: #c87a4c; background: rgba(31,23,18,.94); }
.visitor-topic.read::before { content:"◆ "; color: #78aaa3; }
.visitor-response { min-height: 118px; margin-top: 12px; padding: 16px 18px; color: #d4c8b3; background: rgba(12,18,18,.93); border: 1px solid #40514d; font: 13px/1.75 Georgia,"STSong",serif; }
.visitor-response small,.visitor-response strong,.visitor-response span { display: block; }
.visitor-response small { color: #78aaa3; font-size: 9px; letter-spacing: .14em; }
.visitor-response strong { margin: 5px 0 7px; color: var(--ember-hot); font-size: 17px; }

#visitor-index-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.08),rgba(2,4,5,.48) 52%,rgba(2,4,5,.96)),url("assets/visitor-entrusted-objects.png") center / cover no-repeat; backdrop-filter: none; }
.visitor-index-panel { width: min(820px,53vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.visitor-index-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.visitor-index-active { padding: 13px 15px; color: #aebbb6; background: rgba(8,14,15,.92); border: 1px solid #3d4e4a; }
.visitor-index-active.active { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.visitor-index-active small,.visitor-index-active strong,.visitor-index-active span { display: block; }
.visitor-index-active small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.visitor-index-active strong { margin-top: 5px; font: 500 17px Georgia,"STSong",serif; }
.visitor-index-active span { margin-top: 5px; font-size: 11px; line-height: 1.55; }
.visitor-index-panel h3 { margin: 22px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.visitor-index-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.visitor-index-card { min-height: 128px; padding: 13px 14px; color: #aebbb6; background: rgba(8,14,15,.91); border: 1px solid #394a46; }
.visitor-index-card.complete { border-color: #638b84; }
.visitor-index-card.active { border-color: #bd7047; background: rgba(31,23,18,.92); }
.visitor-index-card.locked { opacity: .46; filter: grayscale(.75); }
.visitor-index-card small,.visitor-index-card strong,.visitor-index-card span,.visitor-index-card em { display: block; }
.visitor-index-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.visitor-index-card strong { margin-top: 5px; color: #e0d1b8; font: 500 15px Georgia,"STSong",serif; }
.visitor-index-card span { margin-top: 6px; font: 10px/1.55 Georgia,"STSong",serif; }
.visitor-index-card em { margin-top: 7px; color: #ce9873; font: normal 9px/1.45 Georgia,"STSong",serif; }

#mutual-aid-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.08),rgba(2,4,5,.48) 54%,rgba(2,4,5,.96)),url("assets/district-mutual-aid-board.png") center / cover no-repeat; backdrop-filter: none; }
.mutual-aid-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.mutual-aid-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.mutual-aid-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.night-shift-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.night-shift-card { min-height: 112px; padding: 13px 14px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.91); border: 1px solid #394a46; cursor: pointer; }
.night-shift-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.night-shift-card.locked { opacity: .42; filter: grayscale(.8); cursor: not-allowed; }
.night-shift-card small,.night-shift-card strong,.night-shift-card span { display: block; }
.night-shift-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.night-shift-card strong { margin-top: 5px; font: 500 15px Georgia,"STSong",serif; }
.night-shift-card span { margin-top: 6px; font: 10px/1.5 Georgia,"STSong",serif; }
.aid-combo-preview { margin-top: 12px; padding: 13px 15px; color: #9cafaa; background: rgba(8,14,15,.91); border: 1px solid #3b4d49; }
.aid-combo-preview.active { color: #d4c7ae; border-color: #bd7047; background: rgba(31,23,18,.91); }
.aid-combo-preview small,.aid-combo-preview strong,.aid-combo-preview span { display: block; }
.aid-combo-preview small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.aid-combo-preview strong { margin: 5px 0; color: var(--ember-hot); font: 500 17px Georgia,"STSong",serif; }
.aid-combo-preview span { font: 11px/1.55 Georgia,"STSong",serif; }
.aid-notice-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.aid-notice-card { min-height: 178px; padding: 14px 15px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.91); border: 1px solid #394a46; cursor: pointer; }
.aid-notice-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.aid-notice-card.complete { border-color: #638b84; cursor: default; }
.aid-notice-card.locked { opacity: .42; filter: grayscale(.8); cursor: not-allowed; }
.aid-notice-card small,.aid-notice-card strong,.aid-notice-card span,.aid-notice-card em { display: block; }
.aid-notice-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.aid-notice-card strong { margin-top: 5px; color: #e0d1b8; font: 500 16px Georgia,"STSong",serif; }
.aid-notice-card span { margin-top: 7px; font: 10px/1.55 Georgia,"STSong",serif; }
.aid-notice-card em { margin-top: 8px; color: #ce9873; font: normal 9px/1.45 Georgia,"STSong",serif; }

#reconstruction-report-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.06),rgba(2,4,5,.45) 55%,rgba(2,4,5,.96)),url("assets/community-reconstruction-report.png") center / cover no-repeat; backdrop-filter: none; }
.reconstruction-report-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.reconstruction-report-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.reconstruction-report-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.resource-relay-preview { padding: 14px 16px; color: #9cafaa; background: rgba(8,14,15,.92); border: 1px solid #3b4d49; }
.resource-relay-preview.active { color: #e0d1b8; border-color: #bd7047; background: rgba(31,23,18,.92); }
.resource-relay-preview small,.resource-relay-preview strong,.resource-relay-preview span,.resource-relay-preview em { display: block; }
.resource-relay-preview small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.resource-relay-preview strong { margin: 5px 0; color: var(--ember-hot); font: 500 17px Georgia,"STSong",serif; }
.resource-relay-preview span { font: 11px/1.55 Georgia,"STSong",serif; }
.resource-relay-preview em { margin-top: 7px; color: #ce9873; font: normal 10px/1.5 Georgia,"STSong",serif; }
.community-project-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.community-project-card { min-height: 190px; padding: 14px 15px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.92); border: 1px solid #394a46; cursor: pointer; }
.community-project-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.community-project-card.complete { border-color: #638b84; cursor: default; }
.community-project-card.locked { opacity: .42; filter: grayscale(.8); cursor: not-allowed; }
.community-project-card small,.community-project-card strong,.community-project-card span,.community-project-card em { display: block; }
.community-project-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.community-project-card strong { margin-top: 5px; color: #e0d1b8; font: 500 16px Georgia,"STSong",serif; }
.community-project-card span { margin-top: 7px; font: 10px/1.55 Georgia,"STSong",serif; }
.community-project-card em { margin-top: 8px; color: #ce9873; font: normal 9px/1.45 Georgia,"STSong",serif; }
.reconstruction-report-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.reconstruction-report-card { min-height: 116px; padding: 12px 13px; color: #9cafaa; background: rgba(8,14,15,.9); border: 1px solid #344640; }
.reconstruction-report-card.complete { color: #d9ccb4; border-color: #638b84; }
.reconstruction-report-card.locked { opacity: .43; filter: grayscale(.75); }
.reconstruction-report-card small,.reconstruction-report-card strong,.reconstruction-report-card span { display: block; }
.reconstruction-report-card small { color: #76a69f; font-size: 8px; letter-spacing: .1em; }
.reconstruction-report-card strong { margin: 5px 0; font: 500 14px Georgia,"STSong",serif; }
.reconstruction-report-card span { font: 9px/1.5 Georgia,"STSong",serif; }

#assembly-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.42) 54%,rgba(2,4,5,.96)),url("assets/united-dawn-assembly.png") center / cover no-repeat; backdrop-filter: none; }
.assembly-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.assembly-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.assembly-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.assembly-accord-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.assembly-accord-card { min-height: 182px; padding: 14px 15px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.92); border: 1px solid #394a46; cursor: pointer; }
.assembly-accord-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.assembly-accord-card.locked { opacity: .62; filter: grayscale(.55); cursor: not-allowed; }
.assembly-accord-card small,.assembly-accord-card strong,.assembly-accord-card span,.assembly-accord-card em { display: block; }
.assembly-accord-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.assembly-accord-card strong { margin: 5px 0; color: #e0d1b8; font: 500 16px Georgia,"STSong",serif; }
.assembly-accord-card span { font: 11px/1.55 Georgia,"STSong",serif; }
.assembly-accord-card em { margin-top: 8px; color: #ce9873; font: normal 10px/1.45 Georgia,"STSong",serif; }
.assembly-support-rules { margin-top: 12px; padding: 14px 16px; color: #aebbb6; background: rgba(8,14,15,.92); border: 1px solid #3b4d49; font: 10px/1.65 Georgia,"STSong",serif; }
.assembly-support-rules strong,.assembly-support-rules span { display: block; }
.assembly-support-rules strong { margin-bottom: 5px; color: var(--ember-hot); font-size: 15px; }
.assembly-ending-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.assembly-ending-card { min-height: 104px; padding: 12px 13px; color: #9cafaa; background: rgba(8,14,15,.9); border: 1px solid #344640; }
.assembly-ending-card.complete { color: #d9ccb4; border-color: #638b84; }
.assembly-ending-card.locked { opacity: .45; filter: grayscale(.75); }
.assembly-ending-card small,.assembly-ending-card strong,.assembly-ending-card span { display: block; }
.assembly-ending-card small { color: #76a69f; font-size: 8px; letter-spacing: .1em; }
.assembly-ending-card strong { margin: 5px 0; font: 500 14px Georgia,"STSong",serif; }
.assembly-ending-card span { font: 9px/1.5 Georgia,"STSong",serif; }

#morning-shift-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.42) 54%,rgba(2,4,5,.96)),url("assets/morning-shift-handover.png") center / cover no-repeat; backdrop-filter: none; }
.morning-shift-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.morning-shift-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.morning-shift-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.morning-shift-preview { padding: 14px 16px; color: #9cafaa; background: rgba(8,14,15,.92); border: 1px solid #3b4d49; }
.morning-shift-preview.active { color: #e0d1b8; border-color: #bd7047; background: rgba(31,23,18,.92); }
.morning-shift-preview small,.morning-shift-preview strong,.morning-shift-preview span { display: block; }
.morning-shift-preview small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.morning-shift-preview strong { margin: 5px 0; color: var(--ember-hot); font: 500 17px Georgia,"STSong",serif; }
.morning-shift-preview span { font: 11px/1.55 Georgia,"STSong",serif; }
.morning-shift-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.morning-shift-card { min-height: 184px; padding: 14px 15px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.92); border: 1px solid #394a46; cursor: pointer; }
.morning-shift-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.morning-shift-card.complete { border-color: #638b84; }
.morning-shift-card.locked { opacity: .62; filter: grayscale(.55); cursor: not-allowed; }
.morning-shift-card small,.morning-shift-card strong,.morning-shift-card span,.morning-shift-card em { display: block; }
.morning-shift-card small { color: #76a69f; font-size: 9px; letter-spacing: .11em; }
.morning-shift-card strong { margin: 5px 0; color: #e0d1b8; font: 500 16px Georgia,"STSong",serif; }
.morning-shift-card span { font: 11px/1.55 Georgia,"STSong",serif; }
.morning-shift-card em { margin-top: 8px; color: #ce9873; font: normal 10px/1.45 Georgia,"STSong",serif; }
.morning-handover-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.morning-handover-card { min-height: 118px; padding: 12px 13px; color: #9cafaa; background: rgba(8,14,15,.9); border: 1px solid #344640; }
.morning-handover-card.complete { color: #d9ccb4; border-color: #638b84; }
.morning-handover-card.locked { opacity: .48; filter: grayscale(.7); }
.morning-handover-card small,.morning-handover-card strong,.morning-handover-card span { display: block; }
.morning-handover-card small { color: #76a69f; font-size: 8px; letter-spacing: .1em; }
.morning-handover-card strong { margin: 5px 0; font: 500 14px Georgia,"STSong",serif; }
.morning-handover-card span { font: 9px/1.5 Georgia,"STSong",serif; }

#post-office-screen[data-morning-shift="shelter"] { background: linear-gradient(90deg,rgba(41,19,8,.08),rgba(5,8,8,.48) 50%,rgba(2,4,5,.96)),url("assets/morning-shift-handover.png") center / cover no-repeat; }
#post-office-screen[data-morning-shift="route"] { background: linear-gradient(90deg,rgba(4,32,35,.08),rgba(5,8,8,.48) 50%,rgba(2,4,5,.96)),url("assets/morning-shift-handover.png") center / cover no-repeat; }
#post-office-screen[data-morning-shift="memory"] { background: linear-gradient(90deg,rgba(18,34,19,.08),rgba(5,8,8,.48) 50%,rgba(2,4,5,.96)),url("assets/morning-shift-handover.png") center / cover no-repeat; }

#resident-relay-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.42) 54%,rgba(2,4,5,.96)),url("assets/resident-relay-route-map.png") center / cover no-repeat; backdrop-filter: none; }
.resident-relay-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.resident-relay-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.resident-relay-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.resident-relay-preview { padding: 14px 16px; color: #9cafaa; background: rgba(8,14,15,.92); border: 1px solid #3b4d49; }
.resident-relay-preview.active { color: #e0d1b8; border-color: #bd7047; background: rgba(31,23,18,.92); }
.resident-relay-preview small,.resident-relay-preview strong,.resident-relay-preview span { display: block; }
.resident-relay-preview small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.resident-relay-preview strong { margin: 5px 0; color: var(--ember-hot); font: 500 17px Georgia,"STSong",serif; }
.resident-relay-preview span { font: 11px/1.55 Georgia,"STSong",serif; }
.resident-courier-list,.resident-relay-record-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.resident-courier-card,.resident-relay-record { min-height: 174px; padding: 14px 15px; color: #aebbb6; background: rgba(8,14,15,.92); border: 1px solid #394a46; }
.resident-relay-record { min-height: 128px; }
.resident-courier-card.active { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.resident-courier-card.complete,.resident-relay-record.complete { border-color: #638b84; }
.resident-courier-card.locked,.resident-relay-record.locked { opacity: .55; filter: grayscale(.65); }
.resident-courier-card small,.resident-courier-card strong,.resident-courier-card span,.resident-courier-card em,.resident-relay-record small,.resident-relay-record strong,.resident-relay-record span { display: block; }
.resident-courier-card small,.resident-relay-record small { color: #76a69f; font-size: 9px; letter-spacing: .1em; }
.resident-courier-card strong,.resident-relay-record strong { margin: 5px 0; color: #e0d1b8; font: 500 15px Georgia,"STSong",serif; }
.resident-courier-card span,.resident-relay-record span { font: 10px/1.55 Georgia,"STSong",serif; }
.resident-courier-card em { margin-top: 8px; color: #ce9873; font: normal 9px/1.48 Georgia,"STSong",serif; }

#resident-pairing-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.42) 54%,rgba(2,4,5,.96)),url("assets/resident-shift-pairing-board.png") center / cover no-repeat; backdrop-filter: none; }
.resident-pairing-panel { width: min(900px,54vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.resident-pairing-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.resident-pairing-panel h3 { margin: 20px 0 10px; color: #d5c8b1; font: 500 18px Georgia,"STSong",serif; }
.resident-pairing-list,.resident-team-note-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.resident-pairing-card,.resident-team-note { min-height: 164px; padding: 14px 15px; color: #aebbb6; background: rgba(8,14,15,.92); border: 1px solid #394a46; text-align: left; }
.resident-team-note { min-height: 120px; }
.resident-pairing-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.resident-pairing-card.locked,.resident-team-note.locked { opacity: .55; filter: grayscale(.65); }
.resident-pairing-card small,.resident-pairing-card strong,.resident-pairing-card span,.resident-pairing-card em,.resident-team-note small,.resident-team-note strong,.resident-team-note span { display: block; }
.resident-pairing-card small,.resident-team-note small { color: #76a69f; font-size: 9px; letter-spacing: .1em; }
.resident-pairing-card strong,.resident-team-note strong { margin: 5px 0; color: #e0d1b8; font: 500 15px Georgia,"STSong",serif; }
.resident-pairing-card span,.resident-team-note span { font: 10px/1.55 Georgia,"STSong",serif; }
.resident-pairing-card em { margin-top: 8px; color: #ce9873; font: normal 9px/1.48 Georgia,"STSong",serif; }

#resident-tools-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.05),rgba(2,4,5,.42) 54%,rgba(2,4,5,.96)),url("assets/resident-tool-modification-bench.png") center / cover no-repeat; backdrop-filter: none; }
.resident-tools-panel { width: min(940px,56vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.resident-tools-summary { margin: -8px 0 16px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.resident-tools-list { display: grid; gap: 12px; }
.resident-tool-pair { padding: 15px; background: rgba(8,14,15,.92); border: 1px solid #394a46; }
.resident-tool-pair.active { border-color: #bd7047; background: rgba(31,23,18,.92); }
.resident-tool-pair > small,.resident-tool-pair > strong,.resident-tool-pair > span { display: block; }
.resident-tool-pair > small { color: #76a69f; font-size: 9px; letter-spacing: .1em; }
.resident-tool-pair > strong { margin: 5px 0; color: #e0d1b8; font: 500 18px Georgia,"STSong",serif; }
.resident-tool-pair > span { color: #aebbb6; font: 11px/1.6 Georgia,"STSong",serif; }
.resident-tool-options,.resident-issue-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 11px; }
.resident-tool-option,.resident-issue-option { min-height: 112px; padding: 12px; text-align: left; background: rgba(5,10,11,.9); border: 1px solid #344743; }
.resident-tool-option.selected,.resident-issue-option.selected { border-color: #c87a4d; background: rgba(43,28,18,.94); }
.resident-tool-option.locked,.resident-issue-option.locked { opacity: .5; filter: grayscale(.7); }
.resident-tool-option small,.resident-tool-option strong,.resident-tool-option span,.resident-tool-option em,.resident-issue-option small,.resident-issue-option strong,.resident-issue-option span,.resident-issue-option em { display: block; }
.resident-tool-option small,.resident-issue-option small { color: #76a69f; font-size: 9px; }
.resident-tool-option strong,.resident-issue-option strong { margin: 4px 0; color: #e0d1b8; font: 500 14px Georgia,"STSong",serif; }
.resident-tool-option span,.resident-issue-option span { color: #9fada8; font: 10px/1.5 Georgia,"STSong",serif; }
.resident-tool-option em,.resident-issue-option em { margin-top: 6px; color: #ce9873; font: normal 9px/1.45 Georgia,"STSong",serif; }
.resident-issue-title { margin: 14px 0 0; color: #c8bca5; font: 500 15px Georgia,"STSong",serif; }

#resident-commissions-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.04),rgba(2,4,5,.4) 54%,rgba(2,4,5,.97)),url("assets/resident-morning-commission-desk.png") center / cover no-repeat; backdrop-filter: none; }
.resident-commissions-panel { width: min(980px,58vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.resident-commissions-summary { margin: -8px 0 14px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.resident-commission-active { display: none; margin: 0 0 13px; padding: 14px 16px; border: 1px solid #bd7047; background: rgba(42,27,18,.94); }
.resident-commission-active.active { display: block; }
.resident-commission-active small,.resident-commission-active strong,.resident-commission-active span,.resident-commission-active em { display: block; }
.resident-commission-active small { color: #e09462; font-size: 9px; letter-spacing: .1em; }
.resident-commission-active strong { margin: 5px 0; color: #f0ddbd; font: 500 17px Georgia,"STSong",serif; }
.resident-commission-active span { color: #b8c4bf; font: 11px/1.58 Georgia,"STSong",serif; }
.resident-commission-active em { margin-top: 7px; color: #d5a47e; font: normal 10px/1.5 Georgia,"STSong",serif; }
.resident-commissions-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.resident-commission-pair { padding: 13px; background: rgba(7,13,14,.92); border: 1px solid #394a46; }
.resident-commission-pair.current { border-color: #6faaa1; }
.resident-commission-pair > small,.resident-commission-pair > strong,.resident-commission-pair > span { display: block; }
.resident-commission-pair > small { color: #76a69f; font-size: 9px; letter-spacing: .08em; }
.resident-commission-pair > strong { margin: 5px 0; color: #e0d1b8; font: 500 16px Georgia,"STSong",serif; }
.resident-commission-pair > span { min-height: 48px; color: #9fada8; font: 10px/1.55 Georgia,"STSong",serif; }
.resident-commission-card,.resident-commission-record { width: 100%; min-height: 150px; margin-top: 9px; padding: 12px; text-align: left; background: rgba(4,9,10,.9); border: 1px solid #31433f; }
.resident-commission-card.available { border-color: #759d96; }
.resident-commission-card.selected { border-color: #c77b4d; background: rgba(42,27,18,.94); }
.resident-commission-card.locked,.resident-commission-record.locked { opacity: .5; filter: grayscale(.7); }
.resident-commission-record { min-height: 112px; }
.resident-commission-card small,.resident-commission-card strong,.resident-commission-card span,.resident-commission-card em,.resident-commission-record small,.resident-commission-record strong,.resident-commission-record span,.resident-commission-record em { display: block; }
.resident-commission-card small,.resident-commission-record small { color: #77a79f; font-size: 8px; letter-spacing: .08em; }
.resident-commission-card strong,.resident-commission-record strong { margin: 4px 0; color: #decfb6; font: 500 14px Georgia,"STSong",serif; }
.resident-commission-card span,.resident-commission-record span { color: #9fada8; font: 9px/1.52 Georgia,"STSong",serif; }
.resident-commission-card em,.resident-commission-record em { margin-top: 6px; color: #cb9872; font: normal 9px/1.45 Georgia,"STSong",serif; }

#morning-patrol-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.03),rgba(2,4,5,.38) 54%,rgba(2,4,5,.97)),url("assets/resident-morning-patrol-route-board.png") center / cover no-repeat; backdrop-filter: none; }
.morning-patrol-panel { width: min(940px,56vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.morning-patrol-summary { margin: -8px 0 15px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.morning-patrol-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.morning-patrol-card { min-height: 238px; padding: 15px; color: #aebbb6; text-align: left; background: rgba(6,12,13,.93); border: 1px solid #394a46; }
.morning-patrol-card.available { border-color: #759d96; }
.morning-patrol-card.complete { border-color: #c47a4c; background: rgba(36,25,18,.94); }
.morning-patrol-card.locked { opacity: .5; filter: grayscale(.72); }
.morning-patrol-card small,.morning-patrol-card strong,.morning-patrol-card span,.morning-patrol-card em { display: block; }
.morning-patrol-card small { min-height: 28px; color: #78aaa2; font-size: 9px; letter-spacing: .08em; }
.morning-patrol-card strong { margin: 6px 0; color: #ead8bb; font: 500 17px Georgia,"STSong",serif; }
.morning-patrol-card span { min-height: 92px; font: 10px/1.58 Georgia,"STSong",serif; }
.morning-patrol-card em { margin-top: 9px; color: #cd9872; font: normal 9px/1.5 Georgia,"STSong",serif; }
.morning-patrol-rules { margin: 14px 0 10px; color: #78958f; font: 10px/1.55 Georgia,"STSong",serif; letter-spacing: .04em; }

#autonomy-exhibit-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.02),rgba(2,4,5,.38) 54%,rgba(2,4,5,.97)),url("assets/resident-autonomy-exhibit-wall.png") center / cover no-repeat; backdrop-filter: none; }
.autonomy-exhibit-panel { width: min(1000px,58vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.autonomy-exhibit-summary { margin: -8px 0 14px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.autonomy-next-step { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; align-items: center; margin: 0 0 14px; padding: 14px 16px; background: rgba(38,27,19,.94); border: 1px solid #bf754b; }
.autonomy-next-step small,.autonomy-next-step strong,.autonomy-next-step span { display: block; }
.autonomy-next-step small { color: #d18a5d; font-size: 9px; letter-spacing: .12em; }
.autonomy-next-step strong { margin: 5px 0; color: #f0ddbd; font: 500 18px Georgia,"STSong",serif; }
.autonomy-next-step span { color: #b9c5c0; font: 11px/1.58 Georgia,"STSong",serif; }
.autonomy-next-step button { grid-column: 2; grid-row: 1 / span 2; min-width: 150px; }
.autonomy-exhibit-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.autonomy-exhibit-card { display: flex; flex-direction: column; min-height: 330px; padding: 15px; background: rgba(6,12,13,.93); border: 1px solid #394a46; }
.autonomy-exhibit-card.waiting { opacity: .62; filter: grayscale(.55); }
.autonomy-exhibit-card.ready { border-color: #729c95; }
.autonomy-exhibit-card.active { border-color: #b9784f; background: rgba(32,24,18,.94); }
.autonomy-exhibit-card.complete { border-color: #97ae78; background: rgba(22,31,22,.94); }
.autonomy-exhibit-card > small,.autonomy-exhibit-card > strong,.autonomy-exhibit-card > span,.autonomy-exhibit-card > em { display: block; }
.autonomy-exhibit-card > small { color: #78aaa2; font-size: 9px; letter-spacing: .09em; }
.autonomy-exhibit-card > strong { margin: 6px 0; color: #ead8bb; font: 500 17px Georgia,"STSong",serif; }
.autonomy-exhibit-card > span { min-height: 82px; color: #aebbb6; font: 10px/1.58 Georgia,"STSong",serif; }
.autonomy-exhibit-card > em { margin: 8px 0; color: #cc9872; font: normal 9px/1.5 Georgia,"STSong",serif; }
.autonomy-milestones { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; margin: 9px 0 11px; }
.autonomy-milestone { padding: 6px 7px; color: #71827e; background: rgba(3,8,9,.72); border: 1px solid #2d3b39; font: 8px/1.35 "Microsoft YaHei",sans-serif; }
.autonomy-milestone.done { color: #c9d7c2; border-color: #647c61; background: rgba(20,31,21,.72); }
.autonomy-card-action { width: 100%; min-height: 36px; margin-top: auto; padding: 8px 10px; font-size: 10px; }
.autonomy-exhibit-rules { margin: 14px 0 10px; color: #78958f; font: 10px/1.55 Georgia,"STSong",serif; letter-spacing: .04em; }

#autonomy-postscripts-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.02),rgba(2,4,5,.38) 54%,rgba(2,4,5,.97)),url("assets/resident-autonomy-counter-postscripts.png") center / cover no-repeat; backdrop-filter: none; }
.autonomy-postscripts-panel { width: min(1040px,59vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.autonomy-postscripts-summary { margin: -8px 0 15px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.autonomy-postscripts-list { display: grid; gap: 12px; }
.autonomy-postscript-district { padding: 15px; background: rgba(7,13,14,.93); border: 1px solid #394b47; }
.autonomy-postscript-district.active { border-color: #7c9f98; }
.autonomy-postscript-district.complete { border-color: #93a875; background: rgba(20,29,21,.94); }
.autonomy-postscript-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.autonomy-postscript-heading strong { color: #ead8bb; font: 500 19px Georgia,"STSong",serif; }
.autonomy-postscript-heading small { color: #78aaa2; font-size: 9px; letter-spacing: .1em; }
.autonomy-postscript-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.autonomy-postscript-card { display: flex; flex-direction: column; min-height: 210px; padding: 13px; background: rgba(3,8,9,.78); border: 1px solid #34423f; }
.autonomy-postscript-card.known { border-color: #8b7056; background: rgba(31,24,18,.78); }
.autonomy-postscript-card.locked { opacity: .48; filter: grayscale(.7); }
.autonomy-postscript-card small,.autonomy-postscript-card strong,.autonomy-postscript-card span,.autonomy-postscript-card em { display: block; }
.autonomy-postscript-card small { color: #78aaa2; font-size: 9px; letter-spacing: .08em; }
.autonomy-postscript-card strong { margin: 6px 0; color: #e7d3b4; font: 500 16px Georgia,"STSong",serif; }
.autonomy-postscript-card span { color: #aebbb6; font: 10px/1.58 Georgia,"STSong",serif; }
.autonomy-postscript-card em { margin: 8px 0; color: #c99068; font: normal 9px/1.5 Georgia,"STSong",serif; }
.autonomy-postscript-card button { width: 100%; min-height: 34px; margin-top: auto; padding: 7px 9px; font-size: 9px; }
.autonomy-district-epilogue { margin: 10px 0 0; padding: 11px 13px; color: #cbd7c4; background: rgba(24,35,24,.86); border-left: 3px solid #91a875; font: 11px/1.6 Georgia,"STSong",serif; }
.autonomy-district-epilogue.locked { color: #71817d; background: rgba(4,9,10,.62); border-left-color: #3a4945; }
.autonomy-postscripts-rules { margin: 14px 0 10px; color: #78958f; font: 10px/1.55 Georgia,"STSong",serif; letter-spacing: .04em; }
#resident-handover-screen { justify-content: flex-end; padding-right: 5vw; background: linear-gradient(90deg,rgba(2,4,5,.02),rgba(2,4,5,.38) 54%,rgba(2,4,5,.97)),url("assets/resident-lead-handover-selection.png") center / cover no-repeat; backdrop-filter: none; }
.resident-handover-panel { width: min(960px,57vw); max-height: 92vh; overflow: auto; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.resident-handover-summary { margin: -8px 0 15px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.resident-handover-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.resident-handover-card { min-height: 270px; padding: 15px; color: #aebbb6; text-align: left; background: rgba(6,12,13,.93); border: 1px solid #394a46; }
.resident-handover-card.available { border-color: #759d96; }
.resident-handover-card.complete { border-color: #c47a4c; background: rgba(36,25,18,.94); }
.resident-handover-card.locked { opacity: .5; filter: grayscale(.72); }
.resident-handover-card small,.resident-handover-card strong,.resident-handover-card span,.resident-handover-card em { display: block; }
.resident-handover-card small { min-height: 30px; color: #78aaa2; font-size: 9px; letter-spacing: .08em; }
.resident-handover-card strong { margin: 6px 0; color: #ead8bb; font: 500 17px Georgia,"STSong",serif; }
.resident-handover-card span { min-height: 112px; font: 10px/1.58 Georgia,"STSong",serif; }
.resident-handover-card em { margin-top: 9px; color: #cd9872; font: normal 9px/1.55 Georgia,"STSong",serif; }
.resident-circuit-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 18px; margin-top: 12px; padding: 16px 18px; color: #b8c6c0; background: linear-gradient(110deg,rgba(33,45,41,.96),rgba(15,23,23,.96)); border: 1px solid #6f9489; }
.resident-circuit-card.locked { opacity: .48; filter: grayscale(.72); border-color: #3a4946; }
.resident-circuit-card.complete { background: linear-gradient(110deg,rgba(55,39,25,.96),rgba(17,26,25,.96)); border-color: #c58655; }
.resident-circuit-card small,.resident-circuit-card strong,.resident-circuit-card span,.resident-circuit-card em { display: block; }
.resident-circuit-card small { color: #78aaa2; font-size: 9px; letter-spacing: .08em; }
.resident-circuit-card strong { margin: 5px 0; color: #ead8bb; font: 500 18px Georgia,"STSong",serif; }
.resident-circuit-card span { font: 11px/1.55 Georgia,"STSong",serif; }
.resident-circuit-card em { margin-top: 6px; color: #cf9f79; font: normal 9px/1.5 Georgia,"STSong",serif; }
.resident-circuit-card .primary { min-width: 170px; }
.resident-circuit-protocols { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 13px; }
.resident-circuit-protocol { min-height: 104px; padding: 10px 11px; text-align: left; color: #9eb2ad; background: rgba(7,13,14,.74); border: 1px solid #405651; }
.resident-circuit-protocol:hover:not(:disabled) { color: #d7d0c0; border-color: #829e96; transform: translateY(-1px); }
.resident-circuit-protocol.selected { color: #ead8bb; border-color: #d28a58; background: linear-gradient(145deg,rgba(80,48,29,.8),rgba(15,24,24,.9)); box-shadow: inset 0 0 0 1px rgba(245,166,102,.12); }
.resident-circuit-protocol:disabled { opacity: .55; cursor: default; }
.resident-circuit-protocol small,.resident-circuit-protocol strong,.resident-circuit-protocol span,.resident-circuit-protocol em { display: block; }
.resident-circuit-protocol small { min-height: 24px; color: #6f9d95; font: 8px/1.4 Georgia,"STSong",serif; letter-spacing: .06em; }
.resident-circuit-protocol strong { margin: 3px 0; color: inherit; font: 500 14px Georgia,"STSong",serif; }
.resident-circuit-protocol span { min-height: 34px; font: 9px/1.45 Georgia,"STSong",serif; }
.resident-circuit-protocol em { margin-top: 4px; color: #c68e68; font: normal 8px/1.4 Georgia,"STSong",serif; }
.resident-circuit-drill { margin-top: 10px; padding: 10px 11px; background: rgba(34,22,19,.58); border: 1px solid #684d43; }
.resident-circuit-drill > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.resident-circuit-drill > div:first-child strong { margin: 0; color: #e6c8a9; font-size: 12px; }
.resident-circuit-drill > div:first-child small { text-align: right; color: #c19073; }
.resident-circuit-drill-options { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; margin-top: 8px; }
.resident-circuit-drill-option { min-height: 38px; padding: 7px 5px; color: #9fb2ad; background: rgba(7,13,14,.8); border: 1px solid #42534f; font: 9px/1.35 Georgia,"STSong",serif; }
.resident-circuit-drill-option:hover:not(:disabled) { color: #ead8bb; border-color: #a3735d; transform: translateY(-1px); }
.resident-circuit-drill-option.selected { color: #fff0d3; border-color: #dc8d5e; background: linear-gradient(145deg,rgba(102,48,31,.86),rgba(27,19,18,.92)); box-shadow: inset 0 0 0 1px rgba(255,176,112,.12); }
.resident-circuit-drill-option:disabled { opacity: .5; cursor: default; }
.resident-circuit-drill p { margin: 8px 0 0; color: #cfa98d; font: 9px/1.5 Georgia,"STSong",serif; }
.resident-circuit-drill-focus { margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(196,132,96,.32); }
.resident-circuit-drill-focus > small { color: #7fa89f; }
.resident-circuit-drill-focus-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 7px; }
.resident-circuit-drill-focus-option { min-height: 44px; padding: 7px 8px; text-align: left; color: #9eb7b0; background: rgba(9,18,18,.74); border: 1px solid #3c5952; font: 9px/1.35 Georgia,"STSong",serif; }
.resident-circuit-drill-focus-option strong,.resident-circuit-drill-focus-option span { display: block; }
.resident-circuit-drill-focus-option strong { margin: 0; color: inherit; font-size: 10px; }
.resident-circuit-drill-focus-option span { margin-top: 3px; color: #789b94; font-size: 8px; }
.resident-circuit-drill-focus-option:hover:not(:disabled) { color: #e7d4b9; border-color: #80a99e; transform: translateY(-1px); }
.resident-circuit-drill-focus-option.selected { color: #fff0d3; border-color: #74b3a3; background: linear-gradient(145deg,rgba(32,78,69,.78),rgba(17,28,27,.92)); }
.resident-circuit-splits { margin-top: 10px; padding: 10px 11px; color: #92aaa4; background: rgba(6,11,12,.72); border: 1px solid #354a46; }
.resident-circuit-splits > small,.resident-circuit-splits > em { display: block; }
.resident-circuit-splits > small { color: #6f9f97; font: 8px/1.45 Georgia,"STSong",serif; letter-spacing: .08em; }
.resident-circuit-splits > em { margin-top: 7px; color: #c99670; font: normal 8px/1.45 Georgia,"STSong",serif; }
.resident-circuit-split-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 7px; }
.resident-circuit-split { padding: 7px 8px; background: rgba(21,31,30,.82); border-left: 2px solid #688c83; }
.resident-circuit-split b,.resident-circuit-split span { display: block; }
.resident-circuit-split b { color: #d8cbb4; font: 500 10px Georgia,"STSong",serif; }
.resident-circuit-split span { margin-top: 3px; color: #9bb7b0; font: 9px/1.35 Georgia,"STSong",serif; }
.resident-circuit-review { margin-top: 9px; border-top: 1px solid #304541; }
.resident-circuit-review summary { padding: 9px 2px 3px; color: #d2b28f; cursor: pointer; font: 9px/1.4 Georgia,"STSong",serif; letter-spacing: .06em; }
.resident-circuit-review summary:focus-visible { outline: 2px solid #b8d4cc; outline-offset: 3px; }
.resident-circuit-leg-head,.resident-circuit-leg { display: grid; grid-template-columns: minmax(120px,1.2fr) minmax(74px,.55fr) minmax(130px,1fr); gap: 8px; align-items: center; }
.resident-circuit-leg-head { margin-top: 7px; padding: 0 7px 5px; color: #63867f; font: 7px/1.35 Georgia,"STSong",serif; letter-spacing: .08em; }
.resident-circuit-leg { padding: 6px 7px; border-top: 1px solid rgba(87,117,110,.22); background: rgba(17,27,26,.46); }
.resident-circuit-leg:nth-of-type(6n+2) { border-top-color: #526d67; }
.resident-circuit-leg span,.resident-circuit-leg b,.resident-circuit-leg em { margin: 0; }
.resident-circuit-leg span { color: #a9bdb7; font: 8px/1.35 Georgia,"STSong",serif; }
.resident-circuit-leg b { color: #d8cbb4; font: 500 9px/1.35 Georgia,"STSong",serif; }
.resident-circuit-leg em { color: #86aaa2; font: normal 8px/1.35 Georgia,"STSong",serif; }
.circuit-pace-status.ahead { color: #8fd1b5; }
.circuit-pace-status.behind { color: #e4a073; }
.resident-handover-rules { margin: 14px 0 10px; color: #78958f; font: 10px/1.55 Georgia,"STSong",serif; letter-spacing: .04em; }

#route-lexicon-screen { background: linear-gradient(90deg,rgba(2,4,5,.28),rgba(2,4,5,.93)),url("assets/night-road-ledger.png") center / cover no-repeat; backdrop-filter: none; }
.route-lexicon-panel { width: min(980px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 27vw; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.route-lexicon-summary { margin: -8px 0 18px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.route-echo-preview { margin: -6px 0 14px; padding: 13px 15px; color: #9cafaa; background: rgba(8,14,15,.91); border: 1px solid #3b4d49; }
.route-echo-preview.active { color: #d4c7ae; border-color: #bd7047; background: rgba(31,23,18,.91); }
.route-echo-preview small,.route-echo-preview strong,.route-echo-preview span { display: block; }
.route-echo-preview small { color: #76a69f; font-size: 9px; letter-spacing: .14em; }
.route-echo-preview strong { margin: 5px 0; color: var(--ember-hot); font: 500 17px Georgia,"STSong",serif; }
.route-echo-preview span { font: 11px/1.55 Georgia,"STSong",serif; }
.route-lexicon-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.route-tag-card { min-height: 152px; padding: 16px; color: var(--bone); text-align: left; background: rgba(8,14,15,.9); border: 1px solid #394a46; cursor: pointer; }
.route-tag-card:hover,.route-tag-card.selected { border-color: #db8450; background: rgba(31,23,18,.94); }
.route-tag-card.locked { opacity: .42; filter: grayscale(1); cursor: not-allowed; }
.route-tag-card strong,.route-tag-card span,.route-tag-card em,.route-tag-card small { display: block; }
.route-tag-card small { color: #76a69f; font-size: 9px; letter-spacing: .14em; }
.route-tag-card strong { margin-top: 6px; color: var(--ember-hot); font: 500 18px Georgia,"STSong",serif; }
.route-tag-card span { margin-top: 7px; color: #a9b7b3; font: 12px/1.58 Georgia,"STSong",serif; }
.route-tag-card em { margin-top: 8px; color: #d4c5a8; font-size: 11px; line-height: 1.5; font-style: normal; }

#practice-screen { background: linear-gradient(90deg,rgba(2,4,5,.26),rgba(2,4,5,.93)),url("assets/night-post-office-reconstruction.png") center / cover no-repeat; backdrop-filter: none; }
.practice-panel { width: min(940px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 26vw; background: linear-gradient(145deg,rgba(21,29,29,.96),rgba(6,10,11,.98)); }
.practice-summary { margin: -8px 0 18px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.practice-stamps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-bottom: 12px; }
.practice-stamp { min-height: 78px; padding: 10px 11px; color: #9cafaa; text-align: left; background: rgba(8,14,15,.9); border: 1px solid #394a46; cursor: pointer; }
.practice-stamp.selected { color: var(--ember-hot); border-color: #c77b4d; background: rgba(31,23,18,.94); }
.practice-stamp strong,.practice-stamp small { display: block; }
.practice-stamp strong { font-size: 12px; }
.practice-stamp small { margin-top: 4px; font-size: 9px; line-height: 1.45; }
.practice-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.practice-card { min-height: 250px; padding: 17px; color: var(--bone); text-align: left; background: rgba(8,14,15,.91); border: 1px solid #3c4c49; cursor: pointer; }
.practice-card:hover { border-color: var(--ember); background: rgba(31,23,18,.94); }
.practice-card.locked { opacity: .42; filter: grayscale(1); cursor: not-allowed; }
.practice-card strong,.practice-card span,.practice-card em,.practice-card small { display: block; }
.practice-card small { color: #75a59e; font-size: 9px; letter-spacing: .14em; }
.practice-card strong { margin-top: 7px; color: var(--ember-hot); font: 500 19px Georgia,"STSong",serif; }
.practice-card span { min-height: 94px; margin-top: 8px; color: #a9b7b3; font: 12px/1.62 Georgia,"STSong",serif; }
.practice-card em { margin-top: 9px; color: #d4c5a8; font-size: 11px; line-height: 1.55; font-style: normal; }

.goals-panel { --goals-inset: clamp(20px,4vw,40px); display: flex; flex-direction: column; width: min(920px,calc(100vw - 40px)); max-height: 92vh; max-height: min(92vh,calc(100dvh - 24px)); padding: 0; overflow: hidden; }
.goals-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--goals-inset); scroll-padding-block: 20px; scrollbar-width: thin; scrollbar-color: #5b6e69 #11191a; }
.goals-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: 8px; padding: 12px var(--goals-inset); border-top: 1px solid #475653; background: #101718; }
.goals-actions > span { flex-basis: 100%; color: #aebdb8; font-size: 12px; line-height: 1.5; }
.goals-actions > button { flex: 1 1 160px; min-width: 0; min-height: 44px; margin: 0; }
.goals-summary { margin: -8px 0 18px; color: #a7b8b3; font: 14px/1.7 Georgia,"STSong",serif; }
.goals-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.goal-card { padding: 14px 15px; color: #aebbb6; text-align: left; background: rgba(8,14,15,.91); border: 1px solid #3d4e4a; cursor: pointer; }
.goal-card.selected { color: #eadbc2; border-color: #bd7047; background: rgba(31,23,18,.92); }
.goal-card.complete { border-bottom-color: #6e9f96; }
.goal-card small,.goal-card strong,.goal-card span,.goal-card em { display: block; }
.goal-card small { color: #76a69f; font-size: 9px; letter-spacing: .12em; }
.goal-card strong { margin-top: 5px; font: 500 17px Georgia,"STSong",serif; }
.goal-card span { margin-top: 5px; font-size: 11px; line-height: 1.55; }
.goal-card em { margin-top: 7px; color: #d39c77; font: normal 10px/1.45 Georgia,"STSong",serif; }

#oath-screen { background: linear-gradient(90deg,rgba(2,4,5,.2),rgba(2,4,5,.94)),url("assets/oath-registry-counter.png") center / cover no-repeat; backdrop-filter: none; }
.oath-panel { width: min(1040px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 29vw; background: linear-gradient(145deg,rgba(21,28,28,.96),rgba(6,10,11,.97)); }
.oath-summary,.city-progress { margin: -8px 0 20px; color: #9db0ac; font: 14px/1.7 Georgia,"STSong",serif; }
.oath-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; }
.oath-card { min-height: 360px; padding: 18px; color: var(--bone); text-align: left; background: rgba(8,14,15,.9); border: 1px solid #40514d; cursor: pointer; }
.oath-card:hover,.oath-card.selected { border-color: var(--ember); background: rgba(31,23,18,.95); box-shadow: inset 0 0 46px rgba(255,117,48,.045); }
.oath-card.locked { opacity: .48; filter: grayscale(.9); cursor: not-allowed; }
.oath-card > small,.oath-card > strong,.oath-card > span,.oath-card > em { display: block; }
.oath-card > small { color: #77a9a2; font-size: 9px; letter-spacing: .16em; }
.oath-card > strong { margin-top: 7px; color: var(--ember-hot); font: 500 22px Georgia,"STSong",serif; }
.oath-card > span { min-height: 54px; margin-top: 9px; color: #a9b7b3; font: 12px/1.65 Georgia,"STSong",serif; }
.oath-card > em { margin-top: 10px; color: #d4c6ad; font-size: 11px; line-height: 1.55; font-style: normal; }
.oath-nodes { display: grid; gap: 7px; margin-top: 15px; }
.oath-node { padding: 9px 10px; color: #667572; background: rgba(3,7,8,.65); border-left: 3px solid #293431; }
.oath-node b,.oath-node span { display: block; }
.oath-node b { font-size: 11px; }
.oath-node span { margin-top: 4px; font-size: 10px; line-height: 1.45; }
.oath-node.unlocked { color: #c8d4cf; border-left-color: #b66d3d; background: rgba(34,24,18,.65); }
.oath-node.current { border-left-color: #ffad62; box-shadow: inset 12px 0 24px rgba(255,123,52,.055); }
.oath-panel > .quiet { width: 100%; margin-top: 12px; }

#city-screen { justify-content: flex-end; padding-right: 6vw; background: linear-gradient(90deg,rgba(2,4,5,.1),rgba(2,4,5,.9) 54%,rgba(2,4,5,.98)),url("assets/dawn-ending.png") center / cover no-repeat; backdrop-filter: none; }
.city-panel { width: min(760px,56vw); max-height: 91vh; overflow: auto; background: linear-gradient(145deg,rgba(22,29,29,.95),rgba(7,11,12,.97)); }
.city-list { display: grid; grid-template-columns: 1fr; gap: 11px; }
.city-card { min-height: 142px; padding: 18px; background: rgba(8,14,15,.88); border: 1px solid #394a46; }
.city-card.locked { opacity: .42; filter: grayscale(1); }
.city-card small,.city-card strong,.city-card span,.city-card em { display: block; }
.city-card small { color: #73a49d; font-size: 9px; letter-spacing: .15em; }
.city-card strong { margin-top: 7px; color: var(--ember-hot); font: 500 19px Georgia,"STSong",serif; }
.city-card span { margin-top: 8px; color: #a9b7b3; font: 12px/1.65 Georgia,"STSong",serif; }
.city-card em { margin-top: 9px; color: #d0c4ab; font-size: 10px; font-style: normal; }

#tools-screen { background: linear-gradient(90deg,rgba(2,4,5,.42),rgba(2,4,5,.91)),url("assets/postal-tool-workbench.png") center / cover no-repeat; backdrop-filter: none; }
.tools-panel { width: min(940px,calc(100vw - 40px)); max-height: 90vh; overflow: auto; margin-left: 30vw; background: linear-gradient(145deg,rgba(22,29,29,.96),rgba(7,11,12,.96)); }
.tool-summary { margin: -8px 0 20px; color: #93aaa6; font: 14px/1.7 Georgia,"STSong",serif; }
.tool-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; }
.tool-card { min-height: 190px; padding: 18px; color: var(--bone); text-align: left; background: rgba(8,14,15,.87); border: 1px solid #344542; cursor: pointer; }
.tool-card:hover,.tool-card.selected { border-color: var(--ember); background: rgba(29,25,20,.94); }
.tool-card.locked { opacity: .44; cursor: not-allowed; filter: grayscale(.85); }
.tool-card strong,.tool-card span,.tool-card em,.tool-card small { display: block; }
.tool-card strong { color: var(--ember-hot); font: 500 20px Georgia,"STSong",serif; }
.tool-card span { margin-top: 10px; color: #9cafaa; font-size: 12px; line-height: 1.65; }
.tool-card em { margin-top: 11px; color: #d0c4ab; font-size: 11px; font-style: normal; }
.tool-card small { margin-top: 10px; color: #6faea7; font-size: 10px; letter-spacing: .08em; }

#challenge-screen { background: linear-gradient(90deg,rgba(2,4,5,.4),rgba(2,4,5,.92)),url("assets/challenge-stamp-desk-four.png") center / cover no-repeat; backdrop-filter: none; }
.challenge-panel { width: min(930px,calc(100vw - 40px)); max-height: 90vh; overflow: auto; margin-left: 30vw; background: linear-gradient(145deg,rgba(22,29,29,.96),rgba(7,11,12,.96)); }
.challenge-summary,.gallery-progress { margin: -8px 0 20px; color: #93aaa6; font: 14px/1.7 Georgia,"STSong",serif; }
.challenge-ledger-overview { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin: -6px 0 10px; }
.challenge-ledger-overview div { min-height: 66px; padding: 11px 12px; background: rgba(5,10,11,.76); border: 1px solid #30413e; }
.challenge-ledger-overview span,.challenge-ledger-overview strong { display: block; }
.challenge-ledger-overview span { color: #758d88; font-size: 9px; letter-spacing: .12em; }
.challenge-ledger-overview strong { margin-top: 7px; color: var(--ember-hot); font: 500 16px Georgia,"STSong",serif; }
.challenge-ledger-note { min-height: 2.8em; margin: 0 0 14px; color: #9fc0ba; font: 12px/1.6 Georgia,"STSong",serif; }
.challenge-leaderboard-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 3px 0 8px; }
.challenge-leaderboard-heading h3 { margin: 0; color: #c9b99b; font: 500 15px Georgia,"STSong",serif; letter-spacing: .1em; }
.challenge-leaderboard-heading span { color: #758d88; text-align: right; font: 10px/1.5 Georgia,"STSong",serif; }
.challenge-leaderboard-filters { display: grid; grid-template-columns: repeat(5,1fr); gap: 6px; margin-bottom: 8px; }
.challenge-leaderboard-filters button { padding: 8px 6px; color: #829692; background: rgba(5,10,11,.76); border: 1px solid #30413e; cursor: pointer; }
.challenge-leaderboard-filters button:hover,.challenge-leaderboard-filters button.selected { color: var(--ember-hot); background: rgba(35,24,18,.88); border-color: #a8643c; }
.challenge-leaderboard-table-wrap { margin-bottom: 14px; overflow-x: auto; border: 1px solid #30413e; background: rgba(5,10,11,.72); }
.challenge-leaderboard-table { width: 100%; min-width: 520px; border-collapse: collapse; color: #9cafaa; font-size: 11px; }
.challenge-leaderboard-table th,.challenge-leaderboard-table td { padding: 9px 11px; text-align: left; border-bottom: 1px solid rgba(59,78,74,.62); }
.challenge-leaderboard-table th { color: #778d89; background: rgba(15,23,23,.92); font-size: 9px; letter-spacing: .11em; }
.challenge-leaderboard-table tbody tr:last-child td { border-bottom: 0; }
.challenge-leaderboard-table tbody tr.selected { color: #ead8b8; background: rgba(111,60,31,.2); }
.challenge-leaderboard-table .challenge-rank { width: 54px; color: #d48b57; font-family: Georgia,"STSong",serif; }
.challenge-leaderboard-table .challenge-metric-value { color: var(--ember-hot); font-weight: 700; white-space: nowrap; }
.challenge-leaderboard-table .challenge-sample { white-space: nowrap; }
.challenge-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 11px; }
.challenge-card { min-height: 220px; padding: 18px; color: var(--bone); text-align: left; background: rgba(8,14,15,.88); border: 1px solid #344542; cursor: pointer; }
.challenge-card:hover,.challenge-card.selected { border-color: var(--ember); background: rgba(31,23,19,.94); }
.challenge-card.locked { opacity: .45; cursor: not-allowed; filter: grayscale(.85); }
.challenge-card strong,.challenge-card span,.challenge-card em,.challenge-card small { display: block; }
.challenge-card strong { color: var(--ember-hot); font: 500 20px Georgia,"STSong",serif; }
.challenge-card span { margin-top: 10px; color: #9cafaa; font-size: 12px; line-height: 1.65; }
.challenge-card em { margin-top: 11px; color: #d0c4ab; font-size: 11px; line-height: 1.55; font-style: normal; }
.challenge-card small { margin-top: 12px; color: #7cbeb6; font-size: 10px; letter-spacing: .08em; }
.challenge-focus { margin-top: 16px; padding-top: 14px; border-top: 1px solid #30413e; }
.challenge-focus-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 9px; }
.challenge-focus-heading h3 { margin: 0; color: #c9b99b; font: 500 15px Georgia,"STSong",serif; letter-spacing: .1em; }
.challenge-focus-heading span { color: #758d88; text-align: right; font: 10px/1.5 Georgia,"STSong",serif; }
.challenge-focus-options { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.challenge-focus-options button { min-height: 104px; padding: 11px; color: #829692; text-align: left; background: rgba(5,10,11,.76); border: 1px solid #30413e; cursor: pointer; }
.challenge-focus-options button:hover,.challenge-focus-options button.selected { color: var(--ember-hot); background: rgba(35,24,18,.88); border-color: #a8643c; }
.challenge-focus-options button:disabled { cursor: not-allowed; opacity: .42; }
.challenge-focus-options strong,.challenge-focus-options span { display: block; }
.challenge-focus-options strong { color: inherit; font: 500 14px/1.4 Georgia,"STSong",serif; }
.challenge-focus-options span { margin-top: 7px; color: #8fa39f; font-size: 10px; line-height: 1.55; }
.challenge-focus-note { min-height: 2.8em; margin: 8px 0 0; color: #9fc0ba; font: 11px/1.6 Georgia,"STSong",serif; }
.challenge-trend { margin-top: 16px; padding-top: 14px; border-top: 1px solid #30413e; }
.challenge-trend-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 9px; }
.challenge-trend-heading h3 { margin: 0; color: #c9b99b; font: 500 15px Georgia,"STSong",serif; letter-spacing: .1em; }
.challenge-trend-heading span { color: #758d88; text-align: right; font: 10px/1.5 Georgia,"STSong",serif; }
.challenge-trend-toolbar { display: grid; grid-template-columns: minmax(250px,.72fr) minmax(0,1.28fr); align-items: stretch; gap: 8px; margin-bottom: 9px; }
.challenge-trend-filters { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.challenge-trend-filters button { min-height: 40px; padding: 7px 5px; color: #829692; background: rgba(5,10,11,.76); border: 1px solid #30413e; cursor: pointer; }
.challenge-trend-filters button:hover,.challenge-trend-filters button.selected { color: var(--ember-hot); background: rgba(35,24,18,.88); border-color: #a8643c; }
.challenge-trend-filters button:disabled { cursor: not-allowed; opacity: .42; }
.challenge-trend-window { display: flex; align-items: center; min-height: 40px; margin: 0; padding: 7px 10px; color: #9fc0ba; background: rgba(5,10,11,.55); border-left: 2px solid #436d66; font: 10px/1.5 Georgia,"STSong",serif; }
.challenge-trend-list { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin: 0; padding: 0; list-style: none; }
.challenge-trend-list li { min-height: 84px; padding: 10px 11px; background: rgba(5,10,11,.76); border: 1px solid #30413e; }
.challenge-trend-list li.win { border-color: #436d66; }
.challenge-trend-list li.fail { border-color: #694640; }
.challenge-trend-list li.empty { grid-column: 1 / -1; min-height: 0; color: #758d88; }
.challenge-trend-list small,.challenge-trend-list strong,.challenge-trend-list span { display: block; }
.challenge-trend-list small { color: #758d88; font-size: 9px; letter-spacing: .08em; }
.challenge-trend-list strong { margin-top: 6px; color: var(--ember-hot); font: 500 15px Georgia,"STSong",serif; }
.challenge-trend-list span { margin-top: 5px; color: #9cafaa; font-size: 10px; line-height: 1.5; }
.challenge-trend-note { min-height: 2.8em; margin: 9px 0 0; color: #9fc0ba; font: 11px/1.6 Georgia,"STSong",serif; }
.challenge-panel > .quiet { width: 100%; margin-top: 12px; }

#gallery-screen { background: linear-gradient(90deg,rgba(2,4,5,.35),rgba(2,4,5,.9)),url("assets/dawn-ending.png") center / cover no-repeat; backdrop-filter: none; }
.gallery-panel { width: min(1020px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 25vw; background: linear-gradient(145deg,rgba(22,29,29,.95),rgba(7,11,12,.96)); }
.gallery-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 11px; }
.ending-card { min-height: 150px; padding: 18px; background: rgba(8,14,15,.86); border: 1px solid #344542; }
.ending-card.locked { display: flex; flex-direction: column; justify-content: center; opacity: .42; filter: grayscale(1); }
.ending-card small,.ending-card strong,.ending-card span { display: block; }
.ending-card small { color: #77918c; font-size: 10px; letter-spacing: .14em; }
.ending-card strong { margin-top: 7px; color: var(--ember-hot); font: 500 19px Georgia,"STSong",serif; }
.ending-card span { margin-top: 9px; color: #9cafaa; font: 12px/1.65 Georgia,"STSong",serif; }

#negatives-screen { background: linear-gradient(90deg,rgba(2,4,5,.24),rgba(2,4,5,.94)),url("assets/memory-negative-darkroom.png") center / cover no-repeat; backdrop-filter: none; }
.negatives-panel { width: min(960px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 30vw; background: linear-gradient(145deg,rgba(21,28,28,.96),rgba(6,10,11,.97)); }
.negatives-progress { margin: -8px 0 20px; color: #9db0ac; font: 14px/1.7 Georgia,"STSong",serif; }
.negatives-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 11px; }
.negative-card { min-height: 154px; padding: 18px; background: rgba(8,14,15,.88); border: 1px solid #40514d; box-shadow: inset 0 0 34px rgba(224,190,129,.035); }
.negative-card.locked { opacity: .4; filter: grayscale(1); background: repeating-linear-gradient(135deg,rgba(8,14,15,.94),rgba(8,14,15,.94) 9px,rgba(14,20,20,.94) 9px,rgba(14,20,20,.94) 18px); }
.negative-card small,.negative-card strong,.negative-card span { display: block; }
.negative-card small { color: #7ba9a2; font-size: 9px; letter-spacing: .16em; }
.negative-card strong { margin-top: 8px; color: #edc795; font: 500 19px Georgia,"STSong",serif; }
.negative-card span { margin-top: 9px; color: #a9b7b3; font: 12px/1.65 Georgia,"STSong",serif; }

#memory-screen { background: radial-gradient(circle at 26% 34%,rgba(255,111,48,.15),transparent 34%),linear-gradient(125deg,rgba(4,8,9,.97),rgba(13,20,20,.91)); backdrop-filter: none; }
.memory-panel { width: min(940px,calc(100vw - 40px)); max-height: 90vh; overflow: auto; background: linear-gradient(145deg,rgba(24,30,29,.97),rgba(7,11,12,.97)); }
.memory-summary { margin: -8px 0 20px; color: #9eb2ae; font: 14px/1.7 Georgia,"STSong",serif; }
.memory-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.memory-card { min-height: 150px; padding: 19px; border: 1px solid #364944; background: linear-gradient(145deg,rgba(24,29,27,.94),rgba(8,13,14,.92)); box-shadow: inset 0 0 28px rgba(255,122,54,.035); }
.memory-card.current { border-color: #a8663c; }
.memory-card small,.memory-card strong,.memory-card span { display: block; }
.memory-card small { color: #75aaa4; font-size: 9px; letter-spacing: .16em; }
.memory-card strong { margin-top: 7px; color: #f0c28e; font: 500 19px Georgia,"STSong",serif; }
.memory-card span { margin-top: 9px; color: #a9b7b3; font-size: 12px; line-height: 1.65; }

#station-screen { background: linear-gradient(90deg,rgba(2,4,5,.38),rgba(2,4,5,.9)),url("assets/silent-station.png") center / cover no-repeat; backdrop-filter: none; }
.station-panel { width: min(960px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 29vw; background: linear-gradient(145deg,rgba(22,29,29,.96),rgba(7,11,12,.96)); }
.station-copy { margin: -7px 0 20px; color: #a7b8b4; font: 14px/1.75 Georgia,"STSong",serif; }
.station-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.station-card { min-height: 210px; padding: 17px; color: var(--bone); text-align: left; background: rgba(8,14,15,.87); border: 1px solid #344542; }
button.station-card { cursor: pointer; }
button.station-card:hover,.station-card.selected { border-color: var(--ember); background: rgba(29,25,20,.94); }
.station-card strong,.station-card small,.station-card span,.station-card em { display: block; }
.station-card strong { color: var(--ember-hot); font: 500 20px Georgia,"STSong",serif; }
.station-card small { margin-top: 6px; color: #6faea7; letter-spacing: .12em; }
.station-card span { margin-top: 12px; color: #9cafaa; font-size: 12px; line-height: 1.6; }
.station-card em { margin-top: 10px; color: #d4c7ae; font-size: 11px; font-style: normal; }
.trust-pips { margin-top: 12px; color: #ffb45d; letter-spacing: .2em; }
.station-selection { min-height: 22px; margin: 16px 0 0; color: #d1c5ae; font-size: 12px; }
.side-story-btn { width: 100%; margin-top: 13px; padding: 9px 10px; color: var(--ember-hot); background: rgba(30,22,16,.8); border: 1px solid #76523b; cursor: pointer; }
.side-story-btn.selected { color: #d8f4ed; background: rgba(28,69,65,.76); border-color: #74bcb3; }

#codex-screen { background: linear-gradient(90deg,rgba(2,4,5,.38),rgba(2,4,5,.9)),url("assets/night-road-ledger.png") center / cover no-repeat; backdrop-filter: none; }
.codex-panel { width: min(980px,calc(100vw - 40px)); max-height: 91vh; overflow: auto; margin-left: 29vw; background: linear-gradient(145deg,rgba(22,29,29,.96),rgba(7,11,12,.96)); }
.codex-progress { margin: -7px 0 20px; color: #9badaa; font: 14px/1.7 Georgia,"STSong",serif; }
.codex-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.codex-card { min-height: 150px; padding: 17px; background: rgba(8,14,15,.87); border: 1px solid #344542; }
.codex-card.locked { opacity: .38; filter: grayscale(1); }
.codex-card small,.codex-card strong,.codex-card span,.codex-card em { display: block; }
.codex-card small { color: #6f8984; font-size: 10px; letter-spacing: .16em; }
.codex-card strong { margin-top: 7px; color: var(--ember-hot); font: 500 19px Georgia,"STSong",serif; }
.codex-card span { margin-top: 9px; color: #9cafaa; font-size: 12px; line-height: 1.6; }
.codex-card em { margin-top: 9px; color: #d0c4ab; font-size: 11px; font-style: normal; }

body.high-contrast { --fog:#c9e5df; --cyan:#8fe5dc; --danger:#ff5b4e; }
body.high-contrast .choice,body.high-contrast .gear-card,body.high-contrast .post-office-card,body.high-contrast .visitor-topic,body.high-contrast .visitor-commission,body.high-contrast .visitor-index-card,body.high-contrast .night-shift-card,body.high-contrast .aid-notice-card,body.high-contrast .community-project-card,body.high-contrast .reconstruction-report-card,body.high-contrast .assembly-accord-card,body.high-contrast .assembly-ending-card,body.high-contrast .morning-shift-card,body.high-contrast .morning-handover-card,body.high-contrast .resident-courier-card,body.high-contrast .resident-relay-record,body.high-contrast .resident-pairing-card,body.high-contrast .resident-team-note,body.high-contrast .resident-tool-pair,body.high-contrast .resident-tool-option,body.high-contrast .resident-issue-option,body.high-contrast .resident-commission-active,body.high-contrast .resident-commission-pair,body.high-contrast .resident-commission-card,body.high-contrast .resident-commission-record,body.high-contrast .morning-patrol-card,body.high-contrast .resident-handover-card,body.high-contrast .resident-circuit-card,body.high-contrast .resident-circuit-protocol,body.high-contrast .resident-circuit-splits,body.high-contrast .autonomy-next-step,body.high-contrast .autonomy-exhibit-card,body.high-contrast .autonomy-milestone,body.high-contrast .autonomy-postscript-district,body.high-contrast .autonomy-postscript-card,body.high-contrast .route-tag-card,body.high-contrast .practice-stamp,body.high-contrast .practice-card,body.high-contrast .goal-card,body.high-contrast .tracked-goal,body.high-contrast .oath-card,body.high-contrast .tool-card,body.high-contrast .challenge-card,body.high-contrast .challenge-leaderboard-filters button,body.high-contrast .challenge-leaderboard-table-wrap,body.high-contrast .challenge-focus-options button,body.high-contrast .challenge-trend-filters button,body.high-contrast .challenge-trend-window,body.high-contrast .challenge-trend-list li,body.high-contrast .ending-card,body.high-contrast .city-card,body.high-contrast .negative-card,body.high-contrast .achievement-filters button,body.high-contrast .meter { border-width: 2px; }
body.high-contrast .title-world-state { border-width: 2px; }
body.high-contrast #title-screen.active #start-btn { border-width: 3px; border-color: #fff3d4; outline: 2px solid #170906; outline-offset: 2px; }
body.high-contrast #game { filter: contrast(1.18) brightness(1.06); }
body.high-contrast .result-challenge-plan { border-width: 2px; }
body.large-text .story-body,body.large-text .result-body,body.large-text .tip { font-size: 19px; }
body.large-text .title-world-state,body.large-text .title-world-state strong { font-size: 15px; }
body.large-text .title-world-state-kicker,body.large-text .title-world-state small { font-size: 11px; }
body.large-text .result-challenge-plan span { font-size: 15px; }
body.large-text .hud,body.large-text button,body.large-text .choice span,body.large-text .gear-card span,body.large-text .post-office-card > span,body.large-text .visitor-profile span,body.large-text .visitor-response,body.large-text .visitor-commission span,body.large-text .visitor-index-card span,body.large-text .route-tag-card span,body.large-text .practice-card span,body.large-text .goal-card span,body.large-text .oath-card > span,body.large-text .tool-card span,body.large-text .challenge-card span,body.large-text .challenge-leaderboard-table,body.large-text .challenge-focus-options span,body.large-text .challenge-focus-note,body.large-text .challenge-trend-window,body.large-text .challenge-trend-list span,body.large-text .challenge-trend-note,body.large-text .ending-card span,body.large-text .city-card span,body.large-text .negative-card span,body.large-text .tutorial-card p { font-size: 15px; }
body.reduced-effects *,body.reduced-effects *::before,body.reduced-effects *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }

.map-screen { z-index: 16; align-items: center; justify-content: center; background: rgba(2,5,6,.9); backdrop-filter: blur(8px); }
.map-panel { width: min(860px,calc(100vw - 30px)); max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; padding: 30px; background: #0b1112; border: 1px solid #435451; box-shadow: 0 30px 100px #000; }
.map-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.map-heading h2 { margin-bottom: 12px; font-size: 38px; }
.map-heading span { margin-bottom: 18px; color: #78908b; font-size: 11px; }
#route-map { width: 100%; height: auto; max-height: 50vh; background: #080d0e; border: 1px solid #283634; }
.map-notes { min-width: 0; margin-top: 12px; }
.map-summary { margin: 0 0 8px; color: #e3d1af; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.map-exploration,.map-help { margin: 0 0 8px; color: #a5b7b2; font-size: 12px; line-height: 1.6; }
.map-panel .primary { margin-top: 4px; }

#touch-controls { display: none; }
.touch-enabled .hud.active #touch-controls { display: block; position: absolute; inset: 0; pointer-events: none; }
#touch-stick { position: absolute; left: max(24px,env(safe-area-inset-left)); bottom: max(24px,env(safe-area-inset-bottom)); width: 124px; height: 124px; border: 2px solid rgba(137,173,168,.45); border-radius: 50%; background: rgba(6,10,11,.35); pointer-events: auto; touch-action: none; }
#touch-stick i { position: absolute; left: 50%; top: 50%; width: 46px; height: 46px; margin: -23px; border-radius: 50%; background: rgba(113,174,166,.72); box-shadow: 0 0 18px rgba(104,169,163,.35); }
.touch-actions { position: absolute; right: max(20px,env(safe-area-inset-right)); bottom: max(22px,env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(3,56px); grid-template-rows: 56px 84px; gap: 8px; align-items: end; pointer-events: auto; }
.touch-actions button { --action-progress:360deg; position: relative; isolation: isolate; width: 56px; height: 56px; color: var(--bone); background: rgba(14,21,22,.78); border: 2px solid #61726f; border-radius: 50%; font-weight: 900; touch-action: none; transition: transform .1s ease,opacity .16s ease,filter .16s ease,border-color .16s ease; }
.touch-actions button::before { content:""; position: absolute; z-index: -1; inset: 3px; padding: 3px; pointer-events: none; border-radius: inherit; opacity: 0; background: conic-gradient(from -90deg,#9de0d7 var(--action-progress),rgba(63,78,76,.24) 0); -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.touch-actions button::after { content: attr(data-action-status); position: absolute; right: 1px; bottom: 1px; min-width: 22px; height: 20px; padding: 0 4px; color: #f7ead5; background: #263331; border: 1px solid #829c97; border-radius: 10px; font: 800 9px/18px ui-monospace,monospace; letter-spacing: -.04em; }
.touch-actions button[data-action-status=""]::after { display: none; }
.touch-actions button[data-action-state="cooldown"] { opacity: .74; border-color: #536965; filter: saturate(.7); }
.touch-actions button[data-action-state="cooldown"]::before { opacity: 1; }
.touch-actions button[data-action-state="blocked"] { opacity: .48; border-color: #6a5148; filter: grayscale(.45) saturate(.55); box-shadow: none; }
.touch-actions button[data-action-state="blocked"]::after { color: #ffd2bc; background: #3c211c; border-color: #9d5f4c; }
#touch-tool[data-action-state="fixed"] { color: #9de0d7; border-style: double; border-color: #7ebbb3; box-shadow: inset 0 0 14px rgba(117,190,180,.12); }
#touch-tool[data-action-state="fixed"]::after { color: #c9f2ec; background: #18302f; border-color: #6fa8a1; }
.touch-actions button:active { transform: scale(.9); filter: brightness(1.28) saturate(1.1); }
.touch-actions button.touch-rejected { animation: touch-action-rejected .22s ease-out; }
@keyframes touch-action-rejected { 0%,100% { transform: translateX(0); } 30% { transform: translateX(-4px); } 65% { transform: translateX(4px); } }
#touch-shoot { grid-column: 2 / -1; grid-row: 2; align-self: end; justify-self: end; width: 84px; height: 84px; margin-left: 0; color: #23100a; background: rgba(255,132,63,.9); border-color: #ffc36b; box-shadow: 0 0 26px rgba(255,120,54,.15); }
#touch-tool { color: var(--ember-hot); border-color: #8b6040; }

@media (max-width: 700px) {
  #title-screen { align-items: flex-start; overflow-y: auto; padding: 28px 22px calc(112px + env(safe-area-inset-bottom)); background-position: 60% center; }
  #title-screen.active { display: block; }
  .title-copy { width: 100%; max-height: none; margin-bottom: 0; padding-right: 0; overflow: visible; scrollbar-gutter: auto; }
  .title-mode-grid { grid-template-columns: 1fr; width: 100%; }
  .title-mode-grid .assembly-mode { grid-column: auto; }
  .title-utility-section { width: 100%; }
  .title-utilities { width: 100%; grid-template-columns: 1fr; }
  .title-utility-group > summary { grid-template-columns: minmax(0,1fr) auto; gap: 3px 8px; }
  .title-utility-group[open] > summary { position: sticky; z-index: 5; top: max(0px,env(safe-area-inset-top)); box-shadow: 0 8px 18px rgba(0,0,0,.42); }
  .title-utility-group > summary small { display: block; overflow: visible; text-align: left; -webkit-line-clamp: unset; line-clamp: unset; }
  .title-utility-grid { grid-template-columns: 1fr; max-height: none; padding-right: 0; overflow: visible; background: none; }
  #title-screen .primary { margin-top: 14px; padding: 11px 18px; }
  #title-screen.active #start-btn { position: fixed; z-index: 7; left: 22px; right: 22px; bottom: max(14px,env(safe-area-inset-bottom)); width: auto; min-height: 52px; margin: 0; border-color: #ffb36b; box-shadow: 0 0 0 1px rgba(10,13,14,.82),0 10px 28px rgba(0,0,0,.62),0 8px 30px rgba(255,106,42,.28); }
  #title-screen.active #start-btn::after { content: "随时启程"; margin-left: 10px; color: rgba(23,9,6,.7); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
  body.title-viewport-occluded #title-screen { padding-bottom: 46px; }
  body.title-viewport-occluded #title-screen.active #start-btn { position: static; width: min(470px,100%); min-height: 44px; margin-top: 14px; box-shadow: 0 8px 30px rgba(255,106,42,.2); }
  body.title-viewport-occluded #title-screen.active #start-btn::after { content: none; }
  body.title-launch-compact:not(.title-viewport-occluded) #title-screen.active #start-btn { left: auto; right: 22px; width: min(148px,calc(100% - 44px)); min-height: 44px; padding: 8px 16px; opacity: .92; border-radius: 24px; }
  body.title-launch-compact:not(.title-viewport-occluded) #title-screen.active #start-btn::after { content: "启程"; margin-left: 7px; font-size: 8px; }
  body.large-text.title-launch-compact:not(.title-viewport-occluded) #title-screen.active #start-btn { width: min(188px,calc(100% - 44px)); }
  #title-screen .mode-button { grid-template-columns: minmax(112px,.65fr) minmax(0,1.35fr); margin-top: 0; padding: 9px 14px; }
  #title-screen .quiet { margin-top: 6px; padding: 9px 18px; }
  #title-screen .title-utilities .quiet { margin: 0; }
  .title-utility-grid .quiet { grid-template-columns: 28px minmax(0,1fr); min-height: 44px; }
  .title-footer { position: relative; left: auto; right: auto; bottom: auto; display: grid; gap: 5px; margin-top: 22px; padding-bottom: 6px; }
  .hook { width: 100%; }
  .title-world-state strong { overflow: visible; display: -webkit-box; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .title-world-state small { font-size: 8px; }
  .hud { padding: 12px 14px; }
  .hud-left { width: calc(100% - 188px); min-width: 150px; }
  .route-line { margin-bottom: 6px; }
  .route-line span { font-size: 15px; }
  .meter { height: 22px; margin-bottom: 5px; }
  .meter span,.meter strong { line-height: 20px; }
  .hud-right { top: 12px; right: 14px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 4px; width: 168px; align-items: center; }
  .hud-right span { grid-column: span 2; text-align: center; font-size: 10px; }
  #sound-btn,#memory-btn,#map-btn,#tool-btn { width: 100%; min-width: 0; min-height: 34px; padding: 5px 2px; }
  .hud-center { top: 112px; left: 14px; right: 14px; padding: 7px 10px 8px; transform: none; background: linear-gradient(90deg,transparent,rgba(5,10,11,.8) 12%,rgba(5,10,11,.8) 88%,transparent); border-top: 1px solid rgba(92,119,114,.35); }
  .hud-center p { font-size: 15px; }
  .hud-center small { margin-top: 3px; font-size: 8px; line-height: 1.35; letter-spacing: .08em; }
  .hud:has(.message.show) .hud-center { opacity: 0; pointer-events: none; }
  .message { top: 112px; left: 14px; right: 14px; bottom: auto; width: auto; min-width: 0; max-width: none; max-height: 122px; padding: 10px 12px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; transform: none; font-size: 12px; line-height: 1.4; pointer-events: none; }
  .message.show { pointer-events: auto; }
  .hud:has(.tutorial-card:not(.hidden)) .message { bottom: auto; }
  .controls-grid, .choices, .archive-list, .difficulty-grid, .keybinding-grid { grid-template-columns: 1fr; }
  .story-screen { align-items: center; justify-content: center; padding: 20px; }
  .story-screen .story-card { width: 100%; max-height: calc(100dvh - 40px); padding-bottom: 102px; }
  .story-screen.active #story-continue,
  .compact-screen.active .panel > button[id$="-close"] { position: fixed; z-index: 32; left: 50%; bottom: max(16px,env(safe-area-inset-bottom)); width: min(340px,calc(100vw - 56px)); min-height: 48px; margin: 0; transform: translateX(-50%); box-shadow: 0 -14px 38px rgba(0,0,0,.92),0 8px 30px rgba(255,106,42,.25); }
  .story-screen.active #story-continue:hover,
  .story-screen.active #story-continue:focus-visible,
  .compact-screen.active .panel > button[id$="-close"]:hover,
  .compact-screen.active .panel > button[id$="-close"]:focus-visible { transform: translateX(-50%) translateY(-2px); }
  .compact-screen.active .panel:has(> button[id$="-close"]) { padding-bottom: 102px; }
  #result-screen.active .result-panel { padding-bottom: 116px; scroll-padding-bottom: 116px; }
  #result-screen.active .result-actions { position: fixed; z-index: 32; left: 20px; right: 20px; bottom: max(16px,env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 0; padding: 10px; background: linear-gradient(180deg,rgba(12,18,19,.94),rgba(5,8,9,.99)); border: 1px solid #475653; box-shadow: 0 -16px 40px rgba(0,0,0,.92),0 8px 30px rgba(255,106,42,.16); }
  #result-screen.active .result-actions .primary,
  #result-screen.active .result-actions .quiet { width: 100%; min-width: 0; min-height: 52px; margin: 0; padding: 10px 8px; line-height: 1.35; }
  .result-stats, .career-stats, .achievement-list, .combat-stats { grid-template-columns: repeat(2,1fr); }
  .result-challenge-plan { grid-template-columns: 1fr; }
  .result-challenge-plan .quiet { width: 100%; }
  .result-circuit-plan-options { grid-template-columns: 1fr; }
  .result-circuit-plan .result-circuit-plan-context { grid-template-columns: 1fr; }
  .result-circuit-diagnostics-list { grid-template-columns: 1fr; }
  .achievement-filters { grid-template-columns: repeat(3,1fr); }
  .map-heading { align-items: flex-start; flex-direction: column; }
  .map-heading span { margin-top: -16px; }
  .story-screen.portrait-art { justify-content: center; padding-left: 0; background-position: 62% center; }
  .story-screen.portrait-art .story-card { width: min(760px,calc(100vw - 40px)); }
  .story-screen.resident-handover-art { justify-content: center; padding-right: 0; background-position: 24% center; }
  .story-screen.resident-handover-art .story-card { width: min(760px,calc(100vw - 40px)); }
  .story-screen.resident-circuit-art { justify-content: center; padding-right: 0; background-position: 25% center; }
  .story-screen.resident-circuit-art .story-card { width: min(760px,calc(100vw - 40px)); }
  .gear-panel,.oath-panel { margin-left: 0; }
  .gear-list,.oath-list { grid-template-columns: 1fr; }
  #post-office-screen { justify-content: center; padding: 20px; background-position: 36% center; }
  .post-office-panel { width: min(780px,calc(100vw - 40px)); }
  .post-office-list { grid-template-columns: 1fr; }
  #visitors-screen { justify-content: center; padding: 20px; background-position: 31% center; }
  .visitors-panel { width: min(760px,calc(100vw - 40px)); }
  .visitor-topics { grid-template-columns: 1fr; }
  #visitor-index-screen { justify-content: center; padding: 20px; background-position: 31% center; }
  .visitor-index-panel { width: min(820px,calc(100vw - 40px)); }
  .visitor-index-list { grid-template-columns: 1fr; }
  #mutual-aid-screen { justify-content: center; padding: 20px; background-position: 29% center; }
  .mutual-aid-panel { width: min(900px,calc(100vw - 40px)); }
  .night-shift-list { grid-template-columns: 1fr; }
  .aid-notice-list { grid-template-columns: 1fr; }
  #reconstruction-report-screen { justify-content: center; padding: 20px; background-position: 28% center; }
  .reconstruction-report-panel { width: min(900px,calc(100vw - 40px)); }
  .community-project-list,.reconstruction-report-list { grid-template-columns: 1fr; }
  #assembly-screen { justify-content: center; padding: 20px; background-position: 27% center; }
  .assembly-panel { width: min(900px,calc(100vw - 40px)); }
  .assembly-accord-list,.assembly-ending-list { grid-template-columns: 1fr; }
  #morning-shift-screen { justify-content: center; padding: 20px; background-position: 27% center; }
  .morning-shift-panel { width: min(900px,calc(100vw - 40px)); }
  .morning-shift-list,.morning-handover-list { grid-template-columns: 1fr; }
  #resident-relay-screen { justify-content: center; padding: 20px; background-position: 27% center; }
  .resident-relay-panel { width: min(900px,calc(100vw - 40px)); }
  .resident-courier-list,.resident-relay-record-list { grid-template-columns: 1fr; }
  #resident-pairing-screen { justify-content: center; padding: 20px; background-position: 27% center; }
  .resident-pairing-panel { width: min(900px,calc(100vw - 40px)); }
  .resident-pairing-list,.resident-team-note-list { grid-template-columns: 1fr; }
  #resident-tools-screen { justify-content: center; padding: 20px; background-position: 25% center; }
  .resident-tools-panel { width: min(940px,calc(100vw - 40px)); }
  .resident-tool-options,.resident-issue-options { grid-template-columns: 1fr; }
  #resident-commissions-screen { justify-content: center; padding: 20px; background-position: 25% center; }
  .resident-commissions-panel { width: min(980px,calc(100vw - 40px)); }
  .resident-commissions-list { grid-template-columns: 1fr; }
  #morning-patrol-screen { justify-content: center; padding: 20px; background-position: 24% center; }
  .morning-patrol-panel { width: min(940px,calc(100vw - 40px)); }
  .morning-patrol-list { grid-template-columns: 1fr; }
  #autonomy-exhibit-screen { justify-content: center; padding: 20px; background-position: 23% center; }
  .autonomy-exhibit-panel { width: min(1000px,calc(100vw - 40px)); }
  .autonomy-next-step { grid-template-columns: 1fr; }
  .autonomy-next-step button { grid-column: 1; grid-row: auto; width: 100%; }
  .autonomy-exhibit-list { grid-template-columns: 1fr; }
  #autonomy-postscripts-screen { justify-content: center; padding: 20px; background-position: 22% center; }
  .autonomy-postscripts-panel { width: min(1040px,calc(100vw - 40px)); }
  #resident-handover-screen { justify-content: center; padding: 20px; background-position: 23% center; }
  .resident-handover-panel { width: min(960px,calc(100vw - 40px)); }
  .resident-handover-list { grid-template-columns: 1fr; }
  .resident-circuit-card { grid-template-columns: 1fr; }
  .resident-circuit-card .primary { width: 100%; }
  .resident-circuit-leg-head,.resident-circuit-leg { grid-template-columns: minmax(105px,1fr) 68px minmax(108px,.9fr); gap: 5px; }
  .resident-circuit-protocols { grid-template-columns: 1fr; }
  .resident-circuit-protocol { min-height: 0; }
  .resident-circuit-protocol span,.resident-circuit-protocol small { min-height: 0; }
  .resident-circuit-drill-options { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .autonomy-postscript-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .autonomy-postscript-grid { grid-template-columns: 1fr; }
  .route-lexicon-panel { margin-left: 0; }
  .route-lexicon-list { grid-template-columns: 1fr; }
  .practice-panel { margin-left: 0; }
  .practice-stamps { grid-template-columns: repeat(2,1fr); }
  .practice-list { grid-template-columns: 1fr; }
  .goals-list { grid-template-columns: 1fr; }
  .tools-panel { margin-left: 0; }
  .tool-list { grid-template-columns: 1fr; }
  .challenge-panel,.gallery-panel,.negatives-panel { margin-left: 0; }
  .challenge-ledger-overview { grid-template-columns: repeat(2,1fr); }
  .challenge-leaderboard-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .challenge-leaderboard-heading span { text-align: left; }
  .challenge-leaderboard-filters { grid-template-columns: repeat(3,1fr); }
  .challenge-focus-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .challenge-focus-heading span { text-align: left; }
  .challenge-focus-options { grid-template-columns: repeat(2,1fr); }
  .challenge-trend-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .challenge-trend-heading span { text-align: left; }
  .challenge-trend-toolbar { grid-template-columns: 1fr; }
  .challenge-trend-list { grid-template-columns: repeat(2,1fr); }
  .challenge-list,.gallery-list,.negatives-list,.memory-list { grid-template-columns: 1fr; }
  #city-screen { justify-content: center; padding: 20px; background-position: 38% center; }
  .city-panel { width: min(760px,calc(100vw - 40px)); }
  .station-panel { margin-left: 0; }
  .station-list { grid-template-columns: 1fr; }
  .codex-panel { margin-left: 0; }
  .codex-list { grid-template-columns: 1fr; }
  .audio-settings label { grid-template-columns: 1fr 48px; }
  .audio-settings label span { grid-column: 1 / -1; }
  .save-actions { grid-template-columns: 1fr; }
  .tutorial-card { top: 242px; bottom: auto; width: calc(100vw - 34px); max-height: calc(100dvh - 260px); overflow-y: auto; }
  #result-screen.win { justify-content: center; padding: 20px; background-position: 38% center; }
  #result-screen.win .result-panel { width: min(760px,calc(100vw - 40px)); }
  .title-footer { left: 22px; right: 22px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; font-size: 9px; letter-spacing: .05em; }
  .title-footer span { white-space: nowrap; }
  .title-footer span:nth-child(2) { text-align: center; }
  .title-footer span:last-child { text-align: right; }
}

@media (max-width: 360px) {
  .hud-left { width: calc(100% - 128px); min-width: 0; }
  .hud-right { grid-template-columns: repeat(2,minmax(0,1fr)); width: 120px; }
  .hud-right span { grid-column: span 1; font-size: 9px; }
  .touch-actions { right: max(12px,env(safe-area-inset-right)); grid-template-columns: repeat(3,48px); grid-template-rows: 48px 80px; gap: 8px 6px; }
  .touch-actions button { width: 48px; height: 48px; }
  #touch-shoot { width: 80px; height: 80px; }
}

@media (max-width: 360px) and (max-height: 640px) {
  .tutorial-card { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto auto; gap: 3px 8px; max-height: calc(100dvh - 420px); padding: 10px 12px; }
  .tutorial-card small { grid-column: 1; grid-row: 1; align-self: end; font-size: 9px; letter-spacing: .1em; }
  .tutorial-card strong { grid-column: 1; grid-row: 2; align-self: start; margin-top: 0; font-size: 17px; line-height: 1.15; }
  .tutorial-card p { grid-column: 1 / -1; grid-row: 3; margin: 3px 0 0; font-size: 11px; line-height: 1.4; }
  .tutorial-card button { grid-column: 2; grid-row: 1 / span 2; align-self: center; min-height: 42px; }
  body.large-text .tutorial-card p { font-size: 13px; line-height: 1.35; }
}

@media (max-width: 700px) and (max-height: 520px) {
  #title-screen { padding: 14px 16px 42px; overflow: hidden; }
  .title-copy { width: 100%; max-height: calc(100dvh - 42px); padding: 0 6px 8px 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
  #title-screen .eyebrow { margin-bottom: 6px; font-size: 11px; }
  #title-screen h1 { font-size: clamp(44px,12vw,58px); line-height: .88; }
  #title-screen .latin { margin: 8px 0 10px; font-size: 11px; letter-spacing: .42em; }
  #title-screen .hook { margin: 0 0 10px; font-size: 13px; line-height: 1.45; }
  #title-screen .title-world-state { margin: 0 0 6px; }
  #title-screen .title-world-state > summary { min-height: 48px; padding-top: 6px; padding-bottom: 6px; }
  #title-screen .tracked-goal { margin: 0 0 6px; padding: 7px 10px; }
  #title-screen .tracked-goal strong { margin-top: 2px; font-size: 12px; }
  #title-screen .tracked-goal > span { margin-top: 4px; }
  #title-screen.active #start-btn { position: static; width: min(470px,100%); min-height: 44px; margin: 0; box-shadow: 0 8px 30px rgba(255,106,42,.2); }
  #title-screen.active #start-btn::after { content: none; }
  #title-screen .title-footer { position: absolute; left: 16px; right: 16px; bottom: 10px; margin: 0; padding: 0; }
}

@media (min-width: 521px) and (max-width: 700px) and (max-height: 520px) {
  .title-copy { display: grid; grid-template-columns: minmax(240px,.92fr) minmax(0,1.08fr); grid-template-areas: "intro modes" "launch utilities"; align-content: start; gap: 8px 14px; }
  .title-intro { grid-area: intro; }
  .title-launch { grid-area: launch; }
  .title-mode-section { grid-area: modes; width: 100%; margin: 0; }
  .title-mode-heading { margin-bottom: 4px; }
  .title-mode-grid { grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; gap: 6px; }
  .title-mode-grid .assembly-mode { grid-column: 1 / -1; }
  #title-screen .title-mode-grid .mode-button { grid-template-columns: minmax(0,1fr) auto; gap: 2px 7px; min-height: 46px; padding: 5px 8px; font-size: 11px; line-height: 1.3; }
  #title-screen .title-mode-grid .mode-button small { grid-column: 1 / -1; white-space: normal; }
  .title-utility-section { grid-area: utilities; width: 100%; margin: 0; }
  .title-utility-heading { margin-bottom: 4px; }
  .title-utilities { grid-template-columns: repeat(3,minmax(0,1fr)); width: 100%; gap: 6px; }
  .title-utility-group[open] { grid-column: 1 / -1; }
  .title-utility-group > summary { min-height: 52px; padding: 6px 22px 6px 8px; }
  .title-utility-group > summary::after { right: 8px; }
  .title-utility-group > summary span { font-size: 11px; letter-spacing: .04em; }
  .title-utility-group > summary small { font-size: 9px; white-space: normal; }
  body.large-text #title-screen .title-mode-grid .mode-button { font-size: 12px; }
  body.large-text .title-utility-group > summary span { font-size: 12px; }
  body.large-text .title-utility-group > summary small { font-size: 10px; }
  .title-utility-grid { grid-template-columns: repeat(2,minmax(0,1fr)); max-height: 116px; padding-right: 4px; overflow-y: auto; }
}

@media (max-width: 700px) and (max-height: 520px) {
  #pause-screen { align-items: stretch; padding: 12px; }
  .pause-panel { width: 100%; max-height: calc(100dvh - 24px); padding: 18px 18px 86px; overflow-y: auto; overscroll-behavior: contain; }
  #pause-screen .pause-actions { padding-top: 60px; }
  #pause-screen.active #resume-btn { position: fixed; z-index: 32; left: 50%; bottom: max(18px,env(safe-area-inset-bottom)); width: min(340px,calc(100vw - 56px)); min-width: 0; min-height: 48px; margin: 0; transform: translateX(-50%); box-shadow: 0 -12px 34px rgba(0,0,0,.88),0 8px 26px rgba(255,106,42,.22); }
  #pause-screen.active #resume-btn:hover,
  #pause-screen.active #resume-btn:focus-visible { transform: translateX(-50%) translateY(-2px); }
  .map-screen { align-items: stretch; padding: 12px; }
  .map-panel { width: 100%; max-height: calc(100dvh - 24px); padding: 18px 18px 86px; overflow-y: auto; overscroll-behavior: contain; }
  #route-map { width: 100%; height: auto; max-height: none; aspect-ratio: 760 / 420; }
  .map-screen.active #map-close { position: fixed; z-index: 32; left: 50%; bottom: max(18px,env(safe-area-inset-bottom)); width: min(340px,calc(100vw - 56px)); min-width: 0; min-height: 48px; margin: 0; transform: translateX(-50%); box-shadow: 0 -12px 34px rgba(0,0,0,.88),0 8px 26px rgba(255,106,42,.22); }
  .map-screen.active #map-close:hover,
  .map-screen.active #map-close:focus-visible { transform: translateX(-50%) translateY(-2px); }
}

@media (min-width: 521px) and (max-width: 700px) and (max-height: 520px) {
  .pause-panel { display: grid; grid-template-columns: minmax(0,1fr) minmax(210px,.78fr); grid-template-areas: "heading actions" "overview actions"; align-content: start; gap: 4px 20px; padding: 18px 20px; text-align: left; }
  .pause-heading { grid-area: heading; }
  .pause-heading .eyebrow { margin-bottom: 8px; }
  .pause-heading h2 { margin-bottom: 10px; font-size: 32px; }
  .pause-overview { grid-area: overview; }
  .pause-summary { min-height: 0; margin-bottom: 10px; font-size: 12px; line-height: 1.45; }
  .pause-stats { margin-bottom: 0; }
  .pause-actions { grid-area: actions; padding-top: 0; }
  .pause-actions .primary,.pause-actions .quiet { width: 100%; min-width: 0; margin: 0 0 8px; }
  #pause-screen.active #resume-btn { position: static; width: 100%; transform: none; }
  #pause-screen.active #resume-btn:hover,
  #pause-screen.active #resume-btn:focus-visible { transform: translateY(-2px); }
  .pause-action-status { margin-top: 4px; }
  .pause-navigation-note { text-align: center; }
  .map-panel { display: grid; grid-template-columns: minmax(200px,.75fr) minmax(0,1.45fr); grid-template-areas: "heading route" "help route"; align-content: start; gap: 10px 14px; padding: 16px 16px 82px; }
  .map-heading { grid-area: heading; align-items: flex-start; flex-direction: column; gap: 0; }
  .map-heading h2 { margin-bottom: 8px; font-size: 30px; }
  .map-heading span { margin: 0; font-size: 9px; line-height: 1.45; }
  #route-map { grid-area: route; align-self: center; }
  .map-notes { grid-area: help; margin: 0; }
  .map-summary { font-size: 12px; line-height: 1.45; }
  .map-exploration,.map-help { font-size: 11px; line-height: 1.45; }
  .map-screen.active #map-close { left: 28px; width: min(200px,calc(40vw - 24px)); transform: none; }
  .map-screen.active #map-close:hover,
  .map-screen.active #map-close:focus-visible { transform: translateY(-2px); }
  .tutorial-card { top: 205px; left: 14px; width: calc(52vw - 21px); max-height: calc(100dvh - 217px); padding: 12px 14px; transform: none; }
  .tutorial-card strong { margin-top: 4px; font-size: 17px; }
  .tutorial-card p { margin: 5px 0 7px; font-size: 11px; line-height: 1.45; }
  .hud:has(.tutorial-card:not(.hidden)) .message { left: auto; right: 14px; bottom: 12px; width: calc(48vw - 21px); min-width: 0; max-width: none; padding: 10px 12px; transform: none; font-size: 12px; line-height: 1.4; }
}

@media (max-width: 520px) and (max-height: 520px) {
  .hud:has(.tutorial-card:not(.hidden)) .message { opacity: 0; }
}

@media (max-width: 700px) and (max-height: 520px) {
  .message { top: max(108px,calc(env(safe-area-inset-top) + 96px)); left: max(14px,env(safe-area-inset-left)); right: max(14px,env(safe-area-inset-right)); max-height: 96px; }
  .hud:has(.tutorial-card:not(.hidden)) .hud-center { opacity: 0; pointer-events: none; }
  .hud:has(.tutorial-card:not(.hidden)) .message { opacity: 0; pointer-events: none; }
  .tutorial-card { top: max(108px,calc(env(safe-area-inset-top) + 96px)); left: max(14px,env(safe-area-inset-left)); right: max(14px,env(safe-area-inset-right)); bottom: auto; display: grid; grid-template-columns: minmax(104px,.72fr) minmax(0,1.6fr) auto; grid-template-rows: auto auto; gap: 3px 12px; width: auto; max-height: 88px; padding: 10px 12px; overflow-y: auto; transform: none; }
  .tutorial-card small { grid-column: 1; grid-row: 1; align-self: end; font-size: 9px; letter-spacing: .1em; }
  .tutorial-card strong { grid-column: 1; grid-row: 2; align-self: start; margin-top: 0; font-size: 17px; line-height: 1.15; }
  .tutorial-card p { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 0; font-size: 11px; line-height: 1.4; }
  .tutorial-card button { grid-column: 3; grid-row: 1 / span 2; align-self: center; min-height: 42px; }
}

@media (max-width: 520px) and (max-height: 520px) {
  .tutorial-card { grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto auto; gap: 3px 8px; max-height: calc(100dvh - 286px); }
  .tutorial-card small { grid-column: 1; grid-row: 1; }
  .tutorial-card strong { grid-column: 1; grid-row: 2; }
  .tutorial-card p { grid-column: 1 / -1; grid-row: 3; }
  .tutorial-card button { grid-column: 2; grid-row: 1 / span 2; }
}

@media (min-width: 701px) and (max-height: 800px) {
  #title-screen { align-items: center; overflow: hidden; padding: 24px 24px 62px; }
  .title-copy { width: min(720px,62vw); max-height: calc(100dvh - 86px); margin-bottom: 0; }
  h1 { font-size: clamp(58px,7vw,82px); }
  .latin { margin: 10px 0 12px; }
  .hook { margin: 0; font-size: 15px; line-height: 1.45; }
  .title-world-state { width: min(620px,100%); margin: 2px 0 8px; font-size: 10px; line-height: 1.45; }
  #title-screen .primary { margin-top: 10px; padding: 9px 18px; }
  .title-mode-section { width: min(660px,100%); margin-top: 6px; }
  .title-mode-heading { margin-bottom: 4px; }
  .title-mode-grid { grid-template-columns: repeat(3,minmax(0,1fr)); width: 100%; gap: 5px; }
  .title-mode-grid .assembly-mode { grid-column: auto; }
  #title-screen .mode-button { min-height: 36px; margin-top: 0; padding: 7px 10px; font-size: 11px; }
  .title-utility-section { width: min(660px,100%); margin-top: 7px; }
  .title-utility-heading { margin-bottom: 4px; }
  .title-utilities { width: 100%; gap: 5px; }
  .title-utility-group > summary { min-height: 38px; padding-top: 7px; padding-bottom: 7px; }
  .title-utility-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
  #title-screen .title-utility-grid .quiet { padding: 6px 9px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

@media (forced-colors: active) {
  button,
  select,
  input,
  textarea { forced-color-adjust: auto; border-color: ButtonText; }
  button[aria-pressed="true"] { color: HighlightText; background: Highlight; border-color: Highlight; }
  button:disabled,
  select:disabled,
  input:disabled,
  textarea:disabled { color: GrayText; background: Canvas; border-color: GrayText; }
  button:focus-visible,
  select:focus-visible,
  input:focus-visible,
  textarea:focus-visible,
  a:focus-visible,
  summary:focus-visible,
  [tabindex]:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; }
  .title-world-state { forced-color-adjust: auto; color: CanvasText; background: Canvas; border-color: ButtonText; }
  .title-world-state > summary::after { color: LinkText; }
  #title-screen.active #start-btn { forced-color-adjust: auto; color: HighlightText; background: Highlight; border: 2px solid ButtonText; box-shadow: none; }
  #title-screen.active #start-btn::after { color: HighlightText; }
  .meter,
  .boss-bar,
  .post-office-meter,
  .tracked-goal > span { forced-color-adjust: auto; background: Canvas; border-color: ButtonText; }
  .meter i,
  .boss-bar i,
  .post-office-meter i,
  .tracked-goal i { background: Highlight; }
  .facility-pips i { forced-color-adjust: auto; background: Canvas; outline: 1px solid ButtonText; }
  .facility-pips i.on { background: Highlight; outline-color: Highlight; }
  .result-circuit-diagnostics-filters button,
  .result-circuit-diagnostics-districts a,
  .result-circuit-diagnostic { forced-color-adjust: auto; border-color: ButtonText; }
  .result-circuit-diagnostics-filters button.selected { color: HighlightText; background: Highlight; border-color: Highlight; outline: 2px solid Highlight; outline-offset: 1px; }
  .result-circuit-diagnostics-districts a[aria-disabled="true"] { color: GrayText; border-color: GrayText; }
  .result-circuit-diagnostic li:target,
  .result-circuit-diagnostic li:focus { color: CanvasText; outline: 2px solid Highlight; }
  .touch-actions button::before { background: conic-gradient(from -90deg,Highlight var(--action-progress),Canvas 0); }
  .touch-actions button::after { color: CanvasText; background: Canvas; border-color: ButtonText; }
  #touch-tool[data-action-state="fixed"] { color: CanvasText; border-color: Highlight; }
}