/* SHAPKI-1108 · шапки профиля и ранний доступ (этап 8 подписки, утверждено владельцем 08.11). Профиль игрока на /ladder и кабинет.
   Шапка — слой под содержимым верха профиля (z-index -1 внутри блока): размеры профиля не меняются, картинка появляется плавно,
   пока не загрузилась — блок такой же, как без шапки. Цвета — «Обсидиан» 2.1 и палитра B: красный GG, графит, кремовый; без синего и золота. */
.sh-host{isolation:isolate}   /* position:relative ставит скрипт, только если блок static (как модуль знаков для кромки) */
.sh-bg{position:absolute;inset:0;z-index:-1;display:block;overflow:hidden;border-radius:inherit;pointer-events:none;background:#111;opacity:0;transition:opacity .45s ease}
.sh-bg.is-on{opacity:1}
.sh-bg>i{position:absolute;inset:0;display:block}
.sh-bg__img{background-repeat:no-repeat;background-size:cover;background-position:var(--sh-pos,right 40%)}
/* затемнение слева (аватар, ник) и снизу (плитки) — текст читается на любой картинке */
.sh-bg__fade{background:linear-gradient(90deg,rgba(17,17,17,.97) 0,rgba(17,17,17,.93) 18%,rgba(17,17,17,.62) 48%,rgba(17,17,17,.18) 78%,rgba(17,17,17,.05) 100%),linear-gradient(0deg,rgba(17,17,17,.72) 0,rgba(17,17,17,0) 46%)}
.sh-bg--karta .sh-bg__tint{background:linear-gradient(115deg,transparent 45%,rgba(245,241,232,.10) 70%,transparent 90%);mix-blend-mode:screen}
/* одна живая деталь у шапок с «Гуд вайб»: светлая полоса раз в 12 с; «меньше движения» — стоит */
.sh-bg__sweep{background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 50%,transparent 60%);background-size:300% 100%;background-position:130% 0;mix-blend-mode:screen;animation:sh-sweep 12s cubic-bezier(.45,0,.2,1) infinite}
@keyframes sh-sweep{0%,80%{background-position:130% 0}100%{background-position:-30% 0}}
@media (prefers-reduced-motion:reduce){.sh-bg{transition:none}.sh-bg__sweep{animation:none;display:none}}
html[data-gg-calm] .sh-bg__sweep{animation:none;display:none}
/* узоры — без картинок */
.sh-u-terminal .sh-bg__img{background:
  repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),
  radial-gradient(60% 120% at 92% 40%,rgba(224,65,43,.30),transparent 70%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='64'%3E%3Ctext x='4' y='22' font-family='monospace' font-size='13' fill='%23F5F1E8' fill-opacity='.07' letter-spacing='3'%3E%3E GG %C2%B7 PRO LADDER%3C/text%3E%3Ctext x='184' y='54' font-family='monospace' font-size='13' fill='%23E0412B' fill-opacity='.16' letter-spacing='3'%3E%C2%BB GOLDEN GUNS%3C/text%3E%3C/svg%3E")}
.sh-u-pricel .sh-bg__img{background:
  linear-gradient(90deg,transparent calc(80% - .5px),rgba(224,65,43,.45) calc(80% - .5px) calc(80% + .5px),transparent calc(80% + .5px)),
  linear-gradient(0deg,transparent calc(50% - .5px),rgba(224,65,43,.45) calc(50% - .5px) calc(50% + .5px),transparent calc(50% + .5px)),
  repeating-radial-gradient(circle at 80% 50%,rgba(224,65,43,.34) 0 1.5px,transparent 1.5px 34px),
  radial-gradient(40% 90% at 80% 50%,rgba(224,65,43,.18),transparent 72%);
  -webkit-mask:radial-gradient(50% 140% at 80% 50%,#000 30%,transparent 78%);mask:radial-gradient(50% 140% at 80% 50%,#000 30%,transparent 78%)}
.sh-u-mazok .sh-bg__img{background:
  linear-gradient(118deg,transparent 46%,rgba(224,65,43,.62) 53%,rgba(184,50,31,.50) 61%,rgba(168,48,29,.18) 68%,transparent 74%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
/* «Корона» («Легенда») — узор на странице: большая корона щита уровня справа, ореол и мелкий повтор, гаснущий к нику */
.sh-u-korona .sh-bg__img{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3 4 14 13.4'%3E%3Cpath d='M4.5 14.3 3.9 7.1 7.4 10.1 10 5 12.6 10.1 16.1 7.1 15.5 14.3Z' fill='%23E0412B' fill-opacity='.16' stroke='%23F5F1E8' stroke-opacity='.34' stroke-width='.22' stroke-linejoin='round'/%3E%3Cpath d='M4.8 16.4h10.4' stroke='%23F5F1E8' stroke-opacity='.34' stroke-width='.3' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='11.7' r='.95' fill='%23FF4B33' fill-opacity='.9'/%3E%3C/svg%3E") var(--sh-kp,right 9% top 14%)/var(--sh-ks,auto min(58%,200px)) no-repeat,
  radial-gradient(34% 120% at 84% 52%,rgba(255,75,51,.34),rgba(224,65,43,.12) 55%,transparent 75%),
  linear-gradient(118deg,transparent 52%,rgba(224,65,43,.20) 64%,transparent 80%)}
.sh-u-korona .sh-bg__tint{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='48' viewBox='0 0 56 48'%3E%3Cpath d='M10 30 9.4 21 13 24.3 16 18 19 24.3 22.6 21 22 30Z' fill='%23E0412B' fill-opacity='.2'/%3E%3Cpath d='M38 14 37.6 8.5 39.8 10.5 41.6 6.6 43.4 10.5 45.6 8.5 45.2 14Z' fill='%23F5F1E8' fill-opacity='.07'/%3E%3C/svg%3E") 0 0/56px 48px;
  -webkit-mask:linear-gradient(90deg,transparent 30%,#000 70%);mask:linear-gradient(90deg,transparent 30%,#000 70%)}
.sh-bg--uzor .sh-bg__fade{background:linear-gradient(90deg,rgba(17,17,17,.96) 0,rgba(17,17,17,.8) 30%,rgba(17,17,17,.2) 62%,rgba(17,17,17,0) 80%)}
/* плитки сезона на шапке профиля — тёмное стекло без размытия */
.sh-host .ph-kpi__i{background:rgba(12,12,12,.84)}
/* телефон: у профиля нет рамки — шапка ложится под верх до краёв экрана, ничего не сдвигая */
@media (max-width:560px){
  #gg-lp-prof .ph-hd.sh-host>.sh-bg{inset:-16px -16px -10px -16px;border-radius:0}
  #gg-lp-prof .ph-hd.sh-host>.sh-bg .sh-bg__fade{background:linear-gradient(180deg,rgba(14,14,14,.25) 0,rgba(14,14,14,.55) 45%,rgba(14,14,14,.92) 85%,#0E0E0E 100%),linear-gradient(90deg,rgba(14,14,14,.8) 0,rgba(14,14,14,.25) 75%)}
  #gg-lp-prof .sh-u-korona,#gg-cab .pcard .sh-u-korona{--sh-kp:right 6% bottom 5%;--sh-ks:auto 30%}
  #gg-cab .pcard.sh-host>.sh-bg .sh-bg__fade{background:linear-gradient(180deg,rgba(17,17,17,.35) 0,rgba(17,17,17,.7) 40%,rgba(17,17,17,.95) 75%,#111 100%)}
}

/* ---------- кабинет: карточка «Шапка профиля» ---------- */
#gg-cab .sh-pick{margin:0 0 14px;padding:20px 22px;border:1px solid var(--line,rgba(255,255,255,.13));background:var(--card,#111);color:#FAFAFA;font:500 13px/1.45 var(--gg-font-long,'Montserrat',system-ui,sans-serif)}
#gg-cab .sh-pick__h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin-bottom:4px}
#gg-cab .sh-pick__t{margin:0;font:700 15px/1.2 var(--gg-font-body,'Oswald',sans-serif);letter-spacing:.12em;text-transform:uppercase;color:#FAFAFA}
#gg-cab .sh-cap{font:600 10px/1.3 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.16em;text-transform:uppercase;color:#959595}
#gg-cab .sh-cap b{color:#F24B36;font-weight:600}
#gg-cab .sh-pick__sub{margin:0;color:#BDBDBD}
#gg-cab .sh-rano{display:flex;align-items:center;gap:10px;margin:12px 0 0;padding:10px 12px;border:1px solid rgba(255,255,255,.13);border-left:3px solid #E0412B;background:#0E0E0E;font:600 12.5px/1.4 var(--gg-font-long,'Montserrat',sans-serif);color:#FAFAFA}
#gg-cab .sh-rano small{display:block;margin-top:2px;font:500 11px/1.35 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.04em;color:#959595}
#gg-cab .sh-rano svg{flex:none}
#gg-cab .sh-grp{display:grid;gap:8px;margin-top:16px}
#gg-cab .sh-grp__h{display:flex;align-items:center;gap:8px;font:600 11px/1 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.14em;text-transform:uppercase;color:#BDBDBD}
#gg-cab .sh-grp__h svg{flex:none}
#gg-cab .sh-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
#gg-cab .sh-tile{position:relative;display:block;width:100%;aspect-ratio:16/6;margin:0;border-radius:9px;overflow:hidden;border:1px solid rgba(255,255,255,.13);background:#111;cursor:pointer;padding:0;color:inherit;text-align:left;isolation:isolate}
#gg-cab .sh-tile .sh-bg{border-radius:0}
#gg-cab .sh-tile .sh-bg__fade{background:linear-gradient(0deg,rgba(10,10,10,.85) 0,rgba(10,10,10,.1) 60%)}
#gg-cab .sh-tile__n{position:absolute;left:9px;bottom:7px;z-index:2;font:600 10px/1 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.12em;text-transform:uppercase;color:#FAFAFA}
#gg-cab .sh-tile[aria-pressed="true"]{border-color:#E0412B;box-shadow:0 0 0 1px #E0412B}
#gg-cab .sh-tile[aria-pressed="true"] .sh-tile__rn{display:none}
#gg-cab .sh-tile[aria-pressed="true"]::after{content:"\2713\00A0стоит";position:absolute;top:7px;right:8px;z-index:2;padding:3px 6px;border-radius:4px;background:#E0412B;font:700 9px/1 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.12em;text-transform:uppercase;color:#fff}
#gg-cab .sh-tile.is-lock .sh-bg{filter:saturate(.6) brightness(.6)}
#gg-cab .sh-tile.is-prev{border-color:rgba(245,241,232,.6);box-shadow:0 0 0 1px rgba(245,241,232,.6)}
#gg-cab .sh-tile:focus-visible{outline:2px solid #F5F1E8;outline-offset:2px}
#gg-cab .sh-tile__lk{position:absolute;top:7px;right:8px;z-index:2;display:inline-flex;align-items:center;gap:5px;max-width:calc(100% - 16px);padding:3px 6px 3px 4px;border-radius:4px;background:rgba(10,10,10,.82);font:600 9px/1.1 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.1em;text-transform:uppercase;color:#BDBDBD;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#gg-cab .sh-tile__lk svg{flex:none}
#gg-cab .sh-tile__rn{position:absolute;top:7px;left:8px;z-index:2;padding:3px 6px;border:1px solid rgba(242,75,54,.7);border-radius:4px;background:rgba(10,10,10,.78);font:700 9px/1 var(--gg-font-mono,'JetBrains Mono',monospace);letter-spacing:.12em;text-transform:uppercase;color:#F24B36}
#gg-cab .sh-pick__f{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;min-height:38px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}
#gg-cab .sh-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;margin:0;padding:0 16px;border-radius:8px;border:1px solid rgba(255,255,255,.13);background:transparent;color:#FAFAFA;font:700 13px/1 var(--gg-font-body,'Oswald',sans-serif);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;text-decoration:none}
#gg-cab .sh-btn--red{background:#C73A26;border-color:#C73A26;color:#fff}
#gg-cab .sh-btn[disabled]{opacity:.55;cursor:default}
#gg-cab .sh-note{flex:1 1 240px;color:#959595;font:500 12px/1.45 var(--gg-font-long,'Montserrat',sans-serif)}
#gg-cab .sh-note.is-err{color:#F24B36}
@media (max-width:560px){#gg-cab .sh-pick{padding:16px}#gg-cab .sh-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#gg-cab .sh-pick__f .sh-btn{flex:1 1 auto}}
/* стаж под ником в «Ваш профиль» на телефоне («Поддерживает портал первый месяц») — переносится, а не обрезается справа (хвост PRM-SHCHIT-1108;
   модуль знаков не меняется). Строка стоит до появления цифр, высота карточки задаётся при первой отрисовке. */
@media (max-width:560px){#gg-cab .pcard .prm-staz{white-space:normal;overflow-wrap:anywhere}}