/* Оболочка в стиле MegaDrop: тот же синий фон, Lilita One с обводкой и выдавкой,
   кнопки-плитки с жёсткой нижней тенью. Палитра акцента задаётся темой сайта. */
@font-face{font-family:"MegaBoxFont";src:url("/a/fonts/lilitaone.woff2") format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Manrope";src:url("/a/fonts/manrope-cyrillic.woff2") format("woff2");font-weight:300 800;font-display:swap;unicode-range:U+0400-04FF}
@font-face{font-family:"Manrope";src:url("/a/fonts/manrope-latin.woff2") format("woff2");font-weight:300 800;font-display:swap}
:root{
  --bg-deep:#062a70;--blue-1:#2a72e6;--blue-2:#14459f;--blue-3:#0c3183;--blue-deep:#08245f;
  --panel:rgba(9,42,116,.62);--panel-line:rgba(255,255,255,.16);
  --text:#fff;--text-dim:#bbd6f5;--gold:#ffe45c;
  --green-1:#63e06e;--green-2:#34b747;--green-sh:#1c7a2e;
  --btn-blue-1:#55b8ff;--btn-blue-2:#2278de;--btn-blue-sh:#14508f;
  --ink:#150a22;--so-r:.055em;--so-c:var(--ink);
  --extrude:0 .0155em 0 var(--ink),0 .031em 0 var(--ink),0 .0465em 0 var(--ink),0 .062em 0 var(--ink),
            0 .0775em 0 var(--ink),0 .093em 0 var(--ink),0 .1085em 0 var(--ink),0 .124em 0 var(--ink),
            0 .1395em 0 var(--ink),0 .155em 0 var(--ink);
  --so:calc(var(--so-r)*1) 0 0 var(--so-c),calc(var(--so-r)*.924) calc(var(--so-r)*.383) 0 var(--so-c),
       calc(var(--so-r)*.707) calc(var(--so-r)*.707) 0 var(--so-c),calc(var(--so-r)*.383) calc(var(--so-r)*.924) 0 var(--so-c),
       0 calc(var(--so-r)*1) 0 var(--so-c),calc(var(--so-r)*-.383) calc(var(--so-r)*.924) 0 var(--so-c),
       calc(var(--so-r)*-.707) calc(var(--so-r)*.707) 0 var(--so-c),calc(var(--so-r)*-.924) calc(var(--so-r)*.383) 0 var(--so-c),
       calc(var(--so-r)*-1) 0 0 var(--so-c),calc(var(--so-r)*-.924) calc(var(--so-r)*-.383) 0 var(--so-c),
       calc(var(--so-r)*-.707) calc(var(--so-r)*-.707) 0 var(--so-c),calc(var(--so-r)*-.383) calc(var(--so-r)*-.924) 0 var(--so-c),
       0 calc(var(--so-r)*-1) 0 var(--so-c),calc(var(--so-r)*.383) calc(var(--so-r)*-.924) 0 var(--so-c),
       calc(var(--so-r)*.707) calc(var(--so-r)*-.707) 0 var(--so-c),calc(var(--so-r)*.924) calc(var(--so-r)*-.383) 0 var(--so-c);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg-deep)}
body{margin:0;color:var(--text);font:17px/1.65 "Manrope",system-ui,sans-serif;
  background:var(--bg-deep) url("/a/background-poster.jpg") center/cover fixed;
  -webkit-font-smoothing:antialiased;overflow-x:clip}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,42,112,.55),rgba(4,24,66,.92))}
a{color:var(--gold)}a:hover{filter:brightness(1.12)}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(12px,2.4vw,24px)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;color:#000;padding:10px;z-index:9}
h1,h2,h3,.brand,.btn,.mega-cta,.tier-name,.eyebrow{font-family:"MegaBoxFont","Arial Black",system-ui,sans-serif;
  font-weight:900;letter-spacing:.04em;text-shadow:var(--so),var(--extrude);line-height:1.1}
header{background:linear-gradient(180deg,var(--blue-2),var(--blue-3));border-bottom:4px solid var(--ink);
  box-shadow:0 6px 0 rgba(2,10,45,.45)}
header .wrap{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.brand{font-size:26px;color:var(--gold);text-decoration:none}
nav{display:flex;gap:14px;flex-wrap:wrap;font-size:15px;font-weight:800}
nav a{text-decoration:none;color:var(--text)}nav a:hover{color:var(--gold)}
.crumbs{font-size:13px;color:var(--text-dim);padding-top:14px}
.crumbs ol{display:flex;gap:8px;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.crumbs li+li:before{content:"/";margin-right:8px;opacity:.5}.crumbs a{color:var(--text-dim)}
.hero{padding:34px 0 30px}
.eyebrow{display:inline-block;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
h1{font-size:clamp(28px,4.6vw,52px);margin:14px 0}
h2{font-size:clamp(21px,2.8vw,32px);margin:34px 0 12px}
h3{margin:22px 0 8px;font-size:19px}
.lead{font-size:18px;color:var(--text-dim);max-width:820px}
main{padding:10px 0 52px}p{margin:12px 0}
.panel,.card,.tool,.promo,.aside,.faq details{background:var(--panel);border:2px solid var(--panel-line);
  border-radius:18px;box-shadow:0 8px 0 rgba(2,10,45,.35)}
.card{padding:16px;text-decoration:none;display:block;color:var(--text)}
.card:hover{border-color:var(--gold)}
.card b{display:block;margin-bottom:4px}.card span{font-size:13px;color:var(--text-dim)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:16px;margin:18px 0}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px;display:block;overflow-x:auto;
  background:var(--panel);border:2px solid var(--panel-line);border-radius:16px}
th,td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.12);text-align:left;white-space:nowrap}
th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--gold);font-weight:800}
tr:last-child td{border-bottom:0}
.btn,.mega-cta{--b1:var(--btn-blue-1);--b2:var(--btn-blue-2);--bs:var(--btn-blue-sh);--lift:5px;
  border:0;cursor:pointer;display:inline-block;padding:12px 24px 16px;border-radius:16px;font-size:16px;
  color:#fff;text-decoration:none;background:linear-gradient(180deg,var(--b1),var(--b2));
  box-shadow:0 var(--lift) 0 var(--bs),0 10px 14px -6px rgba(2,10,45,.6);
  transition:transform .09s ease,box-shadow .09s ease,filter .14s ease}
.btn:hover,.mega-cta:hover{filter:brightness(1.08);color:#fff}
.btn:active,.mega-cta:active{transform:translateY(var(--lift));box-shadow:0 0 0 var(--bs)}
.mega-cta{--b1:var(--green-1);--b2:var(--green-2);--bs:var(--green-sh);font-size:18px}
.btn.ghost{--b1:rgba(255,255,255,.14);--b2:rgba(255,255,255,.06);--bs:rgba(2,10,45,.5)}
.promo{margin:30px 0;padding:22px;max-width:880px}
.promo strong{display:block;color:var(--gold);font-size:19px;margin-bottom:6px}
.fine{font-size:12px;color:var(--text-dim)}
.tool{margin:26px 0;padding:22px}
.tool-lead{color:var(--text-dim);font-size:15px}
.tool-row{display:flex;gap:14px;flex-wrap:wrap;align-items:end;margin:16px 0}
.tool-row label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--text-dim);font-weight:700}
select,input{padding:10px 13px;border-radius:12px;border:2px solid var(--panel-line);
  background:var(--blue-deep);color:#fff;font:inherit;font-size:15px}
select:focus,input:focus{outline:3px solid var(--gold);outline-offset:2px}
.tool-out{margin-top:16px}
.drops{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}
.drop{margin:0;width:118px;text-align:center;border:2px solid var(--panel-line);border-radius:14px;
  padding:10px;background:rgba(8,36,95,.7);box-shadow:0 5px 0 rgba(2,10,45,.4)}
.drop img{width:82px;height:82px;object-fit:contain}
.drop figcaption{font-size:12px;line-height:1.3}.drop b{display:block}.drop span{color:var(--text-dim)}
.r-legendary{border-color:#ffb347}.r-ultra_legendary{border-color:#ff6b6b}.r-mythic{border-color:#ff5c8a}
.r-epic{border-color:#a78bfa}.r-super_rare{border-color:#60a5fa}.r-rare{border-color:#4ade80}
.sum{font-size:15px}.note{font-size:13px;color:var(--text-dim)}.verdict{font-weight:800;color:var(--gold)}
.answers{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.q{font-weight:800;font-size:17px}
.chk{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--panel-line);border-radius:12px;
  padding:6px 10px;margin:4px;font-size:14px;cursor:pointer;background:rgba(8,36,95,.6)}
.chk.on{border-color:var(--green-1);background:rgba(52,183,71,.22)}
.chk img{width:32px;height:32px;object-fit:contain}
.gal{display:inline-flex;flex-direction:column;align-items:center;width:126px;margin:7px;padding:10px;
  border:2px solid var(--panel-line);border-radius:14px;text-decoration:none;font-size:13px;text-align:center;
  background:rgba(8,36,95,.7);color:var(--text)}
.gal:hover{border-color:var(--gold)}
.gal img{width:86px;height:86px;object-fit:contain}.gal span{color:var(--text-dim);font-size:12px}
.tier-row,.tier-pool{display:flex;gap:12px;align-items:flex-start;margin:10px 0;border:2px solid var(--panel-line);
  border-radius:14px;padding:10px;background:rgba(8,36,95,.55)}
.tier-name{min-width:104px;font-size:20px;color:var(--gold)}
.tier-zone{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;border:2px solid var(--panel-line);border-radius:12px;
  padding:5px 9px;font-size:13px;background:rgba(6,30,80,.8)}
.chip img{width:28px;height:28px;object-fit:contain}
.mini{margin-left:3px;padding:2px 7px;border-radius:8px;border:1px solid var(--panel-line);background:transparent;
  color:inherit;cursor:pointer;font-size:11px;font-weight:700}
.mini:hover{border-color:var(--gold);color:var(--gold)}
.nick{display:inline-block;margin:5px;padding:9px 14px;border-radius:12px;border:2px solid var(--panel-line);
  background:rgba(8,36,95,.7);color:inherit;cursor:pointer;font:inherit;font-size:15px}
.nick:hover{border-color:var(--gold)}.nick.copied{border-color:var(--green-1);color:var(--green-1)}
.grid-table{display:table;width:100%}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:38px;align-items:start}
.aside{padding:18px;font-size:14px}.aside a{display:block;margin:10px 0;color:var(--text)}
.aside a:hover{color:var(--gold)}
.faq details{padding:14px 18px;margin:10px 0}
.faq summary{cursor:pointer;font-weight:800}
footer{border-top:4px solid var(--ink);background:linear-gradient(180deg,var(--blue-3),var(--blue-deep));
  padding:28px 0;font-size:13px;color:var(--text-dim);margin-top:30px}
footer nav{margin-bottom:14px}
body[data-layout="1"] .hero{text-align:center}body[data-layout="1"] .lead{margin:0 auto}
body[data-layout="2"] .card{border-radius:6px}
body[data-layout="3"] .brand{color:var(--green-1)}
@media(max-width:860px){.article-layout{grid-template-columns:1fr}}
@media(max-width:640px){.tool-row{flex-direction:column;align-items:stretch}.tier-name{min-width:auto}
  header .wrap{gap:10px}nav{font-size:14px;gap:10px}}

:root{--gold:#9dff5c;--btn-blue-1:#ff9f1c}
