/* Seshat 1929: distinct districts, compact status rail, built plots and mobile sheets. */
.topbar{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:48px 38px;align-items:center;gap:2px 16px;min-height:0;padding:4px 14px 6px;background:#081f28;border-bottom:1px solid #a47e4f;z-index:30}
.brand{grid-column:1;grid-row:1;min-width:0;gap:7px}.brand-mark{font-size:44px}.brand strong{font-size:19px}.brand small{font-size:9px}.headline{grid-column:2;grid-row:1;min-width:0;text-align:left}.headline span{font-size:clamp(23px,2vw,32px);line-height:1}.headline small{font-size:10px;letter-spacing:2px}.top-actions{grid-column:3;grid-row:1;justify-content:flex-end}
.resource-strip{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:0;min-width:0;padding:3px 6px;border-top:1px solid #b894603c;background:#10334058}
.resource-chip{display:flex;align-items:center;gap:5px;flex:0 1 auto;min-width:0;padding:2px 7px;background:transparent;border:0;border-right:1px solid #bd986352;border-radius:0;box-shadow:none;white-space:nowrap}.resource-chip:last-child{border-right:0}.resource-chip .res-label{font-size:12px;color:#e5d8bc}.resource-chip b{font-size:17px;color:#fff0cb}.resource-chip small{display:none}.resource-chip.full b{color:#f3b1a1}.resource-chip:hover{background:#b98f4a24}
.top-actions button{white-space:nowrap}.account-button,.resource-toggle{border:1px solid #b7925c;background:#174354;color:#f9e4b7;border-radius:20px;padding:5px 11px;font:700 12px 'Nunito Sans',sans-serif}.resource-toggle{display:none}.save-indicator{font-size:10px;border:0;background:transparent}.icon-button{width:29px;height:29px;border-radius:50%}
.play-area{grid-template-columns:minmax(0,1fr) 320px}.city-scene{min-height:560px;background:#665d45}.city-art{object-fit:cover;object-position:center;transition:opacity .22s ease}.scene-vignette{background:linear-gradient(180deg,#071c2444,transparent 18%,transparent 80%,#06151c65)}
.district-tabs{gap:0;padding:3px 12px;background:#092d38;border-bottom:1px solid #bc9861}.district-tabs button{border:0;border-radius:20px;background:transparent;color:#e7d5b5;padding:5px 15px;min-width:0;flex:0 1 auto;font-size:13px}.district-tabs button.active{background:#e4c28b;color:#183336;border:0}.district-tabs button:hover:not(.active){background:#ffffff22}
.location{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:110px;min-height:96px;padding:0;transform:translate(-50%,-50%);background:none;border:0;border-radius:0;box-shadow:none;color:#fff1d7;text-transform:none;white-space:normal;font:700 11px 'Barlow Condensed',sans-serif;letter-spacing:.1px;text-align:center;text-shadow:0 1px 3px #000}
.location:not(.locked),.location.building{width:150px;min-height:121px;font-size:13px}.location:not(.locked) .building-art,.location.building .building-art{height:105px}.location:not(.locked) .location-name{padding:4px 9px;border-radius:15px;background:#082e3eeb;box-shadow:0 3px 9px #06151caa}.location.locked{width:86px;min-height:76px}
.location:hover,.location.selected{background:none;border:0;box-shadow:none;filter:brightness(1.15)}.location:focus-visible{outline:2px solid #ffe0a7;border-radius:7px}.location.locked{color:#e5dbc3;opacity:.72}.location.locked:hover{opacity:1}.building-art{display:block;width:100%;height:78px;overflow:visible;filter:drop-shadow(0 4px 3px #08151888)}.location-name{display:block;max-width:100%;padding:3px 6px;background:#062531d9;border:1px solid #d1a765;border-radius:12px;line-height:1.05;box-shadow:0 2px 5px #06151c88}.location.locked .location-name{border-style:dashed}.location .pin-status{color:#a6e8a8}.location.building .building-art{animation:build-bob 1.1s ease-in-out infinite alternate}.location.building .location-name{background:#765433ee}.location.building:after{content:'';position:absolute;bottom:18px;left:16%;height:3px;width:var(--progress,0%);max-width:68%;background:#ffe294;box-shadow:0 0 8px #ffcb6a}@keyframes build-bob{to{transform:translateY(-3px)}}
.scene-topline{font-size:11px}.scene-banner{border-radius:18px;padding:5px 11px;background:#092633d7;font-size:13px}.city-bottom{min-height:70px;padding:7px 11px;border-top:1px solid #b28b54}.city-motto{display:none}.main-actions{width:100%}.main-actions button{min-height:50px;border-width:1px;border-radius:18px;box-shadow:none;font-size:clamp(12px,1.2vw,17px)}.main-actions button span{font-size:21px}.side-panel{border-left:1px solid #bd9967;max-height:calc(100svh - 130px);box-shadow:-4px 0 18px #07101866}.card{border-radius:16px;background:#113843;border-color:#91734c}.panel-head{min-height:43px}
.modal-overlay{position:fixed;inset:0;z-index:45;display:grid;place-items:center;padding:18px;background:#05151ddb}.modal-overlay.hidden{display:none}.account-modal{position:relative;width:min(440px,100%);max-height:90svh;overflow:auto;padding:25px;background:#0b2d39;border:2px solid #c6a16a;border-radius:15px;box-shadow:0 20px 60px #000b}.account-modal h2{font:700 28px Georgia,serif;margin:8px 0 10px}.account-modal p{line-height:1.45}.account-modal label{display:block;margin:10px 0 4px;font-size:12px;font-weight:800}.account-modal input{width:100%;height:42px;padding:8px;background:#f2e8d8;color:#092b35;border:1px solid #b98d52;border-radius:6px}.account-modal button:not(.modal-close){display:block;width:100%;min-height:40px;margin-top:10px;padding:7px 10px;border:1px solid #e1be79;border-radius:8px;background:#dfbb7c;color:#132c33;font-weight:800}.account-modal button.secondary{background:#143b48;color:#f5e5c9}.account-modal button:disabled{opacity:.55}.account-divider{text-align:center;margin:11px 0 -5px;color:#cbbd9e}.modal-close{position:absolute;right:12px;top:9px;border:0;background:transparent;color:#f4e4c8;font-size:27px}.account-entry{background:#d9af68!important;color:#0c2931!important}.account-modal #accountMessage{min-height:1.2em;color:#f9cf95;font-size:12px}.start-card{border-radius:14px}.start-card .account-entry{margin:10px 0 3px}.start-card #startButton{background:#1e5362;color:#f2e8d4;border-color:#87a6a6;margin-top:9px}
@media(max-width:1100px){.topbar{grid-template-columns:auto 1fr auto}.headline small{display:none}.resource-chip{padding:2px 4px;grid-template-columns:23px minmax(0,1fr)}.resource-chip .res-icon{font-size:18px}.resource-chip .res-label{font-size:9px}.resource-chip b{font-size:13px}.resource-chip small{font-size:8px}.city-motto{display:none}.play-area{grid-template-columns:minmax(0,1fr) 280px}}
@media(max-width:900px){.topbar{display:flex;flex-wrap:nowrap;min-height:52px;gap:7px;padding:5px 9px;position:relative}.brand{flex:1;min-width:0}.brand-mark{font-size:34px}.brand strong{font-size:15px}.brand small{font-size:8px}.headline{display:none}.top-actions{flex:0 0 auto;gap:4px}.top-actions .save-indicator{display:none}.account-button{padding:5px 8px}.resource-toggle{display:block;padding:5px 8px}.resource-strip{display:none;position:absolute;z-index:20;top:100%;right:7px;left:7px;max-height:60svh;overflow:auto;padding:12px;background:#082733;border:1px solid #d2a96b;border-radius:0 0 13px 13px;box-shadow:0 10px 24px #0009;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.topbar.resources-open .resource-strip{display:grid}.resource-chip{border:1px solid #8e794e66;border-radius:8px;padding:6px 8px;justify-content:space-between}.resource-chip .res-label{font-size:12px}.resource-chip b{font-size:17px}.resource-chip small{display:none}.play-area{display:block}.city-column{height:calc(100svh - 52px)}.district-tabs{height:40px;padding:4px 8px;justify-content:space-around}.district-tabs button{font-size:12px;padding:5px 10px}.city-scene{min-height:0;aspect-ratio:auto;flex:1}.city-art{object-fit:cover;object-position:center}.city-bottom{height:67px;min-height:67px;padding:6px}.main-actions{gap:4px;overflow-x:auto}.main-actions button{font-size:11px;min-width:65px;min-height:53px;padding:3px}.main-actions button span{display:block;font-size:17px}.side-panel{display:none;position:fixed;z-index:12;left:0;right:0;bottom:0;height:min(68svh,630px);min-height:0;max-height:none;border:1px solid #d1a569;border-radius:20px 20px 0 0;box-shadow:0 -10px 35px #000a}.shell.panel-open .side-panel{display:flex}.panel-head{min-height:48px}.panel-content{padding:15px;overscroll-behavior:contain}.statusbar{display:none}.scene-topline{font-size:9px;top:5px;left:6px;right:6px}.scene-banner{left:6px;bottom:5px;max-width:90%;font-size:11px}.location{width:77px;min-height:72px;font-size:9px}.building-art{height:55px}.location:not(.locked),.location.building{width:100px;min-height:84px;font-size:10px}.location:not(.locked) .building-art,.location.building .building-art{height:72px}.location-name{padding:2px 4px;max-width:84px}.location.building:after{bottom:14px}}
@media(max-width:480px){.brand strong{font-size:13px}.brand small{font-size:7px}.brand-mark{font-size:30px}.icon-button{display:none}.account-button{font-size:11px}.resource-toggle{font-size:11px}.district-tabs button{font-size:11px;padding:5px 7px}.location{width:63px;min-height:61px;font-size:8px}.building-art{height:45px}.location:not(.locked),.location.building{width:74px;min-height:65px;font-size:9px}.location:not(.locked) .building-art,.location.building .building-art{height:54px}.location-name{max-width:70px}.main-actions button{min-width:57px;font-size:10px}.scene-banner{max-width:75%}}
@media(max-width:900px){.topbar.resources-open .resource-chip{flex-wrap:wrap}.topbar.resources-open .resource-chip small{display:block;flex-basis:100%;font-size:10px;line-height:1.1;text-align:left}}
.building-sprite{display:block!important;flex:none;width:130px!important;height:130px!important;max-width:none;background-repeat:no-repeat;background-size:200% 200%;filter:drop-shadow(0 6px 5px #06151ca6)}
.sprite-hall,.sprite-bank,.sprite-warehouse,.sprite-market{background-image:url('assets/edificios-civic1-1929.png')}
.sprite-clinic,.sprite-school{background-image:url('assets/edificios-civic2-1929.png')}
.sprite-farm,.sprite-sawmill,.sprite-quarry,.sprite-oilwell{background-image:url('assets/edificios-recursos-1929.png')}
.sprite-factory,.sprite-station,.sprite-refinery,.sprite-steelworks{background-image:url('assets/edificios-industrial1-1929.png')}
.sprite-powdermill,.sprite-garage,.sprite-motorworks{background-image:url('assets/edificios-industrial2-1929.png')}
.sprite-arsenal,.sprite-barracks,.sprite-academy{background-image:url('assets/edificios-defense-1929.png')}
.sprite-hall,.sprite-clinic,.sprite-farm,.sprite-factory,.sprite-powdermill,.sprite-arsenal{background-position:0 0}
.sprite-bank,.sprite-school,.sprite-sawmill,.sprite-station,.sprite-garage,.sprite-barracks{background-position:100% 0}
.sprite-warehouse,.sprite-quarry,.sprite-refinery,.sprite-motorworks,.sprite-academy{background-position:0 100%}
.sprite-market,.sprite-oilwell,.sprite-steelworks{background-position:100% 100%}
@media(max-width:900px){.building-sprite{width:82px!important;height:82px!important}}
@media(max-width:480px){.building-sprite{width:63px!important;height:63px!important}}
.start-card{max-height:92svh;overflow:auto}.city-name-input{width:100%;height:44px;padding:8px 12px;border:2px solid #cba66c;border-radius:10px;background:#f5ebd8;color:#102b34;font:700 16px 'Nunito Sans',sans-serif}.city-name-input:focus-visible{outline:3px solid #f8da91;outline-offset:2px}.origin-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}.origin-option{display:block;position:relative;cursor:pointer}.origin-option input{position:absolute;opacity:0;pointer-events:none}.origin-option .origin-face{display:block;min-height:86px;padding:10px;border:1px solid #987a4f;border-radius:14px;background:linear-gradient(145deg,#153e47,#0b2933);transition:background .15s,border-color .15s,transform .15s}.origin-option:hover .origin-face{transform:translateY(-2px);border-color:#f1cb8b}.origin-option input:checked+.origin-face{border:2px solid #ffdc96;background:linear-gradient(145deg,#2c655d,#153b45);box-shadow:0 0 0 2px #e8c17955}.origin-option input:focus-visible+.origin-face{outline:3px solid #ffe09d}.origin-option strong,.origin-option small{display:block}.origin-option strong{font:700 15px 'Barlow Condensed',sans-serif}.origin-option small{margin-top:4px;color:#d4ceb9;font-size:11px;line-height:1.3}.city-network{display:grid;gap:9px}.city-network .city-row{padding:10px 12px;border:1px solid #8d7957;border-radius:14px;background:#103842}.city-network .city-row strong,.city-network .city-row small{display:block}.city-network .city-row small{margin:4px 0;color:#dbd3bd}.city-network .city-row button{margin-top:7px}.city-network .city-row.pending{border-color:#edbf6a}.city-network .city-row.locked{opacity:.78}.city-network .city-row button:disabled{opacity:.55}.map-node.founding-site{background:#514630}.map-node.founded-city{background:#255343;border-color:#d8bb78}#cityNameError{color:#ffd390;min-height:1.1em;font-size:12px}#cityHeadline{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:420px}
@media(max-width:620px){.start-card{padding:18px}.start-card h1{font-size:31px}.origin-option .origin-face{min-height:78px;padding:8px}.origin-option strong{font-size:13px}.origin-option small{font-size:10px}}
.city-network .city-row button{width:auto;max-width:100%;min-height:32px;padding:5px 11px;border:1px solid #d9b777;border-radius:18px;background:#dfbf83;color:#102d34;font:800 12px 'Nunito Sans',sans-serif}.city-network .city-row button:hover:not(:disabled){background:#f2d79d}.city-network .city-row button:disabled{background:#607476;color:#d3d8d1}.regional-map .map-node{max-width:44%;overflow:hidden;text-overflow:ellipsis}.regional-map .map-node.founded-city{max-width:48%}
.resource-strip{align-items:stretch;gap:4px;padding:4px 6px}.resource-chip{display:grid;grid-template-columns:27px minmax(0,1fr);align-items:center;flex:1 1 0;min-width:0;padding:3px 6px;border:1px solid #92784e88;border-radius:8px;background:#0b2b36d9;white-space:normal}.resource-chip:last-child{border-right:1px solid #92784e88}.resource-chip .res-icon{grid-column:1;grid-row:1;font-size:22px;line-height:1;text-align:center}.resource-chip .res-meta{grid-column:2;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:5px;min-width:0;line-height:1.05}.resource-chip .res-label{grid-column:1/-1;grid-row:1;overflow:hidden;text-overflow:ellipsis;font-size:11px;white-space:nowrap;color:#e5d8bc}.resource-chip b{grid-column:1;grid-row:2;overflow:hidden;text-overflow:ellipsis;font-size:16px;white-space:nowrap}.resource-chip small{display:block;grid-column:2;grid-row:2;align-self:center;overflow:hidden;text-overflow:ellipsis;color:#8fdb9c;font-size:9px;white-space:nowrap}.resource-chip.full b{color:#f3b1a1}.resource-chip:hover{background:#174652}.resource-strip .resource-chip:nth-child(n+9) .res-icon{font-size:20px}
html[data-resource-layout="vertical"] .resource-chip{display:flex;flex-direction:column;justify-content:center;gap:1px;padding:3px 5px;text-align:center}.resource-strip[aria-label] .resource-chip .res-meta{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;justify-items:center}.resource-strip[aria-label] .resource-chip .res-label{grid-column:1;grid-row:1}.resource-strip[aria-label] .resource-chip b{grid-column:1;grid-row:2}.resource-strip[aria-label] .resource-chip small{grid-column:1;grid-row:3;font-size:8px}
html[data-resource-layout="vertical"] .topbar{grid-template-rows:48px 76px}

/* Full per-level plan. The wide reader keeps the city panel compact. */
.levels-modal{display:flex;flex-direction:column;width:min(1020px,100%);max-height:92svh;min-height:0;border:1px solid #d5b57b;border-radius:20px;background:#0c2c36;box-shadow:0 24px 80px #000a;overflow:hidden}
.levels-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px 24px 11px;border-bottom:1px solid #a3814f66;background:linear-gradient(110deg,#123e48,#09232d)}
.levels-header h2{margin:7px 0 3px;font:700 clamp(21px,3vw,30px) Georgia,serif;color:#f5dfb6}
.levels-header button{flex:none;width:40px;height:40px;border:1px solid #a88a56;border-radius:50%;background:#0b2530;color:#f7e4c1;font-size:27px}
.levels-context,.levels-note{margin:0;padding:10px 24px 0;font-size:13px;line-height:1.45;color:#e2e6dc}
.levels-note{padding-top:6px;padding-bottom:12px;color:#b7cec5;font-size:12px}
.level-table-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-color:#a5834a #0a2530;border-top:1px solid #7c784e;scroll-padding-top:64px}
.level-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:13px;line-height:1.4}
.level-table thead th{position:sticky;top:0;z-index:1;background:#1a4650;color:#f5d298;text-align:left;padding:12px 15px;border-bottom:1px solid #bb9964;font-size:12px}
.level-table thead th:first-child{width:9%}.level-table thead th:nth-child(2){width:23%}.level-table thead th:nth-child(3){width:36%}.level-table thead th:nth-child(4){width:32%}
.level-table tbody th,.level-table td{padding:14px 15px;vertical-align:top;text-align:left;border-bottom:1px solid #416063;background:#0c2c36;overflow-wrap:anywhere}
.level-table tr:nth-child(even) td,.level-table tr:nth-child(even) th{background:#10343e}
.level-table tbody th{font-size:22px;color:#f5d298}.level-table tbody th small{display:block;font:500 10px 'Nunito Sans',sans-serif;color:#c4d7d3;margin-top:3px}
.level-table tr.level-current th{border-left:4px solid #86d7aa;background:#214b46}.level-table tr.level-planned th{border-left:4px solid #deb267;background:#3b4536}
.level-metric{display:flex;flex-wrap:wrap;gap:3px 8px;margin-bottom:9px}.level-metric span{flex-basis:100%;font-size:11px;color:#bfd1cd}.level-metric b{color:#f5e9cf}.level-metric small{color:#aec4bd;font-size:10px}
.level-increase{color:#9cdeb3;margin-bottom:8px;font-size:12px}.level-no-gain{color:#eacda4;font-size:12px}
.level-unlocks{margin-top:9px;border-top:1px solid #63807166;padding-top:8px;font-size:11px}.level-unlocks b,.level-unlocks span,.level-unlocks small{display:block;margin:3px 0}.level-unlocks b{color:#ebc887}.level-unlocks small{color:#bdcec5}
.level-cost{margin-top:8px;font-size:11px}.level-cost summary{cursor:pointer;color:#cdd7c9}.level-cost p{font-size:11px;line-height:1.5;color:#e8d3ac;margin:6px 0}
.level-requirements{display:block;margin-top:8px;color:#d8bb96;font-size:10px}.level-services{margin:9px 0;font-size:11px}.level-services b,.level-services span,.level-services small{display:block;margin:3px 0}.level-services small{color:#bdcec5;font-size:10px}
.levels-button{font-size:13px;text-align:left}
@media(max-width:600px){#levelsOverlay{padding:6px}.levels-modal{border-radius:14px;max-height:96svh}.levels-header{padding:13px 14px 10px;gap:6px}.levels-header .start-kicker{font-size:10px;letter-spacing:2px}.levels-header h2{font-size:21px}.levels-context,.levels-note{padding-left:14px;padding-right:14px;font-size:11px}.level-table,.level-table tbody{display:block;width:100%;min-width:0}.level-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.level-table tbody tr{display:grid;grid-template-columns:80px minmax(0,1fr);padding:0 5px 8px;border-bottom:1px solid #658079}.level-table tbody th{grid-column:1;grid-row:1;font-size:24px;border-bottom:0;padding:12px 10px}.level-table tbody th small{font-size:10px;overflow-wrap:normal}.level-table td{padding:10px 12px;border-bottom:0}.level-table td:nth-child(2){grid-column:2;grid-row:1}.level-table td:nth-child(3){grid-column:1/-1;grid-row:2}.level-table td:nth-child(4){grid-column:1/-1;grid-row:3;border-top:1px solid #54736966}.level-table td:nth-child(2):before{content:'Tiempo de esta mejora';display:block;font-size:10px;color:#c0d1c9;margin-bottom:4px}.level-table td:nth-child(4):before{content:'Aumento vs. nivel anterior';display:block;font-size:10px;color:#c0d1c9;margin-bottom:5px}.level-metric span{font-size:12px}.level-metric b{font-size:14px}.level-increase{font-size:13px}}
.start-overlay{z-index:40}.start-card{padding:19px 22px}.start-card h1{font-size:34px;margin:5px 0 8px}.start-card p{font-size:14px;line-height:1.35;margin:8px 0}.start-card label{margin:10px 0 5px}.start-card .account-entry{min-height:40px;margin:6px 0}.start-card #startButton{min-height:42px;margin:8px 0}.origin-option .origin-face{min-height:71px}.origin-option small{line-height:1.2}.origin-choices{gap:7px;margin-top:5px}
@media(max-width:620px){.start-card{padding:16px 18px}.start-card h1{font-size:30px}.origin-option .origin-face{min-height:70px}}
.origin-legacy-prompt{border-color:#e0bd77;background:#214c47}.origin-legacy-prompt button{padding:8px 12px;border:1px solid #ffe1a4;border-radius:17px;background:#ddb977;color:#102d32;font-weight:800}.origin-legacy-prompt p{font-size:12px;line-height:1.35}
.build-timing-card{border-color:#c49b5c;background:linear-gradient(145deg,#153f48,#0d2b34)}.job-title{font:800 17px Georgia,serif;color:#f2d19a;margin-bottom:8px}.job-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;padding:9px 10px;margin-top:7px;border:1px solid #7f765b;border-radius:10px;background:#092a34}.job-row strong{font-size:13px;min-width:0}.job-row span{min-width:0;font-weight:800;color:#ffe0a0;text-align:right;overflow-wrap:anywhere}.job-row small{grid-column:1/-1;color:#c7d5c7;font-size:11px}.job-row.active{border-color:#e0ad58}.job-row.queued{border-color:#7996a0;background:#123b46}.job-row.free{grid-template-columns:1fr;opacity:.85}.job-row.free span{text-align:left}.max-level-details{margin-top:10px;border-top:1px solid #a47e4e;padding-top:8px}.max-level-details summary,.history-card summary{cursor:pointer;color:#ffe0a0;font-weight:800}.max-level-details p{font-size:13px;line-height:1.35}.max-level-details small,.history-card>small{color:#c7cdbf;font-size:11px;line-height:1.35}.history-card{margin-top:12px;padding:11px 13px;border:1px solid #be965b;border-radius:14px;background:#102f38}.history-card summary{font:800 18px Georgia,serif}.history-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.history-grid>div{padding:8px;border:1px solid #47686b;border-radius:9px;background:#0b2831}.history-grid b{font-size:11px;color:#f3cc88;text-transform:uppercase;letter-spacing:.4px}.history-grid p{margin:4px 0 0;font-size:12px;line-height:1.35}.history-question{grid-column:1/-1;border-color:#b58d55!important;background:#193f43!important}.history-card>small{display:block;margin-top:10px}
/* Readability: decisions on the city rail, learning in a spacious paper reader. */
@media(min-width:901px){
  .topbar{grid-template-rows:48px 56px}
  .play-area{display:grid;grid-template-columns:minmax(0,1fr) 390px}
  .side-panel{max-height:calc(100svh - 155px)}
}
.panel-content{padding:22px;font-size:16px;line-height:1.6}
.panel-content p{font-size:16px;line-height:1.65;margin:12px 0 18px}
.panel-content h1{font-size:28px;line-height:1.25;margin:4px 0 20px}
.panel-content h2{margin:28px 0 14px;line-height:1.3}
.panel-content h3{font-size:20px;line-height:1.35;margin-bottom:14px}
.panel-content small,.panel-content .meta{font-size:14px;line-height:1.55}
.panel-content .card{padding:18px;margin:18px 0;border-color:#6e81786b;box-shadow:none}
.panel-content .card p{margin:10px 0 16px}
.panel-content button{font-size:16px;line-height:1.4;min-height:44px;border-radius:10px;padding:11px 13px}
.panel-content .card button{margin-top:14px;box-shadow:none}
.panel-content .requirements{font-size:15px}
.panel-content .resource-table{font-size:15px;line-height:1.6}
.panel-content .resource-table td{padding:12px 5px}
.panel-content .eyebrow{font:700 12px 'Nunito Sans',sans-serif;letter-spacing:1px}
.panel-content .job-title{font-size:19px}
.panel-content .job-row{grid-template-columns:1fr;gap:7px;padding:13px}
.panel-content .job-row strong{font-size:15px}
.panel-content .job-row span{text-align:left}
.panel-content .job-row small{font-size:14px}
.panel-content .queue-hint{font-size:14px;margin-bottom:0}
.panel-content .route-list{gap:10px;margin:20px 0}
.panel-content .route-list button{font:700 15px 'Nunito Sans',sans-serif;padding:13px;line-height:1.4}
.panel-content .route-list button small{font-size:13px;margin-top:6px}
.panel-content .research-node .node-head{flex-direction:column;gap:8px}
.panel-content .research-node .node-head b{font:700 21px Georgia,serif;line-height:1.35}
.panel-content .research-node .node-head small{font-size:14px}
.panel-content .reading-link{display:flex;align-items:center;gap:13px;width:100%;text-align:left;padding:16px;border:1px solid #ba9a68;border-radius:12px;background:#173b40;color:#f8e4bd;box-shadow:none;margin:22px 0}
.reading-link strong,.reading-link small{display:block}
.reading-link small{margin-top:5px;color:#ccd8ce}
.reading-link>span:nth-child(2){flex:1}
.reading-link:hover{background:#225254}
.panel-content .compact-reading{padding:12px 15px}
.panel-content .building-level{margin:-8px 0 20px;color:#d5ddcc}
.panel-content .upgrade-card{border-color:#ae925d;background:#163c40}
.panel-content .history-link{padding:13px 0;border:0;border-top:1px solid #76807166;border-bottom:1px solid #76807166;border-radius:0;background:transparent}
.panel-content .history-link:hover{color:#fff4d5;background:#2d555733}
.resource-chip .res-label{font:700 12px 'Nunito Sans',sans-serif}
.resource-chip b{font:800 19px 'Nunito Sans',sans-serif;line-height:1.15}
.resource-strip[aria-label] .resource-chip small{font-size:10px;line-height:1.2}
.resource-chip .res-meta{row-gap:2px}
.reading-modal{display:flex;flex-direction:column;width:min(820px,100%);max-height:92svh;min-height:0;overflow:hidden;border:1px solid #c6a26a;border-radius:20px;background:#f6efdf;color:#253c3d;box-shadow:0 24px 80px #0009}
.reading-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:25px 32px 18px;border-bottom:1px solid #d8c9aa}
.reading-header .start-kicker{color:#6a653f;font:700 11px 'Nunito Sans',sans-serif;letter-spacing:1.6px;line-height:1.7}
.reading-header h2{font:700 32px Georgia,serif;line-height:1.25;margin:10px 0 0}
.reading-header>button{flex:none;width:44px;height:44px;background:#e7ddc5;color:#304744;border:1px solid #c3b58f;border-radius:50%;font-size:28px;line-height:1}
.reading-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:14px 32px;border-bottom:1px solid #ddcfb3;background:#efe5ce}
.reading-toolbar nav{display:flex;gap:8px;flex-wrap:wrap}
.reading-toolbar button{font:700 14px 'Nunito Sans',sans-serif;line-height:1.4;min-height:44px;padding:10px 14px;border:1px solid #b7b394;border-radius:22px;background:transparent;color:#2a4544}
.reading-toolbar button[aria-pressed="true"]{background:#254e4b;color:#fff6df;border-color:#254e4b}
.reading-body{overflow:auto;min-height:0;padding:8px 38px 28px;font-size:18px;line-height:1.8;overscroll-behavior:contain;scrollbar-color:#928766 #f6efdf}
.reading-body section{max-width:64ch;margin:28px auto 0}
.reading-body h3{font:700 22px Georgia,serif;line-height:1.4;color:#254e4b;margin:0 0 12px}
.reading-body p{font-size:inherit;line-height:inherit;margin:0 0 16px}
.reading-body .reading-caption{color:#566663;font-size:.9em}
.reading-body .reading-question{padding:23px 24px;background:#e8e9d5;border-left:3px solid #658163;border-radius:0 10px 10px 0}
.reading-body .reading-disclaimer{font-size:14px;line-height:1.65;margin:30px 0 0;color:#5c695f}
.reading-body.large-reading{font-size:21px}
.reading-body.large-reading h3{font-size:25px}
.reading-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 32px;border-top:1px solid #ddcfb3;background:#efe5ce}
.reading-footer span{font-size:13px;color:#53655b}
.reading-footer button{font:700 16px 'Nunito Sans',sans-serif;padding:12px 20px;min-height:44px;background:#254e4b;color:#fff6df;border:0;border-radius:24px}
.levels-context,.levels-note{font-size:15px;line-height:1.6;padding-top:12px}
.level-table{font-size:16px;line-height:1.6}
.level-table thead th{font-size:14px;padding:16px}
.level-table td,.level-table tbody th{padding:20px 16px}
.level-metric{gap:6px 8px;margin-bottom:16px}
.level-metric span,.level-metric small,.level-unlocks,.level-cost,.level-cost p,.level-services,.level-services small,.level-requirements,.level-table tbody th small{font-size:14px;line-height:1.6}
.level-increase,.level-no-gain{font-size:15px;line-height:1.6}
.level-unlocks,.level-services{margin-top:15px}
@media(max-width:1100px) and (min-width:901px){
  .play-area{grid-template-columns:minmax(0,1fr) 355px}
  .resource-chip{padding:3px 3px;grid-template-columns:22px minmax(0,1fr)}
  .resource-chip .res-label{font-size:11px}.resource-chip b{font-size:17px}
}
@media(max-width:900px){
  .side-panel{height:min(78svh,760px)}
  .panel-content{padding:22px 20px}
  .resource-strip[aria-label] .resource-chip .res-label{font-size:14px}
  .resource-strip[aria-label] .resource-chip b{font-size:20px}
  .resource-strip[aria-label] .resource-chip small{font-size:12px}
  .resource-chip{padding:12px}
}
@media(max-width:600px){
  #readingOverlay{padding:8px}
  .reading-modal{max-height:96svh;border-radius:16px}
  .reading-header{padding:19px 20px 16px;gap:10px}
  .reading-header h2{font-size:27px}
  .reading-toolbar{padding:12px 18px;gap:10px}
  .reading-toolbar button{font-size:13px}
  .reading-body{padding:4px 22px 24px;font-size:18px;line-height:1.75}
  .reading-body section{margin-top:26px}
  .reading-body .reading-question{padding:18px}
  .reading-footer{padding:12px 18px}
  .reading-footer span{font-size:12px}
  .levels-context,.levels-note{font-size:15px;line-height:1.6}
  .level-table td:nth-child(2):before,.level-table td:nth-child(4):before{font-size:14px;margin-bottom:9px}
  .level-metric b{font-size:17px}
  .level-table tbody th small{font-size:13px}
  .level-table tbody tr{grid-template-columns:88px minmax(0,1fr);padding-bottom:18px}
  .level-table td{padding:15px 13px}
}