:root{--bg:#0e0b1a;--c:#1a1530;--c2:#241d44;--line:#2b2350;--tx:#f1eeff;--mut:#9a92c4;--ac:#c4b5fd;--g:#4ade80;--r:#fb7185}
*{box-sizing:border-box}html{color-scheme:dark}
body{margin:0;background:#06040d;color:var(--tx);font:15px/1.45 "Segoe UI",system-ui,-apple-system,Roboto,sans-serif}
a{color:var(--ac);text-decoration:none}a:hover{text-decoration:underline}
#rain{opacity:.28;position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
@media(max-width:700px){#rain{display:none}}
.page{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:0 18px 40px;background:rgba(14,11,26,.6);min-height:100vh}
@media(min-width:900px){.page{padding:0 28px 40px}}
/* шапка, строка статистики и вкладки - один в один с главной (site/index.html) */
header{display:flex;justify-content:space-between;align-items:center;padding:20px 0 10px;gap:12px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;color:var(--tx)}.brand:hover{text-decoration:none}
.brand img{width:40px;height:40px;flex:none}.brand b{display:block;font-size:22px;line-height:1.45}
.brand small{display:block;margin:2px 0 0;color:var(--mut);font-size:13px;line-height:1.45}
.soon{padding:7px 14px;border-radius:99px;border:1px solid var(--line);color:var(--mut);font-size:13px}
.soon:hover{border-color:var(--ac);color:var(--tx);text-decoration:none}
.tabs{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;margin:4px 0 14px}
.tabs a{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);background:var(--c);color:var(--tx);text-decoration:none;white-space:normal;transition:border-color .15s,background .15s}
.tabs a b{font-size:17px}.tabs a span{color:var(--mut);font-size:13px}
.tabs a.on{border-color:var(--ac);background:#241d44}.tabs a:hover{border-color:var(--ac)}
@media(max-width:700px){.tabs{grid-template-columns:1fr 1fr}.tabs a:first-child{grid-column:1/-1}.soon{display:none}}
html{scrollbar-gutter:stable}@view-transition{navigation:auto}header{view-transition-name:shell-head}.ticker{view-transition-name:shell-tick;min-height:18px}.tabs{view-transition-name:shell-tabs}::view-transition-old(root),::view-transition-new(root){animation-duration:.16s}@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}
nav{display:flex;flex-wrap:wrap;gap:8px;font-size:14px}
nav a{padding:7px 15px;border:1px solid var(--line);border-radius:99px;color:var(--tx);background:var(--c);white-space:nowrap;transition:border-color .15s,background .15s}
nav a:hover{border-color:var(--ac);text-decoration:none}nav a.on{border-color:var(--ac);background:#241d44}
nav a.dl{border-color:var(--ac);color:var(--ac);font-weight:600;background:none}nav a.dl:hover{background:#241d44}
.crumbs{color:var(--mut);font-size:14px;margin:0 0 14px}.crumbs a{color:var(--mut)}
.hero{display:flex;gap:18px;align-items:center;margin:0 0 18px}
.hero img{width:128px;height:72px;border-radius:12px;object-fit:cover;flex:none;background:var(--c2)}
h1{margin:0 0 4px;font-size:28px;line-height:1.2}h2{margin:0 0 12px;font-size:19px}
.lead{margin:0;color:var(--mut)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}.tags span{padding:3px 10px;border:1px solid var(--line);border-radius:99px;font-size:13px;color:var(--mut);white-space:nowrap}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin:0 0 14px}
.pn{background:var(--c);border:1px solid var(--line);border-radius:16px;padding:16px;margin:0 0 14px;min-width:0}
.grid .pn{margin:0}
.row{display:flex;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}.row:first-of-type{border-top:0}
.row img{width:96px;height:54px;background:linear-gradient(90deg,var(--c2),#2d2560,var(--c2));border-radius:6px;object-fit:cover;flex:none;background:var(--c2)}
.row .t{flex:1;min-width:0}.row .t b{display:block}.row .t small{display:block;color:var(--mut);font-size:13px}
.row .t small.why{color:#d6d0f5;font-size:13.5px;margin:2px 0}
.mech{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:4px 0 3px;font-size:13.5px}
.ab{display:inline-flex;align-items:center;gap:6px;color:#e4defc;font-weight:600}
.row .ab img{width:22px;height:22px;border-radius:5px;object-fit:cover;background:var(--c2)}
.tg{padding:1px 8px;border-radius:99px;background:rgba(196,181,253,.1);color:var(--ac);font:600 11.5px "JetBrains Mono",ui-monospace,Consolas,monospace;white-space:nowrap}
.vv{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.wb2{display:block;width:72px;height:4px;border-radius:2px;background:var(--c2);overflow:hidden}
.wb2 i{display:block;height:100%;background:currentColor}
.topnav{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 16px}.topnav .crumbs{margin:0}
.back{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid var(--line);border-radius:99px;
 background:var(--c);color:var(--tx);font-weight:600;font-size:14px;transition:border-color .15s,background .15s}
.back:hover{border-color:var(--ac);background:#241d44;text-decoration:none}
.hint{font-size:14px;margin:0 0 14px}
@media(max-width:560px){.ab:has(img)>span{display:none}.mech{flex-wrap:nowrap}}  /* телефон: способности иконками, название - в подсказке */
.row .v{font-weight:800;font-size:20px;white-space:nowrap}.up{color:var(--g)}.down{color:var(--r)}
.items{display:flex;flex-wrap:wrap;gap:8px}
.it{display:flex;gap:8px;align-items:center;padding:6px 10px 6px 6px;background:var(--c2);border:1px solid var(--line);border-radius:10px;max-width:100%}
.it img{width:64px;height:47px;border-radius:7px;flex:none}.it span{min-width:0}.it small{display:block;color:var(--mut);font-size:12px}
.stage{color:var(--mut);font-size:13px;margin:10px 0 6px}
.cta{display:flex;flex-wrap:wrap;gap:12px 18px;justify-content:space-between;align-items:center;background:#1b1446;border:1px solid #3b2f73;border-radius:16px;padding:16px;margin:0 0 14px}
.cta b{display:block;font-size:17px}.cta span{color:var(--mut)}
.btn{display:inline-block;padding:10px 18px;border-radius:99px;border:1px solid var(--ac);color:var(--ac);font-weight:600;white-space:nowrap}
.search{width:100%;margin:14px 0;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--c);color:var(--tx);font:inherit;font-size:17px}
.search:focus{outline:none;border-color:var(--ac)}.list a[hidden],#list a[hidden],#list section[hidden]{display:none}
.hat{display:flex;align-items:center;gap:8px;font-size:17px;margin:22px 0 10px}.hat img{width:26px;height:26px}
.hat span{color:var(--mut);font:500 12px "JetBrains Mono",ui-monospace,Consolas,monospace}
.hgr{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}
.hgr a{display:flex;flex-direction:column;gap:2px;padding:4px 4px 6px;border-radius:6px;color:var(--tx);min-width:0}
.hgr a:hover{background:rgba(196,181,253,.08)}
.hgr img{width:100%;aspect-ratio:16/9;border-radius:4px;object-fit:cover;background:var(--c2)}
.hgr b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hgr small{font:700 13px "JetBrains Mono",ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}
.hgr .up{color:var(--g)}.hgr .down{color:var(--r)}
.sortb{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin:0 0 4px;font-size:13px}
.sortb span{color:var(--mut);margin-right:6px;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:12px}
.sortb button{background:none;border:0;border-bottom:2px solid transparent;color:var(--mut);font:inherit;font-weight:600;padding:8px 10px;min-height:40px;cursor:pointer}
.sortb button:hover{color:var(--tx)}.sortb button.on{color:var(--tx);border-bottom-color:var(--ac)}
@media(max-width:520px){.hgr{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.hgr b{font-size:12.5px}}
.list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.list a{display:flex;flex-direction:column;gap:4px;padding:8px;background:var(--c);border:1px solid var(--line);border-radius:10px;color:var(--tx)}
.list img{width:100%;aspect-ratio:16/9;border-radius:6px;object-fit:cover;background:var(--c2)}.list small{color:var(--mut)}
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;text-align:center;margin:0 0 14px}
.vs img{width:100%;max-width:200px;border-radius:12px}.vs .exp{color:var(--mut)}.vs .big{font-size:34px;font-weight:800}
footer{color:var(--mut);font-size:13px;margin-top:20px}
.page{background-color:rgba(14,11,26,.6);background-image:linear-gradient(rgba(196,181,253,.045) 1px,transparent 1px),
 linear-gradient(90deg,rgba(196,181,253,.045) 1px,transparent 1px);background-size:32px 32px}
.row .v,.chips b,.mw,.st b,.vs .big,.rk,.mr,.mg .mw,.hc span,.ticker,.sgd>span,.tr .lv,.ic small,.list small{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}
.ticker{display:flex;flex-wrap:wrap;gap:4px 18px;margin:2px 0 12px;font-size:12px;color:var(--mut)}
.ticker b{color:var(--ac);font-weight:700}.ticker span::before{content:"▸ ";color:#4a3d8a}
.mg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:6px 0 12px}
.mg button{position:relative;display:flex;flex-direction:column;gap:5px;padding:8px;background:var(--c);border:1px solid var(--line);border-radius:14px;color:var(--tx);font:inherit;text-align:left;cursor:pointer;transition:border-color .15s,transform .15s}
.mg button:hover{border-color:var(--ac);transform:translateY(-2px)}.mg button.on{border-color:var(--ac);background:#241d44;box-shadow:0 0 0 2px #c4b5fd44}
.mg img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px;background:var(--c2)}
.mg b{font-size:15px}.mg .mr{position:absolute;top:12px;left:12px;background:#0e0b1acc;color:var(--ac);font-weight:800;font-size:13px;padding:2px 8px;border-radius:99px}
.mg .mw{font-weight:700;font-size:14px}.mg .bar{margin-top:0;height:6px}
.md .mc{scroll-margin-top:12px}
.sgh .tt2{background:#2d2363}.sgh .tt2 img{width:24px;height:24px;border-radius:0}
.bl{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
@media(max-width:900px){.mg{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.mg{grid-template-columns:repeat(2,minmax(0,1fr))}.ic img{width:56px;height:41px}}
.tags a.mt{padding:3px 10px;border:1px solid var(--ac);border-radius:99px;font-size:13px;white-space:nowrap;background:#241d44}
.rolenav{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.rolenav a{padding:7px 14px;border:1px solid var(--line);border-radius:99px;color:var(--tx);background:var(--c)}
.rolenav a.on,.rolenav a:hover{border-color:var(--ac);text-decoration:none}
.rolenav button{padding:10px 18px;border:1px solid var(--line);border-radius:99px;color:var(--tx);background:var(--c);font:inherit;font-weight:600;cursor:pointer}
.rolenav button.on,.rolenav button:hover{border-color:var(--ac);background:#241d44}
#lists .btn{margin-top:6px}
.rk{flex:none;min-width:28px;font-weight:800;color:var(--ac);font-size:17px;text-align:center}
.mc h3{font-size:16px;margin:16px 0 6px;color:var(--ac)}.mc p{margin:0 0 8px}.mc small{color:var(--mut)}
.mh{display:flex;gap:14px;align-items:center}.mh img{width:112px;height:63px;border-radius:10px;object-fit:cover;flex:none;background:var(--c2)}
.mh>div{min-width:0}.mh h2{margin:0 0 6px}.mh h2 small{font-weight:400;font-size:14px}.mh .rk{font-size:24px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips span{padding:2px 9px;border:1px solid var(--line);border-radius:99px;font-size:13px;color:var(--mut);white-space:nowrap}
.chips b{color:var(--tx)}.chips span.up,.chips span.down{border-color:currentColor}
.cap{color:var(--ac);font-size:13px;font-weight:600;margin:16px 0 8px}
.pm{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}.pm span{font-size:13px;padding:3px 10px;border-radius:8px}
.pm .p{background:#123524;color:#a7f3c4}.pm .m{background:#3a1424;color:#fecdd3}
.sts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 18px;margin:14px 0 0}
.st span{font-size:14px}.st b{font-size:17px}.st small{display:block;color:var(--mut);font-size:12px;margin-top:3px}
.bar{position:relative;height:10px;border-radius:99px;background:var(--c2);margin-top:6px;overflow:hidden}
.bar>b{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,var(--g));border-radius:99px}
.bar.pk>b{background:linear-gradient(90deg,#4f46e5,var(--ac))}
.bar i{position:absolute;top:-2px;bottom:-2px;width:2px;background:#fff;opacity:.8}
.bar.ln{display:flex}.bar.ln>b{border-radius:0}.bar.ln .w{background:var(--g)}.bar.ln .d{background:#5b5680}.bar.ln .l{background:var(--r)}
.hg{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 18px}
.hcs{display:flex;flex-wrap:wrap;gap:8px}
.hc{display:flex;flex-direction:column;align-items:center;gap:2px;width:64px;color:var(--tx);font-size:13px;font-weight:700}
.hc:hover{text-decoration:none}.hc img{width:64px;height:36px;border-radius:6px;object-fit:cover;background:var(--c2)}
.pl{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 18px}
.sgw{overflow-x:auto;margin-top:4px;padding-bottom:2px}
.sgd{display:grid;grid-template-columns:34px repeat(18,minmax(17px,1fr));gap:3px;min-width:420px;align-items:center}
.sgd>span{aspect-ratio:1;border-radius:4px;background:var(--c2);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800}
.sgd>span.on{background:#2d2363;border:1px solid var(--ac);color:var(--tx)}
.sgd>span.u{border-color:#fbbf24;color:#fbbf24}.sgd>span.t{border-color:var(--g);color:var(--g)}
.sgh img{width:34px;height:34px;border-radius:6px;display:block}
.sgh .ti{display:flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:6px;background:var(--c2);color:var(--mut);font-weight:800}
.tln{display:block;color:var(--mut);font-size:12px;margin-top:4px}
.tt{display:flex;flex-direction:column;gap:4px}
.tr{display:grid;grid-template-columns:1fr 34px 1fr;gap:6px;align-items:stretch;font-size:13px}
.tr .lv{display:flex;align-items:center;justify-content:center;border-radius:50%;background:#3b2f73;font-weight:800;height:34px}
.tr .c,.tr .o{padding:5px 8px;border-radius:8px;display:flex;flex-direction:column;justify-content:center}
.tr .o.e{background:none}.tr .c{background:#2d2363;border:1px solid var(--ac);text-align:right}.tr .o{color:var(--mut);background:var(--c2)}
.tr small{font-size:11px;color:var(--mut)}
.bl{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:4px 14px}.bl .cap{margin-top:0}
.ic{display:flex;flex-wrap:wrap;gap:6px}.ic span{display:flex;flex-direction:column;align-items:center}
.ic img{width:72px;height:53px;border-radius:8px;background:var(--c2)}.ic small{font-size:12.5px;color:var(--mut)}
.wb{width:110px;flex:none}.wb .bar{margin:0}
@media(max-width:560px){nav a{padding:6px 12px;font-size:13px}.row img{width:72px;height:40px}.row .v{font-size:17px}.wb{width:84px}.mh img{width:80px;height:45px}.mh .rk{font-size:19px}h1{font-size:23px}.hero img{width:96px;height:54px}.vs .big{font-size:26px}}
.mono{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.sub2{color:var(--mut);font-size:13px;margin:4px 0 18px;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.tabs2{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 4px;overflow-x:auto;scrollbar-width:none}
.tabs2 button{background:none;border:0;border-bottom:2px solid transparent;color:var(--mut);font:inherit;font-weight:600;padding:12px 14px;cursor:pointer;white-space:nowrap;min-height:44px}
.tabs2 button:hover{color:var(--tx)}.tabs2 button.on{color:var(--tx);border-bottom-color:var(--ac)}
.tbl{font-variant-numeric:tabular-nums}
.th,.rw{display:grid;grid-template-columns:44px minmax(170px,240px) minmax(200px,1fr) 72px 72px 120px;gap:16px;align-items:center}
.th{padding:10px 8px;color:var(--mut);font-size:12px;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.tr2{border-top:1px solid var(--line)}
.rw{width:100%;padding:10px 8px;background:none;border:0;color:var(--tx);font:inherit;text-align:left;cursor:pointer}
.rw:hover{background:rgba(196,181,253,.05)}.tr2.open>.rw{background:rgba(196,181,253,.08)}
.rk2{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;color:var(--mut);font-weight:700}
.tr2:nth-child(-n+4) .rk2{color:var(--ac)}
.hn{display:flex;align-items:center;gap:10px;min-width:0}.hn img{width:40px;height:40px;border-radius:6px;object-fit:cover;object-position:center 20%;flex:none;background:var(--c2)}
.hn b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wr{display:flex;align-items:center;gap:10px}.wr b,.pk,.td{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:14px}
.wr b{min-width:52px}.wr .bar{flex:1;margin:0;height:6px}
.pk{color:var(--mut)}.mut{color:var(--mut)}
.lm{display:inline-flex;width:100px;height:6px;border-radius:3px;overflow:hidden;vertical-align:middle;background:var(--c2)}
.lm i{display:block;height:100%}.lm .w{background:var(--g)}.lm .d{background:#5b5680}.lm .l{background:var(--r)}
.det{display:none;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:28px;padding:16px 8px 22px 64px;border-left:2px solid var(--ac);margin-left:8px}
.tr2.open>.det{display:grid}.det{overflow:hidden}
.det h4{margin:0 0 10px;font-size:13px;color:var(--ac);font-weight:600}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 12px;font-size:14px}.kv dt{color:var(--mut);font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:12px;padding-top:2px}
.kv dd{margin:0}.kv b{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.pl{margin:4px 0;font-size:13.5px;color:#d6d0f5}.pl span{font-weight:800;margin-right:4px}
.fr{display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:center;margin:10px 0 0;font-size:12px}
.fr>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;max-width:320px}
.fc{display:inline-flex;flex-direction:column;align-items:center;gap:1px;color:var(--tx);text-decoration:none}
.fc{min-width:0}.fc img{width:100%;height:auto;aspect-ratio:16/9;border-radius:4px;object-fit:cover}.fc b{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:11px}
.tl2{list-style:none;margin:12px 0 0;padding:0;font-size:13px}.tl2 li{padding:4px 0;border-top:1px dashed var(--line)}
.tl2 b{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;color:var(--ac);margin-right:8px}
.bs2{display:grid;grid-template-columns:52px 1fr;gap:8px;align-items:start;margin:0 0 10px}.bs2>.mut{font-size:12px;padding-top:6px;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.bs2>div{display:flex;flex-wrap:wrap;gap:5px}.bs2 span{display:flex;flex-direction:column;align-items:center}
.bs2 img{width:44px;height:32px;border-radius:4px;background:var(--c2)}.bs2 small{font-size:11px;color:var(--mut);font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.more2{display:inline-block;margin-top:6px;font-size:13px}
@media(max-width:900px){.th,.rw{grid-template-columns:36px minmax(0,1fr) 120px 56px;gap:8px}.th .ln,.rw .ln,.th span:nth-child(5),.rw .td{display:none}
 .det{grid-template-columns:minmax(0,1fr);gap:20px;padding:14px 4px 18px 14px;margin-left:4px}.fr{grid-template-columns:84px minmax(0,1fr)}.wr .bar{display:none}.hn img{width:34px;height:34px}}
@media(max-width:420px){.th,.rw{grid-template-columns:28px minmax(0,1fr) 64px 48px}}
@media(min-width:1000px){.tabs2,.tbl{zoom:1.2}.det{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) minmax(0,.85fr);gap:22px;padding-left:20px}.fr{grid-template-columns:82px minmax(0,1fr)}}
