*{box-sizing:border-box;margin:0;padding:0}:root{--glass:#0b0d11c7;--glass-soft:#101318db;--line:#ffffff17;--txt:#e7e3d8;--txt-dim:#a8a294;--accent:#e3b341;--accent-dim:#9a7a1c;--danger:#ff7a6a}html,body{-webkit-user-select:none;user-select:none;background:#11161d;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,system-ui,sans-serif;overflow:hidden}#app{width:100%;height:100%;position:relative}canvas.game-canvas{display:block;position:absolute;inset:0}body.attack-cursor canvas.game-canvas{cursor:crosshair}button{font-family:inherit}#topbar{background:var(--glass);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);z-index:20;white-space:nowrap;border-radius:11px;align-items:center;gap:14px;padding:7px 14px;display:flex;position:absolute;top:10px;left:50%;transform:translate(-50%);box-shadow:0 4px 18px #00000073}.res-group{align-items:center;gap:16px;display:flex}.chip{color:var(--txt);letter-spacing:.2px;align-items:center;gap:7px;font-size:14.5px;font-weight:600;display:inline-flex}.chip b{min-width:34px;font-weight:650}.sw{border-radius:4px;width:15px;height:15px;display:inline-block;box-shadow:inset 0 0 0 1px #ffffff38,0 1px 2px #0006}.sw-wood{background:#8a5a2b}.sw-food{background:#c0392b}.sw-gold{background:#e3b341}.sw-pop{background:#4a7dd8}#res-pop.capped{color:var(--danger)}#age-label{color:var(--accent);letter-spacing:.4px;border-left:1px solid var(--line);padding:0 4px 0 12px;font-size:14.5px;font-weight:700}#btn-advance{color:var(--txt);cursor:pointer;background:#ffffff12;border:1px solid #e3b34173;border-radius:8px;padding:5px 13px;font-size:13px;font-weight:600;transition:background .15s}#btn-advance:hover:not(:disabled){background:#e3b3412e}#btn-advance:disabled{opacity:.45;cursor:default}.top-btns{gap:6px;display:flex}.top-btns button{width:27px;height:27px;color:var(--txt);border:1px solid var(--line);cursor:pointer;background:#ffffff12;border-radius:7px;font-size:13px}.top-btns button:hover{background:#ffffff26}#objective{background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--line);color:var(--txt-dim);z-index:19;pointer-events:none;border-radius:8px;padding:5px 16px;font-size:13px;transition:opacity 1.2s;position:absolute;top:58px;left:50%;transform:translate(-50%)}#objective.gone{opacity:0}#idle-badge{background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--line);color:var(--txt);cursor:pointer;z-index:20;border-radius:8px;align-items:center;gap:5px;padding:5px 12px;font-size:13px;font-weight:600;display:none;position:absolute;bottom:224px;left:12px}#idle-badge:hover{background:#ffffff1f}#idle-badge.show{display:inline-flex}#minimap-wrap{background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);z-index:20;border-radius:11px;padding:5px;position:absolute;bottom:12px;left:12px;box-shadow:0 4px 18px #00000080}#minimap{cursor:crosshair;border-radius:7px;width:188px;height:188px;display:block}#panel{background:var(--glass-soft);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line);width:332px;min-height:110px;max-height:46vh;color:var(--txt);z-index:20;border-radius:12px;padding:13px 14px;position:absolute;bottom:12px;right:12px;overflow-y:auto;box-shadow:0 4px 18px #00000080}.sel-title{color:var(--accent);margin-bottom:6px;font-size:16px;font-weight:700}.enemy-tag{color:var(--danger);font-size:12.5px;font-weight:500}.hint{color:var(--txt-dim);font-size:12.5px;line-height:1.55}.stats{color:#cfc9ba;margin:5px 0;font-size:13.5px}.warn{color:#ffb04a;margin-top:4px;font-size:13.5px;font-weight:700}.hp-row{color:var(--txt-dim);align-items:center;gap:8px;font-size:12.5px;display:flex}.hpbar{background:#0000008c;border:1px solid #ffffff12;border-radius:4px;flex:1;height:8px;overflow:hidden}.hpfill{background:linear-gradient(#74d860,#3f9c34);height:100%}.actions-label{text-transform:uppercase;letter-spacing:1.2px;color:var(--txt-dim);border-bottom:1px solid var(--line);margin:11px 0 6px;padding-bottom:3px;font-size:11px;font-weight:700}.btn-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.act-btn{border:1px solid var(--line);color:var(--txt);cursor:pointer;background:#ffffff0f;border-radius:9px;flex-direction:column;align-items:center;padding:7px 2px 6px;transition:background .12s,border-color .12s;display:flex}.act-btn:hover{background:#ffffff21;border-color:#fff3}.act-btn .ico{font-size:19px;line-height:1.2}.act-btn .lbl{white-space:nowrap;text-overflow:ellipsis;max-width:96px;margin-top:2px;font-size:10.5px;font-weight:600;overflow:hidden}.act-btn .cost{color:var(--txt-dim);margin-top:1px;font-size:9.5px}.act-btn.poor{opacity:.5}.act-btn.poor .cost{color:var(--danger)}.act-btn.locked{opacity:.3;filter:grayscale(.8)}.age-btn{background:#e3b3411a;border-color:#e3b3418c}.group-row{flex-wrap:wrap;gap:5px;margin-top:4px;display:flex}.icon-btn{border:1px solid var(--line);cursor:pointer;width:44px;height:40px;color:var(--txt);background:#ffffff0f;border-radius:9px;font-size:19px;position:relative}.icon-btn:hover{background:#ffffff21}.icon-btn .cnt{color:var(--accent);font-size:11px;font-weight:700;position:absolute;bottom:1px;right:3px}.queue{gap:5px;margin:8px 0 2px;display:flex}.q-slot{border:1px solid var(--line);cursor:pointer;background:#0006;border-radius:9px;justify-content:center;align-items:center;width:40px;height:40px;font-size:19px;display:flex;position:relative;overflow:hidden}.q-prog{background:var(--accent);height:4px;position:absolute;bottom:0;left:0}.q-slot .stall{color:#ff8a4a;font-size:10px;position:absolute;top:0;right:1px}#toasts{z-index:30;pointer-events:none;flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;top:92px;left:50%;transform:translate(-50%)}.toast{background:var(--glass-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--txt);border:1px solid #e3b34166;border-radius:9px;padding:7px 18px;font-size:14px;transition:opacity .45s;box-shadow:0 4px 14px #00000073}.toast.out{opacity:0}#selbox{z-index:15;pointer-events:none;background:#8cdc641f;border:1.5px solid #9fe06f;display:none;position:absolute}#tooltip{max-width:260px;color:var(--txt);z-index:50;pointer-events:none;background:#080a0df5;border:1px solid #ffffff24;border-radius:9px;padding:8px 11px;font-size:12.5px;line-height:1.5;display:none;position:absolute;box-shadow:0 6px 20px #00000080}#tooltip b{color:var(--accent)}#tooltip i{color:#ffb04a}#help-panel{background:var(--glass-soft);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line);width:300px;color:var(--txt);z-index:40;border-radius:12px;padding:14px 16px;font-size:12.5px;line-height:1.7;display:none;position:absolute;top:58px;right:12px}#help-panel.open{display:block}#help-panel h3{color:var(--accent);text-transform:uppercase;letter-spacing:1px;margin:8px 0 3px;font-size:11.5px}#overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:100;background:#070a0eb8;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.modal{max-width:660px;color:var(--txt);text-align:center;background:linear-gradient(#1a1e25f7,#0e1116f7);border:1px solid #e3b34180;border-radius:18px;padding:36px 46px;box-shadow:0 18px 70px #000000bf}.modal h1{color:var(--accent);letter-spacing:.5px;font-size:36px;font-weight:800}.modal .sub{color:var(--txt-dim);margin:8px 0 20px;font-size:15.5px}.modal .cols{text-align:left;gap:28px;margin-bottom:24px;display:flex}.modal .cols>div{flex:1}.modal h3{color:var(--accent);text-transform:uppercase;letter-spacing:1.2px;margin-bottom:6px;font-size:12px}.modal p{font-size:13.5px;line-height:1.65}.modal button{color:#1a1408;cursor:pointer;letter-spacing:.6px;background:linear-gradient(#ecc257,#c79a2e);border:none;border-radius:11px;padding:11px 46px;font-size:18px;font-weight:800;box-shadow:0 4px 16px #e3b3414d}.modal button:hover{filter:brightness(1.1)}.modal.win h1{color:#ffe87a}.modal.lose h1{color:var(--danger)}#loading{color:var(--txt);z-index:200;letter-spacing:1px;background:#11161d;flex-direction:column;justify-content:center;align-items:center;gap:14px;font-size:16px;display:flex;position:absolute;inset:0}.spinner{border:4px solid #ffffff1f;border-top-color:var(--accent);border-radius:50%;width:42px;height:42px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}