:root{--ui-bg: rgba(22, 26, 34, .92);--ui-bg-solid: #1b202a;--ui-border: rgba(255, 255, 255, .12);--ui-text: #e8e6df;--ui-text-dim: #9aa0ab;--ui-accent: #d8a548;--ui-danger: #d4574e;--ui-ok: #5fbf6a;--radius: 12px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#141821;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ui-text);overscroll-behavior:none}#game-root canvas{position:fixed;inset:0;display:block;touch-action:none;user-select:none;-webkit-user-select:none}#ui-root{position:fixed;inset:0;pointer-events:none;z-index:10}#ui-root>*{pointer-events:auto}button{font:inherit;color:inherit;border:1px solid var(--ui-border);background:#ffffff14;border-radius:8px;padding:10px 14px;cursor:pointer}button:active{background:#ffffff2e}.hud{position:absolute;top:var(--safe-top);left:0;right:0;display:flex;align-items:center;gap:6px;padding:8px 10px;background:linear-gradient(#0a0c10d9,#0a0c1066);overflow-x:auto;scrollbar-width:none}.hud::-webkit-scrollbar{display:none}.hud-chip{display:flex;align-items:center;gap:5px;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:999px;padding:4px 10px;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap;flex:0 0 auto}.hud-chip .value{min-width:2ch;text-align:right}@keyframes hud-pulse{0%{transform:scale(1)}35%{transform:scale(1.18);background:#d8a54859}to{transform:scale(1)}}.hud-chip.pulse{animation:hud-pulse .4s ease-out}.hud-spacer{flex:1 1 auto}.hud .pause-btn{flex:0 0 auto;padding:4px 12px;font-size:16px;border-radius:999px}.build-sheet{position:absolute;left:0;right:0;bottom:0;background:var(--ui-bg-solid);border-top:1px solid var(--ui-border);border-radius:16px 16px 0 0;transform:translateY(calc(100% - 46px));transition:transform .25s ease;padding-bottom:var(--safe-bottom);max-height:60vh;display:flex;flex-direction:column}.build-sheet.open{transform:translateY(0)}.build-sheet-handle{flex:0 0 auto;height:46px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-weight:600;user-select:none;-webkit-user-select:none}.build-sheet-handle:before{content:"";width:36px;height:4px;border-radius:2px;background:var(--ui-text-dim)}.build-content{overflow-y:auto;padding-bottom:14px}.build-section-title{padding:8px 12px 4px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ui-text-dim)}.build-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;padding:4px 10px 0}.build-card{text-align:left;display:flex;flex-direction:column;gap:4px;padding:10px;border-radius:var(--radius)}.build-card .title{font-weight:600;font-size:14px}.build-card .meta{font-size:12px;color:var(--ui-text-dim)}.build-card .cost{font-size:13px}.build-card.unaffordable .cost{color:var(--ui-danger)}.build-actions{position:absolute;left:50%;bottom:calc(60px + var(--safe-bottom));transform:translate(-50%);display:flex;gap:8px;align-items:center;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:999px;padding:8px 10px}.build-actions[hidden]{display:none}.build-actions .label{font-size:14px;padding:0 6px;white-space:nowrap}.build-actions .cancel{border-color:var(--ui-danger)}.info-panel{position:absolute;left:10px;right:10px;bottom:calc(56px + var(--safe-bottom));margin:0 auto;max-width:420px;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:var(--radius);padding:12px 14px}.info-panel h3{margin:0 0 4px;font-size:16px}.info-panel .desc{margin:0 0 8px;font-size:13px;color:var(--ui-text-dim)}.info-panel .stats{font-size:13px;display:flex;flex-direction:column;gap:3px;margin-bottom:10px;font-variant-numeric:tabular-nums}.info-panel .row{display:flex;gap:8px}.info-panel .progress{height:6px;border-radius:3px;background:#ffffff1f;overflow:hidden;flex:1;align-self:center}.info-panel .progress>div{height:100%;background:var(--ui-accent)}.info-panel .buttons{display:flex;gap:8px;justify-content:flex-end}.info-panel .demolish{border-color:var(--ui-danger);color:#ff9d96}.tutorial-banner{position:absolute;top:calc(52px + var(--safe-top));left:50%;transform:translate(-50%);max-width:min(92vw,480px);display:flex;align-items:center;gap:8px;background:var(--ui-bg);border:1px solid rgba(216,165,72,.5);border-radius:999px;padding:7px 8px 7px 14px;font-size:13px}.tutorial-banner[hidden]{display:none}.tutorial-skip{padding:2px 9px;border-radius:999px;font-size:12px}.build-card.researched{opacity:.55}.build-card:disabled{cursor:default}.staff-row{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:14px}.staff-row[hidden]{display:none}.staff-row span{flex:1}.staff-btn{padding:4px 14px;font-size:16px;border-radius:999px}.staff-btn:disabled{opacity:.4}.toast{position:absolute;left:50%;top:calc(98px + var(--safe-top));transform:translate(-50%);background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:999px;padding:9px 18px;font-size:14px;opacity:0;transition:opacity .2s ease;pointer-events:none!important;white-space:nowrap}.toast.visible{opacity:1}.pause-overlay{position:absolute;inset:0;background:#080a0eb3;display:flex;align-items:center;justify-content:center}.pause-overlay[hidden]{display:none}.pause-card{background:var(--ui-bg-solid);border:1px solid var(--ui-border);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:10px;min-width:240px;text-align:center}.pause-card h2{margin:0 0 6px}.pause-card .danger{border-color:var(--ui-danger);color:#ff9d96}.scenario-row{display:flex;flex-wrap:wrap;gap:8px;max-width:min(92vw,380px)}.scenario-row .scenario-btn{flex:1 1 40%}.scenario-row[hidden]{display:none}.scenario-btn{flex:1;display:flex;flex-direction:column;gap:4px;padding:8px 6px;font-size:13px}.scenario-desc{font-size:11px;color:var(--ui-text-dim)}.gameover-stats{margin:0 0 10px;color:var(--ui-text-dim);font-size:14px}.score-list{margin:0 0 12px;padding-left:22px;text-align:left;font-size:13px;color:var(--ui-text-dim)}.score-list li:first-child{color:var(--ui-accent)}.main-menu{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:calc(20px + var(--safe-top)) 16px calc(20px + var(--safe-bottom));background:radial-gradient(ellipse at 50% -10%,rgba(216,165,72,.18),transparent 55%),linear-gradient(180deg,#0a0d14e0,#0d111af0 60%,#080a0ff7);text-align:center}.main-menu[hidden]{display:none}.menu-hero{display:flex;flex-direction:column;align-items:center;gap:2px}.menu-crest{font-size:64px;line-height:1;filter:drop-shadow(0 6px 18px rgba(216,165,72,.35));animation:crest-bob 4s ease-in-out infinite}@keyframes crest-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.menu-title{margin:8px 0 0;font-size:42px;letter-spacing:2px;color:var(--ui-accent);text-shadow:0 2px 16px rgba(216,165,72,.35)}.menu-tagline{margin:4px 0 0;font-size:14px;color:var(--ui-text-dim)}.menu-buttons{display:flex;flex-direction:column;gap:10px;width:min(86vw,300px)}.menu-btn{width:100%;padding:13px 16px;font-size:16px;background:#ffffff12;border:1px solid var(--ui-border)}.menu-btn-primary{background:#d8a5482e;border-color:var(--ui-accent);color:var(--ui-accent);font-weight:700}.menu-footer{position:absolute;bottom:calc(10px + var(--safe-bottom));font-size:11px;color:var(--ui-text-dim);opacity:.7}.menu-dialog{z-index:30}.build-card.locked{opacity:.45}.relation-bar{height:7px;border-radius:4px;background:#ffffff14;overflow:hidden;margin:3px 0 4px}.relation-bar div{height:100%;background:#c9b46a;border-radius:4px}.relation-bar div.good{background:var(--ui-ok)}.relation-bar div.war{background:var(--ui-danger)}.diplomacy-desc{color:var(--ui-text-dim);font-size:12px}.online-form{display:flex;flex-direction:column;gap:8px}.online-form input{font:inherit;color:var(--ui-text);background:#ffffff0f;border:1px solid var(--ui-border);border-radius:8px;padding:10px 12px}.online-form input:focus{outline:none;border-color:var(--ui-accent)}.online-msg{min-height:18px}.online-error{color:#ff9d96}.menu-scores{text-align:left;font-size:13px;min-width:240px;margin-bottom:8px}.menu-scores-section{margin-top:10px;font-weight:700;color:var(--ui-accent)}.menu-scores-row{padding:2px 0;color:var(--ui-text)}.main-title{margin:0 0 2px;font-size:30px}.stats-panel{position:absolute;top:calc(56px + var(--safe-top));right:10px;width:min(86vw,320px);max-height:calc(100vh - 140px);overflow-y:auto;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:var(--radius);padding:12px 14px;font-size:13px}.stats-panel h3{margin:0 0 6px}.stats-panel .row{padding:1.5px 0;font-variant-numeric:tabular-nums}.stats-panel .stats-section{margin-top:8px;font-weight:700;color:var(--ui-accent)}.stats-panel button{margin-top:10px;width:100%}.market-row{display:flex;align-items:center;gap:6px}.market-label{min-width:48px;font-variant-numeric:tabular-nums}.market-panel .market-row button{margin-top:0;width:auto;flex:1;padding:6px 4px;font-size:12px}.market-panel .market-row button.researched{border-color:var(--ui-accent);color:var(--ui-accent)}.duel-card{max-width:min(92vw,420px);text-align:left}.duel-label{font-size:13px;color:var(--ui-text-dim);margin-top:4px}.duel-army{color:var(--ui-accent)}.duel-code{width:100%;resize:none;font:11px/1.4 ui-monospace,monospace;color:var(--ui-text);background:#00000059;border:1px solid var(--ui-border);border-radius:8px;padding:6px 8px;word-break:break-all}.duel-hud{position:absolute;top:calc(52px + var(--safe-top));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;background:var(--ui-bg);border:1px solid var(--ui-danger);border-radius:999px;padding:7px 8px 7px 14px;font-size:13px;white-space:nowrap}.duel-hud[hidden]{display:none}.pause-card .market-row button{flex:1;padding:7px 4px;font-size:12px}.pause-card .market-row button.researched{border-color:var(--ui-accent);color:var(--ui-accent)}.duel-deploy{position:absolute;bottom:calc(56px + var(--safe-bottom));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:var(--radius);padding:8px 10px}.duel-deploy[hidden]{display:none}.duel-card-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 10px;font-size:13px}.duel-card-btn.selected{border-color:var(--ui-accent);color:var(--ui-accent)}.duel-card-btn.unaffordable{opacity:.45}.ad-overlay{position:absolute;inset:0;background:#050608eb;display:flex;align-items:center;justify-content:center;z-index:50}.ad-box{text-align:center;color:var(--ui-text-dim);font-size:15px}.ad-count{font-size:48px;font-weight:700;color:var(--ui-text);margin-top:12px}.fatal-error{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:#e8e6df;background:#141821;z-index:100}
