/* Horizons: each workspace has a silhouette and rhythm suited to its decisions. */
.workspace-heading { margin:0 36px 24px 0; }
.workspace-heading>.eyebrow { color:#a74737; }
.workspace-heading p { max-width:800px; color:#687174; line-height:1.65; font-size:13px; }
.workspace-heading h2 { margin:8px 0 10px; }
.screen-cities,.screen-research,.screen-deck,.screen-council,.screen-empire,.screen-chronicle { width:min(1240px,100%); padding:28px; }
.screen-cities h3,.screen-research h3,.screen-deck h3,.screen-council h3,.screen-empire h3,.screen-chronicle h3 { font-family:Georgia,serif; font-weight:400; font-size:24px; margin:10px 0; }
.screen-cities p,.screen-deck p,.screen-council p,.screen-chronicle p { line-height:1.65; font-size:12px; }
.modal button:disabled { cursor:default; }
.modal nav button,.collection-toolbar button { border:0; background:transparent; color:#606b70; border-radius:14px; padding:11px 16px; font-size:12px; }
.modal nav button.active,.collection-toolbar button.active { background:#456a7b; color:#fffaf1; }
.modal nav button:hover:not(:disabled),.collection-toolbar button:hover:not(:disabled) { background:#d9e3e7; color:#294b5b; }
.modal .text-link { color:#a74737; border:0; padding:8px 0; text-align:left; background:none; font-size:11px; }
.modal .close-modal { z-index:4; }
.modal img { max-width:100%; }
.modal button strong,.modal button small { display:block; }
.modal .btn strong { display:inline; }
.modal select { max-width:100%; border:1px solid #c7cece; color:#354d57; padding:9px; background:#fffcf5; }
/* Cities: a map-side desk, portrait rail, settlement model and build queue. */
.backdrop-cities { justify-content:flex-end; background:#2c3b431d; backdrop-filter:blur(1px); }
.screen-cities { width:min(1030px,78vw); max-height:94dvh; }
.city-workspace { display:grid; grid-template-columns:145px minmax(240px,1fr) 255px; gap:22px; align-items:start; }
.city-rail { display:flex; flex-direction:column; gap:8px; }
.city-rail .city-portrait { padding:0 0 13px; text-align:left; overflow:hidden; border:1px solid transparent; background:#fffaf4; }
.city-portrait img { width:100%; height:86px; object-fit:cover; }
.city-portrait span { display:block; padding:10px 12px 0; }
.city-portrait strong { font-family:Georgia,serif; font-size:17px; }
.city-portrait small { margin-top:6px; font-size:10px; line-height:1.5; }
.city-rail .city-portrait.selected { border-color:#b25a44; background:#f4e7db; }
.city-rail>.btn { padding:10px; font-size:10px; }
.city-panorama { position:relative; height:215px; border-radius:70px 70px 24px 24px; overflow:hidden; background:#dbe2df; }
.city-panorama>img { width:100%; height:100%; object-fit:cover; }
.place-caption { position:absolute; bottom:12px; left:12px; right:12px; border-radius:16px; padding:9px; background:#fffaf0e8; text-align:center; font-size:9px; letter-spacing:1px; }
.city-vitals { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:20px 0; border-bottom:1px solid #ddd9cd; }
.city-vitals div>small { display:block; font-size:8px; letter-spacing:1px; color:#6a767a; }
.city-vitals strong { display:block; font-family:Georgia,serif; font-size:26px; margin:9px 0; }
.city-vitals span { display:block; font-size:9px; line-height:1.5; color:#737572; margin-top:5px; }
.built-strip { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0; }
.built-strip>span { display:flex; align-items:center; gap:5px; padding:6px 9px; border-radius:20px; background:#e7eae3; font-size:10px; }
.built-strip svg { width:13px; height:13px; }
.city-purpose>p,.hinterland>p { color:#687174; }
.city-role-options { display:grid; gap:7px; }
.city-role-options button { display:flex; gap:12px; align-items:flex-start; padding:13px; border:1px solid #ddd4c6; border-radius:16px; text-align:left; background:#fffaf2; color:#354c57; }
.city-role-options button>svg { width:25px; height:25px; flex-shrink:0; }
.city-role-options strong { font-size:12px; }
.city-role-options small { font-size:10px; line-height:1.55; margin-top:5px; }
.city-role-options em { display:block; font-size:10px; margin-top:5px; color:#a24738; }
.city-role-options button:disabled { opacity:.57; }
.role-benefits { display:flex; align-items:center; gap:12px; color:#456a7b; font-size:12px; padding:16px; background:#e5ecec; border-radius:16px; }
.hinterland { border-top:1px solid #ddd9cd; margin-top:22px; padding-top:10px; }
.hinterland>div { display:flex; flex-wrap:wrap; gap:8px; }
.resource-deposit { display:flex; align-items:center; gap:10px; padding:10px; border-radius:14px; border:1px solid #cbd5d6; background:#f3f6f4; color:#456a7b; text-align:left; }
.resource-deposit small { margin-top:4px; font-size:9px; }
.construction-desk { background:#e9eeec; border:1px solid #d4dedc; border-radius:24px; padding:20px; }
.construction-desk>.btn { width:100%; padding:10px; font-size:11px; margin-top:10px; }
.queue-total { font-size:11px; color:#456a7b; margin-top:10px; }
.building-catalogue { display:flex; flex-direction:column; margin-top:18px; }
.building-catalogue>button { display:flex; align-items:flex-start; gap:12px; background:transparent; border:0; border-top:1px solid #ccd8d5; text-align:left; padding:16px 0; color:#35535d; }
.building-catalogue svg { width:20px; height:20px; flex-shrink:0; }
.building-catalogue strong { font-size:12px; }
.building-catalogue small { font-size:10px; line-height:1.6; margin:6px 0; }
.building-catalogue em { font-style:normal; font-size:9px; color:#8b4f3e; }
.building-catalogue button:disabled { opacity:.48; }
/* Research: a continuous atlas with branching paths and a fixed discovery lens. */
.screen-research { background:#eef2f0; }
.research-workspace { display:grid; grid-template-columns:minmax(0,1fr) 265px; gap:24px; }
.research-map-scroll { overflow:auto; max-height:55dvh; min-height:300px; border:1px solid #cbd8d8; border-radius:24px; cursor:grab; background:radial-gradient(#b8c9c986 1px,transparent 1px) 0 0/20px 20px,#f8faf6; scrollbar-width:thin; }
.research-map-scroll:active { cursor:grabbing; }
.research-map { position:relative; width:1010px; height:640px; }
.research-links { position:absolute; inset:0; width:1010px; height:640px; pointer-events:none; }
.research-links path { fill:none; stroke:#b8c9ce; stroke-width:2; }
.research-links path.traced { stroke:#b9503c; stroke-width:3; }
.discovery-node { position:absolute; width:182px; height:96px; padding:13px 12px 10px 47px; text-align:left; border:1px solid #c7d4d3; border-radius:18px; background:#fffdf8; color:#3e5962; box-shadow:0 5px 15px #2e474b0a; }
.discovery-node>svg { position:absolute; left:13px; top:19px; width:24px; height:24px; }
.discovery-node strong { font-family:Georgia,serif; font-size:15px; font-weight:400; }
.discovery-node small { font-size:8px; letter-spacing:.6px; line-height:1.4; margin-top:8px; }
.discovery-node.locked { background:#e9efec; color:#7a898b; border-style:dashed; }
.discovery-node.complete { background:#dbe9e7; border-color:#b7cfcb; }
.discovery-node.researching { border:2px solid #456a7b; }
.discovery-node.selected { outline:3px solid #c86b534d; border-color:#b9503c; }
.discovery-detail { padding:6px 0; }
.discovery-detail>svg { display:block; width:48px; height:48px; padding:10px; color:#456a7b; background:#dae6e7; border-radius:50%; margin-bottom:18px; }
.discovery-detail p { font-size:12px; line-height:1.7; color:#657277; }
.discovery-detail dl { display:grid; grid-template-columns:1fr 1fr; font-size:11px; line-height:2.4; margin:20px 0; }
.discovery-detail dd { margin:0; text-align:right; font-weight:600; }
.discovery-detail>.btn { width:100%; }
.research-reward { display:flex; align-items:center; gap:12px; border-top:1px solid #d2dbd7; padding-top:17px; }
.research-reward img { width:62px; height:70px; object-fit:cover; border-radius:15px; }
.research-reward small,.research-reward strong { display:block; font-size:9px; line-height:1.7; }
.research-reward strong { font-family:Georgia,serif; font-size:15px; font-weight:400; }
.research-current { display:flex; gap:20px; align-items:center; border-top:1px solid #cdd9d7; margin-top:23px; padding-top:20px; }
.research-current>div { flex:1; min-width:80px; }
.research-current small,.research-current strong { display:block; font-size:10px; margin:4px 0; }
.research-current strong { font-family:Georgia,serif; font-size:17px; font-weight:400; }
.tree-legend { font-size:10px; color:#748486; }
/* Deck: an illustrated collection, with a tall card workbench. */
.screen-deck { background:radial-gradient(at 0 0,#f2e5db,transparent 65%),#f8f3eb; }
.collection-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:24px; }
.collection-toolbar nav { display:flex; gap:4px; padding:5px; background:#e7dfd3; border-radius:19px; }
.collection-toolbar label { font-size:11px; color:#6b7375; }
.collection-toolbar select { margin-left:8px; }
.deck-workspace { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:28px; align-items:start; }
.collection-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:18px; align-items:start; }
.collection-card { position:relative; text-align:left; border:1px solid #d9cdbb; background:#fffcf5; border-radius:20px; padding:0 0 16px; overflow:hidden; box-shadow:0 6px 15px #443c300e; color:#3b4649; }
.collection-card>img { width:100%; height:132px; object-fit:cover; }
.collection-card>.eyebrow { display:block; font-size:8px; padding:13px 14px 6px; color:#9c5140; }
.collection-card>strong { font-family:Georgia,serif; font-size:20px; font-weight:400; padding:0 14px; }
.collection-card>small { padding:9px 14px; font-size:10px; line-height:1.6; min-height:65px; }
.collection-card>em { padding:0 14px; font-size:9px; font-style:normal; color:#788383; }
.collection-card.selected { border-color:#b9513e; outline:3px solid #c86b5326; transform:translateY(-3px); }
.collection-cost { display:flex; align-items:center; justify-content:center; position:absolute; left:10px; top:10px; gap:4px; border-radius:20px; background:#fffaf0e8; padding:7px 10px; font-size:12px; }
.collection-cost svg { width:14px; height:14px; }
.card-workbench { background:#e9e1d5; border:1px solid #d6cbbb; padding:22px; border-radius:28px; }
.workbench-art { width:100%; height:175px; object-fit:cover; border-radius:70px 70px 18px 18px; margin-bottom:20px; }
.card-workbench>.btn { width:100%; padding:10px; }
.card-workbench-stats { display:flex; justify-content:space-between; margin:18px 0; font-size:11px; color:#7a5a4b; }
.workbench-upgrades { border-top:1px solid #d1c5b6; margin-top:24px; padding-top:10px; }
.workbench-upgrades h4 { font-size:12px; line-height:1.6; }
.workbench-upgrades p { color:#7d756b; font-size:10px; }
.workbench-upgrades .specialisation-option { width:100%; margin-bottom:8px; }
.card-workbench .retire-selection { margin-top:18px; color:#a04435; font-size:10px; }
.collection-combos { display:flex; align-items:center; gap:24px; border-top:1px solid #d9cdbb; padding-top:20px; margin-top:25px; }
.collection-combos>span { font-size:10px; }
.collection-combos strong,.collection-combos em { display:block; font-size:10px; line-height:1.8; }
.collection-combos em { color:#a74737; font-style:normal; }
/* Diplomacy: a portrait audience, with proposals on a separate table. */
.screen-council { background:#f2f1ed; }
.council-tabs { display:flex; gap:8px; padding-right:35px; margin-bottom:25px; }
.diplomacy-workspace { display:grid; grid-template-columns:125px minmax(260px,1fr) 300px; gap:26px; align-items:start; }
.leader-rail { display:flex; flex-direction:column; gap:18px; }
.leader-rail>button { padding:0!important; text-align:left; }
.leader-rail img { width:100%; height:130px; object-fit:cover; object-position:50% 25%; border-radius:60px 60px 20px 20px; border:3px solid transparent; }
.leader-rail .selected img { border-color:#b95643; }
.leader-rail strong { font-family:Georgia,serif; font-size:17px; font-weight:400; margin:10px 0 6px; }
.leader-rail small { font-size:8px; }
.leader-scene { position:relative; height:340px; overflow:hidden; border-radius:120px 120px 26px 26px; background:#cad4d4; }
.leader-scene>img { width:100%; height:100%; object-fit:cover; object-position:50% 28%; }
.leader-scene>div { position:absolute; bottom:0; left:0; right:0; padding:50px 24px 18px; color:#fffaf0; background:linear-gradient(transparent,#203c4ce6); }
.leader-scene .eyebrow { font-size:8px; color:#eee3cc; }
.leader-scene h3 { font-size:32px; color:#fffaf0; margin:10px 0 0; }
.leader-scene p { font-size:11px; margin:8px 0 0; color:#e1e9e7; }
.leader-statement { padding:25px 8px 15px; }
.leader-statement>.eyebrow { color:#a74737; }
.leader-statement>p { font-family:Georgia,serif; font-size:19px; line-height:1.6; color:#3b5662; }
.leader-statement ul { padding-left:17px; font-size:11px; color:#6b7779; line-height:1.8; }
.diplomatic-memory { border-top:1px solid #d6d7ce; padding:15px 8px; }
.diplomatic-memory h4 { font-family:Georgia,serif; font-size:19px; font-weight:400; }
.diplomatic-memory small { display:block; font-size:9px; color:#a35947; margin:8px 0; }
.negotiation-table { border-radius:26px; padding:22px; background:#fffaf2; box-shadow:0 10px 30px #344a4b0d; }
.negotiation-table>.btn,.negotiation-option>.btn { width:100%; font-size:11px; padding:10px; }
.negotiation-option { border-top:1px solid #dcd6ca; padding:20px 0 4px; margin-top:18px; }
.negotiation-option h4 { font-family:Georgia,serif; font-size:20px; font-weight:400; margin:0 0 14px; }
.negotiation-option label { display:block; margin-bottom:10px; color:#6e777a; font-size:10px; }
.negotiation-option select { display:block; width:100%; margin-top:6px; }
.negotiation-option p { font-size:11px; }
.envoy-request { border-left:3px solid #b45d43; padding-left:12px; }
.treaty-pill { background:#e2eae5; padding:12px; border-radius:13px; }
.negotiation-table .declare-war { margin-top:24px; color:#a64a3c; }
.world-race>section { margin-bottom:30px; }
.world-race>section>h3 { border-bottom:1px solid #d3d9d6; padding-bottom:16px; }
.world-race h3>small { font-family:Arial,sans-serif; font-size:11px; color:#798486; }
/* Empire: decisions first, then a compact economy and the three victory races. */
.desk-toolbar { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:24px; }
.desk-toolbar .btn { padding:9px 12px; font-size:10px; }
.victory-alerts { display:grid; gap:8px; margin-bottom:24px; }
.victory-alerts button { border:1px solid #dcad96; border-radius:16px; padding:16px; text-align:left; color:#8b3e2d; background:#fae7d9; }
.victory-alerts span { display:block; font-size:11px; line-height:1.7; margin-top:5px; }
.planning-top { display:grid; grid-template-columns:1.5fr 1fr; gap:28px; }
.decision-list { margin-top:14px; }
.decision-list button,.ready-roster button { width:100%; display:flex; align-items:center; gap:15px; background:transparent; border:0; border-top:1px solid #deddd4; padding:16px 0; color:#405a63; text-align:left; }
.decision-list button>span,.ready-roster button>span { flex:1; }
.decision-list button>svg,.ready-roster button>svg { width:20px; height:20px; flex-shrink:0; }
.decision-list strong { font-family:Georgia,serif; font-weight:400; font-size:19px; }
.decision-list small { line-height:1.6; font-size:11px; margin-top:5px; color:#738080; }
.ready-roster { border-radius:22px; background:#e7edeb; padding:20px; }
.ready-roster button { border-color:#d0dbd7; }
.ready-roster strong { font-size:12px; }
.ready-roster small { font-size:10px; margin-top:7px; }
.ready-roster>.eyebrow { display:block; margin-bottom:15px; }
.ready-roster p { font-size:12px; line-height:1.7; color:#768583; }
.economy-desk,.victory-desk { margin-top:30px; }
.economy-desk>div { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:16px; }
.economy-desk article { padding:17px; border-radius:18px; border:1px solid #d6dcd7; background:#fcfbf5; }
.economy-desk article>small { display:block; font-size:9px; letter-spacing:1px; color:#6c7c7e; }
.economy-desk article>strong { display:block; font-family:Georgia,serif; font-size:33px; font-weight:400; margin:8px 0; }
.economy-desk article>span { font-size:11px; color:#456a7b; }
.income-spark { width:100%; height:42px; margin-top:12px; overflow:visible; }
.income-spark polyline { stroke:#648b99; stroke-width:2; fill:none; }
.economy-desk article>.spark-empty { display:block; margin-top:15px; font-size:9px; color:#8b9695; line-height:1.5; }
.victory-progress-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:16px; }
.victory-progress-cards article { border-top:3px solid #c4775c; background:#eee8de; border-radius:4px 4px 20px 20px; padding:20px; }
.victory-progress-cards article:nth-child(2) { border-color:#648a9a; background:#e5edeb; }
.victory-progress-cards article:nth-child(3) { border-color:#9293ac; background:#e9e7ee; }
.victory-progress-cards h3 { font-size:22px; min-height:52px; }
.victory-progress-cards p { font-size:11px; color:#747d7b; line-height:1.7; }
.milestone-ticks { display:flex; justify-content:space-between; font-size:8px; color:#8b908b; margin:7px 0; }
/* Chronicle: dated chapters with illustrations and a field journal in the margin. */
.screen-chronicle { background:#f8f2e6; }
.chronicle-filters { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:26px; }
.chronicle-filters button { text-transform:capitalize; }
.chronicle-workspace { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:38px; }
.history-turn { display:grid; grid-template-columns:65px 1fr; gap:20px; }
.history-date { position:relative; border-right:1px solid #d9cdbb; padding:4px 18px 25px 0; color:#a46c50; }
.history-date::after { content:''; position:absolute; width:9px; height:9px; right:-5px; top:12px; border-radius:50%; background:#c98565; border:2px solid #f8f2e6; }
.history-date small { font-size:8px; letter-spacing:1px; }
.history-date strong { display:block; font-family:Georgia,serif; font-weight:400; font-size:32px; }
.history-event { display:flex; gap:16px; align-items:flex-start; border-bottom:1px solid #e5daca; padding:8px 0 18px; margin-bottom:18px; }
.history-event>svg { width:20px; height:20px; flex-shrink:0; color:#9c866c; }
.history-event img { width:105px; height:90px; object-fit:cover; border-radius:18px; }
.history-event>div { flex:1; }
.history-event small { font-size:8px; letter-spacing:1px; color:#9e7d60; }
.history-event p { margin:6px 0; color:#68716b; }
.history-event.major p { font-family:Georgia,serif; font-size:18px; color:#4b5754; }
.chronicle-margin { border-left:1px solid #d9cdbb; padding-left:28px; }
.chronicle-margin article { padding:15px 0; border-bottom:1px solid #d9cdbb; }
.chronicle-margin article>small { font-size:9px; color:#9b8066; }
.chronicle-margin h4 { font-size:13px; line-height:1.6; margin:10px 0; }
.chronicle-margin article>span { display:block; font-size:10px; line-height:1.8; color:#76796f; }
.chronicle-margin>.btn { margin-top:20px; font-size:10px; }
/* Settings remains a quiet utility sheet; turn reports become a narrow recap drawer. */
.screen-settings { width:min(760px,100%); }
.settings-tabs { display:flex; gap:5px; background:#e6e9e4; border-radius:19px; padding:5px; margin:25px 0; }
.settings-tabs>button { flex:1; text-transform:capitalize; }
.settings-content { min-height:250px; }
.settings-content>.settings-row:first-child { border-top:0; }
.settings-content h3 { font-family:Georgia,serif; font-size:23px; font-weight:400; margin:26px 0 10px; }
.keyboard-reference { font-size:12px; line-height:2.4; color:#6a7779; padding-top:20px; }
.backdrop-turn-report { justify-content:flex-end; background:#28333830; backdrop-filter:blur(3px); }
.screen-turn-report { width:510px; max-height:96dvh; border-radius:30px 8px 8px 30px; }
.screen-turn-report .report-income { grid-template-columns:repeat(3,1fr); }
.screen-turn-report .report-sections { display:block; }
.screen-turn-report .report-sections>section { background:transparent; border:0; border-top:1px solid #d4dcd4; border-radius:0; margin-top:18px; padding:18px 0; }
.screen-turn-report>.btn { width:100%; }
/* Exploration is a story spread with choices, and combat is an explicit calculation. */
.screen-encounter { width:min(1050px,100%); padding:0; overflow:hidden; }
.encounter-workspace { display:grid; grid-template-columns:40% 1fr; max-height:90dvh; overflow:auto; }
.encounter-scene { position:relative; min-height:600px; background:#d4dfd9; }
.encounter-scene img { width:100%; height:100%; object-fit:cover; }
.encounter-scene>.eyebrow { position:absolute; bottom:25px; left:20px; right:20px; background:#fff8ebde; border-radius:20px; padding:14px; text-align:center; font-size:9px; }
.encounter-workspace>section { padding:35px; }
.encounter-workspace .workspace-heading { margin-bottom:20px; }
.encounter-workspace .workspace-heading h2 { font-size:34px; }
.encounter-choices { display:grid; gap:12px; }
.encounter-choices>button { display:flex; align-items:center; gap:14px; padding:18px; border-radius:18px; border:1px solid #d7caba; background:#fffcf6; color:#435d62; text-align:left; }
.encounter-choices>button:disabled { opacity:.48; }
.encounter-choices>button>svg { width:21px; height:21px; flex-shrink:0; }
.encounter-choices>button>span { flex:1; }
.encounter-choices strong { font-family:Georgia,serif; font-size:20px; font-weight:400; }
.encounter-choices small { font-size:11px; line-height:1.7; margin-top:7px; }
.encounter-choices em { display:block; font-size:10px; color:#a6503c; margin-top:6px; }
.encounter-footer { display:flex; gap:8px; flex-wrap:wrap; margin-top:20px; }
.encounter-footer .btn { padding:10px; font-size:11px; }
.encounter-tabs { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:20px; }
.combat-modifiers { background:#e9eeeb; border-radius:18px; padding:20px; margin-bottom:22px; }
.combat-modifiers h3 { font-family:Georgia,serif; font-size:22px; font-weight:400; margin:0 0 12px; }
.combat-modifiers>div { display:flex; justify-content:space-between; gap:15px; font-size:12px; padding:7px 0; }
.combat-modifiers p { font-size:10px; color:#76827d; margin:12px 0 0; }
.resource-inspection { border:1px solid #cbd9d8; border-radius:14px; background:#e7efec; padding:12px; margin-top:16px; }
.resource-inspection strong { display:flex; align-items:center; gap:6px; font-size:11px; color:#456a7b; }
.resource-inspection svg { width:16px; height:16px; }
.resource-inspection p { margin:8px 0 0; font-size:10px; line-height:1.6; }
.race-chip { border-color:#c78a71; background:#fff0e3; }
.encounter-chip { border-color:#93adb1; }
@media(max-width:1100px){
  .screen-cities { width:100%; }
  .city-workspace { grid-template-columns:125px minmax(220px,1fr) 235px; gap:16px; }
  .diplomacy-workspace { grid-template-columns:100px minmax(240px,1fr) 260px; gap:18px; }
  .deck-workspace { grid-template-columns:minmax(0,1fr) 270px; gap:20px; }
  .collection-grid { grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); gap:12px; }
  .collection-combos { flex-wrap:wrap; gap:14px; }
}
@media(max-width:800px){
  .modal-backdrop { padding:12px; }
  .screen-cities,.screen-research,.screen-deck,.screen-council,.screen-empire,.screen-chronicle { padding:24px; }
  .city-workspace { grid-template-columns:minmax(0,1fr) 240px; }
  .city-rail { grid-column:1/-1; flex-direction:row; overflow:auto; padding:3px; }
  .city-rail .city-portrait { display:flex; align-items:center; min-width:180px; padding:0; }
  .city-portrait img { width:60px; height:70px; }
  .city-portrait span { padding:10px; }
  .city-portrait strong { font-size:15px; }
  .city-portrait small { font-size:9px; }
  .city-rail>.btn { flex-shrink:0; }
  .research-workspace { grid-template-columns:minmax(0,1fr) 230px; gap:18px; }
  .tree-legend { display:none; }
  .diplomacy-workspace { grid-template-columns:1fr 260px; }
  .leader-rail { grid-column:1/-1; flex-direction:row; }
  .leader-rail>button { display:flex; align-items:center; gap:12px; }
  .leader-rail img { width:55px; height:65px; border-radius:25px; }
  .leader-rail strong { font-size:16px; }
  .leader-rail small { text-align:left; }
  .leader-scene { height:310px; }
  .economy-desk>div { grid-template-columns:repeat(3,1fr); }
  .chronicle-workspace { grid-template-columns:minmax(0,1fr) 220px; gap:20px; }
  .chronicle-margin { padding-left:18px; }
  .encounter-workspace { grid-template-columns:32% 1fr; }
  .encounter-workspace>section { padding:25px; }
}
@media(max-width:600px){
  .screen-cities,.screen-research,.screen-deck,.screen-council,.screen-empire,.screen-chronicle { padding:24px 18px; max-height:94dvh; }
  .workspace-heading { margin-right:20px; }
  .workspace-heading h2 { font-size:30px; line-height:1.15; }
  .workspace-heading p { font-size:12px; }
  .modal .close-modal { top:13px; right:12px; width:32px; height:32px; }
  .city-workspace,.research-workspace,.deck-workspace,.diplomacy-workspace,.planning-top,.chronicle-workspace { display:flex; flex-direction:column; gap:22px; }
  .city-rail,.city-place,.construction-desk,.discovery-detail,.collection-grid,.card-workbench,.leader-rail,.leader-audience,.negotiation-table,.planning-top>section,.ready-roster,.history-timeline,.chronicle-margin { width:100%; min-width:0; }
  .city-rail { flex-direction:row; }
  .city-panorama { height:200px; }
  .city-vitals { gap:8px; }
  .city-role-options strong { font-size:13px; }
  .city-role-options small { font-size:11px; }
  .construction-desk { padding:20px; }
  .building-catalogue small { font-size:11px; }
  .research-map-scroll { width:100%; min-height:300px; max-height:370px; }
  .discovery-detail { padding:16px; background:#e3ebe8; border-radius:20px; }
  .discovery-detail>svg { float:left; margin:0 15px 12px 0; }
  .discovery-detail>.eyebrow { font-size:8px; }
  .discovery-detail h3 { font-size:24px; }
  .discovery-detail p { clear:both; }
  .research-current { gap:12px; flex-wrap:wrap; }
  .research-current>div { min-width:140px; }
  .collection-toolbar { display:block; }
  .collection-toolbar nav { margin-bottom:14px; }
  .collection-toolbar button { padding:10px 12px; font-size:10px; flex:1; }
  .collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .collection-card>img { height:110px; }
  .collection-card>strong { font-size:18px; padding:0 12px; }
  .collection-card>small { padding:8px 12px; font-size:10px; }
  .collection-card>em { padding:0 12px; font-size:8px; }
  .card-workbench { padding:20px; }
  .workbench-art { height:180px; }
  .collection-combos { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
  .collection-combos>.eyebrow { grid-column:1/-1; }
  .council-tabs { gap:4px; margin-right:12px; padding:0; }
  .council-tabs>button { padding:10px; font-size:10px; }
  .leader-rail { gap:12px; }
  .leader-rail>button { flex:1; gap:8px; }
  .leader-rail img { width:42px; height:55px; }
  .leader-rail strong { font-size:14px; }
  .leader-rail small { font-size:7px; }
  .leader-scene { height:330px; border-radius:100px 100px 24px 24px; }
  .negotiation-table { padding:22px; }
  .decision-list strong { font-size:18px; }
  .economy-desk>div { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .economy-desk article { padding:14px; }
  .economy-desk article:last-child { grid-column:1/-1; }
  .victory-progress-cards { grid-template-columns:1fr; gap:12px; }
  .victory-progress-cards h3 { min-height:0; }
  .chronicle-filters { gap:3px; }
  .chronicle-filters button { padding:8px 10px!important; font-size:10px!important; }
  .history-turn { grid-template-columns:42px 1fr; gap:12px; }
  .history-date { padding-right:9px; }
  .history-date strong { font-size:27px; }
  .history-event { gap:10px; flex-wrap:wrap; }
  .history-event img { width:75px; height:72px; }
  .history-event.major p { font-size:16px; }
  .history-event>div { min-width:130px; }
  .chronicle-margin { border-left:0; border-top:1px solid #d9cdbb; padding:22px 0 0; }
  .screen-settings { padding:25px 18px; }
  .settings-tabs { gap:2px; padding:4px; }
  .settings-tabs>button { padding:10px 7px!important; font-size:10px!important; }
  .settings-content .settings-row { flex-wrap:wrap; gap:14px; }
  .settings-content .settings-row>span { flex:1; min-width:170px; }
  .settings-content .settings-row select { width:100%; }
  .screen-turn-report { width:100%; border-radius:24px; padding:26px 20px; }
  .screen-encounter { max-height:94dvh; border-radius:24px; }
  .encounter-workspace { display:block; max-height:94dvh; }
  .encounter-scene { min-height:0; height:200px; }
  .encounter-scene>img { object-position:center 45%; }
  .encounter-scene>.eyebrow { bottom:12px; padding:10px; font-size:8px; }
  .encounter-workspace>section { padding:22px 18px; }
  .encounter-workspace .workspace-heading h2 { font-size:29px; }
  .encounter-choices>button { padding:15px 12px; gap:10px; }
  .encounter-choices strong { font-size:18px; }
  .encounter-choices small { font-size:11px; }
}