:root {
    --sidebar-width: 210px;
    --page: #f4f7fb;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --ink: #0b1220;
    --ink-soft: #344054;
    --muted: #667085;
    --faint: #98a2b3;
    --line: #dfe7f1;
    --line-strong: #cfd9e7;
    --nav: #0f172a;
    --nav-soft: #182235;
    --accent: #0f8b73;
    --accent-strong: #08745f;
    --accent-soft: #e7f7f3;
    --lime: #d7ff4f;
    --blue: #2563eb;
    --blue-soft: #eaf1ff;
    --danger: #c2413d;
    --danger-soft: #fff1f0;
    --warning: #b7791f;
    --warning-soft: #fff8e6;
    --radius-sm: 10px;
    --radius: 16px;
    --radius-lg: 22px;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 28px rgba(15, 23, 42, .05);
    --shadow: 0 22px 70px rgba(15, 23, 42, .10);
}

@font-face {
    font-family: "Anton";
    src: url("../fonts/system/anton.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "Bebas Neue Bold";
    src: url("../fonts/system/bebas-neue-bold.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "Sora ExtraBold";
    src: url("../fonts/system/sora-extra-bold.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "Space Grotesk Bold";
    src: url("../fonts/system/space-grotesk-bold.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "Montserrat ExtraBold";
    src: url("../fonts/system/montserrat-extra-bold.woff") format("woff");
    font-display: swap;
}

* { box-sizing: border-box; }

html { min-height: 100%; }

body {
    margin: 0;
    min-height: 100%;
    background:
        linear-gradient(180deg, #ffffff 0, var(--page) 300px),
        var(--page);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.45;
}

a { color: inherit; }

h1,
h2,
h3,
p { margin-top: 0; }

h1 {
    margin-bottom: 0;
    font-size: clamp(30px, 3.1vw, 46px);
    line-height: .96;
    letter-spacing: -.035em;
}

.page-title {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.page-title .nav-icon {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    stroke-width: 1.9;
}

h2 {
    margin-bottom: 12px;
    font-size: 20px;
    line-height: 1.15;
    letter-spacing: -.02em;
}

h3 {
    margin-bottom: 10px;
    font-size: 17px;
    letter-spacing: -.015em;
}

.nova-shell {
    min-height: 100vh;
    display: grid;
    grid-template-rows: 68px minmax(0, 1fr);
}

.nova-topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(280px, 1fr) auto;
    min-width: 0;
    align-items: center;
    gap: 16px;
    padding: 8px 22px 8px 0;
    border-bottom: 1px solid rgba(223, 231, 241, .88);
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(18px);
}

.nova-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 1px);
    min-height: 58px;
    align-self: stretch;
    padding: 8px 12px;
    margin: -8px 0 -8px 0;
    background: var(--nav);
    text-decoration: none;
}

.nova-brand-logo {
    display: block;
    width: min(100%, 176px);
    max-height: 30px;
    height: auto;
    object-fit: contain;
    transform: translateY(2px);
}

.nova-logo {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: var(--nav);
    color: var(--lime);
    font-weight: 950;
    letter-spacing: -.03em;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .18);
}

.nova-brand strong,
.nova-identity strong {
    display: block;
    font-weight: 900;
    letter-spacing: -.02em;
}

.nova-brand small,
.nova-identity small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 760;
}

.nova-command {
    justify-self: center;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    width: min(100%, 560px);
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted);
    font-weight: 780;
}

.nova-command-dot {
    width: 9px;
    height: 9px;
    border-radius: 99px;
    background: var(--accent);
    box-shadow: 0 0 0 5px rgba(15, 139, 115, .11);
}

.nova-command-dot.is-idle {
    background: var(--muted);
    box-shadow: 0 0 0 5px rgba(102, 112, 133, .11);
}

.nova-identity {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 11px;
    min-width: 0;
}

.project-switcher {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 220px;
    max-width: min(38vw, 420px);
}

.project-switcher label {
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.project-switcher-center {
    position: relative;
    justify-self: center;
    width: min(100%, 560px);
    max-width: min(42vw, 560px);
    gap: 10px;
    padding: 0;
    border: 0;
    background: transparent;
}

.project-switcher-center label {
    position: static;
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
    pointer-events: auto;
}

.project-menu {
    flex: 1 1 auto;
    position: relative;
    min-width: 0;
}

.project-menu-trigger {
    width: 100%;
    height: 44px;
    min-height: 44px;
    padding: 0 42px 0 14px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    background: var(--surface);
    color: var(--ink);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
    font-size: 13px;
    font-weight: 520;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.project-menu-trigger::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid var(--muted);
    transform: translateY(-50%);
    transform-origin: 50% 35%;
    transition: transform .16s ease, border-top-color .16s ease;
}

.project-menu-trigger:focus {
    outline: 0;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.project-menu-panel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 90;
    display: none;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.project-switcher-center.is-open .project-menu-panel {
    display: grid;
    gap: 3px;
}

.project-menu-panel button {
    width: 100%;
    min-height: 34px;
    padding: 0 10px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--ink-soft);
    font: inherit;
    font-weight: 620;
    text-align: left;
    cursor: pointer;
}

.project-menu-panel button:hover,
.project-menu-panel button:focus,
.project-menu-panel button.is-selected {
    background: var(--nav);
    color: #fff;
    outline: 0;
}

.nova-identity a {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--ink-soft);
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}

.nova-identity .avatar-link {
    min-height: 32px;
    width: 32px;
    padding: 0;
    justify-content: center;
    border: 0;
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--ink);
    font-weight: 900;
}

.nova-layout {
    min-width: 0;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.nova-sidebar,
.sidebar {
    position: sticky;
    top: 68px;
    height: calc(100vh - 68px);
    padding: 20px 14px;
    border-right: 1px solid var(--line);
    background: linear-gradient(180deg, var(--nav) 0%, #111c2d 100%);
    color: #fff;
}

.nova-section-label {
    display: block;
    margin: 0 10px 8px;
    color: rgba(255, 255, 255, .56);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.nova-nav,
.nova-sidebar nav {
    display: grid;
    gap: 18px;
}

.nav-group {
    display: grid;
    gap: 5px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.nav-group:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.nova-nav a,
.nova-sidebar nav a {
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border-radius: 14px;
    color: rgba(255, 255, 255, .72);
    font-weight: 840;
    text-decoration: none;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}

.nova-nav a:hover,
.nova-nav a.active,
.nova-sidebar nav a:hover,
.nova-sidebar nav a.active {
    background: rgba(255, 255, 255, .11);
    color: #fff;
    transform: translateX(2px);
}

.nav-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    color: rgba(255, 255, 255, .48);
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: color .16s ease, transform .16s ease;
}

.nova-nav a:hover .nav-icon,
.nova-nav a.active .nav-icon,
.nova-sidebar nav a:hover .nav-icon,
.nova-sidebar nav a.active .nav-icon {
    color: #fff;
    transform: scale(1.03);
}

.nova-main,
.content {
    min-width: 0;
    padding: 24px clamp(18px, 2.4vw, 34px) 42px;
}

.nova-hero {
    min-height: 116px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(215, 255, 79, .18), transparent 42%),
        linear-gradient(140deg, #fff 0%, #f9fbff 100%);
    box-shadow: var(--shadow-sm);
}

.eyebrow {
    display: block;
    margin-bottom: 8px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.header-tools {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.status-pill,
.header-user {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 13px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: 13px;
    font-weight: 830;
}

.status-pill:before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 99px;
    background: var(--accent);
}

.status-pill.is-active:before {
    background: #0f8b73;
}

.status-pill.is-inactive:before {
    background: var(--muted);
}

.workspace-content,
.nova-content,
.page-body {
    display: grid;
    gap: 16px;
}

.notice {
    padding: 14px 16px;
    border: 1px solid;
    border-radius: 16px;
    font-weight: 820;
}

.notice.success {
    background: var(--accent-soft);
    color: #075c4b;
    border-color: #bfe7db;
}

.notice.error {
    background: var(--danger-soft);
    color: #8f2f2f;
    border-color: #f0c8c6;
}

.notice.info {
    background: #f1fbf9;
    color: #075c4b;
    border-color: #bfe7db;
}

.summary-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.summary-card,
.panel,
.module-card,
.data-card,
.workbench-card,
.login-card {
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, .92);
    box-shadow: var(--shadow-sm);
}

.summary-card {
    min-height: 84px;
    display: grid;
    align-content: space-between;
    padding: 14px;
    border-radius: 16px;
}

.summary-card span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.summary-label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
}

.summary-label .nav-icon {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
    color: var(--muted);
}

.summary-card strong {
    font-size: 30px;
    line-height: 1;
    letter-spacing: -.05em;
}

.workbench-card {
    min-height: 128px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    padding: 20px;
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(37, 99, 235, .10), transparent 45%),
        var(--surface);
}

.workbench-card h2 {
    max-width: 760px;
    margin-bottom: 10px;
    font-size: clamp(28px, 3vw, 42px);
}

.workbench-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.panel,
.module-card,
.data-card {
    padding: 18px;
    border-radius: 20px;
}

.metric {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.metric span,
.metric strong {
    display: block;
}

.metric strong {
    margin-left: 8px;
    font-size: 24px;
    line-height: 1;
}

.data-card {
    overflow: hidden;
}

.grid,
.module-grid {
    display: grid;
    gap: 18px;
}

.grid.two,
.module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.metric-card,
.limit-card {
    min-height: 110px;
    display: grid;
    align-content: space-between;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.metric-card span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.metric-card strong {
    font-size: 34px;
    line-height: .95;
    letter-spacing: -.04em;
}

.limit-card h3 {
    margin-bottom: 4px;
}

.company-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
}

.company-panel {
    display: grid;
    align-content: start;
    gap: 16px;
}

.company-metric-list {
    display: grid;
    gap: 10px;
}

.company-metric-list div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.company-metric-list div:last-child {
    border-bottom: 0;
}

.company-metric-list span {
    color: var(--muted);
    font-weight: 850;
}

.company-metric-list strong {
    text-align: right;
}

.company-credit-form {
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.company-admin-fields {
    display: grid;
    gap: 12px;
    padding: 15px;
    border: 1px solid rgba(15, 139, 115, .22);
    border-radius: 12px;
    background: rgba(15, 139, 115, .06);
}

.company-admin-fields h3 {
    margin: 2px 0 4px;
}

.company-admin-fields .settings-inline-check {
    align-self: start;
}

.compact-table {
    width: 100%;
    border-collapse: collapse;
}

.compact-table th,
.compact-table td {
    padding: 11px 10px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.compact-table th {
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.price-line {
    margin-bottom: 8px;
    font-size: 22px;
    font-weight: 950;
    letter-spacing: -.03em;
}

.ai-settings-grid {
    grid-template-columns: minmax(220px, 1.25fr) repeat(3, minmax(150px, .75fr));
}

.section-head,
.module-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 14px;
}

.section-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.section-head h2,
.module-head h2 { margin-bottom: 0; }

.module-kicker {
    display: inline-flex;
    margin-bottom: 8px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.module-copy,
.muted {
    color: var(--muted);
}

.module-copy {
    max-width: 740px;
    margin-bottom: 18px;
    font-weight: 650;
}

.module-index {
    min-width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--blue-soft);
    color: var(--blue);
    font-weight: 950;
}

form,
.module-form {
    display: grid;
    gap: 10px;
}

.form-row {
    position: relative;
}

label {
    font-weight: 850;
}

.form-row label {
    position: absolute;
    top: 9px;
    left: 14px;
    z-index: 3;
    color: var(--muted);
    font-size: 11px;
    line-height: 1;
    pointer-events: none;
}

input,
select,
textarea {
    width: 100%;
    min-height: 48px;
    padding: 20px 12px 7px;
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    background: var(--surface);
    color: var(--ink);
    font: inherit;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

textarea {
    min-height: 92px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    outline: 0;
    border-color: rgba(15, 139, 115, .62);
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .12);
}

.form-row.has-error input,
.form-row.has-error select,
.form-row.has-error textarea {
    border-color: var(--danger);
    box-shadow: 0 0 0 4px rgba(194, 65, 61, .14);
}

.form-row.has-error label {
    color: var(--danger);
}

input::placeholder,
textarea::placeholder {
    color: var(--faint);
}

.form-row > .select2-container {
    width: 100% !important;
    display: block;
}

.select2-container--default .select2-selection--single {
    height: 48px;
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    background: var(--surface);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 20px 36px 7px 12px;
    color: var(--ink);
    line-height: 1.2;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 46px;
    right: 8px;
}

.select2-dropdown {
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow);
    z-index: 1100;
}

.form-row .select2-container--open .select2-dropdown,
.modal-card .select2-container--open .select2-dropdown {
    left: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
}

.select2-search--dropdown {
    padding: 8px;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    min-height: 36px;
    padding: 8px 10px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
}

.select2-results__option {
    padding: 9px 11px;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background: var(--nav);
    color: #fff;
}

.country-filter-form {
    display: grid;
    gap: 18px;
}

.country-continent-groups {
    display: grid;
    gap: 14px;
}

.country-continent-groups.is-smart {
    gap: 12px;
}

.country-smart-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: 12px;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.country-smart-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    min-width: 0;
    padding: 1px 0 4px;
    scrollbar-width: thin;
}

.country-smart-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
}

.country-smart-tab small {
    display: inline-grid;
    place-items: center;
    min-width: 24px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
}

.country-smart-tab.is-active {
    border-color: var(--nav);
    background: var(--nav);
    color: #fff;
}

.country-smart-tab.is-active small {
    background: rgba(255, 255, 255, .16);
    color: #fff;
}

.country-smart-search {
    display: block;
    width: 100%;
    min-width: 0;
}

.country-smart-search input {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 10px 14px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    appearance: none;
    -webkit-appearance: none;
    background: var(--surface);
    color: var(--ink);
    font-weight: 750;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
}

.country-smart-search input::placeholder {
    color: var(--muted);
}

.country-smart-search input:focus {
    border-color: var(--nav);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .12);
}

.country-smart-selected {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-height: 52px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--panel-soft) 72%, var(--surface));
}

.country-smart-selected-meta {
    display: grid;
    gap: 2px;
    min-width: 72px;
}

.country-smart-selected-meta span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.country-smart-selected-meta strong {
    color: var(--ink);
    font-size: 20px;
    line-height: 1;
}

.country-smart-selected-chips {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    max-height: 76px;
    flex-wrap: wrap;
    overflow: auto;
}

.country-smart-chip,
.country-smart-more,
.country-smart-empty {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 6px 9px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--panel-soft);
    color: var(--muted);
    font-family: inherit;
    font-size: 12px;
    font-weight: 850;
}

.country-smart-chip {
    border-color: color-mix(in srgb, var(--nav) 28%, var(--border));
    background: color-mix(in srgb, var(--nav) 8%, var(--panel-soft));
    color: var(--ink);
    cursor: pointer;
}

.country-smart-chip-x {
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: rgba(15, 23, 42, .08);
    color: var(--muted);
    font-size: 14px;
    line-height: 1;
}

.country-smart-chip:hover .country-smart-chip-x {
    background: rgba(15, 23, 42, .14);
    color: var(--ink);
}

.country-smart-more {
    color: var(--ink);
}

.country-flag {
    display: inline-grid;
    place-items: center;
    width: 28px;
    min-width: 28px;
    height: 24px;
    font-size: 22px;
    line-height: 1;
}

.country-continent-group {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.country-continent-group.compact {
    padding: 10px;
}

.country-continent-groups.is-smart .country-continent-group {
    max-height: 300px;
    overflow: auto;
}

.country-continent-groups.is-smart .country-continent-group[hidden] {
    display: none;
}

.country-continent-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.country-continent-head span,
.country-continent-head small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.country-continent-head strong {
    display: block;
    margin-top: 2px;
    color: var(--ink);
    font-size: 15px;
}

.country-filter-option {
    align-items: center;
    justify-content: flex-start;
    min-height: 34px;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
}

.country-continent-groups.is-smart .country-filter-option {
    position: relative;
    min-height: 54px;
    padding: 9px 38px 9px 10px;
    border-radius: 10px;
    background: var(--surface);
    color: var(--ink);
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.country-continent-groups.is-smart .country-filter-option:hover {
    border-color: color-mix(in srgb, var(--nav) 30%, var(--border));
    box-shadow: 0 8px 18px rgba(15, 23, 42, .06);
    transform: translateY(-1px);
}

.country-continent-groups.is-smart .country-filter-option:has(input:checked) {
    border-color: var(--nav);
    background: color-mix(in srgb, var(--nav) 9%, var(--surface));
}

.country-continent-groups.is-smart .country-filter-option .country-name {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.country-filter-option small {
    margin-left: auto;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.country-filter-option.is-disabled-country {
    opacity: 0.68;
}

.country-filter-option.is-smart-hidden {
    display: none;
}

.country-filter-form .section-head {
    align-items: center;
}

.country-filter-form .actions {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.legacy-force-form {
    gap: 16px;
}

.legacy-force-scope {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.legacy-force-scope-option {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
    min-height: 88px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
    cursor: pointer;
}

.legacy-force-scope-option:has(input:checked) {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
    background: color-mix(in srgb, var(--accent) 8%, var(--panel-soft));
}

.legacy-force-scope-option strong,
.legacy-force-scope-option small {
    display: block;
}

.legacy-force-scope-option small {
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.35;
}

.legacy-force-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.legacy-force-country-grid {
    max-height: none;
    overflow: visible;
    padding-right: 0;
}

.legacy-force-country-grid.is-smart .country-continent-group {
    max-height: 220px;
}

.legacy-force-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
}

.legacy-queue-panel {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

.legacy-queue-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(110px, 1fr));
    gap: 10px;
}

.legacy-url-generator-form {
    gap: 16px;
}

.legacy-url-generator-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
}

.legacy-force-metrics > div {
    min-height: 78px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
}

.legacy-queue-metrics > div {
    min-height: 70px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
}

.legacy-url-generator-metrics > div {
    min-height: 78px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--panel-soft);
}

.legacy-force-metrics span,
.legacy-force-breakdown span,
.legacy-queue-metrics span,
.legacy-url-generator-metrics span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.legacy-force-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-size: 22px;
    line-height: 1;
}

.legacy-queue-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-size: 20px;
    line-height: 1;
}

.legacy-queue-list {
    display: grid;
    gap: 8px;
    max-height: 300px;
    overflow: auto;
}

.legacy-queue-row {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(180px, 1.4fr) minmax(82px, auto) minmax(96px, auto);
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.legacy-queue-row strong,
.legacy-queue-row span,
.legacy-queue-row small {
    display: block;
}

.legacy-queue-row small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.legacy-url-generator-metrics strong {
    display: block;
    margin-top: 7px;
    color: var(--ink);
    font-size: 22px;
    line-height: 1;
}

.legacy-url-generator-preview {
    max-height: 420px;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.legacy-url-generator-preview .table-wrap {
    overflow-x: auto;
}

.legacy-url-generator-preview table {
    min-width: 1120px;
}

.legacy-url-generator-preview td small,
.legacy-url-generator-preview td span {
    display: block;
    margin-top: 4px;
}

.legacy-url-generator-preview td small {
    color: var(--muted);
    font-size: 12px;
}

.legacy-url-generator-sources {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.legacy-url-generator-sources a {
    color: var(--accent-strong);
    font-size: 12px;
    font-weight: 850;
}

.legacy-force-breakdown {
    display: grid;
    gap: 8px;
}

.legacy-force-breakdown-row {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) repeat(4, minmax(80px, auto));
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
}

.legacy-force-breakdown-row strong {
    color: var(--ink);
}

@media (max-width: 900px) {
    .country-continent-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .country-smart-tools {
        grid-template-columns: minmax(0, 1fr);
    }

    .legacy-force-scope,
    .legacy-force-metrics,
    .legacy-queue-metrics,
    .legacy-url-generator-metrics,
    .legacy-force-breakdown-row,
    .legacy-queue-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

.legacy-favorite-filter {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f7fafc;
}

.legacy-favorite-filter button {
    min-height: 30px;
    padding: 6px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}

.legacy-favorite-filter button.is-active {
    background: #fff4c7;
    color: #8a5a08;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
}

.switch-control {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 26px;
    vertical-align: middle;
    cursor: pointer;
}

.switch-control input {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    appearance: none;
}

.switch-control span {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    border: 1px solid #cfd6e3;
    background: #e4e8ef;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .08);
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.switch-control span::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 2px;
    left: 2px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .24);
    transition: transform .16s ease;
}

.switch-control input:checked + span {
    border-color: color-mix(in srgb, var(--accent) 70%, #0f172a);
    background: var(--accent);
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .16), 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}

.switch-control input:checked + span::after {
    transform: translateX(20px);
}

.switch-control input:focus-visible + span {
    outline: 2px solid color-mix(in srgb, var(--blue) 60%, transparent);
    outline-offset: 2px;
}

.switch-control input:disabled + span {
    opacity: .55;
    cursor: not-allowed;
}

.settings-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    color: var(--ink-soft);
    font-weight: 850;
    cursor: pointer;
}

.settings-toggle input {
    position: absolute;
    width: 1px;
    height: 1px;
    min-height: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    appearance: none;
}

.settings-toggle-ui {
    position: relative;
    width: 46px;
    height: 26px;
    flex: 0 0 46px;
    border: 1px solid #cfd6e3;
    border-radius: 999px;
    background: #e4e8ef;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .08);
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.settings-toggle-ui::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .24);
    transition: transform .16s ease;
}

.settings-toggle input:checked + .settings-toggle-ui {
    border-color: color-mix(in srgb, var(--accent) 70%, #0f172a);
    background: var(--accent);
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .16), 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}

.settings-toggle input:checked + .settings-toggle-ui::after {
    transform: translateX(20px);
}

.settings-toggle input:focus-visible + .settings-toggle-ui {
    outline: 2px solid color-mix(in srgb, var(--blue) 60%, transparent);
    outline-offset: 2px;
}

.btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 14px;
    border: 0;
    border-radius: 11px;
    background: var(--nav);
    color: #fff;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, .16);
}

.btn.secondary {
    background: #eef3f8;
    color: var(--ink);
    box-shadow: none;
}

.btn.warn {
    background: var(--warning-soft);
    color: var(--warning);
    box-shadow: none;
}

.btn.danger {
    background: var(--danger);
}

.btn.small {
    min-height: 30px;
    padding: 6px 9px;
    font-size: 12px;
}

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

.btn .nav-icon {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
    color: currentColor;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soft-action-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 9999;
    max-width: min(420px, calc(100vw - 44px));
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--nav);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 18px 50px rgba(15, 23, 42, .22);
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity .16s ease, transform .16s ease;
}

.soft-action-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.soft-action-toast.success {
    background: var(--accent-strong);
}

.soft-action-toast.error {
    background: var(--danger);
}

.actions.compact { gap: 6px; }

.inline-form { display: inline; }

.table-wrap {
    overflow-x: visible;
    max-width: 100%;
}

.dt-processing,
.dataTables_processing {
    display: none !important;
}

table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th,
td {
    padding: 12px 11px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}

th {
    background: #f1f5f9;
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

tbody tr {
    transition: background .14s ease;
}

tbody tr:hover {
    background: #fbfdff;
}

th:first-child { border-top-left-radius: 14px; }
th:last-child { border-top-right-radius: 14px; }
tr:last-child td { border-bottom: 0; }

.badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 10px;
    background: var(--accent-soft);
    color: var(--accent-strong);
    font-size: 12px;
    font-weight: 950;
}

.badge.off {
    background: var(--danger-soft);
    color: #9b2f2f;
}

.badge.warn {
    background: var(--warning-soft);
    color: var(--warning);
}

.badge.neutral {
    background: #eef3f8;
    color: var(--ink-soft);
}

.gateway-error-text {
    display: block;
    margin-top: 4px;
    color: #9b2f2f;
    font-weight: 700;
    max-width: 360px;
    white-space: normal;
}

.market-proxy-log-card {
    margin-top: 16px;
}

.market-proxy-table {
    table-layout: fixed;
}

.market-proxy-table th:nth-child(1),
.market-proxy-table td:nth-child(1) {
    width: 170px;
}

.market-proxy-table th:nth-child(2),
.market-proxy-table td:nth-child(2) {
    width: 160px;
}

.market-proxy-table th:nth-child(3),
.market-proxy-table td:nth-child(3) {
    width: 430px;
}

.market-proxy-table th:nth-child(4),
.market-proxy-table td:nth-child(4) {
    width: 130px;
}

.market-proxy-table th:nth-child(6),
.market-proxy-table td:nth-child(6) {
    width: 190px;
}

.market-proxy-table td:first-child strong,
.market-proxy-table td:first-child small {
    display: block;
}

.market-proxy-table td:first-child small,
.market-proxy-table td:nth-child(3) small {
    margin-top: 4px;
    color: var(--muted);
    overflow-wrap: anywhere;
}

.market-proxy-mode-cell {
    min-width: 360px;
}

.proxy-mode-stack {
    display: grid;
    gap: 8px;
    align-items: start;
}

.proxy-mode-line {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.proxy-mode-line .badge {
    flex: 0 0 auto;
}

.proxy-mode-line small {
    min-width: 0;
}

.market-proxy-table .table-actions {
    flex-wrap: nowrap;
}

.market-proxy-log-wrap {
    max-height: 460px;
    overflow: auto;
}

.market-proxy-log-table {
    min-width: 1040px;
}

.market-proxy-log-table code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    color: var(--ink-soft);
}

.market-proxy-log-details summary {
    cursor: pointer;
    color: var(--ink);
    font-weight: 800;
}

.market-proxy-log-details pre {
    max-width: 520px;
    max-height: 280px;
    margin: 8px 0 0;
    padding: 10px;
    border-radius: 7px;
    background: #0b1220;
    color: #e5edf8;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 11px;
    line-height: 1.45;
}

.cycle-data {
    display: grid;
    gap: 2px;
    min-width: 190px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.cycle-data span:first-child {
    color: var(--muted);
    font-weight: 500;
}

.cycle-data strong {
    color: var(--ink);
    font-weight: 760;
}

.cycle-data .cycle-last-error,
.cycle-data .cycle-last-error strong,
.cycle-error {
    color: var(--danger);
}

.cycle-error {
    max-width: 260px;
    font-weight: 760;
}

.btn.secondary.has-errors {
    background: var(--danger-soft);
    color: #9b2f2f;
}

table[data-country-filter] th:nth-child(2),
table[data-country-filter] td:nth-child(2),
table[data-country-filter] th:nth-child(3),
table[data-country-filter] td:nth-child(3) {
    text-align: center;
    vertical-align: middle;
}

table[data-country-filter] td {
    vertical-align: middle;
}

table[data-country-filter] td:nth-child(3) .switch-control {
    margin-inline: auto;
}

.legacy-favorite-toggle {
    width: 32px;
    height: 32px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #fff;
    color: #94a3b8;
    cursor: pointer;
    transition: color .14s ease, background .14s ease, border-color .14s ease, transform .14s ease;
}

.legacy-favorite-toggle:hover {
    color: #a16207;
    background: #fff8e1;
    border-color: #f4d47c;
}

.legacy-favorite-toggle.is-active {
    color: #b7791f;
    background: #fff4c7;
    border-color: #f1cd67;
}

.legacy-favorite-toggle.is-active .nav-icon {
    fill: currentColor;
}

.legacy-favorite-toggle:disabled {
    opacity: .6;
    cursor: progress;
}

.legacy-favorite-toggle .nav-icon {
    width: 18px;
    height: 18px;
    color: inherit;
}

.test-output {
    display: grid;
    gap: 4px;
    max-width: 520px;
    color: var(--muted);
    font-size: 12px;
}

.test-output strong {
    color: var(--ink);
}

.row-error {
    margin-top: 8px;
    max-width: 360px;
    color: var(--danger);
    font-size: 12px;
}

.candidate-stack {
    display: grid;
    gap: 12px;
}

.candidate-row {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(190px, 1.1fr) minmax(180px, 1fr) auto;
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-soft);
}

.account-menu {
    position: relative;
}

.account-menu-trigger {
    cursor: pointer;
}

.account-menu-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 80;
    min-width: 210px;
    display: none;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.account-menu.is-open .account-menu-panel {
    display: grid;
    gap: 4px;
}

.nova-identity .account-menu-panel a {
    min-height: 34px;
    justify-content: flex-start;
    border: 0;
    border-radius: 7px;
    padding: 0 10px;
    color: var(--ink-soft);
}

.nova-identity .account-menu-panel a:hover {
    background: var(--surface-soft);
    color: var(--ink);
}

.candidate-row textarea {
    min-height: 48px;
}

.candidate-remove {
    min-height: 48px;
}

.modal-open {
    overflow: hidden;
}

.modal-shell {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, visibility .18s ease;
}

.modal-shell.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modal-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(17, 24, 39, .42);
    backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity .18s ease;
    cursor: default;
}

.modal-shell.is-open .modal-backdrop {
    opacity: 1;
}

.modal-card {
    position: relative;
    z-index: 1;
    width: min(720px, 100%);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: 0 30px 90px rgba(15, 23, 42, .24);
    opacity: 0;
    transform: translateY(10px) scale(.985);
    transition: opacity .2s ease, transform .2s ease;
    scrollbar-gutter: stable;
}

.modal-card.wide {
    width: min(1040px, 100%);
}

.remote-modal-card.wide {
    width: min(1120px, 100%);
}

.remote-modal-card.xl-modal {
    width: min(1320px, calc(100vw - 40px));
}

.modal-card.small-modal {
    width: min(460px, 100%);
}

.modal-shell.is-open .modal-card {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.submit-confirm-shell {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: grid;
    place-items: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, visibility .18s ease;
}

.submit-confirm-shell.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.submit-confirm-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(15, 23, 42, .52);
    backdrop-filter: blur(8px);
}

.submit-confirm-card {
    position: relative;
    z-index: 1;
    width: min(520px, 100%);
    display: grid;
    gap: 12px;
    padding: 22px;
    border: 1px solid #fecaca;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
}

.submit-confirm-card h2 {
    margin: 0;
    color: #111827;
    font-size: 24px;
    line-height: 1.1;
}

.submit-confirm-card p {
    margin: 0;
    color: #475467;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.45;
}

.submit-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 8px;
}

.modal-loading {
    min-height: 180px;
    display: grid;
    align-content: center;
    gap: 8px;
}

.modal-form-alert {
    padding: 12px 14px;
    border: 1px solid #f4c7c7;
    border-radius: 12px;
    background: #fff4f4;
    color: #a52a2a;
    font-size: 13px;
    font-weight: 850;
}

.modal-form-alert.success {
    border-color: #b9eadf;
    background: #f0fffb;
    color: #0f735f;
}

.remote-modal-card > .data-card {
    border-radius: 16px;
    box-shadow: none;
}

.remote-modal-card .lf-two-col {
    grid-template-columns: minmax(0, 1fr) minmax(300px, .78fr);
}

.toolbar-card {
    padding-top: 14px;
    padding-bottom: 14px;
}

.toolbar-card .section-head {
    margin-bottom: 0;
}

.toolbar-card h2 {
    margin-bottom: 0;
}

.form-section-title {
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.form-section-title:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.actions-col {
    width: 220px;
}

table th.actions-col:last-child,
table td:last-child .subscription-edit-actions {
    min-width: 520px;
}

.table-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}

.table-actions.inline-actions {
    flex-wrap: nowrap;
}

.table-actions.inline-actions select {
    min-width: 130px;
    min-height: 34px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.subscription-edit-actions,
.subscription-inline-edit {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.table-actions.inline-actions.subscription-edit-actions {
    flex-wrap: wrap;
}

.subscription-inline-edit input,
.subscription-inline-edit select {
    width: auto;
    min-width: 128px;
    min-height: 34px;
    padding: 8px 10px;
    border-radius: 8px;
}

.subscription-inline-edit input[type="date"] {
    min-width: 134px;
}

.plan-editor-grid {
    align-items: stretch;
}

.plan-editor-card {
    display: grid;
    gap: 12px;
}

.plan-editor-form {
    display: grid;
    gap: 10px;
}

.plan-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.plan-editor-form .btn {
    min-height: 48px;
    align-self: stretch;
}

.plan-delete-form {
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
    border-top: 1px solid var(--line);
}

.table-actions .btn,
.table-actions form {
    width: max-content;
}

td .row-error {
    margin-top: 8px;
}

.legacy-switches {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
    padding: 2px 0;
}

.legacy-url-panel {
    display: grid;
    gap: 9px;
    padding: 0;
    border: 0;
    background: transparent;
    min-width: 0;
}

.legacy-url-panel.is-collapsed {
    display: none;
}

.legacy-url-panel .section-head {
    margin-bottom: 0;
}

.add-legacy-url {
    justify-self: end;
}

.legacy-url-rows {
    display: grid;
    gap: 9px;
}

.legacy-url-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 40px 10px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    min-width: 0;
}

.legacy-url-row .form-row:first-child,
.legacy-url-row .form-row:nth-child(3) {
    grid-column: 1 / -1;
}

.legacy-url-row textarea {
    min-height: 58px;
}

.legacy-row-active {
    min-height: 43px;
    align-items: center;
}

.method-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
}

.method-control .reload-legacy-methods {
    min-height: 43px;
}

.legacy-url-remove {
    position: absolute;
    top: 8px;
    right: 8px;
    min-height: 26px;
}

@media (max-width: 1320px) {
    .legacy-url-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .legacy-url-row .form-row:first-child,
    .legacy-url-row .form-row:nth-child(3) {
        grid-column: auto;
    }
}

.modal-card-wide {
    width: min(960px, calc(100vw - 40px));
}

.modal-card-results {
    width: min(1280px, calc(100vw - 40px));
}

.modal-card-results .modal-head {
    align-items: center;
    margin-bottom: 14px;
}

.modal-card-results .modal-head > div:first-child {
    min-width: 0;
    margin-right: auto;
}

.modal-card-results .filter-control {
    min-width: 180px;
}

.modal-card-results .dt-layout-row:first-child {
    margin-bottom: 8px;
}

.modal-card-results .dt-layout-row:last-child {
    justify-content: space-between;
    padding-top: 12px;
}

.legacy-test-modal-card {
    width: min(1500px, calc(100vw - 32px));
    height: auto;
    max-height: calc(100vh - 32px);
    display: flex;
    flex-direction: column;
}

.legacy-test-frame {
    flex: none;
    width: 100%;
    height: min(760px, calc(100vh - 170px));
    min-height: 360px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
}

.embedded-legacy-test {
    margin: 0;
    padding: 18px;
    background: #f4f6f9;
}

.step-divider {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.snapshot-choice-list {
    display: grid;
    gap: 10px;
}

.snapshot-choice {
    display: grid;
    grid-template-columns: minmax(160px, 240px) 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    color: var(--ink);
    text-decoration: none;
}

.snapshot-choice span {
    color: var(--muted);
    overflow-wrap: anywhere;
}

.snapshot-choice small {
    color: var(--muted);
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
}

.snapshot-inline-status {
    padding: 12px;
    border: 1px solid #b9eadc;
    border-radius: 8px;
    background: #f0fbf7;
    color: #075c45;
}

.download-confirm-panel {
    min-height: calc(100vh - 170px);
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 18px;
    padding: 18px 32px 46px;
}

.download-confirm-panel h2 {
    margin: 0 0 6px;
    color: var(--ink);
    font-size: clamp(24px, 2.2vw, 36px);
    line-height: 1.15;
    text-align: center;
}

.confirm-url-box {
    position: relative;
    width: min(1080px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--shadow-soft);
}

.confirm-url-box input {
    min-height: 64px;
    padding: 8px 14px;
    border: 0;
    background: transparent;
    color: var(--ink);
    font-weight: 900;
    font-size: clamp(22px, 2.55vw, 38px);
    line-height: 1.2;
    text-align: center;
}

.confirm-url-box input:disabled {
    opacity: 1;
    -webkit-text-fill-color: var(--ink);
}

.confirm-url-box input:not(:disabled) {
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    background: var(--surface-soft);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .08);
}

.confirm-url-tools {
    align-self: stretch;
    display: inline-grid;
    grid-auto-flow: column;
    gap: 6px;
}

.confirm-url-tools .icon-btn {
    width: 64px;
    height: 100%;
    min-height: 64px;
    border-radius: 10px;
    font-size: 18px;
}

.confirm-url-tools .icon-btn[disabled] {
    opacity: .55;
    pointer-events: none;
}

.confirm-url-tools .is-hidden {
    display: none;
}

.confirm-url-box small {
    grid-column: 1 / -1;
    min-height: 16px;
    color: var(--muted);
    font-weight: 760;
    text-align: center;
}

.confirm-url-box small.is-error {
    color: var(--danger);
}

.confirm-url-box small.is-success {
    color: var(--accent-strong);
}

.download-confirm-actions {
    display: flex;
    justify-content: center;
    gap: 22px;
    margin-top: 4px;
}

.download-confirm-actions .btn {
    min-width: 170px;
    min-height: 52px;
    justify-content: center;
    font-size: 15px;
}

.snapshot-inline-status {
    padding: 12px;
    font-size: 12px;
    font-weight: 800;
}

.review-shell {
    position: relative;
    min-height: 520px;
}

.review-shell.is-refreshing::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    border-radius: inherit;
    background: rgba(255, 255, 255, .58);
    backdrop-filter: blur(2px);
}

.review-shell.is-refreshing::before {
    content: "";
    position: absolute;
    z-index: 5;
    top: 50%;
    left: 50%;
    width: 34px;
    height: 34px;
    border: 3px solid #d8e1eb;
    border-top-color: var(--nav);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: spin .75s linear infinite;
}

.review-shell.is-refreshing .review-workbench,
.review-shell.is-refreshing .review-empty {
    opacity: .55;
    transition: opacity .15s ease;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.review-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
    gap: 16px;
    align-items: stretch;
}

.review-workbench[hidden],
.review-empty[hidden] {
    display: none !important;
}

.review-source-card,
.review-action-card,
.review-empty {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.review-source-card {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 18px;
    padding: 16px;
    align-items: start;
}

.review-source-media {
    aspect-ratio: 1;
    border-radius: 8px;
    overflow: hidden;
    background: #e8edf5;
    display: grid;
    place-items: center;
    color: var(--muted);
    font-size: 42px;
    font-weight: 950;
}

.review-source-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.review-source-card h3 {
    margin: 0 0 8px;
    font-size: 30px;
    line-height: 1.05;
}

.review-action-card {
    display: grid;
    align-content: start;
    gap: 14px;
    padding: 16px;
}

.review-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    justify-content: stretch;
    padding-top: 2px;
}

.review-actions .btn {
    min-height: 56px;
    justify-content: center;
    font-size: 15px;
    border-radius: 10px;
}

.review-actions .btn[hidden],
.btn[hidden],
[hidden] {
    display: none !important;
}

.provider-inbox-card {
    margin-bottom: 18px;
}

.provider-inbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}

.provider-inbox-item {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--text);
    text-decoration: none;
    background: #fff;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.provider-inbox-item.is-active,
.provider-inbox-item:hover {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

.provider-inbox-item span,
.provider-inbox-item em {
    color: var(--muted);
    font-style: normal;
    font-size: 13px;
}

.provider-detail-panel {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.provider-game-list {
    display: grid;
    gap: 10px;
}

.provider-game-row {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
}

.review-source-media.mini {
    width: 56px;
    height: 56px;
    min-height: 56px;
    border-radius: 8px;
}

.provider-game-row strong,
.provider-game-row span,
.provider-game-status small {
    display: block;
}

.provider-game-row span,
.provider-game-status small {
    color: var(--muted);
    font-size: 13px;
}

.provider-game-status {
    text-align: right;
}

.provider-admin-grid {
    margin-bottom: 18px;
}

.provider-command-card {
    display: grid;
    gap: 16px;
    padding: 20px;
    margin-bottom: 18px;
}

.provider-command-head {
    margin-bottom: 0;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.provider-command-head h2 {
    margin-bottom: 4px;
}

.provider-command-grid {
    display: grid;
    grid-template-columns: minmax(320px, 1.3fr) minmax(260px, .85fr) minmax(300px, 1fr);
    gap: 12px;
    align-items: stretch;
}

.provider-command-panel {
    min-height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    align-content: start;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.provider-command-panel label {
    color: var(--ink);
    font-weight: 950;
}

.provider-command-panel input,
.provider-command-panel select {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    border-radius: 8px;
}

.provider-search-row {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto auto;
    gap: 8px;
}

.games-command-grid {
    grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
}

.games-search-actions {
    grid-template-columns: auto auto minmax(0, 1fr);
    justify-content: start;
}

.games-catalog-filter {
    width: min(100%, 540px);
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(180px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.games-catalog-filter input,
.games-catalog-filter select {
    min-height: 38px;
    padding: 8px 10px;
    border-radius: 8px;
}

.provider-inline-alias-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.provider-inline-alias-form input,
.provider-inline-alias-form select {
    min-height: 38px;
    padding: 8px 10px;
    border-radius: 10px;
}

.provider-create-form {
    display: flex;
    align-items: center;
    justify-content: center;
}

.provider-catalog-title {
    min-width: 220px;
    max-height: 46px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    overflow: hidden;
}

.provider-logo-thumb {
    width: 46px;
    height: 46px;
    min-width: 46px;
    max-width: 46px;
    min-height: 46px;
    max-height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f3f6fa;
    color: var(--muted);
    overflow: hidden;
}

.provider-logo-thumb img,
.provider-logo-thumb .provider-logo-img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block;
    object-fit: contain !important;
}

.provider-logo-thumb .nav-icon {
    width: 20px;
    height: 20px;
}

.provider-logo-editor {
    min-width: 280px;
}

.provider-logo-editor summary {
    width: max-content;
    cursor: pointer;
    list-style: none;
}

.provider-logo-editor summary::-webkit-details-marker {
    display: none;
}

.provider-logo-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(160px, .8fr) auto auto;
    gap: 8px;
    align-items: center;
    margin-top: 8px;
}

.provider-logo-form input[type="text"],
.provider-logo-form input:not([type]) {
    min-height: 38px;
    padding: 8px 10px;
    border-radius: 10px;
}

.provider-logo-form input[type="file"] {
    max-width: 190px;
    font-size: 12px;
}

.provider-logo-clear {
    margin: 0;
    white-space: nowrap;
}

.table-count-cell,
.table-action-cell {
    text-align: center;
    vertical-align: middle;
}

.link-button {
    border: 0;
    background: transparent;
    color: var(--nav);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.provider-games-modal-card {
    width: min(1180px, calc(100vw - 32px));
}

.provider-modal-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 14px;
}

.provider-modal-toolbar strong,
.provider-modal-toolbar small {
    display: block;
}

.provider-modal-toolbar small {
    color: var(--muted);
    margin-top: 4px;
}

.provider-modal-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.provider-modal-actions .btn {
    min-height: 34px;
}

.provider-modal-game-thumb {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e9eef6;
    color: var(--muted);
    font-weight: 950;
    overflow: hidden;
}

.provider-modal-game-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.provider-modal-game-title {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.provider-modal-game-title strong,
.provider-modal-game-title small,
.provider-catalog-check small,
[data-provider-games-table] td small {
    display: block;
}

.provider-modal-game-title small,
.provider-catalog-check small,
[data-provider-games-table] td small {
    color: var(--muted);
    font-size: 13px;
}

.provider-catalog-check {
    min-width: 260px;
}

.provider-hidden-filter {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

[data-provider-games-table] th:first-child,
[data-provider-games-table] td:first-child {
    width: 42px;
    text-align: center;
}

.alias-pill-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.game-catalog-title {
    min-width: 260px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.game-catalog-title strong,
.game-catalog-title small {
    display: block;
}

.game-catalog-title small {
    color: var(--muted);
    font-size: 13px;
}

.game-thumb {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e9eef6;
    color: var(--muted);
    overflow: hidden;
}

.game-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.game-thumb .nav-icon {
    width: 22px;
    height: 22px;
}

.review-empty {
    padding: 70px 44px;
    text-align: center;
    background: #f8fafc;
}

.review-empty h3 {
    margin: 0 0 8px;
    font-size: 28px;
}

.review-select-option {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-items: center;
    min-height: 48px;
}

.review-select-option img,
.review-select-option > span:first-child {
    grid-row: 1 / span 2;
    width: 42px;
    height: 42px;
    border-radius: 7px;
    object-fit: cover;
    background: #e8edf5;
}

.review-select-option strong {
    min-width: 0;
    color: var(--ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-select-option small {
    color: var(--muted);
    font-weight: 700;
}

.review-select-selection {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .review-select-option strong,
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .review-select-option small {
    color: #fff;
}

@media (max-width: 1100px) {
    .review-workbench,
    .review-source-card {
        grid-template-columns: 1fr;
    }

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

    .review-source-media {
        width: min(220px, 100%);
    }
}

.snapshot-source-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.snapshot-source-tabs label {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 64px;
    padding: 12px 14px 12px 42px;
    border: 1px solid var(--line-strong);
    border-radius: 14px;
    background: linear-gradient(180deg, #fff 0%, var(--surface-soft) 100%);
    color: var(--ink);
    font-weight: 850;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.snapshot-source-tabs label::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 50%;
    width: 16px;
    height: 16px;
    border-radius: 99px;
    border: 2px solid var(--line-strong);
    background: #fff;
    transform: translateY(-50%);
}

.snapshot-source-tabs label::after {
    content: "";
    position: absolute;
    left: 19px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-radius: 99px;
    background: transparent;
    transform: translateY(-50%);
}

.snapshot-source-tabs label:hover {
    border-color: #b7c4d4;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .07);
}

.snapshot-source-tabs label.is-active {
    border-color: var(--blue);
    background: linear-gradient(180deg, #f7faff 0%, #edf4ff 100%);
    color: var(--ink);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .10);
}

.snapshot-source-tabs label.is-active::before {
    border-color: var(--blue);
}

.snapshot-source-tabs label.is-active::after {
    background: var(--blue);
}

.snapshot-source-tabs input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.snapshot-source-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.snapshot-source-copy strong {
    line-height: 1.05;
}

.snapshot-source-copy small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 760;
    line-height: 1.15;
}

.snapshot-source-panel {
    display: none;
}

.snapshot-source-panel.is-active {
    display: grid;
}

.modal-card .grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.modal-card .form-row,
.modal-card input,
.modal-card select,
.modal-card textarea,
.modal-card .select2-container {
    min-width: 0;
}

.modal-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.modal-card .module-form {
    gap: 8px;
}

.modal-card .grid,
.modal-card .module-grid {
    gap: 10px;
}

.modal-card textarea {
    min-height: 64px;
}

.icon-btn {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface-soft);
    color: var(--ink);
    font-size: 22px;
    cursor: pointer;
}

.modal-actions {
    justify-content: flex-end;
    padding-top: 4px;
}

.modal-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 12px;
}

.filter-control {
    display: grid;
    gap: 5px;
    min-width: 180px;
    color: var(--muted);
    font-size: 11px;
}

.filter-control select {
    min-height: 36px;
    padding: 7px 10px;
}

.legacy-log-filter select {
    min-height: 40px;
    padding-top: 9px;
    padding-bottom: 9px;
}

.modal-card .select2-container {
    z-index: 1001;
}

.modal-card .select2-dropdown {
    z-index: 1102;
}

.select2-container--open {
    z-index: 2400;
}

.select2-container--open .select2-dropdown {
    z-index: 2401;
}

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at 15% 12%, rgba(215, 255, 79, .22), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, #eef4fb 100%);
}

.login-card {
    width: min(430px, 100%);
    padding: 30px;
    border-radius: 26px;
    overflow: hidden;
}

.login-card .nova-logo {
    margin-bottom: 24px;
}

.login-card h1 {
    margin-bottom: 12px;
    font-size: 44px;
    line-height: .94;
}

.login-card .muted {
    margin-bottom: 22px;
}

.avatar {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 950;
}

.is-loading .content {
    opacity: .55;
    pointer-events: none;
}

.dt-container {
    display: grid;
    gap: 8px;
    min-width: 0;
    width: 100%;
}

.dt-layout-row {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.dt-layout-row:first-child {
    margin-bottom: 2px;
}

.dt-layout-row:last-child {
    justify-content: center;
    padding-top: 4px;
}

.dt-layout-cell {
    display: flex !important;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.dt-layout-cell.dt-layout-end {
    margin-left: auto;
    justify-content: flex-end;
    flex: 1 1 auto;
}

.dt-length label,
.dt-search label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 760;
    white-space: nowrap;
}

.dt-search {
    margin-left: auto;
    max-width: 100%;
}

.dt-filter-with-provider {
    display: grid !important;
    grid-template-columns: minmax(346px, 386px) minmax(220px, 220px);
    justify-content: end;
    align-items: end;
    gap: 10px;
}

.games-datatable-filter {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 76px;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.games-datatable-filter label {
    grid-column: 1 / -1;
    margin: 0 0 -2px;
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 760;
    white-space: nowrap;
}

.games-datatable-filter select {
    min-height: 36px;
    width: 100%;
    min-width: 0;
    max-width: none;
    padding: 7px 30px 7px 10px;
    border-radius: 7px;
    background: #fff;
    font-size: 13px;
}

.games-datatable-filter .select2-container {
    width: 100% !important;
    min-width: 0;
    max-width: none;
}

.games-datatable-filter .btn,
.dt-filter-with-provider .dt-search input {
    min-height: 44px;
    height: 44px;
}

.dt-filter-with-provider .dt-search {
    width: 220px;
    margin-left: 0;
}

.dt-filter-with-provider .dt-search input {
    width: 220px;
}

.dt-filter-with-provider .dt-search label {
    width: 100%;
}

.dt-filter-with-provider .select2-container--default .select2-selection--single {
    min-height: 44px;
    height: 44px;
}

.dt-filter-with-provider .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px;
}

.dt-filter-with-provider .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}

.dt-paging,
.dt-paging nav {
    display: flex !important;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.dt-search input,
.dt-length select {
    min-height: 36px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #fff;
    font-size: 13px;
    line-height: 1.2;
}

.dt-length select {
    width: auto;
    min-width: 84px;
    padding-right: 28px;
}

.dt-search input {
    width: min(220px, 100%);
}

.dt-search input::placeholder {
    color: #7b8797;
    opacity: 1;
}

.dt-paging-button {
    min-width: 30px !important;
    height: 30px !important;
    border: 0 !important;
    border-radius: 7px !important;
    padding: 0 10px !important;
    margin: 0 1px !important;
    background: #eef3f8 !important;
    color: var(--ink) !important;
    opacity: 1 !important;
    text-indent: 0 !important;
    overflow: visible !important;
    line-height: 30px !important;
    font-weight: 760 !important;
}

.dt-paging-button.current {
    background: #e7edf5 !important;
    color: var(--ink) !important;
    box-shadow: inset 0 0 0 1px #cbd6e3 !important;
}

.dt-paging-button.disabled,
.dt-paging-button:disabled {
    color: #7c8798 !important;
    background: #f3f6fa !important;
    opacity: 1 !important;
}

@media (max-width: 1180px) {
    .table-wrap {
        overflow-x: auto;
    }

    .grid.two,
    .grid.three,
    .module-grid,
    .provider-command-grid,
    .provider-logo-form {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .provider-search-row,
    .games-catalog-filter {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    .nova-topbar {
        position: static;
        grid-template-columns: 1fr;
    }

    .nova-command {
        justify-self: stretch;
    }

    .nova-identity {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .project-switcher {
        width: 100%;
        max-width: 100%;
    }

    .nova-layout {
        grid-template-columns: 1fr;
    }

    .nova-sidebar,
    .sidebar {
        position: static;
        height: auto;
        padding: 14px;
    }

    .nova-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nova-hero {
        min-height: 0;
        align-items: flex-start;
        flex-direction: column;
    }

    .summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .workbench-card {
        grid-template-columns: 1fr;
    }

    .workbench-actions {
        justify-content: flex-start;
    }

    .candidate-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 580px) {
    .nova-topbar,
    .nova-main,
    .content {
        padding-left: 16px;
        padding-right: 16px;
    }

    .nova-nav,
    .summary-strip {
        grid-template-columns: 1fr;
    }

    h1 {
        font-size: 34px;
    }
}

/* Premium density pass: quieter type, sharper surfaces, less visual noise. */
:root {
    --page: #f4f5f7;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --ink: #111827;
    --ink-soft: #374151;
    --muted: #6b7280;
    --faint: #9ca3af;
    --line: #e5e7eb;
    --line-strong: #d1d5db;
    --nav: #111827;
    --nav-soft: #1f2937;
    --accent: #334155;
    --accent-strong: #1f2937;
    --accent-soft: #eef2f7;
    --lime: #f8fafc;
    --blue: #2563eb;
    --blue-soft: #eff6ff;
    --danger: #b91c1c;
    --danger-soft: #fef2f2;
    --shadow-sm: 0 1px 2px rgba(23, 23, 23, .04), 0 8px 22px rgba(23, 23, 23, .045);
    --shadow: 0 18px 52px rgba(23, 23, 23, .10);
}

body {
    background: var(--page);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 13px;
    line-height: 1.38;
    font-weight: 400;
}

strong,
label,
.btn,
.badge,
.module-kicker,
.eyebrow,
th {
    font-weight: 650;
}

h1 {
    font-size: clamp(28px, 2.3vw, 38px);
    line-height: 1;
    letter-spacing: -.025em;
    font-weight: 720;
}

h2 {
    font-size: 18px;
    letter-spacing: -.012em;
    font-weight: 680;
}

h3 {
    font-size: 15px;
    font-weight: 650;
}

.nova-shell {
    grid-template-rows: 58px minmax(0, 1fr);
}

.nova-topbar {
    grid-template-columns: var(--sidebar-width) minmax(360px, 1fr) minmax(210px, 300px);
    min-width: 0;
    gap: 24px;
    padding: 7px clamp(18px, 2.4vw, 34px) 7px 0;
    background: rgba(255, 255, 255, .92);
}

.nova-brand {
    width: calc(100% - 1px);
    min-height: 58px;
    align-self: stretch;
    padding: 8px 12px;
    margin: -7px 0 -7px 0;
    background: var(--nav);
    justify-content: center;
}

.nova-brand-logo {
    width: min(100%, 176px);
    max-width: 176px;
    max-height: 30px;
    transform: translateY(2px);
}

.nova-logo {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    box-shadow: none;
    font-size: 12px;
}

.nova-brand strong,
.nova-identity strong {
    font-size: 13px;
    font-weight: 680;
}

.nova-brand small,
.nova-identity small {
    font-size: 11px;
    font-weight: 520;
}

.nova-command {
    width: min(100%, 420px);
    min-height: 34px;
    border-radius: 8px;
    background: var(--surface-soft);
    font-weight: 520;
}

.nova-identity {
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
    display: flex;
    align-items: center;
}

.nova-identity > span {
    min-width: 0;
}

.topbar-icon-button {
    position: relative;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.topbar-icon-button:hover,
.topbar-icon-button:focus {
    background: var(--surface-soft);
    border-color: #cbd5e1;
    outline: none;
}

.topbar-icon-button .nav-icon {
    width: 18px;
    height: 18px;
    color: currentColor;
    stroke: currentColor;
}

.topbar-count {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    border: 2px solid #fff;
    background: #0f8b73;
    color: #fff;
    font-size: 10px;
    font-weight: 850;
    line-height: 1;
}

.topbar-count.is-alert {
    background: #b42318;
}

.topbar-count.is-hidden {
    display: none;
}

.notifications-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 98;
    border: 0;
    background: rgba(15, 23, 42, .24);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}

.notifications-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    width: min(430px, calc(100vw - 12px));
    height: 100vh;
    height: 100dvh;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 12px;
    overflow: hidden;
    padding: 18px 16px;
    border-left: 1px solid var(--line);
    background: rgba(255, 255, 255, .98);
    box-shadow: -22px 0 60px rgba(15, 23, 42, .18);
    transform: translateX(112%);
    opacity: 0;
    pointer-events: none;
    transition: transform .2s ease, opacity .2s ease;
}

body.notifications-drawer-open .notifications-drawer {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
}

body.notifications-drawer-open .notifications-drawer-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.notifications-drawer-head,
.notifications-drawer-toolbar,
.notification-card-top,
.notification-card-actions,
.notification-switch {
    display: flex;
    align-items: center;
}

.notifications-drawer-head {
    justify-content: space-between;
    gap: 14px;
}

.notifications-drawer-head h2 {
    margin: 0;
    font-size: 22px;
    letter-spacing: 0;
}

.notifications-drawer-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 760;
}

.notifications-drawer-head .icon-btn {
    border-radius: 10px;
}

.notifications-drawer-head .icon-btn .nav-icon {
    width: 17px;
    height: 17px;
}

.notifications-drawer-toolbar {
    justify-content: space-between;
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.notification-switch {
    gap: 8px;
    min-width: 0;
    cursor: pointer;
    user-select: none;
}

.notification-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.notification-switch span {
    width: 36px;
    height: 22px;
    flex: 0 0 36px;
    border-radius: 999px;
    background: #d9e2ec;
    box-shadow: inset 0 0 0 1px #cbd5e1;
    position: relative;
}

.notification-switch span::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .16);
    transition: transform .16s ease;
}

.notification-switch input:checked + span {
    background: var(--accent);
    box-shadow: inset 0 0 0 1px var(--accent-strong);
}

.notification-switch input:checked + span::after {
    transform: translateX(14px);
}

.notification-switch strong {
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}

.notification-list {
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    overflow: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
}

.notification-card {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line);
    border-left-width: 4px;
    border-radius: 8px;
    background: #fff;
}

.notification-card.is-unread {
    border-color: rgba(15, 139, 115, .34);
    border-left-color: var(--accent);
    background: #f7fffc;
}

.notification-card.is-success {
    border-left-color: #0f8b73;
}

.notification-card.is-warning {
    border-left-color: #d97706;
}

.notification-card.is-error {
    border-left-color: #b42318;
}

.notification-card-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: var(--surface-soft);
    color: #475569;
}

.notification-card-icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.notification-card.is-success .notification-card-icon {
    background: #dcfce7;
    color: #166534;
}

.notification-card.is-warning .notification-card-icon {
    background: #fffbeb;
    color: #92400e;
}

.notification-card.is-error .notification-card-icon {
    background: #fee2e2;
    color: #991b1b;
}

.notification-card-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.notification-card-top {
    justify-content: space-between;
    gap: 8px;
}

.notification-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: 14px;
    letter-spacing: 0;
}

.notification-card time {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 11px;
    font-weight: 760;
}

.notification-card p {
    margin: 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.notification-card-actions {
    flex-wrap: wrap;
    gap: 6px;
    padding-top: 2px;
}

.notification-action {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
}

.notification-action:hover,
.notification-action:focus {
    border-color: #cbd5e1;
    color: var(--ink);
    outline: 0;
}

.notification-action svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.notification-empty {
    padding: 18px;
    border: 1px dashed var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
}

.notification-toast-stack {
    position: fixed;
    top: 82px;
    right: 18px;
    z-index: 14000;
    width: min(390px, calc(100vw - 28px));
    display: grid;
    gap: 10px;
    pointer-events: none;
}

.notification-toast {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    padding: 12px;
    border: 1px solid rgba(15, 23, 42, .12);
    border-left: 4px solid #64748b;
    border-radius: 8px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 50px rgba(15, 23, 42, .18);
    opacity: 0;
    pointer-events: auto;
    transform: translateX(14px) translateY(-4px);
    transition: opacity .18s ease, transform .18s ease;
}

.notification-toast.is-visible {
    opacity: 1;
    transform: translateX(0) translateY(0);
}

.notification-toast.is-success {
    border-left-color: #0f8b73;
}

.notification-toast.is-warning {
    border-left-color: #d97706;
}

.notification-toast.is-error {
    border-left-color: #b42318;
}

.notification-toast-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: var(--surface-soft);
    color: #475569;
}

.notification-toast-icon svg,
.notification-toast-open svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.notification-toast.is-success .notification-toast-icon {
    background: #dcfce7;
    color: #166534;
}

.notification-toast.is-warning .notification-toast-icon {
    background: #fffbeb;
    color: #92400e;
}

.notification-toast.is-error .notification-toast-icon {
    background: #fee2e2;
    color: #991b1b;
}

.notification-toast-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.notification-toast-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.notification-toast-top strong {
    color: var(--ink);
    font-size: 14px;
    line-height: 1.2;
    font-weight: 900;
}

.notification-toast-top button {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.notification-toast p {
    margin: 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.38;
    overflow-wrap: anywhere;
}

.notification-toast-open {
    width: max-content;
    max-width: 100%;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--nav);
    color: #fff;
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}

.logs-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 88;
    border: 0;
    background: rgba(15, 23, 42, .22);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}

.logs-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 89;
    width: min(460px, calc(100vw - 14px));
    height: 100vh;
    height: 100dvh;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: 12px;
    overflow: hidden;
    padding: 20px 18px 16px;
    border-left: 1px solid var(--line);
    background: rgba(255, 255, 255, .98);
    box-shadow: -22px 0 60px rgba(15, 23, 42, .18);
    transform: translateX(112%);
    opacity: 0;
    pointer-events: none;
    transition: transform .2s ease, opacity .2s ease;
}

body.sidebar-collapsed .logs-drawer {
    width: min(460px, calc(100vw - 14px));
}

body.logs-drawer-open .logs-drawer {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
}

body.logs-drawer-open .logs-drawer-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.logs-drawer-head,
.logs-drawer-actions,
.log-feed-top,
.log-feed-meta {
    display: flex;
    align-items: center;
}

.logs-drawer-head {
    justify-content: space-between;
    gap: 14px;
}

.logs-drawer-head h2 {
    margin: 3px 0 0;
    font-size: 22px;
    letter-spacing: 0;
}

.logs-drawer-actions {
    gap: 8px;
}

.logs-drawer-actions .icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    color: var(--ink);
}

.logs-drawer-actions .icon-btn .nav-icon {
    width: 16px;
    height: 16px;
    color: currentColor;
    stroke: currentColor;
}

.logs-drawer-summary {
    min-height: 34px;
    display: flex;
    align-items: center;
    padding: 9px 11px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 720;
}

.log-feed-list {
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 0 4px 0 0;
}

.log-feed-item {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-left-width: 4px;
    border-radius: 8px;
    background: #fff;
}

.log-feed-item.is-success {
    border-left-color: #0f8b73;
}

.log-feed-item.is-warning {
    border-left-color: #d97706;
}

.log-feed-item.is-error {
    border-left-color: #b42318;
}

.log-feed-item.is-info {
    border-left-color: #64748b;
}

.log-feed-top {
    justify-content: space-between;
    gap: 8px;
    color: var(--muted);
    font-size: 11px;
}

.log-feed-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.log-feed-status-icon {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 24px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: #475569;
}

.log-feed-status-icon svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.log-feed-item.is-error .log-feed-status-icon {
    background: #fee2e2;
    color: #991b1b;
}

.log-feed-item.is-warning .log-feed-status-icon {
    background: #fffbeb;
    color: #92400e;
}

.log-feed-item.is-success .log-feed-status-icon {
    background: #dcfce7;
    color: #166534;
}

.log-feed-level {
    padding: 4px 7px;
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--ink);
    font-size: 10px;
    font-weight: 860;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.log-feed-item.is-error .log-feed-level {
    background: #fee2e2;
    color: #991b1b;
}

.log-feed-item.is-warning .log-feed-level {
    background: #fffbeb;
    color: #92400e;
}

.log-feed-item.is-success .log-feed-level {
    background: #dcfce7;
    color: #166534;
}

.log-feed-item h3 {
    margin: 0;
    color: var(--ink);
    font-size: 14px;
    letter-spacing: 0;
}

.log-feed-item p {
    margin: 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.45;
}

.log-feed-url {
    overflow: hidden;
    color: #475569;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.log-feed-meta {
    flex-wrap: wrap;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 680;
}

.log-feed-samples {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.log-feed-samples span {
    max-width: 100%;
    overflow: hidden;
    padding: 5px 7px;
    border-radius: 7px;
    background: var(--surface-soft);
    color: #334155;
    font-size: 11px;
    font-weight: 720;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.log-feed-empty,
.log-feed-loading {
    padding: 18px;
    border: 1px dashed var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
}

.log-feed-more {
    width: 100%;
}

@media (max-width: 900px) {
    .notifications-drawer {
        width: min(420px, calc(100vw - 10px));
        padding: 16px 12px;
    }

    .notifications-drawer-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .logs-drawer {
        top: 0;
        right: 0;
        width: min(92vw, 440px);
        padding: 16px;
        border-left: 1px solid var(--line);
    }
}

@media (max-width: 620px) {
    .logs-drawer {
        width: 100vw;
    }

    .nova-identity > span {
        display: none;
    }
}

.nova-identity a,
.status-pill,
.header-user {
    min-height: 32px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 560;
}

.avatar {
    width: 32px;
    height: 32px;
    border-radius: 8px;
}

.nova-layout {
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.nova-sidebar,
.sidebar {
    top: 58px;
    height: calc(100vh - 58px);
    padding: 18px 12px;
    background: var(--nav);
}

.nova-section-label {
    margin: 0 8px 7px;
    font-size: 10px;
    font-weight: 620;
    letter-spacing: .18em;
}

.nova-nav,
.nova-sidebar nav {
    gap: 16px;
}

.nav-group {
    gap: 4px;
    padding-bottom: 14px;
}

.nova-nav a,
.nova-sidebar nav a {
    min-height: 36px;
    padding: 0 10px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 560;
}

.nova-nav a:hover,
.nova-nav a.active,
.nova-sidebar nav a:hover,
.nova-sidebar nav a.active {
    background: var(--nav-soft);
    transform: none;
}

.nova-main,
.content {
    min-height: calc(100vh - 58px);
    display: flex;
    flex-direction: column;
    padding: 18px 24px 34px;
}

.nova-hero {
    min-height: 84px;
    align-items: center;
    margin-bottom: 14px;
    padding: 17px 18px;
    border-radius: 10px;
    background: var(--surface);
}

.eyebrow,
.module-kicker {
    color: var(--accent);
    font-size: 10px;
    letter-spacing: .12em;
}

.workspace-content,
.nova-content,
.page-body {
    gap: 14px;
}

.summary-strip {
    gap: 10px;
}

.summary-card {
    min-height: 72px;
    padding: 12px 14px;
    border-radius: 8px;
}

.summary-card span {
    font-size: 10px;
    font-weight: 620;
    letter-spacing: .13em;
}

.summary-card strong {
    font-size: 25px;
    font-weight: 650;
}

.review-summary-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.panel,
.module-card,
.data-card,
.workbench-card,
.login-card {
    border-radius: 10px;
    box-shadow: var(--shadow-sm);
}

.panel,
.module-card,
.data-card {
    padding: 16px;
}

.grid,
.module-grid {
    gap: 14px;
}

.section-head,
.module-head {
    margin-bottom: 10px;
}

form,
.module-form {
    gap: 9px;
}

.form-row label {
    top: 8px;
    left: 11px;
    font-size: 10px;
    font-weight: 620;
}

input,
select,
textarea {
    min-height: 43px;
    padding: 17px 11px 7px;
    border-radius: 7px;
    font-size: 13px;
    line-height: 1.2;
    box-shadow: none;
}

select {
    padding-top: 16px;
    padding-bottom: 7px;
}

textarea {
    min-height: 80px;
}

input:focus,
select:focus,
textarea:focus {
    box-shadow: 0 0 0 3px rgba(138, 111, 53, .12);
    border-color: rgba(138, 111, 53, .55);
}

.select2-container--default .select2-selection--single {
    height: 43px;
    border-radius: 7px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 18px 32px 6px 11px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 41px;
}

.select2-dropdown {
    border-radius: 7px;
}

.btn {
    min-height: 34px;
    padding: 8px 12px;
    border-radius: 7px;
    background: var(--ink);
    box-shadow: none;
    font-size: 12px;
}

.btn:hover {
    box-shadow: none;
}

.btn.secondary {
    background: #eef0f3;
}

.btn.danger {
    background: #a93632;
}

.btn.small {
    min-height: 28px;
    padding: 5px 8px;
    border-radius: 7px;
}

.btn.is-busy,
button.is-busy,
a.is-busy {
    position: relative;
    pointer-events: none;
    opacity: .78;
}

a.is-disabled {
    pointer-events: none;
    opacity: .55;
}

.btn.is-busy::before,
button.is-busy::before,
a.is-busy::before {
    content: "";
    width: 14px;
    height: 14px;
    margin-right: 8px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin .75s linear infinite;
}

th,
td {
    padding: 10px 10px;
}

th {
    background: #eef0f3;
    font-size: 10px;
    font-weight: 620;
}

th:first-child { border-top-left-radius: 7px; }
th:last-child { border-top-right-radius: 7px; }

.badge {
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 620;
}

.dt-search input,
.dt-length select {
    min-height: 34px;
    border-radius: 7px;
    padding: 7px 10px;
    line-height: 1.2;
}

.dt-search input::placeholder {
    color: #7b8797;
    opacity: 1;
}

.dt-length select {
    width: auto;
    min-width: 84px;
    padding-right: 28px;
}

.dt-paging-button {
    border-radius: 7px !important;
    height: 30px !important;
    padding: 0 10px !important;
    line-height: 30px !important;
}

.io-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
    gap: 14px;
    align-items: start;
}

.section-head.compact {
    align-items: center;
}

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

.tall-textarea {
    min-height: 220px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    line-height: 1.5;
}

.snapshot-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.snapshot-meta span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 650;
}

.snapshot-preview-panel {
    margin: 14px 0 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    overflow: hidden;
}

.snapshot-preview-panel.is-empty {
    padding: 14px;
    background: var(--surface-soft);
}

.snapshot-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.snapshot-preview-head strong {
    display: block;
    margin-top: 2px;
    color: var(--ink);
    font-size: 14px;
}

.snapshot-preview-frame {
    max-height: 340px;
    overflow: auto;
    background: #111827;
}

.snapshot-preview-frame img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 180px;
    object-fit: contain;
    background: #111827;
}

.snapshot-preview-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 14px;
    border-top: 1px solid var(--line);
    background: var(--surface);
}

.snapshot-preview-meta span {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 650;
}

.snapshot-preview-meta span.is-warning {
    border-color: #fecaca;
    background: #fef2f2;
    color: #991b1b;
}

.output-panel,
.debug-panel {
    max-width: 100%;
    width: 100%;
    margin: 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #0b1220;
    color: #e5edf8;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.output-panel {
    min-height: 420px;
}

.copy-panel-wrap {
    position: relative;
}

.copy-panel-wrap .output-panel {
    padding-top: 38px;
}

.copy-mini-btn {
    position: absolute;
    top: 9px;
    right: 9px;
    z-index: 2;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid rgba(229, 237, 248, .18);
    border-radius: 6px;
    background: rgba(255, 255, 255, .08);
    color: #d9e5f2;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.copy-mini-btn:hover {
    background: rgba(255, 255, 255, .14);
}

.debug-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(280px, 1fr));
    gap: 14px;
}

.debug-grid > *,
.mapping-debug-grid > * {
    min-width: 0;
}

.mapping-debug-grid {
    display: grid;
    grid-template-columns: minmax(260px, .8fr) minmax(360px, 1.2fr);
    gap: 14px;
}

.debug-panel {
    max-height: 520px;
}

@media (max-width: 1180px) {
    .io-grid,
    .debug-grid,
    .mapping-debug-grid,
    .ai-settings-grid,
    .grid.three {
        grid-template-columns: 1fr;
    }
}

[hidden],
.btn[hidden],
.review-actions .btn[hidden] {
    display: none !important;
}

.form-row:has(> select),
.form-row:has(> .select2-container) {
    display: block;
}

.form-row:has(> select) label,
.form-row:has(> .select2-container) label {
    position: absolute;
    top: 8px;
    left: 11px;
    z-index: 8;
    color: var(--muted);
    font-size: 10px;
    font-weight: 620;
    line-height: 1;
    pointer-events: none;
}

.form-row.is-floating-label:has(> select) label,
.form-row.is-floating-label:has(> .select2-container) label {
    position: absolute;
}

select {
    height: 43px;
    min-height: 43px;
    padding: 0 34px 0 11px;
    line-height: 43px;
}

.form-row select {
    padding-top: 16px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.provider-command-panel select,
.provider-inline-alias-form select,
.modal-card select {
    height: 43px;
    min-height: 43px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 43px;
}

.modal-card .form-row select,
.form-row select {
    padding-top: 16px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.select2-container--default .select2-selection--single {
    height: 43px;
    min-height: 43px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 43px;
}

.form-row .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-top: 16px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 41px;
}

.dt-length select {
    height: 34px;
    min-height: 34px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 34px;
}

.form-row.is-floating-label {
    position: relative;
    display: block;
}

.form-row.is-floating-label label {
    position: absolute;
    top: 50%;
    left: 11px;
    z-index: 8;
    padding: 0 3px;
    color: var(--muted);
    background: var(--surface);
    font-size: 13px;
    font-weight: 620;
    line-height: 1;
    transform: translateY(-50%);
    transition: top .14s ease, transform .14s ease, font-size .14s ease, color .14s ease;
    pointer-events: none;
}

.form-row.is-floating-label:has(> textarea) label,
.form-row.is-floating-label:has(> select) label,
.form-row.is-floating-label:has(> .select2-container) label,
.form-row.is-floating-label.has-value label,
.form-row.is-floating-label.is-focused label {
    top: 8px;
    transform: none;
    font-size: 10px;
}

.form-row.is-floating-label input,
.form-row.is-floating-label select,
.form-row.is-floating-label textarea,
.modal-card .form-row.is-floating-label select {
    padding-top: 16px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.form-row.is-floating-label input::placeholder,
.form-row.is-floating-label textarea::placeholder {
    color: transparent;
}

.form-row.is-floating-label.is-focused input::placeholder,
.form-row.is-floating-label.is-focused textarea::placeholder {
    color: transparent;
}

.form-row.is-floating-label .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-top: 16px;
    padding-bottom: 5px;
    line-height: 1.2;
}

.select2-container--default .select2-results__option--disabled {
    color: var(--faint);
    background: #f3f5f8;
    cursor: not-allowed;
}

.dashboard-summary-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-flow-card .section-head {
    margin-bottom: 0;
}

.dashboard-flow-card .muted {
    margin-bottom: 0;
}

.dashboard-intel-grid,
.dashboard-ops-grid {
    display: grid;
    gap: 16px;
}

.dashboard-intel-grid {
    grid-template-columns: minmax(280px, .9fr) minmax(420px, 1.4fr);
}

.dashboard-ops-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.intel-panel {
    position: relative;
    overflow: hidden;
    min-height: 220px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(15, 23, 42, .035), transparent 42%),
        var(--surface);
    box-shadow: var(--shadow-sm);
}

.intel-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(15, 23, 42, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, .035) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(135deg, rgba(0, 0, 0, .7), transparent 62%);
}

.intel-panel > * {
    position: relative;
    z-index: 1;
}

.signal-panel {
    display: grid;
    gap: 16px;
}

.signal-orb {
    width: min(210px, 70vw);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    justify-self: center;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 50%, var(--surface) 0 48%, transparent 49%),
        conic-gradient(var(--nav) calc(var(--score) * 1%), #e9eef5 0);
    box-shadow: inset 0 0 0 1px var(--line), 0 20px 50px rgba(15, 23, 42, .08);
}

.signal-orb div {
    width: 58%;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    align-content: center;
    border-radius: 50%;
    background: var(--surface);
    box-shadow: inset 0 0 0 1px var(--line);
}

.signal-orb strong {
    font-size: 42px;
    line-height: .9;
    letter-spacing: -.06em;
}

.signal-orb span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 760;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.signal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.signal-grid span {
    min-height: 42px;
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background:
        linear-gradient(90deg, rgba(17, 24, 39, .10) calc(var(--value) * 1%), transparent 0),
        var(--surface-soft);
    color: var(--ink-soft);
    font-weight: 650;
}

.signal-grid strong {
    color: var(--ink);
    font-size: 12px;
}

.flow-bars {
    display: grid;
    gap: 12px;
}

.flow-row {
    display: grid;
    grid-template-columns: minmax(160px, .9fr) minmax(160px, 1fr) 52px;
    gap: 12px;
    align-items: center;
}

.flow-row span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--ink-soft);
    font-weight: 650;
}

.flow-row .nav-icon {
    width: 16px;
    height: 16px;
    color: var(--muted);
}

.flow-track {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf1f6;
}

.flow-track i {
    height: 100%;
    display: block;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--nav), #64748b);
}

.flow-row strong {
    text-align: right;
    font-size: 16px;
}

.pulse-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.pulse-list div {
    min-height: 110px;
    display: grid;
    align-content: space-between;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-soft);
}

.pulse-list span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 760;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.pulse-list strong {
    font-size: 34px;
    letter-spacing: -.05em;
}

.ai-panel {
    display: grid;
    align-content: space-between;
}

.ai-meter {
    min-height: 118px;
    display: grid;
    place-items: center;
    align-content: center;
    margin: 14px 0;
    border: 1px solid var(--line);
    border-radius: 16px;
    background:
        radial-gradient(circle at 50% 0, rgba(37, 99, 235, .12), transparent 54%),
        var(--surface-soft);
}

.ai-meter span {
    font-size: 46px;
    line-height: 1;
    letter-spacing: -.06em;
    font-weight: 760;
}

.ai-meter small {
    color: var(--muted);
    font-weight: 650;
}

.signal-toolbar-card {
    padding: 14px;
}

.signal-toolbar {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr)) auto;
    gap: 12px;
    align-items: end;
}

.signal-toolbar .form-row {
    min-width: 0;
}

.signal-refresh-btn {
    min-height: 44px;
    white-space: nowrap;
}

.signal-summary-strip {
    grid-template-columns: repeat(5, minmax(120px, 1fr));
}

.signal-main-grid,
.signal-rank-grid {
    display: grid;
    gap: 16px;
}

.signal-main-grid {
    grid-template-columns: minmax(360px, 1.4fr) minmax(300px, .8fr);
}

.signal-rank-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.signal-timeline-panel,
.signal-alert-panel {
    min-height: 330px;
}

.signal-big-chart {
    min-height: 236px;
    display: grid;
    align-items: end;
}

.signal-bars {
    min-height: 224px;
    display: flex;
    align-items: end;
    gap: 8px;
    padding: 14px 4px 0;
    border-bottom: 1px solid var(--line);
}

.signal-bars span {
    min-width: 18px;
    flex: 1 1 18px;
    display: grid;
    grid-template-rows: minmax(0, 1fr) 22px;
    gap: 7px;
    align-items: end;
}

.signal-bars i {
    width: 100%;
    height: var(--bar);
    min-height: 6px;
    display: block;
    border-radius: 7px 7px 0 0;
    background: linear-gradient(180deg, #2563eb, var(--accent));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32);
}

.signal-bars small {
    overflow: hidden;
    color: var(--muted);
    font-size: 10px;
    font-weight: 760;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.signal-table-list,
.signal-mini-list,
.signal-alert-list {
    display: grid;
    gap: 9px;
}

.signal-rank-row {
    min-height: 66px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 126px 116px;
    gap: 12px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft);
}

.signal-rank-row.has-thumb {
    grid-template-columns: 34px 46px minmax(0, 1fr) 126px 116px;
}

.signal-rank-row > strong {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink-soft);
    box-shadow: inset 0 0 0 1px var(--line);
    font-size: 12px;
}

.signal-rank-row b,
.signal-mini-row b,
.signal-alert b {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.signal-rank-row small,
.signal-mini-row small,
.signal-alert small {
    display: block;
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.signal-thumb,
.signal-thumb-placeholder {
    width: 44px;
    height: 44px;
    display: block;
    border-radius: 10px;
    background:
        linear-gradient(135deg, rgba(37, 99, 235, .16), rgba(15, 139, 115, .12)),
        var(--surface);
    object-fit: cover;
    box-shadow: inset 0 0 0 1px var(--line);
}

.signal-sparkline {
    width: 120px;
    height: 34px;
    display: block;
}

.signal-sparkline path {
    fill: none;
    stroke: var(--accent);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3;
}

.signal-sparkline.is-empty {
    height: 2px;
    border-radius: 99px;
    background: var(--line);
}

.signal-score {
    display: grid;
    justify-items: end;
    gap: 3px;
    min-width: 0;
}

.signal-score b {
    font-size: 18px;
}

.signal-delta {
    display: inline-block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    white-space: nowrap;
}

.signal-delta.is-up {
    color: var(--accent);
}

.signal-delta.is-down {
    color: var(--danger);
}

.signal-mini-row {
    min-height: 58px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft);
}

.signal-mini-row > span {
    color: var(--ink-soft);
    font-weight: 850;
    white-space: nowrap;
}

.signal-split-bars {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.signal-bar-row {
    min-height: 32px;
    display: grid;
    grid-template-columns: minmax(92px, .85fr) minmax(100px, 1fr) 54px;
    gap: 10px;
    align-items: center;
    margin-bottom: 8px;
}

.signal-bar-row span {
    overflow: hidden;
    color: var(--ink-soft);
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.signal-bar-row i {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf1f6;
}

.signal-bar-row b {
    height: 100%;
    display: block;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), #2563eb);
}

.signal-bar-row strong {
    color: var(--ink-soft);
    font-size: 12px;
    text-align: right;
}

.signal-alert {
    display: grid;
    gap: 4px;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--blue);
    border-radius: 12px;
    background: var(--surface-soft);
}

.signal-alert.is-success {
    border-left-color: var(--accent);
}

.signal-alert.is-warning {
    border-left-color: var(--warning);
}

.signal-alert span {
    color: var(--ink-soft);
    font-size: 13px;
}

.signal-empty {
    min-height: 88px;
    display: grid;
    place-items: center;
    border: 1px dashed var(--line-strong);
    border-radius: 12px;
    color: var(--muted);
    font-weight: 760;
    text-align: center;
}

.signal-toolbar-card.is-loading,
[data-signals-dashboard].is-loading {
    opacity: .72;
}

@media (max-width: 1100px) {
    .dashboard-intel-grid,
    .dashboard-ops-grid,
    .signal-main-grid,
    .signal-rank-grid {
        grid-template-columns: 1fr;
    }

    .signal-toolbar {
        grid-template-columns: repeat(3, minmax(130px, 1fr));
    }
}

@media (max-width: 720px) {
    .signal-grid,
    .pulse-list,
    .flow-row,
    .signal-toolbar,
    .signal-summary-strip,
    .signal-split-bars {
        grid-template-columns: 1fr;
    }

    .flow-row strong {
        text-align: left;
    }

    .signal-rank-row,
    .signal-rank-row.has-thumb,
    .signal-mini-row,
    .signal-bar-row {
        grid-template-columns: 1fr;
    }

    .signal-rank-row > strong,
    .signal-thumb,
    .signal-thumb-placeholder,
    .signal-sparkline {
        display: none;
    }

    .signal-score {
        justify-items: start;
    }
}

.result-count-pill {
    min-width: 28px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    padding: 0 8px;
    border-radius: 7px;
    background: #eef3f8;
    color: var(--ink-soft);
    font-weight: 760;
}

.result-count-pill.has-pending {
    background: var(--warning-soft);
    color: var(--warning);
}

.account-summary-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.account-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.account-card,
.account-card-form {
    display: flex;
    flex-direction: column;
}

.account-card-form {
    flex: 1;
}

.account-card-form .btn {
    margin-top: auto;
}

.account-inner-grid {
    gap: 10px;
}

.account-security-card {
    max-width: none;
}

.account-security-card .section-head {
    position: relative;
    justify-content: center;
    text-align: center;
}

.account-security-card .section-head > div {
    max-width: 360px;
    margin-inline: auto;
}

.account-security-card .module-kicker {
    justify-content: center;
}

.account-security-card .module-copy {
    margin-inline: auto;
}

.account-security-card .badge {
    position: absolute;
    top: 0;
    right: 0;
}

.account-security-form {
    max-width: none;
    flex: 1;
    justify-content: flex-end;
}

.account-secret-panel {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.account-secret-panel code {
    display: block;
    width: 100%;
    overflow-wrap: anywhere;
    padding: 12px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
    font-size: 18px;
    font-weight: 850;
    letter-spacing: .08em;
}

.account-secret-panel small {
    color: var(--muted);
    overflow-wrap: anywhere;
}

@media (max-width: 1200px) {
    .account-card-grid,
    .account-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .account-card-grid,
    .account-summary-strip,
    .account-inner-grid {
        grid-template-columns: 1fr;
    }
}

.nova-sidebar,
.sidebar {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.nova-nav,
.nova-sidebar nav {
    flex: 1;
    align-content: start;
    min-height: 0;
}

.sidebar-version {
    margin: auto 8px 0;
    padding-top: 16px;
    text-align: center;
    color: rgba(255, 255, 255, .52);
    font-size: 11px;
    font-weight: 760;
    letter-spacing: .08em;
}

.desktop-sidebar-toggle {
    display: none;
    appearance: none;
    border: 0;
    background: transparent;
    font: inherit;
}

.content-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: auto;
    padding: 18px 0 0;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    font-weight: 760;
}

.content-footer nav {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.content-footer a {
    color: var(--ink-soft);
    text-decoration: none;
}

.content-footer a:hover {
    color: var(--ink);
}

.terms-help-hero {
    min-height: 156px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: end;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(15, 139, 115, .12), transparent 42%),
        var(--surface);
    box-shadow: var(--shadow-sm);
}

.terms-help-hero h2 {
    margin-bottom: 8px;
    font-size: clamp(28px, 3vw, 44px);
    letter-spacing: -.04em;
}

.terms-help-hero p {
    max-width: 760px;
    margin-bottom: 0;
    color: var(--muted);
    font-weight: 650;
}

.terms-help-quick {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.terms-help-quick a {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    font-weight: 850;
    text-decoration: none;
}

.terms-help-quick a:hover {
    border-color: var(--accent);
    color: var(--accent-strong);
}

.terms-help-quick a.is-active {
    border-color: var(--nav);
    background: var(--nav);
    color: #fff;
}

.terms-help-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.terms-help-nav {
    position: sticky;
    top: 92px;
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.terms-help-nav span {
    margin: 2px 8px 8px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.terms-help-nav a {
    min-height: 40px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 10px;
    color: var(--ink-soft);
    font-weight: 850;
    text-decoration: none;
}

.terms-help-nav a:hover,
.terms-help-nav a:focus,
.terms-help-nav a.is-active {
    background: var(--nav);
    color: #fff;
}

.terms-help-content {
    display: grid;
    gap: 18px;
}

.terms-help-card {
    scroll-margin-top: 92px;
    padding: clamp(20px, 2.2vw, 34px);
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.terms-help-card h2 {
    margin-bottom: 16px;
    font-size: clamp(24px, 2vw, 32px);
}

@media (min-width: 721px) {
    .terms-help-card:not(.is-active) {
        display: none;
    }
}

.terms-help-copy {
    display: grid;
    gap: 14px;
    max-width: 980px;
}

.terms-help-copy p,
.terms-help-faq p {
    margin-bottom: 0;
    color: var(--ink-soft);
    font-size: 15px;
    line-height: 1.68;
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.faq-grid section {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-soft);
}

.faq-grid h3 {
    margin-bottom: 8px;
    font-size: 16px;
}

.grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1100px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }

    .grid.four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .grid.four {
        grid-template-columns: 1fr;
    }

    .sidebar-version {
        margin-top: 12px;
    }

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

    .terms-help-hero,
    .terms-help-shell,
    .faq-grid {
        grid-template-columns: 1fr;
    }

    .terms-help-hero {
        align-items: start;
    }

    .terms-help-quick {
        justify-content: flex-start;
    }

    .terms-help-shell {
        padding-bottom: min(58vh, 420px);
    }

    .terms-help-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 90;
        max-height: min(58vh, 420px);
        overflow-y: auto;
        gap: 4px;
        padding: 28px 12px 14px;
        border: 0;
        border-top: 1px solid var(--line);
        border-radius: 14px 14px 0 0;
        background: var(--nav);
        box-shadow: 0 -18px 50px rgba(17, 24, 39, .22);
    }

    .terms-help-nav::before {
        content: "";
        position: absolute;
        top: 10px;
        left: 50%;
        width: 48px;
        height: 4px;
        border-radius: 99px;
        background: rgba(255, 255, 255, .28);
        transform: translateX(-50%);
    }

    .terms-help-nav span {
        display: block;
        margin: 0 0 2px;
        color: #fff;
        font-size: 16px;
        font-weight: 760;
        text-align: center;
        letter-spacing: 0;
        text-transform: none;
    }

    .terms-help-nav a {
        min-height: 46px;
        position: relative;
        padding: 0 48px 0 12px;
        border-radius: 8px;
        color: rgba(255, 255, 255, .92);
        font-size: 15px;
        font-weight: 760;
    }

    .terms-help-nav a::after {
        content: "";
        position: absolute;
        right: 12px;
        width: 22px;
        height: 22px;
        border: 2px solid rgba(255, 255, 255, .18);
        border-radius: 99px;
    }

    .terms-help-nav a:hover,
    .terms-help-nav a:focus {
        background: rgba(255, 255, 255, .08);
        color: #fff;
    }

    .terms-help-nav a:hover::after,
    .terms-help-nav a:focus::after {
        border-color: var(--blue);
        box-shadow: inset 0 0 0 5px var(--nav), 0 0 0 2px rgba(37, 99, 235, .18);
        background: var(--blue);
    }
}

/* Final responsive pass: keep the app usable before anything gets squeezed. */
html,
body,
.nova-shell,
.nova-layout,
.nova-topbar,
.nova-main,
.content,
.workspace-content,
.nova-content,
.page-body {
    max-width: 100%;
}

html,
body {
    overflow-x: hidden;
}

.nova-layout,
.nova-main,
.content,
.workspace-content,
.nova-content,
.panel,
.module-card,
.data-card,
.summary-card,
.intel-panel,
.modal-card,
.project-switcher,
.project-menu,
.project-menu-trigger {
    min-width: 0;
}

.page-title,
.page-title span,
.section-head,
.module-head,
.summary-card,
.intel-panel,
.flow-row,
.pulse-list,
.faq-grid,
.terms-help-content {
    min-width: 0;
}

.page-title span,
.section-head h2,
.module-head h2,
.summary-card span,
.summary-card strong,
.flow-row span,
.terms-help-content p {
    overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
    .dashboard-intel-grid,
    .dashboard-ops-grid,
    .account-card-grid,
    .account-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-wrap table {
        min-width: 720px;
    }
}

@media (max-width: 900px) {
    .nova-shell {
        display: block;
        min-height: 100vh;
    }

    .nova-topbar {
        position: static;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px 12px;
        align-items: center;
        padding: 0 14px 12px;
    }

    .nova-brand {
        grid-column: 1 / -1;
        width: calc(100% + 28px);
        min-height: 58px;
        justify-content: flex-start;
        margin: 0 -14px;
        padding: 12px 14px;
    }

    .nova-brand-logo {
        width: min(178px, 58vw);
        max-width: 178px;
        max-height: 28px;
        transform: none;
    }

    .project-switcher-center,
    .project-switcher {
        grid-column: 1;
        width: 100%;
        max-width: none;
        margin: 0;
    }

    .project-switcher {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 8px;
    }

    .project-switcher label {
        white-space: nowrap;
    }

    .project-menu-trigger {
        width: 100%;
        min-width: 0;
    }

    .project-menu-panel {
        left: 0;
        right: auto;
        width: min(420px, calc(100vw - 28px));
        max-width: calc(100vw - 28px);
    }

    .nova-identity {
        grid-column: 2;
        justify-self: end;
        justify-content: flex-end;
        gap: 8px;
        min-width: 0;
    }

    .nova-identity > span {
        display: none;
    }

    .account-menu-panel {
        right: 0;
        max-width: calc(100vw - 28px);
    }

    .nova-layout {
        display: block;
    }

    .nova-sidebar,
    .sidebar {
        position: static;
        width: 100%;
        height: auto;
        padding: 10px 10px 12px;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .08);
        overflow: hidden;
    }

    .nova-nav,
    .nova-sidebar nav {
        display: flex;
        grid-template-columns: none;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 2px 4px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .nova-nav::-webkit-scrollbar,
    .nova-sidebar nav::-webkit-scrollbar {
        display: none;
    }

    .nav-group {
        display: flex;
        flex: 0 0 auto;
        gap: 6px;
        padding: 0;
        border: 0;
    }

    .nova-section-label,
    .sidebar-version {
        display: none;
    }

    .nova-nav a,
    .nova-sidebar nav a {
        flex: 0 0 auto;
        min-height: 40px;
        padding: 0 12px;
        border: 1px solid rgba(255, 255, 255, .06);
        background: rgba(255, 255, 255, .02);
        white-space: nowrap;
        scroll-snap-align: start;
    }

    .nova-nav a.active,
    .nova-sidebar nav a.active {
        border-color: rgba(255, 255, 255, .13);
    }

    .nav-icon {
        width: 17px;
        height: 17px;
        flex-basis: 17px;
    }

    .nova-main,
    .content {
        min-height: calc(100vh - 132px);
        padding: 14px 14px 26px;
    }

    .nova-content,
    .workspace-content,
    .page-body {
        gap: 12px;
    }

    .nova-hero {
        min-height: 0;
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
        padding: 16px;
        border-radius: 14px;
    }

    .nova-hero > div:first-child {
        width: 100%;
        min-width: 0;
    }

    .page-title {
        display: flex;
        width: 100%;
        align-items: center;
        gap: 10px;
    }

    .page-title .nav-icon {
        width: 31px;
        height: 31px;
        flex-basis: 31px;
        padding: 6px;
    }

    .header-tools {
        width: 100%;
        justify-content: flex-start;
    }

    .summary-strip,
    .dashboard-summary-strip,
    .review-summary-strip {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }

    .dashboard-intel-grid,
    .dashboard-ops-grid,
    .grid.two,
    .grid.three,
    .grid.four,
    .module-grid,
    .provider-command-grid,
    .account-card-grid,
    .account-summary-strip,
    .stats-grid,
    .terms-help-hero,
    .terms-help-shell,
    .faq-grid {
        grid-template-columns: 1fr;
    }

    .intel-panel {
        min-height: 0;
        padding: 16px;
        border-radius: 14px;
    }

    .dashboard-flow-card {
        align-items: stretch;
    }

    .pulse-list,
    .signal-grid,
    .flow-row {
        grid-template-columns: 1fr;
    }

    .flow-row {
        gap: 8px;
    }

    .flow-row strong {
        text-align: left;
    }

    .content-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
        padding-top: 16px;
    }

    .content-footer nav {
        justify-content: flex-start;
        gap: 12px;
    }
}

@media (max-width: 640px) {
    .nova-topbar {
        grid-template-columns: 1fr;
        padding: 0 12px 12px;
    }

    .nova-brand {
        width: calc(100% + 24px);
        margin: 0 -12px;
        padding-left: 16px;
        padding-right: 16px;
    }

    .project-switcher-center,
    .project-switcher,
    .nova-identity {
        grid-column: 1;
        width: 100%;
    }

    .project-switcher {
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .project-switcher label {
        padding-left: 2px;
    }

    .nova-identity {
        justify-self: stretch;
        justify-content: flex-start;
    }

    .account-menu-panel {
        left: 0;
        right: auto;
    }

    .nova-sidebar,
    .sidebar {
        padding-left: 8px;
        padding-right: 8px;
    }

    .nova-main,
    .content {
        min-height: calc(100vh - 188px);
        padding: 12px 10px 24px;
    }

    .nova-hero,
    .panel,
    .module-card,
    .data-card,
    .intel-panel {
        border-radius: 12px;
    }

    .nova-hero {
        padding: 15px;
    }

    h1 {
        font-size: 32px;
        line-height: 1.04;
        letter-spacing: 0;
    }

    h2,
    h3,
    .page-title,
    .summary-card span,
    .eyebrow,
    .module-kicker {
        letter-spacing: 0;
    }

    .summary-strip,
    .dashboard-summary-strip,
    .review-summary-strip {
        grid-template-columns: 1fr;
    }

    .trial-grid,
    .trial-complete-summary {
        grid-template-columns: 1fr;
    }

    .summary-card {
        min-height: 66px;
        padding: 12px;
    }

    .signal-orb {
        width: min(190px, 70vw);
    }

    .signal-orb strong {
        font-size: 36px;
        letter-spacing: 0;
    }

    .pulse-list div {
        min-height: 86px;
    }

    .ai-meter {
        min-height: 100px;
    }

    .modal-shell {
        align-items: start;
        place-items: start stretch;
        padding: 8px;
        overflow-y: auto;
    }

    .modal-card,
    .modal-card.wide,
    .modal-card.small-modal,
    .modal-card-wide,
    .modal-card-results,
    .legacy-test-modal-card,
    .provider-games-modal-card {
        width: 100%;
        max-width: 100%;
        max-height: calc(100dvh - 16px);
        padding: 16px;
        border-radius: 16px;
        scrollbar-gutter: auto;
    }

    .modal-head {
        align-items: flex-start;
        gap: 12px;
    }

    .modal-actions {
        position: sticky;
        bottom: -16px;
        margin: 8px -16px -16px;
        padding: 12px 16px 16px;
        border-top: 1px solid var(--line);
        background: var(--surface);
    }

    .modal-card .grid,
    .modal-card .grid.two,
    .modal-card .grid.three,
    .modal-card .module-grid,
    .modal-card .form-row {
        grid-template-columns: 1fr;
    }

    .dt-layout-row,
    .dt-layout-cell,
    .dt-search,
    .dt-length,
    .dt-paging,
    .dt-paging nav {
        width: 100%;
    }

    .dt-layout-row {
        gap: 10px;
    }

    .dt-search input,
    .dt-length select {
        width: 100%;
    }

    .games-datatable-filter,
    .games-datatable-filter .select2-container,
    .games-datatable-filter select {
        width: 100%;
        max-width: none;
    }

    .dt-filter-with-provider {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .dt-filter-with-provider .dt-search,
    .dt-filter-with-provider .dt-search input {
        width: 100%;
    }

    .terms-help-hero {
        gap: 16px;
        padding: 18px;
    }

    .terms-help-quick {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .terms-help-quick a {
        justify-content: center;
    }
}

@media (max-width: 420px) {
    .nova-brand-logo {
        width: min(168px, 72vw);
    }

    .nova-nav a,
    .nova-sidebar nav a {
        min-height: 38px;
        padding: 0 10px;
        font-size: 12px;
    }

    .page-title {
        align-items: flex-start;
    }

    .page-title .nav-icon {
        width: 29px;
        height: 29px;
        flex-basis: 29px;
    }

    h1 {
        font-size: 29px;
    }

    .terms-help-quick {
        grid-template-columns: 1fr;
    }
}

/* Mobile navigation: replace the cramped horizontal strip with a proper drawer. */
.mobile-nav-trigger,
.mobile-nav-backdrop,
.mobile-nav-head {
    display: none;
}

.mobile-nav-trigger {
    appearance: none;
    border: 0;
    background: transparent;
    font: inherit;
}

.mobile-nav-trigger-lines {
    display: grid;
    gap: 4px;
}

.mobile-nav-trigger-lines span {
    display: block;
    width: 16px;
    height: 2px;
    border-radius: 99px;
    background: currentColor;
}

@media (max-width: 900px) {
    html.mobile-nav-open,
    body.mobile-nav-open {
        overflow: hidden;
    }

    .nova-topbar {
        position: sticky;
        top: 0;
        z-index: 140;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px 12px;
        padding: 0 12px 12px;
        border-bottom: 1px solid rgba(223, 231, 241, .9);
        background:
            linear-gradient(var(--nav) 0 58px, rgba(255, 255, 255, .96) 58px),
            var(--surface);
        backdrop-filter: blur(18px);
    }

    .nova-brand {
        grid-column: 1;
        grid-row: 1;
        width: auto;
        min-width: 0;
        min-height: 58px;
        justify-content: flex-start;
        margin: 0;
        padding: 12px 0;
        background: transparent;
    }

    .nova-brand-logo {
        width: min(180px, 58vw);
        max-width: 180px;
        max-height: 28px;
        transform: translateY(1px);
    }

    .mobile-nav-trigger {
        grid-column: 2;
        grid-row: 1;
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        align-self: center;
        padding: 0 12px;
        border: 1px solid rgba(255, 255, 255, .14);
        border-radius: 11px;
        background: rgba(255, 255, 255, .07);
        color: #fff;
        font-size: 13px;
        font-weight: 760;
        cursor: pointer;
    }

    .mobile-nav-trigger:active {
        transform: translateY(1px);
    }

    .project-switcher-center,
    .project-switcher {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        max-width: none;
        margin: 0;
    }

    .project-switcher {
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .project-switcher label {
        padding-left: 2px;
        white-space: nowrap;
    }

    .project-menu-trigger {
        min-height: 44px;
        border-radius: 10px;
    }

    .project-menu-panel {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
    }

    .nova-identity {
        display: none;
    }

    .mobile-nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 150;
        display: block;
        border: 0;
        background: rgba(15, 23, 42, .52);
        backdrop-filter: blur(7px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .18s ease, visibility .18s ease;
    }

    body.mobile-nav-open .mobile-nav-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .nova-sidebar,
    .sidebar {
        position: fixed;
        top: auto;
        right: 10px;
        bottom: 10px;
        left: 10px;
        z-index: 160;
        width: auto;
        height: auto;
        max-height: min(82dvh, 720px);
        padding: 0;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, .10);
        border-radius: 22px;
        background: var(--nav);
        box-shadow: 0 -26px 80px rgba(15, 23, 42, .38);
        pointer-events: none;
        transform: translateY(calc(100% + 24px));
        transition: transform .24s ease;
    }

    body.mobile-nav-open .nova-sidebar,
    body.mobile-nav-open .sidebar {
        pointer-events: auto;
        transform: translateY(0);
    }

    .mobile-nav-head {
        min-height: 66px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 14px 16px;
        border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .mobile-nav-head strong {
        display: block;
        color: #fff;
        font-size: 18px;
        line-height: 1.1;
    }

    .mobile-nav-head .module-kicker {
        color: rgba(255, 255, 255, .52);
    }

    .mobile-nav-head .icon-btn {
        width: 38px;
        height: 38px;
        border-color: rgba(255, 255, 255, .10);
        background: rgba(255, 255, 255, .06);
        color: #fff;
    }

    .nova-nav,
    .nova-sidebar nav {
        display: grid;
        grid-template-columns: 1fr;
        max-height: calc(min(82dvh, 720px) - 118px);
        gap: 14px;
        overflow-x: hidden;
        overflow-y: auto;
        padding: 14px;
        overscroll-behavior: contain;
        scrollbar-width: none;
    }

    .nova-nav::-webkit-scrollbar,
    .nova-sidebar nav::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
        background: transparent;
    }

    .nav-group {
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 0 0 14px;
        border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .nav-group:last-child {
        border-bottom: 0;
        padding-bottom: 4px;
    }

    .nova-section-label {
        display: block;
        margin: 0 4px 4px;
        color: rgba(255, 255, 255, .48);
        font-size: 10px;
        font-weight: 760;
        letter-spacing: .18em;
        text-transform: uppercase;
    }

    .nova-nav a,
    .nova-sidebar nav a {
        position: relative;
        width: 100%;
        min-height: 48px;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 0 44px 0 12px;
        border: 1px solid transparent;
        border-radius: 13px;
        background: transparent;
        color: rgba(255, 255, 255, .82);
        font-size: 15px;
        font-weight: 720;
        white-space: normal;
        scroll-snap-align: none;
    }

    .nova-nav a span,
    .nova-sidebar nav a span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .nova-nav a .nav-icon,
    .nova-sidebar nav a .nav-icon {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
        color: rgba(255, 255, 255, .58);
    }

    .nova-nav a::after,
    .nova-sidebar nav a::after {
        content: "";
        position: absolute;
        right: 14px;
        width: 18px;
        height: 18px;
        border: 2px solid rgba(255, 255, 255, .14);
        border-radius: 99px;
    }

    .nova-nav a:hover,
    .nova-nav a:focus,
    .nova-nav a.active,
    .nova-sidebar nav a:hover,
    .nova-sidebar nav a:focus,
    .nova-sidebar nav a.active {
        border-color: rgba(255, 255, 255, .10);
        background: rgba(255, 255, 255, .08);
        color: #fff;
    }

    .nova-nav a.active::after,
    .nova-sidebar nav a.active::after {
        border-color: var(--blue);
        background: var(--blue);
        box-shadow: inset 0 0 0 4px var(--nav), 0 0 0 2px rgba(37, 99, 235, .18);
    }

    .nova-nav a.active .nav-icon,
    .nova-sidebar nav a.active .nav-icon {
        color: #fff;
    }

    .sidebar-version {
        display: block;
        margin: 0;
        padding: 0 16px 14px;
        color: rgba(255, 255, 255, .54);
        text-align: center;
    }
}

/* Desktop sidebar guard: keep the navigation pinned and visually continuous on long legacy tables. */
@media (min-width: 901px) {
    .nova-shell {
        display: block;
        min-height: 100vh;
        min-height: 100dvh;
        padding-top: 58px;
    }

    .nova-topbar {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        height: 58px;
        z-index: 60;
    }

    .nova-brand {
        justify-content: flex-start;
        padding-left: 56px;
        padding-right: 12px;
    }

    .nova-brand-logo {
        width: min(100%, 138px);
        max-width: 138px;
    }

    .nova-layout {
        min-height: calc(100vh - 58px);
        min-height: calc(100dvh - 58px);
        align-items: stretch;
        background: linear-gradient(90deg, var(--nav) 0 var(--sidebar-width), transparent var(--sidebar-width));
        transition: background .18s ease, grid-template-columns .18s ease;
    }

    .nova-sidebar,
    .sidebar {
        position: fixed;
        top: 58px;
        left: 0;
        z-index: 45;
        align-self: start;
        width: var(--sidebar-width);
        min-height: calc(100vh - 58px);
        min-height: calc(100dvh - 58px);
        height: calc(100vh - 58px);
        height: calc(100dvh - 58px);
        max-height: calc(100vh - 58px);
        max-height: calc(100dvh - 58px);
        overflow: hidden;
        overscroll-behavior: contain;
        transition: transform .18s ease;
        will-change: transform;
    }

    .nova-main,
    .content {
        grid-column: 2;
        transition: padding .18s ease;
    }

    .nova-nav,
    .nova-sidebar nav {
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        padding-right: 0;
        overscroll-behavior: contain;
        scrollbar-gutter: auto;
        scrollbar-width: none;
        scrollbar-color: transparent transparent;
        -ms-overflow-style: none;
    }

    .nova-sidebar:hover .nova-nav,
    .nova-sidebar:focus-within .nova-nav,
    .nova-sidebar:hover nav,
    .nova-sidebar:focus-within nav {
        padding-right: 0;
        scrollbar-width: none;
        scrollbar-color: transparent transparent;
    }

    .desktop-sidebar-toggle {
        width: 34px;
        height: 34px;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(255, 255, 255, .13);
        border-radius: 10px;
        color: rgba(255, 255, 255, .82);
        cursor: pointer;
        transition: background .16s ease, color .16s ease, transform .16s ease;
    }

    .desktop-sidebar-toggle:hover,
    .desktop-sidebar-toggle:focus {
        background: rgba(255, 255, 255, .10);
        color: #fff;
        outline: 0;
    }

    .desktop-sidebar-toggle .nav-icon {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
        color: currentColor;
    }

    .sidebar-toggle-hide {
        position: fixed;
        top: 12px;
        right: auto;
        left: 14px;
        z-index: 90;
        display: inline-flex;
        width: 32px;
        height: 32px;
        margin: 0;
        background: rgba(255, 255, 255, .08);
        box-shadow: none;
        transform: none;
    }

    .sidebar-toggle-show {
        position: fixed;
        top: 12px;
        left: 14px;
        z-index: 90;
        display: none;
        width: 32px;
        height: 32px;
        background: var(--nav);
        box-shadow: none;
        transform: none;
    }

    .sidebar-toggle-hide:hover,
    .sidebar-toggle-hide:focus {
        transform: none;
    }

    .sidebar-toggle-show:hover,
    .sidebar-toggle-show:focus {
        transform: none;
    }

    body.sidebar-collapsed .nova-layout {
        grid-template-columns: minmax(0, 1fr);
        background: transparent;
    }

    body.sidebar-collapsed .nova-sidebar,
    body.sidebar-collapsed .sidebar {
        pointer-events: none;
        transform: translateX(calc(-1 * var(--sidebar-width)));
    }

    body.sidebar-collapsed .nova-main,
    body.sidebar-collapsed .content {
        grid-column: 1;
        padding-left: 72px;
    }

    body.sidebar-collapsed .nova-topbar {
        grid-template-columns: minmax(360px, 1fr) minmax(170px, 240px);
        padding-left: 72px;
        background: rgba(255, 255, 255, .92);
    }

    body.sidebar-collapsed .nova-brand {
        display: none;
    }

    body.sidebar-collapsed .sidebar-toggle-hide {
        display: none;
    }

    body.sidebar-collapsed .project-switcher-center {
        grid-column: 1;
    }

    body.sidebar-collapsed .nova-identity {
        grid-column: 2;
    }

    body.sidebar-collapsed .sidebar-toggle-show {
        display: inline-flex;
        background: var(--nav);
    }

    .nova-nav::-webkit-scrollbar,
    .nova-sidebar nav::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
        background: transparent;
    }

    .nova-sidebar:hover .nova-nav::-webkit-scrollbar,
    .nova-sidebar:focus-within .nova-nav::-webkit-scrollbar,
    .nova-sidebar:hover nav::-webkit-scrollbar,
    .nova-sidebar:focus-within nav::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
    }

    .nova-nav::-webkit-scrollbar-thumb,
    .nova-sidebar nav::-webkit-scrollbar-thumb {
        border-radius: 99px;
        background: rgba(255, 255, 255, .26);
    }

    .nova-nav::-webkit-scrollbar-thumb:hover,
    .nova-sidebar nav::-webkit-scrollbar-thumb:hover {
        background: rgba(255, 255, 255, .40);
    }
}

@media (max-width: 420px) {
    .mobile-nav-trigger span:last-child {
        display: none;
    }

    .mobile-nav-trigger {
        width: 40px;
        padding: 0;
    }

    .nova-brand-logo {
        width: min(170px, 62vw);
    }
}

.sales-body {
    min-height: 100vh;
    background: #0b111c;
    color: #e5edf7;
}

.sales-shell {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}

.sales-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 0;
}

.sales-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-weight: 800;
    letter-spacing: 0;
    text-decoration: none;
}

.sales-brand-mark {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(115, 214, 255, 0.35);
    border-radius: 8px;
    background: rgba(115, 214, 255, 0.08);
}

.sales-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.sales-nav a {
    color: #aeb8c7;
    text-decoration: none;
    font-weight: 700;
    font-size: 13px;
}

.sales-hero {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
    gap: 28px;
    align-items: stretch;
    padding: 24px 0 34px;
}

.sales-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
}

.sales-copy h1 {
    margin: 0;
    color: #fff;
    font-size: 54px;
    line-height: 1.02;
    letter-spacing: 0;
}

.sales-copy p {
    margin: 0;
    color: #aeb8c7;
    font-size: 17px;
    line-height: 1.7;
}

.sales-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.sales-dashboard-preview,
.sales-feature,
.pricing-card,
.billing-card,
.sales-form-card {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 8px;
    background: #111927;
}

.sales-dashboard-preview {
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
    overflow: hidden;
}

.sales-preview-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}

.sales-preview-grid {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 12px;
    padding: 16px;
}

.sales-panel {
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: #0c1422;
    padding: 16px;
}

.sales-panel h3,
.sales-panel h2,
.pricing-card h2 {
    margin: 0;
    color: #fff;
    letter-spacing: 0;
}

.sales-kpi {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 16px;
}

.sales-kpi div {
    border-radius: 8px;
    background: #162235;
    padding: 12px;
}

.sales-kpi span,
.sales-signal span,
.pricing-card span,
.billing-status-line span {
    display: block;
    color: #8d9aab;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.sales-kpi strong,
.sales-signal strong {
    display: block;
    color: #fff;
    font-size: 26px;
    margin-top: 4px;
}

.sales-signal {
    display: grid;
    gap: 10px;
}

.sales-track {
    height: 8px;
    border-radius: 999px;
    background: #1d293b;
    overflow: hidden;
}

.sales-track i {
    display: block;
    height: 100%;
    width: var(--value);
    background: #58d6a4;
}

.sales-section {
    padding: 34px 0;
}

.sales-section-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: end;
    margin-bottom: 18px;
}

.sales-section-head h2 {
    margin: 0;
    color: #fff;
    font-size: 30px;
    letter-spacing: 0;
}

.sales-feature-grid,
.pricing-grid,
.billing-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.sales-feature,
.pricing-card,
.billing-card,
.sales-form-card {
    padding: 18px;
}

.sales-feature p,
.pricing-card p,
.billing-card p {
    color: #aeb8c7;
    line-height: 1.6;
}

.pricing-card {
    display: flex;
    flex-direction: column;
    min-height: 390px;
}

.pricing-card.is-featured {
    border-color: rgba(88, 214, 164, 0.65);
    box-shadow: 0 0 0 1px rgba(88, 214, 164, 0.25), 0 24px 70px rgba(88, 214, 164, 0.12);
}

.pricing-price {
    color: #fff;
    font-size: 34px;
    font-weight: 900;
    margin: 14px 0;
}

.pricing-list {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 9px;
    color: #c8d3e0;
    font-size: 14px;
}

.pricing-list li::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 8px;
    border-radius: 99px;
    background: #58d6a4;
}

.pricing-card .btn {
    margin-top: auto;
}

.sales-form-shell {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1fr);
    gap: 22px;
    align-items: start;
}

.billing-status-line {
    display: grid;
    gap: 6px;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    padding-top: 14px;
    margin-top: 14px;
}

.country-picker {
    position: relative;
    display: block;
}

.country-picker-toggle {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 38px 7px 12px;
    border: 1px solid rgba(148, 163, 184, 0.32);
    border-radius: 12px;
    background:
        radial-gradient(circle at 92% 0, rgba(88, 214, 164, 0.13), transparent 34%),
        #111927;
    color: #e5edf7;
    font: inherit;
    font-weight: 760;
    text-align: left;
    cursor: pointer;
    outline: 0;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.country-picker-toggle::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 20px;
    width: 8px;
    height: 8px;
    border-right: 2px solid #93a4b8;
    border-bottom: 2px solid #93a4b8;
    transform: rotate(45deg);
    transition: transform .16s ease, border-color .16s ease;
}

.country-picker.is-open .country-picker-toggle,
.country-picker-toggle:focus {
    border-color: rgba(88, 214, 164, 0.68);
    box-shadow: 0 0 0 4px rgba(88, 214, 164, 0.13), 0 14px 34px rgba(0, 0, 0, 0.24);
}

.country-picker.is-open .country-picker-toggle::after {
    top: 24px;
    border-color: #58d6a4;
    transform: rotate(225deg);
}

.country-picker-panel {
    position: absolute;
    z-index: 80;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    display: none;
    overflow: hidden;
    border: 1px solid rgba(88, 214, 164, 0.32);
    border-radius: 12px;
    background:
        radial-gradient(circle at 88% 0, rgba(88, 214, 164, 0.16), transparent 34%),
        #0b111c;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.country-picker.is-open .country-picker-panel {
    display: block;
}

.country-picker-search {
    padding: 10px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    background: rgba(11, 17, 28, 0.96);
}

.country-picker-search input {
    min-height: 40px;
    padding: 0 12px;
    border-color: rgba(148, 163, 184, 0.28);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.055);
    color: #e5edf7;
}

.country-picker-groups {
    max-height: min(390px, 54vh);
    overflow: auto;
    padding: 8px;
}

.country-picker-group {
    display: grid;
    gap: 4px;
}

.country-picker-group + .country-picker-group {
    margin-top: 10px;
}

.country-picker-group h3 {
    position: sticky;
    top: -8px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 8px 8px 6px;
    background: rgba(11, 17, 28, 0.96);
    color: #58d6a4;
    font-size: 11px;
    font-weight: 930;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.country-picker-group h3 span {
    color: #8d9aab;
    letter-spacing: 0;
}

.country-picker-option {
    width: 100%;
    min-height: 37px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #d8e2ee;
    font: inherit;
    font-size: 13px;
    font-weight: 720;
    text-align: left;
    cursor: pointer;
}

.country-picker-option:hover,
.country-picker-option:focus,
.country-picker-option.is-selected {
    border-color: rgba(88, 214, 164, 0.28);
    background: rgba(88, 214, 164, 0.11);
    color: #fff;
    outline: 0;
}

.country-picker-option.is-selected {
    box-shadow: inset 3px 0 0 #58d6a4;
}

.country-picker-option em {
    color: #93a4b8;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}

.country-picker-empty,
.country-picker-error {
    margin: 0;
    color: #fca5a5;
    font-size: 12px;
    font-weight: 760;
}

.country-picker-empty {
    padding: 16px 10px;
    text-align: center;
}

.country-picker-error {
    margin-top: 6px;
}

.country-picker.is-invalid .country-picker-toggle {
    border-color: rgba(248, 113, 113, 0.78);
    box-shadow: 0 0 0 4px rgba(248, 113, 113, 0.13);
}

@media (max-width: 980px) {
    .sales-hero,
    .sales-preview-grid,
    .sales-form-shell {
        grid-template-columns: 1fr;
    }

    .sales-feature-grid,
    .pricing-grid,
    .billing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sales-copy h1 {
        font-size: 42px;
    }
}

@media (max-width: 640px) {
    .sales-feature-grid,
    .pricing-grid,
    .billing-grid,
    .sales-kpi {
        grid-template-columns: 1fr;
    }

    .sales-topbar,
    .sales-section-head {
        align-items: start;
        flex-direction: column;
    }
}
/* LobbyForge AI additions */
.lf-brand {
    gap: 12px;
    color: inherit;
    text-decoration: none;
}

.lf-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 18px;
}

.lf-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(148, 163, 184, .24);
    border-radius: 8px;
    color: inherit;
    text-decoration: none;
    background: rgba(15, 23, 42, .34);
}

.lf-tabs a.active {
    border-color: rgba(36, 209, 143, .8);
    color: #eafff5;
    background: rgba(36, 209, 143, .16);
}

.lf-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.lf-progress {
    display: grid;
    gap: 8px;
}

.lf-progress-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}

.lf-progress-track {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, .2);
}

.lf-progress-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #24d18f, #ffcf5a);
}

.lf-thumb {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    object-fit: cover;
    background: rgba(148, 163, 184, .14);
}

.image-lightbox-trigger {
    appearance: none;
    position: relative;
    border: 0;
    padding: 0;
    background: transparent;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    overflow: hidden;
    cursor: zoom-in;
}

.image-lightbox-trigger::before,
.image-lightbox-trigger::after {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease;
}

.image-lightbox-trigger::before {
    content: "";
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, .08), rgba(15, 23, 42, .46));
}

.image-lightbox-trigger::after {
    content: "";
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 999px;
    background: rgba(15, 23, 42, .82) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4.3-4.3'/%3E%3Cpath d='M11 8v6'/%3E%3Cpath d='M8 11h6'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .28);
    transform: translate(-50%, calc(-50% + 4px)) scale(.92);
}

.image-lightbox-trigger:hover::before,
.image-lightbox-trigger:hover::after,
.image-lightbox-trigger:focus-visible::before,
.image-lightbox-trigger:focus-visible::after {
    opacity: 1;
}

.image-lightbox-trigger:hover::after,
.image-lightbox-trigger:focus-visible::after {
    transform: translate(-50%, -50%) scale(1);
}

.image-lightbox-trigger:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .18);
}

.image-lightbox-trigger > img {
    display: block;
    transition: transform .16s ease, box-shadow .16s ease;
}

.image-tab-link {
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    overflow: hidden;
    cursor: alias;
}

.image-tab-link > img {
    display: block;
    transition: transform .16s ease, box-shadow .16s ease;
}

.image-tab-link:hover > img,
.image-tab-link:focus-visible > img {
    transform: scale(1.04);
    box-shadow: 0 14px 32px rgba(15, 23, 42, .18);
}

.image-tab-link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .18);
}

.image-lightbox-trigger:hover > img,
.image-lightbox-trigger:focus-visible > img {
    transform: scale(1.04);
    box-shadow: 0 14px 32px rgba(15, 23, 42, .18);
}

.lf-thumb-empty {
    width: 72px;
    height: 72px;
    display: inline-grid;
    place-items: center;
    padding: 8px;
    border: 1px dashed #cfd9e7;
    border-radius: 8px;
    background: #f8fbfd;
    color: #667085;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
}

.lf-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 14px;
}

.lf-gallery-card {
    overflow: hidden;
}

.lf-gallery-image-button {
    width: 100%;
    display: block;
    border-radius: 0;
    overflow: hidden;
}

.lf-gallery-image-button img,
.lf-gallery-card img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    background: #0f172a;
}

.image-lightbox {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 28px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}

.image-lightbox.is-open {
    opacity: 1;
    pointer-events: auto;
}

.image-lightbox-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(10, 16, 28, .72);
    backdrop-filter: blur(18px);
    cursor: zoom-out;
}

.image-lightbox-panel {
    position: relative;
    width: min(960px, calc(100vw - 48px));
    max-height: calc(100vh - 48px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .34);
    transform: translateY(10px) scale(.985);
    transition: transform .18s ease;
}

.image-lightbox.is-open .image-lightbox-panel {
    transform: translateY(0) scale(1);
}

.image-lightbox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid #dce7ef;
    background: #fff;
}

.image-lightbox-head div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.image-lightbox-head span {
    color: #0f8b73;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.image-lightbox-head strong {
    color: #101828;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-lightbox-stage {
    min-height: 0;
    display: grid;
    place-items: center;
    padding: 18px;
    background: radial-gradient(circle at 50% 0, rgba(36, 209, 143, .10), transparent 34%), #f4f7fb;
}

.image-lightbox-stage img {
    max-width: 100%;
    max-height: calc(100vh - 150px);
    object-fit: contain;
    border-radius: 14px;
    background: #0f172a;
    box-shadow: 0 18px 50px rgba(15, 23, 42, .22);
}

body.image-lightbox-open {
    overflow: hidden;
}

@media (max-width: 640px) {
    .image-lightbox {
        padding: 12px;
    }

    .image-lightbox-panel {
        width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
        border-radius: 16px;
    }

    .image-lightbox-stage {
        padding: 10px;
    }
}

.lf-gallery-card-body {
    display: grid;
    gap: 8px;
    padding: 14px;
}

.lf-color-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 50%;
    vertical-align: middle;
}

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

.lf-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
    gap: 18px;
}

@media (max-width: 900px) {
    .lf-two-col {
        grid-template-columns: 1fr;
    }
}

/* LobbyForge AI style fixes */
.nova-topbar {
    min-height: 68px;
}

.project-select-form {
    display: grid;
    grid-template-columns: auto minmax(280px, 520px);
    align-items: center;
    gap: 12px;
    width: min(620px, 48vw);
}

.project-select-form label {
    margin: 0;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.project-select {
    width: 100%;
    min-height: 48px;
    padding: 0 42px 0 14px;
    border: 1px solid #cfd7e3;
    border-radius: 10px;
    background: #fff;
    color: #111827;
    font-size: 14px;
    font-weight: 760;
    outline: 0;
}

.project-select:focus {
    border-color: #24d18f;
    box-shadow: 0 0 0 4px rgba(36, 209, 143, .16);
}

.lf-tabs {
    gap: 10px;
    margin: 0 0 24px;
}

.lf-tabs a {
    min-height: 38px;
    padding: 9px 14px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    background: #fff;
    color: #111827;
    font-weight: 720;
}

.lf-tabs a:hover {
    border-color: #aab4c2;
    background: #f8fafc;
}

.lf-tabs a.active {
    border-color: #24d18f;
    background: #dffaf0;
    color: #0f172a;
}

.nova-content .module-form {
    display: grid;
    gap: 16px;
}

.nova-content .form-grid {
    display: grid;
    gap: 14px;
}

.nova-content .form-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.nova-content .form-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nova-content .form-grid.five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.nova-content .form-row {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.nova-content .form-row label {
    margin: 0;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .04em;
}

.nova-content .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.nova-content .form-row select,
.nova-content .form-row textarea {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #cfd7e3;
    border-radius: 8px;
    background: #fff;
    color: #111827;
    font: inherit;
    font-size: 14px;
    line-height: 1.35;
    box-shadow: none;
}

.nova-content .form-row textarea {
    min-height: 108px;
    resize: vertical;
}

.nova-content .form-row input:focus,
.nova-content .form-row select:focus,
.nova-content .form-row textarea:focus {
    border-color: #24d18f;
    outline: 0;
    box-shadow: 0 0 0 4px rgba(36, 209, 143, .15);
}

.nova-content .form-row input[type="color"] {
    width: 58px;
    height: 38px;
    padding: 3px;
    border: 1px solid #cfd7e3;
    border-radius: 8px;
    background: #fff;
}

.lf-native-file {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.lf-file-control {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
}

.lf-file-name {
    color: #667085;
    font-size: 13px;
    font-weight: 650;
}

.game-image-editor {
    display: grid;
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
    padding: 14px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: #f8fbfd;
}

.game-image-preview {
    display: grid;
    gap: 10px;
    align-content: start;
}

.game-image-preview img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #0f172a;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}

.game-image-preview-trigger {
    width: 100%;
    border-radius: 14px;
}

.game-image-replace {
    display: grid;
    align-content: center;
    gap: 8px;
    min-height: 170px;
    padding: 16px;
    border: 1px dashed #b8c7d8;
    border-radius: 14px;
    background: #fff;
}

.game-image-replace label {
    margin: 0;
    color: #101828;
    font-size: 16px;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: none;
}

@media (max-width: 760px) {
    .game-image-editor {
        grid-template-columns: 1fr;
    }
}

.select2-container {
    max-width: 100%;
}

.select2-container .select2-selection--single {
    min-height: 44px;
    border: 1px solid #cfd7e3;
    border-radius: 8px;
    display: flex;
    align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #111827;
    line-height: 42px;
    padding-left: 12px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}

.select2-dropdown {
    border-color: #cfd7e3;
    border-radius: 8px;
    overflow: hidden;
    z-index: 10020;
}

.select2-results__option {
    min-height: 36px;
    padding: 9px 12px;
    color: #111827;
    font-size: 14px;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background: #111827;
    color: #fff;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    min-height: 36px;
    border: 1px solid #cfd7e3;
    border-radius: 8px;
}

.modal-card .module-form {
    margin-top: 12px;
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.compact-filter .form-grid.five {
    align-items: end;
}

@media (max-width: 1100px) {
    .project-select-form {
        width: min(560px, 58vw);
    }

    .nova-content .form-grid.five {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .project-select-form {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .nova-content .form-grid.two,
    .nova-content .form-grid.three,
    .nova-content .form-grid.five {
        grid-template-columns: 1fr;
    }
}

/* Creator workflow polish: softer SaaS feel, thumbnail-first hierarchy. */
body.nova-body {
    background:
        linear-gradient(180deg, #ffffff 0, #f4f8fb 360px),
        #eef4f7;
}

.nova-topbar {
    grid-template-columns: var(--sidebar-width) minmax(320px, 600px) auto auto;
    gap: 14px;
}

.topbar-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.topbar-pill {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid #d7e0ea;
    border-radius: 12px;
    background: #fff;
    color: #101828;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}

.topbar-pill-primary {
    border-color: #c9eee4;
    background: #e9fbf5;
    color: #075c4b;
}

.topbar-pill .nav-icon {
    color: currentColor;
}

.nova-hero {
    min-height: 98px;
    align-items: center;
    padding: 18px;
    border-radius: 16px;
    background: #fff;
}

h1 {
    font-size: clamp(28px, 2.35vw, 38px);
    letter-spacing: -.03em;
}

.page-title .nav-icon {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
    border-radius: 9px;
}

.workspace-content,
.nova-content,
.page-body {
    gap: 14px;
}

.data-card,
.summary-card,
.panel,
.module-card,
.workbench-card {
    border-radius: 14px;
    background: #fff;
}

.section-head,
.module-head {
    align-items: center;
}

.module-kicker,
.eyebrow {
    color: #0f766e;
}

.btn {
    min-height: 40px;
    border-radius: 10px;
    background: #101828;
}

.btn.secondary {
    background: #eef4f6;
    color: #101828;
}

.lf-tabs {
    margin-bottom: 18px;
    gap: 8px;
}

.lf-tabs a {
    min-height: 36px;
    border-radius: 10px;
    background: #eef3f6;
    color: #344054;
}

.lf-tabs a.active {
    border-color: #78dbc3;
    background: #e7fbf4;
    color: #074f43;
}

.creator-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(170px, 240px) minmax(170px, 240px);
    gap: 14px;
    align-items: stretch;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(15, 139, 115, .12), transparent 42%),
        linear-gradient(180deg, #fff 0%, #f8fbfd 100%);
    box-shadow: 0 14px 38px rgba(15, 23, 42, .06);
}

.creator-hero-copy {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 10px;
}

.creator-hero h2 {
    max-width: 780px;
    margin: 0;
    font-size: clamp(26px, 2.5vw, 42px);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.creator-hero p {
    max-width: 720px;
    margin: 0;
    color: #475467;
    font-size: 15px;
    font-weight: 650;
}

.creator-credit-card {
    min-height: 142px;
    display: grid;
    align-content: space-between;
    gap: 10px;
    padding: 16px;
    border: 1px solid #d9e6ef;
    border-radius: 14px;
    background: #fff;
}

.creator-credit-card span,
.creator-credit-card small {
    color: #667085;
    font-size: 12px;
    font-weight: 850;
}

.creator-credit-card strong {
    color: #101828;
    font-size: 38px;
    line-height: .95;
    letter-spacing: -.045em;
}

.creator-step-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.creator-step-card {
    min-height: 128px;
    display: grid;
    align-content: start;
    gap: 9px;
    padding: 16px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .045);
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.creator-step-card:hover {
    border-color: #75d9c1;
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.creator-step-card span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #e7fbf4;
    color: #08745f;
    font-weight: 950;
}

.creator-step-card strong {
    font-size: 16px;
}

.creator-step-card small {
    color: #667085;
    font-weight: 650;
    line-height: 1.35;
}

.creator-pack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
}

.creator-pack-card {
    display: grid;
    gap: 16px;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .05);
}

.creator-pack-card h2 {
    margin-bottom: 6px;
    font-size: 20px;
}

.creator-pack-card p {
    margin-bottom: 0;
    color: #667085;
    font-weight: 650;
}

.creator-pack-metric {
    display: grid;
    gap: 2px;
    padding: 14px;
    border-radius: 12px;
    background: #f4f8fb;
}

.creator-pack-metric strong {
    color: #101828;
    font-size: 34px;
    line-height: 1;
    letter-spacing: -.045em;
}

.creator-pack-metric span {
    color: #667085;
    font-weight: 850;
}

.project-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 14px;
}

.project-card,
.project-create-card {
    min-height: 220px;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .05);
}

.project-create-card {
    appearance: none;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 9px;
    color: #101828;
    font: inherit;
    text-align: center;
    cursor: pointer;
}

.project-create-card span {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid #c9eee4;
    border-radius: 13px;
    background: #e9fbf5;
    color: #08745f;
    font-size: 30px;
    line-height: 1;
}

.project-create-card strong {
    font-size: 18px;
}

.project-create-card small {
    color: #667085;
    font-weight: 650;
}

.project-card {
    display: grid;
    align-content: space-between;
    gap: 16px;
}

.project-card-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.project-card-metrics span {
    display: grid;
    gap: 3px;
    padding: 12px;
    border-radius: 12px;
    background: #f4f8fb;
}

.project-card-metrics strong {
    color: #101828;
    font-size: 24px;
    line-height: 1;
}

.project-card-metrics small {
    color: #667085;
    font-weight: 780;
}

.project-select-form {
    width: min(600px, 40vw);
    max-width: 600px;
}

.project-select {
    min-height: 44px;
    border-radius: 12px;
    font-weight: 860;
}

.summary-card {
    min-height: 74px;
    padding: 13px;
}

.summary-card strong {
    font-size: 26px;
}

.lf-progress-track {
    background: #e9eef3;
}

.lf-progress-track i {
    background: linear-gradient(90deg, #0f8b73, #2563eb);
}

.toggle-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

@media (max-width: 1200px) {
    .nova-topbar {
        grid-template-columns: var(--sidebar-width) minmax(260px, 1fr) auto;
    }

    .topbar-actions {
        display: none;
    }
}

@media (max-width: 980px) {
    .creator-hero {
        grid-template-columns: 1fr;
    }

    .creator-step-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .topbar-actions {
        display: none;
    }

    .nova-hero {
        min-height: 86px;
        padding: 16px;
    }
}

@media (max-width: 640px) {
    .creator-step-grid,
    .toggle-grid {
        grid-template-columns: 1fr;
    }

    .creator-hero h2 {
        font-size: 28px;
    }
}

/* Form reset: labels must sit above fields, not over user content. */
.nova-content .form-row,
.modal-card .form-row {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.nova-content .form-row label,
.modal-card .form-row label {
    position: static;
    top: auto;
    left: auto;
    z-index: auto;
    margin: 0;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: .04em;
    pointer-events: auto;
}

.nova-content .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.nova-content .form-row select,
.nova-content .form-row textarea,
.modal-card .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.modal-card .form-row select,
.modal-card .form-row textarea {
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 10px;
}

.nova-content .form-row textarea,
.modal-card .form-row textarea {
    min-height: 110px;
    line-height: 1.45;
}

.nova-content .form-row input[type="color"],
.modal-card .form-row input[type="color"] {
    width: 64px;
    height: 42px;
    min-height: 42px;
    padding: 4px;
    border-radius: 10px;
}

.nova-content .select2-container--default .select2-selection--single,
.modal-card .select2-container--default .select2-selection--single {
    min-height: 44px;
    height: 44px;
    border-radius: 10px;
}

.nova-content .select2-container--default .select2-selection--single .select2-selection__rendered,
.modal-card .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 36px 0 12px;
    line-height: 42px;
}

/* Calm guided dashboard. */
.page-dashboard-php .nova-hero {
    display: none;
}

.page-dashboard-php .workspace-content {
    gap: 16px;
}

.guide-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 16px;
    align-items: stretch;
    padding: 20px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .055);
}

.guide-main {
    display: grid;
    align-content: center;
    gap: 10px;
    min-width: 0;
}

.guide-main h2 {
    max-width: 760px;
    margin: 0;
    font-size: clamp(28px, 2.6vw, 44px);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.guide-main p {
    max-width: 720px;
    margin: 0;
    color: #475467;
    font-size: 15px;
    font-weight: 650;
}

.guide-side {
    display: grid;
    align-content: space-between;
    gap: 10px;
    padding: 16px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #f8fbfd;
}

.guide-side strong {
    color: #101828;
    font-size: 42px;
    line-height: .95;
    letter-spacing: -.045em;
}

.guide-side small {
    color: #667085;
    font-weight: 760;
}

.guide-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.guide-step {
    min-height: 118px;
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 14px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #fff;
    color: inherit;
    text-decoration: none;
}

.guide-step span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #eef4f6;
    color: #344054;
    font-size: 13px;
    font-weight: 950;
}

.guide-step strong {
    font-size: 15px;
}

.guide-step small {
    color: #667085;
    font-weight: 650;
    line-height: 1.35;
}

.guide-step.is-active {
    border-color: #6ed6bd;
    background: #f0fbf7;
}

.guide-step.is-active span,
.guide-step.is-done span {
    background: #0f8b73;
    color: #fff;
}

.guide-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.guide-panel {
    padding: 16px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .04);
}

.guide-metrics,
.mini-usage {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.mini-usage {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.guide-metrics span,
.mini-usage div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border-radius: 12px;
    background: #f4f8fb;
}

.guide-metrics strong,
.mini-usage strong {
    color: #101828;
    font-size: 24px;
    line-height: 1;
}

.guide-metrics small,
.mini-usage span {
    color: #667085;
    font-size: 12px;
    font-weight: 780;
}

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

.activity-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #f8fbfd;
}

.activity-row span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.activity-row small {
    color: #667085;
}

.activity-row em {
    color: #0f766e;
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

.thumb-strip {
    display: flex;
    gap: 10px;
    min-height: 76px;
    align-items: center;
    overflow-x: auto;
}

.thumb-strip img {
    width: 74px;
    height: 74px;
    flex: 0 0 74px;
    border-radius: 12px;
    object-fit: cover;
    background: #eef4f6;
}

.thumb-strip .image-lightbox-trigger {
    flex: 0 0 74px;
    border-radius: 12px;
}

.preset-gallery {
    grid-template-columns: repeat(auto-fill, minmax(218px, 1fr));
    align-items: stretch;
    gap: 16px;
}

.preset-card {
    position: relative;
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 0;
    overflow: hidden;
    padding: 0;
    border-color: #dbe7f0;
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.preset-card:hover {
    border-color: #9fe6d5;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .10);
    transform: translateY(-2px);
}

.preset-card.is-selected {
    border-color: #0f8b73;
    box-shadow: 0 0 0 3px rgba(15, 139, 115, .14), 0 22px 48px rgba(15, 139, 115, .16);
}

.preset-card-form {
    min-width: 0;
}

.preset-select-card {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: 190px 1fr;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    font: inherit;
}

.preset-select-card:disabled {
    cursor: default;
    opacity: 1;
    color: inherit;
}

.preset-select-card:focus-visible {
    outline: 0;
    box-shadow: inset 0 0 0 3px rgba(15, 139, 115, .24);
}

.preset-preview-shell {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 190px;
    padding: 16px;
    background:
        radial-gradient(circle at 78% 16%, rgba(255, 207, 90, .18), transparent 24%),
        linear-gradient(135deg, #f5f9fc, #edf5f8);
    border-bottom: 1px solid #e2ebf2;
}

.preset-preview-img {
    width: auto;
    height: auto;
    max-width: min(100%, 156px);
    max-height: 158px;
    aspect-ratio: var(--preset-ratio, 200 / 266);
    object-fit: cover;
    border-radius: 14px;
    background: #101828;
    box-shadow: 0 16px 32px rgba(15, 23, 42, .18);
}

.preset-selected-ribbon {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #0f8b73;
    color: #fff;
    font-size: 11px;
    font-weight: 950;
}

.preset-card-copy {
    display: grid;
    gap: 8px;
    min-height: 226px;
    padding: 16px 16px 12px;
}

.preset-meta-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.preset-size-pill {
    flex: 0 0 auto;
    padding: 4px 8px;
    border-radius: 999px;
    background: #eef5f7;
    color: #344054;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
}

.preset-title {
    min-height: 42px;
    color: #101828;
    font-size: 16px;
    line-height: 1.22;
}

.preset-format {
    color: #667085;
    font-size: 12px;
    font-weight: 850;
}

.preset-description {
    min-height: 58px;
    color: #344054;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.preset-select-cta {
    align-self: end;
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 11px;
    border-radius: 9px;
    background: #0f172a;
    color: #fff;
    font-size: 12px;
    font-weight: 950;
}

.preset-card.is-selected .preset-select-cta {
    background: #e6f8f2;
    color: #0f8b73;
}

.preset-card-actions {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 16px 16px;
}

@media (max-width: 760px) {
    .preset-gallery {
        grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    }

    .preset-select-card {
        grid-template-rows: 170px 1fr;
    }

    .preset-preview-shell {
        min-height: 170px;
    }

    .preset-preview-img {
        max-height: 138px;
    }
}

.brand-font-preview {
    display: grid;
    gap: 6px;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: linear-gradient(135deg, #f8fbfd, #ffffff);
}

.font-book-field {
    position: relative;
    display: grid;
    gap: 8px;
}

.font-book-field > label {
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
}

.font-book-trigger {
    width: 100%;
    min-height: 68px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid #d1ddeb;
    border-radius: 16px;
    background: #fff;
    color: #101828;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .04);
}

.font-book-trigger:hover,
.font-book-field.is-open .font-book-trigger {
    border-color: rgba(15, 139, 115, .45);
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .10);
}

.font-book-trigger span:not(.font-book-icon) {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.font-book-trigger strong {
    overflow: hidden;
    color: #101828;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.font-book-trigger small {
    color: #667085;
    font-weight: 760;
}

.font-book-trigger i {
    color: #0f8b73;
    font-size: 12px;
    font-style: normal;
    font-weight: 950;
}

.font-book-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #eef4f6;
    color: #101828;
    font-weight: 950;
}

.font-book-menu {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 50;
    width: min(360px, 100%);
    max-height: 460px;
    display: none;
    overflow-y: auto;
    padding: 10px;
    border: 1px solid #dce7ef;
    border-radius: 18px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 28px 70px rgba(15, 23, 42, .18);
}

.font-book-field.is-open .font-book-menu {
    display: grid;
    gap: 8px;
}

.font-upload-card {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px dashed #9aa9c0;
    border-radius: 14px;
    background: #fbfdff;
    cursor: pointer;
}

.font-upload-card span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #101828;
    font-weight: 950;
}

.font-upload-card small {
    color: #667085;
    font-size: 12px;
    font-weight: 720;
}

.font-upload-card input {
    display: none;
}

.font-search-box input {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid #d1ddeb;
    border-radius: 12px;
    background: #fff;
}

.font-book-section {
    display: block;
    padding: 6px 8px 2px;
    color: #667085;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.font-option {
    width: 100%;
    display: grid;
    gap: 6px;
    padding: 12px;
    border: 1px solid #dce7ef;
    border-radius: 12px;
    background: #fff;
    color: #101828;
    text-align: left;
    cursor: pointer;
}

.font-option:hover,
.font-option.is-selected {
    border-color: rgba(15, 139, 115, .45);
    background: #f0fffb;
}

.font-option span {
    color: #344054;
    font-size: 12px;
    font-weight: 850;
}

.font-option strong {
    color: #101828;
    font-size: 20px;
    line-height: 1.05;
}

.font-option.is-selected::after {
    content: "Selected";
    width: max-content;
    padding: 5px 8px;
    border-radius: 999px;
    background: #0f8b73;
    color: #fff;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.font-empty,
.font-upload-status {
    margin: 0;
    padding: 8px;
    color: #667085;
    font-size: 12px;
    font-weight: 760;
}

.font-upload-status.is-error {
    color: #c2413d;
}

.brand-font-preview strong {
    color: #101828;
    font-size: 30px;
    line-height: 1;
}

.brand-font-preview small {
    color: #667085;
    font-weight: 720;
}

.plan-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.plan-summary-grid div {
    display: grid;
    gap: 5px;
    padding: 13px 14px;
    border: 1px solid #dce7ef;
    border-radius: 12px;
    background: #f8fbfd;
}

.plan-summary-grid span {
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.plan-summary-grid strong {
    color: #101828;
    font-size: 18px;
    line-height: 1.15;
}

.feature-pill-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.feature-pill {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border: 1px solid #dce7ef;
    border-radius: 12px;
    background: #f8fbfd;
}

.feature-pill span {
    font-weight: 800;
}

@media (max-width: 980px) {
    .guide-hero,
    .guide-grid {
        grid-template-columns: 1fr;
    }

    .guide-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .guide-steps,
    .guide-metrics,
    .mini-usage {
        grid-template-columns: 1fr;
    }
}

/* Premium project dropdown */
.project-menu-form {
    display: grid;
    grid-template-columns: auto minmax(220px, 1fr);
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 560px;
}

.project-menu-form label {
    margin: 0;
    color: #667085;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.project-menu {
    position: relative;
    min-width: 0;
}

.project-menu-trigger {
    position: relative;
    width: 100%;
    min-height: 52px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 7px 42px 7px 9px;
    border: 1px solid #cfd9e7;
    border-radius: 14px;
    background: #fff;
    color: #101828;
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 12px 30px rgba(15, 23, 42, .04);
}

.project-menu-trigger::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #667085;
    transform: translateY(-50%);
    transform-origin: 50% 35%;
    transition: transform .16s ease, border-top-color .16s ease;
}

.project-menu.is-open .project-menu-trigger {
    border-color: #7adbc4;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .12), 0 18px 44px rgba(15, 23, 42, .10);
}

.project-menu-trigger:focus {
    outline: 0;
    border-color: #7adbc4;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .12), 0 18px 44px rgba(15, 23, 42, .08);
}

.project-menu.is-open .project-menu-trigger::after {
    border-top-color: #0f8b73;
    transform: translateY(-50%) rotate(180deg);
}

.project-menu-trigger-mark,
.project-menu-avatar,
.project-menu-create-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: linear-gradient(135deg, #24d18f, #ffcf5a);
    color: #07111f;
    font-size: 13px;
    font-weight: 950;
}

.project-menu-trigger-copy,
.project-menu-option-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.project-menu-trigger-copy strong,
.project-menu-option-copy strong {
    overflow: hidden;
    color: #101828;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-menu-trigger-copy small,
.project-menu-option-copy small,
.project-menu-create small {
    overflow: hidden;
    color: #667085;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-menu-trigger-meta {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    background: #eef4f6;
    color: #475467;
    font-size: 12px;
    font-weight: 900;
}

.project-menu-panel {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    z-index: 220;
    width: min(620px, calc(100vw - 24px));
    max-height: min(520px, calc(100vh - 120px));
    overflow-y: auto;
    display: none;
    gap: 7px;
    padding: 8px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 28px 80px rgba(15, 23, 42, .22);
    backdrop-filter: blur(16px);
}

.project-menu.is-open .project-menu-panel {
    display: grid;
}

.project-menu-option,
.project-menu-create {
    width: 100%;
    min-height: 62px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: 13px;
    background: transparent;
    color: #101828;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.project-menu-panel .project-menu-option,
.project-menu-panel .project-menu-create {
    min-height: 62px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: 13px;
    background: transparent;
    color: #101828;
    font: inherit;
    text-align: left;
}

.project-menu-option + .project-menu-option,
.project-menu-create + .project-menu-option {
    margin-top: 2px;
}

.project-menu-panel .project-menu-option:hover,
.project-menu-panel .project-menu-option:focus,
.project-menu-panel .project-menu-option.is-selected {
    border-color: #cfe9e2;
    background: #f0fbf7;
    color: #101828;
    outline: 0;
}

.project-menu-option.is-selected .project-menu-avatar {
    background: #101828;
    color: #fff;
}

.project-menu-option.is-selected::after {
    content: "Selected";
    justify-self: end;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    background: #101828;
    color: #fff;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.project-menu-option.is-selected .project-menu-stats {
    display: none;
}

.project-menu-create {
    border-color: #bfeee1;
    background: linear-gradient(135deg, #ecfff8, #f8fbfd);
}

.project-menu-panel .project-menu-create,
.project-menu-panel .project-menu-create:hover,
.project-menu-panel .project-menu-create:focus {
    border-color: #79d9c2;
    background: linear-gradient(135deg, #ecfff8, #f8fbfd);
    color: #101828;
    outline: 0;
}

.project-menu-create strong {
    display: block;
    color: #075c4b;
    font-size: 14px;
    font-weight: 950;
}

.project-menu-create-icon {
    background: #0f8b73;
    color: #fff;
    font-size: 20px;
}

.project-menu-stats {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.project-menu-stats em {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    background: #eef4f6;
    color: #475467;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

@media (max-width: 1200px) {
    .project-menu-form {
        max-width: 520px;
    }
}

@media (max-width: 900px) {
    .project-menu-form {
        grid-template-columns: 1fr;
        width: 100%;
        max-width: none;
    }

    .project-menu-panel {
        width: 100%;
    }
}

@media (max-width: 560px) {
    .project-menu-trigger,
    .project-menu-option,
    .project-menu-create,
    .project-menu-panel .project-menu-option,
    .project-menu-panel .project-menu-create {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .project-menu-trigger-meta,
    .project-menu-stats,
    .project-menu-option.is-selected::after {
        display: none;
    }
}

/* LobbyForge checkbox controls */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.nova-body input[type="checkbox"],
.login-page input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    display: inline-block;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    flex: 0 0 22px;
    margin: 0;
    padding: 0 !important;
    border: 1.5px solid #b8c7d8;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    vertical-align: middle;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.nova-body input[type="checkbox"]::after,
.login-page input[type="checkbox"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 6px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: translate(-50%, -62%) rotate(-45deg) scale(.6);
    opacity: 0;
    transition: opacity .14s ease, transform .14s ease;
}

.nova-body input[type="checkbox"]:hover,
.login-page input[type="checkbox"]:hover {
    border-color: #0f8b73;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .08);
}

.nova-body input[type="checkbox"]:checked,
.login-page input[type="checkbox"]:checked {
    border-color: #0f8b73;
    background-color: #0f8b73;
    box-shadow: 0 0 0 3px rgba(15, 139, 115, .14), 0 8px 18px rgba(15, 139, 115, .12);
}

.nova-body input[type="checkbox"]:checked::after,
.login-page input[type="checkbox"]:checked::after {
    opacity: 1;
    transform: translate(-50%, -62%) rotate(-45deg) scale(1);
}

.nova-body input[type="checkbox"]:focus-visible,
.login-page input[type="checkbox"]:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .18);
}

.nova-body input[type="checkbox"]:disabled,
.login-page input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.check-row,
.lf-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #101828;
    font-weight: 850;
    line-height: 1.25;
}

.check-row {
    min-height: 46px;
    padding: 11px 13px;
    border: 1px solid #dce7ef;
    border-radius: 12px;
    background: #f8fbfd;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.check-row:hover {
    border-color: #b8eadf;
    background: #f0fbf7;
}

.check-row:has(input[type="checkbox"]:checked) {
    border-color: #93ddcc;
    background: #eefbf7;
    box-shadow: inset 0 0 0 1px rgba(15, 139, 115, .05);
}

.table-checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 34px;
}

.table-checkbox input[type="checkbox"] {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    flex-basis: 24px;
    border-radius: 9px;
}

.import-upload-card .section-head {
    margin-bottom: 18px;
}

.import-upload-shell {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(180px, 240px);
    gap: 12px;
    align-items: end;
}

.import-analyze-status {
    min-height: 20px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 780;
}

.import-analyze-status.is-loading {
    color: var(--blue);
}

.import-analyze-status.is-success {
    color: var(--accent-strong);
}

.import-analyze-status.is-error {
    color: var(--danger);
}

.csv-import-modal .modal-card.wide {
    width: min(1280px, 100%);
}

.import-analyzer-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.import-analyzer-stats article {
    min-height: 74px;
    display: grid;
    align-content: space-between;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
}

.import-analyzer-stats span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.import-analyzer-stats strong {
    font-size: 25px;
    line-height: 1;
    letter-spacing: -.03em;
}

.import-map-scroll {
    max-height: min(54vh, 560px);
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
}

.import-map-table {
    width: 100%;
    min-width: 900px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.import-map-table th,
.import-map-table td {
    min-width: 180px;
    max-width: 260px;
    padding: 10px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.import-map-table th:last-child,
.import-map-table td:last-child {
    border-right: 0;
}

.import-map-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f6f9fd;
    box-shadow: 0 1px 0 var(--line);
}

.import-map-table th > span {
    display: block;
    min-height: 18px;
    margin-bottom: 8px;
    overflow: hidden;
    color: var(--ink);
    font-size: 12px;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-map-table th select {
    min-height: 42px;
    padding: 8px 10px;
    border-radius: 10px;
}

.import-map-table th .select2-container--default .select2-selection--single {
    height: 42px;
    min-height: 42px;
    border-radius: 10px;
}

.import-map-table th .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 12px 30px 8px 10px;
}

.import-map-table th .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
}

.import-map-table td {
    overflow: hidden;
    color: var(--ink-soft);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-row-filters {
    margin: 16px 0 18px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fafc;
}

.import-row-filters .form-grid.three {
    display: grid;
    grid-template-columns: minmax(170px, 1.25fr) minmax(120px, .8fr) minmax(160px, 1fr) minmax(120px, .8fr) minmax(145px, .9fr) minmax(170px, 1.2fr);
    gap: 10px;
    align-items: end;
}

.remote-modal-card .import-row-filters .form-row {
    gap: 5px;
}

.remote-modal-card .import-row-filters .form-row label {
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.remote-modal-card .import-row-filters input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.remote-modal-card .import-row-filters select {
    min-height: 40px;
    height: 40px;
    padding: 8px 10px;
    border-radius: 10px;
}

.import-row-filters .modal-actions {
    margin-top: 12px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.import-row-filters .modal-actions .btn {
    min-height: 40px;
}

.import-rows-modal-table-wrap {
    max-height: min(56vh, 620px);
    overflow: auto;
}

.import-rows-modal-table-wrap table {
    min-width: 1320px;
}

.import-row-thumb,
.import-row-thumb-empty {
    width: 50px;
}

.import-row-thumb .lf-thumb,
.import-row-thumb-empty {
    width: 48px;
    height: 48px;
    border-radius: 8px;
}

.import-row-thumb-empty {
    font-size: 10px;
}

.import-rows-modal-table-wrap small {
    display: block;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-row-log-summary {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0;
}

.import-row-log-summary article,
.import-row-log-error,
.import-row-log-timeline,
.import-row-raw-data {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}

.import-row-log-summary article {
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 12px;
}

.import-row-log-summary span,
.import-row-log-timeline time,
.import-row-raw-data span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.import-row-log-summary strong,
.import-row-raw-data strong {
    min-width: 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-row-log-error {
    margin: 0 0 18px;
    padding: 14px;
    border-color: #fecaca;
    background: #fff7f7;
}

.import-row-log-error p {
    margin: 8px 0 0;
    color: #991b1b;
    font-weight: 800;
}

.import-row-log-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    gap: 18px;
    align-items: start;
}

.import-row-log-timeline,
.import-row-raw-data {
    margin-top: 8px;
    max-height: min(52vh, 560px);
    overflow: auto;
}

.import-row-log-timeline article {
    position: relative;
    display: grid;
    gap: 6px;
    padding: 14px 14px 14px 34px;
    border-bottom: 1px solid var(--line);
}

.import-row-log-timeline article::before {
    content: "";
    position: absolute;
    top: 19px;
    left: 14px;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--accent);
}

.import-row-log-timeline article:last-child {
    border-bottom: 0;
}

.import-row-log-timeline strong {
    color: var(--ink);
    font-size: 14px;
}

.import-row-log-timeline p {
    margin: 0;
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.5;
}

.import-row-log-timeline dl {
    display: grid;
    gap: 6px;
    margin: 4px 0 0;
}

.import-row-log-timeline dl div,
.import-row-raw-data div {
    display: grid;
    grid-template-columns: minmax(120px, .45fr) minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
}

.import-row-log-timeline dt,
.import-row-log-timeline dd {
    margin: 0;
    min-width: 0;
    font-size: 12px;
}

.import-row-log-timeline dt {
    color: var(--muted);
    font-weight: 800;
}

.import-row-log-timeline dd {
    overflow-wrap: anywhere;
    color: var(--ink);
}

.import-row-raw-data {
    display: grid;
    gap: 0;
}

.import-row-raw-data div {
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
}

.import-row-raw-data div:last-child {
    border-bottom: 0;
}

.import-row-raw-data strong {
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
    .import-row-filters .form-grid.three {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .import-row-log-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .import-row-log-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .import-row-filters .form-grid.three {
        grid-template-columns: 1fr;
    }

    .import-row-filters .modal-actions {
        justify-content: stretch;
    }

    .import-row-filters .modal-actions .btn {
        flex: 1;
    }

    .import-row-log-summary {
        grid-template-columns: 1fr;
    }

    .import-row-log-timeline dl div,
    .import-row-raw-data div {
        grid-template-columns: 1fr;
    }
}

.import-option-row {
    width: fit-content;
}

.batch-builder-form {
    gap: 16px;
}

.batch-target-builder {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid #d8e2ee;
    border-radius: 14px;
    background: #f8fafc;
}

.section-head.compact {
    margin-bottom: 0;
}

.batch-summary-pill {
    min-width: 160px;
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 999px;
    background: #f0fdf4;
    color: #166534;
    font-size: 12px;
    font-weight: 900;
    text-align: center;
}

.batch-mode-switch {
    width: fit-content;
    display: grid;
    grid-template-columns: repeat(2, minmax(150px, 1fr));
    gap: 6px;
    padding: 5px;
    border: 1px solid #cfd9e7;
    border-radius: 12px;
    background: #fff;
}

.batch-mode-switch label,
.batch-provider-options label,
.batch-provider-card,
.batch-game-row {
    cursor: pointer;
}

.batch-mode-switch input,
.batch-provider-card input,
.batch-provider-options input,
.batch-game-row input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.batch-mode-switch span {
    min-height: 38px;
    display: grid;
    place-items: center;
    padding: 8px 14px;
    border-radius: 9px;
    color: #475467;
    font-size: 13px;
    font-weight: 900;
}

.batch-mode-switch input:checked + span {
    background: #101828;
    color: #fff;
}

.batch-mode-panel {
    display: none;
    gap: 14px;
}

.batch-mode-panel.is-active {
    display: grid;
}

.batch-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 12px;
    align-items: end;
}

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

.batch-game-list {
    max-height: 430px;
    display: grid;
    gap: 8px;
    overflow: auto;
    padding-right: 4px;
}

.batch-game-row {
    min-height: 58px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border: 1px solid #d8e2ee;
    border-radius: 12px;
    background: #fff;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.batch-game-row[hidden] {
    display: none;
}

.batch-game-row::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
}

.batch-game-row:has(input:checked) {
    border-color: #14b8a6;
    box-shadow: 0 12px 30px rgba(20, 184, 166, .12);
}

.batch-game-row:has(input:checked)::before {
    border-color: #0f766e;
    background: #0f766e;
    box-shadow: inset 0 0 0 4px #fff;
}

.batch-game-main {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.batch-game-main strong,
.batch-provider-card strong {
    overflow: hidden;
    color: #101828;
    font-size: 14px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.batch-game-main small,
.batch-provider-card small {
    overflow: hidden;
    color: #667085;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.batch-provider-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.batch-provider-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.batch-provider-toolbar strong {
    color: #101828;
    font-size: 13px;
    font-weight: 950;
}

.batch-provider-toolbar div {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.batch-provider-card {
    min-height: 74px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid #d8e2ee;
    border-radius: 12px;
    background: #fff;
}

.batch-provider-card::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
}

.batch-provider-card:has(input:checked) {
    border-color: #2563eb;
    background: #eff6ff;
}

.batch-provider-card:has(input:checked)::before {
    border-color: #1d4ed8;
    background: #1d4ed8;
    box-shadow: inset 0 0 0 4px #fff;
}

.batch-provider-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.batch-provider-options span {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 12px;
    border: 1px solid #d8e2ee;
    border-radius: 12px;
    background: #fff;
    color: #475467;
    font-size: 13px;
    font-weight: 850;
}

.batch-provider-options input:checked + span {
    border-color: #101828;
    color: #101828;
    box-shadow: inset 0 0 0 1px #101828;
}

.batch-game-choice {
    padding: 6px 8px;
    border-radius: 999px;
    background: #fef2f2;
    color: #991b1b;
    font-size: 11px;
    font-weight: 900;
}

.is-only-selected .batch-game-choice {
    background: #ecfdf5;
    color: #047857;
}

.batch-submit-bar {
    position: sticky;
    bottom: 12px;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid #cfe9e2;
    border-radius: 14px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 52px rgba(15, 23, 42, .14);
    backdrop-filter: blur(14px);
}

.batch-submit-bar div {
    display: grid;
    gap: 2px;
}

.batch-submit-bar strong {
    color: #101828;
    font-size: 15px;
}

.batch-submit-bar small {
    color: #667085;
    font-weight: 720;
}

@media (max-width: 900px) {
    .batch-toolbar,
    .batch-provider-options,
    .batch-submit-bar {
        grid-template-columns: 1fr;
    }

    .batch-submit-bar {
        display: grid;
    }

    .batch-submit-bar .btn {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .batch-mode-switch {
        width: 100%;
        grid-template-columns: 1fr;
    }

    .batch-provider-toolbar {
        display: grid;
    }

    .batch-provider-toolbar div {
        justify-content: stretch;
    }

    .batch-provider-toolbar .btn {
        flex: 1;
    }

    .batch-toolbar-actions {
        flex-wrap: wrap;
        justify-content: stretch;
    }

    .batch-toolbar-actions .btn {
        flex: 1;
    }
}

.import-progress-card {
    display: grid;
    gap: 12px;
}

.import-progress-note {
    min-height: 20px;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 760;
}

.table-progress {
    display: grid;
    min-width: 170px;
    gap: 6px;
}

.table-progress strong {
    font-size: 12px;
}

.table-progress .lf-progress-track {
    height: 7px;
}

@media (max-width: 720px) {
    .import-upload-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .import-analyzer-stats {
        grid-template-columns: 1fr;
    }

    .import-option-row {
        width: 100%;
    }
}

/* LobbyForge brand assets */
.nova-brand.lf-brand {
    justify-content: flex-start;
    padding: 12px 17px;
    overflow: hidden;
}

.lf-brand-full {
    display: block;
    width: 170px;
    max-width: 100%;
    height: 40px;
    flex: 0 0 auto;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 8px 18px rgba(0, 153, 255, .16));
}

.login-card .login-logo {
    display: block;
    width: min(220px, 100%) !important;
    max-width: 220px !important;
    height: auto;
    max-height: 56px;
    margin: 0 0 22px;
    object-fit: contain;
    object-position: left center;
}

.trial-card {
    width: min(760px, 100%);
}

.login-page {
    background:
        linear-gradient(110deg, rgba(0, 104, 255, .08), rgba(8, 200, 239, .08) 48%, transparent 49%),
        linear-gradient(180deg, #ffffff 0%, #f4f8fc 100%);
}

.login-card {
    border: 1px solid #dce6f0;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 30px 90px rgba(6, 17, 31, .16);
}

.trial-card h1 {
    max-width: 560px;
    margin-bottom: 16px;
    font-size: clamp(42px, 5.2vw, 68px);
    line-height: .9;
    letter-spacing: 0;
    font-weight: 950;
}

.trial-card .muted {
    max-width: 610px;
    font-size: 16px;
    line-height: 1.5;
}

.trial-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.trial-plan-list {
    display: grid;
    gap: 10px;
    margin: 14px 0 18px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.trial-plan-list div {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.trial-plan-list div:last-child {
    border-bottom: 0;
}

.trial-plan-list strong {
    color: var(--ink);
}

.trial-plan-list span,
.login-links {
    color: var(--muted);
}

.google-auth-form {
    display: none;
}

.google-auth-panel {
    display: grid;
    justify-items: stretch;
    margin: 18px 0 12px;
}

.google-auth-panel > div {
    max-width: 100%;
}

.google-auth-divider {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    margin: 6px 0 16px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
}

.google-auth-divider::before,
.google-auth-divider::after {
    content: "";
    height: 1px;
    background: var(--line);
}

.trial-complete-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 4px 0 18px;
}

.trial-complete-summary div {
    min-height: 72px;
    display: grid;
    align-content: center;
    gap: 5px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #f7fbff;
}

.trial-complete-summary span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}

.trial-complete-summary strong {
    color: var(--ink);
    font-size: 17px;
    line-height: 1.15;
}

.trial-accept {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 18px;
    color: var(--ink-soft);
    font-size: 13px;
    font-weight: 700;
}

.trial-accept input {
    margin-top: 2px;
}

.login-links {
    margin-top: 18px;
    text-align: center;
    font-size: 13px;
    font-weight: 800;
}

.login-links a {
    color: var(--blue);
    text-decoration: none;
}

.login-assist {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.forgot-link {
    justify-self: center;
    color: var(--muted);
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 104, 255, .28);
    transition: color .16s ease, border-color .16s ease;
}

.forgot-link:hover {
    color: var(--blue);
    border-color: var(--blue);
}

.login-trial-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px;
    border: 1px solid #dce6f0;
    border-radius: 14px;
    background: #f7fbff;
}

.login-trial-callout div {
    display: grid;
    gap: 2px;
    text-align: left;
}

.login-trial-callout strong {
    color: var(--ink);
    font-size: 14px;
    line-height: 1.2;
}

.login-trial-callout span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 760;
    line-height: 1.35;
}

.login-trial-callout a {
    min-height: 38px;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border: 1px solid var(--ink);
    border-radius: 10px;
    color: #fff;
    background: var(--ink);
    font-size: 13px;
    font-weight: 950;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.login-trial-callout a:hover {
    transform: translateY(-1px);
    border-color: var(--blue);
    background: var(--blue);
}

@media (max-width: 720px) {
    .trial-grid,
    .trial-complete-summary,
    .trial-plan-list div {
        grid-template-columns: 1fr;
    }

    .login-trial-callout {
        align-items: stretch;
        flex-direction: column;
    }

    .login-trial-callout a {
        width: 100%;
    }
}

@media (max-width: 900px) {
    .nova-brand.lf-brand {
        padding: 11px 14px;
    }

    .lf-brand-full {
        width: 158px;
        height: 38px;
    }
}

/* Project settings: guided brand setup */
.nova-topbar {
    border-bottom: 0 !important;
}

.nova-topbar::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: var(--sidebar-width);
    height: 1px;
    background: rgba(223, 231, 241, .88);
    pointer-events: none;
}

.nova-brand.lf-brand {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.brand-settings-shell {
    display: grid;
    gap: 16px;
}

.brand-settings-form {
    display: grid;
    gap: 16px;
}

.brand-settings-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 18px;
    align-items: stretch;
    padding: 22px;
    border: 1px solid #dce7ef;
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 8%, rgba(36, 209, 143, .18), transparent 26%),
        linear-gradient(135deg, #ffffff 0%, #f3f8fb 100%);
    box-shadow: 0 18px 48px rgba(15, 23, 42, .06);
}

.brand-settings-intro {
    display: grid;
    align-content: center;
    gap: 12px;
    min-width: 0;
}

.brand-settings-intro h2 {
    max-width: 760px;
    margin: 0;
    color: #101828;
    font-size: clamp(30px, 4vw, 52px);
    line-height: .98;
    letter-spacing: 0;
}

.brand-settings-intro p {
    max-width: 680px;
    margin: 0;
    color: #475467;
    font-size: 16px;
    font-weight: 760;
    line-height: 1.45;
}

.brand-setup-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
}

.brand-setup-steps span {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px 0 8px;
    border: 1px solid #d5e4ee;
    border-radius: 999px;
    background: #fff;
    color: #344054;
    font-size: 13px;
    font-weight: 900;
}

.brand-setup-steps b {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #e9fbf6;
    color: #0f8b73;
    font-size: 12px;
}

.brand-live-preview {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 16px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: rgba(255, 255, 255, .78);
}

.brand-preview-art {
    min-height: 260px;
    display: grid;
    align-content: end;
    gap: 10px;
    padding: 18px;
    overflow: hidden;
    border-radius: 14px;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--brand-primary) 88%, #000 12%), color-mix(in srgb, var(--brand-secondary) 72%, #0b1220 28%)),
        #0f172a;
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .10), 0 18px 38px rgba(15, 23, 42, .18);
}

.brand-preview-art img {
    max-width: 190px;
    max-height: 74px;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 8px 20px rgba(0, 0, 0, .28));
}

.brand-preview-art strong {
    color: #fff;
    font-size: 27px;
    line-height: 1;
}

.brand-preview-art small {
    color: rgba(255, 255, 255, .72);
    font-weight: 760;
}

.brand-preview-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.brand-preview-pills span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-size: 12px;
    font-weight: 950;
}

.settings-step-panel {
    display: grid;
    grid-template-columns: minmax(210px, 280px) minmax(0, 1fr);
    gap: 18px;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .045);
}

.settings-step-title {
    display: grid;
    align-content: start;
    gap: 8px;
}

.settings-step-title span {
    width: max-content;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    border-radius: 999px;
    background: #e9fbf6;
    color: #0f8b73;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.settings-step-title h3 {
    margin: 0;
    color: #101828;
    font-size: 22px;
    line-height: 1.1;
    letter-spacing: 0;
}

.settings-step-title p {
    margin: 0;
    color: #667085;
    font-weight: 720;
    line-height: 1.42;
}

.settings-step-content {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.settings-step-content .form-row.is-wide {
    grid-column: 1 / -1;
}

.logo-step-content {
    grid-template-columns: minmax(220px, 330px) minmax(0, 1fr);
    align-items: stretch;
}

.logo-drop-preview,
.logo-upload-box {
    display: grid;
    align-content: center;
    gap: 12px;
    min-height: 180px;
    padding: 18px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: #f8fbfd;
}

.logo-drop-preview img {
    max-width: 220px;
    max-height: 86px;
    object-fit: contain;
    object-position: left center;
}

.logo-drop-preview strong {
    color: #101828;
    font-size: 18px;
}

.logo-drop-preview small {
    color: #667085;
    font-weight: 720;
}

.logo-upload-box {
    position: relative;
    border-style: dashed;
    background: linear-gradient(135deg, #ffffff, #f6fbfd);
}

.logo-dropzone {
    place-items: center;
    text-align: center;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.logo-dropzone:hover,
.logo-dropzone.is-dragging {
    border-color: rgba(15, 139, 115, .58);
    background: linear-gradient(135deg, #f0fffb, #ffffff);
    box-shadow: 0 0 0 4px rgba(15, 139, 115, .10);
    transform: translateY(-1px);
}

.logo-dropzone.has-file {
    border-color: rgba(15, 139, 115, .48);
    background: linear-gradient(135deg, #f1fffb, #fff);
}

.logo-dropzone input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.logo-upload-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: #e9fbf6;
    color: #0f8b73;
}

.logo-upload-icon .nav-icon {
    width: 23px;
    height: 23px;
}

.logo-upload-box strong {
    color: #101828;
    font-size: 19px;
    line-height: 1.1;
}

.logo-upload-box small {
    max-width: 320px;
    color: #667085;
    font-weight: 720;
}

.logo-upload-box em {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 10px;
    background: #101828;
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 950;
}

.logo-upload-box label {
    margin: 0;
    color: #101828;
    font-size: 18px;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: none;
}

.brand-color-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.brand-color-card {
    position: relative;
    min-height: 132px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 74px;
    gap: 12px;
    align-items: center;
    padding: 16px;
    border: 1px solid #dce7ef;
    border-radius: 16px;
    background: #f8fbfd;
}

.brand-color-card span,
.brand-color-card small,
.brand-color-card b {
    grid-column: 1;
}

.brand-color-card span {
    color: #101828;
    font-size: 16px;
    font-weight: 950;
}

.brand-color-card small {
    color: #667085;
    font-weight: 720;
    line-height: 1.35;
}

.brand-color-card b {
    color: #344054;
    font-size: 12px;
    font-weight: 950;
}

.brand-color-card input[type="color"] {
    grid-column: 2;
    grid-row: 1 / 4;
    width: 74px;
    height: 74px;
    padding: 4px;
    border: 1px solid #cfd9e7;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
}

.settings-save-bar {
    position: sticky;
    bottom: 12px;
    z-index: 15;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid #cfe9e2;
    border-radius: 16px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 52px rgba(15, 23, 42, .14);
    backdrop-filter: blur(16px);
}

.settings-save-bar div {
    display: grid;
    gap: 3px;
}

.settings-save-bar strong {
    color: #101828;
    font-size: 15px;
}

.settings-save-bar small {
    color: #667085;
    font-weight: 720;
}

@media (max-width: 1100px) {
    .brand-settings-hero,
    .settings-step-panel,
    .logo-step-content {
        grid-template-columns: 1fr;
    }

    .brand-color-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .nova-topbar::after {
        left: 0;
    }
}

/* Modal select fixes: dropdowns are mounted on body to avoid modal clipping. */
body > .select2-container--open {
    z-index: 13000 !important;
}

body > .select2-container--open .select2-dropdown,
.select2-dropdown {
    z-index: 13001 !important;
    background: #fff;
    border: 1px solid #cfd9e7;
    border-radius: 12px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
    overflow: hidden;
}

.modal-card .form-row,
.remote-modal-card .form-row {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 7px;
    overflow: visible;
}

.modal-card .form-row label,
.remote-modal-card .form-row label {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    margin: 0;
    color: #667085;
    background: transparent;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: .04em;
    pointer-events: auto;
}

.modal-card .select2-container,
.remote-modal-card .select2-container {
    width: 100% !important;
    z-index: auto;
}

.modal-card .select2-container--default .select2-selection--single,
.remote-modal-card .select2-container--default .select2-selection--single {
    min-height: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    border: 1px solid #cfd9e7;
    border-radius: 12px;
    background: #fff;
}

.modal-card .select2-container--default .select2-selection--single .select2-selection__rendered,
.remote-modal-card .select2-container--default .select2-selection--single .select2-selection__rendered {
    width: 100%;
    padding: 0 38px 0 13px;
    color: #101828;
    line-height: 46px;
}

.modal-card .select2-container--default .select2-selection--single .select2-selection__arrow,
.remote-modal-card .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 46px;
    right: 8px;
}

/* 2026 BO modal polish: dense, scannable forms instead of single-field stacks. */
.modal-card .module-form,
.remote-modal-card .module-form {
    gap: 18px;
}

.modal-card.small-modal {
    width: min(640px, 100%);
}

.modal-card .form-grid,
.remote-modal-card .form-grid {
    display: grid;
    gap: 14px;
    align-items: start;
}

.modal-card .form-grid.two,
.remote-modal-card .form-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.modal-card .form-grid.three,
.remote-modal-card .form-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.modal-card .form-grid.four,
.remote-modal-card .form-grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.modal-card .form-grid .span-2,
.remote-modal-card .form-grid .span-2,
.modal-card .form-row.full,
.remote-modal-card .form-row.full {
    grid-column: 1 / -1;
}

.modal-card > .data-card,
.remote-modal-card > .data-card {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.modal-card .section-head,
.remote-modal-card .section-head {
    margin-bottom: 14px;
}

.modal-card .section-head.compact,
.remote-modal-card .section-head.compact {
    margin-bottom: 10px;
}

.modal-card .form-row small,
.remote-modal-card .form-row small {
    color: #667085;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

.modal-card .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.modal-card .form-row select,
.modal-card .form-row textarea,
.remote-modal-card .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.remote-modal-card .form-row select,
.remote-modal-card .form-row textarea {
    min-height: 48px;
    border-color: #cfd9e7;
    background: #fff;
}

.modal-card .modal-actions,
.remote-modal-card .modal-actions {
    position: sticky;
    bottom: -24px;
    z-index: 6;
    margin: 4px -24px -24px;
    padding: 14px 24px 16px;
    border-top: 1px solid #dfe7f1;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(10px);
}

.modal-card .company-admin-fields,
.remote-modal-card .company-admin-fields,
.modal-card .project-permission-editor,
.remote-modal-card .project-permission-editor {
    border-radius: 14px;
}

.remote-modal-card .import-row-filters .modal-actions {
    position: static;
    margin: 12px 0 0;
    padding: 0;
    border-top: 0;
    background: transparent;
    backdrop-filter: none;
}

@media (max-width: 860px) {
    .modal-card .form-grid.two,
    .modal-card .form-grid.three,
    .modal-card .form-grid.four,
    .remote-modal-card .form-grid.two,
    .remote-modal-card .form-grid.three,
    .remote-modal-card .form-grid.four {
        grid-template-columns: 1fr;
    }
}

.select2-results__option {
    color: #101828;
}

.select2-results__option--selectable {
    cursor: pointer;
}

.generate-modal-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
    gap: 14px;
    align-items: start;
}

.generate-builder-card,
.generate-helper-panel .data-card {
    border-radius: 16px;
}

.generate-builder-card {
    display: grid;
    gap: 14px;
}

.generate-game-summary {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid #dce7ef;
    border-radius: 14px;
    background: linear-gradient(135deg, #f8fbfd, #fff);
}

.generate-game-summary.has-approved {
    grid-template-columns: 92px minmax(0, 1fr) 92px;
}

.generate-game-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.generate-game-copy h2 {
    margin: 0;
    font-size: 20px;
    line-height: 1.05;
}

.generate-game-copy p {
    margin: 0;
    color: #667085;
    font-weight: 750;
}

.generate-game-copy .badge {
    width: max-content;
    margin-top: 3px;
}

.generate-artwork-card {
    position: relative;
    width: 92px;
    min-height: 92px;
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: 0;
    border: 1px solid #d7e3ef;
    border-radius: 14px;
    background: #eef4f6;
    color: #101828;
    cursor: pointer;
}

.generate-artwork-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.generate-artwork-card span {
    position: absolute;
    left: 6px;
    bottom: 6px;
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(16, 24, 40, .82);
    color: #fff;
    font-size: 10px;
    font-weight: 950;
}

.generate-form-section {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-top: 4px;
}

.generate-step-pill {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #e8fbf5;
    color: #08745f;
    font-size: 13px;
    font-weight: 950;
}

.generate-form-section h3 {
    margin: 0;
    color: #101828;
    font-size: 15px;
    line-height: 1.15;
}

.generate-form-section p {
    margin: 2px 0 0;
    color: #667085;
    font-size: 12px;
    font-weight: 720;
}

.generate-builder-card textarea {
    min-height: 74px;
}

.generate-builder-card textarea[name="notes"] {
    min-height: 58px;
}

.generate-output-grid {
    display: grid;
    grid-template-columns: minmax(90px, .8fr) minmax(90px, .8fr) minmax(120px, 1fr);
    gap: 10px;
}

.field-with-unit {
    position: relative;
    display: block;
}

.field-with-unit input {
    width: 100%;
    padding-right: 58px;
}

.field-with-unit span {
    position: absolute;
    right: 8px;
    top: 50%;
    display: inline-flex;
    min-width: 38px;
    height: 30px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e4ed;
    border-radius: 9px;
    background: #eef5f7;
    color: #536173;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0;
    transform: translateY(-50%);
    pointer-events: none;
}

.generate-helper-panel {
    display: grid;
    gap: 14px;
}

.generate-next-card {
    background:
        linear-gradient(135deg, rgba(15, 139, 115, .10), transparent 55%),
        #fff;
}

.generate-next-card h2,
.generate-history-card h2 {
    margin-bottom: 8px;
    font-size: 18px;
}

.generate-next-card ol {
    display: grid;
    gap: 9px;
    margin: 0;
    padding-left: 20px;
    color: #475467;
    font-weight: 750;
}

.generate-history-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.generate-history-list .lf-gallery-card {
    grid-template-columns: 76px minmax(0, 1fr);
    min-height: 88px;
    padding: 8px;
}

.generate-history-list .lf-gallery-image-button {
    height: 76px;
}

.generate-builder-card .modal-actions {
    position: sticky;
    bottom: -22px;
    margin: 4px -22px -22px;
    padding: 12px 22px;
    border-top: 1px solid #dce7ef;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(14px);
}

@media (max-width: 980px) {
    .generate-modal-layout {
        grid-template-columns: 1fr;
    }

    .generate-helper-panel {
        display: none;
    }
}

@media (max-width: 620px) {
    .generate-game-summary {
        grid-template-columns: 74px minmax(0, 1fr);
    }

    .generate-artwork-card {
        width: 74px;
        min-height: 74px;
    }

    .generate-artwork-card.is-approved {
        display: none;
    }

    .generate-output-grid {
        grid-template-columns: 1fr 1fr;
    }

    .generate-output-grid .form-row:last-child {
        grid-column: 1 / -1;
    }
}

/* System email settings */
.system-settings-shell {
    display: grid;
    gap: 18px;
}

.settings-overview-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.settings-readonly-list {
    display: grid;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
}

.settings-readonly-list div {
    display: grid;
    grid-template-columns: minmax(180px, .42fr) minmax(0, 1fr);
    gap: 16px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.settings-readonly-list div:last-child {
    border-bottom: 0;
}

.settings-readonly-list span,
.email-template-list span,
.email-preview-head span {
    color: var(--muted);
    font-size: 12px;
}

.settings-readonly-list strong,
.settings-readonly-list a {
    min-width: 0;
    overflow-wrap: anywhere;
}

.settings-explain-card code {
    padding: 2px 5px;
    border-radius: 5px;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    font-size: 12px;
}

.settings-inline-check {
    align-self: end;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    color: var(--ink-soft);
    font-weight: 700;
}

.settings-inline-check input {
    width: 16px;
    height: 16px;
}

.settings-save-row {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
}

.settings-test-email-form {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.settings-inline-fields {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 10px;
}

.email-layout-grid,
.email-editor-preview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
}

.code-textarea {
    width: 100%;
    min-height: 280px;
    resize: vertical;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 12px;
    line-height: 1.55;
    tab-size: 4;
}

.email-admin-shell .CodeMirror {
    min-height: 360px;
    height: 360px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 12px;
    line-height: 1.55;
}

.email-editor-preview-grid .CodeMirror {
    min-height: 520px;
    height: 520px;
}

.email-admin-shell .CodeMirror-gutters {
    border-right: 1px solid rgba(255, 255, 255, .08);
}

.email-admin-shell .CodeMirror-focused {
    box-shadow: 0 0 0 3px rgba(15, 139, 115, .15);
}

.email-template-workspace {
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    gap: 18px;
}

.email-template-list {
    display: grid;
    align-content: start;
    gap: 8px;
}

.email-template-tab {
    display: grid;
    gap: 3px;
    width: 100%;
    text-align: left;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    color: var(--ink);
    text-decoration: none;
    cursor: pointer;
}

.email-template-tab:hover,
.email-template-tab:focus-visible {
    border-color: rgba(15, 139, 115, .45);
    outline: none;
}

.email-template-tab.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.email-template-list em {
    justify-self: start;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--warning-soft);
    color: var(--warning);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.email-template-editor {
    min-width: 0;
}

.email-template-title-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
}

.email-template-title-row h3 {
    margin-bottom: 5px;
}

.email-variable-row {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 6px 0 14px;
}

.email-variable-chip {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--ink-soft);
    padding: 5px 9px;
    font: 700 11px/1.2 "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    cursor: pointer;
}

.email-variable-chip:hover {
    border-color: var(--accent);
    color: var(--accent-strong);
}

.email-preview-panel {
    display: grid;
    grid-template-rows: auto minmax(440px, 1fr);
    min-height: 520px;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.email-preview-head {
    display: grid;
    gap: 4px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.email-preview-head strong {
    overflow-wrap: anywhere;
}

.email-preview-panel iframe {
    width: 100%;
    height: 100%;
    min-height: 440px;
    border: 0;
    background: #fff;
}

@media (max-width: 1080px) {
    .company-overview-grid,
    .settings-overview-grid,
    .email-template-workspace,
    .email-layout-grid,
    .email-editor-preview-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .settings-readonly-list div,
    .settings-inline-fields,
    .email-template-title-row {
        grid-template-columns: 1fr;
    }
}

/* User project permissions */
.role-access-note {
    display: grid;
    gap: 5px;
    margin-top: 6px;
    padding: 14px 16px;
    border: 1px solid rgba(20, 184, 166, 0.28);
    border-radius: 10px;
    background: rgba(20, 184, 166, 0.08);
    color: var(--ink);
}

.role-access-note span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
}

.project-permission-editor {
    display: grid;
    gap: 12px;
    margin-top: 6px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.project-permission-editor[hidden],
.role-access-note[hidden],
.project-permission-card[hidden],
.project-permission-empty[hidden] {
    display: none !important;
}

.project-permission-card {
    display: grid;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.project-permission-title,
.project-permission-grid label {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
}

.project-permission-title input,
.project-permission-grid input {
    width: 16px;
    height: 16px;
    margin-top: 2px;
}

.project-permission-title strong,
.project-permission-grid strong {
    display: block;
}

.project-permission-title small,
.project-permission-grid small {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.project-permission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
}

@media (max-width: 720px) {
    .project-permission-grid {
        grid-template-columns: 1fr;
    }
}