/*
 * Long Pause Media 0.4.0 — Dark Glass UI
 * Loaded after the base application and player styles so the same visual
 * language applies to public, authentication, setup, creator, and admin pages.
 */

html.dark-glass-ui {
    color-scheme: dark;
    --bg: #050b15;
    --surface: rgba(13, 28, 49, .74);
    --surface-soft: rgba(18, 37, 63, .54);
    --surface-strong: rgba(31, 56, 89, .64);
    --ink: #f5f9ff;
    --ink-soft: rgba(224, 236, 250, .74);
    --ink-muted: rgba(174, 195, 221, .58);
    --line: rgba(153, 191, 230, .14);
    --line-strong: rgba(148, 199, 244, .25);
    --accent: #42c8ff;
    --accent-dark: #1e9fe7;
    --accent-soft: rgba(66, 200, 255, .13);
    --success: #6ee7b7;
    --success-soft: rgba(20, 160, 107, .14);
    --warning: #ffc56d;
    --warning-soft: rgba(214, 139, 31, .14);
    --danger: #ff8fa2;
    --danger-soft: rgba(211, 54, 86, .15);
    --sidebar: rgba(5, 14, 28, .94);
    --sidebar-soft: rgba(37, 67, 104, .48);
    --sidebar-text: rgba(228, 239, 252, .82);
    --shadow-sm: 0 1px 0 rgba(255, 255, 255, .035), 0 16px 38px rgba(0, 0, 0, .20);
    --shadow-md: 0 1px 0 rgba(255, 255, 255, .045), 0 28px 74px rgba(0, 0, 0, .34);
}

html.dark-glass-ui,
html.dark-glass-ui body {
    min-height: 100%;
    background-color: #050b15;
}

html.dark-glass-ui body {
    color: var(--ink);
    background-image:
        radial-gradient(circle at 8% -8%, rgba(50, 188, 255, .18), transparent 31rem),
        radial-gradient(circle at 98% 1%, rgba(102, 83, 255, .16), transparent 37rem),
        radial-gradient(circle at 55% 110%, rgba(21, 111, 183, .13), transparent 40rem),
        linear-gradient(rgba(255, 255, 255, .018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .018) 1px, transparent 1px),
        linear-gradient(180deg, #07111f 0%, #050b15 55%, #030811 100%);
    background-size: auto, auto, auto, 48px 48px, 48px 48px, auto;
    background-attachment: fixed;
}

html.dark-glass-ui ::selection {
    color: #fff;
    background: rgba(69, 199, 255, .38);
}

html.dark-glass-ui *,
html.dark-glass-ui *::before,
html.dark-glass-ui *::after {
    scrollbar-color: rgba(120, 179, 228, .45) rgba(3, 10, 20, .25);
}

html.dark-glass-ui *::-webkit-scrollbar { width: 10px; height: 10px; }
html.dark-glass-ui *::-webkit-scrollbar-track { background: rgba(3, 10, 20, .24); }
html.dark-glass-ui *::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(118, 175, 225, .38);
    background-clip: padding-box;
}
html.dark-glass-ui *::-webkit-scrollbar-thumb:hover { background-color: rgba(95, 203, 255, .56); }

html.dark-glass-ui a { color: #72ddff; }
html.dark-glass-ui a:hover { color: #b3efff; }
html.dark-glass-ui h1,
html.dark-glass-ui h2,
html.dark-glass-ui h3,
html.dark-glass-ui h4,
html.dark-glass-ui strong { color: var(--ink); }
html.dark-glass-ui code { color: #a7eaff; }

/* Shared glass surfaces */
html.dark-glass-ui .surface,
html.dark-glass-ui .stat-card,
html.dark-glass-ui .auth-card,
html.dark-glass-ui .show-card,
html.dark-glass-ui .media-manager,
html.dark-glass-ui .settings-tab,
html.dark-glass-ui .selection-card,
html.dark-glass-ui .empty-state,
html.dark-glass-ui .audio-card {
    border-color: var(--line);
    background:
        linear-gradient(145deg, rgba(20, 42, 71, .70), rgba(8, 21, 40, .77));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .045),
        0 22px 58px rgba(0, 0, 0, .24);
    -webkit-backdrop-filter: blur(20px) saturate(1.15);
    backdrop-filter: blur(20px) saturate(1.15);
}

html.dark-glass-ui .surface-header {
    border-color: var(--line);
    background: linear-gradient(180deg, rgba(27, 52, 83, .34), rgba(11, 27, 49, .12));
}

html.dark-glass-ui .surface-footer,
html.dark-glass-ui .media-manager-footer {
    border-color: var(--line);
    background: rgba(5, 16, 31, .42);
}

html.dark-glass-ui .surface:hover,
html.dark-glass-ui .stat-card:hover {
    border-color: rgba(111, 206, 255, .21);
}

/* Primary controls */
html.dark-glass-ui .btn {
    border-color: rgba(128, 224, 255, .26);
    color: #fff;
    background: linear-gradient(135deg, #25c6ff 0%, #347cff 54%, #655fff 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .22),
        0 10px 26px rgba(35, 137, 255, .23);
}

html.dark-glass-ui .btn:hover {
    color: #fff;
    background: linear-gradient(135deg, #51d7ff 0%, #4b91ff 54%, #756cff 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .25),
        0 14px 34px rgba(39, 157, 255, .30);
    transform: translateY(-1px);
}

html.dark-glass-ui .btn:active { transform: translateY(0); }

html.dark-glass-ui .btn-secondary {
    color: var(--ink);
    border-color: var(--line-strong);
    background: rgba(16, 35, 59, .66);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

html.dark-glass-ui .btn-secondary:hover {
    color: #fff;
    border-color: rgba(105, 215, 255, .38);
    background: rgba(30, 63, 98, .78);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

html.dark-glass-ui .btn-ghost {
    color: var(--ink-soft);
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

html.dark-glass-ui .btn-ghost:hover {
    color: #fff;
    border-color: rgba(136, 200, 243, .11);
    background: rgba(89, 145, 196, .13);
    box-shadow: none;
}

html.dark-glass-ui .btn-danger {
    border-color: rgba(255, 142, 162, .32);
    background: linear-gradient(135deg, #e84e72, #bd3558);
    box-shadow: 0 10px 24px rgba(211, 54, 86, .20);
}
html.dark-glass-ui .btn-danger:hover { background: linear-gradient(135deg, #fa6685, #d44265); }

html.dark-glass-ui :focus-visible {
    outline: 2px solid rgba(91, 214, 255, .92);
    outline-offset: 3px;
}

/* Branding and public shell */
html.dark-glass-ui .brand { color: var(--ink); }
html.dark-glass-ui .brand:hover { color: #fff; }
html.dark-glass-ui .brand-mark {
    border: 1px solid rgba(140, 228, 255, .26);
    color: #fff;
    background: linear-gradient(145deg, #1fc9ff, #376fff 62%, #725eff);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .25),
        0 10px 28px rgba(42, 148, 255, .32),
        0 0 36px rgba(65, 199, 255, .13);
}

html.dark-glass-ui .site-header {
    border-color: var(--line);
    background: rgba(5, 13, 26, .74);
    box-shadow: 0 12px 42px rgba(0, 0, 0, .18);
    -webkit-backdrop-filter: blur(22px) saturate(1.25);
    backdrop-filter: blur(22px) saturate(1.25);
}

html.dark-glass-ui .site-nav > a {
    color: var(--ink-soft);
}
html.dark-glass-ui .site-nav > a:hover {
    color: #fff;
    background: rgba(89, 154, 213, .13);
}
html.dark-glass-ui .site-nav > .btn,
html.dark-glass-ui .site-nav > .btn:hover { color: #fff; }

html.dark-glass-ui .public-main { position: relative; }
html.dark-glass-ui .site-footer {
    border-color: var(--line);
    background: rgba(4, 12, 24, .62);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}
html.dark-glass-ui .site-footer-inner { color: var(--ink-muted); }

/* App shell and navigation */
html.dark-glass-ui .app-shell { background: transparent; }
html.dark-glass-ui .app-shell::before {
    border-right: 1px solid rgba(132, 184, 229, .13);
    background:
        radial-gradient(circle at 20% 0%, rgba(48, 190, 255, .12), transparent 17rem),
        linear-gradient(180deg, rgba(7, 20, 38, .97), rgba(4, 11, 23, .95));
    box-shadow: 18px 0 64px rgba(0, 0, 0, .20);
}
html.dark-glass-ui .app-main { background: transparent; }
html.dark-glass-ui .sidebar {
    border-right: 1px solid rgba(132, 184, 229, .13);
    background:
        radial-gradient(circle at 20% 0%, rgba(48, 190, 255, .12), transparent 17rem),
        linear-gradient(180deg, rgba(7, 20, 38, .97), rgba(4, 11, 23, .95));
    box-shadow: 18px 0 64px rgba(0, 0, 0, .20);
    -webkit-backdrop-filter: blur(24px) saturate(1.2);
    backdrop-filter: blur(24px) saturate(1.2);
}
html.dark-glass-ui .sidebar .brand { color: #fff; }
html.dark-glass-ui .sidebar-label { color: rgba(154, 183, 216, .54); }
html.dark-glass-ui .sidebar-link { color: rgba(210, 226, 244, .68); }
html.dark-glass-ui .sidebar-link:hover {
    color: #fff;
    background: rgba(61, 114, 164, .21);
}
html.dark-glass-ui .sidebar-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(45, 169, 255, .25), rgba(72, 86, 207, .18));
    box-shadow:
        inset 3px 0 0 #69e2ff,
        inset 0 1px 0 rgba(255, 255, 255, .035),
        0 10px 30px rgba(0, 0, 0, .12);
}
html.dark-glass-ui .nav-icon { color: #82e7ff; }
html.dark-glass-ui .sidebar-account { border-color: rgba(255, 255, 255, .08); }
html.dark-glass-ui .avatar {
    border: 1px solid rgba(132, 212, 255, .16);
    color: #eaf8ff;
    background: linear-gradient(145deg, rgba(45, 103, 157, .82), rgba(56, 67, 126, .86));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}
html.dark-glass-ui .account-chip span { color: rgba(171, 194, 219, .56); }
html.dark-glass-ui .mobile-bar {
    border-color: var(--line);
    background: rgba(5, 14, 27, .86);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .20);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}
html.dark-glass-ui .mobile-menu {
    color: var(--ink);
    border-color: var(--line-strong);
    background: rgba(17, 36, 60, .78);
}
html.dark-glass-ui body.sidebar-open::after { background: rgba(1, 6, 13, .72); }

/* Page type */
html.dark-glass-ui .eyebrow {
    color: #64ddff;
    text-shadow: 0 0 22px rgba(71, 208, 255, .24);
}
html.dark-glass-ui .page-title,
html.dark-glass-ui .hero-title,
html.dark-glass-ui .podcast-title {
    color: #f7fbff;
    text-shadow: 0 12px 42px rgba(0, 0, 0, .24);
}
html.dark-glass-ui .page-subtitle,
html.dark-glass-ui .hero-copy,
html.dark-glass-ui .podcast-description,
html.dark-glass-ui .episode-copy,
html.dark-glass-ui .episode-summary,
html.dark-glass-ui .show-card-copy,
html.dark-glass-ui .section-header p {
    color: var(--ink-soft);
}
html.dark-glass-ui .breadcrumbs { color: var(--ink-muted); }
html.dark-glass-ui .breadcrumbs a { color: rgba(184, 218, 244, .68); }
html.dark-glass-ui .breadcrumbs a:hover { color: #9feaff; }
html.dark-glass-ui .breadcrumbs span { color: rgba(136, 170, 206, .27); }

/* Forms */
html.dark-glass-ui input[type="text"],
html.dark-glass-ui input[type="email"],
html.dark-glass-ui input[type="password"],
html.dark-glass-ui input[type="url"],
html.dark-glass-ui input[type="number"],
html.dark-glass-ui input[type="date"],
html.dark-glass-ui input[type="datetime-local"],
html.dark-glass-ui input[type="search"],
html.dark-glass-ui select,
html.dark-glass-ui textarea {
    color: var(--ink);
    border-color: var(--line-strong);
    background: rgba(3, 13, 27, .67);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}
html.dark-glass-ui input::placeholder,
html.dark-glass-ui textarea::placeholder { color: rgba(164, 187, 214, .43); }
html.dark-glass-ui select option {
    color: #f3f8ff;
    background: #0b1728;
}
html.dark-glass-ui input:focus,
html.dark-glass-ui select:focus,
html.dark-glass-ui textarea:focus {
    color: #fff;
    border-color: rgba(91, 214, 255, .76);
    background: rgba(4, 17, 34, .88);
    box-shadow: 0 0 0 3px rgba(57, 189, 255, .13), 0 0 28px rgba(57, 189, 255, .07);
}
html.dark-glass-ui input[type="checkbox"],
html.dark-glass-ui input[type="radio"] { accent-color: #42c8ff; }
html.dark-glass-ui input[type="file"] {
    color: var(--ink-soft);
    border-color: var(--line-strong);
    background: rgba(5, 17, 33, .48);
}
html.dark-glass-ui input[type="file"]::file-selector-button {
    margin-right: 12px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 7px 11px;
    color: var(--ink);
    background: rgba(34, 68, 105, .64);
    cursor: pointer;
}
html.dark-glass-ui input[type="date"]::-webkit-calendar-picker-indicator,
html.dark-glass-ui input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1) brightness(1.5);
    opacity: .72;
}
html.dark-glass-ui input:-webkit-autofill,
html.dark-glass-ui input:-webkit-autofill:hover,
html.dark-glass-ui input:-webkit-autofill:focus {
    -webkit-text-fill-color: #f5f9ff;
    box-shadow: 0 0 0 1000px #09172a inset;
    transition: background-color 9999s ease-out;
}
html.dark-glass-ui .field label { color: rgba(241, 247, 255, .92); }
html.dark-glass-ui .field-hint,
html.dark-glass-ui .resume-note,
html.dark-glass-ui .table-secondary,
html.dark-glass-ui .table-subtext,
html.dark-glass-ui .secret-meta,
html.dark-glass-ui .stat-note { color: var(--ink-muted); }
html.dark-glass-ui .field-error,
html.dark-glass-ui .table-error { color: #ff9fb0; }
html.dark-glass-ui .divider { background: var(--line); }
html.dark-glass-ui .readonly-field {
    border-color: var(--line);
    background: rgba(3, 13, 27, .46);
}
html.dark-glass-ui .readonly-field code { color: #a9eaff; }
html.dark-glass-ui .input-suffix span {
    color: var(--ink-muted);
    border-color: var(--line-strong);
    background: rgba(18, 38, 64, .64);
}

/* Tables and structured data */
html.dark-glass-ui th,
html.dark-glass-ui .data-table th {
    color: rgba(181, 205, 230, .63);
    border-color: var(--line);
    background: rgba(4, 15, 30, .54);
}
html.dark-glass-ui td,
html.dark-glass-ui .data-table td { border-color: var(--line); }
html.dark-glass-ui tbody tr:hover,
html.dark-glass-ui .data-table tbody tr:hover td { background: rgba(76, 145, 203, .075); }
html.dark-glass-ui .table-primary { color: var(--ink); }
html.dark-glass-ui .definition-row,
html.dark-glass-ui .definition-list > div,
html.dark-glass-ui .check-row,
html.dark-glass-ui .check-row-item,
html.dark-glass-ui .config-priority-row,
html.dark-glass-ui .compact-item,
html.dark-glass-ui .episode-row,
html.dark-glass-ui .access-row { border-color: var(--line); }
html.dark-glass-ui .definition-row dt,
html.dark-glass-ui .definition-list span,
html.dark-glass-ui .check-value,
html.dark-glass-ui .meta-row,
html.dark-glass-ui .compact-main span,
html.dark-glass-ui .access-row span { color: var(--ink-muted); }
html.dark-glass-ui .table-wrap { border-radius: inherit; }

/* Status and alerts */
html.dark-glass-ui .alert {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 14px 38px rgba(0, 0, 0, .16);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}
html.dark-glass-ui .alert-success {
    color: #8ff0c8;
    border-color: rgba(93, 231, 180, .28);
    background: rgba(17, 130, 91, .17);
}
html.dark-glass-ui .alert-error {
    color: #ff9fb0;
    border-color: rgba(255, 124, 151, .28);
    background: rgba(166, 37, 67, .18);
}
html.dark-glass-ui .alert-warning {
    color: #ffd08a;
    border-color: rgba(255, 190, 91, .28);
    background: rgba(169, 104, 17, .18);
}
html.dark-glass-ui .alert-info,
html.dark-glass-ui .info-callout {
    color: #a9e9ff;
    border-color: rgba(94, 202, 255, .26);
    background: rgba(36, 115, 173, .17);
}
html.dark-glass-ui .badge {
    border: 1px solid rgba(255, 255, 255, .055);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}
html.dark-glass-ui .badge-draft { color: #c6d2e3; background: rgba(124, 145, 171, .16); }
html.dark-glass-ui .badge-published,
html.dark-glass-ui .badge-active,
html.dark-glass-ui .badge-ready,
html.dark-glass-ui .badge-approved,
html.dark-glass-ui .badge-verified_email,
html.dark-glass-ui .badge-completed,
html.dark-glass-ui .badge-skipped {
    color: #8ff0c8;
    background: rgba(23, 142, 98, .18);
}
html.dark-glass-ui .badge-private { color: #d0b8ff; background: rgba(118, 74, 188, .20); }
html.dark-glass-ui .badge-unlisted,
html.dark-glass-ui .badge-suspended,
html.dark-glass-ui .badge-manual_review,
html.dark-glass-ui .badge-queued,
html.dark-glass-ui .badge-importing,
html.dark-glass-ui .badge-migrating,
html.dark-glass-ui .badge-processing {
    color: #ffd08a;
    background: rgba(172, 106, 19, .19);
}
html.dark-glass-ui .badge-scheduled { color: #9fd8ff; background: rgba(46, 118, 184, .20); }
html.dark-glass-ui .badge-danger,
html.dark-glass-ui .badge-disabled,
html.dark-glass-ui .badge-rejected,
html.dark-glass-ui .badge-failed,
html.dark-glass-ui .badge-completed_with_errors {
    color: #ff9fb0;
    background: rgba(171, 39, 71, .20);
}

/* Cards, lists, and media */
html.dark-glass-ui .show-card { overflow: hidden; }
html.dark-glass-ui .show-card:hover {
    border-color: rgba(98, 213, 255, .38);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        0 30px 70px rgba(0, 0, 0, .32),
        0 0 38px rgba(55, 177, 255, .08);
}
html.dark-glass-ui .show-card-art,
html.dark-glass-ui .art-placeholder,
html.dark-glass-ui .compact-art,
html.dark-glass-ui .podcast-art,
html.dark-glass-ui .artwork-manager-preview {
    border-color: var(--line);
    background: linear-gradient(145deg, rgba(31, 65, 103, .72), rgba(6, 18, 35, .84));
}
html.dark-glass-ui .art-placeholder {
    color: rgba(130, 220, 255, .66);
    text-shadow: 0 0 28px rgba(63, 194, 255, .18);
}
html.dark-glass-ui .compact-art,
html.dark-glass-ui .podcast-art,
html.dark-glass-ui .artwork-manager-preview { border: 1px solid var(--line); }
html.dark-glass-ui .empty-state {
    border-style: dashed;
    background: rgba(9, 25, 45, .48);
}
html.dark-glass-ui .empty-icon {
    color: #8de8ff;
    border: 1px solid rgba(111, 214, 255, .18);
    background: rgba(61, 177, 230, .13);
    box-shadow: 0 0 30px rgba(52, 183, 247, .08);
}
html.dark-glass-ui .selection-card,
html.dark-glass-ui .checkbox-card,
html.dark-glass-ui .choice-card,
html.dark-glass-ui .provider-card,
html.dark-glass-ui .toggle-card,
html.dark-glass-ui .inline-editor,
html.dark-glass-ui .media-empty-row {
    color: var(--ink);
    border-color: var(--line);
    background: rgba(13, 31, 54, .50);
}
html.dark-glass-ui .selection-card:hover,
html.dark-glass-ui .checkbox-card:hover,
html.dark-glass-ui .choice-card:hover {
    color: #fff;
    border-color: rgba(99, 211, 255, .35);
    background: rgba(34, 79, 119, .42);
}
html.dark-glass-ui .provider-card:hover,
html.dark-glass-ui .provider-card.selected,
html.dark-glass-ui .provider-card:has(input:checked) {
    border-color: rgba(97, 215, 255, .46);
    background: linear-gradient(145deg, rgba(31, 112, 163, .31), rgba(60, 68, 149, .22));
    box-shadow: 0 0 0 2px rgba(60, 197, 255, .08), 0 16px 36px rgba(0, 0, 0, .16);
}
html.dark-glass-ui .provider-icon {
    color: #fff;
    background: linear-gradient(145deg, #22c5ff, #4b6dff);
    box-shadow: 0 8px 22px rgba(42, 155, 255, .22);
}
html.dark-glass-ui .provider-card small,
html.dark-glass-ui .toggle-card small,
html.dark-glass-ui .checkbox-card small,
html.dark-glass-ui .choice-card small,
html.dark-glass-ui .selection-card span { color: var(--ink-muted); }
html.dark-glass-ui .access-list {
    border-color: var(--line);
    background: rgba(5, 17, 33, .27);
}
html.dark-glass-ui .media-manager-footer,
html.dark-glass-ui .media-empty-row { border-color: var(--line); }
html.dark-glass-ui audio { color-scheme: dark; }

/* Public discovery */
html.dark-glass-ui .hero-visual {
    border: 1px solid var(--line);
    background:
        radial-gradient(circle at 18% 10%, rgba(66, 207, 255, .20), transparent 50%),
        linear-gradient(145deg, rgba(24, 57, 94, .76), rgba(27, 27, 85, .70));
    box-shadow: var(--shadow-md);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}
html.dark-glass-ui .hero-visual-inner {
    border: 1px solid rgba(141, 222, 255, .20);
    background: linear-gradient(145deg, #0c396c, #1769bb 48%, #5149c7);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 22px 58px rgba(0, 0, 0, .24);
}
html.dark-glass-ui .podcast-art {
    box-shadow: 0 28px 68px rgba(0, 0, 0, .34), 0 0 50px rgba(62, 191, 255, .07);
}
html.dark-glass-ui .import-artwork {
    border: 1px solid rgba(126, 217, 255, .18);
    background: linear-gradient(145deg, #0c396c, #236bba 48%, #544ec6);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
}

/* Authentication and setup */
html.dark-glass-ui .auth-wrap { position: relative; }
html.dark-glass-ui .auth-card {
    border-color: rgba(141, 203, 245, .19);
    background:
        radial-gradient(circle at 0 0, rgba(66, 201, 255, .12), transparent 18rem),
        linear-gradient(145deg, rgba(21, 43, 72, .82), rgba(6, 18, 35, .86));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        0 34px 90px rgba(0, 0, 0, .38);
}
html.dark-glass-ui .auth-card > p,
html.dark-glass-ui .auth-footer { color: var(--ink-soft); }
html.dark-glass-ui .setup-step {
    border-color: var(--line);
    background: rgba(9, 25, 45, .54);
}
html.dark-glass-ui .setup-step::before {
    color: #fff;
    background: linear-gradient(145deg, #24c8ff, #4a6fff);
    box-shadow: 0 6px 18px rgba(43, 152, 255, .24);
}
html.dark-glass-ui .setup-step span { color: var(--ink-soft); }
html.dark-glass-ui .code-block {
    color: #dff4ff;
    border: 1px solid rgba(134, 201, 245, .14);
    background: rgba(2, 9, 18, .82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}
html.dark-glass-ui .token-box {
    border-color: rgba(90, 201, 255, .26);
    background: rgba(32, 112, 170, .15);
}

/* Settings */
html.dark-glass-ui .settings-tab {
    color: var(--ink);
    border-color: var(--line);
}
html.dark-glass-ui .settings-tab:hover {
    color: #fff;
    border-color: rgba(91, 207, 255, .32);
    background: linear-gradient(145deg, rgba(27, 65, 102, .72), rgba(13, 30, 55, .78));
}
html.dark-glass-ui .settings-tab.active {
    color: #fff;
    border-color: rgba(103, 220, 255, .44);
    background: linear-gradient(145deg, rgba(28, 111, 161, .32), rgba(65, 70, 154, .24));
    box-shadow: inset 0 0 0 1px rgba(82, 207, 255, .06), 0 16px 40px rgba(0, 0, 0, .16);
}
html.dark-glass-ui .settings-tab span { color: var(--ink-muted); }
html.dark-glass-ui .config-priority-row > span {
    color: #87e7ff;
    border: 1px solid rgba(92, 207, 255, .17);
    background: rgba(55, 175, 229, .13);
}
html.dark-glass-ui .settings-savebar {
    border-color: rgba(117, 198, 245, .22);
    background: rgba(8, 22, 40, .87);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 22px 58px rgba(0, 0, 0, .34);
    -webkit-backdrop-filter: blur(22px) saturate(1.15);
    backdrop-filter: blur(22px) saturate(1.15);
}
html.dark-glass-ui .settings-savebar span { color: var(--ink-muted); }

/* Pagination and progress */
html.dark-glass-ui .pagination { border-color: var(--line); }
html.dark-glass-ui .pagination-link {
    color: var(--ink-soft);
    border-color: var(--line);
    background: rgba(10, 27, 48, .64);
}
html.dark-glass-ui .pagination-link:hover {
    color: #fff;
    border-color: rgba(103, 213, 255, .31);
    background: rgba(36, 80, 119, .55);
}
html.dark-glass-ui .pagination-link.active {
    color: #fff;
    border-color: rgba(115, 226, 255, .33);
    background: linear-gradient(145deg, #20bdf6, #4c69ef);
    box-shadow: 0 7px 19px rgba(42, 147, 244, .22);
}
html.dark-glass-ui progress {
    overflow: hidden;
    border: 1px solid rgba(139, 196, 235, .12);
    border-radius: 999px;
    background: rgba(2, 10, 20, .62);
    accent-color: #42c8ff;
}
html.dark-glass-ui progress::-webkit-progress-bar { background: rgba(2, 10, 20, .62); }
html.dark-glass-ui progress::-webkit-progress-value { background: linear-gradient(90deg, #2bd0ff, #4d73ff, #715cff); }
html.dark-glass-ui progress::-moz-progress-bar { background: linear-gradient(90deg, #2bd0ff, #4d73ff, #715cff); }

/* System health */
html.dark-glass-ui .check-icon,
html.dark-glass-ui .status-dot { box-shadow: 0 0 20px currentColor; }
html.dark-glass-ui .check-icon.ok { color: #051b13; background: #5ee2ad; }
html.dark-glass-ui .check-icon.bad { color: #2a0710; background: #ff8299; }
html.dark-glass-ui .status-dot.ok { background: #64e4b1; }
html.dark-glass-ui .status-dot:not(.ok) { background: #ff8198; }

/* FAST-derived LPM player: align its frame with the global shell. */
html.dark-glass-ui .lpa-shell {
    border-color: rgba(140, 209, 247, .18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .055),
        0 42px 110px rgba(0, 0, 0, .42),
        0 0 70px rgba(45, 166, 255, .07);
}

/* Mobile */
@media (max-width: 860px) {
    html.dark-glass-ui .sidebar { box-shadow: 22px 0 70px rgba(0, 0, 0, .48); }
}

@media (max-width: 640px) {
    html.dark-glass-ui .site-header-inner { gap: 12px; }
    html.dark-glass-ui .site-nav { gap: 3px; }
    html.dark-glass-ui .site-nav > a { padding-right: 8px; padding-left: 8px; }
    html.dark-glass-ui .surface,
    html.dark-glass-ui .stat-card,
    html.dark-glass-ui .auth-card,
    html.dark-glass-ui .show-card { border-radius: 14px; }
}

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


/* 0.4.1 live imports and show editor */
html.dark-glass-ui .show-editor-artwork-preview {
    border-color: rgba(126, 205, 248, .20);
    background: linear-gradient(145deg, rgba(17, 43, 72, .88), rgba(6, 18, 35, .88));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 54px rgba(0,0,0,.22);
}
html.dark-glass-ui .import-live-note[data-state="live"]::before,
html.dark-glass-ui .import-live-note[data-state="complete"]::before { box-shadow: 0 0 12px rgba(94, 226, 173, .55); }
html.dark-glass-ui .import-live-note[data-state="warning"]::before { box-shadow: 0 0 12px rgba(255, 195, 89, .48); }
html.dark-glass-ui .import-live-note[data-state="error"]::before { box-shadow: 0 0 12px rgba(255, 103, 131, .50); }

/* 0.4.3 user management polish */
html.dark-glass-ui .user-detail-avatar {
    color: #fff;
    border-color: rgba(110, 220, 255, .26);
    background:
        radial-gradient(circle at 25% 15%, rgba(120, 229, 255, .28), transparent 48%),
        linear-gradient(145deg, rgba(26, 135, 202, .76), rgba(76, 72, 200, .72));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 14px 34px rgba(0, 0, 0, .22), 0 0 30px rgba(60, 192, 255, .10);
}

html.dark-glass-ui .user-status-note,
html.dark-glass-ui .user-activity-item,
html.dark-glass-ui .user-empty-access,
html.dark-glass-ui .user-access-editor {
    border-color: var(--line);
    background: rgba(6, 20, 38, .46);
}

html.dark-glass-ui .user-role-card {
    transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease;
}

html.dark-glass-ui .user-role-card:has(input:checked) {
    border-color: rgba(86, 218, 255, .40);
    background: linear-gradient(145deg, rgba(27, 109, 159, .31), rgba(67, 67, 157, .23));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 12px 30px rgba(0, 0, 0, .13), 0 0 26px rgba(54, 192, 255, .06);
}

html.dark-glass-ui .user-role-card:hover {
    transform: translateY(-1px);
}

html.dark-glass-ui .user-activity-item {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}

/* 0.5.0 relational access model */
html.dark-glass-ui .access-level-pill,
html.dark-glass-ui .effective-access-facts span,
html.dark-glass-ui .access-choice-card,
html.dark-glass-ui .access-scope-panel,
html.dark-glass-ui .modern-access-row,
html.dark-glass-ui .modern-access-editor,
html.dark-glass-ui .access-editor-role,
html.dark-glass-ui .user-empty-access {
    border-color: rgba(125, 200, 244, .16);
    background: rgba(7, 23, 42, .58);
}
html.dark-glass-ui .access-level-pill { box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
html.dark-glass-ui .access-level-pill.access-super {
    color: #f1eaff;
    border-color: rgba(154, 130, 255, .34);
    background: linear-gradient(145deg, rgba(91, 75, 211, .28), rgba(39, 108, 173, .22));
}
html.dark-glass-ui .access-level-pill.access-organization {
    color: #c8f5ff;
    border-color: rgba(84, 211, 255, .31);
    background: rgba(27, 145, 191, .18);
}
html.dark-glass-ui .access-level-pill.access-manager {
    color: #d4e4ff;
    border-color: rgba(98, 155, 255, .28);
    background: rgba(44, 88, 184, .19);
}
html.dark-glass-ui .access-level-pill.access-creator {
    color: #d8f8ef;
    border-color: rgba(94, 223, 174, .25);
    background: rgba(34, 143, 108, .17);
}
html.dark-glass-ui .access-level-pill.access-user { color: var(--ink-soft); }
html.dark-glass-ui .access-choice-card:hover {
    border-color: rgba(89, 210, 255, .31);
    background: rgba(11, 35, 62, .75);
}
html.dark-glass-ui .access-choice-indicator {
    border-color: rgba(145, 194, 230, .38);
    background: rgba(2, 12, 24, .82);
}
html.dark-glass-ui .access-choice-card input:checked + .access-choice-indicator { border-color: #52d8ff; }
html.dark-glass-ui .access-choice-card input:checked + .access-choice-indicator::after { background: linear-gradient(145deg, #31d2ff, #6c58ff); box-shadow: 0 0 14px rgba(71, 202, 255, .52); }
html.dark-glass-ui .access-choice-card:has(input:checked) {
    border-color: rgba(86, 218, 255, .42);
    background: linear-gradient(145deg, rgba(21, 108, 158, .30), rgba(77, 65, 164, .24));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 42px rgba(0,0,0,.18), 0 0 30px rgba(51, 193, 255, .06);
}
html.dark-glass-ui .managed-user-avatar {
    border-color: rgba(104, 220, 255, .26);
    background: radial-gradient(circle at 25% 15%, rgba(121, 230, 255, .30), transparent 45%), linear-gradient(145deg, #168fc7, #6853dc);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 42px rgba(0,0,0,.29), 0 0 35px rgba(49, 191, 255, .10);
}
html.dark-glass-ui .effective-access-card {
    border-color: rgba(114, 203, 250, .20);
    background: linear-gradient(145deg, rgba(12, 38, 65, .84), rgba(9, 23, 45, .80));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 22px 55px rgba(0,0,0,.20);
}
html.dark-glass-ui .effective-access-card.is-super {
    border-color: rgba(145, 124, 255, .30);
    background: radial-gradient(circle at 92% 0%, rgba(103, 73, 215, .22), transparent 44%), linear-gradient(145deg, rgba(22, 45, 80, .88), rgba(14, 20, 48, .86));
}
html.dark-glass-ui .effective-access-icon,
html.dark-glass-ui .modern-access-mark {
    color: #72e4ff;
    border-color: rgba(99, 218, 255, .25);
    background: linear-gradient(145deg, rgba(21, 111, 162, .28), rgba(62, 65, 154, .20));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
html.dark-glass-ui .super-admin-governance-card {
    border-color: rgba(145, 124, 255, .22);
}
html.dark-glass-ui .modern-access-row:hover { border-color: rgba(96, 209, 255, .26); background: rgba(11, 35, 61, .72); }
html.dark-glass-ui .access-editor-role { background: rgba(2, 13, 26, .70); }
html.dark-glass-ui .user-create-save-bar {
    border-color: rgba(117, 198, 245, .22);
    background: rgba(7, 20, 38, .89);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 24px 64px rgba(0,0,0,.38);
    -webkit-backdrop-filter: blur(22px) saturate(1.15);
    backdrop-filter: blur(22px) saturate(1.15);
}

/* 0.5.0 listener account and relational assignment surfaces */
html.dark-glass-ui .user-account-top-grid .effective-access-card,
html.dark-glass-ui .access-assignment-row,
html.dark-glass-ui .access-assignment-form,
html.dark-glass-ui .access-fixed-role,
html.dark-glass-ui .user-readonly-identity > div,
html.dark-glass-ui .access-policy-note,
html.dark-glass-ui .effective-access-summary > div,
html.dark-glass-ui .account-section-nav,
html.dark-glass-ui .listener-history-row,
html.dark-glass-ui .listener-history-art,
html.dark-glass-ui .listener-history-progress {
    border-color: rgba(125, 200, 244, .16);
    background: rgba(7, 23, 42, .58);
}

html.dark-glass-ui .user-account-top-grid .effective-access-card.is-super-admin {
    border-color: rgba(145, 124, 255, .30);
    background:
        radial-gradient(circle at 92% 0%, rgba(103, 73, 215, .20), transparent 44%),
        linear-gradient(145deg, rgba(15, 42, 72, .88), rgba(12, 21, 48, .87));
}

html.dark-glass-ui .access-icon,
html.dark-glass-ui .access-assignment-symbol {
    color: #72e4ff;
    border-color: rgba(99, 218, 255, .25);
    background: linear-gradient(145deg, rgba(21, 111, 162, .28), rgba(62, 65, 154, .20));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

html.dark-glass-ui .listener-account-avatar {
    border-color: rgba(104, 220, 255, .26);
    background:
        radial-gradient(circle at 25% 15%, rgba(121, 230, 255, .30), transparent 45%),
        linear-gradient(145deg, #168fc7, #6853dc);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 42px rgba(0,0,0,.29), 0 0 35px rgba(49,191,255,.10);
}

html.dark-glass-ui .account-section-nav {
    background: rgba(6, 18, 35, .78);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 18px 48px rgba(0,0,0,.24);
    -webkit-backdrop-filter: blur(20px) saturate(1.15);
    backdrop-filter: blur(20px) saturate(1.15);
}

html.dark-glass-ui .account-section-nav a:hover {
    background: linear-gradient(145deg, rgba(28, 120, 174, .26), rgba(73, 66, 164, .20));
}

html.dark-glass-ui .listener-history-row:hover,
html.dark-glass-ui .access-assignment-row:hover {
    border-color: rgba(96, 209, 255, .28);
    background: rgba(11, 35, 61, .73);
}

html.dark-glass-ui .listener-history-progress {
    background: rgba(2, 12, 24, .82);
}

html.dark-glass-ui .listener-history-progress span {
    box-shadow: 0 0 18px rgba(63, 194, 255, .25);
}


html.dark-glass-ui input[type="date"] { color-scheme: dark; min-height: 48px; color: #f5f9ff; background: rgba(3, 13, 27, .67); }
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit,
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit-fields-wrapper,
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit-text,
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit-month-field,
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit-day-field,
html.dark-glass-ui input[type="date"]::-webkit-datetime-edit-year-field { color: #f5f9ff; }


/* 0.7.13 larger creator artwork previews */
html.dark-glass-ui .artwork-editor-preview {
    border-color: rgba(126, 205, 248, .20);
    background: linear-gradient(145deg, rgba(17, 43, 72, .88), rgba(6, 18, 35, .88));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 24px 58px rgba(0,0,0,.24), 0 0 36px rgba(52,183,247,.06);
}

html.dark-glass-ui .artwork-selection {
    border-color: rgba(153, 191, 230, .12);
    background: rgba(8, 21, 39, .42);
}
