/* LichKing.uz :: тема армори под основной сайт.
 *
 * Подключается ПОСЛЕ bulma.min.css и armory.css, поэтому переопределяет их
 * без !important везде, где хватает обычной специфичности.
 *
 * Шрифты берём те же файлы, что и сайт: он лежит на том же домене, значит
 * у большинства посетителей они уже в кеше браузера и грузиться не будут.
 * Cinzel кириллицы не содержит — для русского и узбекского браузер сам
 * подставит Manrope по каждому глифу, поэтому она стоит второй в списке.
 */

@font-face { font-family: 'Cinzel'; font-style: normal; font-weight: 500 900; font-display: swap;
  src: url("/assets/1c6c19c2.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'Cinzel'; font-style: normal; font-weight: 500 900; font-display: swap;
  src: url("/assets/47271d57.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+2C60-2C7F, U+A720-A7FF; }

@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/assets/984d7f11.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/assets/efb6f18e.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/assets/844d84ae.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/assets/309a12f4.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }

:root {
  --lk-fon:        #04060c;
  --lk-panel:      rgba(9, 15, 26, .72);
  --lk-panel-kray: rgba(127, 216, 255, .14);
  --lk-tekst:      #eaf4ff;
  --lk-tusklyy:    #9db3c7;
  --lk-led:        #8fd8ff;
  --lk-zoloto:     #d9a94c;
  --lk-zelenyy:    #6ef0a8;
  --lk-siyanie:    rgba(127, 216, 255, .18);
  --lk-kolonka:    1240px;
  --lk-otstup:     max(20px, calc((100vw - var(--lk-kolonka)) / 2 + 20px));
}

/* ── Основа ─────────────────────────────────────────────────────────── */

html, body {
  background: var(--lk-fon);
  color: var(--lk-tekst);
  font-family: Manrope, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Морозное свечение сверху, как на главной. Фиксированное и не кликается,
   чтобы не мешать прокрутке и нажатиям. */
body::before {
  content: "";
  position: fixed; inset: 0 0 auto 0; height: 420px;
  background:
    radial-gradient(60% 100% at 50% 0, rgba(127,216,255,.10), transparent 70%),
    radial-gradient(40% 80% at 12% 0, rgba(43,110,168,.12), transparent 70%);
  pointer-events: none; z-index: 0;
}
body > * { position: relative; z-index: 1; }

a { color: var(--lk-led); text-decoration: none; transition: color .2s ease; }
a:hover { color: var(--lk-zoloto); }
::selection { background: #2b6ea8; color: #eaf6ff; }

h1, h2, h3, .title, .subtitle {
  font-family: Cinzel, Manrope, serif;
  letter-spacing: .02em;
}
.title { color: var(--lk-tekst) !important; }
.subtitle { color: var(--lk-tusklyy) !important; }

/* ── Шапка ──────────────────────────────────────────────────────────── */

.lk-shapka {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
  padding: 13px var(--lk-otstup);
  background: linear-gradient(180deg, rgba(4,8,16,.96), rgba(4,8,16,.72));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--lk-panel-kray);
}
.lk-shapka::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -18px; height: 18px;
  background: radial-gradient(58% 100% at 50% 0, rgba(127,216,255,.14), transparent 72%);
  pointer-events: none;
}

/* Блок логотипа. Размеры и разрядки взяты с главной один в один, иначе
   переход между сайтом и армори читается как переход на чужой ресурс. */
.lk-brend { display: flex; align-items: center; flex: 0 0 auto; }
.lk-brend:hover .lk-brend-text { display: flex; flex-direction: column; line-height: 1; }

/* Логотип «вырезан изо льда» — тот же приём, что на главной. */
.lk-logo {
  font-family: Cinzel, serif; font-weight: 900; font-size: 20px;
  letter-spacing: .22em;
  background: linear-gradient(180deg, #ffffff 0%, #cfe6f8 52%, #8fd8ff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 22px rgba(127,216,255,.18);
  white-space: nowrap;
}
.lk-podpis {
  font-size: 10px; letter-spacing: .34em; color: #7d94ab; margin-top: 5px;
  white-space: nowrap;
}
.lk-podpis i { font-style: normal; }

.lk-menyu {
  display: flex; align-items: center; flex: 1 1 auto; flex-wrap: wrap;
  justify-content: center; min-width: 0; gap: 22px;
}
.lk-menyu a {
  position: relative; padding: 7px 2px;
  color: #9db3c7; font-size: 13px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
}
.lk-menyu a:hover { color: #eaf4ff; text-shadow: 0 0 14px rgba(127,216,255,.45); }

/* Руническая бусина между пунктами — как на главной. */
.lk-menyu a + a::before {
  content: "◆"; position: absolute; left: -15px; top: 50%;
  transform: translateY(-50%) scale(.52); color: rgba(127,216,255,.30);
}
.lk-menyu a::after {
  content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, #9fe4ff, transparent);
  box-shadow: 0 0 10px rgba(127,216,255,.75);
  transition: left .3s cubic-bezier(.2,.7,.3,1), right .3s cubic-bezier(.2,.7,.3,1);
}
.lk-menyu a:hover::after { left: -7px; right: -7px; }
.lk-menyu a.lk-tek { color: var(--lk-zoloto); }
.lk-menyu a.lk-tek::after { left: -7px; right: -7px; background: linear-gradient(90deg, transparent, var(--lk-zoloto), transparent); }

/* Правый блок: язык и кнопка входа в игру, как на главной. */
.lk-prav { display: flex; align-items: center; flex: 0 0 auto; gap: 14px; }

.lk-yazyk {
  display: inline-flex; border: 1px solid rgba(127,216,255,.22);
  border-radius: 999px; overflow: hidden;
}
.lk-yazyk a {
  padding: 7px 13px; font-family: Manrope, sans-serif;
  font-size: 11px; letter-spacing: .14em; color: #7d94ab; background: transparent;
}
.lk-yazyk a:hover { color: var(--lk-tekst); }
.lk-yazyk a.lk-tek { color: #eaf4ff; background: rgba(127,216,255,.16); }

/* Золотая кнопка: тиснёная рамка и подложка повторяют главную. */
.lk-igrat {
  font-size: 13px; padding: 12px 24px;
  font-family: Cinzel, serif; font-weight: 700; letter-spacing: .16em;
  color: #ffe9b0; text-shadow: 0 1px 2px rgba(0,0,0,.9);
  background: linear-gradient(180deg, #6d5524 0%, #4a3714 46%, #2c2009 100%);
  border: 1px solid #1a1409; border-radius: 4px; white-space: nowrap;
  box-shadow: inset 0 0 0 1px rgba(226,190,110,.55), inset 0 1px 0 rgba(255,231,168,.5),
              inset 0 -2px 6px rgba(0,0,0,.6), 0 3px 0 #120e06, 0 10px 26px rgba(0,0,0,.55);
}
.lk-igrat:hover {
  color: #fff3cf;
  background: linear-gradient(180deg, #8a6c2e 0%, #5d4519 46%, #372808 100%);
  box-shadow: inset 0 0 0 1px rgba(255,220,140,.75), inset 0 1px 0 rgba(255,240,190,.6),
              inset 0 -2px 6px rgba(0,0,0,.55), 0 3px 0 #120e06, 0 12px 30px rgba(0,0,0,.6);
}
.lk-igrat:active { transform: translateY(2px); }

/* ── Панели и таблицы ───────────────────────────────────────────────── */

/* Содержимое живёт в колонке, как на сайте: на широком мониторе строки
   таблицы иначе растягиваются через весь экран и их тяжело читать. */
.section { max-width: var(--lk-kolonka); margin: 0 auto; padding: 28px 24px 40px; }

/* Подложка: снаружи темнее, сама колонка чуть светлее и с волосяными
   границами. Всё градиентами, без лишних элементов в разметке. */
body {
  background:
    linear-gradient(90deg, rgba(127,216,255,.13), rgba(127,216,255,.13))
      50% 0 / var(--lk-kolonka) 100% no-repeat,
    linear-gradient(180deg, rgba(9,15,26,.62), rgba(9,15,26,.62))
      50% 0 / calc(var(--lk-kolonka) - 2px) 100% no-repeat,
    #02040a;
}

.box, .card, .panel {
  background: var(--lk-panel) !important;
  border: 1px solid var(--lk-panel-kray);
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.03);
  color: var(--lk-tekst);
}

.table {
  background: transparent !important;
  color: var(--lk-tekst) !important;
  border-collapse: separate; border-spacing: 0;
}
.table thead th {
  color: var(--lk-tusklyy) !important;
  font-family: Manrope, sans-serif; font-size: 12px; font-weight: 700;
  letter-spacing: .10em; text-transform: uppercase;
  border-bottom: 1px solid var(--lk-panel-kray) !important;
  background: transparent !important;
}
.table td, .table th {
  border-color: rgba(127,216,255,.08) !important;
  vertical-align: middle;
}
.table tbody tr { transition: background .15s ease; }
.table tbody tr:hover { background: rgba(127,216,255,.06) !important; }

.input, .select select, .textarea {
  background: rgba(4,8,16,.75) !important;
  border: 1px solid var(--lk-panel-kray) !important;
  color: var(--lk-tekst) !important;
  border-radius: 10px;
}
.input:focus, .select select:focus {
  border-color: rgba(127,216,255,.45) !important;
  box-shadow: 0 0 0 3px rgba(127,216,255,.12) !important;
}
.input::placeholder { color: #6d8296; }

.button, .button.is-primary, .button.is-link {
  background: linear-gradient(180deg, rgba(43,110,168,.85), rgba(23,64,104,.85)) !important;
  border: 1px solid rgba(127,216,255,.28) !important;
  color: var(--lk-tekst) !important;
  border-radius: 10px; font-weight: 700; letter-spacing: .03em;
  transition: filter .2s ease, transform .12s ease;
}
.button:hover { filter: brightness(1.15); }
.button:active { transform: translateY(1px); }

.pagination-link.is-current { background: var(--lk-zoloto) !important; border-color: var(--lk-zoloto) !important; color: #04060c !important; }

/* ── Персонаж ───────────────────────────────────────────────────────── */

.char-name { font-family: Cinzel, Manrope, serif; text-shadow: 0 0 26px rgba(127,216,255,.25); }
.guild-name { color: var(--lk-tusklyy) !important; }
.char-level { color: var(--lk-tusklyy); }

.item-slot {
  border: 1px solid rgba(127,216,255,.12);
  border-radius: 10px;
  background: rgba(9,15,26,.55);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.item-slot:hover {
  border-color: rgba(127,216,255,.38);
  box-shadow: 0 0 18px rgba(127,216,255,.18);
}

/* ── Подвал ─────────────────────────────────────────────────────────── */

.lk-podval {
  margin-top: 40px; padding: 22px var(--lk-otstup);
  border-top: 1px solid var(--lk-panel-kray);
  color: #6d8296; font-size: 13px;
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.lk-podval a { color: var(--lk-tusklyy); }
.lk-podval a:hover { color: var(--lk-zoloto); }

/* ── Мелочи ─────────────────────────────────────────────────────────── */

.has-text-grey, .has-text-grey-light { color: var(--lk-tusklyy) !important; }
.tag { background: rgba(127,216,255,.10) !important; color: var(--lk-tekst) !important; border: 1px solid var(--lk-panel-kray); }
hr { background-color: var(--lk-panel-kray) !important; }

@media (max-width: 620px) {
  .lk-shapka { gap: 12px; }
  .lk-menyu { gap: 14px; width: 100%; }
  .lk-logo { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  .lk-menyu a::after, .button { transition: none; }
}

/* Узкие экраны: логотип и кнопка остаются, меню переносится под них. */
@media (max-width: 1180px) {
  .lk-menyu { order: 3; width: 100%; justify-content: flex-start; gap: 18px; }
  .lk-shapka { padding: 12px 20px; }
}
@media (max-width: 620px) {
  .lk-logo { font-size: 17px; letter-spacing: .16em; }
  .lk-podpis { font-size: 9px; letter-spacing: .22em; }
    .lk-igrat { padding: 10px 16px; font-size: 12px; letter-spacing: .10em; }
  .lk-menyu a { font-size: 12px; }
  .lk-menyu a + a::before { left: -12px; }
}


/* Ниже 1300 колонка занимает всё: рамка на ноутбуке и телефоне только мешает. */
@media (max-width: 1300px) {
  :root { --lk-kolonka: 100%; --lk-otstup: 20px; }
  body { background: var(--lk-fon); }
  .section { max-width: 100%; }
}