/*
 * Спокойный стиль — поверх system.css.
 *
 * Меньше эффектов, больше воздуха. Синий — наш акцент и остаётся: кнопки,
 * подсветки, индикаторы. Уходят синяя «муть» на фоне и ореолы вокруг всего
 * подряд: дорого выглядит не блеск, а аккуратность. Движение остаётся там,
 * где оно что-то сообщает: наведение, появление блоков, переходы страниц.
 */
.sys{
 --bg:#07080a;--text:#f1f3f7;--muted:#9aa1ae;--dim:#5f6672;
 --line:rgba(255,255,255,.075);--line2:rgba(255,255,255,.13);
 --glow:rgba(61,125,255,0);
 --glass:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012) 60%),rgba(12,13,16,.8);
 --glass2:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015) 60%),rgba(14,15,19,.88);
 --corner:rgba(255,255,255,.35)
}

/* ---------- фон: только тихий дым ---------- */
.sys-nebula,.sys-stars,.sys-shards,.sys-glow{display:none!important}
.sys .sys-bg canvas{opacity:.5!important}

/* ---------- без ореолов ---------- */
.sys *,.sys *::before,.sys *::after{text-shadow:none!important}
.sys .notification-count,.sys .side-badge,.sys .sys-rail-badge{animation:none!important}

/* ---------- кнопки: плоская синяя таблетка ---------- */
.sys .button{border-radius:999px;transition:background .25s,border-color .25s,transform .25s cubic-bezier(.22,1,.36,1),filter .25s}
.sys .button.primary{background:#3d7dff!important;border-color:#3d7dff!important;box-shadow:none!important}
.sys .button.primary:hover{filter:brightness(1.1);transform:translateY(-1px)}
.sys .button:not(.primary){background:rgba(255,255,255,.03);border-color:var(--line2)}
.sys .button:not(.primary):hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.22)}

/* ---------- карточки: плоско, тонкая линия ---------- */
.sys [class*="card"]:hover,.sys [class*="plan"]:hover{border-color:rgba(255,255,255,.16)}

/* Ник купившего визуалы — светится. */
.sys .nick-glow{background:linear-gradient(100deg,#8fc0ff 0%,#ffffff 30%,#7cc4ff 55%,#ffffff 80%,#8fc0ff 100%)!important;background-size:220% 100%!important;
 -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;
 animation:calm-nick 4s linear infinite;filter:drop-shadow(0 0 6px rgba(124,196,255,.7)) drop-shadow(0 0 14px rgba(61,125,255,.4))}
@keyframes calm-nick{to{background-position:-220% 0}}

/* ---------- топ: места без медалей ---------- */
/* Цифра «01 / 02 / 03» моноширинным шрифтом вместо медалей с римскими
   цифрами. Первое место — нашим синим, второе и третье — белым; строки
   без золотых и бронзовых заливок, только тонкая черта слева. */
.sys :is(.podium-1,.podium-2,.podium-3){background:transparent!important;box-shadow:none!important}
.sys :is(.podium-1,.podium-2,.podium-3)::before{content:'';position:absolute;left:0;top:14px;bottom:14px;width:2px;border-radius:2px;background:rgba(255,255,255,.28)}
.sys .podium-1::before{background:#3d7dff}
.sys .podium-1{background:linear-gradient(90deg,rgba(61,125,255,.07),transparent 60%)!important}
.sys .rank-number{width:34px!important;height:auto!important;border-radius:0!important;background:none!important;box-shadow:none!important;display:block!important;
 font-family:'Geist Mono',monospace;font-size:13px;letter-spacing:.04em;color:var(--dim)!important;text-align:left}
.sys :is(.podium-2,.podium-3) .rank-number{color:#e8eaee!important;font-weight:600}
.sys .podium-1 .rank-number{color:#7cb2ff!important;font-weight:600}
.sys :is(.podium-1,.podium-2,.podium-3) .rank-avatar{box-shadow:0 0 0 1px rgba(255,255,255,.14)!important}
.sys .podium-1 .rank-avatar{box-shadow:0 0 0 1.5px rgba(61,125,255,.75)!important}
.sys .podium-1 .rank-score{color:#fff!important}

/* ---------- меню-макет на главной: цвет темы ---------- */
/* Окно окрашено темой, выбранной в разделе «Темы» (по умолчанию «Лёд» —
   синий). Раньше тема писалась в .showcase, которого на новой главной нет,
   а стили брали жёсткий акцент сайта — переключение ничего не меняло. */
.sys .sys-gui{--a:var(--accent,#6ea8ff)}
.sys .sys-gui .av-menu{--a:var(--accent,#6ea8ff)}
.sys .sys-gui .avm-window{background:radial-gradient(120% 90% at 85% 0%,color-mix(in srgb,var(--a) 30%,transparent),transparent 62%),
 linear-gradient(160deg,color-mix(in srgb,var(--a) 22%,rgba(20,22,30,.6)),rgba(14,15,20,.72) 60%),rgba(10,11,15,.86)!important;
 border:1px solid color-mix(in srgb,var(--a) 28%,rgba(255,255,255,.06))!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
 transition:background .6s,border-color .6s}
.sys .sys-gui .avm-window::after{background:radial-gradient(50% 40% at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.05),transparent 70%)!important}
.sys .sys-gui .avm-side{background:rgba(255,255,255,.025)!important;border-right:1px solid rgba(255,255,255,.07)!important}
.sys .sys-gui .avm-logo{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--a) 40%,transparent))!important}
.sys .sys-gui .avm-nav button{color:rgba(235,238,244,.66)!important}
.sys .sys-gui .avm-nav button.active{background:rgba(255,255,255,.07)!important;color:#fff!important}
.sys .sys-gui .avm-nav button.active::before{background:var(--a)!important;box-shadow:none!important}
.sys .sys-gui .avm-search{background:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.1)!important;box-shadow:none!important}
.sys .sys-gui .avm-search:focus-within{border-color:color-mix(in srgb,var(--a) 60%,transparent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--a) 16%,transparent)!important}
.sys .sys-gui .avm-search:focus-within svg{color:var(--a)!important}
.sys .sys-gui .avm-module{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.07)!important;color:rgba(235,238,244,.6)!important;transition:background .35s,border-color .35s,color .25s}
.sys .sys-gui .avm-module:hover{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.15)!important}
.sys .sys-gui .avm-module.on{color:#fff!important;background:linear-gradient(100deg,color-mix(in srgb,var(--a) 26%,transparent),color-mix(in srgb,var(--a) 7%,transparent))!important;border-color:color-mix(in srgb,var(--a) 38%,transparent)!important}
.sys .sys-gui .avm-module .avm-toggle{background:rgba(255,255,255,.14)!important}
.sys .sys-gui .avm-module.on .avm-toggle{background:var(--a)!important;box-shadow:none!important}
.sys .sys-gui .avm-gear{color:rgba(235,238,244,.4)!important}
.sys .sys-gui .avs-row{background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.07)!important}
.sys .sys-gui .avs-back,.sys .sys-gui .avs-modes button{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.09)!important}
.sys .sys-gui .avs-modes button.on{background:color-mix(in srgb,var(--a) 30%,rgba(255,255,255,.04))!important;border-color:color-mix(in srgb,var(--a) 55%,transparent)!important}
.sys .sys-gui .avs-switch.on{background:var(--a)!important;box-shadow:none!important}

/* ---------- фон без шейдера (телефоны, слабые ПК) ---------- */
.sys .sys-bg{background:radial-gradient(70% 45% at 50% -8%,rgba(61,125,255,.16),transparent 70%),radial-gradient(60% 30% at 50% 18%,rgba(124,196,255,.05),transparent 70%)}

@media (prefers-reduced-motion:reduce){.sys *,.sys *::before,.sys *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Главный экран — без бегущей полосы скана. */
.sys-scan{display:none!important}

/* Рамки аватара: ровные углы.
   Рамка лежит снаружи аватара, значит её скругление больше на величину отступа —
   иначе на углах она то толще, то тоньше. --fr — скругление самого аватара. */
.sys .sys-face{--fr:13px}
.sys .sys-frame-prev{--fr:18px}
.sys .sys-profile-face{--fr:30px}
.sys .rank-face{--fr:12px}
.sys [data-frame=shards]::before,.sys [data-frame=pulse]::before,.sys [data-frame=pulse]::after{border-radius:calc(var(--fr,14px) + 3px)!important}
.sys [data-frame=aurora]::before{border-radius:calc(var(--fr,14px) + 4px)!important}
.sys [data-frame=aurora]::after{border-radius:calc(var(--fr,14px) + 9px)!important}
/* В профиле с рамкой — без второго кольца под ней: фото, тёмный кант, рамка. */
.sys .sys-profile-face[data-frame]{background:none!important;padding:0!important}
.sys .sys-profile-face[data-frame]>div{border-radius:var(--fr)!important}
/* Значок «Знак»: гладкий круг вместо ступенчатого градиента. */
.sys [data-frame=shards]::after{background:url(/assets/logo.webp) center/60% no-repeat,#121212!important;box-shadow:0 0 0 2px #6fb6ff,0 0 12px rgba(124,196,255,.55)!important;filter:none!important}