:root:root .g-btn {
    border-radius: 0;
    font-family: var(--font-heading);
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .06em;
    color: #d8cfb6;
    background: var(--l2-metal);
    text-shadow: 0 .0625rem 0 #000;
    transition: color .15s ease, background .15s ease, box-shadow .15s ease;
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .13),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--l2-steel),
        0 0 0 .1875rem #000,
        0 .25rem .5rem rgba(0, 0, 0, .45);
}

:root:root .g-btn::before {
    background: linear-gradient(90deg, transparent, rgba(255, 238, 190, .22), transparent);
}

:root:root .g-btn:hover {
    color: #fff3cf;
    transform: none;
    background: var(--l2-metal-hi);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .2),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--gold-dark),
        0 0 0 .1875rem #000,
        0 .25rem .75rem rgba(0, 0, 0, .55);
}

:root:root .g-btn:active {
    transform: translateY(.0625rem);
    background: linear-gradient(180deg, #0e1115 0%, #181c22 100%);
    box-shadow:
        inset 0 .125rem .375rem rgba(0, 0, 0, .85),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--l2-steel),
        0 0 0 .1875rem #000;
}

:root:root .g-btn svg {
    opacity: .85;
}

:root:root .g-btn--primary,
:root:root .g-btn--action {
    color: #1b1205;
    text-shadow: 0 .0625rem 0 rgba(255, 236, 170, .55);
    background: linear-gradient(180deg, #f1d88a 0%, #c9a24a 46%, #8a6a28 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .55),
        inset 0 -.0625rem 0 rgba(60, 38, 4, .75),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b5220,
        0 0 0 .1875rem #000,
        0 .25rem .75rem rgba(0, 0, 0, .55);
}

:root:root .g-btn--primary:hover,
:root:root .g-btn--action:hover {
    color: #000;
    background: linear-gradient(180deg, #ffe9a8 0%, #dcb85f 46%, #a07c30 100%);
    transform: none;
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .7),
        inset 0 -.0625rem 0 rgba(60, 38, 4, .75),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--gold),
        0 0 0 .1875rem #000,
        0 0 1rem rgba(201, 162, 74, .35);
}

:root:root .g-btn--primary:active,
:root:root .g-btn--action:active {
    background: linear-gradient(180deg, #8a6a28 0%, #b8923a 100%);
    box-shadow:
        inset 0 .125rem .375rem rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b5220,
        0 0 0 .1875rem #000;
}

:root:root .g-btn--danger {
    color: #ffe2dd;
    background: linear-gradient(180deg, #c8463c 0%, #8c2a24 50%, #5a1612 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .25),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b1d18,
        0 0 0 .1875rem #000;
}

:root:root .g-btn--danger:hover {
    background: linear-gradient(180deg, #e0584c 0%, #a3322b 50%, #6b1a15 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .3),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--danger-hover),
        0 0 0 .1875rem #000;
}

:root:root .g-btn--icon {
    border-radius: 0;
}

:root:root .g-btn--sm {
    border-radius: 0;
    font-size: .8125rem;
}

:root:root .g-btn__badge {
    border-radius: 0;
    border: .0625rem solid #000;
    background: var(--red);
    color: #fff;
    font-family: var(--font-mono);
    animation: none;
}

:root:root .g-btn__count {
    border-radius: 0;
    background: rgba(0, 0, 0, .45);
    color: var(--gold-soft);
    font-family: var(--font-mono);
}

:root:root .g-btn[disabled] {
    opacity: .5 !important;
    filter: grayscale(.6);
}

:root:root .g-input,
:root:root .g-textarea,
:root:root .c-field__input,
:root:root .c-reg-field__input,
:root:root .c-captcha__input,
:root:root .c-select__trigger,
:root:root .c-field__select,
:root:root input[type="text"],
:root:root input[type="search"],
:root:root input[type="email"],
:root:root input[type="password"],
:root:root input[type="number"],
:root:root input[type="url"],
:root:root textarea {
    border: 0;
    border-radius: 0;
    color: #e6dcc4;
    font-family: var(--font-body);
    background: linear-gradient(180deg, #05060a 0%, #0b0d12 100%);
    box-shadow:
        inset 0 .125rem .25rem rgba(0, 0, 0, .8),
        inset 0 0 0 .0625rem #000,
        0 0 0 .0625rem #2b313c,
        0 .0625rem 0 .0625rem rgba(255, 255, 255, .05);
    transition: box-shadow .15s ease, background .15s ease;
}

:root:root .g-input:hover,
:root:root .g-textarea:hover,
:root:root .c-field__input:hover,
:root:root .c-reg-field__input:hover,
:root:root .c-select__trigger:hover {
    border-color: transparent;
    box-shadow:
        inset 0 .125rem .25rem rgba(0, 0, 0, .8),
        inset 0 0 0 .0625rem #000,
        0 0 0 .0625rem #566073;
}

:root:root .g-input:focus,
:root:root .g-textarea:focus,
:root:root .c-field__input:focus,
:root:root .c-reg-field__input:focus,
:root:root .c-captcha__input:focus,
:root:root .c-select.is-open .c-select__trigger {
    outline: none;
    border-color: transparent;
    background: linear-gradient(180deg, #05060a 0%, #0d1015 100%);
    box-shadow:
        inset 0 .125rem .25rem rgba(0, 0, 0, .8),
        inset 0 0 0 .0625rem #000,
        0 0 0 .0625rem var(--gold),
        0 0 .75rem rgba(201, 162, 74, .28);
}

:root:root .g-input::placeholder,
:root:root .g-textarea::placeholder,
:root:root .c-field__input::placeholder,
:root:root .c-reg-field__input::placeholder {
    color: #5b5748;
    font-style: italic;
}

:root:root .c-field__label,
:root:root .g-label,
:root:root .c-reg-field__label {
    color: var(--stone-600);
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: .1em;
}

:root:root .c-field__label svg {
    color: var(--gold-dark);
}

:root:root .c-field.has-error .c-field__input,
:root:root .c-reg-field.has-error .c-reg-field__input,
:root:root .c-select.has-error .c-select__trigger {
    box-shadow:
        inset 0 .125rem .25rem rgba(0, 0, 0, .8),
        inset 0 0 0 .0625rem #000,
        0 0 0 .0625rem var(--red);
}

:root:root .c-field__msg--error {
    color: var(--danger-text);
}

:root:root .c-field__msg--success {
    color: var(--success-bright);
}

:root:root .c-select__dropdown {
    border: 0;
    border-radius: 0;
    background: linear-gradient(180deg, #151a21, #0b0e12);
    box-shadow: var(--shadow-dropdown);
}

:root:root .c-select__option {
    border-radius: 0;
    color: var(--stone-700);
    font-family: var(--font-body);
}

:root:root .c-select__option:hover,
:root:root .c-select__option.is-selected,
:root:root .c-select__option.is-active {
    color: #f3e4b8;
    background: linear-gradient(90deg, rgba(201, 162, 74, .2), rgba(201, 162, 74, .04));
    box-shadow: inset .1875rem 0 0 var(--gold);
}

:root:root .c-select__arrow,
:root:root .c-field__select-arrow {
    color: var(--gold-dark);
}

:root:root .g-switch-track {
    border-radius: 0;
    background: linear-gradient(180deg, #05060a, #0d1015);
    box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .85), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--l2-steel);
}

:root:root .g-switch input:checked ~ .g-switch-track {
    background: linear-gradient(180deg, #7a5f1f, #c9a24a);
    box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .55), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--gold-dark);
}

:root:root .g-switch-thumb {
    border-radius: 0;
    background: var(--l2-metal-hi);
    box-shadow: inset 0 .0625rem 0 rgba(255, 255, 255, .25), 0 0 0 .0625rem #000;
}

:root:root .g-switch-name {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--stone-800);
}

:root:root .g-switch-row {
    border-radius: 0;
}

:root:root .g-switch-row:hover {
    background: rgba(201, 162, 74, .06);
}

:root:root .g-check-box {
    border-radius: 0;
    background: linear-gradient(180deg, #05060a, #0d1015);
    box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .85), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--l2-steel);
}

:root:root .g-check-opt input:checked ~ .g-check-box {
    background: linear-gradient(180deg, #c9a24a, #7a5f1f);
    box-shadow: inset 0 .0625rem 0 rgba(255, 255, 255, .4), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--gold-dark);
}

:root:root .g-check-box svg {
    color: #1b1205;
}

:root:root .g-check-name {
    font-family: var(--font-heading);
    font-weight: 700;
}

:root:root .c-filter-tabs {
    gap: .25rem;
}

:root:root .c-filter-tab {
    border-radius: 0;
    border: 0;
    color: var(--stone-600);
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: .06em;
    background: var(--l2-metal);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .1),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #232933;
}

:root:root .c-filter-tab:hover {
    color: #f3e4b8;
    background: var(--l2-metal-hi);
}

:root:root .c-filter-tab.is-active {
    color: #1b1205;
    text-shadow: 0 .0625rem 0 rgba(255, 236, 170, .5);
    background: linear-gradient(180deg, #f1d88a 0%, #c9a24a 50%, #8a6a28 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .5),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b5220;
}

:root:root .c-filter-bar__stat {
    color: var(--stone-600);
    font-family: var(--font-heading);
}

:root:root .np-filter-btn {
    border-radius: 0;
    font-family: var(--font-heading);
    font-weight: 700;
}

:root:root .np-filter-btn__badge,
:root:root .np-item__unread-badge {
    border-radius: 0;
    font-family: var(--font-mono);
}

:root:root .np-item {
    border-radius: 0;
}

:root:root .np-item:hover {
    background: linear-gradient(90deg, rgba(201, 162, 74, .1), transparent);
    box-shadow: inset .1875rem 0 0 var(--gold);
}

:root:root .np-item__title {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #ecd28b;
}

:root:root .np-tag {
    border-radius: 0;
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: .06em;
}

:root:root .c-pagination__btn {
    border: 0;
    border-radius: 0;
    color: var(--stone-700);
    font-family: var(--font-mono);
    font-weight: 700;
    background: var(--l2-metal);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .1),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #232933;
}

:root:root .c-pagination__btn:hover {
    color: #f3e4b8;
    background: var(--l2-metal-hi);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .16),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--gold-dark);
}

:root:root .c-pagination__btn.is-active,
:root:root .c-pagination__btn[aria-current="page"] {
    color: #1b1205;
    background: linear-gradient(180deg, #f1d88a, #c9a24a 50%, #8a6a28);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .5),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b5220;
}

:root:root .c-pagination__dots {
    color: var(--stone-500);
}

:root:root .hb-btn {
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

:root:root .hb-btn--ember {
    border: 0;
    animation: none;
    color: #1b1205;
    text-shadow: 0 .0625rem 0 rgba(255, 236, 170, .55);
    background: linear-gradient(180deg, #f1d88a 0%, #c9a24a 46%, #8a6a28 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .55),
        inset 0 -.0625rem 0 rgba(60, 38, 4, .75),
        0 0 0 .0625rem #000,
        0 0 0 .125rem #6b5220,
        0 0 0 .1875rem #000,
        0 .25rem .75rem rgba(0, 0, 0, .55);
}

:root:root .hb-btn--ember:hover {
    color: #000;
    background: linear-gradient(180deg, #ffe9a8 0%, #dcb85f 46%, #a07c30 100%);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .7),
        inset 0 -.0625rem 0 rgba(60, 38, 4, .75),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--gold),
        0 0 0 .1875rem #000,
        0 0 1rem rgba(201, 162, 74, .35);
}

:root:root .hb-btn--steel {
    border: 0;
    animation: none;
    color: #d8cfb6;
    text-shadow: 0 .0625rem 0 #000;
    background: var(--l2-metal);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .13),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--l2-steel),
        0 0 0 .1875rem #000,
        0 .25rem .5rem rgba(0, 0, 0, .45);
}

:root:root .hb-btn--steel:hover {
    color: #fff3cf;
    background: var(--l2-metal-hi);
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .2),
        inset 0 -.0625rem 0 rgba(0, 0, 0, .6),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--gold-dark),
        0 0 0 .1875rem #000,
        0 .25rem .75rem rgba(0, 0, 0, .55);
}

:root:root .c-headbar {
    background: linear-gradient(180deg, #151a21, #080a0d);
    box-shadow: inset 0 -.0625rem 0 #000, 0 .0625rem 0 rgba(201, 162, 74, .38);
}

:root:root .c-headbar .c-locale__btn,
:root:root .c-headbar .c-notif__btn,
:root:root .c-headbar .c-user {
    border: 0;
    background: var(--l2-metal);
    box-shadow: inset 0 .0625rem 0 rgba(255, 255, 255, .1), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--l2-steel);
}

:root:root .c-headbar .c-locale__btn:hover,
:root:root .c-headbar .c-notif__btn:hover,
:root:root .c-headbar .c-user:hover {
    background: var(--l2-metal-hi);
    box-shadow: inset 0 .0625rem 0 rgba(255, 255, 255, .16), 0 0 0 .0625rem #000, 0 0 0 .125rem var(--gold-dark);
}

:root:root .c-headbar .c-nb-srv__online {
    border: 0;
    background: #05060a;
    color: var(--stone-600);
    box-shadow: inset 0 0 0 .0625rem #000, 0 0 0 .0625rem var(--l2-steel);
}

:root:root .c-headbar .c-nb-srv__online b {
    color: var(--gold-soft);
    font-family: var(--font-mono);
}