/* Map-first listening deck. One map viewport; one audio scrubber.
   Timeline's discrete history selector lives ABOVE the map, never in the audio dock. */

/* Layout tokens (0.8.7). The one place layout numbers are defined: components use these
   custom properties and no other spacing, type size, control height or corner radius.
   Sheets and buttons are built on them; other components move over one at a time. */
:root {
 /* spacing */
 --space-4:4px; --space-8:8px; --space-12:12px; --space-16:16px; --space-20:20px; --space-24:24px; --space-32:32px;
 --field-label-gap:6px;      /* a field label sits this far above its field */
 /* type: 12 is for timestamps and counters only */
 --type-12:12px; --type-13:13px; --type-15:15px; --type-17:17px; --type-22:22px; --type-24:24px;
 --type-16:16px;             /* primary-button label and form fields; iOS zooms into inputs below 16px */
 /* control heights */
 --control-min:44px;         /* minimum touch target */
 --control-field:48px;       /* primary buttons and form fields */
 --control-chip:36px;        /* visible height of chips and segmented controls, inside a 44px target */
 --control-play:56px;        /* play button */
 /* radii */
 --radius-8:8px; --radius-12:12px; --radius-16:16px; --radius-round:999px;
 /* sheet and button colours */
 --sheet-bg:#0d1c26; --sheet-line:#243945; --sheet-copy:#b3c4cc; --sheet-label:#c3d2d8; --sheet-note:#93a8b3;
 --field-bg:#071622; --field-line:#3a5663; --button-line:#4f6a77; --brass:#e1bc86; --brass-ink:#142028;
 --sheet-title-font:'Baskerville','Palatino Linotype',Georgia,serif;
}
body.map-first {--deck-blue:#95bdcd;--deck-bg:#08171e;--font: 'Avenir Next','Segoe UI',Arial,sans-serif}
body.map-first #app {height:100dvh;overflow:hidden}
body.map-first .topbar {height:calc(46px + var(--safe-top,0px))!important;min-height:0!important;padding:var(--safe-top,0px) 14px 0!important;gap:8px;background:#08151c}
body.map-first .topbar .wordmark,body.map-first .topbar .view-switch {display:none!important}
#deck-book {display:flex;align-items:center;gap:7px;min-height:44px;min-width:0;max-width:calc(100% - 100px);font:500 14px/1.3 var(--font);color:var(--text);text-align:left;margin-right:auto}
#deck-book span {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#deck-book svg {width:14px;min-width:14px;height:14px}
body.map-first .header-tools {gap:0}
body.map-first .header-tools #protection {min-width:44px;width:44px;padding:10px}
body.map-first .header-tools #protection span,body.map-first .header-tools [data-action=search] {display:none!important}
body.map-first .topbar .icon-btn {min-width:44px;min-height:44px}
body.map-first .mobile-nav {height:44px!important;min-height:44px!important;top:calc(46px + var(--safe-top,0px))!important;gap:0;padding:0 8px;background:#08151c}
body.map-first .mobile-nav button {min-height:44px!important;font:12px/1 var(--font);letter-spacing:0;padding:8px 4px}
body.map-first #main {top:calc(90px + var(--safe-top,0px))!important;bottom:var(--player)!important}
body.map-first :is(.map-heading h1,.journey-heading h1) {letter-spacing:0!important}
body.map-first:is([data-view=journey],[data-view=atlas]) #main {display:block!important;overflow:hidden!important;padding:0!important;background:#06131a}
body.map-first .journey-stage {position:absolute!important;inset:0!important;width:100%!important;max-width:none!important;height:100%!important;margin:0!important;padding:0!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:max-content minmax(0,1fr)!important;gap:0!important;min-height:0!important;overflow:hidden}
body.map-first .journey-topline,body.map-first .journey-context,body.map-first .journey-memory,body.map-first .journey-lower,body.map-first .time-jump,body.map-first .mobile-orientation {display:none!important}
body.map-first .journey-hero {grid-column:1!important;grid-row:1!important;display:block!important;min-height:0!important;margin:0!important;padding:0!important}
body.map-first .journey-heading {display:grid!important;grid-template-columns:minmax(55px,auto) minmax(0,1fr) 44px;grid-template-rows:minmax(44px,auto) auto;gap:0 8px;padding:5px 14px 7px!important;min-width:0;margin:0!important}
body.map-first .journey-handoff {display:none!important}
body.map-first .journey-heading h1 {grid-row:1;grid-column:1;align-self:center;font:600 23px/1.2 var(--font)!important;margin:0!important;max-width:170px;overflow-wrap:anywhere}
body.map-first .journey-heading h1 em {font:inherit!important;color:#eee1c7}
body.map-first .journey-heading .heading-lead,body.map-first .name-period {display:none!important}
body.map-first .mobile-setting {grid-row:1;grid-column:2;display:flex!important;align-items:center;min-height:44px!important;margin:0!important;padding:0 4px!important;border:0!important;text-align:left;max-width:none!important}
body.map-first .mobile-setting .eyebrow,body.map-first .mobile-setting strong span {display:none!important}
body.map-first .mobile-setting strong {font:400 16px/1.3 var(--font)!important;color:#bdd0d4;overflow-wrap:anywhere}
body.map-first .chapter-name {grid-row:2;grid-column:1;align-self:center;font-size:0!important;margin:0!important;white-space:nowrap}
body.map-first .chapter-name span {font:12px/1.4 var(--font)!important;text-transform:none!important;letter-spacing:0;color:var(--gold)}
body.map-first .journey-scene-date {grid-row:2;grid-column:2;align-self:center;font:12px/1.4 var(--font)!important;display:block!important;margin:0!important;min-width:0}
body.map-first .journey-scene-date strong {font:inherit!important;overflow-wrap:anywhere}
body.map-first .journey-scene-date svg {display:none!important}
body.map-first .journey-primary-actions {grid-row:1/3;grid-column:3;margin:0!important;display:flex!important;align-items:center;justify-content:center}
body.map-first .journey-primary-actions .primary-button {display:none!important}
body.map-first .journey-primary-actions .mobile-notes {display:flex!important;align-items:center;justify-content:center;min-height:44px;width:44px;padding:10px!important;background:none;border:0!important;margin:0!important}
body.map-first .journey-primary-actions .mobile-notes span {display:none!important}
body.map-first .journey-map {grid-row:2!important;grid-column:1!important;position:relative!important;min-width:0!important;min-height:0!important;height:100%!important;margin:0!important;padding:0!important;overflow:hidden}
body.map-first .journey-map :is(.narrative-lens,.lens-coordinate,.scene-map-top,.journey-map-caption,.schematic-label:not(#deck-schematic)) {display:none!important}
body.map-first .scene-map {position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
body.map-first #space {position:absolute!important;inset:0!important;width:100%!important;height:100%!important;touch-action:none!important;overflow:hidden;background:#06131a;cursor:grab}
body.map-first #space.map-dragging {cursor:grabbing}
body.map-first #space * {-webkit-user-select:none;user-select:none;-webkit-user-drag:none}
body.map-first #space .world {inset:58px 12px 44px!important;transform:none!important;overflow:hidden}
body.map-first #space :is(.space-vignette,#orbital-grid,#trails) {display:none!important}
body.map-first #starfield {opacity:.5}
body.map-first .dense-map-controls {position:absolute!important;inset:5px 12px auto!important;display:flex!important;width:auto!important;height:44px;gap:4px;z-index:8}
body.map-first .dense-map-controls button {display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:44px!important;min-height:44px!important;width:auto!important;height:44px;padding:0 10px!important;line-height:1!important;font:12px/1 var(--font)!important;border-radius:24px;border:1px solid #2b414b;background:#0a1d26ed;color:#b9d1d8;letter-spacing:0!important}
body.map-first .dense-map-controls svg {width:18px;height:18px}
body.map-first .dense-map-zoom {display:flex!important;gap:4px!important;margin-left:auto!important;order:0!important}
body.map-first .dense-map-zoom button {width:44px!important;padding:0!important}
body.map-first #deck-schematic {position:absolute;left:12px;bottom:0;display:flex!important;align-items:center;gap:6px;min-height:44px;color:#8ea7b1;background:transparent;border:0;font:11px/1 var(--font);padding:4px;white-space:nowrap;max-width:none!important}
body.map-first #deck-schematic svg {width:12px;height:12px}
body.map-first #space[data-map-layout] .star-core {width:8px!important;height:8px!important;left:18px!important;top:18px!important;border-radius:50%!important;transform:none!important;background:#8dafc3!important;border:1px solid #a3c6d9!important;box-shadow:none!important}
body.map-first #space[data-map-layout] .kind-unknown .star-core {background:transparent!important;border-style:dashed!important}
body.map-first #space[data-map-layout] .star-core:before,body.map-first #space[data-map-layout] .star-core:after {display:none!important;content:none!important}
body.map-first #space[data-map-layout] .selected .star-core {width:17px!important;height:17px!important;left:13.5px!important;top:13.5px!important;border:2px solid #ffe1a3!important;background:radial-gradient(circle at 30% 20%,#ffe7b6,#bb9455)!important;box-shadow:0 0 0 7px #e5b66712!important}
body.map-first #space[data-map-layout] .star-label,.map-first .map-label-measure {background:#0e2028ee!important;border:0!important;border-radius:4px!important;font:12px/16px var(--font)!important;color:#a8c1cc;min-height:28px!important;padding:5px 8px!important}
body.map-first #space[data-map-layout] .selected .star-label {color:#f8d48f!important;font-weight:600!important}
body.map-first .map-cluster-count {border:1px solid #567684;background:#10232c;color:#b9d2dc;font:12px/1 var(--font)}
body.map-first #map-context {position:relative!important;inset:0!important;height:auto!important;min-height:66px;margin:0;padding:8px 14px!important;border:0;display:grid;grid-template-columns:minmax(0,1fr)}
body.map-first #map-position-title {font-size:18px}
body.map-first #map-position-mode {font:11px/1.4 var(--font);letter-spacing:0}
body.map-first #map-position-date {font-size:12px}
body.map-first #map-selection {display:none!important}
body.map-first[data-view=atlas] #main {display:grid!important;grid-template-rows:max-content minmax(0,1fr)!important;grid-template-columns:1fr!important;gap:0!important}
body.map-first[data-view=atlas] #space {grid-row:2;grid-column:1;position:relative!important;inset:auto!important}
body.map-first[data-view=atlas] :is(.roster,.inspector,.map-footnote) {display:none!important}
/* Map history is a separate top-level surface, never a second audio transport. */
body.map-first[data-view=chronicle] #main {display:block!important;padding:0!important;background:#06131a;overflow:hidden!important}
body.map-first[data-view=chronicle] #alternate-view {position:absolute!important;inset:0!important;height:100%!important;width:100%!important;overflow:hidden!important}
#history-deck {display:grid;grid-template-rows:44px max-content 62px minmax(0,1fr) 36px;height:100%;min-height:0;padding:8px 0 0;gap:4px}
.history-tools {display:flex;gap:8px;padding:0 12px}
.history-tools button {min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #2b414b;border-radius:22px;color:var(--deck-blue);background:#0d2029;font:12px/1 var(--font)}
.history-tools svg {width:18px;height:18px}
.history-order {display:flex;flex:1;gap:2px;border:1px solid #2b414b;border-radius:24px;padding:2px}
.history-order button {flex:1;border:0;min-height:38px;background:none}
.history-order button.active {background:#223a45;color:#c4e0e9}
.history-heading {display:grid;gap:3px;padding:2px 16px;min-width:0}
.history-heading small {font:11px/1.4 var(--font);color:#8eabb7}
.history-heading strong {font:500 18px/1.3 var(--font);color:#d2e4ea;overflow-wrap:anywhere}
.history-heading span {font:12px/1.4 var(--font);color:#8eabb7}
.history-stepper {display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;padding:0 12px;align-items:end}
.history-stepper>button {min-width:44px;min-height:44px;display:grid;place-items:center;color:#9fc7d8}
.history-stepper svg {width:20px;height:20px}
.history-stepper label {display:flex;justify-content:space-between;color:#97bacb;font:11px/1.4 var(--font);padding:0 2px}
#history-range {display:block;position:static;width:100%;height:44px;min-height:44px;margin:0;accent-color:#9bc5d5;touch-action:none}
#history-map-host {position:relative;min-height:0;overflow:hidden}
.history-footer {display:flex;align-items:center;justify-content:space-between;padding:0 14px;font:11px/1.4 var(--font);color:#92adba}
.history-footer button {display:flex;align-items:center;gap:7px;min-height:36px;color:var(--gold);font-size:12px}
.history-footer svg {width:16px;height:16px}
.history-list {display:grid;gap:4px;margin-top:12px}
.history-list button {display:grid;gap:4px;text-align:left;min-height:64px;padding:12px;border-bottom:1px solid var(--line)}
.history-list button[aria-current] {background:#253b44;border-left:2px solid #a0c1d1}
.history-list small,.history-list span {color:var(--muted);font-size:12px}
#history-search {width:100%;min-height:44px;font-size:16px}
/* One quiet bottom dock. No giant track card, duplicate clocks, decorative progress bar, or emoji. */
body.map-first .player {box-sizing:border-box;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:44px 94px!important;gap:0!important;height:auto!important;min-height:0!important;padding:6px max(12px,var(--safe-left,0px)) calc(6px + var(--safe-bottom,0px)) max(12px,var(--safe-right,0px))!important;background:#0b1d25!important;border-top:1px solid #30464e;box-shadow:none!important;z-index:40}
body.map-first .player:before,body.map-first .player:after,body.map-first .player-track,body.map-first .player-extras {display:none!important}
body.map-first .player .chapter-navigation {grid-column:1!important;grid-row:1!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;height:44px!important;min-height:44px!important;width:100%;margin:0!important}
body.map-first .chapter-navigation button {min-height:44px!important;height:44px!important;min-width:44px;border:0!important;border-radius:6px;background:transparent!important;box-shadow:none;padding:4px 8px!important}
body.map-first .chapter-button-title {display:flex;justify-content:space-between;align-items:center;gap:4px;width:100%;min-width:0}
body.map-first #current-audio-chapter {font:500 14px/1.25 var(--font)!important;overflow-wrap:anywhere;min-width:0}
body.map-first #chapter-time {display:none!important}
body.map-first .chapters-open {font:11px/1.3 var(--font);color:#a4bdc5;white-space:nowrap}
body.map-first .chapter-skip svg {width:20px;height:20px}
body.map-first .player .playback {grid-row:2!important;grid-column:1!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:44px 50px!important;gap:0!important;min-width:0!important;width:100%;padding:0!important}
body.map-first .player .audio-track {grid-row:1!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;align-items:center;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important}
body.map-first .audio-scrub {position:relative;height:44px;min-width:0}
body.map-first .audio-clock {position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;gap:8px;pointer-events:none;color:#a0b7bf;font:11px/1.3 var(--font);font-variant-numeric:tabular-nums}
body.map-first .audio-clock span {min-width:0;max-width:none!important;width:auto!important;font:inherit!important;white-space:nowrap}
body.map-first #audio-range {position:absolute!important;inset:0!important;width:100%!important;min-width:0!important;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:0!important;outline-offset:2px;touch-action:none;appearance:none;-webkit-appearance:none;background:transparent!important}
body.map-first #audio-range::-webkit-slider-runnable-track {height:3px;border-radius:2px;background:linear-gradient(to right,#e1bf83 var(--played,0%),#38505c var(--played,0%))}
body.map-first #audio-range::-webkit-slider-thumb {appearance:none;-webkit-appearance:none;width:13px;height:13px;background:#e6c58a;border:0;border-radius:50%;margin-top:-5px;box-shadow:0 0 0 3px #e6c58a0b}
body.map-first #audio-range::-moz-range-track {height:3px;background:#38505c;border:0;border-radius:2px}
body.map-first #audio-range::-moz-range-progress {height:3px;background:#e1bf83}
body.map-first #audio-range::-moz-range-thumb {width:13px;height:13px;background:#e6c58a;border:0;border-radius:50%}
body.map-first .player .playback-buttons {grid-row:2!important;display:flex;justify-content:center;align-items:center;gap:clamp(8px,5vw,28px)!important;height:50px!important;padding:0!important;min-width:0}
body.map-first .playback-buttons>button {min-width:44px!important;min-height:44px!important;flex-shrink:0}
body.map-first .player .play-button {width:46px!important;height:46px!important;min-height:46px!important;border:0!important;border-radius:50%!important;background:#e1bf83!important;color:#0b1a21!important;box-shadow:none!important;margin:0!important}
body.map-first .play-button:before,body.map-first .play-button:after {display:none!important}
body.map-first .play-button svg {width:20px;height:20px}
body.map-first .skip-btn>span svg {width:26px;height:26px}
body.map-first .subtle-btn {font:12px/1 var(--font);color:#9bb7c1}
body.map-first .audio-preview #current-audio-chapter {color:#ffe0a2}
body.map-first .player.audio-unavailable {grid-template-rows:44px!important}
body.map-first .player.audio-unavailable .playback {display:none!important}
body.map-first .player.audio-unavailable .chapter-navigation {grid-template-columns:1fr!important}
body.map-first .player.audio-unavailable .chapter-skip {display:none!important}
body.map-first .player.audio-unavailable #player-chapter {background:#172d37!important;text-align:center}
/* Single connection action near the current chapter, not a second footer title. */
body.map-first .player-track #audio-map-link {display:none!important}
#deck-connection {position:relative;display:none}
body.map-first[data-view=voices] #main {grid-template-rows:max-content max-content 0 minmax(0,1fr)!important;padding:12px 14px!important}
body.map-first[data-view=voices] .page-listening {display:none!important}
body.map-first[data-view=voices] .map-heading #current-book-label {display:none!important}
body.map-first[data-view=voices] .map-heading h1 {font:600 22px/1.3 var(--font)!important}
body.map-first .voice-card .avatar {background:#1b3340;box-shadow:none}
body.map-first .space-vignette {pointer-events:none}
@media(min-width:761px) {
 body.map-first .mobile-nav {display:flex!important;left:var(--rail-w,0px);right:0}
 body.map-first #main {left:var(--rail-w,0px)!important}
 body.map-first .player {grid-template-columns:minmax(220px,1fr) minmax(250px,1.5fr)!important;grid-template-rows:60px!important;align-items:center;gap:14px!important}
 body.map-first .player .chapter-navigation {grid-row:1!important;grid-column:1!important}
 body.map-first .player .playback {grid-row:1!important;grid-column:2!important;grid-template-columns:minmax(150px,1fr) 256px!important;grid-template-rows:52px!important;gap:12px!important}
 body.map-first .player .audio-track {grid-column:1!important;grid-row:1!important}
 body.map-first .player .playback-buttons {grid-column:2!important;grid-row:1!important;gap:4px!important}
}
@media(max-height:540px) and (orientation:landscape) {
 body.map-first .topbar {display:none!important}
 body.map-first .mobile-nav {top:var(--safe-top,0px)!important}
 body.map-first #main {top:calc(44px + var(--safe-top,0px))!important}
 body.map-first .player {grid-template-columns:minmax(180px,.8fr) minmax(300px,1.2fr)!important;grid-template-rows:52px!important;padding-top:2px!important;padding-bottom:calc(2px + var(--safe-bottom,0px))!important;gap:10px!important}
 body.map-first .player .chapter-navigation {grid-column:1!important;grid-row:1!important;gap:2px}
 body.map-first .player .playback {grid-row:1!important;grid-column:2!important;grid-template-columns:minmax(80px,1fr) 220px!important;grid-template-rows:50px!important;gap:5px!important}
 body.map-first .player .audio-track {grid-column:1!important;grid-row:1!important;grid-template-columns:1fr!important}
 body.map-first .player .playback-buttons {grid-column:2!important;grid-row:1!important;gap:0!important}
 body.map-first .chapters-open {display:none}
 body.map-first .journey-stage {grid-template-columns:200px minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important}
 body.map-first .journey-map {grid-column:2!important;grid-row:1!important}
 body.map-first .journey-heading {grid-template-columns:1fr 44px;grid-template-rows:auto auto auto auto;padding:8px!important}
 body.map-first .journey-heading h1 {grid-column:1;grid-row:1}
 body.map-first .mobile-setting {grid-column:1;grid-row:2}
 body.map-first .chapter-name {grid-column:1;grid-row:3}
 body.map-first .journey-scene-date {grid-column:1;grid-row:4}
 body.map-first .journey-primary-actions {grid-column:2;grid-row:1/5}
 #history-deck {grid-template-columns:230px minmax(0,1fr);grid-template-rows:44px max-content 62px minmax(0,1fr) 36px;padding:5px 0 0;gap:2px}
 #history-deck>.history-tools,#history-deck>.history-heading,#history-deck>.history-stepper {grid-column:1}
 #history-map-host {grid-column:2;grid-row:1/-1}
 .history-footer {grid-column:1;grid-row:5;gap:5px;padding:0 10px}
 .history-footer>span {display:none}
 .history-order button {font-size:10px}
 .history-heading strong {font-size:16px}
}
@media(prefers-reduced-motion:reduce) {
 body.map-first *,body.map-first *:before,body.map-first *:after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
body.map-first #audio-map-link {display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100px;padding:4px 8px;border:0;background:transparent;color:var(--gold);font:11px/1.3 var(--font);white-space:normal}
body.map-first .header-tools #protection {display:none!important}
body.map-first #audio-map-link[hidden] {display:none!important}
/* ID selectors supersede the older responsive journey grid explicitly. */
body.map-first #journey-stage {grid-template-rows:max-content minmax(0,1fr)!important;grid-template-columns:minmax(0,1fr)!important;align-items:stretch!important;align-content:stretch!important}
body.map-first #journey-stage>.journey-left {grid-row:1!important;grid-column:1!important;position:relative!important;inset:auto!important;display:block!important;min-height:0!important;margin:0!important;padding:0!important;width:auto!important;max-width:none!important}
body.map-first #journey-stage>#journey-map {grid-row:2!important;grid-column:1!important;min-height:0!important;height:100%!important;align-self:stretch!important}
body.map-first #journey-map #space[data-map-layout] .world {inset:58px 12px 44px!important}
body.map-first #journey-map .scene-map {position:absolute!important;inset:0!important;height:100%!important}
@media(max-height:540px) and (orientation:landscape) {
 body.map-first #journey-stage {grid-template-columns:190px minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;min-height:0!important}
 body.map-first #journey-stage>#journey-map {grid-column:2!important;grid-row:1!important}
}

body.map-first #space:before {opacity:.18!important;pointer-events:none}
body.map-first .topbar {left:var(--rail)!important}
body.map-first .mobile-nav,body.map-first #main {left:var(--rail)!important}
body.map-first #audio-range::-webkit-slider-runnable-track {transform:translateY(5px)}
body.map-first #audio-range::-moz-range-track {transform:translateY(5px)}
body.map-first #audio-range::-moz-range-progress {transform:translateY(5px)}
.history-tools .history-order {padding:0}
.history-tools .history-order button {min-height:44px}

/* Strong selectors reset old player-card dimensions at every breakpoint. */
body.map-first .player .chapter-navigation #player-chapter {position:static!important;inset:auto!important;min-height:44px!important;height:44px!important;padding:4px 8px!important;align-self:center}
body.map-first .player .chapter-navigation button {align-self:center}
@media(max-height:540px) and (orientation:landscape) {
 body.map-first .player {grid-template-columns:minmax(160px,.65fr) minmax(340px,1.35fr)!important}
 body.map-first .player .playback {grid-template-columns:minmax(120px,1fr) 220px!important}
 body.map-first .player .audio-track {grid-template-columns:minmax(0,1fr)!important}
}
body.map-first {--rail:0px!important}
body.map-first .rail {display:none!important}
body.map-first #space #deck-schematic {top:auto!important;bottom:0!important;left:12px!important;right:auto!important;height:44px!important;min-height:44px!important;width:auto!important;max-width:none!important}
body.map-first #history-range {-webkit-appearance:none;appearance:none;background:transparent!important;border:0;padding:0;outline-offset:2px}
body.map-first #history-range::-webkit-slider-runnable-track {height:3px;background:#456576;border-radius:2px}
body.map-first #history-range::-webkit-slider-thumb {-webkit-appearance:none;appearance:none;width:14px;height:14px;border:0;background:#a5cfdd;border-radius:50%;margin-top:-5.5px}
body.map-first #history-range::-moz-range-track {height:3px;background:#456576;border:0;border-radius:2px}
body.map-first #history-range::-moz-range-thumb {width:14px;height:14px;border:0;background:#a5cfdd;border-radius:50%}
body.map-first .mobile-nav {position:fixed!important;bottom:auto!important;transform:none!important}
body.map-first #space[data-map-layout] .star-label,body.map-first .map-label-measure,body.map-first #space[data-map-layout] .selected .star-label {font-weight:500!important}
body.map-first[data-view=voices] #main {grid-template-columns:minmax(0,1fr)!important;grid-template-rows:max-content max-content minmax(0,1fr)!important;gap:8px!important;overflow:hidden!important;min-height:0}
body.map-first[data-view=voices] .map-heading {grid-column:1!important;grid-row:1!important;position:static!important;min-height:0!important;height:auto!important;align-self:start!important}
body.map-first[data-view=voices] .map-heading p {display:none!important}
body.map-first[data-view=voices] #page-tools {grid-column:1!important;grid-row:2!important;min-height:0!important;height:auto!important;align-self:start!important}
body.map-first[data-view=voices] #alternate-view {grid-column:1!important;grid-row:3!important;min-height:0!important;height:100%!important;max-height:100%!important;overflow:auto!important}

/* Story context: actual events first; provenance is available on demand. */
#dialog .context-chapter-meta {margin:0 0 18px;color:var(--muted);font:13px/1.65 var(--font)}
#dialog :is(.chapter-context-text,.context-presence) {margin:0 0 14px;font:15px/1.65 var(--font);color:var(--text)}
#dialog .context-presence {padding-left:12px;border-left:2px solid var(--gold)}
#dialog .location-observations {gap:0;margin-top:4px}
#dialog .location-chapter {display:block;padding:0;border:0;border-bottom:1px solid var(--line);margin:0;min-width:0}
#dialog .location-chapter>summary,#dialog .context-heading-only {position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:4px 8px;min-height:60px;padding:14px 22px 14px 0;cursor:pointer;list-style:none}
#dialog .location-chapter>summary::-webkit-details-marker {display:none}
#dialog .location-chapter>summary::after {content:'';position:absolute;right:4px;top:21px;width:6px;height:6px;border-right:1px solid var(--muted);border-bottom:1px solid var(--muted);transform:rotate(45deg)}
#dialog .location-chapter[open]>summary::after {transform:rotate(225deg);top:25px}
#dialog .location-chapter>summary:focus-visible {outline:2px solid var(--gold);outline-offset:-2px}
#dialog .context-heading-only {cursor:default}
#dialog .location-chapter strong {font:600 16px/1.5 var(--font);color:var(--text)}
#dialog .location-chapter :is(span,small) {font:12px/1.5 var(--font);color:var(--muted)}
#dialog .location-chapter small {grid-column:1/-1}
#dialog .location-chapter-body {padding:2px 0 12px}
#dialog :is(.context-sources,.context-more,.context-astronomy)>summary {min-height:44px;display:list-item;align-content:center;cursor:pointer;color:var(--muted);font:13px/1.5 var(--font);padding:11px 0}
#dialog .context-sources>div {display:grid;gap:4px;padding:0 0 6px}
#dialog .context-sources .source-link {text-align:left;justify-content:flex-start;white-space:normal;line-height:1.5;min-height:44px}
#dialog .context-sources {margin:0}
#dialog .context-astronomy {margin-top:12px}
#dialog .context-astronomy .distance-reading {margin:0;border:0;padding:8px 0}
#dialog .context-astronomy svg {width:16px;height:16px;flex-shrink:0}
#dialog .chapter-continuity {margin-top:20px;padding-top:12px;border-top:1px solid var(--line)}
#dialog .chapter-continuity h3 {font:600 16px/1.5 var(--font);margin:0 0 12px}
#dialog .chapter-continuity .scene-evidence {margin:0}
#dialog .chapter-continuity .scene-evidence>div {border:0;padding:0}
#dialog .chapter-continuity .chapter-context-text {font-size:14px;margin-top:12px}
@media(max-width:360px){#dialog .location-chapter>summary,#dialog .context-heading-only {grid-template-columns:minmax(0,1fr)}#dialog .location-chapter small {grid-column:1}}

/* 0.8.2: settled map typography and consistent mobile insets. */
body.map-first #space[data-map-layout] .map-label-leader {
 position:absolute;inset:0;width:44px;height:44px;overflow:visible;
 pointer-events:none;fill:none;stroke:#6e94a3;stroke-width:.75;opacity:.48;
}
body.map-first #space[data-map-layout] .selected .map-label-leader {stroke:#e3c17e;opacity:.7}
body.map-first #space[data-map-layout] .star-label,
body.map-first .map-label-measure {padding:6px 10px!important;line-height:18px!important;min-height:30px!important}
body.map-first #space[data-map-layout] .star-label {transition:none!important;animation:none!important}
body.map-first #space[data-map-layout] .star-core,
body.map-first #space[data-map-layout] .map-cluster-count {z-index:1}
body.map-first .topbar {padding-inline:max(16px,var(--safe-left,0px)) max(16px,var(--safe-right,0px))!important}
body.map-first #deck-book {padding:6px 4px 6px 0;gap:8px}
body.map-first .journey-heading {padding-inline:16px!important;column-gap:12px}
body.map-first .mobile-setting {flex-direction:row;align-self:center;justify-content:flex-start}
body.map-first .journey-primary-actions .mobile-notes {border-radius:8px}
body.map-first .player {padding-right:max(16px,var(--safe-right,0px))!important;padding-left:max(16px,var(--safe-left,0px))!important}
body.map-first .audio-clock {padding-inline:2px}
body.map-first #current-audio-chapter {line-height:1.4!important}
body.map-first .chapter-button-title {gap:10px}
body.map-first[data-view=voices] #main {padding:16px 16px 8px!important;gap:12px!important}
body.map-first[data-view=voices] .map-heading {padding:0!important}
body.map-first[data-view=voices] .map-heading h1 {margin:0!important}
body.map-first[data-view=voices] #page-tools {padding:0!important}
body.map-first[data-view=voices] #alternate-view {scroll-padding:8px;scrollbar-gutter:stable}
body.map-first[data-view=voices] .voices-grid {gap:10px;padding:6px 3px 16px!important}
body.map-first[data-view=voices] .voice-card {
 padding:16px!important;border:1px solid #2b424c!important;border-radius:10px!important;
 background:#0c2028!important;grid-template-columns:38px minmax(0,1fr) 18px;gap:5px 12px;
 min-height:104px;align-items:start;align-content:center;
}
body.map-first[data-view=voices] .voice-card .avatar {width:36px;height:36px;float:none;align-self:start;margin-top:2px}
body.map-first[data-view=voices] .voice-card .avatar::after {display:none}
body.map-first .voice-name {line-height:1.4}
body.map-first .voice-open {display:flex;align-items:center;justify-content:center}
body.map-first .voice-open svg {display:block;width:18px;height:18px;stroke-width:1.6}
body.map-first .voice-card small {font-size:12px!important;line-height:1.55!important}
body.map-first .voice-card:focus-visible {outline:2px solid var(--gold);outline-offset:-3px}
body.map-first .voice-card:active {background:#18313a!important}
body.map-first .history-list button {border-radius:8px;padding:14px 16px;gap:6px}
body.map-first .history-list button[aria-current] {border-left:2px solid #a0c1d1}
body.map-first .history-order {overflow:hidden}
body.map-first .history-heading {padding-inline:18px}
body.map-first .history-footer button {min-height:44px;padding:4px}
body.map-first #history-deck {grid-template-rows:44px max-content 62px minmax(0,1fr) 44px}

#dialog :is(.context-sources,.context-more,.context-astronomy)>summary {padding:12px 4px;list-style-position:inside}
#dialog .context-sources .source-link {padding:var(--space-8) var(--space-12);border-radius:var(--radius-8);gap:var(--space-8)}
#dialog .source-link svg {width:18px;height:18px;flex-shrink:0}
#dialog .context-heading-only,#dialog .location-chapter>summary {padding:16px 24px 16px 4px;gap:6px 12px}
#dialog .location-chapter-body {padding:0 4px 14px}
#dialog .search-item,#dialog .chapter-item {padding:var(--space-12);gap:var(--space-8);border-radius:var(--radius-8)}
#dialog .map-place-row {gap:8px;padding:4px 0}
#dialog .map-place-row>button {padding:10px 12px;line-height:1.5}
#dialog .map-place-row strong {line-height:1.5}
#dialog .map-place-row svg {flex-shrink:0;width:18px;height:18px}

@media(max-width:360px) {
 body.map-first .chapter-navigation {gap:4px!important}
 body.map-first .chapters-open {font-size:10px}
 body.map-first[data-view=voices] .voice-card {padding:14px!important;column-gap:10px}

}
@media(max-height:540px) and (orientation:landscape) {
 body.map-first #history-deck {grid-template-columns:230px minmax(0,1fr);grid-template-rows:44px max-content 62px minmax(0,1fr) 44px}
 body.map-first[data-view=voices] #main {padding-top:10px!important;gap:8px!important}
 body.map-first .journey-heading {padding-inline:12px!important}
}

/* 0.8.3: show each group member, never a numeric stand-in for a location. */
body.map-first #space[data-map-layout] .map-cluster .star-core {display:none!important}
body.map-first #space[data-map-layout] .map-group-glyph {position:absolute;inset:0;width:44px;height:44px;pointer-events:none;color:#b6d4df;z-index:1}
body.map-first #space[data-map-layout] .map-group-outline {stroke:#789ba9;stroke-width:.9;fill:#0b1f2966}
body.map-first #space[data-map-layout] .map-member-dot {fill:#a5c9d9;stroke:#d0e4eb;stroke-width:.65}
body.map-first #space[data-map-layout] .map-member-dot[data-kind=unknown] {fill:#091c25;stroke:#b0d0db}
body.map-first #space[data-map-layout] .star-label.group-caption,
body.map-first .map-label-measure.group-caption {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:48px;line-height:18px!important;text-overflow:ellipsis}
body.map-first #space[data-map-layout] .map-cluster:hover .map-group-outline,
body.map-first #space[data-map-layout] .map-cluster:focus-visible .map-group-outline {stroke:#d0e4eb;fill:#18333c99}
/* Nebula is intentionally static: depth without an expensive full-screen blur
   animation. Only the small decorative canvas marks move. Labels stay above it. */
body.map-first #space::before {display:block!important;content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(165deg,#06131a88 3%,#06131a22 35%,#06131a66 78%,#06131ac9),url('assets/nebula.webp') center 45%/cover;opacity:.78!important}
body.map-first #space::after {content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 64% 37%,#7292c20d,transparent 62%),linear-gradient(#06131a77,transparent 18%,transparent 78%,#06131a88);z-index:0}
body.map-first #starfield {opacity:.94;z-index:1}
body.map-first #space .world {z-index:2}
body.map-first #deck-schematic {z-index:4;color:#a5bcc5}

/* 0.8.5 phone usability fixes. Placed last: older stacked phone rules (some with
   !important) otherwise win. */

#dialog .context-time-jump {margin:0 0 10px;color:#c5b48f;font:13px/1.5 var(--font)}
#dialog .context-time-jump small {display:block;color:#8ea7b1;font-size:12px}
.mobile-checkpoint {display:none}
.moment-source-button,#dialog .dialog-context-beat>button {white-space:nowrap;width:auto;min-width:max-content}
body.map-first .player :is(#audio-elapsed,#audio-duration) {white-space:nowrap;flex:none;overflow:visible;text-overflow:clip}
@media(max-width:760px) {
 body.map-first .mobile-checkpoint {display:inline-flex;position:absolute;right:12px;bottom:0;z-index:5;align-items:center;gap:6px;min-height:44px;max-width:calc(100% - 150px);padding:0 14px;border:1px solid #3d5863;border-radius:22px;background:#10252eee;color:#f0dcae;font:12px/1.25 var(--font);text-align:left}
 body.map-first .mobile-checkpoint svg {width:14px;min-width:14px;height:14px}
 /* Phone legibility floor: no visible label is smaller than 12px. Sheet text takes its sizes from the sheet component below. */
 body.map-first .mobile-nav button,body.map-first #deck-schematic,body.map-first .chapters-open,body.map-first .player #audio-elapsed,body.map-first .player #audio-duration,body.map-first #audio-map-link,body.map-first .player .skip-btn small,body.map-first .avatar,#toast,body.map-first :is(.history-heading small,.history-footer,.history-footer>span,#history-deck label) {font-size:12px!important}
 body.map-first .mobile-nav button {letter-spacing:0!important}
}

/* 0.8.6: the story-time jump sits beside the date. The Briefing keeps its fuller version. */
body.map-first .journey-scene-date {display:flex!important;flex-wrap:wrap;align-items:center;gap:2px 8px}
.time-shift-chip {display:inline-flex;align-items:center;min-height:20px;padding:0 8px;border:1px solid #4d6671;border-radius:10px;color:#d8c08a;background:#0d222b;font:12px/18px var(--font);white-space:nowrap}

/* 0.8.6: the reader is dark by default. Warm off-white on deep blue-green rather than
   pure white on black, so long reading stays comfortable. Font-size controls are unchanged. */
#reader-drawer {--reader-bg:#0e1b21;--reader-bar:#12252d;--reader-line:#2c424c;--reader-text:#d5dbd4;--reader-muted:#9fb2b6;--reader-gold:#e0c086;--reader-heading:#efe8d6;
 background:var(--reader-bg)!important;color:var(--reader-text);border-left:1px solid var(--reader-line)!important;box-shadow:-16px 0 60px #02080cbb}
#reader-drawer .reader-head,#reader-drawer .reader-tools,#reader-drawer .reader-footer {background:var(--reader-bar);color:var(--reader-text);border-color:var(--reader-line)}
#reader-drawer .reader-head p,#reader-drawer .reader-position,#reader-drawer .reader-footer>span {color:var(--reader-muted)}
#reader-drawer .reader-head .icon-btn {color:var(--reader-gold)}
#reader-drawer .reader-tools button,#reader-drawer .reader-footer button {color:var(--reader-gold);border:1px solid #3f5864;border-radius:6px;background:#0f2028}
#reader-drawer .reader-tools button:disabled {color:#76898e;border-color:#2c424c}
#reader-drawer .reader-text {background:var(--reader-bg);color:var(--reader-text);scrollbar-color:#4a6069 transparent}
#reader-drawer .reader-info {color:var(--reader-muted);background:#12252d;border-color:var(--reader-line)}
#reader-drawer .reader-chapter-heading .eyebrow {color:var(--reader-gold)}
#reader-drawer .reader-chapter-heading h2,#reader-drawer .empty-reader h2 {color:var(--reader-heading)}
#reader-drawer .reader-chapter-heading>p,#reader-drawer .empty-reader p {color:var(--reader-muted)}
#reader-drawer .reader-text .source-evidence {background:#2b2a1f;box-shadow:-4px 0 0 #b89651;color:#f1e9d0}
#reader-drawer .empty-reader .eyebrow {color:var(--reader-gold)}
#reader-drawer .empty-reader button {background:#1b3a44;color:#eef0e4;border:1px solid #47707e}
#reader-drawer .reader-hint {margin-top:25px}
/* Reader chrome follows the phone legibility floor of 12px. */
#reader-drawer :is(.reader-head p,.reader-info,.reader-position,.reader-footer>span,.reader-footer button,.reader-chapter-heading .eyebrow,.reader-tools button,.empty-reader p) {font-size:12px}

/* 0.8.6: Settings. Buttons are not repeated as labels; reference text sits under About. */
#dialog .settings-backup {display:grid;gap:8px;margin:16px 0 0}
/* Font licenses in About: whole rows, so each link is a real 44px target. */
#dialog .license-links {display:grid;margin:0}
#dialog .license-links a {display:flex;align-items:center;min-height:var(--control-min);color:var(--gold);font:var(--type-13)/1.4 var(--font);text-decoration:underline;text-underline-offset:4px}
#dialog .license-links a:focus-visible {outline:2px solid var(--gold);outline-offset:2px}

#dialog .settings-about {margin:18px 0 8px;border-top:1px solid var(--line)}
#dialog .settings-about>summary {min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--muted);font:13px/1.5 var(--font);list-style:none}
#dialog .settings-about>summary::-webkit-details-marker {display:none}
#dialog .settings-about>summary::after {content:'';width:6px;height:6px;margin-left:10px;border-right:1px solid var(--muted);border-bottom:1px solid var(--muted);transform:rotate(45deg)}
#dialog .settings-about[open]>summary::after {transform:rotate(225deg)}
#dialog .settings-about>summary:focus-visible {outline:2px solid var(--gold);outline-offset:2px}

/* 0.8.6: an audio file the browser cannot decode says so in the dock and offers another file. */
body.map-first .player.audio-error .chapter-navigation {grid-template-columns:minmax(0,1fr) auto!important;gap:8px}
body.map-first .player.audio-error #player-chapter {background:#2b1f1a!important;border:1px solid #6a4a3a!important;text-align:left}
body.map-first .player.audio-error .chapters-open {display:none}
body.map-first .player.audio-error .audio-replace {display:flex;align-items:center;justify-content:center;min-height:44px!important;height:44px!important;padding:0 14px!important;border:1px solid #8d7650!important;border-radius:22px!important;background:#2a2619!important;color:#f0dcae;font:12px/1.3 var(--font);white-space:nowrap}

/* ==========================================================================
   0.8.7 · Sheets and buttons on one layout system.
   One sheet component (#dialog with its header, copy, notes, fields and actions) and three
   button types, written only with the tokens at the top of this file. The earlier sheet and
   button rules in style.css, bridge.css, listening.css and workspace.css were deleted in the
   same change: restyle these selectors here, not in those files. Only the sheet shell is
   addressed by ID; its parts are scoped by class, so the content rules above can still
   refine them.
   ========================================================================== */

/* Three button types: primary (.primary-button), secondary (.quiet-button), text (.small-button).
   A quiet button beside a primary one (Cancel, Not now) is shown as the text type. */
.primary-button,.quiet-button,.small-button {box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-8);max-width:100%;text-align:center;white-space:normal;cursor:pointer;-webkit-tap-highlight-color:transparent}
.primary-button {min-height:var(--control-field);padding:var(--space-12) var(--space-20);border:0;border-radius:var(--radius-12);background:var(--brass);color:var(--brass-ink);font:700 var(--type-16)/1.25 var(--font);clip-path:none;box-shadow:none}
.primary-button:hover {background:#edcb97;color:var(--brass-ink)}
.quiet-button {min-height:var(--control-min);padding:var(--space-8) var(--space-16);border:1px solid var(--button-line);border-radius:var(--radius-12);background:transparent;color:var(--text);font:600 var(--type-15)/1.25 var(--font)}
.quiet-button:hover {background:#9ec4d114;border-color:#6d8896}
.small-button {min-width:var(--control-min);min-height:var(--control-min);padding:var(--space-8) 0;border:0;border-radius:var(--radius-8);background:transparent;color:var(--gold);font:600 var(--type-15)/1.25 var(--font)}
.small-button:hover {color:#f3d9a8;text-decoration:underline;text-underline-offset:4px}
:is(.primary-button,.quiet-button,.small-button) svg {width:20px;height:20px;flex:none}
:is(.primary-button,.quiet-button,.small-button):focus-visible {outline:2px solid var(--gold);outline-offset:2px}
:is(.primary-button,.quiet-button,.small-button):disabled {opacity:.5;cursor:default}

/* Sheet shell: a full-width bottom sheet on phones, a centred card on wider screens. */
#dialog {--action-width:100%;box-sizing:border-box;position:fixed;inset:auto 0 0 0;margin:0;padding:0;width:100%;max-width:none;max-height:calc(100dvh - var(--safe-top,0px) - var(--space-24));
 border:0;border-radius:var(--radius-16) var(--radius-16) 0 0;background:var(--sheet-bg);color:var(--text);box-shadow:0 -24px 48px -24px #000c;
 overflow:auto;overscroll-behavior:contain;scroll-padding:var(--control-field) 0 0;scrollbar-width:thin;scrollbar-color:#7696b433 transparent}
#dialog::backdrop {background:#030914a8;backdrop-filter:blur(8px)}

/* Sheet parts. */
.dialog-content {box-sizing:border-box;min-width:0;padding:0 var(--space-20) calc(var(--space-24) + var(--safe-bottom,0px))}
.dialog-header {position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:var(--space-12);margin:0 calc(var(--space-20) * -1) var(--space-16);padding:var(--space-12) var(--space-20) var(--space-8);background:var(--sheet-bg);border-bottom:1px solid var(--sheet-line)}
.dialog-header>div {min-width:0}
.dialog-header .eyebrow {display:block;margin:0 0 var(--space-4);font:600 var(--type-13)/1.3 var(--font);letter-spacing:.08em;color:var(--gold)}
.dialog-header h2 {margin:0;font:400 var(--type-22)/1.3 var(--sheet-title-font);letter-spacing:0;color:#ecebdd;overflow-wrap:anywhere}
.dialog-header .icon-btn {margin:0 calc(var(--space-12) * -1) 0 0}
.dialog-content .icon-btn {flex:none;display:grid;place-items:center;width:var(--control-min);height:var(--control-min);min-width:var(--control-min);padding:0;border-radius:var(--radius-8)}
.dialog-copy {margin:0 0 var(--space-16);font:400 var(--type-15)/1.5 var(--font);color:var(--sheet-copy)}
.dialog-copy strong {font-weight:600;color:var(--text)}
.subtle-note {margin:var(--space-16) 0 0;font:400 var(--type-13)/1.5 var(--font);color:var(--sheet-note)}
.dialog-alert {margin:var(--space-16) 0;padding:var(--space-12);border-left:3px solid var(--gold);border-radius:var(--radius-8);background:#1b2c33;color:#f4e6c3;font:400 var(--type-15)/1.4 var(--font)}
/* Secondary text in a sheet is 13px; timestamps and counters set their own 12px. ID level on purpose: it is the text-size floor. */
#dialog :is(small,dt,em,.source-link,.empty-note,.chapter-now,.book-actions>span,.guide-table-head span) {font-size:var(--type-13)}
.dialog-content :is(button,summary,select) {min-height:var(--control-min)}
.dialog-content .primary-button {min-height:var(--control-field)}
.dialog-content :is(button,input,select) {touch-action:manipulation}

/* Fields: 13px label, 6px above a 48px field, 20px between groups. */
.dialog-content label:not(.check-row):not(.sr-only) {display:block;margin:0 0 var(--field-label-gap);font:500 var(--type-13)/1.4 var(--font);color:var(--sheet-label)}
.dialog-content :is(select,input[type=number],input[type=search],input[type=text],textarea) {box-sizing:border-box;display:block;width:100%;min-width:0;max-width:100%;min-height:var(--control-field);padding:0 var(--space-12);border:1px solid var(--field-line);border-radius:var(--radius-12);background:var(--field-bg);color:var(--text);font:400 var(--type-16)/1.3 var(--font)}
.dialog-content :is(select,input):focus-visible {outline:2px solid var(--gold);outline-offset:2px}
#search-input {margin:0 0 var(--space-12)}
.field-row {display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-20);margin:var(--space-20) 0 0}
.field-row>div {min-width:0}
.prior-books-title {margin:var(--space-20) 0 var(--space-4);font:600 var(--type-13)/1.4 var(--font);color:var(--sheet-label)}
.check-row {display:flex;align-items:flex-start;gap:var(--space-12);min-height:var(--control-min);margin:0;padding:var(--space-8) 0;font:400 var(--type-15)/1.4 var(--font);color:var(--text)}
.check-row input[type=checkbox] {flex:none;width:var(--space-24);height:var(--space-24);min-height:0;margin:var(--space-4) 0 0;accent-color:var(--gold)}
.check-row strong {display:block;font-weight:600}
.check-row small {display:block;margin-top:var(--space-4);line-height:1.5;color:var(--sheet-note)}
.confirm-row {margin-top:var(--space-12);border-top:1px solid var(--sheet-line)}
.settings-row {font-size:var(--type-15)}
.settings-row .small-button {justify-self:end}

/* Connect map: the track number and every per-track chapter picker use the full width. */
.guide-sequence {display:grid;grid-template-columns:minmax(0,1fr);margin:var(--space-20) 0 0}
.guide-sequence .small-button {justify-self:start;margin:var(--space-4) 0 0}
.guide-table-head {display:none}
.guide-row {display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);margin:0;padding:var(--space-12) 0;border-top:1px solid var(--sheet-line)}
.guide-row small {display:block;margin-top:var(--space-4);color:var(--sheet-note)}

/* Actions: primary on top and full width on phones, then the text or secondary buttons. */
.dialog-actions {display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);margin:var(--space-24) 0 0;padding:0}
.dialog-actions:has(>.primary-button)>.quiet-button {border-color:transparent;border-radius:var(--radius-8);color:var(--sheet-label)}
.dialog-actions>:is(.primary-button,.quiet-button),.intro-actions>button {width:var(--action-width)}
.intro-actions {display:grid;margin:var(--space-8) 0 0}
.dialog-actions-grid {grid-template-columns:repeat(2,minmax(0,1fr))}

@media(min-width:761px) {
 #dialog {--action-width:auto;inset:0;margin:auto;width:min(600px,calc(100vw - var(--space-32)));max-height:calc(100dvh - var(--space-32));border-radius:var(--radius-16);box-shadow:0 24px 80px #000a}
 .dialog-actions {display:flex;flex-wrap:wrap;flex-direction:row-reverse;justify-content:flex-start;gap:var(--space-12)}
 .dialog-actions.dialog-actions-grid {display:grid;gap:var(--space-8)}
 .field-row {grid-template-columns:repeat(2,minmax(0,1fr))}
 .guide-row {grid-template-columns:minmax(0,1fr) minmax(180px,240px);align-items:center}
 .guide-table-head {display:flex}
}