:root{color-scheme:dark;--bg-dark:#142329;--bg-panel:#15272bef;--bg-card:#21383b;--accent-amber:#f2cc83;--accent-green:#ade8be;--accent-red:#ffa99d;--border-light:#a7ccbd38;--text-muted:#bccdc8;--text-main:#f0f3e8;--header:128px;--build:176px;--tools:44px;font-family:system-ui,-apple-system,sans-serif;color:var(--text-main)}*{box-sizing:border-box}body,html{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg-dark)}#app{width:100%;height:100dvh;position:relative;overflow:hidden}button,input,select,textarea{font:inherit}button,select{min-height:44px;border:1px solid var(--border-light);border-radius:8px;background:var(--bg-card);color:var(--text-main);cursor:pointer;padding:7px 11px}button:disabled{opacity:.5;cursor:not-allowed}button:hover:not(:disabled){border-color:var(--accent-amber)}button:focus-visible,select:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #f2cc83;outline-offset:2px}canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;outline:none}a{color:var(--accent-amber);text-decoration:none}.hidden,[hidden]{display:none!important}.top-bar{position:absolute;z-index:20;left:0;right:0;top:0;background:var(--bg-panel);border-bottom:1px solid var(--border-light);padding:max(6px,env(safe-area-inset-top)) 12px 8px;display:grid;grid-template-columns:auto 1fr;gap:6px 16px}.brand{display:flex;align-items:center;gap:14px;font-size:15px;white-space:nowrap}.brand a{font-size:13px;min-height:44px;display:flex;align-items:center}.resource-group{display:flex;gap:5px;overflow-x:auto;scrollbar-width:thin;min-width:0;align-items:center}.res-item{display:flex;align-items:center;gap:5px;white-space:nowrap;min-height:38px;padding:6px 9px;font-size:13px;flex-shrink:0}.res-item small{font-size:11px;color:var(--text-muted)}.res-item.shortage{border-color:#ffaa7b;color:#ffd2b8}.controls-group{grid-column:1/-1;display:flex;gap:6px;align-items:center;justify-content:flex-end;overflow-x:auto;scrollbar-width:thin}.controls-group select{margin-right:auto;min-width:150px;font-size:13px}.speed-buttons{display:flex;gap:2px}.speed-btn.active{background:var(--accent-amber);color:#1a3032}.icon-btn{white-space:nowrap;font-size:14px}.goal-banner{position:absolute;top:calc(var(--header) + 5px);left:12px;max-width:calc(100% - 90px);font-size:12px;text-align:left;background:#172c2de8;z-index:15;box-shadow:0 3px 15px #0004}.build-menu{position:absolute;bottom:max(6px,env(safe-area-inset-bottom));left:12px;right:12px;height:var(--build);padding:8px;background:var(--bg-panel);border:1px solid var(--border-light);border-radius:12px;z-index:20;display:flex;flex-direction:column;gap:6px}.category-tabs,.cards-carousel{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;min-height:0}.category-tabs{flex-shrink:0}.tab-btn{font-size:12px;white-space:nowrap;padding:6px 12px;min-height:40px}.tab-btn.active,.build-card.active{border-color:var(--accent-amber);background:#635236}.cards-carousel{flex:1;align-items:stretch;padding-bottom:3px}.build-card{flex:0 0 145px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px;line-height:1.2}.card-icon{font-size:21px}.card-title{font-size:12px;font-weight:700}.card-cost{font-size:11px;color:var(--accent-amber)}.card-lock{font-size:10px;color:#c4d2d0}.build-card.locked{border-style:dashed}.build-card.locked .card-icon{opacity:.55}.map-tools{position:absolute;bottom:calc(var(--build) + 67px + env(safe-area-inset-bottom));right:12px;display:flex;gap:4px;z-index:20;background:#142a2cf0;padding:4px;border-radius:10px}.map-tools button{font-size:12px;min-width:44px;padding:5px 8px}.tool-hint{position:absolute;bottom:calc(var(--build) + 14px + env(safe-area-inset-bottom));left:12px;right:12px;min-height:44px;max-height:48px;display:flex;align-items:center;gap:8px;z-index:20;border-radius:8px;background:#142a2ced;padding:5px 9px;font-size:12px}.tool-hint span{min-width:0;flex:1;max-height:38px;overflow-y:auto}.tool-hint button{flex-shrink:0;background:var(--accent-amber);color:#183035;font-weight:700}.build-collapsed .build-menu{display:none}.build-collapsed{--build:0px}.inspector-panel{position:absolute;top:calc(var(--header) + 54px);right:12px;bottom:calc(var(--build) + 126px);width:min(320px,calc(100% - 24px));z-index:25;overflow-y:auto;padding:14px;background:var(--bg-panel);border:1px solid var(--border-light);border-radius:12px}.inspector-header,.modal-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.inspector-title{font-size:14px;margin:0}.close-btn{min-width:44px;flex-shrink:0}.building-title{margin:12px 0 8px;font-size:16px;color:var(--accent-amber)}.building-desc,.hint-text{font-size:12px;color:var(--text-muted);line-height:1.45}.prop-row{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:5px 0;font-size:13px}.prop-row strong,.prop-value{text-align:right}.prop-label{color:var(--text-muted)}.divider{border:0;border-top:1px solid var(--border-light)}.status-tags{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0}.tag{font-size:11px;border-radius:5px;padding:4px 7px;background:#193f42;color:#c8eadc}.tag-red,.tag-orange{background:#542d27;color:#ffd0ad}.alerts-queue{position:absolute;top:calc(var(--header) + 55px);left:12px;width:min(300px,calc(100% - 24px));z-index:26;pointer-events:none;display:flex;flex-direction:column;gap:6px}.alert-toast{pointer-events:auto;display:flex;gap:7px;background:#162c2ff5;border:1px solid var(--border-light);border-left:4px solid var(--accent-green);padding:9px;border-radius:10px;box-shadow:0 4px 16px #0004}.alert-warning{border-left-color:#ffb787}.alert-content{flex:1;min-width:0}.alert-title{font-size:13px;font-weight:700}.alert-message{font-size:12px;color:var(--text-muted);line-height:1.4;margin-top:4px}.alert-close{align-self:flex-start;min-width:44px}.fade-out{opacity:0;transition:opacity .25s}.modal{position:absolute;inset:0;background:#051718bc;z-index:100;display:flex;align-items:center;justify-content:center;padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}.modal-dialog{width:min(580px,100%);max-height:100%;overflow-y:auto;overscroll-behavior:contain;background:#182e31;border:1px solid #718d79;border-radius:16px;padding:20px;box-shadow:0 10px 60px #0008}.modal-header h2{font-size:21px;line-height:1.25;margin:0;color:var(--accent-amber)}.modal-body{display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.5}.modal-body p,.modal-body h3{margin:0}.modal-body h3{font-size:16px;margin-top:12px}.lead{color:#e6d9b2}.help-list{margin:0;padding-left:20px;display:grid;gap:10px}.action-btn{background:var(--accent-amber);color:#152b2d;font-weight:700}.danger-btn{background:#7e342e;color:#fff}.btn-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.policy-btn{display:flex;flex-direction:column;text-align:left;gap:5px}.policy-btn span{font-size:13px;color:var(--text-muted)}.goal-row{border-left:2px solid #607a67;padding:6px 12px}.goal-row p{font-size:13px;color:var(--text-muted)}.goal-row small{color:var(--accent-amber)}.status-msg{color:#f2cc83;font-size:13px}.modal label{display:block;font-size:13px}.modal input[type=file],textarea{display:block;max-width:100%;width:100%;margin-top:5px;background:#102124;color:var(--text-main);padding:8px;border:1px solid var(--border-light);border-radius:6px}textarea{user-select:text}input[type=range]{width:100%;min-height:44px}input[type=checkbox]{width:22px;height:22px;vertical-align:middle}.text-red{color:var(--accent-red)}.text-green{color:var(--accent-green)}.reduced-motion *{animation:none!important;transition:none!important}@media (min-width:1000px){:root{--header:106px}.top-bar{padding:7px 16px}.resource-group,.controls-group{justify-content:flex-end}.controls-group select{margin-left:auto;margin-right:6px}.build-menu,.tool-hint{left:max(12px,calc((100vw - 1080px)/2));right:max(12px,calc((100vw - 1080px)/2))}}@media (max-width:999px){:root{--header:150px;--build:153px}.top-bar{grid-template-columns:1fr;gap:4px;padding:4px 8px}.brand{font-size:14px;justify-content:space-between;height:26px}.brand a{min-height:26px}.resource-group{width:100%;padding-bottom:2px;gap:4px}.res-item{min-height:40px}.controls-group{justify-content:flex-start}.controls-group select{min-width:110px;width:110px;font-size:12px;padding:4px}.speed-btn{min-width:40px;padding:6px}.icon-btn{padding:6px 9px}.build-menu{left:6px;right:6px;padding:6px}.build-card{flex-basis:132px}.tab-btn{min-height:44px}.map-tools{right:6px;left:6px;justify-content:center;gap:3px}.map-tools button{padding:4px 7px}.goal-banner{left:6px;max-width:calc(100% - 12px);min-height:38px}.tool-hint{left:6px;right:6px;font-size:11px}.inspector-panel{left:6px;right:6px;width:auto;top:calc(var(--header) + 46px);bottom:calc(var(--build) + 123px)}.alerts-queue{top:calc(var(--header) + 46px);left:6px}.alert-toast:not(:last-child){display:none}.modal-dialog{padding:16px}.modal-header h2{font-size:19px}}@media (max-width:360px){.map-tools button{min-width:38px;font-size:11px;padding:3px 5px}.goal-banner{font-size:11px}.build-card{flex-basis:123px}.modal-dialog{padding:12px}}@media (max-height:600px){:root{--build:111px}.card-icon{display:none}.card-lock{font-size:9px}.build-menu{gap:3px}.goal-banner{min-height:34px;font-size:11px}.map-tools{bottom:calc(var(--build) + 62px)}.inspector-panel{top:calc(var(--header) + 4px);bottom:50px;left:auto;width:min(310px,90%)}}@media (max-height:500px) and (min-width:600px){:root{--header:98px;--build:103px}.top-bar{grid-template-columns:140px 1fr}.brand{font-size:12px;height:auto;flex-direction:column;gap:0}.resource-group{padding:0}.controls-group{justify-content:flex-end}.controls-group select{margin-left:auto}.goal-banner{top:calc(var(--header) + 2px);max-width:40%;min-height:32px}.map-tools{left:auto;right:6px;top:calc(var(--header) + 2px);bottom:auto;padding:0;background:#122b2ddd}.tool-hint{bottom:calc(var(--build) + 10px);min-height:38px;max-height:42px}.alerts-queue{top:calc(var(--header) + 49px);width:250px}.build-collapsed .tool-hint{bottom:8px}}.build-card{flex-basis:176px;justify-content:flex-start}.card-icon{font-size:18px;line-height:20px}.card-lock:empty{display:none}@media (max-width:999px){:root{--build:176px}}@media (max-height:600px){:root{--build:148px}.card-icon{display:none}}#app.build-collapsed{--build:0px}
