/* ==========================================================================
«Подземелье Душ» — стили. Игра только горизонтальная (телефон набок),
опорный размер 844×390. Порядок правил в файле = порядок экранов в игре:
1. Каркас и палитра · боковая навигация · база окон
2. Главный экран: сцена боя, враг, кликер, валюты, таймер и лут
3. Герои: ящик, карточки, рамки редкости, окно героя
4. Осада: список боссов, карточка, бой, магазин атак, победа,
поражение, сундук, недельный топ
5. Лига, арена, бой отрядов
6. Клан и друзья · охота
7. Кладовая · ежедневная награда · магазин с древом арканов · чат
8. Медиа-запрос для низких экранов и заглушка «поверни телефон» — в конце
Одна раскладка, вертикальной больше нет. Медиа-запрос в файле ровно один
(низкие экраны, 379px и меньше) плюс заглушка для портрета.
========================================================================== */
:root{
--bg: #15110d;
--panel: #1f1812;
--panel-light: #2a2118;
--crimson: #a8293f;
--crimson-bright: #d3415a;
--gold: #caa44c;
--gold-bright: #e6c976;
--parchment: #e9ddc3;
--muted: #9c8f7a;
--border: #3a2e20;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#0d0a07;color:var(--parchment);font-family:'Inter',sans-serif;} /* 74-я: чёрные поля вокруг кадра */
body{ position:fixed; inset:0; } /* 74-я: страница не прокручивается и не «пружинит» на телефоне */
/* ===== КАРКАС =====
Игра лежит набок: слева колонка вкладок во всю высоту, справа .app-main со всем остальным.
Все окна и выезжающие панели позиционируются absolute относительно .app — поэтому строка
position:relative обязательна. */
.app{
/* 74-я, его выбор А («как все игры»): игра ВСЕГДА рисуется в кадре 844×390, а на экран ужимается/растягивается целиком
(kadrFit в js/00-api.js: transform scale, по центру, по краям чёрные поля). Внутри — только px от 844×390, никаких vh/vw. */
position:absolute; left:0; top:0;
width:844px;
height:390px;
transform-origin:0 0;
overflow:hidden;
overflow:clip; /* 07.09.2026: hidden всё равно даёт прокрутить контейнер вбок (фокус в скрытом чате, scrollIntoView) — сцена уезжала вправо; clip запрещает прокрутку совсем */
display:flex;
flex-direction:row;
background:
radial-gradient(ellipse at top, rgba(168,41,63,0.12), transparent 60%),
var(--bg);
}
/* Правая колонка: шапка, валюты, души, сцена боя — всё, кроме навигации */
.app-main{
flex:1;
min-width:0;
display:flex;
flex-direction:column;
overflow:hidden;
}
/* Кнопка «Герои» — слева в полосе валют (.cur-row), отдельной шапки больше нет */
.drawer-toggle{
position:relative;
margin-right:auto;
background:var(--panel);
border:1px solid var(--border);
color:var(--gold-bright);
font-size:13px;
line-height:1;
height:26px;
padding:0 9px;
border-radius:8px;
cursor:pointer;
font-family:'Cinzel',serif;
font-weight:700;
display:flex;align-items:center;gap:5px;
}
.drawer-dot{
position:absolute; top:-4px; right:-4px;
width:10px; height:10px;
background:var(--crimson-bright);
border-radius:50%;
border:2px solid var(--bg);
display:none;
}
.drawer-dot.show{display:block;}
.currency{
display:flex;
align-items:center;
gap:6px;
font-family:'JetBrains Mono',monospace;
font-weight:700;
font-size:14px;
color:var(--gold-bright);
background:var(--panel);
border:1px solid var(--border);
border-radius:8px;
padding:6px 10px;
}
.souls-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:8px;
padding:5px 6px 0 16px; /* справа 6px — Клеймо ближе к краю (его слово 10.10.2026, 58-я) */
font-family:'JetBrains Mono',monospace;
font-size:12px;
color:var(--muted);
z-index:2;
}
.souls-row{ position:relative; }
/* «ПУСТЫНЯ · ЭТАЖ N 💀 x / 10» — по центру строки и вне потока: длина душ и номера этажа ничего не сдвигают */
.souls-row .floor-label{ position:absolute; left:50%; top:calc(50% + 2.5px); transform:translate(-50%,-50%); margin:0; white-space:nowrap; }
/* 10.10.2026, его жалоба «на 16000 в Юрском заходит на Перерождение» — сначала сдвигали середину левее (−60px); 58-я, его слово
«этаж более к центру, Перерождение чуть меньше»: строка снова по центру, кнопка Перерождения ужата (8.5px), Клеймо правее;
«ЮРСКИЙ ПЕРИОД · ЭТАЖ 16002 💀 10/10» и кнопка расходятся на ~30px; если всё равно не влезло — ужимает fitFloorLabel (js/05) */
.souls-row .floor-label .kill-counter{ font-size:1em; } /* счётчик ужимается вместе со строкой */
.run-souls{ color:#d0b0ff; }
.run-souls b{ color:#f0e0ff; font-weight:700; }
.relic-quick{
font-family:'Cinzel',serif; font-weight:700; font-size:10px; color:#1a1208;
background:linear-gradient(180deg,#ffd86a,#caa12e); border:1px solid #8a6a1e;
border-radius:8px; padding:4px 8px; cursor:pointer; white-space:nowrap;
display:flex; align-items:center; gap:4px;
}
.relic-quick b{ font-family:'JetBrains Mono',monospace; color:#3a2a08; }
.relic-quick:active{ transform:scale(.95); }
/* Перерождение (09.09.2026): фиолетовая, под цвет ✨ душ, с золотой рамкой и мягким свечением;
margin-left:auto — стоит справа, вплотную к Клейму и ⟳ */
.mini-prestige-btn{
font-family:'Cinzel',serif; font-weight:700; font-size:8.5px; /* 10 → 8.5 (58-я): чтобы длинная строка этажа не заходила на кнопку */ letter-spacing:.02em; color:#f4e8ff;
background:linear-gradient(180deg,#7a44b8,#3e2066); border:1px solid var(--gold);
border-radius:8px; padding:3px 8px; cursor:pointer; white-space:nowrap;
box-shadow:0 0 10px rgba(176,144,255,.35), inset 0 1px 0 rgba(255,255,255,.18);
text-shadow:0 1px 2px rgba(0,0,0,.5);
margin-left:auto;
}
.mini-prestige-btn:disabled{ background:#241c14; color:#6b6354; border-color:var(--border); cursor:not-allowed; box-shadow:none; text-shadow:none; }
.mini-prestige-btn:active{ transform:scale(.95); }
/* ===== Боковая навигация: 5 вкладок слева во всю высоту (в стиле вкладок Лиги) ===== */
.side-nav{ display:flex; flex-direction:column; flex-shrink:0; gap:4px; z-index:6; width:94px;
padding:6px; /* 74-я: вырез учитывает кадр (kadrSafe) */
border-right:1px solid var(--gold); background:linear-gradient(90deg,#1a130c,#0e0a06); box-shadow:6px 0 18px rgba(0,0,0,.5); }
.bn-tab{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
padding:10px 2px; border:1px solid transparent; border-radius:13px; cursor:pointer; color:var(--muted);
background:linear-gradient(180deg,rgba(40,30,20,.5),rgba(16,12,8,.4)); transition:border-color .15s, color .15s, transform .1s; }
.bn-tab .bn-ic{ font-size:27px; line-height:1; filter:grayscale(.25); }
.bn-tab .bn-nm{ font-family:'Cinzel',serif; font-weight:700; font-size:11.5px; letter-spacing:.02em; }
.bn-tab:hover{ border-color:var(--border); color:var(--parchment); }
.bn-tab:active{ transform:scale(.93); }
/* Осада — главная вкладка, подсвечена */
.bn-tab.primary{ background:linear-gradient(180deg,#5c1322,#3a0c16); border-color:var(--gold); color:#fff0d8; }
.bn-tab.primary .bn-ic{ filter:none; }
/* ===== БАЗА ОКОН: затемнение, само окно, крестик, общие подписи =====
Объявлена ЗДЕСЬ, выше всех окон: раньше .promote-modal стояла в конце файла
и перебивала ширину каждого окна, из-за чего их приходилось писать селектором
из двух классов (.promote-modal.siege-win). Теперь достаточно одного класса. */
.modal-backdrop{
position:absolute; inset:0; background:rgba(0,0,0,.6);
opacity:0; pointer-events:none; transition:opacity .2s; z-index:60;
}
.modal-backdrop.show{ opacity:1; pointer-events:auto; }
.promote-modal{
position:absolute; left:50%; top:50%; transform:translate(-50%,-46%) scale(.96);
width:min(300px,86%); background:linear-gradient(180deg,var(--panel-light),#18120d);
border:1px solid var(--gold); border-radius:14px; padding:18px 18px 16px;
z-index:61; text-align:center; opacity:0; pointer-events:none;
box-shadow:0 14px 40px rgba(0,0,0,.7); transition:opacity .2s, transform .2s;
}
.promote-modal.show{ opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); }
.modal-close{ position:absolute; top:8px; right:8px; width:28px; height:28px; border-radius:7px; background:none; border:1px solid var(--border); color:var(--muted); cursor:pointer; }
.pm-title{ font-family:'Cinzel',serif; font-weight:800; font-size:15px; color:var(--gold-bright); text-transform:uppercase; letter-spacing:.05em; margin-bottom:12px; }
.pm-portrait{ width:72px; height:72px; margin:0 auto 8px; }
.pm-name{ font-weight:700; font-size:15px; color:var(--parchment); }
.pm-rarity{ font-size:13px; margin-top:3px; }
.pm-gain{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); margin:10px 0 14px; }
.pm-gain b{ color:var(--gold-bright); }
.pm-btn{
width:100%; font-family:'Cinzel',serif; font-weight:700; font-size:14px; color:#fff;
background:linear-gradient(90deg,#6a2a8a,#a040c0); border:1px solid #c060e0;
border-radius:9px; padding:11px; cursor:pointer;
}
.pm-btn:disabled{ background:#2a2238; color:#6b6354; border-color:var(--border); cursor:not-allowed; }
.pm-hint{ font-size:10.5px; color:var(--crimson-bright); margin-top:8px; min-height:13px; }
/* ===== Сцена боя ===== */
.stage{
--wall1:#1c1610; --wall2:#140f0a; --wall3:#0b0805;
--glow:rgba(202,124,52,0.16);
--tint:rgba(211,65,90,0.12);
position:relative;
flex:1;
display:flex;
flex-direction:column;
align-items:center;
padding:8px 16px 6px;
overflow:hidden;
background:
radial-gradient(120% 80% at 50% -10%, var(--tint), transparent 55%),
linear-gradient(180deg,var(--wall1) 0%, var(--wall2) 55%, var(--wall3) 100%);
transition: background 0.5s ease;
}
.stage::before{ /* факельное свечение по бокам */
content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
background:
radial-gradient(38% 30% at 7% 38%, var(--glow), transparent 70%),
radial-gradient(38% 30% at 93% 38%, var(--glow), transparent 70%);
}
.stage-bg{
position:absolute; inset:0; z-index:0; pointer-events:none;
}
.stage-bg svg{ width:100%; height:100%; display:block; }
/* Сцена лежит набок: этаж, имя и полоска прижаты вверх, монстр берёт всё свободное место
по центру (margin:auto у .enemy), а счётчик урона вынесен в левый нижний угол сцены. */
.stage-inner{
position:relative;
z-index:1;
width:100%;
flex:1;
min-height:0;
display:flex;
flex-direction:column;
align-items:center;
}
.floor-label{
font-family:'Cinzel',serif;
font-size:12px;
letter-spacing:0.08em;
color:#cbbfa8;
text-transform:uppercase;
/* тёмная подложка: на светлой полосе стены надпись иначе сливается с фоном */
background:rgba(8,6,4,.55);
padding:2px 11px;
border-radius:999px;
margin-bottom:3px;
}
.floor-num{color:var(--gold-bright); font-weight:800;}
/* Строка имени (09.09.2026, его выбор из макетов): имя слева, за ним плашки золота, урона героев и урона за тап */
/* 25.09.2026, ЕГО ВЫБОР А «Вплотную» (client/maket-stroka-imeni.html): строка во всю ширину сцены (718px), места закреплены:
«БОСС» — своя ячейка 60px левее имени (у моба невидима, место держит); ИМЯ всегда с 199px — над левым краем полосы
здоровья, место 114px (≈11 знаков, «Адский паук» 98px; длиннее — fitText ужимает до 60 %, «Светлая летучая мышь» → 10,5px = 112px); сразу за именем три цифры
плотно, по 12px между ними. Раньше строка стояла по центру и её ширина шла от длины имени — всё прыгало. */
.monster-row{ align-self:stretch; display:flex; align-items:center; justify-content:flex-start; gap:0;
padding-left:133px; height:24px; margin:0 0 6px; min-width:0; }
#bossTag{ flex:0 0 60px; width:60px; margin-right:6px; padding:2px 0; text-align:center; letter-spacing:0.15em;
visibility:hidden; }
#bossTag.on{ visibility:visible; }
.monster-name{
flex:0 0 114px; width:114px; line-height:24px;
font-family:'Cinzel',serif;
font-size:17px;
font-weight:600;
margin:0;
text-shadow:0 2px 6px rgba(0,0,0,0.8);
text-align:left;
white-space:nowrap; overflow:hidden; min-width:0;
}
/* 23.09.2026, его выбор Ц1 «без рамок»: цифры без подложки и рамки, 13px с тенью; 25.09.2026 (А) — вплотную за именем */
.stat-chip{
flex:0 0 auto; display:inline-flex; align-items:center; gap:4px; margin-left:12px;
font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:800; line-height:1;
padding:0; border-radius:0; white-space:nowrap;
background:none; border:0; color:#f0e0c0; text-shadow:0 2px 4px rgba(0,0,0,.8);
}
.stat-chip .sc-ic{ font-size:12px; }
/* слоты цифр закреплены в px (не в ch): золото 52, урон 84 (с «/сек»), тап 58; длинное («1.50e+1789») ужимает fitText — не прыгает */
#goldVal, #dpsVal, #tapDmg{ display:inline-block; width:52px; text-align:left; white-space:nowrap; overflow:hidden; }
#tapDmg{ width:58px; }
#dpsVal{ width:84px; } /* + «/сек» внутри слота (::after), чтобы при «0» не было дыры до суффикса */
#dpsVal::after{ content:'/сек'; }
.stat-chip.gold{ color:#ffe08a; padding-left:0; }
.stat-chip.dps{ color:#ffd86a; }
.stat-chip.tap{ color:#ff9a7a; }
.boss-tag{
display:inline-block;
font-family:'Cinzel',serif; font-weight:800;
font-size:11px; letter-spacing:0.15em;
color:#1a1410;
background:linear-gradient(90deg,var(--gold),var(--gold-bright));
padding:2px 8px; border-radius:4px;
margin-right:6px; vertical-align:middle;
}
.hp-wrap{
position:relative;
width:100%;
max-width:320px;
height:20px;
background:rgba(15,12,9,0.7);
border:1px solid var(--border);
border-radius:4px;
overflow:hidden;
margin-bottom:4px;
clip-path: polygon(0 0, 97% 0, 100% 50%, 97% 100%, 0 100%, 3% 50%);
}
.hp-fill{
position:absolute;
inset:0;
background:linear-gradient(90deg, #6e1525, var(--crimson-bright));
width:100%;
transition: width 0.18s ease-out;
}
.hp-wrap.boss .hp-fill{ background:linear-gradient(90deg, #7a2410, var(--gold)); }
.hp-text{
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
font-family:'JetBrains Mono',monospace;
font-size:11px;
font-weight:700;
color:#fff;
text-shadow:0 1px 2px rgba(0,0,0,0.6);
z-index:2;
}
/* ===== Враг (2D SVG-спрайт) ===== */
.enemy{
position:relative;
margin:auto 0; /* монстр по центру свободного места между верхним блоком и низом сцены */
width:172px;
height:172px;
display:flex;
align-items:flex-end;
justify-content:center;
cursor:pointer;
user-select:none;
-webkit-tap-highlight-color:transparent;
transition: width .3s ease, height .3s ease;
}
.enemy.boss{ width:210px; height:210px; }
.enemy.die{ animation: enemyDie 0.7s ease-in forwards; }
.enemy.enter{ animation: enemyEnter 0.8s cubic-bezier(.2,.8,.3,1.25); }
.enemy.boss::after{ /* пульсирующая аура босса */
content:''; position:absolute; left:50%; top:46%;
width:210px; height:210px; transform:translate(-50%,-50%);
border-radius:50%;
background:radial-gradient(circle, rgba(230,201,118,0.22), transparent 64%);
animation: bossAura 1.8s ease-in-out infinite;
z-index:0; pointer-events:none;
}
@keyframes bossAura{
0%,100%{transform:translate(-50%,-50%) scale(0.9); opacity:0.5;}
50%{transform:translate(-50%,-50%) scale(1.12); opacity:1;}
}
.enemy-shadow{
position:absolute;
bottom:6px; left:50%;
width:118px; height:20px;
transform:translateX(-50%);
background:radial-gradient(ellipse, rgba(0,0,0,0.55), transparent 70%);
z-index:0;
}
.enemy-sprite{
position:relative;
z-index:1;
width:150px; height:150px;
animation: idleFloat 2.6s ease-in-out infinite;
transition: width .3s ease, height .3s ease;
}
.enemy.boss .enemy-sprite{ width:182px; height:182px; }
.enemy-sprite svg{
width:100%; height:100%; display:block;
filter: drop-shadow(0 5px 6px rgba(0,0,0,0.5));
}
.enemy.boss .enemy-sprite svg{
filter: drop-shadow(0 0 9px rgba(230,201,118,0.55)) drop-shadow(0 5px 6px rgba(0,0,0,0.5));
}
.enemy-sprite.hit{ animation: hitShake 0.18s ease; }
/* коронка над боссом убрана 09.10.2026 (56-я, его слово «убери эту коронку») */
/* ===== ЛОКАЦИИ (09.10.2026, shared/layers.js locations) =====
Панорама — лента из двух одинаковых половин (repeat-x), едет на полширины за круг: transform, не background-position,
чтобы телефон не перерисовывал фон каждый кадр. Площадка — под мобом, top ставит lokPlace() (js/04).
Моб — картинка, низом на площадку; смерть — «песок»: тело стирается сверху вниз, песчинки рисует sandBurst (js/05). */
.stage.lok::before{ display:none; }
.lok-pano{ position:absolute; top:0; left:0; height:100%; background-repeat:repeat-x; background-size:auto 100%;
animation:lokPlyv 60s linear infinite; will-change:transform; }
@keyframes lokPlyv{ to{ transform:translateX(-50%); } }
.lok-plat{ position:absolute; left:50%; top:165px; width:600px; height:239px; transform:translateX(-50%);
background:center/contain no-repeat; }
/* 74-я: центр — на НЕанимированной обёртке .mob-wrap (его скрин с iPhone: Safari считал translateX(-50%) в анимации «дыхания» по
ширине ещё не загруженной картинки и держал моба правее до первого тапа); сама картинка только дышит/вспыхивает */
.enemy-sprite .mob-wrap{ position:absolute; left:50%; bottom:0; height:100%; transform:translateX(-50%); pointer-events:none; }
.enemy-sprite img.mob-img{ position:relative; display:block; height:100%; width:auto;
object-fit:contain; pointer-events:none; user-select:none;
filter:drop-shadow(0 6px 6px rgba(0,0,0,.5)); }
/* Оживление картинки кодом (его 2А, 09.10.2026): стоит на площадке (без парения), дышит и чуть покачивается от ног,
от удара откидывается назад (вправо — герои слева) и вспыхивает. Руки/ноги отдельно так не двигаются — это уже Spine. */
.enemy-sprite.kart{ animation:none; transform-origin:50% 100%; }
.enemy-sprite.kart.hit{ animation:mobRecoil .22s ease-out; }
.enemy-sprite.kart img.mob-img{ transform-origin:50% 100%; animation:mobBreath 2.8s ease-in-out infinite; }
.enemy-sprite.kart.hit img.mob-img{ animation:mobBreath 2.8s ease-in-out infinite, mobFlash .2s ease-out; }
@keyframes mobBreath{
0%,100%{ transform:scale(1,1) rotate(0deg); }
50%{ transform:scale(1.015,1.035) rotate(.7deg); }
}
@keyframes mobRecoil{ 0%{ transform:none; } 35%{ transform:translateX(6px) rotate(3deg); } 100%{ transform:none; } }
@keyframes mobFlash{
0%{ filter:brightness(1.9) drop-shadow(0 6px 6px rgba(0,0,0,.5)); }
100%{ filter:brightness(1) drop-shadow(0 6px 6px rgba(0,0,0,.5)); }
}
.enemy.die.sand{ animation:none; }
.enemy.die.sand .enemy-sprite.kart img.mob-img{ animation:mobSand var(--sandT, 620ms) ease-in forwards; } /* сильнее «удара» — класс hit висит и после тапа */
@keyframes mobSand{
0%{ filter:brightness(1); clip-path:inset(0 0 0 0); }
12%{ filter:brightness(2.4) sepia(.4); clip-path:inset(0 0 0 0); }
100%{ filter:brightness(.6) sepia(1); clip-path:inset(100% 0 0 0); }
}
/* Ад — сгорает в огне: раскал, обугливание и сгорание сверху вниз ведёт fireBurn (js/05) по кадрам, CSS-анимацию снимаем */
.enemy.die.sand.fire .enemy-sprite.kart img.mob-img{ animation:none; }
/* Юрский — распад на кости: окаменение и осыпание ведёт bonesBurst (js/05) по кадрам */
.enemy.die.sand.bones .enemy-sprite.kart img.mob-img{ animation:none; }
/* Лёд — замерзает и лопается: ведёт freezeBurst (js/05) по кадрам */
.enemy.die.sand.ice .enemy-sprite.kart img.mob-img{ animation:none; }
/* Олимп — молния Зевса: ведёт lightningBurst (js/05) по кадрам */
.enemy.die.sand.bolt .enemy-sprite.kart img.mob-img{ animation:none; }
.sand-cv{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:2; }
/* «Ничего не прыгает» (его жалоба 09.10.2026 «под босса прыгает платформа»): на локации строка «Босс убегает» и кнопка
«Сразиться с боссом» лежат поверх сцены, а не в потоке — иначе их появление сдвигало моба, а площадку — за ним. */
.stage.lok .stage-inner{ padding-bottom:58px; } /* место кнопки держим всегда — моб стоит там же, где стоял при кнопке */
.stage.lok .stage-inner > :not(.enemy){ flex-shrink:0; } /* крупный босс не сжимает полоску HP (было 20→8 px, моб съезжал) */
.stage.lok .boss-timer{ position:absolute; left:0; right:0; margin:0 auto; width:max-content; top:56px; z-index:3; }
.enemy.boss .enemy-sprite.kart img.mob-img{ height:88%; } /* босс чуть меньше (его слово 09.10.2026) */
.stage.lok .boss-btn{ position:absolute; left:0; right:0; margin:0 auto; width:max-content; bottom:6px; z-index:3; }
@keyframes idleFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@keyframes hitShake{
0%{transform:translateX(0);}
25%{transform:translateX(-6px) rotate(-3deg);}
50%{transform:translateX(5px) rotate(2deg);}
75%{transform:translateX(-3px);}
100%{transform:translateX(0);}
}
@keyframes enemyDie{
0%{opacity:1; transform:translateX(0) scale(1) rotate(0);}
100%{opacity:0; transform:translateX(-130px) scale(0.35) rotate(-40deg);}
}
@keyframes enemyEnter{
0%{opacity:0; transform:translateX(140px) scale(0.6);}
100%{opacity:1; transform:translateX(0) scale(1);}
}
.dmg-pop{
position:absolute;
font-family:'JetBrains Mono',monospace;
font-weight:700;
font-size:15px;
color:var(--gold-bright);
text-shadow:0 1px 3px rgba(0,0,0,0.8);
pointer-events:none;
z-index:3;
animation: floatUp 0.65s ease-out forwards;
}
@keyframes floatUp{
0%{opacity:1; transform:translateY(0) scale(1);}
100%{opacity:0; transform:translateY(-46px) scale(1.2);}
}
/* ===== Кликер: строка силы + панель оружия (стиль Тюряги) ===== */
.weapon-bar{ display:flex; justify-content:center; gap:7px; margin-top:10px; flex-wrap:wrap; }
.weapon-btn{ position:relative; display:flex; flex-direction:column; align-items:center; gap:1px;
width:56px; padding:7px 2px 5px; cursor:pointer; -webkit-tap-highlight-color:transparent;
background:linear-gradient(180deg,var(--panel-light),#18120d); border:1.5px solid var(--border); border-radius:11px;
transition:transform .07s, border-color .12s, box-shadow .12s; }
.weapon-btn:active{ transform:scale(.88); }
.weapon-btn.sel{ border-color:var(--gold); box-shadow:0 0 9px rgba(230,201,118,.45); background:linear-gradient(180deg,#3a2a16,#241a0e); }
.weapon-btn .wb-ic{ font-size:22px; line-height:1; }
.weapon-btn .wb-nm{ font-family:'Inter',sans-serif; font-size:8.5px; color:var(--muted); }
.weapon-btn .wb-dmg{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; color:var(--crimson-bright); }
.weapon-btn.sel .wb-nm{ color:var(--gold-bright); }
.weapon-btn.sel .wb-dmg{ color:var(--gold-bright); }
.weapon-btn .wb-league{ font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#9be07a; }
.weapon-btn .wb-week{ font-family:'JetBrains Mono',monospace; font-size:8.5px; font-weight:800; line-height:1;
color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border-radius:6px; padding:1px 4px; margin-bottom:1px; }
.weapon-btn .wb-crit{ font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; line-height:1; color:#9be07a; white-space:nowrap; } /* шанс крита из Иероглифов (§2.13) */
.weapon-btn .wb-charge{ font-family:'JetBrains Mono',monospace; font-size:9px; color:#9c8f7a; }
.weapon-btn .wb-charge.free{ color:#7ab0ff; }
.weapon-btn.depleted{ opacity:.42; cursor:not-allowed; }
/* ===== 4 валюты ===== */
/* Верхняя полоса: «Герои» слева (у неё margin-right:auto), валюты прижаты вправо */
.cur-row{
display:flex; align-items:center; justify-content:flex-end; gap:2px;
padding:5px 10px; border-bottom:1px solid var(--border); z-index:2; flex-wrap:wrap;
}
/* 23.09.2026, его выбор Ц1 «без рамок» (client/maket-cifry.html), «чуть меньше»: рамок и подложек нет, цифры 12px,
между валютами тонкие вертикальные разделители; цифры видны, рамки — нет */
.cur-chip{
display:flex; align-items:center; gap:5px;
font-family:'JetBrains Mono',monospace; font-weight:800; font-size:12px;
background:none; border:0; border-left:1px solid #2e2519; border-radius:0; padding:0 5px; /* «сделай меньше расстояние между ними» 23.09.2026 */
}
.cur-row > .cur-chip:first-of-type{ border-left:0; }
/* зелёный «+» — задел под магазин пополнений (донат) */
.cur-plus{
flex-shrink:0; width:13px; height:13px; border-radius:50%; cursor:pointer;
display:flex; align-items:center; justify-content:center; line-height:1;
font-size:11px; font-weight:700; color:#08210f;
background:linear-gradient(180deg,#6ee08a,#37a85a); border:1px solid #2c8048;
box-shadow:0 1px 3px rgba(0,0,0,.4);
}
.cur-plus:active{ transform:scale(.88); }
.cur-ic{ font-size:11px; opacity:.9; }
/* его правило 23.09.2026 «ничего не прыгает» — но только там, где число РАСТЁТ (его слово): ★ Слава и ✨ души —
закреплённые 42px (7 знаков «123.46K» при 10px), прижаты вправо к значку; длиннее — ужимает fitText (FIT_SEL в 04-core).
💎 кости 🔮 ⚡ больших не бывают — «как было раньше, или чуть больше»: по содержимому, минимум 3 знака (18px).
Ширины в px, не в ch — ch плывёт вместе с ужатым шрифтом. */
.cur-val{ display:inline-block; min-width:22px; text-align:right; white-space:nowrap; }
.cur-chip.slava .cur-val, .cur-chip.souls .cur-val{ width:50px; overflow:hidden; } /* 7 знаков × 7.2px при 12px */
/* 10.10.2026 (58-я), его слово «пускай не прыгают»: пыль, кости и бриллианты тоже на 50px — «9.99K → 10.0K» больше не двигает пилюли */
.cur-chip.rune .cur-val, .cur-chip.skull .cur-val, .cur-chip.gem .cur-val{ width:50px; overflow:hidden; }
.cur-chip.gold{ color:var(--gold-bright); }
.cur-chip.slava{ color:#ffd76a; border-color:#3a2c08; } /* ★ Слава — копится за боссов (14.09.2026), левее душ */
.cur-chip.slava .cur-ic{ color:#ffd76a; text-shadow:0 0 6px rgba(255,215,106,.6); }
.cur-chip.souls{ color:#d0b0ff; } /* ✨ души — постоянный множитель урона (07.09.2026) */
.cur-chip.gem{ color:#6fd9d3; border-color:#1a3030; }
.cur-chip.shard{ color:#6fb8ff; border-color:#16263a; } /* осколки 🔹 (возвышение рангов) */
.cur-chip.skull{ color:#e8e0d2; border-color:#2a2622; }
.cur-chip.rune{ color:#a98fff; border-color:#281840; } /* руническая пыль — прокачка Клейма Бездны */
.cur-chip.energy{ color:#ffd24a; border-color:#352808; } /* ⚡ энергия X/100 (реген, для Охоты) */
/* Таймер босса */
.boss-timer{
font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700;
color:#ffce6a; background:rgba(60,30,10,0.55); border:1px solid #7a5a20;
border-radius:999px; padding:3px 12px; margin-bottom:6px;
}
.boss-timer.urgent{ color:#ff7a6a; border-color:#a02818; background:rgba(70,16,10,0.6); animation: timerPulse .6s ease-in-out infinite; }
@keyframes timerPulse{ 0%,100%{ transform:scale(1);} 50%{ transform:scale(1.06);} }
/* Кнопка "Сразиться с боссом" */
.boss-btn{
margin-top:14px; font-family:'Cinzel',serif; font-weight:800; font-size:14px;
letter-spacing:.04em; color:#fff0d8; background:linear-gradient(90deg,#5c1322,var(--crimson));
border:1px solid var(--gold); border-radius:10px; padding:11px 22px; cursor:pointer;
box-shadow:0 0 16px rgba(168,41,63,.5); animation: bossBtnPulse 1.1s ease-in-out infinite;
}
.boss-btn:active{ transform:scale(.97); }
@keyframes bossBtnPulse{ 0%,100%{ box-shadow:0 0 12px rgba(168,41,63,.45);} 50%{ box-shadow:0 0 22px rgba(211,65,90,.8);} }
/* Сообщение по центру сцены */
.stage-msg{
position:absolute; left:50%; top:46%; transform:translateX(-50%);
font-family:'Cinzel',serif; font-weight:800; font-size:15px; text-align:center;
width:84%; text-shadow:0 2px 10px rgba(0,0,0,.8); z-index:26; pointer-events:none;
animation: stageMsgAnim 2.2s ease-out forwards;
}
.stage-msg.over{ z-index:80; width:auto; max-width:84%; padding:6px 16px; border-radius:10px; background:rgba(12,9,6,.88); border:1px solid rgba(255,210,74,.35); } /* подсказка из открытого окна — поверх всех окон (z ≤ 76), на тёмной плашке, чтобы читалась над текстом */
@keyframes stageMsgAnim{
0%{ opacity:0; transform:translateX(-50%) translateY(10px) scale(.9);}
12%{ opacity:1; transform:translateX(-50%) translateY(0) scale(1);}
80%{ opacity:1;}
100%{ opacity:0; transform:translateX(-50%) translateY(-14px);}
}
/* Окно добычи (что собрал из мешка) */
.loot-reveal{
position:absolute; left:50%; top:42%; transform:translate(-50%,-50%);
background:linear-gradient(180deg,#2a1c3a,#180f26); border:2px solid #b070e0;
border-radius:14px; padding:14px 18px 16px; z-index:27; pointer-events:auto;
box-shadow:0 10px 34px rgba(0,0,0,.6); min-width:200px; max-width:84%;
animation: lootIn .3s cubic-bezier(.2,.8,.3,1.3);
}
.loot-reveal.out{ animation: lootOut .3s ease-in forwards; }
@keyframes lootIn{ 0%{opacity:0; transform:translate(-50%,-50%) scale(.7);} 100%{opacity:1; transform:translate(-50%,-50%) scale(1);} }
@keyframes lootOut{ 0%{opacity:1;} 100%{opacity:0; transform:translate(-50%,-58%) scale(.95);} }
.lr-title{ font-family:'Cinzel',serif; font-weight:800; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-bright); text-align:center; margin-bottom:4px; }
.lr-greet{ font-size:11px; color:var(--parchment); text-align:center; margin-bottom:11px; line-height:1.35; opacity:.92; }
.lr-close-btn{ display:block; width:100%; margin-top:13px; font-family:'Cinzel',serif; font-weight:700; font-size:12px; letter-spacing:.04em; color:#fff0d8; background:linear-gradient(90deg,#5c1322,var(--crimson)); border:1px solid var(--gold); border-radius:9px; padding:8px; cursor:pointer; }
.lr-close-btn:active{ transform:scale(.97); }
.lr-items{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.lr-item{ display:flex; flex-direction:column; align-items:center; gap:3px; }
.lr-port{ width:48px; height:48px; }
.lr-amt{ font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:700; color:#e0b0ff; }
.lr-prog{ font-family:'JetBrains Mono',monospace; font-size:10px; color:#fff; }
/* Счётчик мобов на этаже */
.kill-counter{
font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700;
color:#e0a0a0; background:rgba(0,0,0,.35); border:1px solid var(--border);
border-radius:6px; padding:1px 8px; margin-left:6px; vertical-align:middle;
}
/* ===== Баннер перехода на новый слой ===== */
.layer-banner{
position:absolute; inset:0; z-index:30;
display:flex; flex-direction:column;
align-items:center; justify-content:center;
background:rgba(8,5,3,0.80);
opacity:0; pointer-events:none;
transition:opacity .35s;
}
.layer-banner.show{opacity:1;}
.lb-sub{font-family:'Cinzel',serif; font-size:13px; letter-spacing:0.22em; color:var(--muted); text-transform:uppercase;}
.lb-name{font-family:'Cinzel',serif; font-weight:800; font-size:30px; letter-spacing:0.04em; color:var(--gold-bright); margin-top:6px; text-shadow:0 2px 14px rgba(0,0,0,0.7); text-align:center;}
.lb-line{width:64px; height:2px; background:var(--gold); margin-top:14px;}
/* ===== Выезжающая панель героев ===== */
.drawer-backdrop{
position:absolute; inset:0;
background:rgba(0,0,0,0.55);
opacity:0; pointer-events:none;
transition:opacity .25s;
z-index:40;
}
.drawer-backdrop.show{opacity:1; pointer-events:auto;}
/* Ящик героев лежит набок: широкая панель слева, карточки в две колонки —
иначе на 390px высоты помещалось всего два героя. */
.hero-drawer{
position:absolute; top:0; bottom:0; left:0;
width:min(660px, 86%);
background:linear-gradient(180deg, var(--panel), #18120d);
border-right:1px solid var(--gold);
box-shadow:8px 0 28px rgba(0,0,0,0.6);
transform:translateX(-104%);
transition:transform .28s cubic-bezier(.2,.7,.3,1);
z-index:50;
display:flex; flex-direction:column;
}
.hero-drawer.open{transform:translateX(0);}
.drawer-head{
display:flex; align-items:center; justify-content:space-between;
padding:9px 14px 8px;
border-bottom:1px solid var(--border);
}
.drawer-title{
font-family:'Cinzel',serif;
font-size:14px;
letter-spacing:0.08em;
color:var(--gold-bright);
text-transform:uppercase;
}
.drawer-close{
background:none; border:1px solid var(--border);
color:var(--muted); border-radius:8px;
width:30px; height:30px; cursor:pointer; font-size:14px;
}
/* Общая прокрутка полосы портретов и карточек (23.09.2026) */
.heroes-scroll{ flex:1; min-height:0; overflow-y:auto; }
.heroes{
padding:8px 12px 12px;
display:grid;
grid-template-columns:repeat(2, minmax(0,1fr));
align-content:start;
gap:8px;
}
.hero-card{
display:flex;
align-items:center;
gap:10px;
background:var(--panel);
border:1px solid var(--border);
border-radius:10px;
padding:10px 12px;
}
.hero-card.owned{border-color:var(--gold); background:var(--panel-light);}
.hero-info{flex:1; min-width:0;}
.hero-name{font-weight:700; font-size:13.5px; color:var(--parchment);}
.hero-meta{font-size:11px; color:var(--muted); margin-top:1px;}
.rarity-common{color:#9c8f7a;}
.rarity-rare{color:#6fb3d9;}
.rarity-mistic{color:#b97fe0;}
.rarity-legendary{color:var(--gold-bright);}
.qty-row{
display:flex; gap:4px;
padding:8px 12px 6px;
border-bottom:1px solid var(--border);
flex-shrink:0;
}
.hero-btn{
font-family:'Inter',sans-serif;
font-weight:700;
font-size:11.5px;
border:none;
border-radius:7px;
padding:8px 11px;
cursor:pointer;
white-space:nowrap;
flex-shrink:0;
}
.hero-btn.hire{background:var(--gold); color:#1a1410;}
.hero-btn.hire:disabled{background:#3a342a; color:#6b6354; cursor:not-allowed;}
.hero-btn.upgrade{background:var(--crimson); color:#fff0ec;}
.hero-btn.upgrade:disabled{background:#3a342a; color:#6b6354; cursor:not-allowed;}
.prestige-btn{
width:100%;
font-family:'Cinzel',serif;
font-weight:700;
font-size:13px;
letter-spacing:0.04em;
color:#fff0d8;
background:linear-gradient(90deg, #5c1322, var(--crimson));
border:1px solid var(--gold);
border-radius:9px;
padding:11px;
cursor:pointer;
}
.prestige-btn:disabled{
background:#241c14; color:#6b6354; border-color:var(--border); cursor:not-allowed;
}
/* ===== Кнопка-переключатель количества ===== */
.qty-cycle-btn{
font-family:'JetBrains Mono',monospace; font-weight:700; font-size:13px;
background:var(--panel-light); border:1px solid #4a6828; color:#90d060;
border-radius:7px; padding:6px 18px; cursor:pointer; transition:all .15s;
}
.qty-cycle-btn:active{ filter:brightness(1.3); transform:scale(0.97); }
/* ===== Рамки карточек по редкости ===== */
.hero-card.owned{ border-color:#4a3a28; background:var(--panel-light); }
.hero-card.owned[data-rarity='rare']{ border-color:rgba(111,179,217,0.7); background:linear-gradient(135deg,var(--panel-light),rgba(111,179,217,0.07)); }
.hero-card.owned[data-rarity='mistic']{ border-color:rgba(185,127,224,0.7); background:linear-gradient(135deg,var(--panel-light),rgba(185,127,224,0.09)); }
.hero-card.owned[data-rarity='legendary']{ border-color:rgba(202,164,76,0.85); background:linear-gradient(135deg,var(--panel-light),rgba(202,164,76,0.12)); box-shadow:0 0 10px rgba(202,164,76,0.15); }
.hero-card.owned[data-rarity='mythic']{ border-color:rgba(255,90,90,0.8); background:linear-gradient(135deg,var(--panel-light),rgba(255,80,80,0.10)); box-shadow:0 0 12px rgba(255,80,80,0.18); }
.hero-card.owned[data-rarity='divine']{ border-color:rgba(63,224,216,0.9); background:linear-gradient(135deg,var(--panel-light),rgba(63,224,216,0.12)); box-shadow:0 0 14px rgba(63,224,216,0.28); }
.hero-card.owned[data-rarity='absolute']{ border-color:rgba(255,102,204,0.95); background:linear-gradient(135deg,var(--panel-light),rgba(255,102,204,0.14)); box-shadow:0 0 18px rgba(255,102,204,0.4); }
/* ===== Новая система героев: портреты, статы, звания ===== */
.rarity-mythic{color:#ff6a6a;}
.rarity-divine{color:#3fe0d8;}
.rarity-absolute{color:#ff66cc;}
.hero-card{ flex-direction:column; align-items:stretch; gap:9px; }
.hc-top{ display:flex; align-items:center; gap:10px; }
.hero-portrait{
width:46px; height:46px; border-radius:9px; overflow:hidden; flex-shrink:0;
background:#0f0c09; border:2px solid var(--border);
box-shadow:inset 0 0 8px rgba(0,0,0,.5);
}
.hero-portrait svg{ width:100%; height:100%; display:block; }
.hero-portrait[data-r='rare']{ border-color:#6fb3d9; }
.hero-portrait[data-r='mistic']{ border-color:#b97fe0; }
.hero-portrait[data-r='legendary']{ border-color:var(--gold-bright); }
.hero-portrait[data-r='mythic']{ border-color:#ff6a6a; box-shadow:0 0 8px rgba(255,80,80,.4),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='divine']{ border-color:#3fe0d8; box-shadow:0 0 10px rgba(63,224,216,.55),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='absolute']{ border-color:#ff66cc; box-shadow:0 0 12px rgba(255,102,204,.65),inset 0 0 8px rgba(0,0,0,.5); }
.lvl-pill{ font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--gold-bright); background:rgba(0,0,0,.4); border:1px solid var(--border); border-radius:5px; padding:1px 6px; }
.stat-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4px 10px; }
.stat{ display:flex; align-items:center; gap:5px; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--parchment); }
.stat .ic{ width:14px; text-align:center; }
.hc-actions{ display:flex; gap:6px; flex-wrap:wrap; margin-top:auto; } /* кнопки прижаты к низу — в ряду на одной линии (его слово 23.09.2026: «чтобы ровненько») */
.hc-actions .hero-btn{ flex:1; min-width:0; }
.hero-btn.promote{ background:linear-gradient(90deg,#6a2a8a,#a040c0); color:#fff; }
.hero-btn.promote:disabled{ background:#3a342a; color:#6b6354; cursor:not-allowed; }
/* Герои на потолке звания — полоса портретов сверху, всегда открыта (23.09.2026, его слово «сверху», по скрину
Крушителей). Сворачиваемый «Зал славы» с заголовком и счётчиком убран. Много героев — полоса листается вбок. */
.collection{ padding:8px 12px; border-bottom:1px solid var(--border); background:linear-gradient(180deg,rgba(202,164,76,.10),rgba(0,0,0,0)); }
/* Не больше 8 в ряду, девятый идёт во второй ряд (его слово 23.09.2026: «8 героев, и чтобы скроллились вниз вместе с окном»). */
.col-grid{ display:grid; grid-template-columns:repeat(8, 52px); gap:10px 16px; justify-content:start; } /* его слово 23.09.2026: «ещё немного расстояние между 8 героями» — было 8px */
.col-square{ position:relative; flex:0 0 auto; width:52px; height:52px; border-radius:9px; overflow:hidden; border:2px solid var(--gold-bright); box-shadow:0 0 8px rgba(202,164,76,.4); cursor:pointer; transition:transform .12s; }
.col-square:hover{ transform:translateY(-2px); }
.col-square svg{ width:100%; height:100%; display:block; }
.col-square .col-star{ position:absolute; top:-3px; right:-2px; font-size:11px; }
.col-square.promotable{ border-color:#7fd0ff; box-shadow:0 0 8px rgba(127,208,255,.5); }
.col-square .col-promote{ position:absolute; top:-2px; right:-1px; font-size:11px; color:#7fd0ff; text-shadow:0 0 3px #000; font-weight:700; }
/* ===== Осколочные герои ===== */
.frag-wrap{ position:relative; height:15px; border-radius:5px; background:rgba(40,24,56,.6); border:1px solid #3a2850; overflow:hidden; }
.frag-fill{ position:absolute; inset:0; background:linear-gradient(90deg,#5a2a8a,#b070e0); transition:width .25s; }
.frag-txt{ position:relative; display:block; text-align:center; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:#fff; line-height:15px; text-shadow:0 1px 2px rgba(0,0,0,.6); }
.hero-btn.activate{ background:linear-gradient(90deg,#2a7a3a,#3fb05a); color:#fff; }
.hero-btn.frag{ background:#2a2238; color:#b48fe0; border:1px solid #46306a; cursor:default; }
@keyframes fragFloat{
0%{opacity:0; transform:translate(-50%,8px) scale(.9);}
15%{opacity:1; transform:translate(-50%,0) scale(1);}
78%{opacity:1;}
100%{opacity:0; transform:translate(-50%,-20px) scale(1);}
}
/* Кнопка сброса (сбоку в шапке) */
.reset-btn{
flex-shrink:0; width:26px; height:26px; border-radius:7px;
background:var(--panel); border:1px solid var(--crimson); color:var(--crimson-bright);
font-size:14px; line-height:1; cursor:pointer; transition:all .15s;
}
.reset-btn:hover{ background:var(--crimson); color:#fff; }
/* Мешочек с осколками — справа, под кнопкой ежедневной награды */
.loot-bag{
position:absolute; left:11px; top:176px; right:auto; /* 08.10.2026: под кружком премиума; 52-я — ниже, между ними кнопка «Задания» (top 100) */
display:flex; align-items:center; justify-content:center; z-index:24; cursor:pointer;
background:linear-gradient(180deg,#3a2858,#241634); border:2px solid #b070e0;
border-radius:11px; padding:3px 5px; line-height:0;
box-shadow:0 0 16px rgba(176,112,224,.6); /* 55-я, его слово: не прыгает — выпал и стоит (была bagBounce, с ним прыгала и подсказка обучения) */
}
.loot-bag:active{ transform:scale(.94); }
/* Окно характеристик героя */
.hero-portrait.clickable{ cursor:pointer; transition:transform .12s; }
.hero-portrait.clickable:active{ transform:scale(.93); }
.col-square.clickable{ cursor:pointer; }
/* Окно героя лежит набок: слева портрет с кнопками, справа статы и описание. */
.hero-modal{ width:min(640px,96%); height:min(336px,367px); max-height:367px;
display:flex; flex-direction:row; gap:14px; padding:14px; }
.hm-left{ width:186px; flex:0 0 auto; display:flex; flex-direction:column; align-items:center;
border-right:1px solid var(--border); padding-right:14px; }
.hm-spacer{ flex:1; } /* прижимает кнопки к низу колонки, сколько бы их ни показывалось */
.hm-right{ flex:1; min-width:0; min-height:0; overflow-y:auto; text-align:left; padding-right:24px; } /* место под крестик закрытия */
.hm-left .hm-promote-btn{ margin-top:8px; }
.hm-portrait{ width:78px; height:78px; margin:2px auto 8px; }
.hm-stats{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:7px; margin:0 0 6px; }
.hm-stat{ display:flex; align-items:center; gap:6px; background:rgba(0,0,0,.28); border:1px solid var(--border); border-radius:8px; padding:7px 9px; font-family:'JetBrains Mono',monospace; font-size:12px; }
.hm-stat .ic{ font-size:14px; }
.hm-stat .lbl{ color:var(--muted); font-size:10px; margin-left:auto; }
.hm-stat.atk{ color:#ff9a6a; } .hm-stat.def{ color:#7ab0ff; }
.hm-stat.hp{ color:#7ee0a0; } .hm-stat.spd{ color:#e0c060; }
.hm-dmg{ margin-top:10px; padding:10px; background:rgba(40,20,55,.4); border:1px solid #6a4a90; border-radius:10px; font-size:12px; color:var(--parchment); line-height:1.6; }
.hm-dmg b{ color:var(--gold-bright); }
.hm-dmg .up{ color:#7ee0a0; }
.hm-promote-btn{ width:100%; margin-top:12px; font-family:'Cinzel',serif; font-weight:700; font-size:13px; color:#0a1622; background:linear-gradient(90deg,#7fd0ff,#3a9bd4); border:1px solid #bfe8ff; border-radius:9px; padding:10px; cursor:pointer; }
.hm-promote-btn:active{ transform:scale(.97); }
/* Окно подтверждения сброса */
.rm-text{ font-size:12px; color:var(--parchment); line-height:1.5; margin:4px 0 16px; }
.rm-actions{ display:flex; gap:10px; }
.rm-cancel, .rm-confirm{ flex:1; font-family:'Cinzel',serif; font-weight:700; font-size:13px; border-radius:9px; padding:10px; cursor:pointer; }
.rm-cancel{ background:var(--panel); border:1px solid var(--border); color:var(--parchment); }
.rm-confirm{ background:linear-gradient(90deg,#5c1322,var(--crimson)); border:1px solid var(--crimson-bright); color:#fff0d8; }
.rm-cancel:active, .rm-confirm:active{ transform:scale(.97); }
/* Маленький значок ускорения времени (сбоку на сцене) */
.timeskip-fab{
position:absolute; right:16px; left:auto; top:57px; z-index:25;
width:38px; height:38px; border-radius:10px; cursor:pointer;
display:flex; align-items:center; justify-content:center; font-size:17px;
color:#d6fbff; background:linear-gradient(180deg,#1d5560,#0f2429);
border:2px solid #6fd9d3; box-shadow:0 0 12px rgba(111,217,211,.4);
animation: skipPulse 2.4s ease-in-out infinite;
}
.timeskip-fab:active{ transform:scale(.9); }
@keyframes skipPulse{ 0%,100%{ box-shadow:0 0 8px rgba(111,217,211,.3);} 50%{ box-shadow:0 0 16px rgba(111,217,211,.65);} }
/* Окно ускорения времени */
.sk-flavor{ font-size:12px; color:var(--parchment); line-height:1.55; margin:4px 0 12px; text-align:left; }
.sk-cost{ font-size:13.5px; color:#bff0ea; margin-bottom:14px; }
.sk-cost b{ color:#fff; }
.sk-confirm{ width:100%; font-family:'Cinzel',serif; font-weight:700; font-size:13px; letter-spacing:.03em; color:#06222a; background:linear-gradient(90deg,#7fe0d6,#46b8ad); border:1px solid #9fe8e0; border-radius:9px; padding:11px; cursor:pointer; }
.sk-confirm:disabled{ background:#241c14; color:#6b6354; border-color:var(--border); cursor:not-allowed; }
.sk-confirm:active{ transform:scale(.98); }
.sk-hint{ font-size:10.5px; color:var(--crimson-bright); margin-top:8px; min-height:13px; }
/* ===== Осада: список боссов ===== */
/* Окно-«дело» как в Тюряге (09.09.2026): сверху закладки-вкладки (Проклятые / Клановые / Призывы) и кнопка
наград недели, под ними список — один босс в строку во всю ширину, листается вниз. */
.siege-modal{ width:min(830px,96%); height:min(348px,367px); max-height:367px;
display:flex; flex-direction:column; gap:0; padding:0 12px 12px; text-align:left; }
/* Шапка: закладки прижаты к линии, выбранная «открыта» — её нижняя кромка сливается с листом ниже.
Справа отступ 34px — там крестик закрытия окна. */
.siege-head{ display:flex; align-items:flex-end; gap:10px; flex-shrink:0; padding:10px 34px 0 2px; border-bottom:2px solid #5a4a30; }
.siege-tabs{ display:flex; gap:3px; flex:1; min-width:0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.siege-tabs::-webkit-scrollbar{ height:0; }
.siege-tab{ flex-shrink:0; font-family:'Cinzel',serif; font-weight:800; font-size:11.5px; letter-spacing:.03em; text-transform:uppercase; white-space:nowrap;
padding:7px 16px 6px; margin-bottom:-2px; border-radius:10px 10px 0 0; cursor:pointer;
background:linear-gradient(180deg,#2a2036,#1a1224); border:1px solid #3a2850; border-bottom:2px solid #5a4a30; color:var(--muted); }
.siege-tab{ width:122px; text-align:center; padding-left:4px; padding-right:4px; } /* 64-я 14.10.2026, его слово: «Проклятые / Клановые / Скоро — все одного размера» */
.siege-tab.sel{ background:linear-gradient(180deg,#3d2f1a,#2a2012); border-color:var(--gold-bright); border-bottom-color:#2a2012; color:var(--gold-bright); }
.siege-tab.soon{ opacity:.45; cursor:default; } /* вкладка «Скоро» (Призывы, 30.09.2026): видна, но не открывается */
.siege-rewards-btn{ flex-shrink:0; margin-bottom:6px; font-size:12px; font-weight:700; color:var(--gold-bright);
background:rgba(0,0,0,.3); border:1px solid #3a2c50; border-radius:9px; padding:5px 12px; cursor:pointer; }
.siege-rewards-btn:hover{ border-color:var(--gold-bright); }
.siege-list{ flex:1; min-width:0; overflow-y:auto; display:flex; flex-direction:column; gap:7px; padding:10px 1px 1px; }
.siege-list > *{ flex-shrink:0; }
/* пустая вкладка (Клановые, Призывы — боссы для них ещё не придуманы) */
.siege-empty{ margin:auto; text-align:center; color:var(--muted); font-family:'Cinzel',serif; font-size:13px; letter-spacing:.05em; line-height:1.6; }
.summon-head{ font-size:12px; color:var(--parchment); margin:2px 2px 8px; } .summon-head b{ color:var(--gold-bright); }
.summon-head .summon-hint{ display:block; color:var(--muted); margin-top:4px; font-size:11px; }
.scr-pill{ display:inline-block; margin:3px 3px 0 0; padding:2px 7px; border:1px solid #3a2c50; border-radius:9px; background:rgba(0,0,0,.25); font-size:12px; color:#8a7ea0; }
.scr-pill.has{ border-color:var(--gold-bright); color:var(--gold-bright); }
.scr-pill.lk{ opacity:.5; }
/* Строка босса — «дело» по макету В5 (его выбор 09.09.2026, client/maket-osada.html): слева портрет на всю карточку
с именем внизу, по центру два папируса — «Награда за победу» и «Достижения», справа кнопка «Атаковать»,
условие входа и «Нападений: 1 / 6». HP и оружие тут не показываем — они на экране боя.
Высота строки 136px: в окно влезают две строки, остальные листаются вниз.
ЗАМЕНА ПОРТРЕТА: вместо spriteHTML(...) достаточно подставить 
— он растянется на всю карточку */
/* 64-я 14.10.2026: фон окна списка по неделе (SIEGE_OKNO_FON в js/11) — картинка, строки боссов полупрозрачные поверх */
#siegeModal.sl-fon{ background:linear-gradient(180deg,rgba(14,8,5,.05),rgba(14,8,5,.25)), var(--sl-fon) center/cover no-repeat, #1a0f0a; border-color:#8a6a3a; }
#siegeModal.sl-fon .siege-row{ background:linear-gradient(180deg,rgba(42,26,16,.30),rgba(18,10,6,.45)); border-color:rgba(190,150,90,.6); }
#siegeModal.sl-fon .siege-head{ border-bottom-color:rgba(160,120,70,.7); }
/* 64-я 14.10.2026: набор недели «Ветер пустыни» (data-ned=1) — кнопка «Атаковать» песчаная с золотыми крыльями (его выбор — 2-й вариант, ui-proba/veter/knopki/k2.png), края 9-частями; значки нападений — перья */
#siegeModal[data-ned="1"] .sr-right .siege-attack{ height:44px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 44px; border-radius:0;
border-image:url(img/osada/veter/knopka.webp) 0 86 fill / 0 44px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,190,.6); box-shadow:none; }
#siegeModal[data-ned="1"] .siege-row.infight .siege-attack{ background:none; filter:brightness(1.12) drop-shadow(0 0 6px rgba(255,210,120,.55)); }
#siegeModal[data-ned="1"] .siege-attack[disabled]{ filter:grayscale(.85) brightness(.75); color:#2a2420; }
/* 66-я 14.10.2026: «Логово аспидов» (data-ned=2) — кнопка «Атаковать» бронза с золотыми кобрами (лист ui-proba/logovo/knopka-list.jpg), края 9-частями
по началу утопленной середины (68 из 320 px); надпись светлая — середина тёмная. Клановые перекрывают своим правилом ниже. */
#siegeModal[data-ned="2"] .sr-right .siege-attack{ height:46px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 27px; border-radius:0;
border-image:url(img/osada/logovo/knopka.webp) 0 68 fill / 0 27px stretch; color:#f3dcae; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.6); box-shadow:none; }
#siegeModal[data-ned="2"] .siege-row.infight .siege-attack{ background:none; filter:brightness(1.12) drop-shadow(0 0 6px rgba(150,230,110,.5)); }
#siegeModal[data-ned="2"] .siege-attack[disabled]{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
/* 68-я 14.10.2026: «Пробуждение мумий» (data-ned=0) — кнопка «Атаковать» крышка саркофага из тёмного дерева с золотыми масками (его выбор — 2-й вариант, ui-proba/mumii/nabor/knopka-list.jpg),
края 9-частями по маскам (62 из 328 px); середина тёмная — надпись светлая. Клановые перекрывают своим правилом ниже. */
#siegeModal[data-ned="0"] .sr-right .siege-attack{ height:46px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 30px; border-radius:0;
border-image:url(img/osada/mumii/knopka.webp) 0 62 fill / 0 30px stretch; color:#f3dcae; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.6); box-shadow:none; }
#siegeModal[data-ned="0"] .siege-row.infight .siege-attack{ background:none; filter:brightness(1.12) drop-shadow(0 0 6px rgba(255,200,110,.55)); }
#siegeModal[data-ned="0"] .siege-attack[disabled]{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
/* 66-я 14.10.2026, его слово «окно в клановых везде одинаковое, как было там, где мы делали»: папирус, «Награды», медали достижений и вкладки
набора «Ветер» стоят на «Клановых» на ЛЮБОЙ неделе (data-vid="clan") и у Проклятых недели 3 «Логово» (data-ned="2", его слово «бери всё с того, что делали»; фон и «Атаковать» у Логова — свои, ждём листы); кнопка «Атаковать» и рамка «Нападений» у клановых свои, морские. */
/* 68-я: неделя 1 «Пробуждение мумий» (data-ned=0) — тот же набор «Ветер» (папирус, «Награды», медали, вкладки), его слово «делай как везде награду за победу» */
/* 64-я: таблички «Награда за победу» / «Достижения» — папирус с перьями (его выбор: 2-й лист, 3-я табличка — ui-proba/veter/plashki/t3.png);
края с перьями 9-частями, середина тянется; рамка рисуется поверх отступов (border-width 0), раскладка не меняется */
#siegeModal[data-ned="0"] .sr-paper, #siegeModal[data-ned="1"] .sr-paper, #siegeModal[data-ned="2"] .sr-paper, #siegeModal[data-vid="clan"] .sr-paper{ background:none; border:0; border-radius:0; box-shadow:none; } /* 64-я, его слово «цельная штука, без пробела»: обе части — на одной табличке .sr-mid */
#siegeModal[data-ned="0"] .sr-mid, #siegeModal[data-ned="1"] .sr-mid, #siegeModal[data-ned="2"] .sr-mid, #siegeModal[data-vid="clan"] .sr-mid{ gap:0; border:0 solid transparent; border-image:url(img/osada/veter/tablichka.webp?v=2) 0 66 fill / 0 32px / 0 4px stretch; filter:drop-shadow(0 2px 3px rgba(0,0,0,.45)); }
#siegeModal[data-ned="0"] .sr-paper::before, #siegeModal[data-ned="1"] .sr-paper::before, #siegeModal[data-ned="2"] .sr-paper::before, #siegeModal[data-vid="clan"] .sr-paper::before{ display:none; }
/* кнопка «Награды» — песчаник с крылатым кубком (его выбор: 3-й лист, правая верхняя — ui-proba/veter/nagrady/n2.png); кубок нарисован, эмодзи прячем */
#siegeModal[data-ned="0"] .siege-rewards-btn, #siegeModal[data-ned="1"] .siege-rewards-btn, #siegeModal[data-ned="2"] .siege-rewards-btn, #siegeModal[data-vid="clan"] .siege-rewards-btn{ width:100px; height:37px; padding:0 8px 0 36px; margin-bottom:2px; border:0; border-radius:0;
background:url(img/osada/veter/nagrady.webp) center/100% 100% no-repeat; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,190,.55); font-size:11.5px; }
#siegeModal[data-ned="0"] .siege-rewards-btn .srb-ic, #siegeModal[data-ned="1"] .siege-rewards-btn .srb-ic, #siegeModal[data-ned="2"] .siege-rewards-btn .srb-ic, #siegeModal[data-vid="clan"] .siege-rewards-btn .srb-ic{ display:none; }
#siegeModal[data-ned="0"] .siege-rewards-btn:hover, #siegeModal[data-ned="1"] .siege-rewards-btn:hover, #siegeModal[data-ned="2"] .siege-rewards-btn:hover, #siegeModal[data-vid="clan"] .siege-rewards-btn:hover{ filter:brightness(1.08); }
/* 64-я: медали достижений недели «Ветер» — бронза / серебро / золото / золото с бирюзой / рубин с крыльями (ui-proba/veter/s-medali.jpg); закрытые — серые, как было (.lk) */
#siegeModal[data-ned="0"] .sr-medal, #siegeModal[data-ned="1"] .sr-medal, #siegeModal[data-ned="2"] .sr-medal, #siegeModal[data-vid="clan"] .sr-medal{ width:30px; height:30px; border:0; border-radius:0; box-shadow:none; font-size:0; color:transparent; background:center/contain no-repeat; }
#siegeModal[data-ned="0"] .sr-medal.m1, #siegeModal[data-ned="1"] .sr-medal.m1, #siegeModal[data-ned="2"] .sr-medal.m1, #siegeModal[data-vid="clan"] .sr-medal.m1{ background-image:url(img/osada/veter/medal-1.webp); }
#siegeModal[data-ned="0"] .sr-medal.m2, #siegeModal[data-ned="1"] .sr-medal.m2, #siegeModal[data-ned="2"] .sr-medal.m2, #siegeModal[data-vid="clan"] .sr-medal.m2{ background-image:url(img/osada/veter/medal-2.webp); }
#siegeModal[data-ned="0"] .sr-medal.m3, #siegeModal[data-ned="1"] .sr-medal.m3, #siegeModal[data-ned="2"] .sr-medal.m3, #siegeModal[data-vid="clan"] .sr-medal.m3{ background-image:url(img/osada/veter/medal-3.webp); }
#siegeModal[data-ned="0"] .sr-medal.m4, #siegeModal[data-ned="1"] .sr-medal.m4, #siegeModal[data-ned="2"] .sr-medal.m4, #siegeModal[data-vid="clan"] .sr-medal.m4{ background-image:url(img/osada/veter/medal-4.webp?v=2); }
#siegeModal[data-ned="0"] .sr-medal.m5, #siegeModal[data-ned="1"] .sr-medal.m5, #siegeModal[data-ned="2"] .sr-medal.m5, #siegeModal[data-vid="clan"] .sr-medal.m5{ width:38px; background-image:url(img/osada/veter/medal-5.webp?v=2); }
/* 64-я: вкладки Проклятые / Клановые / Скоро — песчаные таблички недели «Ветер» (лист ui-proba/veter/s-1.jpg: выбранная со свечением и крыльями, обычная тёмная, закрытая серая), одна ширина 122 px */
#siegeModal[data-ned="0"] .siege-tab, #siegeModal[data-ned="1"] .siege-tab, #siegeModal[data-ned="2"] .siege-tab, #siegeModal[data-vid="clan"] .siege-tab{ height:34px; padding:7px 4px 0; margin-bottom:0; background:none; border:0 solid transparent; border-radius:0;
border-image:url(img/osada/veter/vkladka-norm.webp) 0 60 fill / 0 17px stretch; color:#f3dcae; text-shadow:0 1px 2px #000; }
#siegeModal[data-ned="0"] .siege-tab.sel, #siegeModal[data-ned="1"] .siege-tab.sel, #siegeModal[data-ned="2"] .siege-tab.sel, #siegeModal[data-vid="clan"] .siege-tab.sel{ border-image-source:url(img/osada/veter/vkladka-sel.webp); color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
#siegeModal[data-ned="0"] .siege-tab.soon, #siegeModal[data-ned="1"] .siege-tab.soon, #siegeModal[data-ned="2"] .siege-tab.soon, #siegeModal[data-vid="clan"] .siege-tab.soon{ border-image-source:url(img/osada/veter/vkladka-off.webp); color:#3c3c3c; text-shadow:0 1px 0 rgba(255,255,255,.35); opacity:1; }
/* 67-я 14.10.2026: НАБОР НЕДЕЛИ «Последний приговор» (data-ned=3) — огненный суд, его слово «все кнопки менять, награды огненную… кнопка атаки красная огненная
и достижения… только главное опять в клановые не засунь огненный фон». Листы — ui-proba/prigovor/nabor/1-knopki, 2-tablichka, 3-medali (резал instrumenty/narezka-kuski.js).
ВСЕ правила с :not([data-vid="clan"]) — на «Клановых» этой недели остаётся морской вид. */
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-right .siege-attack{ height:46px; padding:11px 2px 0; /* 67-я, его слово «атаковать по центру»: красная плашка на картинке ниже середины (центр 62 % высоты) — надпись вниз */ background:none; border-style:solid; border-color:transparent; border-width:0 39px; border-radius:0;
border-image:url(img/osada/prigovor/knopka.webp) 0 82 fill / 0 39px stretch; color:#ffe6c8; text-shadow:0 1px 2px #000, 0 0 6px rgba(255,90,30,.6); box-shadow:none; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-row.infight .siege-attack{ background:none; filter:brightness(1.12) drop-shadow(0 0 6px rgba(255,120,50,.6)); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-attack[disabled]{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-paper{ background:none; border:0; border-radius:0; box-shadow:none; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-mid{ gap:0; border:0 solid transparent; border-image:url(img/osada/prigovor/tablichka.webp) 0 70 fill / 0 32px / 0 4px stretch; filter:drop-shadow(0 2px 3px rgba(0,0,0,.5)); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-paper::before{ display:none; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-rewards-btn{ width:100px; height:37px; padding:0 8px 0 36px; margin-bottom:2px; border:0; border-radius:0;
background:url(img/osada/prigovor/nagrady.webp) center/100% 100% no-repeat; color:#ffe6c8; text-shadow:0 1px 2px #000; font-size:11.5px; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-rewards-btn .srb-ic{ display:none; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-rewards-btn:hover{ filter:brightness(1.1); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal{ width:30px; height:30px; border:0; border-radius:0; box-shadow:none; font-size:0; color:transparent; background:center/contain no-repeat; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal.m1{ background-image:url(img/osada/prigovor/medal-1.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal.m2{ background-image:url(img/osada/prigovor/medal-2.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal.m3{ background-image:url(img/osada/prigovor/medal-3.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal.m4{ background-image:url(img/osada/prigovor/medal-4.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-medal.m5{ width:33px; background-image:url(img/osada/prigovor/medal-5.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-tab{ height:34px; padding:7px 4px 0; margin-bottom:0; background:none; border:0 solid transparent; border-radius:0;
border-image:url(img/osada/prigovor/vkladka-norm.webp) 0 50 fill / 0 17px stretch; color:#ffe0c0; text-shadow:0 1px 2px #000; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-tab.sel{ border-image-source:url(img/osada/prigovor/vkladka-sel.webp); color:#3a0e04; text-shadow:0 1px 0 rgba(255,220,170,.6); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .siege-tab.soon{ border-image-source:url(img/osada/prigovor/vkladka-off.webp); color:#3c3c3c; text-shadow:0 1px 0 rgba(255,255,255,.35); opacity:1; }
/* 64-я: вкладка «Клановые» — морская кнопка «Атаковать» (бирюзовый камень, плавники; ui-proba/more/knopka.png), на любой неделе; правило ПОСЛЕ недельного — перекрывает его */
#siegeModal[data-vid="clan"] .sr-right .siege-attack{ height:48px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 38px; border-radius:0; box-shadow:none;
border-image:url(img/osada/more-knopka.webp) 0 76 fill / 0 38px stretch; color:#e8fbff; text-shadow:0 1px 2px #052a3a, 0 0 6px rgba(80,200,230,.6); }
#siegeModal[data-vid="clan"] .siege-row.infight .siege-attack{ background:none; filter:brightness(1.12) drop-shadow(0 0 6px rgba(120,220,255,.55)); }
#siegeModal[data-vid="clan"] .siege-attack[disabled]{ filter:grayscale(.85) brightness(.75); }
/* «Нападений n / max» в рамке — песчаник с бронзовой каймой (64-я, вместо перьев); 66-я — чуть меньше и над кнопкой (его слово) */
.sr-stat.sr-ramka{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0 6px; min-width:0; max-width:100%; padding:2px 10px 3px; border-radius:8px;
background:linear-gradient(180deg,#e9cf98 0%,#d2ad6a 55%,#b88c4c 100%); border:1px solid #6a4520;
box-shadow:inset 0 0 0 2px rgba(255,236,190,.45), inset 0 -3px 6px rgba(90,50,10,.35), 0 2px 4px rgba(0,0,0,.45); }
.sr-stat.sr-ramka .srr-l{ font-family:'Cinzel',serif; font-weight:800; font-size:8.5px; letter-spacing:.06em; text-transform:uppercase; color:#5a3410; }
.sr-stat.sr-ramka b{ font-family:'Cinzel',serif; font-weight:800; font-size:13px; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); min-width:0; }
.sr-stat.sr-ramka.out b{ color:#9a2a10; }
.sr-stat.sr-ramka small{ flex-basis:100%; text-align:center; color:#6a4a20; }
/* 66-я 14.10.2026, его слово «кнопку нападений на этой неделе какую-то зелёную»: «Логово» (data-ned=2) — ядовито-зелёный камень под глаза кобр;
стоит ДО клановых — на «Клановых» той же недели остаётся бирюзовая */
#siegeModal[data-ned="2"] .sr-stat.sr-ramka{ background:linear-gradient(180deg,#5f9a44 0%,#356a24 55%,#1a3a10 100%); border-color:#0a2006;
box-shadow:inset 0 0 0 2px rgba(190,240,150,.25), inset 0 -3px 6px rgba(5,25,2,.55), 0 2px 4px rgba(0,0,0,.45); }
#siegeModal[data-ned="2"] .sr-stat.sr-ramka .srr-l{ color:#efffe0; text-shadow:0 1px 2px #0c2a06; }
#siegeModal[data-ned="2"] .sr-stat.sr-ramka b{ color:#ffffff; text-shadow:0 1px 2px #0c2a06, 0 0 6px rgba(150,240,90,.6); }
#siegeModal[data-ned="2"] .sr-stat.sr-ramka.out b{ color:#ffb4a0; }
#siegeModal[data-ned="2"] .sr-stat.sr-ramka small{ color:#dcf5c8; }
/* 67-я: «Последний приговор» (data-ned=3) — рамка «Нападений» раскалённый камень под красную кнопку; НЕ на «Клановых» той же недели */
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka{ background:linear-gradient(180deg,#d8622a 0%,#a3261a 55%,#4a0c08 100%); border-color:#2a0604;
box-shadow:inset 0 0 0 2px rgba(255,200,120,.3), inset 0 -3px 6px rgba(40,4,2,.55), 0 2px 4px rgba(0,0,0,.45), 0 0 6px rgba(255,110,40,.35); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka .srr-l{ color:#ffe8cc; text-shadow:0 1px 2px #2a0604; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka b{ color:#ffffff; text-shadow:0 1px 2px #2a0604, 0 0 6px rgba(255,160,60,.7); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka.out b{ color:#ffd0a0; }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka small{ color:#ffd8b8; }
/* 65-я: на «Клановых» рамка «Нападений» — бирюзовый камень под морскую кнопку «Атаковать» (его слово «другого цвета, который там подходит») */
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka{ background:linear-gradient(180deg,#7fd6d4 0%,#3a9ea6 55%,#1f6874 100%); border-color:#0c3a44;
box-shadow:inset 0 0 0 2px rgba(200,250,255,.35), inset 0 -3px 6px rgba(5,40,50,.45), 0 2px 4px rgba(0,0,0,.45); }
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka .srr-l{ color:#dff8ff; text-shadow:0 1px 2px #052a3a; }
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka b{ color:#ffffff; text-shadow:0 1px 2px #052a3a, 0 0 6px rgba(80,200,230,.6); }
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka.out b{ color:#ffb4a0; }
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka small{ color:#cdeff5; }
.siege-row{ display:grid; grid-template-columns:136px minmax(0,1fr) 172px; gap:10px; height:136px; padding:8px;
background:linear-gradient(180deg,var(--panel-light),#160b1e); border:1px solid #3a2850; border-radius:13px; }
/* приглушаем только портрет — кнопка «Атаковать» остаётся ярко-жёлтой у всех боссов */
.siege-row.locked .siege-port{ filter:grayscale(.35); opacity:.75; }
.siege-row.infight{ border-color:var(--gold-bright); box-shadow:0 0 0 1px rgba(230,201,118,.35) inset; } /* босс, которого осаждаешь прямо сейчас */
.siege-row.infight .siege-attack{ background:linear-gradient(180deg,#f0d060,#caa44c); }
/* портрет — одна картинка на всю карточку, имя поверх нижнего края */
.sr-port{ position:relative; border-radius:9px; overflow:hidden; border:1px solid #4a3468;
background:radial-gradient(circle at 50% 40%, rgba(255,255,255,.06), rgba(0,0,0,.5)); }
.sr-port .siege-port{ position:absolute; inset:0 0 14px; width:auto; height:auto; border:none; border-radius:0; background:none; }
.sr-port .siege-port svg{ width:150%; height:150%; flex-shrink:0; } /* у спрайтов широкие поля в viewBox — увеличиваем, лишнее срезает карточка; ![]()
это не касается */
.siege-port{ width:48px; height:48px; border-radius:10px; overflow:hidden; display:flex; align-items:center; justify-content:center; /* в других окнах (карточка, бой) портрет маленький, как раньше */
background:radial-gradient(circle at 50% 38%, rgba(255,255,255,.07), rgba(0,0,0,.45)); border:1px solid #4a3468; }
.siege-port svg,.siege-port img{ width:100%; height:100%; object-fit:contain; display:block; }
.sr-name{ position:absolute; left:0; right:0; bottom:0; padding:14px 6px 4px; text-align:center; font-family:'Cinzel',serif; font-weight:800; font-size:12px; line-height:1.15; color:#e0b0ff;
background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.75)); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* середина: два папируса друг под другом */
.sr-mid{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.sr-mid .srp-rew{ flex:0.88; } .sr-mid .srp-ach{ flex:1.12; } /* его слово 05.10.2026: награду чуть меньше, достижения чуть больше */
.sr-paper{ position:relative; flex:1; min-height:0; display:flex; flex-direction:column; align-items:center; min-width:0; padding:0 8px 3px;
color:#3a2410; background:linear-gradient(160deg,#f0e2bc 0%,#e4d1a3 55%,#d9c48f 100%);
border:1px solid #a88b52; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,.45), inset 0 0 14px rgba(120,80,20,.22); }
.sr-paper::before{ content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; /* волокна папируса */
background:repeating-linear-gradient(0deg, rgba(90,60,20,.045) 0 1px, transparent 1px 4px); }
.srp-title{ position:relative; display:flex; align-items:center; gap:8px; font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; letter-spacing:.1em; color:#4a2a10; padding:3px 0 1px; white-space:nowrap; }
.srp-title::before, .srp-title::after{ content:'◆'; font-size:7px; opacity:.8; }
.srp-items{ position:relative; flex:1; display:flex; align-items:center; justify-content:center; gap:2px 18px; flex-wrap:wrap; }
.srp-item{ display:flex; flex-direction:column; align-items:center; gap:0; font-size:10px; font-weight:700; color:#3a2410; white-space:nowrap; line-height:1.2; }
.srp-item .srp-ic{ font-size:14px; line-height:1.15; }
.srp-val{ display:inline-block; width:17px; height:17px; vertical-align:middle; background:center/contain no-repeat; } /* 64-я: пыль/кости/слава картинками, как в профиле */
.srp-val.pyl{ background-image:url(img/ramka/val-pyl.webp); } .srp-val.kosti{ background-image:url(img/ramka/val-kosti.webp); } .srp-val.slava{ background-image:url(img/ramka/val-slava.webp); }
.srp-item .siege-mark{ text-shadow:none; font-size:14px; }
.srp-item .srp-ic.slava{ color:#b08010; font-weight:900; }
.srp-item.srp-slava{ min-width:72px; } /* 61-я 12.10.2026: слава целиком «12 433 434 славы» — ячейка шире, не ужимать */
/* достижения: семь анкхов (ступени строки Осады, 29.09.2026) — бронза, серебро, золото, фиолетовый, красный, бирюза, синий; невзятые серые */
.srp-medals{ gap:8px; }
.sr-medal{ width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:900; color:#2a1408;
text-shadow:0 1px 0 rgba(255,255,255,.35); border:2px solid; box-shadow:0 2px 4px rgba(0,0,0,.45), inset 0 0 6px rgba(0,0,0,.35); }
.sr-medal.m1{ background:radial-gradient(circle at 40% 35%,#e0a060,#8a4a1a); border-color:#c8843c; }
.sr-medal.m2{ background:radial-gradient(circle at 40% 35%,#f0f0f8,#8a90a0); border-color:#d6e0ee; }
.sr-medal.m3{ background:radial-gradient(circle at 40% 35%,#ffe680,#b08010); border-color:#ffcb3d; }
.sr-medal.m4{ background:radial-gradient(circle at 40% 35%,#d8a0ff,#5a2090); border-color:#c060e0; }
.sr-medal.m5{ background:radial-gradient(circle at 40% 35%,#ff8090,#8a1030); border-color:#e0405a; }
.sr-medal.lk{ filter:grayscale(1); opacity:.35; }
/* справа: кнопка, условие входа, нападений за сегодня */
.sr-right{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding-left:10px; border-left:1px solid #3a2850; min-width:0; }
.sr-right .siege-attack{ width:100%; font-size:12px; padding:8px 2px; }
.siege-req{ font-size:10px; line-height:1.25; color:#c79a5a; text-align:center; }
.siege-req.ok{ color:#7ee0a0; }
.siege-req.out{ color:#ff8a6a; } /* дневной лимит убийств исчерпан */
.sr-stat{ font-size:12px; color:var(--parchment); white-space:nowrap; text-align:center; }
.sr-stat b{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--gold-bright); }
.sr-stat.out b{ color:#ff8a6a; }
.sr-stat small{ display:block; font-size:9.5px; color:var(--muted); margin-top:1px; white-space:normal; }
/* Печать — свой рисунок (10.09.2026), а не эмодзи: у каждой марки свой оттенок.
Размер задаётся font-size там, где значок стоит, — svg внутри тянется до 1em. */
.siege-mark{ display:inline-block; width:1.15em; height:1.15em; font-size:13px; line-height:1; vertical-align:-2px;
filter:drop-shadow(0 1px 2px rgba(0,0,0,.55)); }
.siege-mark svg{ width:100%; height:100%; }
.siege-mark img{ width:100%; height:100%; display:block; object-fit:contain; } /* 66-я: печати картинками (markGlyph) */
/* ===== Карточка босса перед атакой — 65-я 14.10.2026, его выбор: вариант А «Строки» (client/maket-karta-ataki.html) ===== */
/* Слева босс в рамке-«деле» (кости не трогаем — его слово), под ним нападения/срок и печати; справа награды монетами-медальонами,
режимы строками (камушек, имя и здоровье, артефакт в медальоне, счёт по режиму), одна кнопка «Атаковать». «Закрыть» убрана.
Цвета — переменные --k-*: обычный вид (тёмно-лиловый с золотом), клановые — море, Проклятые на неделе с набором — свой (spvOknoApply в js/11). */
.siege-prev{ width:min(720px,96%); height:min(340px,367px); overflow:hidden; text-align:left; z-index:71;
padding:12px 16px; display:grid; grid-template-columns:186px minmax(0,1fr); gap:10px 16px;
--k-ac:var(--gold); --k-ac2:#f0d070; --k-line:rgba(230,201,118,.25); --k-row:rgba(36,22,52,.72); --k-sel:linear-gradient(90deg,rgba(150,110,40,.45),rgba(36,22,52,.8));
--k-glow:rgba(240,208,112,.35); --k-txt:#f3e7c8; --k-sub:#b9a8d0; --k-art:#f3e2b0; --k-num:#8ef0a8; --k-med:radial-gradient(circle at 40% 35%,#4a2a6a,#140a20 75%);
--k-gem:radial-gradient(circle at 40% 35%,#fff4c8,#f0c040 55%,#8a6010); }
#siegePrevBackdrop{ z-index:70; }
#siegePrevModal.spv-fon{ background:radial-gradient(ellipse at 50% 45%, rgba(4,4,6,.30) 0%, rgba(2,2,4,.86) 75%), var(--sl-fon) center/cover no-repeat, #0a0a0c;
border-color:var(--k-ac); box-shadow:0 0 0 1px rgba(0,0,0,.6), 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.siege-prev .modal-close{ border-radius:50%; border-color:var(--k-ac); color:var(--k-txt); background:rgba(0,0,0,.55); z-index:3; }
.spv-left{ display:flex; flex-direction:column; align-items:center; gap:4px; min-height:0; }
.spv-portcard{ width:186px; flex-shrink:0; }
.spv-portcard .sr-name{ font-size:13px; }
/* его слово 65-я: «Нападений сегодня» чуть меньше и ниже — не налезать на плашку имени */
.spv-under{ margin-top:12px; font-size:10.5px; color:var(--k-txt); line-height:1.5; text-align:center; text-shadow:0 1px 2px #000; }
.spv-under b{ font-family:'JetBrains Mono',monospace; color:var(--k-num); }
.spv-under b.out{ color:#ff8a6a; }
.spv-under .spv-out{ display:block; font-size:9.5px; color:#ff8a6a; } /* лимит выбит: когда обновится (12.09.2026) */
.spv-right{ display:flex; flex-direction:column; gap:6px; min-width:0; min-height:0; }
.spv-h{ display:flex; align-items:center; justify-content:center; gap:10px; font:800 11px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase;
color:var(--k-txt); text-shadow:0 1px 2px #000; flex-shrink:0; }
.spv-h::before, .spv-h::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--k-ac2),transparent); opacity:.8; }
/* награды — монеты */
.spv-rew{ display:flex; justify-content:center; gap:6px 22px; flex-wrap:wrap; flex-shrink:0; }
.spv-coin{ display:flex; align-items:center; gap:7px; min-width:0; }
.spv-med{ width:34px; height:34px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--k-med);
border:2px solid #c9a24a; box-shadow:0 2px 5px rgba(0,0,0,.6), inset 0 0 8px rgba(0,0,0,.6), 0 0 0 1px #5a4010; box-sizing:border-box; }
.spv-med .srp-val{ width:24px; height:24px; }
.spv-med .siege-mark{ display:flex; font-size:20px; text-shadow:none; } .spv-med .siege-mark svg, .spv-med .siege-mark img{ width:22px; height:22px; }
.spv-med svg{ width:24px; height:24px; } .spv-med img{ width:26px; height:26px; object-fit:contain; }
.spv-ct{ display:flex; flex-direction:column; line-height:1.1; min-width:0; }
.spv-ct b{ font:800 14px 'JetBrains Mono',monospace; color:#fff; text-shadow:0 1px 2px #000; max-width:110px; white-space:nowrap; }
.spv-ct span{ font-size:10px; color:var(--k-sub); white-space:nowrap; }
/* режимы — строки */
.spv-modes-box{ flex:1; min-height:0; display:flex; flex-direction:column; gap:5px; }
.spv-modes{ display:flex; flex-direction:column; gap:4px; min-height:0; overflow-y:auto; overflow-x:hidden; }
.spv-mode{ display:flex; align-items:center; gap:10px; min-height:39px; padding:2px 12px; box-sizing:border-box; border-radius:9px; cursor:pointer; flex-shrink:0;
background:var(--k-row); border:1px solid var(--k-line); }
.spv-mode.sel{ background:var(--k-sel); border-color:var(--k-ac2); box-shadow:0 0 10px var(--k-glow), inset 0 0 0 1px rgba(255,255,255,.12); }
.spv-mode.soon{ cursor:default; } .spv-mode.soon .t, .spv-mode.soon .d{ opacity:.55; }
.spv-cb{ width:18px; height:18px; flex-shrink:0; border-radius:50%; border:2px solid var(--k-ac2); background:rgba(0,0,0,.45); box-sizing:border-box; }
.spv-mode.sel .spv-cb{ background:var(--k-gem); border-color:#fff; box-shadow:0 0 8px var(--k-ac2); }
.spv-mn{ flex:1; min-width:0; }
.spv-mode .t{ font:800 13px 'Cinzel',serif; color:var(--k-txt); line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.spv-mode .d{ font-size:10.5px; color:var(--k-sub); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* артефакт — медальон и счёт; по тапу пузырь .spv-tip (что даёт сет, всего собрано) */
.spv-arti-col{ display:flex; gap:10px; flex-shrink:0; }
.spv-arti{ display:flex; align-items:center; gap:8px; flex-shrink:0; cursor:pointer; }
.spv-med.art{ width:32px; height:32px; }
.spv-ac{ display:flex; flex-direction:column; align-items:flex-end; width:84px; min-width:0; line-height:1.15; }
.spv-ac b{ font:800 12.5px 'Cinzel',serif; color:var(--k-art); max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.spv-ac span{ font:700 12px 'JetBrains Mono',monospace; color:var(--k-num); max-width:100%; white-space:nowrap; }
.spv-arti.got .spv-med{ border-color:#5fe0a0; box-shadow:0 0 8px rgba(95,224,160,.6), inset 0 0 8px rgba(0,0,0,.6); }
.spv-arti.full{ opacity:.6; } /* квота этого режима заполнена — отсюда больше не падает */
.spv-arti.none{ cursor:default; } .spv-arti.none .spv-ac span{ font:italic 10.5px 'Inter',sans-serif; color:var(--k-sub); }
.spv-tip{ position:absolute; left:50%; bottom:58px; transform:translateX(-50%) translateY(6px); width:min(560px,92%); padding:8px 12px; border-radius:9px;
background:#1c1410; color:#f3e7c8; border:1px solid var(--gold-bright); box-shadow:0 8px 24px rgba(0,0,0,.6); font-size:11px; line-height:1.4; text-align:center;
opacity:0; pointer-events:none; transition:opacity .15s, transform .15s; z-index:5; }
.spv-tip.show{ opacity:1; transform:translateX(-50%) translateY(0); }
/* одна кнопка «Атаковать» по центру под режимами */
.spv-go{ align-self:center; width:min(300px,100%); height:46px; flex-shrink:0; margin-top:auto; font:800 15px 'Cinzel',serif; letter-spacing:.06em; cursor:pointer;
color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-radius:10px; }
.spv-go.off{ background:linear-gradient(180deg,#5a4c78,#2e2444); color:#c9bede; border-color:#5a4a80; cursor:not-allowed; }
.spv-go:active{ transform:scale(.99); }
/* печати (05.10.2026, 44-я, его правка): одна маленькая кнопка «Печать Аха 3 / 3», нажал — окно покупки; с 65-й — под портретом */
.spv-keys{ flex:0 0 auto; display:flex; justify-content:center; align-items:center; max-width:100%; }
.spv-buy{ display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:7px; border:1px solid #e6c976; background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; font:800 10.5px 'Inter',sans-serif; cursor:pointer; white-space:nowrap; }
.spv-buy b{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#1e5a2a; } .spv-buy.no b{ color:#a02020; }
.spv-buy .siege-mark{ font-size:13px; text-shadow:none; }
.spv-buy:hover{ filter:brightness(1.08); }
.spv-buy.flat{ cursor:default; background:rgba(0,0,0,.3); color:var(--parchment); border-color:#5a4a2a; } .spv-buy.flat b{ color:#8ef0a8; } .spv-buy.flat.no b{ color:#ff8a6a; }
/* окошко покупки печатей (его правка 05.10.2026): четыре кнопки 1 / 3 / 5 / 10 с ценой, как жетоны Круга */
.sk-pop{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; max-width:100%; overflow:hidden; }
.sk-t{ font:800 14px 'Cinzel',serif; color:var(--gold-bright); letter-spacing:.04em; }
.sk-s{ font-size:11px; color:var(--muted); } .sk-s b{ color:var(--parchment); font-family:'JetBrains Mono',monospace; }
.sk-packs{ display:flex; gap:6px; max-width:100%; }
.sk-pack{ width:56px; padding:5px 2px; border-radius:9px; border:1px solid #d4a84b; background:linear-gradient(180deg,#3a2a10,#120c04); color:#ffe07a; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:2px; }
.sk-pack b{ font:900 16px 'JetBrains Mono',monospace; } .sk-pack small{ font:700 9px 'JetBrains Mono',monospace; color:var(--muted); }
.sk-pack:hover:not(:disabled){ filter:brightness(1.15); } .sk-pack:disabled{ opacity:.45; cursor:not-allowed; }
.sk-x{ margin-top:0; background:rgba(255,255,255,.08); color:var(--parchment); border-color:var(--border); }
/* 65-я: виды карточки. Клановые — море «Глубина Нила» (на любой неделе) */
#siegePrevModal[data-vid="clan"]{ --k-ac:#3a9ea6; --k-ac2:#7fe0ea; --k-line:rgba(95,200,212,.28); --k-row:rgba(4,30,38,.72);
--k-sel:linear-gradient(90deg,rgba(40,140,150,.45),rgba(4,40,48,.75)); --k-glow:rgba(110,220,235,.35); --k-txt:#e6fbff; --k-sub:#9fd6e0; --k-art:#f3e2b0; --k-num:#8ef0c8;
--k-med:radial-gradient(circle at 40% 35%,#2a7a86,#062a32 75%); --k-gem:radial-gradient(circle at 40% 35%,#c8fff4,#2fd0b0 55%,#0a6a5a); }
#siegePrevModal[data-vid="clan"] .spv-go{ height:48px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 38px; border-radius:0;
border-image:url(img/osada/more-knopka.webp) 0 76 fill / 0 38px stretch; color:#e8fbff; text-shadow:0 1px 2px #052a3a, 0 0 6px rgba(80,200,230,.6); }
#siegePrevModal[data-vid="clan"] .spv-go.off{ filter:grayscale(.85) brightness(.75); }
#siegePrevModal[data-vid="clan"] .spv-buy.flat{ background:rgba(4,30,40,.75); border-color:#3a9ea6; color:#dff8ff; }
/* 68-я: Проклятые, неделя «Пробуждение мумий» — цвета карточки как у «Ветра» (его слово «делай как везде награду за победу»); кнопка — своя, ниже */
#siegePrevModal[data-ned="0"]{ --k-ac:#b08a4a; --k-ac2:#f0c870; --k-line:rgba(220,180,110,.3); --k-row:rgba(40,24,10,.72);
--k-sel:linear-gradient(90deg,rgba(200,150,60,.45),rgba(40,24,10,.78)); --k-glow:rgba(240,200,112,.35); --k-txt:#f8ead0; --k-sub:#d8c090; --k-art:#ffe7b0; --k-num:#ffe08a;
--k-med:radial-gradient(circle at 40% 35%,#8a5a20,#2a1606 75%); }
/* Проклятые, неделя «Ветер пустыни» — песчаник и золото, кнопка с крыльями как в списке */
#siegePrevModal[data-ned="1"]{ --k-ac:#b08a4a; --k-ac2:#f0c870; --k-line:rgba(220,180,110,.3); --k-row:rgba(40,24,10,.72);
--k-sel:linear-gradient(90deg,rgba(200,150,60,.45),rgba(40,24,10,.78)); --k-glow:rgba(240,200,112,.35); --k-txt:#f8ead0; --k-sub:#d8c090; --k-art:#ffe7b0; --k-num:#ffe08a;
--k-med:radial-gradient(circle at 40% 35%,#8a5a20,#2a1606 75%); }
#siegePrevModal[data-ned="1"] .spv-go{ height:46px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 44px; border-radius:0;
border-image:url(img/osada/veter/knopka.webp) 0 86 fill / 0 44px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,190,.6); }
#siegePrevModal[data-ned="1"] .spv-go.off{ filter:grayscale(.85) brightness(.75); color:#2a2420; }
#siegePrevModal[data-ned="1"] .spv-buy.flat{ background:rgba(26,16,8,.75); border-color:#b08a4a; }
/* 66-я: Проклятые, неделя «Логово аспидов» — цвета карточки как у «Ветра» (его слово «бери всё с того, что делали»), кнопка с кобрами */
#siegePrevModal[data-ned="2"]{ --k-ac:#b08a4a; --k-ac2:#f0c870; --k-line:rgba(220,180,110,.3); --k-row:rgba(40,24,10,.72);
--k-sel:linear-gradient(90deg,rgba(200,150,60,.45),rgba(40,24,10,.78)); --k-glow:rgba(240,200,112,.35); --k-txt:#f8ead0; --k-sub:#d8c090; --k-art:#ffe7b0; --k-num:#ffe08a;
--k-med:radial-gradient(circle at 40% 35%,#8a5a20,#2a1606 75%); }
#siegePrevModal[data-ned="2"] .spv-go{ height:48px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 28px; border-radius:0;
border-image:url(img/osada/logovo/knopka.webp) 0 68 fill / 0 28px stretch; color:#f3dcae; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.6); }
#siegePrevModal[data-ned="2"] .spv-go.off{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
#siegePrevModal[data-ned="2"] .spv-buy.flat{ background:rgba(26,16,8,.75); border-color:#b08a4a; }
/* 68-я: «Пробуждение мумий» — кнопка карточки та же, что в списке (крышка саркофага с масками) */
#siegePrevModal[data-ned="0"] .spv-go{ height:48px; padding:0 2px; background:none; border-style:solid; border-color:transparent; border-width:0 31px; border-radius:0;
border-image:url(img/osada/mumii/knopka.webp) 0 62 fill / 0 31px stretch; color:#f3dcae; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.6); }
#siegePrevModal[data-ned="0"] .spv-go.off{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
#siegePrevModal[data-ned="0"] .spv-buy.flat{ background:rgba(26,16,8,.75); border-color:#b08a4a; }
/* 67-я: Проклятые, неделя «Последний приговор» — огненный суд: обсидиан, расплавленное золото, кровавый красный; красная огненная кнопка (лист ui-proba/prigovor/nabor/1-knopki.jpg).
Карточка клановых на любой неделе ставит data-ned='' — огонь туда не попадает. */
#siegePrevModal[data-ned="3"]{ --k-ac:#c0702a; --k-ac2:#ffb060; --k-line:rgba(240,140,70,.3); --k-row:rgba(36,10,6,.74);
--k-sel:linear-gradient(90deg,rgba(210,80,30,.5),rgba(36,10,6,.8)); --k-glow:rgba(255,130,50,.38); --k-txt:#fbe6d0; --k-sub:#e6b890; --k-art:#ffd8a8; --k-num:#ffc070;
--k-med:radial-gradient(circle at 40% 35%,#9a3a14,#2a0806 75%); }
#siegePrevModal[data-ned="3"] .spv-go{ height:48px; padding:11px 2px 0; /* 67-я: надпись по центру красной плашки */ background:none; border-style:solid; border-color:transparent; border-width:0 41px; border-radius:0;
border-image:url(img/osada/prigovor/knopka.webp) 0 82 fill / 0 41px stretch; color:#ffe6c8; text-shadow:0 1px 2px #000, 0 0 6px rgba(255,90,30,.6); }
#siegePrevModal[data-ned="3"] .spv-go.off{ filter:grayscale(.85) brightness(.75); color:#bdb6a8; }
#siegePrevModal[data-ned="3"] .spv-buy.flat{ background:rgba(36,10,6,.78); border-color:#c0702a; }
/* ===== Осада: бой (босс слева, описание справа) ===== */
/* Бой лежит набок: слева сцена с боссом и атаками, справа доска урона во всю высоту окна.
09.09.2026 — переодет по макету У1 (client/maket-osada-boy.html): состав и места прежние,
палитра «дела» — красная полоска как в окнах победы, плашки-чипы, доска в рамке дела. */
.siege-fight{ width:min(820px,97%); height:min(354px,371px); max-height:371px;
display:flex; flex-direction:row; gap:12px; padding:12px 14px; }
.sf-scene{ flex:1; min-width:0; display:flex; flex-direction:column; }
.sf-metarow{ display:flex; gap:6px; flex-wrap:wrap; }
.sf-chip{ display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:20px; white-space:nowrap;
font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--parchment);
background:rgba(0,0,0,.35); border:1px solid #3a2c50; }
.sf-chip:empty{ display:none; }
.sf-mode{ color:#e0b0ff; }
/* площадка босса: занимает всё свободное место между шапкой и атаками */
.sf-top{ position:relative; flex:1; min-height:0; display:flex; align-items:center; justify-content:center; }
.sf-allies{ width:270px; flex:0 0 auto; margin:0; font-size:11px; color:var(--muted); display:flex; flex-direction:column;
align-items:stretch; gap:4px; overflow:hidden;
background:rgba(0,0,0,.2); border:1px solid #5a4a30; border-radius:10px; padding:6px 8px; }
/* заголовок доски — золотой, как заголовки папирусов; справа 26px под крестик закрытия окна */
.sf-allies .bb-head{ font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; letter-spacing:.08em; padding-right:26px; margin:2px 2px 4px; }
.sf-allies .bb-foot{ flex-shrink:0; margin-top:auto; padding:5px 2px 0; text-align:center;
font-family:'JetBrains Mono',monospace; font-size:9.5px; font-weight:700; color:var(--muted); }
.sf-allies .bb-rank{ font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; }
.sf-allies .bb-row.me .bb-rank{ color:var(--gold-bright); }
.sf-allies .bb-row.me .bb-name{ color:#7ee0a0; }
.sf-allies .sa-label{ color:#9be07a; font-weight:600; }
.sf-allies .sa-ava{ font-size:16px; line-height:1; }
.sf-allies .sa-count{ color:#cdbfe0; font-weight:600; }
.sf-allies .ga-label{ color:#6fc7ff; font-weight:600; }
.ally-echo{ position:absolute; left:64px; top:8px; transform:translateX(-50%);
font-family:'Inter',sans-serif; font-size:11px; font-weight:600; color:#9be07a;
background:rgba(10,22,12,.9); border:1px solid #3a6a30; border-radius:7px; padding:2px 7px;
white-space:nowrap; pointer-events:none; z-index:4; animation:allyFloat 1.4s ease-out forwards; }
.ally-echo b{ color:#fff; }
.global-echo{ position:absolute; left:64px; top:36px; transform:translateX(-50%);
font-family:'Inter',sans-serif; font-size:11px; font-weight:600; color:#6fc7ff;
background:rgba(8,18,30,.9); border:1px solid #2a5a7a; border-radius:7px; padding:2px 7px;
white-space:nowrap; pointer-events:none; z-index:4; animation:allyFloat 1.4s ease-out forwards; }
.global-echo b{ color:#fff; }
@keyframes allyFloat{ 0%{opacity:0; transform:translate(-50%,6px);} 15%{opacity:1; transform:translate(-50%,0);} 100%{opacity:0; transform:translate(-50%,-28px);} }
.sf-boss{ width:min(178px,100%); aspect-ratio:1; flex-shrink:0; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.sf-boss svg{ width:100%; height:100%; filter:drop-shadow(0 0 10px rgba(192,96,255,.45)) drop-shadow(0 5px 6px rgba(0,0,0,.5)); }
.sf-boss.hit{ animation:hitShake .18s ease; }
/* Сундук с бонусными ключами — поверх портрета босса, в его левом нижнем углу.
Отдельная кнопка, а не часть .sf-boss: тап по боссу бьёт когтем, а по сундуку — открывает окно. */
/* Пирамидка (11.09.2026, вместо сундука 🎁): без рамки и фона, сидит СРАЗУ над «Теневым когтем» (12.09.2026, его слово: «совсем немного выше»).
Ярусы SVG засыпаются песком по личному урону, справа счёт «взято/всего». */
.sf-chest{ position:absolute; left:2px; bottom:-22px; width:auto; height:36px; padding:0 4px 0 0; z-index:5;
display:flex; align-items:flex-end; gap:2px; cursor:pointer; -webkit-tap-highlight-color:transparent;
background:none; border:0; filter:drop-shadow(0 0 5px rgba(255,210,74,.55)); }
.sf-chest svg{ width:34px; height:34px; overflow:visible; display:block; }
.sf-chest .pyr-n{ font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#ffd24a; line-height:1; padding-bottom:3px; }
.sf-chest:active{ transform:scale(.94); }
.sf-chest.done{ filter:drop-shadow(0 0 6px rgba(126,224,160,.7)); }
.sf-chest.done .pyr-n{ color:#7ee0a0; }
/* «Сбежать» (12.09.2026): маленький тёмно-красный чип в левом верхнем углу площадки босса —
прямо под чипом «⏳ Осада» (его слово: «перенеси под осада»). */
.sf-flee{ position:absolute; left:0; top:2px; z-index:5;
padding:3px 10px; border-radius:20px; white-space:nowrap; cursor:pointer; -webkit-tap-highlight-color:transparent;
font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:#ffb0a0;
background:rgba(40,8,12,.85); border:1px solid #7a2a30; }
.sf-flee:active{ transform:scale(.94); }
.sf-flee:disabled{ opacity:.5; cursor:default; }
/* Окно-подтверждение побега (12.09.2026): компактный вариант окна поражения — лента, «дело» босса, лист «Цена побега». */
.siege-fleeq.pw-modal{ width:min(560px,94%); height:auto; min-height:0; padding-bottom:12px; }
.sfq-top{ display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; width:100%; margin-top:6px; align-items:stretch; }
.sfq-top .pw-port{ width:96px; height:96px; }
.sfq-top .pw-grid{ grid-template-columns:minmax(0,1fr); gap:5px 0; padding:4px 10px 6px; }
.sfq-top .pw-g{ font-size:12px; }
.sfq-foot{ margin-top:10px; display:flex; gap:10px; justify-content:center; }
.sfq-foot .pw-btn{ min-width:160px; }
/* 66-я 14.10.2026: ОКНО ПОБЕГА в стиле окон победы/поражения (вариант Б): фон недели (pwFonApply), багровая рамка, лента, кнопки и значки —
картинки из img/pobeda (значки побега — лист ui-proba/pobeg-znachki-list.jpg: бриллиант, нет награды, выход) */
.siege-fleeq.pw-modal{ border:2px solid #a83a4a; border-radius:14px; background:radial-gradient(ellipse at 50% 30%, rgba(40,6,10,.35), rgba(10,2,4,.92) 75%), #12060a;
box-shadow:0 0 0 1px #2a060c, 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.siege-fleeq.pw-modal.pw-fon{ background:radial-gradient(ellipse at 50% 30%, rgba(30,4,8,.35), rgba(10,2,4,.9) 75%), var(--pw-fon) center/cover no-repeat, #12060a; }
.siege-fleeq.pw-modal .pw-ribbon{ width:min(340px,100%); height:96px; margin:-8px auto -14px; padding:6px 60px 0; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center;
border:0; border-radius:0; box-shadow:none; background:url(img/pobeda/lenta-porazh.webp) center/100% 100% no-repeat; filter:drop-shadow(0 4px 8px rgba(0,0,0,.6));
color:#fff; font-size:14px; letter-spacing:.05em; text-shadow:0 2px 3px #000; white-space:nowrap; }
.siege-fleeq.pw-modal .pw-ribbon small{ font-size:9.5px; color:#ffd0d6; text-shadow:none; }
.siege-fleeq .sfq-foot .pw-btn{ min-width:0; width:164px; height:46px; padding:0 0 2px; border:0; border-radius:0; box-shadow:none; font-size:14px; letter-spacing:.06em; color:#3a1c04;
background:url(img/pobeda/knopka-zoloto.webp) center/100% 100% no-repeat; text-shadow:0 1px 0 rgba(255,240,190,.6); filter:drop-shadow(0 3px 6px rgba(0,0,0,.55));
display:inline-flex; align-items:center; justify-content:center; gap:4px; }
.siege-fleeq .sfq-foot .pw-btn.red{ color:#f8ead0; background-image:url(img/pobeda/knopka-temnaya.webp); text-shadow:0 1px 2px #000; }
.siege-fleeq .sfq-foot .pw-btn .pw-ik{ width:20px; height:20px; }
.siege-fleeq .pw-g .pw-ik{ width:24px; height:24px; flex-shrink:0; }
.siege-fleeq .srp-title .pw-ik{ width:18px; height:18px; vertical-align:-4px; margin-right:5px; }
/* 66-я (его слово «в сбежать опять время на название босса налазит»): как у победы/поражения в 65-й — плашка имени и плашка времени отдельно, одна под другой */
.siege-fleeq .pw-mug .pw-plate{ width:96px; aspect-ratio:auto; height:auto; padding:0; margin:-5px auto 0; background:none; gap:3px; }
.siege-fleeq .pw-mug .pw-plate > span{ width:100%; aspect-ratio:491/149; display:flex; align-items:center; justify-content:center; padding:0 9%; box-sizing:border-box;
background:url(img/ramka/delo-plashka.webp) center/100% 100% no-repeat; font-size:10.5px; white-space:nowrap; overflow:hidden; }
.siege-fleeq .pw-mug .pw-plate small{ width:80%; margin:0 auto; }
.pw-btn.red{ color:#fff; background:linear-gradient(180deg,#d3415a,#8a1c30); border-color:#ff8090; text-shadow:0 1px 2px rgba(0,0,0,.5); }
/* шапка боя: имя, полоска и строка «осада / лига». flex:0 0 auto — иначе делит высоту с боссом пополам */
.sf-side{ position:relative; flex:0 0 auto; min-width:0; display:flex; flex-direction:column; gap:4px; } /* relative — под виджет Иероглифов справа (§2.13) */
.sf-name{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:#e0b0ff; line-height:1.15; }
.sf-hpwrap{ position:relative; width:56%; height:20px; background:#2a1420; border:1px solid #5a2a3a; border-radius:10px; overflow:hidden; }
.sf-hpfill{ position:absolute; inset:0; background:linear-gradient(90deg,#d3415a,#8a1c30); width:100%; transition:width .12s ease-out; }
.sf-hptext{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.7); }
.sf-timer{ color:#7fd0e0; }
.sf-timer.expired{ color:var(--crimson-bright); }
.sf-mult{ color:#9be07a; }
/* атаки — одним ровным рядом под боссом, компактные (раньше сетка ломалась на 3+2 и «плыла»).
Готовая атака (бесплатная без перезарядки или платная с зарядами) — в золотой рамке, как в макете У1;
размеры чуть меньше макета — его слово. */
.sf-weapons{ margin-top:4px; flex-shrink:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
/* Множитель платных ударов (11.09.2026, выбран макет М1 «Чипы»): ряд чипов над атаками, справа.
Выбранный — золотой. Карточки меча/стрелы/яда пересчитывают урон под него. */
.sf-multrow{ flex-shrink:0; display:flex; justify-content:flex-end; align-items:center; gap:4px; margin-top:6px;
font-family:'Inter',sans-serif; font-size:9px; color:var(--muted); }
.sf-multrow .mc{ padding:1px 7px; border-radius:6px; border:1px solid #5a4a30; background:#241c14; color:var(--gold-bright);
font-family:'JetBrains Mono',monospace; font-size:9.5px; font-weight:700; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.sf-multrow .mc.on{ background:var(--gold-bright); color:#2a1410; }
/* у платных атак число зарядов стоит в левом верхнем углу карточки (его слово), а не под уроном */
.sf-weapons .siege-wbtn .wb-charge.tl{ position:absolute; left:4px; top:3px; font-size:8.5px; color:var(--muted); }
.sf-weapons .siege-wbtn .wb-hits{ font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; color:#9be07a; line-height:1; }
.sf-weapons .siege-wbtn{ display:flex; flex-direction:column; align-items:center; gap:0; padding:5px 2px 4px; min-width:0;
border-radius:9px; background:rgba(0,0,0,.3); border:1px solid #3a2850; }
.sf-weapons .siege-wbtn.ready{ border-color:var(--gold-bright); box-shadow:0 0 9px rgba(230,201,118,.35); background:linear-gradient(180deg,#3a2a16,#241a0e); }
.sf-weapons .siege-wbtn .wb-dmg{ color:#e8c84e; }
.sf-weapons .siege-wbtn.ready .wb-dmg{ color:#f0d060; }
.sf-weapons .siege-wbtn.cooling{ opacity:.55; }
.sf-weapons .siege-wbtn.depleted{ opacity:.45; }
.sf-weapons .wb-ic{ font-size:18px; line-height:1; }
.sf-weapons .wb-nm{ font-size:8.5px; line-height:1.15; text-align:center; white-space:normal; max-width:100%;
display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; min-height:0; }
/* полное число «23 542» (12.09.2026, его слово) — не переносим и держим цифры одной ширины, чтобы ×100 читалось */
.sf-weapons .wb-dmg{ font-size:12px; font-weight:800; white-space:nowrap; font-variant-numeric:tabular-nums; letter-spacing:-.2px; }
.sf-weapons .wb-charge{ font-size:8.5px; }
.sf-weapons .wb-league{ font-size:8px; }
/* крестик закрытия боя перекрывался блоком босса (.sf-top) — поднимаем его над содержимым */
.siege-fight .modal-close{ z-index:6; }
/* кнопка обновления доски урона в бою (откат 3 с) */
.bb-refresh{ font-size:10px; font-weight:700; color:var(--gold-bright); background:rgba(0,0,0,.3);
border:1px solid #3a2850; border-radius:7px; padding:3px 8px; cursor:pointer; white-space:nowrap; }
.bb-refresh:hover{ border-color:var(--gold-bright); }
.bb-refresh.cooling{ color:var(--muted); border-color:#2c2040; cursor:default; }
.siege-fight .weapon-btn{ width:auto; }
.weapon-btn.cooling{ opacity:.5; }
.weapon-btn .wb-charge.cd{ color:#7fd0e0; }
.weapon-btn .wb-buy{ position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
background:linear-gradient(180deg,#6ee08a,#37a85a); border:1px solid #2c8048; color:#08210f;
font-size:13px; font-weight:700; line-height:16px; text-align:center; box-shadow:0 1px 3px rgba(0,0,0,.4); }
.sf-toast{ position:absolute; left:50%; bottom:14px; transform:translateX(-50%); z-index:6;
background:rgba(20,10,28,.95); border:1px solid #6a40a0; border-radius:9px; padding:7px 13px;
font-size:12px; color:#e0b0ff; white-space:nowrap; box-shadow:0 4px 14px rgba(0,0,0,.5); }
/* ===== Осада: магазин атак ===== */
/* набок: четыре пачки в один ряд — окно становится низким и не упирается в края экрана. */
.siege-shop{ width:min(500px,94%); text-align:center; }
.shop-head{ display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:8px; }
.shop-ic{ font-size:26px; }
.shop-desc{ font-size:12px; color:var(--parchment); line-height:1.5; margin-bottom:14px; }
.shop-desc b{ color:var(--gold-bright); }
.shop-buys{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.shop-buy{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 4px; cursor:pointer;
background:linear-gradient(180deg,var(--panel-light),#18120d); border:1px solid var(--border); border-radius:10px; transition:border-color .12s, transform .07s; }
.shop-buy:not(:disabled):hover{ border-color:var(--gold); }
.shop-buy:active{ transform:scale(.95); }
.shop-buy:disabled{ opacity:.45; cursor:not-allowed; }
.shop-buy .sb-n{ font-family:'Cinzel',serif; font-weight:800; font-size:15px; color:#e0b0ff; }
.shop-buy .sb-cost{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; color:#6fd9d3; }
/* 68-я: окно «купить атаки» в бою картинкой (.ok, data-w=frost|bolt|meteor; 698×300): имя в табличке 36–64 % × 2,3–17,3 %, текст на полосе 14–82 % × 29–48 %, 4 плитки 58–92 % */
#siegeShopModal.ok{ width:min(560px,94%); aspect-ratio:698/300; padding:0; border:0; border-radius:0; box-shadow:none; background:var(--okno) center/100% 100% no-repeat; filter:drop-shadow(0 14px 26px rgba(0,0,0,.8)); }
#siegeShopModal.ok[data-w="frost"]{ --okno:url(img/osada/okno-ataki-frost.webp); } #siegeShopModal.ok[data-w="bolt"]{ --okno:url(img/osada/okno-ataki-bolt.webp); } #siegeShopModal.ok[data-w="meteor"]{ --okno:url(img/osada/okno-ataki-meteor.webp); }
#siegeShopModal.ok .shop-head{ position:absolute; left:36%; width:28%; top:2.3%; height:15%; margin:0; } #siegeShopModal.ok .shop-ic{ display:none; }
#siegeShopModal.ok .pm-title{ font-size:15px; text-shadow:0 1px 2px #000; }
#siegeShopModal.ok .shop-desc{ position:absolute; left:15%; width:66%; top:29%; height:19%; margin:0; display:flex; align-items:center; justify-content:center; font-size:13px; line-height:1.35; text-shadow:0 1px 2px #000; }
#siegeShopModal.ok .shop-desc .srp-val{ width:15px; height:15px; vertical-align:-3px; } #siegeShopModal.ok .sb-cost .srp-val{ width:14px; height:14px; }
#siegeShopModal.ok .shop-buys{ display:block; }
#siegeShopModal.ok .shop-buy{ position:absolute; top:58%; height:34%; width:11.4%; margin:0; padding:3px 0 4px; justify-content:space-between; gap:0; background:var(--pic) center 37%/auto 40% no-repeat; border:0; border-radius:8px; box-shadow:none; } /* 68-я: картинка оружия фоном плитки, «+N» сверху, кости и цена снизу */
#siegeShopModal.ok .shop-buy:nth-child(1){ left:12.8%; } #siegeShopModal.ok .shop-buy:nth-child(2){ left:33.8%; } #siegeShopModal.ok .shop-buy:nth-child(3){ left:54.7%; } #siegeShopModal.ok .shop-buy:nth-child(4){ left:75.6%; }
#siegeShopModal.ok .shop-buy:not(:disabled):hover{ filter:brightness(1.25); }
#siegeShopModal.ok .sb-n{ font-size:15px; color:#fff; line-height:1; text-shadow:0 1px 2px #000, 0 0 5px #000; } #siegeShopModal.ok .sb-cost{ display:flex; flex-direction:column; align-items:center; gap:1px; font-size:11.5px; color:#ffe08a; line-height:1; text-shadow:0 1px 2px #000, 0 0 4px #000; } /* 68-я: кости над ценой (его слово) */
#siegeShopModal.ok .modal-close{ right:-6px; top:-6px; z-index:2; background:rgba(0,0,0,.7); }
/* ===== Осада: окна победы, поражения и побега =====
Общее (.pw-modal): лента-заголовок, «дело» босса со штампом, лист строк .pw-grid/.pw-g (им пользуется окно побега),
одна-две кнопки. Победа и поражение с 65-й (14.10.2026) — вариант Б (.pw-b, ниже); побег — прежний компактный вид. */
.pw-modal{ width:min(740px,96%); height:min(380px,374px); max-height:374px; padding:0 14px 10px;
display:flex; flex-direction:column; align-items:center; gap:5px; overflow:hidden; text-align:center; }
.pw-ribbon{ margin-top:-1px; padding:7px 34px; font-family:'Cinzel',serif; font-weight:900; font-size:15px; letter-spacing:.14em; text-transform:uppercase; color:#2a1410;
background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-top:0; border-radius:0 0 12px 12px; box-shadow:0 4px 10px rgba(0,0,0,.5); }
.pw-ribbon small{ display:block; font-family:'Inter',sans-serif; font-weight:600; font-size:10px; letter-spacing:0; text-transform:none; color:#5a3a14; margin-top:1px; min-height:12px; }
.pw-lose .pw-ribbon{ background:linear-gradient(180deg,#d3415a,#8a1c30); color:#fff; border-color:#ff8090; }
.pw-lose .pw-ribbon small{ color:#ffd0d8; font-style:italic; }
.pw-mug{ display:flex; flex-direction:column; gap:4px; }
.pw-port{ width:124px; height:124px; }
.pw-port .siege-port{ inset:0; }
.pw-lose .pw-port .siege-port{ filter:grayscale(.5); }
.pw-stamp{ position:absolute; left:50%; top:44%; transform:translate(-50%,-50%) rotate(-18deg); z-index:1; font-family:'Cinzel',serif; font-weight:900; font-size:12px; letter-spacing:.06em; text-transform:uppercase;
color:#e0405a; border:3px solid #e0405a; border-radius:6px; padding:3px 8px; opacity:.9; text-shadow:0 0 6px rgba(0,0,0,.6); background:rgba(20,6,10,.35); white-space:nowrap; }
.pw-stamp.g{ color:#8a7ea0; border-color:#8a7ea0; }
.pw-plate{ font-family:'Cinzel',serif; font-weight:800; font-size:12px; color:#e0b0ff; }
.pw-plate small{ display:block; font-family:'JetBrains Mono',monospace; font-weight:600; font-size:10px; color:var(--muted); margin-top:1px; min-height:12px; }
.pw-dark{ position:relative; display:flex; flex-direction:column; align-items:center; padding:0 8px 6px; min-width:0;
border:1px solid #5a4a30; border-radius:6px; box-shadow:inset 0 0 0 1px #2a2018; background:linear-gradient(180deg,#1c150c,#0f0b08); }
.pw-dark .srp-title{ color:var(--gold-bright); }
.pw-grid{ position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 26px; flex:1; align-content:center; padding:2px 10px; width:100%; }
.pw-g{ display:flex; align-items:center; gap:8px; font-size:11.5px; font-weight:700; color:#3a2410; white-space:nowrap; min-width:0; text-align:left; }
.pw-g .pw-ic{ font-size:20px; width:24px; text-align:center; flex-shrink:0; }
.pw-g .siege-mark{ font-size:20px; text-shadow:none; }
.pw-g b{ font-family:'JetBrains Mono',monospace; color:#1e5a2a; }
.pw-g small{ display:block; font-size:9.5px; font-weight:400; color:#6a4a20; white-space:normal; line-height:1.2; }
.pw-dark .pw-g{ color:var(--parchment); } .pw-dark .pw-g b{ color:#ff8090; } .pw-dark .pw-g small{ color:var(--muted); }
.pw-hp{ grid-column:1/-1; position:relative; height:16px; border-radius:8px; background:#2a1420; border:1px solid #5a2a3a; overflow:hidden; width:92%; justify-self:center; }
.pw-hp span{ position:absolute; left:0; top:0; bottom:0; background:linear-gradient(90deg,#d3415a,#8a1c30); }
.pw-hp b{ position:absolute; inset:0; text-align:center; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; line-height:14px; color:#fff; }
.pw-podt{ font-family:'Cinzel',serif; font-weight:800; font-size:11px; letter-spacing:.12em; color:var(--gold-bright); text-transform:uppercase; }
.pw-empty{ font-size:11px; color:var(--muted); align-self:center; }
.pw-foot{ margin-top:auto; display:flex; gap:10px; }
.pw-btn{ min-width:200px; font-family:'Cinzel',serif; font-weight:800; font-size:13px; letter-spacing:.03em; border-radius:9px; padding:9px 18px; cursor:pointer;
color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; }
.pw-btn.dark{ color:var(--parchment); background:rgba(0,0,0,.3); border-color:#3a2c50; }
.pw-btn:active{ transform:scale(.98); }
/* --- Вариант Б «Две колонки» (65-я 14.10.2026, его выбор, client/maket-pobeda.html): победа и поражение ---
Слева «дело» босса — его верх на уровне плиток (его слово «опусти… на уровне с началом печати»), справа лента, плитки,
«Лучшие бойцы» — 8 строк в две колонки «1. Имя урон», кнопка справа внизу. Фон окна — картинка недели (pwFonApply в js/11). */
.pw-modal.pw-b{ width:min(770px,96%); height:min(372px,374px); padding:0 16px 12px; box-sizing:border-box; display:grid; grid-template-columns:184px minmax(0,1fr);
gap:0 14px; align-items:stretch; border:2px solid #c9a24a; border-radius:14px;
background:radial-gradient(ellipse at 50% 30%, rgba(40,26,12,.30), rgba(6,4,2,.9) 75%), #140e08;
box-shadow:0 0 0 1px #2a1a06, 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.pw-modal.pw-b.pw-fon{ background:radial-gradient(ellipse at 50% 30%, rgba(4,8,10,.25), rgba(2,4,6,.88) 75%), var(--pw-fon) center/cover no-repeat, #0a0c0e; }
.pw-b.pw-lose{ border-color:#a83a4a; box-shadow:0 0 0 1px #2a060c, 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.pw-b.pw-lose.pw-fon{ background:radial-gradient(ellipse at 50% 30%, rgba(30,4,8,.35), rgba(10,2,4,.9) 75%), var(--pw-fon) center/cover no-repeat, #12060a; }
.pw-rays{ position:absolute; left:58%; top:4%; width:760px; height:760px; margin:-380px 0 0 -380px; border-radius:50%; pointer-events:none; opacity:.55; z-index:0;
background:repeating-conic-gradient(from 0deg, rgba(255,215,120,.20) 0deg 5deg, transparent 5deg 15deg);
-webkit-mask:radial-gradient(circle, #000 0%, #000 22%, transparent 55%); mask:radial-gradient(circle, #000 0%, #000 22%, transparent 55%); }
.pw-lose .pw-rays{ background:repeating-conic-gradient(from 0deg, rgba(255,80,90,.14) 0deg 5deg, transparent 5deg 15deg); }
.pw-b .pw-mug{ position:relative; z-index:1; align-items:center; gap:2px; padding-top:62px; }
.pw-b .pw-port{ width:168px; height:auto; }
.pw-b .pw-stamp{ font-size:13px; }
/* 65-я (его слово «на имя босса налазит время»): плашка имени и плашка времени — отдельно, одна под другой, а не в одной картинке */
.pw-b .pw-mug .pw-plate{ width:168px; aspect-ratio:auto; height:auto; padding:0; background:none; gap:3px; }
.pw-b .pw-mug .pw-plate > span{ width:100%; aspect-ratio:491/149; display:flex; align-items:center; justify-content:center; padding:0 12%; box-sizing:border-box;
background:url(img/ramka/delo-plashka.webp) center/100% 100% no-repeat; font-size:12px; white-space:nowrap; overflow:hidden; }
.pw-b .pw-mug .pw-plate small{ width:72%; margin:0 auto; }
.pw-b .pw-right{ position:relative; z-index:1; min-width:0; min-height:0; display:flex; flex-direction:column; align-items:stretch; gap:5px; }
/* лента — картинка Gemini (65-я, PROMTY-okno-top.md §4: img/pobeda/lenta-pobeda / lenta-porazh), текст игра пишет поверх, на середину полотна */
.pw-b .pw-ribbon{ align-self:center; width:min(340px,100%); height:96px; margin:-8px 0 -12px; padding:4px 60px 0; box-sizing:border-box; flex-shrink:0;
display:flex; flex-direction:column; align-items:center; justify-content:center; border:0; border-radius:0; box-shadow:none;
background:url(img/pobeda/lenta-pobeda.webp) center/100% 100% no-repeat; filter:drop-shadow(0 4px 8px rgba(0,0,0,.6));
color:#3a1c04; font-size:15px; letter-spacing:.08em; text-shadow:0 1px 0 rgba(255,240,190,.6); white-space:nowrap; }
.pw-b .pw-ribbon small{ font-size:9.5px; color:#5a3208; text-shadow:none; }
/* 65-я, его выбор «А»: у победы тоже красная лента с чёрным камнем (lenta-porazh), окно остаётся золотым */
.pw-b:not(.pw-lose) .pw-ribbon{ background-image:url(img/pobeda/lenta-porazh.webp); color:#fff; font-size:15px; letter-spacing:.07em; text-shadow:0 2px 3px #000; padding-top:6px; }
.pw-b:not(.pw-lose) .pw-ribbon small{ color:#ffe0a8; }
.pw-b.pw-lose .pw-ribbon{ background-image:url(img/pobeda/lenta-porazh.webp); color:#fff; font-size:14px; letter-spacing:.05em; text-shadow:0 2px 3px #000; padding-top:6px; }
.pw-b.pw-lose .pw-ribbon small{ color:#ffd0d6; }
/* штампы — картинки (§6): красная печать со скрещёнными хопешами / серая с пустыми часами; слово остаётся в разметке, но не видно */
.pw-b .pw-stamp{ width:58px; height:58px; padding:0; border:0; border-radius:0; background:url(img/pobeda/shtamp-povergen.webp) center/contain no-repeat;
color:transparent; text-shadow:none; font-size:0; left:72%; top:64%; transform:translate(-50%,-50%) rotate(-14deg); opacity:.9; filter:drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.pw-b .pw-stamp.g{ background-image:url(img/pobeda/shtamp-ushel.webp); opacity:.9; }
/* плитки наград / итога: рамка-плитка из игры (img/ramka/plitka.webp), значок в медальоне, число, подпись */
.pw-tiles{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:8px; flex-shrink:0; }
.pw-tiles:has(.pw-hp){ grid-auto-flow:row; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px 8px; }
.pw-tiles .pw-hp{ grid-column:1/-1; width:100%; height:14px; }
.pw-tiles .pw-hp b{ line-height:12px; }
/* плитка — рамка Gemini (65-я, PROMTY-okno-top.md §7: золотая у победы, красная у поражения); содержимое по центру ВНУТРИ рамки (его слово: «осталось нанести висит в воздухе») */
.pw-t{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; height:80px; min-width:0; padding:8px 10% 7px; box-sizing:border-box; overflow:hidden;
background:url(img/pobeda/plitka-pobeda.webp) center/100% 100% no-repeat; text-align:center; }
.pw-lose .pw-t{ background-image:url(img/pobeda/plitka-porazh.webp); }
.pw-med{ width:36px; height:36px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center; box-sizing:border-box;
background:radial-gradient(circle at 40% 35%,#6a4a1c,#1e1206 75%); border:2px solid #c9a24a; box-shadow:0 2px 6px rgba(0,0,0,.6), inset 0 0 8px rgba(0,0,0,.6); }
.pw-med .srp-val{ width:24px; height:24px; } .srp-val.en{ background-image:url(img/ramka/val-energiya.webp); }
.pw-med .siege-mark{ display:flex; font-size:20px; text-shadow:none; } .pw-med .siege-mark svg, .pw-med .siege-mark img{ width:22px; height:22px; }
.pw-med svg{ width:24px; height:24px; } .pw-med img{ width:26px; height:26px; object-fit:contain; }
.pw-t .pw-med{ width:32px; height:32px; } .pw-t .pw-med .srp-val{ width:21px; height:21px; } .pw-t .pw-med img{ width:22px; height:22px; } .pw-t .pw-med svg{ width:21px; height:21px; }
.pw-med:has(.pw-ik){ border:0; background:none; box-shadow:0 2px 6px rgba(0,0,0,.6); } /* значок итога сам в золотом кольце */
.pw-t .pw-med .pw-ik{ width:34px; height:34px; }
.pw-t b{ font:800 13px/1.15 'JetBrains Mono',monospace; margin-top:2px; color:#8ef0a8; text-shadow:0 1px 2px #000; max-width:100%; white-space:nowrap; }
.pw-lose .pw-t b{ color:#ffb4a0; }
.pw-t .pw-tl{ font-size:9.5px; line-height:1.15; color:#e8dcc0; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pw-t small{ display:none; } /* мелкая строка (за что печати, сколько тотемов всего) в рамку не влезает — 65-я, прячем */
.pw-b .pw-podt{ display:flex; align-items:center; gap:10px; color:#f3e2b0; text-shadow:0 1px 2px #000; }
.pw-b .pw-podt::before, .pw-b .pw-podt::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,transparent,#c9a24a,transparent); }
/* «Лучшие бойцы»: 8 строк, две колонки по четыре — сверху вниз, потом вправо */
.pw-board{ display:grid; grid-template-rows:repeat(4,auto); grid-auto-flow:column; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 10px; min-height:0; } /* 68-я: всегда 2 колонки — при 1–4 бойцах строка была на всю ширину (его скрин) */
.pw-r{ display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:6px; height:23px; padding:0 10px 0 6px; border-radius:7px; box-sizing:border-box;
background:rgba(10,8,6,.72); border:1px solid rgba(201,162,74,.25); text-align:left; }
.pw-r[data-frprofile]{ cursor:pointer; }
.pw-rn{ font:800 12px 'Cinzel',serif; color:#d8c090; text-align:right; }
.pw-rnm{ font:700 12px 'Inter',sans-serif; color:#f8ead0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.pw-r b{ font:700 12px 'JetBrains Mono',monospace; color:#ffe08a; white-space:nowrap; }
.pw-r.p1{ background:linear-gradient(90deg, rgba(255,215,106,.30), rgba(10,8,6,.8) 70%); border-color:#ffd76a; } .pw-r.p1 .pw-rn{ color:#ffd76a; }
.pw-r.p2 .pw-rn{ color:#d6e0ee; } .pw-r.p3 .pw-rn{ color:#e0a060; }
.pw-r.me{ border-color:#5ff0d0; box-shadow:0 0 10px rgba(95,240,208,.3); } .pw-r.me .pw-rnm{ color:#7ef0d8; }
.pw-r.prem .pw-rnm{ color:#ffd76a; }
.pw-b .pw-empty{ grid-column:1/-1; text-align:center; }
.pw-b .pw-foot{ margin-top:auto; justify-content:flex-end; }
/* кнопки — картинки (§5): золотая «Забрать», тёмно-красная «Закрыть» */
.pw-b .pw-btn{ min-width:0; width:164px; height:46px; padding:0 0 2px; border:0; border-radius:0; box-shadow:none; font-size:15px; letter-spacing:.08em; color:#3a1c04;
background:url(img/pobeda/knopka-zoloto.webp) center/100% 100% no-repeat; text-shadow:0 1px 0 rgba(255,240,190,.6); filter:drop-shadow(0 3px 6px rgba(0,0,0,.55)); }
.pw-b .pw-btn:hover{ filter:drop-shadow(0 3px 6px rgba(0,0,0,.55)) brightness(1.08); }
/* 66-я, его слово «кнопку Забрать на клановых сделай морскую»: как «Атаковать» у клановых (more-knopka, края 9-частями) */
.pw-b.pw-klan .pw-btn{ height:48px; padding:0 2px 2px; background:none; border-style:solid; border-color:transparent; border-width:0 38px; border-radius:0;
border-image:url(img/osada/more-knopka.webp) 0 76 fill / 0 38px stretch; color:#e8fbff; text-shadow:0 1px 2px #052a3a, 0 0 6px rgba(80,200,230,.6); }
.pw-b .pw-btn.dark{ color:#f8ead0; background-image:url(img/pobeda/knopka-temnaya.webp); text-shadow:0 1px 2px #000; }
.bb-row.prem .bb-name{ color:#ffd76a; } .bb-row.prem .bb-ava svg{ width:22px; height:22px; }
/* ===== Осада: окно сундука — бонусные ключи за личный урон ===== */
.siege-bonus{ width:min(330px,90%); }
/* Восстановить удар (11.09.2026, макет В1): значок слева, имя и таймер справа, строка цены, одна кнопка */
.siege-restore{ width:min(330px,90%); }
.srs-head{ display:flex; gap:12px; align-items:center; text-align:left; }
.srs-head .sbn-title{ margin-bottom:2px; } .srs-head .sbn-sub{ margin-bottom:0; }
.srs-ico{ flex-shrink:0; width:54px; height:54px; border-radius:12px; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center;
font-size:27px; line-height:1; background:radial-gradient(circle at 50% 35%,#4a2c10,#180d05); }
.srs-cost{ margin:12px 0 10px; padding:9px 12px; border-radius:9px; border:1px solid #3a2c22; background:rgba(0,0,0,.3);
display:flex; justify-content:space-between; align-items:center; font-size:11.5px; color:var(--parchment); }
.srs-cost b{ font-family:'JetBrains Mono',monospace; font-size:14px; color:#ffd24a; }
.srs-cost small{ margin-left:8px; font-size:10.5px; color:var(--muted); }
.srs-cost.lack b{ color:#e08a8a; }
.srs-btn{ display:block; width:100%; }
.sbn-title{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:#ffd24a; margin-bottom:6px; }
.sbn-sub{ font-size:11.5px; color:var(--muted); line-height:1.45; margin-bottom:12px; }
.sbn-sub b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.sbn-list{ display:flex; flex-direction:column; gap:7px; margin-bottom:12px; }
/* Папирус со ступенями (11.09.2026, макет П3): каменная дорожка с золотой заливкой личного урона,
на ступенях обелиски (взятый — зелёный), под каждым табличка с наградой и «ещё N». От 1 до 5 ступеней. */
.sbn-paper{ position:relative; margin:0 0 10px; padding:6px 4px 2px; border-radius:6px; border:1px solid #a88b52;
background:linear-gradient(160deg,#f0e2bc 0%,#e4d1a3 55%,#d9c48f 100%); box-shadow:0 2px 6px rgba(0,0,0,.45), inset 0 0 14px rgba(120,80,20,.22); }
.sbn-paper::before{ content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:repeating-linear-gradient(0deg,rgba(90,60,20,.045) 0 1px,transparent 1px 4px); }
.sbn-track{ position:relative; height:22px; margin:26px 28px 52px; background:#2a1e14; border:2px solid #8a6a30; border-radius:4px; box-shadow:inset 0 2px 6px rgba(0,0,0,.7); }
.sbn-track .fl{ position:absolute; left:0; top:0; bottom:0; background:linear-gradient(90deg,#c8912a,#ffe27a); box-shadow:0 0 8px rgba(255,220,120,.7); border-radius:2px; }
.sbn-track .me{ position:absolute; top:-16px; transform:translateX(-50%); font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#7a3a10; white-space:nowrap; }
.sbn-track .ob{ position:absolute; top:-20px; width:12px; height:64px; transform:translateX(-50%); }
.sbn-track .ob i{ position:absolute; left:0; right:0; top:0; height:48px; border-radius:2px; clip-path:polygon(50% 0,100% 12%,100% 100%,0 100%,0 12%);
background:linear-gradient(90deg,#b8904e,#e6c976 40%,#8a6a30); }
.sbn-track .ob.ok i{ background:linear-gradient(90deg,#3f7a52,#7ee0a0 40%,#2a5a3a); }
.sbn-track .tb{ position:absolute; left:50%; top:52px; transform:translateX(-50%); white-space:nowrap; padding:3px 6px; text-align:center; line-height:1.25;
font-family:'Inter',sans-serif; font-size:9.5px; font-weight:700; color:#3a2410; border:1px solid #a88b52; border-radius:4px; background:linear-gradient(160deg,#f0e2bc,#d9c48f); }
.sbn-track .tb .siege-mark{ font-size:11px; vertical-align:-1px; }
.sbn-track .tb small{ display:block; font-family:'JetBrains Mono',monospace; font-size:8.5px; font-weight:700; color:#6b4a1e; }
.sbn-track .ob.ok .tb small{ color:#2a6a3a; }
.sbn-track .ob.nx .tb{ box-shadow:0 0 8px rgba(255,210,74,.7); border-color:#c8912a; }
.sbn-row{ display:flex; align-items:center; gap:9px; padding:8px 10px;
background:rgba(40,20,55,.35); border:1px solid #3a2850; border-radius:9px; }
.sbn-row.ok{ background:rgba(20,45,30,.4); border-color:#3f7a52; }
.sbn-ic{ font-size:14px; width:18px; text-align:center; flex-shrink:0; }
.sbn-tx{ flex:1; min-width:0; font-size:11.5px; color:var(--parchment); line-height:1.35; text-align:left; }
.sbn-tx small{ display:block; font-size:10px; color:var(--muted); }
.sbn-k{ font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; color:#e6c976; flex-shrink:0; }
.sbn-note{ font-size:10.5px; line-height:1.4; color:var(--muted); text-align:center; }
/* 66-я 14.10.2026: ОКНО «ДОПОЛНИТЕЛЬНАЯ НАГРАДА» картинками (листы ui-proba/bonus): фон недели (pwFonApply), дорожка урона со скарабеями
(9 частей по жёлобу: 24 74 30 80 из 900×111), обелиски — камень / золото у взятой ступени, таблички — базальт / золото; песок-заливку рисует игра */
.siege-bonus{ width:min(360px,92%); border:2px solid #c9a24a; border-radius:14px; background:radial-gradient(ellipse at 50% 30%, rgba(40,26,12,.30), rgba(6,4,2,.9) 75%), #140e08;
box-shadow:0 0 0 1px #2a1a06, 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.siege-bonus.pw-fon{ background:radial-gradient(ellipse at 50% 30%, rgba(4,8,10,.35), rgba(2,4,6,.9) 75%), var(--pw-fon) center/cover no-repeat, #0a0c0e; }
.siege-bonus .sbn-sub{ color:#d8c9a8; }
.siege-bonus .sbn-paper{ background:none; border:0; box-shadow:none; padding:0; margin:0 0 6px; }
.siege-bonus .sbn-paper::before{ display:none; }
.siege-bonus .sbn-track{ box-sizing:border-box; height:31px; margin:58px 12px 50px; background:none; border-radius:0; box-shadow:none; border-style:solid; border-color:transparent;
border-width:7px 21px 8px 22px; border-image:url(img/bonus/dorozhka.webp) 24 74 30 80 fill / 7px 21px 8px 22px stretch; }
.siege-bonus .sbn-track .me{ top:-24px; color:#ffe7b0; text-shadow:0 1px 2px #000; }
.siege-bonus .sbn-track .ob{ top:-44px; width:20px; height:auto; }
.siege-bonus .sbn-track .ob i{ height:52px; border-radius:0; clip-path:none; background:url(img/bonus/obelisk-off.webp) center bottom/contain no-repeat; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.siege-bonus .sbn-track .ob.ok i{ background-image:url(img/bonus/obelisk-on.webp); }
.siege-bonus .sbn-track .tb{ top:74px; padding:5px 12px 6px; border:0; border-radius:0; color:#f3dcae; text-shadow:0 1px 2px #000;
background:url(img/bonus/tablichka-off.webp) center/100% 100% no-repeat; }
.siege-bonus .sbn-track .tb small{ color:#d8c090; }
.siege-bonus .sbn-track .ob.ok .tb{ background-image:url(img/bonus/tablichka-on.webp); color:#3a1c04; text-shadow:0 1px 0 rgba(255,240,190,.6); }
.siege-bonus .sbn-track .ob.ok .tb small{ color:#1e0f02; font-weight:800; text-shadow:0 0 3px rgba(255,230,170,.7); }
.siege-bonus .sbn-track .ob.nx .tb{ box-shadow:none; filter:drop-shadow(0 0 6px rgba(255,210,74,.75)); }
.siege-bonus .sbn-track .tb .siege-mark{ font-size:14px; vertical-align:-3px; }
.siege-bonus .sbn-note{ color:#bfae8a; }
/* ===== Недельный топ по урону (26.09.2026, его выбор: Р3 «Тройка + около меня» и С3 «Сокровищница», client/maket-top-sunduki.html) ===== */
/* 65-я 14.10.2026 (его слово «так же, как сейчас, просто красиво», client/maket-top-okno-2.html): раскладка та же, вид — песчаник и золото,
фон окна — картинка недели (SIEGE_OKNO_FON в js/11, у недель без картинки — тёмный), медали с крыльями, аватары и кланы в строках,
награды картинками (слава, кости, яд/стрела/меч); осколки героев — портретами, как были (героев дорисуем — его слово). */
.dmgtop-modal{ width:min(770px,96%); height:min(372px,374px); max-height:374px; padding:0; overflow:hidden; box-sizing:border-box;
display:flex; flex-direction:column; z-index:74; text-align:left; border:2px solid #b08a4a; border-radius:14px;
background:radial-gradient(ellipse at 50% 40%, rgba(40,26,12,.35), rgba(6,4,2,.9) 78%), #1a0f0a;
box-shadow:0 0 0 1px #2a1606, 0 0 30px rgba(0,0,0,.8), inset 0 0 40px rgba(0,0,0,.7); }
.dmgtop-modal.dt-fon{ background:radial-gradient(ellipse at 50% 40%, rgba(10,6,2,.30), rgba(6,4,2,.86) 78%), var(--dt-fon) center/cover no-repeat, #1a0f0a; }
#dmgTopBackdrop{ z-index:73; }
.dt-hdr{ flex-shrink:0; display:grid; grid-template-columns:minmax(0,236px) minmax(0,1fr) minmax(0,236px); align-items:center; padding:8px 12px 0; height:48px; }
.dt-tabs{ display:flex; gap:6px; }
.dt-tab{ width:112px; height:34px; display:flex; align-items:center; justify-content:center; gap:5px; padding:2px 0 0; box-sizing:border-box; cursor:pointer; white-space:nowrap;
font:800 12px 'Cinzel',serif; letter-spacing:.04em; background:none; border:0 solid transparent; border-radius:0;
border-image:url(img/osada/veter/vkladka-norm.webp) 0 60 fill / 0 17px stretch; color:#f3dcae; text-shadow:0 1px 2px #000; }
.dt-tab.on{ border-image-source:url(img/osada/veter/vkladka-sel.webp); color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
.dt-tab img{ width:16px; height:16px; flex-shrink:0; }
.dt-ttl{ text-align:center; min-width:0; }
.dt-t{ font:800 18px 'Cinzel',serif; color:#ffe7a8; letter-spacing:.06em; display:flex; align-items:center; justify-content:center; gap:10px; white-space:nowrap;
text-shadow:0 2px 4px #000, 0 0 12px rgba(255,200,90,.35); }
.dt-t span{ overflow:hidden; text-overflow:ellipsis; min-width:0; }
.dt-ar{ flex:0 0 22px; width:22px; height:22px; border-radius:50%; background:rgba(0,0,0,.5); border:1px solid #b08a4a; color:#f3dcae; font:700 12px/20px Inter,sans-serif; text-align:center; padding:0; cursor:pointer; }
.dt-ar:hover{ border-color:#f0c870; }
.dt-ar:disabled{ opacity:.35; cursor:default; }
.dt-s{ font-size:10px; color:#d8c090; margin-top:1px; letter-spacing:.1em; text-transform:uppercase; }
.dt-rt{ display:flex; justify-content:flex-end; align-items:center; gap:8px; min-width:0; }
.dt-timer{ display:flex; align-items:center; gap:6px; padding:4px 10px; border-radius:16px; background:rgba(0,0,0,.55); border:1px solid rgba(220,180,110,.4);
font:700 12px 'JetBrains Mono',monospace; color:#ffe08a; white-space:nowrap; }
.dt-timer small{ font:600 9px 'Inter',sans-serif; color:#d8c090; text-transform:uppercase; letter-spacing:.06em; }
.dt-x{ flex:0 0 28px; width:28px; height:28px; border-radius:50%; border:1px solid #b08a4a; background:rgba(0,0,0,.55); color:#f8ead0; font:700 14px/26px Inter,sans-serif; text-align:center; padding:0; cursor:pointer; }
.dt-body{ flex:1; min-height:0; position:relative; }
.dt-v{ position:absolute; inset:0; display:none; padding:6px 12px 10px; }
.dt-v.on{ display:flex; }
.dt-youtag{ font:800 9px Inter,sans-serif; color:#2a1606; background:#f0c870; border-radius:8px; padding:1px 6px; white-space:nowrap; text-transform:uppercase; }
svg.dt-chest-svg{ display:block; overflow:visible; }
img.dt-chest-img{ display:block; height:auto; filter:drop-shadow(0 3px 4px rgba(0,0,0,.6)); } /* 65-я: сундуки картинками (img/top) */
/* медали места — с крыльями (img/osada/veter/medal-*: 3 — золото, 2 — серебро, 1 — бронза); аватар — из профиля игрока */
.dt-medal{ display:block; width:30px; height:30px; margin:0 auto; flex-shrink:0; background:center/contain no-repeat; }
.dt-medal.m1{ background-image:url(img/osada/veter/medal-3.webp); } .dt-medal.m2{ background-image:url(img/osada/veter/medal-2.webp); } .dt-medal.m3{ background-image:url(img/osada/veter/medal-1.webp); }
.dmgtop-modal .pf-ava{ width:30px; height:30px; border-radius:50%; border:2px solid #b08a4a; font-size:16px; text-shadow:none; box-sizing:border-box; box-shadow:inset 0 0 6px rgba(0,0,0,.6); }
.dt-dm{ font:700 12.5px 'JetBrains Mono',monospace; color:#ffe08a; white-space:nowrap; }
.dt-dm i{ font-style:normal; color:#d8c090; font-size:11px; margin-right:3px; }
/* --- Рейтинг Р3 --- */
.dt-r3{ gap:12px; }
.dt-three{ flex:0 0 244px; display:flex; flex-direction:column; gap:4px; }
/* 65-я: карточки тройки в рамках Gemini (img/top/ramka-1…3: золото с рубином, серебро, бронза — с крыльями; PROMTY-okno-top.md).
Рамка — фон всей карточки; тёмная подложка (::before) только внутри рамки, крылья висят над фоном окна.
Отступы содержимого — по внутреннему окну рамки (замерено: бока ≈ 13–14 %, у золотой верх выше из-за крыльев). */
.dt-card{ flex:1; position:relative; display:grid; grid-template-columns:30px 38px minmax(0,1fr); gap:7px; align-items:center; padding:16px 34px 14px; box-sizing:border-box;
border:0; border-radius:0; overflow:visible; filter:drop-shadow(0 3px 5px rgba(0,0,0,.55)); background-repeat:no-repeat; }
/* два слоя: сверху рамка на всю карточку, под ней тёмная подложка ровно по внутреннему окну рамки (чуть заходит под планки) */
.dt-card.c1{ padding:30px 36px 11px; background-image:url(img/top/ramka-1.webp), linear-gradient(90deg, rgba(120,84,20,.94), rgba(40,26,8,.94));
background-size:100% 100%, 75.6% 55%; background-position:center, 50% 72.9%; }
.dt-card.c2{ background-image:url(img/top/ramka-2.webp), linear-gradient(90deg, rgba(70,74,84,.94), rgba(24,22,22,.94));
background-size:100% 100%, 76% 67%; background-position:center, 50% 53%; }
.dt-card.c3{ background-image:url(img/top/ramka-3.webp), linear-gradient(90deg, rgba(90,50,18,.94), rgba(30,16,6,.94));
background-size:100% 100%, 76% 67.5%; background-position:center, 50% 51%; }
.dt-card .dt-medal{ width:30px; height:30px; }
.dt-card .pf-ava{ width:38px; height:38px; font-size:20px; }
.dt-card.c1 .pf-ava{ border-color:#ffd76a; box-shadow:0 0 10px rgba(255,215,106,.6), inset 0 0 6px rgba(0,0,0,.6); }
.dt-card.c2 .pf-ava{ border-color:#d6e0ee; } .dt-card.c3 .pf-ava{ border-color:#c8843c; }
.dt-card .nm{ min-width:0; display:flex; flex-direction:column; line-height:1.15; }
.dt-card .n{ font:700 12.5px 'Inter',sans-serif; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 1px 2px #000; }
.dt-card .cl{ font-size:9px; color:#d8c090; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dt-card .dt-dm{ font-size:12.5px; margin-top:1px; overflow:hidden; }
.dt-card.you .n{ color:#ffe08a; }
.dt-card.empty{ opacity:.5; }
.dt-right{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.dt-seg{ flex-shrink:0; display:flex; align-self:center; padding:2px; border-radius:16px; background:rgba(0,0,0,.55); border:1px solid rgba(220,180,110,.35); }
.dt-seg span{ padding:4px 16px; border-radius:14px; font:700 11px 'Inter',sans-serif; color:#d8c090; cursor:pointer; }
.dt-seg span.on{ background:linear-gradient(180deg,#f0d080,#b8862a); color:#2a1606; box-shadow:inset 0 1px 0 rgba(255,255,255,.4); }
.dt-list{ flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:3px; padding-right:3px; }
.dt-list > *{ flex-shrink:0; }
.dt-row{ display:grid; grid-template-columns:34px 30px minmax(0,1fr) auto; align-items:center; gap:9px; height:33px; padding:0 12px 0 6px; box-sizing:border-box;
border-radius:8px; background:rgba(40,24,10,.66); border:1px solid rgba(220,180,110,.18); }
.dt-row .pl{ font:800 13px 'Cinzel',serif; color:#d8c090; text-align:center; white-space:nowrap; overflow:hidden; }
.dt-row .nm{ min-width:0; display:flex; flex-direction:column; line-height:1.15; }
.dt-row .nm b{ font:700 13px 'Inter',sans-serif; color:#f8ead0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dt-row .nm span{ font-size:9.5px; color:#b8a070; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dt-row.you, .dt-list .dt-row.you{ background:linear-gradient(90deg, rgba(200,150,60,.5), rgba(60,36,12,.85)); border-color:#f0c870; box-shadow:0 0 10px rgba(240,200,112,.35); }
.dt-row.you .nm b{ color:#fff; }
#dtMe{ flex-shrink:0; }
.dmgtop-modal [data-pcard]:not([data-pcard=""]){ cursor:pointer; }
.dt-dots{ text-align:center; color:#b8a070; font-size:11px; letter-spacing:3px; height:6px; line-height:5px; }
.dt-empty{ font-size:12px; color:#d8c090; text-align:center; padding:18px 6px; text-shadow:0 1px 2px #000; }
/* --- Награды С3 «Сокровищница» --- */
.dt-s3{ gap:12px; }
.dt-rail{ flex:0 0 156px; display:flex; flex-direction:column; gap:4px; }
.dt-rb{ flex:1; min-height:0; display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:6px; padding:0 8px 0 4px; border-radius:9px; cursor:pointer;
background:rgba(40,24,10,.66); border:1px solid rgba(220,180,110,.2); }
.dt-rb .lb{ font:800 13px 'Cinzel',serif; color:#e8d4a8; white-space:nowrap; }
.dt-rb.on{ background:linear-gradient(90deg, rgba(200,150,60,.5), rgba(40,24,10,.82)); border-color:#f0c870; box-shadow:0 0 10px rgba(240,200,112,.3); }
.dt-rb.on .lb{ color:#fff3c8; }
.dt-stage{ flex:1; min-width:0; position:relative; border-radius:12px; overflow:hidden; border:1px solid rgba(220,180,110,.3); box-shadow:inset 0 0 30px rgba(0,0,0,.6);
background:radial-gradient(ellipse at 50% 85%, rgba(255,200,90,.28), rgba(0,0,0,0) 55%), rgba(20,12,4,.5); }
.dt-rays{ position:absolute; left:50%; top:80%; width:640px; height:640px; margin:-320px 0 0 -320px; border-radius:50%; opacity:.45; pointer-events:none;
background:repeating-conic-gradient(from 0deg, rgba(255,215,120,.22) 0deg 6deg, transparent 6deg 18deg);
-webkit-mask:radial-gradient(circle, #000 0%, #000 30%, transparent 62%); mask:radial-gradient(circle, #000 0%, #000 30%, transparent 62%); animation:dtSpin 40s linear infinite; }
@keyframes dtSpin{ to{ transform:rotate(360deg); } }
.dt-big{ position:absolute; left:50%; bottom:4px; transform:translateX(-50%); pointer-events:none; filter:drop-shadow(0 6px 10px rgba(0,0,0,.6)); }
.dt-sh{ position:absolute; left:14px; top:10px; display:flex; align-items:center; gap:8px; z-index:2; }
.dt-sh b{ font:800 17px 'Cinzel',serif; color:#ffe7a8; text-shadow:0 2px 4px #000; letter-spacing:.04em; }
.dt-orb{ position:absolute; width:80px; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:2px; z-index:2; }
.dt-orb .ic{ width:50px; height:50px; display:flex; align-items:center; justify-content:center; position:relative; box-sizing:border-box; }
.dt-orb .ic > img{ max-width:100%; max-height:100%; filter:drop-shadow(0 3px 4px rgba(0,0,0,.7)); }
.dt-orb .ic.cur{ border-radius:50%; background:radial-gradient(circle at 40% 35%,#8a5a20,#2a1606 75%); border:2px solid #c9a24a;
box-shadow:0 3px 6px rgba(0,0,0,.6), inset 0 0 8px rgba(0,0,0,.6), 0 0 12px rgba(255,200,90,.35); }
.dt-orb .ic.cur > img{ width:32px; height:32px; }
.dt-orb .c{ max-width:80px; font:800 13px 'JetBrains Mono',monospace; color:#fff; white-space:nowrap; overflow:hidden; text-shadow:0 1px 3px #000; }
.dt-orb .n{ font-size:9.5px; color:#d8c090; white-space:nowrap; margin-top:-2px; text-shadow:0 1px 2px #000; }
.dt-orb.sl .c{ color:#ffe08a; }
/* осколки героя — портрет в золотом круге со значком ✦ (картинки героев дорисуем — его слово) */
.dt-orb.sh .ic, .dt-orb.hero .ic{ border-radius:50%; background:radial-gradient(circle at 50% 35%,#5a4628,#1a120a); border:2px solid #c9a24a; box-shadow:0 0 12px rgba(255,210,100,.35); }
.dt-orb .ic .pt{ width:100%; height:100%; border-radius:50%; overflow:hidden; }
.dt-orb .ic .pt svg, .dt-orb .ic .pt img{ display:block; width:100%; height:100%; object-fit:cover; }
.dt-orb .ic .bd{ position:absolute; right:-4px; bottom:-3px; font:800 9px Inter,sans-serif; color:#0a1a2a; background:#9fd8ff; border-radius:999px; padding:0 3px; }
.dt-orb.sh .c{ color:#9fd8ff; }
.dt-orb.hero{ cursor:pointer; }
.dt-orb.sh{ cursor:pointer; }
.dt-orb.sh .ic.med{ border:0; background:none; box-shadow:none; filter:drop-shadow(0 0 6px rgba(255,210,100,.45)); } /* 16.10: медальон-осколок вместо кружка с ✦ */
.dt-orb.hero .ic{ width:58px; height:58px; background:radial-gradient(circle at 50% 35%,#d0c090,#302010); border-color:#ffe0a0; box-shadow:0 0 18px rgba(255,224,160,.7); }
.dt-orb.hero .c{ font-family:'Cinzel',serif; color:#ffe0a0; }
.dt-orb.hero:hover .ic{ box-shadow:0 0 24px rgba(255,224,160,.95); }
.dt-orb.hero .n{ color:#ffe0a0; }
/* --- Карточка героя «Алтарь» (02.10.2026, 39-я, его выбор; макет client/maket-karta-geroya.html) --- */
.dthero-modal{ width:min(640px,96%); z-index:76; text-align:left; padding:0; overflow:hidden; border-color:#8a6a2a; }
.dthero-modal > .modal-close{ z-index:5; }
#dtHeroBackdrop{ z-index:75; }
.dth-split{ display:grid; grid-template-columns:200px minmax(0,1fr); min-height:270px; }
.dth-left{ position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:12px 10px; overflow:hidden;
background:radial-gradient(circle at 50% 40%, #6a4a12 0%, #2a1c0a 55%, #120c06 100%); border-right:1.5px solid #8a6a2a; min-width:0; }
.dth-rays{ position:absolute; left:50%; top:36%; width:440px; height:440px; margin:-220px 0 0 -220px; border-radius:50%; pointer-events:none;
background:repeating-conic-gradient(#ffd76a22 0 8deg, transparent 8deg 20deg); animation:dthSpin 30s linear infinite; }
@keyframes dthSpin{ to{ transform:rotate(360deg); } }
@keyframes dthGlow{ 0%,100%{ box-shadow:0 0 6px #f0c44055, inset 0 0 8px #f0c44022; } 50%{ box-shadow:0 0 16px #f0c440aa, inset 0 0 14px #f0c44044; } }
@keyframes dthRowIn{ from{ transform:translateX(14px); opacity:0; } to{ transform:none; opacity:1; } }
.dth-port{ width:104px; height:104px; border-radius:12px; overflow:hidden; border:2px solid #ffe0a0; position:relative; z-index:2; box-shadow:0 6px 16px #000a, 0 0 18px #f0c44055; flex:none; }
.dth-port svg,.dth-port img{ display:block; width:100%; height:100%; }
.dth-left.fon{ background:var(--dthfon) center/cover no-repeat; } .dth-left.fon .dth-rays{ display:none; } /* 69-я: фон героя за живым героем */
.dth-port.live{ position:absolute; inset:0; width:auto; height:auto; border:0; border-radius:0; box-shadow:none; overflow:visible; background:none; } /* 69-я: живой герой во всю левую часть «Алтаря» */
.dth-port.live canvas{ display:block; width:100%; height:100%; object-fit:contain; object-position:50% 100%; }
/* Раскладка «А» (его выбор 02.10.2026, 40-я): имя, класс и описание — шапкой справа над «Силой героя» */
.dth-head{ display:flex; flex-direction:column; gap:2px; padding:0 26px 4px 0; border-bottom:1px solid #8a6a2a66; }
.dth-nm{ display:flex; align-items:baseline; gap:4px 10px; flex-wrap:wrap; min-width:0; }
.dth-name{ font-family:'Cinzel',serif; font-weight:800; font-size:22px; line-height:1.05; color:#ffe08a; text-shadow:0 0 14px #f0c44088; white-space:nowrap; }
.dth-cls{ font-size:11.5px; color:var(--muted); }
.dth-desc{ font:italic 11.5px/1.3 Georgia,serif; color:#f3e3c0; }
.dth-desc::before{ content:'“'; color:#f0c440; font-size:15px; line-height:0; vertical-align:-4px; margin-right:2px; }
/* Обмен лишних осколков (40-я): маленькая табличка в самом низу левой колонки */
.dth-swap{ position:absolute; left:5px; right:5px; bottom:6px; z-index:3; display:flex; align-items:center; gap:4px; padding:4px 5px 4px 6px;
border:1px solid #8a5ad0; border-radius:8px; background:rgba(42,26,69,.88); animation:dthSwapGlow 2.4s ease-in-out infinite; }
.dth-swap[hidden]{ display:none; }
.dth-swap .v{ font:800 10.5px Inter,Arial; color:#e0c8ff; white-space:nowrap; line-height:1.15; min-width:0; overflow:hidden; }
.dth-swap .v small{ display:block; font:600 8.5px Inter,Arial; color:var(--muted); }
.dth-swap button{ margin-left:auto; flex:none; font:800 10.5px Inter,Arial; color:#2a1a05; background:linear-gradient(#f3cf5a,#c8962a); border:1px solid #ffe08a; border-radius:6px; padding:4px 6px; cursor:pointer; }
@keyframes dthSwapGlow{ 0%,100%{ box-shadow:0 0 4px #a070f044; } 50%{ box-shadow:0 0 12px #c090f0aa; } }
/* Бонусы плашками по два-три в строку (раскладка «А») */
.dth-chips{ display:flex; flex-wrap:wrap; gap:5px; } /* три бонуса (Рамсес) не влезают — третий переносится вниз */
.dth-chip{ flex:1 1 auto; display:flex; align-items:center; gap:6px; border:1px solid #8a6a2a; border-radius:8px; padding:3px 7px; background:linear-gradient(90deg,#3a2a0e,#1a130a); animation:dthRowIn .45s both; min-width:0; }
.dth-chip .i{ font-size:15px; filter:drop-shadow(0 0 6px #f0c440); flex:none; }
.dth-chip .n{ font:800 14px Inter,Arial; color:#ffe08a; white-space:nowrap; flex:none; }
.dth-chip .w{ font-size:10.5px; color:var(--parchment); line-height:1.15; min-width:0; } .dth-chip .w small{ display:block; color:var(--muted); font-size:9px; }
.dth-right{ padding:12px 14px 12px; display:flex; flex-direction:column; gap:5px; justify-content:flex-start; min-width:0; } /* 41-я, его слово: всё прижато кверху */
.dth-cap{ font:800 10.5px Inter,Arial; letter-spacing:.14em; color:#f0c440; display:flex; align-items:center; gap:8px; padding-right:28px; }
.dth-cap::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,#f0c44099,transparent); }
.dth-bonus .dth-cap{ padding-right:0; margin-top:2px; }
.dth-stats{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; }
.dth-st{ display:flex; flex-direction:column; align-items:center; gap:0; padding:3px 1px; border-radius:7px; background:rgba(0,0,0,.35); border:1px solid #5a4520; min-width:0; }
.dth-st .i{ font-size:12px; line-height:1.2; }
.dth-st b{ font:800 11.5px 'JetBrains Mono',monospace; color:var(--parchment); white-space:nowrap; overflow:hidden; max-width:100%; }
.dth-st small{ font-size:8.5px; color:var(--muted); }
.dth-st.pow{ border-color:#f0c440; background:linear-gradient(#3a2a0e,#1a130a); }
.dth-st.pow b{ color:#ffe08a; }
.dth-bonus{ display:flex; flex-direction:column; gap:5px; }
.dth-bonus:empty{ display:none; }
.dth-row{ display:flex; align-items:center; gap:8px; border:1px solid #8a6a2a; border-radius:8px; padding:3px 9px; background:linear-gradient(90deg,#3a2a0e,#1a130a); animation:dthRowIn .45s both; min-width:0; }
.dth-row .i{ font-size:17px; width:24px; text-align:center; filter:drop-shadow(0 0 6px #f0c440); flex:none; }
.dth-row .n{ font:800 15px Inter,Arial; color:#ffe08a; min-width:56px; white-space:nowrap; flex:none; }
.dth-row .w{ color:var(--parchment); font-size:11.5px; min-width:0; } .dth-row .w small{ display:block; color:var(--muted); font-size:9.5px; }
.dth-gift{ border:1.5px solid #f0c440; border-radius:9px; padding:4px 9px; background:radial-gradient(ellipse at 0 50%, #5a3f10, #1a130a 70%); animation:dthGlow 2.6s ease-in-out infinite; }
.dth-gift .t{ font:800 10px Inter,Arial; color:#ffe08a; letter-spacing:.06em; }
.dth-gift .its{ display:flex; gap:4px 10px; margin-top:2px; flex-wrap:wrap; font-size:12px; color:var(--parchment); } .dth-gift .its b{ color:#ffe08a; }
.dth-how{ font-size:11px; line-height:1.4; color:var(--parchment); background:rgba(0,0,0,.35); border:1px solid #5a4520; border-radius:7px; padding:4px 9px; }
.dth-how b{ color:#ffe08a; }
/* низ карточки у героев Рынка (его слово 02.10.2026): слева 40 % — цена и «у тебя», справа красивая «Купить» */
.dth-foot{ display:block; margin-top:auto; } /* «Купить» остаётся внизу, хотя шапка прижата кверху (41-я) */
.dth-foot.shop{ display:flex; justify-content:flex-end; } /* его слово 02.10.2026: блок «цена · у тебя» убрать, кнопка чуть меньше */
.dth-foot.shop .dth-how{ display:none; }
.dth-how .pr{ font:900 15px Inter,Arial; color:#ffe08a; white-space:nowrap; }
.dth-how .sub{ font-size:10.5px; color:var(--muted); }
@keyframes dthShine{ 0%{ background-position:-160% 0, 0 0; } 60%,100%{ background-position:260% 0, 0 0; } }
.dth-buy{ min-width:190px; height:34px; padding:0 24px; border-radius:9px; font:900 14px Inter,Arial; letter-spacing:.03em; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
color:#2a1a05; border:1px solid #fff1b0; text-shadow:0 1px 0 #fff6;
background-image:linear-gradient(110deg, transparent 35%, #fff8 50%, transparent 65%), linear-gradient(#ffe07a,#c8962a);
background-size:60% 100%, 100% 100%; background-repeat:no-repeat; animation:dthShine 3s ease-in-out infinite, dthGlow 2.4s ease-in-out infinite; }
.dth-buy:active{ transform:scale(.97); }
.dth-buy[hidden]{ display:none; }
.dth-buy.no{ background:linear-gradient(#5a2a20,#3a1810); color:#ffb0a0; border-color:#8a4030; animation:none; text-shadow:none; }
.dth-buy.lock{ background:rgba(0,0,0,.4); color:#8a7a5a; border-color:#3a3020; animation:none; cursor:default; text-shadow:none; }
.dth-buy.done{ background:linear-gradient(#a8e8b8,#5aa870); color:#0a3a18; border-color:#2a6a3a; animation:none; cursor:default; text-shadow:none; }
.dth-inv{ align-self:flex-start; font:800 11.5px Inter,Arial; color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-radius:8px; padding:5px 14px; cursor:pointer; }
.dth-inv[hidden]{ display:none; }
.siege-list-toast{ position:absolute; left:50%; bottom:14px; transform:translateX(-50%); z-index:6; max-width:90%;
background:rgba(20,10,28,.96); border:1px solid #6a40a0; border-radius:9px; padding:8px 13px; text-align:center;
font-size:11.5px; color:#e0b0ff; box-shadow:0 4px 14px rgba(0,0,0,.5); }
/* ===== Лига ===== */
/* Окно лежит набок: слева .lg-side (название + вкладки столбиком), справа содержимое вкладки.
Ту же раскладку берёт окно клана — у него те же классы .league-modal / .lg-tabs. */
.league-modal{ width:min(820px,96%); height:min(348px,367px); max-height:367px;
display:flex; flex-direction:row; gap:12px; padding:12px; text-align:left; }
.lg-side, .cl-side{ width:136px; flex:0 0 auto; display:flex; flex-direction:column; gap:6px;
border-right:1px solid #3a2850; padding-right:12px; }
.lg-side .pm-title, .cl-side .pm-title{ margin:0 0 4px; font-size:14px; line-height:1.3; }
/* правой колонке нужен отступ справа, иначе кнопка ✕ ложится поверх содержимого */
.lg-content{ flex:1; min-width:0; overflow-y:auto; overflow-x:hidden; padding-right:22px; }
/* Рейтинг лиг — строки сверху вниз (сильная лига сверху), растянуты на всю высоту окна */
.lg-rows{ display:flex; flex-direction:column; justify-content:center; gap:9px; padding-bottom:4px; height:100%; box-sizing:border-box; }
.lg-row{ flex:1 1 0; min-height:50px; max-height:70px; display:flex; align-items:center; gap:12px; background:linear-gradient(180deg,rgba(40,30,56,.5),rgba(16,12,22,.6)); border:1px solid #3a2c50; border-radius:12px; padding:9px 14px; cursor:pointer; }
.lg-row.here{ border-color:var(--gold-bright); box-shadow:0 0 12px rgba(202,164,76,.3); background:rgba(202,164,76,.1); }
.lg-row:hover{ border-color:var(--gold-bright); }
.lg-rmedal{ width:38px; height:38px; flex:0 0 auto; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:#1a1208;
background:radial-gradient(circle at 40% 32%, var(--mc), var(--mc2)); border:2px solid rgba(255,255,255,.3); text-shadow:0 1px 1px rgba(255,255,255,.4); }
.lg-rmid{ flex:1; min-width:0; }
.lg-rname{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lg-rsub{ font-size:11px; color:var(--parchment); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lg-rsub b{ color:var(--gold-bright); font-family:'JetBrains Mono',monospace; }
.lg-rreward{ flex:0 0 auto; font-size:17px; background:rgba(0,0,0,.28); border:1px solid #3a2c50; border-radius:8px; padding:5px 7px; cursor:pointer; line-height:1; }
.lg-rreward:hover{ border-color:var(--gold-bright); }
.lg-rgo{ flex:0 0 auto; font-size:11px; font-weight:700; color:var(--gold-bright); white-space:nowrap; }
/* Вкладка «Лиги» (08.09.2026): пять колонок во всю высоту окна, по образцу арены Raid.
Цвет лиги приходит переменными --mc/--mc2 из shared/league.js. */
.lgc-cols{ display:flex; gap:6px; height:100%; box-sizing:border-box; padding:2px 0; }
.lgc-col{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:4px; padding:7px 5px 6px; box-sizing:border-box;
border-radius:12px; border:1px solid color-mix(in srgb, var(--mc) 45%, #2a2038); cursor:pointer;
background:linear-gradient(180deg, color-mix(in srgb, var(--mc) 22%, #1a1424), rgba(14,10,20,.85)); }
.lgc-col:hover{ border-color:var(--mc); }
.lgc-col.here{ border-color:var(--gold-bright); box-shadow:0 0 14px rgba(232,200,78,.35), inset 0 0 20px rgba(232,200,78,.08); }
.lgc-medal{ width:46px; height:46px; flex:0 0 auto; border-radius:50%; display:flex; align-items:center; justify-content:center;
font-family:'Cinzel',serif; font-weight:800; font-size:19px; color:#1a1208;
background:radial-gradient(circle at 35% 28%, rgba(255,255,255,.55) 0, transparent 42%), linear-gradient(160deg, var(--mc), var(--mc2));
border:2px solid var(--mc); box-shadow:0 0 12px color-mix(in srgb, var(--mc) 55%, transparent), 0 3px 6px rgba(0,0,0,.5); }
.lgc-stars{ font-size:9px; line-height:1; letter-spacing:1px; color:var(--mc); text-shadow:0 0 4px color-mix(in srgb, var(--mc) 70%, transparent); }
.lgc-pts{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:13px; color:var(--gold-bright); }
/* правило перехода между лигами (08.09.2026): топ-25 вверх, 76–100 вниз */
.lgc-rule{ display:flex; flex-direction:column; align-items:center; gap:1px; font-size:9.5px; font-weight:700; line-height:1.3; min-height:26px; justify-content:center; }
.lr-up{ color:#7ee0a0; } .lr-dn{ color:#ff8a8a; }
/* Вкладка «Рейтинг» в формате «Атаки» (08.09.2026) */
.lr-head{ display:flex; align-items:center; gap:12px; padding:4px 6px 8px; margin-bottom:8px; border-bottom:1px solid #3a2c50; }
.lr-sw-row{ display:flex; gap:5px; flex:0 0 auto; }
.lr-sw{ padding:2px; border-radius:50%; background:none; border:2px solid transparent; cursor:pointer; opacity:.55; }
.lr-sw .lgc-medal{ width:30px; height:30px; font-size:12px; }
.lr-sw:hover{ opacity:.9; }
.lr-sw.active{ opacity:1; border-color:var(--gold-bright); }
.lr-sw.mine:not(.active){ opacity:.8; }
.lr-mid{ flex:1; min-width:0; }
.lr-title{ font-family:'Cinzel',serif; font-weight:800; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lr-rule{ font-size:10px; margin-top:2px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lr-row{ position:relative; }
.lr-row.promo{ border-left:3px solid #4fb060; }
.lr-row.you{ background:linear-gradient(90deg,rgba(202,164,76,.22),rgba(202,164,76,.04)); border-color:var(--gold-bright); }
.lr-rank{ width:30px; flex:0 0 auto; font-family:'JetBrains Mono',monospace; font-weight:800; font-size:12px; color:var(--gold-bright); text-align:center; }
/* в рейтинге герои крупнее (08.09.2026) */
.lr-row .lh-mini{ width:46px; height:46px; border-radius:8px; }
.lr-row .lh-mini .lh-pow{ font-size:8.5px; }
.lr-row .lh-minis{ gap:5px; }
.lr-row .lh-tp{ font-size:10.5px; }
.lr-me{ width:82px; flex:0 0 auto; text-align:center; font-family:'Cinzel',serif; font-weight:800; font-size:11px; color:var(--gold-bright); }
.lh-nm[data-lgprofile]{ cursor:pointer; }
.la-bar .la-bv{ font-size:11px; }
.la-bar .lr-up, .la-bar .lr-dn{ font-weight:700; }
.lgc-bh{ width:100%; text-align:center; font-size:9.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted);
border-top:1px solid rgba(255,255,255,.09); border-bottom:1px solid rgba(255,255,255,.09); padding:3px 0; }
.lgc-rows{ width:100%; display:flex; flex-direction:column; gap:2px; }
.lgc-r{ display:flex; justify-content:space-between; align-items:center; font-size:10.5px; line-height:1.3; color:var(--parchment); padding:0 3px; }
.lgc-r b{ font-family:'JetBrains Mono',monospace; font-weight:700; color:#9be07a; }
.lgc-you{ display:flex; flex-direction:column; align-items:center; gap:1px; margin-bottom:6px; } /* «Ты» внизу колонки, над сундуком (08.09.2026) */
.lgc-av{ width:34px; height:34px; border-radius:8px; overflow:hidden; background:rgba(0,0,0,.35); border:1px solid var(--gold-bright); }
.lgc-av svg{ width:100%; height:100%; display:block; }
.lgc-av .pf-ava{ width:100%; height:100%; box-sizing:border-box; border:0; border-radius:0; font-size:18px; } /* своя аватарка из профиля (25.09.2026) */
.lgc-nm{ font-size:11px; font-weight:700; color:var(--gold-bright); line-height:1.2; }
.lgc-pt{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--parchment); line-height:1.2; }
.lgc-sp{ flex:1 1 0; }
.lgc-chest{ flex:0 0 auto; font-size:18px; line-height:0; padding:0 12px; border-radius:8px; cursor:pointer;
background:rgba(0,0,0,.32); border:1px solid color-mix(in srgb, var(--mc) 70%, #000); }
.lgc-chest:hover{ border-color:var(--gold-bright); }
.lgc-chest .lgc-ch{ display:block; transition:transform .15s; } .lgc-chest:hover .lgc-ch{ transform:translateY(-2px) rotate(-4deg); } /* сундучок лиги вместо 🎁 (01.10.2026) */
.lcp-t.lcp-tch{ display:flex; align-items:center; justify-content:center; gap:6px; }
/* Вкладка «Защита» (08.09.2026): пять ячеек под карты (как в окне атаки) и ростер для выбора;
карты и ростер берут стили окна атаки (.ar-line, .ar-cards, .ar-card, .ar-roster), размер карты --arc */
.lgd-wrap{ --arc:58px; display:flex; flex-direction:column; gap:8px; height:100%; box-sizing:border-box; padding:2px 0; }
.lgd-line{ flex:0 0 auto; padding:6px 10px 7px; gap:5px;
background:radial-gradient(ellipse at 50% 0%, rgba(74,138,202,.28), transparent 70%), linear-gradient(90deg,rgba(26,58,90,.5),rgba(20,30,50,.5)); }
.lgd-line .ar-lhead{ text-align:center; font-size:12px; }
.lgd-line .ar-cards{ gap:12px; }
.lgd-line .ar-card{ width:74px; height:74px; border-radius:11px; }
.lgd-line .ar-card .ar-empty{ font-size:30px; }
.lgd-line .ar-clvl{ font-size:9.5px; padding:3px 6px; }
.lgd-line .ar-cnum{ font-size:10px; }
.lgd-line .ar-tp{ font-size:11.5px; }
.lgd-sub{ font-weight:400; font-size:10px; color:var(--muted); margin-left:6px; }
.lgd-rh{ flex:0 0 auto; font-family:'Cinzel',serif; font-weight:800; font-size:11.5px; color:#cdbfe0; padding:0 2px; }
.lgd-wrap .ar-roster{ flex:1; min-height:0; gap:7px; }
.lgd-wrap .ar-roster .ar-card{ border-radius:10px; }
.lgd-wrap .ar-roster .ar-clvl{ font-size:9px; padding:2px 5px; }
.lgd-row{ flex:1 1 0; min-height:0; display:flex; gap:8px; }
.lgd-card{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:5px; padding:6px 5px; box-sizing:border-box;
border-radius:12px; border:1px solid #3a2c50; background:linear-gradient(180deg,rgba(40,30,56,.55),rgba(14,10,20,.85)); }
.lgd-card.empty{ border-style:dashed; opacity:.6; }
.lgd-name{ max-width:100%; font-family:'Cinzel',serif; font-weight:700; font-size:11px; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lgd-port{ flex:1 1 0; min-height:0; width:100%; position:relative; display:flex; align-items:center; justify-content:center; border-radius:10px;
background:radial-gradient(ellipse at 50% 88%, rgba(120,90,200,.38), transparent 62%); }
.lgd-port svg{ height:100%; width:auto; max-width:100%; display:block; }
.lgd-lvl{ position:absolute; bottom:4px; right:4px; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; background:rgba(0,0,0,.65); color:#fff; border-radius:5px; padding:1px 5px; }
.lgd-plus{ font-size:28px; color:#5a4a76; }
.lgd-pow{ width:100%; box-sizing:border-box; text-align:center; font-size:11px; color:var(--parchment); background:rgba(0,0,0,.35); border:1px solid #3a2c50; border-radius:8px; padding:4px 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lgd-pow b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.lgd-total{ text-align:center; font-family:'Cinzel',serif; font-weight:800; font-size:13px; color:var(--parchment); background:rgba(0,0,0,.35); border:1px solid #3a2c50; border-radius:10px; padding:7px; }
.lgd-total b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
/* Вкладка «Атака» (08.09.2026): шапка с очками до следующей лиги и список соперников */
.la-head{ display:flex; align-items:center; gap:10px; padding:6px 8px 8px; margin-bottom:8px; border-bottom:1px solid #3a2c50; }
.la-medal{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:2px; }
.la-medal .lgc-medal{ width:40px; height:40px; font-size:16px; }
.la-medal.la-max{ width:40px; font-size:10px; color:var(--muted); text-align:center; }
.la-mid{ flex:1; min-width:0; }
.la-mt{ display:flex; justify-content:space-between; align-items:center; font-size:11px; color:var(--parchment); margin-bottom:4px; }
.la-fights{ font-size:10.5px; color:var(--muted); }
.la-fights b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.la-bar{ position:relative; height:20px; border-radius:6px; background:rgba(0,0,0,.45); border:1px solid #3a2c50; overflow:hidden; }
.la-fill{ position:absolute; left:0; top:0; bottom:0; background:linear-gradient(90deg,#8a6a1c,var(--gold-bright)); opacity:.55; }
.la-bv{ position:relative; display:block; text-align:center; line-height:20px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px; color:#fff; text-shadow:0 0 3px #000; }
/* запас атак (08.09.2026): 10, +1 в час, купить нельзя */
.la-atk{ flex:0 0 auto; min-width:118px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 10px; border-radius:9px;
background:rgba(0,0,0,.3); border:1px solid #3a2c50; }
.la-atk-n{ font-family:'Cinzel',serif; font-weight:800; font-size:12px; color:var(--parchment); white-space:nowrap; }
.la-atk-n b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.la-atk-t{ font-family:'JetBrains Mono',monospace; font-size:10px; color:#9be07a; white-space:nowrap; }
/* счётчик атак — кнопка покупки (07.10.2026): рамка под золото, цена следующей атаки справа */
.la-atk-buy{ cursor:pointer; padding:2px 8px; border-radius:8px; border:1px solid #6a5424; background:linear-gradient(180deg,#2a2012,#171009); }
.la-atk-buy:hover{ border-color:var(--gold); filter:brightness(1.12); }
.la-atk-b{ font-family:'JetBrains Mono',monospace; font-size:10px; color:#f0c060; margin-left:2px; }
.lgb-pop .lgb-line b{ color:#ffd24a; }
.lgb-go{ min-width:170px; padding:8px 14px; border-radius:9px; border:1px solid #d4a84b; background:linear-gradient(180deg,#3a2a10,#120c04); color:#ffe07a; font:900 13px 'JetBrains Mono',monospace; cursor:pointer; }
.lgb-go:hover:not(:disabled){ filter:brightness(1.15); } .lgb-go:disabled{ opacity:.45; cursor:not-allowed; }
.lgb-note{ font-size:9.5px; color:var(--muted); line-height:1.4; max-width:240px; }
.lgb-pop .lcp-close{ margin-top:2px; }
.bz-card.empty.bz-none{ display:flex; align-items:center; justify-content:center; font:700 12px 'Cinzel',serif; color:var(--muted); } /* все акции куплены (07.10.2026) */
.la-refresh{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:4px; }
.la-free{ font-size:9.5px; line-height:1.25; color:#9be07a; text-align:center; }
.la-rbtn{ font-family:'Cinzel',serif; font-weight:800; font-size:11px; padding:6px 10px; border-radius:8px; cursor:pointer; color:var(--parchment); background:rgba(30,20,44,.7); border:1px solid var(--gold); white-space:nowrap; }
.la-rbtn:hover{ border-color:var(--gold-bright); color:var(--gold-bright); }
.la-list{ display:flex; flex-direction:column; gap:6px; }
.la-row{ display:flex; align-items:center; gap:10px; padding:6px 10px; border-radius:10px; background:rgba(30,20,44,.45); border:1px solid #3a2c50; }
.la-who{ width:100px; flex:0 0 auto; min-width:0; }
.la-clan{ font-size:10px; color:#7fb0e0; margin-top:1px; }
.la-rank{ background:rgba(0,0,0,.6); border-radius:4px; padding:0 3px; color:#ffd24a; }
.la-myrank{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.la-pts{ width:64px; flex:0 0 auto; display:flex; flex-direction:column; gap:3px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:11px; }
.la-pts div{ background:rgba(0,0,0,.35); border-radius:6px; padding:2px 5px; text-align:center; white-space:nowrap; }
.la-pts .plus{ color:#7ee0a0; }
.la-pts .minus{ color:#ff8a8a; }
.la-go{ flex:0 0 auto; font-family:'Cinzel',serif; font-weight:800; font-size:12px; padding:9px 14px; border-radius:9px; cursor:pointer; color:#1a1208;
background:linear-gradient(180deg,#f0c860,#b8861c); border:1px solid #ffe08a; box-shadow:0 2px 6px rgba(0,0,0,.5); }
.la-go:hover{ filter:brightness(1.08); }
/* время до сброса лиги под вкладками (08.09.2026) */
.lg-reset{ margin-top:auto; padding-top:8px; }
.lgr-t{ font-size:10.5px; line-height:1.3; color:var(--muted); }
.lgr-v{ margin-top:3px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px; color:var(--gold-bright); }
/* итоги прошлой недели над таймером (шаг 3.4.г): место и переход */
.lgr-last{ margin-bottom:5px; }
.lgr-lv{ margin-top:1px; font-size:10px; line-height:1.3; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lgr-lv b{ font-family:'JetBrains Mono',monospace; color:var(--gold-bright); }
.lgr-same{ color:var(--muted); }
.lgc-pt b{ color:var(--gold-bright); }
/* вкладки столбиком в боковой колонке (общие для Лиги и Клана) */
.lg-tabs{ display:flex; flex-direction:column; gap:5px; }
.lg-tab{ flex:0 0 auto; display:flex; align-items:center; justify-content:flex-start; gap:8px; padding:9px 10px;
background:rgba(0,0,0,.28); border:1px solid #3a2c50; border-radius:9px; cursor:pointer; color:var(--parchment); }
.lg-tab .lt-ic{ font-size:15px; line-height:1; filter:grayscale(.4); }
.lg-tab .lt-nm{ font-size:11.5px; font-weight:700; }
.lg-tab.active{ background:rgba(232,200,78,.1); border-color:var(--gold-bright); color:var(--gold-bright); }
.lg-tab.active .lt-ic{ filter:none; }
/* ===== Экран атаки арены ===== */
/* Окно атаки (08.09.2026, по образцу арены Raid): сверху рандом + две пятёрки (соперник над тобой),
снизу все нанятые герои по мощи и кнопка «Атаковать». --arc — размер карты героя. */
.arena-modal{ --arc:44px; width:min(840px,97%); height:min(352px,371px); max-height:371px;
display:flex; flex-direction:column; gap:6px; padding:10px 12px; text-align:left; }
.ar-top{ display:flex; gap:12px; align-items:stretch; flex:0 0 auto; margin-right:30px; } /* справа место под ✕, чтобы он не ложился на рамку соперника */
.ar-roll{ width:150px; flex:0 0 auto; display:flex; flex-direction:column; gap:4px; padding:8px; border-radius:11px;
background:rgba(30,20,44,.5); border:1px solid #3a2850; }
.ar-rt{ font-family:'Cinzel',serif; font-weight:800; font-size:12px; color:#e0c0ff; }
.ar-rt2{ font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; color:var(--muted); margin-top:2px; }
.ar-rx{ font-size:10px; line-height:1.35; color:var(--muted); }
.ar-rhead{ display:flex; justify-content:space-between; padding:0 6px; font-size:9.5px; font-weight:700; }
.ar-rhead .my{ color:#9be07a; } .ar-rhead .en{ color:#ff9a8a; }
.ar-die{ width:26px; height:26px; border-radius:7px; display:inline-flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-weight:800; font-size:13px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.15), 0 2px 4px rgba(0,0,0,.5); }
.ar-die.en{ background:linear-gradient(180deg,#7a2a3c,#4a1622); border:1px solid #a04a5a; color:#ffd0c0; }
.ar-die.my{ background:linear-gradient(180deg,#2a5a8a,#163650); border:1px solid #5a9ada; color:#e0f0ff; }
.ar-die.spin{ color:var(--muted); animation:arSpin .14s linear infinite; }
@keyframes arSpin{ 0%{ transform:rotate(-8deg) scale(.95); } 50%{ transform:rotate(8deg) scale(1.05); } 100%{ transform:rotate(-8deg) scale(.95); } }
.ar-die.pop{ animation:arPop .45s ease-out; }
@keyframes arPop{ 0%{ transform:scale(1.8); filter:brightness(2); } 100%{ transform:scale(1); filter:none; } }
.ar-pair{ display:flex; align-items:center; justify-content:space-between; gap:6px; padding:3px 6px; border-radius:8px; border:1px solid transparent; }
.ar-pair.on{ background:rgba(232,200,78,.08); border-color:rgba(232,200,78,.35); }
.ar-pvs{ font-size:11px; color:var(--gold-bright); }
.ar-card.hit{ animation:arHit .5s ease-out; }
@keyframes arHit{ 0%{ transform:scale(1.25); } 100%{ transform:scale(1); } }
.ar-lines{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.ar-line{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:3px 8px; border-radius:11px; border:1px solid #3a2850; }
.ar-line.en{ background:linear-gradient(90deg,rgba(90,32,48,.45),rgba(42,16,24,.45)); border-color:#6a3040; }
.ar-line.my{ background:linear-gradient(90deg,rgba(26,58,90,.4),rgba(20,30,50,.4)); border-color:#3a5a8a; }
.ar-lhead{ width:100%; font-family:'Cinzel',serif; font-weight:800; font-size:11px; color:#ffe0d0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ar-line.my .ar-lhead{ color:#cfe4ff; }
.ar-cards{ display:flex; gap:8px; }
/* Вариант А (25.09.2026, его выбор «супер»): «Сила команды» — в строке заголовка справа, иконки пятёрок 50 px —
так под цифрами и звёздами влезают оба ряда ростера внизу */
.ar-hrow{ width:100%; display:flex; align-items:baseline; justify-content:space-between; gap:10px; min-width:0; }
.ar-hrow .ar-lhead{ width:auto; flex:0 1 auto; min-width:0; }
.ar-hrow .ar-tp{ flex:0 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:right; }
.arena-modal .ar-cards .ar-card{ width:50px; height:50px; }
.ar-cards .ar-card{ width:54px; height:54px; } /* в рамках соперника и твоей карты крупнее, чем в ростере внизу */
.ar-cards .ar-clvl{ font-size:8.5px; }
.ar-card{ width:var(--arc); height:var(--arc); flex:0 0 auto; position:relative; border-radius:8px; overflow:hidden;
background:#0f0c14; border:2px solid #3a2850; display:flex; align-items:center; justify-content:center; }
.ar-card svg{ width:100%; height:100%; display:block; }
.ar-card.en{ border-color:#7a3040; }
.ar-card.my{ border-color:#4a8aca; }
.ar-card.hit{ border-color:var(--gold-bright); box-shadow:0 0 10px rgba(232,200,78,.6); }
.ar-card.empty{ border-style:dashed; cursor:pointer; }
.ar-card.my, .ar-card.pick{ cursor:pointer; }
.ar-card.pick.in{ border-color:#7ee0a0; box-shadow:0 0 8px rgba(126,224,160,.5); }
.ar-card .ar-empty{ font-size:22px; color:#4a3a66; }
/* бейдж мощи ⚡ на карте: золотая таблетка по центру низа */
.ar-clvl{ position:absolute; left:50%; bottom:2px; transform:translateX(-50%); max-width:calc(100% - 2px); box-sizing:border-box;
font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; line-height:1; letter-spacing:-.4px; color:#ffe08a;
background:linear-gradient(180deg,rgba(20,14,8,.85),rgba(0,0,0,.9)); border:1px solid rgba(255,210,74,.5); border-radius:7px; padding:2px 3px;
text-shadow:0 0 3px rgba(255,210,74,.5); white-space:nowrap; }
.ar-cnum{ position:absolute; left:2px; top:1px; font-family:'Cinzel',serif; font-size:9px; font-weight:800; color:#1a1208; background:var(--gold-bright); border-radius:4px; padding:0 4px; }
/* Карта героя Лиги (25.09.2026, его скрин): квадратная иконка, ★ на её нижнем крае (наполовину на рамке), мощь под иконкой.
Ряд звёзд есть всегда — у героя без ★ он пустой той же высоты, цифры в строке стоят ровно. Размер звезды — --st. */
.ar-unit{ flex:0 0 auto; width:var(--arc); display:flex; flex-direction:column; align-items:center; cursor:pointer; --st:11px; }
.ar-cards .ar-unit{ width:54px; --st:13px; }
.arena-modal .ar-cards .ar-unit{ width:50px; --st:12px; }
.lgd-line .ar-unit{ width:54px; --st:14px; } /* иконка в строке защиты — 54 (правило .ar-cards .ar-card), ряд звёзд по ней */
.lgd-wrap .ar-roster .ar-unit{ --st:15px; }
.ar-unit .ar-card{ flex:0 0 auto; }
.lg-stars{ position:relative; z-index:1; height:var(--st); margin-top:calc(var(--st) / -2); display:flex; justify-content:center; pointer-events:none; }
.lg-stars svg{ width:var(--st); height:var(--st); flex:0 0 auto; margin:0 -.5px; filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.85)); }
.ar-pow{ max-width:100%; margin-top:1px; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; line-height:1.15; letter-spacing:-.3px;
color:#ffe08a; text-shadow:0 0 3px rgba(255,210,74,.45); white-space:nowrap; overflow:hidden; text-align:center; }
.lgd-line .ar-pow{ font-size:10.5px; }
.lgd-wrap .ar-roster .ar-pow{ font-size:10px; }
.ar-card.empty .ar-cnum{ background:#4a3a66; color:#cdbfe0; }
.ar-tp{ font-size:10.5px; color:var(--parchment); text-align:center; }
.ar-warn{ color:#ff9a7a; font-size:9.5px; font-weight:700; } /* предупреждение о пустых ячейках (08.09.2026) */
.ar-tp b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.ar-bottom{ flex:1; min-height:0; display:flex; gap:12px; align-items:stretch; }
.ar-roster{ flex:1; min-width:0; display:grid; grid-template-rows:repeat(2, auto); grid-auto-flow:column; grid-auto-columns:var(--arc);
gap:5px; align-content:start; justify-content:start; overflow-x:auto; overflow-y:hidden; padding:2px; scrollbar-width:thin; }
.ar-actions{ width:150px; flex:0 0 auto; display:flex; flex-direction:column; justify-content:flex-end; gap:6px; }
.ar-atk-btn{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; padding:12px; border-radius:11px; cursor:pointer; color:#1a1208;
background:linear-gradient(180deg,#f0c860,#b8861c); border:1px solid #ffe08a; box-shadow:0 2px 8px rgba(0,0,0,.5); }
.ar-atk-btn:hover{ filter:brightness(1.08); }
.ar-atk-btn:disabled{ opacity:.45; cursor:not-allowed; filter:grayscale(.7); } /* в атаке меньше пяти героев — нападать нельзя (09.09.2026) */
.ar-side{ width:186px; flex:0 0 auto; display:flex; flex-direction:column; gap:8px; border-right:1px solid #3a2850; padding-right:12px; }
.ar-side .pm-title{ margin:0; font-size:14px; }
.ar-opp{ display:flex; gap:9px; align-items:center; flex-shrink:0; background:linear-gradient(90deg,#5a2030,#2a1018); border:1px solid #6a3040; border-radius:11px; padding:9px; }
.ar-ava{ width:42px; height:42px; border-radius:9px; flex-shrink:0; background:#3a1820; border:1px solid #8a4050; display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; font-weight:800; font-size:20px; color:#ffd0c0; }
.ar-nm{ font-family:'Cinzel',serif; font-weight:800; font-size:15px; color:#ffe0d0; }
.ar-clan{ color:#ff9a7a; font-size:12px; }
.ar-rt{ font-size:11px; color:#e0b0a0; margin-top:2px; }
.ar-squads{ flex:1; min-width:0; overflow-y:auto; display:flex; flex-direction:column; gap:5px; padding-right:2px; }
/* строка отряда: слева номер и мощь, дальше клетки обеих сторон */
.ar-squad{ display:flex; align-items:center; gap:8px; background:rgba(30,20,44,.5); border:1px solid #3a2850; border-radius:11px; padding:4px 8px; }
.ar-sq-head{ width:124px; flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-start; gap:1px; }
.ar-sq-n{ font-family:'Cinzel',serif; font-weight:800; font-size:11.5px; color:#cdbfe0; }
.ar-sq-pow{ font-family:'JetBrains Mono',monospace; font-size:9px; line-height:1.25; color:#bfae8c; white-space:nowrap; }
/* подписи сторон — одной строкой над списком */
.ar-legend{ display:flex; align-items:center; gap:8px; padding:0 8px; }
.ar-lg-sp{ width:124px; flex:0 0 auto; }
.ar-legend .ar-side-lbl{ flex:1; margin:0; }
.ar-sq-pow b.ok{ color:#7ee0a0; } .ar-sq-pow b.bad{ color:#ff8a8a; }
.ar-move{ flex:0 0 auto; display:flex; flex-direction:column; gap:3px; }
.ar-mv{ width:24px; height:20px; border-radius:6px; background:#3a2a1a; border:1px solid #6a4a20; color:#e6c976; cursor:pointer; font-size:10px; }
/* отряды стоят друг напротив друга: слева соперник, справа твой, между ними VS */
.ar-vs{ flex:1; min-width:0; display:flex; align-items:center; gap:8px; }
.ar-team{ flex:1; min-width:0; }
.ar-vs-mark{ flex:0 0 auto; font-family:'Cinzel',serif; font-weight:800; font-size:12px; color:#ff8a6a; }
.ar-cells{ display:flex; gap:5px; }
.ar-cell{ flex:1; max-width:42px; border-radius:8px; background:#0f0c14; border:1px solid #3a2850; overflow:hidden; position:relative; aspect-ratio:1/1.12; display:flex; align-items:center; justify-content:center; }
.ar-cell svg{ width:100%; height:100%; display:block; }
.ar-empty{ font-size:18px; color:#4a3a66; }
.ar-cpow{ position:absolute; bottom:0; left:0; right:0; font-size:7.5px; letter-spacing:-.3px; font-family:'JetBrains Mono',monospace; background:rgba(0,0,0,.6); color:#ffd24a; text-align:center; }
.ar-cells.en .ar-cell{ border-color:#7a3040; }
.ar-cell[data-archero]{ cursor:pointer; }
.ar-side-lbl{ font-size:9.5px; font-weight:700; margin:0 0 3px; }
.ar-side-lbl.en{ color:#ff9a8a; }
.ar-side-lbl.my{ color:#9be07a; }
/* итог и кнопки прижаты к низу боковой колонки */
.ar-result{ flex-shrink:0; margin-top:auto; }
.ar-res{ text-align:center; font-family:'Cinzel',serif; font-weight:800; font-size:12px; padding:8px; border-radius:9px; }
.ar-res.win{ background:rgba(80,200,110,.18); color:#7ee0a0; border:1px solid #3f8a4a; }
.ar-res.lose{ background:rgba(220,80,80,.18); color:#ff8a8a; border:1px solid #8a3f3f; }
.ar-foot{ display:flex; flex-direction:column; gap:7px; flex-shrink:0; }
.ar-attack{ background:linear-gradient(90deg,#7a1822,var(--crimson-bright)); border:1px solid #ff6a5a; color:#fff; font-family:'Cinzel',serif; font-weight:800; font-size:14px; border-radius:11px; padding:11px; cursor:pointer; }
.ar-back{ background:linear-gradient(90deg,#1a3a5a,#2a5a8a); border:1px solid #4a8aca; color:#e0f0ff; font-family:'Cinzel',serif; font-weight:800; font-size:14px; border-radius:11px; padding:11px; cursor:pointer; }
/* ===== Экран боя отрядов ===== */
/* Отряды дерутся лицом к лицу: соперник слева, ты справа, между ними VS */
.battle-modal{ width:min(760px,96%); max-height:367px; display:flex; flex-direction:column; gap:8px; padding:12px; text-align:center; }
.bt-head{ font-family:'Cinzel',serif; font-weight:800; font-size:15px; color:var(--gold-bright); }
.bt-arena{ display:flex; align-items:center; gap:10px; }
.bt-side{ flex:1; min-width:0; background:rgba(20,14,28,.5); border:1px solid #3a2850; border-radius:11px; padding:8px; }
.bt-lbl{ font-size:11px; font-weight:700; margin-bottom:6px; text-align:left; }
.bt-lbl.en{ color:#ff9a8a; } .bt-lbl.my{ color:#9be07a; }
.bt-units{ display:flex; gap:6px; justify-content:center; }
.bt-unit{ flex:1; max-width:72px; position:relative; transition:transform .12s, opacity .25s; }
.bt-unit.dead{ opacity:.3; filter:grayscale(1); }
.bt-unit.bt-act{ transform:translateY(-6px) scale(1.06); }
.bt-unit.bt-hurt .bt-port{ box-shadow:0 0 0 2px #ff4030, 0 0 10px rgba(255,64,48,.8); }
.bt-port{ width:100%; aspect-ratio:1; border-radius:9px; overflow:hidden; }
.bt-port svg{ width:100%; height:100%; display:block; }
.bt-hp{ height:7px; border-radius:4px; background:#3a1018; overflow:hidden; margin-top:3px; border:1px solid #5a2028; }
.bt-hpfill{ height:100%; background:linear-gradient(90deg,#ff5a4a,#9be07a); transition:width .15s; }
.bt-nm{ font-size:9px; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.bt-dmg{ position:absolute; top:6px; left:50%; transform:translateX(-50%); font-family:'JetBrains Mono',monospace; font-weight:800; font-size:13px; color:#ff5a4a; text-shadow:0 1px 3px #000; animation:btDmgRise .6s ease-out forwards; pointer-events:none; }
@keyframes btDmgRise{ from{ opacity:1; transform:translate(-50%,0);} to{ opacity:0; transform:translate(-50%,-22px);} }
.bt-vs{ flex:0 0 auto; font-family:'Cinzel',serif; font-weight:800; color:#ff8a6a; font-size:13px; }
/* Бой Лиги (08.09.2026): одна пара крупно — карта соперника слева, твоя справа; удар — рывок к цели */
.battle-modal{ padding:10px 12px; gap:6px; }
.battle-modal .bt-foot{ margin-top:0; }
.battle-modal .bt-skip, .battle-modal .bt-close{ padding:8px; }
.bt-duel{ display:flex; align-items:center; justify-content:center; gap:14px; }
.bt-duel .bt-side{ flex:0 1 220px; padding:5px 8px 6px; }
.bt-duel .bt-lbl{ margin-bottom:3px; }
.bt-duel .bt-vs{ font-size:22px; }
.bt-card{ position:relative; width:112px; margin:0 auto; padding:5px; border-radius:12px; background:#0f0c14; border:2px solid #3a2850; text-align:center;
transition:transform .3s ease-out, opacity .5s, filter .5s; }
.bt-card.en{ border-color:#7a3040; } .bt-card.my{ border-color:#4a8aca; }
.bt-card.dead{ opacity:.35; filter:grayscale(1); }
.bt-card.my.bt-strike{ transform:translateX(46px) scale(1.06); } /* ты слева — бьёшь вправо */
.bt-card.en.bt-strike{ transform:translateX(-46px) scale(1.06); } /* соперник справа — бьёт влево */
.bt-card.bt-hurt{ animation:btShake .5s; box-shadow:0 0 0 2px #ff4030, 0 0 14px rgba(255,64,48,.8); }
@keyframes btShake{ 0%,100%{ transform:translateX(0); } 25%{ transform:translateX(-5px); } 75%{ transform:translateX(5px); } }
/* Контра классов (09.09.2026): карта с бафом +30% вспыхивает золотом, сверху бирка «▲ +30% · Лучник бьёт Мага» */
.bt-card.bt-buff{ border-color:#ffd24a; box-shadow:0 0 0 2px rgba(255,210,74,.6), 0 0 18px rgba(255,210,74,.6); animation:btBuff .9s ease-out; }
.bt-card.bt-buff.bt-hurt{ animation:btShake .5s; }
@keyframes btBuff{ 0%{ transform:scale(1); filter:brightness(1); } 35%{ transform:scale(1.14); filter:brightness(1.7) saturate(1.3); } 100%{ transform:scale(1); filter:brightness(1); } }
.bt-bufftag{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); z-index:2; padding:2px 8px; border-radius:8px;
background:linear-gradient(180deg,#ffd86a,#caa12e); color:#1a1208; border:1px solid #8a6a1e; box-shadow:0 2px 8px rgba(0,0,0,.6);
font-family:'Cinzel',serif; font-weight:800; font-size:11px; line-height:1.1; white-space:nowrap; animation:btBuffPop .45s ease-out; }
.bt-bufftag small{ display:block; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:8px; color:#3a2a08; }
@keyframes btBuffPop{ from{ opacity:0; transform:translate(-50%,10px) scale(.5); } to{ opacity:1; transform:translate(-50%,0) scale(1); } }
.bt-buffhead{ color:#ffd24a; }
.bt-cport{ position:relative; width:100%; aspect-ratio:1; border-radius:9px; overflow:hidden; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; }
.bt-cport svg{ width:100%; height:100%; display:block; }
.bt-cport .ar-clvl{ font-size:11px; padding:3px 7px; letter-spacing:0; }
.bt-cport .ar-cnum{ font-size:11px; }
.bt-cnm{ font-family:'Cinzel',serif; font-weight:700; font-size:11px; color:var(--parchment); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bt-chp{ position:relative; height:13px; border-radius:5px; background:#3a1018; overflow:hidden; margin-top:3px; border:1px solid #5a2028; }
.bt-chpfill{ height:100%; background:linear-gradient(90deg,#ff5a4a,#9be07a); transition:width .2s; }
.bt-chpv{ position:absolute; inset:0; font-family:'JetBrains Mono',monospace; font-size:9px; line-height:14px; color:#fff; text-shadow:0 0 3px #000; }
.bt-cst{ font-family:'JetBrains Mono',monospace; font-size:8.5px; letter-spacing:-.2px; color:#bfae8c; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bt-card .bt-dmg{ font-size:18px; top:30px; animation-duration:1s; }
.bt-score{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; color:var(--parchment); }
.bt-score b.en{ color:#ff9a8a; } .bt-score b.my{ color:#9be07a; }
.bt-none{ color:var(--muted); font-size:11px; padding:14px; }
.bt-result{ min-height:4px; }
.bt-foot{ display:flex; gap:10px; margin-top:4px; }
.bt-skip{ flex:1; background:linear-gradient(90deg,#3a2a1a,#6a4a20); border:1px solid #a07a30; color:#ffe0a0; font-family:'Cinzel',serif; font-weight:700; font-size:13px; border-radius:10px; padding:11px; cursor:pointer; }
.bt-close{ flex:1; background:linear-gradient(90deg,#5c4413,var(--gold)); border:1px solid var(--gold-bright); color:#1a1410; font-family:'Cinzel',serif; font-weight:800; font-size:14px; border-radius:10px; padding:11px; cursor:pointer; }
.sr-reward{ margin-top:auto; padding:4px 8px; background:rgba(0,0,0,.28); border:1px solid #2c2040; border-radius:9px; }
.srw-title{ font-family:'Cinzel',serif; font-weight:800; font-size:8.5px; line-height:1.1; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-bright); }
/* награды в ОДНУ строку: ключ (название длинное — ему доля побольше), пыль, кости.
Двумя строками карточка не влезала в три ряда списка. */
.srw-grid{ display:grid; grid-template-columns:repeat(3,max-content); justify-content:space-between; gap:2px 4px; margin-top:3px; }
.srw-grid.wide-first .srw-item:first-child{ grid-column:auto; }
.srw-item{ font-size:9px; color:#cfc0a8; line-height:1.25; white-space:nowrap; }
.srw-ic{ display:inline-block; width:12px; text-align:center; }
.siege-wins{ font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:700; color:#e6c976; white-space:nowrap; }
.siege-attack{ font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; letter-spacing:.02em;
border-radius:8px; padding:5px 2px; cursor:pointer; color:#2a1410; width:100%;
background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; }
/* Кнопка у босса ВСЕГДА жёлтая — цвет не должен прыгать от того, открыт босс или нет.
Серой она остаётся только там, где жать реально нечего (закрытые призывы с disabled). */
.siege-attack[disabled]{ background:linear-gradient(180deg,#5a4c78,#2e2444); color:#c9bede; border-color:#5a4a80; }
.siege-attack:active{ transform:scale(.98); }
/* ===== Клан ===== */
/* Окно клана берёт горизонтальную раскладку Лиги (.league-modal, .lg-side, .lg-tabs — общие);
здесь только своё: списки кланов, рейтинга и участников — в две колонки, как боссы в осаде */
.clan-modal .cl-list, .clan-modal .cl-rate-list, .clan-modal .cl-mem-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
grid-auto-rows:max-content; align-content:start; gap:6px; }
.cl-emblem{ flex:0 0 auto; border-radius:30% 30% 38% 38% / 30% 30% 52% 52%; display:flex; align-items:center; justify-content:center;
background:radial-gradient(circle at 38% 30%, var(--ec,#888), var(--ec2,#333)); border:2px solid rgba(255,255,255,.32);
box-shadow:0 0 10px var(--ec,#888), inset 0 2px 5px rgba(255,255,255,.35); }
.cl-tag{ font-family:'JetBrains Mono',monospace; font-size:.78em; color:var(--gold-bright); }
.cl-banner{ display:flex; align-items:center; gap:12px; padding:12px; border-radius:13px;
background:linear-gradient(120deg, color-mix(in srgb, var(--ec) 32%, #140c1c), #140c1c); border:1px solid var(--ec); }
.cl-banner-info{ flex:1; min-width:0; }
.cl-banner-name{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:#fff; line-height:1.1; }
.cl-banner-sub{ font-size:11px; color:var(--parchment); margin-top:3px; font-family:'JetBrains Mono',monospace; }
.cl-perk{ margin-top:10px; background:rgba(155,224,122,.12); border:1px solid #3a5a30; border-radius:9px; padding:8px 10px; font-size:12px; color:#9be07a; text-align:center; }
.cl-perk b{ color:#c8f0a8; }
.cl-actions{ display:flex; gap:6px; margin-top:10px; }
.cl-act{ flex:1; border:none; border-radius:9px; padding:10px 4px; font-family:'Cinzel',serif; font-weight:800; font-size:11px; cursor:pointer; }
.cl-act.chat{ background:linear-gradient(180deg,#2e5a48,#173026); color:#bff0d8; border:1px solid #3a7a5e; }
.cl-act.leave{ background:linear-gradient(180deg,#5a2630,#2a1218); color:#ffb0b8; border:1px solid #7a3540; }
.cl-mem-h{ margin:13px 2px 6px; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--gold-bright); }
.cl-mem-list{ display:flex; flex-direction:column; gap:4px; }
.cl-mem{ display:flex; align-items:center; gap:8px; background:rgba(30,22,40,.55); border:1px solid #2c2438; border-radius:9px; padding:6px 9px; }
.cl-mem.you{ border-color:var(--gold-bright); background:rgba(202,164,76,.12); }
.cl-mem-on{ width:8px; height:8px; border-radius:50%; background:#555; flex:0 0 auto; }
.cl-mem-on.on{ background:#5fd16a; box-shadow:0 0 6px #5fd16a; }
.cl-mem-av{ font-size:20px; }
.cl-mem-info{ flex:1; min-width:0; }
.cl-mem-name{ font-size:12px; color:#f0e6d2; font-weight:700; }
.cl-mem-role{ font-size:8.5px; font-weight:700; padding:1px 6px; border-radius:999px; margin-left:4px; white-space:nowrap; }
.cl-mem-sub{ font-size:10px; color:var(--muted); font-family:'JetBrains Mono',monospace; }
.cl-mem-contrib{ font-size:11px; color:#e8c84e; font-family:'JetBrains Mono',monospace; flex:0 0 auto; }
.cl-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; min-height:280px; text-align:center; padding:0 24px; }
.cl-empty-ic{ font-size:54px; filter:drop-shadow(0 0 12px var(--gold)); }
.cl-empty-t{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:var(--gold-bright); }
.cl-empty-s{ font-size:12px; color:var(--parchment); line-height:1.5; }
.cl-cta{ margin-top:6px; background:linear-gradient(90deg,#5c4413,var(--gold)); border:1px solid var(--gold-bright); color:#1a1410; font-family:'Cinzel',serif; font-weight:800; font-size:13px; border-radius:10px; padding:10px 22px; cursor:pointer; }
.cl-find-top{ display:flex; gap:6px; margin-bottom:10px; }
.cl-search{ flex:1; background:rgba(0,0,0,.3); border:1px solid #3a2c50; border-radius:9px; padding:8px 10px; color:#f0e6d2; font-size:12px; }
.cl-create-btn{ flex:0 0 auto; background:linear-gradient(180deg,#5c4413,var(--gold)); border:1px solid var(--gold-bright); color:#1a1410; font-family:'Cinzel',serif; font-weight:800; font-size:12px; border-radius:9px; padding:8px 12px; cursor:pointer; }
.cl-list, .cl-rate-list{ display:flex; flex-direction:column; gap:6px; }
.cl-row{ display:flex; align-items:center; gap:10px; background:rgba(30,22,40,.55); border:1px solid #2c2438; border-radius:11px; padding:8px 10px; }
.cl-row.mine{ border-color:var(--gold-bright); }
.cl-row-info{ flex:1; min-width:0; }
.cl-row-name{ font-size:13px; color:#f0e6d2; font-weight:700; }
.cl-row-sub{ font-size:10.5px; color:var(--muted); font-family:'JetBrains Mono',monospace; margin-top:1px; }
.cl-row-req{ font-size:10px; font-family:'JetBrains Mono',monospace; margin-top:2px; }
.cl-row-req.ok{ color:#9be07a; } .cl-row-req.no{ color:#ff8a8a; }
.cl-join{ flex:0 0 auto; background:linear-gradient(90deg,#2e5a48,#3a7a5e); border:1px solid #4a9a76; color:#eafff4; font-family:'Cinzel',serif; font-weight:800; font-size:11px; border-radius:9px; padding:9px 12px; cursor:pointer; }
.cl-join.dis{ background:#33302a; border-color:#3a3630; color:#8a8478; }
.cl-here{ flex:0 0 auto; font-size:11px; color:var(--gold-bright); font-weight:700; }
.cl-rate-row{ display:flex; align-items:center; gap:9px; background:rgba(30,22,40,.5); border:1px solid #2c2438; border-radius:10px; padding:7px 10px; }
.cl-rate-row.mine{ border-color:var(--gold-bright); background:rgba(202,164,76,.1); }
.cl-rate-rk{ width:26px; text-align:center; font-size:18px; flex:0 0 auto; }
.cl-rate-rk .cl-rk{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; color:var(--muted); }
.cl-rate-info{ flex:1; min-width:0; }
.cl-rate-pw{ font-size:11px; color:#e8c84e; font-family:'JetBrains Mono',monospace; flex:0 0 auto; }
.cl-pop-d{ font-size:12px; color:var(--parchment); line-height:1.5; text-align:center; margin-bottom:10px; }
.cl-pop-btns{ display:flex; gap:8px; }
.cl-pop-btns.col{ flex-direction:column; }
.cl-pop-yes{ flex:1; background:linear-gradient(90deg,#2e5a48,#3a7a5e); border:1px solid #4a9a76; color:#eafff4; font-family:'Cinzel',serif; font-weight:800; font-size:12px; border-radius:9px; padding:9px; cursor:pointer; }
.cl-pop-yes.danger{ background:linear-gradient(90deg,#5a2630,#7a3540); border-color:#9a4550; color:#ffd0d4; }
.cl-pop-no{ flex:1; background:#33303a; border:1px solid #4a4452; color:#cdbfe0; font-family:'Cinzel',serif; font-weight:800; font-size:12px; border-radius:9px; padding:9px; cursor:pointer; }
.cl-input{ width:100%; background:rgba(0,0,0,.3); border:1px solid #3a2c50; border-radius:9px; padding:9px 10px; color:#f0e6d2; font-size:13px; margin-bottom:8px; box-sizing:border-box; }
.cl-row.clickable{ cursor:pointer; }
.cl-row.clickable:hover{ border-color:var(--gold); }
.cl-rate-row.clickable{ cursor:pointer; }
.cl-rate-row.clickable:hover{ border-color:var(--gold); }
.cl-row-go{ flex:0 0 auto; color:var(--muted); font-size:22px; font-weight:700; padding-left:2px; }
.cl-back{ background:none; border:none; color:var(--gold-bright); font-size:13px; font-weight:700; cursor:pointer; padding:0 0 10px; }
.cl-detail-join{ flex:0 0 auto; align-self:center; }
.cl-glyph-lbl{ font-size:11px; color:var(--gold-bright); margin:2px 0 6px; }
.cl-glyph-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin-bottom:10px; }
.cl-glyph{ aspect-ratio:1; border-radius:10px; font-size:20px; cursor:pointer; display:flex; align-items:center; justify-content:center;
background:radial-gradient(circle at 38% 30%, var(--ec,#888), var(--ec2,#333)); border:2px solid rgba(255,255,255,.15); opacity:.65; }
.cl-glyph.sel{ border-color:#fff; opacity:1; box-shadow:0 0 8px var(--ec,#fff); }
.cl-lock-note{ background:rgba(255,120,80,.12); border:1px solid #7a3a2a; color:#ffb090; font-size:11px; text-align:center; border-radius:8px; padding:7px 8px; margin-bottom:8px; }
/* профиль игрока (клик по имени в Лиге/чате) */
.pp-head{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.pp-avatar{ width:60px; height:60px; flex:0 0 auto; border-radius:12px; overflow:hidden; background:rgba(0,0,0,.3); border:2px solid var(--gold); }
.pp-avatar svg{ width:100%; height:100%; display:block; }
.pp-id{ flex:1; min-width:0; }
.pp-name{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:#fff; }
.pp-floor{ font-size:11px; color:var(--parchment); margin-top:2px; }
.pp-floor b{ color:var(--gold-bright); }
.pp-row{ display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--parchment); padding:6px 2px; border-bottom:1px solid #2c2040; }
.pp-row b{ color:#9be07a; font-family:'JetBrains Mono',monospace; }
.pp-clan{ display:flex; align-items:center; gap:6px; font-weight:700; color:#e0c0ff; }
.pp-mem-h{ margin:10px 2px 7px; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--gold-bright); }
.pp-heroes{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin-bottom:10px; }
.pp-hero{ display:flex; flex-direction:column; align-items:center; gap:2px; background:rgba(0,0,0,.25); border-radius:8px; padding:4px 2px; }
.pp-hero svg{ width:40px; height:40px; display:block; }
.pp-hero-lvl{ font-size:9px; color:#e8c84e; font-family:'JetBrains Mono',monospace; }
.pp-actions{ display:flex; gap:6px; margin:4px 0 10px; }
.pp-act{ flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; padding:7px 4px; font-size:11px; font-weight:700; color:var(--parchment); background:rgba(0,0,0,.28); border:1px solid #3a2c50; border-radius:9px; cursor:pointer; }
.pp-act:hover{ border-color:var(--gold-bright); color:var(--gold-bright); }
.pp-act .ppa-ic{ font-size:17px; }
.pp-act[disabled]{ opacity:.5; cursor:default; }
.pp-actions{ flex-wrap:wrap; }
.pp-pid{ font-family:'JetBrains Mono',monospace; color:#9a8fb0; }
.pp-rel{ display:inline-block; margin-top:4px; font-size:10px; font-weight:700; padding:2px 7px; border-radius:8px; }
.pp-rel.friend{ background:rgba(120,224,160,.16); color:#8fe0a8; }
.pp-rel.inc{ background:rgba(120,180,255,.16); color:#9fd0ff; }
.pp-rel.sent{ background:rgba(255,210,74,.14); color:#ffd24a; }
.pp-rel.blocked{ background:rgba(255,100,80,.14); color:#ff8b73; }
/* кнопка «Друзья» в окне Осады + бейдж заявок */
.siege-friends-btn{ display:flex; align-items:center; justify-content:center; gap:6px; margin:2px auto 9px; font-size:12px; font-weight:700; color:var(--gold-bright); background:rgba(0,0,0,.3); border:1px solid #3a2c50; border-radius:9px; padding:6px 14px; cursor:pointer; }
.siege-friends-btn:hover{ border-color:var(--gold-bright); }
/* окно друзей выше окна Осады (открывается поверх) */
#friendsModal{ z-index:72; }
#friendsBackdrop{ z-index:71; }
.fr-badge{ display:none; min-width:16px; height:16px; padding:0 4px; border-radius:9px; background:#e0405a; color:#fff; font-size:10px; font-weight:800; line-height:16px; text-align:center; }
.fr-badge.show{ display:inline-block; }
/* ОКНО ДРУЗЕЙ (14.09.2026, макеты client/maket-zayavki.html: З2 «Карточки» + общие кадры «Друзья» и «Добавить»).
Каркас как у Зала славы: .siege-modal + .siege-head с закладками, справа подпись .hall-sub. */
.friends-modal .siege-tab{ position:relative; overflow:visible; }
.fr-tabbd{ position:absolute; top:-7px; right:-7px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:#d3415a; color:#fff; font:700 10px 'JetBrains Mono',monospace; display:none; align-items:center; justify-content:center; border:2px solid #18120d; }
.fr-tabbd.show{ display:flex; }
.fr-body{ flex:1; min-height:0; display:flex; flex-direction:column; gap:6px; padding-top:8px; }
.fr-foot{ flex-shrink:0; display:flex; align-items:center; gap:10px; font-size:10.5px; color:var(--muted); padding-top:6px; min-height:22px; }
.fr-foot b{ color:var(--gold-bright); font-family:'JetBrains Mono',monospace; }
.fr-foot .sp{ margin-left:auto; display:flex; align-items:center; gap:8px; }
.fr-chips{ display:flex; gap:5px; flex-wrap:wrap; align-items:center; flex-shrink:0; }
.fr-chips .lbl{ font-size:10px; color:var(--muted); margin-right:2px; }
.fr-chip{ font:700 10px 'Inter',sans-serif; padding:3px 9px; border-radius:999px; border:1px solid #3a2e20; background:#1f1812; color:var(--muted); white-space:nowrap; cursor:pointer; }
.fr-chip.on{ border-color:#caa44c; color:var(--gold-bright); background:#2a2118; }
.fr-chip.soon{ opacity:.45; border-style:dashed; cursor:default; }
.fr-b{ font:700 10px 'Inter',sans-serif; padding:4px 9px; border-radius:6px; border:1px solid #caa44c; background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; white-space:nowrap; cursor:pointer; }
.fr-b.ok{ background:linear-gradient(180deg,#8ee0a0,#37a85a); border-color:#2c8048; color:#08210f; }
.fr-b.no{ background:linear-gradient(180deg,#e06070,#a8293f); border-color:#7a1a2a; color:#fff; }
.fr-b.gr{ background:#2a2118; border-color:#3a2e20; color:var(--muted); }
.fr-b.sq{ width:26px; height:26px; padding:0; display:inline-flex; align-items:center; justify-content:center; font-size:13px; }
.fr-b[disabled]{ opacity:.5; cursor:default; }
.fr-dmg{ display:flex; gap:10px; font:700 10.5px 'JetBrains Mono',monospace; color:#c8b088; white-space:nowrap; }
.fr-dmg span::before{ margin-right:2px; }
.fr-dmg .sw::before{ content:'🗡️'; } .fr-dmg .ar::before{ content:'🏹'; } .fr-dmg .po::before{ content:'🧪'; }
.fr-av{ width:30px; height:30px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#4a3a5a,#1c1524); border:1px solid #8a6a3a; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; position:relative; }
.fr-av.on::after{ content:''; position:absolute; right:-1px; bottom:-1px; width:9px; height:9px; border-radius:50%; background:#5ad07a; border:2px solid #18120d; }
.fr-nm{ font-size:11.5px; font-weight:700; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fr-nm small{ font-weight:400; color:var(--muted); font-family:'JetBrains Mono',monospace; font-size:9.5px; margin-left:4px; }
.fr-sl{ font:700 11px 'JetBrains Mono',monospace; color:#ffd76a; white-space:nowrap; }
.fr-sl::before{ content:'★ '; font-size:9px; }
.fr-ttl{ font:700 10px 'JetBrains Mono',monospace; color:#c8b088; white-space:nowrap; }
.fr-ttl::before{ content:'☥ '; color:#7fe0a0; }
.fr-tm{ font-size:9.5px; color:#e0a060; white-space:nowrap; }
.fr-tm.hot{ color:#ff7060; }
.fr-empty{ padding:28px 12px; text-align:center; font-size:11.5px; color:var(--muted); line-height:1.5; }
/* заявки — карточки 3×2 (З2), дальше прокрутка */
.fr-grid{ flex:1; min-height:0; overflow-y:auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:108px; gap:8px; padding-right:2px; } /* две строки по 108 + зазор = 224 — влезают в окно 348 без прокрутки */
.fr-grid::-webkit-scrollbar{ width:4px; } .fr-grid::-webkit-scrollbar-thumb{ background:#8a6a3a; border-radius:2px; }
.fr-card{ border-radius:10px; border:1px solid #caa44c; background:linear-gradient(180deg,#2a2118,#18120d); padding:5px 10px; display:flex; flex-direction:column; gap:3px; position:relative; min-width:0; }
.fr-card .hd{ display:flex; align-items:center; gap:8px; min-width:0; }
.fr-card .hd .fr-av{ width:30px; height:30px; font-size:15px; }
.fr-card .hd .nmw{ flex:1; min-width:0; }
.fr-card .fr-tm{ position:absolute; right:8px; top:7px; }
.fr-card .acts{ display:flex; gap:6px; margin-top:auto; }
.fr-card .acts .fr-b{ flex:1; text-align:center; }
/* друзья — строки, лента по 50 */
.fr-list{ flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:4px; padding-right:2px; }
.fr-list::-webkit-scrollbar{ width:4px; } .fr-list::-webkit-scrollbar-thumb{ background:#8a6a3a; border-radius:2px; }
.fr-row{ display:flex; align-items:center; gap:8px; padding:4px 8px; border-radius:8px; border:1px solid #3a2e20; background:#1f1812; min-height:36px; flex-shrink:0; }
.fr-row .nmw{ flex:1; min-width:0; }
.fr-row .last{ font-size:9.5px; color:var(--muted); white-space:nowrap; }
.fr-stat{ display:flex; gap:8px; align-items:center; flex-shrink:0; }
.fr-search{ width:190px; flex-shrink:0; padding:4px 8px; border-radius:8px; border:1px solid #3a2e20; background:#0e0a06; font-size:10.5px; color:#e9ddc3; outline:none; }
.fr-search::placeholder{ color:#6a5e4a; }
.fr-search:focus{ border-color:var(--gold-bright); }
/* добавить — папирус с полем под номер */
.fr-add{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.fr-add .k{ font:800 13px 'Cinzel',serif; letter-spacing:.08em; color:#f0e0b0; text-align:center; }
.fr-pap{ width:380px; max-width:100%; border-radius:12px; border:2px solid #8a6a3a; background:linear-gradient(160deg,#eedcb0,#dcc48e 60%,#cdb27a); padding:14px 18px; display:flex; flex-direction:column; align-items:center; gap:10px; position:relative; overflow:hidden; }
.fr-pap::after{ content:''; position:absolute; inset:0; background:repeating-linear-gradient(0deg,rgba(90,60,20,.05) 0 1px,transparent 1px 4px); pointer-events:none; }
.fr-pap > *{ position:relative; z-index:1; }
.fr-num{ width:100%; box-sizing:border-box; padding:8px 10px; border-radius:8px; border:2px solid #8a6a3a; background:#fff8e6; font:700 16px 'JetBrains Mono',monospace; color:#3a2410; text-align:center; letter-spacing:.2em; outline:none; }
.fr-num::placeholder{ color:#b09a70; font-weight:400; letter-spacing:0; font-family:'Inter',sans-serif; font-size:12px; }
.fr-pap .fr-b{ padding:8px 30px; font-size:12px; }
.fr-pap .note{ font-size:10px; color:#7a5a2a; text-align:center; }
.fr-code{ font-size:11.5px; color:#c8b088; display:flex; align-items:center; gap:8px; }
.fr-code b{ font:700 15px 'JetBrains Mono',monospace; color:#ffd76a; letter-spacing:.1em; }
.fr-copy{ font:700 10px 'Inter',sans-serif; padding:4px 9px; border-radius:6px; border:1px solid #8a6a3a; background:#2a2118; color:var(--gold-bright); cursor:pointer; }
/* номер игрока в строке Зала славы (14.09.2026) */
/* доска топ-10 по урону (осада) */
.bb-head{ display:flex; justify-content:space-between; align-items:center; font-size:11px; font-weight:700; color:var(--gold-bright); margin:2px 2px 6px; }
.bb-cnt{ color:var(--parchment); font-weight:600; font-family:'JetBrains Mono',monospace; font-size:10px; }
.bb-empty{ font-size:11px; color:var(--parchment); text-align:center; line-height:1.45; padding:10px 8px; opacity:.85; }
/* в бою доска стоит сбоку во всю высоту, поэтому список тянется, а не режется по 190px */
.bb-list{ display:flex; flex-direction:column; gap:3px; flex:1; min-height:0; overflow-y:auto; }
.bb-row{ display:flex; align-items:center; gap:7px; background:rgba(0,0,0,.25); border:1px solid #2c2040; border-radius:8px; padding:4px 7px; cursor:pointer; }
.bb-row.me{ border-color:var(--gold-bright); background:rgba(202,164,76,.13); }
.bb-row:hover{ filter:brightness(1.15); }
.bb-rank{ width:18px; flex:0 0 auto; text-align:center; font-size:11px; font-weight:800; color:#9a8fb0; }
.bb-ava{ width:26px; height:26px; flex:0 0 auto; border-radius:6px; overflow:hidden; background:rgba(0,0,0,.3); }
.bb-ava svg{ width:100%; height:100%; display:block; }
.bb-name{ flex:1; min-width:0; font-size:12px; font-weight:700; color:#f0e6d2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bb-dmg{ flex:0 0 auto; font-size:11px; color:#e8c84e; font-family:'JetBrains Mono',monospace; text-align:right; }
.bb-dmg b{ display:block; font-size:9.5px; color:#9be07a; font-weight:700; }
/* Печать Уровней (реликвия) */
.rel-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.rel-ic{ font-size:30px; }
.rel-title{ font-family:'Cinzel',serif; font-weight:800; font-size:16px; color:var(--gold-bright); }
.rel-sub{ font-size:11px; line-height:1.3; min-height:2.6em; color:var(--parchment); } .rel-sub b{ color:#9be07a; } /* 23.09.2026: всегда место под 2 строки — окно не прыгает от уровня */
.rel-box{ background:rgba(0,0,0,.28); border:1px solid #3a2c50; border-radius:10px; padding:8px 10px; margin-bottom:8px; }
.rel-on{ font-size:12px; color:var(--parchment); } .rel-on b{ color:#fff; }
.rel-off{ margin-left:6px; font-size:10px; padding:1px 7px; background:rgba(255,90,90,.15); border:1px solid #6a3050; border-radius:7px; color:#ff9a9a; cursor:pointer; }
.rel-eff{ font-size:12px; color:var(--parchment); margin-top:6px; } .rel-eff b{ font-family:'JetBrains Mono',monospace; }
.rel-eff-dmg{ white-space:nowrap; overflow:hidden; min-width:0; line-height:16px; height:16px; } /* 23.09.2026: одна строка, длинные числа ужимает FIT_SEL (.fit) */
.rel-up{ text-align:center; background:rgba(0,0,0,.2); border:1px solid #3a2c50; border-radius:10px; padding:9px; margin-bottom:10px; }
.rel-next{ font-size:12px; line-height:1.3; min-height:2.6em; color:var(--parchment); margin-bottom:7px; } /* 23.09.2026: место под 2 строки всегда */
.rel-upbtn{ width:100%; padding:9px; font-weight:800; font-size:13px; color:#1a1208; background:linear-gradient(180deg,#ffd86a,#caa12e); border:none; border-radius:9px; cursor:pointer; }
.rel-upbtn:disabled{ filter:grayscale(.7) brightness(.7); cursor:default; }
.rel-have{ font-size:10px; color:var(--muted); margin-top:5px; }
.rel-max{ font-size:13px; color:var(--gold-bright); font-weight:700; }
.rel-pick-h{ font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--gold-bright); margin:0 2px 6px; }
.rel-pick{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; max-height:200px; overflow-y:auto; margin-bottom:10px; }
.rel-hero{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:5px 3px; background:rgba(0,0,0,.25); border:1px solid #3a2c50; border-radius:9px; cursor:pointer; }
.rel-hero.sel{ border-color:var(--gold-bright); background:rgba(255,200,80,.12); }
.rel-hero .rh-port{ width:38px; height:38px; } .rel-hero .rh-port svg{ width:100%; height:100%; display:block; }
.rh-nm{ font-size:10px; color:var(--parchment); text-align:center; line-height:1.1; }
.rh-rk{ font-size:8px; font-weight:700; }
.lad-prof{ cursor:pointer; }
.lad-prof:hover{ color:var(--gold-bright); text-decoration:underline; }
.lad-lvl{ font-size:10px; color:var(--muted); font-family:'JetBrains Mono',monospace; margin-right:6px; }
.chat-msg .cm-lvl{ font-size:10px; color:var(--gold-bright); font-family:'JetBrains Mono',monospace; margin:0 1px 0 4px; }
.chat-msg .cm-colon{ color:var(--parchment); margin-right:2px; }
.chat-msg .cm-name{ cursor:pointer; margin-right:0; }
.chat-msg .cm-name:hover{ text-decoration:underline; }
.chat-empty{ color:var(--muted); font-size:12px; text-align:center; padding:34px 18px; line-height:1.7; }
/* Переиспользуемый поповер: затемнённый фон + окно по центру. Клик по фону закрывает. */
.pop-backdrop{ position:absolute; inset:0; z-index:8; background:rgba(0,0,0,.82); display:flex; align-items:center; justify-content:center; }
.pop-window{ width:min(300px,86%); max-height:80%; overflow-y:auto;
background:linear-gradient(180deg,#241830,#140c1c); border:1px solid var(--gold); border-radius:13px; padding:14px; box-shadow:0 14px 40px rgba(0,0,0,.7); }
.lcp-t{ font-family:'Cinzel',serif; font-weight:800; font-size:13px; color:var(--gold-bright); text-align:center; margin-bottom:8px; }
.lcp-row{ display:flex; justify-content:space-between; font-size:12px; color:var(--parchment); padding:4px 2px; border-bottom:1px solid #2c2040; }
.lcp-row b{ color:#9be07a; font-family:'JetBrains Mono',monospace; }
.lcp-x{ font-size:9px; color:var(--muted); text-align:center; margin-top:8px; }
.lcp-close{ width:100%; margin-top:10px; background:linear-gradient(90deg,#5c4413,var(--gold)); border:1px solid var(--gold-bright); color:#1a1410; font-family:'Cinzel',serif; font-weight:800; font-size:12px; border-radius:9px; padding:8px; cursor:pointer; }
/* История (08.09.2026): две вкладки «Защита» / «Атака», строки как в арене Raid —
соперник, его рейтинг, очки за бой, счёт пар, итог и давность. Те же .lh-av/.lh-mini — аватары в списке «Атака».
09.09.2026: блок восстановлен из слепка konec-sessii-perenos2-20260908-1809 — пропал вместе со стилями колод. */
.lh-tabs{ display:flex; gap:6px; margin-bottom:8px; }
.lh-tab{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px; padding:8px; border-radius:9px; cursor:pointer;
font-family:'Cinzel',serif; font-weight:800; font-size:12.5px; color:var(--muted); background:rgba(30,20,44,.5); border:1px solid #3a2850; }
.lh-tab.active{ color:var(--gold-bright); border-color:var(--gold-bright); background:rgba(232,200,78,.1); }
.lh-list{ display:flex; flex-direction:column; gap:6px; }
.lh-row{ display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:10px; background:rgba(30,20,44,.45); border:1px solid #3a2c50; }
.lh-av{ width:46px; height:46px; flex:0 0 auto; position:relative; border-radius:9px; overflow:hidden; background:rgba(0,0,0,.35); border:1px solid var(--gold); }
.lh-av svg{ width:100%; height:100%; display:block; }
.lh-av[data-pcard]{ cursor:pointer; }
.lh-av .pf-ava{ width:100%; height:100%; box-sizing:border-box; border:0; border-radius:0; font-size:24px; } /* аватарка соперника из профиля (25.09.2026) */
.lh-av .lh-lvl{ position:absolute; right:2px; bottom:1px; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#fff; text-shadow:0 0 3px #000, 0 0 3px #000; }
.lh-who{ width:104px; flex:0 0 auto; min-width:0; }
.lh-nm{ font-weight:700; font-size:12px; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lh-rt{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#ffd24a; margin-top:2px; }
.lh-pts{ width:52px; flex:0 0 auto; text-align:center; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px; background:rgba(0,0,0,.35); border-radius:7px; padding:5px 0; }
.lh-pts.plus{ color:#7ee0a0; }
.lh-pts.minus{ color:#ff8a8a; }
.lh-team{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px; }
.lh-minis{ display:flex; gap:3px; }
.lh-mini{ width:34px; height:34px; position:relative; border-radius:6px; overflow:hidden; background:#0f0c14; border:1px solid #3a2850; }
.lh-mini svg{ width:100%; height:100%; display:block; }
.lh-mini .lh-lvl{ position:absolute; right:1px; bottom:0; font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; color:#fff; text-shadow:0 0 3px #000, 0 0 3px #000; }
.lh-unit{ flex:0 0 auto; width:34px; display:flex; flex-direction:column; align-items:center; --st:9px; }
.lr-row .lh-unit{ width:46px; --st:12px; }
.lh-upow{ max-width:100%; margin-top:1px; font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; line-height:1.15; letter-spacing:-.3px;
color:#ffe08a; white-space:nowrap; overflow:hidden; text-align:center; }
.lr-row .lh-upow{ font-size:9px; }
.lh-mini .lh-pow{ left:0; right:0; text-align:center; font-size:7.5px; letter-spacing:-.3px; color:#ffe08a; background:rgba(0,0,0,.6); }
.lh-tp{ font-size:10px; color:var(--parchment); white-space:nowrap; }
.lh-tp b{ font-family:'JetBrains Mono',monospace; color:#ffd24a; }
.lh-res{ width:82px; flex:0 0 auto; text-align:center; font-family:'Cinzel',serif; font-weight:800; font-size:12px; }
.lh-res.win{ color:#7ee0a0; }
.lh-res.lose{ color:#ff8a8a; }
.lh-res .lh-time{ display:block; margin-top:3px; font-family:'JetBrains Mono',monospace; font-weight:400; font-size:10px; color:var(--muted); }
.lh-empty{ padding:30px 10px; text-align:center; color:var(--muted); font-size:12px; }
.lad-title{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; text-align:center; margin-bottom:2px; }
.lad-row[data-lgrow]{ cursor:pointer; }
.lad-row[data-lgrow]:hover{ border-color:var(--gold); }
/* ===== Охота (вылазки) ===== */
/* Окно лежит набок: заголовок и строка энергии сверху, шесть дел — сеткой в две колонки */
.hunt-modal{ width:min(800px,96%); max-height:367px;
display:flex; flex-direction:column; gap:8px; padding:12px; text-align:left; }
.hunt-modal .pm-title{ margin:0; padding-right:30px; font-size:14px; }
.hunt-body{ flex:1; min-height:0; overflow-y:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
grid-auto-rows:max-content; align-content:start; gap:8px; }
/* НОВАЯ Охота — «движухи» */
.hunt-intro{ grid-column:1/-1; font-size:11px; color:var(--parchment); background:rgba(0,0,0,.25); border:1px solid #3a2c50; border-radius:9px; padding:7px 10px; line-height:1.4; }
.deed-row{ display:flex; align-items:center; gap:9px; padding:7px 9px; background:rgba(0,0,0,.25); border:1px solid #3a2c50; border-radius:11px; }
.deed-ic{ font-size:23px; line-height:1.15; flex:0 0 auto; width:34px; text-align:center; }
.deed-main{ flex:1; min-width:0; }
.deed-name{ font-family:'Cinzel',serif; font-weight:700; font-size:13px; color:#fff; }
.deed-hodka{ font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--gold-bright); margin-left:5px; }
.deed-bar{ display:flex; gap:3px; margin:4px 0 3px; flex-wrap:wrap; }
.deed-cell{ width:13px; height:13px; border-radius:4px; background:rgba(0,0,0,.4); border:1px solid #4a3a64; }
.deed-cell.on{ background:linear-gradient(180deg,#ffe066,#caa12e); border-color:#caa12e; box-shadow:0 0 4px rgba(255,210,80,.6); }
.deed-rew{ font-size:9.5px; line-height:1.3; color:var(--muted); }
.deed-btn{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:1px; min-width:72px; padding:7px 6px; font-family:'Cinzel',serif; font-weight:700; font-size:12px; color:#1a1208; background:linear-gradient(180deg,#ffd86a,#caa12e); border:none; border-radius:9px; cursor:pointer; }
.deed-btn:disabled{ filter:grayscale(.7) brightness(.65); cursor:default; }
.deed-btn .deed-cost{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#3a2a08; }
.hunt-go-btn{
font-family:'Cinzel',serif; font-weight:700; font-size:12px; border-radius:9px; padding:8px 12px; cursor:pointer; border:1px solid; }
.hunt-sec-t{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-bright); margin:8px 0 2px; }
.hunt-heroes, .hunt-durs{ display:flex; flex-wrap:wrap; gap:7px; }
.hunt-hero{ width:66px; padding:5px; border-radius:9px; background:rgba(30,20,44,.6); border:1px solid #3a2850; cursor:pointer; text-align:center; color:var(--parchment); }
.hunt-hero.sel{ border-color:var(--gold-bright); box-shadow:0 0 7px rgba(202,164,76,.4); }
.hh-port{ width:40px; height:40px; margin:0 auto; border-radius:7px; overflow:hidden; }
.hh-port svg{ width:100%; height:100%; }
.hh-nm{ font-size:9px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hh-pw{ font-size:9px; color:#ffb060; }
.hunt-dur{ flex:1; min-width:70px; padding:9px; border-radius:9px; background:rgba(30,20,44,.6); border:1px solid #3a2850; cursor:pointer; color:var(--parchment); font-weight:700; font-size:12px; }
.hunt-dur.sel{ border-color:var(--gold-bright); box-shadow:0 0 7px rgba(202,164,76,.4); }
.hunt-none{ font-size:11px; color:var(--muted); padding:6px; }
/* Карточка-вылазка в списке охоты (превью добычи + Начать/таймер/лок) — по референсу игрока */
.hunt-card{ display:flex; gap:10px; margin:0 0 9px; padding:10px; border-radius:12px;
background:linear-gradient(180deg,rgba(40,28,60,.7),rgba(22,12,30,.7)); border:1px solid #4a3570; }
.hunt-card.locked{ opacity:.6; }
.hc-left{ flex:1; min-width:0; }
.hc-rhead{ display:flex; align-items:center; gap:7px; margin-bottom:6px; }
.hc-ricon{ width:34px; height:34px; border-radius:8px; overflow:hidden; flex-shrink:0; background:#0f0c14; }
.hc-ricon svg{ width:100%; height:100%; display:block; }
.hc-rname{ font-family:'Cinzel',serif; font-weight:800; font-size:14px; color:var(--gold-bright); }
.hc-rlabel{ font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:5px; }
.hc-loot{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; }
.hc-loot-cell{ aspect-ratio:1; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:15px;
background:radial-gradient(circle at 38% 30%, #2a3a55, #14101c); border:1px solid #3a2850; box-shadow:inset 0 0 4px rgba(0,0,0,.4); }
.hc-right{ width:108px; flex-shrink:0; display:flex; flex-direction:column; gap:7px; align-items:center; justify-content:center; text-align:center; }
.hc-locked{ font-size:11px; color:var(--muted); line-height:1.5; } .hc-locked b{ color:#c79a5a; font-size:14px; }
.hc-miniparty{ display:flex; gap:3px; justify-content:center; flex-wrap:wrap; }
.hc-miniparty .hs-mini{ width:24px; height:24px; border-radius:5px; overflow:hidden; background:#0f0c14; }
.hc-miniparty .hs-mini svg{ width:100%; height:100%; display:block; }
.hc-timer{ font-size:11px; color:#7ee0a0; font-family:'JetBrains Mono',monospace; }
.hunt-go-btn.hc-go{ width:100%; padding:11px 6px; font-size:14px; }
.hunt-go-btn.hc-go:not(:disabled){ background:linear-gradient(180deg,#3fa34d,#2c7a39); border-color:#6fe08a; color:#fff; box-shadow:0 0 12px rgba(80,200,110,.4); }
.hunt-go-btn.hc-claim:not(:disabled){ background:linear-gradient(180deg,#2a7a3a,#3fb05a); border-color:#5fd07a; }
.hp-loot{ max-width:240px; } /* превью наград в окне сбора — не на всю ширину */
.hunt-go-btn{ flex:1; background:linear-gradient(90deg,#5c4413,var(--gold)); border-color:var(--gold-bright); color:#1a1410; }
.hunt-go-btn:disabled{ background:#33302a; border-color:#3a3630; color:#7a7468; cursor:not-allowed; }
/* ===== Кладовая (инвентарь): вкладки + грид ячеек со счётчиками =====
С 21.09.2026 живёт во вкладке «Сундук» окна «Храм» (.hram-bag в конце файла), своего окна .inv-modal больше нет.
Ячейки в десять колонок. */
.inv-tabs{ display:flex; gap:5px; margin:8px 0; overflow-x:auto; padding-bottom:3px; flex-shrink:0; }
.inv-tab{ flex:0 0 auto; min-width:50px; padding:6px 6px; border-radius:10px; cursor:pointer;
background:rgba(30,20,44,.6); border:1px solid #3a2850; color:var(--parchment);
display:flex; flex-direction:column; align-items:center; gap:2px; }
.inv-tab.sel{ border-color:var(--gold-bright); box-shadow:0 0 7px rgba(202,164,76,.35); }
.inv-tab .it-ic{ font-size:18px; line-height:1; }
.inv-tab .it-lb{ font-size:9.5px; letter-spacing:.02em; }
.inv-tab.sel .it-lb{ color:var(--gold-bright); }
.inv-grid{ display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px; overflow-y:auto; overflow-x:hidden; padding:3px; }
.inv-cell{ position:relative; aspect-ratio:1; border-radius:9px; border:1px solid #3a2850;
background:linear-gradient(180deg,var(--panel-light),#160b1e);
display:flex; align-items:center; justify-content:center; padding:3px; }
.inv-cell .iv-badge{ position:absolute; bottom:2px; left:0; right:0; text-align:center;
color:var(--gold-bright); font-family:'JetBrains Mono',monospace; font-size:8.5px; line-height:1; text-shadow:0 1px 2px #000; }
.inv-cell .iv-icwrap{ width:30px; height:30px; display:flex; align-items:center; justify-content:center; margin-bottom:6px; }
.inv-cell .iv-icwrap svg{ width:100%; height:100%; border-radius:6px; }
.inv-cell .iv-ic{ font-size:22px; line-height:1; }
.inv-cell .siege-mark{ font-size:24px; }
/* ШМОТ ГЕРОЕВ (24.09.2026, js/25-shmot.js): вырезка из «Инвентаря фараона», уровень вещи римской цифрой в углу,
число штук — сбоку (его слово «сбоку аккуратно число штук») */
.it-art{ display:block; flex-shrink:0; background-repeat:no-repeat; border-radius:4px; }
.it-emo{ line-height:1; }
.it-pic{ background-size:contain; background-position:center; } /* вещь своего уровня (59-я): вписана в квадрат */
.it-lv{ position:absolute; left:3px; top:2px; font:800 8.5px/1 Georgia,serif; color:#ffe07a; text-shadow:0 1px 2px #000; }
.inv-cell.shmot .iv-icwrap{ margin-bottom:0; }
.inv-cell.shmot .iv-badge{ left:auto; right:3px; bottom:2px; text-align:right; }
.loot-reveal.it-reveal{ width:max-content; max-width:94%; top:50%; } /* все 11 видов в один ряд, а не половина сцены; по центру — не под верхней полосой */
.it-reveal .lr-items{ gap:8px; }
/* много видов сразу (долгий офлайн, 44 вида = 4 уровня) — окно не выше сцены, вещи листаются, «Забрать» всегда видна */
/* 10.10.2026 (59-я), его слово: окошко маленькое — 7 вещей в ряд (его слово, было 6), видна одна строка (и краешек следующей), остальное листается вниз;
сзади всё затемнено (тень на всю сцену), лежит в .stage поверх песка смерти мобов. */
.loot-reveal.it-reveal{ max-height:96%; display:flex; flex-direction:column; z-index:40; width:auto; padding:10px 14px 12px;
box-shadow:0 10px 34px rgba(0,0,0,.6), 0 0 0 200vmax rgba(0,0,0,.55); } /* над кнопками сцены справа (подарок, ускорение), под окнами (60+) */
.it-reveal .lr-items{ flex:0 1 auto; min-height:0; max-height:92px; overflow-y:auto; padding:2px 6px 2px 2px; display:grid; grid-template-columns:repeat(7, 48px); gap:8px 10px; justify-content:center; }
.it-reveal .lr-greet{ margin-bottom:6px; }
.it-reveal .lr-close-btn{ margin-top:9px; }
.it-reveal .lr-title, .it-reveal .lr-greet, .it-reveal .lr-close-btn{ flex:0 0 auto; }
.lr-port.it-port{ position:relative; display:flex; align-items:center; justify-content:center; border-radius:8px;
border:1px solid #6a5a2a; background:rgba(0,0,0,.3); } /* ключ осады в Кладовой — крупнее, чем значок в списке боссов */
.inv-empty{ grid-column:1/11; text-align:center; color:var(--muted); font-size:12px; padding:30px 10px; line-height:1.5; }
/* ЕЖЕДНЕВНАЯ НАГРАДА — окно «как на скрине» (07.10.2026, 49-я): закладки слева снаружи, доска, сетка 7×4, тап по клетке дня. */
.daily-modal{ width:min(500px,92%); height:min(338px,367px); padding:0; display:flex; flex-direction:column; text-align:center; overflow:visible;
border:2px solid #d4a84b; border-radius:14px; background:radial-gradient(ellipse at 50% 0%,#4a3418 0,#2a1c0c 55%,#1a1008 100%);
box-shadow:0 14px 40px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,220,140,.14), inset 0 0 60px rgba(0,0,0,.45); }
.daily-modal .dl-x{ right:-10px; top:-10px; width:26px; height:26px; border-radius:50%; background:linear-gradient(180deg,#e04848,#9a1a1a); color:#fff; border:2px solid #ffd0b0; font-weight:800; font-size:14px; box-shadow:0 2px 8px rgba(0,0,0,.6); z-index:7; }
.dl-head{ padding:7px 10px 0; }
.dl-title{ font-family:'Cinzel',serif; font-weight:800; font-size:15px; letter-spacing:.04em; color:var(--gold-bright); text-shadow:0 2px 0 #4a2a08,0 0 18px rgba(255,200,90,.35); white-space:nowrap; }
.dl-sub{ font-size:9.5px; color:#e8d8b0; margin-top:1px; }
.dl-grid{ flex:1; min-height:0; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); grid-auto-rows:minmax(0,1fr); gap:7px 7px; padding:2px 14px 11px; }
.dl-grid.short{ padding:8px 16px 14px; gap:6px 8px; grid-template-rows:repeat(2,minmax(0,1fr)); grid-auto-rows:minmax(0,1fr); } /* колонки задаёт js: ceil((n−1)/2) + большая */
.dl-grid.short .dl-cell .dl-d{ font-size:9.5px; margin-top:9px; }
.dl-grid.short .dl-cell .dl-ic{ font-size:34px; margin-bottom:8px; } .dl-grid.short .dl-cell .dl-ic svg{ width:36px; height:36px; } .dl-grid.short .dl-cell .dl-ic.wpn svg{ width:22px; height:22px; }
.dl-grid.short .dl-cell .dl-n{ font-size:11px; padding:1px 9px; bottom:-7px; }
.dl-grid.short .dl-cell.last{ grid-column:-2 / -1; grid-row:1 / 3; }
.dl-grid.short .dl-cell.last .dl-d{ font-size:11px; color:#ffb050; margin-top:11px; }
.dl-grid.short .dl-cell.last .dl-box{ border-width:2px; }
.dl-grid.short .dl-cell.last .dl-ic.hero{ margin-bottom:16px; } .dl-grid.short .dl-cell.last .dl-ic.hero .dl-por{ width:92px; height:92px; border-radius:14px; }
.dl-grid.short .dl-cell.last .dl-ic{ font-size:52px; } .dl-grid.short .dl-cell.last .dl-ic svg{ width:56px; height:56px; }
.dl-grid.short .dl-cell.last .dl-n{ font-size:12px; padding:2px 12px; bottom:-9px; }
.dl-grid.short .dl-cell.last.today .dl-box{ transform:scale(1.02); }
.dl-cell.hero{ cursor:pointer; }
/* 70-я, его слово «на всю картинку, анимацию, фон»: живой герой последнего дня во всю клетку на своём фоне */
.dl-grid.short .dl-cell.hfull .dl-box, .dl-grid.short .dl-cell.hfull.today .dl-box{ background:#1a1008 var(--dlfon) center/cover no-repeat; overflow:visible; }
.dl-cell.hfull .dl-hfull{ position:absolute; inset:0; border-radius:8px; overflow:hidden; pointer-events:none; }
.dl-cell.hfull .dl-hfull canvas{ width:100%; height:100%; display:block; object-fit:contain; object-position:50% 100%; }
.dl-cell.hfull .dl-n{ z-index:2; } .dl-cell.hfull .dl-info{ z-index:3; }
.dl-info{ position:absolute; right:5px; top:5px; width:18px; height:18px; border-radius:50%; border:1.5px solid #fff0c0; background:linear-gradient(180deg,#ffe08a,#caa44c); color:#1a1208; font-weight:800; font-size:11px; line-height:1; cursor:pointer; padding:0; z-index:3; box-shadow:0 1px 4px rgba(0,0,0,.6); }
.dl-cell{ display:flex; flex-direction:column; align-items:center; min-height:0; min-width:0; cursor:default; }
.dl-cell .dl-d{ margin-top:7px; font-size:8.5px; font-weight:800; color:#e8d8b0; line-height:1.2; white-space:nowrap; text-shadow:0 1px 0 #000; }
.dl-cell.big .dl-d{ color:#ffb050; }
.dl-cell.today .dl-d{ color:#7ee060; }
.dl-cell .dl-box{ position:relative; flex:1; min-height:0; width:100%; border-radius:9px; border:1.5px solid #6a4a22; background:linear-gradient(180deg,#3a2a14,#221608);
display:flex; align-items:center; justify-content:center; box-shadow:inset 0 1px 0 rgba(255,220,140,.12), 0 2px 4px rgba(0,0,0,.5); }
.dl-cell .dl-ic{ font-size:21px; line-height:1; display:flex; align-items:center; justify-content:center; gap:1px; filter:drop-shadow(0 2px 2px rgba(0,0,0,.6)); margin-bottom:6px; }
.dl-cell .dl-ic svg{ width:22px; height:22px; }
.dl-cell .dl-ic.wpn svg{ width:14px; height:14px; }
.dl-cell .dl-ic.krasik{ color:#9fd0ff; text-shadow:0 0 8px rgba(120,180,255,.9); font-size:23px; }
.dl-cell .dl-ic.hero{ margin-bottom:8px; } .dl-cell .dl-ic.hero .dl-por{ width:38px; height:38px; }
.dl-cell .dl-n{ position:absolute; left:50%; bottom:-5px; transform:translateX(-50%); font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#1a1208;
background:linear-gradient(180deg,#ffe08a,#d6a63a); border:1px solid #fff0c0; border-radius:5px; padding:0 6px; min-width:26px; white-space:nowrap; box-shadow:0 1px 3px rgba(0,0,0,.6); }
.dl-cell.big .dl-box{ border-color:var(--gold-bright); background:linear-gradient(180deg,#5a4018,#2e1e08); box-shadow:0 0 12px rgba(255,200,90,.35), inset 0 1px 0 rgba(255,230,160,.25); }
.dl-cell.hero .dl-box{ background:linear-gradient(180deg,#5a3a7a,#2a1840); border-color:#d0a0ff; box-shadow:0 0 14px rgba(200,140,255,.45); }
.dl-cell.hero .dl-n{ background:linear-gradient(180deg,#f0d0ff,#b080e0); }
.dl-cell.done .dl-box{ opacity:.55; }
.dl-cell.done .dl-box::after{ content:'✓'; position:absolute; right:-4px; bottom:-4px; width:17px; height:17px; border-radius:50%; background:linear-gradient(180deg,#8ff0a8,#2a9a48); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; border:1.5px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.6); }
.dl-cell.today{ cursor:pointer; }
.dl-cell.today .dl-box{ border-color:#39c8d8; background:linear-gradient(180deg,#2a5a60,#143038); animation:dlPulse 1.4s ease-in-out infinite; transform:scale(1.05); z-index:2; }
.dl-cell.today:active .dl-box{ transform:scale(.98); }
@keyframes dlPulse{ 0%,100%{ box-shadow:0 0 0 2px rgba(57,200,216,.35),0 0 12px rgba(57,200,216,.5);} 50%{ box-shadow:0 0 0 3px rgba(57,200,216,.6),0 0 26px rgba(57,200,216,.95);} }
.dl-foot{ font-size:9.5px; color:#e8d8b0; padding:0 14px 7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dl-foot b{ color:var(--gold-bright); }
/* закладки дорожек слева снаружи окна */
.dl-bm{ position:absolute; left:-44px; top:18px; display:flex; flex-direction:column; gap:6px; z-index:3; }
.dl-tab{ width:52px; height:38px; border-radius:12px 0 0 12px; border:2px solid #6a4a22; border-right:none; background:linear-gradient(180deg,#3a2a14,#221608); color:#cdb080;
display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; box-shadow:-3px 3px 8px rgba(0,0,0,.5); position:relative; font-size:16px; line-height:1; padding:0; }
.dl-tab small{ font-size:7.5px; font-weight:700; margin-top:1px; white-space:nowrap; }
.dl-tab.on{ background:linear-gradient(180deg,#4fd8e8,#1a8aa0); border-color:#bff6ff; color:#06303a; width:58px; margin-left:-6px; }
.dl-tab .dot{ position:absolute; left:-4px; top:-4px; width:13px; height:13px; border-radius:50%; background:#3fd060; color:#fff; font-size:8px; font-weight:800; font-style:normal; display:flex; align-items:center; justify-content:center; border:1.5px solid #fff; }
/* вспышка «Награда получена!» */
.dl-got{ position:absolute; inset:0; display:none; align-items:center; justify-content:center; pointer-events:none; z-index:6; }
.dl-got.on{ display:flex; }
.dl-got div{ font-family:'Cinzel',serif; font-weight:800; font-size:24px; color:#fff; letter-spacing:.03em; padding:10px 60px; white-space:nowrap;
text-shadow:0 3px 0 #3a1a08, 0 0 30px rgba(255,220,120,.9), 0 0 60px rgba(255,160,40,.6); animation:dlGotIn .45s ease-out;
background:linear-gradient(90deg,transparent,rgba(0,0,0,.6) 20%,rgba(0,0,0,.6) 80%,transparent); }
@keyframes dlGotIn{ from{ transform:scale(.5); opacity:0;} to{ transform:scale(1); opacity:1;} }
.daily-modal.dim .dl-cell:not(.today) .dl-box{ filter:brightness(.6); }
/* ===== Ежедневная награда: кнопка на сцене + окно-календарь ===== */
.daily-btn{ position:absolute; right:16px; top:11px; z-index:25; width:38px; height:38px; border-radius:10px; cursor:pointer;
display:flex; align-items:center; justify-content:center; font-size:20px; line-height:1;
background:linear-gradient(180deg,#3a2858,#241634); border:2px solid #b070e0; box-shadow:0 0 12px rgba(176,112,224,.45); }
.daily-btn:active{ transform:scale(.92); }
.daily-btn.ready{ animation:dailyPulse 1.4s ease-in-out infinite; }
@keyframes dailyPulse{ 0%,100%{ box-shadow:0 0 10px rgba(176,112,224,.5);} 50%{ box-shadow:0 0 22px rgba(210,150,255,.95);} }
.daily-btn .db-badge{ position:absolute; top:-4px; right:-4px; min-width:14px; height:14px; border-radius:7px; background:var(--crimson); border:1px solid #fff; display:none; }
.daily-btn.ready .db-badge{ display:block; }
/* Кнопки-сундука Кладовой на сцене больше нет (21.09.2026) — Кладовая стала вкладкой «Сундук» окна «Храм», см. .hram-* в конце файла */
/* ===== Магазин: ветки героев под атаки осады ===== */
/* Окно лежит набок, как Лига и Клан: слева .shop-side (название, вкладки столбиком,
валюты внизу колонки), справа .shop-body с содержимым вкладки. */
.shop-hero-modal{ width:min(820px,96%); height:min(348px,367px); max-height:367px;
display:flex; flex-direction:row; gap:12px; padding:12px; text-align:left; }
.shop-side{ width:136px; flex:0 0 auto; display:flex; flex-direction:column; gap:6px;
border-right:1px solid #3a2850; padding-right:12px; }
.shop-side .pm-title{ margin:0 0 4px; font-size:14px; line-height:1.3; }
/* правой колонке нужен отступ справа, иначе кнопка ✕ ложится поверх содержимого */
.shop-body{ flex:1; min-width:0; overflow-y:auto; overflow-x:hidden; padding-right:22px; }
/* валюты — внизу боковой колонки, в две колонки по строке на валюту */
.shop-cur{ margin-top:auto; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3px 6px;
font-family:'JetBrains Mono',monospace; font-size:11px; color:#cbb88c; background:rgba(0,0,0,.25);
border:1px solid var(--border); border-radius:9px; padding:7px 8px; }
/* вкладки магазина — столбиком в боковой колонке */
.shop-tabs{ display:flex; flex-direction:column; gap:5px; }
.shop-tab{ flex:0 0 auto; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; gap:8px; padding:9px 10px;
background:rgba(0,0,0,.28); border:1px solid #3a2c50; border-radius:9px; cursor:pointer; color:var(--parchment); }
.shop-tab .st-ic{ font-size:15px; line-height:1; filter:grayscale(.4); }
.shop-tab .st-nm{ font-family:'Cinzel',serif; font-weight:700; font-size:11.5px; }
.shop-tab.active{ background:rgba(232,200,78,.1); border-color:var(--gold-bright); color:var(--gold-bright); }
.shop-tab.active .st-ic{ filter:none; }
/* пакеты валюты / расходники / сундуки — в ряд по четыре, строки не тянутся по высоте */
/* Вкладка «Герои» магазина: герои за 💎 (26.09.2026) — по три в ряд, портрет открывает карточку героя */
.shop-heroes{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:max-content; align-content:start; gap:8px; padding-top:6px; }
.shh-card{ display:grid; grid-template-columns:52px minmax(0,1fr); grid-template-rows:auto auto; gap:6px 8px; align-items:center;
padding:8px; border-radius:11px; border:1px solid #3a2c50; background:rgba(30,20,44,.5); min-width:0; }
.shh-card.got{ border-color:#3f7a52; background:rgba(20,45,30,.4); }
.shh-port{ width:52px; height:52px; cursor:pointer; }
.shh-info{ min-width:0; }
.shh-nm{ font-family:'Cinzel',serif; font-weight:800; font-size:13px; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.shh-cls{ font-size:10px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.shh-st{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4px; margin-top:3px; }
.shh-st span{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:11px; color:#ffd86a; white-space:nowrap; overflow:hidden; }
.shh-card .pack-buy, .shh-got{ grid-column:1 / -1; margin-top:0; }
.shh-got{ text-align:center; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px; color:#7ee0a0; padding:6px 2px;
border:1px solid #3f7a52; border-radius:8px; }
.shop-packs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:max-content; align-content:start; gap:10px 8px; padding-top:6px; }
.pack{ position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; padding:12px 8px 10px; border-radius:11px; border:1px solid #3a2c50; background:rgba(30,20,44,.5); }
.pack.best{ border-color:#e6c976; background:linear-gradient(180deg,rgba(202,164,76,.16),rgba(30,20,44,.5)); }
.pack-ic{ font-size:30px; line-height:1; }
.pack-ic.big{ font-size:40px; }
.pack-n{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--parchment); }
.pack-bonus{ color:#9be07a; font-size:10px; }
.pack-desc{ font-size:10px; color:var(--muted); line-height:1.25; min-height:26px; }
.pack-buy{ margin-top:2px; width:100%; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px; color:#e8dcc0; background:rgba(255,255,255,.06); border:1px solid #3a2c18; border-radius:8px; padding:6px 2px; cursor:pointer; }
.pack-buy.best{ color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border-color:#e6c976; }
.pack-buy:active{ transform:scale(.96); }
.pack-badge{ position:absolute; top:-8px; left:50%; transform:translateX(-50%); background:#2a6aa0; color:#dff0ff; font-size:9px; padding:1px 8px; border-radius:6px; white-space:nowrap; }
.pack-badge.best{ background:linear-gradient(90deg,#caa44c,#f0d060); color:#2a1410; }
/* ===== Древо арканов Таро (вкладка «Герои») ===== */
/* Набок: четыре клетки 2×2 — три ветки и Высшие арканы. Внутри клетки арканы стоят
В РЯД, стрелка между ними повёрнута вправо. .gt-cols раскрыт через display:contents,
чтобы его три ветки стали клетками общей сетки .god-tree. */
.god-tree{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:6px 9px; }
.gt-cols{ display:contents; }
/* колонки арканов — доли ширины (1fr), а не 88px гвоздями: на узком экране клетки ужимаются, а не вылезают */
.gt-col{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); justify-content:center; align-items:center; gap:1px 3px;
background:rgba(0,0,0,.2); border:1px solid #2e2444; border-radius:12px; padding:3px 4px; }
/* карточка аркана в древе ужата: четыре клетки должны влезать в окно без прокрутки */
.gt-col .god-node, .gt-hindu .god-node{ width:auto; min-width:0; max-width:88px; margin:0 auto; gap:1px; padding:3px 3px 4px; }
.god-tree .gn-port{ width:28px; height:28px; font-size:16px; }
.god-tree .gn-nm{ font-size:9.5px; min-height:11px; }
.god-tree .gn-arc{ font-size:7.5px; }
.god-tree .gn-bonus{ font-size:8.5px; }
.god-tree .gn-buy{ font-size:9px; padding:2px 2px; }
.god-tree .gn-tag{ font-size:8.5px; padding:1px 4px; }
.gt-title{ grid-column:1/-1; font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; color:var(--gc,#e6c976); text-align:center; line-height:1.1; display:flex; align-items:center; justify-content:center; }
.gt-bsub{ grid-column:1/-1; text-align:center; font-family:'JetBrains Mono',monospace; font-size:10px; color:#9be07a; }
.gt-bsub b{ color:#ffcf6a; }
.gt-arrow{ color:var(--gc,#6a5a8a); font-size:11px; line-height:1; transform:rotate(-90deg); } /* ▼ между арканами теперь смотрит вправо */
.god-node{ width:100%; display:flex; flex-direction:column; align-items:center; gap:2px; text-align:center; padding:6px 3px; border-radius:11px; border:1px solid #3a2c50; background:rgba(30,20,44,.5); }
.god-node.owned{ border-color:#4fb060; background:rgba(40,80,50,.22); }
.god-node.locked{ opacity:.45; }
.gn-port{ width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; line-height:1; background:radial-gradient(circle at 50% 35%, rgba(255,255,255,.12), rgba(0,0,0,.35)); border:2px solid var(--gc,#5a4a80); }
.god-node.owned .gn-port{ border-color:#4fb060; }
.gn-nm{ font-size:11px; font-weight:700; color:var(--parchment); line-height:1.05; min-height:14px; display:flex; align-items:center; }
.gn-arc{ font-size:8px; font-weight:600; letter-spacing:.3px; text-transform:uppercase; color:var(--gc,#9a8ac0); opacity:.85; line-height:1; margin-top:1px; }
.gn-bonus{ font-size:9px; color:#9be07a; }
.god-node{ cursor:pointer; }
/* Магазин: обложка-коллекция (вкладка «Герои») */
.shop-collections{ padding:8px 2px; }
.sc-card{ width:100%; display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center;
background:linear-gradient(165deg,#251c36,#160f22); border:1px solid #3c2e58; border-radius:16px; padding:20px 14px;
cursor:pointer; color:var(--parchment); font-family:inherit; }
.sc-card:active{ transform:scale(.99); }
.sc-ic{ font-size:48px; line-height:1.2; filter:drop-shadow(0 3px 7px rgba(0,0,0,.55)); }
.sc-nm{ font-size:18px; font-weight:800; color:#e9daff; letter-spacing:.5px; }
.sc-sub{ font-size:11px; color:#bcabe4; }
.sc-desc{ font-size:10.5px; color:var(--muted); line-height:1.45; max-width:280px; margin:3px 0; }
.sc-prog{ font-size:11.5px; color:var(--parchment); }
.sc-prog b{ color:#9be07a; }
.sc-open{ margin-top:8px; font-size:12px; font-weight:700; color:#08210f; background:linear-gradient(180deg,#ffd86a,#e0a93a);
border-radius:999px; padding:7px 18px; }
.hero-grid-back{ display:inline-flex; align-items:center; gap:4px; margin:0 0 5px; padding:4px 12px;
background:#231a30; border:1px solid #3c2e58; border-radius:999px; color:#cdbcec; font-size:12px; font-weight:700; cursor:pointer; font-family:inherit; }
.hero-grid-back:active{ transform:scale(.96); }
/* Детальная карточка аркана — лежит набок: слева портрет с именем, справа статы и описание */
.pop-window.arc-pop{ width:min(520px,94%); }
.arc-modal{ display:flex; gap:14px; align-items:stretch; text-align:center; }
.arc-left{ width:150px; flex:0 0 auto; display:flex; flex-direction:column; justify-content:center;
border-right:1px solid #3a2850; padding-right:12px; }
.arc-right{ flex:1; min-width:0; text-align:left; }
.arc-port{ width:64px; height:64px; margin:0 auto 6px; border-radius:50%; display:flex; align-items:center; justify-content:center;
font-size:34px; background:radial-gradient(circle at 50% 35%, rgba(255,255,255,.14), rgba(0,0,0,.4)); border:2px solid var(--gc,#5a4a80); }
.arc-nm{ font-size:17px; font-weight:800; color:var(--parchment); line-height:1.15; }
.arc-arc{ font-size:9px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#9a8ac0; margin-bottom:8px; }
.arc-rar{ font-size:10.5px; font-weight:700; line-height:1.35; }
.arc-give{ font-size:11.5px; color:var(--parchment); margin-top:7px; }
.arc-set{ font-size:10.5px; color:#c9a0ff; margin-top:4px; }
.arc-note{ font-size:9.5px; color:var(--muted); line-height:1.4; margin-top:7px; }
.arc-status{ font-size:12.5px; font-weight:700; margin-top:7px; }
.arc-modal .hm-stats{ width:100%; gap:6px; margin:0 0 4px; }
.arc-modal .hm-stat{ min-width:0; padding:6px 8px; font-size:11px; }
.arc-modal .hm-stat .lbl{ font-size:9px; }
.arc-modal .lcp-close{ margin-top:8px; }
/* Арканы в ростере «⚔ Герои» */
.arc-card{ border-color:#3c2e58 !important; }
.arc-card.owned{ border-color:#6a4ea0 !important; background:linear-gradient(135deg,var(--panel-light),rgba(150,110,224,.08)) !important; }
.arc-port-d{ display:flex; align-items:center; justify-content:center; font-size:26px; border-color:var(--gc,#5a4a80) !important; background:radial-gradient(circle at 50% 35%, rgba(255,255,255,.12), rgba(0,0,0,.4)); }
.gn-buy{ margin-top:2px; width:100%; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:10px; color:#1a1208; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-radius:7px; padding:4px 2px; cursor:pointer; }
.gn-buy:active{ transform:scale(.95); }
.gn-tag{ margin-top:2px; font-size:9px; padding:2px 5px; border-radius:6px; }
.gn-tag.own{ color:#9be07a; background:rgba(80,200,110,.12); }
.gn-tag.lock{ color:var(--muted); }
/* подпись про сет — общей строкой под всеми четырьмя клетками */
.gt-setnote{ grid-column:1/-1; font-size:9px; color:#cdbfe0; text-align:center; background:rgba(202,164,76,.08); border:1px solid #3a2c50; border-radius:9px; padding:4px 8px; margin:0; line-height:1.3; }
.gt-setnote b{ color:#ffcf6a; }
/* Высшие арканы — четвёртая клетка сетки (правая нижняя): заголовок сверху, арканы в ряд под ним */
.gt-hindu-head{ grid-column:2; grid-row:2; align-self:start; font-family:'Cinzel',serif; font-weight:800; font-size:11px; color:#e0a0ff; text-align:center; margin:0; padding-top:5px; }
.gt-hindu{ grid-column:2; grid-row:2; align-self:end; display:flex; align-items:center; justify-content:center; gap:3px; padding:0 4px 5px; }
.gt-hindu .god-node{ flex:1 1 0; min-width:0; max-width:88px; }
.gt-hindu .gt-arrow{ flex-shrink:0; transform:none; }
.shop-cur span{ white-space:nowrap; }
.sh-card{ display:flex; flex-direction:column; align-items:center; gap:3px; text-align:center; padding:7px 3px 6px; border-radius:10px; border:1px solid #3a2c50; background:rgba(30,20,44,.5); }
.sh-card.owned{ border-color:#4fb060; background:rgba(40,80,50,.22); }
.sh-card.locked{ opacity:.5; }
.sh-ic{ font-size:24px; line-height:1; }
.sh-nm{ font-size:10.5px; font-weight:700; color:var(--parchment); line-height:1.1; min-height:24px; display:flex; align-items:center; }
.sh-bonus{ font-size:9.5px; color:#9be07a; line-height:1.25; }
.sh-buy{ margin-top:3px; width:100%; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:11px; color:#1a1208; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-radius:7px; padding:5px 2px; cursor:pointer; }
.sh-buy:active{ transform:scale(.95); }
.sh-tag{ margin-top:3px; font-size:9.5px; padding:3px 6px; border-radius:6px; }
.sh-tag.own{ color:#9be07a; background:rgba(80,200,110,.12); }
.sh-tag.lock{ color:var(--muted); }
/* === Чат === */
.chat-btn{ position:absolute; right:12px; bottom:12px; z-index:24; width:46px; height:46px; border-radius:50%;
display:flex; align-items:center; justify-content:center; font-size:22px; cursor:pointer;
background:linear-gradient(180deg,#2a4a6a,#142838); border:2px solid #5a8ab0; box-shadow:0 0 14px rgba(90,138,176,.5); }
/* Столбик над чатом (15.09.2026, его слово): снизу чат, над ним настройки, над ними почта.
Квадратные значки одного размера с подарком и ускорением — 38px; окон у них пока нет. */
.settings-btn, .mail-btn{ position:absolute; right:16px; z-index:24; width:38px; height:38px; border-radius:10px; cursor:pointer;
display:flex; align-items:center; justify-content:center; font-size:17px; line-height:1; }
.settings-btn{ bottom:66px; background:linear-gradient(180deg,#3a3040,#1e1824); border:2px solid var(--muted); box-shadow:0 0 10px rgba(156,143,122,.3); }
.mail-btn{ bottom:112px; background:linear-gradient(180deg,#5a4410,#2a2008); border:2px solid var(--gold-bright); box-shadow:0 0 12px rgba(230,201,118,.4); }
.settings-btn:active, .mail-btn:active{ transform:scale(.92); }
.mail-btn .mb-badge{ position:absolute; top:-5px; right:-5px; min-width:16px; height:16px; border-radius:8px; background:var(--crimson); color:#fff; font-family:'JetBrains Mono',monospace; font-size:10px; align-items:center; justify-content:center; padding:0 3px; border:2px solid var(--bg); display:none; }
.mail-btn .mb-badge.show{ display:flex; }
/* Подсказка «скоро» у значков без окна — та же плашка, что и на Площади, только на сцене */
.stage-toast{ position:absolute; left:50%; bottom:14px; transform:translateX(-50%); z-index:26; max-width:90%; background:rgba(20,12,6,.94); border:1px solid var(--gold); border-radius:9px;
padding:8px 13px; text-align:center; font-size:11.5px; color:var(--parchment); box-shadow:0 4px 14px rgba(0,0,0,.5); pointer-events:none; }
.chat-btn:active{ transform:scale(.92); }
.chat-btn .cb-badge{ position:absolute; top:-3px; right:-3px; min-width:16px; height:16px; border-radius:8px; background:var(--crimson); color:#fff; font-family:'JetBrains Mono',monospace; font-size:10px; align-items:center; justify-content:center; padding:0 3px; display:none; }
.chat-btn .cb-badge.show{ display:flex; }
/* Чат набок: колонка у правого края во всю высоту, выезжает справа — за ней видно сцену боя */
.chat-panel{ position:absolute; top:0; right:0; bottom:0; z-index:70; width:min(320px,42%); background:linear-gradient(180deg,#16110b,#0e0a06); border-left:2px solid var(--gold);
transform:translateX(103%); visibility:hidden; transition:transform .28s ease, visibility 0s linear .28s; display:flex; flex-direction:column; box-shadow:-8px 0 24px rgba(0,0,0,.6); } /* закрытый чат невидим для фокуса и кликов — иначе Tab/клик в него сдвигал сцену */
.chat-panel.open{ transform:translateX(0); visibility:visible; transition:transform .28s ease, visibility 0s; }
.chat-head{ display:flex; align-items:center; padding:8px 10px; border-bottom:1px solid var(--border); }
.chat-tabs{ display:flex; gap:6px; flex:1; }
.chat-tab{ font-family:'Cinzel',serif; font-weight:700; font-size:12px; padding:5px 11px; border-radius:8px; cursor:pointer; background:var(--panel); border:1px solid var(--border); color:var(--muted); }
.chat-tab.active{ background:linear-gradient(180deg,var(--panel-light),#18120d); border-color:var(--gold); color:var(--gold-bright); }
.chat-close{ width:28px; height:28px; border-radius:7px; background:none; border:1px solid var(--border); color:var(--muted); cursor:pointer; }
.chat-msgs{ flex:1; overflow-y:auto; padding:10px; display:flex; flex-direction:column; gap:7px; }
.chat-msg{ font-size:12px; line-height:1.35; }
.chat-msg .cm-name{ font-weight:700; color:#7fb0e0; margin-right:5px; }
.chat-msg.clan .cm-name{ color:#9be07a; }
.chat-msg.me .cm-name{ color:var(--gold-bright); }
.chat-msg .cm-text{ color:var(--parchment); }
.chat-msg .cm-time{ float:right; font:600 9px 'JetBrains Mono',monospace; color:var(--muted); margin-left:6px; opacity:.7; } /* время сообщения (чат на сервере, 18.09.2026) */
.chat-input-row{ display:flex; gap:6px; padding:8px 10px; border-top:1px solid var(--border); background:rgba(0,0,0,.2); }
.chat-input{ flex:1; min-width:0; background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:8px 11px; color:var(--parchment); font-family:'Cinzel',serif; font-size:13px; outline:none; }
.chat-input:focus{ border-color:var(--gold); }
.chat-input::placeholder{ color:var(--muted); }
.chat-send{ width:44px; flex-shrink:0; border-radius:8px; background:linear-gradient(180deg,#2a4a6a,#142838); border:1px solid #5a8ab0; color:#cfe6ff; font-size:16px; cursor:pointer; }
.chat-send:active{ transform:scale(.93); }
/* ===== АРТЕФАКТЫ: кнопка на сцене + окно-витрина =====
Кнопка стоит в левом нижнем углу сцены, напротив чата. Счётчика урона
внизу больше нет (09.09.2026): урон и золото — в строке имени врага. */
.arti-btn{ position:absolute; left:12px; bottom:12px; z-index:24; width:48px; height:48px; border-radius:50%;
display:flex; align-items:center; justify-content:center; font-size:23px; line-height:1; cursor:pointer;
background:linear-gradient(180deg,#4a3417,#241706); border:2px solid var(--gold);
box-shadow:0 0 14px rgba(202,164,76,.45); }
.arti-btn:active{ transform:scale(.92); }
/* ЗАДАНИЯ (08.10.2026, 52-я): между премиумом и мешком, чуть больше артефактов (54 против 48), подпись как у премиума */
.quest-btn{ position:absolute; left:11px; top:74px; /* 100 → 74 (58-я): следом за поднятым Премиумом */ z-index:24; width:54px; padding:0; background:none; border:0; cursor:pointer;
display:flex; flex-direction:column; align-items:center; line-height:1; }
.quest-btn .qb-ic{ width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:26px;
background:linear-gradient(180deg,#4a3417,#241706); border:2px solid var(--gold); box-shadow:0 0 14px rgba(202,164,76,.45); }
.quest-btn .qb-lbl{ margin-top:-7px; padding:3px 6px 2px; border-radius:9px; background:rgba(12,8,16,.92); border:1px solid var(--gold);
color:#ffe6a0; font:800 8.5px 'Cinzel',serif; letter-spacing:.03em; white-space:nowrap; box-shadow:0 2px 6px rgba(0,0,0,.7); position:relative; }
.quest-btn:active .qb-ic{ transform:scale(.92); }
/* Окно: сверху витрина с подставками, снизу коллекция карточек. */
/* Высота по содержимому: пустой полосы под карточками нет, а когда артефактов
станет больше двадцати — окно упрётся в потолок и коллекция начнёт прокручиваться. */
.arti-modal{ width:min(760px,96%); max-height:min(340px,367px);
display:flex; flex-direction:column; text-align:left; padding:12px 14px; }
.arti-modal .pm-title{ margin-bottom:8px; flex-shrink:0; }
/* Витрина — тёмная ниша с золотой полкой понизу, как зал трофеев.
Места стоят лесенкой: главное в середине и выше всех (.p1), рядом второе
и третье (.p2), по краям четвёртое и пятое (.p3) — самые низкие. Все плиты
стоят на одной полке, поэтому разной делается только высота над ней. */
.arti-shelf{ flex-shrink:0; display:flex; align-items:flex-end; justify-content:center;
gap:4px; padding:3px 10px 5px; margin-bottom:6px; border-radius:12px; /* 12.09.2026: витрина ниже — карточкам нужна строка «что даёт сет» */
background:radial-gradient(120% 90% at 50% 0%, rgba(202,164,76,.16), transparent 70%),
linear-gradient(180deg,#231a12,#150f0a);
border:1px solid var(--border); border-bottom:2px solid var(--gold);
box-shadow:inset 0 8px 18px rgba(0,0,0,.55); }
.arti-slot{ position:relative; display:flex; flex-direction:column; align-items:center;
justify-content:flex-end; cursor:pointer; border-radius:10px; padding-top:2px;
transition:background .15s; }
.arti-slot:active{ transform:scale(.97); }
/* Выбранное место — золотая рамка и подсветка: сюда встанет следующий нажатый артефакт. */
.arti-slot.sel{ background:rgba(202,164,76,.16); outline:1.5px solid var(--gold-bright);
outline-offset:-1px; box-shadow:0 0 12px rgba(230,201,118,.4); }
.as-fig{ position:relative; display:flex; align-items:flex-end; justify-content:center; }
.as-lock{ line-height:1.15; opacity:.5; filter:grayscale(1); margin-bottom:2px; }
/* Артефакт на подставке. Его берут пальцем и тащат: в сторону — снять,
на другую подставку — переставить. touch-action:none, иначе жест уедет
в прокрутку страницы. */
/* user-select:none обязателен: иначе браузер считает значок текстом и на
потаскивании запускает СВОЁ перетаскивание, после которого отпускание
мыши до нас уже не доходит и артефакт залипает. */
.as-art{ line-height:1.15; margin-bottom:2px; color:var(--gold-bright);
cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-user-drag:none;
filter:drop-shadow(0 3px 5px rgba(0,0,0,.7)); }
.as-plinth{ display:block; margin-top:1px; filter:drop-shadow(0 3px 5px rgba(0,0,0,.6)); }
/* Место, над которым сейчас держат артефакт. */
.arti-slot.hot{ background:rgba(126,224,138,.18); outline:1.5px solid #7ee08a;
outline-offset:-1px; box-shadow:0 0 12px rgba(126,224,138,.45); }
/* «Призрак» — артефакт, который едет за пальцем. Сквозной для мыши, иначе
он сам оказывался бы под курсором и подставку под ним было бы не найти. */
.arti-ghost{ position:fixed; z-index:200; pointer-events:none; font-size:30px; line-height:1;
color:var(--gold-bright); opacity:0; transform:translate(-50%,-50%) scale(.8);
filter:drop-shadow(0 4px 8px rgba(0,0,0,.8)); transition:opacity .1s, transform .1s; }
.arti-ghost.act{ opacity:1; transform:translate(-50%,-50%) scale(1.15); }
/* Первое место: выше всех, плита двухступенчатая и подсвечена. */
.arti-slot.p1{ width:86px; }
.arti-slot.p1 .as-fig{ height:44px; }
.arti-slot.p1 .as-lock{ font-size:19px; }
.arti-slot.p1 .as-art{ font-size:29px; }
.arti-slot.p1 .as-plinth{ width:76px; height:40px;
filter:drop-shadow(0 3px 6px rgba(0,0,0,.65)) drop-shadow(0 0 9px rgba(230,201,118,.55)); }
/* Второе и третье — на ступеньку ниже. */
.arti-slot.p2{ width:74px; }
.arti-slot.p2 .as-fig{ height:36px; }
.arti-slot.p2 .as-lock{ font-size:17px; }
.arti-slot.p2 .as-art{ font-size:24px; }
.arti-slot.p2 .as-plinth{ width:64px; height:26px; }
/* Четвёртое и пятое — ещё ниже и уже. */
.arti-slot.p3{ width:64px; }
.arti-slot.p3 .as-fig{ height:28px; }
.arti-slot.p3 .as-lock{ font-size:15px; }
.arti-slot.p3 .as-art{ font-size:20px; }
.arti-slot.p3 .as-plinth{ width:54px; height:22px; }
/* Коллекция: два ряда, дальше — вправо прокруткой. Артефактов со временем будет
100+, поэтому карточки идут колонками и уезжают вбок, а не вниз.
Редкостей у артефактов нет — все карточки одинаковые, камень с золотым краем. */
.arti-grid{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(2,auto);
grid-auto-columns:94px; gap:6px; padding:3px 3px 6px; min-height:0; /* 12.09.2026: было 68 — на карточке появилась строка «что даёт сет» */
overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity;
scrollbar-width:thin; scrollbar-color:#6b5526 transparent; }
.arti-grid::-webkit-scrollbar{ height:4px; }
.arti-grid::-webkit-scrollbar-thumb{ background:#6b5526; border-radius:2px; }
.arti-grid::-webkit-scrollbar-track{ background:rgba(0,0,0,.25); border-radius:2px; }
/* touch-action:pan-x — вбок карточки листаются пальцем как обычно, а движение
вверх достаётся нам: так артефакт вытаскивают из коллекции на витрину. */
.arti-card{ position:relative; scroll-snap-align:start; cursor:grab; touch-action:pan-x;
user-select:none; -webkit-user-select:none; -webkit-user-drag:none;
border:1.5px solid #6b5526; border-radius:9px; padding:3px 3px 3px;
background:linear-gradient(180deg,#33291c,#1b140d);
display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:2px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 2px 5px rgba(0,0,0,.45); }
.arti-card:active{ transform:scale(.95); }
/* Цвет тут для знаков, у которых нет цветной эмодзи (анкх ☥) — на цветные он не влияет. */
.arti-card .ac-ic{ font-size:21px; line-height:1.1; color:var(--gold-bright); text-shadow:0 2px 4px rgba(0,0,0,.7); }
.arti-card .ac-nm{ font-size:9px; line-height:1.2; text-align:center; color:var(--parchment);
text-shadow:0 1px 2px rgba(0,0,0,.8); }
/* Сколько тотемов собрано. У несобранного — серым, у готового — золотом. */
.arti-card .ac-pg{ font-family:'JetBrains Mono',monospace; font-size:8px; line-height:1;
color:var(--muted); margin-top:1px; }
/* С кого падают тотемы — видно прямо на карточке, чтобы не открывать артефакт. */
.arti-card .ac-src{ font-size:7.5px; line-height:1; color:#9c8f7a; margin-top:1px;
max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.arti-card.ready .ac-src{ color:#c9a24a; }
.arti-card .ac-src i{ font-style:normal; color:#c07a3a; } /* режим коротко: ×3, ×5, соло */
/* Что даёт сет целиком — значками оружия (12.09.2026): 🗡️+20 🏹+40 🧪+100 */
.arti-card .ac-bn{ font-family:'JetBrains Mono',monospace; font-size:7px; letter-spacing:-.3px; line-height:1.1; color:#9be07a;
max-width:100%; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
/* Артефакт собран целиком — золотая рамка, его уже можно ставить на витрину. */
.arti-card.ready{ border-color:var(--gold-bright);
background:linear-gradient(180deg,#4a3a18,#241a0a);
box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 0 9px rgba(230,201,118,.35); }
.arti-card.ready .ac-pg{ color:var(--gold-bright); }
/* Несобранный значок приглушён — видно, что артефакт ещё не готов. */
.arti-card:not(.ready) .ac-ic{ opacity:.5; filter:grayscale(.7); }
/* Идёт удержание — полоска внизу карточки заполняется за ARTI_HOLD. */
.arti-card.hold::before{ content:''; position:absolute; left:3px; right:3px; bottom:2px; height:3px;
border-radius:2px; background:var(--gold-bright); transform-origin:left;
animation:artiHold 1.2s linear forwards; }
@keyframes artiHold{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
/* Артефакт уже стоит на витрине — галочка в углу, карточка приглушена. */
.arti-card.on{ border-color:#5fbf6a; box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 0 8px rgba(95,191,106,.35); }
.arti-card.on .ac-ic, .arti-card.on .ac-nm{ opacity:.45; }
.arti-card.on::after{ content:'✓'; position:absolute; top:1px; right:3px;
font-size:11px; font-weight:700; color:#7ee08a; text-shadow:0 1px 2px #000; }
/* ===== Окно одного артефакта: его тотемы =====
Тотемов бывает и три, и полсотни, поэтому сетка сама набирает столько
столбцов, сколько влезает, а лишнее прокручивается вниз. */
.totem-modal{ width:min(560px,94%); max-height:min(320px,367px);
display:flex; flex-direction:column; text-align:center; padding:12px 14px; }
.totem-modal .pm-title{ margin-bottom:4px; flex-shrink:0; }
.totem-sub{ flex-shrink:0; font-size:10.5px; line-height:1.4; color:var(--muted); margin-bottom:9px; }
.totem-sub b{ color:var(--gold-bright); }
.totem-sub .tm-ok{ color:#7ee08a; }
.totem-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(38px,1fr)); gap:5px;
overflow-y:auto; overflow-x:hidden; padding:3px; min-height:0; }
.totem-cell{ aspect-ratio:1; border-radius:8px; border:1.5px solid #3a2e20;
background:linear-gradient(180deg,#241d14,#15100a);
display:flex; align-items:center; justify-content:center; }
.totem-cell span{ font-size:17px; line-height:1.15; color:var(--muted);
opacity:.28; filter:grayscale(1); }
/* Тотем выбит с босса — цветной и в золотой рамке. */
.totem-cell.got{ border-color:var(--gold); background:linear-gradient(180deg,#4a3a18,#241a0a);
box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 0 7px rgba(202,164,76,.3); }
.totem-cell.got span{ opacity:1; filter:none; color:var(--gold-bright); }
/* Именные тотемы Отшельника (12.09.2026): под значком имя босса, ячейка чуть выше квадрата */
.totem-grid.named{ grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); } /* шире — под имя босса и его бонус */
.totem-cell.named{ aspect-ratio:auto; flex-direction:column; gap:1px; padding:4px 2px 3px; }
.totem-cell.named i{ font-style:normal; font-size:7.5px; line-height:1; color:var(--muted); max-width:100%;
overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.totem-cell.named.got i{ color:var(--gold-bright); }
/* что даёт именно этот тотем: 🗡️+3 🏹+6 🧪+15 (его слово: только у Отшельника) */
.totem-cell.named em{ font-style:normal; font-family:'JetBrains Mono',monospace; font-size:6.5px; letter-spacing:-.3px; line-height:1;
color:#7fb56a; white-space:nowrap; max-width:100%; overflow:hidden; }
.totem-cell.named.got em{ color:#9be07a; }
/* ===== Низкие экраны: высота 379px и меньше (740×360 и подобные) =====
Ширины трогать не надо — они уже в долях экрана. Ужимаем только то, что
перестаёт влезать по ВЫСОТЕ: древо арканов в магазине, календарь ежедневки
и карточки охоты. Всё остальное на 740×360 проверено и влезает как есть. */
@media (max-height:0px){ /* 74-я: кадр всегда 390 — низких экранов больше нет, правила выключены */
/* магазин: древо арканов — четыре клетки 2×2 и подпись про сет */
.god-tree{ gap:4px 8px; }
.god-tree .gn-port{ width:24px; height:24px; font-size:14px; }
.gt-col{ padding:2px 4px; }
.gt-col .god-node, .gt-hindu .god-node{ padding:2px 3px 3px; }
.gt-setnote{ font-size:8.5px; padding:2px 7px; line-height:1.25; }
.hero-grid-back{ margin-bottom:4px; padding:3px 11px; }
/* охота: шесть дел в две колонки без прокрутки */
.hunt-modal{ gap:6px; padding:10px; }
.hunt-body{ gap:6px; }
.deed-row{ padding:5px 9px; }
/* осада: строки-«дела» на узком экране (740): колонки уже, строка ниже */
.siege-row{ grid-template-columns:112px minmax(0,1fr) 150px; gap:8px; height:124px; padding:6px; }
.siege-attack{ font-size:9.5px; padding:4px 2px; }
.sr-right .siege-attack{ font-size:11px; padding:6px 2px; }
.srp-item{ font-size:9px; } .srp-item .srp-ic{ font-size:13px; }
.sr-medal{ width:24px; height:24px; font-size:12px; }
.sr-right{ padding-left:8px; }
.sr-stat{ font-size:11px; }
/* арена: пять отрядов должны влезать и на низком экране */
.ar-squad{ padding:3px 7px; }
.ar-cell{ max-width:38px; }
}
/* ===== Заглушка «поверни телефон» =====
Игра рассчитана только на горизонт. В портрете показываем этот экран поверх всего,
саму игру прячем — иначе она будет выглядеть криво. В горизонте заглушки нет вообще. */
.rotate-gate{ display:none; }
/* 74-я: его выбор Б — заглушка остаётся (iPhone в браузере экран не поворачивает; кадр набок он отверг). Android-ярлык и так лёжа. */
@media (orientation:portrait){
.app{ display:none; }
.rotate-gate{ position:fixed; inset:0; z-index:9999; display:flex; flex-direction:column;
align-items:center; justify-content:center; gap:14px; padding:32px 28px; text-align:center;
background:radial-gradient(circle at 50% 38%, #241a12, var(--bg)); color:var(--parchment); }
.rg-phone{ font-size:64px; line-height:1; animation:rgTurn 2.4s ease-in-out infinite; }
.rg-title{ font-family:'Cinzel',serif; font-weight:800; font-size:22px; letter-spacing:.04em; color:var(--gold-bright); }
.rg-sub{ font-size:13px; line-height:1.5; color:var(--muted); max-width:280px; }
@keyframes rgTurn{ 0%,55%{ transform:rotate(0deg); } 75%,100%{ transform:rotate(-90deg); } }
}
/* ===== ЗВАНИЯ 07.09.2026: 12 званий (Новобранец … Властелин), ключи из shared/formulas.js RANKS ===== */
.rarity-novice{color:#9c8f7a;}
.rarity-warrior{color:#8fd08a;}
.rarity-guard{color:#6fb3d9;}
.rarity-sergeant{color:#b97fe0;}
.rarity-foreman{color:#f0a060;}
.rarity-lieutenant{color:var(--gold-bright);}
.rarity-captain{color:#ff6a6a;}
.rarity-major{color:#3fe0d8;}
.rarity-colonel{color:#ff66cc;}
.rarity-marshal{color:#e8e8f0;}
.rarity-general{color:#c8ff60;}
.rarity-overlord{color:#ffd76a; text-shadow:0 0 6px rgba(255,215,106,.6);}
.hero-card.owned[data-rarity='warrior']{ border-color:rgba(143,208,138,0.7); }
.hero-card.owned[data-rarity='guard']{ border-color:rgba(111,179,217,0.7); }
.hero-card.owned[data-rarity='sergeant']{ border-color:rgba(185,127,224,0.7); }
.hero-card.owned[data-rarity='foreman']{ border-color:rgba(240,160,96,0.75); }
.hero-card.owned[data-rarity='lieutenant']{ border-color:rgba(202,164,76,0.85); }
.hero-card.owned[data-rarity='captain']{ border-color:rgba(255,90,90,0.8); }
.hero-card.owned[data-rarity='major']{ border-color:rgba(63,224,216,0.9); }
.hero-card.owned[data-rarity='colonel']{ border-color:rgba(255,102,204,0.95); }
.hero-card.owned[data-rarity='marshal']{ border-color:rgba(232,232,240,0.9); }
.hero-card.owned[data-rarity='general']{ border-color:rgba(200,255,96,0.9); }
.hero-card.owned[data-rarity='overlord']{ border-color:rgba(255,215,106,1); box-shadow:0 0 10px rgba(255,215,106,.35); }
.hero-portrait[data-r='warrior']{ border-color:#8fd08a; }
.hero-portrait[data-r='guard']{ border-color:#6fb3d9; }
.hero-portrait[data-r='sergeant']{ border-color:#b97fe0; }
.hero-portrait[data-r='foreman']{ border-color:#f0a060; }
.hero-portrait[data-r='lieutenant']{ border-color:var(--gold-bright); }
.hero-portrait[data-r='captain']{ border-color:#ff6a6a; box-shadow:0 0 8px rgba(255,80,80,.4),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='major']{ border-color:#3fe0d8; box-shadow:0 0 10px rgba(63,224,216,.55),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='colonel']{ border-color:#ff66cc; box-shadow:0 0 12px rgba(255,102,204,.65),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='marshal']{ border-color:#e8e8f0; box-shadow:0 0 12px rgba(232,232,240,.6),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='general']{ border-color:#c8ff60; box-shadow:0 0 12px rgba(200,255,96,.6),inset 0 0 8px rgba(0,0,0,.5); }
.hero-portrait[data-r='overlord']{ border-color:#ffd76a; box-shadow:0 0 14px rgba(255,215,106,.8),inset 0 0 8px rgba(0,0,0,.5); }
/* Мощь героя (07.09.2026): сумма боевых статов возле портрета — на карточке и в окне героя */
.hero-portrait-wrap{ display:flex; flex-direction:column; align-items:center; gap:3px; flex-shrink:0; }
.hero-pow{ font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--gold-bright); background:rgba(0,0,0,.45); border:1px solid var(--border); border-radius:5px; padding:0 5px; line-height:15px; white-space:nowrap; }
.hm-pow{ width:max-content; margin:-4px auto 6px; }
/* ===== ПЛОЩАДЬ (14.09.2026) — хаб вместо Охоты, макет П2 «Сцена» ===== */
/* Окно того же размера, что осада; внутри только картинка на всю площадь и кнопки поверх неё. */
.pl-modal{ width:min(830px,96%); height:min(348px,367px); max-height:367px; padding:0; overflow:hidden; text-align:left; }
.pl-modal .modal-close{ z-index:5; background:rgba(20,12,6,.75); color:var(--gold-bright); border-color:#8a6a3a; }
.pl-scene{ position:absolute; inset:0; background:linear-gradient(180deg,#1a1330 0%,#3a1d3a 35%,#8a4a2a 62%,#c8965a 63%,#a8783e 100%); }
.pl-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:fill; display:none; }
.pl-scene.img .pl-img{ display:block; }
.pl-title{ position:absolute; left:12px; top:8px; z-index:4; font-family:'Cinzel',serif; font-weight:800; font-size:13px; letter-spacing:.14em; text-transform:uppercase;
color:var(--gold-bright); padding:4px 12px; border-radius:8px; background:rgba(20,12,6,.72); border:1px solid #8a6a3a; text-shadow:0 1px 3px #000; }
/* Кнопка = круг ровно по нарисованному на картинке значку (--x/--y — центр в процентах) + подпись под ним. */
.pl-spot{ position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); z-index:3; width:54px; height:54px; padding:0; margin:0;
border-radius:50%; border:2px solid transparent; background:none; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.pl-spot:hover, .pl-spot:active{ border-color:var(--gold-bright); box-shadow:0 0 14px rgba(230,201,118,.7); }
.pl-spot:active{ transform:translate(-50%,-50%) scale(.94); }
/* Пока картинки нет — эмодзи-значок в золотом медальоне; с картинкой медальон прячется, значок уже нарисован. */
.pl-ic{ position:absolute; inset:0; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px;
background:radial-gradient(circle at 40% 35%,#4a3a22,#1c150e); border:2px solid #caa44c; box-shadow:0 0 10px rgba(230,201,118,.5); }
.pl-scene.img .pl-ic{ display:none; }
.pl-nm{ position:absolute; left:50%; top:100%; transform:translateX(-50%); margin-top:2px; white-space:nowrap; font-family:'Cinzel',serif; font-weight:800; font-size:11px; letter-spacing:.05em;
color:#f0e0b0; padding:3px 9px 2px; border-radius:6px; background:linear-gradient(180deg,#3a2410,#1c120a); border:1px solid var(--gold); box-shadow:0 3px 6px rgba(0,0,0,.5); }
.pl-badge{ position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--crimson-bright); color:#fff;
font-family:'JetBrains Mono',monospace; font-weight:700; font-size:10px; display:none; align-items:center; justify-content:center; border:2px solid #18120d; box-shadow:0 0 6px rgba(211,65,90,.7); }
.pl-badge.show{ display:flex; }
.pl-toast{ position:absolute; left:50%; bottom:14px; transform:translateX(-50%); z-index:6; max-width:90%; background:rgba(20,12,6,.94); border:1px solid var(--gold); border-radius:9px;
padding:8px 13px; text-align:center; font-size:11.5px; color:var(--parchment); box-shadow:0 4px 14px rgba(0,0,0,.5); }
/* ===== ИГРЫ (05.10.2026) — окно с геймпада Площади, картинка «Папирусы»: зона нажатия = весь свиток, подпись у его низа ===== */
.ig-spot{ width:124px; height:208px; border-radius:12px; }
.ig-spot .pl-nm{ top:auto; bottom:-8px; }
.ig-spot.on .pl-nm{ color:#1a1208; background:linear-gradient(180deg,#ffe08a,#c89a3a); border-color:#ffeeb0; }
.ig-spot:not(.on) .pl-nm{ color:var(--muted); }
.ig-scene.img .ig-spot .pl-ic{ display:none; }
/* ===== ЗАЛ СЛАВЫ (14.09.2026) — окно топов по макету С1 «Стела» ===== */
.hall-modal .siege-head{ align-items:center; }
.hall-sub{ margin-left:auto; font-size:10.5px; color:var(--muted); white-space:nowrap; padding-bottom:6px; }
.hall-sub b{ color:var(--gold-bright); font-family:'JetBrains Mono',monospace; }
.hall-body{ flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 200px; gap:10px; padding-top:8px; }
/* Каменная стела: имена «высечены» на камне, зубчатая кромка сверху, своя строка прибита снизу */
.hall-stela{ position:relative; min-height:0; border-radius:14px 14px 6px 6px; border:2px solid #8a6a3a; padding:10px 8px 46px;
background:linear-gradient(180deg,#5a4a30,#3a2c1a 30%,#2a2014); box-shadow:inset 0 0 30px rgba(0,0,0,.5); overflow:hidden; display:flex; flex-direction:column; }
.hall-stela::before{ content:''; position:absolute; left:0; right:0; top:0; height:12px; background:repeating-linear-gradient(90deg,#caa44c 0 3px,transparent 3px 9px); opacity:.35; pointer-events:none; }
.hall-stela::after{ content:''; position:absolute; left:0; right:0; bottom:44px; height:20px; background:linear-gradient(180deg,transparent,#2a2014); pointer-events:none; }
.hall-list{ flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:4px; padding-right:2px; }
.hall-list::-webkit-scrollbar{ width:4px; } .hall-list::-webkit-scrollbar-thumb{ background:#8a6a3a; border-radius:2px; }
/* Строка В6 (15.09.2026, его вариант): выше, ID под ником, аватар и плашка крупнее — пять строк на стеле. */
.hall-row{ display:flex; align-items:center; gap:10px; padding:4px 10px; border-radius:8px; border:1px solid rgba(202,164,76,.25); background:rgba(0,0,0,.25); min-height:40px; flex-shrink:0; }
.hall-row.me{ border-color:var(--gold-bright); background:linear-gradient(90deg,#4a3a1a,rgba(0,0,0,.25)); box-shadow:0 0 8px rgba(230,201,118,.25); }
.hall-rk{ width:26px; text-align:center; font:700 12px 'JetBrains Mono',monospace; color:var(--muted); flex-shrink:0; }
.hall-rk.m1{ color:#ffd76a; } .hall-rk.m2{ color:#d6e0ee; } .hall-rk.m3{ color:#e0a060; }
.hall-av{ width:32px; height:32px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#4a3a5a,#1c1524); border:1px solid #8a6a3a; display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0; }
.hall-nm{ flex:0 1 auto; min-width:0; cursor:pointer; display:flex; flex-direction:column; gap:1px; line-height:1.15; font-size:12.5px; font-weight:700; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hall-nm small{ font-weight:400; color:var(--muted); font-family:'JetBrains Mono',monospace; font-size:10px; }
.hall-tag{ width:76px; height:30px; border-radius:7px; display:inline-flex; align-items:center; justify-content:center; font:700 12px 'Inter',sans-serif; flex-shrink:0; border:1px solid transparent; background:transparent; color:#e9e9e9; }
.hall-tag.fr{ background:#3a3a3a; border-color:#555; }
.hall-tag.wait{ background:#1c1c1c; border-color:#3a3a3a; }
.hall-tag.add{ background:linear-gradient(180deg,#8ee0a0,#37a85a); border-color:#2c8048; color:#08210f; font-size:17px; font-weight:800; cursor:pointer; }
.hall-tag.add[disabled]{ opacity:.5; cursor:default; }
.hall-val{ margin-left:auto; font:700 13px 'JetBrains Mono',monospace; color:var(--gold-bright); white-space:nowrap; }
/* 29.09.2026: имя больше не тянется на всю строку — карточку открывает само имя, остальная строка выбирает игрока (главные достижения справа) */
.hall-val i{ font-style:normal; color:#ffd76a; font-size:10px; margin-right:3px; }
.hall-me{ position:absolute; left:8px; right:8px; bottom:8px; }
.hall-empty{ padding:28px 12px; text-align:center; font-size:11px; color:var(--muted); line-height:1.5; }
/* Правая колонка — место под достижения игрока (пока пустые слоты, его слово 14.09.2026) */
.hall-side{ min-height:0; }
.hall-ach{ height:100%; border-radius:10px; border:1px solid var(--border); background:#140f0a; padding:8px 10px; display:flex; flex-direction:column; }
.hall-k{ font-family:'Cinzel',serif; font-weight:800; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); text-align:center; }
.hall-ach-grid{ flex:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; align-content:center; padding:4px 6px; }
.hall-ach-grid span{ width:40px; height:40px; margin:auto; border-radius:50%; border:2px dashed #5a4a30; background:rgba(0,0,0,.25); }
.hall-ach-note{ text-align:center; font-size:10px; color:#6a5e4a; }
/* ГЛАВНЫЕ ДОСТИЖЕНИЯ (29.09.2026, его выбор «Папирус» без печатей): кто выбран, свиток со строками «Яд ······ 2K» */
.hall-ach{ gap:6px; }
.hall-ach .hall-k{ letter-spacing:.06em; white-space:nowrap; }
.hall-who{ display:flex; align-items:center; gap:7px; min-width:0; }
.hall-who > div{ min-width:0; }
.hall-who b{ display:block; font:800 12px 'Cinzel',serif; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hall-who small{ font:400 9px 'JetBrains Mono',monospace; color:var(--muted); }
.hall-pa{ flex:1; min-height:0; margin:3px 2px; border-radius:8px; background:linear-gradient(180deg,#e8d8b0,#cdb488); color:#2a1c0c; padding:8px 10px;
display:flex; flex-direction:column; justify-content:space-between; box-shadow:inset 0 0 14px rgba(90,64,32,.45); position:relative; }
.hall-pa::before, .hall-pa::after{ content:''; position:absolute; left:-3px; right:-3px; height:7px; border-radius:4px; background:linear-gradient(90deg,#5a4020,#8a6a3a,#5a4020); }
.hall-pa::before{ top:-3px; } .hall-pa::after{ bottom:-3px; }
.hall-pr{ display:flex; align-items:center; gap:5px; font-size:11px; font-weight:700; min-width:0; }
.hall-pr .ic{ font-size:14px; width:18px; text-align:center; flex-shrink:0; }
.hall-pr .dots{ flex:1; min-width:6px; border-bottom:1px dotted #8a6a3a; transform:translateY(-3px); }
.hall-pr .val{ font:800 11px 'JetBrains Mono',monospace; flex-shrink:0; }
.hall-pr.lo{ opacity:.45; }
.hall-row[data-hsel]:not([data-hsel=""]){ cursor:pointer; }
.hall-row.sel{ border-color:var(--gold); background:linear-gradient(90deg,#4a3814,rgba(0,0,0,.25)); box-shadow:0 0 10px rgba(230,201,118,.3); }
/* Доска «кто бил» (15.09.2026): ID под именем */
.bb-id{ font-family:'JetBrains Mono',monospace; font-size:8.5px; color:var(--muted); font-weight:400; margin-left:4px; }
/* ===== ПОЧТА (15.09.2026) — окно по строю Hustle Castle, макет maket-pochta2.html =====
Слева столбик из трёх значков с подписями и счётчиками, в середине список с датами и стрелкой на
выбранное, справа свиток с валиками (награда, новость) или переписка (Почта, вид Ч1). Окно 830×348. */
.ml-modal{ background:radial-gradient(ellipse at 50% 30%,#2a2118,#15110d 70%); }
/* 18.09.2026: «Написать» из карточки игрока, открытой поверх Клана / Зала славы / Лиги / Друзей / Настроек / топа урона,
открывало Почту ПОД этим окном (z 61 и раньше в DOM) — казалось, что кнопка не работает. Почта выше всех окон
со списками игроков (74), ниже карточки игрока (76) и всплывашек (80). */
#mailModal{ z-index:75; } #mailBackdrop{ z-index:74; }
.ml-title{ position:absolute; left:0; right:0; top:8px; text-align:center; font-family:'Cinzel',serif; font-weight:900; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:#f0e0b0; text-shadow:0 2px 6px #000; pointer-events:none; }
.ml-modal .modal-close{ z-index:5; background:linear-gradient(180deg,#e06070,#a8293f); color:#fff; border:2px solid #5a0f1c; border-radius:50%; width:28px; height:28px; font-weight:900; }
.ml-side{ position:absolute; left:0; top:24px; bottom:0; width:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.ml-it{ display:flex; flex-direction:column; align-items:center; gap:2px; width:88px; padding:5px 4px; border-radius:12px; border:1px solid transparent; background:none; cursor:pointer; position:relative; opacity:.7; }
.ml-it b{ width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:22px; background:#1f1812; border:1px solid var(--border); }
.ml-it span{ font-family:'Cinzel',serif; font-weight:800; font-size:10.5px; color:var(--parchment); text-shadow:0 1px 3px #000; }
.ml-it.on{ opacity:1; border-color:var(--gold); background:linear-gradient(180deg,#3d2f1a,#2a2012); }
.ml-it.on b{ border-color:var(--gold-bright); box-shadow:0 0 12px rgba(230,201,118,.4); }
.ml-it .bd{ position:absolute; top:1px; right:12px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--crimson-bright); color:#fff; font:700 9.5px 'JetBrains Mono',monospace; display:none; align-items:center; justify-content:center; border:2px solid var(--bg); }
.ml-it .bd.show{ display:flex; }
.ml-it.pochta b{ background:linear-gradient(180deg,#2a4a6a,#142838); }
.ml-it.nagrady b{ background:linear-gradient(180deg,#5a4410,#2a2008); }
.ml-it.novosti b{ background:linear-gradient(180deg,#3a2858,#241634); }
.ml-rule{ position:absolute; left:100px; width:206px; height:1px; background:linear-gradient(90deg,transparent,#8a6a3a,transparent); }
.ml-rule.t{ top:38px; } .ml-rule.b{ bottom:24px; }
.ml-mid{ position:absolute; left:106px; top:46px; bottom:30px; width:206px; padding-right:10px; display:flex; flex-direction:column; gap:5px; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; }
.ml-mid::-webkit-scrollbar{ width:0; }
.ml-li{ position:relative; border-radius:9px; border:1px solid var(--border); background:var(--panel); padding:5px 9px; display:flex; flex-direction:column; gap:1px; flex-shrink:0; cursor:pointer; text-align:left; width:100%; color:inherit; font:inherit; }
.ml-li .h{ font-size:11px; font-weight:700; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-right:16px; }
.ml-li .d{ font:700 9px 'JetBrains Mono',monospace; color:var(--muted); }
.ml-li .p{ font-size:9px; color:#c8b088; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ml-li.on{ background:linear-gradient(180deg,#3d2f1a,#2a2012); border-color:var(--gold-bright); }
.ml-li.on::after{ content:''; position:absolute; right:-8px; top:50%; transform:translateY(-50%); border-left:8px solid var(--gold-bright); border-top:7px solid transparent; border-bottom:7px solid transparent; }
.ml-li.new::before{ content:''; position:absolute; left:-1px; top:7px; bottom:7px; width:3px; border-radius:2px; background:var(--crimson-bright); }
.ml-li .ic{ position:absolute; right:7px; top:5px; font-size:12px; }
.ml-li .dot{ position:absolute; right:7px; top:7px; width:7px; height:7px; border-radius:50%; background:var(--crimson-bright); }
.ml-li .row{ display:flex; align-items:center; gap:6px; }
.ml-li .av{ width:24px; height:24px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#4a3a5a,#1c1524); border:1px solid #8a6a3a; display:flex; align-items:center; justify-content:center; font-size:12px; flex-shrink:0; }
.ml-li .nm{ flex:1; min-width:0; }
.ml-li.compose .h{ color:var(--gold-bright); }
.ml-foot{ position:absolute; left:106px; width:196px; bottom:6px; font-size:8.5px; color:#6a5e4a; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ml-right{ position:absolute; left:322px; right:12px; top:42px; bottom:20px; }
/* свиток */
.ml-scroll{ position:absolute; inset:0; }
.ml-rod{ position:absolute; left:-7px; right:-7px; height:11px; border-radius:6px; background:linear-gradient(180deg,#f0d060,#8a6a3a); box-shadow:0 2px 4px rgba(0,0,0,.5); z-index:2; }
.ml-rod.t{ top:-5px; } .ml-rod.b{ bottom:-5px; }
.ml-rod::before, .ml-rod::after{ content:''; position:absolute; top:-3px; width:16px; height:16px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#f0d060,#8a6a3a); }
.ml-rod::before{ left:-5px; } .ml-rod::after{ right:-5px; }
.ml-pap{ position:absolute; inset:0; border-radius:6px; background:linear-gradient(160deg,#eedcb0,#dcc48e 60%,#cdb27a); color:#3a2410; padding:12px 14px 10px; display:flex; flex-direction:column; gap:5px; overflow:hidden; border:2px solid #8a6a3a; }
.ml-pap::after{ content:''; position:absolute; inset:0; background:repeating-linear-gradient(0deg,rgba(90,60,20,.05) 0 1px,transparent 1px 4px); pointer-events:none; }
.ml-pap > *{ position:relative; z-index:1; }
.ml-pap .h{ font-family:'Cinzel',serif; font-weight:900; font-size:12.5px; color:#2a1410; text-align:center; }
.ml-pap .from{ font-size:9.5px; color:#7a5a2a; text-align:center; }
.ml-pap .from b{ color:#3a2410; }
.ml-pap .p{ font-size:10.5px; line-height:1.45; color:#3a2410; text-align:center; overflow:auto; }
.ml-pap .img{ height:80px; flex-shrink:0; border-radius:8px; border:2px solid #8a6a3a; background:linear-gradient(135deg,#7a4a1a,#c8862a 40%,#2a4a6a 70%,#1c1524); display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; font-weight:900; font-size:13px; color:#f0e0b0; text-shadow:0 2px 6px #000; }
.ml-pap .seal{ position:absolute; right:10px; top:8px; width:32px; height:32px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#d3415a,#7a1a2a); border:2px solid #5a0f1c; display:flex; align-items:center; justify-content:center; font-size:14px; box-shadow:0 2px 6px rgba(0,0,0,.4); }
.ml-pap .tm{ position:absolute; left:10px; top:8px; font-size:9px; color:#8a3a1a; }
.ml-rw{ display:flex; gap:7px; justify-content:center; flex-wrap:wrap; }
.ml-rw span{ font:700 10.5px 'JetBrains Mono',monospace; color:#5a3a14; padding:3px 8px; border-radius:8px; border:1px solid #c8a86a; background:#fff8e6; white-space:nowrap; }
.ml-done{ text-align:center; font-weight:700; font-size:10.5px; color:#2c8048; }
.ml-pap .acts{ margin-top:auto; display:flex; gap:7px; justify-content:center; flex-wrap:wrap; }
.ml-b{ font:700 10.5px 'Inter',sans-serif; padding:6px 14px; border-radius:8px; border:1px solid var(--gold); background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; white-space:nowrap; cursor:pointer; }
.ml-b.paper{ background:linear-gradient(180deg,#fff8e6,#e8d8b0); border-color:#8a6a3a; color:#3a2410; }
.ml-b.bl{ background:linear-gradient(180deg,#2a4a6a,#142838); border-color:#5a8ab0; color:#cfe6ff; }
.ml-b.gr{ background:#2a2118; border-color:var(--border); color:var(--muted); }
.ml-b:active{ transform:scale(.96); }
.ml-field{ width:100%; padding:6px 9px; border-radius:8px; border:2px solid #8a6a3a; background:#fff8e6; font:400 10.5px 'Inter',sans-serif; color:#3a2410; outline:none; }
.ml-field::placeholder{ color:#b09a70; }
.ml-field.ta{ flex:1; min-height:70px; resize:none; font-family:'Inter',sans-serif; }
.ml-field.mono{ font:700 11px 'JetBrains Mono',monospace; }
.ml-to{ display:flex; gap:6px; align-items:center; }
.ml-to .ml-field{ flex:1; }
/* переписка (Ч1) */
.ml-chat{ position:absolute; inset:0; border-radius:10px; border:1px solid #8a6a3a; background:#1a1410; display:flex; flex-direction:column; overflow:hidden; }
.ml-chat .hd{ display:flex; align-items:center; gap:8px; padding:5px 9px; background:linear-gradient(180deg,#3d2f1a,#2a2012); border-bottom:1px solid #8a6a3a; flex-shrink:0; }
.ml-chat .hd .av{ width:28px; height:28px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#4a3a5a,#1c1524); border:1px solid #8a6a3a; display:flex; align-items:center; justify-content:center; font-size:14px; position:relative; flex-shrink:0; }
.ml-chat .hd .av.on::after{ content:''; position:absolute; right:-1px; bottom:-1px; width:8px; height:8px; border-radius:50%; background:#5ad07a; border:2px solid #1a1410; }
.ml-chat .who{ font-size:11.5px; font-weight:700; color:#f0e0b0; }
.ml-chat .who small{ font-weight:400; color:var(--muted); font-size:9px; margin-left:5px; font-family:'JetBrains Mono',monospace; }
.ml-chat .st{ font-size:9px; color:#7fe0a0; }
.ml-chat .st.off{ color:var(--muted); }
.ml-chat .hd .sp{ flex:1; }
.ml-chat .msgs{ flex:1; min-height:0; display:flex; flex-direction:column; gap:4px; padding:7px 9px; overflow-y:auto; scrollbar-width:none; }
.ml-chat .msgs::-webkit-scrollbar{ width:0; }
.ml-day{ align-self:center; font:700 8.5px 'JetBrains Mono',monospace; color:#6a5e4a; padding:2px 8px; border-radius:999px; border:1px solid var(--border); flex-shrink:0; }
.ml-msg{ max-width:76%; padding:4px 8px 3px; border-radius:10px 10px 10px 3px; font-size:10.5px; line-height:1.35; color:var(--parchment); background:var(--panel-light); border:1px solid var(--border); align-self:flex-start; flex-shrink:0; }
.ml-msg.me{ align-self:flex-end; border-radius:10px 10px 3px 10px; background:linear-gradient(180deg,#3d2f1a,#2a2012); border-color:#8a6a3a; }
.ml-msg .t{ display:block; text-align:right; margin-top:1px; font:700 8px 'JetBrains Mono',monospace; color:var(--muted); }
.ml-msg.me .t{ color:#c8b088; }
.ml-msg.me .t::after{ content:' ✓✓'; color:#7fe0a0; }
.ml-chat .inp{ display:flex; gap:6px; align-items:center; padding:6px 7px; border-top:1px solid var(--border); background:var(--bg); flex-shrink:0; }
.ml-chat .inp input{ flex:1; padding:7px 10px; border-radius:8px; border:1px solid var(--border); background:#0e0a06; font:400 10.5px 'Inter',sans-serif; color:var(--parchment); outline:none; min-width:0; }
.ml-chat .inp input::placeholder{ color:#6a5e4a; }
.ml-toast{ position:absolute; left:50%; bottom:30px; transform:translateX(-50%); z-index:6; max-width:80%; background:rgba(20,12,6,.94); border:1px solid var(--gold); border-radius:9px;
padding:8px 13px; text-align:center; font-size:11px; color:var(--parchment); box-shadow:0 4px 14px rgba(0,0,0,.5); pointer-events:none; }
/* ===== ПРОФИЛЬ ИГРОКА (16.09.2026, его выбор: макет 2 без закладок, client/maket-profil.html?v=2) =====
Окно 700×346 поверх игры (меньше и уже, чем окна на весь экран), без подписи сверху, крестик над героями.
Слева карточка игрока, справа герои и витрина, кнопки внизу справа. */
#profileModal{ z-index:74; } #profileBackdrop{ z-index:73; }
.profile-modal{ width:min(700px,92%); height:min(358px,359px); max-height:359px; padding:0; text-align:left;
background:radial-gradient(ellipse at 50% 30%,#2a2118,#15110d 70%); border-color:var(--gold); box-shadow:0 0 0 1px #3a2e20,0 12px 32px rgba(0,0,0,.6); }
.profile-modal .modal-close{ top:8px; right:8px; width:30px; height:30px; border-radius:50%; z-index:5; color:#fff; font-weight:900;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; box-shadow:0 2px 6px rgba(0,0,0,.5); }
.pf-body{ position:absolute; inset:0; }
.pf-empty{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:20px; color:var(--muted); font-family:'Cinzel',serif; font-size:13px; line-height:1.6; }
.pf-none{ color:var(--muted); font-size:11px; line-height:1.4; align-self:center; }
/* карточка слева */
.pf-card{ position:absolute; left:14px; top:14px; width:222px; bottom:14px; border-radius:12px; border:1px solid var(--gold); padding:10px 12px;
background:linear-gradient(180deg,rgba(42,33,24,.9),rgba(21,17,13,.9)); box-shadow:0 0 0 1px #3a2e20,0 8px 24px rgba(0,0,0,.5);
display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; overflow:hidden; }
.pf-ava{ width:84px; height:84px; border-radius:14px; border:3px solid var(--gold); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:40px; text-shadow:0 3px 8px #000;
background:radial-gradient(circle at 40% 30%,var(--l,#6a8ad0),var(--d,#101830) 75%); box-shadow:0 0 0 2px #3a2e20,0 0 18px rgba(230,201,118,.35),inset 0 0 20px rgba(0,0,0,.6); }
.pf-ava.round{ border-radius:50%; }
.pf-avw{ position:relative; flex-shrink:0; }
.pf-avw.me{ cursor:pointer; }
.pf-on{ position:absolute; left:2px; bottom:2px; width:12px; height:12px; border-radius:50%; background:#5ad07a; border:2px solid var(--bg); }
.pf-ed{ position:absolute; right:-6px; bottom:-6px; width:24px; height:24px; border-radius:50%; background:linear-gradient(180deg,#f0d060,#caa44c); border:2px solid var(--bg); font-size:12px; display:flex; align-items:center; justify-content:center; color:#2a1410; }
.pf-name{ flex-shrink:0; font:900 16px 'Cinzel',serif; color:#f0e0b0; text-shadow:0 2px 6px #000; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; display:flex; align-items:center; gap:6px; }
.pf-edn{ width:20px; height:20px; border-radius:50%; border:1px solid #8a6a3a; background:#1f1812; color:var(--gold-bright); font-size:11px; cursor:pointer; padding:0; flex-shrink:0; }
.pf-id{ font:700 13px 'JetBrains Mono',monospace; color:#c8b088; padding:3px 9px; border-radius:7px; border:1px solid #8a6a3a; background:#1f1812; cursor:pointer; display:inline-flex; align-items:center; gap:4px; }
.pf-id i{ font-style:normal; color:var(--gold-bright); }
.pf-id:active{ transform:scale(.96); }
.pf-clan{ font-size:11px; font-weight:700; color:var(--parchment); }
.pf-clan.muted{ color:var(--muted); font-weight:400; }
.pf-rule{ width:100%; height:1px; background:linear-gradient(90deg,transparent,#8a6a3a,transparent); }
.pf-stats{ width:100%; display:flex; flex-direction:column; gap:4px; }
.pf-stat{ display:flex; align-items:center; gap:7px; font-size:11px; color:#c8b088; white-space:nowrap; }
.pf-stat .ic{ width:18px; text-align:center; font-size:13px; }
.pf-stat b{ margin-left:auto; font:700 11.5px 'JetBrains Mono',monospace; color:#f0e0b0; }
/* правая часть */
.pf-panel{ position:absolute; left:250px; right:14px; border-radius:12px; border:1px solid #8a6a3a; padding:10px 12px; display:flex; flex-direction:column; gap:8px;
background:linear-gradient(180deg,rgba(42,33,24,.9),rgba(21,17,13,.9)); }
.pf-heroes{ top:44px; height:126px; }
.pf-artis{ top:178px; bottom:50px; }
.pf-body .pf-heroes{ height:136px; } /* 29.09.2026: в окне профиля портреты 60, медальоны 52 (его слово «герои и артефакты чуть больше») */
.pf-body .pf-artis{ top:188px; }
.pf-body .pf-hp, .pf-body .pf-hp .hero-portrait, .pf-body .pf-hp svg,
.st-pane .pf-hp, .st-pane .pf-hp .hero-portrait, .st-pane .pf-hp svg{ width:56px; height:56px; } /* Настройки — как окно (его слово 29.09.2026) */
.pf-body .pf-am, .st-pane .pf-am{ width:48px; height:48px; font-size:23px; }
.pf-body .pf-hero, .st-pane .pf-hero{ gap:5px; } /* плашка «ур.» не наезжает на имя */
.pf-body .pf-stats, .st-pane .pf-stats{ gap:3px; }
.pf-body .pf-stat, .st-pane .pf-stat{ font-size:12px; } .pf-body .pf-stat b, .st-pane .pf-stat b{ font-size:12.5px; } .pf-body .pf-stat .ic, .st-pane .pf-stat .ic{ font-size:14px; }
.pf-hd{ font:800 10.5px 'Cinzel',serif; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-bright); display:flex; align-items:center; gap:8px; }
.pf-hd::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,#8a6a3a,transparent); }
.pf-row{ display:flex; gap:8px; min-height:0; }
.pf-hero{ display:flex; flex-direction:column; align-items:center; gap:3px; width:70px; }
.pf-hp{ position:relative; width:56px; height:56px; border-radius:10px; overflow:visible; }
.pf-hp .hero-portrait, .pf-hp svg{ width:56px; height:56px; border-radius:10px; }
.pf-lv{ position:absolute; left:-4px; bottom:-6px; font:700 8.5px 'JetBrains Mono',monospace; padding:1px 5px; border-radius:6px; background:var(--bg); border:1px solid var(--gold); color:#f0e0b0; white-space:nowrap; }
.pf-hn{ font-size:9.5px; font-weight:700; color:var(--parchment); text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:70px; flex-shrink:0; }
.pf-pw{ font:700 9.5px 'JetBrains Mono',monospace; color:var(--gold-bright); }
.pf-arti{ display:flex; flex-direction:column; align-items:center; gap:2px; width:70px; }
.pf-am{ width:46px; height:46px; border-radius:50%; border:2px solid var(--gold); background:radial-gradient(circle at 40% 30%,#5a4410,#1a1206 75%); display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 0 10px rgba(230,201,118,.25); }
.pf-arti.solo .pf-am{ border-color:#9fd0ff; background:radial-gradient(circle at 40% 30%,#2a4a6a,#0c1620 75%); box-shadow:0 0 10px rgba(159,208,255,.3); }
.pf-an{ font-size:9.5px; font-weight:700; color:var(--parchment); }
/* кнопки внизу справа */
.pf-acts{ position:absolute; left:250px; right:14px; bottom:12px; display:flex; gap:6px; justify-content:flex-end; align-items:center; flex-wrap:wrap; }
.pf-btn{ font:700 11px 'Inter',sans-serif; padding:7px 14px; border-radius:8px; border:1px solid var(--gold); background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; white-space:nowrap; display:inline-flex; align-items:center; gap:5px; cursor:pointer; }
.pf-btn.bl{ background:linear-gradient(180deg,#2a4a6a,#142838); border-color:#5a8ab0; color:#cfe6ff; }
.pf-btn.gr{ background:#2a2118; border-color:#3a2e20; color:var(--muted); }
.pf-btn.rd{ background:linear-gradient(180deg,#5a1a24,#3a0c14); border-color:var(--crimson); color:#f0b0b8; }
.pf-btn.gn{ background:linear-gradient(180deg,#2c6a40,#1a3a26); border-color:#5ad07a; color:#c8ffd8; }
.pf-btn.sm{ padding:5px 10px; font-size:10px; }
.pf-btn:disabled{ opacity:.5; cursor:default; }
.pf-btn:active:not(:disabled){ transform:scale(.96); }
.pf-tag{ font:700 10.5px 'Inter',sans-serif; padding:6px 12px; border-radius:8px; border:1px solid #3a2e20; background:#1f1812; color:var(--muted); white-space:nowrap; }
.pf-tag.fr{ color:#9be07a; border-color:#2c6a40; }
.pf-tag.wait{ color:var(--gold-bright); border-color:#5a4410; }
/* формы в карточке: смена имени, выбор аватара (только свой) */
.pf-form{ width:100%; display:flex; flex-direction:column; gap:6px; align-items:stretch; }
.pf-fh{ font:800 10.5px 'Cinzel',serif; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-bright); }
.pf-fh.small{ font:400 10px 'Inter',sans-serif; text-transform:none; letter-spacing:0; color:var(--muted); line-height:1.4; }
.pf-fe{ font-size:10.5px; color:#ff9a80; line-height:1.4; }
.pf-nerr{ position:absolute; left:50%; transform:translateX(-50%); bottom:106px; font-size:10px; white-space:nowrap; padding:3px 10px; border-radius:7px; background:rgba(21,17,13,.95); border:1px solid var(--crimson); pointer-events:none; z-index:2; }
.st-pane .pf-nerr{ bottom:58px; }
.pf-form input{ width:100%; font:700 13px 'Inter',sans-serif; color:#f0e0b0; padding:7px 9px; border-radius:8px; border:1px solid #8a6a3a; background:#1f1812; outline:none; text-align:center; }
.pf-form input:focus{ border-color:var(--gold-bright); }
.pf-fa{ display:flex; gap:6px; justify-content:center; margin-top:2px; }
.pf-avs{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.pf-avc{ width:56px; height:56px; border-radius:50%; border:3px solid #3a2e20; font-size:26px; cursor:pointer; text-shadow:0 3px 8px #000; padding:0;
background:radial-gradient(circle at 40% 30%,var(--l),var(--d) 75%); box-shadow:inset 0 0 14px rgba(0,0,0,.6); }
.pf-avc.sel{ border-color:var(--gold-bright); box-shadow:0 0 14px rgba(230,201,118,.5),inset 0 0 14px rgba(0,0,0,.6); }
.pf-avc:active{ transform:scale(.94); }
/* ===== ЗАМЕТКА ИГРОКА — СВИТОК ВНИЗУ ПРОФИЛЯ (16.09.2026, его выбор: client/maket-zametka.html?v=4) =====
Полоса-папирус во всю ширину под карточкой и панелями; у себя — карандаш ✎ и ввод на месте (до NOTE_MAX знаков,
счётчик, «Сохранить»/«Отмена»), у чужого — только текст. Пока свитка нет (чужой без заметки) — старая раскладка.
Когда свиток есть (.pf-note на хосте), карточка и панели укорочены, аватар и портреты чуть мельче. */
.pf-scroll{ position:absolute; left:14px; right:14px; bottom:60px; height:42px; border-radius:10px; padding:5px 12px 5px 14px; display:flex; align-items:center; gap:10px;
background:linear-gradient(180deg,#d8c39a,#c2a878); border:1px solid #8a6a3a; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 4px 12px rgba(0,0,0,.45); color:#2a1c0c; }
.pf-scroll::before, .pf-scroll::after{ content:''; position:absolute; top:-3px; bottom:-3px; width:9px; border-radius:5px; background:linear-gradient(180deg,#8a6a3a,#5a4020); box-shadow:0 2px 6px rgba(0,0,0,.5); }
.pf-scroll::before{ left:-4px; } .pf-scroll::after{ right:-4px; }
.pf-scroll .q{ font:900 26px 'Cinzel',serif; color:#8a6a3a; line-height:1; flex-shrink:0; }
.pf-scroll .pf-nt{ flex:1; min-width:0; font:600 11.5px 'Inter',sans-serif; line-height:1.4; color:#2a1c0c; white-space:pre-wrap; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
.pf-scroll .pf-nt.empty{ color:#6a5a40; font-style:italic; font-weight:400; }
.pf-scroll .pf-npen{ width:22px; height:22px; border-radius:50%; border:1px solid #8a6a3a; background:#f0e0b0; color:#5a4020; font-size:11px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; cursor:pointer; padding:0; }
.pf-scroll .pf-npen:active{ transform:scale(.94); }
.pf-scroll textarea{ flex:1; min-width:0; height:32px; resize:none; font:600 11px 'Inter',sans-serif; line-height:1.35; color:#2a1c0c; padding:3px 7px; border-radius:7px; border:1px solid #8a6a3a; background:#f4e8c8; outline:none; }
.pf-scroll textarea:focus{ border-color:#5a4020; }
.pf-scroll .pf-ncnt{ font:700 10px 'JetBrains Mono',monospace; color:#5a4020; flex-shrink:0; }
.pf-scroll .pf-ncnt.over{ color:#a8293f; }
.pf-scroll .pf-btn{ flex-shrink:0; }
/* раскладка со свитком (29.09.2026, его слово: «о себе — справа вверху над героями, компактно; профиль — до низу; герои,
артефакты и профиль чуть больше»; в Настройках — «как новое, красиво»). Свиток — полоса справа вверху, карточка слева
на всю высоту (без ужатия), под свитком герои, ниже артефакты. В окне свиток кончается до крестика; у себя кнопок нет —
артефакты до низа. */
.pf-body .pf-scroll, .st-pane .pf-scroll{ top:12px; bottom:auto; height:54px; padding:4px 10px 4px 12px; gap:8px; } /* 29.09.2026: выше — «больше места для описания», три строки */
.pf-body .pf-scroll{ left:250px; right:50px; }
.st-pane .pf-scroll{ left:208px; right:4px; top:0; }
.pf-body .pf-scroll .q, .st-pane .pf-scroll .q{ font-size:22px; }
.pf-body .pf-scroll .pf-nt, .st-pane .pf-scroll .pf-nt{ font-size:11px; line-height:1.3; -webkit-line-clamp:3; }
.pf-body .pf-scroll textarea, .st-pane .pf-scroll textarea{ height:44px; font-size:10.5px; }
.pf-body .pf-scroll .pf-btn.sm, .st-pane .pf-scroll .pf-btn.sm{ padding:4px 8px; }
.pf-body .pf-nerr{ top:70px; bottom:auto; }
.st-pane .pf-nerr{ top:58px; bottom:auto; }
.pf-body.pf-note .pf-heroes{ top:74px; height:130px; }
.pf-body.pf-note .pf-artis{ top:212px; bottom:50px; }
.pf-body.pf-note.pf-me .pf-artis{ bottom:14px; }
.st-pane.pf-note .pf-heroes{ top:62px; height:130px; }
.st-pane.pf-note .pf-artis{ top:200px; bottom:0; }
.pf-note .pf-hn, .pf-note .pf-pw, .pf-note .pf-an{ flex-shrink:0; }
/* ===== КОРОТКАЯ КАРТОЧКА ИГРОКА (16.09.2026, макет 10 с его правками) =====
440×274 поверх игры: аватар, имя, крупный ID, клан-заглушка, три цифры, пять героев, «Подробнее» и три кнопки. */
#playerCard{ z-index:76; } #cardBackdrop{ z-index:75; }
.player-card{ width:min(440px,92%); height:min(330px,359px); /* 25.09.2026: 274 → 330 — после строк «Иероглифы» и «Достижений» героям не хватало места, налезали на кнопки */
max-height:359px; padding:0; text-align:left; border-color:var(--gold);
background:linear-gradient(180deg,rgba(42,33,24,.97),rgba(21,17,13,.97)); box-shadow:0 0 0 1px #3a2e20,0 12px 32px rgba(0,0,0,.6); }
.pc-body{ position:absolute; inset:0; padding:12px; display:flex; flex-direction:column; gap:8px; }
.pc-head{ display:flex; align-items:center; gap:12px; }
.pc-head .pf-ava{ width:56px; height:56px; font-size:26px; border-width:2px; }
.pc-who{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; align-items:flex-start; }
.pc-who .pf-name{ font-size:15px; }
.pc-x{ width:24px; height:24px; border-radius:50%; border:2px solid #5a0f1c; background:linear-gradient(180deg,#e06070,#a8293f); color:#fff; font-weight:900; font-size:12px; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; align-self:flex-start; }
/* К3 «Список 2×2» (его выбор 18.09.2026): слева значок и подпись, справа число — длинная Слава соседей не толкает */
.pc-stats{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:5px 12px; }
.pc-st{ display:flex; align-items:center; gap:7px; padding:4px 8px; border-radius:8px; background:rgba(255,255,255,.04); min-width:0; }
.pc-st i{ font-style:normal; font-size:14px; width:18px; text-align:center; }
.pc-st span{ flex:1; font-size:10.5px; color:#c8b088; white-space:nowrap; }
.pc-st b{ font:800 12.5px 'JetBrains Mono',monospace; color:#f0e0b0; font-variant-numeric:tabular-nums; white-space:nowrap; }
.pc-heroes{ display:flex; justify-content:space-between; gap:6px; flex:1; min-height:0; align-items:flex-start; }
.pc-acts{ margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:6px; flex-wrap:wrap; }
.pc-acts .r{ display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
[data-pcard]:not([data-pcard=""]){ cursor:pointer; }
[data-pcard]:not([data-pcard=""]):active{ opacity:.7; }
/* ===== НАСТРОЙКИ (16.09.2026, его выбор: строй 1 «Столбик», client/maket-nastroyki.html?v=1) =====
Окно с полями (не на весь экран, не до краёв), слева столбик значков, справа лист. Свой профиль — тут. */
#settingsModal{ z-index:72; } #settingsBackdrop{ z-index:71; }
.settings-modal{ width:min(784px,93%); height:min(362px,363px); max-height:363px; padding:0; text-align:left; border-color:var(--gold);
background:radial-gradient(ellipse at 50% 30%,#2a2118,#15110d 70%); box-shadow:0 0 0 1px #3a2e20,0 12px 32px rgba(0,0,0,.6); }
.settings-modal .modal-close{ top:8px; right:10px; width:30px; height:30px; border-radius:50%; z-index:5; color:#fff; font-weight:900;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; box-shadow:0 2px 6px rgba(0,0,0,.5); }
.st-ttl{ position:absolute; left:0; right:0; top:10px; text-align:center; font:900 15px 'Cinzel',serif; letter-spacing:.12em; text-transform:uppercase; color:#f0e0b0; text-shadow:0 2px 6px #000; pointer-events:none; }
.st-side{ position:absolute; left:0; top:0; bottom:0; width:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding-top:22px; }
.st-it{ display:flex; flex-direction:column; align-items:center; gap:3px; width:88px; padding:4px; border-radius:12px; border:1px solid transparent; opacity:.7; background:none; cursor:pointer; }
.st-it b{ width:34px; height:34px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:18px; background:#1f1812; border:1px solid var(--border); }
.st-it span{ font:800 9.5px 'Cinzel',serif; color:var(--parchment); text-shadow:0 1px 3px #000; text-align:center; }
.st-it.on{ opacity:1; border-color:var(--gold); background:linear-gradient(180deg,#3d2f1a,#2a2012); }
.st-it.on b{ border-color:var(--gold-bright); box-shadow:0 0 12px rgba(230,201,118,.4); }
.st-pane{ position:absolute; left:106px; right:12px; top:40px; bottom:12px; }
.st-soon{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; color:var(--muted); font-family:'Cinzel',serif; font-size:13px; line-height:1.6; padding:20px; }
/* профиль внутри настроек: та же разметка .pf-*, только теснее */
.st-pane .pf-card{ left:0; top:0; bottom:0; width:196px; padding:8px 10px; gap:4px; }
.st-pane .pf-ava{ width:64px; height:64px; font-size:30px; }
.st-pane .pf-name{ font-size:14px; }
.st-pane .pf-panel{ left:208px; right:0; }
.st-pane .pf-heroes{ top:0; height:136px; }
.st-pane .pf-artis{ top:144px; bottom:0; }
.st-pane .pf-acts{ display:none; }
/* язык: список */
.st-lang{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:10px; border:1px solid var(--border); background:#1f1812; }
.st-lang .fl{ font:800 11px 'JetBrains Mono',monospace; color:var(--muted); width:24px; }
.st-lang b{ flex:1; font:800 11.5px 'Cinzel',serif; color:#f0e0b0; }
.st-lang .chk{ width:20px; height:20px; border-radius:50%; border:2px solid #8a6a3a; display:flex; align-items:center; justify-content:center; font-size:11px; color:#2a1410; }
.st-lang.on{ border-color:var(--gold); background:linear-gradient(180deg,#3d2f1a,#2a2012); }
.st-lang.on .chk{ background:linear-gradient(180deg,#f0d060,#caa44c); border-color:var(--gold-bright); }
.st-lang.dis{ opacity:.5; }
.st-tag{ font-size:9px; font-weight:700; color:var(--muted); border:1px solid var(--border); border-radius:6px; padding:2px 6px; }
.st-list{ position:absolute; inset:0; display:flex; flex-direction:column; gap:6px; }
.st-note{ font-size:10px; color:var(--muted); line-height:1.4; margin-top:auto; }
/* настройки → чёрный список (7.2) */
.bl-wrap{ position:absolute; inset:0; display:flex; flex-direction:column; gap:8px; }
.bl-head{ display:flex; align-items:center; gap:10px; }
.bl-head .pf-hd{ flex:1; }
.bl-search{ width:220px; }
.bl-list{ flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:5px; }
.bl-row{ display:flex; align-items:center; gap:10px; padding:6px 10px; border-radius:10px; border:1px solid var(--border); background:#1f1812; flex-shrink:0; }
.bl-row .pf-ava.sm{ width:34px; height:34px; font-size:16px; border-width:2px; border-radius:50%; }
.bl-nm{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.bl-nm b{ font:900 12px 'Cinzel',serif; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bl-nm small{ font:700 10px 'JetBrains Mono',monospace; color:var(--muted); }
.bl-when{ font-size:10px; color:var(--muted); white-space:nowrap; }
.bl-more{ align-self:center; margin-top:2px; }
.bl-foot{ font-size:10px; color:var(--muted); }
/* ===== ВХОД С ДРУГОГО УСТРОЙСТВА (16.09.2026) ===== */
.kick-screen{ position:absolute; inset:0; z-index:200; background:rgba(0,0,0,.78); display:none; align-items:center; justify-content:center; }
.kick-screen.show{ display:flex; }
.kick-box{ width:min(360px,90%); border-radius:14px; border:1px solid var(--gold); background:radial-gradient(ellipse at 50% 30%,#2a2118,#15110d 70%); padding:16px 18px; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; box-shadow:0 12px 32px rgba(0,0,0,.6); }
.kick-ic{ font-size:30px; }
.kick-text{ font-size:11px; color:#c8b088; line-height:1.5; }
.kick-text b{ color:#f0e0b0; }
.kick-note{ font-size:10px; color:var(--muted); }
/* настройки → перенос (7.3) */
.tr-wrap{ position:absolute; inset:0; display:flex; gap:12px; }
.tr-col{ flex:1; border-radius:12px; border:1px solid var(--border); background:linear-gradient(180deg,rgba(42,33,24,.9),rgba(21,17,13,.9)); padding:10px 12px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; }
.tr-col.gold{ border-color:var(--gold); }
.tr-col .pf-hd{ width:100%; }
.tr-txt{ font-size:10px; color:var(--muted); line-height:1.4; }
.tr-code{ font:700 24px 'JetBrains Mono',monospace; letter-spacing:.16em; color:#f0e0b0; padding:8px 14px; border-radius:10px; border:1px solid var(--gold); background:#1f1812; text-shadow:0 2px 6px #000; }
.tr-timer{ font:700 11px 'JetBrains Mono',monospace; color:var(--gold-bright); }
.tr-in{ width:180px; font:700 18px 'JetBrains Mono',monospace; letter-spacing:.12em; text-align:center; color:#f0e0b0; padding:7px 10px; border-radius:10px; border:1px solid #8a6a3a; background:#1f1812; outline:none; text-transform:uppercase; }
.tr-in:focus{ border-color:var(--gold-bright); }
.tr-err{ font-size:10.5px; color:#ff9a80; }
.tr-acc{ flex:1; border-radius:12px; border:1px solid #8a6a3a; background:linear-gradient(180deg,rgba(42,33,24,.9),rgba(21,17,13,.9)); padding:10px; display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.tr-acc.on{ border-color:var(--gold); box-shadow:0 0 14px rgba(230,201,118,.25); }
.tr-acc b{ font:900 13px 'Cinzel',serif; color:#f0e0b0; }
.tr-acc .l{ font-size:10px; color:#c8b088; line-height:1.5; }
.tr-acc .pf-ava{ width:48px; height:48px; font-size:22px; border-width:2px; border-radius:50%; }
/* ===== КЛАНЫ И ХРАМЫ В ИГРЕ (17.09.2026, js/21-clan.js) =====
Окно — как «Друзья» (siege-modal: закладки сверху, лист, подвал). Экраны по его макетам:
папирус входа (В4), шапка и таблица воинов (К1 «По Hustle»), список храмов (С4),
дерево Б с подачей П1, карточка алтаря, создание на папирусе. */
.clan-modal{ width:min(790px,96%); height:min(330px,367px); } /* «совсем чуть меньше» осадного — его слово 17.09.2026 */
.clan-modal.sm{ width:min(600px,96%); height:min(310px,367px); } /* список Храмов и алтарь — без пустых полей по бокам (его слово 17.09.2026) */
.cl-body{ overflow-y:auto; overflow-x:hidden; padding-right:4px; position:relative; }
.cl-foot{ gap:8px; }
.cl-foot .muted{ color:var(--muted); }
.cl-foot-btn{ margin-left:auto; font:800 10.5px 'Cinzel',serif; padding:5px 10px; border-radius:8px; border:1px solid #8a6a3a; background:linear-gradient(180deg,#3d2f1a,#2a2012); color:var(--gold-bright); cursor:pointer; white-space:nowrap; }
.cl-foot-btn + .cl-foot-btn{ margin-left:0; }
.cl-foot-btn.danger{ border-color:#7a3540; background:linear-gradient(180deg,#5a2630,#2a1218); color:#ffb0b8; }
.cl-foot-btn.gold{ background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; border-color:var(--gold); }
.cl-mini{ font:700 10px 'Inter',sans-serif; padding:4px 9px; border-radius:7px; border:1px solid #5a4a30; background:#241c14; color:var(--gold-bright); cursor:pointer; white-space:nowrap; }
.cl-mini.ok{ background:linear-gradient(90deg,#2e5a48,#3a7a5e); border-color:#4a9a76; color:#eafff4; }
.cl-mini:disabled{ opacity:.45; cursor:not-allowed; }
/* --- папирус входа (В4) --- */
.clp-wrap{ height:100%; display:flex; align-items:center; justify-content:center; }
.clp-papyrus{ width:min(560px,96%); padding:22px 26px; border-radius:12px; background:linear-gradient(180deg,#d9c79a,#c9b384); color:#2a1a0a; box-shadow:inset 0 0 40px rgba(90,60,20,.35), 0 8px 24px rgba(0,0,0,.5); text-align:center; position:relative; }
.clp-papyrus:before, .clp-papyrus:after{ content:''; position:absolute; left:0; right:0; height:9px; background:linear-gradient(180deg,#8a6a3a,#5a3a18); }
.clp-papyrus:before{ top:0; border-radius:12px 12px 0 0; } .clp-papyrus:after{ bottom:0; border-radius:0 0 12px 12px; }
.clp-t{ font:900 18px 'Cinzel',serif; letter-spacing:.06em; color:#3a2410; }
.clp-s{ font-size:12.5px; color:#5a3a10; margin:6px 0 14px; }
.clp-btns{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.clp-btn{ font:800 11.5px 'Cinzel',serif; padding:9px 16px; border-radius:9px; border:1px solid #8a6a3a; background:rgba(255,250,235,.55); color:#3a2410; cursor:pointer; }
.clp-btn.gold{ background:linear-gradient(180deg,#f0d060,#caa44c); border-color:#8a6a3a; }
.clp-req{ margin-top:12px; font-size:11px; color:#5a3a10; display:flex; align-items:center; justify-content:center; gap:8px; }
.clp-x{ border:1px solid #8a6a3a; background:none; color:#7a2a2a; border-radius:6px; cursor:pointer; font-size:11px; padding:1px 6px; }
/* --- шапка клана (К1) --- */
.clh{ display:flex; align-items:flex-start; gap:12px; padding:8px 10px; border-radius:11px; border:1px solid var(--gold); background:linear-gradient(90deg,#3a2a14,#1a1208); margin-bottom:8px; }
.clh-info{ flex:1; min-width:0; }
.clh-name{ font:900 15px 'Cinzel',serif; color:#f0e0b0; }
.clh-sub{ font-size:10px; color:var(--muted); margin-top:2px; }
.clh-desc{ font-size:11px; color:var(--parchment); margin-top:4px; white-space:pre-wrap; }
.clh-desc .muted{ color:var(--muted); }
/* Ш1 «Лента плиток» (его выбор 18.09.2026): шапка в два яруса, снизу четыре плитки с крупными полными числами */
.clh{ display:block; }
.clh-top{ display:flex; align-items:center; gap:12px; }
.clh-tiles{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-top:8px; }
.clh-tile{ border:1px solid #4a3a28; border-radius:9px; background:rgba(0,0,0,.28); padding:5px 8px; display:flex; align-items:center; gap:8px; min-width:0; }
.clh-tile i{ font-style:normal; font-size:16px; flex:0 0 auto; }
.clh-tile b{ display:block; font:800 13px 'JetBrains Mono',monospace; color:var(--gold-bright); font-variant-numeric:tabular-nums; line-height:1.1; white-space:nowrap; }
.clh-tile small{ font-size:8.5px; color:var(--muted); white-space:nowrap; }
.cl-topsw{ display:flex; gap:4px; margin:0 0 8px; }
/* В3 «Список + карточка» (25.09.2026, его выбор; макет client/maket-klan-poisk.html, карточка А «Знамя») */
.cl3{ flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 356px; gap:10px; }
.cl3-lst{ display:flex; flex-direction:column; min-height:0; min-width:0; }
.cl3-lst .cl-find-top, .cl3-lst .cl-topsw{ margin-bottom:6px; flex:0 0 auto; }
.cl3-scroll{ flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; padding-right:4px; }
.cl3-scroll::-webkit-scrollbar{ width:4px; } .cl3-scroll::-webkit-scrollbar-thumb{ background:#8a6a3a; border-radius:2px; } /* как у списков друзей и Зала славы */
.cl3-row{ display:flex; align-items:center; gap:8px; padding:5px 8px; margin-bottom:4px; border-radius:9px; cursor:pointer;
background:rgba(30,22,40,.55); border:1px solid #2c2438; }
.cl3-row:hover{ border-color:var(--gold); }
.cl3-row.sel{ border-color:var(--gold-bright); background:rgba(202,164,76,.13); }
.cl3-rk{ width:22px; flex:0 0 auto; text-align:center; font:900 13px 'Cinzel',serif; color:var(--muted); }
.cl3-rk.m1{ color:#ffd84a; text-shadow:0 0 8px rgba(255,216,74,.6); } .cl3-rk.m2{ color:#d8dce4; } .cl3-rk.m3{ color:#d8905a; }
.cl3-nm{ flex:1; min-width:0; font-weight:700; font-size:12.5px; color:#f0e6d2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cl3-val{ flex:0 0 auto; max-width:96px; font:700 12px 'JetBrains Mono',monospace; color:#ffe08a; white-space:nowrap; overflow:hidden; text-align:right; }
.cl3-card{ min-height:0; border-radius:13px; overflow:hidden; display:flex; flex-direction:column; background:#17110d;
border:1px solid color-mix(in srgb, var(--ec) 75%, #000); box-shadow:0 0 16px color-mix(in srgb, var(--ec) 30%, transparent); }
.cl3-card.empty{ border-color:#2c2438; box-shadow:none; background:rgba(30,22,40,.35); }
.cl3-ban{ flex:0 0 auto; display:flex; gap:11px; align-items:center; padding:6px 11px;
background:linear-gradient(115deg, color-mix(in srgb, var(--ec) 55%, #140c1c), color-mix(in srgb, var(--ec) 12%, #17110d) 75%);
border-bottom:1px solid color-mix(in srgb, var(--ec) 55%, #000); }
.cl3-who{ min-width:0; }
.cl3-name{ font:800 17px 'Cinzel',serif; color:#fff4da; text-shadow:0 1px 4px #000; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cl3-pill{ display:inline-block; font:700 10.5px system-ui,sans-serif; padding:2px 8px; border-radius:20px; margin:4px 4px 0 0; white-space:nowrap; }
.cl3-pill.ok{ background:rgba(155,224,122,.14); border:1px solid rgba(155,224,122,.5); color:#b8f09a; }
.cl3-pill.no{ background:rgba(255,138,138,.12); border:1px solid rgba(255,138,138,.5); color:#ffb0b0; }
.cl3-pill.nt{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); color:#e0d4bc; }
.cl3-in{ flex:1; min-height:0; display:flex; flex-direction:column; gap:6px; padding:7px 11px 8px; }
.cl3-ds{ flex:0 0 auto; font-size:11.5px; line-height:1.35; color:#e6d8b8; padding:4px 9px; border-left:3px solid var(--gold);
background:rgba(202,164,76,.07); border-radius:0 7px 7px 0; overflow-wrap:anywhere; }
.cl3-ds.none{ color:#7a6e5c; font-style:italic; }
.cl3-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 12px; }
.cl3-ln{ display:flex; align-items:center; gap:6px; padding:2px 0; border-bottom:1px solid rgba(255,255,255,.06); min-width:0; }
.cl3-ln i{ font-style:normal; width:18px; text-align:center; font-size:13px; flex:0 0 auto; }
.cl3-ln span{ flex:0 0 auto; font-size:11px; color:#b8a888; white-space:nowrap; }
.cl3-ln b{ flex:1; min-width:0; text-align:right; font:700 12.5px 'JetBrains Mono',monospace; color:#fff0c8; white-space:nowrap; overflow:hidden; }
.cl3-ln.lead b{ font:700 11.5px system-ui,sans-serif; color:#e6c976; text-overflow:ellipsis; }
.cl3-foot{ display:flex; align-items:center; gap:8px; margin-top:auto; }
.cl3-more{ flex:0 0 auto; font:700 11px system-ui,sans-serif; color:var(--gold-bright); padding:8px 10px; border-radius:10px; border:1px solid #5a4a30;
background:rgba(0,0,0,.3); white-space:nowrap; cursor:pointer; }
.cl3-btn{ flex:1; min-width:0; text-align:center; font:800 13px 'Cinzel',serif; padding:8px; border-radius:10px; cursor:pointer; white-space:nowrap;
background:linear-gradient(180deg,#f6da6a,#c89a3a); color:#2a1410; border:1px solid #ffe08a; box-shadow:0 2px 8px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.4); }
.cl3-btn.off{ cursor:default; background:#2a2218; color:#9c8f7a; border-color:#4a3a28; box-shadow:none; }
.cl3-btn2{ flex:0 0 auto; font:800 11px 'Cinzel',serif; padding:8px 10px; border-radius:10px; cursor:pointer; border:1px solid #7a3540;
background:linear-gradient(180deg,#5a2630,#2a1218); color:#ffb0b8; }
.cl-topsw span{ font:800 10px 'Cinzel',serif; padding:5px 12px; border-radius:8px; border:1px solid #5a4a30; background:#1f1812; color:var(--muted); cursor:pointer; }
.cl-topsw span.on{ background:linear-gradient(180deg,#3d2f1a,#2a2012); color:var(--gold-bright); border-color:var(--gold); }
/* Кнопка «Храмы» в шапке клана — на месте ячейки «очков храмов» (его правка 17.09.2026) */
.clh-temples{ align-self:stretch; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-width:104px; padding:4px 12px; border-radius:11px;
border:1px solid #e8c464; background:linear-gradient(180deg,#8a6a2a,#4a3414 60%,#2c2010); color:#fff2c8; font:900 14px 'Cinzel',serif; letter-spacing:.04em; cursor:pointer;
box-shadow:0 0 0 1px #2a1e0c, 0 0 16px rgba(232,196,100,.4), inset 0 1px 0 rgba(255,240,200,.35); text-shadow:0 1px 0 #000; }
.clh-temples i{ font-style:normal; font-size:24px; line-height:1; filter:drop-shadow(0 0 5px rgba(255,220,120,.9)); }
.clh-temples small{ font:700 9px/1 'JetBrains Mono',monospace; color:var(--gold-bright); letter-spacing:0; }
.clh-temples:active{ transform:scale(.97); }
/* --- таблица воинов --- */
.clm-head, .clm-row{ display:grid; grid-template-columns:minmax(0,2.2fr) minmax(0,1fr) minmax(0,.7fr) minmax(0,1.2fr) minmax(0,1fr); gap:6px; align-items:center; font-size:11px; }
.clm-head{ padding:0 10px 4px; font:800 9px 'Cinzel',serif; color:var(--gold-bright); text-transform:uppercase; letter-spacing:.04em; }
.clm-list{ display:flex; flex-direction:column; gap:3px; }
.clm-row{ padding:4px 10px; border-radius:8px; border:1px solid #3a2e20; background:#1f1812; cursor:pointer; color:var(--parchment); font-family:'JetBrains Mono',monospace; font-size:10.5px; }
.clm-row.me{ border-color:var(--gold-bright); background:rgba(202,164,76,.12); }
.clm-head.req, .clm-row.req{ grid-template-columns:minmax(0,2fr) minmax(0,.6fr) minmax(0,1fr) minmax(0,.9fr) minmax(0,1.8fr); } /* + столбец иероглифов 𓂀 (23.09.2026) */
.clm-row.req{ cursor:default; }
.clm-row .on{ color:#9be07a; }
.clm-who{ display:flex; align-items:center; gap:7px; min-width:0; font-family:'Inter',sans-serif; }
.clm-who .pf-ava.sm{ width:26px; height:26px; font-size:13px; border-width:1px; border-radius:50%; }
.clm-nm{ font-weight:700; font-size:11.5px; color:#f0e6d2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.clm-role{ font-style:normal; font-size:8.5px; padding:1px 5px; border-radius:999px; background:rgba(230,201,118,.2); color:var(--gold-bright); margin-left:4px; }
.clm-role.elder{ background:rgba(120,180,255,.18); color:#bcd8ff; } /* Старейшина — синяя, Жрец — сиреневая (17.09.2026) */
.clm-role.priest{ background:rgba(200,160,255,.18); color:#dcc8ff; }
.clm-acts{ display:flex; gap:6px; justify-content:flex-end; }
/* Р1 «Столбец Звание» (его выбор 18.09.2026): шесть колонок в своём клане, заголовки-сортировка, плашка ▾, красный ✕, меню. */
/* Л1 (его выбор 18.09.2026): # · воин · Слава (широкая, под миллионы) · звание · столбец по выпадашке · был */
/* 23.09.2026, его слово «везде ещё и иероглифы»: седьмой столбец 𓂀 после Славы — значок и число, без «/ 666». */
.clm-head.six, .clm-row.six{ grid-template-columns:22px minmax(0,1.6fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr); }
.clm-n{ font:900 11px 'Cinzel',serif; color:var(--gold-bright); text-align:center; }
.clm-slava{ color:#f0e0b0; font-variant-numeric:tabular-nums; }
.clm-tal{ color:#e6c976; font-variant-numeric:tabular-nums; white-space:nowrap; }
.clm-head span[title]{ font-family:'Segoe UI Historic','Noto Sans Egyptian Hieroglyphs',serif; font-size:12px; line-height:1; }
.clm-val{ color:#f0e0b0; font-weight:700; font-variant-numeric:tabular-nums; }
.clm-head .clm-pick{ overflow:visible; }
.clm-dd{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:7px; border:1px solid var(--gold); background:linear-gradient(180deg,#3d2f1a,#2a2012); color:#f0e0b0; font:700 9.5px 'Inter',sans-serif; text-transform:none; letter-spacing:0; cursor:pointer; white-space:nowrap; }
.clm-dd i{ font-style:normal; color:var(--gold-bright); }
.clm-menu div.sel{ background:rgba(230,201,118,.18); color:var(--gold-bright); }
.clm-row.six .clm-role{ margin-left:0; font-size:9px; }
.clm-role.warrior{ background:rgba(255,255,255,.08); color:#bcae90; }
.clm-role.pick{ border:1px dashed rgba(230,201,118,.6); padding-right:13px; position:relative; cursor:pointer; }
.clm-role.pick::after{ content:'▾'; position:absolute; right:3px; top:0; font-size:8px; }
.clm-seen{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* «Выйти» в своей строке после «в игре» (25.09.2026, его слово) — строка своя всегда «в игре», место там есть */
.clm-leave{ margin-left:6px; font:800 9px 'Cinzel',serif; padding:2px 7px; border-radius:6px; cursor:pointer; vertical-align:middle;
border:1px solid #7a3540; background:linear-gradient(180deg,#5a2630,#2a1218); color:#ffb0b8; }
.clm-menu{ position:absolute; z-index:8; background:linear-gradient(180deg,#2a2014,#1a140e); border:1px solid var(--gold); border-radius:9px; padding:4px; box-shadow:0 8px 20px rgba(0,0,0,.7); display:flex; flex-direction:column; gap:2px; min-width:150px; }
.clm-menu div{ font:700 10.5px 'Inter',sans-serif; padding:5px 8px; border-radius:6px; color:var(--parchment); cursor:pointer; }
.clm-menu div:hover{ background:rgba(230,201,118,.14); }
.clm-menu div.grey{ color:var(--muted); font-size:9.5px; cursor:default; }
.clm-menu div.grey:hover{ background:none; }
.clm-menu div.red{ color:#ffb0b8; border-top:1px solid #3a2e20; border-radius:0; margin-top:2px; padding-top:6px; }
.clm-menu div.red + div.red{ border-top:none; margin-top:0; padding-top:5px; }
/* --- создание (папирус) --- */
.clc-wrap{ display:flex; gap:12px; height:100%; }
.clc-herb{ width:170px; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:8px; padding-top:4px; }
.clc-glyphs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
.clc-g{ width:34px; height:34px; border-radius:9px; font-size:17px; border:1px solid #5a4a30; background:radial-gradient(circle at 40% 30%,var(--ec),var(--ec2) 75%); opacity:.7; cursor:pointer; }
.clc-g.sel{ border:2px solid var(--gold-bright); opacity:1; box-shadow:0 0 10px rgba(230,201,118,.5); }
.clc-cols{ display:flex; gap:6px; }
.clc-c{ width:20px; height:20px; border-radius:50%; border:2px solid #2a2018; cursor:pointer; }
.clc-c.sel{ border-color:#fff; box-shadow:0 0 8px #fff; }
.clc-scroll{ flex:1; min-width:0; border-radius:12px; background:linear-gradient(180deg,#d9c79a,#c9b384); color:#2a1a0a; padding:14px 16px; box-shadow:inset 0 0 40px rgba(90,60,20,.35); position:relative; display:flex; flex-direction:column; gap:3px; }
.clc-scroll:before, .clc-scroll:after{ content:''; position:absolute; left:0; right:0; height:8px; background:linear-gradient(180deg,#8a6a3a,#5a3a18); }
.clc-scroll:before{ top:0; border-radius:12px 12px 0 0; } .clc-scroll:after{ bottom:0; border-radius:0 0 12px 12px; }
.clc-fl{ font:800 9px 'Cinzel',serif; color:#5a3a10; letter-spacing:.06em; text-transform:uppercase; margin-top:4px; }
.pop-window .clc-fl{ color:var(--gold-bright); }
.clc-inp{ width:100%; box-sizing:border-box; font:700 12px 'Inter',sans-serif; color:#2a1a0a; padding:6px 9px; border-radius:8px; border:1px solid #8a6a3a; background:rgba(255,250,235,.65); }
.clc-inp.ta{ height:44px; font-weight:400; font-size:11px; resize:none; }
.pop-window .clc-inp{ background:#1f1812; color:#f0e0b0; border-color:#8a6a3a; }
.clc-row2{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
.clc-seg{ display:flex; gap:4px; }
.clc-seg span{ flex:1; text-align:center; font:700 10px 'Inter',sans-serif; padding:5px 3px; border-radius:8px; border:1px solid #a08a5a; background:rgba(255,250,235,.4); color:#5a4a30; cursor:pointer; }
.clc-seg span.on{ background:#5a3a10; color:#f0e0b0; border-color:#5a3a10; }
.pop-window .clc-seg span{ background:#1f1812; color:var(--muted); border-color:var(--border); }
.pop-window .clc-seg span.on{ background:linear-gradient(180deg,#3d2f1a,#2a2012); border-color:var(--gold); color:#f0e0b0; }
.clc-foot{ margin-top:auto; display:flex; align-items:center; gap:10px; padding-top:6px; }
.clc-price{ font:800 13px 'JetBrains Mono',monospace; color:#5a3a10; }
.clc-have{ font-size:10px; color:#7a6a4a; }
.clc-btn{ margin-left:auto; font:800 11px 'Cinzel',serif; padding:8px 16px; border-radius:8px; border:1px solid #8a6a3a; background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; cursor:pointer; }
.clc-btn.gr{ margin-left:0; background:rgba(255,250,235,.4); color:#5a3a10; } /* «Отмена» в настройках (Н1, 18.09.2026) */
/* --- список храмов (С4) --- */
.clt-wrap{ display:flex; gap:10px; height:100%; }
.clt-side{ width:120px; flex:0 0 auto; font-size:10px; color:var(--muted); line-height:1.45; }
.clt-side.r{ text-align:right; }
.clt-side b{ display:block; font:800 10.5px 'Cinzel',serif; color:var(--gold-bright); margin-bottom:3px; }
.clt-list{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.clt-card{ display:flex; align-items:center; gap:12px; padding:8px 12px; border-radius:11px; border:1px solid var(--border); background:#1a140e; cursor:pointer; }
.clt-card.open{ border-color:var(--gold); }
.clt-card.done{ border-color:#5ad07a; }
.clt-card.lock{ opacity:.55; }
.clt-book{ width:40px; height:50px; flex:0 0 auto; border-radius:4px 8px 8px 4px; border:1px solid #2c6a40; background:linear-gradient(90deg,#1c3a24,#2c6a40 30%,#1c3a24); display:flex; align-items:center; justify-content:center; font:900 15px 'Cinzel',serif; color:#f0e0b0; box-shadow:2px 3px 8px rgba(0,0,0,.5); }
.clt-card.lock .clt-book{ filter:grayscale(1); }
.clt-w{ flex:1; min-width:0; }
.clt-t{ font:800 12.5px 'Cinzel',serif; color:#f0e0b0; }
.clt-d{ font-size:9.5px; color:var(--muted); margin-top:2px; }
.clt-plate{ flex:0 0 auto; font:800 9.5px 'JetBrains Mono',monospace; color:#f0e0b0; padding:3px 8px; border-radius:6px; border:1px solid var(--gold); background:#1f1812; white-space:nowrap; }
.clt-plate.done{ border-color:#5ad07a; color:#5ad07a; }
/* --- дерево Б + П1 --- */
.clr-wrap{ display:flex; gap:8px; height:100%; }
.clr-side{ width:128px; flex:0 0 auto; display:flex; flex-direction:column; gap:4px; }
.clr-side.r{ align-items:center; text-align:center; }
.clr-side b{ font:800 10.5px 'Cinzel',serif; color:var(--gold-bright); }
.clr-bar{ position:relative; flex:0 0 auto; height:27px; border-radius:7px; border:1px solid #4a3a28; background:#1a140e; overflow:hidden; } /* flex:0 0 auto — полосы не сжимаются и не налезают (18.09.2026) */
.clr-bar .fl{ position:absolute; left:0; top:0; bottom:0; width:var(--p,0); background:linear-gradient(90deg,rgba(90,208,122,.35),rgba(90,208,122,.6)); }
.clr-bar .fl.gold{ background:linear-gradient(90deg,rgba(230,201,118,.3),rgba(230,201,118,.6)); }
.clr-bar .tx{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; padding:0 6px; font:600 7.5px 'Inter',sans-serif; color:#c9b98f; white-space:nowrap; line-height:1.15; }
.clr-bar .tx small{ font:800 9px 'JetBrains Mono',monospace; color:#fff; line-height:1.2; }
.clr-tree{ flex:1; min-width:0; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; }
.clr-canvas{ position:relative; width:500px; margin:0 auto; }
.clr-canvas svg{ position:absolute; inset:0; width:100%; height:100%; }
.clr-canvas .g-done{ stroke:#5ad07a; stroke-width:5; fill:none; stroke-linecap:round; }
.clr-canvas .g-cur{ stroke:#e6c976; stroke-width:5; fill:none; stroke-linecap:round; stroke-dasharray:10 8; }
.clr-canvas .g-lock{ stroke:#4a3a28; stroke-width:5; fill:none; stroke-linecap:round; }
.cln{ position:absolute; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:3px; width:120px; cursor:pointer; }
.cln-sq{ width:44px; height:44px; border-radius:10px; border:2px solid var(--gold); background:radial-gradient(circle at 40% 30%,#5a4410,#1a1206 75%); display:flex; align-items:center; justify-content:center; font-size:21px; box-shadow:0 0 10px rgba(230,201,118,.3); }
.cln-lb{ font:700 9px 'Inter',sans-serif; color:#f0e0b0; text-align:center; padding:2px 6px; border-radius:6px; border:1px solid var(--gold); background:#1f1812; white-space:nowrap; }
.cln-lb small{ display:block; font:600 8px 'Inter',sans-serif; color:var(--muted); }
.cln.done .cln-sq{ border-color:#5ad07a; box-shadow:0 0 12px rgba(90,208,122,.45); } .cln.done .cln-lb{ border-color:#5ad07a; } .cln.done .cln-lb small{ color:#5ad07a; }
.cln.cur .cln-sq, .cln.open .cln-sq{ border-color:#f0e0b0; box-shadow:0 0 16px rgba(230,201,118,.8); }
.cln.cur .cln-lb{ background:linear-gradient(90deg,#3d2f1a var(--p,0),#1f1812 var(--p,0)); }
.cln.lock{ opacity:.42; filter:grayscale(1); }
.cln.banner .cln-sq{ border-color:#e06070; background:radial-gradient(circle at 40% 30%,#6a2030,#1a0a0e 75%); }
.clr-ring{ width:84px; height:84px; border-radius:50%; background:conic-gradient(#5ad07a var(--p,0), #2a2018 0); display:flex; align-items:center; justify-content:center; box-shadow:0 0 14px rgba(90,208,122,.25); }
.clr-ring i{ width:68px; height:68px; border-radius:50%; background:radial-gradient(circle,#2a2118,#15110d); display:flex; flex-direction:column; align-items:center; justify-content:center; font:900 18px 'Cinzel',serif; color:#f0e0b0; font-style:normal; }
.clr-ring i small{ font:600 9px 'Inter',sans-serif; color:var(--muted); }
.clr-pts{ font:700 10px 'JetBrains Mono',monospace; color:var(--gold-bright); }
/* --- карточка алтаря --- */
/* А3 «Свиток» (его выбор 18.09.2026): окно алтаря — папирус, всё фиксированной высоты, ничего не прыгает */
.cl-back-big{ font:800 13px 'Cinzel',serif; letter-spacing:.04em; padding:7px 16px; border-radius:10px; border:1px solid #8a6a3a; background:linear-gradient(180deg,#3d2f1a,#2a2012); color:var(--gold-bright); cursor:pointer; margin-bottom:6px; }
.cl-back-big:active{ transform:scale(.97); }
.cln-scroll{ position:relative; height:100%; border-radius:12px; background:linear-gradient(180deg,#d9c79a,#c9b384); color:#2a1a0a; padding:12px 16px 10px; box-shadow:inset 0 0 40px rgba(90,60,20,.35); display:flex; flex-direction:column; gap:7px; }
.cln-scroll:before, .cln-scroll:after{ content:''; position:absolute; left:0; right:0; height:8px; background:linear-gradient(180deg,#8a6a3a,#5a3a18); }
.cln-scroll:before{ top:0; border-radius:12px 12px 0 0; } .cln-scroll:after{ bottom:0; border-radius:0 0 12px 12px; }
.cln-top{ display:flex; align-items:center; gap:14px; height:64px; margin:2px 0 4px; }
.cln-info{ flex:1; min-width:0; }
.cln-scroll .cln-t{ color:#3a2210; } .cln-scroll .cln-d{ color:#4a3a20; font-size:11.5px; } .cln-scroll .cln-s{ color:#7a6040; }
.cln-ringwrap{ position:relative; width:62px; height:62px; flex:0 0 auto; }
.cln-ring{ position:absolute; inset:0; border-radius:50%; background:conic-gradient(#a8293f var(--p,0), rgba(0,0,0,.15) 0); }
.cln-ringwrap .cl-emblem{ position:absolute; inset:5px; width:auto !important; height:auto !important; border-radius:50%; }
/* таймер — крупно, слева от печати «обновить» (его слово 18.09.2026: «чуть больше и возле обновления, чтобы было видно») */
.cln-timer{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-width:96px; height:50px; padding:0 12px; margin-right:4px; border-radius:10px; border:1px solid #8a6a3a; background:rgba(90,60,20,.14); color:#3a2210; }
.cln-timer i{ display:none; }
.cln-timer b{ font:900 15px 'JetBrains Mono',monospace; font-variant-numeric:tabular-nums; line-height:1; color:#3a2210; }
.cln-timer small{ font:600 8px 'Inter',sans-serif; color:#7a6040; white-space:nowrap; }
.cln-timer.blocked{ border-color:#a8293f; background:rgba(168,41,63,.12); } .cln-timer.blocked b{ color:#8a1a2a; } .cln-timer.blocked small{ color:#8a1a2a; }
.cln-seal{ width:54px; height:54px; border-radius:50%; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; border:2px solid #8a6a3a; background:linear-gradient(180deg,#3d2f1a,#2a2012); color:var(--gold-bright); font:700 9.5px 'JetBrains Mono',monospace; cursor:pointer; box-shadow:0 3px 8px rgba(0,0,0,.35); }
.cln-seal i{ font-style:normal; font-size:16px; line-height:1; }
.cln-seal:disabled{ opacity:.45; cursor:not-allowed; }
.cln-scroll .cln-prog{ border-color:#8a6a3a; background:#bda57a; height:20px; }
.cln-scroll .cln-prog .fl{ background:linear-gradient(90deg,rgba(90,60,20,.35),rgba(90,60,20,.6)); }
.cln-scroll .cln-prog span{ color:#2a1a0a; font-variant-numeric:tabular-nums; }
.cln-tabs{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.cln-tab{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; height:62px; padding:0; border-radius:8px 8px 14px 14px; background:linear-gradient(180deg,#8a7a68,#5a4a3a); border:2px solid #3a2a1a; color:#fff3c0; box-shadow:inset 0 2px 0 rgba(255,255,255,.25), 0 4px 0 #2a1a0a; cursor:pointer; }
.cln-tab b{ font:900 17px 'JetBrains Mono',monospace; font-variant-numeric:tabular-nums; line-height:1; }
.cln-tab i{ font-style:normal; font:700 9.5px 'JetBrains Mono',monospace; color:#ffe08a; line-height:1; min-height:10px; }
.cln-tab i.bone{ color:#dcc8ff; }
.cln-tab.none{ opacity:.45; filter:grayscale(1); }
.cln-tab.none i{ color:#d8c8a8; font-family:'Inter',sans-serif; font-weight:600; }
.cln-tab:disabled:not(.none){ opacity:.55; filter:grayscale(.5); cursor:not-allowed; }
.cln-tab:not(:disabled):active{ transform:translateY(2px); box-shadow:inset 0 2px 0 rgba(255,255,255,.25), 0 2px 0 #2a1a0a; }
.cln-line{ height:18px; display:flex; align-items:center; gap:6px; font-size:9.5px; color:#5a3a18; white-space:nowrap; }
.cln-line b{ color:#2a1a0a; } .cln-line .dot{ color:#8a6a3a; } .cln-line .sp{ flex:1; } .cln-line .warn{ color:#8a1a2a; font-weight:700; }
.cln-reset{ font:800 9px 'Cinzel',serif; padding:3px 9px; border-radius:7px; border:1px solid #3a7a40; background:linear-gradient(180deg,#264a2a,#142a16); color:#bfeec0; cursor:pointer; visibility:hidden; } /* место занято всегда, видна только при 5 ч */
.cln-reset.on{ visibility:visible; }
.cln-reset:disabled{ opacity:.5; cursor:not-allowed; }
.cln-card{ max-width:640px; margin:0 auto; display:flex; flex-direction:column; gap:8px; }
.cln-head{ display:flex; align-items:center; gap:12px; }
.cln-t{ font:900 15px 'Cinzel',serif; color:#f0e0b0; }
.cln-d{ font-size:12px; color:var(--parchment); margin-top:2px; }
.cln-s{ font-size:10px; color:var(--muted); margin-top:2px; }
.cln-prog{ position:relative; height:22px; border-radius:7px; border:1px solid #4a3a28; background:#1a140e; overflow:hidden; }
.cln-prog .fl{ position:absolute; left:0; top:0; bottom:0; width:var(--p,0); background:linear-gradient(90deg,rgba(230,201,118,.3),rgba(230,201,118,.65)); }
.cln-prog span{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font:800 11px 'JetBrains Mono',monospace; color:#fff; }
.cln-btns{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:8px; align-items:center; }
/* «Обновить» за 🦴 — маленькая сбоку от трёх кнопок (его правка 17.09.2026: «чуть меньше и сбоку») */
.cln-reroll{ padding:5px 8px; border-radius:8px; border:1px dashed #7a6540; background:#241c14; color:#f0d060; font:700 10px 'JetBrains Mono',monospace; cursor:pointer; white-space:nowrap; }
.cln-reroll:disabled{ opacity:.45; cursor:not-allowed; }
.cln-btn.bones i{ color:#c8b8ff; }
.cln-btn{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:9px 6px; border-radius:10px; border:1px solid var(--gold); background:linear-gradient(180deg,#3d2f1a,#2a2012); color:#f0e0b0; cursor:pointer; }
.cln-btn b{ font:900 16px 'JetBrains Mono',monospace; color:var(--gold-bright); }
.cln-btn small{ font-size:9px; color:var(--muted); }
.cln-btn i{ font-style:normal; font:700 9.5px 'JetBrains Mono',monospace; color:#f0d060; }
.cln-btn.none{ opacity:.35; }
.cln-btn:disabled{ cursor:not-allowed; filter:grayscale(.6); opacity:.5; }
.cln-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:10.5px; color:var(--muted); }
.cln-note{ font-size:10px; color:#ff9a7a; min-height:12px; }
/* ===== ИЕРОГЛИФЫ (21.09.2026, одиннадцатая сессия) =====
Виджет в бою — его выбор Т5 «Табличка» (client/maket-talanty-6.html?v=5): тёмная плашка под нынешнее окно
боя, «ИЕРОГЛИФЫ» с короной и бейджем новых, шкала с рисками по четвертям, «очки · ещё N». Правый верхний
угол площадки босса. Окно — Е1 «Папирус» (client/maket-talanty-4.html?v=1): жёлтое, вкладки веток, шапка как
у Тюряги, вертикальный скролл папирусов с плитками 3 + 2, бог справа, карточка по тапу. Рисует js/22-talents.js. */
.sf-glyphs{ position:absolute; right:0; top:20px; z-index:5; width:180px; padding:6px 9px 7px; border-radius:9px; /* чуть крупнее (его слово): 160 → 180 */ /* §2.13: под именем босса, справа от полоски здоровья */
background:rgba(0,0,0,.35); border:1px solid #5a4a30; color:var(--parchment); cursor:pointer; text-align:left;
font-family:'Inter',sans-serif; box-shadow:0 3px 8px rgba(0,0,0,.5); }
.sf-glyphs:hover{ border-color:var(--gold-bright); }
.sf-glyphs .sg-hd{ display:flex; align-items:center; gap:5px; font:800 10px 'Cinzel',serif; letter-spacing:.12em; color:var(--gold-bright); }
.sf-glyphs .sg-crown{ font-size:12px; }
.sf-glyphs .sg-new{ margin-left:auto; font:700 9px 'JetBrains Mono',monospace; letter-spacing:0; color:var(--muted); padding:0 5px; border-radius:8px; border:1px solid #3a2c50; white-space:nowrap; } /* «новые 11» в одну строку (53-я: перенос раздувал табличку на Фараона) */
.sf-glyphs .sg-new.has{ color:#fff; background:#2f9a4a; border-color:#1f6a30; animation:sgNew 1.2s ease-in-out infinite; }
@keyframes sgNew{ 0%,100%{ box-shadow:0 0 0 0 rgba(90,208,122,0);} 50%{ box-shadow:0 0 0 3px rgba(90,208,122,.55);} }
.sf-glyphs .sg-bar{ position:relative; height:14px; margin-top:5px; border-radius:6px; border:1px solid #8a6a2a; background:#1a1208; overflow:hidden; box-shadow:inset 0 2px 3px rgba(0,0,0,.6); }
.sf-glyphs .sg-fill{ position:absolute; left:0; top:0; bottom:0; width:0; transition:width .55s cubic-bezier(.2,.8,.2,1); background:linear-gradient(180deg,#ffe07a,#e6b830 60%,#c8912a); }
.sf-glyphs .sg-bar i{ position:absolute; top:0; bottom:0; width:1px; background:rgba(0,0,0,.35); }
.sf-glyphs .sg-txt{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font:700 8.5px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 1px 2px #000; white-space:nowrap; }
.sf-glyphs .sg-row{ display:flex; align-items:baseline; justify-content:space-between; margin-top:5px; font:600 9px 'Inter',sans-serif; color:var(--muted); }
.sf-glyphs .sg-row b{ font:700 12px 'JetBrains Mono',monospace; color:#ffe07a; margin-left:3px; }
.sf-glyphs .sg-left{ font:700 8.5px 'JetBrains Mono',monospace; white-space:nowrap; }
.sf-glyphs.flash{ animation:sgFlash .9s ease-out; }
@keyframes sgFlash{ 0%{ filter:brightness(1);} 25%{ filter:brightness(1.8) drop-shadow(0 0 10px #ffe07a);} 100%{ filter:brightness(1);} }
.sg-pop{ position:absolute; right:10px; z-index:7; font:800 12px 'JetBrains Mono',monospace; color:#ffe07a; text-shadow:0 1px 3px #000; pointer-events:none; animation:sgPop 1.1s ease-out forwards; }
@keyframes sgPop{ 0%{ opacity:0; transform:translateY(6px);} 15%{ opacity:1;} 100%{ opacity:0; transform:translateY(-26px);} }
/* Иероглифы — жёлтая панель (песок и золото) внутри окна «Храм» (21.09.2026): раньше это было своё окно .tal-modal
740×318 с крестиком; теперь панель-вкладка .tal-pane во всю правую часть Храма, крестик и затемнение — у Храма. */
.tal-pane{ position:relative; flex-direction:column; overflow:hidden; text-align:left; color:#3a2410;
background:linear-gradient(180deg,#f0dfae,#d9c48e 40%,#c9b07a); }
/* панель уже прежнего окна (справа от кнопок Храма): папирусы и бог чуть уже, шкала урона короче, «+1» спрятан */
.tal-pane .tal-sec, .tal-pane .tal-secarr{ width:400px; }
.tal-pane .tal-fig{ width:150px; } .tal-pane .tal-fig .fg{ width:140px; height:180px; right:4px; } .tal-pane .tal-fig .big{ font-size:80px; }
.tal-pane .tal-dmg{ width:160px; } .tal-pane .tal-plus{ display:none; } .tal-pane .tal-cnt{ font-size:9.5px; }
.tal-pane .tal-reset{ padding:5px 8px; font-size:9px; } .tal-pane .tal-head{ gap:8px; }
.tal-tabs{ flex:0 0 30px; display:flex; gap:4px; padding:4px 44px 0 8px; background:linear-gradient(180deg,#6a4a1a,#8a6a2a); border-bottom:2px solid #8a6a2a; }
.tal-tab{ flex:0 0 150px; border-radius:9px 9px 0 0; border:1px solid #8a6a2a; border-bottom:none; background:linear-gradient(180deg,#b8945a,#a07e48);
display:flex; align-items:center; justify-content:center; gap:5px; font:900 10px 'Cinzel',serif; letter-spacing:.08em; text-transform:uppercase; color:#3a2410; cursor:pointer; } /* кнопки веток меньше (его слово) */
.tal-tab .ic{ font-size:13px; }
.tal-tab .p{ font:700 8px 'JetBrains Mono',monospace; color:#5a3a10; letter-spacing:0; text-transform:none; }
.tal-tab.on{ background:linear-gradient(180deg,#f4e4b4,#e6c976); box-shadow:inset 0 -2px 0 #fff3c0; }
.tal-tab.lock{ background:linear-gradient(180deg,#8a7048,#75603e); color:#4a3a20; opacity:.9; }
.tal-tab.lock.on{ background:linear-gradient(180deg,#d9c48e,#c4a870); opacity:1; }
.tal-tab.soon{ background:repeating-linear-gradient(135deg,#8a7048 0 6px,#7a6040 6px 12px); color:#4a3a20; font-size:9.5px; letter-spacing:.06em; cursor:default; }
.tal-tab.soon .ic{ opacity:.6; }
.tal-head{ flex:0 0 44px; display:flex; align-items:center; gap:12px; padding:0 10px; }
.tal-dmg{ position:relative; width:270px; flex:0 0 auto; height:22px; border-radius:6px; border:2px solid #8a6a2a; background:#a08a62; overflow:hidden; box-shadow:inset 0 2px 4px rgba(0,0,0,.5); }
.tal-dmg .fl{ position:absolute; left:0; top:0; bottom:0; transition:width .5s; background:linear-gradient(180deg,#ffe07a,#e6b830); }
.tal-dmg .tx{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font:800 9.5px 'JetBrains Mono',monospace; color:#2a1c08; text-shadow:0 1px 0 rgba(255,255,255,.5); }
.tal-plus{ font:900 13px 'Cinzel',serif; color:#5a3a10; }
.tal-cnt{ display:flex; flex-direction:column; gap:2px; font:600 10.5px 'Inter',sans-serif; color:#3a2410; white-space:nowrap; }
.tal-cnt b{ font:800 10.5px 'JetBrains Mono',monospace; }
.tal-note{ margin-left:auto; font:600 9.5px 'Inter',sans-serif; color:#a8293f; max-width:170px; text-align:right; line-height:1.2; }
.tal-reset{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:8px; border:2px solid #8a6a2a; background:linear-gradient(180deg,#ffd76a,#e0a830);
color:#3a2410; font:900 10px 'Cinzel',serif; letter-spacing:.04em; box-shadow:0 2px 0 #8a6a2a; cursor:pointer; white-space:nowrap; }
.tal-reset:disabled{ opacity:.5; cursor:not-allowed; }
.tal-reset.warn{ background:linear-gradient(180deg,#e06070,#a8293f); color:#fff; border-color:#5a0f1c; }
.tal-field{ flex:1; min-height:0; margin:0 10px 8px; border:2px solid #8a6a2a; border-radius:10px; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:#8a6a2a #d9c48e;
background:linear-gradient(180deg,#d4bc84,#c4a870); box-shadow:inset 0 0 30px rgba(90,58,16,.35); position:relative; }
.tal-canvas{ position:relative; padding-bottom:14px; }
.tal-fig{ position:sticky; top:0; float:right; width:200px; height:100%; pointer-events:none; }
.tal-fig .fg{ position:absolute; right:6px; top:6px; width:190px; height:200px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
.tal-fig .big{ font-size:110px; line-height:1; filter:drop-shadow(0 10px 14px rgba(0,0,0,.45)); }
.tal-fig .nm{ font:900 12px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase; color:#3a2410; text-align:center; }
.tal-fig .sub{ font:600 9px 'Inter',sans-serif; color:#5a3a10; text-align:center; }
.tal-sec{ position:relative; margin:12px 0 0 12px; width:440px; border-radius:6px; padding:30px 14px 14px; background:linear-gradient(180deg,#f2e2b6,#e2cd98); box-shadow:0 6px 14px rgba(0,0,0,.35), inset 0 0 0 1px #c9b07a; }
.tal-sec::before,.tal-sec::after{ content:''; position:absolute; left:8px; right:8px; height:6px; background:repeating-linear-gradient(90deg,#c9b07a 0 8px,transparent 8px 12px); opacity:.6; }
.tal-sec::before{ top:4px; } .tal-sec::after{ bottom:4px; }
.tal-sec .st{ position:absolute; left:14px; top:8px; font:900 11px 'Cinzel',serif; letter-spacing:.08em; text-transform:uppercase; color:#5a3a10; }
.tal-sec .st small{ font:700 8.5px 'JetBrains Mono',monospace; letter-spacing:0; text-transform:none; margin-left:8px; color:#7a6a50; }
.tal-row{ display:flex; gap:26px; justify-content:center; }
/* стрелки веером от родителей к ребёнку — SVG по раскладке shared/talents.js (23.09.2026) */
.tal-arrows{ display:block; height:22px; overflow:visible; } /* ширину и viewBox ставит talDrawArrows по папирусу */
.tal-secarr{ text-align:center; width:440px; margin-left:12px; font-size:20px; color:#8a6a2a; height:24px; line-height:24px; }
.tal-secarr.ok{ color:#2f9a4a; }
.tal-rowsp{ height:16px; }
.tal-tl{ position:relative; width:74px; height:74px; border-radius:8px; border:3px solid #8a8a70; background:radial-gradient(circle at 40% 30%,#c9a24a,#5a3a10 80%);
display:flex; align-items:center; justify-content:center; font-size:34px; box-shadow:0 3px 6px rgba(0,0,0,.4), inset 0 0 12px rgba(0,0,0,.35); text-shadow:0 3px 6px rgba(0,0,0,.6); cursor:pointer; }
.tal-tl .lv{ position:absolute; right:-3px; bottom:-3px; padding:1px 5px; border-radius:5px 0 6px 0; font:800 9.5px 'JetBrains Mono',monospace; background:#fff; color:#2a1c08; border:1px solid #5a4a30; text-shadow:none; }
.tal-tl .nm{ position:absolute; left:-6px; right:-6px; top:100%; margin-top:3px; text-align:center; font:700 8px 'Inter',sans-serif; color:#3a2410; white-space:nowrap; text-shadow:none; }
.tal-tl.done{ border-color:#2f9a4a; box-shadow:0 0 0 1px #1f6a30,0 3px 6px rgba(0,0,0,.4),0 0 10px rgba(47,154,74,.5); }
.tal-tl.done .lv{ background:#2f9a4a; color:#fff; border-color:#1f6a30; }
.tal-tl.cur{ border-color:#fff; animation:talPulse 1.6s ease-in-out infinite; }
.tal-tl.cur .lv{ background:#ffd76a; }
.tal-tl.lock{ filter:grayscale(1) brightness(.75); opacity:.7; }
.tal-tl.great{ border-color:#a8293f; }
.tal-tl.pick{ outline:2px solid #fff3c0; outline-offset:2px; }
@keyframes talPulse{ 0%,100%{ box-shadow:0 0 0 2px #caa44c,0 0 10px rgba(230,201,118,.6);} 50%{ box-shadow:0 0 0 2px #fff,0 0 22px rgba(255,230,140,1);} }
/* окно таланта по тапу — К2 «Картуш» (его выбор 21.09.2026, client/maket-talanty-7.html?v=2): овал, иконка в золотом
медальоне сверху, всё по центру; строка «Урон Яда +5 / 30» (сейчас / на максимуме); «Прокачать» / «Закрыть»,
у прокачанного — зелёное «✓ Прокачано N / N». Затемнение и окно — внутри панели Иероглифов #hramTal (окно «Храм»), поверх поля. */
.tal-popdim{ position:absolute; inset:0; z-index:8; background:rgba(20,12,4,.55); display:none; }
.tal-popdim.show{ display:block; }
.tal-pop{ position:absolute; z-index:9; left:50%; top:52%; transform:translate(-50%,-50%); display:none; width:300px; padding:40px 26px 14px; border-radius:150px/90px;
text-align:center; background:linear-gradient(180deg,#f4e4b4,#e6c976 60%,#caa44c); border:3px double #8a6a2a; box-shadow:0 12px 32px rgba(0,0,0,.6);
flex-direction:column; align-items:center; gap:6px; color:#3a2410; font-family:'Inter',sans-serif; }
.tal-pop.show{ display:flex; }
.tal-pop .med{ position:absolute; left:50%; top:-30px; transform:translateX(-50%); width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center;
background:radial-gradient(circle at 40% 30%,#ffe07a,#c8912a 60%,#8a6a2a); border:3px solid #fff3c0; box-shadow:0 0 14px rgba(255,224,122,.7), 0 4px 8px rgba(0,0,0,.5); }
.tal-pop .med .ic{ font-size:32px; line-height:1; text-shadow:0 4px 8px rgba(0,0,0,.5); }
.tal-pop .med.done{ border-color:#5ad07a; box-shadow:0 0 14px rgba(90,208,122,.7), 0 4px 8px rgba(0,0,0,.5); }
.tal-pop .med.lock{ filter:grayscale(1) brightness(.8); }
.tal-pop .x{ position:absolute; right:14px; top:10px; width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:12px;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; color:#fff; cursor:pointer; }
.tal-pop .nm{ font:900 13px 'Cinzel',serif; letter-spacing:.06em; }
.tal-pop .lv{ font:700 10.5px 'JetBrains Mono',monospace; }
.tal-pop .ef{ font:600 10.5px 'Inter',sans-serif; line-height:1.45; }
.tal-pop .ef b{ color:#1f6a30; }
.tal-pop .seg{ width:100%; display:flex; gap:1px; } .tal-pop .seg i{ flex:1; height:8px; border-radius:1px; background:#c4ac82; } .tal-pop .seg i.on{ background:#2f9a4a; }
.tal-pop .why{ font:600 9.5px 'Inter',sans-serif; color:#a8293f; }
.tal-pop .btns{ display:flex; gap:8px; justify-content:center; }
.tal-btn{ display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:7px 16px; border-radius:8px; border:2px solid #8a6a2a; background:linear-gradient(180deg,#ffd76a,#e0a830);
color:#3a2410; font:900 10.5px 'Cinzel',serif; letter-spacing:.04em; white-space:nowrap; box-shadow:0 2px 0 #8a6a2a; cursor:pointer; }
.tal-btn:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; }
.tal-btn.plain{ background:linear-gradient(180deg,#f0e2bc,#d9c48e); box-shadow:0 2px 0 #a88b52; }
.tal-btn.done{ background:linear-gradient(180deg,#5ad07a,#2f9a4a); border-color:#1f6a30; color:#fff; box-shadow:0 2px 0 #1f6a30; cursor:default; }
/* ===== ХРАМ — окно на месте кнопки «Клан» (21.09.2026, тринадцатая сессия) =====
Макет М5 «Карточка» (client/maket-okno-menu.html?v=5) без карточки игрока: слева столбик больших кнопок
(Сундук · Иероглифы · Достижения, ниже — место под новые), справа содержимое вкладки. Поверх окна боя
(табличка ИЕРОГЛИФЫ открывает Храм из боя): окно 78, затемнение 77 — как было у окна Иероглифов. */
#hramBackdrop{ z-index:77; }
.hram-modal{ z-index:78; width:min(708px,94%); height:min(326px,367px); max-height:367px; /* 28.09.2026 его слово «чуть уже, компактнее»: было 760×344 */ padding:0; overflow:hidden; text-align:left;
display:flex; flex-direction:row; border:2px solid var(--gold); }
.hram-modal .modal-close{ z-index:6; }
.hram-side{ width:150px; flex:0 0 auto; display:flex; flex-direction:column; gap:8px; padding:10px; border-right:1px solid var(--gold); background:linear-gradient(90deg,#1a130c,#0e0a06); }
.hram-btn{ width:100%; display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:12px; cursor:pointer; text-align:left;
border:1px solid #3a2c50; background:linear-gradient(180deg,rgba(40,30,20,.5),rgba(16,12,8,.4)); color:var(--muted); transition:border-color .15s, color .15s, transform .1s; }
.hram-btn .ic{ font-size:22px; line-height:1; } .hram-btn .nm{ font:800 11px 'Cinzel',serif; letter-spacing:.04em; }
.hram-btn:hover{ border-color:var(--border); color:var(--parchment); }
.hram-btn:active{ transform:scale(.96); }
.hram-btn.on{ border-color:var(--gold); color:#fff0d8; background:linear-gradient(180deg,#5a4218,#2c1f0c); }
.hram-pane{ flex:1; min-width:0; min-height:0; position:relative; display:flex; flex-direction:column; overflow:hidden; }
.hram-tab{ display:none; flex:1; min-height:0; }
.hram-tab.on{ display:flex; }
/* Сундук — вкладки и грид Кладовой как были, только внутри панели */
.hram-bag{ flex-direction:column; padding:4px 12px 8px; }
.hram-bag .inv-grid{ flex:1; min-height:0; align-content:start; }
/* ===== ДОСТИЖЕНИЯ (29.09.2026) — вкладка Храма по макету «Медальоны» (client/maket-dostizheniya-5.html), рисует js/26-achievements.js.
Справа сверху — крестик окна (.modal-close 28px), поэтому шапка оставляет ему 40px. Всё с приставкой ach-, чтобы не задеть чужое. */
.hram-ach{ flex-direction:column; padding:7px 9px; overflow:hidden; }
.ach-wait{ margin:auto; color:var(--muted); font-size:12px; }
.ach-head{ display:flex; align-items:center; gap:10px; margin-bottom:4px; padding-right:40px; min-height:28px; }
.ach-head h3{ margin:0; font:800 15px 'Cinzel',serif; letter-spacing:.03em; color:var(--gold-bright); white-space:nowrap; text-shadow:0 0 10px rgba(242,211,106,.45),0 1px 2px #000; }
.ach-tot{ flex:1; max-width:320px; height:21px; position:relative; overflow:hidden; border:1.5px solid var(--gold); border-radius:11px; background:linear-gradient(#131b24,#243241);
box-shadow:inset 0 2px 4px rgba(0,0,0,.7),0 0 0 1px #3a2a12,0 0 10px rgba(242,211,106,.18); }
.ach-tot i{ position:absolute; inset:0 auto 0 0; border-radius:10px; background:linear-gradient(#fff3b0,#f2d36a 35%,#d9a92c 70%,#a8741a); box-shadow:0 0 8px rgba(242,211,106,.55); }
.ach-tot i::after{ content:""; position:absolute; left:4px; right:4px; top:2px; height:5px; border-radius:4px; background:rgba(255,255,255,.35); }
.ach-tot span{ position:absolute; inset:0; font:800 11.5px/18px 'Inter',sans-serif; letter-spacing:.5px; text-align:center; color:#fff; text-shadow:0 1px 2px #000,0 0 4px #000; }
.ach-back{ height:26px; padding:0 16px 0 12px; border-radius:13px; display:grid; place-items:center; cursor:pointer; white-space:nowrap;
font:800 11.5px 'Cinzel',serif; letter-spacing:.5px; text-transform:uppercase; color:#3a2408;
background:linear-gradient(#ffe9a0,#e0b040 55%,#b07a1c); border:1px solid #fff0b8; box-shadow:0 0 0 1px #6a4a12,0 2px 6px rgba(0,0,0,.5); }
.ach-back:active{ transform:translateY(1px); }
.ach-head .ctit{ margin-left:auto; font:800 13px 'Cinzel',serif; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-bright); text-shadow:0 0 8px rgba(242,211,106,.35); white-space:nowrap; }
.ach-scroll{ flex:1; min-height:0; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#5a4520 #15110d; }
/* медальоны категорий */
.ach-gb{ display:flex; flex-wrap:wrap; justify-content:center; gap:2px 10px; padding:0 4px; } /* 3 ряда медальонов влезают в окно Храма без прокрутки */
.ach-mb{ width:92px; text-align:center; cursor:pointer; position:relative; }
.ach-mb .ring{ width:62px; height:62px; margin:0 auto; border-radius:50%; display:grid; place-items:center; background:#3a2f22; }
.ach-mb .coin{ width:53px; height:53px; border-radius:50%; display:grid; place-items:center; font-size:24px;
background:radial-gradient(circle at 40% 30%,#7a5a26,#3a2a12 60%,#1e150a); border:2px solid #8a6a36; box-shadow:inset 0 0 0 4px #2a1f10, inset 0 0 0 5px #6a5226, 0 4px 8px rgba(0,0,0,.6); }
.ach-mb .coin i{ font-style:normal; text-shadow:0 2px 3px #000; }
.ach-mb.hot .coin{ background:radial-gradient(circle at 40% 30%,#f2d36a,#b8862a 60%,#6a4a12); border-color:#fff3c0; box-shadow:inset 0 0 0 4px #8a6a2a, inset 0 0 0 5px #f2d36a, 0 0 14px rgba(242,211,106,.55); }
.ach-mb.soon{ cursor:default; } .ach-mb.soon .coin{ filter:grayscale(.6) brightness(.7); }
.ach-mb .nm2{ margin-top:2px; font:800 9.5px 'Cinzel',serif; letter-spacing:1px; text-transform:uppercase; color:var(--parchment); white-space:nowrap; overflow:hidden; }
.ach-mb .pts{ font:700 9px ui-monospace,monospace; color:var(--gold); } .ach-mb .pts small{ color:var(--muted); }
/* строки */
/* Безумство (29.09.2026): строка с кнопкой награды — лишняя колонка под «🎁 Награда» (макет maket-dostizheniya-5.html, его выбор А) */
.ach-row.rw{ grid-template-columns:20px 40px minmax(0,1fr) 84px 54px; }
.ach-rwbtn{ height:24px; border-radius:12px; display:grid; place-items:center; cursor:pointer; position:relative; overflow:hidden;
font:800 9.5px 'Cinzel',serif; letter-spacing:.3px; color:#3a2408; text-transform:uppercase; white-space:nowrap; padding:0 6px;
background:linear-gradient(#ffe9a0,#e0b040 55%,#b07a1c); border:1px solid #fff0b8; box-shadow:0 0 0 1px #6a4a12,0 0 10px rgba(242,211,106,.45); }
.ach-rwbtn::after{ content:""; position:absolute; top:0; bottom:0; width:18px; left:-30px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);
transform:skewX(-20deg); animation:achShine 2.6s infinite; }
@keyframes achShine{ 0%,55%{ left:-30px } 100%{ left:90px } }
.ach-rwbtn.got{ font-size:9px; letter-spacing:0; padding:0 4px; color:#dff5da; background:linear-gradient(#3f7a3a,#24501f); border-color:#7fd477; box-shadow:0 0 0 1px #16330f; }
.ach-rwbtn.got::after{ display:none; }
.ach-rwpop{ position:absolute; inset:0; display:none; place-items:center; background:rgba(5,4,3,.78); z-index:6; }
.ach-rwpop.show{ display:grid; }
.ach-rwpop .rw-ok{ margin-top:8px; display:inline-block; padding:5px 22px; border-radius:14px; cursor:pointer; font:800 11px 'Cinzel',serif; color:#3a2408;
background:linear-gradient(#ffe9a0,#d9a92c); border:1px solid #fff0b8; }
.ach-rwpop .rw-mail{ font-size:9.5px; color:var(--muted); margin-top:6px; } .ach-rwpop .rw-mail b{ color:var(--gold-bright); }
.ach-rwpop .rcard{ width:78px; border-radius:8px; padding:6px 4px 5px; text-align:center; position:relative;
background:radial-gradient(circle at 50% 30%,#5a4520,#221a10); border:2px solid #8a6a36; box-shadow:0 4px 10px rgba(0,0,0,.6); }
.ach-rwpop .rcard .i{ font-size:26px; line-height:1.1; text-shadow:0 0 12px rgba(242,211,106,.7); }
.ach-rwpop .rcard .n{ font:800 12px 'Cinzel',serif; color:#fff3c0; text-shadow:0 1px 2px #000; }
.ach-rwpop .rcard .t{ font:600 8px 'Inter',sans-serif; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; }
.ach-rwpop .rcard.totem{ width:118px; border-color:#c07bff; background:radial-gradient(circle at 50% 30%,#4a2a6a,#1a1024); box-shadow:0 0 14px rgba(192,123,255,.55); }
.ach-rwpop .rcard.totem .i{ text-shadow:0 0 14px rgba(192,123,255,.9); }
.ach-rwpop .rcard .bon{ font:700 8.5px/1.35 'Inter',sans-serif; color:#e8d6ff; margin-top:2px; }
.ach-rwpop .rstep{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.ach-rwpop .rstep .h{ font:700 9px 'Cinzel',serif; letter-spacing:1px; text-transform:uppercase; color:var(--gold); }
.ach-rwpop .rstep .h.got{ color:#5fdd6a; }
.ach-rwpop .rstep .cards{ display:flex; gap:6px; align-items:center; }
@keyframes achPopin{ 0%{ transform:scale(.3) translateY(20px); opacity:0 } 70%{ transform:scale(1.08) } 100%{ transform:none; opacity:1 } }
.ach-rwpop .pop .rcard{ animation:achPopin .45s cubic-bezier(.2,.9,.3,1.3) both; }
.ach-rwpop .rwA{ width:470px; padding:12px 14px; border-radius:12px; text-align:center; position:relative; overflow:hidden;
background:linear-gradient(#2a2016,#15100b); border:2px solid var(--gold); box-shadow:0 0 0 3px #3a2a12,0 0 30px rgba(242,211,106,.25); }
.ach-rwpop .rwA::before{ content:""; position:absolute; left:50%; top:55%; width:600px; height:600px; margin:-300px 0 0 -300px; opacity:.16;
background:repeating-conic-gradient(#f2d36a 0 8deg,transparent 8deg 22deg); animation:achSpin 18s linear infinite; }
@keyframes achSpin{ to{ transform:rotate(360deg) } }
.ach-rwpop .rwA > *{ position:relative; }
.ach-rwpop .rwA h4{ margin:0; font:800 14px 'Cinzel',serif; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold-bright); text-shadow:0 0 10px rgba(242,211,106,.5); }
.ach-rwpop .rwA .sub{ font-size:9.5px; color:var(--muted); margin:1px 0 8px; }
.ach-rwpop .rwA .steps{ display:flex; justify-content:center; gap:18px; }
.ach-row{ display:grid; grid-template-columns:20px 40px minmax(0,1fr) 54px; gap:8px; align-items:center; padding:5px 6px; background:#1c1712; border:1px solid #4a3c2a; border-radius:7px; margin-bottom:4px; }
.ach-row.open{ border-radius:7px 7px 0 0; margin-bottom:0; border-bottom:0; border-color:var(--gold); }
.ach-plus{ width:18px; height:18px; border:1.5px solid var(--gold); border-radius:4px; display:grid; place-items:center; font:800 13px/1 'Inter',sans-serif; color:var(--gold-bright); cursor:pointer; background:#3a2c15; }
.ach-pic{ width:40px; height:40px; border-radius:6px; border:2px solid #6a5226; background:radial-gradient(circle at 50% 35%,#3a2c1a,#1a120c); position:relative; display:grid; place-items:center; font-size:19px; }
.ach-pic b{ position:absolute; left:0; right:0; bottom:0; background:rgba(0,0,0,.72); color:#f2d36a; font:800 8px/11px ui-monospace,monospace; text-align:center; border-radius:0 0 3px 3px; }
.ach-row .nm{ font:700 11px 'Cinzel',serif; letter-spacing:.7px; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--parchment); }
.ach-row .cond{ font-size:9.5px; color:var(--muted); margin:1px 0 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ach-bar{ height:11px; border:1px solid #6a5226; border-radius:6px; background:#2a3846; position:relative; overflow:hidden; }
.ach-bar i{ position:absolute; inset:0 auto 0 0; background:linear-gradient(#f2d36a,#d9a92c); }
.ach-bar span{ position:absolute; inset:0; font:700 8px/9px ui-monospace,monospace; text-align:center; color:#fff; text-shadow:0 1px 1px #000; }
.ach-med{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center; justify-self:center; }
.ach-med div{ width:38px; height:38px; border-radius:50%; background:radial-gradient(circle at 50% 30%,#3a2c1a,#15110d); display:grid; place-content:center; text-align:center; line-height:1; }
.ach-med b{ font:800 11px 'Cinzel',serif; color:var(--gold-bright); } .ach-med small{ display:block; font:600 7.5px 'Inter',sans-serif; color:var(--muted); margin-top:1px; }
.ach-row .st{ font:600 8px 'Inter',sans-serif; color:var(--muted); text-align:center; margin-top:2px; }
/* полоса-заголовок группы строк (Осада — недели), как .grph в макете */
.ach-grph{ margin:6px 0 4px; padding:3px 10px; border-radius:3px; font:700 10px Georgia,serif; letter-spacing:1px; text-transform:uppercase; color:#3a2a10;
background:linear-gradient(90deg,#c9b27a,#e6d5a6 15%,#e9dab0 85%,#c9b27a); border-left:4px solid #8a6a36; border-right:4px solid #8a6a36; }
/* плитки ступеней */
.ach-tiles{ display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px; padding:6px 8px 8px 34px; background:#1c1712; border:1px solid var(--gold); border-top:0; border-radius:0 0 7px 7px; margin-bottom:4px; }
.ach-tile{ position:relative; aspect-ratio:1/1; border-radius:6px; border:2px solid #2e2620; background:radial-gradient(circle at 50% 40%,#2c2118,#15110d); display:grid; place-items:center; overflow:hidden; }
.ach-tile .e{ font-size:22px; line-height:1; filter:grayscale(1) brightness(.45); }
.ach-tile .th{ position:absolute; left:0; right:0; bottom:2px; font:800 8px/1 ui-monospace,monospace; text-align:center; color:#6b5d48; }
.ach-tile .p{ position:absolute; left:3px; top:2px; font:700 7.5px/1 'Inter',sans-serif; color:#6b5d48; }
.ach-tile.on{ border-color:#5a4520; background:radial-gradient(circle at 50% 40%,#5a4520,#2a1f12); }
.ach-tile.on .e{ filter:none; text-shadow:0 0 8px rgba(230,201,118,.6); } .ach-tile.on .th, .ach-tile.on .p{ color:#f2d36a; }
.ach-tile.on::after{ content:"✔"; position:absolute; right:2px; bottom:1px; color:#5fdd6a; font:900 13px/1 'Inter',sans-serif; text-shadow:0 0 3px #000; }
.ach-tile.cur{ border-color:var(--gold); } .ach-tile.cur .th, .ach-tile.cur .p{ color:var(--gold-bright); }
/* НОВОЕ (как в макете): взятое, но ещё не виденное в окне — плитка зелёная, медальон категории мерцает зелёным с точкой */
.ach-tile.new{ border-color:#5fbf6a; box-shadow:0 0 8px rgba(95,191,106,.5); } .ach-tile.new .e{ filter:none; } .ach-tile.new .th, .ach-tile.new .p{ color:#5fbf6a; }
.ach-tile.new::after{ content:"✔"; position:absolute; right:2px; bottom:1px; color:#5fdd6a; font:900 13px/1 'Inter',sans-serif; text-shadow:0 0 3px #000; }
.ach-dotn{ position:absolute; top:2px; right:14px; width:8px; height:8px; border-radius:50%; background:#5fbf6a; box-shadow:0 0 6px #5fbf6a; }
@keyframes achGlow{ 0%,100%{ box-shadow:0 0 6px rgba(95,191,106,.4); } 50%{ box-shadow:0 0 16px rgba(95,191,106,.9); } }
.ach-mb.nw .ring{ animation:achGlow 1.6s infinite; }
/* сетка боссов (Быстрее ветра, Сам себе армия): ряд 1 — недели 1 | 2, ряд 2 — 3 | 4, ряд 3 — клановые */
.ach-solo{ padding:4px 8px 8px 34px; background:#1c1712; border:1px solid var(--gold); border-top:0; border-radius:0 0 7px 7px; margin-bottom:4px; }
.ach-solo-lbls{ display:flex; align-items:center; margin:4px 0 2px; }
.ach-solo-lbls span{ width:235px; font:700 8.5px 'Cinzel',serif; letter-spacing:1px; text-transform:uppercase; color:var(--gold); }
.ach-solo-lbls i, .ach-solo-row i{ width:18px; flex:0 0 18px; }
.ach-solo-row{ display:flex; align-items:flex-start; }
.ach-solo-grp{ display:grid; grid-template-columns:repeat(5,43px); gap:0 5px; width:235px; }
.ach-solo-cell{ width:43px; } .ach-solo-cell .ach-tile{ width:43px; }
.ach-solo-nm{ font:600 7.5px 'Inter',sans-serif; color:var(--muted); text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
/* ВСПЛЫВАШКА «Достижение получено» — макет client/maket-dostizheniya-toast.html (его выбор): медальон справа, средний, 5 с,
столбиком одна под другой (разом до 4). Поверх всего, мимо нажатий. */
.ach-stack{ position:fixed; right:14px; top:40px; z-index:400; display:flex; flex-direction:column; align-items:flex-end; gap:6px; pointer-events:none; }
.ach-toast{ position:relative; display:flex; align-items:center; max-height:84px; animation:achIn .5s cubic-bezier(.2,.9,.3,1.2) both;
transition:transform .35s ease-in,opacity .35s ease-in,max-height .35s ease-in .1s,margin .35s ease-in .1s; }
.ach-toast.out{ transform:translateX(340px); opacity:0; max-height:0; margin-top:-6px; }
@keyframes achIn{ 0%{ transform:translateX(340px); } 100%{ transform:none; } }
.ach-toast .med{ width:56px; height:56px; flex:0 0 56px; border-radius:50%; display:grid; place-items:center; font-size:24px; position:relative; z-index:2;
background:radial-gradient(circle at 40% 30%,#f2d36a,#b8862a 60%,#6a4a12); border:2px solid #fff3c0;
box-shadow:inset 0 0 0 3px #8a6a2a,inset 0 0 0 4px #f2d36a,0 0 14px rgba(242,211,106,.6); animation:achFlip .6s ease-out .15s both; }
@keyframes achFlip{ 0%{ transform:rotateY(180deg) scale(.6); } 100%{ transform:none; } }
.ach-toast .card{ margin-left:-21px; padding:6px 12px 6px 28px; border-radius:0 10px 10px 0; width:222px;
background:linear-gradient(90deg,#2e2317,#1a130c); border:1.5px solid var(--gold); border-left:0; box-shadow:0 6px 16px rgba(0,0,0,.7); }
.ach-toast .h{ font:800 8px 'Inter',sans-serif; letter-spacing:1.3px; text-transform:uppercase; color:#5fbf6a; }
.ach-toast .n{ font:800 12px 'Cinzel',serif; letter-spacing:.6px; text-transform:uppercase; color:var(--gold-bright); white-space:nowrap; overflow:hidden; }
.ach-toast .c{ font-size:9px; line-height:1.25; color:var(--muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } /* условие в 2 строки, а не «…» */
.ach-toast .p{ display:inline-block; margin-top:2px; padding:0 7px; border-radius:8px; font:800 9.5px/14px 'Cinzel',serif; color:#3a2408; background:linear-gradient(#ffe9a0,#d9a92c); }
/* ===== РАСКОПКИ (22.09.2026, пятнадцатая сессия) — окно с кирки на Площади ====================================
Главное окно — список мест как зоны в Тюряге (эталон client/maket-raskopki-7.html, его слово «Супер»);
экран раскопки — поле слева, справа панель В5 «Алтарь» после его правок (client/maket-raskopki-9.html?v=5):
без значка артефакта, сверху «раскопок пройдено», ниже «за раскопку», тонкая строка артефакта, внизу «получено»
пятью ячейками на своих местах. Оформление временное (его правило: вся графика перерисуется после геймплея). */
#digBackdrop{ z-index:79; }
/* 28.09.2026, его слово по скрину: окно «чуть меньше» (760×348 → 720×330), кнопка «‹ Раскопки» крупнее, «чтобы легче нажимать» */
.dig-modal{ z-index:80; width:min(720px,94%); height:min(330px,367px); max-height:367px; padding:0; overflow:hidden; text-align:left;
display:flex; flex-direction:column; border:2px solid #d4a84b; background:linear-gradient(180deg,#221631 0%,#150c1a 60%,#1a1008 100%);
box-shadow:0 14px 40px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,220,140,.12); }
.dig-modal::before{ content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:
repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 2px, transparent 2px 6px),
radial-gradient(ellipse at 50% -20%, rgba(212,168,75,.18), transparent 55%); }
.dig-modal .modal-close{ z-index:9; width:24px; height:24px; top:7px; right:8px; border-radius:50%; font-weight:900; font-size:12px; color:#fff;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; }
.dig-top{ position:relative; height:38px; flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:0 40px 0 12px; border-bottom:1px solid #6a5220;
background:linear-gradient(180deg,rgba(60,40,10,.55),rgba(0,0,0,.35)); }
.dig-top::after{ content:''; position:absolute; left:0; right:0; top:38px; height:2px; background:linear-gradient(90deg,transparent,#d4a84b 20%,#ffe9a8 50%,#d4a84b 80%,transparent); opacity:.7; }
.dig-bk{ position:relative; z-index:9; font:800 12px 'Inter',sans-serif; color:#e6c976; padding:6px 12px; min-height:28px; border-radius:8px; border:1px solid #8a6a2a; background:linear-gradient(180deg,#3a2a10,#1a1008); cursor:pointer; white-space:nowrap; }
.dig-ttl{ font:900 13px 'Cinzel',serif; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-bright); white-space:nowrap; text-shadow:0 1px 0 #000, 0 0 12px rgba(255,224,122,.35); }
.dig-chip{ display:inline-flex; align-items:center; gap:4px; font:800 9px 'JetBrains Mono',monospace; color:#e9ddc3; padding:2px 7px; border-radius:8px; border:1px solid #8a6a2a; background:linear-gradient(180deg,#2a1c0c,#140c04); white-space:nowrap; }
.dig-en{ margin-left:auto; display:flex; align-items:center; gap:6px; font:800 12px 'JetBrains Mono',monospace; color:#ffe07a; padding:3px 10px; border-radius:9px; border:1px solid #d4a84b;
background:linear-gradient(180deg,#3a2a10,#120c04); box-shadow:0 0 10px rgba(255,224,122,.25); white-space:nowrap; }
.dig-en small{ font:600 9px 'Inter',sans-serif; color:var(--muted); }
.dig-en.flash{ animation:digEnFlash .5s; } @keyframes digEnFlash{ 0%{ background:#5a1a2a; } 100%{ background:rgba(0,0,0,.4); } }
.dig-body{ flex:1; min-height:0; display:flex; position:relative; }
.dig-toast{ position:absolute; left:50%; bottom:12px; transform:translateX(-50%); z-index:9; max-width:90%; background:rgba(20,12,6,.94); border:1px solid var(--gold); border-radius:9px;
padding:6px 12px; font:700 11px 'Inter',sans-serif; color:var(--parchment); white-space:nowrap; pointer-events:none; }
.dig-wait{ margin:auto; font:600 12px 'Inter',sans-serif; color:var(--muted); }
/* ---- список мест ---- */
.dig-rows{ flex:1; min-height:0; overflow-y:auto; display:flex; flex-direction:column; gap:7px; padding:8px 8px 8px 10px; }
.dig-rows::-webkit-scrollbar{ width:6px; } .dig-rows::-webkit-scrollbar-thumb{ background:#5a4a30; border-radius:3px; }
.dig-row{ flex:0 0 auto; display:flex; align-items:stretch; gap:8px; padding:6px 8px; border-radius:10px; border:1px solid #6a5220;
background:linear-gradient(90deg,rgba(60,42,14,.55),rgba(20,12,6,.55) 40%,rgba(20,12,20,.5)); box-shadow:inset 0 1px 0 rgba(255,220,140,.08), 0 3px 10px rgba(0,0,0,.4); }
.dig-row.lock{ opacity:.6; filter:saturate(.5); }
.dig-row .pl{ width:160px; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:3px; }
.dig-row .pl .nm{ font:800 9px 'Cinzel',serif; color:#ffe9a8; text-shadow:0 1px 0 #000; letter-spacing:.06em; text-transform:uppercase; line-height:1.1; text-align:center; max-width:160px; }
.dig-row .pl .pic{ width:100%; height:46px; border-radius:7px; border:1px solid #8a6a2a; display:flex; align-items:center; justify-content:center; font-size:30px; position:relative; overflow:hidden;
box-shadow:inset 0 0 18px rgba(0,0,0,.6), 0 0 0 2px rgba(212,168,75,.15); text-shadow:0 3px 6px rgba(0,0,0,.7); }
.dig-row .pl .pic::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 40%,rgba(0,0,0,.35)); pointer-events:none; }
.dig-row .pl .pic small{ position:absolute; right:4px; bottom:2px; z-index:1; font:700 7.5px 'JetBrains Mono',monospace; color:#ffe07a; background:rgba(0,0,0,.55); padding:1px 4px; border-radius:5px; border:1px solid #5a4520; }
.dig-row[data-k="1"] .pic{ background:radial-gradient(ellipse at 50% 120%,#e0b860,#8a6224 55%,#4a3210); }
.dig-row[data-k="2"] .pic{ background:radial-gradient(ellipse at 50% 120%,#6a4a9a,#2e1e4a 55%,#140c22); }
.dig-row[data-k="3"] .pic{ background:radial-gradient(ellipse at 50% 120%,#2f8a6a,#14402e 55%,#08201a); }
.dig-row[data-k="4"] .pic{ background:radial-gradient(ellipse at 50% 120%,#c88a3a,#6a3e12 55%,#2c1a08); }
.dig-row[data-k="5"] .pic{ background:radial-gradient(ellipse at 50% 120%,#3a4a8a,#1a2248 55%,#0a0e22); }
.dig-row[data-k="6"] .pic{ background:radial-gradient(ellipse at 50% 120%,#8a2a2a,#4a1010 55%,#220606); }
.dig-btn{ width:100%; display:flex; align-items:center; justify-content:center; gap:6px; padding:4px; border-radius:8px; border:1px solid #e6c976; cursor:pointer; white-space:nowrap;
background:linear-gradient(180deg,#8a6420,#4a3210 55%,#2c1f0c); color:#fff0d8; font:800 8.5px 'Cinzel',serif; letter-spacing:.04em;
box-shadow:0 2px 0 #1a1004, 0 0 10px rgba(255,224,122,.25), inset 0 1px 0 rgba(255,240,200,.35); text-shadow:0 1px 0 #000; }
.dig-btn:hover{ filter:brightness(1.12); }
.dig-btn.lk{ opacity:.6; cursor:not-allowed; }
.dig-btn.big{ width:auto; padding:10px 16px; font-size:12px; border-color:#7ed07a; background:linear-gradient(180deg,#2f8a3a,#175020 55%,#0c2c14); box-shadow:0 2px 0 #06180a, 0 0 12px rgba(126,208,122,.3), inset 0 1px 0 rgba(200,255,200,.3); }
.dig-ld{ flex:1; min-width:0; display:flex; align-items:center; gap:7px; padding:4px 6px; border-radius:9px; border:1px solid #4a3a18; background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.45)); }
.dig-ld .pf-ava{ width:40px; height:40px; flex:0 0 auto; font-size:20px; border-width:2px; border-radius:50%; border-color:#d4a84b; box-shadow:0 0 8px rgba(212,168,75,.35); }
.dig-ld.day .pf-ava{ border-color:#7ec8ff; box-shadow:0 0 8px rgba(126,200,255,.35); }
.dig-ld .av0{ width:40px; height:40px; flex:0 0 auto; border-radius:50%; border:2px dashed #5a4a30; display:flex; align-items:center; justify-content:center; font-size:18px; color:var(--muted); }
.dig-ld .tx{ min-width:0; display:flex; flex-direction:column; gap:1px; }
.dig-ld .lb{ display:inline-block; align-self:flex-start; padding:1px 6px; border-radius:6px; background:rgba(212,168,75,.15); border:1px solid rgba(212,168,75,.45); color:#ffe9a8; font:800 8px 'Cinzel',serif; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.dig-ld.day .lb{ background:rgba(126,200,255,.12); border-color:rgba(126,200,255,.45); color:#bfe4ff; }
.dig-ld .who{ font:700 9.5px 'Inter',sans-serif; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dig-ld .who small{ color:var(--muted); font-weight:600; }
.dig-ld .sc{ font:800 10px 'JetBrains Mono',monospace; color:#ffe07a; white-space:nowrap; text-shadow:0 0 6px rgba(255,224,122,.35); }
.dig-ld .sc small{ font:600 8px 'Inter',sans-serif; color:var(--muted); }
.dig-ld.empty{ opacity:.5; }
/* ---- экран раскопки: поле слева ---- */
.dig-left{ flex:1; min-width:0; display:flex; align-items:center; justify-content:center; padding:8px 8px 8px 14px; position:relative;
background:radial-gradient(ellipse at 50% 100%, rgba(212,168,75,.10), transparent 60%); }
/* его правило 23.09.2026 «ничего не должно прыгать»: столбцы minmax(0,1fr) не тянутся от длинного числа, ячейка 73×46 (с 28.09.2026, поле 480×262) вмещает самое длинное «9.99e+99999» при 11px; текст ужимает fitText */
.dig-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); grid-template-rows:repeat(5,minmax(0,1fr)); width:480px; height:262px; padding:8px; gap:5px; border:3px solid #b8862a; border-radius:12px;
background:radial-gradient(ellipse at 50% 0%, rgba(255,240,200,.18), transparent 50%), repeating-linear-gradient(135deg, rgba(0,0,0,.05) 0 3px, transparent 3px 7px), linear-gradient(180deg,#9a7430,#6a4a1a);
box-shadow:inset 0 0 26px rgba(0,0,0,.6), 0 0 0 2px #4a3210, 0 6px 18px rgba(0,0,0,.6); }
.dig-cell{ position:relative; border-radius:7px; cursor:pointer; display:flex; align-items:center; justify-content:center; user-select:none; min-height:0; min-width:0; overflow:hidden; border:1px solid #6a4a1a;
background:radial-gradient(circle at 35% 25%, #f0dca0, #cfa752 55%, #9a7430); box-shadow:inset 0 -4px 0 rgba(0,0,0,.28), inset 0 2px 0 rgba(255,245,210,.55), 0 2px 3px rgba(0,0,0,.4);
transition:transform .12s, box-shadow .12s; font-size:22px; text-shadow:0 2px 3px rgba(0,0,0,.45); }
.dig-cell:not(.open):hover{ transform:translateY(-2px) scale(1.04); box-shadow:inset 0 -4px 0 rgba(0,0,0,.28), inset 0 2px 0 rgba(255,245,210,.55), 0 0 12px rgba(255,224,122,.8); }
.dig-cell.open{ cursor:default; font:800 11px 'JetBrains Mono',monospace; color:#e9ddc3; flex-direction:column; gap:1px; line-height:1; text-shadow:none; white-space:nowrap;
background:radial-gradient(circle at 50% 60%,#3a2a12,#1c1208 75%); border-color:#3a2c14; box-shadow:inset 0 3px 8px rgba(0,0,0,.85); }
.dig-cell.open .i{ font-size:17px; }
.dig-cell.open.bone{ color:#ffe9a8; } .dig-cell.open.wpn{ color:#bfe4ff; } .dig-cell.open.en{ color:#ffe07a; } .dig-cell.open.gold{ color:#8a7a5a; } .dig-cell.open.gold .i{ opacity:.55; }
.dig-cell.open.last{ animation:digReveal .35s cubic-bezier(.2,.9,.3,1.3), digLastGlow 1.4s ease-out; border-color:#ffe07a; }
@keyframes digReveal{ 0%{ transform:scale(.6) rotateX(70deg); opacity:.2;} 100%{ transform:none; opacity:1;} }
@keyframes digLastGlow{ 0%{ box-shadow:inset 0 3px 8px rgba(0,0,0,.85), 0 0 18px rgba(255,224,122,.95);} 100%{ box-shadow:inset 0 3px 8px rgba(0,0,0,.85), 0 0 0 rgba(255,224,122,0);} }
.dig-pop{ position:absolute; font:800 11px 'JetBrains Mono',monospace; color:#ffe07a; text-shadow:0 1px 3px #000; white-space:nowrap; pointer-events:none; z-index:6; transform:translateX(-50%); animation:digPopUp 1.1s ease-out forwards; }
.dig-pop.bad{ color:#ff5a6a; }
@keyframes digPopUp{ 0%{ opacity:0; transform:translate(-50%,6px);} 15%{ opacity:1;} 100%{ opacity:0; transform:translate(-50%,-26px);} }
/* ---- ЭКРАН РАСКОПКИ МЕНЬШЕ (его слово 05.10.2026, 44-я: «ячейки очень большие на весь экран»): окно 620×290 вместо 720×330,
поле 392×214 (ячейка ≈ 59×37 вместо 73×46), панель справа 196, цифра 32 вместо 40. Класс .field ставит renderDig. ---- */
.dig-modal.field{ width:min(620px,94%); height:min(290px,367px); }
.dig-modal.field .dig-left{ padding:6px 6px 6px 10px; }
.dig-modal.field .dig-grid{ width:392px; height:214px; padding:6px; gap:4px; border-width:2px; border-radius:10px; }
.dig-modal.field .dig-cell{ font-size:18px; border-radius:6px; }
.dig-modal.field .dig-cell.open{ font-size:10px; } .dig-modal.field .dig-cell.open .i{ font-size:14px; }
.dig-modal.field .dig-right{ width:196px; padding:6px 8px; gap:3px; }
.dig-modal.field .dig-dn{ padding:4px 8px 3px; } .dig-modal.field .dig-dn .n{ font-size:32px; }
.dig-modal.field .dig-rw .v{ font-size:15px; }
/* Окно «Раскопка завершена» в экране 620×290 (05.10.2026, 45-я): карточка была 351px и обрезалась
вместе с кнопкой «Новая раскопка» (overflow:hidden экрана) — ужата, чтобы влезать в 286px. */
.dig-modal.field .dig-done .card{ width:380px; gap:3px; padding:6px 12px; max-height:calc(100% - 8px); overflow:auto; }
.dig-modal.field .dig-done .hero{ font-size:22px; }
.dig-modal.field .dig-done h4{ font-size:13px; }
.dig-modal.field .dig-done .rw{ padding:1px 0; }
.dig-modal.field .dig-done .all{ padding:3px 5px; } .dig-modal.field .dig-done .all .t{ margin-bottom:2px; }
.dig-modal.field .dig-done .chips{ gap:3px; } .dig-modal.field .dig-done .chips span{ padding:2px 6px; }
.dig-modal.field .dig-done .tot{ padding:3px 5px; } .dig-modal.field .dig-done .tot small{ margin-top:0; }
.dig-modal.field .dig-done .dig-btn.big{ padding:7px 14px; }
/* ---- экран раскопки: панель справа (В5 «Алтарь» после его правок) ---- */
.dig-right{ width:214px; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 10px; position:relative; overflow:hidden; border-left:1px solid #5a4520;
background:radial-gradient(circle at 50% 18%, rgba(255,224,122,.16), transparent 34%), repeating-conic-gradient(from 0deg at 50% 18%, rgba(255,224,122,.045) 0 6deg, transparent 6deg 12deg), linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.35)); }
.dig-dn{ display:flex; flex-direction:column; align-items:center; padding:6px 10px 4px; width:100%; border-radius:9px; border:1px solid #8a6a2a; background:linear-gradient(180deg,rgba(60,42,14,.55),rgba(0,0,0,.35)); box-shadow:0 0 12px rgba(255,224,122,.15); }
.dig-dn .t{ font:800 8px 'Cinzel',serif; letter-spacing:.16em; text-transform:uppercase; color:#c9a24a; }
.dig-dn .n{ font:900 40px 'Cinzel',serif; color:#ffe07a; line-height:1.05; text-shadow:0 2px 0 #000, 0 0 16px rgba(255,224,122,.55); }
.dig-dn .s{ font:600 9.5px 'Inter',sans-serif; color:var(--muted); } .dig-dn .s b{ color:#ffe07a; font-family:'JetBrains Mono',monospace; }
.dig-rw{ margin-top:6px; display:flex; flex-direction:column; align-items:center; }
.dig-rw .t{ font:800 8px 'Cinzel',serif; letter-spacing:.16em; text-transform:uppercase; color:#c9a24a; }
.dig-rw .v{ font:900 17px 'JetBrains Mono',monospace; color:#ffe07a; text-shadow:0 0 12px rgba(255,224,122,.6), 0 1px 0 #000; }
.dig-artl{ width:100%; margin-top:2px; }
.dig-artl .t{ font:700 8.5px 'Inter',sans-serif; color:var(--muted); text-align:center; margin-bottom:2px; }
.dig-artl .bar{ height:6px; border-radius:3px; background:rgba(0,0,0,.55); border:1px solid #5a4520; overflow:hidden; }
.dig-artl .bar i{ display:block; height:100%; background:linear-gradient(90deg,#b8862a,#ffe07a); }
.dig-sack{ margin-top:auto; width:100%; border-radius:9px; border:1px solid #5a4520; background:rgba(0,0,0,.4); padding:5px 8px; }
.dig-sack .t{ font:800 8px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); text-align:center; margin-bottom:3px; }
.dig-got{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap:3px; }
.dig-got .gi{ display:flex; align-items:center; justify-content:space-between; gap:3px; padding:2px 5px; border-radius:5px; background:rgba(255,255,255,.04); font:800 9.5px 'JetBrains Mono',monospace; white-space:nowrap; min-width:0; color:var(--parchment); }
.dig-got .gi:nth-child(4){ grid-column:1; } .dig-got .gi:nth-child(5){ grid-column:2 / 4; }
.dig-got .gi.e{ opacity:.35; }
.dig-got.kr .gi:nth-child(5){ grid-column:auto; } /* Красик шестой (02.10.2026) — сетка 3 × 2 */
.dig-kr{ color:#c090f0; } /* осколки Красика — цвет «✦ осколочный» из «Героев» */
/* ---- окно конца раскопки ---- */
/* 54-я (его слово «чини»): ✕ и «‹ Раскопки» стоят над затемнением (z-index 9) — из «Раскопка завершена!» можно выйти, не начиная новую */
.dig-done{ position:absolute; inset:0; z-index:8; background:rgba(8,4,12,.78); display:flex; align-items:center; justify-content:center; }
.dig-done .card{ width:340px; border:2px solid #ffe07a; border-radius:12px; background:linear-gradient(180deg,#3a2a48,#160c1c); padding:12px 14px; display:flex; flex-direction:column; gap:7px; text-align:center;
box-shadow:0 0 40px rgba(255,224,122,.25), 0 10px 30px rgba(0,0,0,.8); animation:digCardIn .4s cubic-bezier(.2,.9,.3,1.2); }
@keyframes digCardIn{ 0%{ transform:scale(.7); opacity:0;} 100%{ transform:none; opacity:1;} }
.dig-done h4{ margin:0; font:900 15px 'Cinzel',serif; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-bright); text-shadow:0 0 14px rgba(255,224,122,.5); }
.dig-done .hero{ font-size:40px; line-height:1; filter:drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
.dig-done .sm{ font:600 10px 'Inter',sans-serif; color:var(--muted); }
.dig-done .rw{ display:flex; justify-content:space-between; font:600 10.5px 'Inter',sans-serif; padding:2px 0; border-bottom:1px dashed #4a3a18; color:var(--parchment); }
.dig-done .rw b{ color:#ffe07a; font-family:'JetBrains Mono',monospace; }
.dig-done .tot{ padding:6px; border-radius:8px; border:1px solid #3a2c50; background:rgba(0,0,0,.35); font:800 11px 'Inter',sans-serif; color:var(--parchment); }
.dig-done .tot.yes{ border-color:#9be07a; color:#9be07a; animation:digTotPulse 1.2s ease-in-out infinite; } .dig-done .tot.no{ color:#ff9a6a; }
@keyframes digTotPulse{ 0%,100%{ box-shadow:0 0 12px rgba(155,224,122,.4);} 50%{ box-shadow:0 0 22px rgba(155,224,122,.9);} }
.dig-done .tot small{ display:block; font:600 9px 'Inter',sans-serif; color:var(--muted); margin-top:2px; }
.dig-done .dig-btn.big{ align-self:center; }
/* «Всего за раскопку» в окне конца (его слово 22.09.2026): фишки клетки + награда */
.dig-done .card{ gap:6px; padding:10px 14px; }
.dig-done .hero{ font-size:34px; }
.dig-done .all{ padding:5px 6px; border-radius:8px; border:1px solid #5a4520; background:rgba(0,0,0,.3); }
.dig-done .all .t{ font:800 8px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase; color:#c9a24a; margin-bottom:4px; }
.dig-done .chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
.dig-done .chips span{ padding:3px 8px; border-radius:7px; border:1px solid #8a6a2a; background:linear-gradient(180deg,#3a2a10,#1a1008); font:800 10px 'JetBrains Mono',monospace; color:#ffe9a8; white-space:nowrap; box-shadow:0 0 6px rgba(255,224,122,.15); }
/* окно Возвышения поверх профиля героя (24.09.2026): и затемнение, и окно — выше профиля */
#promoteBackdrop.over{ z-index:63; }
#promoteModal.over{ z-index:64; }
/* ===== ПРОФИЛЬ ГЕРОЯ СО ШМОТОМ (24.09.2026, js/25-shmot.js; вид — его выбор client/maket-shmot-5.html) ===== */
.sh-modal{ width:min(800px,96%); height:min(374px,96%); padding:0; display:flex; flex-direction:column; text-align:left;
background:linear-gradient(180deg,#221a13,#15110d); border:2px solid var(--gold); box-shadow:0 12px 40px rgba(0,0,0,.8); overflow:hidden; }
.sh-modal .modal-close{ top:4px; right:6px; width:24px; height:24px; }
.sh-top{ flex:0 0 auto; height:32px; display:flex; align-items:center; gap:10px; padding:0 40px 0 12px; border-bottom:1px solid var(--border); background:rgba(0,0,0,.25); }
.sh-ttl{ font:900 13px Georgia,serif; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-bright); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh-sub{ font-size:10.5px; color:var(--muted); white-space:nowrap; }
.sh-body{ flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 273px minmax(0,1fr); gap:12px; padding:6px 12px 8px; }
.sh-left, .sh-right{ display:flex; flex-direction:column; gap:7px; min-width:0; padding-top:4px; }
.sh-hd{ display:flex; gap:10px; align-items:center; }
.sh-pt{ width:62px; height:62px; flex-shrink:0; }
.sh-pt.lit{ box-shadow:0 0 14px rgba(255,224,122,.6); border-radius:12px; }
.sh-who{ min-width:0; }
.sh-nm{ font:900 15px Georgia,serif; color:#f0e0b0; margin-bottom:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* звёзды жёлтые (его слово 24.09.2026; следующие ступени потом — синие, красные): полученная ★ — залитая со свечением, пустая ☆ — жёлтый контур */
.sh-stars{ display:flex; gap:2px; font-size:15px; color:#ffd84a; margin-top:3px; }
/* кнопка обмена лишних ✦ → 🦴 над «Собери все 9» (его слово 07.10.2026: жёлтенькая, короче и шире) */
.sh-swap{ margin-top:auto; width:50%; height:28px; font:800 11px 'JetBrains Mono',monospace; color:#2a1a08; background:linear-gradient(180deg,#ffe28a,#d2a53c); border:1px solid #fff0b0; border-radius:6px; padding:0 5px; cursor:pointer; white-space:nowrap; overflow:hidden; box-shadow:0 2px 5px rgba(0,0,0,.4); }
.sh-swap:active{ transform:scale(.98); }
.sh-swap + .sh-big{ margin-top:0; }
.sh-stars .on{ color:#ffd84a; text-shadow:0 0 6px rgba(255,216,74,.7); }
.sh-sts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px 10px; font:600 11px 'JetBrains Mono',monospace; color:#d8c8a4;
padding:6px 8px; border:1px solid var(--border); border-radius:9px; background:rgba(0,0,0,.25); }
.sh-sts span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh-sts .atk{ color:#ff9a6a; } .sh-sts .def{ color:#7ab0ff; } .sh-sts .hp{ color:#7ee0a0; } .sh-sts .spd{ color:#e0c060; }
.sh-sts .dps{ grid-column:1/3; }
.sh-big{ margin-top:auto; font:800 12.5px Georgia,serif; color:#f0d890; line-height:1.3; }
.sh-big .g{ color:#ffe07a; }
.sh-promote{ margin-top:4px; padding:8px; font-size:12px; }
.sh-promote:disabled{ opacity:.55; cursor:default; }
.sh-rt{ font:900 13px Georgia,serif; color:#ffe07a; }
.sh-bar{ height:8px; border-radius:5px; background:#120e0a; border:1px solid #3a2e20; overflow:hidden; }
.sh-bar i{ display:block; height:100%; background:linear-gradient(90deg,#caa44c,#ffe07a); }
.sh-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px 8px; font-size:11px; }
.sh-list span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh-list .y{ color:#9be07a; } .sh-list .n{ color:#6b6354; }
.sh-note{ font-size:10.5px; color:var(--muted); }
.sh-bonus{ padding:7px 9px; border:1px solid #6a5a2a; border-radius:9px; background:rgba(255,224,122,.06); font-size:11px; line-height:1.45; }
.sh-bonus b{ color:#ffe07a; }
.sh-btn{ margin-top:auto; font:800 13px system-ui,sans-serif; padding:9px 14px; border-radius:9px; text-align:center; border:none; }
.sh-btn.off{ background:#3a342a; color:#6b6354; }
.sh-btn.worn{ background:rgba(255,224,122,.12); border:1px solid #ffe07a; color:#ffe07a; }
.sh-btn.go{ background:linear-gradient(180deg,#ffe07a,#caa44c); color:#2a1a08; border:1px solid #fff0b0; cursor:pointer; box-shadow:0 0 12px rgba(255,224,122,.5); }
.sh-btn.go:active{ transform:scale(.97); }
/* его картинка и метки поверх ячеек (в % от картинки 853×1024) */
.sh-inv{ position:relative; width:273px; height:328px; align-self:center; justify-self:center; border-radius:6px; overflow:hidden;
background:url(img/inventar-grobnica.webp) center/100% 100% no-repeat; box-shadow:0 4px 16px rgba(0,0,0,.6); } /* 59-я: его лист «гробница», ячейки пустые */
.sh-inv.done{ box-shadow:0 0 0 2px #ffe07a, 0 0 22px rgba(255,224,122,.55); }
.sh-s{ position:absolute; border-radius:3px; display:flex; align-items:center; justify-content:center; }
.sh-inv-title{ position:absolute; left:24%; right:24%; top:6%; height:7.5%; display:flex; align-items:center; justify-content:center;
font:800 10px/1 'Cinzel',serif; letter-spacing:.06em; text-transform:uppercase; color:#ffe07a; text-shadow:0 1px 2px #000; pointer-events:none; } /* заголовок на плашке листа (его 2А) */
.sh-s.have::after{ content:'✓'; position:absolute; right:-4px; bottom:-4px; width:14px; height:14px; border-radius:50%; background:#3fa04a; color:#fff;
font:900 9px/14px system-ui; text-align:center; border:2px solid #2a1a0e; }
.sh-s.miss{ outline:2px dashed #7a6a3a; outline-offset:-3px; }
.sh-s.miss > *{ filter:grayscale(1) brightness(.35); } /* нет вещи — тёмный силуэт (ячейки на листе пустые, вещь кладём сами) */
.sh-s.worn{ box-shadow:0 0 0 2px #ffe07a, 0 0 10px rgba(255,224,122,.8); }
/* оружие своего уровня в ячейке «Инвентаря фараона» (59-я): закрывает нарисованный на листе хопеш, тёмный фон ячейки как на листе */
.sh-pic{ position:absolute; inset:10% 11%; background:center/contain no-repeat; } /* вещь своего уровня в пустой ячейке листа */
/* ===== БАЗАР (01.10.2026, вариант А макета client/maket-bazar-6.html) ===== */
/* Окно-картинка с лавками снесено 05.10.2026 (его слово «убери переход») */
/* Окно лавки: переменные вида 6 «Как в игре сейчас» */
.bz-lavka{ --bz-card:linear-gradient(180deg,rgba(44,30,66,.62),rgba(24,16,38,.62)); --bz-cbd:#4a3868; --bz-txt:#f0e6cc; --bz-sub:#9a8cb0; --bz-glow:rgba(126,96,230,.38);
--bz-pat:radial-gradient(circle at 22% 24%,rgba(255,255,255,.1) 0 1px,transparent 1.5px) 0 0/46px 40px; }
.bz-lavka .bz-ttl{ display:flex; align-items:center; gap:5px; white-space:nowrap; color:var(--gold-bright); }
.bz-lavka .shop-tabs{ gap:4px; } .bz-lavka .shop-tab{ padding:5px 9px; gap:7px; } .bz-lavka .shop-tab .st-ic{ display:flex; filter:grayscale(.4); } .bz-lavka .shop-tab.active .st-ic{ filter:none; }
.bz-lavka .shop-cur{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3px 6px; font-size:10.5px; padding:5px 7px; }
.bz-lavka .shop-cur span{ display:flex; align-items:center; gap:3px; min-width:0; } .bz-lavka .shop-cur svg{ flex-shrink:0; }
.bz-lavka .shop-cur b{ font-weight:700; min-width:0; flex:1; white-space:nowrap; overflow:hidden; }
.bz-body{ position:relative; overflow:hidden; }
.bz-lavka .modal-close{ z-index:6; } /* крестик лавки поверх .bz-body (position:relative перекрывал его — 36-я, «крестик не работает») */
/* сетки: 8 ячеек 4 × 2 (Бриллианты/Кости), 4 ячейки 2 × 2 (Прочее — листается вбок, Акции), ряд (Оружие/Сундуки/Герои) */
.bz-grid{ height:100%; display:grid; gap:9px 10px; row-gap:14px; overflow-x:auto; overflow-y:hidden; padding:10px 10px 5px 0; scrollbar-width:thin; scrollbar-color:#d9b45a rgba(0,0,0,.3); }
.bz-grid.g8{ grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:minmax(0,1fr) minmax(0,1fr); grid-auto-flow:row; overflow:visible; padding-right:0; }
.bz-grid.two{ grid-template-rows:minmax(0,1fr) minmax(0,1fr); grid-auto-flow:column; }
.bz-grid.g4{ grid-auto-columns:calc(50% - 5px); padding-right:0; }
.bz-grid.row1{ grid-template-rows:minmax(0,1fr); grid-auto-flow:column; grid-auto-columns:188px; justify-content:center; }
.bz-grid.row1.scroll{ justify-content:start; }
.bz-grid.bund{ grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:minmax(0,1fr) minmax(0,1fr); overflow:visible; padding:8px 0 4px; gap:10px; }
.bz-more{ position:absolute; right:22px; top:1px; bottom:12px; width:38px; border-radius:0 11px 11px 0; background:linear-gradient(90deg,transparent,rgba(16,8,2,.9)); display:flex; align-items:center; justify-content:flex-end; padding-right:7px; font:900 20px Arial; color:var(--gold-bright); pointer-events:none; }
/* карточка */
.bz-card{ position:relative; border-radius:12px; border:1px solid var(--bz-cbd); min-width:0; min-height:0; display:flex; flex-direction:column; color:var(--bz-txt); background:var(--bz-card); box-shadow:0 4px 10px rgba(0,0,0,.45); transition:transform .12s, box-shadow .12s; }
.bz-card:hover{ border-color:#8a6ad8; box-shadow:0 0 16px rgba(126,96,230,.55); }
.bz-card.empty{ background:none; border:1px dashed #3a2e20; box-shadow:none; } .bz-card.empty:hover{ border-color:#3a2e20; box-shadow:none; }
.bz-t{ height:24px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font:800 12px Inter,Arial,sans-serif; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 6px; }
.bz-mid{ flex:1; min-height:0; position:relative; display:flex; align-items:center; justify-content:center; border-radius:11px 11px 0 0; background:radial-gradient(ellipse at 50% 52%,var(--bz-glow),transparent 62%),var(--bz-pat); }
.bz-art{ height:84%; aspect-ratio:120/92; filter:drop-shadow(0 5px 5px rgba(0,0,0,.5)); display:block; }
.bz-q{ position:absolute; left:0; right:0; bottom:6px; display:flex; align-items:center; justify-content:center; gap:4px; font:800 17px 'JetBrains Mono',monospace; color:var(--bz-txt); text-shadow:0 1px 2px #000; white-space:nowrap; min-width:0; padding:0 6px; }
.bz-q small{ font:700 11.5px Inter,Arial; color:var(--bz-sub); display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:3px; white-space:normal; text-align:center; line-height:1.25; min-width:0; }
.bz-q small b{ color:var(--parchment); }
.bz-q.col{ flex-direction:column; gap:1px; } .bz-qn{ display:flex; align-items:center; gap:4px; min-width:0; }
.bz-al{ font:800 11px 'JetBrains Mono',monospace; color:#ffb347; text-shadow:0 1px 2px #000; }
.two .bz-mid{ gap:4px; padding:0 6px; } .two .bz-art{ height:auto; width:46%; max-height:100%; flex-shrink:0; }
.two .bz-q{ position:static; font-size:16px; flex:1; min-width:0; padding:0; align-items:center; }
.two .bz-qn, .two .bz-al{ max-width:100%; overflow:hidden; white-space:nowrap; } .two .bz-qn{ justify-content:center; } .two .bz-qn svg{ flex-shrink:0; }
.two .bz-q small{ white-space:normal; text-align:center; justify-content:center; flex-wrap:wrap; }
.g8 .bz-mid{ padding-top:6px; }
.bz-p{ height:32px; flex-shrink:0; margin:4px 8px 8px; border-radius:8px; display:flex; align-items:center; justify-content:center; gap:5px; background:rgba(255,255,255,.07); border:1px solid #4a3a24; font:800 14px 'JetBrains Mono',monospace; color:#e8dcc0; white-space:nowrap; cursor:pointer; min-width:0; overflow:hidden; }
.bz-p:active{ transform:scale(.97); }
.bz-p.gold, .bz-p.best, .bz-card.best .bz-p{ background:linear-gradient(180deg,#f0d060,#caa44c); color:#2a1410; border-color:#e6c976; }
.bz-p.done{ background:linear-gradient(180deg,#b4f08e,#3e9a3a); border-color:#1e5a1e; color:#0e3a0e; cursor:default; }
.bz-p.lockp{ cursor:default; opacity:.85; }
/* Лавка «Герои» — ВИТРИНА + СПИСОК (его выбор 02.10.2026) */
@keyframes bzhGlow{ 0%,100%{ box-shadow:0 0 8px #f0c44055; } 50%{ box-shadow:0 0 20px #f0c440bb; } }
/* 69-я 15.10.2026: «ЛЕНТА ГЕРОЕВ» Рынка (его выбор, client/maket-geroi-rynok.html вариант В) — песчаник с золотом, как Сундуки; .bzh ниже — прежний вид, не используется */
.bzr{ height:100%; display:flex; flex-direction:column; gap:6px; }
.bzr-top{ flex:1; min-height:0; display:flex; gap:6px; }
.bzr-hero{ flex:0 0 150px; position:relative; overflow:hidden; cursor:pointer; border-radius:8px; border:1px solid #8a6a2a; display:flex; align-items:center; justify-content:center;
background:radial-gradient(ellipse at 50% 55%,rgba(255,200,90,.28),transparent 70%),linear-gradient(180deg,#2a1e12,#120c06); }
.bzr-hero.fon{ background:var(--lufon) center/cover no-repeat; }
.bzr-hero.lock .bzh-port, .bzr-hero.lock .lu-hfull{ filter:grayscale(.75) brightness(.6); }
.bzr-tag{ position:absolute; left:6px; top:6px; z-index:2; font:800 8.5px Georgia,serif; letter-spacing:.4px; color:#2a1606; background:linear-gradient(180deg,#ffe28a,#c8962c); padding:2px 6px; border-radius:6px; box-shadow:0 1px 3px #000; }
.bzr-tag.done{ background:linear-gradient(180deg,#a8f0b0,#4a9a5a); } .bzr-tag.lock{ background:#2a2030; color:#c8b8e0; border:1px solid #5a4a70; }
.bzr-info, .bzr-rib{ position:relative; background:linear-gradient(180deg,#2a2016,#16100a); border:2px solid #4a3a22; border-radius:10px; box-shadow:inset 0 0 0 1px #8a6a3a55, inset 0 0 30px #000, 0 0 12px rgba(230,180,90,.18); }
.bzr-info::before{ content:'𓂀 𓋹 𓆣 𓁹 𓃣 𓋹 𓂀 𓆣 𓁹 𓃣 𓋹 𓂀 𓆣 𓁹'; position:absolute; left:10px; right:10px; top:1px; font-size:9px; letter-spacing:6px; color:#e6b860; opacity:.5; text-shadow:0 0 6px #e6b860; white-space:nowrap; overflow:hidden; text-align:center; pointer-events:none; }
.bzr-info{ flex:1; min-width:0; padding:12px 14px 4px; display:flex; flex-direction:column; gap:5px; }
.bzr-nm{ font:800 17px Georgia,serif; color:#ffe08a; text-shadow:0 1px 3px #000; line-height:1.1; }
.bzr-cls{ font:600 10.5px Inter,Arial,sans-serif; color:#c8b898; }
.bzr-desc{ font:italic 600 10.5px Georgia,serif; color:#d8c8a8; line-height:1.3; }
.bzr-bon{ display:flex; flex-wrap:wrap; gap:4px; }
.bzr-st{ display:grid; grid-template-columns:minmax(0,1.2fr) repeat(4,minmax(0,1fr)); gap:4px; } /* характеристики, как «Сила героя» */
.bzr-s{ display:flex; flex-direction:column; align-items:center; justify-content:center; height:30px; min-width:0; border-radius:7px; background:rgba(0,0,0,.4); border:1px solid #4a3a22; line-height:1.05; }
.bzr-s.pow{ border-color:#c8963a; background:rgba(80,55,15,.45); }
.bzr-s b{ display:flex; align-items:center; gap:2px; font:800 11.5px Georgia,serif; color:#ffe9b0; white-space:nowrap; max-width:100%; } .bzr-s b img{ width:14px; height:14px; object-fit:contain; }
.bzr-s small{ font:600 8px Inter,Arial,sans-serif; color:#a89878; }
.bzr-gift{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.bzr-cap{ font:700 9.5px Inter,Arial,sans-serif; color:#c8b898; letter-spacing:.3px; }
.bzr-p{ display:inline-flex; align-items:center; gap:3px; height:22px; padding:0 7px 0 3px; border-radius:7px; background:rgba(0,0,0,.45); border:1px solid #6a5530; font:800 11px Georgia,serif; color:#ffe9b0; white-space:nowrap; }
.bzr-p.w{ border-color:#c8963a; color:#ffe08a; } .bzr-pi{ width:18px; height:18px; object-fit:contain; }
.bzr-end{ margin-top:auto; display:flex; justify-content:flex-end; }
.bzr-buy{ display:inline-flex; align-items:center; justify-content:center; gap:5px; height:34px; padding:0 18px; border-radius:17px; font:900 13px Georgia,serif; color:#2a1606; cursor:pointer; white-space:nowrap;
background:linear-gradient(180deg,#ffe28a,#d9a63a 55%,#a8761c); border:1px solid #ffe9a0; box-shadow:0 0 0 2px #5a3a08, 0 3px 0 #5a3a08, 0 0 14px rgba(255,200,90,.45); }
.bzr-buy:active{ transform:translateY(2px); }
/* 69-я: его кнопка «Купить», вариант 2 со скарабеями (img/rynok/knopka-kupit.webp 434×160): слово — золото 10–52 %, цена — слот 53–89 % × 25–76 % */
.bzr-buy{ position:relative; width:162px; height:60px; padding:0; border:0; border-radius:27px; box-shadow:none; background:url(img/rynok/knopka-kupit.webp) center/100% 100% no-repeat; filter:drop-shadow(0 0 8px rgba(255,200,90,.45)) drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.bzr-buy .t{ position:absolute; left:10%; width:42%; top:0; bottom:0; display:flex; align-items:center; justify-content:center; font:900 13px Georgia,serif; color:#3a1a06; text-shadow:0 1px 0 rgba(255,240,190,.7); white-space:nowrap; }
.bzr-buy .p{ position:absolute; left:53.5%; width:36%; top:25%; height:51%; display:flex; align-items:center; justify-content:center; gap:1px; font:800 10.5px Georgia,serif; color:#ffe9a0; white-space:nowrap; }
.bzr-buy .p .bzr-gem{ width:12px; height:12px; }
.bzr-buy.lock .t{ font-size:11.5px; }
.bzr-s b img{ width:16px !important; height:16px !important; }
.bzr-buy.lock{ filter:grayscale(.6) brightness(.75); }
.bzr-gem{ width:15px; height:15px; object-fit:contain; flex:none; }
.bzr-done{ font:800 13px Georgia,serif; color:#9ee0a0; align-self:center; }
.bzr-rib{ flex:0 0 84px; padding:8px 10px; display:flex; gap:8px; align-items:center; justify-content:center; overflow-x:auto; scrollbar-width:none; }
.bzr-ch{ width:76px; height:66px; flex:none; border-radius:16px 16px 6px 6px; position:relative; overflow:hidden; border:1px solid #5a4422; cursor:pointer; background:#0e0a06; }
.bzr-ch .hero-portrait{ display:block; width:100%; height:100%; }
.bzr-ch .hero-portrait svg{ width:100%; height:100%; display:block; }
.bzr-ch.lock > img, .bzr-ch.lock > .hero-portrait{ filter:grayscale(.7) brightness(.55); }
.bzr-ch.sel{ border:2px solid #ffe08a; box-shadow:0 0 12px rgba(255,210,120,.6); }
.bzr-pr{ position:absolute; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; gap:2px; padding:8px 0 2px; font:800 10.5px Georgia,serif; color:#ffe9b0; white-space:nowrap; background:linear-gradient(transparent,rgba(0,0,0,.9)); }
.bzr-pr .bzr-gem{ width:12px; height:12px; } .bzr-pr.done{ color:#9ee0a0; font-size:13px; }
.bzh{ height:100%; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:10px; padding:8px 0 6px; }
.bzh-big{ position:relative; border-radius:12px; border:2px solid #f0c440; background:radial-gradient(circle at 50% 35%, #6a4a12, #1a130a 75%);
display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:22px 10px 8px; cursor:pointer; overflow:hidden; min-height:0; animation:bzhGlow 2.6s ease-in-out infinite; }
.bzh-big.done{ border-color:#5aa870; background:radial-gradient(circle at 50% 35%, #2a5a3a, #0e1a12 75%); animation:none; }
.bzh-big.lock{ border-color:#5a4a30; background:radial-gradient(circle at 50% 35%, #3a3020, #120e08 75%); animation:none; }
.bzh-tag{ position:absolute; top:7px; left:10px; font:800 10px Inter,Arial; letter-spacing:.12em; color:#f0c440; }
.bzh-big.done .bzh-tag{ color:#8ef0a8; } .bzh-big.lock .bzh-tag{ color:#b8ab90; }
.bzh-port{ width:112px; height:112px; min-height:112px; border-radius:14px; overflow:hidden; border:2px solid #ffe0a0; flex:none; filter:drop-shadow(0 8px 10px #000a); }
.bzh-port svg{ width:100%; height:100%; display:block; }
.bzh-big.lock .bzh-port{ filter:grayscale(.9) brightness(.6); }
.bzh-nm{ font:800 19px Georgia,serif; color:#ffe08a; text-shadow:0 0 10px #f0c44066; white-space:nowrap; }
.bzh-bn{ font-size:10.5px; color:var(--parchment); opacity:.85; text-align:center; line-height:1.3; }
.bzh-big .bz-hpr{ margin:2px 0 0; }
.bzh-list{ display:flex; flex-direction:column; gap:4px; min-height:0; overflow-y:auto; scrollbar-width:thin; }
.bzh-row{ display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:8px; border:1px solid #3a2e1c; border-radius:9px; padding:3px 8px 3px 4px; background:rgba(0,0,0,.3); min-height:40px; cursor:pointer; }
.bzh-row.next{ border-color:#c8a040; }
.bzh-row.sel{ border-color:#f0c440; background:#3a2a0e; box-shadow:0 0 10px #f0c44055; }
.bzh-mini{ width:34px; height:34px; border-radius:7px; overflow:hidden; border:1.5px solid #8a6a2a; }
.bzh-mini svg{ width:100%; height:100%; display:block; }
.bzh-row.lock .bzh-mini{ filter:grayscale(.9) brightness(.6); }
.bzh-rn{ font:700 13px Georgia,serif; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bzh-row .bz-hpr{ margin:0; height:auto; font-size:15px; }
.bzh-row .bz-hpr.done{ font-size:13px; }
/* Герои Рынка — цена простой надписью (его слово 02.10.2026, по скрину): крупное число с обводкой и кристалл сбоку */
.bz-hpr{ display:flex; align-items:center; gap:5px; margin:2px 12px 10px; height:30px; font:900 22px Georgia,serif; color:#ffd86a; white-space:nowrap;
text-shadow:-1.5px -1.5px 0 #2a1205, 1.5px -1.5px 0 #2a1205, -1.5px 1.5px 0 #2a1205, 1.5px 1.5px 0 #2a1205, 0 3px 6px #000; }
.bz-hpr svg{ filter:drop-shadow(0 0 4px #7ab8ffaa) drop-shadow(0 2px 2px #000); flex:none; }
.bz-hpr.lock{ color:#b8ab90; } .bz-hpr.lock svg{ filter:grayscale(1) drop-shadow(0 2px 2px #000); }
.bz-hpr.done{ color:#8ef0a8; font-size:18px; }
/* Герои Рынка — «Табличка» (его выбор 02.10.2026, вариант Г): египетская табличка с анкхами, следующий герой светится */
@keyframes bzTabGlow{ 0%,100%{ box-shadow:inset 0 0 0 2px #f3e3c0, 0 0 4px #f0c44055; } 50%{ box-shadow:inset 0 0 0 2px #f3e3c0, 0 0 14px #f0c440cc; } }
.bz-p.tab{ position:relative; height:34px; border-radius:4px; padding:0 22px; font:900 15px Georgia,serif; color:#4a2a08;
background:linear-gradient(#e9cf95,#c9a46a); border:2px solid #7a3a08; box-shadow:inset 0 0 0 2px #f3e3c0, 0 3px 8px #0008; }
.bz-p.tab::before, .bz-p.tab::after{ content:'☥'; position:absolute; top:50%; transform:translateY(-50%); font-size:13px; color:#7a3a08; }
.bz-p.tab::before{ left:6px; } .bz-p.tab::after{ right:6px; }
.bz-p.tab.next{ animation:bzTabGlow 2.4s ease-in-out infinite; }
.bz-p.tab.lockp{ filter:grayscale(.8) brightness(.6); opacity:1; }
.bz-p.tab.done{ background:linear-gradient(#a8e8b8,#5aa870); color:#0a3a18; border-color:#2a6a3a; font-size:14px; }
.two .bz-p{ height:25px; font-size:12.5px; margin:3px 5px 5px; }
.bz-bdg{ position:absolute; left:50%; top:-8px; transform:translateX(-50%); z-index:2; border-radius:6px; padding:1px 9px; font:700 10px Inter,Arial,sans-serif; color:#dff0ff; background:#2a6aa0; white-space:nowrap; }
.bz-card.best{ border-color:#e6c976; background:linear-gradient(180deg,rgba(202,164,76,.26),rgba(30,20,44,.6)); box-shadow:0 0 16px rgba(230,201,118,.35); }
.bz-bdg.best{ background:linear-gradient(90deg,#caa44c,#f0d060); color:#2a1410; }
/* герой: рисунок на всю карточку (его слово 01.10.2026); купленный / следующий / под замком */
.bz-card.hc{ cursor:pointer; }
.bz-hbig{ flex:1; min-height:0; position:relative; display:flex; align-items:center; justify-content:center; border-radius:11px 11px 0 0; border:0; background:radial-gradient(ellipse at 50% 40%,var(--bz-glow),transparent 62%),var(--bz-pat); overflow:hidden; }
.bz-hport{ width:72%; height:auto; max-height:88%; aspect-ratio:1; border-radius:16px; overflow:hidden; filter:drop-shadow(0 6px 6px rgba(0,0,0,.55)); }
.bz-hport svg{ width:100%; height:100%; display:block; }
.bz-card.next{ border-color:#e6c976; box-shadow:0 0 18px rgba(255,217,122,.6); }
.bz-card.lock{ filter:saturate(.3) brightness(.62); } .bz-card.lock:hover{ box-shadow:0 4px 10px rgba(0,0,0,.45); border-color:var(--bz-cbd); }
.bz-lk{ position:absolute; right:8px; top:8px; z-index:2; filter:drop-shadow(0 3px 5px rgba(0,0,0,.7)); }
/* Акции: лента-название, рисунок слева, плашки содержимого справа */
.bz-card.bc{ border-color:#7a5a2a; background:linear-gradient(180deg,rgba(70,48,20,.55),rgba(24,16,38,.7)); box-shadow:0 0 12px rgba(230,201,118,.2),0 4px 10px rgba(0,0,0,.45); }
.bz-card.bc:hover{ border-color:#e6c976; box-shadow:0 0 18px rgba(230,201,118,.5); }
.bz-card.bc .bz-t{ height:24px; border-radius:11px 11px 0 0; font:800 12px Georgia,serif; color:#3a2408; background:linear-gradient(180deg,#fff0a8,#dba63a); box-shadow:inset 0 1px 0 #fffbe0; }
.bz-bmid{ flex:1; min-height:0; display:flex; flex-direction:row; align-items:center; gap:10px; padding:4px 12px 2px; background:radial-gradient(ellipse at 30% 50%,rgba(230,201,118,.2),transparent 60%),var(--bz-pat); }
.bz-bart{ width:82px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.bz-art.bz-pimg{ aspect-ratio:auto; object-fit:contain; } /* 67-я: картинка пака (img/rynok) вместо кучки значков */
/* 67-я: готовая карточка пака целиком (.kt, картинка --kt): рамка и фон — картинка; число на стене сверху, цена на тёмной полосе внизу */
.bz-card.kt{ border:0; border-radius:0; background:var(--kt) center/100% 100% no-repeat; box-shadow:0 4px 10px rgba(0,0,0,.5); }
.bz-card.kt:hover{ border:0; box-shadow:0 0 14px rgba(126,200,255,.45); filter:brightness(1.06); }
.bz-card.kt .bz-mid{ background:none; align-items:flex-start; padding:6.5% 9% 0; }
.bz-card.kt .bz-q{ position:static; flex:1; font-size:13.5px; text-shadow:0 1px 2px #000, 0 0 6px #000; }
.bz-card.kt .bz-q.col{ flex-direction:row; flex-wrap:nowrap; gap:5px; } .bz-card.kt .bz-al{ font-size:10px; } /* число и бонус в одну строку — в просвет над кучкой */
.two .bz-card.kt .bz-p{ height:21px; margin:0 14% 9%; font-size:12px; }
/* 68-я: карточки с табличками (.tb) — число по центру верхнего картуша, бонус мелко под ним, цена — в нижнем картуше (кнопка без своей подложки) */
.bz-card.kt.tb .bz-mid{ position:absolute; left:var(--tl); width:var(--tw); top:var(--tt); height:var(--th); flex:none; padding:0; display:flex; align-items:center; justify-content:center; }
.bz-card.kt.tb .bz-q{ position:static; flex:none; width:100%; padding:0; font-size:14px; line-height:1; justify-content:center; align-items:center; }
.bz-card.kt.tb .bz-qn{ justify-content:center; max-width:100%; background:var(--qbg,none); padding:1px 5px; border-radius:4px; }
.bz-card.kt.tb .bz-p{ position:absolute; left:var(--pl); width:var(--pw); top:var(--pt); height:var(--ph); margin:0; padding:0; display:flex; align-items:center; justify-content:center; line-height:1;
background:none; border:0; border-radius:0; box-shadow:none; color:#fff; font-size:10.5px; text-shadow:0 1px 2px #000; } /* 68-я: цена 12,5 → 10,5 px (его слово «чуть меньше, чтобы попало всё»), и в бриллиантах, и в костях */
.bz-card.kt.tb .bz-bdg{ top:-14px; }
/* 68-я: карточки оружия (.ow) — готовая картинка с картушами: имя в верхнем (1–9,6 %), строка «цена · есть» на тёмной полосе (82–90 %), «Купить» в нижнем (91–98,8 %) */
.bz-card.ow{ border:0; border-radius:0; background:var(--kt) center/100% 100% no-repeat; box-shadow:0 4px 10px rgba(0,0,0,.5); }
.bz-card.ow:hover{ border:0; filter:brightness(1.06); }
.bz-card.ow .bz-t{ position:absolute; left:21%; width:58%; top:1.2%; height:8.4%; margin:0; padding:0; display:flex; align-items:center; justify-content:center; font-size:13px; color:#f8ead0; text-shadow:0 1px 2px #000; }
.bz-card.ow .bz-q{ position:absolute; left:11%; right:11%; top:82%; height:7.8%; bottom:auto; display:flex; align-items:center; justify-content:center; padding:0; }
.bz-card.ow .bz-q small{ font-size:10.5px; color:#e8d8b8; text-shadow:0 1px 2px #000; }
.bz-card.ow .bz-p{ position:absolute; left:20%; width:60%; top:91%; height:7.8%; margin:0; padding:0; display:flex; align-items:center; justify-content:center; background:none; border:0; border-radius:0; box-shadow:none; color:#ffe08a; font-size:12.5px; text-shadow:0 1px 2px #000; } /* 68-я: «лучшее» выше — не налезает на число в верхнем картуше */
.bz-card.kt.tb .bz-p.best{ color:#ffe08a; }
.bz-bart .bz-art{ width:100%; height:auto; filter:drop-shadow(0 4px 4px rgba(0,0,0,.55)); }
.bz-por{ display:block; width:72px; height:72px; border-radius:11px; border:2px solid #e6c976; background:#15100c; overflow:hidden; box-shadow:0 0 10px rgba(230,201,118,.4); }
.bz-por svg{ width:100%; height:100%; display:block; }
.bz-chips{ flex:1; min-width:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:5px; }
.bz-card.c3 .bz-chips{ grid-template-columns:minmax(0,1fr); }
.bz-chip{ display:flex; align-items:center; justify-content:center; gap:4px; min-width:0; font:800 11.5px 'JetBrains Mono',monospace; color:#fff0c8; background:rgba(0,0,0,.35); border:1px solid rgba(230,201,118,.35); border-radius:7px; padding:4px 4px; white-space:nowrap; overflow:hidden; }
.bz-chip svg{ flex-shrink:0; }
.bz-chip.w{ grid-column:1 / -1; } /* плашка во всю ширину — «Шмот 1 ур. ×9» (36-я) */
.bz-card.bc .bz-p{ height:28px; font-size:13.5px; margin:4px 8px 8px; }
/* 69-я 15.10.2026: «Прочее» — готовые карточки (img/rynok/prochee-*.webp, лист ui-proba/rynok/prochee-list.jpg): картуш имени сверху 27–73 %,
кнопка цены — нижний картуш 34,5–65,5 %, справа (50–94 %) текст/«Выпить»/состав пака кодом; предмет нарисован слева */
.bz-card.pr{ border:0; border-radius:0; background:var(--kt) center/100% 100% no-repeat; box-shadow:none; filter:drop-shadow(0 4px 6px rgba(0,0,0,.5)); }
.bz-card.pr:hover{ border:0; box-shadow:none; filter:drop-shadow(0 4px 6px rgba(0,0,0,.5)) brightness(1.06); }
.bz-card.pr.pk{ background:none; }
.bz-grid.prg{ padding-top:20px; } /* место крыльям пака — сетка режет всё выше себя */
.bz-card.pr.pk::before{ content:''; position:absolute; left:0; right:0; top:-13.2%; height:116.7%; background:var(--kt) center/100% 100% no-repeat; pointer-events:none; } /* крылья над рамкой */
.bz-card.pr .bz-t{ position:absolute; z-index:1; left:28%; width:44%; top:2.5%; height:12.5%; margin:0; padding:0; border-radius:0; background:none; box-shadow:none; font:800 12.5px Georgia,serif; color:#f8ead0; text-shadow:0 1px 2px #000; }
.bz-card.pr .bz-mid, .bz-card.pr .bz-bmid{ position:absolute; z-index:1; left:50%; right:6%; top:20%; bottom:21%; display:flex; align-items:center; justify-content:center; padding:0; margin:0; gap:0; }
.bz-card.pr .bz-q{ position:static; flex:1; padding:0; }
.bz-card.pr .bz-q small{ font-size:11px; color:#e8d8b8; text-shadow:0 1px 2px #000; }
.bz-card.pr .bz-chips{ gap:4px; }
.bz-card.pr .bz-chip{ height:24px; box-sizing:border-box; justify-content:flex-start; gap:3px; padding:0 6px 0 2px; font:800 11.5px Georgia,serif; color:#ffe08a; text-shadow:0 1px 2px #000;
background:linear-gradient(180deg,rgba(40,26,12,.85),rgba(14,9,5,.9)); border:1px solid #b88a3c; border-radius:6px; box-shadow:inset 0 1px 0 rgba(255,220,140,.25), 0 1px 3px rgba(0,0,0,.6); } /* 69-я: плашки состава пака — бронза с золотым числом */
.bz-card.pr .bz-chip span{ flex:1; text-align:center; }
.bz-card.pr .bz-ci{ width:24px; height:27px; margin:-3px 0 -2px -2px; object-fit:contain; flex-shrink:0; filter:drop-shadow(0 1px 1px rgba(0,0,0,.7)); }
.bz-card.pr .bz-p{ position:absolute; z-index:1; left:35.5%; width:29%; top:84%; height:13%; margin:0; padding:0; display:flex; align-items:center; justify-content:center; gap:3px; background:none; border:0; border-radius:0; box-shadow:none; color:#ffe08a; font:800 12.5px 'JetBrains Mono',monospace; text-shadow:0 1px 2px #000; }
.bz-card.pr .bz-p:disabled{ color:#b8a888; font-size:10.5px; }
.bz-card.pr .bz-p .srp-val{ width:16px; height:16px; flex-shrink:0; } /* цена Возвышения — кости картинкой валюты, как в шапке (его слово 69-я) */
.bz-card.pr .bz-mini{ width:78px; height:28px; padding:0; border:0; border-radius:0; background:url(img/rynok/knopka-vypit.webp) center/100% 100% no-repeat; color:#3a1f08; font:800 11.5px Georgia,serif; text-shadow:0 1px 0 rgba(255,240,190,.6); filter:drop-shadow(0 2px 3px rgba(0,0,0,.5)); } /* «Выпить» — золотая кнопка «Да» с листа окна бутылки (ui-proba/rynok/okno-butylka-list.jpg) */
.bz-card.pr .bz-mini:hover{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.5)) brightness(1.08); }
/* оружие: окошко «Сколько нужно» */
.bz-dim{ position:absolute; inset:0; z-index:30; background:rgba(8,5,2,.6); display:flex; align-items:center; justify-content:center; border-radius:14px; }
.bz-dlg{ position:relative; width:232px; border-radius:12px; border:1px solid var(--bz-cbd); background:linear-gradient(180deg,#2c1e42,#181026); color:var(--bz-txt); box-shadow:0 14px 34px rgba(0,0,0,.8); padding:12px 14px 12px; display:flex; flex-direction:column; align-items:center; gap:6px; }
.bz-dx{ position:absolute; right:8px; top:6px; width:22px; height:22px; border-radius:50%; background:rgba(0,0,0,.35); color:var(--parchment); border:0; font:700 12px Arial; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.bz-dt{ font:900 15px Georgia,serif; letter-spacing:.06em; color:var(--parchment); }
.bz-dart{ width:120px; height:72px; filter:drop-shadow(0 5px 5px rgba(0,0,0,.5)); }
.bz-dlg label{ font:700 11px Inter,Arial; color:var(--bz-sub); }
.bz-dlg input{ width:120px; height:34px; text-align:center; font:800 18px 'JetBrains Mono',monospace; color:var(--bz-txt); background:rgba(0,0,0,.3); border:1px solid var(--bz-cbd); border-radius:8px; outline:none; }
.bz-dlg input:focus{ box-shadow:0 0 10px rgba(255,217,122,.6); }
.bz-dp{ display:flex; align-items:center; gap:5px; font:900 20px Georgia,serif; color:var(--bz-txt); text-shadow:0 1px 2px #000; min-width:0; max-width:100%; }
.bz-dp b{ display:flex; align-items:center; gap:4px; min-width:0; }
.bz-dlg .bz-p{ align-self:stretch; margin:2px 0 0; }
/* 68-я: окно покупки оружия (.ow) — картинка окна img/rynok/okno-.webp (329×560), всё по картушам в %: имя 1,3–9,6 %, медальон центр 34,8 %, слот 58,2–65,9 %, цена 70,7–77,7 %, кнопка 85,5–98,3 % */
.bz-dlg.ow{ width:176px; height:300px; padding:0; border:0; border-radius:0; background:var(--okno) center/100% 100% no-repeat; box-shadow:none; filter:drop-shadow(0 14px 24px rgba(0,0,0,.8)); display:block; }
.bz-dlg.ow .bz-dt{ position:absolute; left:21%; width:58%; top:1.3%; height:8.3%; display:flex; align-items:center; justify-content:center; font-size:14px; text-shadow:0 1px 2px #000; }
.bz-dlg.ow .bz-dmed{ position:absolute; left:29.2%; width:41.6%; top:22.6%; aspect-ratio:1; border-radius:50%; }
.bz-dlg.ow label{ display:none; }
.bz-dlg.ow input{ position:absolute; left:21%; width:58%; top:58.2%; height:7.7%; box-sizing:border-box; background:none; border:0; border-radius:0; font-size:17px; color:#fff; text-shadow:0 1px 2px #000; }
.bz-dlg.ow input:focus{ box-shadow:none; }
.bz-dlg.ow input{ -moz-appearance:textfield; appearance:textfield; } .bz-dlg.ow input::-webkit-inner-spin-button, .bz-dlg.ow input::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; } /* без стрелок — слот чистый */
.bz-dlg.ow .bz-dp{ position:absolute; left:24%; width:52%; top:70.7%; height:7%; justify-content:center; align-items:center; font:800 15px 'JetBrains Mono',monospace; line-height:1; }
.bz-dlg.ow .bz-dp b{ align-items:center; gap:4px; line-height:1; } .bz-dlg.ow .bz-dp .srp-val{ width:19px; height:19px; flex-shrink:0; } /* 68-я: кости картинкой валюты, число с ними на одной линии */
.bz-dlg.ow input{ font-family:'JetBrains Mono',monospace; font-weight:800; line-height:1; padding:0; }
.bz-dlg.ow .bz-p{ position:absolute; left:20%; width:60%; top:85.5%; height:12.8%; margin:0; padding:0; background:none; border:0; border-radius:0; box-shadow:none; color:#fff; font-size:14px; text-shadow:0 1px 3px #000, 0 0 6px rgba(0,0,0,.6); }
.bz-dlg.ow .bz-dx{ right:-8px; top:-8px; z-index:2; background:rgba(0,0,0,.7); border:1px solid #8a6a3a; }
.bz-mini{ font:800 11px Inter,Arial; color:#2a1410; background:linear-gradient(180deg,#f0d060,#caa44c); border:1px solid #e6c976; border-radius:7px; padding:3px 10px; cursor:pointer; white-space:nowrap; }
.bz-mini:active{ transform:scale(.96); }
.bz-lavka.busy .bz-p, .bz-lavka.busy .bz-mini{ opacity:.6; pointer-events:none; }
.bz-grid.two.g8{ grid-auto-flow:row; } /* 8 пакетов слева направо, как в макете: 10 30 120 250 / 500 2 500 5 000 10 000 */
/* ===== ЛЕНТА УДАЧИ — лавка «Сундуки» Рынка (01.10.2026, его выбор: макет client/maket-lenta-udachi.html, вариант 1) ===== */
.lu{ display:flex; flex-direction:column; gap:6px; height:100%; min-height:0; }
.lu-chips{ display:flex; gap:6px; flex:0 0 auto; padding-right:30px; } /* справа — место под крестик окна */
.lu-chip{ flex:1 1 0; min-width:0; display:flex; align-items:center; justify-content:center; gap:5px; padding:2px 6px; border-radius:9px; cursor:pointer;
border:1px solid #3a2e52; background:rgba(0,0,0,.3); font:700 12px 'Cinzel',serif; color:var(--parchment); white-space:nowrap; overflow:hidden; }
.lu-chip svg{ flex:0 0 auto; }
.lu-chim{ display:block; width:auto; flex:0 0 auto; object-fit:contain; filter:drop-shadow(0 2px 2px rgba(0,0,0,.7)); } /* 69-я: значки сундуков картинками */
.lu-cn{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.05; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.lu-cn small{ font:600 8.5px 'Segoe UI',sans-serif; color:var(--bz-sub); letter-spacing:.3px; }
.lu-chip.on .lu-cn small{ color:#d8b860; }
.lu-chip.soon{ cursor:default; border-style:dashed; border-color:#4a3e62; color:#9a8cb0; animation:luSoon 3s ease-in-out infinite; } /* «скоро» — интрига (его слово) */
.lu-chip.soon:nth-child(4){ animation-delay:1s; } .lu-chip.soon:nth-child(5){ animation-delay:2s; }
@keyframes luSoon{ 50%{ border-color:#8a74c0; box-shadow:0 0 10px rgba(150,120,230,.35) inset; } }
.lu-chip.on{ border-color:var(--gold-bright); color:var(--gold-bright); background:linear-gradient(180deg,rgba(230,201,118,.22),rgba(60,40,10,.3)); }
.lu-top{ flex:1 1 auto; min-height:0; display:flex; gap:8px; padding:6px 8px; border-radius:10px; border:1px solid #c9a24a;
background:var(--bz-card); box-shadow:0 0 0 1px #5a4210 inset,0 0 18px rgba(230,201,118,.15); }
.lu-body{ flex:1 1 auto; min-height:0; display:flex; gap:6px; } /* 69-я: герой слева во всю высоту, справа — сундук и лента */
.lu-col{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.lu-hero{ flex:0 0 30%; position:relative; overflow:hidden; cursor:pointer; border-radius:8px; border:1px solid #8a6a2a; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding-bottom:4px;
background:radial-gradient(ellipse at 50% 55%,rgba(255,200,90,.3),transparent 70%),linear-gradient(180deg,#2a1e3a,#120c1c); }
.lu-rays{ position:absolute; left:50%; top:42%; width:220px; height:220px; margin:-110px 0 0 -110px; animation:luSpinRays 18s linear infinite; pointer-events:none; }
@keyframes luSpinRays{ to{ transform:rotate(360deg); } }
.lu-hfig{ position:relative; flex:1; display:flex; align-items:center; animation:luFloat 2.6s ease-in-out infinite; }
@keyframes luFloat{ 50%{ transform:translateY(-5px); } }
.lu-hnm{ position:relative; font:800 12px 'Cinzel',serif; color:var(--gold-bright); }
.lu-hcl{ position:relative; font-size:10px; color:var(--muted); }
.lu-right{ flex:1; min-width:0; display:flex; flex-direction:column; justify-content:space-between; gap:6px; }
.lu-head{ display:flex; align-items:center; gap:8px; min-height:0; }
.lu-hw{ flex:1; min-width:0; }
.lu-t{ font:800 14px 'Cinzel',serif; color:var(--gold-bright); margin-bottom:4px; }
.lu-tiles{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
.lu-tiles .lu-c{ height:44px; font-size:10.5px; } /* без сундука слева плитки шире и выше (его слово 05.10.2026) */
.lu-c{ flex:0 0 auto; border-radius:8px; background:var(--bz-card); border:1px solid var(--bz-cbd); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
font:700 10px 'JetBrains Mono',monospace; color:var(--bz-txt); white-space:nowrap; overflow:hidden; }
.lu-por{ display:inline-block; border-radius:8px; overflow:hidden; border:1.5px solid #e6c976; background:#15100c; flex:0 0 auto; } /* портрет героя сундука (02.10.2026) */
.lu-por svg{ width:100%; height:100%; display:block; }
.lu-hero.fon{ background:var(--lufon) center/cover no-repeat; } /* 69-я: свой фон героя сундука вместо лучей */
.lu-hfull{ position:absolute; inset:0; z-index:1; pointer-events:none; } /* 69-я: живой герой сундука на всю карточку (его слово) */
.lu-hfull canvas{ width:100%; height:100%; display:block; object-fit:contain; object-position:50% 100%; }
.lu-c.hero{ border-color:var(--gold-bright); background:linear-gradient(180deg,rgba(230,201,118,.4),rgba(60,40,10,.6)); cursor:pointer; }
.lu-c.rare{ border-color:#a888ff; background:linear-gradient(180deg,rgba(150,110,255,.35),rgba(30,20,60,.6)); }
.lu-c.win{ border-color:#fff; box-shadow:0 0 0 2px var(--gold-bright),0 0 22px rgba(255,220,120,.85); }
.lu-act{ display:flex; justify-content:flex-end; }
/* «Крутить» — компактная (его слово 01.10.2026: «красивее и компактнее, а не на пол экрана»): золото, блик бежит по кнопке */
.lu-spin{ position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:space-between; gap:16px; min-width:196px; height:36px; padding:0 6px 0 22px; border-radius:18px; cursor:pointer;
border:1px solid #ffe9a0; background:linear-gradient(180deg,#ffe28a,#d9a63a 55%,#a8761c); color:#2a1606;
box-shadow:0 0 0 2px #5a3a08,0 3px 0 #5a3a08,0 0 16px rgba(255,200,90,.45); font:900 14px 'Cinzel',serif; letter-spacing:.5px; }
.lu-spin::after{ content:''; position:absolute; top:0; bottom:0; width:40px; left:-60px; background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent); animation:luShine 2.8s ease-in-out infinite; }
@keyframes luShine{ 0%,55%{ left:-60px; } 100%{ left:110%; } }
.lu-spin:active{ transform:translateY(2px); box-shadow:0 0 0 2px #5a3a08,0 1px 0 #5a3a08,0 0 12px rgba(255,200,90,.4); }
/* 69-я: его кнопка «Крутить» — вариант 2 (аметисты, фиолетовые иероглифы), лист ui-proba/rynok/krutit/list.jpg → img/rynok/knopka-krutit.webp (602×220);
«Крутить» — на золоте 8–54 %, цена — в тёмном слоте 55–90 % × 20–80 % */
.lu-spin{ min-width:0; width:162px; height:59px; padding:0; border:0; border-radius:30px; background:url(img/rynok/knopka-krutit.webp) center/100% 100% no-repeat; box-shadow:none; filter:drop-shadow(0 0 8px rgba(170,90,255,.55)) drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.lu-spin::after{ display:none; }
.lu-spin:active{ box-shadow:none; transform:translateY(2px) scale(.98); }
.lu-spin .lu-sp-t{ position:absolute; left:9%; width:45%; top:0; bottom:0; display:flex; align-items:center; justify-content:center; font:900 14px 'Cinzel',serif; color:#3a1a06; text-shadow:0 1px 0 rgba(255,240,190,.7); }
.lu-spin .lu-sp-p{ position:absolute; left:56%; width:33%; top:22%; height:56%; padding:0; border-radius:0; background:none; justify-content:center; gap:3px; font-size:12.5px; }
.lu-sp-p{ display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 12px; border-radius:13px; background:rgba(40,20,4,.78); color:#ffe9a0; font:800 13px 'JetBrains Mono',monospace; }
.lu-box{ flex:0 0 86px; position:relative; overflow:hidden; border-radius:10px; border:1px solid #6a5498; background:#120e1c; }
.lu-box::before,.lu-box::after{ content:''; position:absolute; top:0; bottom:0; width:56px; z-index:2; pointer-events:none; }
.lu-box::before{ left:0; background:linear-gradient(90deg,#120e1c,transparent); } .lu-box::after{ right:0; background:linear-gradient(270deg,#120e1c,transparent); }
.lu-reel{ position:absolute; left:0; top:50%; transform:translate(0,-50%); display:flex; gap:6px; padding-left:6px; will-change:transform; }
.lu-reel .lu-c{ width:64px; height:72px; }
/* 69-я: награды картинками (LU_IMG), клетки — бронза; герой в барабане — ава на всю клетку без надписи */
.lu-im{ display:block; object-fit:contain; flex:none; filter:drop-shadow(0 2px 2px rgba(0,0,0,.7)); }
.lu-c{ background:linear-gradient(180deg,#2c2338,#15101e); border-color:#6a5530; box-shadow:inset 0 1px 0 rgba(255,220,150,.12), 0 2px 4px rgba(0,0,0,.45); }
.lu-c span{ font-family:Georgia,serif; font-weight:800; color:#ffe9b0; text-shadow:0 1px 2px #000; }
.lu-tiles .lu-c{ gap:0; }
.lu-c.ava{ padding:0; overflow:hidden; border-width:2px; }
.lu-c.ava .lu-por{ width:100% !important; height:100% !important; border:0; border-radius:6px; }
.lu-reel .lu-c.ava{ padding:0; }
/* ===== 69-я 15.10.2026: «ПЛИТА ДУАТА» — вид Сундука Морганы (его выбор из client/maket-sunduk.html, вариант В «ультра хорошо»):
тёмный фиолетовый камень, светящиеся иероглифы по краю, награды в нишах, в барабане фиолетовый портал по центру (это .lu-mk), огни по краям;
кнопка «Крутить» — маленькая в том же углу (его слово) ===== */
/* 69-я: тот же вид для Сундука Салазара (его слово «да, давай сделаем») — цвета переменными: Дуат фиолетовый, Салазар красно-огненный */
.lu.duat{ --st1:#241a30; --st2:#140e1c; --sbd:#3a2a4e; --sin:#6a4a9a55; --glo:150,90,255; --ac:#a070ff; --ttl:#e8d0ff; --c1:#0e0914; --c2:#1e1528; --cbd:#4a3866; --cgl:160,100,255; --rare:#7a5aaa; --b1:#1c1426; --b2:#0c0812; --fl:170,100,255; --win:#e8d0ff; --ar:#b080ff; --ar2:#d0a8ff; }
.lu.salaz{ --st1:#2e1410; --st2:#180a08; --sbd:#4e2218; --sin:#9a4a2a55; --glo:255,100,40; --ac:#ff7a40; --ttl:#ffe0c8; --c1:#140806; --c2:#2a120c; --cbd:#6a2e1c; --cgl:255,110,50; --rare:#a070ff; --b1:#2a120c; --b2:#100604; --fl:255,110,40; --win:#ffe0c8; --ar:#ff7030; --ar2:#ffb080; }
.lu:is(.duat,.salaz) .lu-top{ position:relative; background:linear-gradient(180deg,var(--st1),var(--st2)); border:2px solid var(--sbd); box-shadow:inset 0 0 0 1px var(--sin), inset 0 0 30px #000, 0 0 12px rgba(var(--glo),.25); }
.lu:is(.duat,.salaz) .lu-top::before{ content:'𓂀 𓋹 𓆣 𓁹 𓃣 𓋹 𓂀 𓆣 𓁹 𓃣 𓋹 𓂀 𓆣 𓁹'; position:absolute; left:10px; right:10px; top:1px; font-size:9px; letter-spacing:6px; color:var(--ac); opacity:.55; text-shadow:0 0 6px var(--ac); white-space:nowrap; overflow:hidden; text-align:center; pointer-events:none; }
.lu:is(.duat,.salaz) .lu-t{ margin-top:6px; font-family:Georgia,serif; color:var(--ttl); text-shadow:0 0 10px var(--ac); }
.lu:is(.duat,.salaz) .lu-tiles{ gap:6px; }
.lu:is(.duat,.salaz) .lu-c{ background:linear-gradient(180deg,var(--c1),var(--c2)); border:1px solid var(--cbd); box-shadow:inset 0 6px 12px rgba(var(--cgl),.22), inset 0 -2px 0 #000; }
.lu:is(.duat,.salaz) .lu-tiles .lu-c{ height:44px; flex-direction:row; gap:6px; border-radius:20px 20px 6px 6px; }
.lu:is(.duat,.salaz) .lu-c.rare{ border-color:var(--rare); }
.lu:is(.duat,.salaz) .lu-c.hero{ border-color:var(--gold); background:var(--c1); box-shadow:inset 0 6px 14px rgba(255,210,120,.3), 0 0 10px rgba(255,210,120,.35); }
.lu:is(.duat,.salaz) .lu-c.hero.ava{ overflow:hidden; }
.lu:is(.duat,.salaz) .lu-box{ background:linear-gradient(180deg,var(--b1),var(--b2)); border:2px solid var(--sbd); box-shadow:inset 0 0 24px #000; }
.lu:is(.duat,.salaz) .lu-box::before{ width:70px; background:linear-gradient(90deg,var(--b2) 25%,transparent), radial-gradient(ellipse at 10% 50%,rgba(var(--fl),.5),transparent 60%); }
.lu:is(.duat,.salaz) .lu-box::after{ width:70px; background:linear-gradient(270deg,var(--b2) 25%,transparent), radial-gradient(ellipse at 90% 50%,rgba(var(--fl),.5),transparent 60%); }
.lu:is(.duat,.salaz) .lu-reel{ z-index:1; }
.lu:is(.duat,.salaz) .lu-reel .lu-c{ width:52px; height:60px; border-radius:16px 16px 6px 6px; }
.lu:is(.duat,.salaz) .lu-reel .lu-im{ width:32px !important; height:32px !important; }
.lu:is(.duat,.salaz) .lu-tiles .lu-im{ width:28px !important; height:28px !important; }
.lu:is(.duat,.salaz) .lu-reel .lu-c.ava .lu-por{ width:100% !important; height:100% !important; border:0; border-radius:0; }
.lu:is(.duat,.salaz) .lu-reel .lu-c.ava .lu-por svg{ width:100%; height:100%; }
.lu:is(.duat,.salaz) .lu-c.win{ border-color:var(--win); box-shadow:0 0 0 2px var(--ac), 0 0 22px rgba(var(--fl),.9); }
/* метка — ЗОЛОТЫЕ СТРЕЛКИ сверху и снизу (его выбор: кольцо и луч — «плохо»), с фиолетовым свечением; линии нет */
.lu:is(.duat,.salaz) .lu-mk{ left:50%; top:0; bottom:0; width:0; margin-left:0; z-index:3; pointer-events:none; background:none; box-shadow:none; }
.lu:is(.duat,.salaz) .lu-mk::before, .lu:is(.duat,.salaz) .lu-mk::after{ display:block; left:-10px; border:10px solid transparent; filter:drop-shadow(0 0 6px var(--ar)) drop-shadow(0 1px 1px #000); transition:filter .08s; }
.lu:is(.duat,.salaz) .lu-mk::before{ top:-2px; border-top:14px solid #ffe08a; } .lu:is(.duat,.salaz) .lu-mk::after{ bottom:-2px; border-bottom:14px solid #ffe08a; }
.lu:is(.duat,.salaz) .lu-mk.tick{ box-shadow:none; } .lu:is(.duat,.salaz) .lu-mk.tick::before, .lu:is(.duat,.salaz) .lu-mk.tick::after{ filter:drop-shadow(0 0 12px var(--ar2)) drop-shadow(0 1px 1px #000) brightness(1.3); }
.lu.duat .lu-spin{ width:140px; height:51px; } /* его слово: «больше, как у Салазара» */
.lu.duat .lu-spin .lu-sp-t{ font-size:12.5px; }
.lu.duat .lu-spin .lu-sp-p{ font-size:11px; gap:2px; } .lu.duat .lu-spin .lu-sp-p .lu-im{ width:14px !important; height:14px !important; }
/* 69-я: Сундук Салазара — его кнопка «Крутить», вариант 3 (цепи и огонь): img/rynok/knopka-krutit-salazar.webp 543×220; слово 16–49 %, слот 50–86 % × 36–73 % */
.lu.salaz .lu-spin{ width:132px; height:53px; background-image:url(img/rynok/knopka-krutit-salazar.webp); filter:drop-shadow(0 0 8px rgba(255,90,40,.5)) drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.lu.salaz .lu-spin .lu-sp-t{ left:16%; width:33%; font-size:10.5px; }
.lu.salaz .lu-spin .lu-sp-p{ left:50.5%; width:36%; top:36%; height:37%; font-size:10px; gap:2px; } .lu.salaz .lu-spin .lu-sp-p .lu-im{ width:12px !important; height:12px !important; }
.lu-ava{ display:block; width:100%; height:100%; object-fit:cover; object-position:50% 42%; border-radius:6px; }
.lu-reel .lu-c.ava .lu-por{ width:52px !important; height:52px !important; border:1.5px solid #e6c976; border-radius:8px; } /* в барабане — меньше (его слово «очень большое»), по центру клетки */
.lu-mk{ position:absolute; left:50%; top:0; bottom:0; width:2px; margin-left:-1px; z-index:3; background:var(--gold-bright); box-shadow:0 0 8px var(--gold-bright); transition:box-shadow .08s; }
.lu-mk.tick{ box-shadow:0 0 18px 4px var(--gold-bright); }
.lu-mk::before,.lu-mk::after{ content:''; position:absolute; left:-6px; border:7px solid transparent; }
.lu-mk::before{ top:0; border-top-color:var(--gold-bright); } .lu-mk::after{ bottom:0; border-bottom-color:var(--gold-bright); }
.lu-run .shop-side, .lu-run #shopClose, .lu-run .lu-chips{ pointer-events:none; opacity:.7; } /* пока крутится — не уйти из лавки (награда уже выдана, лента её покажет) */
/* кнопки окна выигрыша (05.10.2026, его слово): две одинаковые, крупные */
.lu-wbtns{ display:flex; gap:10px; width:100%; margin-top:2px; }
.lu-wbtn{ flex:1; min-width:0; display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:10px 12px; border-radius:10px; cursor:pointer; white-space:nowrap;
font:800 13px 'Cinzel',serif; letter-spacing:.03em; color:var(--parchment); background:rgba(255,255,255,.07); border:1px solid #8a6a3a; box-shadow:0 2px 0 rgba(0,0,0,.4); }
.lu-wbtn:hover{ border-color:var(--gold-bright); filter:brightness(1.1); } .lu-wbtn:active{ transform:translateY(1px); }
.lu-wbtn.gold{ color:#1a1208; background:linear-gradient(180deg,#ffe08a,#c89a3a 60%,#a8832a); border-color:#ffeeb0; box-shadow:0 3px 0 #5a4010, 0 6px 14px rgba(0,0,0,.45); }
.lu-wbtn .bz-ico, .lu-wbtn svg{ flex:0 0 auto; }
.lu-win{ display:flex; flex-direction:column; align-items:center; overflow:hidden; }
/* 69-я: окно «что выпало» Сундука Морганы — его лист (ui-proba/rynok/okno-vyigrysh/list.jpg, вариант 1): ниша 39–62 % × 18–57 %, табличка 26–75 % × 64–76 %,
«Получить» 12–47 % × 80–94 %, «Ещё» 53–90 % (слот цены 75–87 %) */
.pop-window.luw-duat{ position:relative; width:320px; height:238px; max-height:none; padding:0; border:0; border-radius:0; box-shadow:none; overflow:visible; background:url(img/rynok/okno-vyigrysh.webp) center/100% 100% no-repeat; filter:drop-shadow(0 8px 18px rgba(0,0,0,.7)) drop-shadow(0 0 14px rgba(150,90,255,.35)); }
.luw-duat .luw{ position:absolute; inset:0; display:block; overflow:visible; }
.luw-ico{ position:absolute; left:50.4%; top:38.5%; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; animation:luPop .5s cubic-bezier(.2,1.6,.4,1); }
.luw-ico .lu-por{ border-color:#e6c976; box-shadow:0 0 14px rgba(255,210,120,.5); }
.luw-pl{ position:absolute; left:27%; width:47%; top:64.2%; height:11.2%; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.1; text-align:center; }
.luw-pl b{ font:800 14px Georgia,serif; color:#ffe08a; text-shadow:0 1px 2px #000; white-space:nowrap; }
.luw-pl small{ font:600 8.5px Inter,Arial,sans-serif; color:#c8b8e0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.luw-ok, .luw-again{ position:absolute; top:80.5%; height:13.8%; margin:0; padding:0; border:0; background:none; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.luw-ok{ left:12.4%; width:34.6%; font:800 13px Georgia,serif; color:#f0e0ff; text-shadow:0 1px 2px #000; }
.luw-again{ left:53%; width:37.2%; }
.luw-again .t{ position:absolute; left:4%; width:56%; top:0; bottom:0; display:flex; align-items:center; justify-content:center; font:900 13px Georgia,serif; color:#3a1a06; text-shadow:0 1px 0 rgba(255,240,190,.7); }
.luw-again .p{ position:absolute; left:61%; width:33%; top:18%; bottom:18%; display:flex; align-items:center; justify-content:center; gap:2px; font:800 10px Georgia,serif; color:#ffe9a0; }
/* «Ещё» — его кнопка с большим слотом, вариант 3 с крылышками (img/rynok/knopka-eshchyo.webp 435×160, лист ui-proba/rynok/eshchyo/list.jpg) поверх кнопки, нарисованной в окне;
слово — на золоте 12–48 %, кость и цена — в слоте 50–87 % × 22–75 % */
.luw-again{ left:49.7%; width:140px; top:76.7%; height:51.5px; background:url(img/rynok/knopka-eshchyo.webp) center/100% 100% no-repeat; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.luw-again .t{ left:12%; width:36%; font-size:12.5px; }
.luw-again .p{ left:50.5%; width:36.5%; top:22%; bottom:25%; gap:3px; font-size:12px; }
/* 69-я: окно «что выпало» Сундука Салазара — его вариант 2 (img/rynok/okno-vyigrysh-salazar.webp 633×464): ниша центр 50 % × 41 %, табличка 28–73 % × 61–74 %,
«Получить» 12–47 % × 79–93 %; «Ещё» — его кнопка «Крутить» Салазара (большой слот) поверх нарисованной */
.pop-window.luw-salaz{ position:relative; width:320px; height:235px; max-height:none; padding:0; border:0; border-radius:0; box-shadow:none; overflow:visible; background:url(img/rynok/okno-vyigrysh-salazar.webp) center/100% 100% no-repeat; filter:drop-shadow(0 8px 18px rgba(0,0,0,.7)) drop-shadow(0 0 14px rgba(255,100,40,.35)); }
.luw-salaz .luw{ position:absolute; inset:0; display:block; overflow:visible; }
.luw-salaz .luw-ico{ left:50.2%; top:41%; }
.luw-salaz .luw-pl{ left:29%; width:42.5%; top:61.5%; height:12.5%; }
.luw-salaz .luw-ok{ left:12.4%; width:34.2%; top:79%; height:14%; color:#ffe8d8; }
.luw-salaz .luw-again{ left:50.3%; width:132px; top:74.7%; height:53px; background:url(img/rynok/knopka-krutit-salazar.webp) center/100% 100% no-repeat; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.luw-salaz .luw-again .t{ left:16%; width:33%; font-size:12px; }
.luw-salaz .luw-again .p{ left:50.5%; width:36%; top:36%; bottom:27%; font-size:10.5px; gap:2px; white-space:nowrap; }
.luw-again .p, .lu-sp-p{ white-space:nowrap; }
.luw-ok:hover, .luw-again:hover{ filter:brightness(1.12); } .luw-ok:active, .luw-again:active{ transform:translateY(1px) scale(.98); }
.pop-window:has(.lu-win){ overflow:hidden; }
/* 69-я 15.10.2026: окно «Бутылка энергии» — его вариант 3 (img/rynok/okno-butylka.webp, 659×400): картуш имени 28–72 % × 12–26 %, текст 46–89 % × 32–76 %,
«Да» 16,7–47,5 %, «Нет» 52,2–83 % × 82,5–98,4 %; медальон с бутылкой нарисован */
.pop-window.bzb-win{ position:relative; width:330px; height:200px; max-height:none; overflow:visible; padding:0; border:0; border-radius:0; box-shadow:none; background:url(img/rynok/okno-butylka.webp) center/100% 100% no-repeat; filter:drop-shadow(0 6px 14px rgba(0,0,0,.6)); }
.bzb-win .bzb-t{ position:absolute; left:28.5%; width:43%; top:12%; height:13.8%; display:flex; align-items:center; justify-content:center; font:800 13px Georgia,serif; color:#ffe9b0; text-shadow:0 1px 2px #000; white-space:nowrap; }
.bzb-win .bzb-txt{ position:absolute; left:46.5%; width:41.5%; top:33%; height:42%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; text-align:center; font:700 11px Inter,Arial,sans-serif; line-height:1.3; color:var(--parchment); text-shadow:0 1px 2px #000; }
.bzb-win .bzb-txt span{ font-size:10.5px; color:#cfc0a0; } .bzb-win .bzb-txt b{ color:#ffe08a; }
.bzb-win .bzb-da, .bzb-win .bzb-net{ position:absolute; top:83.5%; height:14%; margin:0; padding:0; border:0; background:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font:800 13.5px Georgia,serif; }
.bzb-win .bzb-da{ left:18%; width:28.5%; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,190,.6); }
.bzb-win .bzb-net{ left:53.5%; width:28.5%; color:#f0e0c0; text-shadow:0 1px 2px #000; }
.bzb-win .bzb-da:hover, .bzb-win .bzb-net:hover{ filter:brightness(1.15); } .bzb-win .bzb-da:active, .bzb-win .bzb-net:active{ transform:scale(.96); }
.lu-win .lcp-close{ display:inline-flex; align-items:center; justify-content:center; gap:4px; white-space:nowrap; }
.lu-wbig{ position:relative; width:150px; height:110px; display:flex; align-items:center; justify-content:center; overflow:visible; }
.lu-wbig .lu-rays{ top:50%; width:240px; height:240px; margin:-120px 0 0 -120px; opacity:1; }
.lu-wpop{ position:relative; animation:luPop .5s cubic-bezier(.2,1.6,.4,1); } @keyframes luPop{ from{ transform:scale(.2); opacity:0; } }
.lu-run .lu-spin{ opacity:.6; pointer-events:none; } /* пока крутится — кнопка спит */
/* ===== КРУГ УДАЧИ (05.10.2026, 43-я): окно 720×330 как Раскопки; диск слева, банк справа; поверх — лестница / жетоны / ящики ===== */
#krugBackdrop{ z-index:69; } /* над окнами Площади/Игр (z 61): их крестик не должен торчать рядом с Кругом (05.10.2026, 45-я) */
.kr-modal{ z-index:70; width:min(720px,94%); height:min(330px,367px); max-height:367px; padding:0; overflow:hidden; text-align:left;
display:flex; flex-direction:column; border:2px solid #d4a84b; background:radial-gradient(ellipse at 28% 60%,#2a1e12 0,#150e0a 55%,#1a1008 100%);
box-shadow:0 14px 40px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,220,140,.12); }
.kr-modal::before{ content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:
repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 2px, transparent 2px 6px),
radial-gradient(ellipse at 50% -20%, rgba(212,168,75,.18), transparent 55%); }
.kr-modal .modal-close{ z-index:6; width:24px; height:24px; top:7px; right:8px; border-radius:50%; font-weight:900; font-size:12px; color:#fff;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; }
.kr-top{ position:relative; height:38px; flex:0 0 auto; display:flex; align-items:center; gap:6px; padding:0 40px 0 12px; border-bottom:1px solid #6a5220;
background:linear-gradient(180deg,rgba(60,40,10,.55),rgba(0,0,0,.35)); }
.kr-top::after{ content:''; position:absolute; left:0; right:0; top:38px; height:2px; background:linear-gradient(90deg,transparent,#d4a84b 20%,#ffe9a8 50%,#d4a84b 80%,transparent); opacity:.7; }
.kr-ttl{ font:900 13px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-bright); white-space:nowrap; margin-right:auto; text-shadow:0 1px 0 #000, 0 0 12px rgba(255,224,122,.35); }
.kr-body{ flex:1; min-height:0; display:flex; position:relative; }
.kr-wait{ margin:auto; font:600 12px 'Inter',sans-serif; color:var(--muted); }
.kr-toast{ position:absolute; left:50%; bottom:12px; transform:translateX(-50%); z-index:12; max-width:90%; background:rgba(20,12,6,.94); border:1px solid var(--gold); border-radius:9px;
padding:6px 12px; font:700 11px 'Inter',sans-serif; color:var(--parchment); white-space:nowrap; pointer-events:none; }
/* ---- диск ---- */
.kr-left{ flex:0 0 300px; display:flex; align-items:center; justify-content:center; }
.kr-wheel{ position:relative; width:270px; height:270px; }
.kr-svg{ display:block; width:270px; height:270px; filter:drop-shadow(0 8px 16px rgba(0,0,0,.7)); }
.kr-disc{ transform-origin:50% 50%; transition:transform 2.6s cubic-bezier(.12,.8,.2,1); }
.kr-ptr{ position:absolute; left:50%; top:-8px; transform:translateX(-50%); z-index:3; filter:drop-shadow(0 3px 4px rgba(0,0,0,.8)); }
.kr-res{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.6); z-index:4; opacity:0; pointer-events:none; white-space:nowrap;
padding:7px 14px; border-radius:10px; border:2px solid #ffe07a; background:rgba(20,12,6,.94); font:900 14px 'Cinzel',serif; color:#ffe9a8; letter-spacing:.04em;
box-shadow:0 0 24px rgba(255,224,122,.5); transition:opacity .25s, transform .35s cubic-bezier(.2,1.6,.4,1); }
.kr-res.show{ opacity:1; transform:translate(-50%,-50%) scale(1); }
.kr-res.no{ border-color:#5a4a5a; color:var(--muted); box-shadow:none; }
.kr-res.jp{ font-size:16px; color:#fff3c0; animation:krJp .6s ease-in-out infinite alternate; }
@keyframes krJp{ from{ box-shadow:0 0 18px rgba(255,224,122,.4); } to{ box-shadow:0 0 40px rgba(255,224,122,.9); } }
/* ---- шапка: уровень — только ПРАВАЯ половина (О5, его правка 05.10.2026) ---- */
.kr-lvw{ flex:0 0 50%; margin-left:auto; min-width:0; display:flex; align-items:center; gap:8px; font:800 9.5px 'Cinzel',serif; letter-spacing:.1em; text-transform:uppercase; color:#c9a24a;
padding:3px 10px; border-radius:9px; border:1px solid #5a4520; background:rgba(0,0,0,.3); }
.kr-lvw b{ font:900 13px 'JetBrains Mono',monospace; color:#ffe07a; }
.kr-lvw .bar{ flex:1; height:6px; border-radius:3px; background:#1a1008; border:1px solid #4a3a18; overflow:hidden; } .kr-lvw .bar i{ display:block; height:100%; background:linear-gradient(90deg,#c89a3a,#ffe08a); }
.kr-lvw small{ font:600 9px 'Inter',sans-serif; color:var(--muted); text-transform:none; letter-spacing:0; white-space:nowrap; }
.kr-tok, .kr-sarc{ display:inline-block; vertical-align:middle; }
/* ---- правая колонка по О5: узкий джекпот левее, победитель справа, низ — саркофаг · автокрутка · бесплатная · «Крутить» ---- */
.kr-right{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; padding:8px 12px 8px 0; }
.kr-jp{ width:230px; align-self:center; transform:translateX(-52px); border-radius:12px; border:2px solid var(--gold-bright); background:linear-gradient(180deg,#3a2a0e,#1a1006); padding:4px 10px; text-align:center; position:relative;
box-shadow:0 0 22px rgba(255,210,120,.3), inset 0 0 20px rgba(0,0,0,.6); }
.kr-jp .t{ font:900 10px 'Cinzel',serif; color:var(--gold); letter-spacing:.2em; }
.kr-jp .n{ font:900 22px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 0 12px #ffd060, 0 2px 2px #000; line-height:1.1; }
.kr-jp::before,.kr-jp::after{ content:'✦'; position:absolute; top:4px; color:var(--gold-bright); font-size:10px; } .kr-jp::before{ left:6px } .kr-jp::after{ right:6px }
.kr-wh{ width:62%; align-self:flex-end; text-align:center; margin-top:2px; font:800 8.5px 'Cinzel',serif; letter-spacing:.14em; text-transform:uppercase; color:#c9a24a; }
.kr-win2{ width:62%; align-self:flex-end; display:flex; align-items:center; gap:9px; padding:5px 12px; border-radius:10px; border:1px solid #6a5220; background:linear-gradient(90deg,rgba(60,42,14,.55),rgba(20,12,6,.45));
text-align:left; cursor:pointer; color:inherit; font:inherit; }
.kr-win2.empty{ cursor:default; opacity:.75; }
.kr-win2:not(.empty):hover{ border-color:var(--gold-bright); }
.kr-win2 .pf-ava, .kr-win2 .av0{ width:30px; height:30px; flex:0 0 auto; font-size:16px; }
.kr-win2 .av0{ display:flex; align-items:center; justify-content:center; border-radius:50%; border:1px dashed #5a4a30; color:var(--muted); font:800 14px 'Inter',sans-serif; }
.kr-win2 .tx{ min-width:0; display:flex; flex-direction:column; gap:1px; }
.kr-win2 .who{ font:800 12px 'Inter',sans-serif; color:var(--parchment); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kr-win2 .cl{ font:600 9px 'Inter',sans-serif; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-height:11px; }
.kr-win2 .sum{ margin-left:auto; text-align:right; font:900 14px 'JetBrains Mono',monospace; color:#ffe07a; white-space:nowrap; }
.kr-bot{ margin-top:auto; display:flex; align-items:flex-end; gap:6px; }
.kr-sand{ display:inline-flex; align-items:center; gap:7px; padding:4px 12px 4px 8px; margin-left:-16px; white-space:nowrap; border-radius:10px; border:1px solid #d4a84b; cursor:pointer;
background:linear-gradient(180deg,#3a2a10,#120c04); font:900 13px 'JetBrains Mono',monospace; color:#ffe07a; box-shadow:0 0 10px rgba(255,224,122,.2); }
.kr-sand:hover{ filter:brightness(1.15); }
.kr-spincol{ margin-left:auto; display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
.kr-spinrow{ display:flex; align-items:flex-end; gap:6px; }
.kr-sw{ display:inline-flex; align-items:center; gap:7px; padding:0; border:0; background:none; cursor:pointer; font:700 11px 'Inter',sans-serif; color:var(--muted); white-space:nowrap; }
.kr-sw i{ width:46px; height:24px; border-radius:12px; background:#2a2236; border:1px solid #5a4a2a; position:relative; transition:background .2s, border-color .2s; }
.kr-sw i::after{ content:''; position:absolute; left:3px; top:2px; width:18px; height:18px; border-radius:50%; background:#9a8cb0; transition:left .2s, background .2s; }
.kr-sw.on{ color:#8ef0a8; } .kr-sw.on i{ background:linear-gradient(180deg,#143a22,#0a1a10); border-color:#2f6a3a; box-shadow:0 0 12px rgba(142,240,168,.35); }
.kr-sw.on i::after{ left:23px; background:#8ef0a8; animation:krAutoDot 1s ease-in-out infinite alternate; }
@keyframes krAutoDot{ from{ opacity:.6; } to{ opacity:1; } }
.kr-free{ font:700 8.5px 'JetBrains Mono',monospace; color:var(--muted); padding:2px 6px; margin-bottom:1px; border-radius:999px; border:1px solid #5a4a2a; background:rgba(0,0,0,.4); white-space:nowrap; text-align:center; line-height:1.25; }
.kr-spin{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; padding:7px 14px; border-radius:10px; cursor:pointer; white-space:nowrap;
font:900 14px 'Cinzel',serif; color:#1a1208; background:linear-gradient(180deg,#ffe08a,#c89a3a 60%,#a8832a); border:1px solid #ffeeb0; box-shadow:0 3px 0 #5a4010, 0 6px 14px rgba(0,0,0,.5); }
.kr-spin small{ font:700 9.5px 'JetBrains Mono',monospace; opacity:.85; display:inline-flex; align-items:center; gap:4px; }
.kr-spin.free{ background:linear-gradient(180deg,#9df0b0,#2f8a3a 60%,#1b5a26); border-color:#c8ffd0; box-shadow:0 3px 0 #0c2c14, 0 6px 14px rgba(0,0,0,.5); color:#06180a; }
.kr-spin:hover{ filter:brightness(1.08); } .kr-spin:active{ transform:translateY(2px); box-shadow:0 1px 0 #5a4010; }
.kr-spin:disabled{ opacity:.55; cursor:not-allowed; filter:saturate(.6); transform:none; }
/* ---- поверх окна: лестница / жетоны / ящики ---- */
.kr-over{ position:absolute; inset:0; z-index:10; background:rgba(8,5,3,.8); display:flex; align-items:center; justify-content:center; }
.kr-over .card{ position:relative; width:440px; max-width:94%; border-radius:14px; border:2px solid var(--gold-bright); background:linear-gradient(180deg,#3a2a0e,#1a1006);
box-shadow:0 0 40px rgba(255,210,120,.35), 0 20px 50px #000; padding:10px 14px 12px; display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.kr-over .card.wide{ width:660px; } /* чуть больше (его слово 07.10.2026) */
.kr-over .t{ font:900 15px 'Cinzel',serif; color:var(--gold-bright); letter-spacing:.06em; text-shadow:0 0 14px rgba(255,208,96,.6); }
.kr-over .st{ font:600 10px 'Inter',sans-serif; color:var(--parchment); opacity:.9; } .kr-over .st b{ color:#ffe07a; font-family:'JetBrains Mono',monospace; }
.kr-over .hint{ font:600 10px 'Inter',sans-serif; color:var(--muted); min-height:14px; }
.kr-over .act{ display:flex; align-items:center; gap:10px; min-height:34px; }
.kr-over .or{ font:700 10px 'Inter',sans-serif; color:var(--muted); }
.kr-x{ position:absolute; right:8px; top:8px; width:22px; height:22px; border-radius:50%; border:1px solid #8a6a3a; background:rgba(0,0,0,.45); color:var(--muted); font:900 11px 'Inter',sans-serif; cursor:pointer; }
.kr-take{ padding:8px 18px; border-radius:9px; cursor:pointer; white-space:nowrap; font:900 12px 'Cinzel',serif; color:#d8ffe0; border:2px solid #2f6a3a; background:linear-gradient(180deg,#1f5a32,#0a1a10); box-shadow:0 2px 0 #06180a; }
.kr-take:hover{ filter:brightness(1.15); }
/* ---- лестница Л4 САРКОФАГИ (его выбор 05.10.2026): три стоячих саркофага, золотая крышка-маска съезжает; картинки — его, из ТГ, пока заглушка ---- */
.kr-slots{ position:relative; width:354px; height:124px; }
/* саркофаги крупнее и наряднее (его слово 07.10.2026): корпус в цвете ступени (--c), золотая кайма, на крышке маска-лицо и бинты */
.kr-sar{ position:absolute; top:0; width:118px; height:122px; padding:0; border:0; background:none; cursor:default; transition:left .11s linear, transform .2s; }
.kr-sar .sar{ position:absolute; left:22px; right:22px; top:2px; bottom:2px; border-radius:36px 36px 12px 12px; background:linear-gradient(180deg,#4a3a22,#1e1408 70%,#140c04); border:2px solid var(--c,#c9a24a); box-shadow:0 0 0 2px #2a1a08, 0 8px 16px rgba(0,0,0,.65), inset 0 0 18px rgba(0,0,0,.6); overflow:hidden; }
.kr-sar .sar::before{ content:''; position:absolute; inset:5px; border-radius:32px 32px 9px 9px; border:1px solid rgba(255,216,122,.35); pointer-events:none; }
.kr-sar .slid{ position:absolute; left:-2px; right:-2px; top:-2px; bottom:-2px; border-radius:36px 36px 12px 12px; background:linear-gradient(180deg, color-mix(in srgb, var(--c,#e0c080) 40%, #f0d08a) 0%, #c89a3a 48%, #7a5520 100%); border:2px solid #3a2608; box-shadow:inset 0 0 0 2px rgba(255,232,168,.45), inset 0 -10px 16px rgba(0,0,0,.35); display:flex; flex-direction:column; align-items:center; padding-top:9px; gap:7px;
transform:translateY(104%); transition:transform .7s cubic-bezier(.4,0,.2,1); }
.kr-sar .slid::before{ content:''; width:34px; height:40px; border-radius:50% 50% 46% 46%; border:2px solid #3a2608; background:radial-gradient(circle at 50% 38%, #ffe8a8, #c89a3a 72%); box-shadow:inset 0 -7px 0 rgba(58,38,8,.25), 0 2px 4px rgba(0,0,0,.4); } /* маска-лицо */
.kr-sar .slid::after{ content:''; width:44px; height:38px; border-radius:5px; background:repeating-linear-gradient(180deg, rgba(58,38,8,.55) 0 3px, transparent 3px 8px); box-shadow:inset 0 0 0 1px rgba(58,38,8,.4); } /* бинты */
.kr-sar.closed .slid{ transform:translateY(0); }
.kr-sar .cont{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; line-height:1; filter:drop-shadow(0 0 8px rgba(255,224,122,.8)); transition:opacity .4s, transform .4s; }
.kr-sar .cont.empty{ font:700 10px 'Inter',sans-serif; color:#8a7a6a; letter-spacing:.1em; filter:none; }
.kr-sar .cont.jackpot{ font-size:34px; filter:drop-shadow(0 0 14px #ffd060); }
.kr-sar.can{ cursor:pointer; } .kr-sar.can:hover{ transform:translateY(-3px); } .kr-sar.can:hover .sar{ box-shadow:0 0 18px rgba(255,224,122,.6), 0 8px 16px rgba(0,0,0,.6); }
.kr-sar.shake{ animation:krShake .5s ease-in-out 2; } @keyframes krShake{ 0%,100%{ transform:rotate(0); } 25%{ transform:rotate(-3deg); } 75%{ transform:rotate(3deg); } }
.kr-sar.good .sar{ border-color:#9be07a; box-shadow:0 0 22px rgba(155,224,122,.6), 0 6px 14px rgba(0,0,0,.6); } .kr-sar.bad{ filter:saturate(.4); }
.kr-jpwin{ font:900 18px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 0 16px #ffd060; animation:krJp .6s ease-in-out infinite alternate; padding:2px 12px; border-radius:9px; border:1px solid #ffe07a; }
/* ---- лестница по макету В: «ЗАБРАТЬ ВЕРНОЕ | или | НАЙДИ МУМИЮ» ---- */
.kr-choice{ display:flex; gap:10px; align-items:stretch; width:100%; }
.kr-sure{ flex:0 0 150px; border-radius:10px; border:2px solid #2f6a3a; background:linear-gradient(180deg,#143a22,#0a1a10); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:8px; }
.kr-sure.off{ opacity:.55; }
.kr-sure .t{ font:900 10px 'Cinzel',serif; color:#8ef0a8; letter-spacing:.1em; text-shadow:none; }
.kr-sure .n{ font:900 20px 'JetBrains Mono',monospace; color:#d8ffe0; }
.kr-sure .d{ font:600 8.5px 'Inter',sans-serif; color:var(--muted); }
.kr-take.sm{ margin-top:3px; padding:5px 14px; font-size:11px; }
.kr-take:disabled{ opacity:.5; cursor:not-allowed; filter:none; }
.kr-choice .or{ align-self:center; font:900 12px 'Cinzel',serif; color:var(--gold-bright); }
.kr-risk{ flex:1; min-width:0; border-radius:10px; border:2px solid var(--gold); background:rgba(0,0,0,.35); display:flex; flex-direction:column; align-items:center; padding:6px 8px 5px; gap:5px; }
.kr-risk .t{ font:900 10px 'Cinzel',serif; color:var(--gold-bright); letter-spacing:.1em; text-shadow:none; }
.kr-risk .d{ font:600 9.5px 'Inter',sans-serif; color:var(--muted); min-height:12px; }
.kr-over .card.jackpot .kr-risk, .kr-over .card.prize .kr-risk{ border-color:#5a4a2a; }
/* лестница 07.10.2026: только саркофаги (две награды + проходка), «забрать» нет */
.kr-play{ margin-top:2px; align-self:flex-end; margin-right:6px; } /* «Крутить» снизу справа в правом окне */
.kr-choice.one{ justify-content:center; }
.kr-choice.one .kr-risk{ flex:0 1 420px; }
.kr-sar .cont.prize{ font:800 13px 'JetBrains Mono',monospace; color:#fff3c0; white-space:nowrap; text-shadow:0 0 6px rgba(0,0,0,.9); filter:drop-shadow(0 0 6px rgba(255,224,122,.7)); }
.kr-buy{ display:flex; gap:8px; }
.kr-bb{ width:88px; padding:6px 4px; border-radius:9px; border:1px solid #d4a84b; background:linear-gradient(180deg,#3a2a10,#120c04); color:#ffe07a; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:2px; }
.kr-bb b{ font:900 16px 'JetBrains Mono',monospace; } .kr-bb small{ font:700 9px 'JetBrains Mono',monospace; color:var(--muted); }
.kr-bb:hover:not(:disabled){ filter:brightness(1.15); } .kr-bb:disabled{ opacity:.45; cursor:not-allowed; }
/* ---- ящики — вкладками, как сундуки Ленты удачи (.lu-chip): сверху три вкладки, ниже один ящик крупно.
05.10.2026 (44-я, его слово «артефакты круче»): артефакты — SVG krArtSVG с лучами, сет плитками, полоса тотемов шире ---- */
.kr-over .card.boxes{ width:560px; padding-top:8px; gap:8px; }
.kr-tabs{ display:flex; gap:6px; width:100%; padding-right:26px; }
.kr-tab{ flex:1 1 0; min-width:0; display:flex; align-items:center; justify-content:center; gap:7px; padding:3px 6px; border-radius:9px; cursor:pointer;
border:1px solid #5a4520; background:rgba(0,0,0,.3); font:700 10.5px 'Cinzel',serif; color:var(--parchment); white-space:nowrap; overflow:hidden; }
.kr-tab .kr-art{ flex:0 0 auto; filter:drop-shadow(0 2px 3px rgba(0,0,0,.7)); }
.kr-tab .cn{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.1; } .kr-tab .cn small{ font:700 8.5px 'JetBrains Mono',monospace; color:var(--muted); }
.kr-tab.on{ border-color:var(--gold-bright); color:var(--gold-bright); background:linear-gradient(180deg,rgba(230,201,118,.22),rgba(60,40,10,.3)); }
.kr-tab.on .cn small{ color:#ffe07a; }
.kr-box{ width:100%; display:flex; align-items:stretch; gap:14px; padding:8px 12px 10px; border-radius:11px; border:1px solid #8a6a2a; background:rgba(0,0,0,.35); text-align:left; }
.kr-box.full{ opacity:.75; }
.kr-box .big{ flex:0 0 150px; height:150px; border-radius:12px; border:1px solid #d4a84b; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
background:radial-gradient(ellipse at 50% 120%,#e0b860,#8a6224 55%,#3a2410); box-shadow:inset 0 0 22px rgba(0,0,0,.6), 0 0 18px rgba(255,224,122,.25); }
.kr-box .big .rays{ position:absolute; inset:-40%; background:repeating-conic-gradient(from 0deg, rgba(255,224,122,0) 0 10deg, rgba(255,224,122,.16) 10deg 20deg); animation:krRays 16s linear infinite; }
@keyframes krRays{ to{ transform:rotate(360deg); } }
.kr-box .big .kr-art{ position:relative; filter:drop-shadow(0 8px 12px rgba(0,0,0,.75)); animation:krFloat 2.8s ease-in-out infinite; }
@keyframes krFloat{ 50%{ transform:translateY(-5px); } }
.kr-box .big .lbl{ position:absolute; left:0; right:0; bottom:0; padding:5px 4px 4px; text-align:center; background:linear-gradient(0deg,rgba(0,0,0,.8),transparent); font:900 10px 'Cinzel',serif; color:#ffe9a8; letter-spacing:.08em; text-transform:uppercase; }
.kr-box .big.yes{ animation:krBoxYes .9s ease-out; } .kr-box .big.no{ animation:krBoxNo .5s ease-out; }
@keyframes krBoxYes{ 0%{ box-shadow:0 0 0 0 rgba(155,224,122,.9); } 100%{ box-shadow:0 0 40px 10px rgba(155,224,122,0); } }
@keyframes krBoxNo{ 0%,100%{ transform:translateX(0); } 25%{ transform:translateX(-5px); } 75%{ transform:translateX(5px); } }
.kr-box .info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.kr-box .nm{ font:900 14px 'Cinzel',serif; letter-spacing:.06em; text-transform:uppercase; color:#ffe9a8; }
.kr-box .sub{ font:600 9.5px 'Inter',sans-serif; color:var(--muted); }
.kr-tiles{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.kr-tile{ height:44px; border-radius:8px; background:#1a1424; border:1px solid #3a3050; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; font-size:14px; line-height:1.1; }
.kr-tile b{ font:800 11px 'JetBrains Mono',monospace; color:#ffe07a; } .kr-tile small{ font:600 8px 'Inter',sans-serif; color:var(--muted); }
.kr-box .tot{ display:flex; align-items:center; gap:8px; font:600 9.5px 'Inter',sans-serif; color:var(--muted); } .kr-box .tot b{ color:var(--parchment); font:800 11px 'JetBrains Mono',monospace; white-space:nowrap; }
.kr-box .bar{ flex:1; height:8px; border-radius:4px; background:#1a1008; border:1px solid #4a3a18; overflow:hidden; } .kr-box .bar i{ display:block; height:100%; background:linear-gradient(90deg,#c89a3a,#ffe08a); }
.kr-box .act{ margin-top:auto; display:flex; align-items:center; gap:10px; }
.kr-box .have{ margin-left:auto; display:inline-flex; align-items:center; gap:5px; font:800 11px 'JetBrains Mono',monospace; color:#ffe07a; padding:3px 9px; border-radius:9px; border:1px solid #d4a84b; background:linear-gradient(180deg,#3a2a10,#120c04); white-space:nowrap; }
.kr-box .have small{ font:600 8.5px 'Inter',sans-serif; color:var(--muted); }
.kr-open{ padding:8px 18px; border-radius:8px; border:1px solid #e6c976; cursor:pointer; white-space:nowrap; font:800 11px 'Inter',sans-serif; color:#1a1208;
background:linear-gradient(180deg,#ffe08a,#c89a3a 60%,#a8832a); box-shadow:0 2px 0 #5a4010; }
.kr-open:disabled{ opacity:.5; cursor:not-allowed; filter:saturate(.5); }
/* 68-я 14.10.2026: ОКНО РЫНКА — его выбор фон 1 «базар у пирамид» (ui-proba/rynok/fon-rynok-a.jpg) + вкладки, вывеска «Рынок» и доска под ними
(лист ui-proba/rynok/vkladki-list.jpg, резал narezka-kuski.js) — img/rynok/ui/{fon,norm,sel,tablichka,panel}.webp */
#shopModal.bz-lavka{ background:linear-gradient(90deg,rgba(10,6,4,.35) 0,rgba(10,6,4,.15) 18%,rgba(10,6,4,.12) 100%), url(img/rynok/ui/fon.webp) center/cover no-repeat; }
#shopModal.bz-lavka .shop-side{ border-right:0; padding:6px 8px 8px; margin:-2px 0; width:150px; box-sizing:border-box; background:url(img/rynok/ui/panel.webp) center/100% 100% no-repeat; }
#shopModal.bz-lavka .shop-side .pm-title svg{ display:none; } /* 68-я: без бочки перед «Рынок» (его слово) */
#shopModal.bz-lavka .shop-side .pm-title{ height:40px; box-sizing:border-box; padding:13px 0 0; margin:0 0 2px; display:flex; align-items:center; justify-content:center;
background:url(img/rynok/ui/tablichka.webp) center/100% 100% no-repeat; color:#ffe0a0; text-shadow:0 1px 2px #000; }
#shopModal.bz-lavka .shop-tab{ height:29px; padding:0 4px; background:none; border:0 solid transparent; border-width:0 16px; border-radius:0; box-shadow:none;
border-image:url(img/rynok/ui/norm.webp) 0 70 fill / 0 16px stretch; color:#f0dcb0; text-shadow:0 1px 2px #000; }
#shopModal.bz-lavka .shop-tab.active{ color:#ffe08a; filter:brightness(1.35) drop-shadow(0 0 4px rgba(255,200,90,.6)); } /* 68-я: открытая — та же тёмная, только ярче (его слово «бриллианты обычную сделай»: жёлтая — только «Акции») */
/* 68-я: «Акции» — всегда жёлтая (золотая с фонариком), его слово «жёлтую кнопку поставь на акции»; открытая — ещё и светится */
#shopModal.bz-lavka .shop-tab[data-shoptab="promo"]{ border-width:0 16px 0 24px; border-image:url(img/rynok/ui/sel.webp) 0 70 0 100 fill / 0 16px 0 24px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
#shopModal.bz-lavka .shop-tab[data-shoptab="promo"].active{ filter:brightness(1.12) drop-shadow(0 0 5px rgba(255,200,90,.8)); }
/* 70-я: окно покупки печатей картинкой — как «купить атаки» (68-я): рамка okno-ataki-bolt.webp 698×300, имя в табличке 36–64 % × 2,3–17,3 %,
строка на полосе 14–82 % × 29–48 %, 4 плитки 58–92 % (left 12,8 / 33,8 / 54,7 / 75,6 %, ширина 11,4 %) */
.pop-window.sk-okno{ width:min(560px,94%); max-height:none; aspect-ratio:698/300; padding:0; border:0; border-radius:0; box-shadow:none; overflow:visible;
background:url(img/osada/okno-ataki-bolt.webp) center/100% 100% no-repeat; filter:drop-shadow(0 14px 26px rgba(0,0,0,.8)); position:relative; }
.sk-okno .sk-okno-in{ position:absolute; inset:0; display:block; overflow:visible; max-width:none; }
.sk-okno .sk-t{ position:absolute; left:36%; width:28%; top:2.3%; height:15%; display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--gold-bright); text-shadow:0 1px 2px #000; white-space:nowrap; overflow:hidden; }
.sk-okno .sk-s{ position:absolute; left:14%; width:68%; top:29%; height:19%; display:flex; align-items:center; justify-content:center; gap:3px; font-size:13px; color:#f0e0c0; text-shadow:0 1px 2px #000; white-space:nowrap; }
.sk-okno .sk-s b{ color:#ffe08a; } .sk-okno .srp-val{ width:15px; height:15px; vertical-align:-3px; }
.sk-okno .sk-packs{ display:block; }
.sk-okno .sk-pack{ position:absolute; top:58%; height:34%; width:11.4%; margin:0; padding:3px 0 4px; display:flex; flex-direction:column; align-items:center; justify-content:space-between;
background:none; border:0; border-radius:8px; box-shadow:none; color:#fff; cursor:pointer; }
.sk-okno .sk-pack:nth-child(1){ left:12.8%; } .sk-okno .sk-pack:nth-child(2){ left:33.8%; } .sk-okno .sk-pack:nth-child(3){ left:54.7%; } .sk-okno .sk-pack:nth-child(4){ left:75.6%; }
.sk-okno .sk-pack:not(:disabled):hover{ filter:brightness(1.25); } .sk-okno .sk-pack:disabled{ opacity:.45; cursor:not-allowed; }
.sk-okno .sk-pic{ display:flex; } .sk-okno .sk-pic .siege-mark, .sk-okno .sk-pic img, .sk-okno .sk-pic svg{ width:30px; height:30px; display:block; }
.sk-okno .sk-pack b{ font-family:'Cinzel',serif; font-size:15px; color:#fff; line-height:1; text-shadow:0 1px 2px #000, 0 0 5px #000; }
.sk-okno .sk-pack small{ display:flex; flex-direction:column; align-items:center; gap:1px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:11px; color:#ffe08a; line-height:1; text-shadow:0 1px 2px #000, 0 0 4px #000; }
.sk-okno .sk-pack small .srp-val{ width:13px; height:13px; }
.sk-okno .sk-x2{ position:absolute; right:-6px; top:-6px; z-index:2; background:rgba(0,0,0,.7); }
/* 70-я: «Акции» — готовые карточки его листа (img/rynok/akcii-*.webp, 1658×746 ≈ 2,2:1): картуш имени 31–69 % × 2–13 %, картуш цены 38–62 % × 84–96 %,
предмет нарисован слева, справа (45–95 %) состав пака кодом; у Кассии — пустая ниша слева, туда портрет героя */
.bz-card.pr.ak .bz-t{ left:31%; width:38%; top:2.5%; height:12%; }
.bz-card.pr.ak .bz-bmid{ left:43%; right:5%; top:18%; bottom:19%; }
.bz-card.pr.ak .bz-p{ left:38%; width:24%; top:84%; height:12%; }
.bz-card.pr.ak .bz-pkhero{ position:absolute; z-index:1; left:11.5%; width:16%; top:27%; height:52%; display:flex; align-items:center; justify-content:center; }
.bz-card.pr.ak .bz-pkhero .bz-por{ width:100%; height:100%; border-radius:30px 30px 4px 4px; overflow:hidden; }
.bz-card.pr.ak .bz-pkhero .bz-por svg{ width:100%; height:100%; }
.bz-card.pr.ak .bz-t{ font-size:11px; white-space:nowrap; letter-spacing:-.01em; }
.bz-card.pr.ak .bz-bmid{ left:45%; right:4%; }
.bz-card.pr.ak .bz-chip{ font-size:10.5px; padding-right:4px; }
.bz-card.pr.ak .bz-chip span{ white-space:nowrap; overflow:hidden; text-overflow:clip; }
.bz-card.pr.ak .bz-pkhero{ left:9.5%; width:20%; top:22%; height:58%; }
/* 70-я, его слово «надписи контролируй, Оружейную по центру»: картуш имени у каждой карточки свой (замер по картинке), ниша Кассии — по арке */
.bz-card.pr.ak .bz-t{ left:32%; width:36%; display:flex; align-items:center; justify-content:center; text-align:center; }
.bz-card.pr.ak[data-pk="pk_boost"] .bz-t{ top:6.5%; height:14%; }
.bz-card.pr.ak[data-pk="pk_hero"] .bz-t{ top:7.5%; height:13.5%; }
.bz-card.pr.ak[data-pk="pk_weapons"] .bz-t{ top:1.5%; height:16.5%; }
.bz-card.pr.ak[data-pk="pk_boost"] .bz-p{ top:82%; height:13.5%; }
.bz-card.pr.ak[data-pk="pk_hero"] .bz-p, .bz-card.pr.ak[data-pk="pk_weapons"] .bz-p{ top:82.5%; height:14.5%; }
.bz-card.pr.ak .bz-pkhero{ left:14.3%; width:13.7%; top:21%; height:51%; }
.bz-card.pr.ak .bz-pkimg{ width:100%; height:100%; object-fit:cover; object-position:50% 12%; border-radius:40px 40px 2px 2px; box-shadow:inset 0 0 8px #000; }
/* 70-я, «Арсенал» — его выбор Б (макет client/maket-arsenal.html): гробница слева + справа сет, полка 9 вещей, короткий бонус и маленькая кнопка */
.sh-modal .sh-body{ grid-template-columns:auto minmax(0,1fr); gap:16px; padding:6px 14px 8px; }
.sh-modal .sh-inv{ width:auto; height:100%; aspect-ratio:1888/2272; max-height:328px; }
.sh-rb{ display:flex; flex-direction:column; gap:8px; min-width:0; padding-top:4px; }
.sh-rt2{ display:flex; align-items:center; justify-content:space-between; gap:8px; font:700 12px Georgia,serif; color:#e8d8b0; white-space:nowrap; }
.sh-rt2 b{ color:#ffe08a; font-size:14px; } .sh-stars span{ color:#5a4a30; font-size:14px; } .sh-stars span.on{ color:#ffd870; text-shadow:0 0 6px rgba(255,210,110,.7); }
.sh-shelf{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px 6px; margin-top:2px; }
.sh-it{ position:relative; aspect-ratio:1; border-radius:9px; background:radial-gradient(circle,#3a2a18,#120a04 75%); border:1.5px solid #8a6424; display:flex; align-items:center; justify-content:center; }
.sh-it img{ width:78%; height:78%; object-fit:contain; }
.sh-it.miss{ border-style:dashed; border-color:#5a4a30; } .sh-it.miss > img, .sh-it.miss > svg, .sh-it.miss > span{ filter:grayscale(1) brightness(.35); }
.sh-it.have::after{ content:'✓'; position:absolute; right:-3px; bottom:-3px; width:14px; height:14px; border-radius:50%; background:#3fa04a; color:#fff; font:900 9px/14px system-ui; text-align:center; border:2px solid #2a1a0e; }
.sh-it.worn{ box-shadow:0 0 0 2px #ffe07a, 0 0 8px rgba(255,224,122,.7); }
.sh-it small{ position:absolute; left:-4px; right:-4px; bottom:-13px; font-size:8.5px; color:#cdb080; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh-foot{ margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.sh-bon2{ font:600 10.5px/1.45 'Inter',sans-serif; color:#e8d8b8; } .sh-bon2 b{ color:#ffe08a; font-family:'JetBrains Mono',monospace; }
.sh-foot .sh-btn{ flex:0 0 auto; width:auto; min-width:118px; padding:7px 14px; font-size:12px; }
/* 70-я, «Арсенал» — его выбор Г1 (client/maket-arsenal-b.html): звёзды сверху, «Сет N», 4 стата строкой + урон, полка вещей на всё свободное место */
.sh-rb.g1{ gap:5px; }
.sh-rb.g1 .sh-stars{ display:flex; gap:5px; } .sh-rb.g1 .sh-stars span{ font-size:20px; line-height:1; }
.sh-set{ font:800 15px 'Cinzel',serif; color:#ffe08a; letter-spacing:.04em; }
.sh-sline{ display:flex; gap:4px; } .sh-sline span{ flex:1; min-width:0; display:flex; align-items:center; justify-content:center; gap:3px; padding:4px 2px; border-radius:7px;
background:rgba(255,255,255,.06); border-bottom:2px solid var(--c); }
.sh-sline img{ width:15px; height:15px; object-fit:contain; flex-shrink:0; } .sh-sline b{ font:800 11.5px 'JetBrains Mono',monospace; color:#fff; white-space:nowrap; min-width:0; }
.sh-dline{ font-size:10.5px; color:#cdb080; white-space:nowrap; overflow:hidden; } .sh-dline b{ font:800 12px 'JetBrains Mono',monospace; color:#ffe08a; }
.sh-rb.g1 .sh-shelf{ flex:1; min-height:0; grid-template-rows:repeat(2,minmax(0,1fr)); gap:4px 10px; padding:2px 8px 0; margin:0; }
.sh-rb.g1 .sh-it{ width:auto; height:calc(100% - 15px); max-height:76px; aspect-ratio:1; align-self:start; justify-self:center; }
.sh-rb.g1 .sh-it small{ bottom:-13px; font-size:9px; left:-10px; right:-10px; }
.sh-rb.g1 .sh-foot{ margin-top:4px; }
/* 16.10 (70-я): звёзды сета в Арсенале — картинки «солнечный рубин» (zv-c-on/off.webp) */
.sh-stars img.zv{ width:18px; height:18px; display:block; }
.sh-rb.g1 .sh-stars img.zv{ width:22px; height:22px; }
.sh-stars img.zv.on{ filter:drop-shadow(0 0 4px rgba(255,200,80,.55)); }
/* 16.10 (70-я): золото картинкой (ZOL в js/04) */
.zol-ic{ display:inline-block; width:1.15em; height:1.15em; vertical-align:-0.22em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
/* 71-я: карточка сундука «герой уже выбит» — его картинка сундука с костями на всю рамку, внизу число и «уже у тебя» */
.lu-hero.dupe{ justify-content:flex-end; }
.lu-dupe{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:1px; padding:0 4px 4px; text-align:center; }
.lu-dupe b{ display:inline-flex; align-items:center; gap:4px; font:800 15px 'JetBrains Mono',monospace; color:#fff3c8; text-shadow:0 1px 3px #000,0 0 6px #000; }
.lu-dupe b img{ width:20px; height:20px; object-fit:contain; }
.lu-dupe span{ font:700 10px 'Inter',sans-serif; color:#e8d8b8; text-shadow:0 1px 2px #000; }
/* 71-я: «герой уже выбит» в плитке, ленте и окне «что выпало» — маленький сундук с костями (img/rynok/dupe-*-ik.webp) на всю клетку, число поверх снизу */
.lu-c.dupe{ position:relative; padding:0; overflow:hidden; justify-content:flex-end; }
.lu-c.dupe .lu-dim{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.lu-c.dupe span{ position:relative; z-index:1; width:100%; text-align:center; padding:1px 0 2px; background:linear-gradient(180deg,transparent,rgba(0,0,0,.75)); }
/* в плитке наверху (широкая и низкая) — как у остальных: картинка слева, число справа */
.lu-tiles .lu-c.dupe, .lu:is(.duat,.salaz) .lu-tiles .lu-c.dupe{ flex-direction:row; justify-content:center; gap:5px; padding:0 6px 0 3px; }
.lu-tiles .lu-c.dupe .lu-dim{ position:static; width:38px; height:38px; border-radius:7px; flex-shrink:0; }
.lu-tiles .lu-c.dupe span{ width:auto; background:none; padding:0; }
.luw-ico .luw-dim{ width:72px; height:72px; object-fit:cover; border-radius:10px; box-shadow:0 0 12px rgba(255,210,120,.45); }
/* 71-я: новая картинка Площади (ночь, его Gemini) — значков на ней нет, медальоны показываем кодом; Логово — «Скоро» */
.pl-scene.img .pl-ic{ display:flex; width:44px; height:44px; inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); font-size:20px; }
.pl-scene.img .pl-spot{ width:46px; height:46px; }
.pl-soon{ position:absolute; left:50%; bottom:100%; transform:translateX(-50%); margin-bottom:1px; z-index:1; white-space:nowrap; font:800 9px 'Inter',sans-serif; letter-spacing:.06em; text-transform:uppercase;
color:#fff; padding:2px 7px; border-radius:6px; background:linear-gradient(180deg,#e04a2a,#8a1a0a); border:1px solid #ffb080; box-shadow:0 0 8px rgba(255,90,40,.6); }
/* 71-я: значки Площади — его лист Gemini (ui-proba/ploschad/znachki-list.jpg → kuski/, медальоны-метки с кончиком вниз) вместо эмодзи;
центр круга медальона — в точке кнопки (круг сверху картинки, его центр = половина ширины) */
.pl-scene.img .pl-ic{ width:50px; height:58px; left:50%; top:50%; transform:translate(-50%,-25px); border:none; border-radius:0; box-shadow:none; font-size:0;
background:var(--plik) top center/100% auto no-repeat; filter:drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.pl-scene.img .pl-spot{ border-color:transparent !important; box-shadow:none !important; }
.pl-scene.img .pl-spot:hover .pl-ic, .pl-scene.img .pl-spot:active .pl-ic{ filter:drop-shadow(0 0 8px rgba(255,220,130,.9)); }
.pl-scene.img .pl-nm{ margin-top:10px; }
.pl-scene.img .pl-soon{ margin-bottom:3px; }
.pl-spot[data-pl="friends"]{ --plik:url(img/ploschad/ik-friends.webp); } .pl-spot[data-pl="events"]{ --plik:url(img/ploschad/ik-events.webp); }
.pl-spot[data-pl="clan"]{ --plik:url(img/ploschad/ik-clan.webp); } .pl-spot[data-pl="fame"]{ --plik:url(img/ploschad/ik-fame.webp); }
.pl-spot[data-pl="dig"]{ --plik:url(img/ploschad/ik-dig.webp); } .pl-spot[data-pl="games"]{ --plik:url(img/ploschad/ik-games.webp); }
.pl-spot[data-pl="lair"]{ --plik:url(img/ploschad/ik-lair.webp); }
/* 71-я, его фон «Арена ночью» (ui-proba/zal-slavy/fon-2.jpg; первый «Зал статуй» — fon.jpg): фон на всё окно Зала славы; стела и строки — полупрозрачные, чтобы зал просвечивал */
.hall-modal{ background:#120c06 url(img/zal-slavy/fon.webp) center/cover no-repeat; }
.hall-stela{ background:linear-gradient(180deg,rgba(14,18,30,.62),rgba(10,12,20,.72)); }
.hall-stela::after{ background:linear-gradient(180deg,transparent,rgba(10,12,20,.9)); }
/* 71-я: Зал славы — вкладки и кнопки строки с его листа Gemini (ui-proba/zal-slavy/list-2.jpg → kuski/): края с узором не тянутся (border-image), середина растягивается */
#hallModal .siege-tab{ height:32px; padding:0 6px; margin-bottom:0; background:none; border:0 solid transparent; border-width:0 15px; border-radius:0;
border-image:url(img/zal-slavy/tab-off.webp) 0 30 fill / 0 15px stretch; color:#b8c4dc; text-shadow:0 1px 2px #000; }
#hallModal .siege-tab.sel{ border-image-source:url(img/zal-slavy/tab-on.webp); color:#3a1f08; text-shadow:0 1px 0 rgba(255,230,180,.6); }
#hallModal .hall-tag{ width:84px; height:30px; border-radius:0; background:none; border:0 solid transparent; border-width:0 14px; box-shadow:none; }
#hallModal .hall-tag.add{ border-image:url(img/zal-slavy/kn-add.webp) 0 30 fill / 0 14px stretch; color:#f2fff4; text-shadow:0 1px 2px #062010,0 0 4px #062010; }
#hallModal .hall-tag.wait{ border-image:url(img/zal-slavy/kn-wait.webp) 0 30 fill / 0 14px stretch; color:#d0c8b8; font-size:11px; }
#hallModal .hall-tag.fr{ border-width:0 14px 0 37px; padding:0; border-image:url(img/zal-slavy/kn-drug.webp) 0 30 0 80 fill / 0 14px 0 37px stretch; color:#ffe9b0; font-size:11px; text-shadow:0 1px 2px #000; }
#hallModal .hall-tag.none{ border:none; }
/* 71-я: Зал славы — строки, медали мест и свиток с его листов Gemini (вторая попытка: ui-proba/zal-slavy/list-a.jpg, list-b.jpg → kuski/) */
#hallModal .hall-row{ border-radius:0; background:none; box-shadow:none; min-height:42px; padding:0 2px; border:0 solid transparent; border-width:0 45px;
border-image:url(img/zal-slavy/str-norm.webp) 0 90 fill / 0 45px stretch; margin:0; }
#hallModal .hall-row.p1{ border-image-source:url(img/zal-slavy/str-1.webp); } /* все строки — одна ширина концов (45px), чтобы место, имя и число стояли ровно в столбик (его слово «имена плавают») */
#hallModal .hall-row.p2{ border-image-source:url(img/zal-slavy/str-2.webp); }
#hallModal .hall-row.p3{ border-image-source:url(img/zal-slavy/str-3.webp); }
#hallModal .hall-row.me{ border-image-source:url(img/zal-slavy/str-ya.webp); box-shadow:none; }
#hallModal .hall-rk{ width:28px; flex-shrink:0; }
#hallModal .hall-row.sel{ filter:brightness(1.18) drop-shadow(0 0 5px rgba(255,210,120,.7)); }
#hallModal .hall-rk.m1, #hallModal .hall-rk.m2, #hallModal .hall-rk.m3{ width:28px; height:36px; display:flex; align-items:center; justify-content:center; padding-top:9px;
background:center/contain no-repeat; font:800 11px 'JetBrains Mono',monospace; text-shadow:0 1px 0 rgba(255,255,255,.45); }
#hallModal .hall-rk.m1{ background-image:url(img/zal-slavy/med-1.webp); color:#4a2c06; }
#hallModal .hall-rk.m2{ background-image:url(img/zal-slavy/med-2.webp); color:#2a3040; }
#hallModal .hall-rk.m3{ background-image:url(img/zal-slavy/med-3.webp); color:#3a1a08; }
#hallModal .hall-pa{ border-radius:0; box-shadow:none; background:url(img/zal-slavy/svitok.webp) center/100% 100% no-repeat; padding:32px 17% 32px; margin:0; } /* бумага свитка — между роликами, уже самих роликов */
#hallModal .hall-pa::before, #hallModal .hall-pa::after{ display:none; }
/* 71-я, его слово «свиток на весь тот фон, без надписи Ты, и сзади свитка фон»: свиток во весь правый столбец, заголовок — на бумаге,
«Ты / ID» убрано (чьи — видно по подсвеченной строке слева); позади свитка — арена окна сквозь тёмное стекло и золотое сияние */
#hallModal .hall-ach{ position:relative; padding:4px; gap:0; border-color:rgba(202,164,76,.45); overflow:hidden;
background:radial-gradient(ellipse at 50% 45%,rgba(255,200,110,.28),transparent 62%),linear-gradient(180deg,rgba(10,14,26,.55),rgba(8,10,18,.8)); }
#hallModal .hall-who{ display:none; }
#hallModal .hall-pa{ flex:1; padding:38% 16% 22% 17%; justify-content:space-around; filter:drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
#hallModal .hall-k{ position:absolute; left:20%; right:20%; top:17%; z-index:2; white-space:normal; line-height:1.15; letter-spacing:.04em; color:#5a3a12; font-size:9px; text-shadow:0 1px 0 rgba(255,240,200,.6); pointer-events:none; }
#hallModal .hall-pr{ font-size:10.5px; gap:4px; color:#3a250c; } /* 71-я: «Бриллианты» вылезали за бумагу — мельче и шире строка */
#hallModal .hall-pr > span:nth-child(2){ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#hallModal .hall-pr .ic{ width:20px; height:20px; display:flex; align-items:center; justify-content:center; }
#hallModal .hall-pr .ic img{ width:20px; height:20px; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.4)); }
#hallModal .hall-pr .dots{ border-bottom-color:#9a7a48; }
#hallModal .hall-pr .val{ color:#5a2a08; }
/* 71-я, его слово: строку «топ-100 за всё время · ты #N · обновляется каждые 5 с» над Залом славы убрать */
#hallModal .hall-sub{ display:none; }
/* 71-я, его выбор фона «Двор у фонтана» (ui-proba/druzya/fon.jpg): фон на всё окно Друзей; карточки — полупрозрачные, чтобы двор просвечивал */
#friendsModal{ background:#0e1220 url(img/druzya/fon.webp) center/cover no-repeat; }
#friendsModal .fr-card{ background:linear-gradient(180deg,rgba(30,26,40,.78),rgba(16,14,24,.82)); }
#friendsModal .fr-row{ background:linear-gradient(90deg,rgba(24,22,36,.82),rgba(16,14,24,.7)); }
/* 71-я: окно Друзей — его листы Gemini (ui-proba/druzya/list-x/y/z.jpg → kuski/): строка друга с фонариками, карточка заявки с ковриком,
поиск с лупой, кнопки принять/отклонить/удалить/отправить, фильтры-«таблетки», вкладки, папирус «по ID», рамка аватара.
Концы с узором не тянутся (border-image), середина растягивается. */
/* 71-я, его выбор вкладок «арка с фонарём» (ui-proba/druzya/vkladki.jpg, ряд 2): арка целиком, надпись — в нижней части под фонарём */
#friendsModal .siege-tab{ width:124px; height:46px; padding:17px 4px 0; margin-bottom:0; border:none; border-radius:0; box-shadow:none;
background:url(img/druzya/ark-off.webp) center bottom/100% 100% no-repeat; color:#b8c4dc; text-shadow:0 1px 2px #000; }
#friendsModal .siege-tab.sel{ background-image:url(img/druzya/ark-on.webp); color:#fff3c8; text-shadow:0 1px 2px #3a1a04,0 0 6px #3a1a04; }
#friendsModal .fr-row{ border:0 solid transparent; border-width:0 26px; border-radius:0; padding:0 2px; min-height:40px;
border-image:url(img/druzya/stroka.webp) 0 52 fill / 0 26px stretch; }
#friendsModal .fr-card{ border:none; border-radius:0; background:url(img/druzya/karta.webp) center/100% 100% no-repeat; padding:7px 14px 19px; gap:2px; }
#friendsModal .fr-card .acts .fr-b{ padding-top:4px; padding-bottom:4px; }
#friendsModal .fr-search{ border:0 solid transparent; border-width:0 8px 0 26px; border-radius:0; padding:5px 4px; background:none;
border-image:url(img/druzya/poisk.webp) 0 18 0 56 fill / 0 8px 0 26px stretch; }
#friendsModal .fr-chip{ border:0 solid transparent; border-width:0 12px; border-radius:0; padding:5px 2px; background:none; color:#b8c4dc;
border-image:url(img/druzya/chip-off.webp) 0 26 fill / 0 12px stretch; }
#friendsModal .fr-chip.on{ border-image-source:url(img/druzya/chip-on.webp); color:#3a1f08; }
#friendsModal .fr-b{ border:0 solid transparent; border-width:0 10px; border-radius:0; box-shadow:none; background:none; padding:6px 4px; text-shadow:0 1px 2px rgba(0,0,0,.6); }
#friendsModal .fr-b.ok{ border-image:url(img/druzya/kn-da.webp) 0 22 fill / 0 10px stretch; color:#f2fff4; }
#friendsModal .fr-b.no{ border-image:url(img/druzya/kn-net.webp) 0 22 fill / 0 10px stretch; color:#fff; }
#friendsModal .fr-b.gr{ border-width:0 12px; border-image:url(img/druzya/chip-off.webp) 0 26 fill / 0 12px stretch; color:#b8c4dc; }
#friendsModal .fr-b.sq{ width:28px; height:28px; padding:0; border:none; background:url(img/druzya/kn-x.webp) center/100% 100% no-repeat; color:#d0d6e6; }
#friendsModal #frSend{ border-width:0 30px; padding:9px 4px; border-image:url(img/druzya/kn-zayavka.webp) 0 70 fill / 0 30px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); font-size:11.5px; }
#friendsModal .fr-pap{ border:0 solid transparent; border-width:0 34px; border-radius:0; box-shadow:none; background:none; padding:20px 12px 26px; width:460px; gap:8px;
border-image:url(img/druzya/papirus.webp) 0 70 fill / 0 34px stretch; }
#friendsModal .fr-av{ border:none; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; }
#friendsModal .fr-pap .note{ color:#6a4a20; }
/* 71-я, его слово «заявки криво — как всё стоит и выглядит»: карточка заявки — ровная сетка из трёх строк:
[аватар, имя #ID, ★ слава | ⏳ срок] · [урон атаками картинками | ☥ достижения] · [Принять | ✕]; две строки карточек влезают без прокрутки */
#friendsModal .fr-grid{ grid-auto-rows:100px; gap:6px 8px; } /* шапка с арками выше — две строки по 100 влезают без прокрутки */
#friendsModal .fr-card{ display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto 1fr; align-items:center; column-gap:6px; row-gap:3px; padding:8px 16px 18px 14px; }
#friendsModal .fr-card .hd{ grid-column:1; grid-row:1; gap:7px; }
#friendsModal .fr-card .hd .fr-av{ width:34px; height:34px; font-size:16px; }
#friendsModal .fr-card .fr-tm{ position:static; grid-column:2; grid-row:1; align-self:start; margin-top:3px; }
#friendsModal .fr-card .fr-dmg{ grid-column:1; grid-row:2; }
#friendsModal .fr-card .fr-ttl{ grid-column:2; grid-row:2; }
#friendsModal .fr-card .acts{ grid-column:1 / -1; grid-row:3; align-self:end; margin:0; }
#friendsModal .fr-card .acts .fr-b.ok{ flex:3; } #friendsModal .fr-card .acts .fr-b.no{ flex:1; }
#friendsModal .fr-dmg{ gap:9px; align-items:center; }
#friendsModal .fr-dmg span{ display:inline-flex; align-items:center; gap:2px; }
#friendsModal .fr-dmg span::before{ content:''; width:14px; height:14px; margin:0; background:center/contain no-repeat; }
#friendsModal .fr-dmg .sw::before{ background-image:url(img/ramka/atk-r-frost.webp); }
#friendsModal .fr-dmg .ar::before{ background-image:url(img/ramka/atk-r-bolt.webp); }
#friendsModal .fr-dmg .po::before{ background-image:url(img/ramka/atk-r-meteor.webp); }
#friendsModal .fr-card .fr-nm{ line-height:1.15; } #friendsModal .fr-card .fr-nm small{ display:block; margin-left:0; font-size:9px; } /* ID под именем — имя не режется */
#friendsModal .fr-card .hd .nmw{ display:flex; flex-direction:column; gap:0; }
/* 71-я: новая карточка заявки (.fr-req) — две в ряд, крупная ава, столбик урона/достижений/срока, кнопки справа */
#friendsModal .fr-grid:has(.fr-req){ grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:96px; gap:8px 10px; }
#friendsModal .fr-card.fr-req{ display:grid; grid-template-columns:62px minmax(0,1fr) auto 82px; grid-template-rows:1fr; column-gap:10px; align-items:center;
background:none; border:0 solid transparent; border-width:14px 16px 20px; padding:0; border-image:url(img/druzya/karta.webp) 28 32 40 32 fill / 14px 16px 20px stretch; }
#friendsModal .fr-ra{ width:62px; height:62px; border-radius:50%; position:relative; cursor:pointer; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; display:flex; align-items:center; justify-content:center; }
#friendsModal .fr-ra .pf-ava{ width:48px; height:48px; border:0; border-radius:50%; font-size:26px; box-shadow:inset 0 0 8px rgba(0,0,0,.6); }
#friendsModal .fr-rm{ min-width:0; display:flex; flex-direction:column; gap:2px; }
#friendsModal .fr-rm .fr-nm{ font-size:13px; }
#friendsModal .fr-rm small{ font:400 9.5px 'JetBrains Mono',monospace; color:#8a96b0; }
#friendsModal .fr-rs{ display:flex; flex-direction:column; gap:4px; padding-left:10px; border-left:1px solid rgba(202,164,76,.35); }
#friendsModal .fr-rw{ display:flex; gap:7px; }
#friendsModal .fr-rl{ display:flex; align-items:center; gap:3px; white-space:nowrap; font-size:9px; color:#8a96b0; }
#friendsModal .fr-rl img{ width:15px; height:15px; object-fit:contain; }
#friendsModal .fr-rl b{ font:700 10.5px 'JetBrains Mono',monospace; color:#e9ddc3; }
#friendsModal .fr-rl i{ font-style:normal; width:15px; text-align:center; font-size:11px; }
#friendsModal .fr-rl.ach i{ color:#7fe0a0; } #friendsModal .fr-rl.tm i{ color:#e0a060; } #friendsModal .fr-rl.tm.hot b{ color:#ff7060; }
#friendsModal .fr-req .acts{ grid-column:auto; grid-row:auto; display:flex; flex-direction:column; gap:6px; margin:0; align-self:center; }
#friendsModal .fr-req .acts .fr-b{ flex:none; height:28px; padding:0 2px; }
/* 71-я, его скрин: счётчик заявок на арке обрезался — круглый, на правом плече арки, целиком поверх */
#friendsModal .siege-tab .fr-tabbd{ position:absolute; right:6px; top:10px; z-index:2; min-width:18px; height:18px; padding:0 4px; border-radius:9px; line-height:18px; font:800 10.5px 'Inter',sans-serif;
background:radial-gradient(circle at 40% 35%,#ff6a7a,#c0203a); border:1.5px solid #ffd08a; box-shadow:0 1px 4px rgba(0,0,0,.6); text-shadow:none; color:#fff; box-sizing:border-box; }
/* имена целиком: уже столбцы, меньше зазоры; кнопки выше */
#friendsModal .fr-card.fr-req{ grid-template-columns:56px minmax(0,1fr) auto 68px; column-gap:7px; border-width:12px 12px 20px 14px; }
#friendsModal .fr-ra{ width:56px; height:56px; } #friendsModal .fr-ra .pf-ava{ width:43px; height:43px; font-size:23px; }
#friendsModal .fr-rm .fr-nm{ font-size:12px; white-space:normal; line-height:1.1; overflow:visible; }
#friendsModal .fr-rs{ padding-left:7px; } #friendsModal .fr-rw{ gap:5px; }
#friendsModal .fr-req .acts .fr-b{ height:30px; font-size:10.5px; }
#friendsModal .fr-req .acts .fr-b.ok, #friendsModal .fr-req .acts .fr-b.no{ flex:none; }
#friendsModal .fr-req .acts{ gap:5px; } #friendsModal .fr-req .acts .fr-b{ height:27px; }
/* 71-я, его выбор карточки заявки «Ковёр» (ui-proba/druzya/karta-zayavki.jpg, 2-я): одна в ряд, во всю ширину; всё стоит в нарисованных местах
(проценты от картинки 1600×291): кольцо аватара, плашка имени, вставка цифр, лоток кнопок — «Принять» и «Отклонить» рядом, большие */
#friendsModal .fr-grid:has(.fr-req){ grid-template-columns:minmax(0,1fr); grid-auto-rows:auto; gap:6px; }
#friendsModal .fr-card.fr-req{ display:block; position:relative; aspect-ratio:1600 / 291; border:none; border-image:none; padding:0; background:url(img/druzya/zayavka-kovyor.webp) center/100% 100% no-repeat; }
#friendsModal .fr-req .fr-ra{ position:absolute; left:4.25%; top:12%; width:13.9%; height:74%; background:none; }
#friendsModal .fr-req .fr-ra .pf-ava{ width:82%; height:82%; font-size:40px; }
#friendsModal .fr-req .fr-rm{ position:absolute; left:20.6%; top:17%; width:52.8%; height:42%; justify-content:center; padding-left:6px; gap:3px; }
#friendsModal .fr-req .fr-rm .fr-nm{ font-size:17px; font-family:'Cinzel',serif; }
#friendsModal .fr-req .fr-rm small{ font-size:10.5px; }
#friendsModal .fr-req .fr-rm .fr-sl{ font-size:13px; }
#friendsModal .fr-req .fr-rs{ position:absolute; left:75.4%; top:18%; width:18%; height:40%; border:none; padding:0 0 0 8px; justify-content:center; gap:3px; }
#friendsModal .fr-req .acts{ position:absolute; left:20.4%; top:62%; width:73%; height:22%; flex-direction:row; gap:10px; }
#friendsModal .fr-req .acts .fr-b{ flex:1 1 0; height:100%; font-size:13px; }
#friendsModal .fr-req .acts .fr-b.ok, #friendsModal .fr-req .acts .fr-b.no{ flex:1 1 0; }
/* 71-я, его слово «по 3 заявки в строчку»: короткий ковёр (ui-proba/druzya/kovyor-2.jpg → zayavka-kovyor2.webp, 800×427), места в процентах от картинки */
#friendsModal .fr-grid:has(.fr-req){ grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px 8px; }
#friendsModal .fr-card.fr-req{ aspect-ratio:800 / 427; background-image:url(img/druzya/zayavka-kovyor2.webp); }
#friendsModal .fr-req .fr-ra{ left:13.1%; top:9.4%; width:28.75%; height:53.9%; }
#friendsModal .fr-req .fr-ra .pf-ava{ width:80%; height:80%; font-size:30px; }
#friendsModal .fr-req .fr-rm{ left:42%; top:14.5%; width:46.5%; height:15.5%; padding-left:5px; flex-direction:row; align-items:center; gap:5px; }
#friendsModal .fr-req .fr-rm .fr-nm{ font-size:11.5px; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#friendsModal .fr-req .fr-rm small{ display:none; }
#friendsModal .fr-req .fr-rm .fr-sl{ font-size:10px; flex-shrink:0; }
#friendsModal .fr-req .fr-rs{ left:44%; top:34%; width:42.3%; height:27.4%; padding:0 0 0 5px; gap:1px; }
#friendsModal .fr-req .fr-rw{ gap:4px; } #friendsModal .fr-req .fr-rl img{ width:12px; height:12px; } #friendsModal .fr-req .fr-rl b{ font-size:9.5px; } #friendsModal .fr-req .fr-rl{ font-size:8px; }
#friendsModal .fr-req .acts{ left:13.4%; top:65%; width:72.9%; height:17%; gap:5px; }
#friendsModal .fr-req .acts .fr-b{ font-size:10.5px; }
#friendsModal .fr-req .fr-rs{ gap:0; } #friendsModal .fr-req .fr-rl{ line-height:12px; height:12px; }
#friendsModal .fr-req .fr-rw{ height:12px; align-items:center; }
/* 71-я, его слово «время не писать, урон крупнее в 3 строчки, достижения где-то»: урон — по атаке на строку, крупно; ☥ — на плашке имени рядом со ★ */
#friendsModal .fr-req .fr-rs{ gap:0; justify-content:space-around; padding-left:8px; }
#friendsModal .fr-req .fr-rl.w{ height:12px; line-height:12px; gap:5px; }
#friendsModal .fr-req .fr-rl.w img{ width:13px; height:13px; }
#friendsModal .fr-req .fr-rl.w b{ font-size:11.5px; color:#fff3d0; }
#friendsModal .fr-req .fr-ach{ font:700 10px 'JetBrains Mono',monospace; color:#7fe0a0; flex-shrink:0; white-space:nowrap; }
/* имя — одно на плашке целиком; во вставке два столбика: урон тремя строками | ★ слава и ☥ достижения */
#friendsModal .fr-req .fr-rm .fr-nm{ font-size:12.5px; }
#friendsModal .fr-req .fr-rs{ flex-direction:row; align-items:stretch; justify-content:space-between; padding:0 6px 0 8px; }
#friendsModal .fr-rcol{ display:flex; flex-direction:column; justify-content:space-around; }
#friendsModal .fr-rcol.r{ align-items:flex-end; justify-content:center; gap:4px; border-left:1px solid rgba(202,164,76,.3); padding-left:6px; }
#friendsModal .fr-rcol.r .fr-sl{ font-size:11px; }
/* 71-я, его слово «слава будет огромная, урон до ~1000»: числа короткие (≤ 4 знака: 9999 / 12K / 1.3T), вставка — два ровных столбика, ничего не вылезает */
#friendsModal .fr-req .fr-rs{ overflow:hidden; padding:0 5px 0 7px; }
#friendsModal .fr-req .fr-rl.w{ height:11px; line-height:11px; gap:4px; }
#friendsModal .fr-req .fr-rl.w img{ width:12px; height:12px; }
#friendsModal .fr-req .fr-rl.w b{ font-size:11px; }
#friendsModal .fr-rcol.r{ gap:3px; padding-left:5px; }
#friendsModal .fr-rcol.r .fr-sl{ font-size:11px; } #friendsModal .fr-rcol.r .fr-ach{ font-size:11px; }
#friendsModal .fr-req .fr-rcol{ justify-content:space-evenly; } #friendsModal .fr-req .fr-rl.w{ height:10px; line-height:10px; }
/* 71-я: карточка заявки «на весь ковёр» (.fr-zv) — поле внутри золотой рамки ковра (11,6–88,3 % × 14,5–85 % картинки 800×427) — сетка */
#friendsModal .fr-grid:has(.fr-zv){ grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:auto; gap:6px 8px; }
#friendsModal .fr-card.fr-zv{ display:grid; aspect-ratio:800 / 427; position:relative; border:none; border-image:none; background:url(img/druzya/zayavka-kovyor3.webp) center/100% 100% no-repeat;
padding:8.2% 12.6% 8.6% 12.6%; box-sizing:border-box; /* % паддинга считается от ширины: 14,5 % высоты 427 = 7,8 % ширины 800 */ grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto 1fr auto; column-gap:7px; row-gap:3px; align-items:center; }
#friendsModal .fr-zava{ grid-column:1; grid-row:1 / 3; width:50px; height:50px; cursor:pointer; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; display:flex; align-items:center; justify-content:center; }
#friendsModal .fr-zava .pf-ava{ width:39px; height:39px; border:0; border-radius:50%; font-size:21px; box-shadow:inset 0 0 6px rgba(0,0,0,.6); }
#friendsModal .fr-zhd{ grid-column:2; grid-row:1; min-width:0; display:flex; align-items:center; gap:5px; }
#friendsModal .fr-zhd .fr-nm{ flex:1; min-width:0; font:800 12.5px 'Cinzel',serif; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#friendsModal .fr-zsl{ flex-shrink:0; display:flex; align-items:center; gap:2px; }
#friendsModal .fr-zsl img{ width:15px; height:15px; object-fit:contain; } #friendsModal .fr-zsl b{ font:800 11.5px 'JetBrains Mono',monospace; color:#ffd76a; }
#friendsModal .fr-zst{ grid-column:2; grid-row:2; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 6px; align-self:start; }
#friendsModal .fr-zs{ display:flex; align-items:center; gap:3px; min-width:0; }
#friendsModal .fr-zs img{ width:16px; height:16px; object-fit:contain; flex-shrink:0; filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
#friendsModal .fr-zs b{ font:800 12px 'JetBrains Mono',monospace; color:#fff3d0; white-space:nowrap; }
#friendsModal .fr-zacts{ grid-column:1 / -1; grid-row:3; display:flex; gap:6px; }
#friendsModal .fr-zacts .fr-b{ flex:1 1 0; height:25px; padding:0 2px; font-size:11px; }
/* его слово: слава — отдельной строкой под именем */
#friendsModal .fr-zhd{ flex-direction:column; align-items:flex-start; gap:0; }
#friendsModal .fr-zhd .fr-nm{ flex:none; width:100%; line-height:14px; }
#friendsModal .fr-zsl{ height:14px; } #friendsModal .fr-zsl img{ width:13px; height:13px; }
#friendsModal .fr-zst{ gap:1px 6px; } #friendsModal .fr-zs{ height:15px; } #friendsModal .fr-zs img{ width:15px; height:15px; }
#friendsModal .fr-card.fr-zv{ row-gap:2px; }
/* 71-я, его слово «в друзьях красивее, вкладки (фильтры) подальше и длиннее»: строка друга выше, ава в кольце, имя + слава строкой ниже,
ровные столбцы урона/достижений; поиск и фильтры растянуты на всю ширину с зазорами */
#friendsModal .fr-stat{ display:flex; align-items:center; gap:14px; }
#friendsModal .fr-stat .fr-search{ width:auto; flex:0 0 200px; height:28px; box-sizing:border-box; font-size:11.5px; }
#friendsModal .fr-stat .fr-chips{ flex:1; display:flex; gap:12px; flex-wrap:nowrap; }
#friendsModal .fr-stat .fr-chips .lbl{ display:none; }
#friendsModal .fr-stat .fr-chip{ flex:1 1 0; height:28px; font-size:11px; display:flex; align-items:center; justify-content:center; }
#friendsModal .fr-list{ gap:6px; }
#friendsModal .fr-row.fr-rw2{ min-height:50px; gap:12px; border-width:0 30px; border-image:url(img/druzya/stroka.webp) 0 52 fill / 0 30px stretch; padding:0 2px; }
#friendsModal .fr-rw2 .fr-zava{ width:42px; height:42px; flex-shrink:0; position:relative; }
#friendsModal .fr-rw2 .fr-zava .pf-ava{ width:33px; height:33px; font-size:18px; }
#friendsModal .fr-rw2 .fr-zava.on::after{ content:''; position:absolute; right:1px; bottom:1px; width:9px; height:9px; border-radius:50%; background:#5ad07a; border:2px solid #10141f; }
#friendsModal .fr-rw2 .nmw{ flex:0 0 190px; min-width:0; display:flex; flex-direction:column; gap:1px; }
#friendsModal .fr-rw2 .fr-nm{ font:800 13px 'Cinzel',serif; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#friendsModal .fr-rcols{ flex:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
#friendsModal .fr-rw2 .fr-zs img{ width:17px; height:17px; } #friendsModal .fr-rw2 .fr-zs b{ font-size:12.5px; }
#friendsModal .fr-rw2 .last{ flex:0 0 64px; text-align:right; font-size:10px; color:#8a96b0; }
#friendsModal .fr-rw2 .last .onl{ font-style:normal; color:#7fe0a0; font-weight:700; }
/* 71-я, его слово «мини-профиль тоже и кнопки»: карточка игрока — ковёр с кисточками (тот же, что у заявок, края 9-срезом),
ава в золотом кольце, статы картинками на тёмных плашках, кнопки — с листа Друзей (Написать — золото с фонарями, В друзья/Друг — изумруд/бронза, В ЧС — рубин) */
#playerCard{ border:0 solid transparent; border-width:24px 34px 26px; border-radius:0; box-shadow:0 12px 32px rgba(0,0,0,.65); background:none;
border-image:url(img/druzya/zayavka-kovyor3.webp) 62 94 64 93 fill / 24px 34px 26px round; }
#playerCard .pc-body{ padding:4px 6px; gap:7px; }
#playerCard .pc-head .pf-avw{ width:60px; height:60px; display:flex; align-items:center; justify-content:center; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; }
#playerCard .pc-head .pf-ava{ width:47px; height:47px; border:0; border-radius:50%; font-size:24px; }
#playerCard .pc-who .pf-name{ font-family:'Cinzel',serif; font-size:16px; color:#f0e0b0; }
#playerCard .pc-x{ position:relative; top:-6px; right:-8px; }
#playerCard .pc-st{ background:rgba(10,14,28,.55); border:1px solid rgba(202,164,76,.28); padding:3px 8px; }
#playerCard .pc-st i{ width:20px; height:20px; display:flex; align-items:center; justify-content:center; }
#playerCard .pc-st i img{ width:20px; height:20px; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
#playerCard .pc-st span{ color:#aab4cc; } #playerCard .pc-st b{ color:#fff3d0; }
#playerCard .pf-rule{ background:linear-gradient(90deg,transparent,rgba(202,164,76,.6),transparent); height:1px; }
#playerCard .pc-acts{ gap:8px; }
#playerCard .pc-acts .r{ gap:8px; }
#playerCard .pf-btn, #playerCard .pf-tag{ height:30px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; padding:0 6px; border:0 solid transparent;
border-width:0 12px; border-radius:0; box-shadow:none; background:none; font:700 11px 'Inter',sans-serif; text-shadow:0 1px 2px rgba(0,0,0,.7); }
#playerCard .pf-btn.gr{ border-image:url(img/druzya/chip-off.webp) 0 26 fill / 0 12px stretch; color:#c8d0e4; }
#playerCard .pf-btn.bl{ border-width:0 22px; border-image:url(img/druzya/kn-zayavka.webp) 0 56 fill / 0 22px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
#playerCard .pf-btn.gn{ border-image:url(img/druzya/kn-da.webp) 0 22 fill / 0 12px stretch; color:#f2fff4; }
#playerCard .pf-btn.rd{ border-image:url(img/druzya/kn-net.webp) 0 22 fill / 0 12px stretch; color:#fff; }
#playerCard .pf-tag.fr{ border-width:0 12px 0 30px; border-image:url(img/zal-slavy/kn-drug.webp) 0 30 0 80 fill / 0 12px 0 30px stretch; color:#ffe9b0; }
#playerCard .pf-tag.wait{ border-image:url(img/zal-slavy/kn-wait.webp) 0 30 fill / 0 12px stretch; color:#d0c8b8; }
#playerCard .pc-acts, #playerCard .pc-acts .r{ flex-wrap:nowrap; gap:6px; }
#playerCard .pf-btn, #playerCard .pf-tag{ padding:0 3px; font-size:10.5px; white-space:nowrap; }
#playerCard .pf-btn.bl{ border-width:0 18px; border-image-width:0 18px; }
#playerCard.player-card{ width:min(470px,94%); } /* ковёр съел 68 px по краям — шире, чтобы четыре кнопки встали в ряд */
#playerCard .pc-acts, #playerCard .pc-acts .r{ gap:4px; }
/* 71-я, его слово «и в Подробнее сделай так же»: полный профиль — тот же ковёр, что у мини-профиля и заявок; ава в кольце, статы картинками,
панели «Герои / Артефакты» — тёмное стекло с золотой нитью, кнопки — листа Друзей */
#profileModal{ border:0 solid transparent; border-width:16px 26px 18px; border-radius:0; box-shadow:0 12px 32px rgba(0,0,0,.65); background:none;
border-image:url(img/druzya/zayavka-kovyor3.webp) 62 94 64 93 fill / 16px 26px 18px round; }
#profileModal .modal-close{ top:-6px; right:-12px; }
#profileModal .pf-card{ left:6px; top:6px; bottom:6px; width:214px; padding:6px 10px; gap:4px; border:1px solid rgba(202,164,76,.45); border-radius:10px; box-shadow:none;
background:linear-gradient(180deg,rgba(14,18,34,.82),rgba(8,10,20,.86)); }
#profileModal .pf-card .pf-avw{ width:76px; height:76px; display:flex; align-items:center; justify-content:center; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; }
#profileModal .pf-card .pf-ava{ width:60px; height:60px; border:0; font-size:30px; }
#profileModal .pf-name{ font-family:'Cinzel',serif; color:#f0e0b0; }
#profileModal .pf-stat{ color:#aab4cc; } #profileModal .pf-stat b{ color:#fff3d0; }
#profileModal .pf-stat .ic{ width:18px; height:18px; display:flex; align-items:center; justify-content:center; }
#profileModal .pf-stat .ic img{ width:18px; height:18px; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
#profileModal .pf-panel{ left:230px; right:6px; border:1px solid rgba(202,164,76,.45); border-radius:10px; background:linear-gradient(180deg,rgba(14,18,34,.78),rgba(8,10,20,.84)); }
#profileModal .pf-heroes{ top:30px; }
#profileModal .pf-artis{ top:174px; bottom:42px; }
#profileModal .pf-acts{ left:230px; right:6px; bottom:4px; gap:6px; flex-wrap:nowrap; }
#profileModal .pf-btn, #profileModal .pf-acts .pf-tag{ height:32px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; padding:0 6px; border:0 solid transparent;
border-width:0 12px; border-radius:0; box-shadow:none; background:none; font:700 11px 'Inter',sans-serif; text-shadow:0 1px 2px rgba(0,0,0,.7); white-space:nowrap; }
#profileModal .pf-btn.gr{ border-image:url(img/druzya/chip-off.webp) 0 26 fill / 0 12px stretch; color:#c8d0e4; }
#profileModal .pf-btn.bl{ border-width:0 20px; border-image:url(img/druzya/kn-zayavka.webp) 0 56 fill / 0 20px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
#profileModal .pf-btn.gn{ border-image:url(img/druzya/kn-da.webp) 0 22 fill / 0 12px stretch; color:#f2fff4; }
#profileModal .pf-btn.rd{ border-image:url(img/druzya/kn-net.webp) 0 22 fill / 0 12px stretch; color:#fff; }
#profileModal .pf-acts .pf-tag.fr{ border-width:0 12px 0 30px; border-image:url(img/zal-slavy/kn-drug.webp) 0 30 0 80 fill / 0 12px 0 30px stretch; color:#ffe9b0; }
#profileModal .pf-acts .pf-tag.wait{ border-image:url(img/zal-slavy/kn-wait.webp) 0 30 fill / 0 12px stretch; color:#d0c8b8; }
.pf-stat .ic img{ width:16px; height:16px; object-fit:contain; vertical-align:middle; } /* 71-я: значки статов картинками — и в настройках (свой профиль) */
/* 71-я, его слово «осколки грамотно везде»: осколок героя — медальон с лицом (oskMed), как вещь: в награде за этажи крупно, в Кладовой во всю клетку;
значок вкладки «Осколки» — медальон Красика (картинка авы) */
.lr-port.it-port .osk-med.lr-osk{ width:40px !important; height:40px !important; }
.inv-cell .iv-icwrap .osk-med{ width:30px !important; height:30px !important; vertical-align:0; }
.osk-ic{ display:inline-block; width:1.2em; height:1.2em; vertical-align:-0.25em; border-radius:50%; background:url(img/geroi/krasik-karta.jpg) 50% 20%/170% auto no-repeat;
box-shadow:0 0 0 2px #c8962a, 0 1px 2px #000; }
/* 71-я, его слово «храмы другого цвета совсем, чтобы круто и видно хорошо»: фон окна клана — «Обсидиановая крепость» (ui-proba/klany/fon-obsidian.jpg; был «Тронный зал» fon-tron.jpg — «смешивается с площадью»);
список храмов — плитки 3×2: слева картинка храма (свой цвет), справа имя, бонусы и плашка «изучено»; рамка и свечение — цвет храма */
#clanModal{ background:#120c08 url(img/klany/fon.webp) center/cover no-repeat; }
#clanModal .clt-list{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:8px; height:100%; }
#clanModal .clt-card{ --tc:#caa44c; position:relative; flex-direction:row; align-items:center; gap:8px; padding:6px 8px 6px 6px; border:1.5px solid var(--tc); border-radius:12px; min-width:0; overflow:hidden;
background:radial-gradient(ellipse at 22% 60%, color-mix(in srgb, var(--tc) 32%, transparent), transparent 62%), linear-gradient(180deg,rgba(20,14,10,.86),rgba(10,8,6,.9));
box-shadow:inset 0 0 18px color-mix(in srgb, var(--tc) 22%, transparent), 0 3px 8px rgba(0,0,0,.5); }
#clanModal .clt-card:hover{ box-shadow:inset 0 0 22px color-mix(in srgb, var(--tc) 40%, transparent), 0 0 12px color-mix(in srgb, var(--tc) 55%, transparent); }
#clanModal .clt-card.done{ border-color:var(--tc); }
#clanModal .clt-card.lock{ opacity:1; } #clanModal .clt-card.lock .clt-img img{ filter:grayscale(.85) brightness(.55); } #clanModal .clt-card.lock .clt-w{ opacity:.6; }
#clanModal .t-ra{ --tc:#f0b030; } #clanModal .t-bes{ --tc:#30c8c0; } #clanModal .t-gor{ --tc:#6ab0ff; }
#clanModal .t-seker{ --tc:#a878f0; } #clanModal .t-tot{ --tc:#40d890; } #clanModal .t-anubis{ --tc:#e8403a; }
#clanModal .clt-img{ position:relative; flex:0 0 auto; width:78px; height:100%; display:flex; align-items:center; justify-content:center; }
#clanModal .clt-img img{ max-width:100%; max-height:100%; object-fit:contain; filter:drop-shadow(0 3px 5px rgba(0,0,0,.7)); }
#clanModal .clt-num{ position:absolute; left:0; top:0; font:900 11px 'Cinzel',serif; color:#fff; background:var(--tc); border-radius:6px; padding:0 5px; text-shadow:0 1px 1px rgba(0,0,0,.6); }
#clanModal .clt-w{ display:flex; flex-direction:column; gap:3px; min-width:0; }
#clanModal .clt-t{ font-size:12.5px; color:color-mix(in srgb, var(--tc) 55%, #fff); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#clanModal .clt-d{ font-size:9px; line-height:1.25; color:#c8bca4; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
#clanModal .clt-plate{ position:absolute; right:7px; bottom:6px; border-color:var(--tc); background:rgba(0,0,0,.55); font-size:9px; }
#clanModal .clt-plate.done{ color:#7fe0a0; }
#clanModal .clt-card.lock .clt-img img{ filter:grayscale(.35) brightness(.7); } #clanModal .clt-card.lock .clt-w{ opacity:.8; } /* закрытый — цвет храма виден */
#clanModal .clt-card{ align-items:stretch; }
#clanModal .clt-w{ justify-content:center; }
#clanModal .clt-t{ font-size:11.5px; overflow:visible; white-space:normal; line-height:1.1; }
#clanModal .clt-d{ -webkit-line-clamp:2; }
#clanModal .clt-plate{ position:static; align-self:flex-start; margin-top:2px; }
#clanModal .clt-card{ display:grid; grid-template-columns:78px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; column-gap:8px; row-gap:3px; }
#clanModal .clt-img{ grid-row:1 / 3; grid-column:1; height:auto; }
#clanModal .clt-w{ grid-column:2; grid-row:1; }
#clanModal .clt-plate{ grid-column:2; grid-row:2; justify-self:start; margin:0; }
#clanModal .clt-t{ font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#clanModal .clt-card{ grid-template-columns:64px minmax(0,1fr); column-gap:6px; }
#clanModal .clt-t{ font-size:11.5px; letter-spacing:-.01em; }
#clanModal .clt-plate{ font-size:8.5px; padding:2px 6px; max-width:100%; box-sizing:border-box; overflow:hidden; text-overflow:clip; }
/* 71-я: гербы кланов — золотой щит его листа (img/klany/shit.webp) с полем цвета клана и золотым знаком (img/klany/g-*.webp) */
.cl-emblem.cl-shield{ position:relative; border:none; border-radius:0; box-shadow:none; background:url(img/klany/shit.webp) center/100% 100% no-repeat; filter:drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.cl-shield .f{ position:absolute; inset:9% 11% 8% 11%; z-index:-1; background:radial-gradient(circle at 42% 32%, var(--ec,#888), var(--ec2,#333) 80%);
clip-path:polygon(4% 3%, 96% 3%, 96% 52%, 84% 76%, 50% 100%, 16% 76%, 4% 52%); }
.cl-shield{ isolation:isolate; }
.cl-shield .g{ position:absolute; left:22%; right:22%; top:20%; bottom:24%; background:center/contain no-repeat; filter:drop-shadow(0 1px 1px rgba(0,0,0,.7)); }
.cln-ringwrap .cl-emblem.cl-shield{ border-radius:0; inset:2px 6px; }
/* 71-я: кнопки клана — его лист (ui-proba/klany/list-p.jpg): вкладки золото/лазурит, «Храмы» — золотые врата, главная — золото с лазуритами,
«Принять» — изумруд, «Выйти/Отозвать» — рубин, второстепенная — лазурит; края с узором не тянутся (border-image) */
#clanModal .siege-tab{ height:32px; padding:0 6px; margin-bottom:0; background:none; border:0 solid transparent; border-width:0 16px; border-radius:0; box-shadow:none;
border-image:url(img/klany/tab-off.webp) 0 40 fill / 0 16px stretch; color:#c8d4f0; text-shadow:0 1px 2px #000; }
#clanModal .siege-tab.sel, #clanModal .siege-tab.active{ border-image:url(img/klany/tab-on.webp) 0 40 fill / 0 16px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,180,.7); }
#clanModal .clh-temples{ border:0 solid transparent; border-width:22px 18px 6px; border-radius:0; box-shadow:none; background:none; padding:0 4px;
border-image:url(img/klany/kn-hramy.webp) 22 18 6 fill / 22px 18px 6px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,180,.7); min-width:110px; }
#clanModal .clh-temples i{ display:none; }
#clanModal .clh-temples small{ color:#5a3a10; }
#clanModal .cl-foot-btn, #clanModal .cl-back-big{ height:28px; box-sizing:border-box; display:inline-flex; align-items:center; padding:0 6px; border:0 solid transparent; border-width:0 12px; border-radius:0;
background:none; box-shadow:none; border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#d8e0f4; text-shadow:0 1px 2px #000; }
#clanModal .cl-foot-btn.gold, #clanModal .clc-btn, #clanModal .cl-create-btn, #clanModal .clp-btn.gold{ border:0 solid transparent; border-width:0 18px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/klany/kn-glav.webp) 0 46 fill / 0 18px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,180,.7); padding-left:4px; padding-right:4px; }
#clanModal .cl-foot-btn.danger, #clanModal .cl3-btn2{ border:0 solid transparent; border-width:0 14px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/klany/kn-net.webp) 0 36 fill / 0 14px stretch; color:#fff; text-shadow:0 1px 2px #300; }
#clanModal .cl3-btn:not(.off){ border:0 solid transparent; border-width:0 14px; border-radius:0; background:none; box-shadow:none; border-image:url(img/klany/kn-da.webp) 0 36 fill / 0 14px stretch; color:#f2fff4; text-shadow:0 1px 2px #062010; }
#clanModal .cl3-btn.off, #clanModal .clp-btn:not(.gold), #clanModal .clc-btn.gr{ border:0 solid transparent; border-width:0 12px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#c8d0e4; text-shadow:0 1px 2px #000; }
#clanModal .clh-temples{ font:800 13px "Cinzel",serif; } #clanModal .clh-temples small{ font-size:9.5px; margin-top:1px; }
#clanModal .siege-tab{ padding-top:7px; } #clanModal .clh-temples{ color:#fff3c8; text-shadow:0 1px 2px #2a1404,0 0 6px #2a1404; } #clanModal .clh-temples small{ color:#ffe08a; text-shadow:0 1px 2px #2a1404; }
/* 71-я, его слово «вкладка Клан красиво: подпись плашками, слава/урон/воины/алтари картинками, Иероглифы словом, карточка — простой фон, Состав — кнопкой» */
#clanModal .cli{ width:20px; height:20px; object-fit:contain; vertical-align:middle; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
#clanModal .clh-tile i{ width:30px; height:30px; display:flex; align-items:center; justify-content:center; font-size:0; }
#clanModal .clh-tile i .cli{ width:28px; height:28px; }
#clanModal .clh-sub{ display:flex; flex-wrap:wrap; gap:5px; margin:3px 0; }
#clanModal .clh-chip{ display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; font:700 10px 'Inter',sans-serif; color:#e8dcc0; background:rgba(0,0,0,.45); border:1px solid rgba(202,164,76,.45); white-space:nowrap; }
#clanModal .clh-chip.e-open{ color:#9be07a; border-color:#3a8a4a; } #clanModal .clh-chip.e-request{ color:#ffd76a; border-color:#8a6a2a; } #clanModal .clh-chip.e-closed{ color:#ff9080; border-color:#8a3a30; }
#clanModal .clh-chip.lead .cli{ width:14px; height:14px; } #clanModal .clh-chip.lead b{ color:#ffd76a; }
#clanModal .clm-slava, #clanModal .clm-tal{ display:inline-flex; align-items:center; gap:4px; }
#clanModal .clm-slava .cli, #clanModal .clm-tal .cli{ width:15px; height:15px; }
#clanModal .cl3-ln i{ width:18px; height:18px; display:flex; align-items:center; justify-content:center; font-size:0; } #clanModal .cl3-ln i .cli{ width:17px; height:17px; }
#clanModal .cl3-card{ background:linear-gradient(180deg,#1a1620,#100d14); border:1px solid rgba(202,164,76,.55); box-shadow:0 4px 14px rgba(0,0,0,.6); } /* «простенький обычный фон» */
#clanModal .cl3-ban{ background:linear-gradient(180deg,rgba(255,255,255,.04),transparent); }
#clanModal .cl3-more{ height:30px; box-sizing:border-box; padding:0 6px; border:0 solid transparent; border-width:0 12px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#d8e0f4; font:800 11px 'Cinzel',serif; text-shadow:0 1px 2px #000; }
/* список храмов во всё окно: картинка храма крупнее */
#clanModal .clt-card{ grid-template-columns:96px minmax(0,1fr); padding:8px 10px 8px 6px; }
#clanModal .clt-t{ font-size:13.5px; }
#clanModal .clt-d{ font-size:9.5px; -webkit-line-clamp:3; }
#clanModal .clt-plate{ font-size:9.5px; padding:2px 8px; }
#clanModal .clt-num{ font-size:12px; }
#clanModal .clm-head.six, #clanModal .clm-row.six{ grid-template-columns:22px minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.05fr) minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr); } /* «Иероглифы» словом — столбец шире */
#clanModal .clm-head > span:nth-child(4){ font:800 9px "Cinzel",serif; } /* «Иероглифы» словом — как остальные заголовки, не шрифтом иероглифа */
/* 71-я, его листы «Храм внутри» (ui-proba/klany/hram-zaly.jpg, hram-znachki.jpg, hram-ramki.jpg): зал храма в его цвете — фоном дерева,
алтари — значки в рамках (изучен — сияющее золото, доступен — светлая, закрыт — камень с замком), бонусы слева — плашки с золотой заливкой,
справа — золотое кольцо со скарабеями; подписи алтарей — тёмные плашки в цвете храма */
#clanModal .clr-wrap{ --tc:#caa44c; position:relative; border-radius:10px; overflow:hidden; padding:6px; box-sizing:border-box;
background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.05) 26%,rgba(0,0,0,.05) 74%,rgba(0,0,0,.55)), var(--zal) center/cover no-repeat; }
#clanModal .clr-wrap.t-ra{ --tc:#f0b030; } #clanModal .clr-wrap.t-bes{ --tc:#30c8c0; } #clanModal .clr-wrap.t-gor{ --tc:#6ab0ff; }
#clanModal .clr-wrap.t-seker{ --tc:#a878f0; } #clanModal .clr-wrap.t-tot{ --tc:#40d890; } #clanModal .clr-wrap.t-anubis{ --tc:#e8403a; }
#clanModal .clr-side b{ color:color-mix(in srgb, var(--tc) 60%, #fff); text-shadow:0 1px 3px #000; }
#clanModal .clr-bar{ height:30px; border:none; border-radius:0; background:url(img/klany/pl.webp) center/100% 100% no-repeat; overflow:visible; }
#clanModal .clr-bar .fl, #clanModal .clr-bar .fl.gold{ left:6%; top:28%; bottom:28%; width:calc(88% * var(--pn,0)); background:url(img/klany/pl-fill.webp) 6% 50%/113.6% 290% no-repeat; border-radius:2px; }
#clanModal .clr-bar .tx{ padding:0 10px; color:#e0d0b0; text-shadow:0 1px 2px #000; font-size:7.5px; }
#clanModal .clr-bar .tx small{ color:#fff3d0; }
#clanModal .cln-sq{ width:48px; height:48px; border:none; border-radius:0; box-shadow:none; position:relative; background:url(img/klany/r-lock.webp) center/100% 100% no-repeat; }
#clanModal .cln-sq img{ position:absolute; inset:15%; width:70%; height:70%; object-fit:contain; border-radius:50%; }
#clanModal .cln.done .cln-sq{ background-image:url(img/klany/r-done.webp); box-shadow:none; }
#clanModal .cln.open .cln-sq, #clanModal .cln.cur .cln-sq{ background-image:url(img/klany/r-open.webp); box-shadow:none; }
#clanModal .cln.lock .cln-sq img{ filter:grayscale(.85) brightness(.55); }
#clanModal .cln.banner .cln-sq{ background-color:transparent; border:none; }
#clanModal .cln-lb{ border:1px solid color-mix(in srgb, var(--tc) 70%, #000); background:rgba(8,6,10,.82); box-shadow:0 2px 6px rgba(0,0,0,.6); }
#clanModal .cln.done .cln-lb{ border-color:var(--tc); } #clanModal .cln.done .cln-lb small{ color:color-mix(in srgb, var(--tc) 65%, #fff); }
#clanModal .clr-canvas .g-done{ stroke:var(--tc); filter:drop-shadow(0 0 3px var(--tc)); }
#clanModal .clr-canvas .g-cur{ stroke:#f0e0b0; }
#clanModal .clr-canvas .g-lock{ stroke:rgba(30,26,22,.85); }
#clanModal .clr-ring{ position:relative; width:92px; height:92px; box-shadow:none; background:conic-gradient(var(--tc) var(--p,0), rgba(0,0,0,.6) 0); }
#clanModal .clr-ring::after{ content:''; position:absolute; inset:-4px; background:url(img/klany/ring.webp) center/100% 100% no-repeat; pointer-events:none; }
#clanModal .clr-ring i{ width:62px; height:62px; background:radial-gradient(circle,#1a1410,#0a0806); position:relative; z-index:1; color:#fff3d0; }
#clanModal .clr-pts{ text-shadow:0 1px 2px #000; }
#clanModal .cln-aimg{ position:absolute; inset:6px; display:flex; align-items:center; justify-content:center; } #clanModal .cln-aimg img{ width:100%; height:100%; object-fit:contain; }
#clanModal .clc-g img{ width:70%; height:70%; object-fit:contain; }
/* плашка бонуса: подпись и числа — строкой НАД плашкой (на заливке не читались), в плашке — только золотая полоса */
#clanModal .clr-side{ gap:3px; }
#clanModal .clr-bar{ height:18px; margin-top:13px; }
#clanModal .clr-bar .tx{ inset:auto; left:1px; right:1px; top:-13px; height:12px; flex-direction:row; justify-content:space-between; align-items:center; padding:0; font:600 8px 'Inter',sans-serif; color:#d8ccb0; }
#clanModal .clr-bar .tx small{ font-size:8.5px; }
#clanModal .clr-bar .fl, #clanModal .clr-bar .fl.gold{ top:30%; bottom:30%; }
/* 71-я, его лист «Алтарь» (ui-proba/klany/altar-list.jpg): окно подношений — зал своего храма (затемнён), сверху каменная плита со свечами
(значок алтаря в гнезде слева), полоса — каменный жёлоб с золотом, таблички: золото / кость / закрыта; таймер — песочные часы, «Обновить» — круглая печать */
#clanModal .cln-scroll{ --tc:#caa44c; color:#f0e0b0; padding:8px 12px; box-shadow:none; border-radius:10px;
background:linear-gradient(rgba(6,4,8,.72),rgba(6,4,8,.82)), var(--zal) center/cover no-repeat; }
#clanModal .cln-scroll.t-ra{ --tc:#f0b030; } #clanModal .cln-scroll.t-bes{ --tc:#30c8c0; } #clanModal .cln-scroll.t-gor{ --tc:#6ab0ff; }
#clanModal .cln-scroll.t-seker{ --tc:#a878f0; } #clanModal .cln-scroll.t-tot{ --tc:#40d890; } #clanModal .cln-scroll.t-anubis{ --tc:#e8403a; }
#clanModal .cln-scroll:before, #clanModal .cln-scroll:after{ display:none; }
#clanModal .cln-top{ position:relative; height:90px; margin:0 0 6px; gap:10px; box-sizing:border-box; padding:0 14px 0 82px;
border:0 solid transparent; border-width:0 27px 0 68px; border-image:url(img/klany/al-plita.webp) 0 60 0 150 fill / 0 27px 0 68px stretch; }
#clanModal .cln-ringwrap{ position:absolute; left:-53px; top:20px; width:50px; height:50px; }
#clanModal .cln-ring{ display:none; }
#clanModal .cln-ringwrap .cln-aimg{ inset:2px; }
#clanModal .cln-scroll .cln-t{ color:color-mix(in srgb, var(--tc) 55%, #fff); font-size:15px; }
#clanModal .cln-scroll .cln-d{ color:#e8dcc0; } #clanModal .cln-scroll .cln-s{ color:#a89c84; }
#clanModal .cln-timer{ width:84px; min-width:0; height:66px; padding:0 0 0 32px; margin:0; border:none; border-radius:0; box-sizing:border-box; background:url(img/klany/al-timer.webp) center/contain no-repeat; }
#clanModal .cln-timer b{ color:#fff3d0; font-size:11px; text-shadow:0 1px 2px #000; }
#clanModal .cln-timer small{ display:none; }
#clanModal .cln-timer.blocked{ background-color:transparent; filter:hue-rotate(-20deg) saturate(1.4); } #clanModal .cln-timer.blocked b{ color:#ff9080; }
#clanModal .cln-seal{ width:54px; height:54px; border:none; background:url(img/klany/al-obn.webp) center/100% 100% no-repeat; color:#fff3d0; font:800 8px 'JetBrains Mono',monospace; justify-content:flex-end; padding-bottom:0; text-shadow:0 1px 2px #000; }
#clanModal .cln-seal i{ display:none; }
#clanModal .cln-scroll .cln-prog{ height:22px; border:none; border-radius:0; background:url(img/klany/al-bar.webp) center/100% 100% no-repeat; position:relative; overflow:hidden; }
#clanModal .cln-scroll .cln-prog .fl{ position:absolute; left:2%; top:22%; bottom:22%; width:calc(96% * var(--p,0) / 100%); max-width:96%; background:url(img/klany/al-bar-fill.webp) left center/auto 290% no-repeat; border-radius:6px; }
#clanModal .cln-scroll .cln-prog span{ position:relative; color:#fff3d0; text-shadow:0 1px 2px #000; }
#clanModal .cln-tabs{ gap:12px; margin-top:6px; }
#clanModal .cln-tab{ height:66px; border:none; border-radius:0; box-shadow:none; background:url(img/klany/al-gold.webp) center/100% 100% no-repeat; color:#3a1f08; }
#clanModal .cln-tab b{ color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,180,.7); }
#clanModal .cln-tab i{ color:#5a3a10; text-shadow:none; }
#clanModal .cln-tab.bone{ background-image:url(img/klany/al-bone.webp); } #clanModal .cln-tab.bone i{ color:#4a3020; }
#clanModal .cln-tab.none{ background-image:url(img/klany/al-lock.webp); filter:none; opacity:1; } #clanModal .cln-tab.none b, #clanModal .cln-tab.none i{ color:#c8c0b0; text-shadow:0 1px 1px #000; }
#clanModal .cln-line{ color:#c8bca4; } #clanModal .cln-line b{ color:#ffd76a; }
#clanModal .cln-top{ align-items:center; padding-top:8px; }
#clanModal .cln-scroll .cln-t{ text-shadow:0 1px 3px #000, 0 0 6px #000; }
#clanModal .cln-cur{ width:13px; height:13px; vertical-align:-2px; object-fit:contain; }
#clanModal .cln-tab i{ display:inline-flex; align-items:center; gap:3px; }
/* 71-я, его листы «Создание / Без клана / Заявки» (ui-proba/klany/sozdanie-list.jpg, bez-klana.jpg, zayavki-list.jpg) */
/* без клана — папирус-приглашение с крылатым солнцем, знамёнами и печатью */
#clanModal .clp-papyrus{ width:auto; height:100%; aspect-ratio:684 / 400; max-width:96%; box-sizing:border-box; padding:13% 15% 12%; border-radius:0; box-shadow:none;
background:url(img/klany/bk-papirus.webp) center/100% 100% no-repeat; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#clanModal .clp-papyrus:before, #clanModal .clp-papyrus:after{ display:none; }
#clanModal .clp-t{ font-size:17px; } #clanModal .clp-s{ margin:4px 0 10px; text-align:center; }
#clanModal .clp-btn{ height:32px; padding:0 10px; font-size:11px; }
/* создание / настройки — слева подставка герба, справа свиток с иероглифами */
#clanModal .clc-herb{ width:150px; padding:66px 12px 10px; box-sizing:border-box; background:url(img/klany/sz-stand.webp) center top/100% 100% no-repeat; gap:8px; position:relative; }
#clanModal .clc-herb > .cl-emblem{ position:absolute; top:-10px; left:50%; transform:translateX(-50%); }
#clanModal .clc-glyphs{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin-top:24px; }
#clanModal .clc-g{ width:32px; height:32px; border:none; border-radius:0; opacity:1; background:url(img/klany/sz-btn.webp) center/100% 100% no-repeat; display:flex; align-items:center; justify-content:center; }
#clanModal .clc-g.sel{ background-image:url(img/klany/sz-btn-sel.webp); box-shadow:none; border:none; transform:scale(1.12); }
#clanModal .clc-g img{ width:62%; height:62%; }
#clanModal .clc-cols{ gap:5px; flex-wrap:wrap; justify-content:center; }
#clanModal .clc-c{ width:20px; height:20px; border:none; position:relative; box-shadow:inset 0 0 0 3px rgba(0,0,0,.25); }
#clanModal .clc-c::after{ content:''; position:absolute; inset:-3px; background:url(img/klany/sz-sw.webp) center/100% 100% no-repeat; }
#clanModal .clc-c.sel{ box-shadow:0 0 8px #fff; }
#clanModal .clc-scroll{ border-radius:0; box-shadow:none; padding:7% 9% 6%; background:url(img/klany/sz-scroll.webp) center/100% 100% no-repeat; }
#clanModal .clc-scroll:before, #clanModal .clc-scroll:after{ display:none; }
#clanModal .clc-inp{ border:none; border-radius:0; color:#f0e0b0; background:url(img/klany/sz-inp.webp) center/100% 100% no-repeat; padding:7px 12px; }
#clanModal .clc-inp.ta{ background:rgba(20,14,10,.82); border:1px solid #8a6a3a; border-radius:6px; }
#clanModal .clc-inp::placeholder{ color:#8a7a60; }
#clanModal .clc-seg{ gap:2px; }
#clanModal .clc-seg span{ border:none; border-radius:0; background:url(img/klany/sz-seg-off.webp) center/100% 100% no-repeat; color:#c8bca4; padding:6px 2px; }
#clanModal .clc-seg span.on{ background-image:url(img/klany/sz-seg-on.webp); color:#3a1f08; font-weight:800; }
/* заявки — строка из обсидиана с рубинами, кнопки изумруд / рубин */
#clanModal .clm-row.req{ border:0 solid transparent; border-width:0 26px; border-radius:0; background:none; min-height:40px; border-image:url(img/klany/zv-row.webp) 0 70 fill / 0 26px stretch; }
#clanModal .cl-mini{ height:26px; border:0 solid transparent; border-width:0 10px; border-radius:0; background:none; padding:0 4px; color:#fff; text-shadow:0 1px 2px #000;
border-image:url(img/klany/zv-net.webp) 0 30 fill / 0 10px stretch; }
#clanModal .cl-mini.ok{ border-image:url(img/klany/zv-da.webp) 0 34 fill / 0 10px stretch; color:#f2fff4; }
#clanModal .clp-wrap{ align-items:stretch; }
#clanModal .clp-papyrus{ padding:21% 12% 11%; justify-content:flex-start; gap:0; }
#clanModal .clp-t{ font-size:15px; line-height:1.1; text-align:center; }
#clanModal .clp-s{ font-size:11px; line-height:1.25; margin:3px 0 8px; }
#clanModal .clp-btns{ flex-wrap:nowrap; gap:5px; }
#clanModal .clp-btn{ height:30px; padding:0 4px; font-size:10px; white-space:nowrap; }
#clanModal .clp-papyrus{ height:calc(100% - 6px); padding:15% 12% 12%; justify-content:center; } #clanModal .clp-wrap{ overflow:hidden; }
#clanModal .clc-scroll{ padding:5.5% 7.5% 4.5%; gap:2px; }
#clanModal .clc-fl{ margin-top:2px; color:#6a2a10; }
#clanModal .clc-inp{ height:26px; padding:4px 12px; font-size:11.5px; }
#clanModal .clc-inp.ta{ height:30px; }
#clanModal .clc-seg span{ padding:4px 2px; font-size:9.5px; }
#clanModal .clc-foot{ padding-top:3px; }
#clanModal .clc-herb{ width:156px; padding:62px 10px 8px; }
#clanModal .clc-glyphs{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; margin-top:18px; }
#clanModal .clc-g{ width:29px; height:29px; }
/* свиток создания: края (валики и полоса иероглифов) не тянутся — 9-срез, середина-папирус растягивается под форму */
#clanModal .clc-scroll{ background:none; border:0 solid transparent; border-width:22px 34px 20px; padding:4px 6px 2px; box-sizing:border-box;
border-image:url(img/klany/sz-scroll.webp) 66 102 60 102 fill / 22px 34px 20px stretch; }
#clanModal .clc-c::after{ display:none; }
#clanModal .clc-c{ border:2px solid #caa44c; box-shadow:0 0 0 1px #3a2408, inset 0 0 4px rgba(0,0,0,.4); }
#clanModal .clc-c.sel{ border-color:#fff3c8; box-shadow:0 0 8px #ffe08a; }
#clanModal .clc-scroll{ padding-top:18px; } /* 75-я: «Имя клана» ниже красной каймы свитка */ #clanModal .clc-scroll .clc-fl:first-child{ margin-top:0; } #clanModal .clc-price, #clanModal .clc-have{ color:#5a3a10; font-weight:700; }
#clanModal .cl-back{ height:28px; box-sizing:border-box; display:inline-flex; align-items:center; padding:0 6px; border:0 solid transparent; border-width:0 12px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#d8e0f4; font:800 11px 'Cinzel',serif; text-shadow:0 1px 2px #000; position:relative; z-index:2; margin-bottom:4px; cursor:pointer; }
#clanModal .cl-back{ display:flex; width:max-content; }
/* 71-я, его последние листы клана (ui-proba/klany/stroki-list.jpg, zvaniya-list.jpg): строки воинов и кланов, звания-вымпелы, медали мест, выпадашка */
#clanModal .clm-row{ border:0 solid transparent; border-width:0 22px; border-radius:0; background:none; padding:0 2px; min-height:36px; box-sizing:border-box;
border-image:url(img/klany/st-voin.webp) 0 56 fill / 0 22px stretch; }
#clanModal .clm-row.me{ border-image:url(img/klany/st-ya.webp) 0 56 fill / 0 22px stretch; background:none; }
#clanModal .clm-role{ display:inline-flex; align-items:center; gap:3px; padding:1px 7px 1px 2px; border-radius:6px; background:rgba(0,0,0,.45); border:1px solid rgba(202,164,76,.35); font-weight:700; }
#clanModal .clm-role::before{ content:''; width:11px; height:16px; flex:0 0 auto; background:url(img/klany/zv-warrior.webp) center/contain no-repeat; }
#clanModal .clm-role.leader::before{ background-image:url(img/klany/zv-leader.webp); } #clanModal .clm-role.leader{ color:#ffb0a0; border-color:rgba(220,70,60,.55); }
#clanModal .clm-role.elder::before{ background-image:url(img/klany/zv-elder.webp); } #clanModal .clm-role.elder{ color:#d8c0ff; border-color:rgba(150,100,230,.55); background:rgba(0,0,0,.45); }
#clanModal .clm-role.priest::before{ background-image:url(img/klany/zv-priest.webp); } #clanModal .clm-role.priest{ color:#a8f0f0; border-color:rgba(60,200,200,.55); background:rgba(0,0,0,.45); }
#clanModal .clm-role.warrior{ color:#c8bca4; }
#clanModal .clm-role.pick{ border-style:solid; padding-right:14px; }
#clanModal .clm-leave{ height:22px; box-sizing:border-box; padding:0 4px; border:0 solid transparent; border-width:0 9px; border-radius:0; background:none; box-shadow:none; color:#fff; text-shadow:0 1px 2px #300;
border-image:url(img/klany/kn-vyjti.webp) 0 26 fill / 0 9px stretch; }
#clanModal .clm-dd{ height:24px; box-sizing:border-box; border:0 solid transparent; border-width:0 26px 0 10px; border-radius:0; background:none; padding:0 2px;
border-image:url(img/klany/dd.webp) 0 70 0 30 fill / 0 26px 0 10px stretch; color:#f0e0b0; }
#clanModal .clm-dd i{ display:none; }
#clanModal .clm-menu{ border:0 solid transparent; border-width:10px; border-radius:0; background:none; padding:2px 4px; box-shadow:0 8px 20px rgba(0,0,0,.7);
border-image:url(img/klany/dd-menu.webp) 30 fill / 10px stretch; }
#clanModal .cl3-row{ border:0 solid transparent; border-width:0 16px 0 46px; border-radius:0; background:none; padding:0 2px 0 0; min-height:40px; box-sizing:border-box; margin-bottom:3px;
border-image:url(img/klany/st-klan.webp) 0 34 0 102 fill / 0 16px 0 46px stretch; }
#clanModal .cl3-row.sel{ border-image:url(img/klany/st-klan-sel.webp) 0 34 0 102 fill / 0 16px 0 46px stretch; background:none; }
#clanModal .cl3-row .cl-emblem{ margin-left:-40px; } /* герб — в нише слева на плашке */
#clanModal .cl3-rk{ position:relative; }
#clanModal .cl3-rk.m1, #clanModal .cl3-rk.m2, #clanModal .cl3-rk.m3{ width:22px; height:29px; display:flex; align-items:flex-end; justify-content:center; padding-bottom:3px; box-sizing:border-box;
background:center/contain no-repeat; font-size:9.5px; text-shadow:0 1px 0 rgba(255,255,255,.5); }
#clanModal .cl3-rk.m1{ background-image:url(img/klany/med-1.webp); color:#4a2c06; } #clanModal .cl3-rk.m2{ background-image:url(img/klany/med-2.webp); color:#2a3040; } #clanModal .cl3-rk.m3{ background-image:url(img/klany/med-3.webp); color:#3a1a08; }
/* 71-я, мелочи клана: переключатель Топа — плашки-фильтры с картинками, числа в строках с картинками, поиск — поле его листа, строка алтаря не налезает на плиту */
#clanModal .cl-topsw{ gap:6px; }
#clanModal .cl-topsw span{ display:inline-flex; align-items:center; gap:4px; height:26px; box-sizing:border-box; padding:0 4px; border:0 solid transparent; border-width:0 12px; border-radius:0; background:none;
border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#c8d0e4; text-shadow:0 1px 2px #000; }
#clanModal .cl-topsw span.on{ border-image:url(img/klany/kn-glav.webp) 0 46 fill / 0 12px stretch; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,180,.7); }
#clanModal .cl-topsw .cli, #clanModal .cl3-val .cli{ width:15px; height:15px; margin-right:3px; }
#clanModal .cl3-val{ display:inline-flex; align-items:center; }
#clanModal .cl-search{ height:30px; box-sizing:border-box; border:none; border-radius:0; background:url(img/klany/sz-inp.webp) center/100% 100% no-repeat; padding:0 14px; color:#f0e0b0; }
#clanModal .cln-scroll .cln-s{ font-size:9.5px; line-height:1.1; }
#clanModal .cln-top{ height:96px; }
/* 71-я, его слово: на плитке храма — только имя и «изучено» (описание убрано) */
#clanModal .clt-d{ display:none; }
#clanModal .clt-w{ justify-content:center; gap:8px; }
#clanModal .clt-t{ font-size:16px; }
#clanModal .clt-card{ grid-template-rows:1fr auto 1fr; } #clanModal .clt-w{ grid-row:2; } #clanModal .clt-plate{ grid-row:3; align-self:start; } #clanModal .clt-img{ grid-row:1 / 4; }
/* его слово «кнопки жёлтые и фон жёлтый — потому плохо»: зал храма сильно затемнён и обесцвечен, цвет храма — только тонкой подсветкой; до новых фонов */
#clanModal .clr-wrap{ background:linear-gradient(90deg,rgba(0,0,0,.7),rgba(0,0,0,.45) 26%,rgba(0,0,0,.45) 74%,rgba(0,0,0,.7)), radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--tc) 18%, transparent), transparent 70%), var(--zal) center/cover no-repeat; }
#clanModal .clr-wrap::before{ content:''; position:absolute; inset:0; background:var(--zal) center/cover no-repeat; filter:grayscale(.75) brightness(.38); z-index:0; pointer-events:none; }
#clanModal .clr-wrap > *{ position:relative; z-index:1; }
#clanModal .clt-t{ font-size:14.5px; }
#clanModal .clr-side{ overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; padding-right:2px; } /* у Анубиса бонусов много — список листается */
/* 71-я: новые тёмные залы храмов (его лист ui-proba/klany/zaly-2.jpg) — затемнение и обесцвечивание сняты, зал как есть */
#clanModal .clr-wrap::before{ filter:none; }
#clanModal .clr-wrap{ background:none; }
/* 71-я: плитка храма — сверху имя (крупно, цвет храма, номер-печать), ниже слева храм, справа очки «176.7K / 400K», полоса и «алтарей 8 / 11» */
#clanModal .clt-card{ display:grid; grid-template-columns:86px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); column-gap:8px; row-gap:2px; padding:6px 10px 6px 6px; align-items:center; }
#clanModal .clt-card .clt-t{ grid-column:1 / -1; grid-row:1; display:flex; align-items:center; justify-content:center; gap:7px; margin:0 -4px; padding:2px 0 4px;
font:900 15px 'Cinzel',serif; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
color:color-mix(in srgb, var(--tc) 50%, #fff); text-shadow:0 1px 2px #000, 0 0 8px color-mix(in srgb, var(--tc) 55%, transparent);
border-bottom:1px solid color-mix(in srgb, var(--tc) 50%, transparent); background:linear-gradient(90deg,transparent,color-mix(in srgb, var(--tc) 14%, transparent),transparent); }
#clanModal .clt-card .clt-num{ position:static; font-size:10.5px; padding:0 5px; border-radius:5px; }
#clanModal .clt-lock{ font-style:normal; font-size:11px; }
#clanModal .clt-card .clt-img{ grid-column:1; grid-row:2; height:100%; min-height:0; }
#clanModal .clt-pr{ grid-column:2; grid-row:2; display:flex; flex-direction:column; justify-content:center; gap:4px; min-width:0; }
#clanModal .clt-pv{ display:flex; align-items:baseline; gap:4px; white-space:nowrap; }
#clanModal .clt-pv b{ font:900 16px 'JetBrains Mono',monospace; color:#fff3d0; text-shadow:0 1px 2px #000; }
#clanModal .clt-pv small{ font:700 11px 'JetBrains Mono',monospace; color:#a89c84; }
#clanModal .clt-bar{ height:9px; border-radius:5px; background:rgba(0,0,0,.6); border:1px solid color-mix(in srgb, var(--tc) 45%, #000); overflow:hidden; }
#clanModal .clt-bar i{ display:block; height:100%; background:linear-gradient(90deg, color-mix(in srgb, var(--tc) 60%, #000), var(--tc)); box-shadow:0 0 6px var(--tc); }
#clanModal .clt-al{ font:700 9.5px 'Inter',sans-serif; color:#c8bca4; }
#clanModal .clt-card.lock .clt-pr{ opacity:.65; }
/* 71-я, его слово по окну алтаря: только имя и бафф, крупная цена, «Обновить» — кость и цена по центру печати, лишних подписей нет; «Сбросить лимит» — только когда упёрся */
#clanModal .cln-scroll .cln-t{ font-size:17px; } #clanModal .cln-scroll .cln-d{ font-size:13px; margin-top:2px; }
#clanModal .cln-tab{ height:74px; }
#clanModal .cln-tab b{ font-size:19px; }
#clanModal .cln-tab i{ font:800 12px 'JetBrains Mono',monospace; gap:4px; }
#clanModal .cln-cur{ width:19px; height:19px; vertical-align:-4px; }
#clanModal .cln-seal{ position:relative; justify-content:center; }
#clanModal .cln-rr{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; font:900 11px 'JetBrains Mono',monospace; color:#fff; text-shadow:0 1px 2px #000,0 0 4px #000; }
#clanModal .cln-rr img{ width:24px; height:24px; object-fit:contain; filter:drop-shadow(0 1px 2px #000); }
#clanModal .cln-line{ min-height:0; }
#clanModal .cln-reset:not(.on){ display:none; }
#clanModal .cln-tab{ padding-bottom:14px; box-sizing:border-box; gap:2px; } #clanModal .cln-tab i{ background:rgba(255,248,230,.55); padding:1px 7px; border-radius:8px; } /* цена — не на кучке монет */
/* 71-я, его слово «убери кольцо с часами — просто время в полоске перед костью»: таймер — текст на плите, без картинки */
#clanModal .cln-timer{ width:auto; height:auto; padding:0 4px; background:none; filter:none; }
#clanModal .cln-timer.blocked{ filter:none; }
#clanModal .cln-timer b{ font:900 15px 'JetBrains Mono',monospace; color:#fff3d0; white-space:nowrap; }
#clanModal .cln-timer.blocked b{ color:#ff9080; }
/* 71-я, его слово «шапку клана — обычненько, как светлый лист»: шапка — светлый пергамент с тонкой золотой рамкой, текст тёмный, плитки — светлые ячейки */
#clanModal .clh{ border:1px solid #8a6a3a; border-radius:10px; box-shadow:0 4px 12px rgba(0,0,0,.55), inset 0 0 30px rgba(120,80,30,.25);
background:linear-gradient(180deg,#f3e6c6,#e2cfa4); color:#3a2410; }
#clanModal .clh-name{ color:#3a1f08; text-shadow:none; }
#clanModal .clh-desc{ color:#4a3418; } #clanModal .clh-desc .muted{ color:#8a7450; }
#clanModal .clh-chip{ background:rgba(255,250,235,.7); color:#4a3418; border-color:#b89a62; }
#clanModal .clh-chip.e-open{ color:#1f6a30; border-color:#5aa86a; } #clanModal .clh-chip.e-request{ color:#7a5a10; border-color:#c8a040; } #clanModal .clh-chip.e-closed{ color:#8a2a20; border-color:#c06050; }
#clanModal .clh-chip.lead b{ color:#7a4a08; }
#clanModal .clh-tile{ background:rgba(255,250,235,.55); border:1px solid #c0a470; }
#clanModal .clh-tile b{ color:#3a1f08; } #clanModal .clh-tile small{ color:#7a6040; }
/* 71-я, его слово «слишком яркий — серый под камень»: шапка клана — серый тёсаный камень с тонкой золотой рамкой, текст светлый */
#clanModal .clh{ border:1px solid #9a7a40; box-shadow:0 4px 12px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 24px rgba(0,0,0,.45);
background:
repeating-linear-gradient(0deg, rgba(0,0,0,.10) 0 1px, transparent 1px 34px),
radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.07), transparent 60%),
linear-gradient(180deg,#4a4a4e,#33333a); color:#e8e0d0; }
#clanModal .clh-name{ color:#f3e3bc; text-shadow:0 1px 2px #000; }
#clanModal .clh-desc{ color:#d8d0c0; } #clanModal .clh-desc .muted{ color:#9a948a; }
#clanModal .clh-chip{ background:rgba(0,0,0,.35); color:#e0d8c8; border-color:rgba(200,170,110,.55); }
#clanModal .clh-chip.e-open{ color:#8fe09a; border-color:#4a9a5a; } #clanModal .clh-chip.e-request{ color:#ffd76a; border-color:#a88a3a; } #clanModal .clh-chip.e-closed{ color:#ff9080; border-color:#a04a40; }
#clanModal .clh-chip.lead b{ color:#ffd76a; }
#clanModal .clh-tile{ background:rgba(0,0,0,.28); border:1px solid rgba(200,170,110,.35); }
#clanModal .clh-tile b{ color:#fff3d0; } #clanModal .clh-tile small{ color:#b0a898; }
/* 71-я, его слово «полоса сломана»: полоса алтаря без картинок — ровный тёмный жёлоб с золотой каймой, заливка внутри строго по проценту, число по центру */
#clanModal .cln-scroll .cln-prog{ height:20px; border-radius:10px; background:linear-gradient(180deg,#0e0a06,#1e1810); border:2px solid #b08a3e;
box-shadow:inset 0 2px 4px rgba(0,0,0,.8), 0 0 0 1px #3a2408; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; }
#clanModal .cln-scroll .cln-prog .fl{ position:absolute; left:0; top:0; bottom:0; width:var(--p,0); max-width:100%; border-radius:8px;
background:linear-gradient(180deg,#ffe59a,#e0a830 55%,#a86e14); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 0 8px rgba(255,200,80,.6); }
#clanModal .cln-scroll .cln-prog span{ position:relative; z-index:1; font:800 11px 'JetBrains Mono',monospace; color:#fff8e0; text-shadow:0 1px 2px #000,0 0 3px #000; }
/* 71-я, его слово по табличкам: очки — по центру таблички, цена — под табличкой; костяная — ярче, чтобы не казалась выключенной; таймер — левее, между именем и «Обновить» */
#clanModal .cln-tabs{ row-gap:0; margin-bottom:18px; }
#clanModal .cln-tab{ position:relative; overflow:visible; justify-content:center; padding:0; height:66px; }
#clanModal .cln-tab b{ font-size:21px; }
#clanModal .cln-tab i{ position:absolute; left:50%; top:100%; transform:translateX(-50%); margin-top:3px; white-space:nowrap; background:rgba(0,0,0,.55); color:#fff3d0; border:1px solid rgba(202,164,76,.55); padding:1px 8px; text-shadow:none; }
#clanModal .cln-tab.bone{ filter:brightness(1.12) saturate(1.25) drop-shadow(0 0 6px rgba(255,240,200,.45)); }
#clanModal .cln-tab.bone b{ color:#4a2a08; }
#clanModal .cln-tab.bone i{ color:#fff3d0; }
#clanModal .cln-tab.none i{ color:#c8c0b0; }
#clanModal .cln-top{ padding-right:10px; }
#clanModal .cln-timer{ margin-right:auto; margin-left:6px; order:0; }
#clanModal .cln-info{ flex:0 1 auto; }
#clanModal .cln-seal{ margin-left:auto; }
#clanModal .cln-timer{ margin:0 auto; } #clanModal .cln-seal{ margin-left:0; } /* время — посередине между именем и «Обновить» */
/* 71-я, его слово «всё чуть поднять, кнопку сброса нормальную, зелёненькую»: окно алтаря выше на ~6 px; «Сбросить лимит» —
большая изумрудная кнопка по центру под табличками (появляется только при кд 5 ч), цена костями картинкой */
#clanModal .cln-scroll{ padding-top:2px; }
#clanModal .cln-top{ margin-bottom:4px; }
#clanModal .cln-tabs{ margin-top:4px; margin-bottom:22px; }
#clanModal .cln-line{ justify-content:center; height:auto; margin-top:-4px; }
#clanModal .cln-line .sp{ display:none; }
#clanModal .cln-reset.on{ display:inline-flex; align-items:center; gap:5px; height:32px; box-sizing:border-box; padding:0 8px; border:0 solid transparent; border-width:0 14px; border-radius:0;
background:none; box-shadow:none; border-image:url(img/klany/zv-da.webp) 0 34 fill / 0 14px stretch; color:#f2fff4; font:800 12px 'Cinzel',serif; text-shadow:0 1px 2px #062010, 0 0 4px #062010; }
#clanModal .cln-reset img{ width:16px; height:16px; object-fit:contain; }
#clanModal .cln-reset:disabled{ filter:grayscale(.6); opacity:.75; }
#clanModal .cln-tabs{ margin-bottom:24px; } #clanModal .cln-line{ margin-top:0; } #clanModal .cln-tab{ height:62px; }
/* «Сбросить лимит» — на плите рядом со временем (снизу под табличками места нет) */
#clanModal .cln-tabs{ margin-bottom:22px; }
#clanModal .cln-top .cln-reset.on{ height:30px; font-size:10.5px; padding:0 4px; margin-right:6px; flex-direction:column; gap:0; line-height:1.05; }
#clanModal .cln-top .cln-timer{ margin:0 6px 0 auto; }
/* 71-я: сброс шире, сверху «Сбросить лимит», снизу число и кость в одну строку */
#clanModal .cln-top .cln-reset.on{ min-width:124px; height:36px; padding:3px 10px 0; margin:0; white-space:nowrap; font-size:10.5px; line-height:1.15; flex-shrink:0; }
#clanModal .cln-top .cln-reset.on span{ display:flex; align-items:center; justify-content:center; gap:3px; }
#clanModal .cln-top .cln-reset.on .rc img{ width:13px; height:13px; }
/* время над кнопкой сброса — одной колонкой, имени алтаря хватает места */
#clanModal .cln-top .cln-tr{ display:flex; flex-direction:column; align-items:center; gap:2px; margin:0 8px 0 auto; flex-shrink:0; }
#clanModal .cln-top .cln-tr .cln-timer{ margin:0; }
#clanModal .cln-top .cln-info{ min-width:0; flex:1 1 auto; }
#clanModal .cln-top .cln-tr{ gap:1px; margin-top:8px; }
#clanModal .cln-top .cln-tr .cln-timer{ height:15px; line-height:15px; font-size:12px; }
#clanModal .cln-top .cln-tr .cln-reset.on{ height:34px; padding-top:5px; }
/* 71-я, его слово: кнопка сброса чуть выше, надпись по центру, во втором ряду число и кость; имя алтаря и бафф — по одной строке */
#clanModal .cln-top .cln-tr{ margin-top:4px; }
#clanModal .cln-top .cln-tr .cln-reset.on{ height:40px; padding:0 12px; min-width:128px; justify-content:center; align-items:center; text-align:center; gap:1px; }
#clanModal .cln-top .cln-tr .cln-reset.on span{ width:100%; }
#clanModal .cln-top .cln-info .cln-t{ white-space:nowrap; }
#clanModal .cln-top .cln-info .cln-d{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.2; }
#clanModal .cln-top .cln-info .cln-d.dl{ font-size:11.5px; } /* длинный бафф (Печать клана) — в две строки */
/* 71-я, его слово «почему не дотягиваешь линии»: заливка — ровная золотая полоса (pl-strip, вырезана из pl-fill) точно по жёлобу pl.webp:
жёлоб x 15–243 из 259 (5,8 % / 88,4 %), y 14–34 из 48 — при 100 % доходит до самого конца */
#clanModal .clr-bar .fl, #clanModal .clr-bar .fl.gold{ left:6.4%; top:31%; bottom:29%; width:calc(87.2% * var(--pn,0)); background:url(img/klany/pl-strip.webp) 0 0/100% 100% no-repeat; border-radius:3px; box-shadow:inset -2px 0 3px rgba(255,250,200,.55); }
#clanModal .clr-bar .tx{ gap:4px; } #clanModal .clr-bar .tx small{ letter-spacing:-.3px; } /* подпись не слипается с числом */
#clanModal .clr-bar .tx.lg{ font-size:7px; gap:2px; } #clanModal .clr-bar .tx.lg small{ font-size:7.5px; letter-spacing:-.5px; } /* длинные числа (Анубис +1050%) — мельче, но в ширину */
/* 71-я: мини-профиль — герои аватарками (без «ур.»), «Подробнее ›» — в шестой клетке статов */
#playerCard .pc-hava{ width:52px; height:52px; border-radius:10px; overflow:hidden; border:2px solid #caa44c; box-shadow:0 0 0 1px #000, 0 2px 6px rgba(0,0,0,.6); background:#0b0f1c; }
#playerCard .pc-hava img, #playerCard .pc-hava .hero-portrait, #playerCard .pc-hava svg{ width:100%; height:100%; object-fit:cover; display:block; }
#playerCard .pc-hero{ gap:3px; }
#playerCard .pc-more{ justify-content:center; cursor:pointer; font:800 11px 'Inter',sans-serif; color:#e8f5e0; background:linear-gradient(180deg,#2f6a3a,#1d4426); border:1px solid #6fbf72; border-radius:8px; text-shadow:0 1px 2px #000; }
#playerCard .pc-more:hover{ filter:brightness(1.12); }
#playerCard .pc-acts{ justify-content:flex-end; }
#playerCard.player-card{ height:min(358px,359px); } /* 71-я: герои аватарками — карточка до потолка экрана 390, кнопки не налезают на имена */
#playerCard .pc-hava{ width:46px; height:46px; }
#playerCard .pc-hero .pf-hn{ font-size:9.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:76px; }
/* 71-я: ава героя в рамке цвета звания (профили: мини, полный, свой в Настройках); уровень не пишем */
.pf-hava{ position:relative; width:56px; height:56px; border-radius:10px; overflow:hidden; border:3px solid var(--rk,#8a8f98); box-sizing:border-box; background:#0b0f1c;
box-shadow:0 0 0 1px #000, 0 0 7px color-mix(in srgb, var(--rk,#8a8f98) 55%, transparent), inset 0 0 0 1px rgba(0,0,0,.6); }
.pf-hava img, .pf-hava .hero-portrait, .pf-hava svg{ width:100%; height:100%; object-fit:cover; display:block; border-radius:0; }
.pf-hava.top{ box-shadow:0 0 0 1px #000, 0 0 10px #ffd04a, 0 0 18px rgba(255,120,40,.6); }
.pf-rk{ font:800 8.5px 'Inter',sans-serif; color:var(--rk,#8a8f98); text-shadow:0 1px 2px #000; white-space:nowrap; line-height:1.1; }
#playerCard .pf-hava{ width:46px; height:46px; }
/* 71-я: со свитком-подписью #profileModal .pf-heroes{top:30px} клал «Героев» под свиток — сдвиг вниз, свиток ниже ростом */
#profileModal .pf-body.pf-note .pf-scroll{ height:44px; }
#profileModal .pf-body.pf-note .pf-heroes{ top:62px; height:130px; }
#profileModal .pf-body.pf-note .pf-artis{ top:198px; }
/* 71-я: рамка звания — картинка его листа поверх авы (img/profil/ramka-N.webp); ава в «дыре» рамки (дыра ≈ 15–19 % от краёв, сверху ≈ 20 % из-за скарабея) */
.pf-hava{ width:62px; height:62px; border:0; border-radius:0; overflow:visible; background:none; box-shadow:none; }
.pf-hava.top{ box-shadow:none; }
.pf-hava .pf-hpic{ position:absolute; left:14%; right:14%; top:17%; bottom:14%; overflow:hidden; border-radius:4px; background:#0b0f1c; }
.pf-hava .pf-hpic img, .pf-hava .pf-hpic .hero-portrait, .pf-hava .pf-hpic svg{ width:100%; height:100%; object-fit:cover; object-position:50% 25%; display:block; }
.pf-hava .pf-hfr{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
#playerCard .pf-hava{ width:50px; height:50px; }
.pf-hava{ flex-shrink:0; } /* в колонке героя рамка не сплющивается */
.pf-body .pf-hava, .st-pane .pf-hava{ width:56px; height:56px; } .pf-body .pf-hero, .st-pane .pf-hero{ gap:2px; } /* имя + звание + мощь помещаются в «Героев» */
/* 71-я, его слово: герои крупно, почти впритык; сверху имя, мощь полным числом, ниже ава в рамке */
.pf-hero .pf-hn{ font:800 10px 'Inter',sans-serif; color:#f0e0b0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; line-height:1.2; text-align:center; }
.pf-hero .pf-pw{ font:800 9.5px 'JetBrains Mono',monospace; color:#ffd88a; white-space:nowrap; line-height:1.2; text-align:center; }
#playerCard .pc-heroes{ justify-content:space-between; gap:2px; align-items:flex-end; }
#playerCard .pc-hero{ flex:1 1 0; min-width:0; width:auto; gap:1px; }
#playerCard .pf-hava{ width:68px; height:68px; margin-top:1px; }
#playerCard .pc-body{ gap:5px; }
.pf-body .pf-row, .st-pane .pf-row{ justify-content:space-between; gap:2px; }
.pf-body .pf-hero, .st-pane .pf-hero{ flex:1 1 0; min-width:0; width:auto; gap:1px; }
.pf-body .pf-hava, .st-pane .pf-hava{ width:64px; height:64px; margin-top:1px; }
/* 71-я: правка «о себе» — панель поверх всего профиля (Настройки и окно профиля): большое поле, клавиатура сразу, внизу счётчик и кнопки */
.pf-noted{ position:absolute; inset:0; z-index:30; display:flex; flex-direction:column; gap:8px; padding:12px 14px; border-radius:12px;
background:linear-gradient(180deg,rgba(28,22,16,.98),rgba(14,11,8,.98)); border:1px solid #8a6a3a; box-shadow:0 8px 30px rgba(0,0,0,.6); }
.pf-noted-hd{ font:800 14px 'Cinzel',serif; color:#f0e0b0; display:flex; align-items:baseline; gap:10px; }
.pf-noted-hd small{ font:500 11px 'Inter',sans-serif; color:#a89c84; }
.pf-noted textarea{ flex:1; min-height:0; width:100%; box-sizing:border-box; resize:none; padding:10px 12px; border-radius:10px;
background:#f1e3c0 url(img/druzya/papirus.webp) center/cover; border:2px solid #b08a3e; color:#3a2410; font:600 16px/1.35 'Inter',sans-serif; outline:none; }
.pf-noted textarea:focus{ border-color:#e6c976; box-shadow:0 0 0 2px rgba(230,201,118,.35); }
.pf-noted-ft{ display:flex; align-items:center; gap:10px; }
.pf-noted-ft .pf-ncnt{ margin-right:auto; font:700 12px 'JetBrains Mono',monospace; color:#c8bca4; position:static; }
.pf-noted-ft .pf-ncnt.over{ color:#ff6a6a; }
.pf-noted-ft .pf-btn{ min-width:110px; height:34px; font-size:13px; }
.pf-noted .pf-nerr{ position:static; }
.pf-noted textarea{ background:linear-gradient(180deg,#f3e6c4,#e6d3a4); } .pf-noted textarea::placeholder{ color:#8a7350; }
/* 71-я: рамка звания в профилях — каймой средней толщины (в героях 4–5 px, была картинка целиком ≈ 15 % стороны) */
.pf-hava{ border:8px solid transparent; border-width:10px 8px 8px 8px; border-image:var(--fr) 38 30 30 30 / 10px 8px 8px 8px stretch; box-sizing:border-box; filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.pf-hava .pf-hpic{ inset:0; left:0; right:0; top:0; bottom:0; border-radius:2px; }
#playerCard .pf-hava{ border-width:10px 8px 8px 8px; }
/* его слово «окно, чтобы писать, слишком большое — чуть меньше»: по центру, ~460×190, поле на 3–4 строки */
.pf-noted{ inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); width:min(460px,92%); height:190px; padding:10px 12px; gap:6px; }
.pf-noted textarea{ font-size:15px; }
.pf-noted-ft .pf-btn{ min-width:96px; height:30px; font-size:12px; }
/* 71-я: аватар игрока — картинка его листа (shared/avatars.js img), заполняет круг/квадрат авы везде (профиль, друзья, клан, Лига, топ) */
.pf-ava.img{ padding:0; overflow:hidden; background:#101420; }
.pf-ava.img img, .pf-avc img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
.pf-avc{ overflow:hidden; padding:0; }
/* ===== 71-я: РАСКОПКИ — ГРАФИКА ЕГО ЛИСТОВ (ui-proba/raskopki/list-0…6 → img/raskopki/), его слово «всё разом, по центру, красиво» ===== */
#digModal.dig-modal{ background:#0b0f1e url(img/raskopki/fon.webp) center 60%/cover no-repeat; border:2px solid #b8862a; }
#digModal.dig-modal::before{ background:linear-gradient(180deg,rgba(6,8,18,.35),rgba(6,8,18,.15) 35%,rgba(6,8,18,.45)); }
#digModal .dig-top{ justify-content:space-between; border-bottom:none; background:linear-gradient(180deg,rgba(8,10,22,.85),rgba(8,10,22,.2)); }
#digModal .dig-top::after{ opacity:.45; }
#digModal .dig-ttl{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:15px; letter-spacing:.14em; pointer-events:none; }
#digModal .dig-chip, #digModal .dig-en{ height:26px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:4px; padding:0 4px; border:0 solid transparent; border-width:0 10px;
border-image:url(img/raskopki/plashka.webp) 0 34 fill / 0 10px stretch; background:none; border-radius:0; box-shadow:none; color:#f0e0b0; font:800 10.5px 'Inter',sans-serif; }
#digModal .dig-chip b, #digModal .dig-en b{ font:800 12px 'JetBrains Mono',monospace; color:#ffe07a; }
#digModal .dig-en{ margin-left:auto; } #digModal .dig-en small{ font:700 9.5px 'JetBrains Mono',monospace; color:#a89c84; }
#digModal .dig-en.flash{ animation:digEnFlash2 .5s; } @keyframes digEnFlash2{ 0%{ filter:brightness(1.8) hue-rotate(-40deg); } 100%{ filter:none; } }
#digModal .dig-ic{ width:15px; height:15px; object-fit:contain; vertical-align:-3px; flex:0 0 auto; }
#digModal .dig-bk{ height:28px; box-sizing:border-box; padding:0 4px; min-height:0; display:inline-flex; align-items:center; justify-content:center; border:0 solid transparent; border-width:0 8px 0 27px;
border-image:url(img/raskopki/kn-nazad.webp) 0 22 0 108 fill / 0 8px 0 27px stretch; background:none; border-radius:0; color:#f0e0b0; font:800 11px 'Cinzel',serif; text-shadow:0 1px 2px #000; }
#digModal .dig-bk:hover{ filter:brightness(1.15); }
/* список мест: строка — доска с золотыми углами, слева картинка места с именем по центру, кнопка «Копать», справа медальоны лидеров */
#digModal .dig-rows{ gap:6px; padding:6px 10px 8px; }
#digModal .dig-row{ padding:2px 4px; gap:8px; align-items:center; border:0 solid transparent; border-width:9px 12px; border-image:url(img/raskopki/stroka.webp) 40 54 fill / 9px 12px stretch; background:none; border-radius:0; box-shadow:0 4px 10px rgba(0,0,0,.45); }
#digModal .dig-row.lock{ opacity:1; filter:none; }
#digModal .dig-row.lock .pic, #digModal .dig-row.lock .dig-ld{ filter:grayscale(.7) brightness(.6); }
#digModal .dig-row .pl{ width:172px; gap:4px; }
#digModal .dig-row .pl .pic{ height:58px; border-radius:6px; border:1px solid #b8862a; background:center/cover no-repeat; display:block; box-shadow:0 2px 6px rgba(0,0,0,.6); }
#digModal .dig-row[data-k] .pic{ background-color:#000; }
#digModal .dig-row .pl .pic::after{ background:linear-gradient(180deg,rgba(0,0,0,.65),transparent 38%,transparent 62%,rgba(0,0,0,.6)); }
#digModal .dig-row .pl .pic .nm{ position:absolute; left:0; right:0; top:3px; z-index:1; text-align:center; max-width:none; font:800 10px 'Cinzel',serif; letter-spacing:.06em; color:#fff3d0; text-shadow:0 1px 2px #000,0 0 6px #000; }
#digModal .dig-row .pl .pic small{ left:50%; right:auto; bottom:3px; transform:translateX(-50%); white-space:nowrap; font-size:8px; background:rgba(0,0,0,.6); border-color:#8a6a2a; }
#digModal .dig-btn{ height:28px; box-sizing:border-box; padding:0 2px; border:0 solid transparent; border-width:0 7px 0 28px; border-image:url(img/raskopki/kn-kopat.webp) 0 20 0 106 fill / 0 7px 0 28px stretch;
background:none; border-radius:0; box-shadow:none; color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.5); font:800 10.5px 'Cinzel',serif; gap:4px; }
#digModal .dig-btn.lk{ opacity:1; border-image-source:url(img/raskopki/kn-zamok.webp); color:#e8e4dc; text-shadow:0 1px 2px #000; font-size:10px; }
#digModal .dig-ld{ gap:8px; padding:3px 8px; border-radius:8px; border:1px solid rgba(184,134,42,.45); background:rgba(8,6,4,.5); }
#digModal .dig-ld .lb{ background:none; border:none; padding:0; color:#e6c976; font-size:8.5px; }
#digModal .dig-ld.day .lb{ color:#bfe4ff; }
#digModal .dig-md{ position:relative; width:44px; height:51px; flex:0 0 auto; background:center/100% 100% no-repeat; --cy:55%; }
#digModal .dig-md.g{ background-image:url(img/raskopki/med-zoloto.webp); }
#digModal .dig-md.s{ background-image:url(img/raskopki/med-serebro.webp); --cy:54%; }
#digModal .dig-md.e{ background-image:url(img/raskopki/med-bronza.webp); height:44px; --cy:50%; }
#digModal .dig-ld .dig-md .pf-ava{ position:absolute; left:50%; top:var(--cy); transform:translate(-50%,-50%); width:66%; height:auto; aspect-ratio:1; margin:0; border:0; border-radius:50%; box-shadow:none; font-size:14px; }
#digModal .dig-md .q{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font:800 15px 'Cinzel',serif; color:#8a7a5a; }
/* экран раскопки: поле — фон места, клетки картинками; удар — кирка и песок; находка — искра */
#digModal .dig-left{ background:none; }
#digModal .dig-grid{ background:#000 var(--pole) center/cover no-repeat; border:2px solid #b8862a; box-shadow:inset 0 0 18px rgba(0,0,0,.55), 0 0 0 2px rgba(0,0,0,.6), 0 6px 18px rgba(0,0,0,.6); }
#digModal .dig-cell{ background:var(--kl) center/100% 100% no-repeat; border:none; border-radius:0; box-shadow:none; font-size:0; overflow:visible; filter:drop-shadow(0 2px 2px rgba(0,0,0,.55)); }
#digModal .dig-cell:not(.open):hover{ transform:translateY(-2px) scale(1.05); box-shadow:none; filter:drop-shadow(0 0 6px rgba(255,224,122,.9)); }
#digModal .dig-cell.open{ background:url(img/raskopki/kl-yama.webp) center/100% 100% no-repeat; border:none; box-shadow:none; color:#fff3d0; text-shadow:0 1px 2px #000,0 0 4px #000; font:800 10px 'JetBrains Mono',monospace; gap:0; }
#digModal .dig-cell.open .i{ font-size:14px; line-height:1; } #digModal .dig-cell.open .i .dig-ic, #digModal .dig-cell.open .i .zol-ic{ width:17px; height:17px; vertical-align:0; }
#digModal .dig-cell.open.gold{ color:#bfb08a; } #digModal .dig-cell.open.gold .i{ opacity:.7; }
#digModal .dig-cell.open.last{ border:none; animation:digReveal .35s cubic-bezier(.2,.9,.3,1.3); }
#digModal .dig-cell.open.last::after{ content:''; position:absolute; left:50%; top:30%; width:34px; height:34px; transform:translate(-50%,-50%); background:url(img/raskopki/iskra.webp) center/contain no-repeat; pointer-events:none; animation:digSpark .9s ease-out forwards; }
@keyframes digSpark{ 0%{ opacity:0; transform:translate(-50%,-50%) scale(.3) rotate(0); } 25%{ opacity:1; } 100%{ opacity:0; transform:translate(-50%,-90%) scale(1.3) rotate(40deg); } }
.dig-fx{ position:absolute; z-index:7; width:0; height:0; pointer-events:none; }
.dig-fx .k{ position:absolute; width:40px; left:-6px; top:-44px; transform-origin:85% 90%; animation:digKirka .45s cubic-bezier(.5,0,.7,1) forwards; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.dig-fx .p{ position:absolute; width:58px; left:-29px; top:-40px; opacity:0; animation:digPesok .6s ease-out .22s forwards; }
@keyframes digKirka{ 0%{ transform:rotate(-55deg); opacity:0; } 20%{ opacity:1; } 70%{ transform:rotate(18deg); } 100%{ transform:rotate(10deg); opacity:0; } }
@keyframes digPesok{ 0%{ opacity:0; transform:scale(.4) translateY(10px); } 30%{ opacity:1; } 100%{ opacity:0; transform:scale(1.15) translateY(-8px); } }
#digModal .dig-pop .dig-ic, #digModal .dig-pop .zol-ic{ width:14px; height:14px; vertical-align:-3px; }
/* панель справа — каменная табличка со скарабеем; всё по центру */
#digModal .dig-right{ border-left:none; padding:30px 16px 14px; gap:3px; background:url(img/raskopki/panel.webp) center/100% 100% no-repeat; text-align:center; }
#digModal.field .dig-right{ width:200px; padding:31px 17px 14px; }
#digModal .dig-dn{ background:none; border:none; box-shadow:none; padding:0; }
#digModal .dig-dn .t, #digModal .dig-rw .t, #digModal .dig-sack .t{ color:#e6c976; text-shadow:0 1px 2px #000; }
#digModal .dig-dn .s{ color:#d8ccb0; display:flex; align-items:center; justify-content:center; gap:3px; }
#digModal .dig-rw{ margin-top:2px; } #digModal .dig-rw .v{ display:flex; gap:10px; align-items:center; justify-content:center; font-size:14px; }
#digModal .dig-rw .v span{ display:inline-flex; align-items:center; gap:3px; } #digModal .dig-rw .v .dig-ic{ width:17px; height:17px; }
#digModal .dig-artl .t{ color:#d8ccb0; }
#digModal .dig-sack{ background:rgba(0,0,0,.35); border-color:rgba(184,134,42,.4); padding:4px 6px; }
#digModal .dig-got .gi{ background:rgba(255,255,255,.05); justify-content:center; gap:3px; font-size:9px; }
#digModal .dig-got .gi .dig-ic, #digModal .dig-got .gi .zol-ic{ width:13px; height:13px; }
/* «Раскопка завершена!» — каменная плита с золотой рамкой, слева открытый саркофаг; всё по центру */
#digModal .dig-done .card{ position:relative; width:430px; padding:10px 14px 10px 104px; border:0 solid transparent; border-width:16px; border-image:url(img/raskopki/nagrada.webp) 50 fill / 16px stretch; background:none; border-radius:0; box-shadow:0 10px 30px rgba(0,0,0,.8); }
#digModal.field .dig-done .card{ width:430px; padding:4px 10px 4px 96px; }
#digModal .dig-done .card .sarc{ position:absolute; left:-4px; bottom:-6px; height:calc(100% + 4px); max-height:230px; width:auto; pointer-events:none; filter:drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
#digModal .dig-done .rw{ border-bottom-color:rgba(184,134,42,.35); }
#digModal .dig-done .rw b, #digModal .dig-done .chips span{ display:inline-flex; align-items:center; gap:3px; }
#digModal .dig-done .chips span{ border:1px solid rgba(184,134,42,.5); background:rgba(0,0,0,.4); }
#digModal .dig-done .dig-btn.big{ width:auto; min-width:200px; height:32px; padding:0 8px; font-size:12px; border-image-source:url(img/raskopki/kn-kopat.webp); border-width:0 8px 0 32px; border-image-width:0 8px 0 32px; background:none; box-shadow:none; color:#3a2208; }
#digModal.field .dig-right{ padding-top:38px; } /* «Раскопок пройдено» — ниже скарабея */
#digModal .dig-ld{ justify-content:center; } #digModal .dig-ld .tx{ align-items:center; text-align:center; } #digModal .dig-ld .lb{ align-self:center; } /* лидеры — по центру (его слово) */
.dig-fx .k{ width:54px; left:-8px; top:-58px; filter:drop-shadow(0 0 2px #000) drop-shadow(0 3px 4px rgba(0,0,0,.8)); } /* кирку видно и на песке */
.dig-fx .p{ width:76px; left:-38px; top:-52px; filter:drop-shadow(0 0 2px rgba(60,30,0,.9)) brightness(1.08); }
#digModal.field .dig-done .card{ width:500px; max-width:96%; padding:2px 10px 2px 128px; gap:2px; scrollbar-width:none; } /* саркофаг слева не налезает на текст */
#digModal.field .dig-done .card::-webkit-scrollbar{ display:none; }
#digModal .dig-done .card .sarc{ height:178px; left:0; bottom:-4px; }
/* ===== 71-я, его выбор О1: «Раскопка завершена!» — саркофаг слева, плитки посередине, кружок тотема справа (только «Тотем выпал!» / «не выпал») ===== */
#digModal .dig-done .card.o1{ width:540px; max-width:97%; display:flex; flex-direction:row; align-items:center; gap:10px; padding:4px 10px 4px 120px; text-align:center; overflow:visible; max-height:none; }
#digModal.field .dig-done .card.o1{ width:540px; padding:4px 10px 4px 120px; }
#digModal .dig-done .card.o1 .sarc{ height:168px; left:2px; bottom:-2px; }
#digModal .dig-done .o1 .col{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:5px; }
#digModal .dig-done .o1 h4{ font-size:14px; }
#digModal .dig-done .o1 .sm{ font-size:9.5px; }
#digModal .dig-done .o1 .tiles{ display:flex; flex-wrap:wrap; justify-content:center; gap:4px; padding:0; border:none; background:none; border-radius:0; }
#digModal .dig-done .o1 .tiles > span{ width:54px; height:42px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:0 2px; border-radius:7px;
background:linear-gradient(180deg,rgba(60,42,14,.65),rgba(0,0,0,.55)); border:1px solid rgba(230,201,118,.45); box-shadow:none; }
#digModal .dig-done .o1 .tiles > span > b{ font:800 10px 'JetBrains Mono',monospace; color:#fff3d0; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
#digModal .dig-done .o1 .tiles .dig-ic, #digModal .dig-done .o1 .tiles .zol-ic{ width:20px; height:20px; }
#digModal .dig-done .o1 .tiles .osk-med{ transform:scale(.85); }
#digModal .dig-done .o1 .tiles > span.gold{ width:auto; min-width:70px; padding:0 6px; border-color:#ffe07a; box-shadow:0 0 8px rgba(255,224,122,.35); }
#digModal .dig-done .o1 .dig-btn.big{ min-width:190px; }
#digModal .dig-done .o1 .totc{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:5px; width:104px; }
#digModal .dig-done .o1 .totr{ position:relative; width:92px; height:92px; border-radius:50%; display:flex; align-items:center; justify-content:center;
background:conic-gradient(#9be07a calc(var(--p) * 1%), rgba(0,0,0,.55) 0); box-shadow:0 0 18px rgba(155,224,122,.55); animation:digTotRing 1.4s ease-in-out infinite; }
#digModal .dig-done .o1 .totr::before{ content:''; position:absolute; inset:6px; border-radius:50%; background:radial-gradient(circle,#3e5a24,#0e1806); border:2px solid #c9a24a; }
#digModal .dig-done .o1 .totr span{ position:relative; font-size:38px; line-height:1; filter:drop-shadow(0 2px 4px #000); }
#digModal .dig-done .o1 .totr.no{ background:conic-gradient(#8a8f98 calc(var(--p) * 1%), rgba(0,0,0,.55) 0); box-shadow:none; animation:none; }
#digModal .dig-done .o1 .totr.no::before{ background:radial-gradient(circle,#2e2e34,#101014); border-color:#6a6a72; }
#digModal .dig-done .o1 .totr.no span{ filter:grayscale(1) brightness(.6); }
@keyframes digTotRing{ 50%{ box-shadow:0 0 30px rgba(155,224,122,.95); } }
#digModal .dig-done .o1 .totc .lb{ font:900 12px 'Cinzel',serif; color:#9be07a; text-shadow:0 0 10px rgba(155,224,122,.6), 0 1px 2px #000; white-space:nowrap; }
#digModal .dig-done .o1 .totc .lb.no{ color:#a0a4aa; text-shadow:0 1px 2px #000; }
/* ===== 71-я, его выбор Л1: лидер — медальон больше, имя и «потрачено энергии» крупно ===== */
#digModal .dig-ld{ gap:10px; padding:4px 10px; }
#digModal .dig-md{ width:58px; height:67px; }
#digModal .dig-md.e{ height:58px; }
#digModal .dig-ld .lb{ font-size:9.5px; }
#digModal .dig-ld .who{ font:800 12.5px 'Inter',sans-serif; color:#fff3d0; max-width:150px; }
#digModal .dig-ld .sc{ display:inline-flex; align-items:center; gap:4px; font:900 17px 'JetBrains Mono',monospace; color:#ffe07a; }
#digModal .dig-ld .sc .dig-ic{ width:19px; height:19px; vertical-align:0; }
#digModal .dig-ld.empty .sc{ font-size:13px; }
#digModal .dig-done .o1 .tiles .osk-med{ width:22px; height:22px; transform:none; } /* медальон осколка — как значок */
/* ===== 71-я, его слово: на экране раскопки энергия — сразу после «Раскопки»; табличка справа — до самого верха окна;
внутри: «Раскопок пройдено N» строкой → «Награда за раскопку» → «Получено» → внизу «Тотемы 1 / 30» ===== */
#digModal.field .dig-body{ position:static; }
#digModal.field .dig-left{ margin-right:200px; }
#digModal.field .dig-top{ padding-right:208px; justify-content:flex-start; gap:8px; }
#digModal.field .dig-top::after{ right:200px; }
#digModal.field .dig-en{ margin-left:0; }
#digModal.field .dig-ttl{ left:calc((100% - 200px) / 2 + 60px); }
#digModal.field .dig-right{ position:absolute; top:0; right:0; bottom:0; width:200px; z-index:5; padding:44px 17px 16px; gap:0; }
#digModal.field .modal-close{ z-index:9; }
#digModal .dig-right .dig-dn{ flex-direction:row; align-items:baseline; justify-content:center; gap:7px; width:100%; }
#digModal .dig-right .dig-dn .t{ font-size:9px; letter-spacing:.12em; }
#digModal.field .dig-right .dig-dn .n{ font-size:28px; }
#digModal .dig-right .dig-rw{ margin-top:8px; }
#digModal .dig-right .dig-rw .t{ font-size:8.5px; letter-spacing:.12em; }
#digModal .dig-right .dig-sack{ margin-top:10px; }
#digModal .dig-right .dig-artl{ margin-top:auto; }
#digModal .dig-right .dig-artl .t{ font:800 9px 'Cinzel',serif; letter-spacing:.12em; text-transform:uppercase; color:#e6c976; text-shadow:0 1px 2px #000; margin-bottom:3px; }
#digModal .dig-right .dig-artl .t b{ font:800 12px 'JetBrains Mono',monospace; color:#ffe07a; letter-spacing:0; margin-left:4px; }
#digModal.field .dig-ttl{ position:static; transform:none; flex:1; min-width:0; text-align:center; overflow:hidden; text-overflow:ellipsis; } /* название — по центру места между энергией и табличкой */
#digModal .dig-right .dig-dn .t{ letter-spacing:.05em; font-size:8.5px; white-space:nowrap; }
#digModal .dig-right .dig-dn{ gap:5px; }
#digModal.field .dig-ttl{ font-size:12.5px; letter-spacing:.05em; } /* длинное «Гробница Тутанхамона» влезает */
#digModal .dig-right .dig-dn .t{ font-size:8px; letter-spacing:.02em; } #digModal.field .dig-right{ padding-left:20px; padding-right:20px; }
#digModal.field .dig-ttl.long{ font-size:11px; letter-spacing:0; }
/* 71-я, его слово: «Получено» — 2 столбца по 3–4 строки; золото — последней строкой во всю ширину, длинное число помещается */
#digModal .dig-right .dig-got{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3px; }
#digModal .dig-right .dig-got .gi, #digModal .dig-right .dig-got.kr .gi{ grid-column:auto !important; height:21px; justify-content:space-between; padding:0 6px; border-radius:5px; background:rgba(0,0,0,.45); border:1px solid rgba(230,201,118,.3); font-size:10px; }
#digModal .dig-right .dig-got .gi:last-child{ grid-column:1 / -1 !important; justify-content:center; gap:6px; }
#digModal .dig-right .dig-got .gi .dig-ic, #digModal .dig-right .dig-got .gi .zol-ic{ width:15px; height:15px; }
#digModal .dig-right .dig-got .gi > span:last-child{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* 71-я, его слово: «Получено» и «Тотемы» — в каменной рамке (плашка его листа: тёмный камень, золотой кант, заклёпки), тотемы — сразу под «Получено» */
#digModal .dig-right .dig-sack, #digModal .dig-right .dig-artl{ width:100%; box-sizing:border-box; background:none; border-radius:0; border:0 solid transparent; border-width:11px 12px; border-image:url(img/raskopki/plashka.webp) 36 40 fill / 11px 12px stretch; padding:0; }
#digModal .dig-right .dig-sack{ margin-top:8px; }
#digModal .dig-right .dig-sack .t{ margin:-3px 0 4px; }
#digModal .dig-right .dig-artl{ margin-top:6px; }
#digModal .dig-right .dig-artl .t{ margin:-3px 0 3px; text-align:center; }
#digModal .dig-right .dig-artl .bar{ height:6px; background:#000; border:1px solid #6a5220; }
#digModal .dig-right .dig-got .gi, #digModal .dig-right .dig-got.kr .gi{ background:linear-gradient(180deg,rgba(255,224,122,.07),rgba(0,0,0,.25)); border:1px solid rgba(230,201,118,.22); }
#digModal.field .dig-right{ padding-top:38px; padding-bottom:12px; } /* всё влезает по высоте 286 */
#digModal .dig-right .dig-rw{ margin-top:4px; } #digModal .dig-right .dig-sack{ margin-top:5px; } #digModal .dig-right .dig-artl{ margin-top:5px; }
#digModal .dig-right .dig-got .gi, #digModal .dig-right .dig-got.kr .gi{ height:18px; }
#digModal .dig-right .dig-got{ gap:2px; }
/* ===== 71-я, его слово «ставь в игру»: рамки его листа list-7 — «Получено» (r-polucheno, заголовок в выемке), ячейки находок (r-yacheyka),
золото в длинной ячейке (r-dlinnaya), «Тотемы» — плашка с гнездом (r-totem) и каменной полоской (r-zhelob / r-zhelob-zal) ===== */
#digModal .dig-right .dig-sack{ border:none; border-image:none; padding:13px 12px 11px; background:url(img/raskopki/r-polucheno.webp) center/100% 100% no-repeat; }
#digModal .dig-right .dig-sack .t{ margin:-9px 0 5px; }
#digModal .dig-right .dig-got .gi, #digModal .dig-right .dig-got.kr .gi{ height:20px; padding:0 2px; background:none; border-radius:0; border:0 solid transparent; border-width:3px 5px; border-image:url(img/raskopki/r-yacheyka.webp) 18 22 fill / 3px 5px stretch; }
#digModal .dig-right .dig-got .gi:last-child{ border-width:3px 14px; border-image:url(img/raskopki/r-dlinnaya.webp) 16 62 fill / 3px 14px stretch; }
#digModal .dig-right .dig-artl{ position:relative; height:40px; border:none; border-image:none; padding:6px 10px 6px 42px; background:url(img/raskopki/r-totem.webp) center/100% 100% no-repeat; display:flex; flex-direction:column; justify-content:center; gap:3px; }
#digModal .dig-right .dig-artl .sock{ position:absolute; left:9px; top:50%; transform:translateY(-50%); width:24px; height:24px; display:flex; align-items:center; justify-content:center; font-size:14px; line-height:1; }
#digModal .dig-right .dig-artl .t{ margin:0; }
#digModal .dig-right .dig-artl .zh{ position:relative; height:7px; background:url(img/raskopki/r-zhelob.webp) center/100% 100% no-repeat; }
#digModal .dig-right .dig-artl .zh i{ position:absolute; inset:0; background:url(img/raskopki/r-zhelob-zal.webp) center/100% 100% no-repeat; clip-path:inset(0 calc(100% - var(--p)) 0 0); }
/* 71-я, его слово «всю эту рамку — как «Получено»»: табличка справа — тёмный камень с золотым кантом и заклёпками (r-polucheno 9-срезом) вместо светлой со скарабеем */
#digModal.field .dig-right{ background:none; border:0 solid transparent; border-width:16px; border-image:url(img/raskopki/r-polucheno.webp) 34 fill / 16px stretch; padding:12px 4px 4px; box-sizing:border-box; }
.stage-msg img{ width:18px; height:18px; object-fit:contain; vertical-align:-4px; margin:0 1px; } /* 71-я: значки наград в надписи «Задание выполнено» */
/* ===== 72-я: окно «Игры» — его новая картинка (img/igry.webp): зона нажатия = свиток + ниша под ним, название — В НИШЕ
(ниши по картинке: x 15 % шириной, y 76,2–85,9 %; свитки 7–72 %). «Круг удачи» — золотом, остальные — «Скоро» с замком. ===== */
.ig-scene.img .ig-spot{ width:15.4%; height:79%; border-radius:6px; }
.ig-scene.img .ig-spot .pl-nm{ top:auto; bottom:0.6%; left:50%; transform:translateX(-50%); width:96%; height:11.6%; margin:0; padding:0;
display:flex; align-items:center; justify-content:center; gap:5px; background:none; border:none; box-shadow:none;
font:900 14px 'Cinzel',serif; letter-spacing:.06em; text-transform:none; white-space:nowrap; }
.ig-scene.img .ig-spot.on .pl-nm{ background:none; color:#ffe9a8; text-shadow:0 0 10px rgba(255,200,90,.85), 0 1px 2px #000, 0 0 2px #000; }
.ig-scene.img .ig-spot:not(.on) .pl-nm{ color:#a89c84; font-size:12.5px; text-shadow:0 1px 2px #000; }
.ig-scene.img .ig-spot:not(.on) .pl-nm::before{ content:''; display:inline-block; width:12px; height:12px; margin-right:3px; vertical-align:-1px; background:url(img/ramka/zamok.webp) center/contain no-repeat; } /* 74-я: замок картинкой */
.ig-scene.img .ig-spot.on:hover{ box-shadow:0 0 18px rgba(255,200,90,.45); }
.ig-scene.img .ig-spot:not(.on):active{ transform:translate(-50%,-50%) scale(.98); }
/* ===== 72-я: КРУГ УДАЧИ — ГРАФИКА ЕГО ЛИСТОВ (ui-proba/krug/list-1…3 → img/krug/) — храм судьбы, колесо, анкх, плашки, кнопки ===== */
.kr-modal{ background:#0e0a06 url(img/krug/fon.webp) center/cover no-repeat; }
.kr-modal::before{ background:linear-gradient(180deg,rgba(8,5,2,.35),rgba(8,5,2,.05) 40%,rgba(8,5,2,.35)); }
.kr-top{ border-bottom:none; background:linear-gradient(180deg,rgba(10,7,3,.85),rgba(10,7,3,.15)); }
.kr-svg{ filter:drop-shadow(0 10px 18px rgba(0,0,0,.75)) drop-shadow(0 0 14px rgba(255,200,90,.18)); }
.kr-ptr{ width:30px; height:auto; top:-14px; filter:drop-shadow(0 3px 4px rgba(0,0,0,.85)) drop-shadow(0 0 6px rgba(255,210,110,.5)); }
/* уровень: жёлоб его листа, заливка — ровная золотая полоса внутри жёлоба (3 % по бокам, 24/26 % сверху/снизу), ширина --p через clip-path */
.kr-lvw .bar{ position:relative; height:16px; border:none; border-radius:0; background:url(img/krug/zhelob.webp) center/100% 100% no-repeat; overflow:visible; }
.kr-lvw .bar i{ position:absolute; left:3%; right:3%; top:24%; bottom:26%; width:auto; height:auto; border-radius:3px;
background:url(img/krug/zaliv.webp) center/100% 100% no-repeat; clip-path:inset(0 calc(100% - var(--p, 0%)) 0 0 round 3px); box-shadow:none; }
/* джекпот — золотая картуш со скарабеем; цифра в тёмном поле */
.kr-jp{ border:none; border-radius:0; background:url(img/krug/dzhekpot.webp) center/100% 100% no-repeat; box-shadow:none; width:250px; height:80px; padding:22px 30px 8px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.kr-jp::before, .kr-jp::after{ content:none; }
.kr-jp .t{ font-size:9px; margin-bottom:1px; }
.kr-jp .n{ font-size:21px; line-height:1; }
/* последний победитель — тёмная плита с гнездом под аватар слева */
.kr-win2{ border:none; border-radius:0; background:url(img/krug/pobeditel.webp) center/100% 100% no-repeat; padding:5px 14px 5px 4px; min-height:46px; box-shadow:none; }
.kr-win2 .pf-ava, .kr-win2 .av0{ width:36px !important; height:36px !important; border-radius:50%; flex:0 0 auto; margin-left:2px; }
/* кнопка «Крутить» — изумруд в золоте со скарабеями; жетонная — та же, занята/нельзя — серая */
.kr-spin, .kr-spin.free{ border:0 solid transparent; border-width:0 26px; border-radius:0; background:none; box-shadow:none; padding:4px 4px 5px;
border-image:url(img/krug/kn-krutit.webp) 0 92 fill / 0 26px stretch; color:#f2fff4; text-shadow:0 1px 2px #062010, 0 0 6px #062010; min-width:150px; min-height:50px; }
.kr-spin small{ color:#e8ffe8; opacity:.95; }
.kr-spin:disabled{ border-image-source:url(img/krug/kn-krutit-off.webp); color:#d8d4cc; text-shadow:0 1px 2px #000; }
.kr-spin:active{ transform:translateY(1px); box-shadow:none; }
/* автокрутка — тумблер его листа: выкл серебро, вкл золото */
.kr-sw i{ width:52px; height:20px; border:none; border-radius:0; background:url(img/krug/tumbler-off.webp) center/100% 100% no-repeat; box-shadow:none; }
.kr-sw i::after{ content:none; }
.kr-sw.on i{ background-image:url(img/krug/tumbler-on.webp); border:none; box-shadow:0 0 10px rgba(255,210,110,.5); }
.kr-sw.on{ color:#ffe9a8; }
/* песчинки (саркофаги) — плашка с нишей слева, в нише саркофаг */
.kr-sand{ border:none; border-radius:0; background:url(img/krug/plashka.webp) center/100% 100% no-repeat; padding:4px 16px 4px 7px; min-width:96px; min-height:46px; box-shadow:none; gap:12px; }
.kr-sand .kr-sarc{ width:24px; height:32px; }
/* ===== 72-я, его правка «не ярко, джекпот и победителя больше, всё криво, саркофаг не нарисован»: правая колонка заново ===== */
.kr-modal::before{ background:radial-gradient(ellipse at 70% 45%, rgba(255,200,110,.10), transparent 60%); }
.kr-right{ padding:6px 14px 8px 4px; gap:4px; align-items:center; }
/* джекпот — крупная золотая картуш по центру колонки, цифра большая, мягко светится */
.kr-jp{ transform:none; align-self:center; width:320px; height:96px; padding:26px 40px 10px; }
.kr-jp .t{ font-size:10px; letter-spacing:.24em; color:#ffe9a8; text-shadow:0 1px 2px #000; }
.kr-jp .n{ font-size:28px; display:inline-flex; align-items:center; gap:6px; animation:krJpGlow 2.2s ease-in-out infinite; }
@keyframes krJpGlow{ 50%{ text-shadow:0 0 22px #ffd060, 0 0 8px #ffb030, 0 2px 2px #000; } }
/* последний победитель — во всю ширину колонки, аватар в круглом гнезде плиты (центр гнезда ≈ 14,8 % ширины, Ø ≈ 83 % высоты) */
.kr-wh{ width:320px; align-self:center; margin-top:4px; color:#ffe9a8; text-shadow:0 1px 2px #000; font-size:9px; }
.kr-win2{ position:relative; width:320px; height:70px; align-self:center; padding:0 18px 0 76px; gap:8px; }
.kr-win2 .pf-ava, .kr-win2 .av0{ position:absolute; left:calc(14.8% - 24px); top:50%; transform:translateY(-50%); width:48px !important; height:48px !important; margin:0; border:none; }
.kr-win2 .who{ font-size:13.5px; color:#fff3d0; text-shadow:0 1px 2px #000; }
.kr-win2 .sum{ font-size:16px; display:inline-flex; align-items:center; gap:4px; }
/* низ: саркофаг песчинок · (бесплатная) · автокрутка над «Крутить» */
.kr-bot{ width:100%; align-items:center; gap:8px; }
.kr-sand{ margin-left:0; height:54px; min-width:118px; padding:4px 14px 4px 6px; gap:8px; align-items:center; }
.kr-sand .kr-sarc-im{ height:46px; width:auto; filter:drop-shadow(0 2px 4px rgba(0,0,0,.7)); margin-top:-6px; }
.kr-sand span{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.05; }
.kr-sand small{ font:800 8px 'Cinzel',serif; letter-spacing:.08em; color:#e6c976; text-transform:uppercase; }
.kr-sand b{ font:900 16px 'JetBrains Mono',monospace; color:#ffe07a; }
.kr-sw{ color:#f0e0b0; text-shadow:0 1px 2px #000, 0 0 4px #000; font-weight:800; }
.kr-free{ background:rgba(0,0,0,.6); border-color:#8a6a2a; color:#e6c976; }
.kr-spin, .kr-spin.free{ min-width:170px; min-height:54px; font-size:16px; }
.kr-spin small{ font-size:10px; }
/* ===== 72-я: окна Круга («Жетоны», «Сундуки удачи», лестница) — те же рамки, что в раскопках: тёмный камень с золотом, изумрудные кнопки ===== */
.kr-over{ background:rgba(6,4,2,.72); }
.kr-over .card{ border:0 solid transparent; border-width:16px; border-image:url(img/raskopki/nagrada.webp) 50 fill / 16px stretch; border-radius:0; background:none;
box-shadow:0 0 30px rgba(255,200,90,.25), 0 20px 50px rgba(0,0,0,.8); padding:4px 10px 6px; }
.kr-over .t{ font-size:16px; }
.kr-x{ top:-6px; right:-6px; background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; color:#fff; }
/* жетоны: варианты покупки — каменные ячейки */
.kr-bb{ width:100px; height:58px; border:0 solid transparent; border-width:5px 8px; border-image:url(img/raskopki/r-yacheyka.webp) 18 22 fill / 5px 8px stretch; border-radius:0; background:none; justify-content:center; }
.kr-bb b{ font-size:20px; color:#ffe07a; text-shadow:0 0 8px rgba(255,210,90,.5); } .kr-bb small{ color:#e6c976; display:inline-flex; align-items:center; gap:3px; }
.kr-bb:hover:not(:disabled){ filter:brightness(1.25); }
/* кнопки «Получить / Крутить / Закрыть» и «Открыть» — изумруд «Заданий» */
.kr-take, .kr-open{ border:0 solid transparent; border-width:0 22px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 22px stretch; border-radius:0; background:none; box-shadow:none;
color:#f2fff4; text-shadow:0 1px 2px #062010, 0 0 4px #062010; font:900 12px 'Cinzel',serif; min-height:34px; padding:2px 8px; cursor:pointer; }
.kr-take:disabled, .kr-open:disabled{ border-image-source:url(img/zadaniya/kn-off.webp); color:#d8c6a2; text-shadow:0 1px 2px #000; opacity:1; filter:none; }
/* сундуки удачи: вкладки — каменные плашки, ящик — рамка «Получено», сет — каменные ячейки, тотемы — жёлоб с золотой заливкой */
.kr-tab{ border:0 solid transparent; border-width:5px 10px; border-image:url(img/raskopki/plashka.webp) 0 34 fill / 5px 10px stretch; border-radius:0; background:none; min-height:40px; }
.kr-tab.on{ border-image-source:url(img/raskopki/kn-kopat.webp); border-image-slice:0 20 0 106; border-width:5px 8px 5px 26px; color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.5); background:none; }
.kr-tab.on .cn small{ color:#5a3a0a; }
.kr-box{ border:none; border-radius:0; background:url(img/raskopki/r-polucheno.webp) center/100% 100% no-repeat; padding:16px 18px 14px; }
.kr-tile{ border:0 solid transparent; border-width:4px 6px; border-image:url(img/raskopki/r-yacheyka.webp) 18 22 fill / 4px 6px stretch; border-radius:0; background:none; height:48px; }
.kr-tile .kr-ti{ width:20px; height:20px; object-fit:contain; }
.kr-box .bar{ position:relative; height:12px; border:none; border-radius:0; background:url(img/krug/zhelob.webp) center/100% 100% no-repeat; overflow:visible; }
.kr-box .bar i{ position:absolute; left:3%; right:3%; top:24%; bottom:26%; width:auto; height:auto; background:url(img/krug/zaliv.webp) center/100% 100% no-repeat; clip-path:inset(0 calc(100% - var(--p, 0%)) 0 0 round 2px); }
.kr-box .have{ border:0 solid transparent; border-width:4px 10px; border-image:url(img/raskopki/plashka.webp) 0 34 fill / 4px 10px stretch; border-radius:0; background:none; }
.kr-tab.on{ border-image:url(img/raskopki/plashka.webp) 0 34 fill / 5px 10px stretch; border-width:5px 10px; color:#ffe9a8; text-shadow:0 0 8px rgba(255,210,90,.7), 0 1px 2px #000; filter:drop-shadow(0 0 6px rgba(255,200,90,.75)); } /* выбранный сундук — золотое свечение */ .kr-tab.on .cn small{ color:#ffe07a; } .kr-tab:not(.on){ opacity:.8; }
/* 72-я: песчинки картинкой (его лист значков Круга) в подписях и кнопках */
.kr-pi{ width:15px; height:15px; object-fit:contain; vertical-align:-3px; }
.kr-res .kr-pi{ width:22px; height:22px; vertical-align:-5px; }
/* лестница: саркофаги его листа — крышка = закрытый саркофаг цвета ступени, внутри — открытый золотой; кодовая отрисовка снята */
.kr-sar .sar{ border:none; border-radius:0; background:url(img/krug/sar-vnutri.webp) center/contain no-repeat; box-shadow:none; }
.kr-sar .sar::before{ content:none; }
.kr-sar .slid{ border:none; border-radius:0; background:url(img/krug/sar-1.webp) center/contain no-repeat; box-shadow:none; filter:drop-shadow(0 6px 10px rgba(0,0,0,.7)); }
.kr-sar .slid::before, .kr-sar .slid::after{ content:none; }
.kr-sar[data-ch="silver"] .slid{ background-image:url(img/krug/sar-2.webp); }
.kr-sar[data-ch="gold"] .slid{ background-image:url(img/krug/sar-3.webp); }
.kr-sar[data-ch="diamond"] .slid{ background-image:url(img/krug/sar-4.webp); filter:drop-shadow(0 0 10px rgba(140,220,255,.7)) drop-shadow(0 6px 10px rgba(0,0,0,.7)); }
.kr-sar.good .sar{ box-shadow:none; filter:drop-shadow(0 0 16px rgba(155,224,122,.9)); }
.kr-sar.can:hover .sar{ box-shadow:none; } .kr-sar.can:hover .slid{ filter:drop-shadow(0 0 12px rgba(255,224,122,.9)); }
.kr-sar .cont.jackpot{ font-size:0; width:56px; height:56px; background:url(img/krug/dzhekpot-ik.webp) center/contain no-repeat; }
.kr-sar .cont.prize{ display:flex; flex-direction:column; align-items:center; gap:1px; white-space:normal; width:44px; text-align:center; font-size:12px; line-height:1.05; word-break:keep-all; } /* 72-я: в узкой нише саркофага — значок над числом */ .kr-sar .cont.prize .kr-pi{ width:20px; height:20px; }
.kr-pn{ white-space:nowrap; font-weight:900; } .kr-sar .cont.prize{ width:56px; }
/* ===== 72-я, его слово «джекпот круче, лестница ультра — чтобы закрывалось офигенно» ===== */
/* корона джекпота на колесе — живой золотой пульс */
.kr-jpic{ animation:krJpic 1.6s ease-in-out infinite; }
@keyframes krJpic{ 0%,100%{ filter:drop-shadow(0 0 3px #ffd060); } 50%{ filter:drop-shadow(0 0 9px #ffe08a) drop-shadow(0 0 16px #ffb030) brightness(1.25); } }
/* вспышка джекпота на всё окно: белое-золотое сияние, вращающиеся лучи, корона вылетает, «ДЖЕКПОТ!», монеты */
.kr-burst{ position:absolute; inset:0; z-index:20; pointer-events:none; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.kr-burst .fl{ position:absolute; inset:0; background:radial-gradient(circle at 50% 50%, rgba(255,250,220,.95), rgba(255,200,80,.55) 30%, rgba(80,40,0,0) 70%); animation:krBurstFl 1.9s ease-out forwards; }
@keyframes krBurstFl{ 0%{ opacity:0; } 10%{ opacity:1; } 60%{ opacity:.7; } 100%{ opacity:0; } }
.kr-burst .rays{ position:absolute; width:900px; height:900px; left:50%; top:50%; margin:-450px 0 0 -450px;
background:repeating-conic-gradient(from 0deg, rgba(255,224,122,0) 0 8deg, rgba(255,224,122,.55) 8deg 13deg); animation:krBurstRays 1.9s linear forwards; mask:radial-gradient(circle, #000 20%, transparent 62%); -webkit-mask:radial-gradient(circle, #000 20%, transparent 62%); }
@keyframes krBurstRays{ 0%{ transform:rotate(0) scale(.3); opacity:0; } 15%{ opacity:1; } 100%{ transform:rotate(90deg) scale(1.1); opacity:0; } }
.kr-burst .cr{ position:relative; width:150px; filter:drop-shadow(0 0 20px #ffd060) drop-shadow(0 8px 14px rgba(0,0,0,.6)); animation:krBurstCr 1.9s cubic-bezier(.2,1.4,.4,1) forwards; }
@keyframes krBurstCr{ 0%{ transform:scale(.1) rotate(-25deg); opacity:0; } 25%{ transform:scale(1.25) rotate(6deg); opacity:1; } 45%{ transform:scale(1) rotate(0); } 85%{ opacity:1; } 100%{ transform:scale(1.4); opacity:0; } }
.kr-burst .tx{ position:absolute; left:0; right:0; top:62%; text-align:center; font:900 34px 'Cinzel',serif; letter-spacing:.1em; color:#fff3c0;
text-shadow:0 0 18px #ffb030, 0 0 6px #ffd060, 0 3px 0 #7a4a08, 0 5px 10px #000; animation:krBurstTx 1.9s ease-out forwards; }
@keyframes krBurstTx{ 0%,15%{ transform:scale(.4); opacity:0; } 35%{ transform:scale(1.15); opacity:1; } 50%{ transform:scale(1); } 85%{ opacity:1; } 100%{ opacity:0; } }
.kr-coins{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:5; }
.kr-coins i{ position:absolute; top:-30px; border-radius:50%; background:url(img/krug/zheton.webp) center/contain no-repeat; animation:krCoin 1.5s ease-in forwards; filter:drop-shadow(0 0 4px rgba(255,210,90,.8)); }
@keyframes krCoin{ 0%{ transform:translateY(0) rotate(0); opacity:0; } 10%{ opacity:1; } 100%{ transform:translateY(420px) rotate(540deg); opacity:.9; } }
/* лестница: крышка ПАДАЕТ сверху с отскоком, внизу песок, саркофаг вздрагивает */
.kr-over .card.close .kr-sar .slid{ animation:krLidDrop .62s cubic-bezier(.5,0,.75,0) both, krLidBounce .3s .62s ease-out; }
@keyframes krLidDrop{ 0%{ transform:translateY(-160%) scale(1.08); opacity:0; } 60%{ opacity:1; } 100%{ transform:translateY(0) scale(1); opacity:1; } }
@keyframes krLidBounce{ 0%{ transform:translateY(0) scaleY(1); } 35%{ transform:translateY(3px) scaleY(.94); } 70%{ transform:translateY(-4px) scaleY(1.02); } 100%{ transform:none; } }
.kr-sar .dust{ position:absolute; left:50%; bottom:-14px; width:120px; height:60px; margin-left:-60px; background:url(img/raskopki/pesok-vzryv.webp) center bottom/contain no-repeat; opacity:0; pointer-events:none; z-index:4; }
.kr-over .card.close .kr-sar .dust{ animation:krDust .8s .55s ease-out forwards; }
@keyframes krDust{ 0%{ opacity:0; transform:scale(.4) translateY(10px); } 30%{ opacity:.95; } 100%{ opacity:0; transform:scale(1.25) translateY(-6px); } }
.kr-over .card.close .kr-slots{ animation:krThud .35s .6s ease-out; }
@keyframes krThud{ 0%,100%{ transform:none; } 30%{ transform:translateY(3px); } 60%{ transform:translateY(-2px); } }
/* перемешивание — каждый сдвиг прыжком дугой */
.kr-sar.hop{ animation:krHop .12s ease-in-out; }
@keyframes krHop{ 50%{ transform:translateY(-16px) scale(1.06) rotate(-3deg); } }
.kr-over .card.shuffle .kr-sar{ filter:drop-shadow(0 0 8px rgba(255,224,122,.35)); }
/* выбор: наведение — золотой ореол; открытие — крышка отлетает в сторону с поворотом, изнутри бьют лучи */
.kr-sar.can:hover{ transform:translateY(-6px); }
.kr-sar.reveal .slid{ animation:krLidOff .75s cubic-bezier(.3,1.2,.5,1) forwards; }
@keyframes krLidOff{ 0%{ transform:translateY(0) rotate(0); opacity:1; } 30%{ transform:translateY(-12px) rotate(-6deg); } 100%{ transform:translate(-70%, -30%) rotate(-38deg); opacity:0; } }
.kr-sar .rays{ position:absolute; left:50%; top:50%; width:200px; height:200px; margin:-100px 0 0 -100px; opacity:0; pointer-events:none; z-index:0;
background:repeating-conic-gradient(from 0deg, rgba(255,224,122,0) 0 10deg, rgba(255,224,122,.55) 10deg 16deg); -webkit-mask:radial-gradient(circle, #000 15%, transparent 60%); mask:radial-gradient(circle, #000 15%, transparent 60%); }
.kr-sar.reveal .rays{ animation:krRaysIn 1.4s ease-out forwards; }
@keyframes krRaysIn{ 0%{ opacity:0; transform:rotate(0) scale(.3); } 25%{ opacity:1; } 100%{ opacity:.35; transform:rotate(60deg) scale(1); } }
.kr-sar.good .rays{ opacity:.6; background:repeating-conic-gradient(from 0deg, rgba(155,224,122,0) 0 10deg, rgba(155,224,122,.6) 10deg 16deg); animation:krRaysSpin 6s linear infinite; }
.kr-sar.jp .rays{ opacity:.9; background:repeating-conic-gradient(from 0deg, rgba(255,214,90,0) 0 8deg, rgba(255,214,90,.8) 8deg 14deg); animation:krRaysSpin 3s linear infinite; }
@keyframes krRaysSpin{ to{ transform:rotate(360deg); } }
.kr-sar .sar{ overflow:visible; }
.kr-sar .cont{ z-index:2; }
.kr-sar.reveal .cont{ animation:krContPop .6s .25s cubic-bezier(.2,1.6,.4,1) both; }
@keyframes krContPop{ 0%{ transform:translate(-50%,-50%) scale(0); opacity:0; } 100%{ transform:translate(-50%,-50%) scale(1); opacity:1; } }
.kr-sar.jp .cont.jackpot{ width:70px; height:70px; animation:krContPop .6s .25s cubic-bezier(.2,1.6,.4,1) both, krJpic 1.2s 1s ease-in-out infinite; }
.kr-jpwin-cr{ width:24px; height:24px; vertical-align:-6px; }
.kr-sar:not(.closed) .slid{ opacity:0; transform:none; } /* открытый: крышки нет (у .reveal её уносит анимация) */
/* 72-я, его правка лестницы: закрытый саркофаг — внутренность не просвечивает по краям; открытый — тёмная ниша, награда крупно и читается */
.kr-sar.closed .sar{ background-image:none; }
.kr-sar .cont::before{ content:''; position:absolute; left:50%; top:50%; width:62px; height:62px; margin:-31px 0 0 -31px; border-radius:50%; z-index:-1;
background:radial-gradient(circle, rgba(10,6,2,.85) 40%, rgba(10,6,2,0) 72%); }
.kr-sar .cont.prize{ font-size:14px; color:#fff3c0; text-shadow:0 1px 2px #000, 0 0 6px #000; }
.kr-sar .cont.prize .kr-pi{ width:28px; height:28px; }
/* правая часть чуть меньше, «или» — золотой медальон */
.kr-over .card.wide{ width:620px; }
.kr-choice .or{ width:46px; height:46px; flex:0 0 46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
background:radial-gradient(circle at 40% 35%, #ffe8a8, #c89a3a 60%, #7a5520); border:2px solid #3a2608; box-shadow:0 0 14px rgba(255,210,90,.6), inset 0 -3px 6px rgba(0,0,0,.35);
font:900 13px 'Cinzel',serif; color:#3a2208; text-transform:uppercase; letter-spacing:.04em; text-shadow:0 1px 0 rgba(255,240,200,.6); }
.kr-risk{ flex:0 1 380px; border:none; border-radius:0; background:url(img/raskopki/r-polucheno.webp) center/100% 100% no-repeat; padding:12px 10px 8px; }
.kr-sure{ border:none; border-radius:0; background:url(img/raskopki/r-polucheno.webp) center/100% 100% no-repeat; padding:14px 10px; filter:hue-rotate(80deg) saturate(.8); }
.kr-sure > *{ filter:hue-rotate(-80deg) saturate(1.25); }
/* ===== 72-я: ОКНО ЛЕСТНИЦЫ ЕГО ЛИСТОМ (list-5 → img/krug/l-*.webp): рамка-сокровищница, изумрудная плита «верное», медальон «или»,
ниша с тремя арками — саркофаг ровно в арке (центры арок 22,75 / 50 / 77,5 % ширины ниши, шаг 115 px при нише 420), ключ-проходка ===== */
.kr-over .card.wide{ width:700px; max-width:98%; border-width:46px 30px 28px; border-image:url(img/krug/l-okno.webp) 97 97 69 95 fill / 46px 30px 28px stretch; padding:0 6px 2px; gap:3px; }
.kr-over .card.wide > .t{ margin-top:-30px; font-size:17px; text-shadow:0 0 14px rgba(255,208,96,.8), 0 2px 2px #000; }
.kr-choice{ align-items:center; gap:10px; }
.kr-sure{ flex:0 0 132px; height:194px; filter:none; border:none; background:url(img/krug/l-plita.webp) center/100% 100% no-repeat; padding:58px 8px 10px; justify-content:flex-start; gap:2px; box-shadow:none; }
.kr-sure > *{ filter:none; }
.kr-sure .t{ font-size:10px; } .kr-sure .n{ font-size:19px; display:inline-flex; align-items:center; gap:4px; }
.kr-sure.off{ opacity:.6; }
.kr-choice .or{ width:48px; height:48px; flex:0 0 48px; border:none; box-shadow:none; background:url(img/krug/l-ili.webp) center/contain no-repeat; filter:drop-shadow(0 0 8px rgba(255,210,90,.6)); }
.kr-risk{ flex:0 0 420px; height:194px; position:relative; padding:0; background:url(img/krug/l-nisha.webp) center/100% 100% no-repeat; display:block; }
.kr-risk .kr-slots{ position:absolute; left:38px; top:37px; width:345px; height:132px; }
.kr-sar{ width:115px; height:132px; }
.kr-sar .sar{ left:6px; right:6px; top:0; bottom:0; background-image:url(img/krug/l-sar-tma.webp); }
.kr-sar.closed .sar{ background-image:none; }
.kr-sar .dust{ width:110px; margin-left:-55px; }
.kr-risk .kr-play{ position:absolute; right:10px; bottom:-14px; z-index:6; margin:0; }
.kr-risk > .d{ position:absolute; left:0; right:0; bottom:-16px; text-align:center; color:#ffe9a8; text-shadow:0 1px 2px #000; }
.kr-sar .cont.pass img{ width:34px; height:auto; filter:drop-shadow(0 0 8px rgba(120,255,160,.8)); }
.kr-over .card.wide > .t{ margin-top:-6px; } /* заголовок под крылатым солнцем, не на нём */
.kr-sar .cont.jackpot::before, .kr-sar .cont.pass::before{ content:none; } /* тёмный круг — только под наградами, корону и ключ не темнить */ .kr-over .card.wide.prize > .st, .kr-over .card.wide.jackpot > .st{ display:none; } /* в конце строка «ступень…» не нужна — итог ниже, окно влезает в 330 */
/* ===== 72-я, его правки Круга ===== */
/* лестница: всё чуть ниже, заголовок «ДЖЕКПОТ» крупнее; «Закрыть»/«Получить» в конце — справа внизу; «Твоя награда» — под нишей по центру */
.kr-over .card.wide{ padding-top:8px; }
.kr-over .card.wide > .t{ margin-top:-2px; font-size:24px; letter-spacing:.1em; }
.kr-over .card.wide > .act{ position:absolute; right:4px; bottom:-8px; z-index:7; min-height:0; }
.kr-risk > .d{ bottom:-20px; font-size:11px; }
/* главное окно: слово «ДЖЕКПОТ» — табличкой на верхней кромке плиты, внутри только число, крупно */
.kr-jp{ position:relative; padding:20px 40px 6px; }
.kr-jp .t{ position:absolute; left:50%; top:13px; transform:translateX(-50%); z-index:2; margin:0; padding:1px 14px 2px; border:0 solid transparent; border-width:0 10px;
border-image:url(img/raskopki/plashka.webp) 0 34 fill / 0 10px stretch; font-size:9.5px; letter-spacing:.22em; color:#ffe9a8; white-space:nowrap; }
.kr-jp .n{ font-size:32px; margin-top:12px; }
/* последний победитель — уже и вправо; песчинки — ниже и левее */
.kr-wh, .kr-win2{ width:270px; align-self:flex-end; }
.kr-win2{ padding-left:64px; } .kr-win2 .pf-ava, .kr-win2 .av0{ left:calc(14.8% - 20px); width:42px !important; height:42px !important; }
.kr-sand{ margin-left:-46px; transform:translateY(8px); }
.kr-risk > .d{ bottom:3px; z-index:5; font-size:11.5px; font-weight:800; } /* «Твоя награда» — на нижней кромке ниши, не на рамке окна */
/* 72-я: автокрутка вкл — тумблер ломался (старое правило .kr-sw.on i{background:…} сбрасывало размер картинки) */
.kr-sw.on i{ background:url(img/krug/tumbler-on.webp) center/100% 100% no-repeat; border:none; }
/* джекпот: число с костью — ровно по центру тёмного поля при любой длине (6 856 / 10 324 / 104 543) */
.kr-jp{ padding-left:0; padding-right:0; }
.kr-jp .n{ width:100%; display:flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; }
.kr-jp .n .kr-bk{ width:28px; height:28px; object-fit:contain; flex:0 0 auto; filter:drop-shadow(0 0 6px rgba(255,210,90,.6)); } .kr-jp .n{ gap:10px; }
/* ===== 72-я: ЛЕСТНИЦА — ВЕСЫ МААТ (его лист list-6 → img/krug/vesy.webp 1400×682, окно 677×330). Всё по замерам картинки:
табличка 28,6–61,1 % × 4–16,6 %; левая чаша (тёмное поле) 5,9–22,6 % × 57–89,9 %; арки — центры 65,2 / 77,5 / 89,7 %, 57,9–88,4 % по высоте;
ось весов x 44,8 % — «или», ниже на стойке — «Крутить» / итог. ===== */
.kr-over .card.wide.vesy{ width:677px; height:330px; max-width:none; padding:0; border:none; border-image:none; background:url(img/krug/vesy.webp) center/100% 100% no-repeat; box-shadow:0 0 30px rgba(255,200,90,.25), 0 20px 50px rgba(0,0,0,.8); display:block; }
.vesy > .t{ position:absolute; left:194px; top:13px; width:220px; height:42px; margin:0 !important; display:flex; align-items:center; justify-content:center; gap:8px; font-size:24px; }
.vesy .kr-choice{ display:block; }
.vesy .kr-sure{ position:absolute; left:40px; top:188px; width:113px; height:109px; padding:6px 4px; background:none; justify-content:center; gap:3px; }
.vesy .kr-sure .t{ font-size:9.5px; letter-spacing:.06em; line-height:1.1; }
.vesy .kr-sure .n{ font-size:17px; }
.vesy .kr-sure .kr-take{ min-height:28px; font-size:11px; padding:0 4px; border-width:0 16px; border-image-width:0 16px; }
.vesy .kr-choice .or{ position:absolute; left:283px; top:66px; width:40px; height:40px; font-size:11px; }
.vesy .kr-risk{ position:absolute; left:400px; top:191px; width:249px; height:101px; background:none; padding:0; flex:none; }
.vesy .kr-risk .kr-slots{ left:0; top:0; width:249px; height:101px; }
.vesy .kr-sar{ width:83px; height:101px; }
.vesy .kr-sar .sar{ left:14px; right:14px; }
.vesy .kr-sar .rays{ width:150px; height:150px; margin:-75px 0 0 -75px; }
.vesy .kr-sar .cont.prize{ font-size:12px; } .vesy .kr-sar .cont.prize .kr-pi{ width:24px; height:24px; }
.vesy .kr-sar .cont.pass img{ width:28px; } .vesy .kr-sar.jp .cont.jackpot{ width:56px; height:56px; }
.vesy .kr-risk .kr-play{ left:-97px; right:auto; top:42px; bottom:auto; transform:translateX(-50%); }
.vesy .kr-risk > .d{ left:-97px; right:auto; width:200px; top:-62px; bottom:auto; transform:translateX(-50%); }
.kr-over .card.wide.vesy > .act{ left:303px; right:auto; top:226px; bottom:auto; transform:translateX(-50%); flex-direction:column; gap:6px; }
.vesy .kr-jpwin{ font-size:15px; padding:2px 10px; }
.vesy > .t{ white-space:nowrap; } .kr-over .card.wide.vesy.jackpot > .t{ font-size:17px; letter-spacing:.04em; } /* «ВЕСЬ БАНК ТВОЙ!» в одну строку в табличке */
/* 72-я, его «кости в джекпоте низко»: число с костью — ровно по середине тёмного поля плиты (замер картинки: поле 31–78 % высоты, центр 54,4 %) */ .kr-jp .n{ position:absolute; left:0; right:0; top:54.4%; transform:translateY(-50%); margin:0; line-height:1; height:34px; }
/* ===== 72-я: ЛЕСТНИЦА — ВЕСЫ, ОБА ВАРИАНТА НА ЧАШАХ (его лист list-9, обрезан слева на 10 % — всё левее; img/krug/vesy.webp 1400×697, окно 663×330).
Замеры: левая чаша (поле) 92–352 × 236–578; ниши-гробы — центры 793 / 976 / 1162, по высоте 282–549; правый верх свободен — там табличка ДЖЕКПОТ. ===== */
.kr-over .card.wide.vesy{ width:663px; }
.vesy > .t{ left:500px; top:6px; width:160px; height:62px; flex-direction:column; gap:0; background:url(img/krug/dzhekpot.webp) center/100% 100% no-repeat; font-size:13px; letter-spacing:.14em; padding-top:6px; }
.vesy > .t span{ font:900 11px 'Cinzel',serif; color:#ffe9a8; letter-spacing:.16em; text-shadow:0 1px 2px #000; }
.vesy > .t b{ display:flex; align-items:center; gap:5px; font:900 17px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 0 10px #ffd060, 0 1px 2px #000; }
.vesy > .t b .kr-bk{ width:18px; height:18px; }
.kr-over .card.wide.vesy.jackpot > .t{ font-size:13px; } .vesy.jackpot > .t span{ font-size:9.5px; letter-spacing:.04em; }
.vesy .kr-sure{ left:44px; top:112px; width:123px; height:162px; padding:8px 6px; gap:6px; }
.vesy .kr-sure .t{ font-size:11px; } .vesy .kr-sure .n{ font-size:20px; } .vesy .kr-sure .kr-take{ min-height:32px; font-size:12px; }
.vesy .kr-choice .or{ left:232px; top:170px; width:42px; height:42px; }
.vesy .kr-risk{ left:332px; top:136px; width:261px; height:122px; }
.vesy .kr-risk .kr-slots{ width:261px; height:122px; }
.vesy .kr-sar{ width:87px; height:122px; } .vesy .kr-sar .sar{ left:12px; right:12px; }
.vesy .kr-risk .kr-play{ left:139px; top:162px; transform:translateX(-50%); }
.vesy .kr-risk > .d{ left:-227px; top:174px; width:200px; transform:none; text-align:center; }
.kr-over .card.wide.vesy > .act{ left:471px; top:298px; transform:translateX(-50%); flex-direction:row; gap:8px; }
.vesy .kr-jpwin{ display:none; } /* итог джекпота уже в табличке справа вверху */ .kr-over .card.wide.vesy > .act{ top:293px; } .vesy > .act .kr-take, .vesy .kr-risk .kr-play{ min-height:32px; }
/* 72-я: табличка ДЖЕКПОТ — до самого края коромысла (крюк ≈ 487 px) и выше; «Крутить»/«Получить» — правее, к правому краю чаши */
.vesy > .t{ left:490px; top:3px; width:170px; height:84px; padding-top:12px; }
.vesy > .t span{ font-size:12.5px; } .vesy > .t b{ font-size:21px; gap:6px; } .vesy > .t b .kr-bk{ width:22px; height:22px; }
.vesy.jackpot > .t span{ font-size:10.5px; }
.vesy .kr-risk .kr-play{ left:auto; right:0; transform:none; }
.kr-over .card.wide.vesy > .act{ left:auto; right:38px; transform:none; }
/* 72-я: весы качаются, когда открылась ступень (выпал джекпот): от оси коромысла, затухая, ~2 с */
.kr-over .card.wide.vesy.swing{ transform-origin:44% 2%; animation:krSwing 2.1s cubic-bezier(.3,.1,.3,1) both; }
@keyframes krSwing{ 0%{ transform:rotate(0); } 12%{ transform:rotate(-3.2deg); } 30%{ transform:rotate(2.4deg); } 48%{ transform:rotate(-1.5deg); } 66%{ transform:rotate(.9deg); } 82%{ transform:rotate(-.4deg); } 100%{ transform:rotate(0); } }
/* ===== 72-я: ВЕСЫ ПО ЧАСТЯМ (его лист list-10 → img/krug/vs-*.webp). Окно 663×330, всё по замерам кусков:
коромысло 404 px (крюки 4,4 % / 94,9 %, ось 51,1 % × 42 %), левая чаша 159×259 (кольцо 52,4 %, поле 14–86 % × 31–89 %),
правая 296×258 (кольцо 49,6 %, ниши-гробы — центры 22,6 / 49,2 / 75,7 %, 40–82 % по высоте). Качание: коромысло ±3°, чаши ±10 px вверх-вниз навстречу. ===== */
.kr-over .card.wide.vesy{ background:#0b0806 url(img/krug/vs-stena.webp) center/cover no-repeat; overflow:hidden; }
.vesy .vs-beam{ position:absolute; left:87px; top:-10px; width:404px; height:auto; transform-origin:51.1% 42%; pointer-events:none; filter:drop-shadow(0 3px 4px rgba(0,0,0,.6)); }
.vesy .vs-pan{ position:absolute; top:37px; height:auto; pointer-events:none; filter:drop-shadow(0 6px 10px rgba(0,0,0,.7)); }
.vesy .vs-pan.l{ left:22px; width:159px; } .vesy .vs-pan.r{ left:325px; width:296px; }
.vesy > .t{ left:490px; top:4px; width:172px; height:64px; background-image:url(img/krug/vs-tablichka.webp); padding-top:4px; }
.vesy .kr-sure{ left:44px; top:117px; width:114px; height:151px; }
.vesy .kr-risk{ left:352px; top:140px; width:237px; height:109px; }
.vesy .kr-risk .kr-slots{ width:237px; height:109px; }
.vesy .kr-sar{ width:79px; height:109px; } .vesy .kr-sar .sar{ left:12px; right:12px; }
.vesy .kr-risk .kr-play{ right:-24px; top:146px; }
.vesy .kr-risk > .d{ left:-310px; top:158px; }
.kr-over .card.wide.vesy.swing{ animation:none; }
.vesy.swing .vs-beam{ animation:vsBeam 2.1s cubic-bezier(.3,.1,.3,1) both; }
.vesy.swing .vs-pan.l, .vesy.swing .kr-sure{ animation:vsPanL 2.1s cubic-bezier(.3,.1,.3,1) both; }
.vesy.swing .vs-pan.r, .vesy.swing .kr-risk{ animation:vsPanR 2.1s cubic-bezier(.3,.1,.3,1) both; }
@keyframes vsBeam{ 0%{ transform:rotate(0); } 12%{ transform:rotate(-3.2deg); } 30%{ transform:rotate(2.4deg); } 48%{ transform:rotate(-1.5deg); } 66%{ transform:rotate(.9deg); } 82%{ transform:rotate(-.4deg); } 100%{ transform:rotate(0); } }
@keyframes vsPanL{ 0%{ transform:translateY(0); } 12%{ transform:translateY(10px); } 30%{ transform:translateY(-7.7px); } 48%{ transform:translateY(4.8px); } 66%{ transform:translateY(-2.9px); } 82%{ transform:translateY(1.3px); } 100%{ transform:translateY(0); } }
@keyframes vsPanR{ 0%{ transform:translateY(0); } 12%{ transform:translateY(-10px); } 30%{ transform:translateY(7.7px); } 48%{ transform:translateY(-4.8px); } 66%{ transform:translateY(2.9px); } 82%{ transform:translateY(-1.3px); } 100%{ transform:translateY(0); } }
/* ===== 72-я: СУНДУКИ УДАЧИ — обычный сундук его листа (img/krug/sunduk, sunduk-otkr, pyl), цвет по вкладке кодом;
трясётся → открыт со светом → тотем летит к полоске («Тотем!») или пыль («Пусто») ===== */
.kr-box .big.sd{ background:radial-gradient(ellipse at 50% 70%, rgba(255,200,90,.28), rgba(0,0,0,0) 65%), rgba(0,0,0,.25); border-color:#8a6a2a; overflow:visible; }
.kr-box .big.sd .sd-ch{ position:relative; width:128px; height:auto; filter:drop-shadow(0 8px 10px rgba(0,0,0,.7)); }
.kr-box .big.sd[data-box="1"] .sd-ch{ filter:hue-rotate(115deg) saturate(1.3) drop-shadow(0 8px 10px rgba(0,0,0,.7)); }
.kr-box .big.sd[data-box="2"] .sd-ch{ filter:hue-rotate(-35deg) saturate(1.6) brightness(.9) drop-shadow(0 8px 10px rgba(0,0,0,.7)); }
.kr-box .big.sd .sd-art{ position:absolute; left:50%; top:8px; transform:translateX(-50%); z-index:2; filter:drop-shadow(0 2px 4px #000); }
.kr-box .big.sd .rays{ opacity:.35; }
.kr-box .big.sd.shake .sd-ch{ animation:sdShake .65s linear; }
@keyframes sdShake{ 0%,100%{ transform:none; } 10%{ transform:translate(-3px,0) rotate(-3deg); } 25%{ transform:translate(3px,-2px) rotate(3deg); } 40%{ transform:translate(-4px,0) rotate(-4deg); } 55%{ transform:translate(4px,-3px) rotate(4deg); } 70%{ transform:translate(-3px,0) rotate(-3deg); } 85%{ transform:translate(2px,-1px) rotate(2deg); } }
.kr-box .big.sd.open .sd-ch{ width:140px; animation:sdPop .35s cubic-bezier(.2,1.5,.4,1); }
@keyframes sdPop{ 0%{ transform:scale(.85); } 100%{ transform:none; } }
.kr-box .big.sd.open.yes .rays{ opacity:1; animation:krRays 4s linear infinite; }
.kr-box .big.sd .sd-fly{ position:absolute; left:50%; top:46%; z-index:4; transform:translate(-50%,-50%); animation:sdFly 1.3s cubic-bezier(.2,.8,.3,1) forwards; filter:drop-shadow(0 0 12px #ffd060); }
@keyframes sdFly{ 0%{ transform:translate(-50%,-30%) scale(.2); opacity:0; } 25%{ transform:translate(-50%,-120%) scale(1.3); opacity:1; } 60%{ transform:translate(-50%,-120%) scale(1.1); } 100%{ transform:translate(180px,40px) scale(.4); opacity:0; } }
.kr-box .big.sd .sd-pyl{ position:absolute; left:50%; top:52%; width:150px; transform:translate(-50%,-50%); z-index:3; animation:sdPyl 1.1s ease-out forwards; }
@keyframes sdPyl{ 0%{ transform:translate(-50%,-30%) scale(.4); opacity:0; } 25%{ opacity:1; } 100%{ transform:translate(-50%,-75%) scale(1.15); opacity:0; } }
.kr-box .big.sd .sd-msg{ position:absolute; left:0; right:0; bottom:26px; z-index:5; text-align:center; font:900 20px 'Cinzel',serif; animation:sdMsg 1.3s ease-out both; }
.kr-box .big.sd .sd-msg.yes{ color:#9be07a; text-shadow:0 0 14px rgba(155,224,122,.9), 0 2px 2px #000; }
.kr-box .big.sd .sd-msg.no{ color:#c8bca4; text-shadow:0 2px 2px #000; }
@keyframes sdMsg{ 0%{ transform:scale(.5); opacity:0; } 25%{ transform:scale(1.15); opacity:1; } 45%{ transform:scale(1); } 100%{ opacity:1; } }
.kr-box .tot.plus .bar{ animation:sdBar 1s ease-out; } @keyframes sdBar{ 0%,100%{ filter:none; } 30%{ filter:brightness(1.8) drop-shadow(0 0 8px #ffd060); } }
.kr-sand .kr-sarc-im{ height:38px; margin-top:0; }
/* 72-я, его правки сундуков: лучи большого сундука перекрывали вкладки (overflow:visible) — клики не доходили: всё декоративное — сквозь;
вкладки «Сундук N · песок цена» в одну строку по центру; инфо по центру; «Открыть» — изумруд Круга; песок — просто число */
.kr-box .big .rays, .kr-box .big .sd-art, .kr-box .big .sd-fly, .kr-box .big .sd-pyl, .kr-box .big .sd-msg, .kr-box .big .lbl{ pointer-events:none; }
.kr-box .big.sd{ overflow:hidden; }
.kr-tabs{ position:relative; z-index:3; }
.kr-tab{ flex-direction:row; justify-content:center; align-items:center; gap:8px; white-space:nowrap; }
.kr-tab .cn{ flex-direction:row; align-items:center; font:900 12px 'Cinzel',serif; }
.kr-tab .pr{ display:inline-flex; align-items:center; gap:3px; font:800 11px 'JetBrains Mono',monospace; color:#ffe07a; }
.kr-tab:not(.on) .pr{ color:#c8bca4; }
.kr-box .info{ align-items:center; text-align:center; }
.kr-box .nm, .kr-box .sub{ text-align:center; }
.kr-tiles{ width:100%; justify-items:center; }
.kr-tile{ width:100%; flex-direction:row; gap:6px; height:42px; } .kr-tile .kr-ti{ width:24px; height:24px; } .kr-tile b{ font-size:14px; }
.kr-box .tot{ width:100%; justify-content:center; }
.kr-box .act{ width:100%; justify-content:center; }
.kr-open{ border-width:0 22px; border-image:url(img/krug/kn-krutit.webp) 0 92 fill / 0 22px stretch; min-height:40px; min-width:170px; font-size:13px; }
.kr-open:disabled{ border-image-source:url(img/krug/kn-krutit-off.webp); color:#d8d4cc; }
.kr-box .have{ margin-left:0; font-size:13px; gap:4px; }
/* 72-я: песок — слева, «Открыть» — справа; заголовок артефакта не прижат к верхней рамке */ .kr-box .act{ justify-content:space-between; } .kr-box .act .have{ order:-1; } .kr-box .info{ padding-top:6px; }
/* ===== 72-я: окно «ДЖЕКПОТ СОРВАН!» (его лист list-12 → img/krug/pobeda.webp 1400×692, окно 668×330).
По картинке: картуш 30,5–68,5 % × 10,6–27,3 %; плита суммы 29,5–70,5 % × 73,3–84,4 %; нижняя полоса 22,8–77,3 % × 91–98,6 %. ===== */
.kr-win{ position:absolute; inset:0; z-index:30; display:flex; align-items:center; justify-content:center; background:rgba(4,2,0,.7); animation:krWinBg .4s ease-out; }
@keyframes krWinBg{ from{ background:rgba(255,240,200,.9); } }
.kr-win .card{ position:relative; width:668px; height:330px; overflow:hidden; background:url(img/krug/pobeda.webp) center/100% 100% no-repeat;
box-shadow:0 0 50px rgba(255,200,90,.55), 0 20px 50px #000; animation:krWinIn .55s cubic-bezier(.2,1.4,.4,1); }
@keyframes krWinIn{ 0%{ transform:scale(.4); opacity:0; } 100%{ transform:none; opacity:1; } }
.kr-win .ttl{ position:absolute; left:30.5%; right:31.5%; top:10.6%; height:16.7%; display:flex; align-items:center; justify-content:center;
font:900 24px 'Cinzel',serif; letter-spacing:.08em; color:#fff3c0; white-space:nowrap; text-shadow:0 0 16px #ffb030, 0 0 6px #ffd060, 0 2px 2px #000; animation:krJpGlow 1.6s ease-in-out infinite; }
.kr-win .sum{ position:absolute; left:29.5%; right:29.5%; top:73.3%; height:11.1%; display:flex; align-items:center; justify-content:center; gap:10px; }
.kr-win .sum .kr-bk{ width:28px; height:28px; filter:drop-shadow(0 0 6px rgba(255,210,90,.7)); }
.kr-win .sum b{ font:900 28px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 0 14px #ffd060, 0 2px 2px #000; }
.kr-win .kr-take{ position:absolute; left:50%; top:91%; transform:translate(-50%,-12%); min-width:180px; min-height:34px; z-index:6; }
.kr-win .kr-coins{ z-index:4; }
/* последний победитель: имя не налезает на аву */
.kr-win2{ padding-left:78px !important; }
/* ===== 72-я, его слово «чат — простенько красиво»: тёмный камень с золотым кантом, вкладки — плашки, сообщения — каменные карточки
«имя · клан · время / текст», своё — справа золотом; джекпот — золотая строка; смайлы — строкой над полем; отправка — изумруд ===== */
.chat-panel{ background:linear-gradient(180deg,#14100b,#0b0806); border-left:0 solid transparent; border-left-width:3px; border-image:linear-gradient(180deg,#ffe08a,#b8862a 40%,#5a4012) 1; box-shadow:-10px 0 30px rgba(0,0,0,.7); }
.chat-head{ border-bottom:none; padding:8px 10px 6px; background:linear-gradient(180deg,rgba(255,224,122,.06),transparent); }
.chat-tab{ border:0 solid transparent; border-width:4px 10px; border-image:url(img/raskopki/plashka.webp) 0 34 fill / 4px 10px stretch; border-radius:0; background:none; color:#c8bca4; padding:2px 6px; }
.chat-tab.active{ border-image-source:url(img/raskopki/plashka.webp); color:#ffe9a8; text-shadow:0 0 8px rgba(255,210,90,.7); filter:drop-shadow(0 0 5px rgba(255,200,90,.6)); background:none; }
.chat-close{ border:none; background:linear-gradient(180deg,#e06070,#a8293f); color:#fff; border-radius:50%; width:26px; height:26px; }
.chat-msgs{ gap:6px; padding:8px 10px; }
.chat-msg{ max-width:88%; align-self:flex-start; padding:5px 9px 6px; border-radius:10px 10px 10px 3px; background:linear-gradient(180deg,rgba(60,48,32,.55),rgba(30,22,14,.55)); border:1px solid rgba(184,134,42,.28); }
.chat-msg.me{ align-self:flex-end; border-radius:10px 10px 3px 10px; background:linear-gradient(180deg,rgba(110,84,30,.55),rgba(60,44,14,.55)); border-color:rgba(255,214,90,.45); }
.chat-msg .cm-top{ display:flex; align-items:baseline; gap:6px; margin-bottom:1px; }
.chat-msg .cm-name{ font:800 11.5px 'Inter',sans-serif; color:#8fc4f0; }
.chat-msg.clan .cm-name{ color:#9be07a; } .chat-msg.me .cm-name{ color:#ffe07a; }
.chat-msg .cm-clan{ font:700 9.5px 'Inter',sans-serif; color:#c9a24a; padding:0 5px; border-radius:6px; background:rgba(201,162,74,.12); border:1px solid rgba(201,162,74,.3); white-space:nowrap; }
.chat-msg .cm-time{ float:none; margin-left:auto; }
.chat-msg .cm-text{ font-size:12.5px; color:#f0e6d0; word-break:break-word; }
.chat-msg.jp{ max-width:100%; align-self:stretch; display:flex; align-items:center; gap:8px; padding:6px 9px; border-radius:10px; text-align:left;
background:linear-gradient(90deg,rgba(255,214,90,.28),rgba(120,80,10,.25)); border:1px solid #ffd65a; box-shadow:0 0 12px rgba(255,200,90,.35); animation:chatJp 2s ease-in-out infinite; }
@keyframes chatJp{ 50%{ box-shadow:0 0 20px rgba(255,200,90,.65); } }
.chat-msg.jp .cm-jp{ width:30px; height:30px; flex:0 0 auto; filter:drop-shadow(0 0 5px #ffd060); }
.chat-msg.jp span{ font:700 12px 'Inter',sans-serif; color:#fff3c0; line-height:1.3; }
.chat-msg.jp .cm-name{ color:#ffe07a; font-weight:900; }
.chat-msg.jp .cm-sum{ display:inline-flex; align-items:center; gap:3px; color:#ffe07a; font-family:'JetBrains Mono',monospace; }
.chat-msg.jp .cm-sum img{ width:14px; height:14px; }
.chat-emo{ display:flex; justify-content:space-between; gap:2px; padding:5px 10px 0; }
.chat-emo button{ flex:1; height:26px; border-radius:7px; border:1px solid rgba(184,134,42,.3); background:rgba(0,0,0,.3); color:#ffe9a8; font:700 14px 'Inter',sans-serif; cursor:pointer; padding:0; }
.chat-emo button:active{ transform:scale(.9); }
.chat-input-row{ border-top:none; background:none; }
.chat-input{ background:rgba(0,0,0,.45); border:1px solid rgba(184,134,42,.4); }
.chat-send{ width:52px; border:0 solid transparent; border-width:0 12px; border-image:url(img/krug/kn-krutit.webp) 0 92 fill / 0 12px stretch; border-radius:0; background:none; color:#fff; text-shadow:0 1px 2px #062010; }
/* ===== 72-я: ЧАТ — графика его листа (ui-proba/chat/list-1 → img/chat/*.webp): панель-плита, вкладки (золото с солнцем / тёмная),
карточки-реплики с хвостиком (чужая — тёмная, хвост слева; своя — золотая, хвост справа), лента джекпота, кнопка-анкх ===== */
.chat-panel{ border:0 solid transparent; border-width:14px 14px 28px 14px; border-image:url(img/chat/panel.webp) 43 43 83 43 fill / 14px 14px 28px 14px stretch; background:#0e0c0a; box-shadow:-10px 0 30px rgba(0,0,0,.7); }
.chat-head{ padding:2px 2px 6px; background:none; }
.chat-tab{ border:none; border-image:none; background:url(img/chat/tab-off.webp) center/100% 100% no-repeat; padding:6px 12px 5px; filter:none; color:#c8bca4; min-width:86px; }
.chat-tab.active{ background-image:url(img/chat/tab-on.webp); color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.6); filter:drop-shadow(0 0 5px rgba(255,200,90,.5)); padding-top:10px; }
.chat-msgs{ padding:4px 2px; gap:4px; }
.chat-msg{ border-radius:0; border:0 solid transparent; border-width:7px 7px 14px 22px; border-image:url(img/chat/msg.webp) 26 26 52 95 fill / 7px 7px 14px 22px stretch; background:none; padding:1px 4px 0 0; max-width:92%; }
.chat-msg.me{ border-width:7px 22px 14px 7px; border-image:url(img/chat/msg-me.webp) 26 95 52 26 fill / 7px 22px 14px 7px stretch; background:none; padding:1px 0 0 4px; }
.chat-msg .cm-text{ padding-bottom:1px; }
.chat-msg.me .cm-text{ color:#fff3dc; }
.chat-msg.jp{ border:none; border-image:none; border-radius:0; background:url(img/chat/jp.webp) center/100% 100% no-repeat; box-shadow:none; min-height:50px; padding:6px 30px 9px 58px; position:relative; filter:drop-shadow(0 0 8px rgba(255,200,90,.5)); animation:none; }
.chat-msg.jp .cm-jp{ position:absolute; left:13px; top:50%; transform:translateY(-55%); width:36px; height:36px; }
.chat-msg.jp span{ color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.6); font-size:11.5px; }
.chat-msg.jp .cm-name, .chat-msg.jp .cm-sum{ color:#5a2a00; }
.chat-msg.jp .cm-time{ color:#5a3a0a; opacity:.8; }
.chat-send{ width:40px; height:40px; border:none; border-image:none; background:url(img/chat/send.webp) center/100% 100% no-repeat; font-size:0; }
.chat-input-row{ padding:6px 2px 0; align-items:center; }
.chat-emo{ padding:4px 2px 0; }
/* 72-я, правка чата: надпись на золотой вкладке под солнцем — ниже и темнее; своя реплика — подписи тёмные; лента джекпота в одну строку */
.chat-tab{ height:34px; padding:9px 12px 3px; display:flex; align-items:center; justify-content:center; gap:4px; }
.chat-tab.active{ padding-top:14px; color:#2a1606; font-weight:900; text-shadow:0 1px 0 rgba(255,240,200,.7); }
.chat-msg.me .cm-name{ color:#fff3c0; text-shadow:0 1px 2px #3a2208; }
.chat-msg.me .cm-clan{ color:#fff3c0; background:rgba(58,34,8,.45); border-color:rgba(58,34,8,.5); }
.chat-msg.me .cm-time{ color:#fff3c0; opacity:.85; text-shadow:0 1px 2px #3a2208; }
.chat-msg.jp{ min-height:46px; padding:4px 26px 8px 54px; display:flex; align-items:center; }
.chat-msg.jp span{ white-space:nowrap; font-size:11px; }
.chat-msg.jp .cm-time{ display:none; }
.chat-tab{ height:38px; min-width:94px; } .chat-tab.active{ padding-top:17px; font-size:11.5px; } /* текст под крылатым солнцем вкладки */
.chat-tab.active{ padding-top:6px; }
/* выбранная вкладка: солнце на золотой плашке закрывало текст — та же тёмная плашка, но с золотым светом и золотыми буквами */ .chat-tab.active{ background-image:url(img/chat/tab-off.webp); padding-top:3px; color:#ffe07a; text-shadow:0 0 8px rgba(255,210,90,.9), 0 1px 2px #000; filter:drop-shadow(0 0 6px rgba(255,200,90,.8)) brightness(1.15); font-size:12px; } .chat-tab{ height:34px; padding-top:3px; } .chat-tab:not(.active){ opacity:.75; }
/* 72-я, его «плохо видно имя Kolir в джекпоте»: текст правее кувшина ленты, корона закрывает кувшин, имя тёмное с белой обводкой */ .chat-msg.jp{ padding-left:78px; } .chat-msg.jp .cm-jp{ left:26px; width:40px; height:40px; } .chat-msg.jp .cm-name{ color:#3a1200; font-size:12.5px; text-shadow:0 0 3px #fff6d0, 0 0 2px #fff6d0, 0 1px 0 #fff6d0; } .chat-msg.jp span{ font-weight:800; }
.chat-msg.jp span{ display:flex; flex-direction:column; line-height:1.15; } .chat-msg.jp span i{ font-style:normal; display:inline-flex; align-items:center; gap:3px; font-size:10.5px; } .chat-msg.jp{ padding-right:30px; min-height:50px; } /* имя — первой строкой, «сорвал джекпот N» — второй: влезает в ленту */
/* ===== 72-я, его слово «настройки по фасту… вкладки, профиль с иконками героев, подрисовать, чтобы красиво»:
фон — «кабинет писца» (img/nastroyki/fon.webp), окно в каменной раме раскопок; вкладки — рамки его листа (выбрана — золото с крыльями, нет — камень),
значки картинками (ic-*.webp); панели профиля — тёмное стекло с золотой нитью, как в «Подробнее» ===== */
.settings-modal{ border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; border-radius:0;
background:#120c08 url(img/nastroyki/fon.webp) center/cover no-repeat; box-shadow:0 0 30px rgba(255,200,90,.18), 0 16px 40px rgba(0,0,0,.8); }
.settings-modal .modal-close{ top:-8px; right:-8px; }
.st-ttl{ top:-2px; font-size:16px; color:#ffe9a8; text-shadow:0 0 10px rgba(255,190,80,.45), 0 2px 4px #000; }
.st-side{ width:96px; gap:4px; padding-top:0; justify-content:center; }
.st-it{ width:84px; height:62px; gap:1px; padding:0; justify-content:center; opacity:1; border:0 solid transparent; border-width:7px 6px 6px; border-radius:0;
border-image:url(img/nastroyki/vkl-off.webp) 44 / 7px 6px 6px stretch; background:#0b0d16; filter:brightness(.85); }
.st-it:hover{ filter:brightness(1.05); }
.st-it.on{ border-width:10px 7px 7px; border-image:url(img/nastroyki/vkl-on.webp) 78 58 57 60 / 10px 7px 7px stretch; background:#0b0d16; filter:drop-shadow(0 0 6px rgba(255,200,90,.55)); }
.st-it b, .st-it.on b{ width:30px; height:30px; border:0; border-radius:50%; background:none; box-shadow:none; }
.st-it b img{ width:30px; height:30px; display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
.st-it.on b img{ filter:drop-shadow(0 0 5px rgba(255,210,110,.7)); }
.st-it span{ font-size:8.5px; line-height:1.05; color:#d8c8a4; }
.st-it.on span{ color:#ffe9a8; }
.st-pane{ left:100px; right:2px; top:22px; bottom:0; }
/* свой профиль: карточка и панели — тёмное стекло с золотой нитью, ава в кольце */
.st-pane .pf-card, .st-pane .pf-panel{ border:1px solid rgba(202,164,76,.5); border-radius:10px; box-shadow:0 4px 14px rgba(0,0,0,.5);
background:linear-gradient(180deg,rgba(14,18,34,.84),rgba(8,10,20,.88)); }
.st-pane .pf-card .pf-avw{ width:76px; height:76px; display:flex; align-items:center; justify-content:center; background:url(img/druzya/ava.webp) center/100% 100% no-repeat; }
.st-pane .pf-card .pf-ava{ width:60px; height:60px; border:0; font-size:30px; }
.st-pane .pf-name{ font-family:'Cinzel',serif; color:#f0e0b0; }
.st-pane .pf-stat{ color:#aab4cc; } .st-pane .pf-stat b{ color:#fff3d0; }
/* язык, «о игре», ЧС, перенос — строки каменными ячейками */
.st-pane .st-lang{ border:0 solid transparent; border-width:5px 14px; border-image:url(img/raskopki/r-dlinnaya.webp) 16 62 fill / 5px 14px stretch; border-radius:0; background:none; }
.st-pane .st-note{ color:#d8c8a4; text-shadow:0 1px 2px #000; }
/* 72-я: значки вкладок крупнее, панели профиля теплее и прозрачнее — видно кабинет писца */
.st-it b, .st-it.on b, .st-it b img{ width:36px; height:36px; }
.st-it span{ font-size:9px; }
.st-pane .pf-card, .st-pane .pf-panel{ background:linear-gradient(180deg,rgba(20,14,8,.66),rgba(10,7,4,.78)); }
/* 72-я, его слово «героев чуть больше… в настройках»: ава лучших героев в Настройках 64 → 80 px, панель «Героев» выше, «Артефакты» ниже */
.st-pane .pf-hava{ width:80px; height:80px; }
.st-pane .pf-heroes{ height:154px; } .st-pane .pf-artis{ top:162px; }
.st-pane.pf-note .pf-heroes{ height:152px; } .st-pane.pf-note .pf-artis{ top:222px; }
/* ===== 72-я, его слово «давай почту делать… и все вкладки там»: фон — «зал гонцов» (img/pochta/fon.webp), окно в раме раскопок;
вкладки — рамки Настроек (vkl-on/off) со значками его листа (ic-pochta/nagrady/novosti); строки списка — золотая плашка со стрелкой
(str-on) / каменная (str-off); письмо — папирус с валиками по бокам (svitok); кнопки — изумруд «Заданий» ===== */
.ml-modal{ border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; border-radius:0;
background:#120c08 url(img/pochta/fon.webp) center/cover no-repeat; box-shadow:0 0 30px rgba(255,200,90,.18), 0 16px 40px rgba(0,0,0,.8); }
.ml-modal .modal-close{ top:-8px; right:-8px; }
.ml-title{ top:-2px; font-size:16px; color:#ffe9a8; text-shadow:0 0 10px rgba(255,190,80,.45), 0 2px 4px #000; }
.ml-side{ top:0; width:96px; gap:6px; }
.ml-it{ width:84px; height:66px; gap:1px; padding:0; justify-content:center; opacity:1; border:0 solid transparent; border-width:7px 6px 6px; border-radius:0;
border-image:url(img/nastroyki/vkl-off.webp) 44 / 7px 6px 6px stretch; background:#0b0d16; filter:brightness(.85); }
.ml-it:hover{ filter:brightness(1.05); }
.ml-it.on{ border-width:10px 7px 7px; border-image:url(img/nastroyki/vkl-on.webp) 78 58 57 60 / 10px 7px 7px stretch; background:#0b0d16; filter:drop-shadow(0 0 6px rgba(255,200,90,.55)); }
.ml-it b, .ml-it.on b, .ml-it.pochta b, .ml-it.nagrady b, .ml-it.novosti b{ width:36px; height:36px; border:0; border-radius:50%; background:none; box-shadow:none; }
.ml-it b img{ width:36px; height:36px; display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
.ml-it.on b img{ filter:drop-shadow(0 0 5px rgba(255,210,110,.7)); }
.ml-it span{ font-size:9px; color:#d8c8a4; } .ml-it.on span{ color:#ffe9a8; }
.ml-it .bd{ top:-4px; right:-4px; z-index:2; }
.ml-rule{ display:none; }
/* список: каменные плашки, выбранная — золото со стрелкой (стрелка в картинке) */
.ml-mid{ left:100px; top:22px; bottom:20px; width:214px; padding-right:0; gap:4px; }
.ml-li{ border:0 solid transparent; border-width:6px 10px 6px 12px; border-radius:0; background:none; padding:1px 4px;
border-image:url(img/pochta/str-off.webp) 30 40 30 40 fill / 6px 10px 6px 12px stretch; }
.ml-li.on{ border-width:6px 18px 6px 12px; border-image:url(img/pochta/str-on.webp) 30 64 30 46 fill / 6px 18px 6px 12px stretch; background:none; }
.ml-li.on::after{ display:none; }
.ml-li.on .h, .ml-li.on.compose .h{ color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.5); }
.ml-li.on .d, .ml-li.on .p{ color:#5a3a0a; }
.ml-li.new::before{ left:-8px; }
.ml-li .h{ text-shadow:0 1px 2px #000; }
.ml-foot{ left:100px; width:214px; bottom:2px; color:#a89c84; text-shadow:0 1px 2px #000; }
/* правая часть: письмо — папирус с валиками по бокам; переписка — тёплое стекло с золотой нитью */
.ml-right{ left:322px; right:2px; top:22px; bottom:0; }
.ml-rod{ display:none; }
.ml-pap{ border:0; border-radius:0; background:url(img/pochta/svitok.webp) center/100% 100% no-repeat; padding:9% 13% 9.5%; }
.ml-pap::after{ display:none; }
.ml-pap .seal{ right:14%; top:9%; } .ml-pap .tm{ left:14%; top:9%; }
.ml-rw span{ border:0 solid transparent; border-width:3px 6px; border-image:url(img/pochta/yach.webp) 22 fill / 3px 6px stretch; border-radius:0; background:none;
color:#ffe9a8; text-shadow:0 1px 2px #000; padding:3px 6px; }
.ml-chat{ border:1px solid rgba(202,164,76,.5); border-radius:10px; background:linear-gradient(180deg,rgba(20,14,8,.78),rgba(10,7,4,.86)); box-shadow:0 4px 14px rgba(0,0,0,.5); }
.ml-chat .hd{ background:linear-gradient(180deg,rgba(61,47,26,.9),rgba(42,32,18,.9)); }
/* кнопки: основная — изумруд, «Отмена» и погашенная — камень */
.ml-b, .ml-b.bl{ border:0 solid transparent; border-width:0 16px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 16px stretch; border-radius:0; background:none;
color:#f2fff4; text-shadow:0 1px 2px #062010, 0 0 4px #062010; font:900 11px 'Cinzel',serif; min-height:28px; padding:0 4px; }
.ml-b.paper, .ml-b.gr{ border-image-source:url(img/zadaniya/kn-off.webp); color:#e8dcc0; text-shadow:0 1px 2px #000; background:none; }
/* 72-я: текст письма — строго на светлом поле папируса (поле 13–87 % по ширине, 18–82 % по высоте), дата и печать — внутри поля */
.ml-pap{ padding:17.5% 14% 17%; gap:4px; }
.ml-pap .tm{ left:14.5%; top:18.5%; } .ml-pap .seal{ right:14.5%; top:18%; width:28px; height:28px; font-size:12px; }
.ml-pap .img{ height:54px; }
.ml-pap .p{ flex-shrink:0; font-size:10px; line-height:1.35; } .ml-pap .h{ font-size:12px; }
.ml-rw{ gap:4px; } .ml-rw span{ font-size:9.5px; padding:1px 4px; }
.ml-pap .acts{ margin-top:auto; } .ml-pap .tm{ left:16.5%; }
/* ===== 72-я: недели осады — баннер новости «Осада: …» и заставка недели (js/34-nedelya.js); картинки img/news/week1..4.webp ===== */
.ml-pap .img.ml-wk{ height:72px; background-size:cover; background-position:right center; justify-content:flex-start; align-items:center; padding-left:10px; border-color:#6a4a1a; }
.ml-wk span{ display:flex; flex-direction:column; align-items:flex-start; font:900 13px 'Cinzel',serif; color:#fff3d0; text-shadow:0 0 8px rgba(0,0,0,.9), 0 2px 3px #000; text-align:left; line-height:1.1; max-width:48%; }
.ml-wk small{ font:800 8px 'Inter',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#ffe9a8; margin-bottom:2px; }
.ned-modal{ position:fixed; inset:0; z-index:79; display:none; align-items:center; justify-content:center; background:rgba(4,3,2,.78); }
.ned-modal.show{ display:flex; animation:nedIn .35s ease-out; }
@keyframes nedIn{ from{ opacity:0; } to{ opacity:1; } }
.ned-card{ position:relative; width:min(720px,90%); aspect-ratio:1080/330; border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch;
box-shadow:0 0 40px rgba(255,200,90,.25), 0 20px 50px rgba(0,0,0,.85); animation:nedPop .5s cubic-bezier(.2,1.3,.4,1); }
@keyframes nedPop{ from{ transform:scale(.85); opacity:0; } to{ transform:none; opacity:1; } }
.ned-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.ned-tx{ position:absolute; left:4%; top:12%; width:40%; display:flex; flex-direction:column; gap:6px; }
.ned-k{ font:800 11px 'Inter',sans-serif; letter-spacing:.2em; text-transform:uppercase; color:#ffe9a8; text-shadow:0 1px 3px #000; }
.ned-t{ font:900 26px/1.05 'Cinzel',serif; color:#fff3d0; text-shadow:0 0 14px var(--ned-e,#ffd76a), 0 3px 4px #000; }
.ned-b{ font:700 11px 'Inter',sans-serif; color:#f0e0b0; text-shadow:0 1px 3px #000; }
.ned-bn{ align-self:flex-start; font:800 11px 'Inter',sans-serif; color:#fff; padding:3px 10px; border-radius:999px; background:rgba(0,0,0,.45); border:1px solid var(--ned-e,#ffd76a); text-shadow:0 1px 2px #000; }
.ned-w1{ --ned-e:#ffd76a; } .ned-w2{ --ned-e:#8ad8ff; } .ned-w3{ --ned-e:#9cff70; } .ned-w4{ --ned-e:#ff7040; }
.ned-acts{ position:absolute; left:4%; bottom:9%; display:flex; gap:8px; }
.ned-go, .ned-x{ border:0 solid transparent; border-width:0 18px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 18px stretch; background:none; min-height:34px; padding:0 6px;
color:#f2fff4; text-shadow:0 1px 2px #062010; font:900 12px 'Cinzel',serif; cursor:pointer; }
.ned-x{ border-image-source:url(img/zadaniya/kn-off.webp); color:#e8dcc0; text-shadow:0 1px 2px #000; }
/* 72-я, его слово «просто „Логово аспидов“»: на заставке и в новости — только название недели, крупно по центру слева */
.ned-tx{ top:0; bottom:28%; justify-content:center; }
.ned-t{ font-size:34px; }
.ml-wk span{ font-size:15px; max-width:44%; }
/* ===== 72-я, его слово «давай клеймо сделаем»: окно Клейма лёжа — фон «кузня Бездны» (img/kleymo/fon.webp, пьедестал слева), рама раскопок;
слева эмблема над пьедесталом (em-on горит, когда надето; em-off потухшая), справа плашки (plashka), изумрудная «Улучшить», герои в рамках slot-on/off ===== */
.pop-window.rel-win{ position:relative; width:min(660px,92%); height:min(320px,90%); max-height:none; overflow:visible; padding:0; box-sizing:border-box;
border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; border-radius:0;
background:#0c0a10 url(img/kleymo/fon.webp) center/cover no-repeat; box-shadow:0 0 30px rgba(255,190,80,.2), 0 16px 40px rgba(0,0,0,.85); display:flex; }
.rel-win .rel-x{ position:absolute; top:-10px; right:-10px; z-index:5; width:28px; height:28px; border-radius:50%; background:linear-gradient(180deg,#e06070,#a8293f);
border:2px solid #5a0f1c; color:#fff; font-weight:900; cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.5); }
.rel-left{ position:relative; width:36%; flex-shrink:0; display:flex; flex-direction:column; align-items:center; padding-top:6px; }
.rel-win .rel-title{ font:900 15px 'Cinzel',serif; color:#ffe9a8; text-shadow:0 0 10px rgba(255,190,80,.5), 0 2px 4px #000; }
.rel-win .rel-sub{ min-height:0; font:800 12px 'Inter',sans-serif; color:#e6c976; text-shadow:0 1px 3px #000; }
.rel-win .rel-sub b{ color:#ffe07a; }
.rel-em{ position:absolute; left:50%; top:30%; width:112px; height:112px; object-fit:contain; transform:translateX(-50%); filter:drop-shadow(0 6px 10px rgba(0,0,0,.7)); }
.rel-em[src*="em-on"]{ animation:relEm 2.4s ease-in-out infinite; }
@keyframes relEm{ 0%,100%{ transform:translateX(-50%) translateY(0); filter:drop-shadow(0 6px 10px rgba(0,0,0,.7)) drop-shadow(0 0 6px rgba(255,190,80,.4)); }
50%{ transform:translateX(-50%) translateY(-5px); filter:drop-shadow(0 10px 12px rgba(0,0,0,.6)) drop-shadow(0 0 16px rgba(255,200,90,.75)); } }
.rel-right{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; padding:4px 6px 4px 0; }
.rel-win .rel-box, .rel-win .rel-up{ margin:0; border:0 solid transparent; border-width:5px 14px; border-image:url(img/kleymo/plashka.webp) 40 60 fill / 5px 14px stretch;
border-radius:0; background:none; padding:2px 4px; text-align:left; }
.rel-win .rel-on{ font-size:12px; text-shadow:0 1px 2px #000; } .rel-win .rel-eff{ margin-top:2px; font-size:11px; } .rel-win .rel-note{ display:none; }
.rel-win .rel-up{ display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto; align-items:center; column-gap:8px; }
.rel-win .rel-next{ grid-column:1; grid-row:1 / span 2; min-height:0; margin:0; font-size:11.5px; text-shadow:0 1px 2px #000; }
.rel-win .rel-upbtn{ grid-column:2; grid-row:1; width:auto; min-width:150px; min-height:32px; padding:0 4px; border:0 solid transparent; border-width:0 18px;
border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 18px stretch; border-radius:0; background:none; color:#f2fff4; text-shadow:0 1px 2px #062010; font:900 12px 'Cinzel',serif; }
.rel-win .rel-upbtn:disabled{ border-image-source:url(img/zadaniya/kn-off.webp); color:#d8c6a2; text-shadow:0 1px 2px #000; filter:none; }
.rel-win .rel-have{ grid-column:2; grid-row:2; margin:0; text-align:center; color:#c8bca4; }
.rel-win .rel-max{ grid-column:1 / span 2; }
.rel-win .rel-pick-h{ margin:2px 2px 0; color:#ffe9a8; text-shadow:0 1px 2px #000; }
.rel-win .rel-pick{ flex:1; min-height:0; max-height:none; margin:0; grid-template-columns:repeat(6,minmax(0,1fr)); gap:4px; align-content:start; scrollbar-width:none; }
.rel-win .rel-pick::-webkit-scrollbar{ width:0; }
.rel-win .rel-hero{ padding:0; gap:1px; border:0; border-radius:0; background:none; }
.rel-win .rel-hero.sel{ background:none; }
.rel-win .rel-hero .rh-port{ width:100%; aspect-ratio:1; height:auto; box-sizing:border-box; border:0 solid transparent; border-width:7px;
border-image:url(img/kleymo/slot-off.webp) 16 fill / 7px stretch; overflow:hidden; background:#140e18; }
.rel-win .rel-hero.sel .rh-port{ border-image-source:url(img/kleymo/slot-on.webp); filter:drop-shadow(0 0 5px rgba(255,200,90,.7)); }
.rel-win .rel-hero .rh-port img{ width:100%; height:100%; object-fit:cover; object-position:50% 25%; display:block; }
.rel-win .rh-nm{ font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; text-shadow:0 1px 2px #000; }
.rel-win .rh-rk{ display:none; }
/* 72-я: вопрос «Надеть Клеймо на …?» / «сменить можно через …» — плашка Клейма, кнопки изумруд / камень */
.pop-window.rla-win{ width:min(340px,86%); padding:12px 18px 12px; border:0 solid transparent; border-width:12px 20px; border-image:url(img/kleymo/plashka.webp) 40 60 fill / 12px 20px stretch;
border-radius:0; background:none; box-shadow:0 0 24px rgba(255,190,80,.2), 0 12px 30px rgba(0,0,0,.8); text-align:center; overflow:visible; }
.rla-t{ font:900 14px 'Cinzel',serif; color:#ffe9a8; text-shadow:0 0 8px rgba(255,190,80,.45), 0 2px 3px #000; }
.rla-tx{ margin-top:6px; font:600 12px 'Inter',sans-serif; color:#e8dcc0; text-shadow:0 1px 2px #000; } .rla-tx b{ color:#ffe07a; }
.rla-acts{ margin-top:10px; display:flex; gap:10px; justify-content:center; }
.rla-yes, .rla-no{ min-width:110px; min-height:32px; padding:0 4px; border:0 solid transparent; border-width:0 18px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 18px stretch;
background:none; color:#f2fff4; text-shadow:0 1px 2px #062010; font:900 12px 'Cinzel',serif; cursor:pointer; }
.rla-no{ border-image-source:url(img/zadaniya/kn-off.webp); color:#e8dcc0; text-shadow:0 1px 2px #000; }
/* ===== 72-я, его слово «перерождение сделаем»: окно — фон «зал возрождения» (img/pererozhdenie/fon.webp), рама раскопок, заголовок в картуше
с крыльями феникса (kartush), большая душа (dusha) и «+N душ» на ночной плашке (plashka), урон «было → стрелка → станет», кнопки изумруд / камень ===== */
#prestigeModal{ width:min(560px,90%); padding:6px 18px 12px; border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; border-radius:0;
background:#0a0e1c url(img/pererozhdenie/fon.webp) center 30%/cover no-repeat; box-shadow:0 0 34px rgba(150,200,255,.2), 0 16px 40px rgba(0,0,0,.85); text-align:center; }
#prestigeModal::before{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,10,24,.1) 20%,rgba(6,10,24,.72) 62%,rgba(6,10,24,.88)); pointer-events:none; }
#prestigeModal > *{ position:relative; }
#prestigeModal .pm-title{ width:340px; height:57px; margin:0 auto; display:flex; align-items:center; justify-content:center; background:url(img/pererozhdenie/kartush.webp) center/100% 100% no-repeat;
font:900 17px 'Cinzel',serif; letter-spacing:.06em; color:#fff3d0; text-shadow:0 0 10px rgba(255,200,90,.5), 0 2px 3px #000; }
#prestigeModal .rm-text{ margin:4px 0 0; }
.pr-gain{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:2px; }
.pr-soul{ height:78px; filter:drop-shadow(0 0 12px rgba(160,220,255,.7)); animation:prSoul 2.4s ease-in-out infinite; }
@keyframes prSoul{ 50%{ transform:translateY(-4px) scale(1.04); filter:drop-shadow(0 0 20px rgba(180,230,255,.95)); } }
.pr-pl{ width:190px; height:68px; display:flex; align-items:baseline; justify-content:center; gap:7px; padding-top:14px; box-sizing:border-box; background:url(img/pererozhdenie/plashka.webp) center/100% 100% no-repeat; }
.pr-pl b{ font:900 30px 'JetBrains Mono',monospace; color:#e8f6ff; text-shadow:0 0 12px rgba(150,210,255,.9), 0 2px 3px #000; }
.pr-pl span{ font:800 13px 'Cinzel',serif; color:#bfe3ff; text-shadow:0 1px 2px #000; }
.pr-sub{ margin-top:3px; font:600 11px 'Inter',sans-serif; color:#c8d4ea; text-shadow:0 1px 2px #000; } .pr-sub b{ color:#ffe07a; }
.pr-bonus{ margin-top:6px; display:flex; align-items:center; justify-content:center; gap:9px; font:700 12px 'Inter',sans-serif; color:#e8dcc0; text-shadow:0 1px 2px #000; }
.pr-bonus b{ font:800 15px 'JetBrains Mono',monospace; color:#fff3d0; } .pr-bonus b.up{ color:#9be07a; }
.pr-bonus img{ width:52px; height:auto; filter:drop-shadow(0 1px 2px #000); }
.pr-note{ margin-top:5px; font:500 10.5px 'Inter',sans-serif; color:#9aa6c0; text-shadow:0 1px 2px #000; }
#prestigeModal .rm-actions{ margin-top:8px; gap:12px; justify-content:center; }
#prestigeModal .rm-confirm, #prestigeModal .rm-cancel{ flex:0 0 auto; min-width:150px; min-height:34px; padding:0 6px; border:0 solid transparent; border-width:0 18px; border-radius:0;
border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 18px stretch; background:none; box-shadow:none; color:#f2fff4; text-shadow:0 1px 2px #062010; font:900 13px 'Cinzel',serif; }
#prestigeModal .rm-cancel{ border-image-source:url(img/zadaniya/kn-off.webp); color:#e8dcc0; text-shadow:0 1px 2px #000; }
/* 72-я, его слово «души чуть меньше цифрами»; пояснение — чуть крупнее и светлее, % урона золотом */
.pr-pl b{ font-size:23px; } .pr-pl{ padding-top:12px; }
.pr-note{ margin-top:6px; font-size:11.5px; color:#d8e0f0; line-height:1.35; } .pr-note b{ color:#ffe07a; }
/* 72-я: на плашке души — только число, ровно по центру (было прижато вверх отступом) */
.pr-pl{ align-items:center; padding:0 0 2px; } .pr-pl b{ line-height:1; }
/* ===== 72-я, его слово «рисовать сундук, валюту, печати, вкладку саму и всё остальное»: Храм — фон «сокровищница» (img/hram/fon.webp, ниши слева),
рама раскопок; кнопки слева — плашки Почты (str-on золото со стрелкой / str-off камень) со значками его листа (nav-*);
вкладки Сундука — квадратные рамки Настроек (vkl-on/off) со значками t-*; ячейки — ячейка наград Почты (yach), число на тёмной плашке ===== */
.hram-modal{ border:0 solid transparent; border-width:14px; border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; border-radius:0; overflow:visible;
background:#120c08 url(img/hram/fon.webp) center/cover no-repeat; box-shadow:0 0 30px rgba(255,200,90,.18), 0 16px 40px rgba(0,0,0,.8); }
.hram-modal .modal-close{ top:-8px; right:-8px; }
.hram-side{ width:142px; padding:8px 4px 8px 6px; gap:6px; border-right:0; background:none; justify-content:center; }
.hram-btn{ position:relative; height:52px; padding:0 14px 0 6px; gap:6px; border:0 solid transparent; border-width:6px 10px 6px 12px; border-radius:0;
border-image:url(img/pochta/str-off.webp) 30 40 30 40 fill / 6px 10px 6px 12px stretch; background:none; color:#d8c8a4; }
.hram-btn.on{ border-width:6px 18px 6px 12px; border-image:url(img/pochta/str-on.webp) 30 64 30 46 fill / 6px 18px 6px 12px stretch; background:none; color:#3a2208; }
.hram-btn .ic{ width:34px; height:34px; flex-shrink:0; } .hram-btn .ic img{ width:100%; height:100%; display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.hram-btn .nm{ font-size:10.5px; text-shadow:0 1px 2px #000; } .hram-btn.on .nm{ text-shadow:0 1px 0 rgba(255,240,200,.5); }
.hram-btn:hover{ filter:brightness(1.1); }
.hram-pane{ overflow:visible; }
.hram-bag{ padding:2px 6px 4px 8px; }
.inv-tabs{ gap:4px; margin:2px 0 6px; overflow:visible; padding:0; }
.inv-tab{ min-width:0; width:62px; height:56px; padding:0; gap:0; justify-content:center; border:0 solid transparent; border-width:6px 5px 5px; border-radius:0;
border-image:url(img/nastroyki/vkl-off.webp) 44 / 6px 5px 5px stretch; background:#0b0d16; box-shadow:none; filter:brightness(.85); }
.inv-tab:hover{ filter:brightness(1.05); }
.inv-tab.sel{ border-width:9px 6px 6px; border-image:url(img/nastroyki/vkl-on.webp) 78 58 57 60 / 9px 6px 6px stretch; filter:drop-shadow(0 0 6px rgba(255,200,90,.5)); box-shadow:none; }
.inv-tab .it-ic{ width:28px; height:28px; display:block; } .inv-tab .it-ic img{ width:100%; height:100%; display:block; }
.inv-tab .it-lb{ font:800 8.5px 'Cinzel',serif; color:#d8c8a4; text-shadow:0 1px 2px #000; } .inv-tab.sel .it-lb{ color:#ffe9a8; }
.inv-grid{ gap:5px; padding:2px; scrollbar-width:none; } .inv-grid::-webkit-scrollbar{ width:0; }
.inv-cell{ border:0 solid transparent; border-width:5px; border-image:url(img/pochta/yach.webp) 22 fill / 5px stretch; border-radius:0; background:none; padding:2px; }
.inv-cell .iv-icwrap{ width:32px; height:32px; margin-bottom:8px; }
.inv-cell .iv-val{ width:30px; height:30px; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
.inv-cell .iv-badge{ bottom:-1px; left:2px; right:2px; padding:1px 0; border-radius:4px; background:rgba(0,0,0,.6); color:#ffe07a; font-size:8.5px; }
.inv-cell.shmot .iv-badge{ left:auto; right:0; bottom:-1px; padding:1px 3px; }
.inv-cell[data-invbottle]{ border-image-source:url(img/pochta/yach.webp); }
.inv-empty{ color:#c8bca4; text-shadow:0 1px 2px #000; }
/* ===== 72-я: окно «Новый герой» после 7-го дня «Семь дней героя» (js/12 dlHeroWin) — лучи, герой живым роликом на своём фоне, имя, изумрудная «Забрать» ===== */
.dl-hwin{ position:absolute; inset:0; z-index:30; display:flex; align-items:center; justify-content:center; background:rgba(6,4,2,.8); animation:nedIn .3s ease-out; }
.dlw-card{ position:relative; width:min(560px,94%); height:min(290px,92%); display:flex; align-items:stretch; overflow:hidden; border:0 solid transparent; border-width:14px;
border-image:url(img/raskopki/nagrada.webp) 50 / 14px stretch; background:#120c08 var(--dlwfon, none) center/cover no-repeat;
box-shadow:0 0 40px rgba(255,200,90,.35), 0 18px 46px rgba(0,0,0,.85); animation:nedPop .5s cubic-bezier(.2,1.3,.4,1); }
.dlw-rays{ position:absolute; left:28%; top:50%; width:620px; height:620px; margin:-310px 0 0 -310px; pointer-events:none;
background:repeating-conic-gradient(from 0deg, rgba(255,224,122,0) 0 9deg, rgba(255,224,122,.28) 9deg 14deg);
-webkit-mask:radial-gradient(circle, #000 12%, transparent 58%); mask:radial-gradient(circle, #000 12%, transparent 58%); animation:krRaysSpin 14s linear infinite; }
.dlw-hero{ position:relative; width:48%; flex-shrink:0; display:flex; align-items:flex-end; justify-content:center; }
.dlw-hero canvas, .dlw-hero img{ height:108%; width:auto; max-width:100%; object-fit:contain; display:block; filter:drop-shadow(0 0 14px rgba(255,210,110,.5)) drop-shadow(0 8px 10px rgba(0,0,0,.6)); }
.dlw-tx{ position:relative; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:0 12px 0 0; text-align:center;
background:linear-gradient(90deg, rgba(10,6,2,0), rgba(10,6,2,.7) 30%); }
.dlw-k{ font:800 12px 'Inter',sans-serif; letter-spacing:.3em; text-transform:uppercase; color:#ffe9a8; text-shadow:0 1px 3px #000; }
.dlw-nm{ font:900 36px/1 'Cinzel',serif; color:#fff3d0; text-shadow:0 0 16px rgba(255,190,80,.8), 0 3px 4px #000; animation:krJpGlow 2.2s ease-in-out infinite; }
.dlw-cls{ font:800 12px 'Cinzel',serif; color:#e6c976; text-shadow:0 1px 2px #000; }
.dlw-sub{ font:600 11.5px 'Inter',sans-serif; color:#e8dcc0; text-shadow:0 1px 2px #000; }
.dlw-take{ margin-top:8px; min-width:170px; min-height:40px; padding:0 6px; border:0 solid transparent; border-width:0 20px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 20px stretch;
background:none; color:#f2fff4; text-shadow:0 1px 2px #062010, 0 0 4px #062010; font:900 15px 'Cinzel',serif; cursor:pointer; animation:dlwTake 1.6s ease-in-out infinite; }
@keyframes dlwTake{ 50%{ filter:brightness(1.18) drop-shadow(0 0 8px rgba(120,255,170,.6)); } }
.inv-cell[data-invbottle] .iv-val{ width:34px; height:34px; } /* 72-я: бутылка энергии в Сумке — картинка Рынка (круглый медальон), чуть крупнее */
/* ===== 72-я, его слово «давай рисовать иероглифы»: его листы img/ieroglify/ — 31 значок (.webp), плитки pl-lock / pl-open / pl-max,
папирус papirus.webp, вкладки tab-on / tab-off, полоска zhelob + zaliv-b (длина — clip-path по --p), боги bog-set / bog-gor;
панель прозрачная — под ней фон Храма (сокровищница) ===== */
.tal-pane{ background:none; color:#f0e0b0; }
.tal-tabs{ flex:0 0 36px; gap:6px; padding:2px 44px 0 6px; background:none; border-bottom:0; align-items:flex-end; }
.tal-tab{ flex:0 0 150px; height:34px; border:0; border-radius:0; background:url(img/ieroglify/tab-off.webp) center/100% 100% no-repeat; color:#f0e0b0;
text-shadow:0 1px 2px #000; padding-top:6px; box-shadow:none; }
.tal-tab .p{ color:#e6c976; }
.tal-tab.on{ background:url(img/ieroglify/tab-on.webp) center/100% 100% no-repeat; color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.6); box-shadow:none; }
.tal-tab.on .p{ color:#5a3a0a; }
.tal-tab.lock, .tal-tab.lock.on{ background-image:url(img/ieroglify/tab-off.webp); color:#c8bca4; opacity:.85; }
.tal-head{ flex:0 0 40px; }
.tal-cnt{ color:#e8dcc0; text-shadow:0 1px 2px #000; } .tal-cnt b{ color:#ffe07a; }
.tal-note{ color:#ff8a8a; text-shadow:0 1px 2px #000; }
/* полоска: деревянный жёлоб, внутри бирюзовая заливка картинкой; поле жёлоба ≈ 7 % по бокам, 25 % сверху и снизу */
.tal-pane .tal-dmg, .tal-dmg{ width:170px; height:26px; border:0; border-radius:0; overflow:visible; box-shadow:none; background:url(img/ieroglify/zhelob.webp) center/100% 100% no-repeat; }
.tal-dmg .fl{ left:7.2%; right:7.2%; top:26%; bottom:26%; width:auto; transition:clip-path .5s; background:url(img/ieroglify/zaliv-b.webp) center/100% 100% no-repeat;
clip-path:inset(0 calc(100% - var(--p, 0%)) 0 0 round 3px); }
.tal-dmg .tx{ color:#fff3d0; text-shadow:0 0 3px #000, 0 1px 2px #000; font-size:9px; }
.tal-reset{ border:0 solid transparent; border-width:0 16px; border-image:url(img/zadaniya/kn-off.webp) 0 54 fill / 0 16px stretch; border-radius:0; background:none; box-shadow:none;
color:#e8dcc0; text-shadow:0 1px 2px #000; min-height:30px; padding:0 4px; }
.tal-reset.warn{ border-image-source:url(img/zadaniya/kn-zabrat.webp); background:none; color:#fff; }
/* поле: тёмное стекло над фоном Храма; папирусы — его лист с валиками по бокам */
.tal-field{ border:1px solid rgba(202,164,76,.45); background:rgba(10,7,4,.45); box-shadow:inset 0 0 24px rgba(0,0,0,.5); scrollbar-color:#8a6a2a transparent; }
.tal-sec{ border-radius:0; padding:34px 40px 18px; background:url(img/ieroglify/papirus.webp) center/100% 100% no-repeat; box-shadow:none; filter:drop-shadow(0 6px 10px rgba(0,0,0,.45)); }
.tal-sec::before, .tal-sec::after{ display:none; }
.tal-sec .st{ left:44px; top:14px; color:#5a2a10; }
.tal-secarr{ color:#e6c976; text-shadow:0 1px 3px #000; } .tal-secarr.ok{ color:#7fe0a0; }
/* плитки таланта: открыта — золото, на максимуме — золото с крыльями, закрыта — камень с замком (значок серый) */
.tal-tl{ width:70px; height:70px; border:0; border-radius:0; background:url(img/ieroglify/pl-open.webp) center/100% 100% no-repeat; box-shadow:none; text-shadow:none; }
.tal-tl .tal-ico{ width:46px; height:46px; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.55)); pointer-events:none; }
.tal-tl.done{ background-image:url(img/ieroglify/pl-max.webp); background-size:108% 108%; box-shadow:none; }
.tal-tl.cur{ animation:talPulse2 1.6s ease-in-out infinite; box-shadow:none; }
@keyframes talPulse2{ 0%,100%{ filter:drop-shadow(0 0 2px rgba(255,224,122,.5)); } 50%{ filter:drop-shadow(0 0 10px rgba(255,230,140,1)); } }
.tal-tl.lock{ background-image:url(img/ieroglify/pl-lock.webp); filter:none; opacity:1; }
.tal-tl.lock .tal-ico{ filter:grayscale(1) brightness(.7); opacity:.75; }
.tal-tl.great{ border:0; }
.tal-tl .nm{ color:#3a2410; font-weight:800; }
/* бог справа — во весь рост */
.tal-pane .tal-fig .fg, .tal-fig .fg{ height:230px; top:0; gap:2px; }
.tal-fig .bog{ height:200px; width:auto; max-width:150px; object-fit:contain; filter:drop-shadow(0 8px 12px rgba(0,0,0,.6)); }
.tal-fig .nm{ color:#ffe9a8; text-shadow:0 1px 3px #000; }
/* окно таланта: значок в медальоне картинкой */
.tal-pop .med .ic{ display:flex; } .tal-pop .med .ic .tal-ico{ width:44px; height:44px; object-fit:contain; }
.tal-sec{ padding-top:44px; } .tal-sec .st{ top:24px; left:48px; } /* 72-я: заголовок папируса — ниже рваного края, внутри красной рамки */
.tal-sec{ padding-top:56px; } .tal-sec .st{ top:36px; left:52px; }
.tal-sec{ padding-top:64px; } .tal-sec .st{ top:46px; }
/* 72-я, его слово «двух богов сбоку видно плохо — они за листами стоят»: папирусы уже, бог — своей колонкой справа, не под листом */
.tal-pane .tal-sec, .tal-pane .tal-secarr{ width:330px; }
.tal-sec{ padding-left:30px; padding-right:30px; } .tal-sec .st{ left:40px; }
.tal-row{ gap:16px; }
.tal-pane .tal-fig{ width:175px; } .tal-pane .tal-fig .fg{ width:170px; right:2px; }
.tal-fig .bog{ height:215px; max-width:170px; }
/* ===== 72-я, его правка «кнопки Сет и Гор не прорисованы, сброс уёбищный, окно таланта старое»: вкладки — длинные таблички его листа
(tab-on золото / tab-off бронза / tab-lock камень с замком), сброс — красная кнопка со стрелкой (sbros), окно таланта — картуш с крыльями (okno):
гнездо значка сверху (центр 50 % × 15 %, Ø 13 % ширины), поле папируса 18–82 % × 24–89 %, жёлоб полоски 26–74 % × 79–84 % ===== */
.tal-tab{ flex:0 0 176px; height:30px; padding:0 14px; background:url(img/ieroglify/tab-off.webp) center/100% 100% no-repeat; color:#f0e0b0; text-shadow:0 1px 2px #000; }
.tal-tab.on{ background-image:url(img/ieroglify/tab-on.webp); color:#3a2208; text-shadow:0 1px 0 rgba(255,240,200,.6); filter:drop-shadow(0 0 5px rgba(255,200,90,.45)); }
.tal-tab.lock, .tal-tab.lock.on{ background-image:url(img/ieroglify/tab-lock.webp); padding-left:30px; color:#e8e0d0; filter:none; }
.tal-tab.lock .p{ color:#d8d0c0; }
.tal-reset{ height:32px; min-width:178px; padding:0 8px 0 34px; border:0; border-image:none; background:url(img/ieroglify/sbros.webp) center/100% 100% no-repeat; color:#fff3e0;
text-shadow:0 1px 2px #3a0008, 0 0 3px #3a0008; font-size:9.5px; }
.tal-reset:disabled{ filter:grayscale(.6) brightness(.75); opacity:1; }
.tal-reset.warn{ background-image:url(img/ieroglify/sbros.webp); filter:brightness(1.2) drop-shadow(0 0 6px rgba(255,90,90,.7)); }
/* окно таланта */
.tal-pop{ width:380px; height:214px; box-sizing:border-box; padding:60px 74px 0; gap:3px; border:0; border-radius:0; background:url(img/ieroglify/okno.webp) center/100% 100% no-repeat;
box-shadow:none; filter:drop-shadow(0 12px 24px rgba(0,0,0,.7)); justify-content:flex-start; top:50%; }
.tal-pop .med{ top:4.5%; width:50px; height:50px; border:0; background:none; box-shadow:none; }
.tal-pop .med .ic .tal-ico{ width:42px; height:42px; }
.tal-pop .med.done{ box-shadow:none; filter:drop-shadow(0 0 8px rgba(120,255,160,.8)); }
.tal-pop .x{ right:15%; top:17%; }
.tal-pop .nm{ font-size:14px; color:#3a1a08; } .tal-pop .lv{ font-size:10.5px; color:#5a3a10; }
.tal-pop .ef{ font-size:10.5px; line-height:1.35; color:#3a2410; }
.tal-pop .seg{ position:absolute; left:26.5%; right:26.5%; top:79.6%; height:3.6%; gap:1px; } .tal-pop .seg i{ height:100%; border-radius:2px; background:rgba(255,255,255,.08); } .tal-pop .seg i.on{ background:linear-gradient(180deg,#7fffd0,#2fb890); }
.tal-pop .why{ font-size:9.5px; }
.tal-pop .btns{ position:absolute; left:0; right:0; bottom:-16px; gap:10px; }
.tal-pop .tal-btn{ min-width:120px; min-height:32px; padding:0 4px; border:0 solid transparent; border-width:0 18px; border-radius:0; box-shadow:none;
border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 18px stretch; background:none; color:#f2fff4; text-shadow:0 1px 2px #062010; font-size:11.5px; }
.tal-pop .tal-btn:disabled{ border-image-source:url(img/zadaniya/kn-off.webp); color:#d8c6a2; text-shadow:0 1px 2px #000; opacity:1; }
.tal-pop .tal-btn.plain{ border-image-source:url(img/zadaniya/kn-off.webp); color:#e8dcc0; text-shadow:0 1px 2px #000; }
.tal-pop .tal-btn.done{ border-image-source:url(img/zadaniya/kn-zabrat.webp); color:#f2fff4; }
.tal-pop{ padding-top:72px; } .tal-reset{ min-width:150px; font-size:10px; } /* 72-я: название ниже рамки окна; сброс короче — «Сбросить · 100 🦴» */
/* 72-я, его слово «а что по чёрточкам — посчитай»: в жёлобе видно КАЖДУЮ чёрточку — пустые тёмно-бронзовые с каймой, прокачанные бирюзой; сколько уровней, столько чёрточек */
.tal-pop .seg{ gap:2px; padding:0 1px; box-sizing:border-box; }
.tal-pop .seg i{ background:#5a4630; box-shadow:inset 0 0 0 1px rgba(255,220,150,.35); border-radius:2px; }
.tal-pop .seg i.on{ background:linear-gradient(180deg,#9fffe0,#2fb890); box-shadow:0 0 4px rgba(120,255,210,.7); }
.tal-pop .seg{ width:auto; } /* 72-я: старое width:100 % тянуло чёрточки за окно — теперь ровно в жёлобе (left/right 26,5 %) */
.tal-pop .seg.many{ gap:1px; } .tal-pop .seg.many i{ border-radius:1px; box-shadow:none; } /* больше 25 уровней (до 46) — зазор 1 px, чтобы чёрточки не пропали */
/* 72-я, его слово «убрать миллион строчек»: в жёлобе окна таланта — одна сплошная бирюзовая заливка по уровню (lv / cap), без чёрточек */
.tal-pop .tpbar{ position:absolute; left:26.8%; right:26.8%; top:80%; height:3%; border-radius:4px; overflow:hidden; }
.tal-pop .tpbar b{ display:block; height:100%; border-radius:4px; background:linear-gradient(180deg,#9fffe0,#2fb890); box-shadow:0 0 6px rgba(120,255,210,.7); transition:width .4s; }
/* 72-я, его выбор «с уровнем лучше всего — супер»: в жёлобе окна таланта надпись «Уровень N из M» (макет maket-talant-72.html, вариант 3) */
.tal-pop .tplbl{ position:absolute; left:26.8%; right:26.8%; top:78.2%; height:6.5%; display:flex; align-items:center; justify-content:center;
font:800 9.5px 'Inter',sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#f0e0b0; text-shadow:0 1px 1px #000; }
/* 72-я, его слово «синюю полоску и чуть шире, уровень 0 из 30»: своя полоска поверх жёлоба картинки — шире и выше, синяя заливка по уровню, надпись по центру */
.tal-pop .tplbl{ left:21%; right:21%; top:76.5%; height:10%; border-radius:7px; overflow:hidden; background:#1c1208; box-shadow:inset 0 2px 4px rgba(0,0,0,.7), 0 0 0 2px #b8862a, 0 0 0 3px #5a3a10; }
.tal-pop .tplbl b{ position:absolute; left:0; top:0; bottom:0; border-radius:6px; background:linear-gradient(180deg,#7fc8ff,#2a6ad8 55%,#1a4aa8); box-shadow:0 0 8px rgba(90,170,255,.8); transition:width .4s; }
.tal-pop .tplbl span{ position:relative; font-size:10px; color:#fff; text-shadow:0 1px 2px #000, 0 0 3px #000; }
.tal-pop .tplbl{ top:71%; } /* 72-я, его слово «полоску чуть подними» (было 76,5 %) */
.tal-pop .tplbl{ top:67%; } /* 72-я: ещё чуть выше (его слово); старый жёлоб с картинки окна затёрт (img/ieroglify/okno.webp, исходник — ui-proba/ieroglify/dop/okno-s-zhelobom.webp) */
/* 72-я, его слово «забирать награду Безумства в достижениях»: «Забрать» — изумруд «Заданий», мягко пульсирует */
.ach-rwbtn.take, .rw-ok.take{ border:0 solid transparent; border-width:0 14px; border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 14px stretch; border-radius:0; background:none; box-shadow:none;
color:#f2fff4; text-shadow:0 1px 2px #062010; font-weight:900; animation:dlwTake 1.6s ease-in-out infinite; cursor:pointer; }
.ach-rwbtn.take::after{ display:none; }
.ach-rwbtn.take{ font-size:10px; letter-spacing:0; padding:0 2px; } /* 72-я: «Забрать» влезает целиком */
/* ===== 73-я: ДОСТИЖЕНИЯ В КАРТИНКАХ — его листы client/img/ui-proba/dostizheniya/list-znachki.jpg (12 значков категорий)
и list-ramki.jpg (медальон, закрытый с замком, собранный со свечением, плашка строки, диск очков, плашка всплывашки) → img/dostizheniya/;
ступени — плитки Иероглифов (pl-lock / pl-open / pl-max), полосы — жёлоб Иероглифов 9-срезом, фон — Храм. Копия до — backup/styles-pered-dostizheniya-73.css ===== */
/* медальоны: картинка — рамка, кольцо прогресса — в тёмном жёлобе между ободами (замер: 64–72 % радиуса), значок в центре */
.ach-mb .ring{ width:66px; height:66px; position:relative; border-radius:50%; background:url(img/dostizheniya/med-on.webp) center/100% 100% no-repeat; }
.ach-mb.hot .ring{ background-image:url(img/dostizheniya/med-hot.webp); }
.ach-mb.soon .ring{ background:none; }
.ach-mb.soon .ring::before{ content:""; position:absolute; left:0; top:0; width:100%; height:108.1%; background:url(img/dostizheniya/med-lock.webp) center/100% 100% no-repeat; }
.ach-mb .ring .pr{ position:absolute; inset:0; border-radius:50%; background:conic-gradient(#ffd96a var(--d,0deg), transparent 0);
-webkit-mask:radial-gradient(closest-side, transparent 63.5%, #000 64.5% 71%, transparent 72%); mask:radial-gradient(closest-side, transparent 63.5%, #000 64.5% 71%, transparent 72%); }
.ach-mb .ring .aic{ position:absolute; left:50%; top:50%; width:56%; height:56%; transform:translate(-50%,-50%); object-fit:contain; pointer-events:none;
filter:drop-shadow(0 2px 2px rgba(0,0,0,.75)); }
.ach-mb.soon .ring .aic{ filter:grayscale(1) brightness(.6); opacity:.8; }
.ach-mb .nm2{ margin-top:3px; text-shadow:0 1px 2px #000, 0 0 4px #000; }
.ach-mb .pts{ text-shadow:0 1px 2px #000; }
/* шапка: общий счёт — золото в жёлобе Иероглифов */
.ach-tot{ height:22px; border:0; border-radius:0; overflow:visible; background:none; box-shadow:none; border-image:url(img/ieroglify/zhelob.webp) 30 70 fill / 6px 16px stretch; }
.ach-tot i{ left:10px; top:5px; bottom:5px; max-width:calc(100% - 20px); border-radius:4px; }
.ach-tot i::after{ top:1px; height:3px; }
.ach-tot span{ line-height:22px; }
.ach-head .ctit{ display:flex; align-items:center; gap:5px; }
.ach-head .ctit .aic{ width:24px; height:24px; object-fit:contain; filter:drop-shadow(0 1px 2px #000); }
/* строка — плашка его листа (скарабеи по углам), 9-срезом */
.ach-row{ background:none; border:0; border-radius:0; border-image:url(img/dostizheniya/stroka.webp) 72 75 fill / 17px 18px stretch; padding:7px 14px 7px 12px; margin-bottom:3px; }
.ach-row.open{ border-radius:0; margin-bottom:0; }
.ach-pic{ border:0; border-radius:0; background:none; }
.ach-pic .aic{ width:38px; height:38px; object-fit:contain; filter:drop-shadow(0 2px 2px rgba(0,0,0,.75)); pointer-events:none; }
.ach-pic b{ border-radius:3px; }
.ach-row .nm{ text-shadow:0 1px 2px #000; }
.ach-bar{ height:13px; border:0; border-radius:0; overflow:visible; background:none; border-image:url(img/ieroglify/zhelob.webp) 30 70 fill / 4px 10px stretch; }
.ach-bar i{ left:6px; top:3px; bottom:3px; max-width:calc(100% - 12px); border-radius:3px; }
.ach-bar span{ line-height:13px; }
/* очки — золотой диск, число в тёмной середине (≈ 66 % диаметра) */
.ach-med{ width:46px; height:46px; border-radius:0; background:url(img/dostizheniya/disk.webp) center/100% 100% no-repeat; }
.ach-med div{ width:30px; height:30px; background:none; }
.ach-med b{ font-size:10.5px; } .ach-med small{ font-size:7px; }
/* раскрытая строка — тёмное стекло под плашкой */
.ach-tiles, .ach-solo{ margin:0 10px 4px; background:rgba(10,7,4,.62); border:1px solid rgba(202,164,76,.55); border-top:0; border-radius:0 0 8px 8px; }
.ach-tiles{ padding:8px 10px 8px 26px; }
/* ступени — плитки Иероглифов: взята — золото с крыльями, текущая — открыта и мерцает, дальше — камень с замком */
.ach-tile{ border:0; border-radius:0; overflow:visible; background:url(img/ieroglify/pl-lock.webp) center/100% 100% no-repeat; }
.ach-tile.cur{ background-image:url(img/ieroglify/pl-open.webp); animation:talPulse2 1.6s ease-in-out infinite; }
.ach-tile.on, .ach-tile.new{ background-image:url(img/ieroglify/pl-max.webp); background-size:108% 108%; box-shadow:none; }
.ach-tile.new{ filter:drop-shadow(0 0 6px rgba(95,221,106,.85)); }
.ach-tile .e{ display:grid; place-items:center; width:50%; height:50%; filter:grayscale(1) brightness(.7); opacity:.8; }
.ach-tile .e .aic{ width:100%; height:100%; object-fit:contain; pointer-events:none; }
.ach-tile.cur .e, .ach-tile.on .e, .ach-tile.new .e{ filter:drop-shadow(0 1px 2px rgba(0,0,0,.5)); opacity:1; text-shadow:none; }
.ach-tile .p{ left:15%; top:14%; color:#4a463e; } .ach-tile .th{ bottom:13%; color:#3e3a33; }
.ach-tile.cur .p, .ach-tile.cur .th, .ach-tile.on .p, .ach-tile.on .th{ color:#4a2a0c; text-shadow:0 1px 0 rgba(255,240,200,.5); }
.ach-tile.new .p, .ach-tile.new .th{ color:#1f6a28; }
.ach-tile.on::after, .ach-tile.new::after{ right:12%; bottom:12%; }
/* ВСПЛЫВАШКА — плашка его листа: значок в круглом гнезде слева (центр ≈ 43 px), текст на камне; высота 80 — картинка без растяжки по высоте */
.ach-toast{ width:300px; height:80px; max-height:80px; border:0; border-image:url(img/dostizheniya/toast.webp) 0 40 0 175 fill / 0 20px 0 86px stretch; }
.ach-toast .med{ position:absolute; left:18px; top:15px; width:50px; height:50px; flex:none; border:0; border-radius:50%; background:none; box-shadow:none; font-size:28px; }
.ach-toast .med .aic{ width:44px; height:44px; object-fit:contain; filter:drop-shadow(0 2px 2px rgba(0,0,0,.75)); }
.ach-toast .card{ position:absolute; left:90px; right:18px; top:14px; bottom:12px; width:auto; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none;
display:flex; flex-direction:column; justify-content:center; min-width:0; }
.ach-toast .h{ display:flex; align-items:center; justify-content:space-between; gap:6px; white-space:nowrap; }
.ach-toast .p{ margin-top:0; font-size:9px; line-height:13px; letter-spacing:0; }
.ach-toast .c{ line-height:1.2; }
/* 73-я: 12 медальонов — 2 ряда по 6 (третий ряд не влезал без прокрутки), медальон крупнее */
.ach-gb{ gap:8px 3px; padding:6px 0 0; }
.ach-mb{ width:82px; }
.ach-mb .ring{ width:72px; height:72px; }
/* 73-я: очки ступени — в правом верхнем углу (слева на закрытой плитке замок) */
.ach-tile .p{ left:auto; right:15%; top:14%; font-weight:800; }
.ach-tile .th{ font-weight:900; }
/* 73-я: сетка боссов шире плиток — без бокового отступа, иначе окно прокручивается вбок */
.ach-solo{ margin:0 0 4px; padding:4px 6px 8px 14px; }
/* 73-я: портрет босса (Осада, сетка боссов, всплывашка) — в тёмном круге с золотой каймой; место раскопки — картинкой места */
.aic.port{ border-radius:50%; object-fit:cover; background:radial-gradient(circle at 50% 35%,#4a3820,#120d08 72%); box-shadow:0 0 0 1.5px #c9a24a, 0 2px 4px rgba(0,0,0,.6); }
.aic.mesto{ object-fit:cover; border-radius:6px; box-shadow:0 0 0 1.5px #c9a24a, 0 2px 4px rgba(0,0,0,.6); }
.ach-tile .e:has(.port), .ach-tile .e:has(.mesto){ width:64%; height:64%; }
.ach-toast .med .aic.port{ width:48px; height:48px; }
/* 73-я, его слово «очень плохо цифры видно»: числа ступеней — на тёмных плашках, светлым и крупнее (было тёмным прямо по плитке) */
.ach-tile .p, .ach-tile .th{ background:rgba(12,8,4,.82); border-radius:4px; text-shadow:none; box-shadow:0 0 0 1px rgba(201,162,74,.55); }
.ach-tile .p{ top:9%; right:9%; left:auto; padding:2px 3px; font:800 8.5px/1 'Inter',sans-serif; color:#ffe07a; }
.ach-tile .th{ left:12%; right:12%; bottom:8%; padding:2px 0; font:900 9px/1 ui-monospace,monospace; color:#fff3d0; }
.ach-tile .p, .ach-tile .th,
.ach-tile.cur .p, .ach-tile.cur .th, .ach-tile.on .p, .ach-tile.on .th{ text-shadow:none; }
.ach-tile.on .p, .ach-tile.cur .p{ color:#ffe07a; } .ach-tile.on .th, .ach-tile.cur .th{ color:#fff3d0; }
.ach-tile:not(.on):not(.cur):not(.new) .p, .ach-tile:not(.on):not(.cur):not(.new) .th{ color:#d8d0c0; box-shadow:0 0 0 1px rgba(160,150,135,.5); }
.ach-tile.new .p, .ach-tile.new .th{ color:#8dffa0; box-shadow:0 0 0 1px rgba(95,221,106,.7); }
.ach-tile.on::after, .ach-tile.new::after{ right:6%; bottom:24%; }
/* очки на диске: «/ максимум» светлее и крупнее */
.ach-med b{ font-size:11.5px; text-shadow:0 1px 2px #000; } .ach-med small{ font-size:8px; color:#e8dcc0; }
.ach-row .st{ font-size:8.5px; color:#d8ccb0; }
/* 73-я, его слово «цвета какие-то ядовитые»: взятая плитка — своя копия pl-max без розового ореола; плитки мягче (меньше рыжины);
зелёное «новое» — приглушённый изумруд вместо кислотного */
.ach-tile.on, .ach-tile.new{ background-image:url(img/dostizheniya/pl-max.webp); }
.ach-tile.on, .ach-tile.new, .ach-tile.cur{ filter:saturate(.72) brightness(.9); }
.ach-tile.cur{ animation:none; box-shadow:none; }
.ach-tile.new{ filter:saturate(.72) brightness(.9) drop-shadow(0 0 4px rgba(120,190,130,.6)); }
.ach-tile.on::after, .ach-tile.new::after{ color:#9fd4a6; text-shadow:0 0 2px #000, 0 1px 2px #000; }
.ach-tile.new .p, .ach-tile.new .th{ color:#b8e6bd; box-shadow:0 0 0 1px rgba(120,190,130,.6); }
.ach-dotn{ background:#7fbf88; box-shadow:0 0 4px rgba(127,191,136,.7); }
@keyframes achGlow{ 0%,100%{ box-shadow:0 0 4px rgba(127,191,136,.25); } 50%{ box-shadow:0 0 10px rgba(127,191,136,.55); } }
.ach-toast .h{ color:#9fd4a6; }
/* 73-я, его слово «белые цифры на жёлтом — ничего не видно»: заливка полос темнее (бронза), цифры — белые с чёрной обводкой */
.ach-bar i, .ach-tot i{ background:linear-gradient(#e0b04a,#a87420 55%,#6e4a12); box-shadow:none; }
.ach-tot i::after{ background:rgba(255,240,200,.22); }
.ach-bar{ height:15px; } .ach-bar i{ top:3px; bottom:3px; }
.ach-bar span, .ach-tot span{ color:#fff; font-weight:900;
text-shadow:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 3px #000; }
.ach-bar span{ font-size:8.5px; line-height:15px; }
/* 73-я, его слово «кнопки разными цветами, а то все жёлтые»: «‹ Назад» — синяя, «+» — каменная, «Награда» — рубин, «Забрать» — изумруд (как было) */
.ach-back{ border:0; border-radius:0; background:none; box-shadow:none; border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch;
color:#e4ecff; text-shadow:0 1px 2px #000; }
.ach-plus{ width:22px; height:22px; border:0; border-radius:0; background:none; border-image:url(img/zadaniya/kn-off.webp) 0 40 fill / 0 8px stretch;
color:#f0e0b0; text-shadow:0 1px 2px #000; font-size:14px; }
.ach-rwbtn:not(.take):not(.got){ border:0; border-radius:0; background:none; box-shadow:none; border-image:url(img/klany/kn-net.webp) 0 36 fill / 0 12px stretch;
color:#fff; text-shadow:0 1px 2px #300; }
.ach-rwbtn:not(.take):not(.got)::after{ display:none; }
.ach-rwpop .rw-ok:not(.take){ border:0; border-radius:0; background:none; border-image:url(img/klany/kn-vtor.webp) 0 26 fill / 0 12px stretch; color:#e4ecff; text-shadow:0 1px 2px #000; }
/* 73-я: его выбор Б (синие полосы/кольца) он попробовал и велел вернуть назад («я про кольцо в строках говорил»): полосы — бронза, кольцо медальона — золото, как было.
Оставлено: кольцо вокруг диска очков строки — набрано / максимум (--d из js/26 achRowHTML), золотом */
.ach-med{ position:relative; }
.ach-med::after{ content:""; position:absolute; inset:-3px; border-radius:50%; pointer-events:none;
background:conic-gradient(#ffd96a var(--d,0deg), rgba(0,0,0,.55) 0);
-webkit-mask:radial-gradient(closest-side, transparent 84%, #000 86%); mask:radial-gradient(closest-side, transparent 84%, #000 86%); }
/* ===== 73-я, его слово «цвета разные этих окон, чтобы круто и понятно, что где»: СВОЙ ЦВЕТ У КАЖДОЙ КАТЕГОРИИ — его листы
ui-proba/dostizheniya/list-c-medali.jpg (медальоны) и list-c-stroki1/2.jpg (плашки строк; у Раскопок песчаная середина затемнена —
list-c-stroki2-temn.jpg) → img/dostizheniya/c/m-<кат>.webp и s-<кат>.webp. Камни: Путь воина — рубин, Лига — сапфир, Осада — обсидиан,
Сокровища — золото, Этажи — янтарь, Зал героев — серебро, Клан — изумруд, Раскопки — песчаник, Игры — медь, Книга мёртвых — бирюза,
Безумство — аметист; «События» — прежний камень с замком. Кольца прогресса (медальон, диск очков строки) — в цвет камня (--acc). ===== */
.ach-mb .ring .pr{ background:conic-gradient(var(--acc,#ffd96a) var(--d,0deg), transparent 0);
-webkit-mask:radial-gradient(closest-side, transparent 61.5%, #000 62.5% 67%, transparent 68%); mask:radial-gradient(closest-side, transparent 61.5%, #000 62.5% 67%, transparent 68%); }
.ach-mb .ring .aic{ width:52%; height:52%; }
.ach-mb.hot .ring{ filter:drop-shadow(0 0 6px var(--acc,#ffd96a)); }
.ach-med::after{ background:conic-gradient(var(--acc,#ffd96a) var(--d,0deg), rgba(0,0,0,.55) 0); }
.ach-scroll[data-cat] .ach-row{ border-image-source:url(img/dostizheniya/c/s-gold.webp); border-image-slice:22 88 fill; border-image-width:10px 36px; padding:7px 30px 7px 26px; }
.ach-mb[data-c="fight"]{ --acc:#e0566a; } .ach-mb[data-c="fight"] .ring, .ach-mb.hot[data-c="fight"] .ring{ background-image:url(img/dostizheniya/c/m-fight.webp); }
.ach-scroll[data-cat="fight"]{ --acc:#e0566a; } .ach-scroll[data-cat="fight"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-fight.webp); }
.ach-mb[data-c="league"]{ --acc:#5a8cff; } .ach-mb[data-c="league"] .ring, .ach-mb.hot[data-c="league"] .ring{ background-image:url(img/dostizheniya/c/m-league.webp); }
.ach-scroll[data-cat="league"]{ --acc:#5a8cff; } .ach-scroll[data-cat="league"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-league.webp); }
.ach-mb[data-c="boss"]{ --acc:#e8dcc0; } .ach-mb[data-c="boss"] .ring, .ach-mb.hot[data-c="boss"] .ring{ background-image:url(img/dostizheniya/c/m-boss.webp); }
.ach-scroll[data-cat="boss"]{ --acc:#e8dcc0; } .ach-scroll[data-cat="boss"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-boss.webp); }
.ach-mb[data-c="econ"]{ --acc:#ffd96a; } .ach-mb[data-c="econ"] .ring, .ach-mb.hot[data-c="econ"] .ring{ background-image:url(img/dostizheniya/c/m-econ.webp); }
.ach-scroll[data-cat="econ"]{ --acc:#ffd96a; } .ach-scroll[data-cat="econ"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-econ.webp); }
.ach-mb[data-c="floors"]{ --acc:#ff9a3a; } .ach-mb[data-c="floors"] .ring, .ach-mb.hot[data-c="floors"] .ring{ background-image:url(img/dostizheniya/c/m-floors.webp); }
.ach-scroll[data-cat="floors"]{ --acc:#ff9a3a; } .ach-scroll[data-cat="floors"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-floors.webp); }
.ach-mb[data-c="hero"]{ --acc:#d8e0ea; } .ach-mb[data-c="hero"] .ring, .ach-mb.hot[data-c="hero"] .ring{ background-image:url(img/dostizheniya/c/m-hero.webp); }
.ach-scroll[data-cat="hero"]{ --acc:#d8e0ea; } .ach-scroll[data-cat="hero"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-hero.webp); }
.ach-mb[data-c="clan"]{ --acc:#3fcf7a; } .ach-mb[data-c="clan"] .ring, .ach-mb.hot[data-c="clan"] .ring{ background-image:url(img/dostizheniya/c/m-clan.webp); }
.ach-scroll[data-cat="clan"]{ --acc:#3fcf7a; } .ach-scroll[data-cat="clan"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-clan.webp); }
.ach-mb[data-c="dig"]{ --acc:#e0b878; } .ach-mb[data-c="dig"] .ring, .ach-mb.hot[data-c="dig"] .ring{ background-image:url(img/dostizheniya/c/m-dig.webp); }
.ach-scroll[data-cat="dig"]{ --acc:#e0b878; } .ach-scroll[data-cat="dig"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-dig.webp); }
.ach-mb[data-c="games"]{ --acc:#e8956a; } .ach-mb[data-c="games"] .ring, .ach-mb.hot[data-c="games"] .ring{ background-image:url(img/dostizheniya/c/m-games.webp); }
.ach-scroll[data-cat="games"]{ --acc:#e8956a; } .ach-scroll[data-cat="games"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-games.webp); }
.ach-mb[data-c="misc"]{ --acc:#3fd8d0; } .ach-mb[data-c="misc"] .ring, .ach-mb.hot[data-c="misc"] .ring{ background-image:url(img/dostizheniya/c/m-misc.webp); }
.ach-scroll[data-cat="misc"]{ --acc:#3fd8d0; } .ach-scroll[data-cat="misc"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-misc.webp); }
.ach-mb[data-c="oldschool"]{ --acc:#b878ff; } .ach-mb[data-c="oldschool"] .ring, .ach-mb.hot[data-c="oldschool"] .ring{ background-image:url(img/dostizheniya/c/m-oldschool.webp); }
.ach-scroll[data-cat="oldschool"]{ --acc:#b878ff; } .ach-scroll[data-cat="oldschool"] .ach-row{ border-image-source:url(img/dostizheniya/c/s-oldschool.webp); }
/* 73-я: концы плашки со скарабеями — без растяжки: масштаб ≈ высота строки / высота плашки (72 / 100), края 16 px, концы 63 px; текст отступает за скарабея */
.ach-scroll[data-cat] .ach-row{ border-image-width:16px 63px; padding:7px 46px 7px 44px; }
.ach-scroll[data-cat] .ach-row{ padding:7px 58px 7px 56px; } /* 73-я: «+» и диск очков — не на скарабеях */
.ach-row .st{ text-shadow:0 1px 2px #000, 0 0 3px #000; } /* 73-я: «N / M ступ.» читается и на светлом песчанике Раскопок */
/* 73-я, его слово «появились рамки и не видно цифр»: на плитках ступеней картинка места/портрет — без золотой каймы и меньше, числа — поверх картинки */
.ach-tile .p, .ach-tile .th{ z-index:2; }
.ach-tile::after{ z-index:3; }
.ach-tile .aic.mesto, .ach-tile .aic.port{ box-shadow:none; border-radius:4px; }
.ach-tile .aic.port{ border-radius:50%; }
.ach-tile .e:has(.port), .ach-tile .e:has(.mesto){ width:56%; height:56%; }
/* 73-я, его слово «не пишет, за что даётся достижение»: условие целиком — до двух строк, а не «…» */
.ach-row .cond{ white-space:normal; text-overflow:clip; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.18; font-size:9px; }
/* 73-я, его слово «решай проблемы» (крупные скарабеи жали текст, плашки двух форм): строки — ПРЕЖНЯЯ плашка с маленькими скарабеями в углах,
кайма перекрашена кодом в цвет категории (img/dostizheniya/c/r-<кат>.webp из ui-proba/dostizheniya/kuski/stroka.png; s-<кат> с листов не используются) */
.ach-scroll[data-cat] .ach-row{ border-image-slice:72 75 fill; border-image-width:17px 18px; padding:7px 14px 7px 12px; }
.ach-scroll[data-cat="fight"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-fight.webp); }
.ach-scroll[data-cat="league"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-league.webp); }
.ach-scroll[data-cat="boss"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-boss.webp); }
.ach-scroll[data-cat="econ"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-econ.webp); }
.ach-scroll[data-cat="floors"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-floors.webp); }
.ach-scroll[data-cat="hero"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-hero.webp); }
.ach-scroll[data-cat="clan"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-clan.webp); }
.ach-scroll[data-cat="dig"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-dig.webp); }
.ach-scroll[data-cat="games"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-games.webp); }
.ach-scroll[data-cat="misc"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-misc.webp); }
.ach-scroll[data-cat="oldschool"] .ach-row{ border-image-source:url(img/dostizheniya/c/r-oldschool.webp); }
/* 73-я, его слово «кнопки Награда и Получено — чтобы красиво»: рубиновая «Награда» с закрытым сундуком, «Получено» — изумруд Клана с открытым сундуком (картинки Заданий) */
.ach-row.rw{ grid-template-columns:20px 40px minmax(0,1fr) 96px 54px; }
.ach-rwbtn{ height:28px; display:flex; align-items:center; justify-content:center; gap:3px; }
.ach-rwbtn .rwi{ width:20px; height:20px; object-fit:contain; margin-left:-4px; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); pointer-events:none; }
.ach-rwbtn:not(.take):not(.got){ font-size:9.5px; letter-spacing:.4px; }
.ach-rwbtn.got{ border:0; border-radius:0; background:none; box-shadow:none; border-image:url(img/klany/kn-da.webp) 0 36 fill / 0 12px stretch;
color:#eaffef; text-shadow:0 1px 2px #062010; font-size:9.5px; letter-spacing:.4px; padding:0 6px; }
.ach-rwbtn.got::after{ display:none; }
/* 73-я, его слово «делай это окно»: окно награды Безумства в картинках — рама nagrada (Раскопки/Настройки), ячейки yach (Почта),
значки валют шапки, тотем — маска Безумства, бонусы — значки атак осады, сундук Заданий в заголовке; «Понятно» — синяя, «Забрать» — изумруд */
.ach-rwpop .rwA{ width:480px; padding:6px 10px 8px; border:0 solid transparent; border-width:18px; border-radius:0; background:none;
border-image:url(img/raskopki/nagrada.webp) 50 fill / 18px stretch; box-shadow:0 12px 34px rgba(0,0,0,.85); overflow:visible; }
.ach-rwpop .rwA::before{ opacity:.09; left:50%; top:50%; }
.ach-rwpop .rwA h4{ display:flex; align-items:center; justify-content:center; gap:6px; font-size:15px; }
.ach-rwpop .rwA h4 .rwh{ width:26px; height:26px; object-fit:contain; filter:drop-shadow(0 2px 2px rgba(0,0,0,.7)); }
.ach-rwpop .rwA .sub{ font-size:10px; color:#d8ccb0; margin:2px 0 8px; }
.ach-rwpop .rstep .h{ display:inline-block; padding:2px 10px; border-radius:9px; background:rgba(0,0,0,.55); box-shadow:0 0 0 1px rgba(201,162,74,.6);
font-size:9.5px; color:#ffe07a; }
.ach-rwpop .rstep .h.got{ color:#9fd4a6; box-shadow:0 0 0 1px rgba(120,190,130,.6); }
.ach-rwpop .rcard{ width:96px; min-height:96px; padding:8px 6px 8px; border:0 solid transparent; border-width:12px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/pochta/yach.webp) 30 fill / 12px stretch; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ach-rwpop .rcard .i{ height:38px; display:grid; place-items:center; text-shadow:none; }
.ach-rwpop .rcard .i img{ max-width:40px; max-height:38px; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.7)); }
.ach-rwpop .rcard .n{ font-size:13px; margin-top:3px; color:#fff3c0; }
.ach-rwpop .rcard .t{ font-size:8.5px; color:#d8ccb0; }
.ach-rwpop .rcard.totem{ width:150px; border-image-source:url(img/pochta/yach.webp); background:none; box-shadow:0 0 14px rgba(170,110,255,.45); }
.ach-rwpop .rcard.totem .i img{ max-width:44px; max-height:42px; filter:drop-shadow(0 0 8px rgba(170,110,255,.7)); }
.ach-rwpop .rcard.totem .n{ font-size:11.5px; color:#e8d6ff; }
.ach-rwpop .rcard .bon{ display:flex; flex-direction:column; gap:1px; margin-top:4px; font-size:9px; color:#f0e6ff; }
.ach-rwpop .rcard .bon span{ display:flex; align-items:center; gap:4px; justify-content:center; }
.ach-rwpop .rcard .bon img{ width:15px; height:15px; object-fit:contain; }
.ach-rwpop .rw-mail{ font-size:10px; color:#d8ccb0; margin-top:8px; }
.ach-rwpop .rw-ok{ min-width:130px; height:30px; display:inline-grid; place-items:center; margin-top:8px; font-size:11.5px; letter-spacing:.6px; }
.ach-rwpop .rwA{ overflow:hidden; } /* 73-я: лучи — только внутри рамки */
/* 73-я, его слово «окно чуть меньше»: окно награды Безумства ужато (было 480, ячейки 96/150) */
.ach-rwpop .rwA{ width:410px; padding:2px 8px 4px; border-width:15px; border-image-width:15px; }
.ach-rwpop .rwA h4{ font-size:13px; } .ach-rwpop .rwA h4 .rwh{ width:22px; height:22px; }
.ach-rwpop .rwA .sub{ font-size:9.5px; margin:1px 0 6px; }
.ach-rwpop .rcard{ width:82px; min-height:82px; padding:5px 4px; border-width:10px; border-image-width:10px; }
.ach-rwpop .rcard .i{ height:32px; } .ach-rwpop .rcard .i img{ max-width:34px; max-height:32px; }
.ach-rwpop .rcard .n{ font-size:12px; }
.ach-rwpop .rcard.totem{ width:128px; } .ach-rwpop .rcard.totem .i img{ max-width:38px; max-height:36px; }
.ach-rwpop .rcard.totem .n{ font-size:10.5px; } .ach-rwpop .rcard .bon{ font-size:8.5px; }
.ach-rwpop .rw-mail{ font-size:9.5px; margin-top:6px; }
.ach-rwpop .rw-ok{ min-width:118px; height:27px; margin-top:6px; font-size:11px; }
/* 73-я, его выбор — 2-й вариант тотема «Безумство» (лист ui-proba/dostizheniya/list-totem-bezumie.jpg → img/dostizheniya/totem-bezumie.webp): фигура высокая */
.ach-rwpop .rcard.totem .i{ height:46px; } .ach-rwpop .rcard.totem .i img{ max-width:40px; max-height:46px; }
/* 73-я, его выбор А («выглядит супер»): всплывашка «Достижение получено» в цвет категории — кайма плашки перекрашена кодом
(img/dostizheniya/c/t-<кат>.webp из kuski/toast.png), в гнезде — цветной медальон категории (m-<кат>), значок внутри */
.ach-toast[data-cat] .med{ left:4px; top:0; width:80px; height:80px; background:center/100% 100% no-repeat; border-radius:50%; }
.ach-toast[data-cat] .med .aic{ width:40px; height:40px; }
.ach-toast[data-cat] .med .aic.port{ width:44px; height:44px; }
.ach-toast[data-cat="fight"]{ border-image-source:url(img/dostizheniya/c/t-fight.webp); } .ach-toast[data-cat="fight"] .med{ background-image:url(img/dostizheniya/c/m-fight.webp); }
.ach-toast[data-cat="league"]{ border-image-source:url(img/dostizheniya/c/t-league.webp); } .ach-toast[data-cat="league"] .med{ background-image:url(img/dostizheniya/c/m-league.webp); }
.ach-toast[data-cat="boss"]{ border-image-source:url(img/dostizheniya/c/t-boss.webp); } .ach-toast[data-cat="boss"] .med{ background-image:url(img/dostizheniya/c/m-boss.webp); }
.ach-toast[data-cat="econ"]{ border-image-source:url(img/dostizheniya/c/t-econ.webp); } .ach-toast[data-cat="econ"] .med{ background-image:url(img/dostizheniya/c/m-econ.webp); }
.ach-toast[data-cat="floors"]{ border-image-source:url(img/dostizheniya/c/t-floors.webp); } .ach-toast[data-cat="floors"] .med{ background-image:url(img/dostizheniya/c/m-floors.webp); }
.ach-toast[data-cat="hero"]{ border-image-source:url(img/dostizheniya/c/t-hero.webp); } .ach-toast[data-cat="hero"] .med{ background-image:url(img/dostizheniya/c/m-hero.webp); }
.ach-toast[data-cat="clan"]{ border-image-source:url(img/dostizheniya/c/t-clan.webp); } .ach-toast[data-cat="clan"] .med{ background-image:url(img/dostizheniya/c/m-clan.webp); }
.ach-toast[data-cat="dig"]{ border-image-source:url(img/dostizheniya/c/t-dig.webp); } .ach-toast[data-cat="dig"] .med{ background-image:url(img/dostizheniya/c/m-dig.webp); }
.ach-toast[data-cat="games"]{ border-image-source:url(img/dostizheniya/c/t-games.webp); } .ach-toast[data-cat="games"] .med{ background-image:url(img/dostizheniya/c/m-games.webp); }
.ach-toast[data-cat="misc"]{ border-image-source:url(img/dostizheniya/c/t-misc.webp); } .ach-toast[data-cat="misc"] .med{ background-image:url(img/dostizheniya/c/m-misc.webp); }
.ach-toast[data-cat="oldschool"]{ border-image-source:url(img/dostizheniya/c/t-oldschool.webp); } .ach-toast[data-cat="oldschool"] .med{ background-image:url(img/dostizheniya/c/m-oldschool.webp); }
.ach-toast[data-cat] .med .aic.mesto{ width:46px; height:46px; border-radius:50%; object-fit:cover; box-shadow:none; } /* 73-я: место раскопки — кругом в медальоне */
/* 73-я: картинка тотема Безумства в окне Артефактов (карточка, ячейки тотемов, витрина, «призрак» при перетаскивании) */
.arti-img{ height:1.25em; width:auto; vertical-align:middle; filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)); pointer-events:none; }
.as-art .arti-img, .arti-ghost .arti-img{ height:1.4em; }
/* 74-я: окно Артефактов — фон «сокровищница» его листа (ui-proba/artefakty/list-a.jpg): ниша сверху под витрину, стена снизу под карточки */
.arti-modal{ background:url(img/artefakty/fon.webp) center/100% 100% no-repeat, #1a120b; }
.arti-modal .arti-shelf{ background:none; border:0; box-shadow:none; }
.arti-card .ac-ic{ height:25px; display:flex; align-items:center; justify-content:center; } /* одна высота у эмодзи и картинок — строки карточек не прыгают */
.arti-card .ac-ic .arti-img{ height:25px; }
.totem-cell span .arti-img{ height:1.55em; }
#digModal .dig-right .dig-artl .sock .arti-img{ height:24px; } /* 74-я: Раскопки — значок артефакта в гнезде и в кружке тотема */
#digModal .dig-done .o1 .totr span .arti-img{ height:52px; }
/* 74-я: подставки витрины картинками (js/15 artiPlinthHTML) — по ширине, высота своя; витрина почти прежней высоты */
.arti-modal .arti-slot .as-plinth{ height:auto; margin-top:-3px; pointer-events:none; }
.arti-modal .arti-slot.p1 .as-plinth{ width:78px; } .arti-modal .arti-slot.p1 .as-fig{ height:66px; }
.arti-modal .arti-slot.p2 .as-plinth{ width:66px; } .arti-modal .arti-slot.p2 .as-fig{ height:54px; }
.arti-modal .arti-slot.p3 .as-plinth{ width:56px; } .arti-modal .arti-slot.p3 .as-fig{ height:45px; }
/* 74-я, его слово «топ артефактов чуть больше»: фигура на подставке — по высоте места */
.arti-modal .arti-slot .as-art{ height:100%; display:flex; align-items:flex-end; }
/* его слово «ставит будто за подставку, а не на неё»: фигура ПЕРЕД подставкой и опущена на середину её верхней плиты */
.arti-modal .arti-slot .as-fig{ z-index:2; }
.arti-modal .arti-slot.p1 .as-fig{ margin-bottom:-15px; } .arti-modal .arti-slot.p2 .as-fig{ margin-bottom:-13px; } .arti-modal .arti-slot.p3 .as-fig{ margin-bottom:-11px; }
.arti-modal .arti-slot .as-lock{ margin-bottom:6px; } .arti-modal .arti-slot .as-art .arti-img{ height:100%; }
.arti-modal .arti-slot.p1{ width:96px; } .arti-modal .arti-slot.p2{ width:82px; } .arti-modal .arti-slot.p3{ width:70px; }
/* 73-я: «Задание выполнено» плашкой (js/32 questDoneToast) — значок задания в гнезде, награда значками в строку */
.qw-toast .med img, .qw-toast .med .qw-ik, .qw-toast .med .aic{ width:40px; height:40px; object-fit:contain; border-radius:0; box-shadow:none; }
.qw-toast .med .osk-med, .qw-toast .med > *{ max-width:44px; max-height:44px; }
.qw-toast .c.qw-trw{ display:flex; flex-wrap:wrap; gap:3px 9px; align-items:center; -webkit-line-clamp:unset; font:800 10.5px/1.1 'Inter',sans-serif; color:#fff3c0; margin-top:2px; }
.qw-toast .qw-trw span{ display:inline-flex; align-items:center; gap:3px; }
.qw-toast .qw-trw img{ width:16px; height:16px; object-fit:contain; }
/* 73-я: «Награда за все задания» — награда мельче, чтобы влезла в плашку */
.qw-toast.fin .c.qw-trw{ font-size:9px; gap:1px 6px; } .qw-toast.fin .qw-trw img{ width:13px; height:13px; }
.qw-toast.fin .h{ font-size:7.5px; }
/* 73-я, его слово «все эти надписи сделай нормально»: надпись по центру (showStageMsg, js/05) — плашка строки Достижений,
кайма по смыслу (data-k из цвета надписи: ошибка — рубин, успех — изумруд…), текст светлый с обводкой */
.stage-msg, .stage-msg.over{ width:auto; max-width:78%; padding:9px 26px; border:0; border-radius:0; background:none;
border-image:url(img/dostizheniya/c/r-econ.webp) 72 75 fill / 13px 14px stretch; box-shadow:0 8px 22px rgba(0,0,0,.6);
font-size:13.5px; line-height:1.25; text-shadow:0 1px 2px #000, 0 0 6px rgba(0,0,0,.8); filter:brightness(1.05); }
.stage-msg[data-k="fight"]{ border-image-source:url(img/dostizheniya/c/r-fight.webp); }
.stage-msg[data-k="clan"]{ border-image-source:url(img/dostizheniya/c/r-clan.webp); }
.stage-msg[data-k="oldschool"]{ border-image-source:url(img/dostizheniya/c/r-oldschool.webp); }
.stage-msg[data-k="league"]{ border-image-source:url(img/dostizheniya/c/r-league.webp); }
.stage-msg[data-k="misc"]{ border-image-source:url(img/dostizheniya/c/r-misc.webp); }
.qw-toast.fin{ height:92px; max-height:92px; } .qw-toast.fin .med{ top:21px; } .qw-toast.fin .card{ top:16px; } /* 73-я: награда за все — в два ряда, плашка выше */
.qw-toast.fin .med{ top:16px; }
/* 73-я, его слово «сделай как в героях»: в «Ленте героев» (Рынок → Герои) бонусы — тот же свиток «Благословение», что в окне героев
(hwScrollHTML, js/05; стили .hw-scr в geroi.css); моя первая попытка плашками не влезала у 4 героев из 6 — снята.
«Получен» — изумрудная кнопка Клана с галочкой. */
.bzr-info{ gap:4px; }
.bzr-info .hw-scr{ margin:2px 6px 0; }
.bzr-info .hw-scr .mn span{ font-size:11.5px; } .bzr-info .hw-scr .mn img{ width:16px; height:16px; }
.bzr-info .bzr-end{ margin-top:auto; }
.bzr-done{ height:30px; display:inline-flex; align-items:center; gap:6px; padding:0 20px; border:0; border-radius:0; background:none;
border-image:url(img/klany/kn-da.webp) 0 36 fill / 0 13px stretch; font:900 12.5px Georgia,serif; color:#eaffef; text-shadow:0 1px 2px #062010; margin-bottom:4px; }
/* 73-я: панель героя (heroPanelHTML, js/05) внутри карточки Рынка/Сундуков/Акций — во всю высоту, кнопка прижата вниз справа */
.bzr-info{ padding:0; overflow:hidden; }
.bzr-info .hw-panel{ height:100%; box-sizing:border-box; padding:12px 12px 6px 12px; gap:4px; }
.bzr-info .hw-panel .hw-nmrow{ padding-right:0; }
.bzr-info .hw-panel .hw-acts{ display:flex; justify-content:flex-end; align-items:flex-end; margin-top:auto; }
.bzr-info .hw-panel .bzr-buy{ width:146px; height:52px; }
.bzr-info .hw-panel .bzr-done{ margin-bottom:2px; }
/* 73-я: в карточке Рынка/Сундуков/Акций мощь — в строке звания справа, свиток и кнопка — одной строкой внизу (иначе не влезало у всех) */
.bzr-info .hw-panel .hw-sub .hw-pwi{ margin-left:auto; }
.hw-pbot{ display:flex; align-items:flex-end; gap:8px; margin-top:auto; min-height:0; }
.hw-pbot .hw-scr{ flex:1; min-width:0; margin:0 4px; }
.hw-pbot .hw-acts{ flex:none; margin-top:0; }
.bzr-info .hw-panel .bzr-buy{ width:172px; height:58px; } /* 73-я: цена «30 000» не налезает на «Купить» */
/* 73-я, его слово «чтобы статы не прыгали»: описание в панели героя Рынка/Сундуков/Акций — всегда место под 2 строки (одна строка — просто пустое место ниже) */
.bzr-info .hw-panel .hw-ds{ line-height:1.2; min-height:2.4em; max-height:2.4em; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
/* 73-я, его слово «это окно тоже — как в героях»: карточка «Алтарь» (openDtHero, js/14 — Сундуки, Акции, Рынок, Топ урона):
справа панель окна героев (#dthPanel ← heroPanelHTML), старые «Сила героя» / «Благословение героя» спрятаны; «Купить»/«Инвентарь» — прежние */
.dth-right.panel{ padding:0 0 8px; gap:0; }
.dth-right.panel > .dth-head, .dth-right.panel > .dth-cap, .dth-right.panel > .dth-stats, .dth-right.panel > .dth-bonus{ display:none; }
.dth-right.panel .dth-panel{ flex:1; min-height:0; }
.dth-right.panel .hw-panel{ height:100%; box-sizing:border-box; padding:14px 46px 4px 12px; gap:4px; }
.dth-right.panel .hw-panel .hw-nmrow{ padding-right:0; }
.dth-right.panel .hw-panel .hw-sub .hw-pwi{ margin-left:auto; }
.dth-right.panel .hw-panel .hw-ds{ line-height:1.2; min-height:2.4em; max-height:2.4em; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.dth-right.panel .hw-pbot .hw-acts:empty{ display:none; }
.dth-right.panel .dth-foot, .dth-right.panel .dth-inv{ margin:4px 12px 0; }
/* 73-я: «Купить» в карточке «Алтарь» — кнопка окна героев (kn-up, золото со стрелкой), не хватает — тусклая, очередь — серая с замком, получен — изумруд Клана */
.dth-right.panel .dth-foot{ display:flex; justify-content:flex-end; }
.dth-right.panel .dth-buy{ min-width:170px; height:40px; border:0 solid transparent; border-width:0 21px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/geroi/kn-up.webp) 0 10.5% fill / 0 21px stretch; font:900 14px 'Cinzel',serif; color:#fff6d8; text-shadow:0 1px 2px #000; animation:none; }
.dth-right.panel .dth-buy.no{ filter:saturate(.5) brightness(.8); }
.dth-right.panel .dth-buy.lock{ filter:grayscale(1) brightness(.6); color:#e8e0d0; }
.dth-right.panel .dth-buy.done{ border-width:0 14px; border-image:url(img/klany/kn-da.webp) 0 36 fill / 0 14px stretch; color:#eaffef; text-shadow:0 1px 2px #062010; filter:none; }
/* 73-я: окно «Спасибо за покупку!» (пак Акций / Прочего, js/27 bzPromoBuy) — рама наград Раскопок, открытый сундук с лучами, значок Почты, «Понятно» изумрудом */
.sk-pop.bz-thx{ position:relative; width:340px; padding:58px 18px 12px; border:0 solid transparent; border-width:16px; border-radius:0; background:none; overflow:visible;
border-image:url(img/raskopki/nagrada.webp) 50 fill / 16px stretch; box-shadow:0 12px 34px rgba(0,0,0,.85); text-align:center; }
.bz-thx .bz-thx-i{ position:absolute; left:50%; top:-34px; width:96px; height:96px; margin-left:-48px; object-fit:contain; filter:drop-shadow(0 0 14px rgba(255,210,110,.75)) drop-shadow(0 4px 6px rgba(0,0,0,.6));
animation:bzThxIn .6s cubic-bezier(.2,.9,.3,1.3) both; }
@keyframes bzThxIn{ 0%{ transform:scale(.3) translateY(20px); opacity:0 } 100%{ transform:none; opacity:1 } }
.bz-thx .sk-t{ font:800 17px 'Cinzel',serif; letter-spacing:.04em; color:#ffe08a; text-shadow:0 0 10px rgba(242,211,106,.45), 0 1px 2px #000; }
.bz-thx .sk-s{ display:flex; align-items:center; justify-content:center; gap:7px; margin:6px 0 10px; font-size:11px; color:#e8dcc0; }
.bz-thx .sk-s img{ width:24px; height:24px; object-fit:contain; flex:none; }
.bz-thx .sk-x{ width:170px; height:34px; margin:0 auto; display:grid; place-items:center; border:0 solid transparent; border-width:0 14px; border-radius:0; background:none; box-shadow:none;
border-image:url(img/zadaniya/kn-zabrat.webp) 0 54 fill / 0 14px stretch; font:900 13px 'Cinzel',serif; color:#f2fff4; text-shadow:0 1px 2px #062010; }
.pop-window:has(.bz-thx){ background:none; border:0; box-shadow:none; padding:0; overflow:visible; } /* 73-я: своя рама у «Спасибо за покупку» */
.bz-thx .sk-s{ display:block; } .bz-thx .sk-s img{ display:inline-block; vertical-align:middle; margin:-3px 6px 0 0; width:22px; height:22px; }
.dth-right.panel .hw-pbot{ margin-top:8px; } .dth-right.panel .dth-foot{ margin-top:auto; } /* 73-я: свиток сразу под статами, кнопка внизу */
/* 73-я, его слово «ава героя в письме»: награда «герой целиком» — ячейка шире, ава в кольце цвета звания, имя и звание в две строки */
.ml-rw span.ml-hero{ display:inline-flex; align-items:center; gap:6px; padding:3px 9px 3px 4px; }
.ml-hava{ width:30px; height:30px; flex:none; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px var(--rc,#c9a24a), 0 2px 4px rgba(0,0,0,.6); overflow:hidden; display:inline-block; }
.ml-hava svg{ width:100%; height:100%; }
.ml-htx{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.05; }
.ml-htx b{ font:800 11px 'Cinzel',serif; color:#ffe9a8; } .ml-htx small{ font:700 8.5px 'Inter',sans-serif; text-shadow:0 1px 2px #000; }
.ml-rw span.ml-hero .ml-htx{ border:0; border-image:none; padding:0; background:none; } /* 73-я: внутри ячейки героя — без второй рамки */
/* 73-я: плитки письма с героем целиком (js/19 mailHeroTiles) — ячейки Почты, значок/ава сверху, число или имя под ним */
.ml-rw span.ml-tile{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; width:78px; height:72px; padding:4px 3px;
border:0 solid transparent; border-width:8px; border-image:url(img/pochta/yach.webp) 30 fill / 8px stretch; border-radius:0; background:none; white-space:nowrap; }
.ml-tile .ml-ti{ width:30px; height:30px; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
.ml-tile b{ font:900 12px 'Cinzel',serif; color:#fff3c0; text-shadow:0 1px 2px #000; line-height:1.05; }
.ml-tile small{ font:700 8px 'Inter',sans-serif; color:#d8ccb0; text-shadow:0 1px 2px #000; line-height:1; }
.ml-rw span.ml-tile.hero{ width:96px; }
.ml-tile .ml-tava{ width:38px; height:38px; object-fit:cover; border-radius:6px; display:block; overflow:hidden; filter:drop-shadow(0 1px 3px rgba(0,0,0,.7)); }
.ml-tile .ml-tava svg{ width:100%; height:100%; }
.ml-tile.hero small{ color:#ffd98a; }
.ml-tile .ml-tava{ width:46px; height:46px; } .ml-rw span.ml-tile{ height:80px; }
/* ===== 74-я 19.10.2026: АРТЕФАКТЫ — карточки его рамками и окно артефакта его листом (ui-proba/artefakty/list-ramki.jpg, list-okno.jpg) =====
Карточка (его слово «тотем, чтобы был, и количество на нём»): рамка по состоянию — базальт (не собран), золото (собран), бирюза (на витрине),
значок по центру, внизу в желобке рамки — полоска и счётчик. Картинки с ореолом шире основной (792/821 против 761) — размер фона по ним. */
.arti-modal .arti-grid{ grid-auto-columns:70px; gap:5px; } /* 74-я, его слово «чуть меньше»: было 84×86 */
.arti-modal .arti-card{ height:72px; padding:0; border:0; border-radius:0; box-shadow:none; justify-content:center;
background:url(img/artefakty/k-net.webp) center/100% 100% no-repeat; }
.arti-modal .arti-card.ready{ background:url(img/artefakty/k-gotov.webp) center/108% 108% no-repeat; box-shadow:none; }
.arti-modal .arti-card.on{ background:url(img/artefakty/k-vitrina.webp) center/108% 108% no-repeat; box-shadow:none; }
.arti-modal .arti-card .ac-ic{ position:absolute; left:14%; right:14%; top:11%; height:62%; display:flex; align-items:center; justify-content:center; }
.arti-modal .arti-card .ac-ic .arti-img{ height:100%; max-width:100%; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.8)); }
.arti-modal .arti-card:not(.ready) .ac-ic{ opacity:.82; filter:saturate(.55) brightness(.85); } /* несобранный — цветной, чуть притушен (было почти серое) */
.arti-modal .arti-card.on .ac-ic{ opacity:.6; }
.arti-modal .arti-card.on::after{ top:6px; right:8px; }
.ac-bar{ position:absolute; left:23%; right:23%; bottom:7.5%; height:11%; border-radius:4px; overflow:hidden; background:rgba(0,0,0,.35); }
.ac-bar i{ position:absolute; left:0; top:0; bottom:0; width:var(--p); background:linear-gradient(180deg,#e9c76a,#a8741e); opacity:.75; }
.arti-card.ready .ac-bar i{ background:linear-gradient(180deg,#9df07a,#3f9a2e); }
.ac-bar span{ position:relative; display:block; text-align:center; font:700 8.5px/8.5px 'JetBrains Mono',monospace; color:#fff3d0; text-shadow:0 1px 2px #000, 0 0 3px #000; padding-top:.5px; }
.arti-modal .arti-card.hold::before{ left:14%; right:14%; bottom:3px; }
/* Окно артефакта: рама с нишей слева и тёмной плитой справа; всё раскладывается по долям картинки 2475×1418 */
#totemModal{ width:min(600px,793px); aspect-ratio:2475/1418; height:auto; max-height:none; padding:0; border:0; border-radius:0; box-shadow:none;
background:url(img/artefakty/okno.webp) center/100% 100% no-repeat; display:block; text-align:left; filter:drop-shadow(0 10px 24px rgba(0,0,0,.7)); }
#totemModal .pm-title{ display:none; }
#totemModal .modal-close{ top:13.5%; right:8.2%; z-index:3; }
#totemModal .totem-sub{ position:absolute; inset:0; margin:0; font-size:10.5px; color:#d8c9a8; }
#totemModal .totem-grid{ display:none; }
.tmx-l{ position:absolute; left:6.1%; width:35.3%; top:11.1%; height:78.8%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding-bottom:4%; }
.tmx-fig{ height:48%; display:flex; align-items:flex-end; justify-content:center; position:relative; z-index:1; margin-bottom:-6%; }
.tmx-fig .arti-img{ height:100%; filter:drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
.tmx:not(.gotov) .tmx-fig .arti-img{ filter:saturate(.6) brightness(.9) drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
.tmx-ped{ width:42%; display:block; filter:drop-shadow(0 4px 6px rgba(0,0,0,.6)); }
.tmx-cnt{ margin-top:4px; font:700 13px/1 'JetBrains Mono',monospace; color:#e8d7b0; text-shadow:0 1px 3px #000; }
.tmx-cnt b{ font-size:19px; color:var(--gold-bright); }
.tmx-bar{ width:74%; height:7px; margin-top:4px; border-radius:4px; background:rgba(0,0,0,.55); box-shadow:inset 0 1px 2px #000, 0 0 0 1px rgba(201,162,74,.55); overflow:hidden; }
.tmx-bar i{ display:block; height:100%; width:var(--p); background:linear-gradient(180deg,#f2d27a,#b07a22); }
.tmx.gotov .tmx-bar i{ background:linear-gradient(180deg,#9df07a,#3f9a2e); }
.tmx-ok{ margin-top:4px; font-size:9.5px; line-height:1.2; text-align:center; color:#cdb98e; text-shadow:0 1px 2px #000; padding:0 6%; }
.tmx.gotov .tmx-ok{ color:#9df07a; }
.tmx-r{ position:absolute; left:44%; width:48%; top:14.5%; height:72%; display:flex; flex-direction:column; gap:7px; overflow:hidden; }
.tmx-name{ font:700 22px/1 'Cinzel',serif; color:var(--gold-bright); text-shadow:0 2px 4px #000; letter-spacing:.5px; }
.tmx-h{ font:700 10px/1 'Cinzel',serif; letter-spacing:1.6px; text-transform:uppercase; color:#b89a5a; border-bottom:1px solid rgba(201,162,74,.3); padding-bottom:3px; }
.tmx-bon{ display:flex; gap:6px; flex-wrap:wrap; }
.tmx-w{ display:flex; align-items:center; gap:4px; padding:3px 8px 3px 3px; border-radius:16px; background:rgba(0,0,0,.35); box-shadow:inset 0 0 0 1px rgba(201,162,74,.35); }
.tmx-w img{ width:26px; height:26px; }
.tmx-w span{ font-size:11px; color:#d8c9a8; }
.tmx-w b{ font:700 14px/1 'JetBrains Mono',monospace; color:#9df07a; }
.tmx-src{ display:flex; align-items:center; gap:8px; }
.tmx-pic{ width:52px; height:52px; flex-shrink:0; border-radius:50%; overflow:hidden; background:rgba(0,0,0,.4); box-shadow:inset 0 0 0 2px rgba(201,162,74,.6), 0 2px 5px rgba(0,0,0,.6); display:flex; align-items:center; justify-content:center; }
.tmx-pic img{ width:100%; height:100%; object-fit:cover; }
.tmx-st{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.tmx-st b{ font-size:13.5px; color:#f3e2b8; }
.tmx-st span{ font-size:10.5px; line-height:1.25; color:#bba98a; }
.tmx-st span b{ font-size:10px; color:var(--gold-bright); }
.tmx-modes{ display:flex; gap:5px; }
.tmx-m{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 2px; border-radius:7px; background:rgba(0,0,0,.35); box-shadow:inset 0 0 0 1px rgba(201,162,74,.3); }
.tmx-m span{ font-size:10px; color:#bba98a; }
.tmx-m b{ font:700 14px/1 'JetBrains Mono',monospace; color:#f3e2b8; }
.tmx-m.full{ box-shadow:inset 0 0 0 1px rgba(157,240,122,.6); } .tmx-m.full b{ color:#9df07a; }
.tmx-solo{ display:grid; grid-template-columns:repeat(auto-fill,minmax(46px,1fr)); gap:4px; overflow-y:auto; min-height:0; flex:1; padding-right:2px; }
.tmx-solo .totem-cell.named{ padding:3px 1px 2px; } .tmx-solo .totem-cell span .arti-img{ height:22px; }
/* ===== 74-я 19.10.2026: ЛИГА В КАРТИНКАХ (его листы ui-proba/liga/l1–l5 → img/liga): фон «арена», вкладки-плашки со значками,
медальоны и сундучки лиг, аватарки в золотом круге и герои в рамках званий — как в профиле (его слово «как в профилях стоит круто»),
«слабее / равный / сильнее» у соперников, лишние подписи убраны. Всё под #leagueModal — окно клана берёт те же классы и не трогается. */
#leagueModal{ background:linear-gradient(90deg, rgba(10,6,3,.82) 0, rgba(10,6,3,.7) 17%, rgba(10,6,3,.38) 40%, rgba(10,6,3,.5) 100%), url(img/liga/fon.webp) center/cover no-repeat, #1a120b;
border:2px solid #8a6a32; box-shadow:0 14px 40px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,220,150,.15); }
#leagueModal .lg-side{ border-right:1px solid rgba(201,162,74,.28); }
#leagueModal .lg-side .pm-title{ display:flex; align-items:center; gap:6px; font-size:16px; color:var(--gold-bright); text-shadow:0 2px 4px #000; }
#leagueModal .lg-tic{ width:22px; height:22px; }
#leagueModal .lg-tab{ height:35px; padding:0 6px 0 33%; gap:0; border:0; border-radius:0; background:url(img/liga/tab-off.webp) center/100% 100% no-repeat; color:#d8c9a8; position:relative; text-shadow:0 1px 2px #000; }
#leagueModal .lg-tab.active{ background-image:url(img/liga/tab-on.webp); background-size:107% 107%; color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,190,.6); }
#leagueModal .lg-tab .lt-ic{ position:absolute; left:12%; top:50%; transform:translate(-50%,-50%); width:19px; height:19px; filter:none; }
#leagueModal .lg-tab .lt-ic img{ width:100%; height:100%; object-fit:contain; display:block; }
#leagueModal .lg-tab:not(.active) .lt-ic{ opacity:.85; }
#leagueModal .lg-tab .lt-nm{ font-size:11.5px; }
#leagueModal .lg-tab:hover{ filter:brightness(1.1); }
.lg-rtv{ display:inline-flex; align-items:center; gap:3px; font-family:'JetBrains Mono',monospace; font-weight:700; color:#ffd24a; }
.lg-rtv img{ width:13px; height:13px; }
.lg-vs{ display:inline-block; margin-top:3px; padding:1px 7px; border-radius:9px; font-size:9.5px; font-weight:700; line-height:1.35; }
.lg-vs.weak{ color:#9df07a; background:rgba(60,140,40,.25); box-shadow:inset 0 0 0 1px rgba(157,240,122,.45); }
.lg-vs.even{ color:#ffd24a; background:rgba(150,110,20,.25); box-shadow:inset 0 0 0 1px rgba(255,210,74,.45); }
.lg-vs.strong{ color:#ff8a7a; background:rgba(150,40,30,.28); box-shadow:inset 0 0 0 1px rgba(255,138,122,.5); }
/* аватарка — круг с золотым ободом (как в профиле) */
#leagueModal .lh-av, #leagueModal .lgc-av{ border:0; border-radius:50%; background:none; overflow:visible; }
#leagueModal .lh-av .pf-ava, #leagueModal .lgc-av .pf-ava{ border:2px solid #d8b058; border-radius:50%; box-shadow:0 0 0 1px #000, 0 2px 6px rgba(0,0,0,.6); }
#leagueModal .lh-av{ width:42px; height:42px; }
#leagueModal .lh-av .la-rank{ right:-4px; bottom:-3px; padding:0 3px; border-radius:6px; background:#1a120b; box-shadow:inset 0 0 0 1px #8a6a32; font-size:8.5px; }
/* герои соперника — авы в рамках званий, как в профиле */
#leagueModal .lh-unit{ width:36px; }
#leagueModal .lh-unit .pf-hava{ width:36px; height:36px; border-width:5px 4px 4px 4px; border-image:var(--fr) 38 30 30 30 / 5px 4px 4px 4px stretch; }
#leagueModal .lh-upow{ font-size:8.5px; color:#ffe08a; }
#leagueModal .lh-minis > .lh-mini{ width:36px; height:36px; margin-bottom:11px; background:rgba(0,0,0,.35); border:1px dashed rgba(201,162,74,.3); }
#leagueModal .lh-tp{ font-size:9.5px; color:#bba98a; } #leagueModal .lh-tp b{ font-size:11px; }
/* строки соперников / рейтинга / истории — тёмное стекло с золотой каймой */
#leagueModal .la-row, #leagueModal .lh-row{ background:linear-gradient(180deg, rgba(28,20,12,.78), rgba(14,10,6,.82)); border:1px solid rgba(201,162,74,.35); box-shadow:0 2px 6px rgba(0,0,0,.45); gap:9px; padding:5px 10px; }
#leagueModal .la-row:hover, #leagueModal .lh-row:hover{ border-color:rgba(232,200,120,.7); }
#leagueModal .la-who{ width:108px; }
#leagueModal .lh-nm{ font-size:12px; color:#f3e2b8; }
#leagueModal .la-pts{ width:44px; gap:2px; font-size:11px; }
#leagueModal .la-pts div{ padding:1px 4px; }
#leagueModal .la-go{ background:linear-gradient(180deg,#ffe08a,#c88a24); border:1px solid #6a4510; box-shadow:0 2px 0 #5a3a0c, 0 3px 6px rgba(0,0,0,.5); padding:8px 14px; }
/* шапка «Атаки» и переключатель лиг в «Рейтинге» — медальоны картинками */
#leagueModal .la-head, #leagueModal .lr-head{ border-bottom:1px solid rgba(201,162,74,.3); }
#leagueModal .la-medal .lg-med{ width:42px; height:42px; display:block; filter:drop-shadow(0 2px 4px rgba(0,0,0,.7)); }
#leagueModal .la-mt{ color:#e8d7b0; }
#leagueModal .lr-sw{ padding:0; border:0; opacity:.5; }
#leagueModal .lr-sw .lg-med{ width:34px; height:34px; display:block; }
#leagueModal .lr-sw.active{ opacity:1; filter:drop-shadow(0 0 6px rgba(255,220,120,.8)); transform:scale(1.1); }
#leagueModal .lr-rank{ font-size:13px; }
#leagueModal .lr-row.you{ border-color:#ffd24a; box-shadow:0 0 10px rgba(255,210,74,.35); }
/* «Лиги»: пять колонок — стекло цвета лиги, медальон, имя, правило, бонус, «Ты», сундучок */
#leagueModal .lgc-col{ background:linear-gradient(180deg, color-mix(in srgb, var(--mc2) 45%, transparent), rgba(10,7,4,.82) 60%); border:1px solid color-mix(in srgb, var(--mc) 60%, transparent); border-radius:12px; padding-top:9px; }
#leagueModal .lgc-col.here{ border-color:#ffd24a; box-shadow:0 0 14px rgba(255,210,74,.35), inset 0 0 20px rgba(255,210,74,.08); }
#leagueModal .lgc-mimg{ width:58px; height:58px; filter:drop-shadow(0 3px 5px rgba(0,0,0,.7)); }
#leagueModal .lgc-name{ font-family:'Cinzel',serif; font-weight:800; font-size:11px; color:var(--mc); text-shadow:0 1px 3px #000; }
#leagueModal .lgc-av{ width:40px; height:40px; }
#leagueModal .lgc-nm{ font-weight:700; color:#f3e2b8; }
#leagueModal .lgc-chest{ background:none; border:0; padding:0; box-shadow:none; }
#leagueModal .lgc-chest .lgc-ch{ width:54px !important; filter:drop-shadow(0 3px 5px rgba(0,0,0,.7)); }
/* «История»: вкладки — те же плашки, что слева */
#leagueModal .lh-tab{ height:32px; padding:0 0 0 8%; border:0; border-radius:0; background:url(img/liga/tab-off.webp) center/100% 100% no-repeat; color:#d8c9a8; font-weight:700; text-shadow:0 1px 2px #000; }
#leagueModal .lh-tab.active{ background-image:url(img/liga/tab-on.webp); color:#3a1f08; text-shadow:0 1px 0 rgba(255,235,190,.6); }
#leagueModal .lh-tab img{ width:17px; height:17px; }
#leagueModal .lh-score{ width:52px; flex:0 0 auto; text-align:center; font:700 15px/1 'JetBrains Mono',monospace; color:#f3e2b8; }
#leagueModal .lh-row .lh-who{ flex:1; min-width:0; }
#leagueModal .lh-res{ width:96px; font-size:13px; }
#leagueModal .lh-res .lh-time{ font-size:9.5px; }
#leagueModal .lh-tab{ position:relative; padding-left:12%; }
#leagueModal .lh-tab img{ position:absolute; left:12%; top:50%; transform:translate(-50%,-50%); width:18px; height:18px; }
#leagueModal .la-list > .lr-row:nth-child(1) .lr-rank{ color:#ffd24a; font-size:16px; text-shadow:0 0 8px rgba(255,210,74,.6); }
#leagueModal .la-list > .lr-row:nth-child(2) .lr-rank{ color:#e2e8f0; font-size:15px; }
#leagueModal .la-list > .lr-row:nth-child(3) .lr-rank{ color:#e09a5a; font-size:15px; }
/* «Защита» в общем стиле окна: тёмное стекло с золотой каймой, значок щита его листа, подсказки серым мельче */
#leagueModal .lgd-line{ background:linear-gradient(180deg, rgba(28,20,12,.8), rgba(14,10,6,.85)); border:1px solid rgba(201,162,74,.45); box-shadow:0 2px 8px rgba(0,0,0,.5); }
#leagueModal .ar-lhead{ display:flex; align-items:center; justify-content:center; gap:5px; color:#ffd24a; }
#leagueModal .lgd-ic{ width:16px; height:16px; }
#leagueModal .lgd-sub{ font-size:9px; color:#9c8f7a; }
#leagueModal .lgd-rh{ color:#e8d7b0; }
/* 74-я, второй заход по его скринам: герои крупнее, сила под рейтингом, стрелки вместо «1–25 выше / 76–100 ниже», шапка рейтинга читается,
медальоны с подписью, «Защита» авами, окно героя по нажатию, окно сундучка в картинках */
#leagueModal .lh-unit{ width:46px; cursor:pointer; }
#leagueModal .lh-unit .pf-hava{ width:46px; height:46px; border-width:6px 5px 5px 5px; border-image:var(--fr) 38 30 30 30 / 6px 5px 5px 5px stretch; transition:transform .12s; }
#leagueModal .lh-unit:hover .pf-hava{ transform:translateY(-2px) scale(1.05); }
#leagueModal .lh-minis{ gap:4px; }
#leagueModal .lh-minis > .lh-mini{ width:46px; height:46px; }
#leagueModal .lh-upow{ font-size:9px; }
#leagueModal .la-who{ width:118px; display:flex; flex-direction:column; align-items:flex-start; gap:1px; }
.lg-vs{ display:inline-flex; align-items:center; gap:4px; margin-top:2px; padding:1px 7px; border-radius:9px; font-size:9px; font-weight:700; line-height:1.4; color:#e8d7b0; background:rgba(0,0,0,.4); box-shadow:inset 0 0 0 1px rgba(201,162,74,.4); }
.lg-vs b{ font:700 11px/1 'JetBrains Mono',monospace; color:#ffe08a; }
.lg-vs.weak b{ color:#9df07a; } .lg-vs.even b{ color:#ffd24a; } .lg-vs.strong b{ color:#ff8a7a; }
/* стрелки лиги: вверх — зелёная (лучшие 25 идут выше), вниз — красная (последние 25 ниже); числа — в подсказке */
#leagueModal .lgc-arr{ display:flex; gap:6px; justify-content:center; min-height:12px; }
#leagueModal .lgc-arr span{ width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; filter:drop-shadow(0 1px 2px #000); }
#leagueModal .lgc-arr .up{ border-bottom:10px solid #6ee07a; } #leagueModal .lgc-arr .dn{ border-top:10px solid #ff6a5a; }
/* шапка рейтинга: название слева (читается на любом фоне), медальоны с подписью справа */
#leagueModal .lr-head{ justify-content:space-between; padding:2px 4px 6px; margin-bottom:6px; }
#leagueModal .lr-mid{ flex:1; min-width:0; }
#leagueModal .lr-title{ font:800 16px/1.1 'Cinzel',serif; color:#fff3d6; text-shadow:0 0 1px #000, 0 2px 4px #000, 0 0 10px color-mix(in srgb, var(--lc) 70%, transparent); letter-spacing:.5px; }
#leagueModal .lr-sub{ margin-top:3px; font-size:10px; color:#d8c9a8; text-shadow:0 1px 2px #000; }
#leagueModal .lr-you{ margin-left:6px; padding:0 6px; border-radius:8px; background:rgba(255,210,74,.18); color:#ffd24a; font-weight:700; }
#leagueModal .lr-sw-row{ gap:4px; }
#leagueModal .lr-sw{ display:flex; flex-direction:column; align-items:center; gap:1px; width:50px; opacity:.55; }
#leagueModal .lr-sw span{ font-size:8.5px; font-weight:700; color:#e8d7b0; text-shadow:0 1px 2px #000; white-space:nowrap; }
#leagueModal .lr-sw.active{ opacity:1; transform:none; } #leagueModal .lr-sw.active .lg-med{ filter:drop-shadow(0 0 6px rgba(255,220,120,.85)); transform:scale(1.1); }
#leagueModal .lr-sw.active span{ color:#ffd24a; }
/* «Защита» */
#leagueModal .lgd-wrap{ gap:8px; }
#leagueModal .lgd-top{ padding:5px 10px 6px; border-radius:12px; background:linear-gradient(180deg, rgba(40,28,14,.85), rgba(14,10,6,.88)); border:1px solid rgba(201,162,74,.55); box-shadow:0 2px 8px rgba(0,0,0,.55); }
#leagueModal .lgd-h{ display:flex; align-items:center; justify-content:center; gap:6px; font:800 13px/1 'Cinzel',serif; color:#ffd24a; text-shadow:0 2px 3px #000; margin-bottom:5px; }
#leagueModal .lgd-h img{ width:18px; height:18px; }
#leagueModal .lgd-sum{ margin-left:8px; font:400 10px/1 Inter,sans-serif; color:#d8c9a8; } #leagueModal .lgd-sum b{ font:700 12px/1 'JetBrains Mono',monospace; color:#ffe08a; }
#leagueModal .lgd-warn{ font:700 9.5px/1 Inter,sans-serif; color:#ff8a7a; }
#leagueModal .lgd-slots{ display:flex; justify-content:center; gap:14px; }
#leagueModal .lgd-slot, #leagueModal .lgd-pick{ position:relative; display:flex; flex-direction:column; align-items:center; cursor:pointer; }
#leagueModal .lgd-slot .pf-hava{ width:62px; height:62px; }
#leagueModal .lgd-slot.empty{ width:62px; height:62px; margin-bottom:13px; border-radius:8px; border:2px dashed rgba(201,162,74,.45); background:rgba(0,0,0,.35); justify-content:center; }
#leagueModal .lgd-plus{ font-size:26px; color:rgba(201,162,74,.6); }
#leagueModal .lgd-n{ position:absolute; left:-4px; top:-4px; z-index:2; width:16px; height:16px; border-radius:50%; background:linear-gradient(180deg,#ffe08a,#c88a24); color:#2a1806; font:800 10px/16px 'JetBrains Mono',monospace; text-align:center; box-shadow:0 1px 3px #000; }
#leagueModal .lgd-pw{ margin-top:1px; font:700 9.5px/1.2 'JetBrains Mono',monospace; color:#ffe08a; text-shadow:0 1px 2px #000; }
#leagueModal .lgd-roster{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(2,auto); grid-auto-columns:56px; gap:4px 6px; overflow-x:auto; overflow-y:hidden; padding:4px 2px 6px; min-height:0; }
#leagueModal .lgd-pick .pf-hava{ width:50px; height:50px; border-width:7px 6px 6px 6px; border-image:var(--fr) 38 30 30 30 / 7px 6px 6px 6px stretch; }
#leagueModal .lgd-pick.in{ opacity:.55; }
#leagueModal .lgd-pick:hover .pf-hava, #leagueModal .lgd-slot:hover .pf-hava{ transform:translateY(-2px); }
/* окно героя соперника */
.lgh-win{ padding:12px 16px; border-radius:14px; background:linear-gradient(180deg,#2a1d10,#140d06); border:2px solid #b08a4a; box-shadow:0 12px 30px rgba(0,0,0,.8), inset 0 0 0 1px rgba(255,220,150,.15); }
.lgh-pop{ display:flex; gap:14px; align-items:center; }
.lgh-l .pf-hava{ width:110px; height:110px; }
.lgh-r{ display:flex; flex-direction:column; gap:3px; min-width:170px; }
.lgh-nm{ font:800 17px/1.1 'Cinzel',serif; color:#fff3d6; text-shadow:0 2px 3px #000; }
.lgh-rk{ font-weight:800; font-size:12px; text-shadow:0 1px 2px #000; }
.lgh-row{ display:flex; align-items:center; gap:8px; }
.lgh-lv{ font-size:11px; color:#d8c9a8; } .lgh-lv b{ font:700 13px/1 'JetBrains Mono',monospace; color:#fff3d6; }
.lgh-row .lg-stars{ display:flex; gap:1px; } .lgh-row .lg-stars svg{ width:13px; height:13px; }
.lgh-pw{ display:flex; align-items:center; gap:5px; font-size:11px; color:#d8c9a8; } .lgh-pw img{ width:18px; height:18px; } .lgh-pw b{ font:700 15px/1 'JetBrains Mono',monospace; color:#ffd24a; }
.lgh-sts{ display:grid; grid-template-columns:1fr 1fr; gap:4px 10px; margin-top:4px; }
.lgh-st{ display:flex; align-items:center; gap:4px; font-size:10px; color:#bba98a; } .lgh-st img{ width:16px; height:16px; } .lgh-st b{ margin-left:auto; font:700 11px/1 'JetBrains Mono',monospace; color:#f3e2b8; }
/* окно сундучка лиги */
.lcp-win{ padding:12px 18px 14px; min-width:250px; border-radius:14px; background:linear-gradient(180deg,#2a1d10,#140d06); border:2px solid #b08a4a; box-shadow:0 12px 30px rgba(0,0,0,.8), inset 0 0 0 1px rgba(255,220,150,.15); }
.lcp-box .lcp-tch{ display:flex; flex-direction:column; align-items:center; gap:2px; margin-bottom:8px; }
.lcp-box .lcp-tch span{ font:800 15px/1 'Cinzel',serif; color:var(--mc); text-shadow:0 2px 3px #000; }
.lcp-box .lcp-tch .lgc-ch{ filter:drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
.lcp-box .lcp-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:5px 8px; margin-top:4px; border-radius:8px; background:rgba(0,0,0,.35); box-shadow:inset 0 0 0 1px rgba(201,162,74,.3); }
.lcp-box .lcp-row span{ display:flex; align-items:center; gap:7px; font-size:12px; color:#e8d7b0; }
.lcp-box .lcp-row img{ width:22px; height:22px; }
.lcp-box .lcp-row b{ font:700 14px/1 'JetBrains Mono',monospace; color:#9df07a; }
.pop-window.lgh-win{ width:auto; max-width:92%; max-height:none; overflow:visible; }
.pop-window.lcp-win{ width:auto; max-width:90%; max-height:none; overflow:visible; }
#leagueModal .lgd-roster{ scrollbar-width:thin; scrollbar-color:#8a6a32 transparent; }
#leagueModal .lgd-roster::-webkit-scrollbar{ height:4px; } #leagueModal .lgd-roster::-webkit-scrollbar-thumb{ background:#8a6a32; border-radius:2px; } #leagueModal .lgd-roster::-webkit-scrollbar-track{ background:rgba(0,0,0,.3); }
/* 74-я, третий заход по его скринам */
/* ава игрока в строке — на всю высоту строки */
#leagueModal .lh-av{ width:56px; height:56px; }
#leagueModal .lh-av .la-rank{ font-size:9px; right:-5px; bottom:-2px; }
#leagueModal .la-row, #leagueModal .lh-row{ min-height:66px; }
.lg-vs{ gap:3px; padding:1px 7px 1px 4px; } .lg-vs img{ width:13px; height:13px; } .lg-vs b{ color:#ffe08a; }
/* «Защита» на всю высоту: пятёрка крупно, герои — два ряда крупнее */
#leagueModal .lgd-wrap{ height:100%; gap:6px; }
#leagueModal .lgd-top{ flex:0 0 auto; }
#leagueModal .lgd-slots{ gap:18px; }
#leagueModal .lgd-slot .pf-hava{ width:80px; height:80px; }
#leagueModal .lgd-slot.empty{ width:80px; height:80px; margin-bottom:14px; }
#leagueModal .lgd-roster{ flex:1 1 auto; grid-template-rows:repeat(2,1fr); grid-auto-columns:76px; gap:2px 8px; align-content:center; }
#leagueModal .lgd-pick .pf-hava{ width:68px; height:68px; border-width:9px 7px 7px 7px; border-image:var(--fr) 38 30 30 30 / 9px 7px 7px 7px stretch; }
#leagueModal .lgd-pw{ font-size:10.5px; }
#leagueModal .lgd-n{ width:19px; height:19px; font-size:11px; line-height:19px; }
/* колонки лиг: награда недели значками */
#leagueModal .lgc-bh{ margin-top:2px; }
#leagueModal .lgc-rws{ width:100%; display:flex; flex-direction:column; gap:2px; }
#leagueModal .lgc-rw{ display:flex; align-items:center; justify-content:space-between; padding:1px 6px 1px 3px; border-radius:7px; background:rgba(0,0,0,.35); }
#leagueModal .lgc-rw img{ width:16px; height:16px; }
#leagueModal .lgc-rw b{ font:700 10.5px/1.3 'JetBrains Mono',monospace; color:#9df07a; }
#leagueModal .lgc-you{ margin-bottom:4px; }
#leagueModal .lgc-av{ width:36px; height:36px; }
#leagueModal .lgc-chest .lgc-ch{ width:48px !important; }
/* окно сундучка: рама Раскопок, сзади свечение цвета лиги, строки тёплые */
.pop-window.lcp-win{ background:radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--lcp, #c9a24a) 45%, transparent), transparent 55%), linear-gradient(180deg,#2c1f12,#150e07);
border:12px solid transparent; border-image:url(img/raskopki/nagrada.webp) 46 46 46 46 / 12px stretch; border-radius:0; padding:10px 16px 12px; }
.lcp-box .lcp-row{ background:linear-gradient(180deg, rgba(120,84,36,.55), rgba(60,40,16,.6)); box-shadow:inset 0 0 0 1px rgba(232,200,120,.45), 0 1px 3px rgba(0,0,0,.5); }
.lcp-box .lcp-row span{ color:#fff3d6; text-shadow:0 1px 2px #000; }
#leagueModal .lgc-col{ gap:3px; padding-top:7px; }
#leagueModal .lgc-mimg{ width:50px; height:50px; }
#leagueModal .lgc-rws{ gap:1px; } #leagueModal .lgc-rw{ padding:0 6px 0 3px; }
#leagueModal .lgc-av{ width:32px; height:32px; } #leagueModal .lgc-you{ margin-bottom:2px; gap:0; }
#leagueModal .lgc-chest .lgc-ch{ width:44px !important; }
/* ===== 74-я: ОКНО АТАКИ И БОЙ ЛИГИ — его листы ui-proba/liga/a1–a4 → img/arena: фон арены, плашки команд (соперник красная, ты золотая),
кости и знак схватки, кнопки «Атаковать / Пропустить / Забрать», венки мест 1–3; карты героев — авы в рамках званий ===== */
#arenaModal, #battleModal{ background:linear-gradient(180deg, rgba(8,5,3,.35), rgba(8,5,3,.55)), url(img/arena/fon.webp) center/cover no-repeat, #1a120b;
border:2px solid #8a6a32; box-shadow:0 14px 40px rgba(0,0,0,.75), inset 0 0 0 1px rgba(255,220,150,.15); }
/* плашки команд: слева гнездо со значком — 9-срез, гнездо не плющится */
#arenaModal .ar-line{ border:0; border-radius:0; background:none; padding:4px 18px 4px 0; border-style:solid; border-color:transparent; }
#arenaModal .ar-line.en{ border-image:url(img/arena/pl-en.webp) 0 50 0 175 fill / 0 16px 0 64px stretch; border-width:0 16px 0 64px; }
#arenaModal .ar-line.my{ border-image:url(img/arena/pl-my.webp) 0 50 0 175 fill / 0 16px 0 64px stretch; border-width:0 16px 0 64px; }
#arenaModal .ar-lhead{ display:flex; align-items:center; gap:6px; font-size:12px; color:#ffd8c8; text-shadow:0 1px 2px #000; }
#arenaModal .ar-line.my .ar-lhead{ color:#ffe08a; }
#arenaModal .ar-hrow .ar-tp{ overflow:visible; }
/* карты героев: ава в рамке звания */
#arenaModal .ar-card{ border:0; border-radius:0; overflow:visible; background:none; width:var(--arc); height:var(--arc); }
#arenaModal .ar-card .pf-hava{ width:100%; height:100%; border-width:6px 5px 5px 5px; border-image:var(--fr) 38 30 30 30 / 6px 5px 5px 5px stretch; }
#arenaModal .ar-cards .ar-card, #arenaModal .ar-cards .ar-unit{ width:54px; height:auto; } #arenaModal .ar-cards .ar-card{ height:54px; }
#arenaModal .ar-card.hit .pf-hava{ filter:drop-shadow(0 0 8px rgba(255,220,120,.95)); }
#arenaModal .ar-card.pick.in{ box-shadow:none; } #arenaModal .ar-card.pick.in .pf-hava{ filter:drop-shadow(0 0 6px rgba(126,224,160,.9)); opacity:.6; }
#arenaModal .ar-card.empty{ border:2px dashed rgba(201,162,74,.45); border-radius:8px; background:rgba(0,0,0,.35); }
#arenaModal .ar-cnum{ z-index:2; left:-3px; top:-3px; border-radius:50%; width:15px; height:15px; padding:0; text-align:center; line-height:15px; background:linear-gradient(180deg,#ffe08a,#c88a24); box-shadow:0 1px 3px #000; }
#arenaModal .ar-pow{ font-size:9.5px; }
#arenaModal .ar-roster{ --arc:48px; scrollbar-color:#8a6a32 transparent; }
/* «Рандом» */
#arenaModal .ar-roll{ background:linear-gradient(180deg, rgba(28,20,12,.85), rgba(14,10,6,.88)); border:1px solid rgba(201,162,74,.5); }
#arenaModal .ar-rt{ display:flex; align-items:center; gap:6px; color:#ffd24a; font-size:13px; }
#arenaModal .ar-rt img{ width:26px; height:24px; }
#arenaModal .ar-rx{ color:#cdb98e; }
#arenaModal .ar-pvs img{ width:20px; height:20px; display:block; }
#arenaModal .ar-die.my{ background:linear-gradient(180deg,#f3e2b8,#c8a86a); border:1px solid #6a4a1a; color:#3a2410; }
#arenaModal .ar-die.en{ background:linear-gradient(180deg,#e8b0a0,#a05040); border:1px solid #5a1a10; color:#2a0a04; }
/* кнопки его листа */
#arenaModal .ar-atk-btn{ height:46px; padding:0; border:0; border-radius:0; background:url(img/arena/kn-atk.webp) center/100% 100% no-repeat; color:#fff3d6; font-size:15px; text-shadow:0 2px 3px #000, 0 0 8px rgba(255,120,40,.6); box-shadow:none; }
#battleModal .bt-skip{ height:40px; padding:0; border:0; border-radius:0; background:url(img/arena/kn-skip.webp) center/100% 100% no-repeat; color:#e8d7b0; text-shadow:0 1px 2px #000; flex:0 0 200px; margin:0 auto; }
#battleModal .bt-close{ height:42px; padding:0; border:0; border-radius:0; background:url(img/arena/kn-take.webp) center/100% 100% no-repeat; color:#fff; text-shadow:0 2px 3px #000; flex:0 0 200px; margin:0 auto; }
/* «Рейтинг»: места 1–3 в венке */
#leagueModal .lr-wreath{ width:38px; height:34px; display:flex; align-items:center; justify-content:center; background:var(--wr) center/contain no-repeat; font:800 14px/1 'Cinzel',serif; color:#fff3d6 !important; text-shadow:0 1px 3px #000, 0 0 6px #000 !important; }
/* бой: стороны без синевы, знак схватки, карта — ава в рамке звания, статы значками */
#battleModal .bt-head{ color:#ffd24a; text-shadow:0 2px 4px #000; }
#battleModal .bt-side{ background:linear-gradient(180deg, rgba(28,20,12,.8), rgba(14,10,6,.85)); border:1px solid rgba(201,162,74,.5); }
#battleModal .bt-side.en{ border-color:rgba(200,80,60,.6); }
#battleModal .bt-lbl{ text-align:center; font:800 12px/1 'Cinzel',serif; text-shadow:0 1px 2px #000; }
#battleModal .bt-lbl.my{ color:#ffe08a; } #battleModal .bt-lbl.en{ color:#ff9a8a; }
#battleModal .bt-vs img{ width:58px; height:58px; display:block; filter:drop-shadow(0 3px 8px rgba(0,0,0,.8)); }
#battleModal .bt-card{ width:132px; background:none; border:0; padding:0; }
#battleModal .bt-cport{ background:none; overflow:visible; border-radius:0; }
#battleModal .bt-cport .pf-hava{ width:100%; height:100%; }
#battleModal .bt-cpow{ display:flex; align-items:center; justify-content:center; gap:4px; margin-top:3px; }
#battleModal .bt-cpow img{ width:16px; height:16px; }
#battleModal .bt-cpow .ar-clvl{ position:static; transform:none; font-size:12px; padding:2px 7px; }
#battleModal .bt-cst{ display:flex; justify-content:center; gap:6px; font-size:9.5px; color:#e8d7b0; }
#battleModal .bt-cst span{ display:inline-flex; align-items:center; gap:2px; }
#battleModal .bt-cst img{ width:13px; height:13px; }
#battleModal .bt-chp{ height:14px; border-radius:7px; background:#2a0c08; border:1px solid #8a6a32; }
#battleModal .bt-card.my .bt-chpfill{ background:linear-gradient(180deg,#b8f080,#4aa02e); } #battleModal .bt-card.en .bt-chpfill{ background:linear-gradient(180deg,#ff9a7a,#c0302a); }
#battleModal .bt-card.bt-hurt{ box-shadow:none; } #battleModal .bt-card.bt-hurt .pf-hava{ filter:drop-shadow(0 0 10px rgba(255,64,48,.95)); }
#battleModal .bt-score{ display:flex; justify-content:center; align-items:center; gap:10px; font-size:24px; text-shadow:0 2px 4px #000; }
#battleModal .bt-score span{ color:#e8d7b0; }
#battleModal .ar-res{ display:flex; align-items:center; justify-content:center; gap:12px; font:800 18px/1 'Cinzel',serif; text-shadow:0 2px 4px #000; }
#battleModal .ar-res.win .ar-rw{ color:#ffd24a; } #battleModal .ar-res.lose .ar-rw{ color:#ff8a7a; }
#battleModal .ar-rd{ font:700 16px/1 'JetBrains Mono',monospace; } #battleModal .ar-res.win .ar-rd{ color:#9df07a; } #battleModal .ar-res.lose .ar-rd{ color:#ff8a7a; }
#arenaModal .ar-line{ padding:7px 18px 7px 0; gap:1px; }
#arenaModal .ar-lines{ gap:3px; }
#arenaModal .ar-cards .ar-card{ width:50px; height:50px; } #arenaModal .ar-cards .ar-unit{ width:50px; }
#arenaModal .ar-roster{ --arc:46px; gap:3px 5px; }
#arenaModal .ar-line{ padding:12px 18px 11px 0; }
#arenaModal .ar-hrow{ line-height:1; }
#arenaModal .ar-cards .ar-card{ width:44px; height:44px; } #arenaModal .ar-cards .ar-unit{ width:46px; }
#arenaModal .ar-cards{ gap:10px; }
#arenaModal .ar-roster{ --arc:44px; }
#battleModal .ar-res{ background:none; border:0; box-shadow:none; padding:2px 0; }
#battleModal .ar-res .lg-rtv{ font-size:14px; } #battleModal .ar-res .lg-rtv img{ width:16px; height:16px; }
#battleModal .bt-duel{ position:relative; }
#battleModal .bt-score{ min-height:30px; }
#battleModal .bt-result:not(:empty) ~ .bt-foot{ margin-top:0; }
#battleModal .bt-result:not(:empty){ margin-top:-34px; position:relative; z-index:1; }
#battleModal .bt-result:not(:empty) .ar-res{ background:linear-gradient(90deg, transparent, rgba(10,6,3,.92) 20%, rgba(10,6,3,.92) 80%, transparent); padding:6px 0; }
/* 74-я: итог боя — лента его листа (img/arena/lenta-win / lenta-lose) поверх пары, под ней очки и рейтинг */
#battleModal .bt-result:not(:empty){ margin:0; position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); z-index:5; pointer-events:none; }
#battleModal .bt-result:not(:empty) .ar-res{ display:flex; flex-direction:column; align-items:center; gap:0; background:none; padding:0; animation:arLenta .55s cubic-bezier(.2,1.4,.4,1) both; }
@keyframes arLenta{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:scale(1); } }
#battleModal .ar-lenta{ position:relative; width:330px; }
#battleModal .ar-lenta img{ width:100%; display:block; filter:drop-shadow(0 6px 14px rgba(0,0,0,.8)); }
#battleModal .ar-lenta .ar-rw{ position:absolute; left:0; right:0; text-align:center; transform:translateY(-50%); font:800 26px/1 'Cinzel',serif; letter-spacing:1px; }
#battleModal .ar-res.win .ar-lenta .ar-rw{ top:55%; color:#5a2a04; text-shadow:0 1px 0 rgba(255,240,190,.7); }
#battleModal .ar-res.lose .ar-lenta .ar-rw{ top:47.5%; color:#e8d7c8; text-shadow:0 2px 3px #000; font-size:22px; }
#battleModal .ar-rline{ display:flex; align-items:center; gap:10px; margin-top:-8px; padding:4px 14px; border-radius:12px; background:rgba(10,6,3,.88); box-shadow:inset 0 0 0 1px rgba(201,162,74,.5), 0 3px 8px rgba(0,0,0,.6); }
/* 74-я, его скрин «подправь цифры»: цифра в венке крупнее, по центру кольца, цвет места и чёрная обводка — читается на любом венке */
#leagueModal .lr-wreath{ width:40px; height:36px; padding-bottom:3px; box-sizing:border-box; font:900 17px/1 'Cinzel',serif !important;
-webkit-text-stroke:3px #120a04; paint-order:stroke fill; text-shadow:0 2px 3px rgba(0,0,0,.9) !important; }
#leagueModal .la-list > .lr-row:nth-child(1) .lr-wreath{ color:#ffe27a !important; }
#leagueModal .la-list > .lr-row:nth-child(2) .lr-wreath{ color:#f2f6fb !important; }
#leagueModal .la-list > .lr-row:nth-child(3) .lr-wreath{ color:#ffb36a !important; }
/* 74-я, его слово «это окно красивее»: бирка контры — плашка его листа Раскопок (raskopki/plashka), крупное «+30%» золотом, ниже кто кого бьёт */
#battleModal .bt-bufftag{ top:-24px; padding:5px 16px 6px; min-width:122px; border:0; border-radius:0; background:url(img/raskopki/plashka.webp) center/100% 100% no-repeat;
box-shadow:none; filter:drop-shadow(0 0 8px rgba(255,200,80,.7)) drop-shadow(0 3px 5px rgba(0,0,0,.8)); color:#fff3d6; text-align:center; }
#battleModal .bt-bufftag b{ display:block; font:900 17px/1 'Cinzel',serif; color:#ffd24a; text-shadow:0 0 8px rgba(255,190,60,.8), 0 2px 2px #000; }
#battleModal .bt-bufftag small{ margin-top:2px; font:700 9px/1.1 Inter,sans-serif; color:#e8d7b0; text-shadow:0 1px 2px #000; }
#battleModal .bt-card{ margin-top:6px; }
#battleModal .bt-bufftag{ top:8px; } #battleModal .bt-card{ margin-top:0; }
/* 74-я: окно героя соперника — фон его героя (HERO_ART.fon), затемнён слева направо, чтобы текст читался */
.pop-window.lgh-win{ background:linear-gradient(90deg, rgba(20,13,6,.25) 0%, rgba(20,13,6,.78) 38%, rgba(16,10,5,.92) 100%), var(--lghfon, none) center/cover no-repeat, linear-gradient(180deg,#3a2614,#160e06); }
/* бирка контры — над портретом, не на лице; подпись «Ты»/«Соперник» этой стороны прячется под ней */
#battleModal .bt-bufftag{ top:-27px; }
#battleModal .bt-side:has(.bt-bufftag) .bt-lbl{ visibility:hidden; }
.pop-window.lgh-win{ background:linear-gradient(90deg, rgba(20,13,6,.15) 0%, rgba(20,13,6,.6) 40%, rgba(16,10,5,.82) 100%), var(--lghfon, none) center/cover no-repeat, linear-gradient(180deg,#3a2614,#160e06); }
/* 74-я: панель героя (Рынок → Герои, Сундуки, Акции, «Алтарь») — на фоне его карточки (HERO_ART.fon), затемнён к тексту; картинка уже в кэше — нагрузки нет */
.hw-panel.fon{ background:linear-gradient(90deg, rgba(14,9,5,.72) 0%, rgba(14,9,5,.8) 55%, rgba(14,9,5,.68) 100%), var(--hpfon) center/cover no-repeat; }
.hw-panel.fon{ background:linear-gradient(90deg, rgba(14,9,5,.6) 0%, rgba(14,9,5,.72) 55%, rgba(14,9,5,.55) 100%), var(--hpfon) center/cover no-repeat; }
/* 74-я: артефакты в профиле — картинка его листа на чёрной подставке (как витрина Артефактов), без кружка */
.pf-arti.v2 .pf-am{ position:relative; width:64px !important; height:58px !important; border:0; border-radius:0; background:none; box-shadow:none; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; font-size:24px; }
.pf-arti.v2 .pf-aimg{ position:relative; z-index:1; height:40px; max-width:54px; object-fit:contain; margin-bottom:-9px; filter:drop-shadow(0 3px 4px rgba(0,0,0,.75)); }
.pf-arti.v2 .pf-aped{ width:52px; display:block; filter:drop-shadow(0 2px 3px rgba(0,0,0,.6)); }
.pf-arti.v2.solo .pf-am{ box-shadow:none; background:none; }
.pf-arti.v2 .pf-an{ margin-top:1px; }
.pf-arti.v2 .pf-am{ height:44px !important; width:56px !important; }
.pf-arti.v2 .pf-aimg{ height:30px; margin-bottom:-7px; }
.pf-arti.v2 .pf-aped{ width:40px; }
.pf-arti.v2 .pf-an{ font-size:9.5px; line-height:1.1; }
.pf-artis .pf-row{ align-items:flex-start; }
#profileModal .pf-artis, .st-pane .pf-artis{ padding-top:6px; padding-bottom:4px; }
.pf-artis .pf-row{ height:auto !important; min-height:0; }
.pf-arti.v2 .pf-am{ height:40px !important; }
.pf-arti.v2 .pf-aimg{ height:27px; margin-bottom:-6px; }
.pf-arti.v2{ width:84px; } .pf-arti.v2 .pf-an{ white-space:nowrap; }
/* 74-я: артефакты в мини-профиле — слева от кнопок, маленькими картинками на тёмной плашке */
#playerCard .pc-acts{ justify-content:space-between; }
#playerCard .pc-artis{ display:flex; align-items:center; gap:3px; padding:3px 6px; border-radius:10px; background:rgba(0,0,0,.35); box-shadow:inset 0 0 0 1px rgba(201,162,74,.4); min-width:0; }
#playerCard .pc-artis img{ width:26px; height:26px; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(0,0,0,.8)); }
#playerCard .pc-artis i{ font-style:normal; font-size:18px; }
#playerCard .pc-artis{ gap:1px; padding:2px 4px; flex-shrink:0; } #playerCard .pc-artis img{ width:20px; height:20px; } #playerCard .pc-acts .r{ flex-shrink:1; min-width:0; }
/* 74-я, его скрин «чуть ниже и больше»: подставки — по центру свободной высоты блока, артефакт крупнее; при строке «о себе» блок ниже — размер прежний */
.pf-artis{ display:flex; flex-direction:column; }
.pf-artis .pf-row{ flex:1 1 auto; align-items:center !important; align-content:center; }
.pf-arti.v2 .pf-am{ height:58px !important; width:64px !important; }
.pf-arti.v2 .pf-aimg{ height:40px; max-width:58px; margin-bottom:-8px; }
.pf-arti.v2 .pf-aped{ width:50px; }
.pf-arti.v2 .pf-an{ font-size:10px; }
.pf-note .pf-arti.v2 .pf-am{ height:40px !important; width:56px !important; }
.pf-note .pf-arti.v2 .pf-aimg{ height:27px; margin-bottom:-6px; }
.pf-note .pf-arti.v2 .pf-aped{ width:40px; }
.pf-note .pf-arti.v2 .pf-an{ font-size:9.5px; }
.pf-artis .pf-row{ justify-content:space-evenly !important; }
/* 74-я, его слово «на почте при нажатии на письмо справа мигает»: свиток перерисовывался вместе с письмом (innerHTML) и на кадр пропадал,
пока картинка заново ложилась. Теперь свиток — фон постоянного блока .ml-right (не пересоздаётся), сам лист письма прозрачный. */
.ml-right:has(> .ml-scroll){ background:url(img/pochta/svitok.webp) center/100% 100% no-repeat; }
.ml-right > .ml-scroll .ml-pap{ background:none; }
/* 74-я, его вопрос «а в Платиновой/Золотой как ава появится»: «Ты» — одной строкой (ава слева, «Ты» и очки справа), влезает и в колонку с бонусом лиги */
#leagueModal .lgc-you{ flex-direction:row; align-items:center; gap:5px; padding:3px 7px 3px 3px; border-radius:20px; background:rgba(0,0,0,.45); box-shadow:inset 0 0 0 1px rgba(255,210,74,.55); margin-bottom:4px; }
#leagueModal .lgc-yt{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.1; }
#leagueModal .lgc-av{ width:30px; height:30px; flex-shrink:0; }
.ic-vozv{ width:1.25em; height:1.25em; vertical-align:-.3em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
.kr-ic{ width:1.2em; height:1.2em; vertical-align:-.25em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); } .kr-ic.cr{ width:1.5em; height:1.5em; vertical-align:-.4em; }
/* 74-я: Зал славы — аватарки игроков в золотом круге (как в Лиге), значки столбца картинками */
.hall-av{ background:none; border:0; overflow:visible; }
.hall-av .pf-ava{ width:100%; height:100%; border:2px solid #d8b058; border-radius:50%; box-sizing:border-box; box-shadow:0 0 0 1px #000, 0 2px 4px rgba(0,0,0,.6); font-size:16px; }
.hall-ic{ width:15px; height:15px; vertical-align:-3px; object-fit:contain; }
.chat-tab .ct-ic{ width:17px; height:17px; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
.tal-kost{ width:16px; height:16px; vertical-align:-3px; object-fit:contain; }
.ic-lock{ width:1.15em; height:1.15em; vertical-align:-.2em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); } .hw-lockic .ic-lock, .as-lock .ic-lock{ width:100%; height:100%; } .as-lock{ display:inline-flex; width:20px; height:20px; filter:none; }
.hw-lockic .ic-lock{ width:30px; height:30px; }
.lg-ic{ width:1.2em; height:1.2em; vertical-align:-.25em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
/* 74-я: окно покупки атаки Лиги — та же рама, что у сундучка лиги (рама Раскопок) */
.pop-window:has(.lgb-pop){ width:auto; min-width:260px; max-width:90%; overflow:visible; border:12px solid transparent; border-image:url(img/raskopki/nagrada.webp) 46 46 46 46 / 12px stretch; border-radius:0;
background:radial-gradient(circle at 50% 15%, rgba(201,162,74,.3), transparent 55%), linear-gradient(180deg,#2c1f12,#150e07); }
.lgb-pop .sk-t{ display:flex; align-items:center; justify-content:center; gap:6px; color:#ffd24a; }
.lgb-pop .lgb-go{ background:url(img/arena/kn-atk.webp) center/100% 100% no-repeat; border:0; color:#fff3d6; text-shadow:0 2px 3px #000; height:44px; padding:0 30px; }
.lgb-pop .lgb-go:disabled{ filter:grayscale(.8) brightness(.7); }
.clr-bar .clr-ic{ width:16px; height:16px; vertical-align:-3px; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); }
.stage-msg .sm-ic{ width:1.25em; height:1.25em; vertical-align:-.28em; object-fit:contain; margin:0 1px; filter:drop-shadow(0 1px 1px rgba(0,0,0,.7)); }
/* ===== 74-я: ОКНА ЕГО ЛИСТАМИ (ui-proba/okna74/o1–o6 → img/okna, img/osada/more, img/osada/shapka-N, img/rynok/pr-*) ===== */
/* Арсенал — рама «бронза, щиты по углам, мечи сверху», внутри каменная стена; края 9-срезом, щиты не плющатся */
.sh-modal{ border:0 solid transparent; border-width:26px 26px 24px; border-image:url(img/okna/arsenal.webp) 120 160 110 160 fill / 26px 30px 24px 30px stretch; border-radius:0; background:none; box-shadow:0 14px 40px rgba(0,0,0,.75); }
.sh-modal .sh-top{ background:none; border-bottom:1px solid rgba(201,162,74,.3); }
.sh-modal .modal-close{ top:-6px; right:-4px; }
/* «Алтарь» — золотая рама с колоннами-лотосами, крылатым солнцем и ступенью; внутри прежний фон героя */
.dthero-modal{ overflow:visible; border:0 solid transparent; border-width:30px 44px 26px; border-image:url(img/okna/altar.webp) 125 200 95 200 / 30px 44px 26px 44px stretch; border-radius:0; box-shadow:0 14px 40px rgba(0,0,0,.75); }
.dthero-modal > .modal-close{ top:-14px; right:-26px; }
/* «Восстановить удар» — песчаник с золотыми скарабеями и песочными часами, внутри папирус */
#siegeRestoreModal{ border:0; border-radius:0; background:url(img/okna/vosst.webp) center/100% 100% no-repeat; padding:34px 28px 22px; box-shadow:none; filter:drop-shadow(0 10px 24px rgba(0,0,0,.75)); }
#siegeRestoreModal .srs-ico{ border:0; background:none; } #siegeRestoreModal .srs-ico img{ width:100%; height:100%; object-fit:contain; }
#siegeRestoreModal .srs-cost{ background:rgba(0,0,0,.35); border-color:rgba(201,162,74,.4); }
#siegeRestoreModal .srs-cost img, #srsCost img{ width:16px; height:16px; vertical-align:-3px; }
/* Шапка недели в верхней строке осады — лента его листа по неделе, название недели кодом */
.siege-week{ flex:1 1 auto; min-width:0; height:40px; margin:0 8px; display:flex; align-items:center; justify-content:center; background:center/100% 100% no-repeat;
font:800 13px/1 'Cinzel',serif; letter-spacing:.5px; color:#fff3d6; text-shadow:0 1px 2px #000, 0 0 6px #000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 14%; }
#siegeModal[data-ned="0"] .siege-week{ background-image:url(img/osada/shapka-0.webp); }
#siegeModal[data-ned="1"] .siege-week{ background-image:url(img/osada/shapka-1.webp); color:#3a1f08; text-shadow:0 1px 0 rgba(255,240,200,.6); }
#siegeModal[data-ned="2"] .siege-week{ background-image:url(img/osada/shapka-2.webp); }
#siegeModal[data-ned="3"] .siege-week{ background-image:url(img/osada/shapka-3.webp); }
#siegeModal[data-vid="clan"] .siege-week{ background-image:url(img/osada/more/tablichka.webp); color:#e8fbff; text-shadow:0 1px 2px #052a3a, 0 0 6px rgba(80,200,230,.6); }
.siege-head{ display:flex; align-items:center; }
/* ГЛУБИННЫЕ — морской набор (вместо песчаного «Ветра»): табличка наград, вкладки, «Награды», медали */
#siegeModal[data-vid="clan"] .sr-mid{ border-image:url(img/osada/more/tablichka.webp) 0 60 fill / 0 30px / 0 4px stretch; }
#siegeModal[data-vid="clan"] .sr-mid, #siegeModal[data-vid="clan"] .sr-mid *{ color:#e8fbff; }
#siegeModal[data-vid="clan"] .sr-mid .srw-title, #siegeModal[data-vid="clan"] .sr-mid b{ color:#9ff0ff; }
#siegeModal[data-vid="clan"] .siege-tab{ border-image:url(img/osada/more/vkladka-norm.webp) 0 40 fill / 0 17px stretch; color:#d8f6ff; }
#siegeModal[data-vid="clan"] .siege-tab.sel{ border-image-source:url(img/osada/more/vkladka-sel.webp); color:#042a36; text-shadow:0 1px 0 rgba(220,255,255,.6); }
#siegeModal[data-vid="clan"] .siege-rewards-btn{ background:url(img/osada/more/vkladka-sel.webp) center/100% 100% no-repeat; color:#042a36; text-shadow:0 1px 0 rgba(220,255,255,.6); padding:0 10px; }
#siegeModal[data-vid="clan"] .sr-medal.m1{ background-image:url(img/osada/more/medal-1.webp); }
#siegeModal[data-vid="clan"] .sr-medal.m2{ background-image:url(img/osada/more/medal-2.webp); }
#siegeModal[data-vid="clan"] .sr-medal.m3{ background-image:url(img/osada/more/medal-3.webp); }
#siegeModal[data-vid="clan"] .sr-medal.m4{ background-image:url(img/osada/more/medal-4.webp); }
#siegeModal[data-vid="clan"] .sr-medal.m5{ width:34px; background-image:url(img/osada/more/medal-5.webp); }
.siege-head .siege-tabs{ flex:0 0 auto; }
.siege-head .siege-rewards-btn{ flex:0 0 auto; }
.siege-week{ height:36px; font-size:12px; padding:0 12%; }
/* 74-я, его скрин «достижения в Глубинах стоят низко, будто выпадают»: у морской таблички толстый нижний край с ракушками —
рамка выходит за блок сверху и снизу (outset), содержимое остаётся на гладкой середине */
#siegeModal[data-vid="clan"] .sr-mid{ border-image-outset:9px 6px 18px 6px; margin:4px 0 12px; }
#siegeModal[data-vid="clan"] .sr-medal{ width:26px; height:26px; }
/* 74-я: рамка «Нападений N/6» — его лист (ui-proba/okna74/o7): своя на каждую неделю и морская у Глубин; гнездо слева, текст на тёмной середине */
#siegeModal .sr-stat.sr-ramka{ position:relative; width:150px; height:34px; box-sizing:border-box; padding:0 8px 0 42px; border:0; border-radius:0; box-shadow:none; flex-wrap:nowrap; justify-content:center;
background:url(img/osada/nap-0.webp) center/100% 100% no-repeat; }
#siegeModal[data-ned="1"] .sr-stat.sr-ramka{ background-image:url(img/osada/nap-1.webp); }
#siegeModal[data-ned="2"] .sr-stat.sr-ramka{ background-image:url(img/osada/nap-2.webp); }
#siegeModal[data-ned="3"]:not([data-vid="clan"]) .sr-stat.sr-ramka{ background-image:url(img/osada/nap-3.webp); }
#siegeModal[data-vid="clan"] .sr-stat.sr-ramka{ background-image:url(img/osada/nap-more.webp); }
#siegeModal .sr-stat.sr-ramka .srr-l{ color:#e8d7b0 !important; text-shadow:0 1px 2px #000 !important; }
#siegeModal .sr-stat.sr-ramka b{ color:#fff3d6 !important; text-shadow:0 1px 2px #000 !important; }
#siegeModal .sr-stat.sr-ramka.out b{ color:#ff9a7a !important; }
/* пустое гнездо (кроме недели 1 и 3 — там маска и кобра на картинке) — значок атаки Лиги */
#siegeModal:not([data-ned="0"]):not([data-ned="2"]) .sr-stat.sr-ramka::before, #siegeModal[data-vid="clan"] .sr-stat.sr-ramka::before{ content:''; position:absolute; left:9px; top:50%; width:20px; height:20px; transform:translateY(-50%); background:url(img/liga/ic-attack.webp) center/contain no-repeat; }
/* 74-я: окно покупки атаки — заголовок, две плитки с делениями (атаки / куплено сегодня), кнопки его листов арены */
.lgb-pop{ display:flex; flex-direction:column; align-items:center; gap:10px; padding:4px 2px; }
.lgb-pop .sk-t{ font-size:17px; }
.lgb-pop .sk-t .lg-ic{ width:24px; height:24px; }
.lgb-tiles{ display:flex; gap:8px; width:100%; }
.lgb-tile{ flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:3px; padding:7px 6px 6px; border-radius:10px; background:rgba(0,0,0,.4); box-shadow:inset 0 0 0 1px rgba(201,162,74,.45); }
.lgb-tile span{ font-size:10px; color:#cdb98e; }
.lgb-tile b{ font:800 18px/1 'Cinzel',serif; color:#fff3d6; text-shadow:0 2px 3px #000; }
.lgb-tile small{ font-size:9.5px; color:#9df07a; }
.lgb-pips{ display:flex; gap:2px; }
.lgb-pips i{ width:8px; height:8px; border-radius:2px; background:rgba(255,255,255,.12); box-shadow:inset 0 0 0 1px rgba(0,0,0,.5); }
.lgb-pips i.on{ background:linear-gradient(180deg,#ff9a6a,#c0302a); }
.lgb-pips i.buy{ background:linear-gradient(180deg,#ffe08a,#c88a24); }
.lgb-pop .lgb-go{ width:230px; height:48px; font:800 15px/1 'Cinzel',serif; }
.lgb-pop .lgb-go .lg-ic{ width:20px; height:20px; }
.lgb-x{ width:170px; height:38px; border:0; background:url(img/arena/kn-skip.webp) center/100% 100% no-repeat; color:#e8d7b0; font:700 13px/1 'Cinzel',serif; text-shadow:0 1px 2px #000; cursor:pointer; }
.lgb-x:active, .lgb-pop .lgb-go:active{ transform:scale(.97); }
/* 74-я: заставка загрузки (его выбор Б — логотип в углу, Анубис виден целиком) */
.zs{ position:fixed; inset:0; z-index:9999; overflow:hidden; background:#0a0806 url(img/zastavka/tron.webp) center 62%/cover no-repeat; transition:opacity .55s; font-family:'Cinzel',Georgia,serif; }
.zs::after{ content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 32%, rgba(0,0,0,0) 70%, rgba(0,0,0,.75) 100%); }
.zs.out{ opacity:0; pointer-events:none; }
.zs-logo{ position:absolute; left:14px; top:10px; width:min(270px,34vw); z-index:2; animation:zsGlow 2.6s ease-in-out infinite; }
@keyframes zsGlow{ 0%,100%{ filter:drop-shadow(0 6px 14px rgba(0,0,0,.85)) drop-shadow(0 0 6px rgba(90,240,160,.25)); } 50%{ filter:drop-shadow(0 6px 14px rgba(0,0,0,.85)) drop-shadow(0 0 16px rgba(90,240,160,.55)); } }
.zs-bar{ position:absolute; left:50%; bottom:30px; width:min(360px,46vw); height:14px; transform:translateX(-50%); z-index:2; border-radius:8px; background:rgba(0,0,0,.6); box-shadow:inset 0 0 0 1px rgba(201,162,74,.7), 0 2px 6px rgba(0,0,0,.8); overflow:hidden; }
.zs-bar i{ position:absolute; left:0; top:0; bottom:0; width:3%; background:linear-gradient(180deg,#9df0b8,#2fa86a); box-shadow:0 0 10px rgba(90,240,160,.8); transition:width .45s ease-out; }
.zs-tx{ position:absolute; left:0; right:0; bottom:10px; z-index:2; text-align:center; font-size:11px; letter-spacing:1px; color:#e8d7b0; text-shadow:0 1px 3px #000; }
/* 74-я: письмо с наградой — печать картинкой, «Забрать» изумрудная кнопка Заданий, значки в тексте */
.ml-pap .seal{ background:none; border:0; box-shadow:none; width:34px; height:34px; } .ml-pap .seal img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.5)); }
.ml-pap .p .sm-ic{ width:15px; height:15px; vertical-align:-3px; }
.ml-b.ml-take{ min-width:150px; height:40px; border:0; border-radius:0; background:url(img/zadaniya/kn-zabrat.webp) center/100% 100% no-repeat; color:#fff; font:800 14px/1 'Cinzel',serif; text-shadow:0 2px 3px #0a2a10; box-shadow:none; }
.ml-b.ml-take.all{ background-image:url(img/zadaniya/kn-vse.webp); min-width:170px; }
.ml-li .ic img{ width:18px; height:18px; object-fit:contain; vertical-align:middle; }
.ml-pap .tm{ top:21%; left:17%; font-weight:700; color:#8a3a1a; }
.lr-prog:empty{ display:none; } /* 74-я, его слово: «собран» в «Награде за этажи» не нужен */
.ic-v{ width:1.15em; height:1.15em; vertical-align:-.22em; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)); } /* 74-я: значок валюты в тексте вместо эмодзи */
/* 74-я: Настройки → «Звук и графика»: переключатель-капсула и ползунок громкости в золоте */
.st-opt{ gap:10px; }
.st-opt b{ flex:0 0 auto; min-width:110px; }
.st-opt .st-tag{ flex:1 1 auto; white-space:normal; line-height:1.25; }
.st-sw{ flex:0 0 auto; margin-left:auto; width:52px; height:28px; border-radius:14px; border:1px solid #6a4a1a; background:linear-gradient(180deg,#2a1c10,#140d06); position:relative; cursor:pointer; box-shadow:inset 0 2px 4px rgba(0,0,0,.6); }
.st-sw i{ position:absolute; left:3px; top:3px; width:20px; height:20px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#9a8a70,#4a3a24); transition:left .18s; box-shadow:0 1px 3px #000; }
.st-sw.on{ background:linear-gradient(180deg,#3fa86a,#1e6a3a); border-color:#9df0b8; }
.st-sw.on i{ left:27px; background:radial-gradient(circle at 40% 35%,#fff3d0,#d8b058); }
.st-vol{ flex:1 1 auto; min-width:80px; accent-color:#d8b058; }
.st-vol:disabled{ opacity:.35; }
/* лёгкий режим: без лишних анимаций — пульсы и свечения кнопок стоят */
body.lite .boss-btn, body.lite .zs-logo, body.lite .pr-buy.take{ animation:none !important; }
.st-hd2{ margin:10px 0 4px; font:800 12px/1 "Cinzel",serif; letter-spacing:1px; color:#d8b058; text-transform:uppercase; }
/* 74-я: боевой сервер — «+» у золота и пыли (тест-выдачи) не показываем; у бриллиантов, костей, энергии «+» ведёт в Рынок */
.prod .cur-plus[data-cur="gold"], .prod .cur-plus[data-cur="rune"], .prod .dev-only{ display:none !important; }
#hwCnt{ display:none !important; } /* 74-я, его слово: «0 / 25» у «Героев» не нужно */
/* 74-я: обучение — значки картинками (мешок, табличка Бронзовой, палец) */
.tut-it span img{ width:34px; height:34px; object-fit:contain; }
.tut-gc > span:first-child img{ width:20px; height:20px; vertical-align:middle; }
img.tut-shield{ width:84px; height:84px; object-fit:contain; display:block; margin:0 auto; filter:drop-shadow(0 4px 8px rgba(0,0,0,.6)); }
/* 74-я, его слово «чтобы окно вниз уходило и скроллилось»: список в Настройках (Общие: музыка, звуки, лёгкий режим, языки) не влезал
и резался рамкой — теперь он сам прокручивается внутри вкладки, низ не теряется */
.st-list{ overflow-y:auto; overflow-x:hidden; padding-right:4px; padding-bottom:6px; scrollbar-width:thin; scrollbar-color:rgba(202,164,76,.5) transparent; }
.st-list::-webkit-scrollbar{ width:5px; } .st-list::-webkit-scrollbar-thumb{ background:rgba(202,164,76,.5); border-radius:3px; }
.st-list > *{ flex:0 0 auto; }
/* 74-я: узкий кадр (между вырезами телефона) — строка имени моба не залезает под правую колонку кнопок */
.app.uzko .monster-row{ padding-left:70px; } /* строка фиксированной ширины (133+60+114+чипы) — на узком кадре сдвигаем левее */
/* 74-я, его скрин с iPhone «окно плохо стоит» (и в панели так же): рама Арсенала (border 26/24) забрала высоту, а сетка .sh-body
росла по содержимому и вылезала за низ на ~37 px («Полный сет» и низ саркофага срезаны). Строка сетки = высота окна, всё внутри ужимается. */
.sh-modal .sh-body{ grid-template-rows:minmax(0,1fr); }
.sh-modal .sh-inv{ max-height:100%; }
.sh-modal .sh-rb{ min-height:0; }
.sh-modal .sh-rb.g1 .sh-it{ max-height:70px; }
.sh-modal{ height:382px; } /* чуть выше — вещи крупнее (кадр 390, по 4 px сверху и снизу) */
.sh-modal .sh-rb.g1{ gap:3px; }
.sh-modal .sh-bon2{ font-size:10px; line-height:1.3; }
.sh-modal .sh-foot .sh-btn{ padding:5px 12px; }
.sh-modal .sh-inv-title{ white-space:nowrap; font-size:10.5px; letter-spacing:.06em; } /* на узком саркофаге не переносится в две строки */
/* ===== 74-я, его слово «кругом нормальные крестики: где-то нет, где-то очень маленькие, пальцем тыкаю — не срабатывает» =====
ОДИН вид для всех крестиков-значков (как в окне Героев: красный круг 32 px, белый ✕) и невидимая зона нажатия ~52 px вокруг
(::after inset −10 px; на iPhone кадр 0,87 → ≈45 pt, минимум Apple 44). Где стоит крестик — решает окно (top/right не трогаем). */
.modal-close, .hw-x, .pc-x, .kr-x, .rel-x, .po-x, .chat-close, .dt-x, .sk-x2, .qw-x, .dl-x{
width:32px !important; height:32px !important; min-width:32px; flex:0 0 32px; padding:0 !important;
border-radius:50% !important; border:2px solid #ffd0b0 !important;
background:linear-gradient(180deg,#e04848,#9a1a1a) !important; color:#fff !important;
font:900 15px/1 Arial,sans-serif !important; text-align:center; display:flex !important; align-items:center; justify-content:center;
box-shadow:0 2px 8px rgba(0,0,0,.6) !important; cursor:pointer; z-index:20;
touch-action:manipulation; -webkit-tap-highlight-color:transparent; overflow:visible !important;
}
:where(.modal-close, .hw-x, .pc-x, .kr-x, .rel-x, .po-x, .chat-close, .dt-x, .sk-x2, .qw-x, .dl-x){ position:relative; } /* где окно не задало — чтобы зона ::after держалась за крестик */
.modal-close::after, .hw-x::after, .pc-x::after, .kr-x::after, .rel-x::after, .po-x::after, .chat-close::after, .dt-x::after, .sk-x2::after, .qw-x::after, .dl-x::after{
content:''; position:absolute; inset:-10px; border-radius:50%; }
.modal-close:active, .hw-x:active, .pc-x:active, .kr-x:active, .rel-x:active, .po-x:active, .chat-close:active, .dt-x:active, .sk-x2:active, .qw-x:active, .dl-x:active{ transform:scale(.9); filter:brightness(1.15); }
/* телефон: без задержки двойного тапа (iOS ждал второй тап — «приходится тыкать по два раза») */
html, button, a, [data-hwdo], .stat-chip, .cur-plus{ touch-action:manipulation; }
/* 74-я, его слово «телефон ультра горячий за 20 минут»: закрытые окна (их ~30) были только прозрачными — оставались в отрисовке,
и анимации в них крутились (лучи «Алтаря», тень босса и т. п.). Закрытое окно после затухания прячется (visibility), анимации в нём стоят. */
.promote-modal:not(.show){ visibility:hidden; transition-property:opacity,transform,visibility; transition-duration:.2s,.2s,0s; transition-delay:0s,0s,.2s; }
.promote-modal.show{ visibility:visible; }
.promote-modal:not(.show) *, .promote-modal:not(.show) *::before, .promote-modal:not(.show) *::after{ animation-play-state:paused !important; }
.hero-drawer.hw:not(.open){ visibility:hidden; transition-property:transform,opacity,visibility; transition-duration:.22s,.18s,0s; transition-delay:0s,0s,.22s; }
.hero-drawer.hw.open{ visibility:visible; }
.hero-drawer.hw:not(.open) *, .hero-drawer.hw:not(.open) *::before, .hero-drawer.hw:not(.open) *::after{ animation-play-state:paused !important; }
/* 75-я (жалоба ЗБТ «надпись о стоимости слилась»): цена клана — тёмная плашка со светлым текстом поверх каймы свитка */
#clanModal .clc-cost{ display:inline-flex; align-items:center; gap:5px; padding:4px 12px; border-radius:8px; background:rgba(28,16,6,.88); border:1px solid #caa44c;
box-shadow:0 2px 6px rgba(0,0,0,.45); font:600 12px Inter,sans-serif; color:#e8d6b0; white-space:nowrap; }
#clanModal .clc-cost img{ width:18px; height:18px; object-fit:contain; }
#clanModal .clc-cost b{ font:800 13px 'JetBrains Mono',monospace; color:#ffd76a; } #clanModal .clc-cost b.malo{ color:#ff8a70; }
#clanModal .clc-cost i{ width:1px; height:14px; margin:0 4px; background:rgba(202,164,76,.5); }
/* 75-я (обход iPhone, п.4): крестик Перерождения стоял слева — «#prestigeModal > *{ position:relative }» делал и его относительным. Теперь как в Настройках: справа сверху, красный круг. */
#prestigeModal > .modal-close{ position:absolute; top:-8px; right:-8px; width:30px; height:30px; border-radius:50%; z-index:5; color:#fff; font-weight:900;
background:linear-gradient(180deg,#e06070,#a8293f); border:2px solid #5a0f1c; box-shadow:0 2px 6px rgba(0,0,0,.5); }
/* 75-я (обход iPhone, п.7): число справа («5K» у Костей/Бриллиантов) стояло вплотную к краю бумаги свитка — отступ от края */
#hallModal .hall-pr{ padding-right:7px; }
/* 75-я (его письмо из админки на 6 наград — «собрать даже не могу»): плитки шли вторым рядом за край свитка и уносили «Забрать».
Больше 4 наград — плитки компактнее; ряд наград сжимается и прокручивается внутри свитка, кнопки всегда внизу на виду. */
.ml-pap .ml-rw{ flex:0 0 auto; }
.ml-pap .ml-rw.many{ flex:0 1 auto; min-height:58px; overflow-y:auto; display:grid; grid-template-columns:repeat(auto-fit, minmax(48px, 1fr)); gap:3px; }
.ml-rw.many span.ml-tile{ width:auto; height:56px; padding:3px 1px; }
.ml-rw.many .ml-tile .ml-ti{ width:22px; height:22px; }
.ml-rw.many .ml-tile b{ font-size:10.5px; } .ml-rw.many .ml-tile small{ font-size:7px; }
.ml-pap .acts{ flex-shrink:0; }