/* ============================================================
   DARKSIDE — PORTAL (dashboard landing). Faithful to the approved
   reference: single-screen 3-column ornate dashboard.
   Base coordinate space = 1672 x 941 (same as the reference art).
   ============================================================ */

/* ---- fonts bundled from the live game ---------------------- */
@font-face{font-family:'Cinzel';font-weight:400 900;font-display:swap;
  src:url(assets/fonts/8vIJ7ww63mVu7gt7-GT7LEc.woff2) format('woff2')}
@font-face{font-family:'MedievalSharp';font-weight:400;font-display:swap;
  src:url(assets/fonts/EvOJzAlL3oU5AQl2mP5KdgptMqhwMg.woff2) format('woff2')}
@font-face{font-family:'Crimson Text';font-weight:400;font-display:swap;
  src:url(assets/fonts/wlpogwHKFkZgtmSR3NB0oRJfajhfK_Zt3Q.woff2) format('woff2')}
@font-face{font-family:'Crimson Text';font-weight:600;font-display:swap;
  src:url(assets/fonts/wlppgwHKFkZgtmSR3NB0oRJXsCxGAtNQ5LE.woff2) format('woff2')}

:root{
  --gold:#c99f4f; --gold-hi:#f4dca0; --gold-lo:#7a5626; --gold-dim:#9c7f4e;
  --bronze:#8a6a34;
  --red:#8d1712; --red-hi:#ff6e56; --red-deep:#3d0b08;
  --teal:#37c9bd; --blue:#5aa0e0;
  --ink:#050403; --wood:#171009; --wood-2:#0d0906;
  --line:#2c2013; --line-gold:rgba(201,159,79,.30);
  --txt:#e7dabc; --txt-dim:#b0a184; --txt-mute:#84765f;
  --disp:'MedievalSharp','Cinzel',Georgia,serif;
  --serif:'Crimson Text',Georgia,'Times New Roman',serif;
  --caps:'Cinzel',Georgia,serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body.portal-body{
  background:
    radial-gradient(120% 90% at 50% -8%, #2a1610 0%, #0c0705 44%, #030202 82%) fixed, #030202;
  color:var(--txt); font-family:var(--serif); overflow-x:hidden;
}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
img{display:block;max-width:100%}
::selection{background:rgba(201,159,79,.35);color:#fff}

/* engraved gold text helper */
.gold-text{
  background:linear-gradient(180deg,#ffe6b8 0%,#e6bd6a 42%,#b07f32 56%,#f0cd85 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 1px 0 rgba(0,0,0,.5);
}

/* ============================================================
   SCALER — keeps the 1672x941 stage pixel-faithful, scaled to fit.
   ============================================================ */
.scaler{width:100%;overflow-x:auto;overflow-y:visible;display:flex;justify-content:center;
  background:linear-gradient(rgba(0,0,0,.05),rgba(0,0,0,.25))}
/* zoom (а не transform) — масштаб влияет на поток, поэтому низ НЕ обрезается и высота сама верна */
.stage{position:relative;width:1672px;min-height:941px;flex:none;padding:16px;}

/* ---- OUTER ornate frame ----------------------------------- */
.stage::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:30;border-radius:4px;
  box-shadow:
    inset 0 0 0 2px #0a0705,
    inset 0 0 0 3px rgba(201,159,79,.34),
    inset 0 0 0 8px #0a0705,
    inset 0 0 0 9px rgba(138,106,52,.5),
    inset 0 0 60px rgba(0,0,0,.7),
    0 0 0 1px #000;}
/* filigree corner ornaments on the outer frame */
.frame-orn{position:absolute;inset:0;z-index:31;pointer-events:none}
.frame-orn i{position:absolute;width:54px;height:54px;background:center/contain no-repeat;
  filter:drop-shadow(0 1px 1px #000);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='54' height='54' viewBox='0 0 54 54'><g fill='none' stroke='%23c99f4f' stroke-width='2' stroke-linecap='round'><path d='M6 6 L6 31'/><path d='M6 6 L31 6'/><path d='M6 21 C18 21 21 18 21 6'/><path d='M11 11 C11 23 23 23 23 11' stroke='%23a3803d' stroke-width='1.3'/></g><path d='M6 6 L16 6 L6 16 Z' fill='%23c99f4f' opacity='.85'/><circle cx='6' cy='6' r='3.2' fill='%23e8c987'/><circle cx='31' cy='6' r='1.8' fill='%23c99f4f'/><circle cx='6' cy='31' r='1.8' fill='%23c99f4f'/></svg>")}
.frame-orn i:nth-child(1){top:5px;left:5px}
.frame-orn i:nth-child(2){top:5px;right:5px;transform:scaleX(-1)}
.frame-orn i:nth-child(3){bottom:5px;right:5px;transform:scale(-1,-1)}
.frame-orn i:nth-child(4){bottom:5px;left:5px;transform:scaleY(-1)}

.stage-bg{position:absolute;inset:8px;z-index:-1;border-radius:3px;overflow:hidden}
.stage-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(6,4,3,.55),rgba(6,4,3,.9))}
.stage-bg img{width:100%;height:100%;object-fit:cover;opacity:.28;filter:saturate(.8)}

/* ---- the 3-column grid ------------------------------------ */
.grid{position:relative;z-index:2;display:grid;min-height:909px;align-items:start;
  grid-template-columns:248px 1fr 250px;column-gap:16px;}
.col{display:flex;flex-direction:column;gap:12px;min-height:0}
.col-center{gap:11px}
.rail-offset{margin-top:56px}     /* clears the top menu bar (center + right rails) */

/* ============================================================
   ORNATE PANEL
   ============================================================ */
.op{position:relative;border-radius:2px;
  background:
    linear-gradient(180deg,rgba(30,21,12,.94),rgba(11,8,5,.96)),
    radial-gradient(120% 70% at 50% 0,rgba(120,40,24,.10),transparent 62%);
  border:1px solid var(--line);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(201,159,79,.14),
    inset 0 0 26px rgba(0,0,0,.5),0 5px 20px rgba(0,0,0,.45);
  padding:11px 13px;}
.op::before{content:"";position:absolute;inset:4px;border:1px solid rgba(201,159,79,.24);
  border-radius:1px;pointer-events:none}
/* corner filigree */
.op .corners{position:absolute;inset:2px;pointer-events:none;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><g fill='none' stroke='%23b8863d' stroke-width='1.3'><path d='M2 18 L2 7 Q2 2 7 2 L18 2'/></g><circle cx='5' cy='5' r='1.5' fill='%23e6c079'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><g fill='none' stroke='%23b8863d' stroke-width='1.3'><path d='M18 18 L18 7 Q18 2 13 2 L2 2'/></g><circle cx='15' cy='5' r='1.5' fill='%23e6c079'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><g fill='none' stroke='%23b8863d' stroke-width='1.3'><path d='M2 2 L2 13 Q2 18 7 18 L18 18'/></g><circle cx='5' cy='15' r='1.5' fill='%23e6c079'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><g fill='none' stroke='%23b8863d' stroke-width='1.3'><path d='M18 2 L18 13 Q18 18 13 18 L2 18'/></g><circle cx='15' cy='15' r='1.5' fill='%23e6c079'/></svg>");
  background-position:top left,top right,bottom left,bottom right;background-repeat:no-repeat}

/* panel header: centered caps flanked by rule + diamond */
.op-h{display:flex;align-items:center;gap:8px;margin:2px 2px 9px;padding-bottom:7px}
.op-h .t{font-family:var(--caps);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  font-size:13px;white-space:nowrap}
.op-h .r{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(201,159,79,.5))}
.op-h .r.l{background:linear-gradient(90deg,rgba(201,159,79,.5),transparent)}
.op-h .dot{width:6px;height:6px;background:var(--red);transform:rotate(45deg);flex:none;
  box-shadow:0 0 7px rgba(190,40,25,.7)}
.op-h.center{justify-content:center}
.op-h.center .t{order:2;position:relative} .op-h.center .r.l{order:1} .op-h.center .r{order:3}
/* small diamond flourishes flanking centered titles */
.op-h.center .t::before,.op-h.center .t::after{content:"";display:inline-block;width:5px;height:5px;
  background:var(--gold);transform:rotate(45deg);position:relative;top:-2px;margin:0 9px;opacity:.85;
  box-shadow:0 0 5px rgba(201,159,79,.5)}

/* ============================================================
   BUTTONS
   ============================================================ */
.gbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  font-family:var(--caps);font-weight:700;letter-spacing:.09em;text-transform:uppercase;font-size:12px;
  color:var(--gold-hi);padding:9px 12px;border-radius:2px;
  background:linear-gradient(180deg,#241a10,#0e0a07);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(201,159,79,.34),0 3px 10px rgba(0,0,0,.5);
  transition:.15s}
.gbtn:hover{color:#fff3d6;box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(244,220,160,.6),
  inset 0 0 18px rgba(201,159,79,.16),0 3px 12px rgba(0,0,0,.5)}
.gbtn.red{background:linear-gradient(180deg,#9a2016,#3d0b08);color:#ffdcae;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(210,120,70,.5),inset 0 0 16px rgba(255,90,40,.18),0 3px 12px rgba(120,20,10,.4)}
.gbtn.red:hover{filter:brightness(1.14);color:#fff}
.gbtn.blue{background:linear-gradient(180deg,#123c46,#08171b);color:#bfeee9;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(63,200,190,.4),0 3px 10px rgba(0,0,0,.4)}
.gbtn.big{padding:14px 18px;font-size:15px}
.gbtn.sm{padding:7px 10px;font-size:10.5px}

/* Кнопка «Играть» — крупнее текст + пульс-подсветка. Текст стоит неподвижно по центру
   (без scale-«дыхания», которое двигало текст вверх-вниз). */
.hero-cta .gbtn.red.big{position:relative;font-size:20px;letter-spacing:.12em}
.hero-cta .gbtn.red.big::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 0 0 rgba(240,90,50,.55);animation:playRing 2.6s ease-out infinite}
@keyframes playRing{0%{box-shadow:0 0 0 0 rgba(240,90,50,.55)}70%{box-shadow:0 0 12px 9px rgba(240,90,50,0)}100%{box-shadow:0 0 0 0 rgba(240,90,50,0)}}
.hero-cta .gbtn.red.big:hover::after{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.hero-cta .gbtn.red.big::after{animation:none}}

/* Попап логина/регистрации поверх затемнённого сайта */
.auth-ov{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  background:rgba(6,4,3,.72);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:authFade .2s ease}
@keyframes authFade{from{opacity:0}to{opacity:1}}
.auth-pop{position:relative;width:100%;max-width:380px;margin:16px;padding:26px 24px 22px;
  background:linear-gradient(180deg,#1a130c,#0c0806);border:1px solid rgba(201,159,79,.4);border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.7),inset 0 0 0 1px rgba(0,0,0,.6);color:var(--gold-hi);animation:authPop .22s ease}
@keyframes authPop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.auth-x{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--text-dim);font-size:22px;line-height:1;cursor:pointer;padding:4px}
.auth-x:hover{color:#fff}
.auth-logo{display:block;width:52px;height:52px;object-fit:contain;margin:0 auto 6px}
.auth-title{text-align:center;font-family:var(--caps);letter-spacing:.06em;text-transform:uppercase;color:var(--gold);font-size:15px;margin-bottom:2px}
.auth-sub{text-align:center;color:var(--text-dim);font-size:.76rem;margin-bottom:16px}
.auth-tabs2{display:flex;gap:6px;margin-bottom:14px}
.auth-tab{flex:1;padding:8px;border:1px solid rgba(201,159,79,.25);background:rgba(0,0,0,.25);color:var(--text-dim);
  font-family:var(--caps);text-transform:uppercase;letter-spacing:.06em;font-size:11px;border-radius:3px;cursor:pointer;transition:.15s}
.auth-tab.on{color:var(--gold-hi);border-color:rgba(201,159,79,.6);background:rgba(154,32,22,.28)}
.auth-inp{width:100%;padding:10px 12px;margin-bottom:9px;border-radius:4px;border:1px solid rgba(201,159,79,.3);
  background:rgba(0,0,0,.35);color:#f0e0c0;font-size:.9rem;box-sizing:border-box}
.auth-inp:focus{outline:none;border-color:rgba(201,159,79,.7)}
.auth-inp::placeholder{color:#8a7a5c}
.auth-err{color:#ff8a6a;font-size:.8rem;margin:2px 0 8px;min-height:1em;text-align:center}
.auth-or{display:flex;align-items:center;gap:8px;color:#7a6a4c;font-size:.76rem;margin:14px 0 10px}
.auth-or span{flex:1;height:1px;background:rgba(201,159,79,.2)}
.auth-soc{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch}
.auth-soc #a-vk{flex:1 1 240px;min-width:0}
.auth-ya{flex:1 1 240px;min-width:0;height:44px;padding:0 14px;border:none;border-radius:8px;background:#fff;color:#000;
  font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.auth-ya:hover{filter:brightness(.96)}
.auth-ya-i{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;
  background:#fc3f1d;color:#fff;font-weight:800;font-family:Arial,sans-serif;flex-shrink:0}

/* ============================================================
   LEFT RAIL — logo / world / battles
   ============================================================ */
.brand{text-align:center;padding:2px 0 4px}
.crest{width:150px;height:66px;margin:0 auto -6px}
.wordmark{font-family:var(--disp);line-height:.92;letter-spacing:.02em;margin-top:2px}
.wordmark .l1{font-size:37px} .wordmark .l2{font-size:37px}
.wordmark b{display:block;font-weight:400;
  background:linear-gradient(180deg,#f3e4c2,#d8b878 45%,#8a5a2c 70%,#c99044);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 2px 0 rgba(0,0,0,.45),0 3px 6px rgba(0,0,0,.5);filter:drop-shadow(0 1px 0 #1a0d05)}
.brand .studio{font-family:var(--caps);font-size:8.5px;letter-spacing:.34em;color:var(--gold-dim);
  text-transform:uppercase;margin-top:6px;opacity:.8}

.world-status{text-align:center;margin:2px 0 8px}
.world-status .w{font-family:var(--caps);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-hi)}
.world-status .s{font-size:12px;color:var(--txt-dim);margin-top:2px}
.world-status .s b{color:#63d38a;font-weight:400}
.world-status .s .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#63d38a;
  box-shadow:0 0 8px #63d38a;margin-right:5px;vertical-align:middle}
.minimap{position:relative;border-radius:2px;overflow:hidden;height:150px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(201,159,79,.3),inset 0 0 30px rgba(0,0,0,.6)}
.minimap svg{width:100%;height:100%;display:block;background:radial-gradient(circle at 50% 40%,#2a3b3f,#0d1416)}
.minimap .zoom{position:absolute;right:6px;bottom:6px;width:22px;height:22px;border-radius:2px;
  display:grid;place-items:center;color:var(--gold-hi);font-size:12px;
  background:rgba(8,6,4,.8);box-shadow:inset 0 0 0 1px rgba(201,159,79,.4)}

.battles{display:flex;flex-direction:column;gap:6px;overflow:hidden}
.battle{display:flex;gap:9px;align-items:center;padding:7px 8px;border-radius:2px;
  background:rgba(255,255,255,.018);box-shadow:inset 0 0 0 1px rgba(201,159,79,.1)}
.battle:hover{background:rgba(201,159,79,.05)}
.battle img{width:34px;height:34px;flex:none;border-radius:2px;object-fit:cover;
  box-shadow:inset 0 0 0 1px rgba(201,159,79,.3)}
.battle .b1{font-size:13px;color:var(--txt);line-height:1.15}
.battle .b2{font-family:var(--caps);font-size:10px;color:var(--txt-mute);margin-top:2px}
.battle .b2 .g{color:var(--red-hi)}
.spacer{flex:1;min-height:0}

/* ============================================================
   TOP MENU BAR (spans center + right)
   ============================================================ */
.menubar{position:absolute;top:22px;left:280px;right:16px;height:44px;z-index:20;
  display:flex;align-items:center;gap:2px;padding:0 6px;border-radius:2px;
  background:linear-gradient(180deg,rgba(26,18,10,.9),rgba(10,7,5,.92));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(201,159,79,.16),0 4px 14px rgba(0,0,0,.5)}
.menu-item{display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:2px;
  font-family:var(--caps);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:12px;
  color:var(--gold-dim);transition:.14s;white-space:nowrap}
.menu-item img{width:20px;height:20px;filter:drop-shadow(0 1px 1px #000)}
.menu-item:hover{color:var(--gold-hi);background:rgba(201,159,79,.08)}
.menu-item.login{margin-left:auto;color:#ffd9b0;
  background:linear-gradient(180deg,#9a2016,#3d0b08);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.5),inset 0 0 0 2px rgba(210,120,70,.5)}
.menu-item.login:hover{filter:brightness(1.15);color:#fff}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;border-radius:2px;overflow:hidden;flex:none;height:352px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(201,159,79,.22),0 6px 22px rgba(0,0,0,.5)}
.hero img.art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.hero .veil{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(6,4,3,.94) 6%,rgba(6,4,3,.35) 44%,rgba(6,4,3,.55) 100%)}
.hero .shine{position:absolute;inset:-40% -20%;pointer-events:none;
  background:linear-gradient(110deg,transparent 44%,rgba(255,225,165,.07) 49%,transparent 55%);
  transform:translateX(-70%);animation:shine 12s ease-in-out infinite}
@keyframes shine{0%,70%{transform:translateX(-70%)}86%,100%{transform:translateX(70%)}}
.hero-body{position:relative;z-index:2;max-width:460px;padding:34px 30px}
.hero-body h1{font-family:var(--disp);font-weight:400;line-height:1;font-size:44px;margin:0 0 14px}
.hero-body h1 b{display:block;font-weight:400}
.hero-body h1 .a{color:var(--red-hi);text-shadow:0 2px 16px rgba(180,30,20,.5)}
.hero-body p{font-size:15px;color:var(--txt-dim);margin:0 0 20px;max-width:400px;line-height:1.5}
.hero-cta{display:flex;flex-direction:column;gap:9px;max-width:250px}

/* ============================================================
   STAT STRIP
   ============================================================ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:none}
.stat{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:2px;
  background:linear-gradient(180deg,rgba(30,21,12,.8),rgba(11,8,5,.85));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(201,159,79,.14)}
.stat img{width:26px;height:26px;flex:none;filter:drop-shadow(0 1px 1px #000)}
.stat .k{font-family:var(--caps);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-dim)}
.stat .v{font-family:var(--caps);font-size:19px;font-weight:700;line-height:1;margin-top:1px}

/* ============================================================
   RATING TABLES (3 across)
   ============================================================ */
.tables{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:none}
.rtable{width:100%;border-collapse:collapse;font-size:13px}
.rtable th{font-family:var(--caps);font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gold-dim);text-align:left;padding:0 4px 6px;font-weight:600;border-bottom:1px solid rgba(201,159,79,.16)}
.rtable td{padding:5.5px 4px;border-bottom:1px solid rgba(201,159,79,.08);vertical-align:middle}
.rtable tr:last-child td{border-bottom:0}
.rtable .rk{color:var(--gold);width:16px;font-family:var(--caps);font-weight:700}
.rtable .emb{width:22px}
.rtable .emb img{width:20px;height:20px;object-fit:contain}
.rtable .nm{color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:118px}
.rtable .mid{color:var(--txt-mute);font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px}
.rtable .sc{text-align:right;color:var(--gold-hi);font-family:var(--caps);font-size:12px;white-space:nowrap}
.rtable tbody tr:hover td{background:rgba(201,159,79,.045)}

/* ============================================================
   FEATURE CARDS (5 across)
   ============================================================ */
.features{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;flex:none}
.fcard{position:relative;border-radius:2px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(201,159,79,.2);transition:.18s}
.fcard:hover{box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px rgba(244,220,160,.5)}
.fcard .pic{position:relative;height:96px}
.fcard .pic img{width:100%;height:100%;object-fit:cover;transition:.4s}
.fcard:hover .pic img{transform:scale(1.06)}
.fcard .pic::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(6,4,3,.82) 0%,rgba(6,4,3,.2) 34%,rgba(11,8,5,.94) 100%)}
.fcard .ft{position:absolute;left:0;right:0;top:8px;text-align:center;z-index:2;
  font-family:var(--caps);font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;
  text-shadow:0 2px 8px #000;padding:0 6px;line-height:1.15}
.fcard .fb{background:linear-gradient(180deg,rgba(20,14,8,.95),rgba(9,6,4,.97));
  padding:9px 8px 10px;text-align:center;flex:1;display:flex;flex-direction:column;justify-content:space-between}
.fcard .fb p{font-size:11px;color:var(--txt-mute);margin:0 0 8px;line-height:1.35}

/* ============================================================
   RIGHT RAIL — news / pet / quick links
   ============================================================ */
.newsitem{display:flex;gap:9px;padding:8px 6px;border-bottom:1px solid rgba(201,159,79,.1)}
.newsitem:first-child{padding-top:2px}
.newsitem img{width:40px;height:40px;flex:none;border-radius:2px;object-fit:cover;
  box-shadow:inset 0 0 0 1px rgba(201,159,79,.35)}
/* инлайн-иконки внутри текста новости (значки бойцов) — мелкие, без рамки */
.newsitem small .ni{width:1.05em;height:1.05em;flex:none;object-fit:contain;vertical-align:-2px;
  margin-right:3px;display:inline-block;box-shadow:none;border:0;border-radius:0;background:none}
.newsitem .nb{min-width:0}
.tagbadge{display:inline-block;font-family:var(--caps);font-size:8px;font-weight:700;letter-spacing:.08em;
  padding:2px 6px;border-radius:2px;text-transform:uppercase;margin-bottom:3px;
  background:linear-gradient(180deg,#9a2016,#5a0f0a);color:#ffcdb8;box-shadow:inset 0 0 0 1px rgba(255,110,86,.35)}
.tagbadge.evt{background:linear-gradient(180deg,#4a2a86,#2a1650);color:#d6c2ff;box-shadow:inset 0 0 0 1px rgba(150,110,220,.4)}
.tagbadge.season{background:linear-gradient(180deg,#125a52,#08221f);color:#a8f0e8;box-shadow:inset 0 0 0 1px rgba(63,200,190,.4)}
.tagbadge.balance{background:linear-gradient(180deg,#7a5a1c,#3a2c0e);color:#f4dca0;box-shadow:inset 0 0 0 1px rgba(201,159,79,.4)}
.newsitem b{display:block;color:var(--gold-hi);font-size:12.5px;line-height:1.2;font-weight:600}
.newsitem small{display:block;color:var(--txt-mute);font-size:10.5px;line-height:1.28;margin-top:2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.newsitem .when{font-family:var(--caps);font-size:9.5px;color:var(--txt-mute);margin-top:3px}
.newsitem .when em{color:var(--teal);font-style:normal}

.pet-day{text-align:center;display:flex;flex-direction:column;align-items:center}
.pet-day .frame{position:relative;width:122px;height:122px;margin:2px auto 7px;border-radius:3px;overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 2px var(--rc,rgba(201,159,79,.5)),0 0 22px color-mix(in srgb,var(--rc,#c99f4f) 30%,transparent)}
.pet-day .frame img{width:100%;height:100%;object-fit:cover;
  background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--rc,#c99f4f) 22%,transparent),#0b0806)}
.pet-day .pn{font-family:var(--caps);font-size:17px;font-weight:700;color:var(--gold-hi)}
.pet-day .pr{font-family:var(--caps);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--rc,var(--gold));margin-top:2px}
.pet-day .pmeta{font-size:12px;color:var(--txt-dim);margin-top:6px}

.qlinks{display:flex;flex-direction:column;gap:2px}
.qlink{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:2px;transition:.14s;
  border-bottom:1px solid rgba(201,159,79,.08)}
.qlink:last-child{border-bottom:0}
.qlink:hover{background:rgba(201,159,79,.06)}
.qlink img{width:22px;height:22px;flex:none;filter:drop-shadow(0 1px 1px #000)}
.qlink span{font-size:13px;color:var(--txt-dim)}
.qlink:hover span{color:var(--gold-hi)}

/* rarity colors for pet frame */
.rc-common{--rc:#9aa0a6} .rc-uncommon{--rc:#5fb96b} .rc-rare{--rc:#4a8fe0}
.rc-epic{--rc:#b558e0} .rc-legendary{--rc:#e6a53c} .rc-mythic{--rc:#e0564a}

/* ============================================================
   toolbar + modal + toast (reused)
   ============================================================ */
.toolbar{position:fixed;right:16px;bottom:16px;z-index:50;display:flex;gap:8px}
.toolbar button{width:40px;height:36px;border-radius:2px;color:var(--gold-hi);
  background:linear-gradient(180deg,#241a10,#0e0a07);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(201,159,79,.34)}
.toolbar button:hover{color:#fff}

.modal{position:fixed;inset:0;z-index:60;display:none;place-items:center;padding:18px;
  background:rgba(3,2,2,.84);backdrop-filter:blur(6px)}
.modal.open{display:grid}
.modal-box{position:relative;display:flex;flex-direction:column;width:min(520px,100%);max-height:88vh;overflow:hidden;border-radius:3px;
  background:radial-gradient(circle at 50% 0,rgba(126,36,23,.2),transparent 36%),linear-gradient(150deg,#17110b,#080705 72%);
  box-shadow:0 40px 120px #000,inset 0 0 0 2px #090705,inset 0 0 0 4px rgba(201,159,79,.3)}
.modal-scroll{flex:1 1 auto;overflow:auto;padding:30px 30px 10px}
.modal-foot{flex:none;padding:14px 30px 22px;border-top:1px solid rgba(201,159,79,.14)}
.modal-foot:empty{display:none}
.modal-foot .gbtn,.modal-foot .cta{margin-top:0}
.modal-close{position:absolute;right:14px;top:9px;z-index:2;color:#ad9270;font-size:28px;line-height:1}
.modal-close:hover{color:#fff}
.modal .emblem{width:50px;height:50px;margin:0 auto 14px;display:grid;place-items:center;
  transform:rotate(45deg);color:var(--red-hi);box-shadow:inset 0 0 0 1px rgba(201,159,79,.5)}
.modal .emblem span{transform:rotate(-45deg)}
.modal .kicker{text-align:center;font-family:var(--caps);color:var(--gold-dim);text-transform:uppercase;
  font-size:10px;letter-spacing:.18em;margin:0 0 6px}
.modal .kicker:empty{display:none}
.modal h2{text-align:center;font-family:var(--disp);font-weight:400;color:var(--gold-hi);font-size:26px;margin:0 0 14px}
.modal .body{color:var(--txt-dim);line-height:1.55}
.modal .body p{margin:0 0 12px}
.modal .form{display:grid;gap:12px;margin-top:8px}
.modal .form label{display:grid;gap:6px;font-family:var(--caps);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold-dim)}
.modal .form input,.modal .form select{padding:11px 12px;border-radius:2px;color:var(--txt);
  background:#090705;box-shadow:inset 0 0 0 1px rgba(201,159,79,.3);outline:0;font-family:var(--serif)}
.modal .form input:focus{box-shadow:inset 0 0 0 1px var(--gold)}
.modal-thumb{width:120px;height:120px;margin:0 auto 14px;border-radius:3px;object-fit:contain;background:#0b0806;
  box-shadow:inset 0 0 0 2px rgba(201,159,79,.4)}
.statline{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:12px 0}
.statline .s{font-family:var(--caps);font-size:11px;padding:5px 10px;border-radius:20px;color:var(--txt-dim);
  box-shadow:inset 0 0 0 1px rgba(201,159,79,.25)}
.statline .s b{color:var(--gold-hi)}

.toast{position:fixed;left:50%;bottom:26px;z-index:80;transform:translate(-50%,30px);opacity:0;pointer-events:none;
  padding:12px 18px;border-radius:2px;background:rgba(10,7,4,.95);color:var(--gold-hi);
  box-shadow:0 15px 50px #000,inset 0 0 0 2px rgba(201,159,79,.35);transition:.25s;font-family:var(--caps);font-size:13px}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media(prefers-reduced-motion:reduce){.hero .shine{animation:none}}

/* ---- live: событие таверны (правый блок) ---- */
.event-now{text-align:center;display:flex;flex-direction:column;align-items:center}
.event-now .frame{position:relative;width:112px;height:112px;margin:2px auto 7px;border-radius:3px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-size:52px;
  box-shadow:inset 0 0 0 2px rgba(201,159,79,.4);background:radial-gradient(circle at 50% 35%,rgba(201,159,79,.18),rgba(10,7,5,.6))}
.event-now .frame img{width:72%;height:72%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}
.event-now .en{font-family:var(--caps);font-size:16px;font-weight:700;color:var(--gold-hi);line-height:1.2}
.event-now .pr{font-family:var(--caps);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-top:4px}
.event-now.idle .etxt{font-size:12px;color:var(--txt-dim);line-height:1.5;padding:12px 4px}
/* ---- live: иконка боя + пустые состояния ---- */
.battle .bico{width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;font-size:18px;
  color:var(--red-hi);border-radius:2px;box-shadow:inset 0 0 0 1px rgba(201,159,79,.25);background:rgba(201,159,79,.05)}
.battle .b1 .vs{color:var(--txt-mute);font-size:11px;font-family:var(--caps);text-transform:uppercase;margin:0 3px}
.battle.empty,.newsitem.empty{font-size:12px;color:var(--txt-mute);padding:10px 8px;text-align:center}

/* ---- бренд-иконка вместо крест-SVG ---- */
.crest-img{width:60px;height:60px;object-fit:contain;margin:2px auto 2px;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
/* ---- сообщество/площадки ---- */
.qlink.soon{opacity:.6;cursor:default}
.qlink.soon em{margin-left:auto;font-style:normal;font-size:9px;font-family:var(--caps);text-transform:uppercase;letter-spacing:.06em;color:var(--txt-mute);border:1px solid rgba(201,159,79,.3);border-radius:3px;padding:1px 5px}
/* ---- битвы за точки: длинный текст в 2 строки ---- */
.battle .b1{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* иконка битвы за точки (вместо смайла) */
.battle .bico img{width:20px;height:20px;object-fit:contain;filter:drop-shadow(0 1px 1px #000)}

/* модалка «Битвы за точки» — летопись */
.chron{display:flex;flex-direction:column}
.chron-row{display:flex;gap:11px;align-items:center;padding:10px 2px;border-bottom:1px solid rgba(201,159,79,.16)}
.chron-row:last-child{border-bottom:0}
.chron-row img{width:24px;height:24px;flex:none;object-fit:contain;filter:drop-shadow(0 1px 1px #000)}
.chron-row span{font-size:14px;color:var(--txt);line-height:1.35}

/* ============================================================
   Страница «Новости» — та же оболочка портала (stage/menubar/brand).
   Панель новостей занимает центр+правый рейл; текст крупнее и не обрезан.
   ============================================================ */
.brand-link{display:block;text-decoration:none;color:inherit}

/* --- центральная лента: крупный заголовок + карточки новостей --- */
.news-col > .op{padding:16px 18px 18px}
.news-col .op-h{margin-bottom:14px;padding-bottom:10px}
.news-col .op-h .t{font-size:19px;letter-spacing:.14em}
.news-col .op-h.center .t::before,.news-col .op-h.center .t::after{width:6px;height:6px;margin:0 13px;top:-3px}

.news-col #news-full{display:flex;flex-direction:column;gap:13px;overflow:visible}
.news-col #news-full .newsitem{position:relative;display:block;padding:15px 18px 16px;border-bottom:none;
  border:1px solid rgba(201,159,79,.26);border-left:3px solid var(--gold);border-radius:3px;
  background:linear-gradient(180deg,rgba(32,25,16,.55),rgba(14,11,8,.5));
  box-shadow:inset 0 1px 0 rgba(255,225,170,.05),0 3px 10px rgba(0,0,0,.4)}
.news-col #news-full .newsitem:first-child{padding-top:15px}
.news-col #news-full .nhead{position:absolute;top:15px;right:18px;margin:0}
.news-col #news-full .newsitem .when{font-family:var(--caps);font-size:12.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gold-hi);margin:0;white-space:nowrap}
.news-col #news-full .newsitem b{display:block;color:var(--gold-hi);font-size:19px;line-height:1.22;
  font-weight:700;margin-top:0;padding-right:96px}
.news-col #news-full .newsitem small{display:block;color:var(--txt);font-size:14.5px;line-height:1.6;
  margin-top:9px;-webkit-line-clamp:unset;max-height:none;overflow:visible;white-space:normal}
.news-col #news-full .newsitem small .ni{width:1.05em;height:1.05em;object-fit:contain;
  vertical-align:-2px;margin-right:3px;display:inline-block;
  box-shadow:none;border:0;border-radius:0;background:none}
.news-col #news-full .newsitem.empty{padding:22px;text-align:center;border-left-color:rgba(201,159,79,.26)}

/* ============================================================
   Страница «Вики» — оболочка портала (рейлы как на главной), вики в центре.
   Вид 1: заголовок категории + кнопки-подтемы. Вид 2: статья + «назад».
   ============================================================ */
.wiki-main{min-width:0}
.wiki-main > .op{padding:16px 18px 18px}
.wiki-title{margin:0 0 16px}
.wiki-title .t{font-size:19px;letter-spacing:.14em}

/* --- список тем (кнопки) --- */
.wcat{margin-bottom:24px}
.cat-head{display:flex;align-items:center;gap:12px;margin:0 0 13px}
.cat-head .dm{width:9px;height:9px;background:var(--red);transform:rotate(45deg);box-shadow:0 0 8px rgba(190,40,25,.6);flex:none}
.cat-head h2{font-family:var(--disp);font-weight:400;font-size:23px;color:var(--gold-hi);text-transform:uppercase;letter-spacing:.03em;margin:0}
.cat-head .rule{flex:1;height:1px;background:linear-gradient(90deg,var(--line-gold),transparent)}
.wcat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:11px}
.wtopic-btn{display:flex;flex-direction:column;gap:5px;text-align:left;padding:13px 15px;border-radius:3px;cursor:pointer;
  border:1px solid var(--line-gold);border-left:3px solid var(--gold);
  background:linear-gradient(180deg,rgba(32,25,16,.55),rgba(14,11,8,.5));
  box-shadow:0 3px 10px rgba(0,0,0,.35);transition:transform .12s,box-shadow .15s}
.wtopic-btn:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--gold),0 4px 14px rgba(0,0,0,.45)}
.wtb-t{font-family:var(--caps);font-weight:700;font-size:15px;color:var(--gold-hi);letter-spacing:.01em;line-height:1.25}
.wtb-s{font-size:12.5px;color:var(--txt-mute);line-height:1.42;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* --- статья --- */
.wiki-view-article{padding:0}
.wback{display:inline-flex;align-items:center;gap:6px;font-family:var(--caps);text-transform:uppercase;letter-spacing:.07em;
  font-size:11px;font-weight:700;color:var(--gold-hi);padding:8px 14px;border-radius:3px;cursor:pointer;
  background:linear-gradient(180deg,#20170e,#0e0a07);box-shadow:inset 0 0 0 2px var(--line-gold);transition:.15s}
.wback:hover{box-shadow:inset 0 0 0 2px var(--gold);color:#fff3d6}
.wback span{font-size:17px;line-height:1;margin-top:-1px}
.wa-cat{font-family:var(--caps);text-transform:uppercase;letter-spacing:.18em;font-size:10.5px;color:var(--gold-dim);margin:18px 0 4px}
.wa-title{font-family:var(--disp);font-weight:400;font-size:28px;line-height:1.16;margin:0 0 14px}
.wa-summary{color:var(--txt-dim);font-size:16px;font-style:italic;margin:0 0 18px;padding-left:14px;border-left:2px solid var(--line-gold)}

.wfacts{margin:0 0 18px;padding:13px 15px;border-radius:3px;background:rgba(201,159,79,.05);box-shadow:inset 0 0 0 1px var(--line-gold)}
.wfacts .fh{font-family:var(--caps);text-transform:uppercase;letter-spacing:.1em;font-size:10px;color:var(--gold-dim);margin:0 0 8px}
.wfacts ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.wfacts li{position:relative;padding-left:18px;font-size:13.5px;color:var(--txt);line-height:1.5}
.wfacts li::before{content:"◆";position:absolute;left:0;top:2px;color:var(--gold);font-size:9px}
.wsec{margin:0 0 18px}
.wsec h4{font-family:var(--caps);font-weight:600;font-size:15.5px;color:var(--gold);margin:0 0 8px;
  padding-bottom:5px;border-bottom:1px solid rgba(201,159,79,.14);letter-spacing:.02em}
.wsec p{margin:0 0 11px;font-size:14.5px;line-height:1.62;color:var(--txt)}
.wsec ul{margin:0 0 12px;padding-left:2px;list-style:none;display:grid;gap:5px}
.wsec li{position:relative;padding-left:20px;font-size:14.5px;line-height:1.55;color:var(--txt)}
.wsec li::before{content:"—";position:absolute;left:2px;color:var(--gold-dim)}
.wsec b,.wsec strong{color:var(--gold-hi);font-weight:600}
.wsec code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;color:var(--teal);
  background:rgba(55,201,189,.08);padding:1px 5px;border-radius:3px}
.wempty{padding:40px;text-align:center;color:var(--txt-mute)}

/* --- картинки в статьях вики --- */
.wa-banner{margin:2px 0 20px;border-radius:4px;overflow:hidden;border:1px solid var(--line-gold);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.5),0 6px 20px rgba(0,0,0,.45)}
.wa-banner img{display:block;width:100%;max-height:300px;object-fit:contain;
  background:radial-gradient(120% 90% at 50% 20%,#1a1209,#0a0705)}
.wa-banner figcaption{padding:7px 12px;font-size:12px;color:var(--txt-dim);font-style:italic;text-align:center;
  background:linear-gradient(180deg,rgba(20,14,8,.7),rgba(11,8,5,.7))}
.w-figs{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:8px 0 18px}
.w-fig{margin:0;max-width:230px;text-align:center}
.w-fig img{max-width:100%;max-height:150px;object-fit:contain;border-radius:3px;padding:8px;
  background:linear-gradient(180deg,rgba(30,22,14,.5),rgba(11,8,5,.5));box-shadow:inset 0 0 0 1px var(--line-gold)}
.w-fig figcaption{margin-top:6px;font-size:12px;color:var(--txt-mute);font-style:italic;line-height:1.35}
.wa-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:22px 0 4px}
.wa-gallery figure{margin:0;text-align:center}
.wa-gallery img{width:100%;height:120px;object-fit:contain;border-radius:3px;padding:8px;
  background:linear-gradient(180deg,rgba(30,22,14,.5),rgba(11,8,5,.5));box-shadow:inset 0 0 0 1px var(--line-gold)}
.wa-gallery figcaption{margin-top:5px;font-size:11.5px;color:var(--txt-mute);font-style:italic}

/* ============================================================
   WIKI — кнопка «Редактировать» + отрисовка пользовательского HTML
   ============================================================ */
.wa-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.wa-edit{font-family:var(--caps);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:11px;
  color:var(--gold-hi);padding:8px 14px;border-radius:3px;cursor:pointer;
  background:linear-gradient(180deg,#241a10,#0e0a07);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(201,159,79,.34)}
.wa-edit:hover{color:#fff3d6;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px var(--gold)}
/* статья, написанная пользователем (произвольный HTML) */
.wa-body{color:var(--txt);line-height:1.62;overflow:hidden}
.wa-body::after{content:"";display:block;clear:both}
.wa-body h2{font-family:var(--disp);font-weight:400;color:var(--gold-hi);font-size:24px;margin:20px 0 10px}
.wa-body h3{font-family:var(--caps);font-weight:700;color:var(--gold);font-size:18px;margin:18px 0 8px;
  padding-bottom:5px;border-bottom:1px solid rgba(201,159,79,.16)}
.wa-body h4{font-family:var(--caps);font-weight:600;color:var(--gold);font-size:15px;margin:14px 0 6px}
.wa-body p{margin:0 0 11px}
.wa-body ul,.wa-body ol{margin:0 0 12px;padding-left:22px}
.wa-body li{margin:0 0 5px}
.wa-body b,.wa-body strong{color:var(--gold-hi)}
.wa-body a{color:var(--teal);text-decoration:underline}
.wa-body code,.wa-body pre{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--teal);
  background:rgba(55,201,189,.08);padding:1px 5px;border-radius:3px}
.wa-body pre{display:block;padding:12px 14px;overflow:auto;white-space:pre-wrap}
.wa-body blockquote{margin:0 0 12px;padding:8px 16px;border-left:3px solid var(--gold);
  background:rgba(201,159,79,.06);color:var(--txt-dim);font-style:italic}
.wa-body hr{border:0;height:1px;background:linear-gradient(90deg,transparent,var(--line-gold),transparent);margin:18px 0}
.wa-body img{max-width:100%;height:auto}
.wa-body figure{margin:16px 0}
.wa-body figure img{width:100%}
.wa-body figcaption{margin-top:6px;font-size:12px;color:var(--txt-mute);font-style:italic}

/* ============================================================
   WIKI EDITOR — полноэкранный WYSIWYG (вне масштабируемой сцены)
   ============================================================ */
body.wedit-open{overflow:hidden}
.wedit{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;
  background:radial-gradient(120% 90% at 50% -10%,#241209,#0b0705 55%,#040302 90%)}
.wedit-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 18px;flex:none;
  background:linear-gradient(180deg,rgba(20,14,8,.96),rgba(9,6,4,.9));border-bottom:1px solid var(--line-gold)}
.wedit-bar-l{display:flex;align-items:center;gap:14px;flex:1;min-width:0}
.wedit-badge{font-family:var(--caps);text-transform:uppercase;letter-spacing:.1em;font-size:11px;color:var(--gold-dim);white-space:nowrap}
.wedit-title{flex:1;min-width:0;max-width:640px;font-family:var(--disp);font-size:24px;color:var(--gold-hi);
  background:#0b0806;border-radius:3px;padding:9px 14px;border:0;outline:0;box-shadow:inset 0 0 0 1px var(--line-gold)}
.wedit-title:focus{box-shadow:inset 0 0 0 1px var(--gold)}
.wedit-actions{display:flex;gap:8px;flex:none}
.wedit-actions button{font-family:var(--caps);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:12px;
  padding:10px 16px;border-radius:3px;cursor:pointer;color:var(--gold-hi);
  background:linear-gradient(180deg,#241a10,#0e0a07);box-shadow:inset 0 0 0 2px var(--line-gold)}
.wedit-actions button:hover{box-shadow:inset 0 0 0 2px var(--gold)}
.wedit-actions .we-save{color:#0c0906;background:linear-gradient(180deg,#f4dca0,#c99f4f);box-shadow:none;font-weight:800}
.wedit-actions .we-save:hover{filter:brightness(1.08)}
.wedit-actions .we-cancel{color:var(--txt-dim)}

/* toolbar */
.wedit-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:8px 14px;flex:none;align-items:center;
  background:rgba(12,9,6,.92);border-bottom:1px solid var(--line-gold)}
.wtb-g{display:flex;gap:3px;align-items:center;padding-right:6px;margin-right:2px;border-right:1px solid rgba(201,159,79,.15)}
.wtb-g:last-child{border-right:0}
.wtb-b{min-width:32px;height:32px;padding:0 9px;border-radius:3px;cursor:pointer;color:var(--txt);font-size:14px;
  background:linear-gradient(180deg,#1c140c,#0e0a07);box-shadow:inset 0 0 0 1px var(--line-gold)}
.wtb-b:hover{color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold)}
.wtb-img,.wtb-b:has(b),.wtb-b:has(i){font-family:var(--caps);font-size:12px;font-weight:600}
.wtb-sel{height:32px;border-radius:3px;color:var(--txt);font-family:var(--serif);font-size:13px;padding:0 8px;cursor:pointer;
  background:#140e08;box-shadow:inset 0 0 0 1px var(--line-gold);outline:0;border:0}
.wtb-cwrap{position:relative}
.wtb-color{font-weight:800}
.wtb-pop{position:absolute;top:38px;left:0;z-index:20;display:none;gap:5px;flex-wrap:wrap;width:132px;padding:8px;border-radius:4px;
  background:#140e08;box-shadow:0 12px 34px #000,inset 0 0 0 1px var(--gold-dim)}
.wtb-pop.open{display:flex}
.wtb-sw{width:24px;height:24px;border-radius:3px;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.5)}
.wtb-sw:hover{outline:2px solid var(--gold)}
.wtb-cinput{width:100%;height:26px;margin-top:4px;background:none;border:0;cursor:pointer}
.wtb-imgmenu{width:170px;flex-direction:column}
.wtb-mi{text-align:left;padding:8px 10px;border-radius:3px;cursor:pointer;color:var(--txt);font-family:var(--serif);font-size:13px;background:none}
.wtb-mi:hover{background:rgba(201,159,79,.1);color:var(--gold-hi)}

/* editing surface */
.wedit-scroll{flex:1;overflow:auto;padding:26px 18px 80px}
.wedit-page{width:min(100% - 8px,860px);margin-inline:auto}
.wedit-field{display:block;margin-bottom:16px}
.wedit-field span{display:block;font-family:var(--caps);text-transform:uppercase;letter-spacing:.08em;font-size:10px;color:var(--gold-dim);margin-bottom:5px}
.wedit-summary{width:100%;font-family:var(--serif);font-size:15px;color:var(--txt);background:#0b0806;border:0;outline:0;
  border-radius:3px;padding:10px 13px;box-shadow:inset 0 0 0 1px var(--line-gold);resize:vertical}
.wedit-summary:focus{box-shadow:inset 0 0 0 1px var(--gold)}
.wedit-doc{min-height:60vh;padding:26px 30px;border-radius:4px;outline:0;font-size:16px;
  background:linear-gradient(180deg,rgba(26,19,11,.6),rgba(11,8,5,.72));box-shadow:inset 0 0 0 1px var(--line-gold)}
.wedit-doc:focus{box-shadow:inset 0 0 0 1px var(--gold)}
.wedit-doc img{cursor:pointer}
.wedit-doc img.wm-sel{outline:2px solid var(--gold);outline-offset:2px}

/* floating image controls */
.wedit-imgbar{position:fixed;z-index:10001;display:none;align-items:center;gap:5px;padding:6px 8px;border-radius:4px;
  background:#160f08;box-shadow:0 10px 30px #000,inset 0 0 0 1px var(--gold-dim);font-family:var(--caps);font-size:11px;color:var(--gold-dim)}
.wedit-imgbar span{padding:0 2px;text-transform:uppercase;letter-spacing:.05em}
.wedit-imgbar button{min-width:28px;height:26px;padding:0 7px;border-radius:3px;cursor:pointer;color:var(--txt);font-size:12px;
  background:linear-gradient(180deg,#241a10,#0e0a07);box-shadow:inset 0 0 0 1px var(--line-gold)}
.wedit-imgbar button:hover{color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold)}

/* game-assets picker */
.wedit-assets{position:fixed;inset:0;z-index:10002;display:grid;place-items:center;padding:20px;background:rgba(3,2,2,.8);backdrop-filter:blur(5px)}
.wedit-assets-box{width:min(860px,100%);max-height:82vh;display:flex;flex-direction:column;border-radius:5px;
  background:linear-gradient(160deg,#17110b,#0a0705);box-shadow:0 40px 120px #000,inset 0 0 0 2px var(--gold-dim)}
.wedit-assets-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line-gold)}
.wedit-assets-h b{font-family:var(--disp);font-size:20px;color:var(--gold-hi)}
.wa-x{font-size:24px;color:var(--gold-dim);cursor:pointer;background:none;border:0;line-height:1}
.wa-x:hover{color:#fff}
.wedit-assets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;padding:16px;overflow:auto}
.wedit-asset{display:flex;flex-direction:column;gap:6px;padding:8px;border-radius:4px;cursor:pointer;
  background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--line-gold)}
.wedit-asset:hover{box-shadow:inset 0 0 0 1px var(--gold)}
.wedit-asset img{width:100%;height:78px;object-fit:contain}
.wedit-asset span{font-size:11px;color:var(--txt-mute);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:640px){
  .wedit-bar{flex-wrap:wrap}
  .wedit-title{font-size:19px}
  .wedit-doc{padding:18px}
}

/* ---- редактор: сброс цвета в палитре ---- */
.wtb-none{display:block;width:100%;margin-bottom:6px;padding:6px 8px;border-radius:3px;cursor:pointer;
  font-family:var(--serif);font-size:12px;color:var(--txt-dim);text-align:left;
  background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px var(--line-gold)}
.wtb-none:hover{color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold)}

/* ---- выбор картинок из игры: категории + поиск (переопределяет старое) ---- */
.wedit-assets-box{width:min(1040px,100%);max-height:88vh}
.wedit-assets-h{gap:12px}
.wedit-assets-h b{flex:none}
.wedit-assets-search{flex:1;min-width:120px;max-width:420px;font-family:var(--serif);font-size:14px;color:var(--txt);
  background:#0b0806;border:0;outline:0;border-radius:3px;padding:9px 12px;box-shadow:inset 0 0 0 1px var(--line-gold)}
.wedit-assets-search:focus{box-shadow:inset 0 0 0 1px var(--gold)}
.wedit-assets-cnt{font-family:var(--caps);font-size:11px;color:var(--txt-mute);white-space:nowrap}
.wedit-assets-cats{display:flex;flex-wrap:wrap;gap:5px;padding:12px 16px;max-height:118px;overflow:auto;
  border-bottom:1px solid var(--line-gold)}
.wa-chip{font-family:var(--caps);font-size:11px;letter-spacing:.03em;color:var(--txt-dim);cursor:pointer;
  padding:6px 10px;border-radius:3px;background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--line-gold);white-space:nowrap}
.wa-chip em{font-style:normal;color:var(--txt-mute);font-size:10px}
.wa-chip:hover{color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold)}
.wa-chip.active{color:#0c0906;background:linear-gradient(180deg,#f4dca0,#c99f4f);box-shadow:none;font-weight:700}
.wa-chip.active em{color:#5a4415}
.wedit-assets-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
.wa-none-found{grid-column:1/-1;text-align:center;color:var(--txt-mute);padding:40px;font-style:italic}

/* редактор: активное состояние кнопок начертания/списков/выравнивания */
.wtb-b.is-active{color:#0c0906;background:linear-gradient(180deg,#f4dca0,#c99f4f);box-shadow:inset 0 0 0 1px var(--gold)}
.wtb-b.is-active b,.wtb-b.is-active i,.wtb-b.is-active u,.wtb-b.is-active s{color:#0c0906}

/* редактор: числовое поле размера шрифта */
.wtb-size{display:flex;align-items:center;gap:2px;height:32px;padding:0 8px;border-radius:3px;
  background:#140e08;box-shadow:inset 0 0 0 1px var(--line-gold)}
.wtb-num{width:38px;height:26px;background:none;border:0;outline:0;color:var(--txt);font-family:var(--serif);font-size:14px;text-align:center;-moz-appearance:textfield}
.wtb-num::-webkit-outer-spin-button,.wtb-num::-webkit-inner-spin-button{opacity:1;height:20px}
.wtb-px{font-family:var(--caps);font-size:10px;color:var(--txt-mute)}

/* редактор: панель картинки — поле ширины в px + перенос кнопок */
.wedit-imgbar{flex-wrap:wrap;max-width:calc(100vw - 16px)}
.wedit-imgbar .imgbar-num{width:56px;height:24px;background:#0b0806;border:0;outline:0;border-radius:2px;
  color:var(--txt);font-family:var(--serif);font-size:13px;text-align:center;box-shadow:inset 0 0 0 1px var(--line-gold)}

/* ============================================================
   ФУТЕР с юридическими документами + попап документа
   ============================================================ */
.legal-footer{border-top:1px solid var(--line-gold);background:rgba(6,4,3,.72);padding:11px 0}
.legal-in{width:min(100% - 32px,1280px);margin:0 auto;display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;justify-content:space-between}
.legal-copy{font-family:var(--caps);font-size:11px;letter-spacing:.05em;color:var(--txt-mute)}
.legal-links{display:flex;flex-wrap:wrap;gap:6px 20px}
.legal-links a{font-family:var(--caps);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--gold-dim);cursor:pointer}
.legal-links a:hover{color:var(--gold-hi)}

.modal-box.legal-modal{width:min(780px,100%)}
.legal-doc{text-align:left;color:var(--txt-dim);font-size:14px;line-height:1.62}
.legal-doc .legal-sub{color:var(--gold-dim);font-style:italic;margin:0 0 14px}
.legal-doc .legal-date{color:var(--txt-mute);font-style:italic;margin:0 0 14px;font-size:13px}
.legal-doc h3{font-family:var(--caps);color:var(--gold-hi);font-size:16px;margin:20px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--line-gold)}
.legal-doc h4{font-family:var(--caps);color:var(--gold);font-size:14px;margin:14px 0 6px}
.legal-doc p{margin:0 0 9px}
.legal-doc ul{margin:0 0 11px;padding-left:20px}
.legal-doc li{margin:3px 0}
.legal-doc a{color:var(--teal);text-decoration:underline;word-break:break-word}
.legal-doc b{color:var(--gold-hi)}
.legal-doc table{width:100%;border-collapse:collapse;margin:10px 0 14px;font-size:13px}
.legal-doc th,.legal-doc td{border:1px solid var(--line-gold);padding:7px 9px;text-align:left;vertical-align:top}
.legal-doc th{font-family:var(--caps);color:var(--gold-dim);font-size:11px;text-transform:uppercase;letter-spacing:.04em;background:rgba(201,159,79,.06)}
.legal-doc td:last-child{white-space:nowrap;color:var(--gold-hi)}
.legal-doc .legal-req{list-style:none;padding-left:0}
.legal-doc .legal-req li{color:var(--txt)}