:root {
    --fx-bg: #020617;
    --fx-surface: rgba(15, 23, 42, 0.72);
    --fx-surface-strong: rgba(15, 23, 42, 0.9);
    --fx-border: rgba(148, 163, 184, 0.25);
    --fx-text: #e2e8f0;
    --fx-muted: #94a3b8;
    --fx-accent: #22d3ee;
    --fx-accent-2: #8b5cf6;
}

html,
body {
    margin: 0;
    padding: 0;
}

input[type='number'] {
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

body {
    background: var(--fx-bg);
    color: var(--fx-text);
}

.fx-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background:
        radial-gradient(42rem 42rem at 14% -10%, rgba(34, 211, 238, 0.15), transparent 60%),
        radial-gradient(36rem 36rem at 95% 0%, rgba(139, 92, 246, 0.14), transparent 62%),
        radial-gradient(28rem 28rem at 52% 82%, rgba(59, 130, 246, 0.12), transparent 60%);
}

.fx-grid {
    position: absolute;
    inset: 0;
    opacity: 0.25;
    background-image:
        linear-gradient(rgba(148, 163, 184, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148, 163, 184, 0.06) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: radial-gradient(circle at center, black, transparent 82%);
}

.fx-shell { position: relative; z-index: 2; }

/* Keep header/user menu above page content even if utility z-classes are unavailable. */
.fx-header {
    z-index: 120;
    overflow: visible;
}

.fx-header nav {
    overflow: visible;
}

#user-menu {
    z-index: 140;
}

.user-menu-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.user-menu-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    opacity: 0.92;
}

.user-menu-item-icon svg,
.user-menu-item-icon img {
    display: block;
    transform: translateY(2px);
}

.user-menu-toolkit {
    margin: 0.2rem 0;
    padding: 0.1rem 0;
}

.user-menu-toolkit__item {
    --tool-accent: #22d3ee;
    position: relative;
    color: #e2e8f0 !important;
    background: linear-gradient(90deg, color-mix(in srgb, var(--tool-accent) 13%, transparent), transparent 72%) !important;
}

.user-menu-toolkit__item::before {
    content: "";
    position: absolute;
    left: 0.45rem;
    top: 50%;
    width: 0.22rem;
    height: 1.35rem;
    border-radius: 999px;
    background: var(--tool-accent);
    box-shadow: 0 0 16px color-mix(in srgb, var(--tool-accent) 46%, transparent);
    transform: translateY(-50%);
}

.user-menu-toolkit__item .user-menu-item-icon {
    color: var(--tool-accent);
    margin-left: 0.35rem;
}

.user-menu-toolkit__item:nth-child(1) {
    --tool-accent: #38bdf8;
}

.user-menu-toolkit__item:nth-child(2) {
    --tool-accent: #a78bfa;
}

.user-menu-toolkit__item:nth-child(3) {
    --tool-accent: #f472b6;
}

.user-menu-toolkit__item:nth-child(4) {
    --tool-accent: #2dd4bf;
}

.user-menu-toolkit__item:hover {
    background: linear-gradient(90deg, color-mix(in srgb, var(--tool-accent) 22%, transparent), rgba(15, 23, 42, 0.52) 78%) !important;
}

.fx-glass {
    background: var(--fx-surface);
    border: 1px solid var(--fx-border);
    backdrop-filter: blur(12px);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.03) inset;
}

.fx-chip {
    border: 1px solid var(--fx-border);
    background: color-mix(in srgb, var(--fx-surface-strong) 82%, transparent);
}

.fx-link {
    color: var(--fx-text);
    opacity: 0.88;
    transition: opacity 0.2s ease, color 0.2s ease;
}

.fx-link:hover {
    opacity: 1;
    color: #fff;
}

.fx-menu-panel {
    background: rgba(10, 16, 30, 0.98);
    border: 1px solid rgba(148, 163, 184, 0.28);
    box-shadow: 0 18px 48px rgba(2, 6, 23, 0.5);
    backdrop-filter: blur(10px);
}

.fx-menu-panel a,
.fx-menu-panel button {
    border-radius: 0.55rem !important;
}

.admin-mode-badge {
    border-color: rgba(251, 191, 36, 0.45);
    background: rgba(251, 191, 36, 0.16);
    color: #fde68a;
}

.fx-footer {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(51, 65, 85, 0.72);
    background: rgba(2, 6, 23, 0.48);
    color: #94a3b8;
}

.fx-footer__link {
    color: #cbd5e1;
    text-decoration: none;
}

.fx-footer__contacts {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.fx-footer__link:hover,
.fx-footer__link:focus-visible {
    color: #67e8f9;
    outline: none;
}

.theme-light .fx-footer {
    border-top-color: rgba(148, 163, 184, 0.24);
    background: rgba(255, 255, 255, 0.62);
    color: #64748b;
}

.theme-light .fx-footer__link {
    color: #0f172a;
}

.theme-light .fx-footer__link:hover,
.theme-light .fx-footer__link:focus-visible {
    color: #0369a1;
}

.user-menu-button__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 639px) {
    .fx-header nav {
        gap: 0.75rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .admin-mode-badge {
        display: none !important;
    }

    #user-menu-button {
        max-width: 42vw;
        min-width: 0;
        padding-left: 0.65rem;
        padding-right: 0.65rem;
    }
}

.fx-alert-success {
    border: 1px solid rgba(16, 185, 129, 0.4);
    background: rgba(16, 185, 129, 0.12);
}

.fx-alert-error {
    border: 1px solid rgba(239, 68, 68, 0.4);
    background: rgba(239, 68, 68, 0.12);
}

.brand-logo-light { display: none; }

.theme-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 56px;
    height: 30px;
    border-radius: 999px;
    border: 1px solid #334155;
    background: linear-gradient(135deg, #0f172a 0%, #111827 100%);
    transition: background-color 200ms ease, border-color 200ms ease, box-shadow 250ms ease, filter 180ms ease;
    cursor: pointer;
}

.theme-toggle:hover {
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.18);
    filter: brightness(1.03);
}

.theme-toggle__icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    line-height: 1;
    transition: opacity 220ms ease, transform 220ms ease, color 220ms ease;
    pointer-events: none;
}

.theme-toggle__icon-svg {
    width: 14px;
    height: 14px;
    display: block;
}

.theme-toggle__icon--moon { left: 8px; opacity: 1; color: #67e8f9; }
.theme-toggle__icon--sun { right: 8px; opacity: 0.28; color: #fbbf24; }

.theme-toggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: linear-gradient(135deg, #22d3ee 0%, #6366f1 100%);
    transition: transform 220ms ease;
    box-shadow: 0 4px 12px rgba(34, 211, 238, 0.35);
    pointer-events: none;
}

.theme-toggle[data-theme="light"] .theme-toggle__thumb { transform: translateX(26px); }
.theme-toggle[data-theme="light"] .theme-toggle__icon--moon { opacity: 0.25; transform: translateY(-50%) scale(0.9); color: #0284c7; }
.theme-toggle[data-theme="light"] .theme-toggle__icon--sun { opacity: 1; transform: translateY(-50%) scale(1.06); color: #f59e0b; }

.fx-reveal {
    opacity: 0;
    transform: translateY(14px) scale(0.995);
    transition: opacity 0.55s ease, transform 0.55s cubic-bezier(0.2, 0.9, 0.2, 1);
}

.fx-reveal.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.fx-cta { transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease; }

.fx-cta:hover {
    transform: translateY(-1px);
    filter: brightness(1.03);
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.25), 0 12px 28px rgba(34, 211, 238, 0.2);
}

.ai-markdown {
    white-space: normal;
    line-height: 1.7;
}

.ai-markdown.is-streaming {
    white-space: pre-wrap;
}

.ai-markdown.is-thinking {
    font-size: 0.9rem;
    line-height: 1.4;
    color: rgba(148, 163, 184, 0.86);
}

.ai-markdown .ai-thinking-timer {
    margin-left: 0.25rem;
    font-size: 0.76em;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    color: rgba(148, 163, 184, 0.62);
}

.ai-markdown > *:first-child {
    margin-top: 0;
}

.ai-markdown > *:last-child {
    margin-bottom: 0;
}

.ai-markdown p,
.ai-markdown pre,
.ai-markdown blockquote {
    margin: 0 0 0.95rem 0;
}

.ai-markdown h1,
.ai-markdown h2,
.ai-markdown h3,
.ai-markdown h4,
.ai-markdown h5,
.ai-markdown h6 {
    margin: 1.15rem 0 0.7rem 0;
    line-height: 1.35;
    font-weight: 600;
}

.ai-markdown h1 {
    font-size: 1.3rem;
    color: rgb(248, 250, 252);
    letter-spacing: -0.02em;
}

.ai-markdown h2 {
    font-size: 1.08rem;
    color: rgb(240, 249, 255);
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.74));
    border: 1px solid rgba(100, 116, 139, 0.26);
    border-bottom-color: transparent;
    border-radius: 0.95rem;
    padding: 0.72rem 0.9rem 0.68rem;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 12px 24px rgba(2, 6, 23, 0.24);
    letter-spacing: -0.02em;
}

.ai-markdown h3 {
    font-size: 0.84rem;
    color: rgb(165, 243, 252);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 1.3rem;
    margin-bottom: 0.55rem;
}

.ai-markdown h4,
.ai-markdown h5,
.ai-markdown h6 {
    font-size: 0.95rem;
    color: rgb(226, 232, 240);
}

.ai-markdown p {
    color: rgb(226, 232, 240);
}

.ai-markdown strong {
    color: rgb(248, 250, 252);
    font-weight: 700;
}

.ai-markdown ul,
.ai-markdown ol {
    margin: 0 0 1rem 0;
    padding-left: 1.7rem;
}

.ai-markdown ul {
    list-style: disc outside;
}

.ai-markdown ol {
    list-style: decimal outside;
}

.ai-markdown ul li::marker {
    color: rgb(34, 211, 238);
    font-size: 1.15em;
}

.ai-markdown ol li::marker {
    color: rgb(125, 211, 252);
    font-weight: 600;
}

.ai-markdown li {
    color: rgb(226, 232, 240);
    padding-left: 0.22rem;
}

.ai-markdown li + li {
    margin-top: 0.48rem;
}

.ai-markdown code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.9em;
    background: rgba(15, 23, 42, 0.7);
    border: 1px solid rgba(100, 116, 139, 0.4);
    border-radius: 0.35rem;
    padding: 0.1rem 0.35rem;
}

.ai-markdown pre {
    overflow-x: auto;
    border-radius: 0.75rem;
    border: 1px solid rgba(100, 116, 139, 0.45);
    background: rgba(2, 6, 23, 0.9);
    padding: 0.7rem 0.85rem;
}

.ai-markdown pre code {
    border: 0;
    background: transparent;
    padding: 0;
}

.ai-markdown a {
    color: rgb(34, 211, 238);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ai-markdown img {
    display: block;
    max-width: min(100%, 520px);
    height: auto;
    border-radius: 0.75rem;
    border: 1px solid rgba(100, 116, 139, 0.45);
    margin: 0.6rem 0;
}

.ai-markdown blockquote {
    border-left: 3px solid rgba(34, 211, 238, 0.6);
    padding-left: 0.7rem;
    color: rgb(203, 213, 225);
}

.theme-light {
    --fx-bg: #e8eef6;
    --fx-surface: rgba(246, 250, 254, 0.96);
    --fx-surface-strong: #ffffff;
    --fx-border: rgba(148, 163, 184, 0.38);
    --fx-text: #0f172a;
    --fx-muted: #475569;
    --fx-accent: #0284c7;
    --fx-accent-2: #4f46e5;
}

.theme-light body { background: #e8eef6; color: #0f172a; }

.theme-light .fx-bg {
    background:
        radial-gradient(48rem 48rem at 10% -8%, rgba(56, 189, 248, 0.14), transparent 60%),
        radial-gradient(36rem 36rem at 92% 4%, rgba(99, 102, 241, 0.1), transparent 60%),
        radial-gradient(28rem 28rem at 50% 88%, rgba(34, 211, 238, 0.09), transparent 60%);
}

.theme-light .fx-grid {
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(100, 130, 160, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(100, 130, 160, 0.12) 1px, transparent 1px);
}

.theme-light header {
    background: rgba(232, 238, 246, 0.92) !important;
    border-color: rgba(148, 163, 184, 0.32) !important;
}

.theme-light .bg-slate-950,
.theme-light [class*="bg-slate-950"] { background-color: #e8eef6 !important; }

.theme-light .bg-slate-900 { background-color: #edf3fb !important; }
.theme-light [class*="bg-slate-900\/"] { background-color: rgba(220, 232, 246, 0.85) !important; }
.theme-light .bg-slate-800 { background-color: #dce7f3 !important; }
.theme-light [class*="bg-slate-800\/"] { background-color: rgba(210, 224, 240, 0.8) !important; }
.theme-light .bg-slate-700 { background-color: #ccd9ea !important; }
.theme-light [class*="bg-slate-700\/"] { background-color: rgba(196, 212, 232, 0.75) !important; }

.theme-light .text-slate-50,
.theme-light .text-slate-100,
.theme-light .text-slate-200 { color: #0f172a !important; }
.theme-light .text-slate-300 { color: #1e293b !important; }
.theme-light .text-slate-400 { color: #334155 !important; }
.theme-light .text-slate-500 { color: #475569 !important; }

.theme-light .border-slate-800,
.theme-light .border-slate-700 { border-color: #b0c2d8 !important; }
.theme-light .border-slate-600 { border-color: #94a3b8 !important; }

.theme-light [class*="hover:bg-slate-800"]:hover,
.theme-light [class*="hover:bg-slate-700"]:hover { background-color: #d0dded !important; }

.theme-light .text-cyan-200,
.theme-light .text-cyan-300 { color: #0369a1 !important; }
.theme-light .text-cyan-400 { color: #0284c7 !important; }
.theme-light [class*="border-cyan-"] { border-color: rgba(2, 132, 199, 0.3) !important; }
.theme-light [class*="bg-cyan-500\/"] { background-color: rgba(2, 132, 199, 0.12) !important; }

.theme-light .text-red-300,
.theme-light .text-red-400 { color: #b91c1c !important; }
.theme-light .text-green-300,
.theme-light .text-green-400 { color: #15803d !important; }
.theme-light .text-yellow-300,
.theme-light .text-yellow-400 { color: #a16207 !important; }
.theme-light .text-indigo-300,
.theme-light .text-indigo-400 { color: #4338ca !important; }

.theme-light .hover\:text-white:hover { color: #0f172a !important; }

.theme-light .from-slate-950\/90 {
    --tw-gradient-from: rgba(232, 238, 246, 0.94) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(232, 238, 246, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.theme-light .via-slate-950\/70 {
    --tw-gradient-stops: var(--tw-gradient-from), rgba(232, 238, 246, 0.62), var(--tw-gradient-to) !important;
}

.theme-light .to-slate-950\/45 { --tw-gradient-to: rgba(232, 238, 246, 0.4) var(--tw-gradient-to-position) !important; }

.theme-light .fx-glass {
    background: rgba(246, 250, 254, 0.94) !important;
    border-color: rgba(148, 163, 184, 0.32) !important;
    box-shadow: 0 2px 20px rgba(100, 130, 160, 0.14) !important;
}

.theme-light .fx-chip {
    background: rgba(210, 224, 240, 0.9) !important;
    border-color: rgba(148, 163, 184, 0.38) !important;
    color: #0f172a !important;
}

.theme-light .ai-markdown h1 {
    color: #0f172a;
    letter-spacing: -0.02em;
}

.theme-light .ai-markdown h2 {
    color: #0f172a;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(241, 247, 255, 0.9));
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-bottom-color: transparent;
    border-radius: 0.95rem;
    padding: 0.72rem 0.9rem 0.68rem;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 8px 18px rgba(148, 163, 184, 0.08);
    letter-spacing: -0.02em;
}

.theme-light .ai-markdown h3 {
    color: #155e75;
    font-size: 0.84rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 1.3rem;
    margin-bottom: 0.55rem;
}

.theme-light .ai-markdown h4,
.theme-light .ai-markdown h5,
.theme-light .ai-markdown h6 {
    color: #334155;
}

.theme-light .ai-markdown p {
    color: #1e293b;
}

.theme-light .ai-markdown.is-thinking {
    color: rgba(71, 85, 105, 0.9);
}

.theme-light .ai-markdown .ai-thinking-timer {
    color: rgba(100, 116, 139, 0.78);
}

.theme-light .ai-markdown strong {
    color: #0f172a;
    font-weight: 700;
}

.theme-light .ai-markdown ul,
.theme-light .ai-markdown ol {
    padding-left: 1.7rem;
}

.theme-light .ai-markdown ul li::marker {
    color: #0284c7;
    font-size: 1.15em;
}

.theme-light .ai-markdown ol li::marker {
    color: #0369a1;
}

.theme-light .ai-markdown li {
    color: #243447;
    padding-left: 0.22rem;
}

.theme-light .ai-markdown li + li {
    margin-top: 0.48rem;
}

.theme-light .ai-markdown code {
    background: rgba(203, 213, 225, 0.42);
    border-color: rgba(148, 163, 184, 0.5);
    color: #0f172a;
}

.theme-light .ai-markdown pre {
    background: #eaf2fb;
    border-color: rgba(148, 163, 184, 0.45);
}

.theme-light .ai-markdown a {
    color: #0369a1;
}

.theme-light .ai-markdown blockquote {
    border-left-color: rgba(2, 132, 199, 0.45);
    color: #334155;
}

.theme-light .fx-link { color: #1e293b; opacity: 0.9; }
.theme-light .fx-link:hover { color: #0f172a; opacity: 1; }

.theme-light .fx-menu-panel {
    background: #ffffff !important;
    border-color: rgba(148, 163, 184, 0.4) !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14), 0 0 0 1px rgba(148, 163, 184, 0.2) !important;
}

.theme-light .fx-menu-panel a,
.theme-light .fx-menu-panel button {
    color: #1e293b !important;
    background-color: transparent !important;
}

.theme-light .fx-menu-panel a:hover,
.theme-light .fx-menu-panel button:hover { background-color: #e8eef6 !important; }

.theme-light .fx-menu-panel button.text-red-300 { color: #b91c1c !important; }

.theme-light .user-menu-toolkit {
    background: transparent;
}

.theme-light .user-menu-toolkit__item {
    color: #0f172a !important;
    background: linear-gradient(90deg, color-mix(in srgb, var(--tool-accent) 16%, transparent), transparent 72%) !important;
}

.theme-light .user-menu-toolkit__item:hover {
    background: linear-gradient(90deg, color-mix(in srgb, var(--tool-accent) 24%, transparent), rgba(226, 232, 240, 0.56) 78%) !important;
}

.theme-light .fx-alert-success { border-color: rgba(16, 185, 129, 0.4); background: rgba(16, 185, 129, 0.1); }
.theme-light .fx-alert-error { border-color: rgba(220, 38, 38, 0.35); background: rgba(220, 38, 38, 0.08); }

.theme-light thead tr,
.theme-light [class*="bg-slate-900"] thead,
.theme-light table thead th { background-color: #d4e1f0 !important; color: #0f172a !important; }

.theme-light input[type="text"],
.theme-light input[type="email"],
.theme-light input[type="password"],
.theme-light input[type="number"],
.theme-light input[type="date"],
.theme-light textarea,
.theme-light select {
    background-color: #f5f9fd !important;
    border-color: #9fb3c8 !important;
    color: #0f172a !important;
}

.theme-light input::placeholder,
.theme-light textarea::placeholder { color: #94a3b8 !important; }

.theme-light select option {
    background: #f5f9fd;
    color: #0f172a;
}

.theme-light .brand-logo-dark { display: none; }
.theme-light .brand-logo-light { display: block; }
.theme-light .theme-toggle {
    background: linear-gradient(135deg, #dbeafe 0%, #d4e1f0 100%);
    border-color: #94a3b8;
}

.theme-light .admin-mode-badge {
    border-color: rgba(180, 83, 9, 0.45);
    background: rgba(245, 158, 11, 0.2);
    color: #78350f;
}

.fx-pagination {
    border: 1px solid rgba(51, 65, 85, 0.75);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.78), rgba(2, 6, 23, 0.72));
    padding: 0.45rem;
    box-shadow: 0 12px 28px rgba(2, 6, 23, 0.22);
}

.fx-pagination__links {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.fx-pagination__link {
    display: inline-flex;
    min-width: 2.1rem;
    height: 2.1rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.7rem;
    border: 1px solid rgba(71, 85, 105, 0.82);
    background: rgba(15, 23, 42, 0.78);
    padding: 0 0.65rem;
    font-size: 0.875rem;
    line-height: 1;
    color: #dbeafe;
    text-decoration: none;
    transition: 160ms ease;
}

.fx-pagination__link:hover {
    border-color: rgba(34, 211, 238, 0.38);
    background: rgba(30, 41, 59, 0.92);
    color: #f8fafc;
    transform: translateY(-1px);
}

.fx-pagination__link--active {
    border-color: rgba(34, 211, 238, 0.48);
    background: linear-gradient(135deg, rgba(34, 211, 238, 0.26), rgba(14, 116, 144, 0.32));
    color: #a5f3fc;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.2) inset;
}

.fx-pagination__link--disabled {
    border-color: rgba(71, 85, 105, 0.45);
    background: rgba(15, 23, 42, 0.48);
    color: #64748b;
    cursor: not-allowed;
}

.fx-pagination__ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.8rem;
    color: #64748b;
    font-size: 0.9rem;
}

.fx-pagination__meta {
    white-space: nowrap;
}

.theme-light .fx-pagination {
    border-color: rgba(148, 163, 184, 0.6);
    background: linear-gradient(180deg, rgba(232, 238, 246, 0.95), rgba(220, 232, 246, 0.88));
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.theme-light .fx-pagination__link {
    border-color: rgba(148, 163, 184, 0.62);
    background: rgba(248, 250, 252, 0.96);
    color: #1e293b;
}

.theme-light .fx-pagination__link:hover {
    border-color: rgba(2, 132, 199, 0.42);
    background: rgba(239, 246, 255, 0.98);
    color: #0f172a;
}

.theme-light .fx-pagination__link--active {
    border-color: rgba(2, 132, 199, 0.45);
    background: linear-gradient(135deg, rgba(2, 132, 199, 0.18), rgba(14, 165, 233, 0.2));
    color: #0c4a6e;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.18) inset;
}

.theme-light .fx-pagination__link--disabled {
    border-color: rgba(148, 163, 184, 0.45);
    background: rgba(226, 232, 240, 0.7);
    color: #94a3b8;
}

.theme-light .fx-pagination__ellipsis {
    color: #64748b;
}

.datepicker-hidden-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 1px;
    height: 1px;
    left: 0;
    top: 0;
}

.topup-amount-option.is-active {
    border-color: rgba(34, 211, 238, 0.72) !important;
    background: rgba(34, 211, 238, 0.2) !important;
    color: #e2e8f0 !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.3) inset;
}

.theme-light .topup-amount-option.is-active {
    border-color: rgba(2, 132, 199, 0.68) !important;
    background: rgba(2, 132, 199, 0.2) !important;
    color: #0f172a !important;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.25) inset;
}

@media (min-width: 1024px) {
    .chat-layout {
        grid-template-columns: 320px 1fr;
    }

    .chat-sidebar-content {
        display: block;
    }

    .chat-layout.chat-layout-collapsed {
        grid-template-columns: 56px 1fr;
    }

    .chat-layout.chat-layout-collapsed #chat-sidebar {
        position: relative;
        z-index: 40;
        width: 56px;
        min-width: 56px;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding-left: 8px;
        padding-right: 8px;
        padding-top: 10px;
        padding-bottom: 10px;
        transition: width 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
    }

    .chat-layout.chat-layout-collapsed .chat-sidebar-head {
        justify-content: center;
    }

    .chat-layout.chat-layout-collapsed .chat-sidebar-title {
        display: none;
    }

    .chat-layout.chat-layout-collapsed .chat-sidebar-content {
        display: block;
    }

    .chat-layout.chat-layout-collapsed .chat-sidebar-content > .chat-create-block,
    .chat-layout.chat-layout-collapsed .chat-sidebar-content > .chat-history-block {
        display: none;
    }

    .chat-layout.chat-layout-collapsed .chat-provider-compact-btn {
        display: inline-flex;
    }

    .chat-layout.chat-layout-collapsed .chat-home-compact-btn {
        display: inline-flex;
        margin-bottom: 8px;
    }

    .chat-layout.chat-layout-collapsed .chat-history-compact-btn {
        display: inline-flex;
        margin-top: auto;
    }

    .chat-layout.chat-layout-collapsed .chat-sidebar-head {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        flex: 1 1 auto;
        gap: 7px;
    }

    .chat-layout.chat-layout-collapsed #chat-sidebar[data-create-open="1"],
    .chat-layout.chat-layout-collapsed #chat-sidebar[data-history-open="1"] {
        overflow: visible;
    }

    .chat-layout.chat-layout-collapsed #chat-sidebar[data-create-open="1"] .chat-create-block {
        display: block;
        position: absolute;
        top: var(--chat-create-popover-top, 10px);
        left: var(--chat-create-popover-left, 64px);
        width: 320px;
        z-index: 60;
        margin-top: 0;
        padding: 10px;
        border: 1px solid var(--fx-border);
        border-radius: 14px;
        background: color-mix(in srgb, var(--fx-surface-strong) 92%, transparent);
        box-shadow: 0 14px 42px rgba(2, 6, 23, 0.34);
    }

    .chat-layout.chat-layout-collapsed #chat-sidebar[data-history-open="1"] .chat-history-block {
        display: block;
        position: absolute;
        top: var(--chat-history-popover-top, auto);
        bottom: var(--chat-history-popover-bottom, 8px);
        left: var(--chat-history-popover-left, 64px);
        width: 360px;
        max-height: min(72vh, 640px);
        overflow: auto;
        z-index: 60;
        margin-top: 0;
        padding: 10px;
        border: 1px solid var(--fx-border);
        border-radius: 14px;
        background: color-mix(in srgb, var(--fx-surface-strong) 92%, transparent);
        box-shadow: 0 14px 42px rgba(2, 6, 23, 0.34);
    }

    .chat-layout.chat-layout-collapsed #chat-sidebar[data-history-open="1"] .chat-history-block {
        border-top-color: rgba(148, 163, 184, 0.25);
    }

    .theme-light .chat-layout.chat-layout-collapsed #chat-sidebar[data-create-open="1"] .chat-create-block,
    .theme-light .chat-layout.chat-layout-collapsed #chat-sidebar[data-history-open="1"] .chat-history-block {
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18);
        background: color-mix(in srgb, #ffffff 94%, transparent);
    }
}

#chat-sidebar .chat-provider-compact-btn.is-active {
    border-color: rgba(34, 211, 238, 0.78) !important;
    background: rgba(34, 211, 238, 0.26) !important;
    color: #22d3ee !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.35) inset;
}

#chat-sidebar[data-history-open="1"] #chat-history-compact-btn {
    border-color: rgba(99, 102, 241, 0.72) !important;
    background: rgba(99, 102, 241, 0.2) !important;
    color: #a5b4fc !important;
    box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.3) inset;
}

.theme-light #chat-sidebar .chat-provider-compact-btn.is-active {
    border-color: #0284c7 !important;
    background: rgba(2, 132, 199, 0.18) !important;
    color: #075985 !important;
}

.theme-light #chat-sidebar[data-history-open="1"] #chat-history-compact-btn {
    border-color: #4f46e5 !important;
    background: rgba(79, 70, 229, 0.16) !important;
    color: #3730a3 !important;
}

.chat-compact-btn {
    transition: transform 0.16s ease, box-shadow 0.18s ease, border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.chat-compact-btn:hover {
    transform: translateY(-1px);
}

.chat-compact-btn svg {
    filter: drop-shadow(0 0 6px rgba(148, 163, 184, 0.2));
}

.chat-icon-btn {
    padding: 0 !important;
}

.chat-icon-btn > span {
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.chat-icon-btn svg,
.chat-icon-btn img {
    width: 1.2rem;
    height: 1.2rem;
}

.chat-icon-btn--sm svg,
.chat-icon-btn--sm img {
    width: 1rem;
    height: 1rem;
}

#chat-sidebar .chat-compact-toggle-btn {
    border-color: rgba(148, 163, 184, 0.5) !important;
    background: linear-gradient(160deg, rgba(56, 189, 248, 0.16), rgba(99, 102, 241, 0.16)) !important;
    color: #bae6fd !important;
    box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.2) inset, 0 6px 16px rgba(37, 99, 235, 0.22);
}

#chat-sidebar .chat-provider-compact-btn {
    border-color: rgba(34, 211, 238, 0.72) !important;
    background: linear-gradient(160deg, rgba(34, 211, 238, 0.34), rgba(14, 165, 233, 0.26)) !important;
    color: #67e8f9 !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.28) inset, 0 8px 20px rgba(14, 165, 233, 0.24);
}

#chat-sidebar .chat-home-compact-btn {
    border-color: rgba(148, 163, 184, 0.64) !important;
    background: linear-gradient(160deg, rgba(148, 163, 184, 0.28), rgba(71, 85, 105, 0.22)) !important;
    color: #dbeafe !important;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.22) inset, 0 8px 20px rgba(51, 65, 85, 0.2);
}

#chat-sidebar .chat-history-compact-btn {
    border-color: rgba(129, 140, 248, 0.72) !important;
    background: linear-gradient(160deg, rgba(129, 140, 248, 0.28), rgba(99, 102, 241, 0.22)) !important;
    color: #c7d2fe !important;
    box-shadow: 0 0 0 1px rgba(129, 140, 248, 0.24) inset, 0 8px 20px rgba(99, 102, 241, 0.22);
}

.theme-light #chat-sidebar .chat-compact-toggle-btn {
    border-color: rgba(2, 132, 199, 0.5) !important;
    background: linear-gradient(160deg, rgba(125, 211, 252, 0.45), rgba(129, 140, 248, 0.32)) !important;
    color: #075985 !important;
    box-shadow: 0 0 0 1px rgba(14, 165, 233, 0.22) inset, 0 8px 18px rgba(59, 130, 246, 0.16);
}

.theme-light #chat-sidebar .chat-provider-compact-btn {
    border-color: rgba(2, 132, 199, 0.58) !important;
    background: linear-gradient(160deg, rgba(56, 189, 248, 0.46), rgba(14, 165, 233, 0.34)) !important;
    color: #075985 !important;
}

.theme-light #chat-sidebar .chat-home-compact-btn {
    border-color: rgba(71, 85, 105, 0.42) !important;
    background: linear-gradient(160deg, rgba(203, 213, 225, 0.64), rgba(148, 163, 184, 0.44)) !important;
    color: #1e293b !important;
}

.theme-light #chat-sidebar .chat-history-compact-btn {
    border-color: rgba(79, 70, 229, 0.5) !important;
    background: linear-gradient(160deg, rgba(165, 180, 252, 0.42), rgba(129, 140, 248, 0.32)) !important;
    color: #3730a3 !important;
}

@media (max-width: 1023px) {
    .chat-layout {
        grid-template-columns: 1fr;
    }

    #chat-sidebar {
        position: relative;
        z-index: 40;
        width: 100%;
        min-width: 0;
        padding: 10px 12px;
        overflow: hidden;
    }

    #chat-sidebar .chat-sidebar-title {
        display: none;
    }

    #chat-sidebar .chat-sidebar-head {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }

    #chat-sidebar #chat-sidebar-toggle {
        display: none;
    }

    #chat-sidebar .chat-provider-compact-btn,
    #chat-sidebar .chat-home-compact-btn,
    #chat-sidebar .chat-history-compact-btn {
        display: inline-flex;
    }

    #chat-sidebar .chat-sidebar-content > .chat-create-block,
    #chat-sidebar .chat-sidebar-content > .chat-history-block {
        display: none;
    }

    #chat-sidebar[data-create-open="1"],
    #chat-sidebar[data-history-open="1"] {
        overflow: visible;
    }

    #chat-sidebar[data-create-open="1"] .chat-create-block,
    #chat-sidebar[data-history-open="1"] .chat-history-block {
        display: block;
        position: absolute;
        top: calc(100% + 8px);
        left: 0;
        width: 100%;
        z-index: 60;
        margin-top: 0;
        padding: 10px;
        border: 1px solid var(--fx-border);
        border-radius: 14px;
        background: color-mix(in srgb, var(--fx-surface-strong) 94%, transparent);
        box-shadow: 0 14px 42px rgba(2, 6, 23, 0.28);
    }

    #chat-sidebar[data-history-open="1"] .chat-history-block {
        max-height: min(68vh, 560px);
        overflow: auto;
    }
}

@media (max-width: 639px) {
    #chat-sidebar {
        display: none !important;
    }

    #chat-input-shell > .mt-2.flex {
        flex-wrap: wrap;
        flex-direction: row;
        align-items: center;
    }

    #chat-input-shell > .mt-2.flex > div {
        min-width: 0;
    }

    #chat-input-shell > .mt-2.flex > div:first-child {
        display: contents;
        flex: 0 0 auto;
    }

    #chat-input-shell > .mt-2.flex > div:last-child {
        flex: 1 1 auto;
        justify-content: flex-end;
    }

    #chat-file-btn {
        width: 2.5rem;
        flex: 0 0 2.5rem;
        padding-left: 0;
        padding-right: 0;
    }

    #chat-file-btn-label,
    #chat-advanced-toggle > span:last-child {
        display: none;
    }

    #chat-web-search-toggle,
    #chat-advanced-toggle {
        width: 2.25rem;
        flex: 0 0 2.25rem;
        padding-left: 0;
        padding-right: 0;
    }

    #chat-web-search-toggle > span:last-child {
        display: none;
    }

    #chat-send-btn {
        min-width: 0;
        flex: 1 1 auto;
        justify-content: center;
        padding-left: 0.9rem;
        padding-right: 0.9rem;
    }

    #chat-files-list {
        order: 3;
        width: 100%;
        min-width: 0;
        padding-top: 0.25rem;
    }

    #chat-history-list [data-chat-card] {
        padding: 0.9rem;
    }

    #chat-history-list [data-chat-card] > .flex {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0.75rem;
    }

    #chat-history-list [data-chat-card] a {
        width: 100%;
    }

    #chat-history-list [data-chat-card] a > .flex {
        align-items: flex-start;
    }

    #chat-history-list [data-chat-card] a .truncate {
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.25;
    }

    #chat-history-list [data-chat-card] a .text-xs.uppercase {
        overflow-wrap: anywhere;
        line-height: 1.35;
    }

    #chat-history-list [data-chat-card] a .text-sm {
        overflow-wrap: anywhere;
        line-height: 1.45;
    }

    #chat-history-list [data-chat-card] > .flex > .flex.shrink-0 {
        width: 100%;
        align-items: flex-end;
        justify-content: space-between;
        gap: 0.75rem;
    }

    #chat-history-list [data-chat-card] > .flex > .flex.shrink-0 > .space-y-1 {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.25rem 0.75rem;
        text-align: left;
        font-size: 0.68rem;
        line-height: 1.25;
    }

    #chat-history-list [data-chat-card] > .flex > .flex.shrink-0 > form {
        flex: 0 0 auto;
    }
}

#topup-amount-options input:checked + .topup-amount-pill {
    border-color: rgba(34, 211, 238, 0.72) !important;
    background: rgba(34, 211, 238, 0.2) !important;
    color: #e2e8f0 !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.3) inset;
}

.theme-light #topup-amount-options input:checked + .topup-amount-pill {
    border-color: #0369a1 !important;
    background: #0ea5e9 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.28) !important;
}

.chat-model-option {
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.chat-model-tier-tab {
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.model-provider-filter,
.admin-model-provider-filter,
.admin-model-tier-filter,
.admin-model-modality-filter,
.admin-model-status-filter,
.model-modality-filter,
.guest-model-modality-filter {
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.model-provider-shelf {
    align-items: stretch;
    grid-template-columns: repeat(auto-fill, 58px);
    justify-content: start;
}

.model-provider-filter--tile {
    min-height: 58px;
    width: 58px;
    overflow: hidden;
}

.model-provider-filter--tile:hover {
    border-color: rgba(34, 211, 238, 0.38);
    background: rgba(15, 23, 42, 0.88);
}

.model-provider-filter--tile .model-provider-filter__mark {
    transition: transform 0.16s ease, opacity 0.16s ease;
}

.model-provider-filter--tile:hover .model-provider-filter__mark {
    transform: translateY(-1px);
}

.model-provider-filter--tile.is-active .model-provider-filter__mark {
    opacity: 1;
}

.theme-light .model-provider-filter--tile {
    background: rgba(255, 255, 255, 0.74);
}

.theme-light .model-provider-filter--tile:hover {
    border-color: rgba(2, 132, 199, 0.34);
    background: rgba(240, 249, 255, 0.92);
}

.model-provider-filter.is-active,
.admin-model-provider-filter.is-active,
.admin-model-tier-filter.is-active,
.admin-model-modality-filter.is-active,
.admin-model-status-filter.is-active,
.model-modality-filter.is-active,
.guest-model-modality-filter.is-active {
    border-color: rgba(34, 211, 238, 0.52) !important;
    background: rgba(34, 211, 238, 0.14) !important;
    color: #67e8f9 !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.2) inset;
}

.theme-light .model-provider-filter.is-active,
.theme-light .admin-model-provider-filter.is-active,
.theme-light .admin-model-tier-filter.is-active,
.theme-light .admin-model-modality-filter.is-active,
.theme-light .admin-model-status-filter.is-active,
.theme-light .model-modality-filter.is-active,
.theme-light .guest-model-modality-filter.is-active {
    border-color: #0284c7 !important;
    background: rgba(2, 132, 199, 0.16) !important;
    color: #0c4a6e !important;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.2) inset;
}

.chat-model-tier-tab.is-active {
    border-color: rgba(34, 211, 238, 0.52) !important;
    background: rgba(34, 211, 238, 0.14) !important;
    color: #67e8f9 !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.2) inset;
}

.theme-light .chat-model-tier-tab.is-active {
    border-color: #0284c7 !important;
    background: rgba(2, 132, 199, 0.16) !important;
    color: #0c4a6e !important;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.2) inset;
}

.peer:checked + .chat-model-option {
    border-color: rgba(34, 211, 238, 0.55);
    background: rgba(34, 211, 238, 0.12);
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.25) inset;
}

.chat-history-item.is-active {
    border-color: rgba(34, 211, 238, 0.52) !important;
    background: rgba(34, 211, 238, 0.12) !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.2) inset;
}

.theme-light .peer:checked + .chat-model-option {
    border-color: #0284c7 !important;
    background: rgba(2, 132, 199, 0.2) !important;
    box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.22) inset;
}

.theme-light .chat-history-item.is-active {
    border-color: #0369a1 !important;
    background: rgba(2, 132, 199, 0.2) !important;
    box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.22) inset;
}

.chat-history-model-icon {
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.theme-light .chat-history-model-icon {
    width: 1.35rem !important;
    height: 1.35rem !important;
    border-color: #9fb6d1 !important;
    background: linear-gradient(180deg, #f4f9ff 0%, #e3eefb 100%) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.75) inset, 0 0 0 1px rgba(148, 163, 184, 0.15);
}

.theme-light .chat-history-model-icon__img {
    width: 1rem !important;
    height: 1rem !important;
}

.theme-light .chat-history-model-icon__fallback {
    font-size: 11px !important;
}

.admin-cost-pill {
    font-weight: 600;
}

.admin-cost-pill-sale {
    border-color: rgba(34, 211, 238, 0.35);
    background: rgba(34, 211, 238, 0.14);
    color: #67e8f9;
}

.admin-cost-pill-cost {
    border-color: rgba(129, 140, 248, 0.4);
    background: rgba(129, 140, 248, 0.14);
    color: #c7d2fe;
}

.admin-cost-pill-margin {
    border-color: rgba(52, 211, 153, 0.35);
    background: rgba(52, 211, 153, 0.14);
    color: #86efac;
}

.theme-light .admin-cost-pill-sale {
    border-color: rgba(2, 132, 199, 0.35);
    background: rgba(2, 132, 199, 0.15);
    color: #0c4a6e;
}

.theme-light .admin-cost-pill-cost {
    border-color: rgba(79, 70, 229, 0.35);
    background: rgba(79, 70, 229, 0.14);
    color: #312e81;
}

.theme-light .admin-cost-pill-margin {
    border-color: rgba(21, 128, 61, 0.35);
    background: rgba(21, 128, 61, 0.13);
    color: #14532d;
}

.theme-light .admin-model-status.text-emerald-200 {
    border-color: rgba(22, 163, 74, 0.45) !important;
    background: rgba(34, 197, 94, 0.18) !important;
    color: #14532d !important;
    box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.12) inset;
}

.theme-light .admin-model-status.text-slate-400 {
    border-color: rgba(100, 116, 139, 0.38) !important;
    background: rgba(226, 232, 240, 0.92) !important;
    color: #334155 !important;
}

.chat-history-scroll {
    max-height: min(52vh, 520px);
}

.chat-input-shell {
    transition: border-color 0.24s ease, box-shadow 0.24s ease, background-color 0.24s ease, transform 0.24s ease;
}

.ai-media-card {
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(34, 211, 238, 0.1) 0%, rgba(34, 211, 238, 0) 54%),
        radial-gradient(140% 120% at 0% 100%, rgba(56, 189, 248, 0.08) 0%, rgba(56, 189, 248, 0) 60%),
        rgba(15, 23, 42, 0.68);
}

.ai-media-player-shell {
    box-shadow: inset 0 0 0 1px rgba(51, 65, 85, 0.35), 0 8px 18px rgba(2, 6, 23, 0.24);
}

.ai-media-player {
    display: block;
    width: 100%;
}

.ai-media-player--video {
    max-height: min(44vh, 340px);
}

.ai-media-player--audio {
    border-radius: 0.9rem;
    background: rgba(2, 6, 23, 0.8);
}

.ai-media-action-btn {
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.ai-media-action-btn:hover {
    border-color: rgba(34, 211, 238, 0.56);
    background: rgba(34, 211, 238, 0.2);
    color: #a5f3fc;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.22) inset;
}

.ai-media-kind-badge {
    --badge-tint: rgba(34, 211, 238, 0.35);
    --badge-tint-soft: rgba(34, 211, 238, 0.2);
    position: relative;
    overflow: hidden;
    gap: 0.42rem;
    padding: 0.2rem 0.58rem 0.2rem 0.3rem;
    border-radius: 999px;
    border: 1px solid rgba(51, 65, 85, 0.75);
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.9) 0%, rgba(30, 41, 59, 0.82) 58%, rgba(15, 23, 42, 0.92) 100%),
        linear-gradient(120deg, var(--badge-tint-soft) 0%, rgba(15, 23, 42, 0) 68%);
    color: #dbeafe;
    text-shadow: 0 1px 0 rgba(2, 6, 23, 0.4);
    box-shadow: 0 8px 18px rgba(2, 6, 23, 0.24), inset 0 0 0 1px rgba(148, 163, 184, 0.14);
    letter-spacing: 0.08em;
}

.ai-media-kind-badge::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(140deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 58%);
    pointer-events: none;
}

.ai-media-kind-badge > * {
    position: relative;
    z-index: 1;
}

.ai-media-kind-badge__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(51, 65, 85, 0.85));
    color: inherit;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.16), 0 2px 5px rgba(2, 6, 23, 0.25);
    flex-shrink: 0;
}

.ai-media-kind-badge__icon svg {
    width: 11px;
    height: 11px;
}

.ai-media-kind-badge--video {
    --badge-tint: rgba(14, 165, 233, 0.45);
    --badge-tint-soft: rgba(56, 189, 248, 0.24);
    border-color: rgba(56, 189, 248, 0.45);
    color: #e0f2fe;
}

.ai-media-kind-badge--video .ai-media-kind-badge__icon {
    border-color: rgba(56, 189, 248, 0.5);
    background: linear-gradient(145deg, rgba(2, 132, 199, 0.95), rgba(14, 116, 144, 0.88));
    color: #dff7ff;
}

.ai-media-kind-badge--audio {
    --badge-tint: rgba(16, 185, 129, 0.4);
    --badge-tint-soft: rgba(244, 114, 182, 0.22);
    border-color: rgba(110, 231, 183, 0.42);
    color: #dcfce7;
}

.ai-media-kind-badge--audio .ai-media-kind-badge__icon {
    border-color: rgba(110, 231, 183, 0.46);
    background: linear-gradient(145deg, rgba(5, 150, 105, 0.95), rgba(16, 185, 129, 0.86));
    color: #d1fae5;
}

.chat-copy-toast {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 200;
    max-width: min(92vw, 360px);
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: rgba(15, 23, 42, 0.95);
    color: #e2e8f0;
    font-size: 12px;
    line-height: 1.3;
    box-shadow: 0 12px 26px rgba(2, 6, 23, 0.35);
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 160ms ease, transform 160ms ease;
    pointer-events: none;
}

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

.chat-copy-toast--success {
    border-color: rgba(52, 211, 153, 0.55);
    background: rgba(2, 44, 34, 0.95);
    color: #d1fae5;
}

.chat-copy-toast--error {
    border-color: rgba(251, 113, 133, 0.55);
    background: rgba(76, 5, 25, 0.95);
    color: #fecdd3;
}

.chat-input-shell.is-soft-focus {
    border-color: rgba(34, 211, 238, 0.62) !important;
    background-color: rgba(15, 23, 42, 0.82) !important;
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.26), 0 0 0 8px rgba(34, 211, 238, 0.1), 0 10px 28px rgba(2, 6, 23, 0.34);
    transform: translateY(-1px);
}

.theme-light .chat-input-shell.is-soft-focus {
    border-color: rgba(2, 132, 199, 0.58) !important;
    background-color: rgba(235, 245, 255, 0.96) !important;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.22), 0 0 0 8px rgba(2, 132, 199, 0.1), 0 10px 24px rgba(30, 41, 59, 0.16);
}

.theme-light #chat-file-btn {
    border-color: rgba(2, 132, 199, 0.28);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(240, 249, 255, 0.9)) !important;
    color: #0f172a;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.88) inset,
        0 8px 18px rgba(15, 23, 42, 0.07);
}

.theme-light #chat-file-btn:hover {
    border-color: rgba(2, 132, 199, 0.42);
    background: linear-gradient(180deg, rgba(240, 249, 255, 1), rgba(224, 242, 254, 0.92)) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.88) inset,
        0 10px 22px rgba(2, 132, 199, 0.14);
}

.theme-light #chat-file-btn-icon {
    color: #0369a1;
}

.theme-light .chat-ai-charge {
    color: #047857;
    font-weight: 600;
}

.theme-light .chat-user-message-time {
    color: rgba(15, 23, 42, 0.58);
    font-weight: 600;
}

.theme-light .chat-history-delete-btn,
.theme-light .chat-history-delete-confirm {
    border-color: rgba(225, 29, 72, 0.42);
    background: linear-gradient(180deg, rgba(255, 241, 242, 0.98), rgba(254, 226, 226, 0.9)) !important;
    color: #be123c;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 8px 18px rgba(225, 29, 72, 0.13);
}

.theme-light .chat-history-delete-btn:hover,
.theme-light .chat-history-delete-confirm:hover {
    border-color: rgba(190, 18, 60, 0.6);
    background: linear-gradient(180deg, rgba(255, 228, 230, 1), rgba(254, 205, 211, 0.95)) !important;
    color: #9f1239;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 10px 24px rgba(225, 29, 72, 0.2);
}

.theme-light .chat-history-delete-cancel {
    border-color: rgba(100, 116, 139, 0.38);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 245, 249, 0.94)) !important;
    color: #334155;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 8px 18px rgba(15, 23, 42, 0.08);
}

.theme-light .chat-history-delete-cancel:hover {
    border-color: rgba(71, 85, 105, 0.5);
    background: linear-gradient(180deg, rgba(248, 250, 252, 1), rgba(226, 232, 240, 0.96)) !important;
    color: #0f172a;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 10px 22px rgba(15, 23, 42, 0.12);
}

.theme-light .ai-media-card {
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(14, 116, 144, 0.14) 0%, rgba(14, 116, 144, 0) 54%),
        radial-gradient(140% 120% at 0% 100%, rgba(2, 132, 199, 0.12) 0%, rgba(2, 132, 199, 0) 60%),
        rgba(255, 255, 255, 0.86);
    border-color: rgba(148, 163, 184, 0.45);
}

.theme-light .ai-media-player-shell {
    border-color: rgba(148, 163, 184, 0.5);
    background: rgba(241, 245, 249, 0.9);
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.35), 0 8px 16px rgba(148, 163, 184, 0.2);
}

.theme-light .ai-media-player--audio {
    background: rgba(226, 232, 240, 0.8);
}

.theme-light .ai-media-action-btn {
    border-color: rgba(2, 132, 199, 0.35);
    background: rgba(2, 132, 199, 0.12);
    color: #0c4a6e;
}

.theme-light .ai-media-action-btn:hover {
    border-color: rgba(2, 132, 199, 0.55);
    background: rgba(2, 132, 199, 0.2);
    color: #075985;
    box-shadow: 0 0 0 1px rgba(2, 132, 199, 0.2) inset;
}

.theme-light .ai-media-kind-badge {
    border-color: rgba(148, 163, 184, 0.48);
    background:
        linear-gradient(135deg, rgba(248, 250, 252, 0.95) 0%, rgba(226, 232, 240, 0.9) 58%, rgba(241, 245, 249, 0.95) 100%),
        linear-gradient(120deg, rgba(125, 211, 252, 0.16) 0%, rgba(255, 255, 255, 0) 65%);
    color: #1e293b;
    box-shadow: 0 6px 14px rgba(148, 163, 184, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.75);
}

.theme-light .ai-media-kind-badge--video {
    border-color: rgba(56, 189, 248, 0.45);
    color: #0c4a6e;
}

.theme-light .ai-media-kind-badge--audio {
    border-color: rgba(52, 211, 153, 0.42);
    color: #14532d;
}

.theme-light .ai-media-kind-badge__icon {
    border-color: rgba(148, 163, 184, 0.48);
    background: linear-gradient(145deg, rgba(241, 245, 249, 0.98), rgba(226, 232, 240, 0.94));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 1px 4px rgba(148, 163, 184, 0.24);
}

.theme-light .ai-media-kind-badge--video .ai-media-kind-badge__icon {
    border-color: rgba(56, 189, 248, 0.42);
    background: linear-gradient(145deg, rgba(224, 242, 254, 0.98), rgba(186, 230, 253, 0.95));
    color: #0369a1;
}

.theme-light .ai-media-kind-badge--audio .ai-media-kind-badge__icon {
    border-color: rgba(52, 211, 153, 0.4);
    background: linear-gradient(145deg, rgba(220, 252, 231, 0.98), rgba(167, 243, 208, 0.95));
    color: #047857;
}

.theme-light .chat-copy-toast {
    border-color: rgba(148, 163, 184, 0.55);
    background: rgba(248, 250, 252, 0.96);
    color: #0f172a;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.15);
}

.theme-light .chat-copy-toast.chat-copy-toast--success {
    border-color: rgba(22, 163, 74, 0.45);
    background: rgba(220, 252, 231, 0.96);
    color: #14532d;
}

.theme-light .chat-copy-toast.chat-copy-toast--error {
    border-color: rgba(239, 68, 68, 0.42);
    background: rgba(254, 226, 226, 0.96);
    color: #7f1d1d;
}

.landing-showcase__section,
.landing-showcase__card {
    isolation: isolate;
}

.landing-showcase__layout,
.landing-showcase__word,
.landing-showcase__section-line {
    z-index: 1;
}

.landing-showcase__video-play {
    line-height: 1;
}

.landing-showcase__model-panel {
    position: relative;
    z-index: 1;
}

.theme-light .landing-showcase__section {
    border-color: rgba(148, 163, 184, 0.3) !important;
    box-shadow:
        0 24px 60px rgba(148, 163, 184, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.theme-light .landing-showcase__section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 24%, rgba(255, 255, 255, 0.1) 100%);
}

.theme-light .landing-showcase__section--language {
    background:
        radial-gradient(56rem 30rem at 0% 0%, rgba(34, 211, 238, 0.18) 0%, rgba(34, 211, 238, 0) 45%),
        radial-gradient(32rem 24rem at 100% 8%, rgba(99, 102, 241, 0.16) 0%, rgba(99, 102, 241, 0) 44%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(239, 247, 255, 0.94) 100%) !important;
}

.theme-light .landing-showcase__section--image {
    background:
        radial-gradient(52rem 28rem at 0% 0%, rgba(251, 191, 36, 0.18) 0%, rgba(251, 191, 36, 0) 44%),
        radial-gradient(30rem 24rem at 100% 6%, rgba(244, 114, 182, 0.16) 0%, rgba(244, 114, 182, 0) 40%),
        linear-gradient(180deg, rgba(255, 251, 245, 0.96) 0%, rgba(255, 245, 250, 0.94) 100%) !important;
}

.theme-light .landing-showcase__section--audio {
    background:
        radial-gradient(54rem 30rem at 0% 0%, rgba(45, 212, 191, 0.16) 0%, rgba(45, 212, 191, 0) 44%),
        radial-gradient(28rem 22rem at 100% 10%, rgba(251, 191, 36, 0.16) 0%, rgba(251, 191, 36, 0) 42%),
        linear-gradient(180deg, rgba(248, 255, 252, 0.96) 0%, rgba(243, 248, 255, 0.94) 100%) !important;
}

.theme-light .landing-showcase__section--video {
    background:
        radial-gradient(56rem 30rem at 0% 0%, rgba(59, 130, 246, 0.16) 0%, rgba(59, 130, 246, 0) 44%),
        radial-gradient(30rem 24rem at 100% 8%, rgba(236, 72, 153, 0.14) 0%, rgba(236, 72, 153, 0) 40%),
        linear-gradient(180deg, rgba(246, 250, 255, 0.96) 0%, rgba(248, 245, 255, 0.94) 100%) !important;
}

.theme-light .landing-showcase__word {
    color: rgba(15, 23, 42, 0.07) !important;
}

.theme-light .landing-showcase__section-line {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(148, 163, 184, 0.45), rgba(255, 255, 255, 0)) !important;
}

.theme-light .landing-showcase__eyebrow,
.theme-light .landing-showcase__pill {
    background: rgba(255, 255, 255, 0.54) !important;
    border-color: rgba(148, 163, 184, 0.34) !important;
    color: #1e293b !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 10px 24px rgba(148, 163, 184, 0.12);
}

.theme-light .landing-showcase__eyebrow-number {
    color: #0f766e !important;
}

.theme-light .landing-showcase__title {
    color: #0f172a !important;
}

.theme-light .landing-showcase__description {
    color: #334155 !important;
}

.theme-light .landing-showcase__meta {
    color: #64748b !important;
}

.theme-light .landing-showcase__card {
    border-color: rgba(148, 163, 184, 0.34) !important;
    background: rgba(255, 255, 255, 0.34) !important;
    backdrop-filter: blur(14px);
    box-shadow:
        0 18px 42px rgba(148, 163, 184, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.theme-light .landing-showcase__card:hover {
    border-color: rgba(14, 165, 233, 0.32) !important;
    box-shadow:
        0 26px 56px rgba(125, 211, 252, 0.22),
        0 16px 40px rgba(148, 163, 184, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.theme-light .landing-showcase__card-bg {
    opacity: 0.72;
    filter: saturate(1.06) contrast(0.9) brightness(1.08);
}

.theme-light .landing-showcase__section--image .landing-showcase__card-bg,
.theme-light .landing-showcase__section--video .landing-showcase__card-bg {
    opacity: 0.56;
    filter: saturate(1.08) contrast(0.84) brightness(1.1);
}

.theme-light .landing-showcase__card-overlay {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(248, 250, 252, 0.24) 34%, rgba(248, 250, 252, 0.94) 100%) !important;
}

.theme-light .landing-showcase__section--image .landing-showcase__card-overlay,
.theme-light .landing-showcase__section--video .landing-showcase__card-overlay {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(248, 250, 252, 0.14) 28%, rgba(248, 250, 252, 0.96) 100%) !important;
}

.theme-light .landing-showcase__logo-mark {
    opacity: 0.11;
}

.theme-light .landing-showcase__language-orb,
.theme-light .landing-showcase__image-orb,
.theme-light .landing-showcase__image-pill {
    border-color: rgba(255, 255, 255, 0.55) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        0 12px 28px rgba(148, 163, 184, 0.14);
}

.theme-light .landing-showcase__language-orb {
    background: rgba(255, 255, 255, 0.26) !important;
}

.theme-light .landing-showcase__image-wash {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 34%, rgba(248, 250, 252, 0.46) 100%) !important;
}

.theme-light .landing-showcase__image-orb {
    background: rgba(255, 255, 255, 0.22) !important;
}

.theme-light .landing-showcase__image-pill {
    background: rgba(255, 255, 255, 0.28) !important;
}

.landing-showcase__audio-waveform {
    background:
        linear-gradient(180deg, rgba(2, 6, 23, 0.08) 0%, rgba(2, 6, 23, 0.34) 100%),
        radial-gradient(circle at 18% 50%, rgba(34, 211, 238, 0.10) 0%, transparent 34%),
        radial-gradient(circle at 82% 50%, rgba(16, 185, 129, 0.10) 0%, transparent 32%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 16px 36px rgba(2, 6, 23, 0.22);
}

.landing-showcase__audio-waveform-grid {
    background:
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0 1px, transparent 1px 28px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 18px);
    opacity: 0.46;
}

.landing-showcase__audio-waveform-trace {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 120' fill='none'%3E%3Cpath d='M0 60 C18 60 24 38 38 38 S56 84 70 84 92 24 108 24 124 98 142 98 160 52 178 52 196 36 214 36 236 86 254 86 274 28 292 28 314 92 334 92 356 46 374 46 394 18 412 18 436 96 454 96 474 42 494 42 516 74 536 74 560 60 600 60' stroke='%237dd3fc' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' stroke-opacity='0.92'/%3E%3Cpath d='M0 60 C18 60 24 38 38 38 S56 84 70 84 92 24 108 24 124 98 142 98 160 52 178 52 196 36 214 36 236 86 254 86 274 28 292 28 314 92 334 92 356 46 374 46 394 18 412 18 436 96 454 96 474 42 494 42 516 74 536 74 560 60 600 60' stroke='%2334d399' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round' stroke-opacity='0.7'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    opacity: 0.96;
    filter: drop-shadow(0 0 18px rgba(34, 211, 238, 0.22));
}

.landing-showcase__audio-waveform-scan {
    background:
        linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.04) 44%, rgba(255, 255, 255, 0.08) 50%, rgba(255, 255, 255, 0.04) 56%, transparent 100%);
    opacity: 0.72;
}

.landing-showcase__audio-eq {
    background:
        radial-gradient(circle at 18% 0%, rgba(34, 211, 238, 0.16), transparent 38%),
        radial-gradient(circle at 76% 100%, rgba(251, 113, 133, 0.14), transparent 34%),
        linear-gradient(180deg, rgba(2, 6, 23, 0.12), rgba(2, 6, 23, 0.38));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 16px 36px rgba(2, 6, 23, 0.22);
}

.landing-showcase__audio-eq::before {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 22px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.42), transparent);
}

.landing-showcase__audio-eq span {
    position: relative;
    z-index: 1;
    width: 5px;
    height: var(--h);
    min-height: 12px;
    border-radius: 999px;
    background: linear-gradient(180deg, #67e8f9, #22d3ee 48%, #34d399);
    box-shadow: 0 0 18px rgba(34, 211, 238, 0.20);
    transform-origin: bottom;
    animation: landing-showcase-eq-pulse 0.96s ease-in-out infinite alternate;
    animation-delay: calc(var(--i) * -70ms);
}

.landing-showcase__audio-eq span:nth-child(4n) {
    background: linear-gradient(180deg, #fde68a, #f59e0b 52%, #34d399);
}

.landing-showcase__audio-eq span:nth-child(6n) {
    opacity: 0.64;
}

.landing-showcase__audio-disc {
    position: absolute;
    right: 18px;
    top: 6px;
    width: 108px;
    aspect-ratio: 1;
    border-radius: 50%;
    background:
        radial-gradient(circle, #020617 0 12%, #f59e0b 13% 16%, transparent 17%),
        conic-gradient(from 35deg, #22d3ee, #f472b6, #facc15, #34d399, #22d3ee);
    filter: saturate(1.1);
    opacity: .9;
    animation: landing-showcase-disc-spin 18s linear infinite;
}

.theme-light .landing-showcase__audio-waveform {
    border-color: rgba(255, 255, 255, 0.58) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(248, 250, 252, 0.58) 100%),
        radial-gradient(circle at 18% 50%, rgba(14, 165, 233, 0.10) 0%, transparent 34%),
        radial-gradient(circle at 82% 50%, rgba(16, 185, 129, 0.10) 0%, transparent 32%) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.62),
        0 14px 28px rgba(148, 163, 184, 0.16);
}

.theme-light .landing-showcase__audio-waveform-grid {
    background:
        repeating-linear-gradient(90deg, rgba(71, 85, 105, 0.10) 0 1px, transparent 1px 28px),
        repeating-linear-gradient(0deg, rgba(71, 85, 105, 0.08) 0 1px, transparent 1px 18px);
    opacity: 0.52;
}

.theme-light .landing-showcase__audio-waveform-trace {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 120' fill='none'%3E%3Cpath d='M0 60 C18 60 24 38 38 38 S56 84 70 84 92 24 108 24 124 98 142 98 160 52 178 52 196 36 214 36 236 86 254 86 274 28 292 28 314 92 334 92 356 46 374 46 394 18 412 18 436 96 454 96 474 42 494 42 516 74 536 74 560 60 600 60' stroke='%230f766e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' stroke-opacity='0.86'/%3E%3Cpath d='M0 60 C18 60 24 38 38 38 S56 84 70 84 92 24 108 24 124 98 142 98 160 52 178 52 196 36 214 36 236 86 254 86 274 28 292 28 314 92 334 92 356 46 374 46 394 18 412 18 436 96 454 96 474 42 494 42 516 74 536 74 560 60 600 60' stroke='%230284c7' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round' stroke-opacity='0.62'/%3E%3C/svg%3E");
    filter: none;
}

.theme-light .landing-showcase__audio-waveform-scan {
    background:
        linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.08) 44%, rgba(255, 255, 255, 0.16) 50%, rgba(255, 255, 255, 0.08) 56%, transparent 100%);
}

.theme-light .landing-showcase__audio-eq {
    border-color: rgba(255, 255, 255, 0.58) !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(8, 145, 178, 0.15), transparent 38%),
        radial-gradient(circle at 76% 100%, rgba(217, 119, 6, 0.12), transparent 34%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.62), rgba(226, 232, 240, 0.46)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.62),
        0 14px 28px rgba(148, 163, 184, 0.16);
}

.theme-light .landing-showcase__audio-eq::before {
    background: linear-gradient(90deg, transparent, rgba(8, 145, 178, 0.28), transparent);
}

.theme-light .landing-showcase__audio-disc {
    filter: saturate(1.04) contrast(0.92) brightness(1.04);
}

.theme-light .landing-showcase__video-frame {
    border-color: rgba(255, 255, 255, 0.58) !important;
    background: rgba(255, 255, 255, 0.38) !important;
    box-shadow:
        0 18px 34px rgba(148, 163, 184, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.theme-light .landing-showcase__video-art {
    opacity: 0.88;
    filter: saturate(1.04) contrast(0.9) brightness(1.03);
}

.theme-light .landing-showcase__video-play {
    border-color: rgba(255, 255, 255, 0.64) !important;
    background: rgba(255, 255, 255, 0.74) !important;
    color: #0f172a !important;
    box-shadow: 0 10px 22px rgba(148, 163, 184, 0.24);
}

.theme-light .landing-showcase__video-meta {
    border-color: rgba(148, 163, 184, 0.24) !important;
    background: rgba(248, 250, 252, 0.76) !important;
    color: rgba(51, 65, 85, 0.8) !important;
}

.theme-light .landing-showcase__video-timeline {
    background: rgba(148, 163, 184, 0.22) !important;
}

.theme-light .landing-showcase__video-progress {
    background: linear-gradient(90deg, rgba(14, 165, 233, 0.94), rgba(34, 211, 238, 0.92)) !important;
    box-shadow: 0 0 16px rgba(14, 165, 233, 0.24);
}

.theme-light .landing-showcase__card-kind,
.theme-light .landing-showcase__model {
    border-color: rgba(148, 163, 184, 0.32) !important;
    background: rgba(255, 255, 255, 0.56) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 8px 18px rgba(148, 163, 184, 0.12);
}

.theme-light .landing-showcase__card-kind {
    color: #334155 !important;
}

.theme-light .landing-showcase__card-provider,
.theme-light .landing-showcase__model-value {
    color: #0f172a !important;
}

.theme-light .landing-showcase__card-note {
    color: #334155 !important;
}

.theme-light .landing-showcase__model-label {
    color: #64748b !important;
}

.theme-light .landing-showcase__model-panel {
    color: #0f172a !important;
}

.theme-light .landing-showcase__model-panel:hover {
    border-color: rgba(2, 132, 199, 0.26) !important;
    background: rgba(255, 255, 255, 0.7) !important;
}

.theme-light .landing-showcase__model-panel .landing-showcase__model-value {
    color: #0f172a !important;
}

.theme-light .landing-showcase__model-panel:hover .landing-showcase__model-value {
    color: #0369a1 !important;
}

.theme-light .landing-demo-btn {
    border-color: rgba(2, 132, 199, 0.52) !important;
    background: linear-gradient(180deg, #ffffff 0%, #e8f7ff 100%) !important;
    color: #075985 !important;
    box-shadow:
        0 12px 28px rgba(14, 116, 144, 0.16),
        inset 0 0 0 1px rgba(255, 255, 255, 0.75) !important;
}

.theme-light .landing-demo-btn:hover {
    border-color: rgba(2, 132, 199, 0.82) !important;
    background: linear-gradient(180deg, #f8fdff 0%, #d9f1ff 100%) !important;
    color: #0c4a6e !important;
    transform: translateY(-1px);
}

.theme-light .landing-demo-btn img {
    filter: drop-shadow(0 1px 1px rgba(15, 23, 42, 0.16));
}

@keyframes landing-showcase-disc-spin {
    to { transform: rotate(360deg); }
}

@keyframes landing-showcase-eq-pulse {
    from { transform: scaleY(0.58); opacity: 0.62; }
    to { transform: scaleY(1.08); opacity: 1; }
}
