/* Шрифти — як на головній: заголовки Kyiv*Type (© Дмитро Растворцев, freeware, файли без змін),
   текст — Inter, цитати — Spectral Italic. Усе з власного домену: CSP font-src 'self'. */
@font-face{font-family:"KyivType Titling";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/kyivtype-titling-medium.woff2) format("woff2")}
@font-face{font-family:"KyivType Titling";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/kyivtype-titling-bold2.woff2) format("woff2")}
@font-face{font-family:"KyivType Serif";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/kyivtype-serif-heavy2.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-400-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-500-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-500-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-600-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-700-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Spectral";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/spectral-400i-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Spectral";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/spectral-400i-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Кабінет бійця ‹Third Division›. Згори — шапка розділу на офіційному арті гри зі смугою фактів,
   під нею — вкладки, далі — робоча область. Стиль — як у головної (home.css):
   нічна синь, золото, заголовки Kyiv*Type, текст Inter. */
:root{
  --night:#07101f;
  --panel:#0d1a33;
  --panel-2:#13213d;
  --line:rgba(216,178,94,.16);
  --line2:rgba(216,178,94,.26);
  --edge:rgba(216,178,94,.42);
  --frame:rgba(201,160,76,.9);
  --gold:#d8b25e;
  --gold-hot:#f5c534;
  --btn:#e9b949;
  --ink:#1e1404;
  --link:#f0c76b;
  --ivory:#f6ebd0;
  --parch:#ede3c9;
  --soft:#d9cfb4;
  --text-c:#bdb49c;
  --muted:#958c76;
  --dim:#7d7564;
  --good:#3ddc84;
  --green:#3ddc84;
  --warn:#e8a13a;
  --crit:#e0564f;
  --display:"KyivType Titling",Georgia,"Times New Roman",serif;
  --serif:"KyivType Serif",Georgia,"Times New Roman",serif;
  --quote:"Spectral",Georgia,serif;
  --text:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ui:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --i-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h8M7.5 3.5 11 7l-3.5 3.5'/%3E%3C/svg%3E");
  --i-ext:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 9.5l5-5M5.5 4.5h4v4'/%3E%3C/svg%3E");
  --i-chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='%23d8b25e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 3.5 5 7l3.5-3.5'/%3E%3C/svg%3E");
  color-scheme:dark;
}
*{box-sizing:border-box}
body{
  margin:0;color:var(--parch);font-family:var(--text);font-size:15px;line-height:1.55;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant-numeric:lining-nums;
  min-height:100dvh;
  background:
    linear-gradient(180deg,rgba(7,16,31,.88) 0%,rgba(7,16,31,.95) 55%,rgba(5,11,23,.98) 100%) fixed,
    url("img/bg.webp") center top/cover no-repeat fixed,
    var(--night)}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:500;text-wrap:balance;color:var(--ivory)}
p{margin:0;text-wrap:pretty}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid #8cb8ff;outline-offset:3px;border-radius:6px}
[hidden]{display:none!important}
.num{font-variant-numeric:tabular-nums}
img{max-width:100%;height:auto}

/* ───── вхід: за взірцем логін-екрану самої гри ───── */
/* герб не рухається: сторінка не центрується по висоті (інакше герб «стрибає», коли на телефоні ховається
   адресний рядок, підвантажується шрифт чи з'являється помилка під панеллю) */
.gate{position:relative;display:grid;justify-items:center;align-content:start;
  min-height:calc(100svh - 60px);padding:clamp(20px,calc(50svh - 400px),120px) 16px 48px;overflow:hidden;
  background:
    radial-gradient(60% 55% at 50% 42%,transparent 0 30%,rgba(3,6,16,.78) 100%),
    linear-gradient(180deg,rgba(5,9,22,.35),rgba(5,9,22,.85) 82%,var(--night)),
    url("img/gate-bg.webp") center 30%/cover no-repeat,var(--night)}
.gate__inner{position:relative;width:min(440px,100%);display:flex;flex-direction:column;
  align-items:center;text-align:center}
.gate__crest{display:block;width:clamp(150px,19vw,196px);height:auto;aspect-ratio:1;margin-bottom:4px;
  filter:drop-shadow(0 0 26px rgba(245,197,52,.35)) drop-shadow(0 10px 22px rgba(0,0,0,.7))}
.gate__title{margin-top:6px;font:800 clamp(40px,6vw,60px)/1.05 var(--serif);color:#fff3d6;
  text-shadow:0 2px 24px rgba(0,0,0,.6)}
.gate__sub{margin-top:10px;font:italic 400 20px/1.2 var(--quote);color:#e9d7a8;text-shadow:0 2px 10px rgba(0,0,0,.8)}

/* панель входу — як картка гільдії на головній: золота смуга згори */
.gate__panel{position:relative;width:100%;margin-top:clamp(22px,4vh,32px);overflow:hidden;
  padding:25px clamp(18px,4vw,26px) 20px;border-radius:10px;
  background:rgba(10,20,40,.9);border:1px solid rgba(216,178,94,.55);
  box-shadow:0 24px 48px rgba(0,0,0,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.gate__panel::before{content:"";position:absolute;inset:0 0 auto;height:3px;
  background:linear-gradient(90deg,#8a5e17,#ffe6a0 50%,#8a5e17)}

/* кнопки входу — фірмові Discord і Battle.net: їхній колір, їхній знак */
.auth{display:flex;flex-direction:column;gap:12px}
.authbtn{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;height:52px;padding:0 20px;border-radius:8px;overflow:hidden;isolation:isolate;
  font-family:var(--ui);font-weight:600;font-size:16px;letter-spacing:0;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.18),
    0 1px 2px rgba(0,0,0,.4),0 10px 26px -12px var(--glow);
  transition:background-color .18s,filter .18s,box-shadow .22s,transform .12s}
.authbtn svg{width:24px;height:24px;flex:none;fill:currentColor}
/* світловий відблиск, що пробігає при наведенні */
.authbtn::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.22) 48%,transparent 66%);
  transform:translateX(-120%);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.authbtn:hover::before{transform:translateX(120%)}
.authbtn:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.18),
    0 1px 2px rgba(0,0,0,.4),0 14px 34px -10px var(--glow)}
.authbtn:active{transform:translateY(1px)}
.authbtn:focus-visible{outline:2px solid #8cb8ff;outline-offset:3px;border-radius:8px}
.authbtn--dc{--glow:rgba(88,101,242,.85);background-color:#5865f2}
.authbtn--dc:hover{background-color:#4752c4}
.authbtn--dc:active{background-color:#3c45a5}
.authbtn--bn{--glow:rgba(20,142,255,.85);
  background:linear-gradient(180deg,#36a2ff 0%,#148eff 48%,#0a74e6 100%)}
.authbtn--bn:hover{filter:brightness(1.08) saturate(1.05)}
.authbtn--bn:active{filter:brightness(.94)}
/* очікування: замість знака — спінер, підпис міняється */
.authbtn.is-busy{pointer-events:none}
.authbtn.is-busy svg{display:none}
.authbtn.is-busy > span{display:inline-flex;align-items:center;gap:12px}
.authbtn.is-busy > span::before{content:"";width:18px;height:18px;border-radius:50%;
  border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.auth__hint{margin-top:12px;font-size:13px;color:var(--muted)}

/* згода: без позначки кнопки входу неактивні — дані не обробляються до згоди */
.consent{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px;padding:12px 14px;
  border-radius:8px;text-align:left;cursor:pointer;font-size:14px;line-height:1.5;
  color:var(--soft);background:rgba(216,178,94,.06);border:1px solid rgba(216,178,94,.22);
  transition:border-color .2s,background-color .2s}
.consent:hover{border-color:rgba(216,178,94,.45)}
.consent input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.consent__box{position:relative;flex:none;width:20px;height:20px;margin-top:1px;border-radius:4px;
  background:rgba(3,7,18,.7);border:1.5px solid #c9a04c;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.6);transition:background .15s,box-shadow .15s}
.consent__box svg{position:absolute;inset:1px;width:15px;height:15px;opacity:0;transform:scale(.6);
  transition:opacity .15s,transform .18s cubic-bezier(.3,1.6,.5,1)}
.consent input:checked + .consent__box{background:linear-gradient(180deg,#ffe6a0,#e2b347 55%,#b98a2a);
  border-color:#f5d27a;box-shadow:0 0 10px rgba(245,197,52,.45)}
.consent input:checked + .consent__box svg{opacity:1;transform:none}
.consent input:focus-visible + .consent__box{outline:2px solid var(--gold-hot);outline-offset:2px}
.consent a,.linkbtn{color:var(--link);text-decoration:underline;text-decoration-color:rgba(240,199,107,.4);
  text-underline-offset:3px}
.consent a:hover,.linkbtn:hover{text-decoration-color:currentColor}
.linkbtn{padding:0;font:inherit;display:inline}
.consent.is-nudge{border-color:var(--gold-hot);background:rgba(245,197,52,.12);animation:nudge .42s}
@keyframes nudge{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.auth.is-locked .authbtn{filter:grayscale(.6) brightness(.72);opacity:.55;cursor:not-allowed;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.auth.is-locked .authbtn::before{display:none}

/* політика приватності — модальне вікно */
.pmodal{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:16px;
  background:rgba(3,7,18,.78);backdrop-filter:blur(4px)}
.pmodal__panel{position:relative;width:min(620px,100%);max-height:min(86dvh,760px);overflow-y:auto;
  padding:clamp(20px,3.4vw,30px);border-radius:10px;
  background:#0d1a33;border:1px solid rgba(216,178,94,.42);
  box-shadow:0 30px 80px rgba(0,0,0,.7);
  animation:pop .22s cubic-bezier(.2,.9,.25,1) both}
@keyframes pop{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:none;opacity:1}}
.pmodal__panel h2{font-size:clamp(24px,3.4vw,30px);line-height:1.15;padding-right:36px}
.pmodal__lede{margin-top:8px;color:var(--text-c);font-size:15px}
.pmodal__x{position:absolute;top:14px;right:14px;width:36px;height:36px;font-size:1.7rem;line-height:1;
  color:var(--muted)}
.pmodal__x:hover{color:var(--gold)}
.pol{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:13px}
.pol li{display:grid;grid-template-columns:150px 1fr;gap:4px 16px;padding-top:13px;
  border-top:1px solid var(--line);font-size:15px;line-height:1.5}
.pol li:first-child{border-top:0;padding-top:0}
.pol b{font:600 14px/1.5 var(--ui);color:var(--link)}
.pol span{color:var(--text-c)}
.pol em{font-style:normal;color:var(--ivory);font-weight:600}
@media (max-width:560px){ .pol li{grid-template-columns:1fr} }
.pmodal__foot{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted)}

/* мої дані — у кабінеті */
.mydata{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.consent--inline{margin:14px 0 0}
/* вимкнений перемикач: видно, що він не натискається, і чому */
.consent.is-off{cursor:not-allowed;opacity:.62}
.consent.is-off .consent__box{background:rgba(255,255,255,.04);border-style:dashed}
.consent__note{display:block;margin-top:4px;font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--gold-hot,#f0c76b)}
.btn--danger{border:1px solid rgba(224,86,79,.5);color:#ffb3ad}
.btn--danger:hover{background:rgba(224,86,79,.12);border-color:var(--crit)}
.muted{color:var(--muted)}

.gate__notes{list-style:none;margin:18px 0 0;padding:16px 0 0;
  border-top:1px solid rgba(216,178,94,.2);display:flex;flex-direction:column;gap:12px;
  text-align:left;font-size:14px;line-height:1.5;color:var(--text-c)}
.gate__notes li{display:flex;gap:11px;align-items:flex-start}
.gate__notes .mark{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:8px;margin-top:1px;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.gate__notes .mark svg{width:16px;height:16px;fill:currentColor}
.mark--dc{background:#5865f2}
.mark--bn{background:linear-gradient(180deg,#36a2ff,#0a74e6)}
.gate__notes b{color:var(--ivory);font-weight:600}
.gate__foot{margin-top:18px;font-size:13px;color:var(--muted)}

/* ───── загальні кнопки ───── */
/* ───── кнопки: як на головній ───── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:46px;padding:0 22px;border-radius:6px;border:1px solid transparent;
  font:600 15px/1.2 var(--ui);white-space:nowrap;
  transition:background .15s,border-color .15s,box-shadow .15s,transform .12s}
.btn:active{transform:translateY(1px)}
.btn--gold{background:var(--btn);color:var(--ink);box-shadow:0 6px 18px rgba(233,185,73,.16)}
.btn--gold:hover{background:#f3c95c;box-shadow:0 8px 24px rgba(233,185,73,.26)}
.btn--ghost{background:rgba(255,243,214,.08);border-color:var(--edge);color:#fff3d6}
.btn--ghost:hover{background:rgba(255,243,214,.14);border-color:rgba(216,178,94,.7)}
.btn--sm{height:38px;padding:0 16px;font-size:14px}
/* посилання-кнопка: текст + золотий кружок зі стрілкою (→ у кабінеті, ↗ в інший інструмент) */
.lpill{display:inline-flex;align-items:center;gap:10px;min-height:38px;padding:5px 5px 5px 16px;border-radius:20px;
  align-self:flex-start;background:rgba(13,26,51,.75);border:1px solid rgba(216,178,94,.4);color:var(--ivory);
  font:600 14px/1.2 var(--ui);text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color .15s,background .15s}
.lpill>i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--btn);flex:none;transition:transform .2s}
.lpill>i::before{content:"";width:14px;height:14px;background:var(--ink);-webkit-mask:var(--i-arrow) center/contain no-repeat;mask:var(--i-arrow) center/contain no-repeat}
.lpill--ext>i::before{-webkit-mask-image:var(--i-ext);mask-image:var(--i-ext)}
.lpill:hover{border-color:rgba(233,185,73,.8);background:rgba(19,33,61,.9)}
.lpill:hover>i{transform:translateX(2px)}
.lpill--ext:hover>i{transform:translate(1px,-1px)}

/* ───── каркас: шапка розділу на всю ширину, вкладки, робоча область ───── */
:root{--gut:clamp(16px,4vw,32px);--wrap:1232px}
.shell{padding-bottom:80px}
.pban__in,.ptabs__in,.view{width:min(var(--wrap),calc(100% - 2 * var(--gut)));margin-inline:auto}
.view{padding-top:clamp(24px,3vw,32px)}

/* шапка: офіційний арт гри (екрани завантаження, рейдові ілюстрації), що розчиняється в тлі сторінки */
.pban{position:relative;isolation:isolate;padding:clamp(28px,4vw,48px) 0 clamp(26px,3vw,36px)}
.pban::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,16,31,.88) 0%,rgba(7,16,31,.45) 48%,rgba(7,16,31,.72) 100%),
    linear-gradient(180deg,rgba(7,16,31,.35) 0%,rgba(7,16,31,.6) 70%),
    var(--bn,none) center 38%/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}
.pban--ek{--bn:url(img/bn-ek.webp)}
.pban--kal{--bn:url(img/bn-kal.webp)}
.pban--fire{--bn:url(img/bn-fire.webp)}
.pban--stock{--bn:url(img/bn-stock.webp)}
.pban--forge{--bn:url(img/bn-forge.webp)}
.pban--lfg{--bn:url(img/bn-lfg.webp)}
.pban--intel{--bn:url(img/bn-intel.webp)}
.pban__t{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;
  font:800 clamp(40px,5vw,64px)/1.05 var(--serif);color:#fff3d6;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.pban__tag{align-self:center;text-shadow:none}
.pban__lede{margin-top:12px;max-width:64ch;font-size:17px;line-height:26px;color:var(--soft);text-shadow:0 1px 10px rgba(0,0,0,.7)}
.pban__wait{padding:40px 0;color:var(--muted)}
.pban .backlink{margin-bottom:22px}

/* вкладки під шапкою: золота риска під поточною; прилипають під верхньою панеллю */
.ptabs{position:sticky;top:var(--abar-h,60px);z-index:40;
  background:rgba(7,16,31,.9);border-bottom:1px solid var(--line);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ptabs__in{display:flex;align-items:stretch;gap:clamp(18px,2.4vw,30px);height:56px;overflow-x:auto;scrollbar-width:none}
.ptabs__in::-webkit-scrollbar{display:none}
.tab{position:relative;display:inline-flex;align-items:center;gap:8px;flex:none;
  font:600 15px/1 var(--ui);color:var(--soft);white-space:nowrap;transition:color .15s}
.tab:hover{color:var(--ivory)}
.tab[aria-current="page"]{color:#fff3d6}
.tab[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px 2px 0 0;
  background:var(--btn);box-shadow:0 0 10px rgba(233,185,73,.55)}
.ptabs__off{display:inline-flex;align-items:stretch;gap:clamp(18px,2.4vw,30px);flex:none;
  padding-left:clamp(12px,1.4vw,16px);position:relative}
.ptabs__off::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:var(--line2)}
.ptabs__off[hidden]{display:none!important}
/* у старшини вкладок більше — тісніше, щоб на широкому екрані влізли всі */
@media (min-width:861px){ .ptabs__in:has(.ptabs__off:not([hidden])),.ptabs__in:has(.ptabs__off:not([hidden])) .ptabs__off{gap:clamp(14px,1.5vw,20px)} }
.ptabs__h{display:inline-flex;align-items:center;margin-right:calc(-1 * clamp(8px,1.2vw,16px));font:500 12px/1 var(--ui);color:var(--dim)}
.tab__n{min-width:20px;padding:2px 6px;border-radius:9px;background:var(--crit);color:#fff;font:700 11px/16px var(--ui);text-align:center}
.tab__dot{width:8px;height:8px;border-radius:50%;background:var(--crit);box-shadow:0 0 0 3px rgba(224,86,79,.2)}
.tab__dot--wait{background:var(--gold-hot);box-shadow:0 0 0 3px rgba(245,197,52,.2)}
.tab__dot--ok{background:var(--good);box-shadow:0 0 0 3px rgba(61,220,132,.18)}

/* ───── смуга фактів, як на головній ───── */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(24px,3vw,34px);
  border-radius:8px;border:1px solid var(--line2);background:rgba(7,16,31,.8);
  box-shadow:0 18px 40px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.facts--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.fact{display:flex;align-items:center;gap:14px;min-width:0;padding:18px 20px}
.fact+.fact{border-left:1px solid var(--line2)}
.fact__ic{width:44px;height:44px;flex:none;border-radius:6px;object-fit:cover;display:block;
  box-shadow:0 0 0 1.5px var(--frame),0 2px 8px rgba(0,0,0,.5)}
.fact__b{min-width:0}
.fact__k{font:500 13px/1.3 var(--ui);color:var(--muted)}
.fact__v{margin-top:2px;font:700 19px/1.25 var(--display);color:var(--ivory);overflow-wrap:break-word}
.fact__s{margin-top:1px;font-size:12.5px;line-height:1.35;color:var(--muted)}

/* ───── шапка профілю ───── */
.phero{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(300px,396px);gap:clamp(18px,3vw,36px);align-items:center}
.phero__id{display:flex;flex-direction:column;gap:12px;min-width:0}
.phero__name{font:800 clamp(40px,5vw,64px)/1.02 var(--serif);color:#fff3d6;text-shadow:0 2px 24px rgba(0,0,0,.65);overflow-wrap:anywhere}
.phero__row{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;font-size:14px;color:var(--muted)}
.phero__cls{font:600 14px/1.2 var(--ui);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.phero__tag b{color:var(--parch);font-weight:600}
.rankbox{display:inline-flex;align-items:center;gap:10px;padding:3px 14px 3px 3px;
  border-radius:6px;background:rgba(20,16,6,.6);border:1px solid rgba(245,197,52,.45)}
.rankbox img{width:30px;height:30px;flex:none;border-radius:4px}
.rankbox b{font:700 17px/1.2 var(--display);color:var(--gold-hot)}

/* ладдер звань */
.ladder{padding:16px 18px;border-radius:8px;background:rgba(7,16,31,.78);border:1px solid var(--line2);
  box-shadow:0 18px 40px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ladder__hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px;font:500 13px/1.3 var(--ui);color:var(--muted)}
.ladder__hd b{font-weight:600;color:var(--gold-hot)}
.ladder__row{display:grid;grid-template-columns:repeat(9,minmax(0,44px));gap:5px}
.ladder{min-width:0}
.ladder__i{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:4px;
  box-shadow:0 0 0 1px rgba(201,160,76,.45);filter:grayscale(.9) brightness(.45);transition:transform .2s}
.ladder__i.is-past{filter:saturate(.85) brightness(.9)}
.ladder__i.is-cur{filter:none;transform:scale(1.1);box-shadow:0 0 0 2px var(--gold-hot),0 0 16px rgba(245,197,52,.6)}
.ladder__track{position:relative;height:6px;margin-top:16px;border-radius:3px;overflow:hidden;background:rgba(3,6,15,.85);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.8)}
.ladder__fill{height:100%;min-width:4px;border-radius:3px;background:linear-gradient(90deg,#c99a24,#f5c534);
  box-shadow:0 0 10px rgba(245,197,52,.6);transition:width 1s cubic-bezier(.2,.8,.2,1)}
.ladder__note{margin-top:10px;font-size:13px;line-height:1.45;color:var(--text-c)}
.ladder__note b{color:#fff3d6}

/* HD-дракони рамки цілі з Dragonflight. Ступінь — за рангом, як у грі:
   срібний (рідкісний) → золотий (еліта) → крилатий (бос).
   Система координат 210×164: центр портрета (84, 82.5), радіус 50 — виміряно по текстурах. */
.dragon{position:relative;flex:none;width:clamp(176px,16vw,212px);aspect-ratio:210/164;container-type:inline-size}
.dragon__ava{position:absolute;left:16.19%;top:19.82%;width:47.62%;height:60.98%;
  border-radius:50%;overflow:hidden;background:#0a1226;z-index:1;box-shadow:inset 0 0 14px rgba(0,0,0,.75)}
.dragon__ava img{width:100%;height:100%;object-fit:cover;display:block}
/* золотий обідок замикає коло там, де дракона немає */
.dragon__ring{position:absolute;left:15%;top:18.29%;width:50%;height:64.02%;z-index:2;
  border-radius:50%;pointer-events:none;border:1.3cqw solid #c9a04c;
  box-shadow:0 0 0 1px rgba(30,18,2,.9),inset 0 0 0 1px rgba(30,18,2,.9),0 0 12px rgba(245,197,52,.25)}
.dragon--silver .dragon__ring{border-color:#b9bfc7}
.dragon__img{position:absolute;z-index:3;height:auto;pointer-events:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.6))}
.dragon--silver .dragon__img{left:3.657%;top:.772%;width:76.19%}
.dragon--elite  .dragon__img{left:3.756%;top:-.29%;width:74.286%}
.dragon--winged .dragon__img{left:3.786%;top:-1.484%;width:94.286%}
/* щиток очок пришпилений до обідка на 9 годину — там, де дракон лишає коло відкритим */
.dragon__pts{position:absolute;left:14.3%;top:51.2%;width:22%;z-index:4;
  transform:translate(-50%,-50%);display:grid;place-items:center;filter:drop-shadow(0 2px 6px rgba(0,0,0,.85))}
.dragon__pts img{width:100%;display:block}
.dragon__pts b{position:absolute;top:50%;left:50%;transform:translate(-50%,-62%);
  font-family:var(--display);font-weight:700;font-size:7.2cqw;line-height:1;color:#ffeec0;
  text-shadow:0 1px 2px #000,0 0 9px rgba(255,214,133,.6)}
.dragon.dragon--drawer{width:164px}

/* панель офіцера в шапці чужого профілю */
.offbar{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;margin-top:22px;padding:12px 16px;
  border-radius:8px;background:rgba(20,16,6,.72);border:1px solid rgba(245,197,52,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.offbar__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;font-size:14px;color:var(--muted)}
.offbar__meta b{color:var(--ivory);font-weight:600}
.offbar__hint{flex-basis:100%;font-size:13px;color:var(--dim)}
.backlink{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px 0 12px;border-radius:20px;
  font:600 14px/1 var(--ui);color:var(--ivory);background:rgba(13,26,51,.75);border:1px solid rgba(216,178,94,.4)}
.backlink:hover{border-color:rgba(233,185,73,.8);background:rgba(19,33,61,.9)}

/* ───── огляд: дві колонки ───── */
.notes{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
.notes .notice{margin:0}
.ov{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,448px);gap:24px;align-items:start}
.ov__col{display:flex;flex-direction:column;gap:20px;min-width:0}

/* ───── картки ───── */
.card{padding:clamp(18px,2vw,24px);border-radius:8px;min-width:0;background:var(--panel);border:1px solid var(--line)}
.card__t{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0 0 18px;font:700 22px/1.2 var(--display);color:var(--ivory)}
.card__n{font:600 13px/1 var(--ui);color:var(--link)}
.card__n--ok{color:var(--good)}
.sec__t{margin-bottom:16px;font:700 26px/1.2 var(--display);color:var(--ivory)}

/* перші кроки — як журнал завдань */
.quest{background:linear-gradient(180deg,rgba(245,197,52,.08),rgba(245,197,52,.015)),var(--panel);border-color:rgba(245,197,52,.45)}
.quest__hd{display:flex;align-items:center;gap:12px}
.quest__t{margin:0}
.quest__t b{font:600 14px/1 var(--ui);color:var(--link)}
.quest__x{margin-left:auto;align-self:center}
.quest__mark{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;
  font:800 19px/1 var(--serif);color:#3a2604;
  background:radial-gradient(circle at 35% 30%,#fff1bf,#f5c534 55%,#b8860b);
  box-shadow:0 0 0 1.5px #6b4a0c,0 0 16px rgba(245,197,52,.45)}
.quest__mark--sm{width:36px;height:36px;font-size:21px}
.quest__bar{height:6px;margin:16px 0;border-radius:3px;overflow:hidden;background:rgba(3,6,15,.8)}
.quest__bar span{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#c99a24,#f5c534);box-shadow:0 0 10px rgba(245,197,52,.5)}
.quest__cur{display:flex;align-items:center;gap:14px;padding:16px;border-radius:8px;background:rgba(7,16,31,.6);border:1px solid var(--line2)}
.quest__b{flex:1;min-width:0}
.quest__b b{display:block;font:600 16px/1.3 var(--ui);color:#fff3d6}
.quest__b p{margin-top:3px;font-size:14px;line-height:1.45;color:var(--text-c)}
.quest__more{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:14px}
.quest__lbl{font-size:13px;color:var(--muted);margin-right:2px}

/* мейн */
.mainc{position:relative;background:var(--panel);
  background:radial-gradient(130% 75% at 0% 0%,color-mix(in srgb,var(--cc,#d8b25e) 20%,transparent),transparent 62%),var(--panel)}
.mainc__top{display:flex;align-items:center;gap:16px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.mainc__por{width:76px;height:76px;flex:none;border-radius:8px;overflow:hidden;
  box-shadow:0 0 0 1.5px var(--frame),0 6px 16px rgba(0,0,0,.5)}
.mainc__por img{width:100%;height:100%;object-fit:cover;display:block}
.mainc__id{min-width:0}
.mainc__k,.stc__k{font:500 13px/1.3 var(--ui);color:var(--muted)}
.mainc__n{margin-top:2px;font:700 28px/1.15 var(--display);overflow-wrap:anywhere}
.mainc__d{margin-top:2px;font-size:14px;color:var(--text-c)}
.mainc__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:20px}
/* альти під мейном */
.alts{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.alts__hd{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.alts__k{font:700 17px/1.2 var(--display);color:var(--ivory)}
.alts__n{font-size:13px;color:var(--muted)}
.alts__list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alt{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 10px;border-radius:8px;
  background:rgba(255,255,255,.03);border:1px solid var(--line);border-left:3px solid var(--cc,var(--line))}
.alt__por{width:40px;height:40px;flex:none;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px rgba(214,176,106,.35)}
.alt__por img{width:100%;height:100%;object-fit:cover;display:block}
.alt__id{flex:1 1 140px;min-width:0;display:flex;flex-direction:column;gap:2px}
.alt__n{font:700 16px/1.2 var(--display);color:var(--cc,var(--ivory));overflow-wrap:anywhere}
.alt__d{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-c)}
.alt__ic{width:16px;height:16px;border-radius:3px;flex:none}
.alt__acts{display:flex;gap:12px;flex-wrap:wrap;margin-left:auto}
.alt__acts .is-armed{color:#fff;background:rgba(224,86,79,.35);border-radius:3px;padding:0 5px;text-decoration:none}
.alts__add{margin-top:10px}

/* статік у правій колонці */
.stc__top{display:flex;align-items:center;gap:14px}
.stc__id{min-width:0}
.stc__n{margin-top:2px;font:700 26px/1.15 var(--display);color:var(--ivory);overflow-wrap:anywhere}
.stc__d{margin-top:2px;font-size:13.5px;color:var(--text-c)}
.stc__cnt{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin:10px 0 18px;font:600 14px/1.3 var(--ui);color:var(--parch)}
.stc .spec{margin-bottom:18px}
.stc>.btn{margin-top:14px}
.stc>.muted{margin-bottom:0}

/* смуга місць у складі */
.slots{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;margin-top:16px}
.slots span{height:8px;border-radius:2px}
.slots__on{box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.slots__off{border:1px dashed rgba(216,178,94,.32)}
.slots--dense{gap:2px}

/* ряд «іконка + підпис + значення» */
.spec{display:flex;flex-direction:column;gap:12px}
.spec__row{display:flex;align-items:center;gap:14px}
.ico{width:38px;height:38px;flex:none;border-radius:6px;object-fit:cover;
  box-shadow:0 0 0 1.5px var(--frame),0 2px 6px rgba(0,0,0,.5);display:block}
.ico--rnd{border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.spec__k{font:500 13px/1.3 var(--ui);color:var(--muted)}
.spec__v{font:600 16px/1.3 var(--ui);color:var(--parch)}

/* ───── білд і маршрут ───── */
.ws__g{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px}
.ws__box{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:18px;border-radius:8px;background:rgba(7,16,31,.5);border:1px solid var(--line)}
.ws__box>*{max-width:100%}
.ws__h{display:flex;align-items:center;gap:10px;margin-bottom:16px;font:600 14px/1.3 var(--ui);color:var(--soft)}
.ws__ico{width:24px;height:24px;border-radius:5px;flex:none;box-shadow:0 0 0 1px rgba(216,178,94,.4)}
.ws__top{display:flex;align-items:center;gap:12px}
.ws__spec{width:44px;height:44px}
.ws__name{font:700 26px/1.15 var(--display);color:var(--ivory)}
.ws__name span{font:600 13px/1 var(--ui);color:var(--muted)}
.ws__sub{margin-top:4px;font-size:13px;color:var(--muted)}
.ws__trees{display:flex;flex-direction:column;gap:10px;width:100%;margin:18px 0 20px}
.ws__tree{display:grid;grid-template-columns:24px minmax(70px,auto) minmax(0,1fr) 28px;align-items:center;gap:10px}
.ws__tree img{width:24px;height:24px;border-radius:4px;box-shadow:0 0 0 1px rgba(10,8,2,.9),0 0 0 2px rgba(216,178,94,.3)}
.ws__tn{font-size:13.5px;color:var(--soft);white-space:nowrap}
.ws__tb{height:6px;border-radius:3px;overflow:hidden;background:rgba(3,6,15,.85)}
.ws__tb i{display:block;height:100%;border-radius:3px;background:rgba(217,207,180,.42)}
.ws__tree.is-top .ws__tb i{background:linear-gradient(90deg,#c99a24,#f5c534)}
.ws__tree b{font:700 18px/1 var(--display);color:var(--ivory);text-align:right}
.ws__tree.is-top b{color:var(--gold-hot)}
.ws__tree.is-zero{opacity:.55}
.ws__tree.is-zero img{filter:grayscale(1)}
.ws__bar{width:100%;height:6px;margin-top:14px;border-radius:3px;overflow:hidden;background:rgba(3,6,15,.85)}
.ws__bar span{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#3fd16b,#a4f0b8)}
.ws__steps{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 20px}
.ws__steps:empty{display:none}
.ws__step{position:relative;width:44px;height:44px;flex:none;border-radius:8px;background:#0a1226;
  box-shadow:0 0 0 1px rgba(10,8,2,.9),0 0 0 2px rgba(216,178,94,.35)}
.ws__step img{width:100%;height:100%;border-radius:8px;object-fit:cover;display:block}
.ws__step b{position:absolute;right:-6px;bottom:-6px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;display:grid;place-items:center;
  font:700 11px/1 var(--ui);color:#241705;background:var(--gold);box-shadow:0 0 0 2px #0a1226}
.ws__step.is-done img{filter:grayscale(.7) brightness(.6)}
.ws__step.is-done b{color:#0b1a10;background:var(--good)}
.ws__step.is-next{box-shadow:0 0 0 1px rgba(10,8,2,.9),0 0 0 2px var(--gold-hot),0 0 12px rgba(245,197,52,.5)}
.ws__more{align-self:center;font:600 13px/1 var(--ui);color:var(--muted)}
.ws__empty{margin-bottom:16px;font-size:14px;color:var(--text-c)}
.ws__box>.lpill{margin-top:auto}
.ws__steps:empty+.lpill,.ws__bar+.lpill{margin-top:20px}

/* ───── звершення: гекси, як на сайті ───── */
.achs{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:clamp(12px,2vw,22px)}
.achslot{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center}
.hex{position:relative;width:100%;max-width:150px;aspect-ratio:200/224;
  background:url("img/hex-open.svg") center/100% 100% no-repeat;
  filter:drop-shadow(0 0 12px rgba(245,197,52,.3)) drop-shadow(0 6px 14px rgba(0,0,0,.5))}
.hex__art{position:absolute;inset:8.5%;z-index:0;background:center/cover no-repeat;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.hex__veil{position:absolute;inset:8.5%;z-index:1;pointer-events:none;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  background:radial-gradient(78% 68% at 50% 40%,transparent 0 52%,rgba(24,12,2,.58) 100%),
             linear-gradient(180deg,transparent 52%,rgba(16,8,1,.55) 100%)}
.hex__sheen{position:absolute;inset:0;z-index:3;pointer-events:none;
  -webkit-mask:url("img/hex-rim-mask.svg") center/100% 100% no-repeat;
  mask:url("img/hex-rim-mask.svg") center/100% 100% no-repeat;
  background:linear-gradient(104deg,transparent 36%,rgba(255,246,214,.15) 44%,
    rgba(255,252,236,.85) 50%,rgba(255,246,214,.15) 56%,transparent 64%);
  background-size:260% 260%;animation:rimSweep 3.6s cubic-bezier(.5,0,.5,1) infinite}
@keyframes rimSweep{from{background-position:140% 140%}to{background-position:-40% -40%}}
.hex__pts{position:absolute;z-index:4;right:-2%;bottom:2%;width:38%;
  display:grid;place-items:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.6))}
.hex__pts img{width:100%;display:block}
.hex__pts b{position:absolute;top:50%;left:50%;transform:translate(-50%,-62%);
  font-family:var(--display);font-weight:700;font-size:.95rem;color:#ffeec0;
  text-shadow:0 1px 2px #000,0 0 9px rgba(255,214,133,.6)}
/* стакається: скільки разів здобуто — золота плашка зліва внизу, навпроти щитка з очками */
.hex__x{position:absolute;z-index:4;left:2%;bottom:9%;min-width:34%;padding:3px 7px 2px;border-radius:999px;text-align:center;
  font:700 .9rem/1 var(--display);color:#2a1700;background:linear-gradient(180deg,#ffe58a,#e9a92c);
  border:1px solid #fff0b8;box-shadow:0 2px 6px rgba(0,0,0,.6)}
/* ще не здобуте: порожня комірка з пунктирною рамкою */
.hex--empty{filter:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 224'%3E%3Cpolygon points='100,8 192,60 192,164 100,216 8,164 8,60' fill='%230a1528' stroke='%23d8b25e' stroke-opacity='.38' stroke-width='3' stroke-dasharray='10 9'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.achslot__n{font:700 15px/1.25 var(--display);color:var(--ivory)}
.achslot__d{font-size:13px;color:var(--link)}
.achslot.is-locked .achslot__n{color:var(--dim)}
.achslot.is-locked .achslot__d{color:var(--dim)}
.achs--sm{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))}
/* порожня комірка: герб гільдії ледь видно — місце для майбутнього звершення */
.hex--wait{position:relative}
.hex--wait::after{content:"";position:absolute;inset:30% 28%;background:url("/img/3ird-crest-128.webp") center/contain no-repeat;
  filter:grayscale(1) brightness(.9);opacity:.22}
.achnone{display:flex;align-items:center;gap:clamp(16px,3vw,28px)}
.achnone .hex{width:118px;flex:none}
.achnone__t b{display:block;font:700 19px/1.25 var(--display);color:var(--ivory)}
.achnone__t p{margin-top:6px;max-width:440px;font-size:14px;line-height:1.5;color:var(--text-c)}
.achnone__t a{color:var(--link)}

/* ───── стрічка нарахувань ───── */
.ledger{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ledger li{display:flex;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(216,178,94,.12)}
.ledger li:first-child{padding-top:0}
.ledger li:last-child{border-bottom:0;padding-bottom:0}
.ledger__amt{flex:none;min-width:40px;font:700 20px/1.2 var(--display);color:var(--good)}
.ledger__amt--neg{color:var(--crit)}
.ledger__body{flex:1;min-width:0}
.ledger__why{font-weight:600;color:var(--parch)}
.ledger__meta{font-size:13px;color:var(--muted)}

.warn{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:8px;margin-bottom:8px;
  background:rgba(224,86,79,.1);border:1px solid rgba(224,86,79,.38)}
.warn:last-child{margin-bottom:0}
.warn--soft{background:rgba(232,161,58,.1);border-color:rgba(232,161,58,.38)}
.warn__why{font-weight:600}
.warn__meta{font-size:13px;color:var(--muted)}
.warn__x{margin-left:auto;flex:none}

.empty{padding:22px 16px;border-radius:8px;text-align:center;font-size:14px;color:var(--muted);border:1px dashed var(--line2)}

/* ───── дрібні елементи ───── */
.ava{flex:none;display:grid;place-items:center;border-radius:50%;overflow:hidden;
  font-family:var(--display);font-weight:700;color:#0a1226;background:#0a1226;
  box-shadow:0 0 0 2px rgba(216,178,94,.55),0 4px 14px rgba(0,0,0,.5)}
.ava img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0;box-shadow:none}
.ava--md{width:40px;height:40px;font-size:1.05rem}
.ava--sm{width:30px;height:30px;font-size:.84rem}

.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:4px;
  font:600 12px/15px var(--ui);letter-spacing:0;white-space:nowrap;border:0}
.pill--ok{color:var(--good);background:rgba(61,220,132,.14)}
.pill--wait{color:var(--warn);background:rgba(232,161,58,.14)}
.pill--crit{color:#ff8e86;background:rgba(224,86,79,.16)}
.pill--dc{color:#a9b2ff;background:rgba(88,101,242,.2)}
.pill--gold{color:var(--gold-hot);background:rgba(245,197,52,.14)}
.pill--blue{color:#8cb8ff;background:rgba(140,184,255,.14)}
.pill--plain{color:var(--soft);background:rgba(255,243,214,.08)}
.pban .pill--gold,.scard__art .pill{background:rgba(20,16,6,.78)}
.pban .pill--ok,.scard__art .pill--ok{background:rgba(6,30,18,.8)}
.pban .pill--wait,.scard__art .pill--wait{background:rgba(36,22,4,.8)}
.dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font:600 11.5px/15px var(--ui);
  color:var(--gold-hot);background:rgba(245,197,52,.14)}
.badge--lead{color:#1a1300;background:var(--gold-hot)}
.rankico--sm{width:28px;height:28px;flex:none;border-radius:4px}
.clsname{font-weight:600}
.muted{color:var(--muted)}
.small{font-size:13px}
.linkbtn.small{font-size:13px}
.gap-top{margin-top:16px}
.row.gap-top,.btn.gap-top,.ledger.gap-top,p.gap-top,.linkbtn.gap-top{margin-top:12px}
.gap-b{margin-bottom:16px}
p.gap-b{margin-bottom:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:18px;
  font:600 14px/1 var(--ui);color:var(--soft);text-decoration:none;white-space:nowrap;
  background:rgba(255,243,214,.04);border:1px solid var(--line2);transition:background .15s,border-color .15s,color .15s}
.chip:hover{border-color:rgba(216,178,94,.6);color:var(--ivory)}
.chip b{font-weight:600;color:var(--muted)}
.chip[aria-pressed="true"]{background:var(--ivory);border-color:var(--ivory);color:var(--night)}
.chip[aria-pressed="true"] b{color:#6a5d40}
.chip--step{height:30px;padding:0 12px;font-size:13px}

/* ───── свій статік: шапка ───── */
.shead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(18px,3vw,32px);align-items:center}
.shead__tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.shead__name{font:800 clamp(40px,5vw,64px)/1.05 var(--serif);color:#fff3d6;text-shadow:0 2px 24px rgba(0,0,0,.65);overflow-wrap:anywhere}
.shead__lead{margin-top:8px;font-size:15px;color:var(--muted)}
.shead__lead b,.scard__lead b{color:var(--link);font-weight:600}
.shead__about{margin-top:14px;max-width:60ch;font:italic 400 clamp(17px,1.6vw,20px)/1.45 var(--quote);color:#e9d7a8;text-shadow:0 1px 10px rgba(0,0,0,.8)}
.shead__side{display:flex;flex-direction:column;align-items:flex-end;gap:10px;max-width:300px;text-align:right}
.shead__note{font-size:13px;color:var(--muted)}
.sedit-host:not(:empty){margin-bottom:24px}
/* прокрутка до картки не ховає її під верхньою панеллю й вкладками */
.view .card,.view [id],.sedit-host,.view>div{scroll-margin-top:140px}

/* склад — рейдові фрейми */
.raid__hd{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-bottom:20px}
.raid__t{font:700 clamp(30px,3vw,40px)/1.1 var(--display);color:var(--ivory)}
.raid__n{font:600 15px/1.3 var(--ui);color:var(--gold-hot)}
.raid__g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.raid__col{display:flex;flex-direction:column;gap:10px;min-width:0}
.raid__ch{display:flex;align-items:center;gap:10px;padding-bottom:12px;margin-bottom:2px;border-bottom:1px solid var(--line2);
  font:700 20px/1.2 var(--display);color:var(--ivory)}
.raid__ch .ico{width:28px;height:28px}
.raid__ch b{margin-left:auto;font:600 13px/1 var(--ui);color:var(--muted)}
.rframe{--cc:#7d7564;position:relative;display:flex;align-items:center;gap:12px;min-height:64px;padding:8px 12px 8px 8px;border-radius:6px;
  background:var(--panel-2);
  background:linear-gradient(90deg,color-mix(in srgb,var(--cc) 34%,#0d1a33) 0%,color-mix(in srgb,var(--cc) 18%,#0d1a33) 62%,#101d38 100%);
  border:1px solid color-mix(in srgb,var(--cc) 40%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 6px 16px rgba(0,0,0,.25)}
.rframe__por{width:48px;height:48px;flex:none;border-radius:50%;overflow:hidden;background:#0a1226;
  box-shadow:0 0 0 2px rgba(10,7,3,.9),0 0 0 3.5px color-mix(in srgb,var(--cc) 70%,#c9a04c)}
.rframe__por img{width:100%;height:100%;object-fit:cover;display:block}
.rframe__b{flex:1;min-width:0}
.rframe__n{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;font:600 16px/1.25 var(--ui);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.rframe__n .who__link{color:#fff}
.rframe__d{font-size:13px;color:rgba(255,243,214,.78);text-shadow:0 1px 3px rgba(0,0,0,.8)}
.rframe__role{width:26px;height:26px;margin-left:auto}
.rframe__x{padding:4px 8px;border-radius:4px;font:600 12px/1.2 var(--ui);color:var(--ivory);
  background:rgba(7,16,31,.7);border:1px solid var(--line2);opacity:0;transition:opacity .15s}
.rframe__x+.rframe__role{margin-left:0}
.rframe:hover .rframe__x,.rframe:focus-within .rframe__x{opacity:1}
@media (hover:none){ .rframe__x{opacity:1} }
.rslot{display:flex;align-items:center;justify-content:center;gap:8px;min-height:64px;padding:8px;border-radius:6px;
  font-size:14px;color:var(--muted);background:rgba(7,16,31,.35);border:1px dashed rgba(216,178,94,.32)}
.rslot span{font-size:18px;line-height:1;color:var(--dim)}

/* ───── вітрина складів ───── */
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));gap:24px}
.scard{--glow:rgba(216,178,94,.16);position:relative;display:flex;flex-direction:column;min-width:0;border-radius:8px;overflow:hidden;
  background:var(--panel);border:1px solid var(--line2);transition:transform .18s,border-color .18s,box-shadow .18s}
.scard:hover{transform:translateY(-2px);border-color:rgba(216,178,94,.5);box-shadow:0 18px 40px rgba(0,0,0,.4),0 0 0 1px var(--glow)}
.scard--mine{border-color:rgba(245,197,52,.7)}
.scard__art{position:relative;height:132px;overflow:hidden}
.scard__art img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.scard__art::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,26,51,.05) 0%,rgba(13,26,51,.5) 55%,var(--panel) 100%)}
.scard__mine{position:absolute;top:12px;left:12px;z-index:1}
.scard__rec{position:absolute;top:12px;right:12px;z-index:1}
.scard__body{position:relative;display:flex;flex-direction:column;flex:1;padding:0 clamp(18px,2vw,24px) 22px;margin-top:-60px}
.scard__top{display:flex;align-items:flex-end;gap:16px}
.scard__id{min-width:0;padding-bottom:2px}
.scard__name{font:700 clamp(24px,2.2vw,30px)/1.15 var(--display);color:var(--ivory);overflow-wrap:anywhere}
.scard__lead{margin-top:4px;font-size:14px;color:var(--muted)}
.scard__about{margin-top:16px;font:italic 400 17px/1.5 var(--quote);color:#e9d7a8;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.scard__slots{display:flex;align-items:center;gap:12px;margin-top:16px;font:600 14px/1 var(--ui);color:var(--parch);white-space:nowrap}
.scard__slots .slots{flex:1;margin:0}
.scard__foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:auto;padding-top:20px}
.scard__tags{display:flex;flex-wrap:wrap;gap:6px}
.scard__act{display:flex;flex-wrap:wrap;gap:8px}

/* герб статіку — штандарт, як прапорці гільдій у грі: високе полотнище 100:192 з гострим низом під 90°,
   подвійна бронзова рамка (SVG-фон), зображення обрізане по внутрішньому полю. Тінь — drop-shadow (рамка прозора довкола). */
.slogo{position:relative;flex:none;width:52px;height:auto;aspect-ratio:100/192;border-radius:0;background:none;box-shadow:none;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.55))}
.slogo.slogo{height:auto;border-radius:0;box-shadow:none}
.slogo__f{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 192'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='.35' y2='1'%3E%3Cstop offset='0' stop-color='%23f0d083'/%3E%3Cstop offset='.35' stop-color='%23a77a2c'/%3E%3Cstop offset='.62' stop-color='%23e0b964'/%3E%3Cstop offset='1' stop-color='%236f4c17'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon points='0.00,0.00 100.00,0.00 100.00,142.00 50.00,192.00 0.00,142.00' fill='%230a0703'/%3E%3Cpolygon points='1.00,1.00 99.00,1.00 99.00,141.59 50.00,190.59 1.00,141.59' fill='url(%23g)'/%3E%3Cpolygon points='4.20,4.20 95.80,4.20 95.80,140.26 50.00,186.06 4.20,140.26' fill='%230b0c10'/%3E%3Cpolygon points='8.40,8.40 91.60,8.40 91.60,138.52 50.00,180.12 8.40,138.52' fill='url(%23g)'/%3E%3Cpolygon points='10.20,10.20 89.80,10.20 89.80,137.78 50.00,177.58 10.20,137.78' fill='%230a0703'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.slogo__in{position:absolute;inset:0;display:grid;place-items:center;
  clip-path:polygon(10.8% 5.63%,89.2% 5.63%,89.2% 71.63%,50% 92.05%,10.8% 71.63%);
  background:radial-gradient(90% 60% at 35% 22%,#2e3f5c,#0c1424)}
.slogo__in img{width:100%;height:100%;object-fit:cover;display:block}
.slogo__in::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,236,190,.12),rgba(255,236,190,0) 18%,rgba(0,0,0,0) 62%,rgba(0,0,0,.3))}
.slogo__ini{margin-bottom:24%;font-family:var(--display);font-weight:700;color:var(--gold);letter-spacing:.02em;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.7)}
.slogo--xs{width:30px}
.slogo--xs .slogo__ini{font-size:.8rem}
.slogo.fact__ic{width:28px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.slogo--sm{width:44px}
.slogo--sm .slogo__ini{font-size:1.05rem}
.slogo--lg{width:78px}
.slogo--lg .slogo__ini{font-size:1.8rem}
.slogo--xl{width:clamp(96px,9.5vw,124px)}
.slogo--xl .slogo__ini{font-size:clamp(2.2rem,4vw,2.8rem)}
.sedit__logo{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.sedit__lbtn{display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex:1;min-width:min(240px,100%)}
.sedit__lbtn p{flex-basis:100%}

/* ───── реєстр і таблиці ───── */
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.toolbar .field{min-width:190px}
.field--bare>label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.field--search{flex:1 1 240px;max-width:320px}
.field--search .inp{width:100%;padding-left:38px;
  background:rgba(7,16,31,.75) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23958c76' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='4.6'/%3E%3Cpath d='m10.4 10.4 3.2 3.2'/%3E%3C/svg%3E") 13px 50%/15px 15px no-repeat}
.field--search .inp::-webkit-search-cancel-button{filter:invert(.6) sepia(.4)}
.pick__pre{color:var(--muted);font-weight:400}
.tablewrap{position:relative;overflow-x:auto;border-radius:8px;border:1px solid var(--line2);background:var(--panel);
  scrollbar-width:thin;scrollbar-color:rgba(216,178,94,.4) transparent}
table{border-collapse:collapse;width:100%;min-width:860px;font-size:14px}
th,td{padding:12px 14px;text-align:left;vertical-align:middle;white-space:nowrap;border-bottom:1px solid rgba(216,178,94,.1)}
th{font:600 13px/1.3 var(--ui);color:var(--muted);background:rgba(7,16,31,.55);white-space:normal;vertical-align:bottom}
tbody tr{transition:background .12s;cursor:pointer}
tbody tr:hover{background:rgba(255,243,214,.035)}
tbody tr:last-child td{border-bottom:0}
.who{display:flex;align-items:center;gap:12px;min-width:0}
.who__n{font-weight:600;font-size:15px;color:var(--parch);white-space:nowrap}
.who__d{font-size:12.5px;color:var(--muted);white-space:nowrap}
.who__link{padding:0;font:inherit;font-weight:600;color:inherit;text-align:left;cursor:pointer;
  text-decoration:underline;text-decoration-color:rgba(239,226,192,.25);text-underline-offset:3px}
.who__link:hover{text-decoration-color:currentColor}
.cellico{display:flex;align-items:center;gap:9px;white-space:nowrap}
.cellico img{width:28px;height:28px;flex:none;border-radius:4px}
.cellico img.ico--rnd{border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.6)}
.ico--sq{width:28px;height:28px;border-radius:4px}
.ptsbar{display:flex;flex-direction:column;gap:6px}
.ptsbar b{font:700 17px/1 var(--display);color:var(--ivory)}
.ptsbar__t{width:64px;height:4px;border-radius:2px;overflow:hidden;background:rgba(3,6,15,.85)}
.ptsbar__t i{display:block;height:100%;min-width:3px;border-radius:2px;background:linear-gradient(90deg,#c99a24,#f5c534)}
.ptsbar.is-ready .ptsbar__t i{background:linear-gradient(90deg,#3fd16b,#a4f0b8)}
td.td--act{width:1%;text-align:right;padding-top:8px;padding-bottom:8px}
.btn--xs{height:32px;padding:0 12px;font-size:13px;border-radius:6px}

/* ───── поля форм ───── */
.form{display:grid;gap:12px}
.form>.btn{justify-self:start}
.form__grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.field{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0}
.field label{font:500 13px/1.3 var(--ui);color:var(--muted)}
.field--num{max-width:110px}
.field--lvl{max-width:190px}
.inp{height:42px;padding:0 12px;border-radius:6px;background:rgba(7,16,31,.75);
  border:1px solid var(--line2);color:var(--parch);font-size:15px;min-width:0;transition:border-color .15s,box-shadow .15s}
.inp::placeholder{color:var(--dim)}
.inp:hover{border-color:rgba(216,178,94,.42)}
.inp:focus{outline:0;border-color:var(--btn);box-shadow:0 0 0 3px rgba(233,185,73,.15)}
textarea.inp{height:auto;min-height:76px;padding:10px 12px;line-height:1.45;resize:vertical}
textarea.inp--short{min-height:64px}
input[type=date].inp{color-scheme:dark}

/* випадаючий список з іконками (рідний select картинок не показує) */
.pick{position:relative}
.pick__btn{position:relative;display:flex;align-items:center;gap:10px;width:100%;height:42px;
  padding:0 36px 0 12px;border-radius:6px;text-align:left;font-size:15px;
  background:rgba(7,16,31,.75);border:1px solid var(--line2);color:var(--parch)}
.pick__btn:has(.pick__ico){padding-left:7px}
.pick__btn::after{content:"";position:absolute;right:13px;top:50%;width:11px;height:11px;margin-top:-5.5px;
  background:var(--i-chev) center/contain no-repeat;transition:transform .15s}
.pick__btn[aria-expanded="true"]{border-color:var(--btn)}
.pick__btn[aria-expanded="true"]::after{transform:rotate(180deg)}
.pick__btn:hover{border-color:rgba(216,178,94,.42)}
.pick__ico{width:28px;height:28px;flex:none;border-radius:4px}
.pick__ico--rnd{border-radius:50%}
.pick__txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pick__list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;
  max-height:300px;overflow-y:auto;margin:0;padding:6px;list-style:none;border-radius:8px;
  background:#0d1a33;border:1px solid rgba(216,178,94,.4);box-shadow:0 24px 48px rgba(0,0,0,.55)}
.pick__list.up{top:auto;bottom:calc(100% + 4px)}
.pick__opt{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:6px;cursor:pointer}
.pick__opt:hover,.pick__opt.is-active{background:rgba(255,243,214,.07)}
.pick__opt[aria-selected="true"] .pick__txt{color:var(--gold-hot);font-weight:600}

/* ───── шухляда офіцера ───── */
.drawer{position:fixed;inset:0;z-index:60;display:grid;justify-items:end;
  background:rgba(3,7,18,.72);backdrop-filter:blur(3px)}
.drawer__panel{width:min(470px,100%);height:100%;overflow-y:auto;
  padding:clamp(18px,3vw,26px);background:#0b1730;
  border-left:1px solid rgba(216,178,94,.22);box-shadow:-20px 0 60px rgba(0,0,0,.6);
  animation:slide .25s cubic-bezier(.2,.9,.25,1) both}
@keyframes slide{from{transform:translateX(26px);opacity:0}to{transform:none;opacity:1}}
.drawer__top{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}
.drawer__x{margin-left:auto;width:34px;height:34px;font-size:1.6rem;line-height:1;color:var(--muted)}
.drawer__x:hover{color:var(--gold)}
.drawer__prof{margin-bottom:8px}
.drawer__ws{display:flex;flex-direction:column;gap:0}
.drawer__ws .buildrow{padding-top:9px;padding-bottom:2px}
.drawer__panel .notice--self{margin:0 0 4px;padding:12px 14px}
.drawer__panel .notice--self .notice__t{font-size:1.05rem}
.drawer__panel .notice--self p{margin-bottom:0;font-size:.9rem}
.dw__n{font:700 22px/1.2 var(--display);color:var(--ivory)}
.dw__d{margin-top:2px;font:500 13px/1.3 var(--ui);color:var(--link)}
.sect{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.sect__t{font:700 18px/1.25 var(--display);color:var(--ivory);margin-bottom:12px}
.row{display:flex;gap:9px;align-items:flex-end;flex-wrap:wrap}
.row>.field{flex:1}
.buildrow{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;padding-top:12px;border-top:1px solid rgba(216,178,94,.12)}
.buildrow__k{font:500 13px/1.3 var(--ui);color:var(--muted)}
.buildrow__v{font:700 20px/1.2 var(--display);color:var(--ivory)}
.achslot__acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.achslot__acts .linkbtn:disabled{opacity:.4;cursor:not-allowed;text-decoration:none}
.achslot__x{color:#ffb3ad}
.achslot__x.is-armed{color:#fff;background:rgba(224,86,79,.35);border-radius:3px;padding:0 5px;text-decoration:none}
.achedit{margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.02)}
.achedit__t{font:700 17px/1.25 var(--display);color:var(--ivory);margin-bottom:10px}
.achedit__grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}

/* ───── заявки ───── */
.app{padding:18px;border-radius:8px;margin-bottom:12px;background:var(--panel);border:1px solid var(--line)}
.app__top{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.app__tags{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-left:auto}
.app__q{font:500 13px/1.3 var(--ui);color:var(--muted)}
.app__a{font-weight:600;margin-bottom:8px}
.app__hint{margin-top:6px}

/* ───── активність (офіцерам) ───── */
.readyl{display:flex;flex-wrap:wrap;gap:8px}
.readyl__i{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:40px;
  background:rgba(4,9,22,.5);border:1px solid rgba(69,224,122,.45);color:var(--parch);font:500 14px/1.2 var(--ui)}
.readyl__i:hover{border-color:var(--green)}
.readyl__n{font-weight:600;color:#fff3d6}
.minibar{display:flex;align-items:center;gap:8px;min-width:150px}
.minibar__t{flex:1;height:6px;border-radius:3px;overflow:hidden;background:rgba(3,6,15,.85)}
.minibar__f{height:100%;background:linear-gradient(90deg,#c99a24,#f5c534)}
.minibar.is-ready .minibar__f{background:linear-gradient(90deg,#3fd16b,#a4f0b8)}
.minibar__v{font:500 12px/1 var(--ui);color:var(--muted);white-space:nowrap}
.acttable td.num{white-space:nowrap}
.chpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.chpick .row{grid-column:1 / -1;align-items:center}
.chlist{max-height:300px;overflow:auto;padding:12px 14px;border-radius:8px;background:rgba(7,16,31,.5);border:1px solid var(--line)}
.chlist__t{font-weight:600;font-size:14px;color:var(--ivory);margin-bottom:4px}
.chlist__cat{margin-top:10px;font:600 12px/1.3 var(--ui);color:var(--muted)}
.chlist__i{display:flex;align-items:center;gap:8px;padding:3px 0;font:400 14px/1.3 var(--ui);color:var(--parch);cursor:pointer}
.chlist__i input{width:16px;height:16px;accent-color:#d8b25e}

/* ───── повідомлення ───── */
.notice{margin-bottom:16px;padding:18px 20px;border-radius:8px;
  background:linear-gradient(180deg,rgba(245,197,52,.07),rgba(245,197,52,.02)),var(--panel);border:1px solid rgba(245,197,52,.35)}
.notice--bn{background:linear-gradient(180deg,rgba(20,142,255,.08),rgba(20,142,255,.02)),var(--panel);border-color:rgba(20,142,255,.4)}
.notice--rules{border-color:rgba(245,197,52,.45)}
.notice--muted{background:var(--panel);border-color:rgba(160,170,190,.3)}
.notice__t{font:700 20px/1.25 var(--display);color:var(--ivory);margin-bottom:6px}
.notice p{max-width:72ch;margin-bottom:12px;color:var(--text-c)}
.notice__qt{font:500 13px/1.3 var(--ui);color:var(--muted);margin-bottom:4px}
.notice__q{margin:0 0 14px;padding:10px 14px;border-left:2px solid rgba(216,178,94,.55);border-radius:2px;
  background:rgba(255,255,255,.03);color:#e9d7a8;font:italic 400 17px/1.45 var(--quote);white-space:pre-wrap;max-width:72ch}
.card .notice__q{margin-bottom:12px}
.btn--bn{color:#fff;border:0;background:linear-gradient(180deg,#36a2ff,#0a74e6);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.btn--bn:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn--danger.is-armed{background:rgba(224,86,79,.24);border-color:var(--crit);color:#fff}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(10px);
  z-index:80;padding:12px 20px;border-radius:8px;opacity:0;pointer-events:none;
  background:#0d1a33;border:1px solid rgba(216,178,94,.55);color:#fff3d6;font-weight:600;
  box-shadow:0 14px 40px rgba(0,0,0,.65);transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

body.is-loading .gate,body.is-loading .shell{visibility:hidden}
.gate__err{width:100%;margin-top:18px;padding:12px 14px;border-radius:6px;text-align:left;
  font-size:.92rem;line-height:1.45;color:#ffd6d1;background:rgba(224,86,79,.14);border:1px solid rgba(224,86,79,.5)}
.gate__foot a{color:inherit;text-decoration:none}
.gate__foot a:hover{color:var(--gold)}
a.authbtn,a.btn{text-decoration:none}

/* ───── планшет ───── */
@media (max-width:1100px){
  .phero{grid-template-columns:auto minmax(0,1fr)}
  .ladder{grid-column:1 / -1}
  .shead{grid-template-columns:auto minmax(0,1fr)}
  .shead__side{grid-column:1 / -1;flex-direction:row;align-items:center;max-width:none;text-align:left;flex-wrap:wrap}
}
@media (max-width:980px){
  /* одна колонка: картки в порядку важливості */
  .ov{display:flex;flex-direction:column;align-items:stretch;gap:16px}
  .ov__col{display:contents}
  .o-1{order:1}.o-2{order:2}.o-3{order:3}.o-4{order:4}.o-5{order:5}.o-6{order:6}.o-7{order:7}.o-8{order:8}.o-9{order:9}.o-10{order:10}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact+.fact{border-left:0}
  .fact:nth-child(even){border-left:1px solid var(--line2)}
  .fact:nth-child(n+3){border-top:1px solid var(--line2)}
  .raid__g{grid-template-columns:minmax(0,1fr)}
}
/* ───── телефон ───── */
@media (max-width:860px){
  .ptabs__in{width:100%;height:auto;gap:8px;padding:10px var(--gut);align-items:center}
  .ptabs__in.is-r{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
  .ptabs__in.is-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px);mask-image:linear-gradient(90deg,transparent,#000 44px)}
  .ptabs__in.is-l.is-r{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent)}
  .tab{height:38px;padding:0 16px;border-radius:20px;font-size:14px;background:rgba(255,243,214,.04);border:1px solid var(--line2)}
  .tab[aria-current="page"]{background:var(--ivory);border-color:var(--ivory);color:var(--night)}
  .tab[aria-current="page"]::after{display:none}
  .ptabs__off{gap:8px;padding-left:9px;align-items:center}
  .ptabs__off::before{top:8px;bottom:8px}
  .ptabs__h{display:none}
}
@media (max-width:720px){
  .phero{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:14px}
  .phero__row{justify-content:center}
  .phero__name{font-size:clamp(36px,11vw,48px)}
  .dragon{width:clamp(170px,48vw,200px)}
  .ladder{width:100%;text-align:left}
  .shead{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
  .shead__tags{justify-content:center}
  .shead__about{margin-inline:auto}
  .shead__side{justify-content:center}
  .fact{gap:10px;padding:14px 12px}
  .fact__ic{width:36px;height:36px}
  .fact__v{font-size:16px}
  .quest__cur{flex-wrap:wrap}
  .quest__b{flex-basis:100%}
  .quest__cur .quest__mark{display:none}
  .quest__cur .lpill{flex:none}
  .quest__more:last-child{display:none}
  .mainc__n{font-size:24px}
  .scard__body{padding:0 16px 18px;margin-top:-48px}
  .scard__art{height:110px}
  .scard .slogo--lg{width:64px}
  .scard__name{font-size:24px}
  .scard__foot{flex-direction:column;align-items:stretch}
  .scard__act>.btn,.scard__foot>.lpill{align-self:flex-start}
  .toolbar .field{min-width:0;flex:1 1 160px}
  .field--search{max-width:none;flex-basis:100%}
  .pban__lede{font-size:16px;line-height:24px}
}
@media (max-width:420px){
  .facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .fact{flex-direction:row}
  .ws__tree{grid-template-columns:24px minmax(64px,auto) minmax(0,1fr) 26px;gap:8px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ───── кузня статіків ───── */
/* два шляхи для того, хто ще без складу */
.ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:20px}
.way{display:flex;flex-direction:column;align-items:flex-start}
.way__hd{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.way__ic{width:44px;height:44px;flex:none;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.way__t{margin:0}
.way__p{margin-bottom:16px;color:var(--text-c);line-height:1.55}
.way .btn{margin-top:auto}

/* мої заявки */
.myapp{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.myapp:first-of-type{border-top:0;padding-top:0}
.myapp__ic{width:40px;height:40px;flex:none;border-radius:8px}
img.myapp__ic{box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.myapp__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.myapp__b>b{font:600 16px/1.3 var(--ui);color:#fff3d6}
.myapp__d{font-size:13px;color:var(--muted)}
.myapp__acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.achips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.achips .pill small{font-weight:500;opacity:.7}
.app .achips{margin:0 0 10px}

/* анкета */
.aform__lede{margin:-8px 0 18px;color:var(--text-c)}
.aform__f{gap:18px}
.q{border:0;padding:0;margin:0;min-width:0}
.q__t{padding:0;margin-bottom:4px;font:700 18px/1.3 var(--display);color:var(--ivory)}
.q__h{margin-bottom:10px;font-size:13.5px;color:var(--muted)}
.tog{display:flex;flex-wrap:wrap;gap:8px;padding:2px;border-radius:20px;transition:box-shadow .2s}
.tog+.tog{margin-top:10px}
.tog.is-bad{box-shadow:0 0 0 2px rgba(224,86,79,.6)}
.tog__c{height:40px}
.tog__c b{font-weight:500}
.tog__c--ic{padding-left:5px;gap:9px}
.tog__i{width:30px;height:30px;flex:none;border-radius:50%;object-fit:cover;
  box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.55);transition:box-shadow .15s,filter .15s;filter:saturate(.85)}
.tog__c--ic:hover .tog__i{filter:none}
.tog__c[aria-pressed="true"] .tog__i{filter:none;box-shadow:0 0 0 1px #6a5d40,0 0 0 2px #2c2414}
.rtf{max-width:440px;margin:14px 0 0}
.rtf .inp{width:100%}
.inp.is-bad{border-color:rgba(224,86,79,.8);box-shadow:0 0 0 2px rgba(224,86,79,.35)}
.achips__i{width:16px;height:16px;flex:none;margin-left:-3px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.6)}
.achips .pill b{font-weight:600;color:var(--ivory)}
.tog__quick{display:flex;gap:14px;margin:8px 0 2px 4px}

/* як це працює: три ілюстровані кроки ланцюжком — арт, щит звершень з номером, стрілка до наступного */
.fsteps{margin-bottom:28px}
.fsteps__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;list-style:none;padding:0;margin:0}
.fstep{position:relative;display:flex;flex-direction:column;container-type:inline-size;border-radius:12px;
  background:var(--panel-2);border:1px solid var(--line2);
  box-shadow:0 16px 34px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,236,190,.06)}
.fstep__art{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:11px 11px 0 0}
.fstep__art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.fstep--1 .fstep__art img{object-position:50% 18%}
.fstep--2 .fstep__art img{object-position:50% 22%}
.fstep--3 .fstep__art img{object-position:50% 40%}
.fstep:hover .fstep__art img{transform:scale(1.045)}
.fstep__art::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,26,51,0) 40%,rgba(19,33,61,.75) 80%,var(--panel-2)),
             linear-gradient(90deg,rgba(7,16,31,.25),rgba(7,16,31,0) 30%,rgba(7,16,31,0) 70%,rgba(7,16,31,.25))}
.fstep__n{position:relative;z-index:2;display:grid;place-items:center;width:78px;height:72px;margin:-48px auto 0;
  background:url(img/wow-shield.webp) center/contain no-repeat;filter:drop-shadow(0 6px 10px rgba(0,0,0,.6))}
.fstep__n span{margin:-6px 0 0 1px;font:700 27px/1 var(--display);color:#ffe7a6;
  text-shadow:0 0 1px #000,0 2px 0 #000,0 0 12px rgba(245,197,52,.55)}
.fstep__b{flex:1;padding:6px 22px 24px;text-align:center;border-radius:0 0 11px 11px;
  background:linear-gradient(180deg,var(--panel-2),var(--panel))}
.fstep__k{display:block;margin-bottom:6px;font:600 11.5px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.fstep__t{display:block;margin-bottom:8px;font:700 21px/1.25 var(--display);color:var(--ivory)}
.fstep__b p{font-size:14px;line-height:1.55;color:var(--text-c)}
.fstep__go{position:absolute;z-index:3;top:calc(100cqw * .625 - 15px);right:-35px;display:grid;place-items:center;width:30px;height:30px;
  border-radius:50%;background:#0a1428;border:1px solid var(--edge);box-shadow:0 0 0 3px rgba(7,16,31,.9),0 0 14px rgba(245,197,52,.18)}
.fstep__go::before{content:"";position:absolute;z-index:-1;left:-12px;right:-12px;top:50%;height:1px;
  background:linear-gradient(90deg,rgba(216,178,94,0),rgba(216,178,94,.75),rgba(216,178,94,0))}
.fstep__go svg{width:15px;height:15px;fill:none;stroke:var(--gold-hot);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

.fcols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.fcols__side{display:flex;flex-direction:column;gap:20px;position:sticky;top:calc(var(--abar-h,60px) + 72px)}
.fgive__l{display:flex;flex-direction:column;gap:14px;padding:0;margin:0;list-style:none}
.fgive__l li{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;line-height:1.5;color:var(--soft)}
.fgive__i{width:34px;height:34px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5),0 3px 8px rgba(0,0,0,.4)}
.fcand__t{font:700 18px/1.3 var(--display);color:var(--ivory);margin-bottom:6px}
.fcand p{margin-bottom:14px;font-size:14px;line-height:1.5;color:var(--text-c)}

/* я в кузні */
.fstat{border-color:rgba(245,197,52,.4);background:linear-gradient(180deg,rgba(245,197,52,.07),rgba(245,197,52,0) 60%),var(--panel)}
.fstat__hd{display:flex;gap:16px;align-items:center;margin-bottom:16px}
.fstat__ic{width:56px;height:56px;flex:none;border-radius:10px;box-shadow:0 0 0 1px #000,0 0 0 2px var(--gold-hot),0 0 18px rgba(245,197,52,.35)}
.fstat__t{margin:0 0 4px}
.fstat__d{font-size:14px;color:var(--text-c)}
.fstat__who{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.fstat__who .ico{width:26px;height:26px}
.fstat__note{margin-top:12px;font:italic 400 17px/1.4 var(--quote);color:#e9d7a8}
.fstat__heat{margin-top:14px;padding:10px 14px;border-radius:8px;background:rgba(7,16,31,.55);font-size:14px;color:var(--soft)}
.fstat__heat b{color:var(--gold-hot)}

/* «Наші статіки»: підказка про кузню й мітка кандидатури */
.fnudge{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.fnudge__ic{width:48px;height:48px;flex:none;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.fnudge__b{flex:1 1 280px;min-width:0}
.fnudge__b b{display:block;font:700 18px/1.3 var(--display);color:var(--ivory)}
.fnudge__b p{margin-top:2px;font-size:14px;color:var(--text-c)}
.scard__cand{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* офіцерам: фільтри заявок, панель кузні, вибір і збір пачки */
.afilt{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.afilt__c{padding-left:6px}
.afilt__ic{width:24px;height:24px;flex:none;border-radius:5px}
img.afilt__ic{box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.4)}
.slogo.afilt__ic{width:14px;filter:none}
.slogo.afilt__ic .slogo__ini{font-size:8px}
.fpanel{display:flex;flex-direction:column;gap:10px}
.fpanel__r{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.fpanel__k{width:44px;font:600 13px/1 var(--ui);color:var(--muted)}
.fpanel__ic{width:18px;height:18px}
.fpanel__ic--sq{border-radius:4px;box-shadow:0 0 0 1px rgba(0,0,0,.6)}
.app.is-picked{border-color:rgba(245,197,52,.65);box-shadow:inset 3px 0 0 var(--gold-hot)}
.app__pick{margin:0;padding:6px;border:0;background:none}
.app__dec{margin-top:10px;border-top:1px solid var(--line);padding-top:10px}
.app__decs{width:max-content;cursor:pointer;font:600 14px/1 var(--ui);color:var(--link)}
.app__decs:hover{color:var(--gold-hot)}
.pickbar{position:relative;z-index:20;margin-top:16px;padding:14px 18px;border-radius:10px;
  background:rgba(13,26,51,.97);border:1px dashed var(--line2);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.pickbar.is-on{position:sticky;bottom:12px;border-style:solid;border-color:rgba(245,197,52,.6)}
.pickbar.is-on.is-open{position:relative;bottom:auto}
.pickbar__h{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}
.pickbar__h>b{font:600 16px/1 var(--ui);color:#fff3d6}
.pickbar__h .btn{margin-left:auto}
.pickbar .form{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}

@media (max-width:900px){
  .fsteps__list{grid-template-columns:1fr;gap:26px}
  .fstep{display:grid;grid-template-columns:112px minmax(0,1fr);container-type:normal}
  .fstep__art{aspect-ratio:auto;height:auto;min-height:150px;border-radius:11px 0 0 11px}
  .fstep__art::after{background:linear-gradient(90deg,rgba(13,26,51,0) 45%,var(--panel-2))}
  .fstep__n{position:absolute;left:78px;top:14px;width:56px;height:52px;margin:0}
  .fstep__n span{font-size:20px;margin-top:-4px}
  .fstep__b{padding:16px 16px 16px 30px;text-align:left;border-radius:0 11px 11px 0}
  .fstep__t{font-size:18px;margin-bottom:6px}
  .fstep__b p{font-size:13.5px}
  .fstep__go{top:auto;right:auto;bottom:-28px;left:41px;transform:rotate(90deg)}
  .fcols{grid-template-columns:minmax(0,1fr)}
  .fcols__side{position:static}
}
@media (max-width:620px){
  .myapp{flex-wrap:wrap}
  .myapp__acts{width:100%;justify-content:flex-start;padding-left:54px}
  .pickbar__h .btn{margin-left:0}
}

/* дії на рамці бійця (лідер, асистент) — стовпчиком праворуч, видно при наведенні */
.rframe__acts{display:flex;flex-direction:column;align-items:flex-end;gap:4px;margin-left:auto}
.rframe__acts+.rframe__role{margin-left:0}
/* керування складом (офіцерам) і видалення */
.manage{padding:clamp(18px,2vw,24px);border-radius:10px;border:1px solid rgba(245,197,52,.35);background:rgba(13,26,51,.6)}
.manage__hd{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.manage__t{margin:0;flex:1;min-width:0}
.manage .sedit{margin-top:20px}
.sedit__dz{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid rgba(224,86,79,.3)}
.sedit__dzt{flex:1 1 300px;min-width:0}
.sedit__dzt b{display:block;font:600 15px/1.3 var(--ui);color:#ffb3ad}
.sedit__dzt p{margin-top:3px;font-size:13.5px;line-height:1.45;color:var(--text-c)}

/* вийти зі складу; кнопка «прибрати» на рамці */
.sleave{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;margin-top:20px;padding:14px 16px;border-radius:8px;border:1px dashed rgba(224,86,79,.35)}
.sleave p{flex:1 1 320px;font-size:14px;line-height:1.5;color:var(--text-c)}
.rframe__x--kick{color:#ffb3ad}
.drawer__va{margin:-4px 0 14px}


/* новий статік (офіцери) */
.sbar{align-items:center;flex-wrap:wrap;gap:10px 14px}
.nstatic__lead{margin-top:16px}
.nstatic__role{margin-top:12px;max-width:360px}

/* ── наставництво: «Твій наставник» у бійця, «Твої підопічні» у старшини ── */
.mentor__hd{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.mentor__ic{width:48px;height:48px;flex:none;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px var(--gold),0 4px 12px rgba(0,0,0,.45)}
.mentor__t{margin:0 0 4px}
.mentor__lede{font-size:13.5px;line-height:1.45;color:var(--text-c)}
.mentor__box{padding:16px;border-radius:8px;border:1px solid rgba(245,197,52,.3);
  background:linear-gradient(180deg,rgba(245,197,52,.08),rgba(245,197,52,.02))}
.mentor__src{margin:10px 0 14px;font-size:13px;line-height:1.4;color:var(--muted)}
.mwho{display:flex;align-items:center;gap:12px;min-width:0}
.mwho__ava{width:40px;height:40px;flex:none;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.mwho--big .mwho__ava{width:60px;height:60px;box-shadow:0 0 0 2px #000,0 0 0 3px var(--gold-hot),0 0 18px rgba(245,197,52,.3)}
.mwho__b{min-width:0}
.mwho__n{display:block;font:600 15px/1.25 var(--ui);color:var(--ivory);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mwho--big .mwho__n{font:700 21px/1.2 var(--display)}
.mwho__r{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin-top:4px;font-size:13px;color:var(--soft)}
.mwho__dc{color:#a9b2ff}
.rankico--xs{width:20px;height:20px;flex:none;border-radius:3px}
.btn--dc{border:0;color:#fff;background:#5865f2;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.btn--dc:hover{background:#4752c4}
.mhelp{margin-top:18px}
.mhelp__lede{margin-bottom:12px;font-size:14.5px;line-height:1.5;color:var(--soft)}
.mhelp__l{display:flex;flex-direction:column;gap:10px;padding:0;margin:0;list-style:none}
.mhelp__l li{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.4;color:var(--soft)}
.mhelp__i{width:30px;height:30px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.45)}
.mhelp__note{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:12px 14px;border-radius:8px;
  background:rgba(140,184,255,.07);border:1px solid rgba(140,184,255,.22)}
.mhelp__note p{font-size:13.5px;line-height:1.5;color:var(--text-c)}
.mhelp__tip{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;line-height:1.5;color:var(--text-c)}
.mchange{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.mchange__t{font:600 15px/1.3 var(--ui);color:var(--ivory)}
.mlist{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}
.mlist__i{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.mlist__i:first-child{padding-top:0}
.mlist__i:last-child{border-bottom:0;padding-bottom:0}
.mlist__m{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding-left:52px}
.mlist__i>.btn{grid-column:2;grid-row:1}

/* ── пошук групи ── */
.lbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px}
.lbar__new{display:none}
.mwho.is-link{cursor:pointer;border-radius:8px}
.mwho.is-link:hover .mwho__n{text-decoration:underline;text-decoration-color:rgba(246,235,208,.4)}
.mwho.is-link:focus-visible{outline:2px solid var(--gold-hot);outline-offset:3px}
.lday{margin:26px 0 12px;font:700 20px/1.2 var(--display);color:var(--ivory)}
.lday:first-child{margin-top:0}
.lgrid{display:grid;gap:14px}
.lfg{padding:18px 20px;border-radius:10px;background:var(--panel);border:1px solid var(--line);
  border-left:3px solid var(--gold-hot);transition:border-color .2s}
.lfg.is-full{border-left-color:var(--good)}
.lfg.is-mine{border-color:rgba(245,197,52,.42);border-left-color:var(--gold-hot);
  background:linear-gradient(180deg,rgba(245,197,52,.06),rgba(245,197,52,0) 50%),var(--panel)}
.lfg.is-mine.is-full{border-left-color:var(--good)}
.lfg__hd{display:flex;align-items:center;gap:14px}
.lfg__ic{width:52px;height:52px;flex:none;border-radius:8px;object-fit:cover;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.6),0 4px 12px rgba(0,0,0,.5)}
.lfg__t{flex:1;min-width:0}
.lfg__n{margin:0;font:700 20px/1.2 var(--display);color:var(--ivory)}
.lfg__sub{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:5px;font-size:13px;color:var(--muted)}
.lfg__when{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right}
.lfg__when b{font:700 24px/1 var(--display);color:var(--gold-hot)}
.lfg__when span{font-size:12.5px;color:var(--text-c);white-space:nowrap}
.lfg__note{margin-top:12px;padding:10px 12px;border-radius:6px;background:rgba(255,243,214,.04);
  font:italic 400 15px/1.45 "Spectral",Georgia,serif;color:var(--parch)}
.lfg__slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}
.lslot{display:flex;align-items:center;gap:8px;min-width:0;height:44px;padding:0 10px 0 6px;border-radius:22px;
  background:rgba(7,16,31,.55);border:1px solid var(--line2);position:relative}
.lslot.is-free{background:transparent;border-style:dashed;border-color:rgba(216,178,94,.22)}
.lslot.is-free .lslot__r{filter:grayscale(1) brightness(.7);opacity:.6}
.lslot.is-me{border-color:var(--gold-hot);box-shadow:0 0 0 1px rgba(245,197,52,.35)}
.lslot__r{width:30px;height:30px;flex:none;border-radius:50%;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.lslot__n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 14px/1.2 var(--ui);color:var(--ivory)}
.lslot.is-free .lslot__n{font-weight:400;color:var(--dim)}
.lslot__lead{position:absolute;top:-8px;right:10px;padding:1px 6px;border-radius:4px;font:700 10px/1.4 var(--ui);
  letter-spacing:.04em;text-transform:uppercase;color:var(--ink);background:var(--gold-hot)}
.lfg__bench{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:10px;font-size:13px}
.lfg__bl{font:600 12px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.lbench{display:inline-flex;align-items:center;gap:6px;padding:2px 10px 2px 3px;border-radius:14px;background:rgba(255,243,214,.05);border:1px solid var(--line)}
.lbench.is-me{border-color:var(--gold-hot)}
.lbench__r{width:20px;height:20px;border-radius:50%}
.lfg__ft{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;
  margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.lfg__lead{font-size:13.5px;color:var(--muted)}
.lfg__lead b{font-weight:600;color:var(--soft)}
.lfg__acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.lfg__role{height:36px}
.lfg__role .tog__i{width:26px;height:26px}
.lfg__role[aria-pressed="true"]{cursor:default}
.lempty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 20px}
.lempty__ic{width:56px;height:56px;margin-bottom:6px;border-radius:10px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.lempty b{font:600 16px/1.3 var(--ui);color:var(--ivory)}
.lempty p{max-width:420px;font-size:14px;line-height:1.5}
.lnew .form{gap:14px}
.lnew__when{grid-template-columns:repeat(2,minmax(0,1fr))}
input[type=time].inp{color-scheme:dark}
.lnew__hint{line-height:1.45}
.lset__cur{color:var(--soft)}
.lset__st{padding:10px 12px;border-radius:6px;line-height:1.5;background:rgba(255,243,214,.04);border:1px solid var(--line)}
.lset__st.is-ok{color:var(--good);border-color:rgba(61,220,132,.35);background:rgba(61,220,132,.07)}
.lset__st.is-bad{color:#ffd59a;border-color:rgba(232,161,58,.45);background:rgba(232,161,58,.08)}
.lset__cur b{color:var(--ivory)}
.lset code{padding:1px 5px;border-radius:4px;background:rgba(7,16,31,.7);font:12.5px/1.4 ui-monospace,Consolas,monospace;color:var(--parch);word-break:break-all}
.lfgcols .fcols__side{position:static}
@media (max-width:900px){ .lbar__new{display:inline-flex} }
@media (max-width:720px){
  .lfg{padding:16px}
  .lfg__slots{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lfg__when b{font-size:20px}
  .lfg__n{font-size:18px}
  .lfg__acts{width:100%}
}

/* ── Інтел: світове PvP наших з аддона гільдії ── */
.ibar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.imap{position:relative;height:clamp(440px,64vh,660px);border-radius:10px;overflow:hidden;border:1px solid var(--line2);
  background:#1c2a3a;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.imap__map{position:absolute;inset:0;touch-action:none}
.atlas__cv{position:absolute;inset:0;display:block;cursor:grab;outline:none}
.atlas__cv.is-drag{cursor:grabbing}
.atlas__tip{position:absolute;left:0;top:0;z-index:6;max-width:290px;padding:8px 12px;border-radius:7px;pointer-events:none;
  background:rgba(8,15,33,.95);border:1px solid rgba(216,178,94,.4);box-shadow:0 10px 28px rgba(0,0,0,.55)}
.tip__t b{display:block;font:700 14px/1.25 var(--ui);color:#fff3d6}
.tip__t span{display:block;margin-top:2px;font:500 12.5px/1.35 var(--ui);color:var(--soft)}
.imap__legend{position:absolute;left:12px;bottom:12px;z-index:5;display:flex;flex-wrap:wrap;gap:6px 14px;padding:8px 13px;border-radius:18px;
  background:rgba(8,15,33,.86);border:1px solid var(--line);font:500 12.5px/1 var(--ui);color:var(--soft);pointer-events:none}
.imap__legend span{display:inline-flex;align-items:center;gap:7px}
.ilg{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(255,248,230,.85)}
.ilg--d{background:#ff5a4f}.ilg--m{background:#f5aa34}.ilg--k{background:#3ddc84}
.imap__note{position:absolute;left:50%;top:50%;z-index:6;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:5px;
  max-width:min(360px,80%);padding:16px 22px;border-radius:12px;text-align:center;background:rgba(8,15,33,.92);border:1px solid var(--line2);pointer-events:none}
.imap__note b{font:600 15px/1.3 var(--ui);color:var(--ivory)}
.imap__note span{font-size:13.5px;line-height:1.45;color:var(--text-c)}
.izone{margin-top:16px}
.izone:empty{display:none}
.izone__hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.izone__t{margin-bottom:10px}
.izone__n{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.izone__n .pill{padding:5px 10px;font-size:13px}
.izone__k{margin-bottom:9px;font:600 12px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.izone__subs{display:flex;flex-direction:column;gap:8px;padding:0;margin:0;list-style:none}
.izone__subs li{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 28px;align-items:center;gap:12px;font-size:14px;color:var(--soft)}
.izone__subs li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.izone__subs i{display:block;height:8px;border-radius:4px;background:linear-gradient(90deg,rgba(245,170,52,.85),rgba(255,90,79,.85))}
.izone__subs b{font-weight:600;text-align:right;color:var(--ivory)}
.ifeed{margin-top:16px}
.ifeed__l{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}
.ifeed__i{display:flex;align-items:center;gap:12px;padding:9px 8px;border-radius:6px;border-bottom:1px solid var(--line)}
.ifeed__i:last-child{border-bottom:0}
.ifeed__i.is-link{cursor:pointer}
.ifeed__i.is-link:hover,.ifeed__i.is-link:focus-visible{background:rgba(255,243,214,.05);outline:none}
.ifeed__ic{width:30px;height:30px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.45)}
.ifeed__b{flex:1;min-width:0}
.ifeed__b b{display:block;font:600 14px/1.3 var(--ui);color:var(--ivory)}
.ifeed__b span{display:block;margin-top:1px;font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ifeed__t{flex:none;font-size:12.5px;color:var(--muted);white-space:nowrap}
.iaddon__hd{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.iaddon__ic{width:44px;height:44px;flex:none;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px var(--gold),0 4px 12px rgba(0,0,0,.45)}
.iaddon__t{margin:0 0 4px}
.iaddon__l{margin-bottom:18px}
.iaddon__dl{width:100%}
.iaddon__steps{display:flex;flex-direction:column;gap:9px;margin:16px 0 0;padding-left:20px;font-size:13.5px;line-height:1.5;color:var(--soft)}
.iaddon__steps b,.iup__n b{font-weight:600;color:var(--ivory);overflow-wrap:anywhere}
.iaddon__n,.iup__n{margin-top:12px;line-height:1.45}
.iup__ta{width:100%;min-height:96px;font:12.5px/1.45 ui-monospace,Consolas,monospace;word-break:break-all}
.iup__f{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.intcols .fcols__side{position:static}
@media (max-width:720px){
  .imap{height:330px}
  .ibar{justify-content:flex-start}
  .izone__subs li{grid-template-columns:minmax(0,1fr) 72px 24px}
}

/* ───── Майстерня ───── */
.pban--craft{--bn:url(img/bn-craft.webp)}
.ccols .fcols__side{position:static}
/* якість предметів, як у грі */
.cq0{color:#9d9d9d}.cq1{color:#f2efe6}.cq2{color:#3dff3d}.cq3{color:#4aa3ff}.cq4{color:#c27dff}.cq5{color:#ff9a2e}
.cqb0{--qc:#6b6b6b}.cqb1{--qc:rgba(216,178,94,.55)}.cqb2{--qc:#2fbf2f}.cqb3{--qc:#3a86d9}.cqb4{--qc:#9b5fe0}.cqb5{--qc:#e07a14}
.cicon{position:relative;display:inline-grid;place-items:center;flex:none;width:44px;height:44px;border-radius:6px;background:#060a14;
  box-shadow:0 0 0 1px #000,0 0 0 2px var(--qc,rgba(216,178,94,.5)),0 4px 10px rgba(0,0,0,.45)}
.cicon img{width:100%;height:100%;border-radius:5px;object-fit:cover}
.cicon--big{width:64px;height:64px;border-radius:8px}
.cicon--big img{border-radius:7px}
.cicon--md{width:52px;height:52px;border-radius:7px}
.cicon--sm{width:30px;height:30px;border-radius:4px}
.cicon--sm img{border-radius:3px}
.cicon--xs{width:22px;height:22px;border-radius:3px;box-shadow:0 0 0 1px #000,0 0 0 1px var(--qc)}
.cicon--xs img{border-radius:2px}
.cicon__x{position:absolute;right:1px;bottom:0;font:700 11px/14px var(--ui);color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000,0 0 3px #000}

/* підвкладки */
.ctabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 22px;padding:5px;border-radius:12px;
  background:rgba(13,26,51,.72);border:1px solid var(--line)}
.ctabs::-webkit-scrollbar{display:none}
.ctab{display:inline-flex;align-items:center;gap:10px;flex:none;height:48px;padding:0 16px 0 8px;border-radius:9px;
  font:600 14.5px/1 var(--ui);color:var(--soft);transition:background .15s,color .15s,box-shadow .15s}
.ctab:hover{background:rgba(255,243,214,.06);color:var(--ivory)}
.ctab.is-on{background:linear-gradient(180deg,rgba(233,185,73,.2),rgba(233,185,73,.07));color:#fff3d6;box-shadow:inset 0 0 0 1px rgba(233,185,73,.55)}
.ctab__i{width:32px;height:32px;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.45)}
.ctab__n{min-width:22px;height:22px;padding:0 7px;border-radius:11px;display:inline-grid;place-items:center;
  font:700 12px/1 var(--ui);background:rgba(255,243,214,.1);color:var(--soft)}
.ctab__n.is-hot{background:var(--gold-hot);color:var(--ink)}
.fact__sm{font-size:13px;color:var(--muted);font-weight:500}

/* каталог */
.ccat__head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.csearch{position:relative;flex:1 1 320px;display:flex;align-items:center}
.csearch__i{position:absolute;left:9px;width:30px;height:30px;border-radius:5px;pointer-events:none;box-shadow:0 0 0 1px #000}
.csearch__inp{width:100%;height:50px;padding-left:50px;font-size:15px}
.ccat__cnt{font:500 13px/1 var(--ui);color:var(--muted)}
.cprofs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin-bottom:12px}
.cprof{display:flex;align-items:center;gap:10px;min-width:0;height:52px;padding:0 12px 0 8px;border-radius:10px;
  background:var(--panel);border:1px solid var(--line);text-align:left;transition:border-color .15s,background .15s}
.cprof:hover{border-color:var(--edge)}
.cprof.is-on{border-color:var(--gold-hot);background:linear-gradient(180deg,rgba(245,197,52,.16),rgba(245,197,52,.05))}
.cprof__i{width:34px;height:34px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.cprof__all{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:6px;background:rgba(245,197,52,.12);
  color:var(--gold-hot);font-size:16px;box-shadow:0 0 0 1px rgba(245,197,52,.4)}
.cprof__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.cprof__n{font:600 13.5px/1.15 var(--ui);color:var(--ivory);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cprof__c{font:500 12px/1 var(--ui);color:var(--muted)}
.cfilt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:-2px 0 14px}
.cfilt__q{display:flex;flex-wrap:wrap;gap:6px}
.cfilt__qb{gap:7px}
.cfilt__dot{width:9px;height:9px;border-radius:50%;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.6)}
.cfilt__lv{display:flex;align-items:center;gap:6px}
.cfilt__l{font:500 13px/1 var(--ui);color:var(--muted);margin-right:2px}
.cfilt__lv .inp{width:64px;height:34px;padding:0 8px;text-align:center}
.cfilt__dash{color:var(--muted)}
.cfilt__sel{min-width:200px}
.cfilt__sel .pick__btn{height:34px;font-size:13.5px}
.cfilt__sel .pick__pre{color:var(--muted)}
.cfilt__reset{font:600 13px/1 var(--ui);color:var(--gold-hot);text-decoration:underline;text-underline-offset:3px;padding:6px 2px}
.cfilt__reset[hidden]{display:none}
.ctile__lv{font-weight:600;color:var(--parch)}
.ccats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.ccats:empty{display:none}
.ccats .chip.is-empty{opacity:.45}
.ctiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:8px}
.ctile{display:flex;align-items:center;gap:12px;min-width:0;padding:10px 12px 10px 10px;border-radius:10px;background:var(--panel);
  border:1px solid var(--line);text-align:left;transition:border-color .15s,transform .15s,background .15s}
.ctile:hover,.ctile:focus-visible{border-color:var(--edge);background:var(--panel-2);transform:translateY(-1px)}
.ctile__t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ctile__n{font:600 14.5px/1.25 var(--ui);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ctile__s{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctile__go{flex:none;font:600 12.5px/1 var(--ui);color:var(--gold);opacity:0;transition:opacity .15s}
.ctile:hover .ctile__go,.ctile:focus-visible .ctile__go{opacity:1}
/* «Показати ще» — як у стрічці новин */
.cmore{margin-top:22px}
.nmore__row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(14px,2.4vw,28px);width:100%}
.nmore__row:empty{display:none}
.nmore__row::before,.nmore__row::after{content:"";height:1px;background:linear-gradient(90deg,transparent,rgba(233,185,73,.5))}
.nmore__row::after{background:linear-gradient(90deg,rgba(233,185,73,.5),transparent)}
.nmore{display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:6px 7px 6px 22px;border-radius:999px;
  border:1px solid rgba(233,185,73,.55);color:#fff3d6;font:600 15px/1 var(--ui);white-space:nowrap;
  background:linear-gradient(180deg,rgba(33,54,98,.95),rgba(14,26,52,.98));
  box-shadow:inset 0 1px 0 rgba(255,236,190,.14),0 10px 26px rgba(0,0,0,.38);transition:border-color .2s,box-shadow .2s,transform .2s}
.nmore>i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;flex:none;
  background:linear-gradient(180deg,#f3c95c,var(--btn));box-shadow:inset 0 1px 0 rgba(255,250,230,.6),0 2px 6px rgba(0,0,0,.35);transition:transform .2s}
.nmore>i::before{content:"";width:15px;height:15px;background:var(--ink);transform:rotate(90deg);
  -webkit-mask:var(--i-arrow) center/contain no-repeat;mask:var(--i-arrow) center/contain no-repeat}
.nmore:hover{border-color:var(--btn);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,236,190,.18),0 12px 30px rgba(0,0,0,.42),0 0 0 4px rgba(233,185,73,.12)}
.nmore:hover>i{transform:translateY(2px)}

/* плитка предмета (шухляда) */
.cdw{width:min(580px,100%)}
.cdw__top{align-items:center;gap:16px}
.cdw__tt{min-width:0}
.cdw__n{font:700 24px/1.15 var(--display)}
.cdw__s{margin-top:5px;font-size:13px;color:var(--muted)}
.ctip{margin:4px 0 16px;padding:12px 14px;border-radius:6px;font-size:14px;line-height:1.45;color:#f2efe6;
  background:linear-gradient(180deg,rgba(9,12,30,.97),rgba(5,7,20,.97));border:1px solid rgba(170,170,200,.32);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),0 8px 24px rgba(0,0,0,.4)}
.ctip__n{font:700 16px/1.3 var(--ui);margin-bottom:2px}
.ctip__lv{color:#ffd100}
.ctip__k{color:var(--muted);font-size:13px}
.ctip__2{display:flex;justify-content:space-between;gap:16px}
.ctip__g{color:#3dff3d}
.ctip__d{color:#ffd100}
.creag{margin-bottom:20px}
.creag__h,.cmix__h{margin-bottom:10px;font:600 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.creag__l{display:grid;gap:7px;padding:0;margin:0;list-style:none}
.creag__l--inline{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.creag__i{display:flex;align-items:center;gap:10px;min-width:0}
.creag__n{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.creag__k{font:600 13px/1 var(--ui);color:var(--soft)}

/* форма замовлення */
.cform{display:flex;flex-direction:column;gap:20px;padding-top:20px;border-top:1px solid var(--line)}
.cform__t{font:700 22px/1.2 var(--display)}
.cf__s{display:flex;flex-direction:column;gap:10px}
.cf__h{display:flex;align-items:center;gap:10px}
.cf__hi{width:30px;height:30px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.45)}
.cf__t{font:600 15px/1.25 var(--ui);color:var(--ivory)}
.cf__hint{margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--muted)}
.cqty__row{display:flex;align-items:center;gap:10px}
.cqty{display:inline-flex;align-items:center;border-radius:8px;border:1px solid var(--line2);background:rgba(7,16,31,.75);overflow:hidden}
.cqty__b{width:44px;height:44px;font-size:20px;line-height:1;color:var(--gold)}
.cqty__b:hover{background:rgba(255,243,214,.07);color:var(--gold-hot)}
.cqty__i{width:76px;height:44px;border:0;border-radius:0;text-align:center;background:transparent;font-weight:600;font-size:16px}
.cqty__i,.cmoney .inp,.cmix__give .inp{-moz-appearance:textfield;appearance:textfield}
.cqty__i::-webkit-inner-spin-button,.cqty__i::-webkit-outer-spin-button,.cmoney .inp::-webkit-inner-spin-button,
.cmoney .inp::-webkit-outer-spin-button,.cmix__give .inp::-webkit-inner-spin-button,.cmix__give .inp::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.cqty__p{display:flex;flex-wrap:wrap;gap:6px}
.cmoney{display:flex;flex-wrap:wrap;gap:10px}
.cmoney__f{position:relative;display:flex;align-items:center}
.cmoney__f .inp{width:140px;padding-right:38px;font-weight:600;font-size:16px}
.cmoney__f:last-child .inp{width:104px}
.cmoney__i{position:absolute;right:12px;width:16px;height:16px;pointer-events:none}
.cmoney__l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cterms{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.cmats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.cterm,.cmat{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;padding:10px 12px;border-radius:9px;text-align:left;
  background:rgba(7,16,31,.6);border:1px solid var(--line2);transition:border-color .15s,background .15s}
.cterm b,.cmat b{font:600 14px/1.2 var(--ui);color:var(--ivory)}
.cterm span,.cmat span{font-size:12px;line-height:1.35;color:var(--muted)}
.cterm:hover,.cmat:hover{border-color:var(--edge)}
.cterm[aria-checked="true"],.cmat[aria-checked="true"]{border-color:var(--gold-hot);background:rgba(245,197,52,.1);box-shadow:inset 0 0 0 1px rgba(245,197,52,.35)}
.cterm--hot span{color:#ff9d94}
.cterm--hot[aria-checked="true"]{border-color:#ff7a6e;background:rgba(224,86,79,.14);box-shadow:inset 0 0 0 1px rgba(255,122,110,.4)}
.cmix:empty{display:none}
.cmix{padding:12px 14px;border-radius:9px;background:rgba(255,243,214,.03);border:1px dashed var(--line2)}
.cmix__l{display:grid;gap:8px;padding:0;margin:0;list-style:none}
.cmix__i{display:flex;align-items:center;gap:10px;min-width:0}
.cmix__n{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmix__k{font:600 13px/1 var(--ui);color:var(--soft);white-space:nowrap}
.cmix__give{display:flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap}
.cmix__give .inp{width:70px;height:34px;padding:0 8px;text-align:center;font-weight:600}
.cform__note{min-height:92px;resize:vertical;padding:10px 12px;line-height:1.45;height:auto}
.csum{display:grid;gap:7px;padding:14px 16px;border-radius:10px;background:linear-gradient(180deg,rgba(245,197,52,.09),rgba(245,197,52,.03));border:1px solid rgba(245,197,52,.32)}
.csum__r{display:flex;align-items:baseline;gap:12px;font-size:14px;min-width:0}
.csum__k{flex:none;width:96px;font:600 11.5px/1.5 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.csum__miss{color:#ff9d94}
.cform__go{align-self:stretch;height:50px;font-size:16px}

/* монети */
.coins{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.coins__v{display:inline-flex;align-items:center;gap:3px}
.coins__v b{font:600 14px/1 var(--ui);color:var(--ivory)}
.coins__i{width:14px;height:14px}
.coins--big .coins__v b{font:700 18px/1 var(--ui)}
.coins--big .coins__i{width:17px;height:17px}
.coins__0{font-size:13px;color:var(--muted)}

/* репутація: значок рівня, назва, очки */
.crep--0{--rc:#e9c46a}.crep--1{--rc:#3ddc84}.crep--2{--rc:#4fd1c5}.crep--3{--rc:#c27dff}.crep--4{--rc:#ffb547}
.crep{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px 0 3px;border-radius:12px;background:rgba(255,243,214,.06);
  box-shadow:inset 0 0 0 1px rgba(255,243,214,.08);font:600 12px/1 var(--ui);white-space:nowrap;color:var(--rc)}
.crep__i{width:18px;height:18px;border-radius:50%}
.crep__p{color:var(--soft);font-weight:500}
.crep.is-neg{--rc:#ff8e86}
.crbar--0{--rc:#c9a24a}.crbar--1{--rc:#2fae67}.crbar--2{--rc:#2ea89d}.crbar--3{--rc:#9a5ad6}.crbar--4{--rc:#e0962c}
.crbar{position:relative;height:18px;border-radius:9px;background:rgba(0,0,0,.45);box-shadow:inset 0 0 0 1px rgba(216,178,94,.3);overflow:hidden}
.crbar__f{position:absolute;inset:0 auto 0 0;border-radius:9px;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 60%),var(--rc)}
.crbar__t{position:relative;display:block;text-align:center;font:600 11px/18px var(--ui);color:#fff;text-shadow:0 1px 2px #000}
.crcard__top{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.crcard__i{width:56px;height:56px;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.6),0 4px 12px rgba(0,0,0,.5)}
.crcard__tier{font:700 21px/1.2 var(--display);color:var(--rc)}
.crcard__pts{margin-top:2px;font-size:13.5px;color:var(--muted)}
.crcard__pts b{color:var(--ivory);font-size:15px}
.crcard__st{display:flex;flex-wrap:wrap;gap:4px 14px;margin:12px 0 8px;font-size:13px;color:var(--muted)}
.crcard__st b{color:var(--ivory)}
.crday{margin:4px 0 10px;padding:10px 12px;border:1px solid var(--line, rgba(255,255,255,.08));border-radius:10px;background:rgba(255,255,255,.02)}
.crday__h{font-size:13px;color:var(--muted)}
.crday__h b{color:var(--ivory)}
.crday__bar{height:6px;margin:7px 0 6px;border-radius:4px;background:rgba(255,255,255,.07);overflow:hidden}
.crday__bar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8fb35f,#c9e08f)}
.crday.is-full{border-color:rgba(232,182,92,.35)}
.crday.is-full .crday__bar span{background:linear-gradient(90deg,#c9933a,#f0c86e)}
.crday p{margin:0}
.cnotice{padding:12px 14px;border-radius:8px;margin-bottom:12px;border:1px solid var(--line2);background:rgba(255,243,214,.04)}
.cnotice b{display:block;font:600 14px/1.35 var(--ui);color:var(--ivory)}
.cnotice p{margin-top:4px;font-size:13.5px;color:var(--soft)}
.cnotice--crit{border-color:rgba(224,86,79,.5);background:rgba(224,86,79,.1)}
.cnotice--wait{border-color:rgba(232,161,58,.5);background:rgba(232,161,58,.08)}
.cnotice--ok{border-color:rgba(61,220,132,.4);background:rgba(61,220,132,.06)}

/* картка замовлення */
.corders{display:grid;gap:14px}
.corder{padding:18px 20px;border-radius:10px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--line2)}
.corder--open{border-left-color:var(--gold-hot)}
.corder--taken,.corder--delivered{border-left-color:#5fb3ff}
.corder--done{border-left-color:var(--good)}
.corder--disputed{border-left-color:var(--warn)}
.corder--cancelled,.corder--expired,.corder--failed{opacity:.78}
.corder.is-urgent{box-shadow:0 0 0 1px rgba(224,86,79,.35),0 0 26px rgba(224,86,79,.08)}
.corder__hd{display:flex;align-items:center;gap:14px}
.corder__t{flex:1;min-width:0}
.corder__n{font:700 19px/1.25 var(--display);color:var(--ivory)}
.corder__sub{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:6px;font-size:13px;color:var(--muted)}
.corder__r{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:7px;text-align:right}
.corder__due{font:600 13px/1.2 var(--ui);color:var(--soft)}
.corder__due.is-soon{color:#ff9d94}
.corder__info{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px 18px;margin:16px 0 0}
.corder__row{display:flex;align-items:flex-start;gap:10px;min-width:0}
.corder__ri{width:26px;height:26px;flex:none;border-radius:5px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.35)}
.corder__row dt{font:600 11px/1.3 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.corder__row dd{margin:2px 0 0;font-size:14px;color:var(--parch)}
.cchar{color:#fff3d6}
.corder__given{color:var(--muted)}
.corder__need{margin-top:12px}
.corder__need summary{cursor:pointer;width:max-content;font-size:13px;color:var(--link)}
.corder__need .creag__l{margin-top:10px}
.corder__note{margin-top:12px;padding:10px 12px;border-radius:6px;background:rgba(255,243,214,.04);border-left:2px solid var(--line2);
  font-size:14px;color:var(--soft);white-space:pre-wrap}
.corder__close{margin-top:10px}
.corder .cnotice{margin:14px 0 0}
.corder__ft{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 18px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.corder__ppl{display:flex;flex-wrap:wrap;gap:10px 26px}
.corder__who{display:flex;flex-direction:column;gap:6px}
.corder__wk{font:600 11px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.corder__acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cwho{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.cwho__n{font:600 14.5px/1.2 var(--ui)}
.cwho__dc{font-size:12.5px;color:#a9b2ff}
.btn.is-armed{background:#c9463f;color:#fff;border-color:#e0564f;box-shadow:0 0 0 3px rgba(224,86,79,.2)}
.csteps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:18px 0 0;padding:0;list-style:none}
.csteps__i{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;font-size:12.5px;color:var(--muted)}
.csteps__i::before{content:"";position:absolute;top:7px;left:-50%;right:50%;height:2px;background:var(--line2)}
.csteps__i:first-child::before{display:none}
.csteps__d{position:relative;z-index:1;width:16px;height:16px;border-radius:50%;background:#0b1730;border:2px solid var(--line2)}
.csteps__i.is-done .csteps__d{background:var(--good);border-color:var(--good)}
.csteps__i.is-done::before,.csteps__i.is-now::before{background:var(--good)}
.csteps__i.is-now .csteps__d{border-color:var(--gold-hot);box-shadow:0 0 0 4px rgba(245,197,52,.18)}
.csteps__i.is-done,.csteps__i.is-now{color:var(--soft)}
.csteps__w{font-size:11.5px;color:var(--dim)}
.csteps.is-bad .csteps__i.is-now .csteps__d{border-color:var(--crit);box-shadow:0 0 0 4px rgba(224,86,79,.18)}
.cboard__f{margin-bottom:16px}
.cmine+.cmine{margin-top:28px}

/* тікети */
.ctkf{display:grid;gap:10px;margin-top:14px;padding:14px;border-radius:9px;background:rgba(232,161,58,.06);border:1px solid rgba(232,161,58,.4)}
.ctkf__t{font:600 14px/1.2 var(--ui);color:var(--ivory)}
.ctkf textarea,.cres textarea{min-height:90px;height:auto;padding:10px 12px;resize:vertical;line-height:1.45}
.ctkf__row{display:flex;flex-wrap:wrap;gap:8px}
.ctk{display:grid;gap:14px;margin-bottom:16px}
.ctk.is-open{border-color:rgba(232,161,58,.5)}
.ctk__hd{display:flex;align-items:center;gap:12px}
.ctk__i{width:40px;height:40px;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.ctk__q{margin:0;padding:12px 14px;border-radius:8px;background:rgba(255,243,214,.04);border-left:3px solid var(--warn);font-size:14.5px;white-space:pre-wrap}
.ctk .corder{background:rgba(7,16,31,.5)}
.cres{display:grid;gap:14px;padding-top:14px;border-top:1px solid var(--line)}
.cres__g{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;border:0;min-width:0}
.cres__g legend{width:100%;margin-bottom:8px;padding:0;font:600 11.5px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.cres__o{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border-radius:18px;border:1px solid var(--line2);font-size:13.5px;cursor:pointer}
.cres__o:has(input:checked){border-color:var(--gold-hot);background:rgba(245,197,52,.1);color:#fff3d6}
.cres__o input{accent-color:var(--btn)}
.cbans{display:grid;gap:8px;padding:0;margin:0 0 18px;list-style:none}
.cban{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:12px 14px;border-radius:9px;background:var(--panel);border:1px solid var(--line)}
.cban .btn{margin-left:auto}

/* майстри */
.ctiers{margin-bottom:18px}
.ctiers__l{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:0;margin:0 0 14px;list-style:none}
.ctiers__i{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px 12px;border-radius:9px;background:rgba(255,243,214,.03);border:1px solid var(--line);text-align:center}
.ctiers__i b{font:600 13px/1.2 var(--ui);color:var(--rc)}
.ctiers__i span{font-size:12px;color:var(--muted)}
.ctiers__ic{width:42px;height:42px;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.cmasters{display:grid;gap:8px;padding:0;margin:0;list-style:none}
.cmaster{display:grid;grid-template-columns:36px minmax(0,1fr) auto 210px;align-items:center;gap:14px;padding:12px 16px;border-radius:10px;
  background:var(--panel);border:1px solid var(--line)}
.cmaster.is-me{border-color:rgba(245,197,52,.5)}
.cmaster__pos{font:700 20px/1 var(--display);color:var(--gold);text-align:center}
.cmaster:nth-child(-n+3) .cmaster__pos{color:var(--gold-hot)}
.cmaster__w{display:flex;flex-direction:column;gap:6px;min-width:0}
.cmaster__pr{display:flex;flex-wrap:wrap;gap:4px}
.cmaster__pr:empty{display:none}
.cmaster__pi{width:20px;height:20px;border-radius:4px;box-shadow:0 0 0 1px #000}
.cmaster__st{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--muted);text-align:right;white-space:nowrap}
.cmaster__st b{color:var(--ivory)}
.cmaster__rp{display:flex;flex-direction:column;gap:6px}
.cmaster__rp>b{font:700 16px/1 var(--ui);color:var(--ivory);text-align:right}
.cmaster__rp>b.is-neg{color:#ff8e86}


/* ── опитування в особистих (старшині, вкладка «Опитування») ── */
.pollc__ic{width:52px;height:52px;flex:none}
.pollc__opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pollc__opt{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:6px;font:600 13px/1 var(--ui);color:var(--soft);
  background:rgba(255,243,214,.08);white-space:nowrap}
.pollc__opt--yes{background:rgba(61,220,132,.16);color:#7ff0b0}
.pollc__opt--maybe{background:rgba(88,101,242,.22);color:#c3c9ff}
.pollc__opt--no{background:rgba(224,86,79,.14);color:#ff9d94}
.pollc__opt--wait{background:none;box-shadow:inset 0 0 0 1px var(--line2);color:var(--muted)}
.pollc__opt--fail{background:rgba(224,86,79,.1);color:#ff8e86}
.pollv{display:flex;flex-direction:column;gap:18px}
.pollv__q{display:flex;align-items:flex-start;gap:16px}
.pollv__qt{flex:1;min-width:0}
.pollv__qt>b{display:block;margin-top:4px;font:700 clamp(18px,2vw,22px)/1.3 var(--display);color:var(--ivory)}
.pollv__qt p{margin-top:10px}
.pollv__k{font:600 11px/1.3 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.pollv__test{flex:none}
.pollv__img{display:block;width:100%;max-width:480px;height:auto;margin-top:14px;border-radius:8px;box-shadow:0 0 0 1px var(--line2),0 10px 24px rgba(0,0,0,.35)}
.pollv__board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pscore{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;border-radius:12px;overflow:hidden;
  background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--sc,var(--line2))}
.pscore--yes{--sc:#3ddc84}.pscore--maybe{--sc:#7c86ff}.pscore--no{--sc:#e0564f}.pscore--wait{--sc:#8a8270}
.pscore__l{font:600 14px/1.3 var(--ui);color:var(--soft)}
.pscore__n{font:700 clamp(40px,4.4vw,56px)/1 var(--display);color:var(--ivory)}
.pscore--yes .pscore__n{color:#8ef5bd}
.pscore__p{font-size:12.5px;color:var(--muted)}
.pscore__bar{height:6px;margin-top:6px;border-radius:3px;background:rgba(255,243,214,.07);overflow:hidden}
.pscore__bar i{display:block;height:100%;border-radius:3px;background:var(--sc);transition:width .4s}
.pollv__stack{display:flex;height:12px;border-radius:6px;overflow:hidden;gap:2px;background:rgba(255,243,214,.05)}
.pollv__seg{display:block;min-width:4px;transition:flex-grow .4s}
.pollv__seg--yes{background:#3ddc84}.pollv__seg--maybe{background:#7c86ff}.pollv__seg--no{background:#e0564f}
.pollv__lh{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pollv__lh .card__t{margin:0}
.pollv__search{flex:0 1 300px;min-width:0}
.pollv__f{margin:14px 0 12px}
.pollv__l{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.prow{display:grid;grid-template-columns:36px minmax(0,1fr) auto 150px;align-items:center;gap:12px;padding:8px 12px;border-radius:9px;
  border:1px solid var(--line);background:rgba(255,243,214,.02)}
.prow__av{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#0a1226}
.prow__who{display:flex;flex-direction:column;gap:2px;min-width:0}
.prow__nick{font:600 14.5px/1.25 var(--ui);color:var(--ivory);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow__sub{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow__t{font-size:12.5px;color:var(--muted);text-align:right;white-space:nowrap}
@media (max-width:860px){ .pollv__board{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:720px){
  .pollv__q{flex-wrap:wrap}
  .pollv__test{width:100%}
  .prow{grid-template-columns:36px minmax(0,1fr) auto}
  .prow__t{grid-column:2 / -1;text-align:left;margin-top:-4px}
  .pollv__search{flex-basis:100%}
}
/* ── професії бійця (профіль і бічна колонка Майстерні) ── */
.profc__l{display:grid;gap:8px;padding:0;margin:0;list-style:none}
.profc__i{display:flex;align-items:center;gap:12px;min-width:0;padding:8px 12px 8px 8px;border-radius:9px;
  background:rgba(255,243,214,.03);border:1px solid var(--line)}
.profc__ic{width:36px;height:36px;flex:none;border-radius:6px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.profc__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.profc__n{font:600 14.5px/1.2 var(--ui);color:var(--ivory);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profc__b{font-size:12.5px;color:var(--muted)}
.profc__ft{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin-top:14px}
.profc__none p{font-size:14px;line-height:1.5;color:var(--soft);margin-bottom:14px}
.profc--sm .profc__i{padding:6px 10px 6px 6px}
.profc--sm .profc__ic{width:30px;height:30px}
.profbar{display:flex;gap:3px;flex:none}
.profbar i{width:10px;height:16px;border-radius:2px;background:rgba(255,243,214,.08);box-shadow:inset 0 0 0 1px rgba(216,178,94,.22)}
.profbar i.is-on{background:linear-gradient(180deg,#ffd75e,#c8901c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
.proff__hint{font-size:13.5px;line-height:1.5;color:var(--muted);margin-bottom:12px}
.proff__l{display:grid;gap:6px}
.proff__r{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;padding:6px 6px 6px 8px;border-radius:9px;
  border:1px solid var(--line);background:rgba(255,243,214,.02);transition:border-color .15s,background .15s}
.proff__r.is-on{border-color:rgba(245,197,52,.45);background:rgba(245,197,52,.06)}
.proff__n{display:flex;align-items:center;gap:10px;min-width:0;font:600 14px/1.2 var(--ui);color:var(--soft)}
.proff__r.is-on .proff__n{color:var(--ivory)}
.proff__ic{width:28px;height:28px;flex:none;border-radius:5px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.4);filter:grayscale(.85) brightness(.75);transition:filter .15s}
.proff__r.is-on .proff__ic{filter:none}
.proff__seg{display:flex;flex-wrap:wrap;gap:2px;padding:2px;border-radius:8px;background:rgba(0,0,0,.28);border:1px solid var(--line)}
.proff__o{height:30px;padding:0 9px;border-radius:6px;font:600 12.5px/1 var(--ui);color:var(--muted);background:none;border:0;cursor:pointer;white-space:nowrap}
.proff__o:hover{color:var(--ivory);background:rgba(255,243,214,.06)}
.proff__o[aria-checked="true"]{color:#1a1300;background:var(--gold-hot)}
.proff__o--no[aria-checked="true"]{color:var(--ivory);background:rgba(255,243,214,.14)}
.proff__o:focus-visible{outline:2px solid var(--gold-hot);outline-offset:1px}
.proff__ft{display:flex;gap:8px;margin-top:14px}
.profc--sm .proff__r{flex-direction:column;align-items:stretch}
.profc--sm .proff__seg{display:grid;grid-template-columns:auto repeat(4,minmax(0,1fr))}
.profc--sm .proff__o{padding:0 6px;font-size:12px}
/* навичка рецепта — у плитці, шухляді й замовленні */
.cskill{display:inline-block;padding:1px 5px;border-radius:4px;font-size:11.5px;font-weight:600;color:var(--parch);background:rgba(255,243,214,.08);
  box-shadow:inset 0 0 0 1px rgba(216,178,94,.22)}
.cdw__k{margin-top:6px;font-size:13px;color:var(--muted)}
.cdw__k .cskill{font-size:12.5px}
.corder__ri--p{border-radius:5px}
.corder__nf{margin-left:8px;vertical-align:1px}
.tog__c--me[aria-pressed="false"]{border-color:rgba(245,197,52,.5);color:var(--gold-hot)}
.cnotice--tip{display:flex;align-items:center;gap:14px;border-color:rgba(245,197,52,.38);background:rgba(245,197,52,.06)}
.cnotice--tip>div{flex:1;min-width:0}
.cnotice__ic{width:40px;height:40px;flex:none;border-radius:8px;box-shadow:0 0 0 1px #000,0 0 0 2px rgba(216,178,94,.5)}
.cboard__tip{margin:4px 0 14px}
.cmore .nmore{white-space:normal;text-align:left;line-height:1.25}
.lempty__row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}
.cmaster__pf{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 7px 0 2px;border-radius:12px;font-size:11.5px;font-weight:600;
  color:var(--soft);background:rgba(255,243,214,.05);box-shadow:inset 0 0 0 1px var(--line)}
.cmaster__pf.is-on{color:var(--gold-hot);box-shadow:inset 0 0 0 1px rgba(245,197,52,.5)}
.cmaster__pf .cmaster__pi{width:20px;height:20px;border-radius:50%}
.cmaster__pi--did{opacity:.55;filter:grayscale(.6)}
@media (max-width:720px){
  .cnotice--tip{flex-wrap:wrap}
  .cnotice--tip .btn{width:100%}
  .proff__r{flex-direction:column;align-items:stretch}
  .proff__seg{display:grid;grid-template-columns:auto repeat(4,minmax(0,1fr))}
  .proff__o{padding:0 4px;font-size:12px}
}
@media (max-width:1100px){ .cterms{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:720px){
  .ctabs{margin-inline:calc(-1 * var(--gut));border-radius:0;border-left:0;border-right:0;padding-inline:var(--gut)}
  .cprofs{display:flex;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--gut));padding:0 var(--gut) 2px}
  .cprofs::-webkit-scrollbar{display:none}
  .cprof{flex:none;max-width:210px}
  .ctiles{grid-template-columns:minmax(0,1fr)}
  .ctile__go{display:none}
  .cterms{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cterms .cterm:first-child{grid-column:1 / -1}
  .cmats{grid-template-columns:minmax(0,1fr)}
  .corder{padding:16px}
  .corder__hd{flex-wrap:wrap}
  .corder__r{flex-direction:row;align-items:center;justify-content:space-between;width:100%}
  .csteps__w{display:none}
  .cmaster{grid-template-columns:28px minmax(0,1fr);gap:8px 12px}
  .cmaster__st{grid-column:2;flex-direction:row;gap:14px;text-align:left}
  .cmaster__rp{grid-column:1 / -1}
  .ctiers__l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cmix__i{flex-wrap:wrap}
}

/* ── Арморі: ростер ліворуч, персонаж праворуч (рендер у середині, предмети обабіч, як у вікні персонажа) ── */
.arm{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:20px;align-items:start}
.arm__side{position:sticky;top:120px;max-height:calc(100vh - 140px);display:flex;flex-direction:column;overflow:hidden}
.arm__side .sect__t{margin-top:12px}
.arm__q{width:100%;margin:6px 0 8px;padding:9px 12px;border-radius:8px;border:1px solid var(--line2);background:rgba(0,0,0,.25);color:var(--ivory);font:inherit;font-size:14px}
.arm__q:focus{outline:none;border-color:var(--gold)}
.arm__list{display:flex;flex-direction:column;gap:2px}
.arm__list--all{overflow:auto;min-height:120px;flex:1;padding-right:4px}
.arm__row{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:9px;width:100%;padding:6px 8px;border:0;border-radius:6px;background:none;color:var(--soft);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.arm__row:hover,.arm__row:focus-visible{background:rgba(216,178,94,.08);outline:none}
.arm__row.is-on{background:rgba(216,178,94,.16);box-shadow:inset 2px 0 0 var(--gold)}
.arm__cls{width:22px;height:22px;border-radius:50%}
.arm__cls--none{display:block;background:rgba(255,255,255,.08)}
.arm__nm{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arm__nm b{font-weight:600}
.arm__lv{color:var(--muted);font-size:13px}
.arm__more{margin-top:8px;align-self:flex-start}
.arm__note{margin:10px 0 0}
.arm__main{min-height:540px}

.armc__head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid var(--line)}
.armc__name{margin:0;font:400 clamp(26px,3vw,34px)/1.05 var(--display);letter-spacing:.01em}
.armc__name span{opacity:.75}
.armc__sub{margin-top:6px;color:var(--soft);font-size:14px}
.armc__guild{margin-top:2px;color:var(--gold);font-size:13px}
.armc__il{display:flex;flex-direction:column;align-items:center;min-width:92px;padding:8px 12px;border:1px solid var(--line2);border-radius:10px;background:rgba(0,0,0,.2)}
.armc__il b{font:400 30px/1 var(--display);color:var(--ivory)}
.armc__il span{margin-top:4px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.armc__doll{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,1.15fr) minmax(0,1fr);gap:12px;margin-top:16px;align-items:stretch}
.armc__col{display:flex;flex-direction:column;gap:6px}
.armc__fig{position:relative;display:flex;align-items:center;justify-content:center;min-height:440px;border-radius:12px;overflow:hidden;
  background:radial-gradient(ellipse 70% 60% at 50% 55%,rgba(216,178,94,.16),rgba(7,16,31,0) 70%),linear-gradient(180deg,rgba(19,33,61,.6),rgba(7,16,31,.2))}
/* рендер Blizzard — 1600×1200 з прозорим тлом, ноги персонажа завжди на ~82% висоти: збільшуємо в 1,5 раза й ставимо ноги внизу рамки */
.armc__render{position:absolute;left:50%;top:-30%;height:150%;width:auto;max-width:none;transform:translateX(-50%);filter:drop-shadow(0 12px 18px rgba(0,0,0,.55))}
.armc__norender{padding:20px;text-align:center}
.armc__bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.armc__foot{margin:14px 0 0}

.arms{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:9px;min-height:50px;padding:3px;border-radius:8px;cursor:default}
.arms[tabindex]{cursor:help}
.arms[tabindex]:hover,.arms[tabindex]:focus-visible{background:rgba(216,178,94,.08);outline:none}
.arms--r{grid-template-columns:minmax(0,1fr) 44px;text-align:right}
.arms--r .arms__ic{order:2}
.arms__ic{width:44px;height:44px;border-radius:6px;border:2px solid var(--q,rgba(255,255,255,.1));background:rgba(0,0,0,.45);overflow:hidden;box-shadow:0 0 10px -4px var(--q,transparent)}
.arms__ic img{display:block;width:100%;height:100%}
.is-empty .arms__ic{border-style:dashed;border-color:rgba(216,178,94,.18);box-shadow:none}
.arms__tx{min-width:0}
.arms__n{font-size:13px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arms__l{color:var(--muted);font-size:12px;margin-top:2px}
.is-empty .arms__l{color:var(--dim)}

.atip{position:absolute;z-index:200;display:none;width:max-content;max-width:min(320px,calc(100vw - 16px));padding:10px 12px;border-radius:6px;
  background:rgba(4,8,20,.97);border:1px solid rgba(216,178,94,.45);box-shadow:0 10px 30px rgba(0,0,0,.6);font-size:13px;line-height:1.35;color:#fff;pointer-events:none}
.atip.is-on{display:block}
.atip__n{font-size:15px;font-weight:600;margin-bottom:3px}
.atip__l{white-space:pre-wrap}
.atip__l--2{display:flex;justify-content:space-between;gap:18px}

@media (max-width:1100px){
  .arm{grid-template-columns:1fr}
  .arm__side{position:static;max-height:none}
  .arm__list--all{max-height:340px}
}
@media (max-width:720px){
  .armc__doll{grid-template-columns:1fr 1fr}
  .armc__fig{grid-column:1 / -1;order:-1;min-height:360px}
  .arms--r{grid-template-columns:44px minmax(0,1fr);text-align:left}
  .arms--r .arms__ic{order:0}
  .armc__bottom{grid-template-columns:1fr}
}