/* The forest stays the stage; the HUD sits around the player's actions. */
:root{--ink:#193e39;--dark:#12332f;--cream:#fff7e7;--gold:#edbd70;--mint:#9acbb3;--line:#d9d9bf}
.ui-icon{width:24px;height:24px;flex-shrink:0;vertical-align:middle}
button,input,select{font:inherit}button{transition:background .18s,box-shadow .18s,transform .18s}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #cc903d;outline-offset:3px}
.primary{background:linear-gradient(#f3cb86,#e6ad59);box-shadow:inset 0 1px #fff7,0 3px 0 #bd8840}
.dark{background:linear-gradient(#28584b,#1b4139);box-shadow:inset 0 1px #fff2,0 2px 0 #102f2c}
.secondary{background:#e8ebdc;color:var(--ink);border:1px solid #d1d8c2}
.icon-button{display:grid;place-items:center;width:42px;height:42px;padding:9px;border-radius:12px;flex-shrink:0}
.game{background:#153c34}
.topbar{height:94px;gap:24px;padding:13px 24px;background:linear-gradient(100deg,#112e2b,#20483e 55%,#112e2b);border-bottom:1px solid #ceac6566;box-shadow:0 4px 20px #08261e44;z-index:5}
.brand{display:flex;align-items:center;gap:13px;min-width:230px;max-width:330px;padding:0;background:none;color:var(--cream);text-align:left;font-weight:400}
.topbar .brand{padding:0}.brand:hover{filter:none;transform:none}.tribe-avatar{display:grid;place-items:center;width:57px;height:60px;border-radius:18px;background:radial-gradient(circle at 50% 70%,#80ab7966,#c7b57611);border:1px solid #b2c79a55;overflow:hidden;flex-shrink:0;box-shadow:inset 0 0 12px #0002}
.tribe-avatar svg{height:61px;width:56px;margin-top:9px;filter:drop-shadow(0 3px 2px #0003)}
.brand-copy{min-width:0}.brand small{display:block;font-size:8px;letter-spacing:2px;color:#b6c9b0;margin-bottom:3px}.era-mark{margin-left:4px;color:var(--gold);border:1px solid #d7b87b55;padding:1px 5px;letter-spacing:0;border-radius:3px}
.brand b{font-size:21px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.35}.tribe-level{display:block;font-size:10px;color:#adbfaa;margin-top:3px}
.resources{gap:9px;justify-content:center;min-width:0}.resource{min-width:105px;max-width:170px;flex:1;gap:11px;padding:10px 16px;background:linear-gradient(135deg,#ffffff0c,#ffffff03);border:1px solid #b9c8aa26;border-radius:13px;box-shadow:inset 0 1px #ffffff08}
.resource-icon{width:30px;height:30px;filter:drop-shadow(0 2px 2px #0004);stroke-width:.6}.resource small{font-size:9px;letter-spacing:.3px;color:#bed0b8;margin-bottom:2px}.resource strong{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;color:#fff5dc;white-space:nowrap}
.topbar>.icon-button{background:#ffffff09;border:1px solid #b9c8aa33;color:#e0d6b6}.topbar>.icon-button:hover{background:#ffffff16}
.main{flex-direction:row;min-height:0}.scene{min-height:0;background:#c8b77b}.scene:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 25px 55px #1c352b22,inset 0 -18px 40px #1b382c33;z-index:1}
.village{background-position:center;background-size:cover}.village-board{position:absolute;inset:35px 20px 30px 20px;transition:right .24s}.panel-open .village-board{right:350px}
.scene-title{top:20px;left:22px;border-radius:14px;background:linear-gradient(120deg,#193e36f5,#264c3de8);border:1px solid #dfc48b55;color:#fff5da;padding:13px 19px;box-shadow:0 6px 22px #17352b30;z-index:3;max-width:290px}
.scene-title .eyebrow{font-size:7px;letter-spacing:1.7px;color:#d3c08f;display:block;margin-bottom:6px}.scene-title h2{font-size:25px;line-height:1.15;margin:0 0 5px}.scene-title small{font-size:9px;color:#c2d0b3;display:block;line-height:1.4}
.activity-tray{position:absolute;right:24px;top:22px;display:flex;gap:7px;z-index:3;transition:right .24s}.panel-open .activity-tray{right:370px}
.activity-tray button{display:flex;gap:9px;align-items:center;text-align:left;background:#fff7e7ed;border:1px solid #fff8;padding:10px 12px;border-radius:12px;box-shadow:0 4px 12px #183d2926;min-width:111px;color:#24483c}
.activity-tray .ui-icon{width:21px;height:21px;color:#6d815d}.activity-tray small{display:block;font-size:8px;font-weight:500;color:#738062;margin-bottom:4px}.activity-tray b{font-size:11px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.plot{width:clamp(80px,8vw,114px);height:100px;border-radius:40%;filter:drop-shadow(0 7px 4px #573b2433);z-index:1}.plot:hover{z-index:4;filter:drop-shadow(0 9px 6px #573b2444)}
.plot:before{content:'';position:absolute;left:3%;right:3%;height:50%;bottom:4%;border:2px solid transparent;border-radius:50%;transition:.2s;background:transparent;z-index:-1}
.plot.is-selected:before{border-color:#fff2af;box-shadow:0 0 0 3px #c18b35a6,0 0 22px #ffe9a4a0;background:#ffdf7a33}.plot.is-selected{z-index:3}
.plot .name{bottom:-10px;padding:5px 9px;max-width:142px;font-size:10px;font-weight:600;color:#264437;background:#fff6e5ee;border:1px solid #e9d6a8;box-shadow:0 3px 5px #392c1a26;line-height:1.15;border-radius:7px}
.plot.is-built .name{background:#214b3fea;color:#fff4d7;border-color:#a8b18a}.plot.is-selected .name{background:#f1cd86;color:#3b442b;border-color:#fff0c5}
.plot.is-locked{opacity:.6;filter:grayscale(.35)}.plot.is-locked.is-selected,.plot.is-locked:hover{opacity:1;filter:none}
.plot .badge{background:#2b5748;border:2px solid #ffe6a9;box-shadow:0 2px 4px #0002;font-size:10px;width:24px;height:24px;right:-2px;top:3px}
.plot .collect{top:0;border:1px solid #fff0b5;box-shadow:0 3px 8px #684b2855;color:#4f3e24;padding:5px 9px;background:linear-gradient(#ffe1a0,#eeb75b)}
.plot .progress{height:6px;bottom:7px;border:1px solid #bfa46a}.troops{bottom:12%;left:47%;z-index:0}.troops svg{width:30px;height:42px}
.plot svg,.building-preview svg{fill:none}.plot .collect{display:flex;align-items:center;gap:4px}.plot .collect .ui-icon{width:13px;height:13px;stroke-width:.5}
.sidebar{position:absolute;top:20px;right:20px;bottom:auto;max-height:calc(100% - 40px);height:auto;width:306px;padding:18px 22px 22px;z-index:6;border-radius:18px;border:1px solid #f3dfb6;background:linear-gradient(135deg,#fff9ec,#f5edd7);box-shadow:0 12px 32px #183c2c3d,inset 0 0 0 4px #fff9;scrollbar-width:thin;scrollbar-color:#a9b496 transparent;overscroll-behavior:contain;display:none}
.panel-open .sidebar{display:block;animation:panel-in .2s ease-out}@keyframes panel-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.inspector-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:9px;margin-bottom:6px;border-bottom:1px solid #dce0ca;gap:8px}
.inspector-top>span{display:flex;align-items:center;gap:7px;font-size:8px;font-weight:700;letter-spacing:1.5px;color:#74876b}.inspector-top .ui-icon{width:17px;height:17px}
.sidebar .inspector-top .icon-button{width:32px;height:32px;min-width:32px;margin:0;padding:7px;background:#e9eddc;color:#63765c}.building-preview{position:relative;height:115px;display:grid;place-items:center;background:radial-gradient(ellipse at center,#b6c7a66b,transparent 67%);margin:4px 0 14px}
.building-preview>svg{width:130px;height:115px;filter:drop-shadow(0 5px 3px #57452a22)}.building-preview>img{position:static!important;width:150px!important;height:125px!important;object-fit:contain}
.sidebar h2{font-size:29px;line-height:1.1;margin-bottom:12px}.sidebar h3{font-size:21px}.sidebar>p{line-height:1.65;font-size:12px}.sidebar .pill{font-size:8px;letter-spacing:1px;padding:5px 9px;margin:0 0 10px;background:#e1e7d2;color:#677655;border:1px solid #d7dec6}
.sidebar .stat{font-size:12px;gap:12px;padding:10px 0}.sidebar .stat b{text-align:right;color:#294d3d}.sidebar .muted{font-size:10px;color:#74846c}
.sidebar button{font-size:12px;min-height:42px;margin:6px 0}.sidebar section{border-top:1px solid #d5dcc5;margin-top:15px;padding-top:1px}.sidebar input,.sidebar select{min-height:44px;font:inherit;font-size:13px;max-width:100%}
.production-meter{height:5px;background:#d8dfc8;border-radius:5px;overflow:hidden;margin:9px 0 14px}.production-meter span{display:block;height:100%;background:linear-gradient(90deg,#699f74,#b3bc71);border-radius:5px}.offline-note{font-size:10px!important;display:flex;gap:6px;align-items:center;color:#708068!important}.offline-note .ui-icon{width:14px;height:14px}.job-card{background:#e4ead8;border:1px solid #d1dabb;border-radius:10px;padding:12px;font-size:12px}.sidebar section.upgrade-panel h3{font-size:19px;margin:15px 0 8px}
.costs{gap:7px;margin:16px 0}.costs>span{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid #d7ddc5;border-radius:7px;background:#ffffff50;font-size:11px;font-variant-numeric:tabular-nums}.costs .ui-icon{width:19px;height:19px;stroke-width:.5}
.inspect-toggle{position:absolute;right:24px;top:22px;display:flex;align-items:center;gap:7px;z-index:4;background:#fff6e8ee;border:1px solid #fff9;box-shadow:0 4px 15px #143b2926;font-size:11px}.inspect-toggle .ui-icon{width:17px;height:17px;transform:rotate(90deg)}.panel-open .inspect-toggle{display:none}
.quests{bottom:20px;left:22px;width:270px;display:flex;gap:13px;padding:14px 17px;z-index:3;border-radius:14px;background:#163e34f2;border-color:#e8c98a66;box-shadow:0 5px 20px #17392733}
.quest-symbol{border:1px solid #c4c08b66;background:#a6ae6633;border-radius:11px;display:grid;place-items:center;width:37px;height:40px;flex-shrink:0;color:#e9c180}.quest-symbol .ui-icon{width:22px;height:22px}
.quests small{font-size:7px;letter-spacing:1.5px;color:#adc4aa;display:block;margin-bottom:4px}.quests strong{font-size:13px;margin-bottom:5px;color:#f4d59b}.quests div>span{font-size:10px;line-height:1.5;color:#d4dfc4;display:block}.quest-steps{display:flex;gap:4px;margin-top:9px}.quest-steps i{width:22px;height:3px;background:#92a18455;border-radius:4px}.quest-steps i.done{background:#d8b576}
.bottom{height:86px;position:relative;flex-shrink:0;padding:10px 24px;border-top:1px solid #b59c6155;background:linear-gradient(#173b32,#102e29);box-shadow:0 -5px 18px #16372b22;z-index:10}
.tabs{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:6px;padding:5px;background:#0c292550;border:1px solid #9fb18526;border-radius:16px}
.tabs button{display:flex;align-items:center;justify-content:center;gap:9px;position:relative;min-width:108px;padding:12px 15px;border-radius:11px;min-height:48px;color:#bcd0b5;font-size:12px;font-weight:600}.tabs button .ui-icon{width:22px;height:22px}
.tabs .active{background:linear-gradient(#f1d399,#dcb369);color:#263e2e;box-shadow:inset 0 1px #fff9,0 3px 8px #0003}.tabs button:hover:not(.active){background:#ffffff09}.tabs em{font-style:normal;font-size:8px;position:absolute;top:3px;right:5px;background:#bd8551;color:#fff6dc;border-radius:6px;padding:1px 4px}.tabs em:empty{display:none}
.version-mark{position:absolute;left:24px;top:24px;font-size:8px;letter-spacing:1.5px;color:#b3c1a4}.version-mark b{color:#dec48f;letter-spacing:0;margin-left:4px;font-weight:500}
.save-status{position:absolute;left:24px;bottom:23px;display:flex;align-items:center;gap:6px;font-size:9px;color:#90ad91}.save-status i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#91c39a;box-shadow:0 0 5px #91c39a55}.save-status.is-offline{color:#e9b581}
.chat-widget{right:24px;bottom:19px;z-index:12}.chat-toggle{display:flex;gap:9px;align-items:center;justify-content:center;background:#ffffff08;border:1px solid #a3b38c55;color:#d5dfc4;box-shadow:none;min-height:48px;padding:10px 18px;font-size:12px}.chat-toggle .ui-icon{width:21px;height:21px}.chat-panel{bottom:68px;border-color:#dbca9a;background:#fff7e7;box-shadow:0 12px 50px #082d2980}.chat-head{background:linear-gradient(100deg,#15382f,#305440);min-height:52px}.chat-head strong{font-family:Marcellus,Georgia,serif;font-weight:400;font-size:18px}.chat-head button{min-height:38px}.chat-form input{font-size:14px;min-height:44px}.chat-form button{min-height:44px}.chat-hint{font-size:10px}.chat-author time{color:#647760}.chat-message p{line-height:1.5;color:#35503e}
.map-tools{bottom:20px;left:22px;z-index:3}.map-tools button{background:#fff6e7f0;min-height:44px;border:1px solid #fff9;padding:10px 14px}.map-tools .ui-icon{width:19px;height:19px}
dialog{border:1px solid #f0d6a6;max-height:calc(100dvh - 30px);overflow:auto;background:linear-gradient(135deg,#fff9ec,#f4ecd8);box-shadow:0 20px 100px #061b17a0,inset 0 0 0 4px #fff8;scrollbar-width:thin;overscroll-behavior:contain}dialog::backdrop{background:#0b2724a8;backdrop-filter:blur(5px)}
.tech-card{background:#fffaf064;border-color:#d6d8bd;box-shadow:0 2px 8px #46553608}.tech-card .pill{font-size:8px;margin-bottom:5px}.tech-card.done{background:#e0ebd7}.tech-card.studying{background:#f4e9c9;border-color:#cba365}.tech-card small{color:#67765e}.tech-card .muted{color:#69785f}.research-dialog>h2,.reports-dialog>h2{font-size:34px}.army-choice input{min-height:44px;color:var(--ink)}
.dialog-heading{position:relative;padding-right:38px}.dialog-heading h2{margin-top:12px;font-size:32px}.dialog-heading>.icon-button{position:absolute;right:-7px;top:-8px;background:#e3e9d7;color:#506b53}.dialog-heading .eyebrow{font-size:8px;letter-spacing:2px}
.settings-dialog{max-width:510px}.settings-heading{position:relative;padding-right:32px;margin-bottom:22px}.settings-heading h2{margin:10px 0 0;font-size:29px}.settings-heading>.icon-button{position:absolute;top:-12px;right:-12px;background:#e3e9d7;color:#506b53}
.rename-form{padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.rename-form label{font-weight:700;font-size:13px}.rename-form p{font-size:11px;color:#6c7c63;line-height:1.5;margin:8px 0 12px}.rename-row{display:flex;gap:8px}.rename-row input{width:0;flex:1;min-width:0;border:1px solid #bcc7ac;border-radius:10px;background:#fffdf5;padding:12px;color:var(--ink);font-size:14px}.rename-row button{display:flex;align-items:center;gap:7px;padding:12px;font-size:12px}.rename-row .ui-icon{width:17px;height:17px}.rename-form #rename-status{margin-bottom:0;color:#3c7051;min-height:16px}.settings-section h3{font-size:22px;margin:21px 0 10px}.settings-section p{font-size:12px;color:#6c7c63}.settings-section button{width:100%;margin-top:8px;min-height:44px}.settings-footnote{font-size:10px;color:#7a876f;line-height:1.7;margin-top:24px}
#toast{bottom:105px;background:#173d32f5;border-color:#bfc695;max-width:min(450px,90vw);font-size:12px;text-align:center;z-index:40}
@media(max-width:1150px) and (min-width:901px){.brand{min-width:205px;max-width:260px}.brand b{font-size:19px}.tribe-avatar{width:47px;height:53px}.resource{min-width:90px;padding:10px;gap:7px}.resource-icon{width:25px;height:25px}.topbar{gap:14px;padding:12px 18px}.scene-title{max-width:240px}.scene-title h2{font-size:23px}.activity-tray{gap:5px}.activity-tray button{min-width:94px;padding:10px 8px;gap:6px}.activity-tray b{font-size:10px}.activity-tray .ui-icon{width:18px}.panel-open .activity-tray{right:346px}.sidebar{right:16px;width:295px}.panel-open .village-board{right:325px}.version-mark{font-size:7px;letter-spacing:1px}.tabs button{min-width:95px;padding:12px}.quests{width:235px}.plot{width:84px;height:85px}.plot .name{font-size:9px;padding:4px 6px}}
@media(max-width:900px){
 .topbar{height:112px;flex-wrap:wrap;justify-content:space-between;padding:9px 14px;gap:6px}.brand{max-width:calc(100% - 55px);min-width:0;flex:1;gap:10px}.brand b{font-size:19px}.brand small{font-size:7px;letter-spacing:1.5px}.tribe-avatar{width:39px;height:43px;border-radius:12px}.tribe-avatar svg{width:42px;height:47px}.tribe-level{font-size:8px;margin-top:0}.topbar>.icon-button{width:38px;height:38px;padding:8px}
 .resources{order:3;flex-basis:100%;gap:6px}.resource{min-width:0;max-width:none;padding:5px 8px;gap:7px;border-radius:9px}.resource-icon{width:24px;height:24px}.resource small{font-size:8px;margin:0}.resource strong{font-size:14px;line-height:1.2}.main{flex-direction:row}
 .scene-title{top:12px;left:12px;padding:10px 13px;max-width:calc(100% - 24px);border-radius:11px}.scene-title .eyebrow{font-size:6px;letter-spacing:1.4px;margin-bottom:3px}.scene-title h2{font-size:21px;margin-bottom:3px}.scene-title small{font-size:8px}.activity-tray,.panel-open .activity-tray{left:12px;right:12px;top:98px;justify-content:flex-start;gap:5px}.activity-tray button{padding:7px 9px;min-width:0;flex:1;max-width:150px;gap:6px;border-radius:9px}.activity-tray .ui-icon{width:17px;height:17px}.activity-tray small{font-size:7px;margin-bottom:2px}.activity-tray b{font-size:9px}
 .village-board,.panel-open .village-board{inset:110px 5px 62px}.village{background-position:50% 50%}.plot{width:80px;height:82px}.plot .name{font-size:9px;padding:3px 5px;max-width:100px;min-width:50px;white-space:normal;bottom:-8px;line-height:1.15}.plot .badge{width:20px;height:20px;font-size:9px;right:0;top:0}.plot .collect{font-size:9px;padding:4px 7px;top:3px}.plot.is-locked .name{font-size:8px}.troops{bottom:7%;left:46%}.troops svg{width:23px;height:33px}
 .sidebar{inset:auto 12px 12px;width:auto;height:auto;max-height:min(48dvh,440px);padding:12px 18px 18px;border-radius:17px;box-shadow:0 -4px 32px #17382a55;z-index:7}.sidebar .building-preview{display:none}.inspector-top{margin-bottom:10px;padding-bottom:5px}.sidebar h2{font-size:25px;margin-bottom:9px}.sidebar>p{font-size:12px;margin:8px 0}.sidebar .stat{padding:8px 0}.sidebar .costs{margin:12px 0}.sidebar button{min-height:44px}.sidebar .pill{margin-bottom:9px}.sidebar .inspector-top .icon-button{min-height:34px}.sidebar section h3{margin-top:15px}
 .inspect-toggle{top:auto;left:12px;right:auto;bottom:14px;font-size:10px;padding:10px 12px;min-height:42px;border-radius:11px}.inspect-toggle .ui-icon{transform:rotate(-90deg)}.quests{display:none}.bottom{height:78px;padding:6px 68px 6px 8px;padding-bottom:max(6px,env(safe-area-inset-bottom));border-top-color:#c7b07455}.tabs{position:static;transform:none;border:0;background:none;width:100%;gap:2px;padding:0;justify-content:space-around}.bottom .tabs button{flex:1;min-width:0;min-height:56px;padding:7px 3px;gap:5px;flex-direction:column;font-size:9px;border-radius:10px}.tabs button .ui-icon{width:21px;height:21px}.tabs em{top:2px;right:7px;font-size:7px}.version-mark,.save-status{display:none}.save-status.is-offline{display:block;position:fixed;top:118px;bottom:auto;left:12px;right:12px;border:1px solid #d9ad65;background:#3a4632ed;padding:9px;border-radius:8px;font-size:10px;z-index:20}
 .chat-widget{bottom:max(11px,env(safe-area-inset-bottom));right:9px}.chat-toggle{min-height:56px;width:53px;border:0;padding:7px 3px;flex-direction:column;gap:5px;font-size:9px;background:none;border-radius:10px;color:#c4d3b5;font-weight:600}.chat-toggle .ui-icon{width:21px;height:21px}.chat-toggle[aria-expanded=true]{background:#ffffff12}.chat-panel{position:fixed;bottom:88px;right:8px;width:min(380px,calc(100vw - 16px));height:420px;max-height:calc(100dvh - 115px)}
 .map-tools{bottom:14px;left:auto;right:12px;gap:5px}.map-tools button{min-height:42px;padding:9px 11px;font-size:11px}.map-tools .ui-icon{width:16px}.world .inspect-toggle{left:12px;right:auto}.research-dialog{padding:22px}.research-dialog>h2,.reports-dialog>h2{font-size:28px}.research-grid{grid-template-columns:1fr 1fr}.settings-dialog{padding:24px}.settings-heading h2{font-size:26px}
}
@media(max-width:500px){.resource{gap:5px;padding:5px 6px}.resource-icon{width:22px;height:22px}.resource strong{font-size:13px}.plot{width:64px;height:67px}.plot .name{font-size:8px;max-width:85px}.activity-tray button{gap:5px;padding:7px}.activity-tray b{font-size:8px}.activity-tray .ui-icon{width:16px}.village-board,.panel-open .village-board{inset:119px 0 55px}.research-grid{grid-template-columns:1fr}.army-choice input{width:72px}.settings-heading h2{font-size:24px}.rename-row input{font-size:13px}.battle-table{font-size:9px}}
@media(max-height:700px) and (max-width:900px){.village-board,.panel-open .village-board{top:92px;bottom:32px}.activity-tray,.panel-open .activity-tray{top:82px}.scene-title{padding:7px 11px}.scene-title .eyebrow{display:none}.plot{width:58px;height:60px}.plot .name{font-size:7px}.troops{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}