:root{
  --bg:#10140f;
  --panel:#191f18;
  --panel2:#20271f;
  --border:#343e32;
  --text:#ecebdc;
  --muted:#9ea795;
  --accent:#d7b75c;
  --accent2:#846d31;
  --danger:#b85d54;
  --good:#86a968;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow:hidden}
button,input,select{font:inherit}button{color:inherit}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hidden{display:none!important}
#app{height:100%;display:flex;flex-direction:column;min-width:1050px}
.topbar{min-height:62px;display:flex;align-items:center;gap:8px;padding:7px 10px;background:#141914;border-bottom:1px solid var(--border);flex:none;overflow:hidden}
.brand{display:flex;align-items:center;gap:9px;min-width:188px}.brand-mark{width:34px;height:34px;border:2px solid var(--accent);transform:rotate(45deg);display:grid;place-items:center;background:#22281f}.brand-mark span{transform:rotate(-45deg);font-weight:900;font-size:13px;color:var(--accent)}.brand h1{font-size:16px;margin:0;letter-spacing:.04em}.brand small{display:block;color:var(--muted);font-size:9px;margin-top:1px}
.resources{display:flex;gap:4px;flex:1;min-width:0;overflow:hidden}.resource-chip,.clock-chip,.world-chip{background:var(--panel2);border:1px solid var(--border);border-radius:7px;padding:6px 8px;min-width:64px;font-size:11px;white-space:nowrap}.resource-chip span,.clock-chip span,.world-chip span{color:var(--muted);margin-right:3px}.world-chips{display:flex;gap:4px}.world-chip{display:flex;flex-direction:column;min-width:68px}.world-chip span{font-size:9px;margin:0}.world-chip.temp{min-width:48px;justify-content:center;text-align:center}
.speed-controls{display:flex;border:1px solid var(--border);background:var(--panel2);border-radius:7px;padding:3px}.speed-controls button{min-width:32px;height:30px;border:0;border-radius:5px;background:transparent;cursor:pointer;font-size:11px}.speed-controls button.active{background:var(--accent2);color:#fff4c5}.top-actions{display:flex;gap:4px}.top-actions button{height:32px;border:1px solid var(--border);background:var(--panel2);border-radius:6px;padding:0 8px;font-size:10px;cursor:pointer}.top-actions button:hover{border-color:#56634f}
.main-grid{flex:1;min-height:0;display:grid;grid-template-columns:235px minmax(520px,1fr) 285px;gap:8px;padding:8px}.sidebar{min-height:0;display:flex;flex-direction:column;gap:8px;overflow:auto;scrollbar-width:thin}.panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:10px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:800;letter-spacing:.04em}.eyebrow{font-size:9px;letter-spacing:.18em;color:var(--accent);font-weight:800}.muted{color:var(--muted)}
.objective-panel{flex:none}.objective-title{font-size:17px;font-weight:800;margin-top:4px}.objective-copy{font-size:11px;color:var(--muted);line-height:1.45;margin-top:5px}.progress{height:7px;background:#10140f;border:1px solid #2c342a;border-radius:99px;overflow:hidden;margin-top:9px}.progress>div{height:100%;background:linear-gradient(90deg,#9c8343,var(--accent));width:0}.progress-label{text-align:right;color:var(--muted);font-size:10px;margin-top:3px}
#colonist-list{display:flex;flex-direction:column;gap:4px;margin-top:7px}.colonist-row{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--border);border-radius:6px;padding:6px 7px;text-align:left;cursor:pointer;font-size:10px}.colonist-row:hover{border-color:#55624f}.colonist-row span:first-child{display:flex;flex-direction:column}.colonist-row small{color:var(--muted);font-size:8px}.colonist-state{color:var(--muted);text-align:right;font-size:9px;max-width:95px}.stat-grid{display:grid;grid-template-columns:1fr auto;gap:5px 8px;font-size:10px;margin-top:8px}.stat-grid span{color:var(--muted)}
.game-column{min-width:0;min-height:0;display:flex;flex-direction:column;gap:7px}.canvas-wrap{position:relative;min-height:0;flex:1;background:#253125;border:1px solid var(--border);border-radius:8px;overflow:hidden}.canvas-wrap canvas{width:100%;height:100%;display:block;cursor:default}.status-strip{height:27px;flex:none;background:var(--panel);border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:space-between;padding:0 8px;color:var(--muted);font-size:9px}
.toolbar-wrap{flex:none;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:7px}.toolbar{display:grid;grid-template-columns:repeat(11,minmax(52px,1fr));gap:4px}.tool-button{position:relative;min-width:0;height:53px;border:1px solid var(--border);border-radius:6px;background:var(--panel2);cursor:pointer;padding:5px 3px;display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1.1}.tool-button strong{font-size:10px}.tool-button>span:last-child{font-size:7px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.tool-button:hover{border-color:#57644f}.tool-button.active{border-color:var(--accent);background:#332e1d;box-shadow:inset 0 0 0 1px #7f6d35}.tool-key{position:absolute;top:2px;left:4px;color:#827f70;font-size:7px}.tool-help{color:var(--muted);font-size:9px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.selection-wrap{flex:none}#selection-panel{margin-top:8px;font-size:10px;color:var(--muted);line-height:1.45}#selection-panel h3{color:var(--text);font-size:16px;margin:0 0 2px}.selection-sub{font-size:9px;color:var(--muted);margin-bottom:8px}.kv{display:grid;grid-template-columns:1fr auto;gap:5px 8px;margin-top:8px}.kv span{color:var(--muted)}.kv strong{color:var(--text);text-align:right}.panel-button{width:100%;min-height:34px;margin-top:9px;border:1px solid #5a5332;background:#382f18;color:#f7e7a5;border-radius:6px;cursor:pointer;font-size:10px}.panel-button:hover{background:#44391c}.panel-button.danger{border-color:#70443f;background:#3b211e;color:#f0b8b1}.panel-button.danger:hover{background:#4a2925}.panel-button.danger.subtle{margin-top:5px;background:transparent;color:#d89992}
.mini-heading{margin-top:10px;padding-top:8px;border-top:1px solid #293126;color:#d8d7c7;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.priority-grid,.skill-grid{margin-top:5px;display:grid;gap:3px}.priority-row,.skill-row{display:grid;grid-template-columns:1fr 44px;align-items:center;gap:6px}.priority-row span,.skill-row span{color:var(--muted)}.priority-row button{height:25px;border:1px solid var(--border);border-radius:5px;background:var(--panel2);cursor:pointer;color:var(--text);font-size:10px}.skill-row strong{text-align:center;background:var(--panel2);border:1px solid var(--border);border-radius:5px;padding:3px}.recipe-list,.crop-buttons{display:grid;gap:4px;margin-top:7px}.recipe-list button,.crop-buttons button{border:1px solid var(--border);border-radius:5px;background:var(--panel2);padding:6px;text-align:left;cursor:pointer;font-size:9px}.recipe-list button small{display:block;color:var(--muted);margin-top:2px}.crop-buttons button.active{border-color:var(--accent);background:#332e1d}
#job-queue{margin-top:8px;font-size:10px}#job-queue>div{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid #293126}#job-queue span,#job-queue p{color:var(--muted)}#job-queue small{font-weight:400;color:var(--muted)}.debug-box{white-space:pre-wrap;font:9px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;color:#b8c3b1;background:#0d110d;padding:7px;border-radius:5px;margin-top:7px;max-height:210px;overflow:auto}.simulation-note{font-size:9px;line-height:1.45;margin:8px 0 0}
.toast-layer{position:absolute;inset:0;pointer-events:none;display:flex;flex-direction:column;align-items:center;padding-top:16px;gap:6px}.toast{background:rgba(12,14,11,.94);border:1px solid rgba(255,255,255,.18);padding:8px 12px;border-radius:6px;color:#fff2c1;font-size:10px;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.start-screen{position:fixed;z-index:20;inset:0;background:radial-gradient(circle at 50% 35%,rgba(62,78,49,.92),rgba(13,17,12,.98) 60%);display:grid;place-items:center;padding:20px}.menu-card{width:min(690px,90vw);border:1px solid #4c5945;background:rgba(20,25,18,.97);border-radius:12px;padding:30px;box-shadow:0 30px 100px rgba(0,0,0,.5)}.menu-card .logo{font-size:40px;font-weight:900;letter-spacing:.08em;color:#f0df9c}.menu-card .subtitle{color:var(--muted);margin-top:4px}.menu-copy{color:#b5bdad;line-height:1.55;margin:22px 0;font-size:13px;max-width:610px}.menu-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.menu-buttons button{height:48px;border-radius:7px;border:1px solid var(--border);background:var(--panel2);cursor:pointer;font-weight:700}.menu-buttons button.primary{background:#8a7439;border-color:#b4984d;color:#fff5c7}.menu-buttons button.disabled,.menu-buttons button:disabled{opacity:.35;cursor:not-allowed}.menu-footer{margin-top:18px;color:#778071;font-size:10px}
@media(max-width:1280px){.main-grid{grid-template-columns:215px minmax(500px,1fr) 250px}.toolbar{grid-template-columns:repeat(6,1fr)}.toolbar-wrap{max-height:130px}.resources .resource-chip:nth-child(4){display:none}.top-actions button{padding:0 6px}.resource-chip{min-width:58px}.world-chip{display:none}}

/* v0.6.0 systems */
.raid-banner{height:34px;flex:none;display:flex;align-items:center;gap:10px;padding:0 14px;background:#55241f;border-bottom:1px solid #7f4037;color:#ffd7cf;font-size:11px}.raid-banner strong{letter-spacing:.15em;color:#ff9b84}.top-actions button.active{border-color:var(--accent);background:#332e1d;color:#fff0b4}.colonist-row.drafted{border-color:#a85a50;background:#30201d}.tool-button.locked{opacity:.38;cursor:not-allowed;filter:saturate(.45)}
.toolbar{grid-template-columns:repeat(auto-fit,minmax(58px,1fr))}.toolbar-wrap{max-height:142px;overflow:auto}.equipment-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;margin-top:6px}.equipment-row button{border:1px solid var(--border);background:var(--panel2);color:var(--text);border-radius:5px;padding:6px 4px;font-size:8px;cursor:pointer}.room-badge{margin:6px 0;padding:5px 7px;border:1px solid #544b34;background:#292718;color:#e7d998;border-radius:5px;font-size:9px}
.schedule-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;margin-top:6px}.schedule-cell{height:30px;padding:1px;border:1px solid var(--border);border-radius:3px;background:var(--panel2);color:var(--text);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center}.schedule-cell span{font-size:6px;color:var(--muted);line-height:1}.schedule-cell strong{font-size:8px;line-height:1.1}.schedule-cell.work{background:#2e3a26;border-color:#4e673f}.schedule-cell.leisure{background:#3a3322;border-color:#756238}.schedule-cell.sleep{background:#232d3d;border-color:#405a76}.schedule-cell.anything{background:#292d28}.schedule-legend{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;font-size:7px;color:var(--muted)}.schedule-legend span{padding:2px 4px;border-radius:3px}.schedule-legend .work{background:#2e3a26}.schedule-legend .leisure{background:#3a3322}.schedule-legend .sleep{background:#232d3d}.schedule-legend .anything{background:#292d28}
.recipe-list button:disabled,.crop-buttons button:disabled{opacity:.35;cursor:not-allowed}.modal-backdrop{position:fixed;z-index:40;inset:0;background:rgba(8,10,8,.82);display:grid;place-items:center;padding:24px}.research-modal{width:min(900px,94vw);max-height:88vh;overflow:auto;border:1px solid #4e5b46;background:#161b15;border-radius:12px;box-shadow:0 28px 90px rgba(0,0,0,.55);padding:18px}.modal-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;border-bottom:1px solid var(--border);padding-bottom:12px}.modal-head h2{margin:2px 0 4px;font-size:25px}.modal-head p{margin:0;color:var(--muted);font-size:11px}.modal-head button{border:1px solid var(--border);background:var(--panel2);border-radius:6px;padding:7px 12px;cursor:pointer}.research-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.research-card{border:1px solid var(--border);background:var(--panel);border-radius:8px;padding:12px}.research-card.done{border-color:#536d45;background:#1c271a}.research-title{display:flex;justify-content:space-between;gap:8px;align-items:center}.research-title>span{font-size:8px;letter-spacing:.1em;color:var(--accent)}.research-card p{font-size:10px;line-height:1.45;color:var(--muted);min-height:30px}.research-requirements{font-size:9px;color:#d6c994;margin:8px 0}.research-card button{width:100%;height:34px;border:1px solid #66582d;background:#352f1d;color:#f4e6a9;border-radius:6px;cursor:pointer;font-size:10px}.research-card button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:1500px){.resources .resource-chip:nth-child(4),.resources .resource-chip:nth-child(5){display:none}.top-actions button{font-size:9px;padding:0 5px}.brand{min-width:165px}.main-grid{grid-template-columns:220px minmax(520px,1fr) 265px}}
@media(max-width:1180px){.resources .resource-chip:nth-child(6),.resources .resource-chip:nth-child(7){display:none}.research-list{grid-template-columns:1fr}}
.storage-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:6px 0 8px}.storage-filter-grid button{min-height:30px;border:1px solid rgba(218,211,187,.16);border-radius:5px;background:rgba(255,255,255,.025);color:var(--text);font-size:10px;text-transform:capitalize;padding:4px}.storage-filter-grid button.active{border-color:#d5b55d;background:rgba(213,181,93,.14);color:#f0dfac}

/* v0.7.0 maturity pass */
.new-game-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px}.new-game-options label{display:flex;flex-direction:column;gap:5px;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.new-game-options select{height:38px;border:1px solid var(--border);border-radius:6px;background:var(--panel2);color:var(--text);padding:0 9px;text-transform:none;letter-spacing:0}.stance-row{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:6px}.stance-row button{height:29px;border:1px solid var(--border);border-radius:5px;background:var(--panel2);font-size:9px;cursor:pointer}.stance-row button.active{border-color:var(--accent);background:#352f1d;color:#f4e6a9}.command-hint{margin:5px 0 0;color:#d8c98d;font-size:9px}.thought-list,.stored-list{display:grid;grid-template-columns:1fr auto;gap:4px 8px;margin-top:6px;padding:6px;background:#141914;border:1px solid #293126;border-radius:5px}.thought-list div{display:contents}.thought-list span,.stored-list span{color:var(--muted);text-transform:capitalize}.thought-list strong,.stored-list strong{text-align:right}.thought-list strong.good{color:#a9c98e}.thought-list strong.bad{color:#d89087}

/* v0.8.0 vertical construction */
.layer-stack{display:flex;align-items:center;gap:3px;height:36px;padding:3px 5px;border:1px solid var(--border);border-radius:6px;background:#111610;white-space:nowrap}.layer-stack>span{min-width:58px;padding:0 5px;color:#c9c5ad;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.layer-stack button{width:28px;height:27px;border:1px solid #323b30;border-radius:4px;background:#1c231b;color:#aaa99a;font-size:9px;font-weight:800;cursor:pointer}.layer-stack button:hover{border-color:#596650}.layer-stack button.active{border-color:#c3a94f;background:#3a321d;color:#f4e5a8}.layer-badge{display:inline-block;margin:0 0 7px;padding:3px 6px;border:1px solid #495546;border-radius:4px;background:#1b221a;color:#bfc9b8;font-size:8px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.tool-button[data-tool="floor"],.tool-button[data-tool="stairsUp"],.tool-button[data-tool="stairsDown"],.tool-button[data-tool="dig"]{border-color:#465241}.tool-button[data-tool="dig"]{background:#211f19}
@media(max-width:1450px){.layer-stack>span{display:none}.layer-stack{padding:3px}.layer-stack button{width:25px}}
.structural-note{margin-top:10px;padding:9px 10px;border:1px solid rgba(223,196,123,.2);background:rgba(219,184,98,.06);color:#cfc8b1;font-size:11px;line-height:1.45}

/* v0.9.0 roofing, industry and equipment */
.resource-chip:nth-child(9){min-width:78px}
.tool-button[data-tool="roof"],.tool-button[data-tool="smithy"],.tool-button[data-tool="loom"]{border-color:#514b37}
.equipment-detail .kv{margin-top:6px}
@media(max-width:1900px){.resources .resource-chip:nth-child(8){display:none}}

/* v0.10.0 survival economy and production automation */
.tool-button[data-tool="charcoalKiln"],.tool-button[data-tool="tannery"],.tool-button[data-tool="smokehouse"]{border-color:#5b4938}
.production-bills{margin-top:8px}.bill-note{margin:5px 0 7px;color:var(--muted);font-size:8px;line-height:1.4}.bill-row{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:4px 6px;align-items:center;padding:5px 0;border-bottom:1px solid #293126}.bill-row>span{color:var(--text);font-size:9px}.bill-row>span small{display:block;color:var(--muted);font-size:7px;margin-top:2px}.bill-row>strong{text-align:right;color:#e5d798;font-size:9px}.bill-row>div{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.bill-row button{height:23px;border:1px solid var(--border);border-radius:4px;background:var(--panel2);color:var(--text);font-size:8px;cursor:pointer}.bill-row button:hover{border-color:#6c6342}.shield-maintenance button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:1750px){.resources .resource-chip:nth-child(11),.resources .resource-chip:nth-child(12),.resources .resource-chip:nth-child(13),.resources .resource-chip:nth-child(14){display:none}}

/* v0.11 local sprite / animation pass */
#game-canvas{image-rendering:auto}
.tool-button{position:relative;min-height:56px;padding-left:38px!important}
.sprite-tool-icon{position:absolute;left:5px;top:50%;width:32px;height:32px;margin-top:-16px;image-rendering:pixelated;background-repeat:no-repeat;opacity:.92;pointer-events:none}
.tool-button:hover .sprite-tool-icon,.tool-button.active .sprite-tool-icon{opacity:1;filter:brightness(1.15)}
.tool-button.locked .sprite-tool-icon{opacity:.34;filter:grayscale(.7)}

/* v0.12 living settlement / caravan trade */
.trade-modal-card{width:min(1080px,94vw);max-height:86vh;overflow:auto}
.trade-summary{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:10px 0 14px;color:#d8ceb1;border-bottom:1px solid rgba(223,207,161,.18)}
.trade-summary span{color:#9fa695;font-size:12px}
.trade-list{display:grid;gap:6px;padding-top:12px}
.trade-row{display:grid;grid-template-columns:minmax(190px,1.5fr) 90px 82px 90px 82px;align-items:center;gap:8px;padding:9px 10px;border:1px solid rgba(225,205,153,.13);background:rgba(18,25,18,.7)}
.trade-row>div{display:flex;flex-direction:column;gap:2px;text-transform:capitalize}.trade-row small{color:#8f9886}.trade-row>span{font-size:12px;color:#c6b991}.trade-row button{min-height:32px}
.social-panel,.trade-post-panel{margin-top:12px;padding-top:10px;border-top:1px solid rgba(224,208,160,.14)}
.top-actions #trade-btn:not(:disabled){border-color:#b79b55;color:#f0d997;box-shadow:inset 0 0 0 1px rgba(205,169,82,.1)}
@media(max-width:900px){.trade-row{grid-template-columns:1fr 70px 70px}.trade-row>span:nth-of-type(2),.trade-row button[data-sell]{grid-column:auto}.trade-summary{align-items:flex-start;flex-direction:column}}

/* v0.13.0 presentation repair and icon-first construction toolbar */
.toolbar-wrap{max-height:112px;overflow-y:auto;overflow-x:hidden;padding:6px}
.toolbar{display:flex!important;flex-wrap:wrap!important;grid-template-columns:none!important;gap:4px!important;align-content:flex-start}
.tool-button{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;flex:0 0 44px!important;padding:0!important;display:block!important;overflow:hidden}
.tool-button strong,.tool-button>span:not(.sprite-tool-icon),.tool-button .tool-key{display:none!important}
.sprite-tool-icon{left:50%!important;top:50%!important;width:32px!important;height:32px!important;margin:-16px 0 0 -16px!important;opacity:1!important}
.tool-button.active{box-shadow:inset 0 0 0 2px #9a7f36,0 0 0 1px rgba(235,205,104,.22)}
.tool-button.locked{opacity:.33}
.tool-help{min-height:16px;font-size:10px;padding:3px 2px 0}
.water-panel{margin-top:10px;padding-top:8px;border-top:1px solid rgba(224,208,160,.14)}

.resource-chip.essential-chip{display:block!important}


/* v0.16.0 excavation cutaway, UI and HD visual maturity */
.topbar{overflow:visible;position:relative;z-index:6}
.resources{overflow:hidden;min-width:170px}
.top-actions{flex-shrink:0;position:relative;z-index:8}
.layer-stack,.speed-controls{flex-shrink:0}
.world-status-float{position:absolute;right:12px;bottom:12px;z-index:8;display:flex;gap:5px;align-items:stretch;pointer-events:none;filter:drop-shadow(0 3px 12px rgba(0,0,0,.34))}
.world-status-float>div{min-width:68px;padding:7px 9px;border:1px solid rgba(208,196,151,.32);border-radius:7px;background:rgba(18,24,18,.88);backdrop-filter:blur(5px);display:flex;flex-direction:column;justify-content:center}
.world-status-float strong{font-size:10px;color:#f0e6bd;line-height:1.1}.world-status-float span{font-size:8px;color:#abb3a3;line-height:1.25;margin-top:2px}.world-status-day{min-width:80px!important}.world-status-day span{font-variant-numeric:tabular-nums}.world-status-temp{min-width:45px!important;text-align:center}
.debug-overlay{position:absolute;left:10px;bottom:10px;z-index:11;width:min(460px,42%);max-height:46%;margin:0;border:1px solid rgba(209,198,158,.2);box-shadow:0 9px 28px rgba(0,0,0,.4);pointer-events:none;background:rgba(9,12,9,.94)}
.simulation-note{display:none!important}

.toolbar-wrap{overflow:visible;max-height:118px}
.toolbar{overflow:visible}
.tool-button{overflow:visible!important;border-radius:7px!important;background:linear-gradient(180deg,#20271f,#191f18)!important}
.tool-button:hover{z-index:20;border-color:#8e8051!important;background:#252d23!important}
.tool-button::after{content:attr(data-label);position:absolute;left:50%;bottom:calc(100% + 7px);transform:translateX(-50%) translateY(4px);padding:5px 8px;border:1px solid #5a604f;border-radius:5px;background:#101510;color:#f1ead0;font-size:9px;font-weight:700;line-height:1;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .12s ease,transform .12s ease;pointer-events:none;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.tool-button:hover::after,.tool-button:focus-visible::after{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.sprite-tool-icon{width:36px!important;height:36px!important;margin:-18px 0 0 -18px!important;background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important;image-rendering:auto!important;filter:none!important}
.tool-button.locked .sprite-tool-icon{opacity:.38!important;filter:grayscale(.5)!important}
.tool-button.active .sprite-tool-icon{filter:drop-shadow(0 0 3px rgba(236,205,111,.55))!important}

.canvas-wrap canvas{image-rendering:auto}
.excavation-legend{color:#d3bb86}

@media(max-width:1500px){.top-actions button{padding:0 5px}.resource-chip{min-width:55px}.brand{min-width:158px}.brand small{font-size:8px}}

/* v0.20.0 cave UX and emergency presentation */
.cave-controls-float{position:absolute;left:12px;bottom:12px;z-index:9;display:flex;gap:6px;pointer-events:auto}
.cave-controls-float.hidden{display:none}
.cave-controls-float button{height:30px;padding:0 10px;border:1px solid rgba(210,197,150,.28);border-radius:6px;background:rgba(17,22,17,.88);color:#d6d5c8;font-size:9px;cursor:pointer;backdrop-filter:blur(4px);box-shadow:0 3px 12px rgba(0,0,0,.22)}
.cave-controls-float button:hover{border-color:#827348;color:#f2e3ab}
.cave-controls-float button.active{border-color:#d5b553;background:rgba(69,56,27,.92);color:#ffe9a0;box-shadow:inset 0 0 0 1px rgba(224,193,96,.14),0 3px 12px rgba(0,0,0,.28)}
#job-queue .emergency-job{border:1px solid rgba(197,87,52,.4);background:rgba(129,49,30,.16);border-radius:5px;padding:5px 6px;margin:-2px 0 5px}
#job-queue .emergency-job span{color:#f1ad87;font-weight:700}
#job-queue .emergency-job strong{color:#ffd0b4}

/* v0.21.0 permanent construction and compact storage */
.material-upgrades{margin-top:10px;padding-top:8px;border-top:1px solid rgba(224,208,160,.14);display:grid;gap:5px}
.material-upgrades .mini-heading{margin:0 0 2px}
.material-upgrades button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:34px;padding:6px 8px;border:1px solid #4b5143;border-radius:5px;background:#1b211a;color:#e6ddc2;font-size:10px;cursor:pointer}
.material-upgrades button:hover:not(:disabled){border-color:#9a8452;background:#252b21}
.material-upgrades button:disabled{opacity:.38;cursor:not-allowed}
.material-upgrades small{color:#a8a78f;font-size:8px}
.envelope-note{margin-top:8px;padding:7px 8px;border-left:2px solid #a67b55;background:rgba(159,117,76,.08);color:#cfc7ae;font-size:9px;line-height:1.4}
.resource-chip[title*="bricks"]{min-width:72px}
@media(max-width:1850px){.resources .resource-chip[title*="bricks"]{display:none}}

/* v0.23.0 domestic life, owned beds and physical dining */
.domestic-panel{margin-top:10px;padding-top:2px;border-top:1px solid rgba(224,208,160,.08)}
.bed-owner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-top:7px}
.bed-owner-grid button{min-height:30px;padding:5px 6px;border:1px solid #3f493c;border-radius:5px;background:#1b211a;color:#d9d7c8;font-size:9px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bed-owner-grid button:hover{border-color:#7d714c}.bed-owner-grid button.active{border-color:#c6a956;background:#332d1b;color:#f5e6a8}
.comfort-note{margin-top:8px;padding:7px 8px;border-left:2px solid #8fa46f;background:rgba(126,153,99,.08);color:#ced4c2;font-size:9px;line-height:1.4}

/* v0.31.0 build-cost clarity and water-security UI */
.toolbar-wrap{max-height:168px}
.build-info-strip{display:grid;grid-template-columns:minmax(112px,auto) auto minmax(220px,1fr);gap:8px;align-items:center;margin-top:5px;padding:6px 8px;border:1px solid rgba(193,174,111,.24);border-radius:6px;background:linear-gradient(180deg,rgba(29,36,28,.96),rgba(20,27,20,.96));min-height:42px}
.build-info-strip.hidden{display:none}
.build-info-title{display:flex;flex-direction:column;gap:2px;min-width:0}.build-info-title strong{font-size:11px;color:#f1e4ba;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.build-info-title span{font-size:7px;font-weight:800;letter-spacing:.12em;color:#8f967f}
.build-costs{display:flex;gap:4px;flex-wrap:wrap}.build-cost-chip{display:flex;flex-direction:column;min-width:62px;padding:4px 6px;border-radius:5px;border:1px solid rgba(190,180,145,.22);background:#191f18}.build-cost-chip b{font-size:9px;color:#e8dfc4}.build-cost-chip small{font-size:7px;color:#9ba491;margin-top:1px;white-space:nowrap}.build-cost-chip.ok{border-color:rgba(105,156,102,.42);background:rgba(28,48,29,.72)}.build-cost-chip.missing{border-color:rgba(190,86,72,.66);background:rgba(72,31,27,.76)}.build-cost-chip.missing b,.missing-text{color:#f2a494!important}.build-cost-chip.free{border-color:rgba(126,143,102,.34)}
.build-info-copy{min-width:0;display:flex;flex-direction:column;gap:1px}.build-info-copy>strong{font-size:10px;color:#d9d0ae}.build-info-copy>span{font-size:8px;color:#b6b7a4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.build-info-copy>small{font-size:7px;color:#888f80;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ok-text{color:#b9d89d!important}
.tool-cost-badge{position:absolute!important;right:-3px!important;bottom:-3px!important;z-index:5;display:block!important;min-width:18px!important;max-width:42px!important;height:13px!important;padding:1px 3px!important;margin:0!important;border:1px solid #6d674a;border-radius:4px;background:#121712;color:#e8d897!important;font:800 7px/10px system-ui!important;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:clip;box-shadow:0 2px 5px rgba(0,0,0,.5);pointer-events:none}
.tool-button.locked .tool-cost-badge{opacity:.48}
.resource-chip.resource-danger{border-color:#9e5145!important;background:rgba(88,35,31,.62)!important;box-shadow:inset 0 0 0 1px rgba(205,97,80,.2)}.resource-chip.resource-danger strong{color:#f2a18f!important}
.v310-well-panel{border-top:1px solid rgba(110,155,166,.26)!important}
@media(max-width:1280px){.build-info-strip{grid-template-columns:100px auto 1fr}.build-info-copy>small{display:none}.toolbar-wrap{max-height:180px}}

/* v0.35.0 compact tool menus and in-world resource HUD */
.topbar>.resources{display:none!important}
.topbar .brand{margin-right:auto}
.toolbar-wrap{max-height:none!important;overflow:visible!important;padding:5px 6px}
.toolbar.tool-menu-bar{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:5px!important;min-height:46px;overflow:visible!important}
.tool-menu-group{position:relative;flex:0 0 auto}
.tool-menu-trigger{height:40px;min-width:92px;padding:0 10px;border:1px solid #394435;border-radius:7px;background:linear-gradient(180deg,#222a21,#191f18);color:#dedcc9;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px;font-size:9px;font-weight:800;text-align:left}
.tool-menu-trigger span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tool-menu-trigger small{display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:1px solid rgba(210,196,145,.18);border-radius:9px;color:#9fa692;font-size:7px}.tool-menu-trigger b{font-size:8px;color:#837a58}.tool-menu-trigger:hover,.tool-menu-trigger.active{border-color:#8e8051;background:linear-gradient(180deg,#2b3024,#20241b);color:#f3e8b9}.tool-menu-group.open>.tool-menu-trigger{border-color:#c0a653;box-shadow:inset 0 0 0 1px rgba(218,189,91,.16)}
.tool-menu-popover{position:absolute;left:0;bottom:calc(100% + 7px);z-index:80;display:none;grid-template-columns:repeat(6,44px);gap:5px;padding:8px;border:1px solid #4d5546;border-radius:8px;background:rgba(17,22,17,.98);box-shadow:0 12px 32px rgba(0,0,0,.5);backdrop-filter:blur(7px)}
.tool-menu-group.open>.tool-menu-popover{display:grid}.tool-menu-popover .tool-button{margin:0!important}.tool-menu-popover .tool-button::after{bottom:calc(100% + 6px)}
.tool-quick-button{margin-right:3px!important;border-color:#686044!important}
.tool-help{flex:1;min-height:14px;padding:2px 3px 0;font-size:9px}
.build-info-strip{margin-top:4px}

.resource-overlay{position:absolute;left:12px;top:12px;z-index:12;width:236px;border:1px solid rgba(210,197,150,.28);border-radius:8px;background:rgba(15,20,15,.88);box-shadow:0 5px 20px rgba(0,0,0,.34);backdrop-filter:blur(6px);overflow:hidden;pointer-events:auto}
.resource-overlay-head{width:100%;height:30px;padding:0 8px;border:0;border-bottom:1px solid rgba(210,197,150,.15);background:rgba(27,34,26,.92);color:#eee7ce;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:7px;text-align:left;cursor:pointer}.resource-overlay-head>span{font-size:10px;font-weight:850;letter-spacing:.03em}.resource-overlay-head small{font-size:7px;color:#909988}.resource-overlay-head b{font-size:8px;color:#b7a66e}
.resource-overlay-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;padding:5px;background:rgba(255,255,255,.015)}
.mini-resource{min-width:0;height:28px;padding:3px 6px;border:1px solid transparent;border-radius:4px;display:flex;align-items:center;justify-content:space-between;gap:6px}.mini-resource span{font-size:8px;color:#9ca591;white-space:nowrap}.mini-resource strong{font-size:10px;color:#ebe4ca;font-variant-numeric:tabular-nums;white-space:nowrap}.mini-resource.danger{border-color:rgba(190,82,69,.46);background:rgba(89,33,28,.48)}.mini-resource.danger strong{color:#f1a08e}.resource-overlay.collapsed{width:178px}.resource-overlay.collapsed .resource-overlay-grid{display:none}.resource-overlay.collapsed .resource-overlay-head{border-bottom:0}
@media(max-width:1300px){.tool-menu-trigger{min-width:75px;padding:0 7px}.tool-menu-popover{grid-template-columns:repeat(5,44px)}.resource-overlay{width:210px}}
.tool-quick-button{width:76px!important;min-width:76px!important;flex:0 0 76px!important;height:40px!important;display:grid!important;place-items:center!important;background:linear-gradient(180deg,#222a21,#191f18)!important}.tool-quick-button .tool-quick-text{display:block!important;position:static!important;margin:0!important;color:#dedcc9!important;font-size:9px!important;font-weight:850!important}.tool-quick-button.active{color:#f4e5aa!important}.tool-menu-popover{grid-template-columns:repeat(4,72px);gap:6px}.tool-menu-popover .menu-tool-button{width:72px!important;min-width:72px!important;flex:0 0 72px!important;height:58px!important;min-height:58px!important;padding:0!important}.tool-menu-popover .menu-tool-button .sprite-tool-icon{top:20px!important;width:28px!important;height:28px!important;margin:-14px 0 0 -14px!important}.tool-menu-popover .menu-tool-name{display:block!important;position:absolute!important;left:3px;right:3px;bottom:3px;margin:0!important;color:#b9bdad!important;font:700 7px/9px system-ui!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.tool-menu-popover .menu-tool-button.active .menu-tool-name{color:#f5df93!important}.tool-menu-popover .tool-cost-badge{top:2px!important;right:2px!important;bottom:auto!important}.tool-menu-popover .menu-tool-button::after{display:none!important}
@media(max-width:1300px){.tool-menu-popover{grid-template-columns:repeat(3,72px)}}
.toolbar.tool-menu-bar>.tool-quick-button>span.tool-quick-text:not(.sprite-tool-icon){display:block!important;position:static!important;margin:0!important;color:#dedcc9!important;font-size:9px!important;font-weight:850!important}
.tool-menu-popover .menu-tool-button>span.menu-tool-name:not(.sprite-tool-icon){display:block!important;position:absolute!important;left:3px!important;right:3px!important;bottom:3px!important;margin:0!important;color:#b9bdad!important;font:700 7px/9px system-ui!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.tool-menu-popover .menu-tool-button.active>span.menu-tool-name:not(.sprite-tool-icon){color:#f5df93!important}