/* NMQVIP interface v2 — shared shell and user-selectable color themes. */
:root,
html[data-theme="dark"] {
    --nmq-page: #090909;
    --nmq-surface: #151515;
    --nmq-surface-2: #1b1b1b;
    --nmq-surface-3: #232323;
    --nmq-surface-hover: #282828;
    --nmq-border: rgba(255, 255, 255, 0.08);
    --nmq-border-strong: rgba(255, 255, 255, 0.14);
    --nmq-text: #ffffff;
    --nmq-text-soft: #d4d4d4;
    --nmq-muted: #909090;
    --nmq-accent: #f5f5f5;
    --nmq-accent-strong: #ffffff;
    --nmq-accent-soft: rgba(255, 255, 255, 0.08);
    --nmq-on-accent: #111111;
    --nmq-header: #151515;
    --nmq-banner: #181818;
    --nmq-shadow: 0 14px 36px rgba(0, 0, 0, 0.24);
    --nmq-input: #101010;
    --nmq-danger-soft: rgba(244, 63, 94, 0.1);
    --nmq-warning-soft: rgba(245, 158, 11, 0.1);
    --heybank: #f5f5f5;
    --heybank-dark: #ffffff;
}

html[data-theme="light"] {
    --nmq-page: #f5f5f5;
    --nmq-surface: #ffffff;
    --nmq-surface-2: #fafafa;
    --nmq-surface-3: #eeeeee;
    --nmq-surface-hover: #f0f0f0;
    --nmq-border: rgba(0, 0, 0, 0.08);
    --nmq-border-strong: rgba(0, 0, 0, 0.15);
    --nmq-text: #171717;
    --nmq-text-soft: #3f3f46;
    --nmq-muted: #737373;
    --nmq-accent: #171717;
    --nmq-accent-strong: #0a0a0a;
    --nmq-accent-soft: rgba(0, 0, 0, 0.06);
    --nmq-on-accent: #ffffff;
    --nmq-header: #ffffff;
    --nmq-banner: #171717;
    --nmq-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    --nmq-input: #ffffff;
    --nmq-danger-soft: rgba(225, 29, 72, 0.07);
    --nmq-warning-soft: rgba(217, 119, 6, 0.08);
    --heybank: #171717;
    --heybank-dark: #0a0a0a;
}


html {
    background: var(--nmq-page);
    color-scheme: dark;
}

html[data-theme="light"] {
    color-scheme: light;
}

body.nmq-shell {
    min-height: 100vh;
    padding-top: 122px !important;
    color: var(--nmq-text) !important;
    background: var(--nmq-page) !important;
    font-family: "Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    transition: background-color 180ms ease, color 180ms ease;
}

body.nmq-shell button,
body.nmq-shell input,
body.nmq-shell select,
body.nmq-shell textarea {
    font-family: "Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.nmq-shell::before {
    display: none;
}

body.nmq-shell .tet-flowers {
    display: none !important;
}

body.nmq-shell .heybank-announcement-bar {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    border: 0 !important;
    background: var(--nmq-banner) !important;
    box-shadow: none !important;
}

body.nmq-shell .heybank-announcement-bar::before {
    display: none;
}

body.nmq-shell .heybank-announcement-bar span {
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.015em;
}

.nmq-announcement-viewport {
    width: 100%;
    overflow: hidden;
}

.nmq-announcement-track {
    display: flex;
    width: max-content;
    min-width: 200%;
    align-items: center;
    color: #ffffff;
    white-space: nowrap;
    animation: nmq-announcement-scroll var(--nmq-marquee-duration, 18s) linear infinite;
}

.nmq-announcement-track span {
    display: block;
    width: 50%;
    padding-inline: 3rem;
    text-align: center;
}

@keyframes nmq-announcement-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

body.nmq-shell.nmq-announcement-disabled {
    padding-top: 92px !important;
}

body.nmq-shell.nmq-announcement-disabled .nmq-topbar {
    top: 12px !important;
}

body.nmq-shell.nmq-announcement-disabled #heybank-sidebar.nmq-sidebar {
    top: 92px !important;
}

body.nmq-shell .nmq-topbar {
    top: 42px !important;
    left: 18px !important;
    right: 18px !important;
    width: auto !important;
    height: 66px;
    z-index: 100000001 !important;
    border: 1px solid var(--nmq-border) !important;
    border-radius: 18px;
    background: var(--nmq-header) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

body.nmq-shell .nmq-topbar > div {
    width: 100%;
    height: 64px !important;
    max-width: none !important;
    padding-inline: 18px !important;
}

body.nmq-shell #heybank-menu {
    flex: 0 0 auto;
    color: var(--nmq-text) !important;
    border-color: var(--nmq-border-strong) !important;
    background: var(--nmq-surface-2) !important;
    font-size: 18px;
}

body.nmq-shell #heybank-menu:hover {
    background: var(--nmq-surface-hover) !important;
}

.nmq-header-brand {
    min-width: 0;
    margin-right: auto;
    margin-left: 10px;
    color: var(--nmq-text);
    text-decoration: none;
}

.nmq-header-brand img {
    filter: saturate(0.95) contrast(1.03);
}

.nmq-header-brand > span {
    padding-left: 12px;
    border-left: 1px solid var(--nmq-border-strong);
    line-height: 1.1;
}

.nmq-header-brand strong,
.nmq-header-brand small {
    display: block;
}

.nmq-header-brand strong {
    color: var(--nmq-text);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.025em;
}

.nmq-header-brand small {
    margin-top: 4px;
    color: var(--nmq-muted);
    font-size: 10px;
}

body.nmq-shell #heybank-sidebar.nmq-sidebar {
    top: 122px !important;
    bottom: 18px !important;
    left: 18px !important;
    width: 276px !important;
    z-index: 99999999 !important;
    color: var(--nmq-text) !important;
    border: 1px solid var(--nmq-border) !important;
    border-radius: 18px;
    background: var(--nmq-surface) !important;
    box-shadow: none;
    transition: transform 220ms ease, opacity 180ms ease !important;
}

body.nmq-shell .nmq-sidebar .heybank-header-logo {
    display: none;
}

body.nmq-shell .nmq-sidebar nav {
    padding: 14px 10px 12px !important;
}

body.nmq-shell .nmq-sidebar nav a,
body.nmq-shell .nmq-sidebar nav summary {
    min-height: 42px;
    padding: 9px 11px !important;
    border: 1px solid transparent;
    border-radius: 11px !important;
    color: var(--nmq-muted) !important;
    font-size: 12.5px;
    font-weight: 600;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

body.nmq-shell .nmq-sidebar nav a:hover,
body.nmq-shell .nmq-sidebar nav summary:hover {
    color: var(--nmq-text) !important;
    border-color: var(--nmq-border);
    background: var(--nmq-surface-hover) !important;
    transform: translateX(2px);
}

body.nmq-shell .nmq-sidebar nav a.bg-heybank,
body.nmq-shell .nmq-sidebar nav summary.bg-heybank {
    color: var(--nmq-on-accent) !important;
    border-color: var(--nmq-accent) !important;
    background: var(--nmq-accent) !important;
    box-shadow: none;
}

html[data-theme="dark"] body.nmq-shell .nmq-sidebar nav a.bg-heybank,
html[data-theme="dark"] body.nmq-shell .nmq-sidebar nav summary.bg-heybank {
    color: #ffffff !important;
    border-color: var(--nmq-border-strong) !important;
    background: var(--nmq-surface-3) !important;
}

html[data-theme="dark"] body.nmq-shell .nmq-sidebar nav .bg-heybank i:first-child {
    color: #ffffff !important;
}

body.nmq-shell .nmq-sidebar nav summary.bg-neutral-100 {
    color: var(--nmq-text) !important;
    border-color: var(--nmq-border) !important;
    background: var(--nmq-surface-3) !important;
}

body.nmq-shell .nmq-sidebar nav i:first-child {
    width: 21px;
    color: var(--nmq-accent);
    text-align: center;
}

body.nmq-shell .nmq-sidebar nav .bg-heybank i:first-child {
    color: var(--nmq-on-accent);
}

body.nmq-shell .nmq-sidebar .nmq-nav-label,
body.nmq-shell .nmq-sidebar nav > div.text-xs {
    margin-top: 13px !important;
    padding: 5px 9px !important;
    color: var(--nmq-muted) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em;
}

body.nmq-shell .nmq-sidebar > div:last-child {
    border-color: var(--nmq-border) !important;
    color: var(--nmq-muted) !important;
}

body.nmq-shell .nmq-main {
    width: auto !important;
    margin: 0 18px 0 310px !important;
    padding: 0 !important;
    transition: margin-left 220ms ease;
}

body.nmq-shell .nmq-main > div {
    max-width: none !important;
    padding: 28px 0 48px !important;
}

body.nmq-shell .nmq-footer {
    margin-left: 310px;
    color: var(--nmq-muted);
    transition: margin-left 220ms ease;
}

@media (min-width: 640px) {
    html.nmq-sidebar-collapsed body.nmq-shell #heybank-sidebar.nmq-sidebar {
        opacity: 0;
        pointer-events: none;
        transform: translateX(calc(-100% - 30px)) !important;
    }

    html.nmq-sidebar-collapsed body.nmq-shell .nmq-main {
        margin-left: 18px !important;
    }

    html.nmq-sidebar-collapsed body.nmq-shell .nmq-footer {
        margin-left: 18px;
    }
}

body.nmq-shell .nmq-footer > div {
    border-color: var(--nmq-border) !important;
    background: transparent !important;
}

body.nmq-shell .nmq-footer .text-neutral-600 {
    color: var(--nmq-muted) !important;
}

body.nmq-shell #heybank-overlay {
    z-index: 99999998 !important;
    background: rgba(0, 0, 0, 0.72) !important;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.nmq-icon-button {
    color: var(--nmq-text-soft) !important;
    border-color: var(--nmq-border-strong) !important;
    background: var(--nmq-surface-2) !important;
}

.nmq-icon-button:hover {
    color: var(--nmq-accent) !important;
    border-color: var(--nmq-border-strong) !important;
    background: var(--nmq-accent-soft) !important;
}

.nmq-theme-menu {
    position: absolute;
    top: calc(100% + 12px);
    right: auto;
    width: min(290px, calc(100vw - 28px));
    overflow: hidden;
    border: 1px solid var(--nmq-border-strong);
    border-radius: 16px;
    background: var(--nmq-surface);
    box-shadow: var(--nmq-shadow);
    color: var(--nmq-text);
}

.nmq-theme-menu__head {
    padding: 14px 14px 11px;
    border-bottom: 1px solid var(--nmq-border);
}

.nmq-theme-menu__head strong,
.nmq-theme-menu__head span {
    display: block;
}

.nmq-theme-menu__head strong {
    font-size: 13px;
    font-weight: 700;
}

.nmq-theme-menu__head span {
    margin-top: 3px;
    color: var(--nmq-muted);
    font-size: 10.5px;
}

.nmq-theme-menu > button {
    display: grid;
    width: 100%;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 10px;
    padding: 10px 13px;
    color: var(--nmq-text-soft);
    text-align: left;
    transition: background-color 150ms ease;
}

.nmq-theme-menu > button:hover,
.nmq-theme-menu > button.is-active {
    background: var(--nmq-surface-hover);
}

.nmq-theme-menu > button > span:nth-child(2) strong,
.nmq-theme-menu > button > span:nth-child(2) small {
    display: block;
}

.nmq-theme-menu > button > span:nth-child(2) strong {
    color: var(--nmq-text);
    font-size: 12px;
}

.nmq-theme-menu > button > span:nth-child(2) small {
    margin-top: 2px;
    color: var(--nmq-muted);
    font-size: 9.5px;
}

.nmq-theme-swatch {
    position: relative;
    display: block;
    width: 36px;
    height: 27px;
    overflow: hidden;
    border: 1px solid var(--nmq-border-strong);
    border-radius: 8px;
}

.nmq-theme-swatch::before,
.nmq-theme-swatch i {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 38%;
}

.nmq-theme-swatch i {
    inset: 7px 5px 7px auto;
    width: 12px;
    border-radius: 3px;
}

.nmq-theme-swatch.is-dark { background: #141817; }
.nmq-theme-swatch.is-dark::before { background: #080a09; }
.nmq-theme-swatch.is-dark i { background: #ffffff; }
.nmq-theme-swatch.is-light { background: #ffffff; }
.nmq-theme-swatch.is-light::before { background: #eef3ef; }
.nmq-theme-swatch.is-light i { background: #171717; }

.nmq-theme-check {
    visibility: hidden;
    color: var(--nmq-accent);
    font-size: 17px;
}

.nmq-theme-menu > button.is-active .nmq-theme-check {
    visibility: visible;
}

/* Commands must carry both foreground and background in every theme. */
body.nmq-shell code,
body.nmq-shell pre,
body.nmq-shell #agency-telegram-command {
    color: var(--nmq-text) !important;
    background: var(--nmq-surface-3) !important;
    border-color: var(--nmq-border-strong) !important;
    font-family: ui-monospace, Consolas, monospace;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

/* Map the existing utility-heavy views onto the shared theme tokens. */
body.nmq-shell .bg-white,
body.nmq-shell .bg-content1 {
    background-color: var(--nmq-surface) !important;
}

body.nmq-shell .bg-neutral-50,
body.nmq-shell .bg-neutral-100,
body.nmq-shell .bg-slate-50,
body.nmq-shell .bg-slate-100,
body.nmq-shell .bg-gray-50,
body.nmq-shell .bg-gray-100 {
    background-color: var(--nmq-surface-2) !important;
}

body.nmq-shell .hover\:bg-neutral-50:hover,
body.nmq-shell .hover\:bg-neutral-100:hover,
body.nmq-shell .hover\:bg-slate-50:hover,
body.nmq-shell .hover\:bg-gray-50:hover {
    background-color: var(--nmq-surface-hover) !important;
}

body.nmq-shell .text-neutral-900,
body.nmq-shell .text-neutral-800,
body.nmq-shell .text-slate-900,
body.nmq-shell .text-slate-800,
body.nmq-shell .text-gray-900,
body.nmq-shell .text-gray-800 {
    color: var(--nmq-text) !important;
}

body.nmq-shell .text-neutral-700,
body.nmq-shell .text-neutral-600,
body.nmq-shell .text-slate-700,
body.nmq-shell .text-slate-600,
body.nmq-shell .text-gray-700,
body.nmq-shell .text-gray-600 {
    color: var(--nmq-text-soft) !important;
}

body.nmq-shell .text-neutral-500,
body.nmq-shell .text-neutral-400,
body.nmq-shell .text-slate-500,
body.nmq-shell .text-slate-400,
body.nmq-shell .text-gray-500,
body.nmq-shell .text-gray-400 {
    color: var(--nmq-muted) !important;
}

body.nmq-shell .border-neutral-100,
body.nmq-shell .border-neutral-200,
body.nmq-shell .border-neutral-300,
body.nmq-shell .border-slate-100,
body.nmq-shell .border-slate-200,
body.nmq-shell .border-slate-300,
body.nmq-shell .border-gray-100,
body.nmq-shell .border-gray-200,
body.nmq-shell .border-gray-300,
body.nmq-shell .divide-neutral-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--nmq-border) !important;
}

body.nmq-shell .shadow-soft,
body.nmq-shell .shadow-md,
body.nmq-shell .shadow-lg,
body.nmq-shell .shadow-xl,
body.nmq-shell .shadow-2xl {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

body.nmq-shell .bg-primary {
    color: var(--nmq-on-accent) !important;
    background: var(--nmq-accent) !important;
}

body.nmq-shell .text-primary {
    color: var(--nmq-accent) !important;
}

body.nmq-shell .border-primary {
    border-color: var(--nmq-accent) !important;
}

body.nmq-shell .bg-heybank {
    color: var(--nmq-on-accent) !important;
    background: var(--nmq-accent) !important;
}

body.nmq-shell .text-heybank {
    color: var(--nmq-accent) !important;
}

body.nmq-shell .bg-heybank > .text-white {
    color: inherit !important;
}

body.nmq-shell #heybank-login-modal {
    overflow-y: auto;
    padding-block: 24px;
}

body.nmq-shell #heybank-login-modal > div {
    margin-block: auto;
    flex-shrink: 0;
}

body.nmq-shell .border-heybank {
    border-color: var(--nmq-accent) !important;
}

body.nmq-shell input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.nmq-shell select,
body.nmq-shell textarea {
    color: var(--nmq-text) !important;
    border-color: var(--nmq-border-strong) !important;
    background: var(--nmq-input) !important;
    caret-color: var(--nmq-accent);
}

body.nmq-shell input::placeholder,
body.nmq-shell textarea::placeholder {
    color: var(--nmq-muted) !important;
    opacity: 0.72;
}

body.nmq-shell input:focus,
body.nmq-shell select:focus,
body.nmq-shell textarea:focus {
    border-style: solid !important;
    border-color: var(--nmq-accent) !important;
    box-shadow: 0 0 0 3px var(--nmq-accent-soft) !important;
}

body.nmq-shell select option,
body.nmq-shell select optgroup {
    color: var(--nmq-text);
    background: var(--nmq-surface);
}

body.nmq-shell table {
    color: var(--nmq-text-soft);
}

body.nmq-shell thead,
body.nmq-shell thead.bg-neutral-50,
body.nmq-shell thead.bg-slate-50 {
    background: var(--nmq-surface-2) !important;
}

body.nmq-shell tbody tr {
    border-color: var(--nmq-border) !important;
    transition: background-color 140ms ease;
}

body.nmq-shell tbody tr:hover {
    background: var(--nmq-surface-hover) !important;
}

body.nmq-shell .bg-emerald-50 {
    background: var(--nmq-accent-soft) !important;
}

body.nmq-shell .border-emerald-100,
body.nmq-shell .border-emerald-200,
body.nmq-shell .border-emerald-300 {
    border-color: var(--nmq-border-strong) !important;
}

body.nmq-shell .text-emerald-700,
body.nmq-shell .text-emerald-800 {
    color: var(--nmq-accent) !important;
}

body.nmq-shell .bg-red-50,
body.nmq-shell .bg-rose-50 {
    background: var(--nmq-danger-soft) !important;
}

body.nmq-shell .bg-amber-50,
body.nmq-shell .bg-yellow-50 {
    background: var(--nmq-warning-soft) !important;
}

body.nmq-shell [class*="fixed inset-0"][class*="backdrop-blur"] > div:first-child,
body.nmq-shell #heybank-login-modal > div {
    border: 1px solid var(--nmq-border-strong);
    background: var(--nmq-surface) !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36) !important;
}

body.nmq-shell .title-h-left::before {
    background: var(--nmq-accent) !important;
    box-shadow: none !important;
}

body.nmq-shell .cb-toggle {
    color: var(--nmq-on-accent) !important;
    background: var(--nmq-accent) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
}

body.nmq-shell .loader-wrapper {
    background: var(--nmq-page) !important;
}

body.nmq-shell .loader {
    border-color: var(--nmq-border-strong) !important;
    border-top-color: var(--nmq-accent) !important;
}

/* Shared page headings and the rent-account catalogue. */
.nmq-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 9px;
    color: var(--nmq-muted);
    font-size: 10.5px;
}

.nmq-breadcrumb a {
    color: var(--nmq-accent);
    text-decoration: none;
}

.nmq-page-heading h1 {
    color: var(--nmq-text) !important;
    font-size: clamp(20px, 2.4vw, 29px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.035em;
}

.nmq-page-heading p {
    color: var(--nmq-muted) !important;
    font-size: 11.5px !important;
}

.nmq-guide {
    border-style: solid !important;
    border-width: 1px !important;
    border-color: var(--nmq-border-strong) !important;
    border-radius: 16px !important;
    background: var(--nmq-surface) !important;
}

.nmq-guide > div i,
.nmq-guide > div p {
    color: var(--nmq-accent) !important;
}

.nmq-bank-grid {
    gap: 14px !important;
}

.nmq-bank-card {
    position: relative;
    min-height: 248px;
    border-color: var(--nmq-border) !important;
    border-radius: 18px !important;
    background: var(--nmq-surface) !important;
    box-shadow: none !important;
    isolation: isolate;
}

.nmq-bank-card::before {
    display: none;
}

.nmq-bank-card:hover {
    border-color: var(--nmq-border-strong) !important;
    box-shadow: none !important;
    transform: translateY(-1px);
}

.nmq-bank-card__logo {
    width: 72px !important;
    height: 72px !important;
    margin-top: 5px;
    padding: 9px !important;
    border-color: var(--nmq-border-strong) !important;
    border-radius: 19px !important;
    background: #ffffff !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16) !important;
}

.nmq-bank-card__logo img {
    border-radius: 12px;
}

.nmq-bank-card h3 {
    margin-top: 17px;
    color: var(--nmq-text) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em;
}

.nmq-bank-card__subtitle {
    margin-top: 5px;
    color: var(--nmq-muted);
    font-size: 10px;
}

.nmq-bank-card__status {
    display: none;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    padding: 5px 9px;
    border-radius: 999px;
    color: var(--nmq-accent);
    background: var(--nmq-accent-soft);
    font-size: 8.5px;
    font-weight: 700;
}

.nmq-bank-card__status i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: none;
}

.nmq-bank-card.is-disabled .nmq-bank-card__status {
    color: var(--nmq-muted);
    background: var(--nmq-surface-3);
}

.nmq-bank-open {
    min-height: 42px !important;
    border: 1px solid var(--nmq-border-strong) !important;
    border-radius: 12px !important;
    color: var(--nmq-on-accent) !important;
    background: var(--nmq-accent) !important;
    box-shadow: none !important;
}

.nmq-bank-card.is-disabled .nmq-bank-open {
    color: var(--nmq-muted) !important;
    background: var(--nmq-surface-3) !important;
    box-shadow: none !important;
}

.nmq-modal {
    background: rgba(0, 0, 0, 0.76) !important;
}

.nmq-modal__panel {
    border: 1px solid var(--nmq-border-strong) !important;
    border-radius: 20px !important;
    background: var(--nmq-surface) !important;
}

.nmq-create-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.nmq-create-form > * {
    margin-top: 0 !important;
}

.nmq-create-form > :last-child {
    grid-column: 1 / -1;
}

.nmq-create-form input,
.nmq-create-form select {
    min-height: 46px;
    border-radius: 11px !important;
}

.nmq-data-card {
    overflow: hidden;
    border-color: var(--nmq-border) !important;
    border-radius: 18px !important;
    background: var(--nmq-surface) !important;
    box-shadow: none !important;
}

.nmq-data-card > div:first-child {
    border-color: var(--nmq-border) !important;
    background: var(--nmq-surface-2) !important;
}

.nmq-data-card table th {
    color: var(--nmq-muted) !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
}

.nmq-important-notice > div {
    border-color: rgba(245, 158, 11, 0.24) !important;
    background: var(--nmq-surface) !important;
    box-shadow: none !important;
}

.nmq-important-notice h2,
.nmq-important-notice p {
    color: var(--nmq-text-soft) !important;
}

.nmq-important-notice [class*="bg-white"] {
    color: #f59e0b !important;
    border-color: rgba(245, 158, 11, 0.25) !important;
    background: var(--nmq-warning-soft) !important;
}

@media (max-width: 639px) {
    body.nmq-shell {
        padding-top: 112px !important;
    }

    body.nmq-shell.nmq-announcement-disabled {
        padding-top: 82px !important;
    }

    body.nmq-shell.nmq-announcement-disabled .nmq-topbar {
        top: 10px !important;
    }

    body.nmq-shell .nmq-topbar {
        top: 40px !important;
        left: 12px !important;
        right: 12px !important;
        height: 60px;
        border-radius: 15px;
    }

    body.nmq-shell .nmq-topbar > div {
        height: 58px !important;
        padding-inline: 12px !important;
    }

    body.nmq-shell #heybank-sidebar.nmq-sidebar {
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: min(76vw, 280px) !important;
        z-index: 100000004 !important;
        border-width: 0 1px 0 0 !important;
        border-radius: 0 20px 20px 0;
    }

    body.nmq-shell #heybank-overlay {
        z-index: 100000003 !important;
    }

    body.nmq-shell .nmq-sidebar .heybank-header-logo {
        display: flex;
        height: 82px !important;
        padding-inline: 14px !important;
        border-color: var(--nmq-border) !important;
    }

    body.nmq-shell .nmq-sidebar .heybank-header-logo img {
        width: auto;
        max-width: 160px;
        object-fit: contain !important;
    }

    body.nmq-shell .nmq-main {
        margin: 0 12px !important;
    }

    body.nmq-shell .nmq-main > div {
        padding: 20px 0 36px !important;
    }

    body.nmq-shell .nmq-footer {
        margin-left: 0;
    }

    body.nmq-shell .nmq-topbar [data-toggle="user"] > div {
        display: flex;
        min-width: 0;
        max-width: 110px;
    }

    body.nmq-shell .nmq-topbar [data-toggle="user"] > div > span {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .nmq-create-form {
        grid-template-columns: 1fr;
    }

    .nmq-create-form > :last-child {
        grid-column: auto;
    }
}

/* Pale utility panels (including opacity variants) need paired theme colors.
   Keep low-opacity white overlays on dark hero cards unchanged. */
body.nmq-shell :is([class~="bg-white/70"], [class~="bg-white/90"],
    [class*="bg-emerald-50"], [class*="bg-blue-50"], [class*="bg-sky-50"],
    [class*="bg-amber-50"], [class*="bg-yellow-50"], [class*="bg-rose-50"],
    [class*="bg-red-50"]):not(button):not(a):not(input) {
    background: var(--nmq-surface-2) !important;
    color: var(--nmq-text-soft) !important;
    border-color: var(--nmq-border-strong) !important;
}

body.nmq-shell :is([class*="bg-emerald-50"], [class*="bg-blue-50"],
    [class*="bg-sky-50"], [class*="bg-amber-50"], [class*="bg-yellow-50"],
    [class*="bg-rose-50"], [class*="bg-red-50"])
    :is(h2, h3, p, [class*="text-emerald-"], [class*="text-blue-"],
    [class*="text-sky-"], [class*="text-amber-"], [class*="text-yellow-"],
    [class*="text-rose-"], [class*="text-red-"]) {
    color: var(--nmq-text) !important;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Keep floating controls within the header at phone widths. */
.nmq-theme-picker { position: static !important; }
body.nmq-mobile-menu-open { overflow: hidden; }
.nmq-theme-menu { z-index: 2; max-height: calc(100dvh - 130px); overflow-y: auto; }
.nmq-theme-menu > button > span:nth-child(2) { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 639px) {
    body.nmq-shell .nmq-topbar [data-menu="user"] { width: min(270px, calc(100vw - 48px)); }
    body.nmq-shell .nmq-topbar [data-toggle="user"] > div { max-width: 80px; }
    body.nmq-shell .nmq-main { min-width: 0; }
    body.nmq-shell .nmq-main :is(h1, h2, h3, p) { overflow-wrap: anywhere; }
    body.nmq-shell #heybank-sidebar.nmq-sidebar { overscroll-behavior: contain; padding-bottom: env(safe-area-inset-bottom); }
}

/* CTV legacy components must use the same foreground and surface tokens. */
body.nmq-shell .ctv-page :is(.card, .status-progress) { background: var(--nmq-surface) !important; color: var(--nmq-text); border-color: var(--nmq-border); }
body.nmq-shell .ctv-page .status-card { background: var(--nmq-surface-2) !important; border-color: var(--nmq-border) !important; min-width: 0; }
body.nmq-shell .ctv-page :is(.card-header, .progress-bar) { border-color: var(--nmq-border); }
body.nmq-shell .ctv-page .progress-bar { background: var(--nmq-surface-hover); }
body.nmq-shell .ctv-page :is(.status-card-value, .progress-percentage, .card-text h2) { color: var(--nmq-text); }
body.nmq-shell .ctv-page :is(.progress-meta, .ctv-list li, .ctv-info p, .card-text p) { color: var(--nmq-text-soft); }
@media (max-width: 639px) {
    body.nmq-shell .ctv-page :is(.card-content, .card-header) { padding: 16px; }
    body.nmq-shell .ctv-page .progress-meta { flex-wrap: wrap; gap: 6px; }
}