body{background:#e8eeea;padding-bottom:100px}button{min-height:44px}.topbar{position:relative;z-index:10;min-height:78px;padding:12px 24px;background:#fffcf0f5;box-shadow:0 3px 18px #173f4320;gap:18px}.brand{font-size:14px;letter-spacing:1px}.brandmark{display:none}.brand small{font-size:10px}.global-ship{min-width:125px;background:#f3eedf;border:1px solid #d7c9ad;border-radius:7px;padding:10px 16px;font-weight:600}.world-nav{position:fixed;z-index:35;bottom:0;left:0;right:0;display:flex;gap:10px;padding:12px 22px;background:#f0e9d9f5;border-top:1px solid #d8cfb9;box-shadow:0 -4px 20px #173f4310}.world-nav button{display:flex;align-items:center;justify-content:center;gap:16px;flex:1;border:1px solid #d8d0bb;background:#fffcf0;border-radius:9px;padding:12px;color:#243e42;text-align:left}.world-nav button.active{background:#155860;color:#fff;border-color:#44838a}.world-nav b{display:block;font-family:'Libre Caslon Display',Georgia,serif;font-size:24px;font-weight:400}.world-nav small{display:block;font-size:12px;margin-top:4px}.nav-icon{font-size:30px}.world-main{max-width:none}.chart-title h1{font-size:34px}.chart-title{margin-bottom:15px}.chart-area{padding:24px}.map-wrap{background:#82c8d1;border:1px solid #88b9ba;box-shadow:0 8px 26px #2b6d7620;border-radius:12px}.map-caption{background:#fcf8e6dc;padding:8px 12px;border-radius:5px;top:12px;left:12px}.map-legend{background:#fbf7e8e8;padding:8px;border-radius:4px;max-width:85%;font-size:11px}.port-label{paint-order:stroke;stroke:#fff8e7;stroke-width:4px;stroke-linejoin:round;fill:#203f40;font-weight:600}.coast-land{fill:url(#land-relief);stroke:#769b77;stroke-width:.65}.coastal-waters{stroke:#b5ecdf;stroke-width:7;fill:none;opacity:.85}.coast-depth{fill:none;stroke:#6cbec7;stroke-width:15;opacity:.35}.geo-label{fill:#4d7159;opacity:.65}.route-path.sailing{stroke:#f6f5d9;stroke-width:2.5}.route-completed{fill:none;stroke:#136570;stroke-width:3;pointer-events:none}.route-end{fill:#fff7d7;stroke:#aa743a;stroke-width:1.5}.travel-progress{background:#d5e1d9}.voyage-detail{font-size:12px;line-height:1.6;color:#53716c}.port-panel{background:#fffdf4}.city-scene{position:relative;min-width:0;min-height:650px;overflow:hidden;background:#86c9d1;border-radius:0 0 14px 14px}.city-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.view-city{display:block;padding:0}.view-city.has-place{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:0}.city-heading{position:absolute;top:18px;left:24px;padding:18px 24px;background:#fffbedeb;border:1px solid #e2d8ba;border-radius:8px;box-shadow:0 4px 15px #32453f20}.city-heading h1{font-family:'Libre Caslon Display',Georgia,serif;font-size:44px;margin:6px 0}.city-heading p{margin:0;font-size:14px}.city-hotspot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);padding:9px 16px 9px 8px;border:1px solid #c3b38c;border-radius:10px;background:#fff7e5f2;box-shadow:0 3px 9px #3a392b55;display:flex;align-items:center;gap:9px;font-family:Georgia,serif;font-size:17px;white-space:nowrap;min-height:52px;transition:box-shadow .2s}.city-hotspot span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#75603e;color:#fff9e9;font-size:23px}.city-hotspot.active{outline:3px solid #267b80;box-shadow:0 0 22px #ffe9a4}.city-dock{position:absolute;bottom:32px;left:5%;right:5%;display:flex;gap:14px;overflow-x:auto;padding:8px}.dock-ship{flex:0 0 240px;text-align:left;padding:14px 16px;background:#fffbeeef;border:1px solid #cdc2a6;border-radius:8px;box-shadow:0 4px 14px #17545a30}.dock-ship.active{border:2px solid #236d71}.dock-ship>span{float:left;font-size:32px;margin-right:12px}.dock-ship b{display:block;font-size:17px}.dock-ship small{display:block;line-height:1.6;margin-top:5px}.city-art-note{position:absolute;bottom:5px;left:16px;background:#fffbe9cc;font-size:11px;padding:3px}.local-service{max-height:calc(100vh - 172px);overflow-y:auto;background:#fffdf3;min-width:0;padding:16px}.service-close{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ded9c8;padding-bottom:10px;margin-bottom:14px}.service-close button{border:0;background:#ede8da;padding:8px 14px;border-radius:5px}.local-service .port-heading{padding:8px 0}.local-service .port-intelligence{display:none}.local-service .tabs{position:static}.local-service .panel-body{padding:15px 0}.local-service .goods-list{max-height:240px}.local-service .port-description,.local-service .port-facts{display:none}.place-story p{line-height:1.7}.place-story h2,.harbor-fleet h2{font-family:'Libre Caslon Display',Georgia,serif;font-size:32px}.rumor{display:block;width:100%;text-align:left;padding:16px;background:#eef2e7;border:1px solid #d4dfcf;border-radius:6px;margin:14px 0}.rumor span{display:block;font-size:13px;margin-top:8px}.harbor-ship{display:flex;gap:12px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid #ddd7c7}.harbor-ship small{line-height:1.8}.harbor-ship h3{margin:0}.harbor-ship.active{background:#f0f4e9}.harbor-sail{font-size:32px}.harbor-fleet>.button{margin-top:20px}.office-view{width:min(1150px,100%);margin:auto;padding:32px}.view-office{display:block;background:linear-gradient(135deg,#e5ebe1,#f3eddc);min-height:calc(100vh - 180px)}.office-heading h1{font-family:'Libre Caslon Display',Georgia,serif;font-size:42px;margin:8px 0}.office-heading p{color:#62746c}.office-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0}.office-stats>div{padding:20px;background:#fffdf2;border:1px solid #d6dacb;border-radius:8px}.office-stats small{display:block;color:#687c71;font-size:12px}.office-stats strong{display:block;font-size:22px;margin-top:8px}.office-tabs{display:flex;gap:8px}.office-tabs button{padding:12px 24px;border:1px solid #d5daca;background:#f9f9ed;border-radius:8px 8px 0 0}.office-tabs [aria-selected=true]{background:#195b5d;color:white}.office-content{background:#fffdf4;border:1px solid #d4dacb;border-radius:0 8px 8px;padding:24px}.office-content .storage-summary{margin-top:0}.office-content .storage-lines{max-height:360px;overflow:auto}.office-content .business-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.office-content .business-list>h3,.office-content .business-list>.panel-note{grid-column:1/-1}.office-content .business-card{margin:0}.office-content .economy-intro>h3,.office-content .economy-intro>p,.office-content .economy-intro>.office-card{display:none}.office-content .transfer-card{max-width:640px;margin:24px auto 0}.good-row.no-owned-stock{opacity:.42;filter:grayscale(1)}.stock-source{font-size:12px;color:#5c7770;line-height:1.6}.city-enter{margin-left:10px}.world-main~footer{padding:14px 24px}.map-near-info{font-size:11px;fill:#285354;paint-order:stroke;stroke:#fff8e7;stroke-width:3px}.topbar .time-controls button{min-width:38px}.family-frontier .city-heading{border-color:#9b8762}
@media(min-width:1250px){.view-city:not(.has-place) .city-scene{min-height:calc(100vh - 185px)}.view-city.has-place .city-scene{min-height:calc(100vh - 185px)}}
@media(max-width:1100px){.topbar{gap:10px;padding:10px 16px;flex-wrap:wrap}.topbar .brand{margin-right:auto}.topbar .calendar{min-width:100px}.topbar .resource strong{font-size:18px}.world-main.view-map{grid-template-columns:minmax(0,1fr) 330px}.chart-area{padding:16px}.chart-title h1{font-size:28px}.city-scene{min-height:620px}.view-city.has-place{display:block}.local-service{position:fixed;z-index:25;right:12px;top:90px;bottom:105px;width:390px;max-height:none;border-radius:12px;box-shadow:0 5px 45px #123b4a70;border:1px solid #c7cbb8}.city-heading{padding:12px 18px}.world-nav{padding:10px 14px;gap:8px}.world-nav b{font-size:21px}.world-nav small{font-size:11px}.nav-icon{font-size:25px}.world-nav button{gap:9px;padding:10px}.office-view{padding:24px}.city-hotspot{font-size:16px}.topbar .help{display:none}}
@media(max-width:900px){.world-main.view-map{display:block}.chart-area{padding:18px}.chart-title h1{font-size:32px}.view-map .port-panel{max-height:none;border-left:0;border-top:1px solid #d8dfd2}.view-map .panel-body{max-width:none}.city-scene{min-height:760px}.city-backdrop{object-position:center}.city-hotspot{font-size:15px;padding:8px;gap:5px}.city-hotspot span{width:28px;height:28px;font-size:20px}.city-heading{top:18px}.city-heading h1{font-size:40px}.city-dock{bottom:35px}.world-nav small{display:none}.world-nav b{font-size:22px}.world-nav button{min-height:58px}.office-stats{grid-template-columns:repeat(2,1fr)}.local-service{top:110px;bottom:95px;right:12px;width:min(430px,calc(100% - 24px))}.office-content{padding:18px}.topbar .brand small{display:none}.office-content .business-list{grid-template-columns:1fr}}
@media(max-width:600px){.brand{display:none}.topbar .resource{min-width:75px}.topbar .calendar{min-width:85px}.global-ship{min-width:100px}.world-nav{gap:4px;padding:8px}.world-nav button{gap:3px;padding:6px}.world-nav b{font-size:17px}.nav-icon{display:none}.city-scene{min-height:700px}.city-heading h1{font-size:34px}.city-hotspots{position:absolute;top:180px;left:12px;right:12px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.city-hotspot{position:static;transform:none;justify-content:center}.city-dock{left:3%;right:3%}.office-view{padding:18px}.office-stats>div{padding:12px}.office-stats strong{font-size:18px}.local-service{top:120px;bottom:84px}.chart-title h1{font-size:26px}}
.city-facts{position:absolute;left:24px;top:180px;width:220px;padding:18px;background:#fffbeeeb;border:1px solid #d8c9ab;border-radius:8px;box-shadow:0 3px 12px #28444730}.city-facts h3{font-family:Georgia,serif;font-size:18px;margin:0 0 14px}.city-facts p{font-size:14px;line-height:1.6;margin:6px 0 16px}.city-facts small{font-size:12px;color:#63776a}.has-place .city-facts{display:none}@media(max-width:900px){.city-facts{top:160px;width:185px;padding:13px}.city-facts p{font-size:12px}.city-facts h3{font-size:16px}}@media(max-width:600px){.city-facts{display:none}}
.topbar{position:sticky;top:0}.local-service{overscroll-behavior:contain}.city-hotspot:focus-visible{outline:3px solid #21686d;outline-offset:3px}
.world-main.view-map .map-wrap{width:100%;max-width:none;margin-inline:auto}.world-main.view-map #chart{height:auto;min-height:0;aspect-ratio:1000 / 570}.local-service .port-heading h2{font-size:30px;margin:8px 0}.local-service .tabs{margin-top:0}.local-service .market-label{padding-top:0}.local-service .goods-list{max-height:175px}#toast{bottom:105px;z-index:45}
.painted-map-base{pointer-events:none}.coast-depth{stroke:#287f90;stroke-width:9;opacity:.1}.coastal-waters{stroke:#e9f7df;stroke-width:3.5;opacity:.3}.coast-land{fill:#f2ebd3;fill-opacity:.055;stroke:#355e4c;stroke-opacity:.56;stroke-width:.55}.geo-label text,.sea-label,.ocean-label,.island-chain-label{paint-order:stroke;stroke:#fff4d8;stroke-opacity:.52;stroke-width:2px}.port-label{stroke:#fff8e7;stroke-width:4.5px}.route-path{filter:drop-shadow(0 1px 2px #083f4b99)}

/* Sprint 4A.2d: illustrative port settlements behind the live marker layer. */
.port-vignette-layer,.port-vignette{pointer-events:none}.port-vignette{opacity:.88;filter:drop-shadow(0 1.5px 1.5px #183d354d);transition:opacity .16s,filter .16s}.port-vignette.selected{opacity:1;filter:drop-shadow(0 0 2px #fff4c9) drop-shadow(0 0 5px #dcae50)}.map-mode-trade .port-vignette:not(.selected){opacity:.5;filter:saturate(.72) drop-shadow(0 1px 1px #183d353d)}.port-marker .port-halo{fill:#fff5c900;stroke:#fff4cf;stroke-width:1.5;opacity:0}.port-marker.selected .port-halo{opacity:.96;fill:#fff5c940;stroke:#b87025;stroke-width:2;filter:drop-shadow(0 0 4px #fff1a8)}.port-marker:focus-visible .port-halo{opacity:1;stroke:#174f59;stroke-width:2.5}

/* Sprint 4A.2e: one port-symbol language with historical visual hierarchy. */
.port-marker{transition:opacity .16s}.port-hit{fill:transparent}.port-plaque{fill:#fff8e3;stroke:#315e5d;stroke-width:1;filter:drop-shadow(0 1px 1px #173f4055)}.port-dot{stroke:#fffdf0;stroke-width:1.25}.port-access{fill:#755b32;stroke:#fff8df;stroke-width:.65}.port-core{opacity:1}.port-secondary{opacity:.56}.port-minor{opacity:.3}.map-density-mid .port-secondary{opacity:.82}.map-density-mid .port-minor{opacity:.42}.map-density-near .port-secondary{opacity:.94}.map-density-near .port-minor{opacity:.7}.map-mode-trade .port-secondary{opacity:.78}.map-mode-trade .port-minor{opacity:.52}.port-marker.selected,.port-marker:focus-visible{opacity:1}.port-marker.selected .port-plaque{fill:#fff1bd;stroke:#a96321;stroke-width:1.7}.port-label-core{font-weight:700;letter-spacing:.08px}.port-label-secondary{font-weight:600}.port-label-minor{font-weight:500}.label-leader{stroke:#315957;stroke-width:.65;opacity:.32}.port-marker.selected .port-label{font-weight:700}.map-mode-trade .port-label{stroke-width:5px}

/* Sprint 4A.2c: illustrative, data-driven ship layer. */
.map-ship-visual{pointer-events:none;transform-box:fill-box;transform-origin:center;transition:opacity .16s,transform .16s}.map-ship-visual .ship-artwork{filter:drop-shadow(0 2px 2px #0b323b99)}.map-ship-visual .ship-ring{fill:#fff6d0cc;stroke:var(--ship-accent);stroke-width:2.2;opacity:0}.map-ship-visual.active .ship-ring{opacity:.92;filter:drop-shadow(0 0 5px #fff5b8)}.map-ship-visual .ship-wake{fill:none;stroke:#edf8e8;stroke-width:2.2;stroke-linecap:round;opacity:.65}.map-ship-visual .ship-config-pennant{fill:var(--ship-accent);stroke:#fff8de;stroke-width:.6;opacity:.82}.map-ship-visual.ship-config-merchant .ship-config-pennant{opacity:.28}.map-ship-visual.ship-config-military .ship-artwork{filter:contrast(1.08) saturate(.92) drop-shadow(0 2px 2px #0b323b99)}.map-ship-visual.ship-config-pirate .ship-artwork{filter:brightness(.8) contrast(1.14) saturate(.72) drop-shadow(0 2px 2px #0b202699)}[data-fleet-marker] .map-ship-visual{opacity:.76}[data-fleet-marker]:focus-visible .map-ship-visual,[data-fleet-marker]:hover .map-ship-visual{opacity:1;transform:scale(1.08)}#ship-on-map .map-ship-visual{transform:scale(1.08)}
.ship-illustration{position:relative;display:inline-grid;place-items:center;flex:0 0 auto;width:94px;height:66px}.ship-illustration img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 3px #163b3c45)}.ship-illustration i{position:absolute;left:4px;top:8px;width:16px;height:10px;background:var(--ship-accent);clip-path:polygon(0 0,100% 0,68% 50%,100% 100%,0 100%);opacity:.88}.ship-illustration.ship-config-merchant i{opacity:.3}.ship-illustration.ship-config-military img{filter:contrast(1.08) saturate(.92) drop-shadow(0 3px 3px #163b3c45)}.ship-illustration.ship-config-pirate img{filter:brightness(.8) contrast(1.14) saturate(.72) drop-shadow(0 3px 3px #16242666)}
.ship-illustration-summary{width:106px;height:72px;margin:-6px 0}.ship-symbol{display:none}.ship-illustration-dock{float:left;width:88px;height:62px;margin:-6px 10px -2px -4px}.dock-ship>.ship-illustration{font-size:initial}.ship-illustration-harbor{width:112px;height:80px}.harbor-ship>div{flex:1;min-width:170px}.ship-illustration-fleet{width:108px;height:76px;grid-row:1/span 4}.fleet-card{grid-template-columns:auto minmax(0,1fr);align-items:center}.fleet-card-copy{display:grid;gap:6px}.fleet-card-copy>b{font-size:18px}.fleet-card-copy>span{font-size:14px}.ship-illustration-yard-active{float:right;width:122px;height:86px;margin:-9px 0 8px 10px}.yard-ship{display:grid;grid-template-columns:100px minmax(0,1fr);column-gap:12px;align-items:center}.yard-ship>.button{grid-column:1/-1}.ship-illustration-yard-offer{width:100px;height:72px}.ship-modal-heading{display:flex;align-items:center;gap:18px}.ship-modal-heading h2{margin-block:10px}.ship-illustration-modal{width:150px;height:106px}
@media(max-width:800px){.map-ship-visual{transform:scale(1.1)}#ship-on-map .map-ship-visual{transform:scale(1.2)}.ship-illustration-summary{display:grid;width:84px;height:58px;margin:-4px 0}.ship-illustration-fleet{width:88px;height:64px}.ship-illustration-modal{width:118px;height:86px}.ship-modal-heading{gap:10px}.ship-modal-heading h2{font-size:34px}.ship-illustration-harbor{width:92px;height:68px}.ship-illustration-dock{width:76px;height:56px}.yard-ship{grid-template-columns:84px minmax(0,1fr)}.ship-illustration-yard-offer{width:84px;height:62px}}
@media(max-width:520px){.ship-illustration-summary{display:none}.fleet-card{grid-template-columns:76px minmax(0,1fr)}.ship-illustration-fleet{width:76px;height:58px}.ship-illustration-modal{width:98px;height:74px}.ship-illustration-yard-active{width:96px;height:72px}.harbor-ship{align-items:center}.harbor-ship .button{width:100%}}

/* Sprint 4A.3: map-first HUD and compact context. */
.ui-icon{display:block;width:1.45em;height:1.45em;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
/* Sprint 4A.4: painterly navigation emblems derived from the harbor-world art direction. */
.nav-icon{display:grid;place-items:center;width:58px;height:52px;flex:0 0 58px;color:#42676a}
.nav-art{display:block;width:58px;height:52px;object-fit:contain;opacity:.88;filter:saturate(.83) contrast(.98) drop-shadow(0 1px 1px #173f4335);transform:scale(.94);transition:opacity .16s,filter .16s,transform .16s}
.world-nav{gap:6px;padding:8px 18px;background:#f0e9d9f8}
.world-nav button{gap:9px;padding:5px 12px;min-height:68px;border-color:#d9d0bb;background:linear-gradient(180deg,#fffef8,#f8f2e4)}
.world-nav button:hover:not(:disabled) .nav-art,.world-nav button:focus-visible .nav-art{opacity:1;filter:saturate(1) contrast(1.02) drop-shadow(0 2px 2px #173f4350);transform:scale(1)}
.world-nav button.active{box-shadow:inset 0 2px #d8b66a,0 2px 8px #173f4326}
.world-nav button.active .nav-art{opacity:1;filter:saturate(1.08) brightness(1.04) drop-shadow(0 2px 2px #082d335c);transform:scale(1.04)}
.world-nav button:disabled{opacity:.58;color:#75827b}
.world-nav button:disabled .nav-art{opacity:.42;filter:grayscale(.62) saturate(.35) contrast(.9)}
.world-nav b{font-size:20px}
.world-nav small{font-size:10px;margin-top:2px;color:#6d7a73}
.world-nav button.active small{color:#dfeceb}
.chart-area{padding-top:16px}
.map-hud{position:absolute;z-index:8;top:12px;left:12px;right:58px;display:flex;align-items:center;gap:7px;pointer-events:none}
.map-hud>*{pointer-events:auto}
.chart-modes{display:flex;flex:0 0 auto;padding:3px;background:#173f43e8;border:1px solid #d8e0d6;border-radius:8px;box-shadow:0 3px 12px #133b4050}
.chart-modes button{min-height:36px;padding:7px 13px;border:0;border-radius:5px;background:transparent;color:#f8f3df;font-size:13px}
.chart-modes button.active{background:#fffaf0;color:#173f43;box-shadow:0 1px 4px #0f303550;font-weight:700}
.map-control{display:flex;align-items:center;gap:7px;height:44px;padding:4px 7px 4px 10px;background:#fffaf0ed;border:1px solid #ded5bd;border-radius:8px;box-shadow:0 3px 12px #133b4038;color:#385b5d}
.map-control>span{font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.map-control select{min-height:34px;max-width:145px;padding:5px 24px 5px 7px;border:0;border-left:1px solid #d8d1bf;background:#fffdf5;color:#243e42;font-size:13px;font-weight:600}
.map-port-picker{margin-left:auto}
.map-status{display:none;padding:7px 10px;background:#fffaf0df;border:1px solid #ded5bd;border-radius:7px;color:#31585a;font-size:11px;font-weight:700;letter-spacing:.35px;text-transform:uppercase;box-shadow:0 2px 8px #133b4030}
.map-zoom{z-index:9;top:12px;right:12px;border:1px solid #d8d0ba;border-radius:8px}
.map-zoom button{display:grid;place-items:center;width:36px;height:36px;background:#fffaf0f2;color:#244b4e;font-size:15px}
.map-zoom .ui-icon{width:18px;height:18px}
.voyage-strip{margin-top:10px;min-height:64px;padding:11px 14px;border-color:#d1dbd1;background:#edf1e9}
.voyage-strip.docked{display:grid;grid-template-columns:auto minmax(160px,1fr) auto;gap:12px}
.voyage-strip .status-icon .ui-icon{width:23px;height:23px}
.ship-hud-copy small{display:block;color:#61766f;font-size:10px;font-weight:700;letter-spacing:1.15px}
.ship-hud-copy strong{display:block;margin-top:4px;font-family:Georgia,serif;font-size:18px;font-weight:400}
.ship-hud-copy strong span{margin-left:5px;color:#627772;font:12px 'DM Sans',sans-serif}
.ship-hud-metrics{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.ship-hud-metrics span{padding:6px 8px;border:1px solid #d2dbcf;border-radius:999px;background:#fffdf5;color:#46645f;font-size:11px;white-space:nowrap}

@media(max-width:1100px){.world-nav{padding:7px 12px}.world-nav button{gap:6px;padding:5px 7px;min-height:64px}.world-nav b{font-size:18px}.world-nav small{font-size:9px}.nav-icon{width:48px;height:46px;flex-basis:48px}.nav-art{width:48px;height:46px}.map-hud{right:56px}.map-control select{max-width:132px}}
@media(min-width:1250px){.map-status{display:block}}
@media(max-width:900px){.world-nav small{display:none}.world-nav button{min-height:62px}.world-nav b{font-size:17px}.nav-icon{width:46px;height:44px;flex-basis:46px}.nav-art{width:46px;height:44px}.map-status{display:none}}
@media(max-width:600px){.world-nav{gap:3px;padding:6px 5px}.world-nav button{display:grid;grid-template-rows:34px auto;gap:1px;padding:3px 2px;text-align:center;min-height:58px}.world-nav b{font-family:'DM Sans',sans-serif;font-size:12px;font-weight:700}.nav-icon{display:grid;width:38px;height:34px;flex-basis:34px;margin:auto}.nav-art{width:38px;height:34px}.map-hud{top:8px;left:8px;right:50px;align-items:flex-start;flex-wrap:wrap;gap:5px}.chart-modes button{padding:6px 9px}.map-control{height:40px}.map-control>span{display:none}.map-control select{max-width:118px;border-left:0}.map-port-picker{margin-left:0}.map-zoom{top:8px;right:8px}.map-zoom button{width:32px;height:32px}.voyage-strip.docked{grid-template-columns:auto 1fr}.ship-hud-metrics{grid-column:1/-1;justify-content:flex-start}.ship-hud-copy strong span{display:block;margin:3px 0 0}}

/* Commodity signets in the illustrated city facts remain compact and calm. */
.city-goods{display:flex!important;flex-wrap:wrap;gap:5px 8px;margin-top:5px!important}
.city-good{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.city-good .good-signet{color:#5f4f33;background:#f7eed6;border:1px solid #ddcda4;border-radius:50%;padding:2px}
.city-facts>p:first-of-type{display:flex;align-items:center;gap:6px}.city-facts>p:first-of-type>.ui-icon{width:17px;height:17px;color:#806c42}.city-hotspot>span{display:inline-grid;place-items:center}.city-hotspot>span>.ui-icon{width:19px;height:19px;stroke-width:1.7}
.hotspot-art{width:30px;height:30px;object-fit:contain;display:block;filter:drop-shadow(0 1px 1px rgba(45,32,20,.22))}.city-hotspot>span{display:grid;place-items:center}
/* fixed map workspace: only the port panel may scroll */
@media(min-width:901px){.world-main.view-map{height:calc(100vh - 78px - 72px);min-height:0;overflow:hidden}.world-main.view-map .chart-area{height:100%;min-height:0;display:flex;flex-direction:column}.world-main.view-map .map-wrap{flex:1;min-height:0}.world-main.view-map #chart{height:100%;aspect-ratio:auto}.world-main.view-map .voyage-strip{flex:0 0 auto}.world-main.view-map .port-panel{height:100%;min-height:0;overflow-y:auto}.world-main.view-map~footer{display:none}}
.brand-logo{display:block;width:220px;height:auto;max-height:56px;object-fit:contain;object-position:left center}.brand{min-width:220px}.brand-logo+span{display:none}@media(max-width:900px){.brand-logo{width:180px;max-height:48px}.brand{min-width:180px}}@media(max-width:600px){.brand-logo{width:150px;max-height:40px}.brand{min-width:150px}}
.modal{max-height:88vh}.modal-scroll{max-height:62vh;overflow:auto;padding-right:8px}.modal-scroll .port-heading{padding:8px 0}.modal-scroll .port-intelligence{display:none}
/* Stadt-Hotspots werden ausschließlich im großen Modal dargestellt. */
.view-city.has-place{display:block}.view-city.has-place .local-service{display:none}
/* Auf der Seekarte bleibt der Markt im Hafenmodal; rechts kein zweites Handelsfenster. */
.world-main.view-map{display:block}.world-main.view-map>.chart-area{width:100%}.world-main.view-map>.port-panel{display:block;position:fixed;left:-10000px;width:1px;height:1px;overflow:hidden}.world-main.view-map>.port-panel .port-heading,.world-main.view-map>.port-panel .port-intelligence,.world-main.view-map>.port-panel .trade-outlook,.world-main.view-map>.port-panel .tabs,.world-main.view-map>.port-panel .panel-body{display:none}.world-main.view-map>.port-panel .depart-box{position:fixed;left:24px;right:24px;bottom:88px;z-index:20}
/* Handelsmodale: klarer Kopf, nutzbare Breite und ein stabiler Scrollbereich. */
.modal-scroll{min-width:0;scroll-behavior:smooth}.modal-scroll .tabs{position:sticky;top:0}.modal-scroll .trade-card{margin-bottom:12px}.modal-scroll .quantity-line input{width:7rem;box-sizing:border-box}.modal-scroll .button.full{width:100%}
/* Marketplace V2: only this view opts out of the map's global viewport lock. */
.world-main.view-marketplace{display:block;min-height:calc(100dvh - 78px - 72px);overflow:visible}
.world-main.view-marketplace .marketplace-page{min-height:calc(100dvh - 78px - 72px);padding-bottom:calc(130px + env(safe-area-inset-bottom))}
.marketplace-page .marketplace-header{padding-top:4px;padding-bottom:14px}.marketplace-page .marketplace-header h1{font-size:34px;margin:4px 0}.marketplace-page .marketplace-header p{font-size:13px}.marketplace-page .marketplace-layout{margin-top:16px}.marketplace-page .marketplace-main>h2{font-size:24px;margin-bottom:8px}.marketplace-page .market-label{padding:8px 0 6px}.marketplace-page .good-row{min-height:55px;padding:7px 8px}.marketplace-page .good-name{flex:1;min-width:0}.marketplace-page .good-name small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.marketplace-page .good-prices{gap:18px}.marketplace-page .inline-trade{margin-bottom:7px;padding:10px}.marketplace-page .quantity-controls{display:flex;gap:4px;align-items:center}.marketplace-page .quantity-controls button{min-width:38px;min-height:38px;padding:4px;border:1px solid #d7e0d1;border-radius:4px;background:#fffefa;font-size:12px}.marketplace-page .quantity-controls input{width:62px;min-height:38px;padding:5px}.marketplace-page .trade-actions .button{width:100%;min-height:44px}.marketplace-page .marketplace-aside{gap:14px}.marketplace-page .marketplace-aside>div{padding-bottom:12px}
@media(min-width:901px){.world-main.view-marketplace~footer{display:block}}
.marketplace-open{height:auto!important;min-height:100%;overflow-x:hidden!important;overflow-y:auto!important}
@media(max-width:900px){.world-main.view-marketplace{min-height:0}.world-main.view-marketplace .marketplace-page{min-height:0;padding-bottom:calc(130px + env(safe-area-inset-bottom))}.marketplace-page .marketplace-header{gap:12px}.marketplace-page .marketplace-layout{margin-top:12px}.marketplace-page .marketplace-aside{margin-top:18px}}
@media(max-width:600px){.marketplace-page .marketplace-header h1{font-size:29px}.marketplace-page .marketplace-header p{font-size:12px}.marketplace-page .good-prices{gap:8px}.marketplace-page .price-cell small{font-size:8px}.marketplace-page .good-prices b{font-size:14px}.marketplace-page .quantity-controls{flex-wrap:wrap}.marketplace-page .quantity-controls input{order:0}.marketplace-page .quantity-controls button{min-width:40px}}

/* Kontor directory: one full-page entry point for owned offices and docked fleet. */
.office-directory-view{min-height:100%;padding:clamp(24px,5vw,64px) clamp(16px,5vw,72px) 72px;background:linear-gradient(180deg,#e7eee7,#f5eddd)}
.office-directory-heading{max-width:980px;margin:0 auto 28px}.office-directory-heading h1{margin:6px 0;font-family:'Libre Caslon Display',Georgia,serif;font-size:clamp(34px,5vw,58px);font-weight:400;color:#173f43}.office-directory-heading p{max-width:680px;color:#58716d;font-size:16px;line-height:1.6}.office-directory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;max-width:1120px;margin:0 auto}.office-directory-card{padding:20px;border:1px solid #d5d9c8;border-radius:12px;background:#fffdf4e8;box-shadow:0 8px 22px #173f4314}.office-directory-card-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.office-directory-card .place-nation{display:flex;align-items:center;gap:7px}.office-directory-card h2{margin:12px 0 6px;font-family:'Libre Caslon Display',Georgia,serif;font-size:32px;font-weight:400;color:#173f43}.office-directory-card p{min-height:48px;margin:0;color:#5d756f;line-height:1.5}.office-access-tag{padding:4px 7px;border-radius:999px;background:#e3eee1;color:#52725f;font-size:9px;font-weight:800;letter-spacing:1px;white-space:nowrap}.ship-only .office-access-tag{background:#f3e5c8;color:#886b39}.office-directory-ships{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0;min-height:23px}.office-directory-ships span{padding:4px 8px;border-radius:999px;background:#edf2eb;color:#466660;font-size:12px}.office-directory-actions{display:flex;flex-wrap:wrap;gap:8px}.office-directory-actions .button{flex:1;min-width:120px}.office-directory-back{display:block;margin:0 0 16px;border:0;background:transparent;color:#22616a;font-weight:700;cursor:pointer}.office-management{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;margin-top:18px;padding:15px;border:1px solid #d6dccd;border-radius:9px;background:#f2f5eb}.office-management h3{margin:4px 0;font-size:18px;color:#214d50}.office-management p{margin:0;color:#5d756f;font-size:13px;line-height:1.45}.office-management-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:7px}.office-management-actions .button{white-space:nowrap}.office-management>small{grid-column:1/-1;color:#72817a;font-size:11px}.business-card .button.danger{border-color:#d9b0a0;color:#8a4e3a;background:#fff6ef}
@media(max-width:700px){.office-directory-view{padding:24px 12px 48px}.office-directory-grid{grid-template-columns:1fr}.office-management{grid-template-columns:1fr}.office-management-actions{justify-content:flex-start}.office-management-actions .button{flex:1;white-space:normal}}

/* Gemeinsame App-Shell und Full-Bleed-Hauptansichten. */
#app{min-height:100dvh;display:flex;flex-direction:column}
#app>.topbar{flex:0 0 auto}
#app>.world-main{flex:1 1 auto;min-height:0;width:100%;max-width:none;position:relative;margin:0}
#app>.world-nav{position:relative;inset:auto;flex:0 0 auto;width:100%}
#app>footer{flex:0 0 auto}
body{padding-bottom:0}
.game-view--fullbleed{width:100%;height:100%;min-height:0;position:relative;margin:0;max-width:none}
.world-main.view-map{display:flex;flex-direction:column;height:auto;overflow:hidden}
.world-main.view-map>.chart-area{flex:1 1 auto;min-height:0;height:auto;width:100%;padding:0;display:flex}
.world-main.view-map>.chart-area>.map-wrap{flex:1 1 auto;min-height:0;width:100%;height:100%;margin:0;max-width:none;border:0;border-radius:0;box-shadow:none;background:transparent}
.world-main.view-map #chart{width:100%;height:100%;min-height:0;aspect-ratio:auto;display:block}
.world-main.view-marketplace{display:flex;flex-direction:column;min-height:0;overflow-x:hidden;overflow-y:auto}
.world-main.view-marketplace>.marketplace-page.game-view--fullbleed{flex:1 0 auto;width:100%;max-width:none;min-height:100%;margin:0;box-sizing:border-box}
.world-main.view-office{display:flex;flex-direction:column;min-height:0;overflow-x:hidden;overflow-y:auto}
.world-main.view-office>.office-view.game-view--fullbleed{flex:1 0 auto;width:100%;max-width:none;min-height:100%;margin:0;box-sizing:border-box}
.office-heading{position:relative;min-height:150px;padding-right:200px}.office-building-art{position:absolute;right:10px;bottom:-18px;width:174px;height:174px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 7px #173f4326);pointer-events:none}.office-management{grid-template-columns:96px minmax(0,1fr) auto;align-items:center}.office-management-copy{display:flex;grid-column:1 / 3;gap:12px;align-items:center;min-width:0}.office-manager-art{display:block;flex:0 0 86px;width:86px;height:96px;object-fit:contain;object-position:center bottom;align-self:end}.office-management-copy>div{min-width:0}.career-menu-view{display:grid;gap:14px}.career-menu-view>h2{margin:0 0 4px}.career-menu-view .career-overview{margin-bottom:0}.career-menu-view .career-national-card{margin-top:2px}@media(max-width:700px){.office-heading{min-height:124px;padding-right:130px}.office-building-art{right:0;bottom:-10px;width:126px;height:126px}.office-management{grid-template-columns:1fr}.office-management-copy{grid-column:1}.office-management-actions{grid-column:1;justify-content:flex-start}.office-manager-art{flex-basis:72px;width:72px;height:82px}}
.career-rank-art{background:#dfe8df}@media(max-width:760px){.career-rank-card{grid-template-columns:minmax(150px,42%) minmax(0,1fr);gap:12px}.career-rank-score{grid-column:2;min-width:0;text-align:left}}@media(max-width:420px){.career-rank-card{grid-template-columns:1fr}.career-rank-score{grid-column:auto}.career-rank-art{max-height:180px}}

/* Ortsansichten: Szene als eigene Vollseite, Aktionen bleiben im bestehenden Inhalt. */
#app>.world-main.location-view{display:block;min-height:0;overflow-x:hidden;overflow-y:auto;background:#dfe8df}
#app>.world-main.location-view>.city-scene{display:none}
#app>.world-main.location-view>.local-service{display:block;position:static;inset:auto;width:100%;max-width:none;min-height:100%;max-height:none;overflow:visible;padding:0;background:linear-gradient(180deg,#e8eee6 0%,#f5eddd 100%);border:0;border-radius:0;box-shadow:none}
#app>.world-main.location-view .location-page-toolbar{position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0;padding:14px clamp(16px,4vw,48px);background:#fffbeded;border-bottom:1px solid #d8cfb8;box-shadow:0 2px 14px #173f4314}
#app>.world-main.location-view .location-page-toolbar strong{font-family:'Libre Caslon Display',Georgia,serif;font-size:26px;font-weight:400}
#app>.world-main.location-view .location-page-toolbar button{border:1px solid #cbbf9e;background:#fff8e8;border-radius:7px;padding:9px 14px;min-height:42px}
#app>.world-main.location-view .location-art{margin:0;border-radius:0;border:0;box-shadow:none;background:#cdded8}
#app>.world-main.location-view .location-art img{display:block;width:100%;height:clamp(210px,30vh,360px);object-fit:cover;object-position:center}
#app>.world-main.location-view .location-place{padding:0 clamp(16px,4vw,48px) 48px}
#app>.world-main.location-view>.local-service>.location-art,
#app>.world-main.location-view>.local-service>.port-heading,
#app>.world-main.location-view>.local-service>.port-intelligence,
#app>.world-main.location-view>.local-service>.trade-outlook,
#app>.world-main.location-view>.local-service>.tabs,
#app>.world-main.location-view>.local-service>.panel-body,
#app>.world-main.location-view>.local-service>.depart-box{max-width:1280px;margin-left:auto;margin-right:auto}
#app>.world-main.location-view .port-heading{padding:28px clamp(16px,4vw,48px) 18px}
#app>.world-main.location-view .tabs{padding-inline:clamp(16px,4vw,48px)}
#app>.world-main.location-view .panel-body{padding:0 clamp(16px,4vw,48px) 30px}
#app>.world-main.location-view .depart-box{border-radius:0}
#app>.world-main.location-view .office-view{width:100%;max-width:none;margin:0;padding:0 0 48px}
.marketplace-page>.location-art img{height:clamp(180px,26vh,300px)}
.office-view>.location-art img{height:clamp(200px,28vh,330px)}
@media(max-width:600px){#app>.world-main.location-view .location-page-toolbar strong{font-size:22px}#app>.world-main.location-view .location-art img{height:clamp(180px,27vh,250px)}#app>.world-main.location-view .location-place{padding-bottom:30px}}
.world-main.view-map>.port-panel .depart-box{left:auto;right:20px;bottom:84px;width:min(360px,calc(100vw - 40px));padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;border:1px solid #cbd8cd;border-radius:12px;background:#f7fbf4f5;box-shadow:0 10px 30px #173f4330;backdrop-filter:blur(8px)}.world-main.view-map>.port-panel .depart-box>div{min-width:0}.world-main.view-map>.port-panel .depart-box strong{overflow-wrap:anywhere}.world-main.view-map>.port-panel .depart-box .button{align-self:center;white-space:nowrap}.world-main.view-map>.port-panel .depart-box small{grid-column:1/-1}.world-main.view-map>.port-panel .depart-box .trade-in-warning{margin-top:0}
@media(max-width:900px){.world-main.view-map>.port-panel .depart-box{right:12px;bottom:76px;width:min(350px,calc(100vw - 24px));padding:12px 14px}.world-main.view-map>.port-panel .depart-box strong{font-size:12px}.world-main.view-map>.port-panel .depart-box .button{padding:9px 11px}}
.trade-in-warning,.trade-in-reserved{color:#8b4b26;font-weight:600}.trade-in-warning{padding:.7rem .85rem;border:1px solid #d6a46d;border-radius:.7rem;background:#fff4e5}.trade-in-reserved{display:block;margin-top:.25rem;font-size:.82rem}
.location-art{position:relative;margin:0 0 16px;overflow:hidden;border:1px solid #d7ceb8;border-radius:10px;background:#dce7dd;box-shadow:0 5px 16px #173f4318}.location-art img{display:block;width:100%;height:138px;object-fit:cover;object-position:center}.location-art-marketplace{margin:0 0 12px;border-radius:9px}.location-art-marketplace img{height:128px}.location-art-shipyard{margin:0 0 14px}.location-art-shipyard img{height:122px}.location-art-governor img{height:150px}.location-place>.location-art{margin-bottom:16px}.local-service .location-art{margin:0 -2px 14px}.local-service .location-art img{height:128px}.office-view>.location-art{max-width:100%;margin:0 0 24px}.office-view>.location-art img{height:172px}.marketplace-page{width:min(1240px,100%);margin:0 auto;padding-inline:clamp(14px,3vw,34px)}.marketplace-page>.location-art{max-width:1180px}.marketplace-page>.location-art img{object-position:center 48%}.marketplace-page .marketplace-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px);gap:22px}.marketplace-page .marketplace-main,.marketplace-page .marketplace-aside{min-width:0}.marketplace-page .marketplace-aside>div{background:#fffdf4;border:1px solid #d6dacb;border-radius:8px;padding:16px}.location-place{min-width:0}.location-place .place-story{min-width:0}@media(max-width:900px){.location-art img{height:112px}.location-art-marketplace img{height:108px}.location-art-shipyard img{height:102px}.location-art-governor img{height:120px}.office-view>.location-art img{height:132px}.marketplace-page .marketplace-layout{grid-template-columns:1fr;gap:14px}.marketplace-page .marketplace-aside{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:0}.marketplace-page .marketplace-aside>div{padding:12px}}@media(max-width:600px){.location-art{margin-bottom:12px}.location-art img{height:96px}.location-art-marketplace img{height:92px}.location-art-shipyard img{height:88px}.location-art-governor img{height:104px}.office-view>.location-art img{height:108px}.marketplace-page{padding-inline:12px}.marketplace-page .marketplace-aside{display:block}.marketplace-page .marketplace-aside>div{margin-top:10px}}
/* Screenshot-2 scene layout overrides are appended below the legacy drawer rules. */

/* Screenshot-2 model: the artwork is the room, the interaction is a light panel on top. */
#app>.world-main.location-scene-view,
#app>.world-main.view-marketplace:has(.scene-background-view){
  display:block;
  position:relative;
  height:calc(100dvh - 78px - 74px);
  min-height:0;
  overflow:hidden;
  background:#2d5557;
}
#app>.world-main.location-scene-view>.location-background-art,
#app>.world-main.view-marketplace .scene-background-view>.location-background-art{
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  pointer-events:none;
  background:#2d5557;
}
#app>.world-main.location-scene-view>.location-background-art img,
#app>.world-main.view-marketplace .scene-background-view>.location-background-art img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
#app>.world-main.location-scene-view>.local-service,
#app>.world-main.location-scene-view>.office-view,
#app>.world-main.view-marketplace .scene-background-view>.marketplace-layout{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:min(680px,calc(100% - 36px));
  height:calc(100% - 24px);
  min-height:0;
  max-height:none;
  margin:12px 18px 12px auto;
  overflow-x:hidden;
  overflow-y:auto;
  background:#fffdf4f2;
  border:1px solid #d4d7c7;
  border-radius:12px;
  box-shadow:0 10px 42px #173f4366;
  scrollbar-gutter:stable;
}
#app>.world-main.location-scene-view>.local-service{
  padding:0;
}
#app>.world-main.location-scene-view>.local-service .location-page-toolbar{
  position:sticky;
  top:0;
  z-index:5;
  margin:0;
  padding:16px 22px;
  background:#fffdf4f5;
  backdrop-filter:blur(8px);
}
#app>.world-main.location-scene-view>.local-service .location-page-toolbar strong{
  font-size:28px;
}
#app>.world-main.location-scene-view>.local-service .location-page-toolbar button{
  border:0;
  background:transparent;
  padding:8px 0;
  color:#205c62;
  font-weight:700;
}
#app>.world-main.location-scene-view>.local-service .location-place{
  padding:22px 24px 34px;
}
#app>.world-main.location-scene-view>.local-service .port-heading{
  padding:22px 24px 14px;
}
#app>.world-main.location-scene-view>.local-service .port-intelligence,
#app>.world-main.location-scene-view>.local-service .trade-outlook{
  margin-inline:24px;
}
#app>.world-main.location-scene-view>.local-service .tabs{
  padding-inline:24px;
}
#app>.world-main.location-scene-view>.local-service .panel-body{
  padding:0 24px 28px;
}
#app>.world-main.location-scene-view>.local-service .depart-box{
  margin-inline:24px;
  border-radius:8px;
}
#app>.world-main.location-scene-view>.office-view{
  padding:0 24px 30px;
}
#app>.world-main.location-scene-view>.office-view .office-heading{
  position:sticky;
  top:0;
  z-index:5;
  margin:0 -24px 20px;
  padding:18px 24px 14px;
  background:#fffdf4f5;
  backdrop-filter:blur(8px);
}
#app>.world-main.view-marketplace:has(.scene-background-view){
  overflow:hidden;
}
#app>.world-main.view-marketplace .scene-background-view{
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
  padding:0;
  overflow:hidden;
}
#app>.world-main.view-marketplace .scene-background-view>.marketplace-header{
  position:absolute;
  z-index:3;
  top:18px;
  left:24px;
  max-width:360px;
  padding:14px 18px;
  background:#fffdf4e8;
  border:1px solid #d5d1be;
  border-radius:9px;
  box-shadow:0 5px 20px #173f4333;
}
#app>.world-main.view-marketplace .scene-background-view>.marketplace-header h1{
  margin:4px 0;
}
#app>.world-main.view-marketplace .scene-background-view>.marketplace-header .back-city{
  margin-bottom:8px;
}
#app>.world-main.view-marketplace .scene-background-view>.marketplace-layout{
  display:block;
  padding:22px 24px 34px;
}
#app>.world-main.view-marketplace .scene-background-view .marketplace-main>h2{
  margin-top:0;
}
#app>.world-main.view-marketplace .scene-background-view .marketplace-aside{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:18px;
}
#app>.world-main.view-marketplace .scene-background-view .marketplace-aside>div{
  padding:12px;
}
@media(max-width:900px){
  #app>.world-main.location-scene-view,
  #app>.world-main.view-marketplace:has(.scene-background-view){
    height:calc(100dvh - 78px - 72px);
  }
  #app>.world-main.location-scene-view>.local-service,
  #app>.world-main.location-scene-view>.office-view,
  #app>.world-main.view-marketplace .scene-background-view>.marketplace-layout{
    width:min(620px,calc(100% - 20px));
    height:calc(100% - 20px);
    margin:10px 10px 10px auto;
  }
}
@media(max-width:600px){
  #app>.world-main.location-scene-view,
  #app>.world-main.view-marketplace:has(.scene-background-view){
    height:calc(100dvh - 78px - 68px);
  }
  #app>.world-main.location-scene-view>.local-service,
  #app>.world-main.location-scene-view>.office-view,
  #app>.world-main.view-marketplace .scene-background-view>.marketplace-layout{
    width:100%;
    height:100%;
    margin:0;
    border-radius:0;
    border-inline:0;
  }
  #app>.world-main.location-scene-view>.local-service .location-place,
  #app>.world-main.location-scene-view>.local-service .port-heading,
  #app>.world-main.location-scene-view>.local-service .panel-body{
    padding-inline:18px;
  }
  #app>.world-main.location-scene-view>.local-service .tabs{
    padding-inline:18px;
  }
  #app>.world-main.location-scene-view>.local-service .port-intelligence,
  #app>.world-main.location-scene-view>.local-service .trade-outlook,
  #app>.world-main.location-scene-view>.local-service .depart-box{
    margin-inline:18px;
  }
  #app>.world-main.view-marketplace .scene-background-view>.marketplace-header{
    top:10px;
    left:10px;
    right:10px;
    max-width:none;
  }
  #app>.world-main.view-marketplace .scene-background-view>.marketplace-layout{
    padding:18px 18px 28px;
  }
  #app>.world-main.view-marketplace .scene-background-view .marketplace-aside{
    display:block;
  }
}
.career-overview{display:grid;gap:18px;margin:0 0 28px}.career-section-heading{border-bottom:1px solid var(--line);padding-bottom:14px}.career-section-heading h2{margin:5px 0 6px}.career-section-heading p{margin:0;color:var(--muted);max-width:70ch}.career-rank-card{display:grid;grid-template-columns:minmax(220px,38%) minmax(0,1fr) auto;justify-content:space-between;gap:18px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(135deg,#f7f4e8,#fffdf7)}.career-rank-art{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center;border-radius:10px;box-shadow:0 5px 15px #173f4318}.career-rank-card h3{margin:4px 0;font-size:1.7rem}.career-rank-card p{margin:0;color:var(--muted)}.career-rank-score{min-width:112px;text-align:right}.career-rank-score strong{display:block;font-size:2rem;color:var(--ink)}.career-rank-score span{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.career-progress{display:grid;gap:7px}.career-progress>div{display:flex;justify-content:space-between;color:var(--muted);font-size:.82rem}.career-progress b{color:var(--ink)}.career-progress meter{width:100%;height:12px}.career-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.career-metric{display:grid;gap:4px;padding:12px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.55)}.career-metric span,.career-metric small{color:var(--muted);font-size:.76rem}.career-metric strong{font-size:1.05rem}.career-reputation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.career-reputation-card{padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(249,248,239,.82)}.career-reputation-card h3{margin:5px 0 12px}.career-reputation-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-top:1px solid rgba(91,108,101,.16)}.career-reputation-row>div{display:grid;gap:2px}.career-reputation-row small{color:var(--muted);font-size:.78rem}.career-reputation-row>b{font-size:.8rem;color:var(--ink);white-space:nowrap}.career-flag-row{display:flex!important;align-items:center;gap:9px}.career-flag-row .nation-flag{width:30px;height:20px;object-fit:cover;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.18)}.career-charter{padding:16px;border-left:4px solid var(--accent,#b28a3b);background:#f4efe1}.career-charter h3{margin:4px 0}.career-charter p{margin:0;color:var(--muted)}.career-log{border-top:1px solid var(--line);padding-top:20px}.career-log h2{margin-top:5px}
.logbook-lower-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:18px;align-items:start}.career-national-card{align-self:start;padding:16px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,#f7f4e8,#fffdf7);box-shadow:0 4px 14px rgba(35,61,57,.06)}.career-national-card-heading{padding-bottom:12px;border-bottom:1px solid rgba(91,108,101,.16)}.career-national-card-heading h3{margin:4px 0 6px}.career-national-card-heading p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.45}.career-national-card-list{display:grid;gap:8px}.career-national-card-row{display:grid;gap:5px;padding:11px 0;border-bottom:1px solid rgba(91,108,101,.12)}.career-national-card-row:last-child{border-bottom:0;padding-bottom:0}.career-national-card-row p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.35}.career-national-card-row>small{color:var(--muted);font-size:.76rem}.career-national-mini-progress{display:grid;grid-template-columns:1fr auto;gap:5px 8px;color:var(--muted);font-size:.72rem}.career-national-mini-progress b{color:var(--ink)}.career-national-mini-progress meter{grid-column:1/-1;width:100%;height:8px}
@media(max-width:900px){.logbook-lower-grid{grid-template-columns:1fr}.career-national-card{order:2}}
@media(max-width:760px){.career-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.career-reputation-grid{grid-template-columns:1fr}.career-rank-card{align-items:flex-start}.career-rank-score{min-width:90px}}
@media(max-width:420px){.career-metric-grid{grid-template-columns:1fr}.career-rank-card{display:grid}.career-rank-score{text-align:left}}
.career-rank-requirements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;margin-top:10px}.career-rank-requirement{display:flex;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.55);font-size:.78rem;min-width:0}.career-rank-requirement span{min-width:0;color:var(--muted)}.career-rank-requirement b{white-space:nowrap;font-weight:600}.career-rank-requirement.met span{color:#2d705e}.career-rank-requirement.open span{color:#9a6b35}@media(max-width:760px){.career-rank-requirements{grid-template-columns:1fr}.career-rank-requirement{font-size:.76rem}}
.career-rank-card{grid-template-columns:minmax(220px,42%) minmax(80px,100px) minmax(0,1fr);align-items:center}.career-rank-art-wrap{position:static;width:100%;aspect-ratio:16/9;min-width:0}.career-rank-art-wrap .career-rank-art{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}.career-rank-emblem-wrap{display:grid;place-items:center;align-self:stretch;min-width:0;padding:8px;border-left:1px solid rgba(91,108,101,.14);border-right:1px solid rgba(91,108,101,.14);background:rgba(255,255,255,.28);border-radius:8px}.career-rank-emblem{position:static;width:min(88px,100%);height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 3px 5px #173f4340)}.career-rank-summary{min-width:0}.career-rank-summary h3{overflow-wrap:anywhere}.career-rank-summary .career-rank-score{margin-top:14px;min-width:0;text-align:left}.career-rank-summary .career-rank-score strong{font-size:1.65rem}@media(max-width:760px){.career-rank-card{grid-template-columns:minmax(150px,42%) minmax(72px,88px) minmax(0,1fr);gap:12px}.career-rank-emblem-wrap{padding:5px}.career-rank-summary .career-rank-score{text-align:left;grid-column:auto}}@media(max-width:560px){.career-rank-card{grid-template-columns:minmax(72px,88px) minmax(0,1fr);align-items:start}.career-rank-art-wrap{grid-column:1 / -1;max-height:none}.career-rank-emblem-wrap{min-height:92px}.career-rank-summary .career-rank-score{margin-top:10px}}@media(max-width:380px){.career-rank-card{grid-template-columns:1fr}.career-rank-emblem-wrap{justify-self:start;width:92px}.career-rank-summary .career-rank-score{text-align:left}}
.career-rank-art-wrap{position:relative;width:100%;aspect-ratio:16/9}.career-rank-art-wrap .career-rank-art{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center;border-radius:10px;box-shadow:0 5px 15px #173f4318}.career-rank-emblem{position:absolute;right:10px;bottom:10px;width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 3px 5px #173f4340)}@media(max-width:760px){.career-rank-card{grid-template-columns:minmax(150px,42%) minmax(0,1fr);gap:12px}.career-rank-score{grid-column:2;min-width:0;text-align:left}}@media(max-width:420px){.career-rank-card{grid-template-columns:1fr}.career-rank-score{grid-column:auto}.career-rank-art-wrap{max-height:180px}.career-rank-emblem{width:60px;height:60px}}
.career-national-paths{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(249,248,239,.82)}.career-national-paths>h3{margin:4px 0 2px}.career-national-path{display:grid;gap:7px;padding:12px 0;border-top:1px solid rgba(91,108,101,.16)}.career-national-path p{margin:0;color:var(--muted);font-size:.86rem}.national-market-report{margin-top:14px;padding:12px;border-left:3px solid #b28a3b;background:#f6f1e4}.national-market-report h3{margin:0 0 5px;font-size:.94rem}.national-market-report p{margin:0;color:var(--muted);font-size:.85rem}.governor-career{display:grid;gap:12px;margin-top:18px;padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(249,248,239,.86)}.governor-career h3{margin:4px 0}.governor-career h4{margin:4px 0;font-size:1.15rem}.governor-career p{color:var(--muted)}.governor-next{display:grid;gap:10px;padding-top:12px;border-top:1px solid rgba(91,108,101,.16)}.career-requirements{display:grid;gap:6px;list-style:none;padding:0;margin:0}.career-requirements li{display:flex;gap:8px;align-items:flex-start;font-size:.84rem}.career-requirements li b{width:18px}.career-requirements .met b{color:#4e8660}.career-requirements .open b{color:#a45d48}.active-privileges{display:grid;gap:8px;padding-top:12px;border-top:1px solid rgba(91,108,101,.16)}.active-privileges>div{display:grid;gap:2px;padding:9px;background:rgba(255,255,255,.58);border-radius:8px}.active-privileges small{color:var(--muted)}
.topbar .resource-with-art{display:flex;align-items:center;gap:9px;min-width:142px}.topbar .hud-art{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid #d9c99f;border-radius:9px;background:linear-gradient(145deg,#fff8df,#ead9ab);color:#8a6c2d;box-shadow:inset 0 1px #fffdf0,0 2px 5px #173f4312}.topbar .hud-graphic{display:block;width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.topbar .resource-copy{min-width:0}.topbar .resource-copy small{white-space:nowrap}.topbar .resource-copy strong{white-space:nowrap}.topbar .time-controls{display:flex;align-items:stretch;gap:2px;padding:4px}.topbar .time-controls button{display:grid;grid-template-rows:31px auto;place-items:center;gap:1px;width:46px;height:55px;padding:3px 4px;line-height:1;border:0}.topbar .time-controls button img{width:29px;height:29px;object-fit:contain}.topbar .time-controls button span{display:block;font-size:10px;line-height:13px;white-space:nowrap}.city-facts .population-fact{display:flex!important;align-items:center;gap:8px}.city-facts .population-fact .hud-graphic{width:28px;height:28px;padding:4px;border-radius:7px;background:#f3ead1;color:#806b3d;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.ship-name-banner{display:flex;align-items:center;gap:14px;margin:8px 0 16px;padding:10px 14px 10px 8px;border:1px solid #d6c59e;border-radius:10px;background:linear-gradient(105deg,#f6edcf,#fffdf4 68%);box-shadow:inset 0 1px #fffdf2,0 4px 12px #173f4312}.ship-name-art{flex:0 0 auto;width:144px;height:100px;display:grid;place-items:center;border-right:1px solid #decfae}.ship-name-art .ship-illustration-modal{width:136px;height:96px}.ship-name-copy{min-width:0}.ship-name-copy h2{margin:5px 0 6px;font-size:38px;line-height:1}.ship-name-port{display:block;color:#607873;font-size:13px}@media(max-width:800px){.topbar .resource-with-art{min-width:auto}.topbar .hud-art{width:32px;height:32px;flex-basis:32px}.topbar .hud-graphic{width:23px;height:23px}.topbar .time-controls button{width:42px;height:53px}.ship-name-art{width:116px;height:86px}.ship-name-art .ship-illustration-modal{width:110px;height:82px}.ship-name-copy h2{font-size:32px}}@media(max-width:600px){.topbar .resource-with-art{gap:5px}.topbar .hud-art{width:28px;height:28px;flex-basis:28px;border-radius:7px}.topbar .hud-graphic{width:20px;height:20px}.topbar .resource-copy small{font-size:8px;letter-spacing:1px}.topbar .resource-copy strong,.topbar .resource .gold{font-size:15px}.topbar .calendar{min-width:auto}.topbar .time-controls button{width:37px;height:50px;padding-inline:2px}.topbar .time-controls button img{width:25px;height:25px}.topbar .time-controls button span{font-size:9px}.ship-name-banner{gap:8px;padding:7px}.ship-name-art{width:94px;height:76px}.ship-name-art .ship-illustration-modal{width:90px;height:70px}.ship-name-copy h2{font-size:28px}.ship-name-port{font-size:11px}}

.topbar .hud-art .topbar-art{display:block;width:100%;height:100%;object-fit:contain}.topbar .topbar-art-cash{transform:scale(1.06)}.topbar .topbar-art-calendar{transform:scale(1.08)}.topbar .icon-button{display:grid;place-items:center;padding:3px}.topbar .topbar-menu-art{display:block;width:27px;height:28px;object-fit:contain}.battle-options button{display:grid;grid-template-columns:62px minmax(0,1fr);column-gap:10px;align-items:center}.battle-options button .battle-action-art{grid-row:1 / span 2;width:62px;height:56px;object-fit:contain}.battle-options button b,.battle-options button small{grid-column:2}.battle-options button small{margin-top:0}.text-button .battle-action-art{display:inline-block;width:28px;height:26px;object-fit:contain;vertical-align:middle;margin-right:5px}.dice-row .die{display:grid;grid-template-rows:54px auto;place-items:center;min-width:66px;font-size:0}.dice-row .die-art{display:block;width:54px;height:54px;object-fit:contain}.dice-row .die small{font-size:8px}.battle-status-art{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.battle-status-item{display:inline-flex!important;align-items:center;gap:3px!important;font-size:10px!important;color:var(--muted)}.battle-status-item img{width:22px;height:19px;object-fit:contain}.battle-ships meter{margin-top:8px}
.ship-detail-grid small{display:flex;align-items:center;gap:5px}.inline-status-art{width:23px;height:20px;object-fit:contain;vertical-align:middle}
.audience-pending{margin:0;padding:10px 12px;border-left:3px solid #b28a3b;background:#f5eedc;color:var(--ink)!important}.mission-card--active{border-color:#b28a3b;background:rgba(255,253,244,.86)}
.mission-card{grid-template-columns:118px minmax(0,1fr);align-items:start;gap:12px}.mission-card__visual{display:grid;gap:7px;min-width:0}.mission-card__content{display:grid;gap:8px;min-width:0}.mission-art{position:relative;display:grid;place-items:center;min-height:62px;overflow:hidden;border:1px solid rgba(91,108,101,.16);border-radius:9px;background:linear-gradient(145deg,#f4eddb,#fffdf7);color:var(--muted);text-align:center}.mission-art img{display:block;width:100%;height:100%;min-height:62px;max-height:88px;object-fit:contain}.mission-art--fallback{padding:8px;background:#f4eddb}.mission-art-fallback-label{font-size:.68rem;line-height:1.2}.mission-tier-art{min-height:30px;max-height:36px;border:0;background:transparent}.mission-tier-art img{min-height:30px;max-height:36px}.mission-card__top{min-width:0}.mission-card__top .eyebrow{min-width:0;line-height:1.3}.mission-description{max-width:42ch}.mission-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px}.mission-facts span{display:grid;gap:2px;min-width:0}.mission-facts small{font-size:.64rem;letter-spacing:.08em;color:var(--muted)}.mission-facts b{overflow-wrap:anywhere}.campaign-hero{display:grid;grid-template-columns:112px minmax(0,1fr) auto;align-items:center;gap:12px}.campaign-hero-art{min-height:74px}.campaign-hero-art img{min-height:74px;max-height:100px}.campaign-priority-art{width:46px;min-height:46px;max-height:46px;grid-row:1 / span 3;border:0;background:transparent}.campaign-priority-art img{min-height:46px;max-height:46px}.campaign-objective{grid-template-columns:46px minmax(0,1fr) auto;align-items:center}.campaign-objective>div{min-width:0}.campaign-objective>strong{grid-column:3;grid-row:1;white-space:nowrap}.campaign-objective>label,.campaign-delivery-buttons{grid-column:2 / -1}.campaign-objectives--offer .campaign-objective{grid-template-columns:46px minmax(0,1fr) auto}.campaign-objectives--offer .campaign-objective>span{grid-column:3;grid-row:1;align-self:center}.governor-missions .mission-list{grid-template-columns:repeat(2,minmax(0,1fr))}.governor-missions .mission-list--active{grid-template-columns:1fr}.governor-missions .mission-offers .mission-list{align-items:stretch}@media(max-width:760px){.mission-card{grid-template-columns:96px minmax(0,1fr)}.governor-missions .mission-list{grid-template-columns:1fr}.campaign-hero{grid-template-columns:88px minmax(0,1fr);align-items:start}.campaign-hero .mission-status{grid-column:2}.campaign-objective,.campaign-objectives--offer .campaign-objective{grid-template-columns:42px minmax(0,1fr)}.campaign-objective>strong,.campaign-objectives--offer .campaign-objective>span{grid-column:2;grid-row:auto;white-space:normal}.campaign-objective>label,.campaign-delivery-buttons{grid-column:2}}
.governor-campaign{display:grid;gap:12px;margin-top:18px;padding:16px;border:1px solid #c6b27e;border-radius:12px;background:linear-gradient(145deg,#f7f0dc,#fffdf7)}.governor-campaign h3{margin:4px 0}.governor-campaign>p{margin:0;color:var(--muted);line-height:1.45}.campaign-locked{border-color:var(--line);background:rgba(249,248,239,.7)}.campaign-summary{display:flex;flex-wrap:wrap;gap:8px 18px;padding:10px 12px;border:1px solid rgba(91,108,101,.16);border-radius:9px;background:rgba(255,255,255,.58);color:var(--muted);font-size:.8rem}.campaign-summary b{color:var(--ink)}.campaign-objectives{display:grid;gap:8px}.campaign-objective{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 14px;padding:11px 12px;border:1px solid rgba(91,108,101,.16);border-left:3px solid #9ba99b;border-radius:9px;background:rgba(255,255,255,.66)}.campaign-objective--critical{border-left-color:#b35b4a}.campaign-objective--important{border-left-color:#b28a3b}.campaign-objective>div{display:grid;gap:2px}.campaign-objective>div span,.campaign-objective>span{color:var(--muted);font-size:.78rem}.campaign-objective>strong{grid-column:2;grid-row:1;white-space:nowrap}.campaign-objective>label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.76rem}.campaign-objective input{width:72px;padding:6px;border:1px solid var(--line);border-radius:6px;background:#fffdf7}.campaign-delivery-buttons{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:7px}.campaign-delivery-buttons .button{min-height:34px;padding:7px 10px;font-size:.78rem;white-space:normal;text-align:left}.campaign-objectives--offer .campaign-objective{grid-template-columns:1fr auto}.campaign-objectives--offer .campaign-objective>span{grid-column:2;grid-row:1;align-self:center}@media(max-width:600px){.governor-campaign{padding:12px}.campaign-objective{grid-template-columns:1fr}.campaign-objective>strong,.campaign-objectives--offer .campaign-objective>span{grid-column:auto;grid-row:auto;white-space:normal}.campaign-delivery-buttons{grid-column:auto}}
.governor-missions{display:grid;gap:12px;margin-top:18px;padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(249,248,239,.86)}.mission-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.mission-heading h3{margin:4px 0}.mission-focus{max-width:270px;color:var(--muted);font-size:.78rem;text-align:right}.mission-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mission-list--active{grid-template-columns:1fr}.mission-offers{display:grid;gap:9px;padding-top:12px;border-top:1px solid rgba(91,108,101,.16)}.mission-card{display:grid;gap:8px;padding:13px;border:1px solid rgba(91,108,101,.18);border-radius:10px;background:rgba(255,255,255,.62);min-width:0}.mission-card h4{margin:0;font-size:1rem}.mission-card p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.4}.mission-card__top{display:flex;justify-content:space-between;gap:8px;align-items:center}.mission-status{font-size:.67rem;letter-spacing:.08em;color:#3e7657;white-space:nowrap}.mission-status--available{color:#8b6a30}.mission-facts{display:flex;flex-wrap:wrap;gap:7px 13px;color:var(--muted);font-size:.76rem}.mission-facts b{color:var(--ink)}.mission-delivery{display:grid;gap:7px;padding-top:8px;border-top:1px solid rgba(91,108,101,.13)}.mission-delivery label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.78rem}.mission-delivery input{width:75px;padding:6px;border:1px solid var(--line);border-radius:6px;background:#fffdf7}.mission-delivery .button{justify-self:start;max-width:100%;white-space:normal;text-align:left}.mission-card .button{min-height:34px;padding:7px 10px;font-size:.78rem}@media(max-width:900px){.mission-list{grid-template-columns:1fr 1fr}.mission-heading{display:block}.mission-focus{max-width:none;text-align:left;margin-top:3px}}@media(max-width:600px){.mission-list{grid-template-columns:1fr}.governor-missions{padding:12px}.mission-facts{display:grid;gap:4px}}
