:root {
    --bg: #f5f9ff;
    --card: #ffffff;
    --line: #d8e4f2;
    --text: #102033;
    --muted: #66758a;

    --blue: #005bbb;
    --blue-dark: #003f84;
    --yellow: #ffd500;
    --yellow-soft: #fff4b8;

    --vip: #ffcc00;
    --cyan: #00a6e7;
    --green: #10b981;

    --radius: 10px;

    --shadow: 0 10px 28px rgba(16, 32, 51, .07);
}

* {
    box-sizing: border-box;
}


body {
    margin: 0;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #f8fbff;
    color: var(--text);
    padding-top: 72px;
}

a {
    text-decoration: none;
    color: inherit;
}

/* === Default text links START === */
a.link,
.link {
    color: var(--blue);
    text-decoration: none;
}

a.link:hover,
.link:hover {
    text-decoration: underline;
}

/* === Default text links END === */

.container {
    width: min(1220px, calc(100% - 24px));
    margin: auto;
}

/* HEADER */

.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1050;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(216, 228, 242, .9);
}

.header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background:
        linear-gradient(90deg,
            var(--blue) 0 50%,
            var(--yellow) 50% 100%);
}

.header-inner {
    height: 72px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.logo-image {
    width: 42px;
    height: 42px;
    object-fit: contain;
    display: block;
}

.logo-text strong {
    display: block;
    font-size: 20px;
    line-height: 1;
    letter-spacing: -.04em;
}

.logo-text span {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .08em;
}

.menu {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
}

.menu a {
    height: 38px;
    padding: 0 14px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    font-size: 13px;
    font-weight: 850;
    color: #36506b;
    transition: .18s;
}

.menu a:hover {
    background: #edf5ff;
    color: var(--blue);
}

.menu a.active {
    background: var(--blue);
    color: #fff;
    box-shadow: 0 8px 18px rgba(0, 91, 187, .18);
}

.actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* === Header language dropdown START === */
.lang {
    position: relative;
}

.btn.header-lang-btn {
    gap: 7px;
    padding: 0 10px 0 14px;
    color: var(--blue);
}

.header-user-btn .header-lang-icon {
    margin-left: 0;
    font-size: 13px;
    color: var(--blue);
    transform: none !important;
}

.header-user-btn .header-lang-arrow {
    margin-left: 0;
    color: var(--blue);
}

/* === Current language flag START === */
.header-lang-current-flag {
    width: 18px;
    height: 18px;
    object-fit: contain;
    display: block;
    flex: 0 0 auto;
}

/* === Current language flag END === */

.header-lang-menu.is-open .header-lang-arrow {
    transform: rotate(180deg);
}

.header-user-dropdown.header-lang-dropdown {
    min-width: 150px;
}

.header-lang-flag {
    width: 18px;
    height: 18px;
    object-fit: contain;
    display: block;
    flex: 0 0 auto;
}

/* === Header language dropdown END === */

.btn {
    height: 38px;
    padding: 0 14px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 900;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--blue);
    transition: .18s;
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
    background: #edf5ff;
    border-color: #c7dbf3;
    color: var(--blue);
}

/* === Static button look START === */
.btn-static {
    cursor: default;
    user-select: none;
}

.btn-static:hover {
    cursor: default;
}

/* === Static button look END === */

.btn-primary {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.btn-primary:hover {
    background: var(--blue-dark);
    border-color: var(--blue-dark);
    color: #fff;
}

/* === Header user dropdown START === */

.header-user-menu {
    position: relative;
}

.header-user-btn {
    width: auto;
    padding: 0 14px;
}

.header-user-btn i {
    margin-left: 8px;
    font-size: 11px;
    transition: .18s ease;
}

.header-user-menu.is-open .header-user-btn .fa-chevron-down {
    transform: rotate(180deg);
}

.header-user-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    padding: 6px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(216, 228, 242, .85);
    box-shadow: 0 16px 34px rgba(16, 32, 51, .14);
    display: none;
    z-index: 200;
}

.header-user-menu.is-open .header-user-dropdown {
    display: block;
}

.header-user-dropdown a {
    height: 38px;
    padding: 0 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 850;
    color: #36506b;
    transition: .18s ease;
}

.header-user-dropdown a:hover {
    background: #edf5ff;
    color: var(--blue);
    padding-left: 14px;
}

.header-user-dropdown a.header-user-logout {
    color: #dc3545;
}

.header-user-dropdown a.header-user-logout:hover {
    background: rgba(220, 53, 69, .08);
    color: #bb2d3b;
}

/* === Header user dropdown END === */

/* === Mobile user dropdown START === */
.mobile-user-btn {
    height: 36px;
    padding: 0 10px;
    gap: 7px;
    box-shadow: 0 8px 18px rgba(16, 32, 51, .07);
}

.mobile-user-btn .fa-chevron-down {
    font-size: 10px;
    transition: .18s ease;
}

.mobile-user-menu.is-open .mobile-user-btn .fa-chevron-down {
    transform: rotate(180deg);
}

/* === Mobile user dropdown END === */

/* === Mobile header menu START === */
.header-row {
    width: 100%;
    height: 72px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.mobile-header-actions,
.mobile-menu {
    display: none;
}

.mobile-header-actions {
    margin-left: auto;
    align-items: center;
    gap: 7px;
}

.mobile-icon-btn {
    width: 36px;
    height: 36px;
    box-shadow: 0 8px 18px rgba(16, 32, 51, .07);
}

.mobile-burger {
    width: 40px;
    height: 36px;
    padding: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    box-shadow: 0 8px 18px rgba(16, 32, 51, .07);
}

.mobile-burger span {
    width: 18px;
    height: 2px;
    border-radius: 999px;
    background: var(--blue);
    display: block;
    transition: .2s ease;
}

.header.mobile-open .mobile-burger span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.header.mobile-open .mobile-burger span:nth-child(2) {
    opacity: 0;
}

.header.mobile-open .mobile-burger span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.mobile-menu {
    width: 100%;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    padding: 0;
    transition: max-height .24s ease, opacity .18s ease, padding .24s ease;
}

.header.mobile-open .mobile-menu {
    max-height: 420px;
    opacity: 1;
    padding: 0 0 12px;
}

.mobile-menu a {
    min-height: 40px;
    padding: 0 12px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
    font-weight: 900;
    color: #36506b;
    background: #f7fbff;
    border: 1px solid rgba(216, 228, 242, .9);
    margin-bottom: 7px;
}

.mobile-menu a.active {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.mobile-add-domain {
    justify-content: center;
    background: var(--blue) !important;
    border-color: var(--blue) !important;
    color: #fff !important;
}

.mobile-lang {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    padding-top: 1px;
}

.mobile-lang a {
    justify-content: center;
    min-height: 36px;
    margin-bottom: 0;
    background: #fff;
}

.mobile-lang a.active {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

/* === Mobile header menu END === */

/* HERO */

.hero {
    padding: 18px 0 14px;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 14px;
}

.hero-main {
    padding: 28px;
    border-radius: 18px;
    background:
        radial-gradient(circle at 88% 0%, rgba(255, 213, 0, .28) 0%, rgba(255, 213, 0, 0) 45%),
        linear-gradient(135deg, #ffffff 0%, #bfe0ff 20%, #8dc5ff 100%);
    border: 1px solid #7bb8f1;
    box-shadow:
        0 24px 56px rgba(0, 91, 187, .20),
        0 0 0 1px rgba(0, 91, 187, .08);
    position: relative;
    overflow: hidden;
}

.hero-main::before {
    content: "";
    position: absolute;
    right: -120px;
    top: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background:
        linear-gradient(135deg, rgba(0, 91, 187, .16), rgba(255, 213, 0, .10));
}

.hero h1 {
    margin: 4px 0 0;
    font-size: clamp(38px, 5vw, 62px);
    line-height: .92;
    letter-spacing: -.07em;
    max-width: 760px;
    position: relative;
    z-index: 2;
    font-weight: 700;

    color: #004f9f;

    text-shadow:
        0 1px 0 rgba(255, 255, 255, .75),
        0 4px 10px rgba(0, 91, 187, .14);
}

.hero p {
    margin: 20px 0 0;
    max-width: 620px;
    font-size: 17px;
    line-height: 1.75;
    color: #000000;
    font-weight: 600;
    position: relative;
    z-index: 2;

    text-shadow:
        0 1px 0 rgba(255, 255, 255, .8);
}

.search {
    margin-top: 22px;
    padding: 8px;
    display: grid;
    grid-template-columns: 1fr 120px;
    gap: 8px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 10px 24px rgba(16, 32, 51, .06);
    position: relative;
    z-index: 2;
}

.search input {
    height: 46px;
    border: 0;
    outline: none;
    padding: 0 12px;
    font-size: 16px;
    background: transparent;
    color: var(--text);
}

.search button {
    border: 0;
    border-radius: 10px;
    background: var(--blue);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

.tags {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    position: relative;
    z-index: 2;
}

.tags a {
    height: 30px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    border-radius: 999px;

    background: rgba(255, 255, 255, .55);

    border: 1px solid rgba(0, 91, 187, .18);

    color: var(--blue);

    font-size: 12px;
    font-weight: 850;

    backdrop-filter: blur(6px);

    box-shadow:
        0 2px 8px rgba(0, 91, 187, .05);

    transition: .18s ease;
}

.tags a:hover {
    background: rgba(255, 255, 255, .85);

    border-color: rgba(0, 91, 187, .30);

    transform: translateY(-1px);
}

/* SIDE */

.hero-side {
    display: grid;
    gap: 14px;
}

.side-card {
    padding: 20px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.side-card.vip {
    background:
        linear-gradient(135deg,
            rgba(103, 58, 183, .22) 0%,
            rgba(183, 148, 244, .12) 38%,
            #ffffff 100%);
    border-color: rgba(103, 58, 183, .28);
}

.side-card.random {
    background:
        linear-gradient(135deg,
            rgba(0, 166, 231, .12),
            #ffffff 55%);
    border-color: #b9e9ff;
}

.side-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #673ab7;
}

.side-card strong {
    display: block;
    margin-top: 14px;
    font-size: 42px;
    line-height: 1;
    letter-spacing: -.06em;
    color: #1d1b31;
}

.side-card p {
    margin: 10px 0 0;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 650;
}

/* === Domain of day card styles START === */
.domain-day-card {
    min-height: 214px;
    padding: 20px;
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 14px;
    position: relative;
    overflow: hidden;
    border-color: rgba(0, 91, 187, .24);
    background:
        radial-gradient(circle at 14% 12%, rgba(255, 213, 0, .24), transparent 34%),
        radial-gradient(circle at 92% 18%, rgba(0, 91, 187, .16), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f4f9ff 48%, #e9f4ff 100%);
    transition: .18s ease;
}

.domain-day-card::after {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    top: 0;
    height: 4px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, var(--blue), #8dc5ff, var(--yellow));
    pointer-events: none;
}

.domain-day-card:hover {
    transform: translateY(-2px);
    box-shadow:
        0 18px 38px rgba(16, 32, 51, .12),
        inset 0 1px 0 rgba(255, 255, 255, .88);
}

.domain-day-bg {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -46%);
    max-width: 94%;
    font-size: clamp(46px, 8vw, 92px);
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.08em;
    color: rgba(0, 91, 187, .045);
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    z-index: 1;
}

.domain-day-card .side-top,
.domain-day-center,
.domain-day-bottom {
    position: relative;
    z-index: 2;
}

.domain-day-card .side-top {
    color: var(--blue);
}

.domain-day-card .side-top span:first-child {
    position: relative;
    display: inline-flex;
    padding-bottom: 7px;
}

.domain-day-card .side-top span:first-child::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 16px;
    height: 4px;
    border-radius: 999px;
    background: var(--blue);
    border: 1px solid rgba(255, 255, 255, .95);
    box-shadow: 0 1px 3px rgba(16, 32, 51, .12);
}

.domain-day-card .side-top span:first-child::before {
    content: "";
    position: absolute;
    left: 20px;
    bottom: 0;
    width: 16px;
    height: 4px;
    border-radius: 999px;
    background: var(--yellow);
    border: 1px solid rgba(255, 255, 255, .95);
    box-shadow: 0 1px 3px rgba(16, 32, 51, .12);
}

.domain-day-center {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.domain-day-center strong {
    padding: 2px 2px 20px;
    max-width: 100%;
    margin-top: 0;
    display: block;
    text-align: center;
    line-height: 1.12;
    font-weight: 950;
    letter-spacing: 0.003em;
    color: #102033;
    overflow: visible;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

/* === Domain of day title sizes START === */
.domain-day-center strong.domain-day-title-xl {
    font-size: clamp(24px, 3.6vw, 38px);
}

.domain-day-center strong.domain-day-title-lg {
    font-size: clamp(22px, 3vw, 32px);
}

.domain-day-center strong.domain-day-title-md {
    font-size: clamp(20px, 2.5vw, 27px);
}

.domain-day-center strong.domain-day-title-sm {
    font-size: clamp(18px, 2.1vw, 23px);
}
/* === Domain of day title sizes END === */

.domain-day-subline {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 7px;
}

.domain-day-subline span {
    min-height: 26px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(216, 228, 242, .92);
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    line-height: 1;
    font-weight: 950;
    color: #36506b;
    box-shadow: 0 8px 18px rgba(16, 32, 51, .045);
}

.domain-day-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.domain-day-stats {
    display: flex;
    align-items: center;
    gap: 8px;
}

.domain-day-stats span {
    min-height: 32px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(216, 228, 242, .88);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    line-height: 1;
    font-weight: 950;
    color: #102033;
}

.domain-day-stats i {
    color: var(--blue);
    font-size: 13px;
}

.domain-day-open {
    min-height: 38px;
    padding: 0 14px;
    border-radius: 12px;
    background: linear-gradient(135deg, #2d8cff 0%, var(--blue) 58%, var(--blue-dark) 100%);
    border: 1px solid rgba(0, 63, 132, .18);
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    line-height: 1;
    font-weight: 950;
    white-space: nowrap;
    box-shadow:
        0 12px 24px rgba(0, 91, 187, .22),
        inset 0 1px 0 rgba(255, 255, 255, .22);
    transition: .18s ease;
}

.domain-day-card:hover .domain-day-open {
    transform: translateX(2px);
    box-shadow:
        0 16px 30px rgba(0, 91, 187, .28),
        inset 0 1px 0 rgba(255, 255, 255, .28);
}

.domain-day-open i {
    font-size: 12px;
}

/* === Domain of day card styles END === */

/* === Hero info stats START === */
.stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.stat {
    min-height: 92px;
    padding: 16px;
    border-radius: 12px;
    background: #ffffff;
    border: 1px solid rgba(216, 228, 242, .95);
    box-shadow: 0 10px 22px rgba(16, 32, 51, .06);
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.stat-number {
    position: absolute;
    left: 10px;
    top: 6px;
    font-size: 38px;
    line-height: 1;
    font-weight: 950;
    color: rgba(0, 91, 187, .08);
    pointer-events: none;
    user-select: none;
}

.stat strong {
    grid-area: title;
    display: block;
    margin: 0;
    font-size: 18px;
    line-height: 1.05;
    letter-spacing: -.045em;
    color: var(--blue);
}

.stat span {
    grid-area: text;
    display: block;
    margin-top: 5px;
    font-size: 11px;
    font-weight: 800;
    color: var(--muted);
    line-height: 1.25;
}

/* === Hero info stats END === */

/* === Hero stats cards END === */

/* SECTION */

.section {
    padding: 12px 0;
}

.panel {
    padding: 16px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 14px;
    margin-bottom: 12px;
}

.panel-head h2 {
    margin: 0;
    font-size: 28px;
    letter-spacing: -.04em;
}

.panel-head p {
    margin: 5px 0 0;
    font-size: 13px;
    font-weight: 650;
    color: var(--muted);
}

/* FILTERS */

.filters {
    display: grid;
    grid-template-columns: 1fr 150px 150px 150px auto;
    gap: 8px;
}

.field {
    height: 42px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 12px;
    outline: none;
    font-size: 16px;
    font-weight: 400;
    color: var(--text);
}

.field::placeholder {
    font-weight: 400;
    color: var(--muted);
}

.field:focus {
    border-color: rgba(0, 91, 187, .35);
    box-shadow: 0 0 0 4px rgba(0, 91, 187, .08);
}

/* === Domain cards styles START === */

.domain-list {
    display: grid;
    gap: 12px;
}

.domain-card-link {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.domain {
    min-height: 84px;
    display: grid;
    grid-template-columns: .80fr 1.20fr .55fr .45fr auto;
    gap: 12px;
    align-items: center;
    padding: 16px 16px 16px 18px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--line);
    position: relative;
    overflow: hidden;
    transition: .18s ease;
    box-shadow:
        0 12px 28px rgba(16, 32, 51, .055),
        inset 0 1px 0 rgba(255, 255, 255, .82);
}

.domain::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    border-radius: 0 999px 999px 0;
    transition: .18s ease;
    z-index: 2;
}

.domain::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -90px;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    opacity: .11;
    pointer-events: none;
    transition: .18s ease;
    z-index: 1;
}

.domain:hover {
    transform: translateY(-3px);
    box-shadow:
        0 22px 44px rgba(16, 32, 51, .12),
        inset 0 1px 0 rgba(255, 255, 255, .92);
}

.domain:hover::before {
    width: 10px;
}

.domain:hover::after {
    opacity: .17;
    transform: scale(1.08);
}

.domain.regular {
    background:
        radial-gradient(circle at 96% 8%, rgba(71, 85, 105, .20), transparent 34%),
        linear-gradient(90deg, rgba(148, 163, 184, .12), rgba(255, 255, 255, .98) 34%),
        #ffffff;
    border-color: rgba(148, 163, 184, .34);
}

.domain.regular::before {
    background: linear-gradient(180deg, #475569, #1e293b);
}

.domain.regular::after {
    background: #475569;
}

.domain.regular:hover {
    border-color: rgba(100, 116, 139, .52);
    background:
        radial-gradient(circle at 96% 8%, rgba(71, 85, 105, .26), transparent 34%),
        linear-gradient(90deg, rgba(148, 163, 184, .18), rgba(255, 255, 255, .98) 38%),
        #ffffff;
}

.domain.vip {
    background:
        radial-gradient(circle at 96% 8%, rgba(255, 213, 0, .34), transparent 34%),
        linear-gradient(90deg, rgba(255, 213, 0, .17), rgba(255, 255, 255, .98) 38%),
        #fff;
    border-color: rgba(255, 213, 0, .68);
    box-shadow:
        0 16px 34px rgba(255, 213, 0, .10),
        0 12px 28px rgba(16, 32, 51, .055),
        inset 0 1px 0 rgba(255, 255, 255, .88);
}

.domain.vip::before {
    background: linear-gradient(180deg, #ffd500, #e6b800);
}

.domain.vip::after {
    background: #ffd500;
}

.domain.vip:hover {
    border-color: rgba(255, 213, 0, .86);
    box-shadow:
        0 24px 46px rgba(255, 213, 0, .18),
        0 18px 38px rgba(16, 32, 51, .10),
        inset 0 1px 0 rgba(255, 255, 255, .92);
}

.domain.premium {
    background:
        radial-gradient(circle at 96% 8%, rgba(0, 91, 187, .28), transparent 34%),
        linear-gradient(90deg, rgba(0, 91, 187, .12), rgba(255, 255, 255, .98) 38%),
        #fff;
    border-color: rgba(0, 91, 187, .34);
    box-shadow:
        0 16px 34px rgba(0, 91, 187, .08),
        0 12px 28px rgba(16, 32, 51, .055),
        inset 0 1px 0 rgba(255, 255, 255, .88);
}

.domain.premium::before {
    background: linear-gradient(180deg, #2d8cff, #005bbb);
}

.domain.premium::after {
    background: var(--blue);
}

.domain.premium:hover {
    border-color: rgba(0, 91, 187, .54);
    box-shadow:
        0 24px 46px rgba(0, 91, 187, .15),
        0 18px 38px rgba(16, 32, 51, .10),
        inset 0 1px 0 rgba(255, 255, 255, .92);
}

.domain-name,
.badges,
.meta,
.price,
.domain-actions {
    position: relative;
    z-index: 2;
    pointer-events: none;
}

.domain-name {
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.domain-name strong {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
    text-decoration: none;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 82%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, #000 82%, transparent 100%);
    font-size: 23px;
    letter-spacing: -.04em;
    color: var(--blue);
    background: linear-gradient(90deg, #123c96 0%, #005bbb 45%, #2b7fff 72%, #60a5fa 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.domain-name span {
    display: block;
    margin-top: 6px;
    font-size: 11px;
    font-weight: 900;
    color: #66758a;
}

.badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.domain .badges {
    gap: 7px;
}

.badge {
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
}

.domain .badge {
    min-height: 26px;
    padding: 0 10px;
    font-weight: 950;
    transition: transform .18s ease, box-shadow .18s ease;
}

.domain:hover .badge {
    transform: scale(1.04);
}

.badge-vip {
    background: linear-gradient(135deg, #fff4b8 0%, var(--yellow) 42%, #f0b900 100%);
    border: 1px solid rgba(160, 118, 0, .22);
    color: #5c4300;
    box-shadow: 0 5px 12px rgba(255, 213, 0, .24);
}

.badge-premium {
    background: linear-gradient(135deg, #2d8cff 0%, var(--blue) 52%, var(--blue-dark) 100%);
    border: 1px solid rgba(0, 63, 132, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(0, 91, 187, .20);
}

.badge-new {
    background: linear-gradient(135deg, #34d399 0%, var(--green) 55%, #059669 100%);
    border: 1px solid rgba(5, 150, 105, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(16, 185, 129, .18);
}

.badge-random {
    background: var(--cyan);
    color: #fff;
}

.badge-zone {
    background: linear-gradient(135deg, #f8fbff 0%, #d8eaff 52%, #bdd9ff 100%);
    border: 1px solid rgba(0, 91, 187, .18);
    color: #0b4f9c;
    box-shadow: 0 5px 12px rgba(0, 91, 187, .12);
}

.badge-category {
    background: linear-gradient(135deg, #5b7cff 0%, #4f6ef7 52%, #3f5ee8 100%);
    border: 1px solid rgba(63, 94, 232, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(79, 110, 247, .22);
}

/* === Dynamic domain category badge color START === */
.badge-category[style*="--category-color"] {
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--category-color) 82%, #ffffff 18%) 0%,
            var(--category-color) 52%,
            color-mix(in srgb, var(--category-color) 76%, #000000 24%) 100%);
    border: 1px solid color-mix(in srgb, var(--category-color) 72%, #ffffff 28%);
    color: #fff;
    box-shadow: 0 5px 12px color-mix(in srgb, var(--category-color) 28%, transparent);
}

/* === Dynamic domain category badge color END === */

.badge-score-80 {
    background: linear-gradient(135deg, #005bbb 0%, #0077ff 48%, #ffd500 100%);
    border: 1px solid rgba(0, 91, 187, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(0, 91, 187, .20);
}

.badge-score-70 {
    background: linear-gradient(135deg, #0077ff 0%, #00a6ff 48%, #19d3ff 100%);
    border: 1px solid rgba(0, 119, 255, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(0, 119, 255, .20);
}

.badge-score-60 {
    background: linear-gradient(135deg, #16a34a 0%, #22c55e 48%, #ffd500 100%);
    border: 1px solid rgba(22, 163, 74, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(22, 163, 74, .18);
}

.badge-score-50 {
    background: linear-gradient(135deg, #f97316 0%, #fb923c 48%, #ffd500 100%);
    border: 1px solid rgba(249, 115, 22, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(249, 115, 22, .18);
}

.badge-score-0 {
    background: linear-gradient(135deg, #64748b 0%, #475569 48%, #0f172a 100%);
    border: 1px solid rgba(71, 85, 105, .22);
    color: #fff;
    box-shadow: 0 5px 12px rgba(100, 116, 139, .18);
}

.meta {
    font-size: 11px;
    font-weight: 850;
    color: var(--muted);
}

/* === Normal black text START === */
.text-normal-black {
    font-weight: 400 !important;
    color: #000000 !important;
}

/* === Normal black text END === */

.domain .meta {
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(216, 228, 242, .86);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    font-size: 11px;
    font-weight: 950;
    color: #66758a;
    box-shadow: 0 8px 18px rgba(16, 32, 51, .045);
}

.price {
    font-size: 15px;
    font-weight: 950;
    text-align: right;
}

.domain .price {
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(216, 228, 242, .92);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    justify-self: end;
    color: #102033;
    font-size: 13px;
    font-weight: 950;
    box-shadow: 0 10px 20px rgba(16, 32, 51, .06);
    white-space: nowrap;
}

.domain.vip .price {
    background: rgba(255, 248, 199, .94);
    border-color: rgba(255, 213, 0, .54);
    color: #5c4200;
}

.domain.premium .price {
    background: rgba(231, 243, 255, .94);
    border-color: rgba(0, 91, 187, .28);
    color: #004f9f;
}

.domain.regular .price {
    background: rgba(248, 250, 252, .96);
    border-color: rgba(148, 163, 184, .32);
    color: #1e293b;
}

.domain-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(225, 29, 72, .14);
    background: rgba(225, 29, 72, .05);
    color: #e11d48;
    font-weight: 950;
}

.domain-like-btn {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    cursor: pointer;
    pointer-events: auto;
    background: rgba(255, 255, 255, .76);
    border-color: rgba(225, 29, 72, .18);
    box-shadow:
        0 10px 20px rgba(225, 29, 72, .06),
        inset 0 1px 0 rgba(255, 255, 255, .80);
    transition: .18s ease;
}

.domain-like-btn:hover {
    background: rgba(225, 29, 72, .08);
    border-color: rgba(225, 29, 72, .28);
    transform: translateY(-1px);
}

.domain-like-btn i {
    pointer-events: none;
    font-size: 15px;
}

.open {
    height: 34px;
    padding: 0 12px;
    border-radius: 10px;
    background: var(--blue);
    color: #fff;
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: 950;
}

.domain .open {
    height: 42px;
    padding: 0 18px;
    border-radius: 14px;
    background: linear-gradient(135deg, #2d8cff 0%, var(--blue) 58%, var(--blue-dark) 100%);
    color: #fff;
    font-size: 13px;
    font-weight: 950;
    box-shadow:
        0 12px 24px rgba(0, 91, 187, .22),
        inset 0 1px 0 rgba(255, 255, 255, .22);
    transition: .18s ease;
}

.domain:hover .open {
    transform: translateY(-1px);
    box-shadow:
        0 16px 30px rgba(0, 91, 187, .28),
        inset 0 1px 0 rgba(255, 255, 255, .28);
}

.domain.regular .open {
    background: linear-gradient(135deg, #2d8cff 0%, #005bbb 58%, #003f84 100%);
}

.domain.vip .open {
    background: linear-gradient(135deg, #ffd500 0%, #f0b900 56%, #c99700 100%);
    color: #4e3900;
    box-shadow:
        0 12px 24px rgba(255, 213, 0, .28),
        inset 0 1px 0 rgba(255, 255, 255, .35);
}

/* === Domain cards styles END === */

/* === Home domains header styles START === */
.home-domains-head {
    margin-bottom: 14px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.home-domains-head h2 {
    margin: 0;
    font-size: 32px;
    line-height: 1.05;
    letter-spacing: -.05em;
    color: var(--text);
}

.home-domains-head p {
    margin: 8px 0 0;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
    color: var(--muted);
}

.home-domains-head .btn {
    min-width: 158px;
    height: 42px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .86);
    border-color: rgba(0, 91, 187, .14);
    box-shadow:
        0 10px 22px rgba(16, 32, 51, .08),
        inset 0 1px 0 rgba(255, 255, 255, .82);
}

/* === Home domains header styles END === */

/* === VIP and random domain blocks START === */

.split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.panel-yellow {
    border-color: rgba(255, 213, 0, .48);
    background:
        linear-gradient(90deg, rgba(255, 213, 0, .20), rgba(255, 255, 255, .96) 42%),
        #fff;
}

.panel-cyan {
    border-color: rgba(0, 166, 231, .24);
    background:
        linear-gradient(90deg, rgba(0, 166, 231, .10), rgba(255, 255, 255, .96) 42%),
        #fff;
}

.btn-yellow {
    color: #5c4200;
    background: var(--yellow);
    border-color: #e9c600;
    box-shadow: 0 8px 20px rgba(255, 213, 0, .20);
}

.btn-yellow:hover {
    background: #e6c000;
    border-color: #d4b000;
    color: #4e3900;
}

.btn-danger {
    background: #dc3545;
    border-color: #dc3545;
    color: #fff;
}

.btn-danger:hover {
    background: #bb2d3b;
    border-color: #bb2d3b;
    color: #fff;
}

/* === Compact dropdown menu START === */
.dropdown-menu-compact {
    padding: 0;
}

.dropdown-menu-compact .dropdown-item {
    min-height: 28px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

/* === Compact dropdown menu END === */

.compact-list {
    display: grid;
    gap: 7px;
}

.compact-row {
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: center;
    transition: .18s ease;
}

.compact-row:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 20px rgba(16, 32, 51, .06);
}

.compact-row strong {
    display: block;
    font-size: 18px;
    letter-spacing: -.035em;
}

.compact-row span {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 800;
    color: var(--muted);
}

/* === Home VIP random domain styles START === */
.home-vip-random-split {
    gap: 14px;
}

.home-panel-yellow,
.home-panel-cyan {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border-radius: 20px;
    box-shadow:
        0 18px 42px rgba(16, 32, 51, .09),
        inset 0 1px 0 rgba(255, 255, 255, .82);
}

.home-panel-yellow::before,
.home-panel-cyan::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .85;
}

.home-panel-yellow::after,
.home-panel-cyan::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    top: 0;
    height: 4px;
    border-radius: 0 0 999px 999px;
    pointer-events: none;
}

.home-panel-yellow {
    border-color: rgba(255, 213, 0, .72);
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 213, 0, .46), transparent 34%),
        radial-gradient(circle at 92% 18%, rgba(255, 196, 0, .20), transparent 32%),
        linear-gradient(135deg, #fff8c7 0%, #ffffff 42%, #fffdf2 100%);
}

.home-panel-yellow::before {
    background:
        linear-gradient(90deg, rgba(255, 213, 0, .18) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 213, 0, .13) 1px, transparent 1px);
    background-size: 28px 28px;
}

.home-panel-yellow::after {
    background: linear-gradient(90deg, #ffd500, #fff4b8, #e6b800);
}

.home-panel-cyan {
    border-color: rgba(0, 166, 231, .42);
    background:
        radial-gradient(circle at 10% 14%, rgba(0, 166, 231, .28), transparent 34%),
        radial-gradient(circle at 92% 18%, rgba(0, 91, 187, .16), transparent 32%),
        linear-gradient(135deg, #dff8ff 0%, #ffffff 44%, #eef9ff 100%);
}

.home-panel-cyan::before {
    background:
        linear-gradient(90deg, rgba(0, 166, 231, .11) 1px, transparent 1px),
        linear-gradient(180deg, rgba(0, 91, 187, .08) 1px, transparent 1px);
    background-size: 28px 28px;
}

.home-panel-cyan::after {
    background: linear-gradient(90deg, #00a6e7, #8de7ff, #005bbb);
}

.home-panel-yellow .panel-head,
.home-panel-cyan .panel-head,
.home-panel-yellow .home-compact-list,
.home-panel-cyan .home-compact-list {
    position: relative;
    z-index: 2;
}

.home-panel-yellow .panel-head h2,
.home-panel-cyan .panel-head h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #102033;
    font-size: 20px;
    font-weight: 700;
}

.home-panel-title-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex: 0 0 auto;
}

.home-panel-yellow .home-panel-title-icon {
    background: linear-gradient(135deg, #fff4b8 0%, #ffd500 55%, #e6b800 100%);
    color: #5c4200;
    box-shadow: 0 10px 22px rgba(255, 213, 0, .28);
}

.home-panel-cyan .home-panel-title-icon {
    background: linear-gradient(135deg, #8de7ff 0%, #00a6e7 55%, #005bbb 100%);
    color: #fff;
    box-shadow: 0 10px 22px rgba(0, 166, 231, .22);
}

.home-btn-yellow {
    color: #5c4200;
    background: linear-gradient(135deg, #fff4b8 0%, var(--yellow) 48%, #e6b800 100%);
    border-color: rgba(160, 118, 0, .18);
    box-shadow:
        0 10px 24px rgba(255, 213, 0, .30),
        inset 0 1px 0 rgba(255, 255, 255, .58);
}

.home-btn-yellow:hover {
    background: linear-gradient(135deg, #ffe777 0%, #f0c900 56%, #d4a900 100%);
    border-color: rgba(160, 118, 0, .26);
    color: #4e3900;
}

.home-panel-cyan .home-random-refresh-btn {
    background: rgba(255, 255, 255, .84);
    border-color: rgba(0, 91, 187, .14);
    color: var(--blue);
    box-shadow:
        0 10px 22px rgba(0, 91, 187, .12),
        inset 0 1px 0 rgba(255, 255, 255, .72);
}

.home-panel-cyan .home-random-refresh-btn:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.home-compact-list {
    display: grid;
    gap: 10px;
}

.home-compact-row {
    position: relative;
    min-height: 76px;
    padding: 14px 14px 14px 18px;
    border: 1px solid rgba(216, 228, 242, .92);
    border-radius: 14px;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: center;
    transition: .18s ease;
    box-shadow:
        0 8px 20px rgba(16, 32, 51, .045),
        inset 0 1px 0 rgba(255, 255, 255, .70);
}

.home-compact-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    bottom: 12px;
    width: 4px;
    border-radius: 0 999px 999px 0;
}

.home-panel-yellow .home-compact-row::before {
    background: linear-gradient(180deg, #ffd500, #e6b800);
}

.home-panel-cyan .home-compact-row::before {
    background: linear-gradient(180deg, #00a6e7, #005bbb);
}

.home-compact-row:hover {
    transform: translateY(-2px);
    box-shadow:
        0 16px 30px rgba(16, 32, 51, .10),
        inset 0 1px 0 rgba(255, 255, 255, .85);
}

.home-panel-yellow .home-compact-row:hover {
    border-color: rgba(255, 213, 0, .72);
    background:
        linear-gradient(90deg, rgba(255, 213, 0, .16), rgba(255, 255, 255, .94) 34%),
        rgba(255, 255, 255, .92);
}

.home-panel-cyan .home-compact-row:hover {
    border-color: rgba(0, 166, 231, .42);
    background:
        linear-gradient(90deg, rgba(0, 166, 231, .12), rgba(255, 255, 255, .94) 34%),
        rgba(255, 255, 255, .92);
}

.home-compact-row strong {
    display: block;
    font-size: 20px;
    line-height: 1.15;
    letter-spacing: -.045em;
    color: #102033;
}

.home-compact-row span {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 800;
    color: var(--muted);
}

.home-compact-meta {
    margin-top: 7px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.home-compact-meta span {
    margin-top: 0;
    min-height: 21px;
    padding: 0 8px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    font-size: 10px;
    line-height: 1;
    font-weight: 950;
    color: inherit;
}

.home-compact-meta-vip {
    background: linear-gradient(135deg, #fff4b8 0%, #ffd500 60%, #e6b800 100%);
    border: 1px solid rgba(160, 118, 0, .18);
    color: #5c4200;
}

.home-compact-meta-premium {
    background: linear-gradient(135deg, #2d8cff 0%, #005bbb 58%, #003f84 100%);
    border: 1px solid rgba(0, 63, 132, .20);
    color: #ffffff !important;
}

.home-compact-meta-category {
    background: #edf5ff;
    border: 1px solid rgba(0, 91, 187, .12);
    color: #0b4f9c;
}

.home-compact-row .price {
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 950;
    white-space: nowrap;
    color: #102033;
    background: #fff;
    border: 1px solid rgba(216, 228, 242, .92);
    box-shadow: 0 8px 18px rgba(16, 32, 51, .06);
}

.home-panel-yellow .home-compact-row .price {
    background: rgba(255, 248, 199, .92);
    border-color: rgba(255, 213, 0, .46);
    color: #5c4200;
}

.home-panel-cyan .home-compact-row .price {
    background: rgba(223, 248, 255, .92);
    border-color: rgba(0, 166, 231, .22);
    color: #004f9f;
}

/* === Home VIP random domain styles END === */

/* === VIP and random domain blocks END === */

/* === Catalog categories cards styles START === */

.categories {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
}

.cat {
    min-height: 132px;
    padding: 18px 14px 15px;
    border-radius: 18px;
    position: relative;
    overflow: hidden;
    transition: .18s ease;
    box-shadow:
        0 14px 30px rgba(16, 32, 51, .075),
        inset 0 1px 0 rgba(255, 255, 255, .80);
}

.cat::before {
    content: "";
    position: absolute;
    right: -38px;
    top: -44px;
    width: 116px;
    height: 116px;
    border-radius: 50%;
    opacity: .34;
    transition: .18s ease;
}

.cat::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 4px;
    border-radius: 999px 999px 0 0;
    transition: .18s ease;
}

.cat:hover {
    transform: translateY(-4px);
    box-shadow:
        0 22px 42px rgba(16, 32, 51, .13),
        inset 0 1px 0 rgba(255, 255, 255, .92);
}

.cat:hover::before {
    opacity: .46;
    transform: scale(1.08);
}

.cat-icon {
    width: 40px;
    height: 40px;
    margin: 0 0 13px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: .18s ease;
    position: relative;
    z-index: 2;
}

.cat:hover .cat-icon {
    transform: scale(1.06);
}

.cat strong {
    position: relative;
    z-index: 2;
    display: block;
    font-size: 19px;
    line-height: 1.1;
    letter-spacing: -.045em;
    color: var(--text);
}

.cat span:not(.cat-icon) {
    position: relative;
    z-index: 2;
    display: block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.35;
    color: var(--muted);
}

.cat-vip {
    border: 1px solid rgba(255, 213, 0, .48);
    background:
        radial-gradient(circle at 92% 4%, rgba(255, 213, 0, .38), transparent 38%),
        linear-gradient(135deg, #fff9d8 0%, #ffffff 62%, #fff5b8 100%);
}

.cat-vip::before {
    background: #ffd500;
}

.cat-vip::after {
    background: linear-gradient(90deg, #ffd500, #e6b800);
}

.cat-vip .cat-icon {
    background: linear-gradient(135deg, #fff4b8 0%, #ffd500 55%, #e6b800 100%);
    color: #5c4200;
    box-shadow: 0 10px 20px rgba(255, 213, 0, .26);
}

.cat-premium {
    border: 1px solid rgba(0, 91, 187, .28);
    background:
        radial-gradient(circle at 92% 4%, rgba(0, 91, 187, .28), transparent 38%),
        linear-gradient(135deg, #e7f3ff 0%, #ffffff 62%, #d8ebff 100%);
}

.cat-premium::before {
    background: var(--blue);
}

.cat-premium::after {
    background: linear-gradient(90deg, #2d8cff, var(--blue));
}

.cat-premium .cat-icon {
    background: linear-gradient(135deg, #2d8cff 0%, var(--blue) 58%, var(--blue-dark) 100%);
    color: #fff;
    box-shadow: 0 10px 20px rgba(0, 91, 187, .22);
}

.cat-short {
    border: 1px solid rgba(0, 166, 231, .30);
    background:
        radial-gradient(circle at 92% 4%, rgba(0, 166, 231, .30), transparent 38%),
        linear-gradient(135deg, #e2f9ff 0%, #ffffff 62%, #cff3ff 100%);
}

.cat-short::before {
    background: var(--cyan);
}

.cat-short::after {
    background: linear-gradient(90deg, #8de7ff, var(--cyan));
}

.cat-short .cat-icon {
    background: linear-gradient(135deg, #8de7ff 0%, var(--cyan) 58%, #007db5 100%);
    color: #fff;
    box-shadow: 0 10px 20px rgba(0, 166, 231, .20);
}

.cat-business {
    border: 1px solid rgba(16, 185, 129, .30);
    background:
        radial-gradient(circle at 92% 4%, rgba(16, 185, 129, .30), transparent 38%),
        linear-gradient(135deg, #e8fff7 0%, #ffffff 62%, #d7fff0 100%);
}

.cat-business::before {
    background: #10b981;
}

.cat-business::after {
    background: linear-gradient(90deg, #10b981, #005bbb);
}

.cat-business .cat-icon {
    background: linear-gradient(135deg, #34d399 0%, #10b981 52%, #0b7d68 100%);
    color: #fff;
    box-shadow: 0 10px 20px rgba(16, 185, 129, .20);
}

.cat-it {
    border: 1px solid rgba(103, 58, 183, .28);
    background:
        radial-gradient(circle at 92% 4%, rgba(103, 58, 183, .28), transparent 38%),
        linear-gradient(135deg, #f2edff 0%, #ffffff 62%, #e8ddff 100%);
}

.cat-it::before {
    background: #673ab7;
}

.cat-it::after {
    background: linear-gradient(90deg, #673ab7, #005bbb);
}

.cat-it .cat-icon {
    background: linear-gradient(135deg, #8b5cf6 0%, #673ab7 52%, #3f2d86 100%);
    color: #fff;
    box-shadow: 0 10px 20px rgba(103, 58, 183, .20);
}

.cat-geo {
    border: 1px solid rgba(20, 184, 166, .30);
    background:
        radial-gradient(circle at 92% 4%, rgba(20, 184, 166, .30), transparent 38%),
        linear-gradient(135deg, #e5fffb 0%, #ffffff 62%, #d6fbf6 100%);
}

.cat-geo::before {
    background: #14b8a6;
}

.cat-geo::after {
    background: linear-gradient(90deg, #14b8a6, #00a6e7);
}

.cat-geo .cat-icon {
    background: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 52%, #0f766e 100%);
    color: #fff;
    box-shadow: 0 10px 20px rgba(20, 184, 166, .20);
}

/* === Catalog categories cards styles END === */

/* ADS */

.promo-slots {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 14px;
}

.promo-slot {
    padding: 18px;
    border-radius: 16px;
    background:
        linear-gradient(135deg,
            rgba(0, 91, 187, .08),
            rgba(255, 213, 0, .08)),
        #fff;
    border: 1px dashed rgba(0, 91, 187, .25);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.promo-slot h3 {
    margin: 0;
    font-size: 20px;
    letter-spacing: -.03em;
}

.promo-slot p {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 650;
    color: var(--muted);
}

.promo-box {
    min-width: 120px;
    height: 60px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    color: var(--muted);
}

/* INFO */

.info {
    padding: 20px;
    border-radius: 18px;
    background:
        linear-gradient(135deg,
            rgba(0, 91, 187, .06),
            rgba(255, 213, 0, .08)),
        #fff;
    border: 1px solid var(--line);
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 16px;
    box-shadow: var(--shadow);
}

.info h2 {
    margin: 0;
    font-size: 30px;
    letter-spacing: -.05em;
}

.info p {
    margin: 10px 0 0;
    font-size: 14px;
    line-height: 1.65;
    font-weight: 650;
    color: var(--muted);
}

.info-list {
    display: grid;
    gap: 8px;
}

.info-list div {
    padding: 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .82);
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 850;
    color: #40546d;
}

/* === Info alerts override START === */

.info-list .ui-alert {
    background: initial;
    color: inherit;
    border-width: 1px;
}

.info-list .ui-alert-success {
    background: rgba(16, 185, 129, .08);
    border-color: rgba(16, 185, 129, .22);
    color: #0d7f5c;
}

.info-list .ui-alert-warning {
    background: rgba(255, 213, 0, .14);
    border-color: rgba(255, 213, 0, .34);
    color: #7d6300;
}

.info-list .ui-alert-info {
    background: rgba(0, 91, 187, .08);
    border-color: rgba(0, 91, 187, .18);
    color: var(--blue);
}

.info-list .ui-alert-danger {
    background: rgba(220, 53, 69, .08);
    border-color: rgba(220, 53, 69, .22);
    color: #bb2d3b;
}

.info-list .ui-alert-neutral {
    background: rgba(103, 58, 183, .08);
    border-color: rgba(103, 58, 183, .22);
    color: #673ab7;
}


/* === Info alerts override END === */

/* === UI elements block START === */
.ui-elements-grid {
    display: grid;
    gap: 14px;
}

.ui-elements-title {
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted);
}

.ui-elements-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ui-elements-fields {
    display: grid;
    gap: 10px;
}

.ui-elements-textarea {
    min-height: 120px;
    padding: 12px;
    resize: vertical;
    font-family: inherit;
}

.ui-elements-divider {
    height: 1px;
    background: var(--line);
    margin: 4px 0;
}

.ui-alert {
    min-height: 46px;
    padding: 10px 14px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 800;
    border: 1px solid;
}

.ui-alert-success {
    background: rgba(16, 185, 129, .08);
    border-color: rgba(16, 185, 129, .22);
    color: #0d7f5c;
}

.ui-alert-warning {
    background: rgba(255, 213, 0, .14);
    border-color: rgba(255, 213, 0, .34);
    color: #7d6300;
}

.ui-alert-info {
    background: rgba(0, 91, 187, .08);
    border-color: rgba(0, 91, 187, .18);
    color: var(--blue);
}

.ui-btn-disabled {
    opacity: .55;
    pointer-events: none;
}

.ui-btn-loading {
    gap: 8px;
}

.ui-field-sm {
    height: 34px;
    font-size: 12px;
}

.ui-field-error {
    border-color: rgba(220, 53, 69, .55);
    box-shadow: 0 0 0 4px rgba(220, 53, 69, .08);
}

.ui-help-text {
    margin-top: 5px;
    font-size: 11px;
    font-weight: 500;
    color: var(--muted);
}

.ui-error-text {
    margin-top: 5px;
    font-size: 11px;
    font-weight: 700;
    color: #dc3545;
}

.ui-search-field {
    position: relative;
}

.ui-search-field i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 13px;
    color: var(--muted);
    z-index: 2;
}

.ui-search-field .field {
    width: 100%;
    padding-left: 34px;
}

.ui-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #40546d;
}

.ui-check input {
    width: 16px;
    height: 16px;
    accent-color: var(--blue);
}

.ui-switch {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
    font-weight: 700;
    color: #40546d;
}

.ui-switch input {
    display: none;
}

.ui-switch span {
    width: 38px;
    height: 22px;
    border-radius: 999px;
    background: #dce8f5;
    position: relative;
    transition: .18s;
}

.ui-switch span::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 3px 8px rgba(16, 32, 51, .14);
    transition: .18s;
}

.ui-switch input:checked+span {
    background: var(--blue);
}

.ui-switch input:checked+span::before {
    transform: translateX(16px);
}

.ui-counter {
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    text-align: right;
}

.ui-status {
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    font-size: 10px;
    font-weight: 950;
}

.ui-status-active {
    background: rgba(16, 185, 129, .12);
    color: #0d7f5c;
}

.ui-status-pending {
    background: rgba(255, 213, 0, .18);
    color: #735b00;
}

.ui-status-sold {
    background: rgba(0, 91, 187, .10);
    color: var(--blue);
}

.ui-status-archived {
    background: #eef2f6;
    color: #66758a;
}

.ui-chip {
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    gap: 7px;
    background: #edf5ff;
    border: 1px solid rgba(0, 91, 187, .12);
    color: var(--blue);
    font-size: 12px;
    font-weight: 850;
}

.ui-alert-danger {
    background: rgba(220, 53, 69, .08);
    border-color: rgba(220, 53, 69, .22);
    color: #bb2d3b;
}

.ui-empty {
    padding: 22px;
    border-radius: 14px;
    border: 1px dashed rgba(0, 91, 187, .24);
    background: #f8fbff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 7px;
}

.ui-empty i {
    font-size: 28px;
    color: var(--blue);
}

.ui-empty strong {
    font-size: 16px;
    letter-spacing: -.02em;
}

.ui-empty span {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
}

.ui-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ui-pagination a {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 900;
    color: var(--blue);
}

.ui-pagination a.active {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.ui-upload {
    min-height: 120px;
    border: 1px dashed rgba(0, 91, 187, .28);
    border-radius: 14px;
    background: #f8fbff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    text-align: center;
}

.ui-upload i {
    font-size: 30px;
    color: var(--blue);
}

.ui-upload strong {
    font-size: 15px;
}

.ui-upload span {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
}

.ui-toast {
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #102033;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 12px 26px rgba(16, 32, 51, .22);
}

.ui-favorite-active {
    color: #e11d48;
}

.ui-modal .modal-content {
    border: 1px solid rgba(216, 228, 242, .95);
    border-radius: 18px;
    box-shadow: 0 22px 54px rgba(16, 32, 51, .18);
    overflow: hidden;
}

.ui-modal .modal-header {
    border-bottom: 0;
    padding: 18px 18px 6px;
    align-items: flex-start;
}

.ui-modal .modal-title {
    font-size: 20px;
    font-weight: 950;
    letter-spacing: -.04em;
    color: var(--text);
}

.ui-modal .btn-close {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background-color: #f3f7fc;
    opacity: 1;
    box-shadow: none;
}

.ui-modal .btn-close:hover {
    background-color: #e6effa;
}

.ui-modal .modal-body {
    padding: 8px 18px 18px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.55;
    color: var(--muted);
}

.ui-modal .modal-footer {
    border-top: 0;
    padding: 0 18px 18px;
    gap: 8px;
}

/* === UI elements block END === */

/* === Session toast styles START === */
.site-toast-container {
    z-index: 1080;
}

.site-toast {
    min-width: 300px;
    max-width: 420px;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 16px 34px rgba(16, 32, 51, .22);
    overflow: hidden;
}

.site-toast-inner {
    min-height: 52px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.site-toast-text {
    font-size: 13px;
    font-weight: 850;
    line-height: 1.45;
}

.site-toast-close {
    margin-left: auto;
    flex: 0 0 auto;
    opacity: .75;
}

.site-toast-close:hover {
    opacity: 1;
}

.site-toast-success {
    background: var(--green);
    color: #fff;
}

.site-toast-info {
    background: var(--blue);
    color: #fff;
}

.site-toast-warning {
    background: var(--yellow);
    color: #3d3200;
}

.site-toast-danger {
    background: #dc3545;
    color: #fff;
}

.site-toast-success .site-toast-close,
.site-toast-info .site-toast-close,
.site-toast-danger .site-toast-close {
    filter: brightness(0) invert(1);
}

.site-toast-warning .site-toast-close {
    filter: none;
}

/* === Session toast styles END === */

/* FOOTER */

.footer {
    padding: 24px 0 34px;
}

.footer-inner {
    padding: 18px;
    border: 1px solid rgba(216, 228, 242, .95);
    border-top: 3px solid var(--blue);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(0, 91, 187, .035), rgba(255, 213, 0, .05)),
        #fff;
    display: grid;
    grid-template-columns: 1fr 1.5fr 184px;
    align-items: center;
    gap: 18px;
    box-shadow: 0 10px 24px rgba(16, 32, 51, .05);
    font-size: 12px;
    font-weight: 750;
    color: var(--muted);
}

/* === Footer center layout START === */
.footer-center {
    display: grid;
    gap: 10px;
    justify-items: center;
}

/* === Footer center layout END === */

.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 7px;
}

.footer-links a {
    min-height: 30px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    border-radius: 999px;
    background: #f8fbff;
    border: 1px solid rgba(216, 228, 242, .95);
    color: #36506b;
    font-size: 12px;
    font-weight: 850;
    transition: .18s ease;
}

.footer-links a:hover {
    background: #edf5ff;
    border-color: rgba(0, 91, 187, .18);
    color: var(--blue);
}

/* === Footer social links START === */
.footer-social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.footer-social a {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #f8fbff;
    border: 1px solid rgba(216, 228, 242, .95);
    color: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    transition: .18s ease;
}

.footer-social a:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(0, 91, 187, .14);
}

.footer-social a .fa-paper-plane {
    transform: translate(-1px, 1px);
}

/* === Footer social links END === */

/* === Footer counter styles START === */
.footer-counter {
    width: 100%;
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--muted);
}

.footer-counter div {
    margin: 0;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(0, 91, 187, .06);
    border: 1px solid rgba(0, 91, 187, .10);
}

/* === Footer counter styles END === */

/* === Footer site links START === */
.footer-info {
    display: flex;
    flex-direction: column;
}

/* === Footer brand line START === */
.footer-brand-line {
    display: flex;
    align-items: center;
    gap: 7px;
}

/* === Footer brand line END === */

.footer-site-link {
    color: var(--blue);
    font-size: 16px;
    font-weight: 950;
    letter-spacing: -.03em;
}

.footer-site-link:hover {
    text-decoration: underline;
}

.footer-dev-link {
    margin-top: 10px;
}

.footer-dev-link a {
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
}

.footer-dev-link a:hover {
    color: var(--blue);
    text-decoration: underline;
}

/* === Footer developer logo START === */
.footer-dev-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer-dev-logo {
    width: 30px;
    height: 30px;
    object-fit: contain;
    display: block;
    border-radius: 6px;
}

/* === Footer developer logo END === */
/* === Footer site links END === */

/* === Footer partner badge START === */
.footer-partner {
    width: 184px;
    text-align: right;
    line-height: 0;
    /* filter: blur(3px);
    transition: .18s ease; */
}

.footer-partner:hover {
    filter: blur(0);
}

.footer-partner a {
    display: inline-block;
    margin: 0 0 6px 6px;
    overflow: hidden;
    vertical-align: top;
}

.footer-partner img {
    display: block;
}

.footer-partner br {
    display: block;
    content: "";
}

/* === Footer partner badge END === */

/* === Login captcha styles START === */
.login-captcha {
    display: grid;
    gap: 14px;
}

.login-captcha-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.login-captcha-head span {
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--text);
}

.login-captcha-refresh {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--blue);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.login-captcha-refresh:hover {
    color: var(--blue-dark);
}

.login-captcha-body {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.login-captcha-image {
    width: fit-content;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.login-captcha-image img {
    display: block;
    width: 180px;
    height: auto;
}

.login-captcha-field {
    flex: 1;
    min-width: 220px;
    display: grid;
    gap: 10px;
}

/* === Login code form styles START === */
.login-code-group {
    display: grid;
    gap: 12px;
}

.login-code-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.login-code-submit {
    flex: 0 0 auto;
}

.login-code-actions {
    display: grid;
    grid-template-columns: minmax(180px, 260px) minmax(160px, 220px);
    gap: 12px;
}

.login-code-actions .btn {
    width: 100%;
    justify-content: center;
}

@media (max-width: 767px) {
    .login-code-row {
        grid-template-columns: 1fr;
    }

    .login-code-actions {
        grid-template-columns: 1fr;
    }
}

/* === Login code form styles END === */

@media (max-width: 767px) {
    .login-captcha-body {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .login-captcha-image {
        height: auto;
        min-height: 96px;
    }
}

/* === Login captcha styles END === */

/* MOBILE */

@media(max-width:1040px) {

    .header-inner {
        height: auto;
        display: block;
    }

    .menu,
    .actions {
        display: none;
    }

    .mobile-header-actions {
        display: flex;
    }

    .mobile-menu {
        display: block;
    }

    .hero-grid,
    .split,
    .info {
        grid-template-columns: 1fr;
    }

    .filters {
        grid-template-columns: 1fr 1fr;
    }

    .domain {
        grid-template-columns: 1fr auto;
    }

    .domain .badges,
    .domain .meta {
        grid-column: 1/-1;
    }

    .price {
        text-align: left;
    }

    .categories {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media(max-width:680px) {

    body {
        padding-top: 64px;
    }

    .container {
        width: min(100% - 18px, 1220px);
    }

    .header-inner {
        height: auto;
        display: block;
    }

    .header-row {
        height: 64px;
    }

    .hero-main {
        text-align: center;
    }

    .hero h1 {
        margin-left: auto;
        margin-right: auto;
        font-size: 34px;
    }

    .hero p {
        margin-left: auto;
        margin-right: auto;
    }

    .tags {
        justify-content: center;
    }

    .logo-text {
        display: block;
    }

    .logo-text strong {
        display: none;
    }

    .logo-text span {
        display: block;
        max-width: 72px;
        margin-top: 0;
        font-size: 10px;
        line-height: 1.05;
        font-weight: 900;
        letter-spacing: .02em;
        text-transform: none;
        color: var(--text);
    }

    .domain-day-card {
        min-height: 230px;
    }

    .domain-day-bg {
        font-size: clamp(38px, 14vw, 72px);
        max-width: 110%;
    }

    .domain-day-bottom {
        flex-direction: column;
        align-items: stretch;
    }

    .domain-day-stats {
        justify-content: center;
    }

    .domain-day-open {
        width: 100%;
        justify-content: center;
    }

    .domain-day-center strong {
        line-height: 1.15;
    }

    /* === Mobile domain of day title sizes START === */
    .domain-day-center strong.domain-day-title-xl {
        font-size: clamp(28px, 8vw, 38px);
    }

    .domain-day-center strong.domain-day-title-lg {
        font-size: clamp(23px, 7vw, 32px);
    }

    .domain-day-center strong.domain-day-title-md {
        font-size: clamp(20px, 6vw, 27px);
    }

    .domain-day-center strong.domain-day-title-sm {
        font-size: clamp(17px, 5vw, 22px);
    }
    /* === Mobile domain of day title sizes END === */

    .menu,
    .actions {
        display: none;
    }

    .mobile-header-actions {
        display: flex;
    }

    .mobile-menu {
        display: block;
    }

    .hero h1 {
        font-size: 30px;
        line-height: 1;
    }

    .search,
    .filters,
    .promo-slots {
        grid-template-columns: 1fr;
    }

    .stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .categories {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .panel-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-domains-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-domains-head .btn {
        width: 100%;
    }

    .domain {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "domain-name domain-name"
            "domain-badges domain-badges"
            "domain-meta domain-meta"
            "domain-actions domain-price";
    }

    .domain-name {
        grid-area: domain-name;
    }

    .domain .badges {
        grid-area: domain-badges;
    }

    .domain .meta {
        grid-area: domain-meta;
    }

    .domain .price {
        grid-area: domain-price;
        align-self: center;
        justify-self: end;
    }

    .domain-actions {
        grid-area: domain-actions;
        width: 100%;
        min-width: 0;
    }

    .open {
        flex: 1;
        justify-content: center;
    }

    .promo-slot {
        flex-direction: column;
        align-items: flex-start;
    }

    .promo-box {
        width: 100%;
    }

    .footer-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    /* === Mobile footer compact links START === */
    .footer-inner {
        grid-template-columns: 1fr;
        align-items: center;
        text-align: center;
        gap: 14px;
        padding: 16px;
    }

    .footer-info {
        align-items: center;
    }

    .footer-brand-line {
        justify-content: center;
    }

    .footer-links {
        width: 100%;
        justify-content: center;
        gap: 6px 8px;
    }

    .footer-links a {
        min-height: 28px;
        padding: 0 9px;
        border-radius: 999px;
        background: #f8fbff;
        border: 1px solid rgba(216, 228, 242, .95);
        color: var(--blue);
        font-size: 12px;
        font-weight: 700;
    }

    .footer-counter {
        margin-top: 0;
        justify-content: center;
        text-align: center;
        font-size: 11px;
        line-height: 1.15;
    }

    .footer-partner {
        width: 100%;
        text-align: center;
    }

    /* === Mobile footer compact links END === */

}

/* === Nova showcase styles START === */
.nova-slot {
    width: 100%;
    display: flex;
    justify-content: center;
}

.nova-orion {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
}

.nova-orion img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* === Nova text background START === */
.nova-nebula {
    border-color: rgba(121, 86, 255, .22);
    background:
        radial-gradient(circle at 12% 18%, rgba(121, 86, 255, .18), transparent 34%),
        radial-gradient(circle at 88% 82%, rgba(0, 194, 255, .16), transparent 36%),
        linear-gradient(135deg, #ffffff 0%, #f3f0ff 46%, #eaf8ff 100%);
}

/* === Nova text background END === */

.nova-vega {
    width: min(728px, 100%);
    height: 90px;
}

.nova-sirius {
    width: min(468px, 100%);
    height: 60px;
}

.nova-atlas {
    width: min(970px, 100%);
    height: 250px;
}

.nova-luna {
    width: 320px;
    max-width: 100%;
    height: 50px;
}

.nova-mira {
    width: 320px;
    max-width: 100%;
    height: 100px;
}

.nova-cosmos {
    width: 300px;
    max-width: 100%;
    height: 90px;
}

.nova-fluid {
    width: 100% !important;
    max-width: none !important;
}

.nova-pulse {
    width: 100%;
    height: 100%;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
}

/* === Nova text banner title START === */
/* Main title from [title]...[/title] */
.nova-pulse strong {
    font-size: 18px;
    font-weight: 900;
    color: var(--blue);
    line-height: 1.1;
}

/* === Nova text banner title END === */

/* === Nova text banner body START === */
/* Regular text between title and button */
.nova-pulse small {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--text);
}

/* === Nova text banner body END === */

/* === Nova text banner button START === */
/* Button from [button]...[/button] */
.nova-action {
    min-height: 22px;
    padding: 0 8px;
    border-radius: 6px;
    background: var(--blue);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

/* === Nova text banner button END === */

/* === Nova alignment START === */
.nova-align-center {
    justify-content: center;
}

.nova-align-left {
    justify-content: flex-start;
}

.nova-align-right {
    justify-content: flex-end;
}

.nova-align-none {
    justify-content: initial;
}

/* === Nova alignment END === */

/* === Nova showcase styles END === */