/* Stone, timber and parchment. Flat materials, crisp borders, restrained accents. */
:root{--bg:#222b2e;--cream:#e4d8bd;--gold:#c69b62;--muted:#aeb6aa;--line:#46514e}
body{background:#222b2e;font-size:13px}
button,.file-button{background:#354441;border-color:#64736b;box-shadow:inset 0 1px #7c8a7560,0 2px #172222;color:#eee1bf;font-size:12px}
button:hover:not(:disabled),.file-button:hover{background:#465851;border-color:#b7bc9a}
button.primary{background:#6c784f;border-color:#a5b082;color:#fff0cb}
button.primary:hover:not(:disabled){background:#7a8959}
button:focus-visible,select:focus-visible,input:focus-visible{outline-color:#d7aa66}
.topbar{background:#293538;border-bottom:2px solid #151f23;height:80px;padding:0 22px}
.brand h1{font-size:23px;color:#ecdfbf}
.brand>div>span{color:#a8b5a7;letter-spacing:1.7px}
.crest{font-size:30px;color:#bca77a}
.resources{gap:5px;min-width:0;justify-content:flex-start;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#65746a transparent}
.resources .resource{flex:0 0 auto}
.city-stock{grid-column:2;color:#b7caa6;font-size:10px;white-space:nowrap;line-height:14px}
.city-stock.full{color:#e1b77c}
.resource{background:#222e31;border:1px solid #45524f;min-width:76px;padding:7px 10px;box-shadow:inset 0 -2px #182326}
.resource small{color:#bdc3b3;font-size:10px}
.resource strong{font-size:17px;font-weight:600;color:#f1e5c5}
.resource .r-icon{font-size:18px;text-shadow:none}
.food-trend{display:inline-block;width:14px;margin-left:5px;font-size:17px;line-height:1;text-align:center;vertical-align:baseline}
.resource strong .food-trend.up{color:#9dcc83}.resource strong .food-trend.down{color:#ed967d}
.resource strong .food-trend.stable,.resource strong .food-trend.observing{color:#a9b6ac}
.subbar{height:32px;background:#1e2a2c;border-bottom:1px solid #52605a;color:#b9c2b2;font-size:11px}
.chapter{color:#e1c898}
main{height:calc(100dvh - 192px);grid-template-columns:minmax(0,1fr) 354px}
.world-section,#viewport{background:#222d31}
.world-heading{height:64px;background:#303f3f;border-bottom:2px solid #172429;padding:10px 20px}
.world-heading h2{font-size:20px;color:#e4d8b8}
.eyebrow{font-size:9px;letter-spacing:1.5px}
.locations button{background:#283735;border-color:#60716a;color:#c7cdbb;padding:8px 14px;font-size:12px}
.locations button.active{background:#bfa478;color:#262d29;border-color:#e4cf9f;box-shadow:inset 0 -2px #8d7350}
.zoom button{background:#2c3c3b;border-color:#5f7069}
.zoom span{color:#c6ccba}
#roomNav{background:#2b3938;border-color:#5d6a60;gap:5px;padding:9px 12px}
#roomNav button{font-size:10px;background:#354642;border:1px solid #5a6d61;color:#c1cbb8;padding:6px 9px}
#roomNav button.selected{background:#c9b084;border-color:#e5d4a7;color:#282f29;box-shadow:inset 0 -2px #9c8056}
#roomNav button.ruined{color:#b0b3a3;border-style:dashed}
.transport-strip{background:#263532;border-top-color:#5f6d5e;border-bottom-color:#172724;padding:10px 15px}
.transport-strip strong{color:#dac9a3;font-size:11px}
.transport-strip small{color:#aaba9c;font-size:10px}
.transport-strip button{background:#344b41;border-color:#697d66}
.trip-meter{background:#172725}
.action-feedback,.world-caption{background:#1d2b2d;color:#b1beaa}
.world-caption{font-size:10px;padding:8px 14px}
.world-caption{flex:0 0 30px;height:30px;line-height:14px;overflow:hidden}
.world-caption>span:first-child{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.world-tip{background:#ddcda8;border:2px solid #4d5140;color:#313a32;box-shadow:3px 3px #152225;font-size:12px}
aside{background:#d8caab;border-left:3px solid #84714f;color:#303b34}
.tabs{background:#b9af92;border-bottom:2px solid #887c5e;padding:0 17px;gap:17px;min-height:48px}
.tabs button{font-size:12px;color:#52604e}
.tabs button.active{color:#243d33;border-bottom-color:#49634d;font-weight:600}
.tabs button span{color:#425b3e}
.panel{padding:22px;scrollbar-color:#938266 #c7b99a}
.panel .eyebrow{color:#6a6b4a}
.panel h2{font-size:25px;color:#343b30;margin:8px 0 12px}
.panel h3{font-size:17px;color:#46513a}
.panel .description,.panel .muted{color:#5c624f;font-size:12px;line-height:1.75}
.tools-tag{border-color:#9c8e6b;color:#635e40;background:#e2d4b1;font-size:10px}
.panel-heading{gap:9px}.panel-heading .tools-tag{white-space:nowrap;font-size:9px}
.panel-heading[data-building-stage="0"] .tools-tag{border-style:dashed;background:#cbbd9a;color:#766548}
.panel-heading[data-building-stage="2"] .tools-tag{background:#c3cbc0;border-color:#87998b;color:#3b554a}
.panel-heading[data-building-stage="3"] .tools-tag{background:#dbca93;border:2px solid #a98b54;color:#6a512e}
.room-art.building-stage-0{border-style:dashed;background:#c1b291}
.room-art.building-stage-2{background:#bfc3ad;border-color:#829783;box-shadow:inset 0 -3px #9fae98}
.room-art.building-stage-3{background:#c7c5a4;border:2px solid #9b8553;box-shadow:inset 0 -3px #b4a16e}
.world-section[data-city-stage="2"] .world-heading{border-bottom-color:#8d9e8d}
.world-section[data-city-stage="3"] .world-heading{border-bottom:3px double #baa16a}
.room-art{height:122px;margin:18px 0;border:1px solid #b3a47f;background:#c9bd9d;box-shadow:inset 0 -3px #b6aa89}
.room-art canvas{width:170px;height:110px}
.panel .section{border-top:1px solid #afa17e;padding-top:18px;margin-top:20px}
.panel .section-title,.panel .small-label{color:#62684f;font-size:12px}
.panel .status{font-size:12px;color:#526b42}
.panel .status.warning{color:#965d38}
.panel .rate{font-size:12px;color:#586049}
.panel .rate strong{color:#3f5940;font-weight:600}
.panel .worker-controls{margin-bottom:12px}
.panel .stepper b{color:#394838;font-weight:600}
.panel .bar-label{font-size:11px;color:#555e47}
.panel .bar{height:8px;border-color:#9b8f6e;background:#b9b090;box-shadow:inset 0 1px #a59a7c}
.panel .bar>i{background:#7d8a58}
.panel .progress>i{background:#9a7247}
.panel .recipe{background:#e4d8b8;border-color:#b1a27d;color:#63654b;font-size:12px;padding:13px}
.panel .recipe strong{color:#7d5735;font-weight:600}
.panel button{background:#ede0bd;border-color:#9f916b;color:#3b4a38;box-shadow:inset 0 1px #fff2d3,0 2px #b5a57e;font-size:12px}
.panel button:hover:not(:disabled){background:#f4e8c8;border-color:#66784e}
.panel .work-button{background:#697d50;color:#fff0cd;border:2px solid #465b3c;box-shadow:inset 0 2px #93a16d,0 3px #b5a57e;padding:16px 10px;font-size:13px}
.panel .work-button small{color:#e2e1b5;font-size:10px}
.panel .work-button.held{background:#85974f;border-color:#4e6238}
.panel .work-button:hover:not(:disabled){background:#788c54;color:#fff0cd;border-color:#465b3c}
dialog .icon-button{background:#e8d9b6;color:#3f513b;border-color:#9e906a}
.panel .action-card{background:#e1d3af;border-color:#b5a580;padding:15px}
.panel .action-card h3{color:#46513c;font-size:12px;font-weight:600}
.panel .action-card p{color:#62664f;font-size:12px}
.panel .cost span{background:#dce0bb;border-color:#9ea579;color:#465d3a;font-size:10px}
.panel .cost span.missing{background:#e6c6a4;border-color:#bd9470;color:#87513b}
.panel .lock-reason{color:#876b42;font-size:11px}
.panel select{background:#ebdfbc;border-color:#a49871;color:#3d4e3b;font-size:12px}
.panel .tree-open{border-left:3px solid #758551;padding:13px 12px;background:#e5d8b3}
.panel .journal-item{border-color:#9b8c65}
.panel .journal-item time{color:#777b59}.panel .journal-item p{color:#4c5945;font-size:12px}
.objective-banner{height:80px;background:#35423a;border-top:2px solid #798067;padding:12px 24px}
.objective-icon{color:#bec192;font-size:26px}
.objective-copy strong{font-size:18px;color:#eee0ba}
.objective-copy>span:last-child{font-size:11px;color:#c5c9b2}
dialog{background:#d8caab;border:2px solid #938160;color:#344031;box-shadow:6px 6px #121f25b0}
dialog::backdrop{background:#142027c9;backdrop-filter:none}
dialog h2{color:#354432}dialog p{color:#5b654f}dialog .eyebrow{color:#797044}
.intro-guide{border-color:#a99d78}.intro-guide b{color:#4a5e3d}.intro-guide span{color:#687053}
.letter-seal{color:#8f794e}
dialog button{background:#e9dcb8;border-color:#978864;color:#3d503b;box-shadow:inset 0 1px #fff1d0,0 2px #b2a37e}
.feedback-settings{border-color:#a99e7c}.feedback-settings legend,.feedback-settings small{color:#656c52}
#skillTree .modal-heading{background:#d8caab;border-color:#ad9f78}
#skillTree .tree-legend,.skill-branch>p{color:#60694f}
.skill-branch{border-color:#a89a75}.skill-branch>h3{color:#3c5139}
.skill-node{background:#e6d9b6;border-color:#aa9971;box-shadow:3px 3px #b8a77e}
.skill-node h4{color:#3e5039}#skillTree .skill-node p{color:#5d664e}
.skill-node.locked{background:#ccbea0;border-color:#998c6a}
.skill-node.locked .skill-state,.skill-state{color:#7d693f}
.skill-requires{color:#6a7054}.skill-node.acquired{background:#c4d0a5;border-color:#7f9466}
.skill-node.acquired .skill-state{color:#47603c}.skill-node.available{border:2px solid #7a8f50}
.skill-node.milestone{background:#c2cec0;border-radius:0}
.skill-links path{stroke:#9d8c66}.skill-links path.learned{stroke:#667f49}
#skillTree .cost span{background:#d2d8b0;color:#4d613c;border-color:#a5ad7b}
#skillTree .cost span.missing{background:#dfc09e;color:#84533a;border-color:#b28f69}
.danger{color:#994d37;border-color:#b58d6c}.menu-actions .danger{background:#e6c3a3}
.panel .help-heading{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.panel .info-button{display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;min-width:23px;padding:0;margin:3px 0;border:1px solid #9f916b;border-radius:50%;background:#e9dcba;color:#526247;font:italic bold 14px Georgia,serif;box-shadow:none;vertical-align:middle}
.panel .info-button:hover,.panel .info-button:focus-visible{background:#f5e9cb;color:#30482f;border-color:#687c51}
#helpTip{position:fixed;z-index:1000;width:max-content;max-width:min(300px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;padding:13px 15px;background:#2c3c35;color:#f2e5c6;border:1px solid #9da77b;box-shadow:3px 3px #14262280;font-size:12px;line-height:1.75;white-space:pre-line;pointer-events:auto}
#helpTip[hidden]{display:none}
.panel .dispatch-card{position:static;background:#d8caab;border-bottom:2px solid #a19470;padding:12px 0;margin:0 0 18px}
.panel .cargo-controls{position:sticky;top:-22px;z-index:5;background:#d3c7a6;padding:10px 0 8px;margin:0 0 12px;border-bottom:1px solid #a19470;box-shadow:0 5px 0 #d3c7a6}
.panel .cargo-controls label{display:inline-block;margin:0;font-size:11px}
.panel .cargo-controls select{margin:6px 0 0}
.panel .cargo-controls>.info-button{position:absolute;top:3px;right:0}
.panel .dispatch-card .send-cart{width:100%;font-size:14px;padding:15px 10px;background:#6c784f;color:#fff0cb;border:2px solid #4f633d}
.panel .dispatch-card .send-cart:hover:not(:disabled){background:#7c8c56}
.dispatch-meta{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#65704f;padding:10px 0}
.dispatch-card .status{margin:6px 0 0}.dispatch-card .toggle{margin:6px 0;font-size:12px}
.manifest-items{display:flex;flex-wrap:wrap;gap:6px}.manifest-items span{background:#e5d7b3;border:1px solid #ad9d75;padding:6px 8px;font-size:11px;color:#556446}
.panel .transport-table{background:#e2d5b2;border-color:#b1a17b;color:#46533e}
.panel .transport-table>div{border-color:#bcae8b;font-size:11px}
.panel .transport-table .table-head{background:#c4b692;color:#526044;font-size:9px}
.transport-strip #quickSendCart{margin-left:auto;white-space:nowrap;font-size:12px;padding:10px 12px}
.transport-strip #quickSendCart[hidden]{display:none}
.transport-strip #transportOpen{margin-left:0}
@media(max-width:1150px){.panel .dispatch-card{top:-18px}.transport-strip{flex-wrap:wrap}.transport-strip .trip-meter{min-width:40px;flex:1}.transport-strip #quickSendCart{font-size:11px}}
.transport-strip>div:first-of-type{flex:0 1 220px;min-width:0;overflow:hidden}
.transport-strip>div:first-of-type small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.transport-strip #quickSendCart{flex:0 0 155px;width:155px}
.transport-strip #quickBoostCart{flex:0 0 110px;width:110px;margin-left:0;white-space:nowrap}
.transport-strip #quickBoostCart[data-active=true]{border-color:#d4ad71;color:#f1d39b;background:#475a42}
.panel .dispatch-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
@media(max-width:1150px){.transport-strip>div:first-of-type{flex-basis:180px}}
@media(max-width:800px){.panel .dispatch-card{top:-22px}}
#menuMessage{color:#697448}
@media(min-width:1650px){main{grid-template-columns:minmax(0,1fr) 380px}}
@media(max-width:1150px){main{grid-template-columns:minmax(0,1fr) 316px}.panel{padding:18px}.resource{min-width:60px;padding:6px}.resource small{font-size:9px}.brand{min-width:210px}.brand h1{font-size:20px}.world-heading h2{font-size:17px}.locations button{padding:7px 10px}}
@media(max-width:800px){.topbar{height:auto}.subbar{height:auto}.resources{padding:3px 0}.resource{min-width:80px}main{height:auto}.world-heading{padding:9px 12px}.world-heading h2{font-size:16px}.world-heading .eyebrow{display:none}aside{border-left:0;border-top:3px solid #84714f}.panel{padding:22px}.objective-banner{height:auto;min-height:90px;padding:12px}.objective-copy strong{font-size:16px}.world-caption{font-size:9px}.room-art{height:112px}}

/* Distinct branches keep every upgrade visible without mixing its purpose. */
.local-branch{border:1px solid #b8aa84;padding:12px 9px;background:#e0d3b3}.panel .local-branch h3{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font:17px Georgia,serif;margin:0 0 14px;color:#46563c}.local-branch h3 small{font:9px Segoe UI,sans-serif;white-space:nowrap;color:#69724f}.local-branch .local-tier{margin-top:10px}.panel .local-branch .local-node{min-width:105px;text-align:left;padding:9px}.local-branch .local-tier+.local-tier:before{display:none}.panel .local-node.superseded,#skillTree .skill-node.superseded{background:#d2cbb4;border-color:#b4a987;border-style:dashed;opacity:.8}.local-branch .upgrade-benefit{font-size:10px}

#treeDetail .status{color:#4c603e;line-height:1.7}#skillTree .skill-node.superseded small{color:#586447}
@media(min-width:801px) and (max-width:1150px){.panel .cargo-controls{top:-18px}}
