*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#060a0f;--bg2:#0b1018;--bg3:#111820;
  --bo:#1b2840;--bo2:#253450;
  --gold:#c89820;--g2:#e8c050;--gd:#8a6810;
  --tx:#d0c498;--t2:#988860;--t3:#5a5040;
  --red:#ef4444;--grn:#22c55e;--coin:#fbbf24;
  --hd:'Cinzel',serif;--bd:'Crimson Pro',Georgia,serif;
  --lh:44px;
  --ui-scale:1; /* [v0.00119] масштаб интерфейса, задаётся в Настройках */
}
/* [v0.00120] Масштаб через CSS zoom на корне — ведёт себя как браузерный Ctrl+ :
   масштабирует ВЕСЬ интерфейс пропорционально (позиции/размеры/текст), 100vh остаётся
   во весь экран, раскладка не «слезает». font-size-подход ломал фикс-layout. */
html{zoom:var(--ui-scale,1)}
/* [v0.00122] Плавный переход цвета провинций/стран при смене владельца (захваты «перетекают»,
   а не дёргаются) — даёт ощущение движения фронта в течение дня. */
path.c,path.mapv2-province{transition:fill .7s ease}
html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--tx);font-family:var(--bd);-webkit-font-smoothing:antialiased}
::-webkit-scrollbar{width:3px}::-webkit-scrollbar-thumb{background:var(--bo2);border-radius:2px}
.scr{display:none;width:100%;height:100vh;flex-direction:column}
.scr.on{display:flex}
#sg{display:none;position:fixed;inset:0}
#sg.on{display:block}

/* WELCOME */
#sw{align-items:center;justify-content:center;overflow-y:auto;padding:2rem 1.2rem;
  background:radial-gradient(ellipse 80% 50% at 50% 30%,rgba(100,65,10,.35),transparent 70%),var(--bg)}
.wb{max-width:380px;width:100%;text-align:center}
.wlogo{font-family:var(--hd);font-size:clamp(2rem,9vw,3rem);font-weight:700;color:var(--gold);letter-spacing:.16em;text-shadow:0 0 60px rgba(200,150,30,.4);margin-bottom:.2rem}
.wsub{color:var(--t2);font-size:.8rem;letter-spacing:.28em;text-transform:uppercase;margin-bottom:1.5rem}
.wbonus{background:linear-gradient(155deg,rgba(200,150,30,.15),rgba(100,65,10,.1));border:1px solid var(--gd);border-radius:8px;padding:.85rem;margin-bottom:1.3rem}
.wbonus h3{font-family:var(--hd);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:.35rem}
.wbonus-c{font-family:var(--hd);font-size:1.9rem;color:var(--coin);font-weight:700}
.wbonus p{font-size:.75rem;color:var(--t2);margin-top:.1rem}
.win{width:100%;background:var(--bg3);border:1px solid var(--bo);border-radius:4px;padding:.6rem .9rem;
  color:var(--tx);font-family:var(--bd);font-size:.95rem;outline:none;margin-bottom:.6rem;text-align:center}
.win:focus{border-color:var(--gd)}
.win::placeholder{color:var(--t3);font-style:italic}
.wbtn{width:100%;background:linear-gradient(155deg,#8a6810,#c89820);border:none;border-radius:4px;
  color:#0b1018;font-family:var(--hd);font-size:.78rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:.62rem;cursor:pointer}
.wbtn:active{opacity:.85}
.wskip{margin-top:.65rem;background:none;border:none;color:var(--t3);font-size:.72rem;cursor:pointer;text-decoration:underline;display:block;margin-left:auto;margin-right:auto}
/* [v0.00106] Welcome auth buttons — readable text on solid backgrounds (was dark text on dark translucent → unreadable) */
#w-reg{background:linear-gradient(155deg,#15803d,#2bd06a)!important;border:none!important;color:#04140a!important;text-shadow:0 1px 0 rgba(255,255,255,.18)}
#w-google{background:#ffffff!important;border:1px solid #dadce0!important;color:#1f1f1f!important;display:flex;align-items:center;justify-content:center;gap:.5rem}
#w-google::before{content:"G";font-family:var(--hd);font-weight:700;color:#4285f4;font-size:1rem;line-height:1}
#w-reg:hover,#w-google:hover{filter:brightness(1.06)}
#w-forgot{color:var(--t2)!important}
#w-forgot:hover{color:var(--g2)!important}
/* [v0.00106] In-page auth modal — replaces native prompt() (which closes on tab/window blur, breaking email-code entry) */
.hw-modal-ov{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  background:rgba(4,6,10,.78);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .18s ease;padding:1rem}
.hw-modal-ov.on{opacity:1}
.hw-modal{width:100%;max-width:360px;background:linear-gradient(160deg,var(--bg2),var(--bg3));
  border:1px solid var(--gd);border-radius:12px;padding:1.4rem 1.3rem 1.2rem;
  box-shadow:0 24px 70px rgba(0,0,0,.6),0 0 60px rgba(200,150,30,.12);
  transform:translateY(10px) scale(.98);transition:transform .18s ease}
.hw-modal-ov.on .hw-modal{transform:none}
.hw-modal-h{font-family:var(--hd);font-size:1.05rem;font-weight:700;color:var(--gold);letter-spacing:.04em;text-align:center;margin-bottom:.5rem}
.hw-modal-d{font-size:.82rem;color:var(--tx);text-align:center;line-height:1.5;margin-bottom:1rem}
.hw-modal-lbl{display:block;margin-bottom:.7rem;text-align:left}
.hw-modal-lbl span{display:block;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--t2);margin-bottom:.3rem}
.hw-modal-in{width:100%;background:var(--bg);border:1px solid var(--bo);border-radius:6px;padding:.7rem .8rem;
  color:var(--tx);font-family:var(--bd);font-size:1rem;outline:none;text-align:center;letter-spacing:.05em;box-sizing:border-box}
.hw-modal-in:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(200,150,30,.15)}
.hw-modal-in::placeholder{color:var(--t3);letter-spacing:.3em}
.hw-modal-note{font-size:.72rem;color:var(--g2);background:rgba(200,150,30,.08);border:1px solid rgba(200,150,30,.2);
  border-radius:6px;padding:.5rem .6rem;text-align:center;margin-bottom:.7rem}
.hw-modal-btns{display:flex;gap:.6rem;margin-top:.4rem}
.hw-modal-btn{flex:1;border-radius:6px;padding:.66rem;font-family:var(--hd);font-size:.74rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border:1px solid transparent;transition:filter .12s,color .12s,border-color .12s}
.hw-modal-cancel{background:transparent;border-color:var(--bo);color:var(--t2)}
.hw-modal-cancel:hover{color:var(--tx);border-color:var(--gd)}
.hw-modal-ok{background:linear-gradient(155deg,#8a6810,#c89820);color:#0b1018}
.hw-modal-ok:hover{filter:brightness(1.08)}

/* MENU */
#sm{overflow-y:auto;align-items:center;padding:1rem 1.2rem 3rem;
  background:radial-gradient(ellipse 90% 45% at 50% 0%,rgba(100,65,10,.3),transparent 70%),var(--bg)}
.mtop{width:100%;max-width:920px;display:flex;justify-content:space-between;align-items:center;margin-bottom:.55rem}
.ugreet{font-size:.76rem;color:var(--t2)}
.ugreet b{color:var(--gold)}
.cpill{display:flex;align-items:center;gap:.35rem;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.35);
  border-radius:20px;padding:.26rem .65rem;cursor:pointer;font-family:var(--hd);font-size:.8rem;color:var(--coin)}
.mlogo{font-family:var(--hd);font-size:clamp(2.5rem,10vw,5rem);font-weight:700;color:var(--gold);letter-spacing:.18em;text-align:center;
  text-shadow:0 0 60px rgba(200,150,30,.4);margin-bottom:.2rem;margin-top:.5rem}
.mtag{font-size:.72rem;color:var(--t2);letter-spacing:.3em;text-transform:uppercase;text-align:center;margin-bottom:.45rem}
.mdiv{width:160px;height:1px;background:linear-gradient(90deg,transparent,var(--gd),transparent);margin:.7rem auto 1.2rem}
.cont-banner{width:100%;max-width:920px;background:linear-gradient(155deg,rgba(200,150,30,.12),rgba(100,65,10,.08));
  border:1px solid var(--gd);border-radius:6px;padding:.75rem 1rem;margin-bottom:1rem;
  display:none;align-items:center;gap:.75rem}
.cont-banner.show{display:flex}
.sgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:.8rem;width:100%;max-width:920px}
.scard{border:1px solid var(--bo);border-radius:4px;padding:1.2rem 1.1rem;cursor:pointer;
  background:linear-gradient(155deg,rgba(18,26,38,.9),rgba(8,12,18,.95));
  text-align:left;color:var(--tx);font-family:var(--bd);appearance:none;position:relative;overflow:hidden}
.scard.lock{opacity:.38;filter:grayscale(.6)}
.lbadge{position:absolute;top:.5rem;right:.6rem;background:rgba(255,255,255,.05);border:1px solid var(--bo);
  border-radius:12px;padding:.1rem .42rem;font-family:var(--hd);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--t3)}
.si{font-size:1.65rem;margin-bottom:.5rem;display:block}
.sy{font-size:.6rem;color:var(--t3);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.25rem;font-family:var(--hd)}
.sn{font-family:var(--hd);font-size:.84rem;color:var(--g2);letter-spacing:.07em;margin-bottom:.42rem}
.sd{font-size:.8rem;color:var(--t2);line-height:1.5}
.aisec{width:100%;max-width:920px;margin-top:1.2rem}
.aisec h4{font-family:var(--hd);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--t3);margin-bottom:.6rem;text-align:center}
.airow{display:flex;flex-wrap:wrap;gap:.38rem;justify-content:center;margin-bottom:.45rem}
.aichip{border:1px solid var(--bo);border-radius:20px;padding:.26rem .72rem;cursor:pointer;background:var(--bg2);
  font-family:var(--hd);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--t2)}
.aichip.on{border-color:var(--gd);background:rgba(200,150,30,.15);color:var(--g2)}
.aihint{font-size:.68rem;color:var(--t3);text-align:center}

/* PICK */
#sp{overflow-y:auto;align-items:center;padding:1.2rem 1.2rem 3rem;background:var(--bg)}
.ph{font-family:var(--hd);font-size:1.3rem;color:var(--gold);letter-spacing:.1em;margin-bottom:.25rem;text-align:center}
.ps{color:var(--t2);font-size:.82rem;text-align:center;margin-bottom:.25rem}
.psc{font-family:var(--hd);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--t3);text-align:center;margin-bottom:1.2rem}
.psech{font-family:var(--hd);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gd);margin:.8rem 0 .42rem;width:100%;max-width:820px}
.nsrch{background:var(--bg3);border:1px solid var(--bo);border-radius:4px;padding:.4rem .68rem;color:var(--tx);
  font-family:var(--bd);font-size:.88rem;outline:none;width:100%;max-width:820px;margin-bottom:.65rem}
.nsrch:focus{border-color:var(--gd)}
.nsrch::placeholder{color:var(--t3);font-style:italic}
.ng{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:.55rem;width:100%;max-width:820px}
.nb{border:1px solid var(--bo);border-radius:4px;padding:.9rem .82rem;cursor:pointer;background:var(--bg2);text-align:left;color:var(--tx);font-family:var(--bd);appearance:none}
.nb.hi{border-color:rgba(200,150,30,.3)}
.nn{font-family:var(--hd);font-size:.74rem;letter-spacing:.06em;margin-bottom:.45rem;display:flex;align-items:center;gap:5px}
.nbs{display:flex;flex-direction:column;gap:3px}
.nbr{display:flex;align-items:center;gap:4px;font-size:.62rem;color:var(--t3)}
.nbl{width:46px;text-transform:uppercase;letter-spacing:.05rem;font-size:.57rem}
.nbt{flex:1;height:3px;background:var(--bo);border-radius:2px;overflow:hidden}
.nbf{height:100%;border-radius:2px}
.bbtn{margin-top:1.2rem;background:none;border:1px solid var(--bo);border-radius:4px;color:var(--t3);
  font-family:var(--hd);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:.27rem .55rem;cursor:pointer}

/* GAME HEADER */
#gmap{position:absolute;inset:0;overflow:hidden;cursor:grab;background:#050c14;touch-action:none;-webkit-user-select:none;user-select:none}
#gmap:active{cursor:grabbing}
#gmap svg{width:100%;height:100%;display:block}
.gh{position:absolute;top:0;left:0;right:0;min-height:46px;z-index:50;
  background:linear-gradient(180deg,rgba(8,11,17,.97),rgba(6,9,14,.93));backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(200,150,30,.18);box-shadow:0 2px 14px rgba(0,0,0,.45);
  display:flex;flex-direction:column;gap:0;padding:0}
.gh-flag{font-size:1rem;flex-shrink:0}
.gh-name{font-family:var(--hd);font-size:.72rem;letter-spacing:.05em;flex-shrink:0;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.1}
.gh-date{font-family:var(--hd);font-size:.8rem;color:var(--tx);letter-spacing:.1em;text-align:center}
.ghcoins{display:flex;align-items:center;gap:.28rem;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.3);
  border-radius:14px;padding:.14rem .48rem;cursor:pointer;font-family:var(--hd);font-size:.67rem;color:var(--coin);flex-shrink:0}
.hbtn{background:rgba(11,16,24,.7);border:1px solid var(--bo);border-radius:4px;color:var(--t2);
  font-size:.6rem;padding:.2rem .38rem;cursor:pointer;font-family:var(--hd);letter-spacing:.07em;text-transform:uppercase;flex-shrink:0;white-space:nowrap}
.hbtn:active{opacity:.75}
.tjbtn-h{background:rgba(200,150,30,.12);border:1px solid var(--gd);border-radius:4px;color:var(--gold);
  font-family:var(--hd);font-size:.65rem;letter-spacing:.1em;padding:.2rem .5rem;cursor:pointer;flex-shrink:0;white-space:nowrap}
/* ════ v0.00066 Command-Center HUD (desktop) ════ */
.gh-row{display:flex;align-items:center;gap:.3rem;padding:0 .6rem;min-width:0}
.gh-row1{height:42px}
.gh-row2{height:26px;border-top:1px solid rgba(27,40,64,.5);gap:.26rem;overflow:hidden;background:rgba(0,0,0,.2)}
.gh-player-block{display:flex;align-items:center;gap:.36rem;flex-shrink:0;cursor:pointer;max-width:210px}
.gh-player-block:hover{filter:brightness(1.12)}
.gh-id{display:flex;flex-direction:column;line-height:1.04;min-width:0}
.gh-status{font-size:.46rem;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
.gh-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.04rem;min-width:0}
.gh-clock{display:flex;align-items:center;gap:.45rem}
.gh-speed{display:flex;align-items:center;gap:.16rem}
.gh-right{display:flex;align-items:center;gap:.28rem;flex-shrink:0;margin-left:auto}
.gh-res{display:flex;align-items:center;gap:.12rem}
.gh-metric{display:flex;align-items:center;gap:.18rem;font-size:.62rem;color:var(--tx);font-family:var(--hd);
  background:rgba(11,16,24,.6);border:1px solid rgba(27,40,64,.6);border-radius:6px;padding:.13rem .34rem;cursor:pointer;white-space:nowrap}
.gh-metric:hover{border-color:rgba(200,150,30,.5);color:var(--g2)}
.gh-metric-ic{font-size:.64rem;opacity:.92}
.gh-chip{display:flex;align-items:center;gap:.2rem;padding:.14rem .36rem;border-radius:6px;
  border:1px solid rgba(27,40,64,.6);background:rgba(11,16,24,.6);font-size:.6rem;color:var(--t2);cursor:pointer;white-space:nowrap;font-family:var(--hd)}
.gh-chip:hover{border-color:rgba(200,150,30,.45)}
.gh-chip-war{border-color:rgba(239,68,68,.55);background:rgba(239,68,68,.13);color:#fca5a5}
.gh-chip-war{animation:ghpulse 2.2s ease-in-out infinite}
@keyframes ghpulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.45)}50%{box-shadow:0 0 0 3px rgba(239,68,68,0)}}
.gh-tools{display:flex;align-items:center;gap:.13rem}
.gh-kpi{display:flex;align-items:center;gap:.24rem;padding:.06rem .42rem;border-radius:5px;
  background:rgba(255,255,255,.03);border:1px solid rgba(27,40,64,.5);cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .12s,border-color .12s}
.gh-kpi:hover{background:rgba(255,255,255,.07);border-color:rgba(200,150,30,.4)}
.gh-kpi-ic{font-size:.62rem;line-height:1}
.gh-kpi-lb{font-size:.5rem;letter-spacing:.04em;color:var(--t3);text-transform:uppercase}
.gh-kpi-v{font-size:.62rem;font-weight:700;font-family:var(--hd);color:var(--tx)}
.gh-kpi.ok .gh-kpi-v{color:#22c55e}
.gh-kpi.warn{border-color:rgba(245,158,11,.42)}
.gh-kpi.warn .gh-kpi-v{color:#f59e0b}
.gh-kpi.bad{border-color:rgba(239,68,68,.5)}
.gh-kpi.bad .gh-kpi-v{color:#ef4444}
.gh-kpi.info .gh-kpi-v{color:#38bdf8}
.gh-kpi-tut{margin-left:auto;border-style:dashed;opacity:.85}
.gh-speed .tjbtn-h{padding:.16rem .36rem;font-size:.6rem;letter-spacing:.06em}
.gh-spd{min-width:1.9rem;text-align:center}
.gh-play{font-weight:700}


.mobile-hud{display:none;position:fixed;top:0;left:0;right:0;z-index:70;flex-direction:column;gap:.1rem;padding:calc(.1rem + env(safe-area-inset-top,2px)) .4rem .1rem;background:rgba(6,9,14,.96);backdrop-filter:blur(8px);border-bottom:1px solid rgba(27,40,64,.75)}
.mobile-hud-row{display:flex;align-items:center;justify-content:space-between;gap:.18rem}
.mobile-hud-left,.mobile-hud-right{display:flex;align-items:center;gap:.15rem;flex:1;min-width:0}
.mobile-hud-center{display:flex;flex-direction:row;align-items:center;gap:.18rem;flex:1;min-width:0}
.mobile-hud-text{display:flex;flex-direction:column;gap:.02rem;min-width:0}
.mobile-hud-title{font-family:var(--hd);font-size:.6rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.mobile-hud-sub{font-size:.5rem;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-hud-date{font-size:.56rem;color:var(--tx);letter-spacing:.04em}
.mobile-hud-actions{display:flex;gap:.1rem}
.mobile-hud-btn{min-width:26px;min-height:26px;border:none;border-radius:7px;background:rgba(255,255,255,.08);color:var(--tx);font-size:.76rem;display:flex;align-items:center;justify-content:center;cursor:pointer}
.mobile-hud-btn:active{opacity:.8}
.mobile-hud-pill{flex-shrink:0;display:inline-flex;align-items:center;gap:.12rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.1rem .28rem;font-size:.52rem;white-space:nowrap;color:var(--tx)}
.mobile-hud-scroll{display:flex;gap:.25rem;overflow-x:auto;padding-bottom:.05rem;-webkit-overflow-scrolling:touch}
.mobile-hud-scroll::-webkit-scrollbar{display:none}
/* HUD compact mode — collapses the resource pill row */
.mobile-hud-row-scroll{max-height:26px;opacity:1;overflow:hidden;transition:max-height .22s ease,opacity .18s ease}
.mobile-hud.compact .mobile-hud-row-scroll{max-height:0!important;opacity:0;overflow:hidden}
.mhud-compact-btn{background:none;border:none;color:var(--t3);font-size:.75rem;cursor:pointer;padding:.1rem .2rem;line-height:1;-webkit-tap-highlight-color:transparent;min-width:28px;min-height:32px;display:flex;align-items:center;justify-content:center}
.mobile-war-card{display:none;position:fixed;left:.6rem;right:.6rem;top:calc(52px + env(safe-area-inset-top,4px));z-index:69;border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;background:rgba(6,9,14,.96);box-shadow:0 18px 34px rgba(0,0,0,.35);transition:transform .28s ease,opacity .28s ease}
.mobile-war-card-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.85rem 1rem;background:rgba(255,255,255,.04);border:none;color:var(--tx);font-family:var(--hd);font-size:.88rem;cursor:pointer;text-align:left}
.mobile-war-card.collapsed .mobile-war-card-body{display:none}
.mobile-war-card-body{display:flex;flex-direction:column;gap:.35rem;padding:.85rem 1rem;font-size:.75rem;color:var(--t2)}
.mobile-war-card-toggle{font-size:.85rem;transform:rotate(0deg);transition:transform .28s ease}
.mobile-war-card.collapsed .mobile-war-card-toggle{transform:rotate(0deg)}
.mobile-war-card:not(.collapsed) .mobile-war-card-toggle{transform:rotate(180deg)}
.mobile-war-stat{display:flex;justify-content:space-between;gap:.2rem;padding:.32rem .45rem;background:rgba(255,255,255,.05);border-radius:12px}
.mobile-war-stat strong{color:var(--gold)}

/* MAP FILTER FAB */
.filter-fab{position:absolute;left:.6rem;bottom:calc(var(--lh) + 10px);z-index:49;display:none;flex-direction:column;gap:4px}
.flt-btn{width:38px;height:38px;border-radius:50%;background:rgba(10,16,24,.88);border:1px solid var(--bo);
  color:var(--t2);font-size:.95rem;cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 10px rgba(0,0,0,.4);line-height:1}
.flt-btn.on{border-color:var(--gold);background:rgba(200,150,30,.18);color:var(--gold)}

/* ZOOM */
.zoom-ctrl{position:absolute;right:.6rem;top:54px;z-index:48;display:flex;flex-direction:column;gap:2px}
.zbtn{width:36px;height:36px;background:rgba(10,16,24,.85);border:1px solid var(--bo);border-radius:3px;
  color:var(--t2);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.zbtn:active{opacity:.75}

/* LOG STRIP */
.evstrip{position:absolute;left:0;right:0;bottom:0;background:rgba(6,9,14,.96);border-top:1px solid var(--bo);z-index:48;overflow:hidden;transition:height .28s ease}
.evstrip.col{height:var(--lh)}
.evstrip.exp{height:200px}
.evstrip-head{height:var(--lh);display:flex;align-items:center;padding:0 .6rem;gap:.5rem;cursor:pointer;flex-shrink:0}
.evstrip-last{flex:1;font-size:.74rem;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic}
.evstrip-tog{font-size:.68rem;font-family:var(--hd);letter-spacing:.07em;color:var(--t3);flex-shrink:0}
.evstrip-body{height:156px;overflow-y:auto;padding:.28rem .6rem .4rem;display:flex;flex-direction:column;gap:.22rem}
.evl{padding:.22rem .45rem;border-radius:2px;border-left:2px solid;font-size:.73rem;line-height:1.42}
.evl h6{font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--hd);color:var(--t3);margin-bottom:1px}
.ev-nar{border-color:var(--gd);background:rgba(200,150,30,.04);color:var(--tx);font-style:italic}
.ev-ev{border-color:var(--bo);color:var(--t2)}
.ev-pl{border-color:rgba(59,130,246,.4);background:rgba(59,130,246,.04);color:#93c5fd}
.ev-sys{border-color:rgba(200,150,30,.3);background:rgba(200,150,30,.05);color:var(--tx)}
.ev-err{border-color:rgba(239,68,68,.3);color:#fca5a5}
.ev-news{border-color:rgba(180,140,50,.5);background:rgba(180,140,50,.07);color:var(--g2)}

.filter-fab{position:absolute;left:.6rem;bottom:calc(78px + env(safe-area-inset-bottom,10px));z-index:49;display:none;flex-direction:column;gap:4px}
@media (max-width: 900px){
  .gh{display:none}
  .mobile-hud{display:flex}
  .mobile-war-card{display:block}
  .zoom-ctrl{right:.5rem;top:auto;bottom:calc(112px + env(safe-area-inset-bottom,10px));}
  .filter-fab{left:.5rem;bottom:calc(76px + env(safe-area-inset-bottom,10px));}
  .gh-name{max-width:45px;font-size:.6rem}
  .gh-date{font-size:.6rem}
  .ghcoins{padding:.12rem .28rem;font-size:.58rem}
  .tjbtn-h{padding:.18rem .35rem;font-size:.58rem}
  .hbtn{padding:.2rem .26rem;font-size:.65rem}
  #wt-pill2{display:none!important}
  .war-badges{max-width:140px}
  .wbadge{font-size:.48rem;padding:.05rem .2rem}
  .panel{border-radius:0}
  .pnb{padding:.5rem .6rem}
  .nb{padding:.6rem .5rem}
  .mobile-hud-row{flex-wrap:nowrap;align-items:center}
  .mobile-hud-left{flex:1 1 auto;min-width:0}
  .mobile-hud-center{flex:0 0 auto;flex-direction:row;align-items:center}
  .mobile-hud-right{flex:0 0 auto;align-items:center}
  .mobile-hud-scroll{padding-bottom:.08rem}
  .mobile-war-card{left:.5rem;right:.5rem;top:calc(58px + env(safe-area-inset-top,4px));}
  .mobile-war-card-head{padding:.75rem .9rem}
  .mobile-war-card-body{padding:.75rem .9rem}
}
@media (max-width: 400px) {
  .gh-name{display:none}
}
.unread{position:absolute;top:-2px;right:-2px;background:#ef4444;border-radius:50%;width:14px;height:14px;font-size:.6rem;font-family:var(--hd);color:#fff;display:none;align-items:center;justify-content:center}
.unread.show{display:flex}

/* COUNTRY POPUP */
.cpop{position:fixed;top:52px;left:.4rem;width:min(360px,95vw);background:rgba(10,16,24,.97);backdrop-filter:blur(14px);
  border:1px solid var(--bo2);border-radius:8px;max-height:76vh;overflow:hidden;display:none;flex-direction:column;z-index:85}
.cpop.show{display:flex;animation:cpopIn .2s cubic-bezier(.4,0,.2,1)}
@keyframes cpopIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:640px){
  .cpop{top:auto;bottom:0;left:0;width:100%;max-width:100%;max-height:84vh;
    border-radius:14px 14px 0 0;border-left:none;border-right:none;border-bottom:none}
}
.cph{display:flex;align-items:center;justify-content:space-between;padding:.58rem .82rem;
  border-bottom:1px solid var(--bo);position:sticky;top:0;background:rgba(10,16,24,.97);z-index:1}
.cpb{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column}
.cph-l{display:flex;align-items:center;gap:.42rem}
.cph-flag{font-size:1.15rem}
.cph-name{font-family:var(--hd);font-size:.86rem;color:var(--g2);letter-spacing:.07em}
.cph-ctrl{font-size:.6rem;color:var(--gd);letter-spacing:.1em;text-transform:uppercase;font-family:var(--hd)}
.cpb{padding:.62rem .82rem;display:flex;flex-direction:column;gap:.5rem}
.csec{background:var(--bg3);border-radius:4px;padding:.48rem .62rem}
.csh{font-family:var(--hd);font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--t3);margin-bottom:.38rem}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:.25rem .42rem}
.ci{font-size:.74rem}
.cl{color:var(--t3);font-size:.58rem;text-transform:uppercase;letter-spacing:.06em;display:block}
.cv{color:var(--tx)}
.bar-row{display:flex;align-items:center;gap:.38rem;margin-bottom:.26rem}
.bar-lbl{font-size:.6rem;color:var(--t3);text-transform:uppercase;letter-spacing:.06em;width:76px;font-family:var(--hd)}
.bar-track{flex:1;height:5px;background:var(--bo);border-radius:3px;overflow:hidden}
.bar-fill{height:100%;border-radius:3px}
.miltabs{display:flex;gap:.28rem;margin-bottom:.38rem}
.miltab{background:var(--bo);border:none;border-radius:3px;color:var(--t2);font-family:var(--hd);font-size:.57rem;letter-spacing:.07em;text-transform:uppercase;padding:.2rem .48rem;cursor:pointer}
.miltab.on{background:var(--gd);color:var(--bg)}
.milrow{display:flex;align-items:center;justify-content:space-between;font-size:.74rem;padding:.17rem .3rem;background:rgba(27,40,64,.4);border-radius:3px;margin-bottom:2px}
.prov-list{display:flex;flex-direction:column;gap:.22rem;max-height:160px;overflow-y:auto}
.prov-item{display:flex;align-items:center;padding:.25rem .38rem;background:rgba(27,40,64,.3);border-radius:3px;cursor:pointer;gap:.3rem}
.prov-name{color:var(--tx);flex:1;font-size:.72rem}
.prov-occ{color:#ef4444;font-style:italic}
.prov-st{font-size:.6rem;color:var(--t2)}
.prov-ctrl-lbl{font-size:.6rem;color:var(--gd);font-family:var(--hd)}
.chat-btn-c{width:100%;margin-top:.25rem;padding:.44rem;background:linear-gradient(155deg,#8a6810,#c89820);
  border:none;border-radius:4px;color:#0b1018;font-family:var(--hd);font-size:.62rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;cursor:pointer}

/* PANELS */
.panel{position:absolute;left:0;right:0;bottom:0;overscroll-behavior:contain;background:rgba(10,16,24,.98);backdrop-filter:blur(14px);
  border-top:1px solid var(--bo2);border-radius:10px 10px 0 0;z-index:60;
  transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);max-height:78vh;display:flex;flex-direction:column}
.panel.open{transform:translateY(0)}
.pnh{display:flex;align-items:center;justify-content:space-between;padding:.62rem .9rem;border-bottom:1px solid var(--bo);flex-shrink:0}
.pnt{font-family:var(--hd);font-size:.82rem;color:var(--g2);letter-spacing:.08em}
.pnx{background:none;border:none;color:var(--t3);font-size:1.1rem;cursor:pointer;padding:.1rem .3rem}
.pnb{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:.68rem .9rem}
.srch-in{width:100%;background:var(--bg3);border:1px solid var(--bo);border-radius:4px;padding:.45rem .65rem;
  color:var(--tx);font-family:var(--bd);font-size:.86rem;outline:none;margin-bottom:.55rem}
.srch-in:focus{border-color:var(--gd)}
.srch-in::placeholder{color:var(--t3);font-style:italic}
.newbtn{width:100%;padding:.5rem;background:linear-gradient(155deg,#1a2840,#253450);border:1px solid var(--bo2);
  border-radius:4px;color:var(--tx);font-family:var(--hd);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;margin-bottom:.5rem}
.chat-item{display:flex;align-items:center;gap:.62rem;padding:.48rem .62rem;background:var(--bg3);border-radius:4px;cursor:pointer;margin-bottom:.3rem}
.chat-item-f{font-size:1.15rem}
.chat-item-n{font-family:var(--hd);font-size:.72rem;color:var(--tx);letter-spacing:.05em}
.chat-item-last{font-size:.67rem;color:var(--t2);margin-top:1px}
.chat-win{display:flex;flex-direction:column;height:calc(78vh - 115px)}
.cmsgs{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.42rem;padding-bottom:.42rem}
.cmsg{padding:.45rem .6rem;border-radius:4px;font-size:.78rem;line-height:1.48;max-width:92%}
.cmsg.player{background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.25);color:#93c5fd;align-self:flex-end}
.cmsg.ai{background:var(--bg3);border:1px solid var(--bo);color:var(--tx);align-self:flex-start}
.cmsg.system{background:rgba(200,150,30,.07);border:1px solid rgba(200,150,30,.2);color:var(--t2);font-style:italic;font-size:.7rem;align-self:center}
.cmsg-who{font-family:var(--hd);font-size:.54rem;letter-spacing:.1em;color:var(--t3);margin-bottom:2px;text-transform:uppercase}
.chat-irow{display:flex;gap:.36rem;padding-top:.45rem;border-top:1px solid var(--bo);flex-shrink:0}
.chat-in{flex:1;background:var(--bg3);border:1px solid var(--bo);border-radius:4px;padding:.4rem .55rem;
  color:var(--tx);font-family:var(--bd);font-size:.82rem;outline:none;resize:none;height:40px}
.chat-in:focus{border-color:var(--gd)}
.csend{background:linear-gradient(155deg,#8a6810,#c89820);border:none;border-radius:4px;
  color:#0b1018;font-family:var(--hd);font-size:.57rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;padding:0 .62rem;cursor:pointer;display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1.1;min-width:44px}
.csend small{font-size:.5rem;opacity:.7;margin-top:1px}
.csend:disabled{opacity:.4}
.plan-slot{background:var(--bg3);border:1px solid var(--bo);border-radius:4px;padding:.52rem .65rem;margin-bottom:.5rem}
.plan-slot h5{font-family:var(--hd);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gd);margin-bottom:.3rem}
.plan-ta{width:100%;background:var(--bg2);border:1px solid var(--bo);border-radius:3px;padding:.35rem .5rem;
  color:var(--tx);font-family:var(--bd);font-size:.8rem;outline:none;resize:none;height:48px}
.plan-ta:focus{border-color:var(--gd)}
.plan-ta::placeholder{color:var(--t3);font-style:italic}
.plan-save{width:100%;padding:.5rem;background:linear-gradient(155deg,#8a6810,#c89820);border:none;border-radius:4px;
  color:#0b1018;font-family:var(--hd);font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.adv-qs{display:flex;flex-wrap:wrap;gap:.28rem;margin-bottom:.5rem}
.adv-q{background:rgba(80,30,140,.15);border:1px solid rgba(140,60,200,.3);border-radius:12px;
  padding:.2rem .52rem;cursor:pointer;font-size:.7rem;color:#c4a0f0}
.advbtn{width:100%;padding:.48rem;background:rgba(200,150,30,.1);border:1px solid var(--gd);border-radius:4px;
  color:var(--gold);font-family:var(--hd);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;margin-bottom:.55rem}
.advbtn:disabled{opacity:.4}
.adv-body{font-size:.82rem;color:var(--tx);line-height:1.62;white-space:pre-wrap}
/* tjbtn-p used in war orders and UN modals (p-tj itself is hidden) */
.tjbtn-p{padding:.78rem;border-radius:5px;cursor:pointer;border:1px solid var(--bo2);font-family:var(--hd);font-size:.78rem;
  letter-spacing:.07em;text-align:left;background:var(--bg3);color:var(--tx);display:flex;justify-content:space-between;align-items:center;width:100%}
.tjbtn-p:active{opacity:.8}
.tjbig{background:linear-gradient(155deg,rgba(80,30,140,.3),rgba(60,20,100,.2));border-color:rgba(140,60,200,.4);color:#c4a0f0}
.cbadge{background:rgba(0,0,0,.3);border-radius:10px;padding:.07rem .35rem;font-size:.62rem;color:var(--coin);font-family:var(--hd)}
.sr-item{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;background:var(--bg3);border-radius:4px;cursor:pointer;margin-bottom:.28rem}
.prov-sec h5{font-family:var(--hd);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--t3);margin-bottom:.38rem}
.ethnic-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem;font-size:.72rem}
.ethnic-lbl{width:120px;color:var(--t2)}
.ethnic-track{flex:1;height:4px;background:var(--bo);border-radius:2px;overflow:hidden}
.ethnic-fill{height:100%;border-radius:2px}
.res-pills{display:flex;flex-wrap:wrap;gap:.2rem;margin-top:.28rem}
.res-pill{font-size:.68rem;padding:.1rem .38rem;border-radius:10px;background:rgba(27,40,64,.5);border:1px solid var(--bo);color:var(--tx)}
.bld-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.32rem;margin-top:.28rem}
.bld-card{padding:.35rem .5rem;border:1px solid var(--bo);border-radius:4px;background:var(--bg2);cursor:pointer;font-size:.72rem}
.bld-card.built{border-color:var(--gd);background:rgba(200,150,30,.08);cursor:default}
.bld-name{font-family:var(--hd);font-size:.62rem;color:var(--g2);letter-spacing:.05em;margin-bottom:.15rem}
.bld-effect{font-size:.6rem;color:var(--t2)}
.bld-cost{font-size:.6rem;color:var(--coin);margin-top:.1rem}

/* NEWSPAPER */
.news-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:200;align-items:center;justify-content:center;padding:1rem}
.news-ov.show{display:flex}
/* ── WAR SYSTEM ───────────────────────────── */
.ov-bg{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:180;display:flex;align-items:center;justify-content:center;padding:1rem}
.ov-box{background:var(--bg2);border:1px solid rgba(200,150,30,.35);border-radius:10px;padding:1.2rem;width:100%;overflow-y:auto;max-height:90vh}
.ov-h{font-family:var(--hd);font-size:.95rem;color:var(--g2);letter-spacing:.08em;margin-bottom:.8rem;text-align:center}
.war-card{background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.25);border-radius:8px;padding:.75rem;margin-bottom:.6rem}
.war-card-h{font-family:var(--hd);font-size:.78rem;color:#fca5a5;letter-spacing:.06em;margin-bottom:.45rem;display:flex;align-items:center;justify-content:space-between}
.war-vs{font-size:.68rem;color:var(--t2);margin-bottom:.4rem}
.war-stats{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;margin:.4rem 0}
.war-stat{background:rgba(0,0,0,.25);border-radius:4px;padding:.3rem .45rem;display:flex;justify-content:space-between}
.war-stat-l{font-size:.62rem;color:var(--t3)}
.war-stat-v{font-size:.68rem;font-family:var(--hd);color:var(--tx)}
.war-front{margin:.4rem 0;font-size:.72rem;color:var(--t2)}
.war-front-bar{height:8px;border-radius:4px;background:rgba(255,255,255,.08);margin-top:3px;position:relative;overflow:hidden}
.war-front-fill{position:absolute;top:0;left:0;height:100%;border-radius:4px;transition:width .6s ease}
.war-btns{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}
.war-btn{flex:1;min-width:100px;padding:.35rem .5rem;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:5px;color:#fca5a5;font-family:var(--hd);font-size:.62rem;letter-spacing:.06em;cursor:pointer;transition:all .2s;text-transform:uppercase}
.war-btn:hover{background:rgba(239,68,68,.2)}
.war-btn.peace{background:rgba(34,197,94,.06);border-color:rgba(34,197,94,.25);color:#86efac}
.war-btn.peace:hover{background:rgba(34,197,94,.15)}
.war-btn.un{background:rgba(96,165,250,.06);border-color:rgba(96,165,250,.25);color:#93c5fd}
.war-btn.un:hover{background:rgba(96,165,250,.15)}
.war-day-log{background:rgba(0,0,0,.3);border-radius:5px;padding:.5rem .65rem;margin:.4rem 0;font-size:.72rem;line-height:1.6;color:var(--t2);max-height:150px;overflow-y:auto}
.war-prov-list{display:flex;flex-direction:column;gap:.25rem;margin:.4rem 0}
.war-prov-item{display:flex;align-items:center;justify-content:space-between;padding:.3rem .45rem;background:rgba(27,40,64,.3);border-radius:4px;border-left:2px solid var(--bo2);font-size:.7rem}
.war-prov-item.attacking{border-left-color:#ef4444;animation:warPulse 2s infinite}
.war-prov-item.captured{border-left-color:#22c55e}
.war-prov-item.contested{border-left-color:#f59e0b}
@keyframes warPulse{0%,100%{border-left-color:#ef4444}50%{border-left-color:#fca5a5}}
.war-declare-btn{width:100%;padding:.55rem;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.4);border-radius:6px;color:#fca5a5;font-family:var(--hd);font-size:.72rem;letter-spacing:.08em;cursor:pointer;margin-top:.5rem;transition:all .25s;text-transform:uppercase}
.war-declare-btn:hover{background:rgba(239,68,68,.2);border-color:#ef4444}
.un-msg{padding:.4rem .55rem;border-radius:5px;margin:.3rem 0;font-size:.74rem;line-height:1.5}
.un-msg.player{background:rgba(200,150,30,.1);border-left:2px solid var(--gold);color:var(--tx)}
.un-msg.nation{background:rgba(27,40,64,.4);border-left:2px solid var(--bo2);color:var(--t2)}
.un-msg.un-sys{background:rgba(96,165,250,.08);border-left:2px solid rgba(96,165,250,.4);color:#93c5fd;font-style:italic}
.territory-badge{display:inline-block;font-size:.6rem;font-family:var(--hd);letter-spacing:.06em;padding:.1rem .3rem;border-radius:3px;margin-left:.3rem;vertical-align:middle}
.territory-badge.unrecognized{background:rgba(239,68,68,.12);color:#fca5a5}
.territory-badge.recognized{background:rgba(34,197,94,.12);color:#86efac}
.newspaper{background:#fbfaf7;border-radius:6px;width:100%;max-width:520px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;position:relative;box-shadow:0 24px 70px rgba(0,0,0,.6);border:1px solid #d8d4cc}
.np-head{background:#fbfaf7;padding:.9rem 1.1rem .55rem;text-align:center;flex-shrink:0;border-bottom:1px solid #1a1a1a}
.np-title{font-family:'Playfair Display',Georgia,serif;font-weight:900;font-size:clamp(1.6rem,7vw,2.5rem);color:#111;letter-spacing:-.01em;line-height:1.02;text-transform:uppercase}
.np-sub{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:.7rem;color:#666;letter-spacing:.04em;margin-top:.3rem;text-transform:none}
.np-date{font-size:.58rem;color:#888;margin-top:.5rem;font-family:Georgia,serif;letter-spacing:.18em;text-transform:uppercase;border-top:1px solid #ddd;padding-top:.4rem}
.np-rule{height:0;border-top:3px solid #111;border-bottom:1px solid #111;margin:0 1.1rem;padding-top:2px}
.np-pages{flex:1;overflow-y:auto;padding:.95rem 1.1rem;background:#fbfaf7}
.np-page{display:none}
.np-page.active{display:block}
.np-col-h{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#b91c1c;padding-bottom:.3rem;margin-bottom:.7rem;text-align:left;border-bottom:2px solid #111;display:flex;align-items:center;gap:.4rem}
.np-story{margin-bottom:.9rem;padding-bottom:.9rem;border-bottom:1px solid #e2ded4}
.np-story:last-child{border-bottom:none}
.np-story h3{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:.98rem;color:#111;line-height:1.22;margin-bottom:.3rem;letter-spacing:-.01em}
.np-story p{font-family:Georgia,'Crimson Pro',serif;font-size:.78rem;color:#2a2a2a;line-height:1.6}
.np-story:first-child h3{font-size:1.3rem;line-height:1.16}
.np-story:first-child p{font-size:.82rem;color:#222}
.np-nav{display:flex;align-items:center;justify-content:space-between;padding:.55rem 1.1rem;border-top:1px solid #ddd;background:#f3f1ea;flex-shrink:0}
.np-navbtn{background:#fff;border:1px solid #c9c4ba;border-radius:5px;color:#222;font-size:.72rem;font-family:Georgia,serif;padding:.32rem .75rem;cursor:pointer;transition:all .15s}
.np-navbtn:hover:not(:disabled){background:#111;color:#fff;border-color:#111}
.np-navbtn:disabled{opacity:.3;cursor:default}
.np-pi{font-size:.62rem;color:#888;font-family:Georgia,serif;letter-spacing:.14em;text-transform:uppercase}
.np-close{position:absolute;top:.55rem;right:.7rem;background:rgba(0,0,0,.06);border:1px solid #d8d4cc;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#333;font-size:.85rem;z-index:2;transition:all .15s}
.np-close:hover{background:#b91c1c;color:#fff;border-color:#b91c1c}

/* COIN MODAL */
.modal-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:200;align-items:center;justify-content:center;padding:1rem}
.modal-ov.show{display:flex}
.modal{background:var(--bg2);border:1px solid var(--bo2);border-radius:8px;padding:1.05rem;width:100%;max-width:460px;max-height:88vh;overflow-y:auto}
.modal h3{font-family:var(--hd);font-size:.9rem;color:var(--gold);letter-spacing:.1em;margin-bottom:.85rem}
.mtabs{display:flex;gap:.25rem;margin-bottom:.85rem;border-bottom:1px solid var(--bo)}
.mtab{flex:1;background:none;border:none;color:var(--t3);font-family:var(--hd);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;padding:.45rem;cursor:pointer;border-bottom:2px solid transparent}
.mtab.on{color:var(--gold);border-bottom-color:var(--gold)}
.pack-card{display:flex;align-items:center;justify-content:space-between;padding:.75rem .9rem;background:var(--bg3);border:1px solid var(--bo);border-radius:5px;cursor:pointer;margin-bottom:.42rem;position:relative}
.pack-card.pop{border-color:var(--gd)}
.pack-card.best{border-color:rgba(140,60,200,.5)}
.pbadge{position:absolute;top:-6px;right:11px;font-family:var(--hd);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;padding:.1rem .42rem;border-radius:10px}
.pbadge.pop{background:var(--gold);color:#000}
.pbadge.best{background:#a060d0;color:#fff}
.demo-note{background:rgba(200,150,30,.08);border:1px solid rgba(200,150,30,.25);border-radius:5px;padding:.45rem .65rem;font-size:.7rem;color:var(--t2);margin-bottom:.7rem;line-height:1.5}
.hist-item{display:flex;justify-content:space-between;padding:.35rem .58rem;background:var(--bg3);border-radius:4px;margin-bottom:.25rem;font-size:.73rem}

/* TOAST */
.toast{position:fixed;top:52px;left:50%;transform:translateX(-50%);z-index:250;background:var(--bg2);border:1px solid #ef4444;border-radius:6px;padding:.52rem .85rem;color:#fca5a5;font-size:.78rem;display:none;box-shadow:0 4px 16px rgba(0,0,0,.5);max-width:90vw;text-align:center}
.toast.show{display:block}
.spin{display:inline-block;width:10px;height:10px;border:2px solid rgba(200,150,30,.25);border-top-color:var(--gold);border-radius:50%;animation:rot .7s linear infinite;margin-right:4px;vertical-align:middle}
@keyframes rot{to{transform:rotate(360deg)}}
/* Province overlay */
.prov-marker{transition:opacity .15s ease,transform .12s ease;pointer-events:auto}
.prov-marker .prov-hit{cursor:pointer}
.prov-zoom-hint{position:absolute;left:50%;transform:translateX(-50%);top:52px;z-index:45;
  background:rgba(200,150,30,.15);border:1px solid rgba(200,150,30,.4);border-radius:14px;
  padding:.2rem .7rem;font-family:Cinzel,serif;font-size:.62rem;color:var(--gold);
  pointer-events:none;opacity:0;transition:opacity .3s}
.prov-zoom-hint.show{opacity:1}
@keyframes fadeIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.wbadge{display:inline-flex;align-items:center;gap:.15rem;background:rgba(239,68,68,.15);border:1px solid #ef4444;border-radius:5px;padding:.07rem .25rem;cursor:pointer;font-family:var(--hd);font-size:.52rem;color:#fca5a5;white-space:nowrap}
.wbadge:hover{background:rgba(239,68,68,.3)}

/* ═══ MOBILE RESPONSIVE ═════════════════════════════════════════════ */
/* ═══ MOBILE RESPONSIVE ═══════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Header */
  .gh{height:44px;padding:0 .4rem;gap:.2rem;overflow:visible}
  .gh-name{max-width:40px;font-size:.58rem}
  .gh-date{font-size:.62rem;letter-spacing:.04em}
  .ghcoins{padding:.1rem .22rem;font-size:.56rem}
  .tjbtn-h{padding:.16rem .3rem;font-size:.56rem}
  .hbtn{padding:.18rem .24rem;font-size:.62rem}
  /* Resources strip — hide labels on very small, keep icons */
  #res-strip span:not(:first-child){display:none}
  /* War badges in center: allow overflow, smaller font */
  #war-badges{max-width:none!important;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .wbadge{font-size:.5rem;padding:.06rem .22rem;white-space:nowrap}
  .war-badges-hdr{display:none!important}
  /* Panels full-width */
  .panel{border-radius:0;width:100%!important;left:0!important;right:0!important}
  .pnb{padding:.5rem .6rem}
  /* Map fills screen below header */
  #map{top:44px}
  /* Log area compact */
  .log-wrap{max-height:80px}
  /* Nation cards */
  .nb{padding:.5rem .4rem}
  /* War panel mobile */
  .war-stat-row{font-size:.65rem}
  .war-btns{flex-wrap:wrap;gap:.3rem}
  .war-btn{flex:1;min-width:80px;font-size:.6rem;padding:.35rem .3rem}
}
@media (max-width: 400px) {
  .gh-name{display:none}
  .hbtn{padding:.15rem .2rem;font-size:.58rem}
  .tjbtn-h{font-size:.52rem;padding:.14rem .25rem}
  #res-strip{display:none!important}
}

/* ── Expandable FAB (mobile + desktop chat bubble) ─────────────────── */
#fab-root { position:fixed; right:.7rem; bottom:.5rem; z-index:201; display:flex; flex-direction:column; align-items:flex-end; gap:.4rem; }
#fab-toggle { width:46px; height:46px; border-radius:50%; background:linear-gradient(145deg,rgba(20,30,44,.98),rgba(10,18,28,.98)); border:1.5px solid rgba(212,168,67,.55); color:var(--gold); font-size:1.2rem; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 3px 18px rgba(0,0,0,.65); transition:transform .2s, border-color .2s; user-select:none; -webkit-tap-highlight-color:transparent; }
#fab-toggle.fab-open { transform:rotate(45deg); border-color:rgba(212,168,67,.9); }
#fab-items { display:flex; flex-direction:column; align-items:flex-end; gap:.35rem; overflow:hidden; max-height:0; opacity:0; transition:max-height .28s ease, opacity .22s ease; pointer-events:none; }
#fab-items.fab-open { max-height:480px; opacity:1; pointer-events:auto; }
.fab-item { display:flex; align-items:center; gap:.45rem; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.fab-item-label { font-size:.6rem; color:var(--t2); background:rgba(10,16,24,.92); padding:.18rem .45rem; border-radius:4px; border:1px solid rgba(255,255,255,.08); white-space:nowrap; font-family:var(--hd); letter-spacing:.06em; }
.fab-btn { width:40px; height:40px; border-radius:50%; background:rgba(10,16,24,.95); border:1px solid rgba(255,255,255,.12); color:var(--tx); font-size:.95rem; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 10px rgba(0,0,0,.5); transition:border-color .15s, background .15s; flex-shrink:0; }
.fab-btn:hover { border-color:rgba(212,168,67,.5); background:rgba(20,28,40,.98); }
.fab-btn.fab-chat { border-color:rgba(80,150,255,.35); position:relative; }
.fab-btn.fab-chat .unread { position:absolute; top:-3px; right:-3px; background:#ef4444; color:#fff; border-radius:50%; width:14px; height:14px; font-size:.48rem; display:none; align-items:center; justify-content:center; font-weight:700; }
.fab-btn.fab-chat .unread.show { display:flex; }
/* Hide desktop header buttons that are redundant with FAB on mobile */
@media (max-width: 640px) {
  .hbtn#btn-ally { display: none; }
  .hbtn#btn-menu { display: none; }
  #un-fab-header  { display: none; }
  #fab-root { display: flex; }
}
@media (min-width: 641px) {
  /* v0.00028: PC теперь имеет ту же burger панель что мобильный.
     fab-toggle виден, fab-items открываются по клику, labels тоже видны. */
  /* Подписи показываем по hover чтобы не загромождать */
  .fab-item-label { font-size:.55rem; opacity:.85; }
}

/* Navigation stack close button */
.panel-close{position:absolute;top:.6rem;right:.6rem;background:none;border:none;
  color:var(--t3);font-size:1rem;cursor:pointer;padding:.2rem .4rem;border-radius:4px;
  transition:color .15s}
.panel-close:hover{color:var(--tx)}
/* Back button */
.panel-back{display:flex;align-items:center;gap:.25rem;font-size:.65rem;color:var(--t3);
  cursor:pointer;padding:.2rem 0;margin-bottom:.4rem;border:none;background:none}
.panel-back:hover{color:var(--tx)}

/* ═══ MOBILE CRITICAL FIXES ═══════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Header: absolutely no overflow */
  .gh { height:44px; padding:0 .3rem; overflow:hidden; }
  .gh > div:first-child { max-width:45%; overflow:hidden; }
  /* Resource strip: icon only, no text on very small */
  #res-strip { gap:.18rem; }
  #res-money, #res-oil, #res-energy { font-size:.5rem; max-width:28px; overflow:hidden; text-overflow:ellipsis; }
  /* Coins: prominent, clickable */
  .ghcoins { font-size:.62rem; padding:.12rem .3rem; border:1px solid rgba(212,168,67,.5); }
  /* Time button */
  .tjbtn-h { font-size:.55rem; padding:.14rem .28rem; }
  /* Header buttons */
  .hbtn { padding:.16rem .22rem; font-size:.6rem; }
  /* Date */
  .gh-date { font-size:.62rem; letter-spacing:.02em; }
  /* FABs */
  /* Map fills screen below header */
  #map { top:44px; }
  /* Log compact */
  .log-wrap { max-height:72px; font-size:.6rem; }
  /* War panel */
  .war-stat-row { font-size:.6rem; }
  .war-btn { font-size:.58rem; padding:.3rem .2rem; }
  /* Country card full screen */
  #cpop { left:0!important; right:0!important; bottom:0!important; width:100%!important; border-radius:0!important; top:var(--hud-h,58px)!important; max-height:none!important; height:calc(100dvh - var(--hud-h,58px))!important; overflow:hidden!important; }
  /* Panels full width */
  .panel { border-radius:0; width:100%!important; max-width:100%!important; }
}
@media (max-width: 380px) {
  .ghcoins { display:none; } /* show in FAB instead */
  #res-strip { display:none!important; }
}
/* ── Desktop UI 2× scaling — PC only, mobile untouched ─────────────── */
@media (min-width: 1024px) and (pointer: fine){
  /* Country card: wider */
  .cpop{width:560px!important;max-width:560px!important}
  .cph-name{font-size:1.4rem!important}
  .cph-flag{font-size:1.6rem!important}
  /* Tabs: slightly smaller (were too big) */
  .tab-btn,[data-tab]{font-size:.82rem!important;padding:.35rem .3rem!important;min-height:44px}
  /* cpb: scale up ALL inline font-size via zoom trick (1.35 → 1.20 for readability) */
  .cpb{zoom:1.20}
  /* Unit/building detail overlays: 15% bigger on PC */
  #unit-detail-ov .ov-box,#bld-detail-ov .ov-box{max-width:380px!important;font-size:1.05rem}
  #unit-detail-ov .ov-box div[style*="font-size"],#bld-detail-ov .ov-box div[style*="font-size"]{zoom:1.15}
  /* Panel */
  .panel{font-size:1.05rem;max-width:420px}
  /* Modals/overlays */
  .ov-box{max-width:580px;font-size:1.05rem}
  .ov-h{font-size:1.15rem!important}
  /* Header */
  .hbtn{width:38px!important;height:38px!important;font-size:1.15rem!important}
  .wbadge{font-size:.78rem!important;padding:.12rem .45rem!important}
  #res-strip span{font-size:.9rem!important}
  .gh-date{font-size:1.05rem!important}
  .ghcoins{font-size:1rem!important}
  /* Log */
  #evstrip,#ev-last{font-size:.88rem!important}
  /* Chat */
  .cmsg{font-size:.95rem!important;padding:.55rem .7rem!important;line-height:1.65!important}
  .chat-inp{font-size:.92rem!important;padding:.4rem .6rem!important}
  /* Zoom buttons */
  .zbtn{width:38px!important;height:38px!important;font-size:1.15rem!important}
  /* Advisor */
  /* Advisor panel: 1.5x bigger on PC */
  #p-adv{width:500px!important;max-width:500px!important}
  #p-adv .pnh{font-size:1.1rem!important}
  #p-adv .adv-qs button{font-size:.85rem!important;padding:.35rem .65rem!important}
  #adv-body{font-size:1.05rem!important;line-height:1.75!important;min-height:200px}
  #p-adv #adv-go{font-size:.9rem!important;padding:.4rem .8rem!important}
  #p-adv input,#p-adv textarea{font-size:.9rem!important}
}
/* ── 2K/4K desktop scaling ─────────────────────────────────────────── */
@media (min-width: 1920px){
  html{font-size:18px}
  .gh{padding:.55rem 1.2rem}
  .ghcoins{font-size:.85rem}
  .tjbtn-h{font-size:.8rem;padding:.32rem .75rem}
  .hbtn{width:32px;height:32px;font-size:1rem}
  #res-strip span{font-size:.72rem}
  .cpop{max-width:560px}
  .panel{max-width:420px}
  .ov-box{max-width:480px}
}
@media (min-width: 2560px){
  html{font-size:22px}
  .gh{padding:.65rem 1.8rem}
  .hbtn{width:38px;height:38px;font-size:1.15rem}
  .cpop{max-width:680px}
  .panel{max-width:520px}
  .ov-box{max-width:560px}
}
@media (min-width: 3840px){
  html{font-size:30px}
  .gh{padding:.8rem 2.5rem}
  .hbtn{width:48px;height:48px;font-size:1.4rem}
  .cpop{max-width:860px}
}
/* ── [v0.00089] Deployment window — granular unit selection ── */
#war-deploy-ov .ov-box{max-width:540px;width:94vw}
#dep-slots{max-height:60vh;overflow-y:auto;padding-right:.2rem}
.dep-group{margin-bottom:.55rem}
.dep-group-h{font-size:.62rem;color:var(--t2);text-transform:uppercase;letter-spacing:.05em;margin:.1rem 0 .3rem;padding-bottom:.15rem;border-bottom:1px solid var(--bo)}
.dep-row{background:rgba(255,255,255,.03);border:1px solid var(--bo);border-radius:5px;padding:.3rem .4rem;margin-bottom:.28rem}
.dep-row.dep-dis{opacity:.4}
.dep-row-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.22rem;gap:.4rem}
.dep-row-label{font-size:.66rem;color:var(--tx)}
.dep-row-avail{font-size:.56rem;color:var(--t3);white-space:nowrap}
.dep-row-ctl{display:flex;gap:.4rem;align-items:center}
.dep-row-ctl input[type=range]{flex:1;accent-color:var(--gold);min-width:0}
.dep-row-ctl input[type=number]{width:70px;padding:.16rem .2rem;background:rgba(255,255,255,.05);border:1px solid var(--bo);border-radius:3px;color:var(--tx);font-size:.7rem;text-align:center}
.dep-max{padding:.16rem .4rem;background:rgba(212,168,67,.12);border:1px solid rgba(212,168,67,.35);border-radius:3px;color:var(--gold);font-size:.56rem;cursor:pointer;white-space:nowrap}
.dep-max:disabled{opacity:.4;cursor:default}

/* ═══════════════════════════════════════════════════════════════════
   [v0.00104] TOUCH (iOS/Android): крупная, кликабельная игровая HUD-панель.
   pointer:coarse = тач-экраны; !important перебивает мелкие mobile-правила выше.
   ═══════════════════════════════════════════════════════════════════ */
@media (pointer: coarse) {
  #sg .gh { height: auto !important; min-height: 54px !important; padding: .3rem .45rem !important; overflow: visible !important; }
  .gh-row1 { height: auto !important; min-height: 46px; gap: .4rem; }
  .gh-row2 { gap: .35rem !important; flex-wrap: wrap !important; }
  .gh-right { gap: .42rem !important; }
  .gh-tools { gap: .4rem !important; }
  /* tool buttons (advisor/search/alliances/UN/menu) */
  .hbtn { min-width: 42px !important; min-height: 42px !important; padding: .5rem !important; font-size: 1.05rem !important; border-radius: 8px !important; }
  /* time/speed buttons */
  .tjbtn-h, .gh-speed .tjbtn-h { min-height: 40px !important; padding: .45rem .65rem !important; font-size: .85rem !important; border-radius: 8px !important; }
  /* resource metrics (money/oil/energy) */
  .gh-metric { min-height: 40px !important; padding: .35rem .55rem !important; font-size: .9rem !important; border-radius: 8px !important; }
  .gh-metric-ic { font-size: 1rem !important; }
  /* tension / war chips */
  .gh-chip { min-height: 40px !important; padding: .35rem .6rem !important; font-size: .9rem !important; border-radius: 9px !important; }
  /* KPI pills (economy/stability/army) */
  .gh-kpi { min-height: 44px !important; padding: .4rem .7rem !important; border-radius: 9px !important; }
  .gh-kpi-ic { font-size: 1rem !important; }
  .gh-kpi-lb { font-size: .64rem !important; }
  .gh-kpi-v { font-size: .9rem !important; }
  /* coins */
  .ghcoins, .gh-chip-coin { min-height: 40px !important; padding: .35rem .6rem !important; font-size: .92rem !important; border-radius: 9px !important; }
  /* identity */
  .gh-flag { font-size: 1.5rem !important; }
  .gh-name { font-size: .95rem !important; }
  .gh-date { font-size: .8rem !important; }
}
