/* The viewport belongs to the game. Long documents scroll inside its panels. */
html {height:100%;overflow:hidden}
body,body.city-board-mode {height:100dvh!important;min-height:0!important;overflow:hidden!important;padding:0}
.topbar,.status-bar,.timeline-bar {flex-shrink:0}
.topbar {position:relative!important;height:64px;min-height:64px;padding-inline:18px;z-index:8}
.topbar .brand-mark {height:52px;width:46px}
.topbar .brand strong {font-size:26px}
.workspace,.sidebar,.shop-scene,#panel {min-width:0;min-height:0}
.workspace {flex:1;display:grid;grid-template-columns:clamp(280px,27vw,360px) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.sidebar {display:flex;flex-direction:column;overflow:hidden;padding:0}
.sidebar #panel {position:relative;flex:1;overflow:auto;width:100%;max-width:none;margin:0;padding:20px}
.sidebar #plan-cta {flex:none;max-width:none;margin:0;width:100%;padding:12px 20px}
.shop-scene,.focus-mode .shop-scene {height:auto;min-height:0}
#canvas-wrap {inset:0}
.timeline-bar {position:relative;inset:auto;height:60px;min-height:60px}
.founding,.founding-mode .founding {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
.city-board {flex:1;display:flex;flex-direction:column;min-height:0;max-width:none;margin:0;padding:0;overflow:hidden}
#city-chrome {flex:none;padding:0 18px;background:#e9d7b3;border-bottom:2px solid #aa7250}
.city-commandbar {display:flex;align-items:center;gap:16px;min-height:43px}
.city-overview-toggle {font-weight:700;font-size:13px;white-space:nowrap;padding:9px 0}
.city-brief {font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;min-width:0}
.city-brief-clock {font-size:12px;white-space:nowrap;margin-left:auto}
.city-commandbar .secondary {font-size:11px;padding:6px 10px;white-space:nowrap}
.city-risk-banner {display:block;width:100%;padding:6px 10px;text-align:left;background:#f4c391;color:#6f2c21;font-size:12px}
.city-tabs {margin:0;border:0;gap:4px;overflow:auto}
.city-tabs button {font-size:13px;padding:10px 17px;min-height:40px}
.city-content {flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;overflow-anchor:none;padding:12px 20px 28px;scroll-padding:12px}
.city-content:focus-visible {outline:3px solid #a56336;outline-offset:-3px}
.city-content>* {max-width:1520px;margin-inline:auto;min-width:0}
.city-access-strip {display:flex;align-items:center;justify-content:space-between;gap:15px;padding:8px 14px;margin-bottom:10px;background:#f6e9ce;font-size:11px}
.city-access-strip .secondary {white-space:nowrap;flex-shrink:0;font-size:11px}
.city-overview {padding-bottom:20px}
.city-atlas {display:flex;flex-direction:column;height:max(440px,calc(var(--city-content-height,75dvh) - 26px));margin-block:0 20px;box-shadow:3px 3px 0 #a8946a32}
.city-access-strip+.city-atlas {height:max(440px,calc(var(--city-content-height,75dvh) - 84px))}
.atlas-heading {flex:none;padding:8px 14px;align-items:center}
.atlas-heading .eyebrow,.atlas-heading p {display:none}
.atlas-heading h2 {font-size:23px;margin:0}
.atlas-time {padding:4px 8px;font-size:11px;align-self:center}
.atlas-toolbar {flex:none;padding:6px 10px;gap:6px}
.atlas-toolbar button {min-height:32px;padding:5px 9px}
.atlas-surface {flex:1;min-height:180px;padding:0 0 32px}
.city-atlas[data-view] .atlas-svg {position:absolute;inset:0 0 32px;width:100%;height:calc(100% - 32px);max-height:none;aspect-ratio:auto}
.atlas-key {bottom:4px;padding:5px 9px;font-size:9px}
.atlas-districts {flex:none;display:flex;flex-wrap:wrap;padding:7px 10px;gap:5px}
.atlas-districts button {font-size:11px;min-height:32px;padding:6px 9px}
.atlas-caption {flex:none;padding:4px 12px 6px;font-size:9px;gap:10px}
.atlas-caption p {margin:0;max-width:none}
.atlas-selection {flex:none;padding:9px 14px;gap:10px}
.atlas-selection strong {font-size:22px;margin:2px 0}
.atlas-selection span {font-size:11px}
.atlas-selection-actions .secondary {padding:7px 9px;font-size:11px}
.property-card {content-visibility:visible;contain-intrinsic-size:none}
.property-detail {top:0;max-height:calc(var(--city-content-height,75dvh) - 24px);scroll-margin:0}
.overlay {overflow:hidden;padding:16px}
.modal,.phone-modal,.report-modal {max-height:100%;max-width:100%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.modal-close {position:sticky;top:0;float:right;margin:-12px -8px 0 12px}
.supply-mobile-quote {padding-right:44px}
.city-content,#panel,.founding,.modal {scrollbar-width:thin;scrollbar-color:#997c58 #e2cfaa}
@media(max-width:1000px) {
 .city-tabs button {padding:9px 12px;font-size:12px}
 .atlas-toolbar .atlas-periods,.atlas-toolbar .atlas-tools {margin-left:0}
 .atlas-heading h2 {font-size:21px}
 .city-market-grid {grid-template-columns:minmax(0,1fr) 320px;gap:14px}
 .property-list {grid-template-columns:1fr}
 .city-brief {display:none}
}
@media(max-width:700px) {
 .topbar {height:58px;min-height:58px;padding-inline:10px;gap:8px}
 .topbar .brand strong {font-size:20px}.topbar .brand small {display:none}
 .topbar .brand-mark {width:33px;height:42px}.topbar .top-actions {gap:6px}
 .topbar #save-button,.topbar #load-button {display:none}
 .status-bar {min-height:60px;padding:0 6px}
 .status-cell {padding:8px 5px}.status-cell strong {font-size:17px}
 .workspace {grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(150px,42%) minmax(0,1fr)}
 .shop-scene {grid-row:1}.sidebar {grid-row:2}
 .sidebar #panel {padding:16px}.sidebar #plan-cta {padding:10px 16px}
 .focus-mode .workspace {grid-template-rows:minmax(0,1fr)}
 .timeline-bar {height:52px;min-height:52px;padding-inline:10px;gap:10px}
 .scene-heading {top:6px;left:8px;right:8px}.scene-heading h2 {font-size:20px}
 .scene-controls {top:60px;left:8px;right:8px}
 .scene-bottom {bottom:18px;left:8px;right:8px}.moment {max-width:75%}
 .scene-caption {font-size:8px;bottom:3px}
 #city-chrome {padding-inline:8px}.city-commandbar {gap:9px;flex-wrap:wrap;padding-block:3px}
 .city-overview-toggle {font-size:12px}.city-brief-clock {font-size:10px}
 .city-commandbar .secondary {font-size:10px;padding:5px}
 .city-tabs {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
 .city-tabs button {padding:7px 3px;min-height:34px;font-size:11px;white-space:normal}
 .city-content {padding:8px 8px 20px}
 .city-access-strip {padding:7px 8px;gap:8px}.city-access-strip span {min-width:0}
 .city-atlas,.city-access-strip+.city-atlas {height:max(540px,calc(var(--city-content-height,75dvh) - 16px))}
 .atlas-heading {display:flex;padding:8px}.atlas-heading h2 {font-size:18px;max-width:65%}
 .atlas-time {margin:0;font-size:9px;padding:3px}
 .atlas-toolbar {padding:5px;gap:5px}.atlas-toolbar button {font-size:10px;min-height:32px;padding:5px 7px}
 .atlas-views {width:auto;border:0;padding:0}.atlas-views button {flex:none}
 .atlas-toolbar .atlas-tools {width:auto;justify-content:flex-start}
 .atlas-districts {display:flex;padding:5px;gap:4px}
 .atlas-districts button {font-size:10px;padding:5px 7px;min-height:30px;flex:1 0 28%}
 .atlas-districts button:first-child {flex-basis:100%}
 .atlas-caption {font-size:9px;padding:4px 8px}.atlas-caption>span {display:none}
 .atlas-selection {padding:8px}.atlas-selection strong {font-size:20px}
 .atlas-selection-actions {width:auto}.atlas-selection-actions .secondary {width:auto}
 .city-market-grid {grid-template-columns:minmax(0,1fr)}
 .property-detail {position:relative;grid-row:1;max-height:none;overflow:visible;padding:16px}
 .property-list {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .property-card>div:last-child {padding:9px}.property-card h3 {font-size:19px}
 .property-personality {font-size:18px}.property-card p {font-size:11px}
 .overlay {padding:8px}.modal {padding:24px 16px}
}
@media(max-height:650px) {
 .topbar {height:52px;min-height:52px}.topbar .brand-mark {height:43px}
 .status-bar {min-height:54px}.timeline-bar {height:48px;min-height:48px}
 .scene-heading h2 {font-size:20px}.scene-heading {top:6px}.scene-controls {top:60px}
 .moment {display:none}.scene-bottom {bottom:18px}.phone-launch {margin-left:auto}
 .city-atlas,.city-access-strip+.city-atlas {height:max(390px,calc(var(--city-content-height,75dvh) - 16px))}
}