/* ===========================================================================
   PUBLIC SHELL (pre-login pages) — v2 design language.
   Linked ONLY from templates/layout.php. Self-contained: does not depend on
   styles.css (which is shared with the admin panel and screenshot viewer).

   Ключевые решения оформления:
     небо   : снимок backlandingpage.jpg лежит отдельным слоем в верхней части
              страницы и растворяется в звёздном грунте (секция «Sky»)
     панели : стекло — backdrop-filter плюс полупрозрачная заливка темы
     кнопки : тёмная плашка приборной панели, без внутреннего градиента
     радиусы: --radius-*, почти прямой угол под корпусную графику снимка

   ТЕМЫ. Пресеты вселенных (в конце файла) задают только набор --theme-*.
   Компоненты берут их через var(--theme-x, <fallback>), поэтому отдельного
   слоя правил-перекрытий на тему нет: одно правило на компонент.
   =========================================================================== */

* { box-sizing: border-box; }

body.public {
    /* Радиусы: 3 px на поверхностях и полях, 2 px на мелочи. Единственное
       исключение — круглая точка статуса вселенной: это индикатор, а не угол. */
    --radius-panel: 3px;
    --radius-control: 3px;
    --radius-chip: 2px;

    /* Небо: высота кадра, его растворение и градиент читаемости.
       56.3vw = 100 / 1.777 — пропорция снимка (1672×941). При такой высоте
       background-size:cover не режет кадр по ширине: солнце слева и станция
       справа остаются в кадре целиком. */
    --sky-height: clamp(560px, 56.3vw, 1200px);
    --sky-pos: 50% 0;
    --sky-mask: linear-gradient(180deg, #000 0%, #000 38%, rgba(0, 0, 0, .55) 64%, transparent 84%);
    --sky-scrim:
        radial-gradient(112% 60% at 13% 3%, rgba(255, 180, 115, .14), transparent 58%),
        linear-gradient(180deg,
            rgba(3, 7, 15, .58) 0%,
            rgba(3, 7, 15, .22) 20%,
            rgba(3, 7, 15, .40) 52%,
            rgba(4, 8, 16, .62) 72%,
            rgba(4, 8, 16, .28) 88%,
            rgba(4, 8, 16, 0) 100%);

    position: relative;
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    /* Грунт: он виден ниже кадра, поэтому длинные страницы — правила, история —
       уезжают на спокойный тёмный фон, а не на фотографию. */
    background:
        radial-gradient(ellipse at 50% -10%, var(--theme-glow, rgba(72, 130, 184, .16)), transparent 62%),
        linear-gradient(180deg, var(--theme-page-top, rgba(12, 32, 55, .88)), var(--theme-page-bottom, rgba(4, 9, 16, .97))),
        url(../img/sterne_bg2.jpg) repeat;
    color: #d5e3f4;
    font-family: "Segoe UI", "Helvetica Neue", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

body.public a {
    color: var(--theme-link, #84bdff);
    text-decoration: none;
}
body.public a:hover {
    color: #eef8ff;
}

/* ---- Sky ------------------------------------------------------------------
   Снимок и слой читаемости — абсолютные псевдоэлементы body с отрицательным
   z-index: лежат поверх грунта (фона canvas), но под всей разметкой.
   --------------------------------------------------------------------------- */
body.public::before,
body.public::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: var(--sky-height);
    pointer-events: none;
}
body.public::before {
    z-index: -2;
    /* url() пишется прямо в свойстве, а НЕ через кастомное свойство: внутри
       var() относительный путь резолвится неинтероперабельно (часть движков
       считает его от адреса документа, а не от таблицы стилей), и на боевом
       хосте ../img/… превращался бы в /img/… → 404. */
    background-image: url(../img/login/backlandingpage.jpg);
    background-repeat: no-repeat;
    background-position: var(--sky-pos);
    background-size: cover;
    -webkit-mask-image: var(--sky-mask);
    mask-image: var(--sky-mask);
}
body.public::after {
    z-index: -1;
    background: var(--sky-scrim);
}

.site {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    flex: 1 0 auto;
}

/* ---- Top bar --------------------------------------------------------------
   Нижней разделительной линии нет: на снимке она спорила с лимбом планеты.
   --------------------------------------------------------------------------- */
.site__bar {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 26px 0 20px;
}

.site__brand {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #e9f5ff !important;
    white-space: nowrap;
    text-shadow: 0 2px 24px rgba(0, 0, 0, .8), 0 0 30px rgba(74, 152, 235, .3);
}
.site__brand b {
    color: var(--theme-accent, #62b2ff);
    font-weight: 800;
}

.site__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-left: auto;
}
.site__nav a,
.site__nav .is-active {
    padding: 8px 13px;
    border-radius: var(--radius-chip);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .3px;
    color: #b7c8de;
    text-shadow: 0 1px 10px rgba(0, 0, 0, .75);
}
.site__nav a:hover {
    background: var(--theme-surface-soft, rgba(76, 143, 219, .14));
    color: #eef8ff;
}
.site__nav .is-active {
    color: #e5f5ff;
    background: var(--theme-surface-soft, rgba(74, 152, 235, .18));
    box-shadow: inset 0 0 0 1px rgba(124, 187, 255, .22);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.site__lang {
    display: flex;
    align-items: center;
    gap: 8px;
}
.site__lang img {
    display: block;
    border: 1px solid rgba(124, 187, 255, .4);
    border-radius: var(--radius-chip);
}
.locale-picker {
    display: flex;
    gap: 4px;
    margin: 0;
}
.locale-picker button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: var(--radius-chip);
    background: transparent;
    color: #b7c8de;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}
.locale-picker button[aria-pressed="true"],
.locale-picker button:hover {
    border-color: rgba(124, 187, 255, .4);
    background: var(--theme-surface-soft, rgba(76, 143, 219, .14));
    color: #eef8ff;
}
.locale-picker button:focus-visible {
    outline: 2px solid #62b2ff;
    outline-offset: 2px;
}

/* ---- Hero (home only) -----------------------------------------------------
   Живёт внутри левой колонки сетки и выровнен по левому краю: правая треть
   снимка со станцией остаётся открытой, а карточка входа попадает на первый
   экран рядом с заголовком.
   --------------------------------------------------------------------------- */
.site__hero {
    padding: 34px 0 30px;
    text-align: left;
}
.site__eyebrow {
    display: block;
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3.4px;
    text-transform: uppercase;
    color: var(--theme-accent, #7cc7ff);
    text-shadow: 0 1px 12px rgba(0, 0, 0, .8);
}
.site__hero h1 {
    margin: 0 0 16px;
    max-width: 14ch;
    font-size: clamp(40px, 5.6vw, 68px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -.5px;
    text-wrap: balance;
    color: #e8f5ff;
    text-shadow: 0 4px 28px rgba(0, 0, 0, .64), 0 0 36px rgba(64, 148, 238, .22);
}
.site__hero p {
    margin: 0 0 28px;
    max-width: 54ch;
    font-size: clamp(15px, 2.4vw, 19px);
    color: #c6d6e8;
    text-shadow: 0 1px 14px rgba(0, 0, 0, .7);
}

/* ---- Buttons --------------------------------------------------------------
   Тёмная плашка приборной панели: плоская заливка без внутреннего градиента,
   тонкая рамка по теме и настоящая тень. Заметность даёт край и свечение,
   а не яркость заливки. Набор — как у заголовков панелей: капс, 13 px, трекинг.
   --------------------------------------------------------------------------- */
.btn {
    display: inline-block;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 700;
    border: 1px solid rgba(124, 187, 255, .26);
    border-radius: var(--radius-control);
    background: rgba(6, 16, 31, .80);
    color: #c8dff7;
    cursor: pointer;
    text-align: center;
    text-shadow: none;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
}
.btn:active { transform: translateY(1px); }
.btn--cta {
    padding: 15px 30px;
    font-size: 13px;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: #e6f3ff !important;
    background: var(--theme-plate, rgba(6, 17, 33, .92));
    border-color: var(--theme-border, rgba(140, 198, 255, .48));
    box-shadow:
        0 14px 30px rgba(0, 0, 0, .55),
        0 0 20px var(--theme-glow, rgba(56, 128, 208, .16)),
        inset 0 1px 0 rgba(190, 226, 255, .13);
}
.btn--cta:hover {
    color: #ffffff !important;
    background: var(--theme-plate-hover, rgba(14, 35, 63, .94));
    border-color: var(--theme-accent, #7cc7ff);
    box-shadow:
        0 16px 36px rgba(0, 0, 0, .6),
        0 0 28px var(--theme-glow, rgba(94, 164, 236, .26)),
        inset 0 1px 0 rgba(206, 234, 255, .18);
}
.btn--cta:active {
    box-shadow:
        0 6px 14px rgba(0, 0, 0, .5),
        inset 0 2px 6px rgba(0, 0, 0, .45);
}
.btn--block { display: block; width: 100%; }

.btn:focus-visible,
.site__nav a:focus-visible,
.login__links a:focus-visible {
    outline: 2px solid var(--theme-accent, #7cc7ff);
    outline-offset: 3px;
}

/* ---- Main grid: content + login ------------------------------------------ */
.site__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 30px;
    align-items: start;
    padding: 8px 0 56px;
}

/* ---- Panels --------------------------------------------------------------- */
.panel {
    border: 1px solid var(--theme-border, rgba(103, 151, 190, .34));
    border-radius: var(--radius-panel);
    background: linear-gradient(180deg,
        var(--theme-surface-soft, rgba(25, 50, 76, .70)),
        var(--theme-surface, rgba(10, 26, 45, .86)));
    box-shadow:
        0 22px 50px rgba(0, 0, 0, .55),
        0 0 34px var(--theme-glow, rgba(72, 130, 184, .16)),
        inset 0 1px 0 rgba(255, 255, 255, .07);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
    backdrop-filter: blur(18px) saturate(125%);
    overflow: hidden;
}
.panel__title {
    padding: 15px 22px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: #dff1ff;
    background: linear-gradient(180deg,
        var(--theme-surface-strong, rgba(35, 69, 103, .82)),
        var(--theme-surface-soft, rgba(25, 50, 76, .70)));
    border-bottom: 1px solid var(--theme-border, rgba(103, 151, 190, .34));
}
.panel__body {
    padding: 22px;
}
.panel__body h2 {
    margin: 0 0 12px;
    font-size: 18px;
    color: #eef7ff;
}
.panel__body p { margin: 0 0 14px; }

/* ---- Feature list (home) -------------------------------------------------- */
.features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px;
}
.features li {
    display: flex;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid rgba(124, 187, 255, .16);
    border-radius: var(--radius-control);
    background: rgba(6, 18, 35, .42);
}
.features .features__icon {
    position: relative;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border: 1px solid rgba(101, 172, 244, .36);
    border-radius: var(--radius-chip);
    background: rgba(37, 105, 180, .16);
    font-size: 0;
    line-height: 0;
}
.features .features__icon::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 2px;
    width: 7px;
    height: 12px;
    border-right: 2px solid #75bdff;
    border-bottom: 2px solid #75bdff;
    transform: rotate(45deg);
}
.features b { color: #edf7ff; display: block; margin-bottom: 2px; }
.features span { color: #aabbd0; font-size: 13px; }

/* ---- Login card -----------------------------------------------------------
   Ярче остальных панелей: это главное действие страницы.
   --------------------------------------------------------------------------- */
.login {
    position: sticky;
    top: 22px;
    border-color: var(--theme-accent, rgba(140, 198, 255, .42));
    box-shadow:
        0 30px 70px rgba(0, 0, 0, .62),
        0 0 46px var(--theme-glow, rgba(52, 122, 200, .18)),
        inset 0 1px 0 rgba(255, 255, 255, .1);
}
.login .panel__body {
    padding: 22px 22px 20px;
}
.login__field {
    margin-bottom: 15px;
}
.login__field label {
    display: block;
    margin-bottom: 7px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #93a9c1;
}
.login__input {
    width: 100%;
    padding: 13px 14px;
    font-size: 15px;
    color: #eef7ff;
    background: rgba(2, 9, 20, .72);
    border: 1px solid rgba(124, 187, 255, .28);
    border-radius: var(--radius-control);
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.login__input:focus {
    border-color: var(--theme-accent, #7cc7ff);
    box-shadow: 0 0 0 3px var(--theme-glow, rgba(124, 199, 255, .16));
}
.login__uni {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 14px;
    font-size: 15px;
    color: #dfeeff;
    background: rgba(2, 9, 20, .5);
    border: 1px solid rgba(124, 187, 255, .2);
    border-radius: var(--radius-control);
    cursor: default;
}
/* Точка «вселенная открыта» — индикатор, поэтому остаётся круглой. */
.login__uni .login__lock {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--theme-accent, #62b2ff);
    box-shadow: 0 0 0 4px var(--theme-glow, rgba(98, 178, 255, .12));
    font-size: 0;
    color: transparent;
}
.login__hint {
    margin-top: 4px;
    font-size: 11px;
    color: #748aa3;
}
/* Размер шрифта и капс наследуются от .btn--cta — здесь только ширина шага. */
.login__submit {
    margin-top: 6px;
    padding: 16px 24px;
    letter-spacing: 2px;
}
.login__links {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid rgba(124, 187, 255, .16);
    font-size: 13px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.login__links a { cursor: pointer; }

/* ---- Register form -------------------------------------------------------- */
.reg-form { display: grid; gap: 14px; }
.reg-form__field label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: #8ea3ba;
}
.reg-form__field input[type="text"],
.reg-form__field input[type="password"],
.reg-form__field select {
    width: 100%;
    padding: 12px 14px;
    font-size: 15px;
    color: #eef7ff;
    background: rgba(2, 9, 20, .72);
    border: 1px solid rgba(124, 187, 255, .28);
    border-radius: var(--radius-control);
    outline: none;
}
.reg-form__field input:focus,
.reg-form__field select:focus {
    border-color: var(--theme-accent, #7cc7ff);
    box-shadow: 0 0 0 3px var(--theme-glow, rgba(98, 178, 255, .18));
}
.reg-form__agb {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: #c2d2e5;
}
.reg-status { min-height: 20px; font-size: 13px; }
.reg-status .warning { color: #ff7876; }
.reg-status .fine { color: #6ee787; }
.reg-info { font-size: 13px; color: #aabbd0; min-height: 18px; }

/* ---- Long-form content (about / story / rules) --------------------------- */
.prose p { margin: 0 0 14px; }
.prose strong { color: #eef7ff; }
.prose img {
    border: 1px solid rgba(82, 148, 225, .28);
    border-radius: var(--radius-control);
    max-width: 40%;
    height: auto;
}
.prose .img-right { float: right; margin: 0 0 12px 16px; }
.prose .img-left  { float: left;  margin: 0 16px 12px 0; }
.prose .lead {
    font-size: 16px;
    color: #eef7ff;
    font-weight: 700;
}
.prose .cta-link {
    display: inline-block;
    margin-top: 8px;
    font-weight: 700;
    color: #75bdff;
}
.prose::after { content: ""; display: block; clear: both; }
.rules-text {
    color: #cbdced;
    font-size: 13px;
    line-height: 1.55;
}

/* ---- Universes list ------------------------------------------------------- */
.uni-list { display: grid; gap: 10px; }
.uni-list a {
    display: block;
    padding: 12px 16px;
    border: 1px solid rgba(82, 148, 225, .18);
    border-radius: var(--radius-control);
    background: rgba(5, 18, 36, .68);
    color: #d5e3f4;
}
.uni-list a:hover { border-color: #62b2ff; color: #ffffff; }
.uni-list__closed {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border: 1px solid rgba(255, 255, 255, .05);
    border-radius: var(--radius-control);
    background: rgba(5, 18, 36, .3);
    color: #58697d;
    filter: grayscale(.6);
    opacity: .6;
    cursor: not-allowed;
    user-select: none;
}
.uni-list__badge {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #58697d;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: var(--radius-chip);
    padding: 2px 6px;
}
.uni-note { color: #8ea3ba; font-size: 13px; margin: 0 0 16px; }

/* ---- Screenshots ---------------------------------------------------------- */
.shots-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}
.shots-grid figure { margin: 0; }
.shots-grid img {
    width: 100%;
    height: auto;
    border: 1px solid rgba(82, 148, 225, .28);
    border-radius: var(--radius-control);
    display: block;
}
.shots-grid a:hover img { border-color: #62b2ff; }
.shots-head {
    margin: 4px 0 14px;
    font-size: 16px;
    color: #75bdff;
    font-weight: 700;
}

/* ---- Auth card (recover form / result) ----------------------------------- */
.auth-narrow { max-width: 520px; margin: 40px auto; }

/* ---- Footer --------------------------------------------------------------- */
.site__footer {
    flex-shrink: 0;
    padding: 22px 24px;
    text-align: center;
    font-size: 12px;
    color: #748aa3;
    background: rgba(3, 7, 14, .6);
    border-top: 1px solid rgba(124, 187, 255, .12);
}
.site__footer a { color: #8ea3ba; }

/* ---- Responsive ----------------------------------------------------------- */
@media (max-width: 880px) and (max-device-width: 880px) {
    /* cover режет кадр по ширине — сдвигаем точку кадрирования к станции,
       иначе от снимка остаётся один лимб планеты. */
    body.public { --sky-pos: 68% 0; }
    .site__grid { grid-template-columns: 1fr; }
    .site__hero h1 { max-width: none; }
    .login { position: static; }
    .site__nav { margin-left: 0; width: 100%; }

    /* Одна колонка уводит карточку входа под весь контент — до формы пришлось
       бы мотать страницу. Поднимаем её сразу под герой, выше панели контента.
       Порядок задаётся order, поэтому левая колонка раскрывается
       (display:contents): герой и панели контента становятся строками той же
       сетки, что и .login. Условие :has(.site__hero) держит перестановку на
       главной — на текстовых страницах (правила, история, регистрация) героя
       нет, и карточка входа не должна выпрыгивать перед их содержимым.
       Нижний отступ героя снимаем: вертикаль между строками даёт gap сетки. */
    .site__grid:has(.site__hero) .site__content { display: contents; }
    .site__grid:has(.site__hero) .site__hero { order: 1; padding-bottom: 0; }
    .site__grid:has(.site__hero) .login { order: 2; }
    .site__grid:has(.site__hero) .site__content > :not(.site__hero) { order: 3; }
    .prose img { max-width: 50%; }
}
@media (max-width: 560px) and (max-device-width: 560px) {
    .site__bar { justify-content: center; text-align: center; }
    .site__lang { margin-left: auto; }
    .prose .img-right, .prose .img-left { float: none; display: block; margin: 0 0 12px; max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .btn, .login__input { transition: none; }
}

/* Per-universe preset: shell backgrounds and chrome; semantic colours stay fixed. */
/* ---------------------------------------------------------------------------
   Строку выше не переименовывать: по ней Tests\Smoke\UniverseThemeCssTest
   отрезает блок пресетов от остального файла.

   Пресеты задают ТОЛЬКО набор --theme-*; правил здесь нет — компоненты выше
   читают эти переменные сами через var(--theme-x, <fallback>).
     --theme-surface*  — заливка панелей; прозрачность подобрана под стекло:
                         панель пропускает снимок, но держит контраст текста.
     --theme-plate*    — заливка CTA: тёмный оттенок того же тона, чтобы кнопка
                         читалась плашкой, а не подсветкой.
   --------------------------------------------------------------------------- */
body.public.theme-blue {
    --theme-accent: #72a8d4; --theme-link: #8eb8dc; --theme-border: rgba(103,151,190,.34);
    --theme-page-top: rgba(12,32,55,.88); --theme-page-bottom: rgba(4,9,16,.97);
    --theme-surface: rgba(10,26,45,.86); --theme-surface-soft: rgba(25,50,76,.70);
    --theme-surface-strong: rgba(35,69,103,.82); --theme-glow: rgba(72,130,184,.16);
    --theme-plate: rgba(6,17,33,.92); --theme-plate-hover: rgba(14,35,63,.94);
}
body.public.theme-amber {
    --theme-accent: #c9a86d; --theme-link: #d4b985; --theme-border: rgba(181,148,94,.34);
    --theme-page-top: rgba(49,39,27,.9); --theme-page-bottom: rgba(13,11,8,.98);
    --theme-surface: rgba(31,27,21,.87); --theme-surface-soft: rgba(54,45,33,.74);
    --theme-surface-strong: rgba(73,59,40,.82); --theme-glow: rgba(196,154,92,.14);
    --theme-plate: rgba(23,18,11,.92); --theme-plate-hover: rgba(46,36,22,.94);
}
body.public.theme-emerald {
    --theme-accent: #72b29c; --theme-link: #8bc3b0; --theme-border: rgba(102,164,143,.34);
    --theme-page-top: rgba(19,47,42,.9); --theme-page-bottom: rgba(7,13,12,.98);
    --theme-surface: rgba(18,31,29,.87); --theme-surface-soft: rgba(31,54,49,.74);
    --theme-surface-strong: rgba(40,71,63,.82); --theme-glow: rgba(78,162,135,.14);
    --theme-plate: rgba(10,22,20,.92); --theme-plate-hover: rgba(21,44,39,.94);
}
body.public.theme-crimson {
    --theme-accent: #c0838d; --theme-link: #ce9ba3; --theme-border: rgba(174,111,122,.34);
    --theme-page-top: rgba(50,29,35,.9); --theme-page-bottom: rgba(14,8,10,.98);
    --theme-surface: rgba(31,22,25,.87); --theme-surface-soft: rgba(55,38,43,.74);
    --theme-surface-strong: rgba(75,48,56,.82); --theme-glow: rgba(177,91,106,.14);
    --theme-plate: rgba(22,14,17,.92); --theme-plate-hover: rgba(45,29,34,.94);
}