:root {
  --ink: #1a1612;
  --bone: #e8dcc8;
  --paper: #efe4d0;
  --earth: #6b5344;
  --ochre: #c4a15a;
  --stone: #8a7a68;
  --water: #3d6b7a;
  --shadow: #2a241c;
  --seat-makers: #c9b48a;
  --seat-takers: #8a4a3a;
  --seat-hidden: #4a6a78;
  --seat-dynasty: #5a6a48;
  --seat-breakers: #8a3a4a;
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: #14110e; color: var(--bone); min-height: 100%; }
button { font: inherit; cursor: pointer; }
.kicker { font-family: system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; font-size: .68rem; color: var(--ochre); margin: 0; }
.meta { color: var(--stone); font-size: .85rem; }
.hint, .quiet, .legend { color: var(--stone); font-size: .92rem; line-height: 1.45; }
.top { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem 0; }
.layout { display: grid; gap: 1.25rem; padding: 1rem 1.25rem 2.5rem; max-width: 72rem; margin: 0 auto; }
@media (min-width: 960px) { .layout { grid-template-columns: 1.1fr 1fr; } .turn { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: start; } }
.paper { background: var(--paper); color: var(--ink); border-radius: 22px; padding: 1.25rem 1.4rem; box-shadow: inset 0 0 0 1px rgba(80,50,20,.12); }
.paper.mini { padding: .8rem 1rem; }
.gazette blockquote { font-size: 1.55rem; line-height: 1.25; margin: .6rem 0 0; font-weight: 500; }
.compact { line-height: 1.5; color: rgba(26,22,18,.8); }
.system, .recap, .end, .warn { margin-top: 1rem; padding-top: .8rem; border-top: 1px solid rgba(80,50,20,.15); }
.warn { color: #7a2e28; }
.clay { background: #2a241c; border-radius: 18px; padding: 1rem 1.1rem; }
.cta, .ghost { border: 0; border-radius: 14px; padding: .85rem 1.1rem; font-family: system-ui, sans-serif; }
.cta { background: var(--bone); color: var(--ink); }
.ghost { background: transparent; color: var(--bone); box-shadow: inset 0 0 0 1px rgba(232,220,200,.35); }
.ghost.ochre { color: var(--ochre); box-shadow: inset 0 0 0 1px rgba(196,161,90,.35); }
.small { padding: .55rem .8rem; font-size: .9rem; }
.text-btn { background: none; border: 0; color: var(--stone); padding: 0; }
.stack { display: flex; flex-direction: column; gap: .6rem; min-width: 16rem; }
.row { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.row.wrap { flex-wrap: wrap; justify-content: flex-start; }
.river { position: relative; height: 28rem; background: linear-gradient(#2a3a32, #1c2824); border-radius: 22px; overflow: hidden; }
.valley { position: absolute; inset: 8% 36%; background: rgba(40,70,80,.35); border-radius: 40%; filter: blur(2px); }
.basin { position: absolute; transform: translate(-50%, -50%); min-width: 7.2rem; border: 0; border-radius: 14px; padding: .45rem .55rem; background: #3a342c; color: var(--bone); text-align: left; }
.basin.mine { box-shadow: 0 0 0 2px var(--ochre); }
.basin.sel { outline: 2px solid var(--bone); }
.basin.ghost { box-shadow: 0 0 0 2px #7a2e28; background: #4a3028; }
.basin.pulse { animation: pulse 1.4s ease-out; }
@keyframes pulse { 0% { transform: translate(-50%, -50%) scale(1.08); } 100% { transform: translate(-50%, -50%) scale(1); } }
.delta { display: block; color: var(--ochre); font-size: .68rem; }
.agent-snap { margin-top: 1rem; color: rgba(26,22,18,.7); }
.agent-snap pre { max-height: 12rem; overflow: auto; }
.halo { display: block; font-family: system-ui, sans-serif; font-size: .95rem; text-shadow: 0 0 6px #14110e; }
.stats { display: block; font-size: .72rem; color: rgba(232,220,200,.8); }
.stats.muted { opacity: .65; }
.present { display: flex; align-items: center; gap: .4rem; color: var(--stone); }
.tone { width: .7rem; height: .7rem; border-radius: 99px; display: inline-block; }
.tone.seat-makers { background: var(--seat-makers); }
.tone.seat-takers { background: var(--seat-takers); }
.tone.seat-hidden { background: var(--seat-hidden); }
.tone.seat-dynasty { background: var(--seat-dynasty); }
.tone.seat-breakers { background: var(--seat-breakers); }
.pick { max-width: 36rem; margin: 0 auto; padding: 2rem 1.25rem 3rem; }
.pick h1 { font-size: 2rem; font-weight: 500; }
.gazetteer-start { width: 100%; margin: .6rem 0; font-size: 1.05rem; }
.lineage-alt { margin-top: 1.4rem; color: var(--stone); }
.lineage-alt summary { cursor: pointer; font-family: system-ui, sans-serif; font-size: .9rem; }
.edits { display: grid; gap: .55rem; margin-top: 1.1rem; }
.edits .cta, .edits .ghost { width: 100%; }
.also { margin: .6rem 0 0; padding-left: 1.1rem; color: rgba(26,22,18,.78); }
.seats { list-style: none; padding: 0; display: grid; gap: .7rem; }
.seat-card { width: 100%; text-align: left; border: 0; border-radius: 16px; padding: 1rem; background: #2a241c; color: var(--bone); display: grid; gap: .2rem; }
.seat-card strong { font-size: 1.15rem; }
.seat-card em { color: var(--ochre); font-style: normal; font-size: .85rem; }
.desk { display: grid; gap: 1.25rem; padding: 1rem 1.25rem 2.5rem; max-width: 72rem; margin: 0 auto; }
@media (min-width: 960px) { .desk { grid-template-columns: 1fr 1fr; } }
.hand { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.card { min-height: 7.5rem; width: 100%; border-radius: 16px; border: 0; padding: .9rem; background: #3a342c; color: var(--bone); display: flex; flex-direction: column; justify-content: space-between; text-align: left; }
.card.active { background: var(--ochre); color: var(--ink); }
.card.dim { opacity: .45; }
.why { color: var(--ochre); font-size: .75rem; }
.draft { list-style: none; padding: 0; }
.votes { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .4rem; }
.tour { position: fixed; inset: auto 0 0; padding: 1rem; display: flex; justify-content: center; pointer-events: none; }
.tour-card { pointer-events: auto; max-width: 32rem; width: 100%; }
.modal { position: fixed; inset: 0; background: rgba(10,8,6,.7); display: flex; align-items: flex-end; justify-content: center; padding: 1rem; }
@media (min-width: 640px) { .modal { align-items: center; } }
.dialog { max-width: 32rem; max-height: 88dvh; overflow: auto; }
.sealed { max-width: 36rem; margin: 0 auto; padding: 1.25rem; }
pre { font-family: ui-monospace, monospace; font-size: .8rem; white-space: pre-wrap; margin: .3rem 0 0; }
select { background: #1a1612; color: var(--bone); border-radius: 8px; padding: .4rem; }
.chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; margin: .3rem 0 0; }
.chip { border: 0; border-radius: 10px; padding: .45rem .7rem; background: #2a241c; color: var(--bone); box-shadow: inset 0 0 0 1px rgba(138,122,104,.35); font-family: system-ui, sans-serif; font-size: .85rem; }
.chip.mine { box-shadow: inset 0 0 0 1px rgba(196,161,90,.45); }
.chip.active { background: var(--ochre); color: var(--ink); }
.chip code { font-size: .65rem; opacity: .7; }
.filing { width: 100%; min-height: 9rem; border-radius: 14px; border: 0; padding: .8rem 1rem; background: var(--paper); color: var(--ink); font-family: ui-monospace, monospace; font-size: .9rem; line-height: 1.45; resize: vertical; }
.forecast { list-style: none; padding: .7rem 1rem; margin: .4rem 0 0; }
.forecast li { font-family: ui-monospace, monospace; font-size: .8rem; }
.forecast .ok { color: rgba(26,22,18,.75); }
.forecast .drop { color: #7a2e28; }
.pips { color: var(--ochre); font-family: ui-monospace, monospace; font-size: .78rem; }

/* Browser art pass: paper, charcoal clay, and an illustrated living watershed. */
:root { --bone: #eee4d0; --paper: #eee6d3; --ochre: #d2b579; --stone: #b6b09d; --water: #527f7a; }
body { background: radial-gradient(ellipse at 80% 0, #28352c 0, transparent 55%), #181f1b; }
button, a, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #e4bb6e; outline-offset: 4px; }
button { touch-action: manipulation; }
button:hover { filter: brightness(1.08); }
.top { max-width: 86rem; margin: auto; padding: 1.5rem 2rem; align-items: center; border-bottom: 1px solid #b6b09d26; }
.brand { display: flex; align-items: center; gap: 1.35rem; }
.wordmark { font-size: 2.1rem; letter-spacing: .19em; }
.brand-lineage { border-left: 1px solid #b6b09d40; padding-left: 1.3rem; font-size: .95rem; }
.season-status { text-align: right; }
.season-status .meta { margin: 0 0 .5rem; }
progress { display: block; width: 100%; height: 3px; appearance: none; border: 0; background: #394137; }
progress::-webkit-progress-bar { background: #394137; }
progress::-webkit-progress-value { background: var(--ochre); }
progress::-moz-progress-bar { background: var(--ochre); }
.layout { max-width: 86rem; padding: 2rem; gap: 2rem; align-items: start; }
.paper { border-radius: 3px 3px 12px 3px; padding: 2rem; background: radial-gradient(ellipse at 0 0, #fff9e9a0, transparent 80%), repeating-linear-gradient(93deg, transparent 0 6px, #71582d03 6px 7px), var(--paper); box-shadow: 0 14px 35px #0002, inset 0 0 0 1px #92794d35; }
.paper .kicker { color: #766039; }
.paper .meta, .paper .hint, .paper .quiet { color: #6b6455; }
.gazette-title { font-size: clamp(2.1rem, 3.1vw, 3.1rem); line-height: 1.05; font-weight: 400; letter-spacing: -.035em; margin: 1rem 0 .6rem; }
.gazette > .meta { padding-bottom: 1rem; border-bottom: 1px solid #76603955; font-variant-numeric: tabular-nums; }
.gazette blockquote { font-size: clamp(1.5rem, 2vw, 2rem); line-height: 1.35; margin: 1.6rem 0 1.2rem; }
.compact { font-size: 1rem; line-height: 1.8; }
.clay { background: #262e27; border: 1px solid #a59b7933; border-radius: 5px; }
.cta, .ghost { min-height: 44px; border-radius: 4px; font-size: .88rem; }
.cta { background: #d9bf86; color: #252a22; box-shadow: 0 3px 0 #0002; }
.text-btn { color: #d4c8ae; min-height: 44px; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #d4c8ae55; }
.map-column > .row { margin: -.5rem 0 .6rem; }
.river { height: auto; aspect-ratio: 600 / 680; border-radius: 5px; background: #a1aa80; border: 1px solid #d4c8ae40; box-shadow: 0 15px 40px #0003; isolation: isolate; }
.watershed-art { display: block; position: absolute; inset: 0; width: 100%; height: 100%; }
.land-contour { fill: none; stroke: #e4dcc2; stroke-width: 1.2; opacity: .28; }
.terrace-line { fill: none; stroke: #8c805e; stroke-width: 2; opacity: .65; }
.river-bank, .river-water, .river-dry, .river-current { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.river-bank { stroke: #d5ceaa; opacity: .9; }
.river-water { stroke: #548e89; }
.river-dry { stroke: #95856b; stroke-dasharray: 3 6; }
.river-current { stroke: #c6e0ce; stroke-dasharray: 3 18; animation: river-flow 5s linear infinite; opacity: .8; }
.river-preview .river-bank { stroke: #b06543; }
.river-preview .river-current { stroke: #ffe4b0; }
.river-reveal .river-water { animation: water-reveal 1.6s ease-out; }
.basin-marker { fill: #3a594f; stroke: #e7d8ad; stroke-width: 2; }
.map-compass { fill: #334e43; stroke: #334e43; stroke-width: 1.3; opacity: .75; }
.map-caption { position: absolute; top: 1rem; left: 1.15rem; color: #304c3f; font: .6rem system-ui, sans-serif; letter-spacing: .22em; }
.basin { min-width: 0; width: 26%; max-width: 9.7rem; padding: .3rem .4rem; text-align: center; background: #263e32e8; color: #fff3d9; border-radius: 3px; box-shadow: 0 3px 8px #23322225; }
button.basin { min-height: 44px; }
.basin.mine { box-shadow: inset 0 2px 0 var(--ochre), 0 3px 8px #23322225; }
.basin.sel { outline: 2px solid #fff0c9; outline-offset: 3px; }
.basin.ghost { background: #70422ded; box-shadow: inset 0 2px 0 #efb177; }
.halo { font-size: clamp(.78rem, 1.1vw, 1rem); text-shadow: none; }
.stats { font-family: system-ui, sans-serif; font-size: .65rem; line-height: 1.5; color: #f4ecd8; }
.stats.muted { opacity: 1; color: #c5cdbc; font-size: .6rem; }
.stats em { white-space: nowrap; }
.delta { font-family: system-ui, sans-serif; font-size: .6rem; color: #ffdaa0; }
.legend { font-size: .77rem; margin-bottom: .4rem; }
.river-key { display: block; margin-top: .3rem; }
.map-column > .hint { font-size: .78rem; margin-top: .35rem; }
.present { font: .75rem system-ui, sans-serif; gap: .5rem; margin-top: 1rem; }
.turn { padding-top: 1.2rem; border-top: 1px solid #b6b09d30; }
.turn .quiet { margin: 0; max-width: 37rem; }
.pick { max-width: 100rem; min-height: 100svh; display: grid; grid-template-columns: 1fr 1fr; padding: 0; }
.arrival { position: sticky; top: 0; height: 100svh; min-height: 650px; overflow: hidden; }
.arrival::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #16211a00 25%, #152019db 95%); }
.arrival-art { width: 100%; height: 100%; object-fit: cover; object-position: 46% 50%; }
.arrival-copy { position: absolute; bottom: 7%; left: 9%; right: 9%; z-index: 1; max-width: 28rem; }
.arrival-copy .kicker { color: #e2d6af; }
.arrival-copy h1 { font-size: clamp(5rem, 9vw, 9rem); letter-spacing: .16em; font-weight: 400; line-height: 1; margin: .8rem 0 1rem; }
.arrival-copy .arrival-line { font-size: clamp(1.6rem, 2.5vw, 2.5rem); line-height: 1.25; margin: .5rem 0; }
.arrival-copy > p:last-child { font-size: 1.05rem; color: #e1dfc9; line-height: 1.6; }
.choose-lineage { align-self: center; padding: 3rem clamp(1.5rem, 4vw, 5rem); }
.choose-lineage h2 { font-size: clamp(1.8rem, 3vw, 2.8rem); font-weight: 400; letter-spacing: -.03em; margin: .8rem 0; }
.lead { color: #b9c0af; line-height: 1.6; margin-bottom: 1.6rem; max-width: 30rem; }
.seats { gap: .65rem; }
.seat-card { position: relative; padding: .9rem 1rem .9rem 4rem; border-radius: 4px; background: #2c372d; border: 1px solid #a3ac8630; gap: .15rem; transition: background .2s, border-color .2s; }
.seat-card:hover { background: #374532; border-color: #d2b579; }
.lineage-mark { position: absolute; left: 1.1rem; top: 1.2rem; color: #d2b579; font-size: 1.8rem; font-family: Georgia, serif; }
.seat-card strong { font-size: 1.1rem; font-weight: 500; }
.seat-card em { font-size: .8rem; }
.seat-card > span:last-child { color: #bec7b7; font-size: .83rem; line-height: 1.4; }
.arrival-note { color: #a3ad9c; font: .7rem/1.7 system-ui, sans-serif; margin-top: 1.5rem; }
.desk { max-width: 86rem; padding: 2rem; gap: 2rem; }
.desk-side { background: #252e26; border: 1px solid #a59b7933; border-radius: 5px; padding: 1.5rem; align-self: start; }
.desk-side > .cta { width: 100%; margin-top: 1.2rem; }
.filing { border-radius: 3px; margin: .5rem 0 1.5rem; min-height: 12rem; }
.chips { gap: .5rem; margin: .8rem 0 1.2rem; }
.chip { min-height: 44px; border-radius: 4px; background: #344034; }
.chip.active { background: var(--ochre); }
.votes { margin-top: 1rem; }
.forecast.paper { box-shadow: none; }
.sealed { padding-top: 2rem; }
.sealed > h1 { font-weight: 400; font-size: 2.4rem; }
.sealed > ul { padding: 0; list-style: none; display: grid; gap: 1rem; }
.dialog, .tour-card { box-shadow: 0 10px 60px #0005; }
.tour { z-index: 5; }
.modal { z-index: 10; }
@keyframes river-flow { to { stroke-dashoffset: -42; } }
@keyframes water-reveal { 0% { stroke: #e6e8b2; } 100% { stroke: #548e89; } }
@media (min-width: 960px) {
  .layout { max-width: 78rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); grid-template-rows: auto 1fr; }
  .layout > .gazette { grid-column: 1; grid-row: 1; }
  .map-column { grid-column: 2; grid-row: 1 / 3; }
  .layout > .turn { grid-column: 1; grid-row: 2; display: flex; flex-direction: column; gap: 1rem; }
  .turn > .stack, .turn > button { width: 100%; }
  .desk { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
}
@media (max-width: 959px) { .layout { max-width: 46rem; } .desk { max-width: 46rem; } .halo { font-size: .92rem; } }
@media (max-width: 700px) {
  .pick { display: block; }
  .arrival { position: relative; height: 24rem; min-height: 0; }
  .arrival-copy { left: 1.5rem; bottom: 1.5rem; }
  .arrival-copy h1 { font-size: 5rem; margin: .5rem 0; }
  .arrival-copy > p:last-child { display: none; }
  .choose-lineage { padding: 2rem 1.25rem; }
  .top { padding: 1rem; gap: .6rem; align-items: flex-start; }
  .brand { display: block; }
  .wordmark { display: block; font-size: 1.65rem; }
  .brand-lineage { padding: 0; border: 0; font-size: .72rem; }
  .season-status { max-width: 12rem; }
  .season-status .meta { font-size: .72rem; line-height: 1.5; }
  .layout, .desk { padding: 1.25rem 1rem 2rem; gap: 1.5rem; }
  .paper { padding: 1.4rem; }
  .halo { font-size: .78rem; }
  .stats { font-size: .58rem; }
  .basin { padding: .25rem .15rem; }
  .delta { font-size: .52rem; }
  .desk-side { padding: 1rem; }
  .desk > div > .row { flex-wrap: wrap; }
  .stack { min-width: 0; }
  .turn .stack { margin-top: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (max-width: 360px) { .river { aspect-ratio: 600 / 900; } }

.colophon { margin-top: 1.2rem; padding-top: .8rem; border-top: 1px solid rgba(80,50,20,.15); color: #6b6455; font-size: .95rem; font-style: italic; }
.withheld { margin-top: 1.4rem; color: #7a2e28; }
.withheld-line { color: #5a3a32; font-size: 1.15rem; line-height: 1.45; margin: .3rem 0 0; }
.bound-water { margin-top: 1.2rem; padding-top: .8rem; border-top: 1px dashed rgba(80,50,20,.25); }
.bound-toc { background: #2a241c; border-radius: 8px; padding: 1rem 1.1rem; }
.bound-toc ol { list-style: none; padding: 0; margin: .7rem 0 0; display: grid; gap: .4rem; }
.bound-toc button { width: 100%; text-align: left; }
.bound-sheet.choice-bury { box-shadow: inset 4px 0 0 #8a7a68; }
.bound-sheet.choice-leak { box-shadow: inset 4px 0 0 #7a2e28; }
.bound-sheet.choice-print { box-shadow: inset 4px 0 0 #c4a15a; }
@media (min-width: 960px) {
  .bound-layout { grid-template-columns: 14rem 1fr; }
  .bound-layout .turn { grid-column: 1 / -1; }
}

.slips { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .7rem; }
.slip { background: #f7f0e2; border-radius: 4px; padding: .85rem 1rem; box-shadow: inset 0 0 0 1px #92794d35; }
.slip p { margin: 0 0 .6rem; color: #1a1612; line-height: 1.4; }
.slip-acts { display: flex; gap: .4rem; flex-wrap: wrap; }
.slip.is-head { box-shadow: inset 4px 0 0 #c4a15a; }
.slip.is-leak { box-shadow: inset 4px 0 0 #7a2e28; }
.source { margin: 1rem 0 0; padding: 1rem; background: #262e27; color: #e8dcc8; border-radius: 6px; }
.source .kicker { color: #d2b579; }
.source p { margin: .4rem 0 0; line-height: 1.45; }
.preview-sheet { margin-top: 1rem; }
.yesterday { color: #5a3a32; }
