:root {
    --fm-bg: #0b0d12;
    --fm-bg-soft: #11151d;
    --fm-surface: #151a23;
    --fm-surface-2: #1b212c;
    --fm-card: #151a23;
    --fm-card-2: #1b212c;
    --fm-border: rgba(255, 255, 255, 0.10);
    --fm-border-strong: rgba(255, 255, 255, 0.16);
    --fm-border-red: rgba(229, 9, 20, 0.35);
    --fm-text: #f8fafc;
    --fm-muted: #a8b0bd;
    --fm-red: #e50914;
    --fm-red-dark: #aa0c14;
    --fm-red-2: #ff3440;
    --fm-red-soft: rgba(229, 9, 20, 0.14);
    --fm-green: #16a34a;
    --fm-yellow: #d97706;
    --fm-glow: 0 18px 55px rgba(229, 9, 20, 0.14), 0 12px 30px rgba(0, 0, 0, 0.28);
    --fm-radius: 18px;
}

body:not(.login-page):not(.register-page) {
    background:
        radial-gradient(circle at top right, rgba(229, 9, 20, 0.13), transparent 30rem),
        linear-gradient(180deg, #0d1118 0%, #0b0d12 100%);
}

.fm-help {
    font-size: 0.92rem;
    line-height: 1.45;
}

.content-wrapper {
    background:
        radial-gradient(circle at top right, rgba(229, 9, 20, 0.10), transparent 34rem),
        linear-gradient(180deg, #11151d 0%, #0b0d12 100%) !important;
    color: var(--fm-text);
    min-height: calc(100vh - 57px);
}

.fm-target-tree {
    margin-top: 0.5rem;
}

.main-header.navbar {
    background: rgba(11, 13, 18, 0.92) !important;
    border-bottom: 1px solid var(--fm-border) !important;
    backdrop-filter: blur(12px);
}

.main-header .nav-link,
.main-header .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.82) !important;
}

.main-header .nav-link:hover {
    color: #fff !important;
}

.main-sidebar {
    background: linear-gradient(180deg, #090b10 0%, #11151d 100%) !important;
    box-shadow: 18px 0 60px rgba(0, 0, 0, 0.25) !important;
}

.brand-link {
    border-bottom: 1px solid var(--fm-border) !important;
    color: #fff !important;
}

.brand-link .brand-image {
    box-shadow: 0 0 24px rgba(229, 9, 20, 0.28) !important;
}

.nav-sidebar .nav-link {
    border-radius: 14px !important;
    margin: 0.12rem 0.55rem;
    color: rgba(255, 255, 255, 0.74) !important;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.nav-sidebar .nav-link:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    color: #fff !important;
    transform: translateX(2px);
}

.nav-sidebar .nav-link.active,
.nav-sidebar .nav-link[style*="background"] {
    background: linear-gradient(135deg, var(--fm-red), #9d0b12) !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(229, 9, 20, 0.24);
}

.nav-sidebar .nav-icon {
    color: rgba(255, 255, 255, 0.72) !important;
}

.nav-sidebar .nav-link.active .nav-icon,
.nav-sidebar .nav-link[style*="background"] .nav-icon,
.nav-sidebar .nav-link:hover .nav-icon {
    color: #fff !important;
}

.form-control-sidebar,
.btn-sidebar {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: var(--fm-border) !important;
    color: #fff !important;
}

.main-footer {
    background: #0b0d12 !important;
    border-top: 1px solid var(--fm-border) !important;
    color: var(--fm-muted) !important;
}

.main-footer a {
    color: #fff !important;
}

.content .container,
.content .container-fluid {
    padding-top: 1.25rem;
    padding-bottom: 2rem;
}

.fm-card,
.content-wrapper .card {
    background: rgba(21, 26, 35, 0.92) !important;
    color: var(--fm-text);
    border: 1px solid var(--fm-border) !important;
    border-radius: var(--fm-radius) !important;
    box-shadow: var(--fm-glow);
    overflow: hidden;
}

.fm-card .card-header,
.content-wrapper .card .card-header {
    background: rgba(255, 255, 255, 0.04) !important;
    border-bottom: 1px solid var(--fm-border) !important;
    color: #fff !important;
}

.content-wrapper .card .card-body {
    color: var(--fm-text);
}

.fm-section-title,
.content-wrapper h1,
.content-wrapper h2,
.content-wrapper h3 {
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.fm-section-title::after {
    content: "";
    display: block;
    width: 64px;
    height: 3px;
    margin-top: 0.55rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--fm-red), transparent);
}

.fm-help,
.fm-empty-state,
.content-wrapper .alert-info {
    background: linear-gradient(135deg, rgba(229, 9, 20, 0.14), rgba(255, 255, 255, 0.05)) !important;
    border: 1px solid rgba(229, 9, 20, 0.30) !important;
    border-radius: 16px !important;
    color: rgba(255, 255, 255, 0.88) !important;
    padding: 0.85rem 1rem;
}

.fm-empty-state {
    text-align: center;
    color: var(--fm-muted) !important;
}

.fm-primary-action,
.btn-primary,
.btn-success {
    background: linear-gradient(135deg, var(--fm-red), #aa0c14) !important;
    border-color: var(--fm-red) !important;
    color: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 28px rgba(229, 9, 20, 0.22);
}

.fm-primary-action:hover,
.btn-primary:hover,
.btn-success:hover {
    background: linear-gradient(135deg, var(--fm-red-2), var(--fm-red)) !important;
    border-color: var(--fm-red-2) !important;
}

.fm-danger-action,
.btn-danger {
    border-radius: 12px !important;
    box-shadow: 0 12px 28px rgba(220, 53, 69, 0.20);
}

.btn-secondary,
.btn-outline-secondary {
    border-radius: 12px !important;
}

.content-wrapper .form-control,
.content-wrapper .form-select,
.content-wrapper .se-input,
.content-wrapper .se-select {
    background-color: rgba(255, 255, 255, 0.06) !important;
    border-color: var(--fm-border-strong) !important;
    color: #fff !important;
    border-radius: 12px !important;
}

.content-wrapper .form-control:focus,
.content-wrapper .form-select:focus,
.content-wrapper .se-input:focus,
.content-wrapper .se-select:focus {
    border-color: var(--fm-red) !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 9, 20, 0.16) !important;
}

.content-wrapper .form-control::placeholder,
.content-wrapper .se-input::placeholder {
    color: rgba(255, 255, 255, 0.46) !important;
}

.content-wrapper label,
.content-wrapper .form-label,
.content-wrapper .form-check-label {
    color: rgba(255, 255, 255, 0.86);
}

.content-wrapper .text-muted {
    color: var(--fm-muted) !important;
}

.fm-target-tree,
.tree-container {
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid var(--fm-border);
    border-radius: 16px;
    padding: 1rem;
}

.fm-target-tree ul,
.tree-container ul {
    color: rgba(255, 255, 255, 0.86);
}

.tree-check {
    accent-color: var(--fm-red);
}

.tree-branch-header {
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid var(--fm-border);
    border-radius: 14px;
    padding: 0.55rem 0.75rem;
}

.tree-branch-actions .btn {
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.78) !important;
}

.mode-card-option,
.pm-card,
.pm-ad-card,
.pm-prog-card {
    border-radius: 18px !important;
    border: 1px solid var(--fm-border) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.22);
}

.mode-card-option {
    background: rgba(255, 255, 255, 0.045) !important;
    color: #fff;
}

.mode-card-option .mode-desc {
    color: var(--fm-muted) !important;
}

.mode-card-wrapper:hover .mode-card-option,
.mode-card-wrapper.active .mode-card-option {
    background: var(--fm-red-soft) !important;
}

.tree-check:checked,
.tree-check:indeterminate {
    background-color: var(--fm-red) !important;
    border-color: var(--fm-red) !important;
}

.mode-card-wrapper input:checked + .mode-card-option {
    border-color: rgba(229, 9, 20, 0.55) !important;
    box-shadow: 0 0 0 1px rgba(229, 9, 20, 0.32), 0 18px 46px rgba(229, 9, 20, 0.16);
}

.breadcrumb,
.breadcrumb a {
    color: var(--fm-muted) !important;
}

.breadcrumb .active {
    color: #fff !important;
}

/* Standalone player polish */
body.fm-player-page,
body:has(.pm-container) {
    background:
        radial-gradient(circle at top right, rgba(229, 9, 20, 0.16), transparent 26rem),
        linear-gradient(180deg, #10141c 0%, #080a0f 100%) !important;
    color: var(--fm-text) !important;
}

.pm-header {
    background: rgba(8, 10, 15, 0.90) !important;
    border-bottom: 1px solid var(--fm-border) !important;
    color: #fff !important;
    backdrop-filter: blur(12px);
}

.pm-logo-dot,
.pm-progress-fill {
    background: var(--fm-red) !important;
    box-shadow: 0 0 18px rgba(229, 9, 20, 0.45);
}

.pm-card {
    background: rgba(21, 26, 35, 0.92) !important;
    color: #fff !important;
}

.pm-section-label,
.pm-ad-meta,
.pm-countdown,
.pm-target-meta,
.pm-empty {
    color: var(--fm-muted) !important;
}

.pm-next-ad,
.pm-chip,
.pm-target-search,
.pm-collapse-btn {
    background: rgba(255, 255, 255, 0.055) !important;
    color: #fff !important;
    border-color: var(--fm-border) !important;
}

.pm-btn-start {
    background: linear-gradient(135deg, var(--fm-red), #aa0c14) !important;
    border-color: var(--fm-red) !important;
    color: #fff !important;
}

.pm-btn-stop {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.24) !important;
    color: #fff !important;
}

.pm-target-branch-row:hover,
.pm-target-device-row:hover,
.pm-target-branch-row.pm-target-selected,
.pm-target-device-row.pm-target-selected,
.pm-selected-target {
    background: var(--fm-red-soft) !important;
    border-color: rgba(229, 9, 20, 0.42) !important;
    color: #fff !important;
}

@supports not selector(:has(*)) {
    body.fm-player-page {
        background: linear-gradient(180deg, #10141c 0%, #080a0f 100%) !important;
        color: var(--fm-text) !important;
    }
}

/* ???????????????????????????????????????????????????????????????
   Account pages (login / register / forgot / recover)
??????????????????????????????????????????????????????????????? */
body.fm-account-page {
    background:
        radial-gradient(circle at 70% 20%, rgba(229, 9, 20, 0.18), transparent 36rem),
        linear-gradient(180deg, #080a0f 0%, #0b0d12 100%);
    min-height: 100vh;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--fm-text);
}

.fm-account-card {
    background: rgba(15, 19, 28, 0.96);
    border: 1px solid rgba(229, 9, 20, 0.22);
    border-radius: 22px;
    box-shadow: 0 28px 70px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.05);
    width: 100%;
    max-width: 390px;
    padding: 1.75rem 1.75rem 1.5rem;
}

.fm-account-logo {
    display: block;
    margin: 0 auto 1rem;
    max-width: 150px;
    height: auto;
    filter: drop-shadow(0 0 18px rgba(229,9,20,0.30));
}

.fm-account-subtitle {
    text-align: center;
    color: var(--fm-muted);
    font-size: 0.97rem;
    margin-bottom: 1.15rem;
}

.fm-account-card .form-control {
    background: rgba(255, 255, 255, 0.07) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #fff !important;
    border-radius: 12px !important;
}

.fm-account-card .form-control:focus {
    border-color: var(--fm-red) !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 9, 20, 0.18) !important;
}

.fm-account-card .form-control::placeholder {
    color: rgba(255,255,255,0.38) !important;
}

.fm-account-card .input-group-text {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid rgba(255,255,255,0.14) !important;
    color: rgba(255,255,255,0.55) !important;
    border-radius: 0 12px 12px 0 !important;
}

.fm-account-card .btn-fm-primary {
    width: 100%;
    background: linear-gradient(135deg, var(--fm-red), #aa0c14) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 12px !important;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 0.65rem 1.2rem;
    box-shadow: 0 10px 26px rgba(229,9,20,0.25);
    transition: background 0.18s ease, box-shadow 0.18s ease;
}

.fm-account-card .btn-fm-primary:hover {
    background: linear-gradient(135deg, var(--fm-red-2), var(--fm-red)) !important;
    box-shadow: 0 14px 34px rgba(229,9,20,0.32);
}

.fm-account-card .btn-fm-social {
    width: 100%;
    border-radius: 12px !important;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.16) !important;
    background: rgba(255,255,255,0.06) !important;
    color: #fff !important;
    padding: 0.68rem 1rem;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    line-height: 1.2;
}

.fm-account-card .btn-fm-social:hover {
    background: rgba(255,255,255,0.12) !important;
}

.fm-account-card .btn-fm-social:focus-visible {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.16), 0 0 0 0.35rem rgba(229, 9, 20, 0.18);
}

.fm-account-card .btn-fm-google {
    background: #ffffff !important;
    border-color: #dadce0 !important;
    color: #3c4043 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16);
}

.fm-account-card .btn-fm-google:hover {
    background: #f8fafd !important;
    border-color: #d2e3fc !important;
    color: #202124 !important;
    box-shadow: 0 2px 6px rgba(66, 133, 244, 0.18);
}

.fm-google-icon,
.fm-facebook-icon {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 20px;
}

.fm-google-icon svg {
    width: 18px;
    height: 18px;
    display: block;
}

.fm-account-card .btn-fm-facebook {
    background: #1877f2 !important;
    border-color: #1877f2 !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(24, 119, 242, 0.18);
}

.fm-account-card .btn-fm-facebook:hover {
    background: #166fe5 !important;
    border-color: #166fe5 !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(24, 119, 242, 0.24);
}

.fm-facebook-icon {
    border-radius: 999px;
    background: #fff;
    color: #1877f2;
    font-size: 0.78rem;
}

.fm-account-card label {
    color: rgba(255,255,255,0.78);
    font-size: 0.88rem;
}

.fm-account-card a {
    color: var(--fm-red-2);
    text-decoration: none;
}

.fm-account-card a:hover {
    color: #fff;
    text-decoration: underline;
}

.fm-account-footer {
    text-align: center;
    color: rgba(255,255,255,0.25);
    font-size: 0.78rem;
    padding: 0.85rem 0 0;
}

.fm-account-footer a {
    color: rgba(255,255,255,0.35);
}

/* ???????????????????????????????????????????????????????????????
   Dark-mode contrast fixes (tables, badges, alerts, disabled)
??????????????????????????????????????????????????????????????? */

/* Tables inside dark content wrapper */
.fm-table-wrap,
.content-wrapper .table-responsive {
    background: rgba(12, 17, 24, 0.72);
    border: 1px solid var(--fm-border);
    border-radius: 16px;
    overflow: hidden;
}

.fm-table,
.content-wrapper .table,
body > .container .table,
body > .container-fluid .table {
    --bs-table-bg: #111820;
    --bs-table-color: #f3f6fb;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.035);
    --bs-table-striped-color: #f3f6fb;
    --bs-table-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-table-hover-color: #fff;
    color: #f3f6fb !important;
    background-color: #111820 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    margin-bottom: 0;
}

.fm-table thead th,
.content-wrapper .table thead th,
.content-wrapper .table-light thead th,
body > .container .table thead th,
body > .container-fluid .table thead th {
    background: #202833 !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    font-weight: 700;
}

.fm-table td,
.fm-table th,
.content-wrapper .table td,
.content-wrapper .table th,
body > .container .table td,
body > .container .table th,
body > .container-fluid .table td,
body > .container-fluid .table th {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #f3f6fb !important;
    vertical-align: middle;
}

.fm-table tbody tr,
.content-wrapper .table tbody tr,
body > .container .table tbody tr,
body > .container-fluid .table tbody tr {
    background-color: #111820 !important;
}

.fm-table.table-striped tbody tr:nth-of-type(odd),
.content-wrapper .table-striped tbody tr:nth-of-type(odd),
body > .container .table-striped tbody tr:nth-of-type(odd),
body > .container-fluid .table-striped tbody tr:nth-of-type(odd) {
    background-color: #151c26 !important;
}

.content-wrapper .table a:not(.btn),
body > .container .table a:not(.btn),
body > .container-fluid .table a:not(.btn) {
    color: #ff8a8f !important;
}

.content-wrapper .list-group-item,
body > .container .list-group-item,
body > .container-fluid .list-group-item {
    background: rgba(255, 255, 255, 0.035) !important;
    border-color: var(--fm-border) !important;
    color: #f3f6fb !important;
}

.content-wrapper .modal-content,
body > .container .modal-content,
body > .container-fluid .modal-content {
    background: #151c26 !important;
    color: #f3f6fb !important;
    border: 1px solid var(--fm-border) !important;
    border-radius: 18px !important;
}

.content-wrapper .modal-header,
.content-wrapper .modal-footer,
body > .container .modal-header,
body > .container .modal-footer,
body > .container-fluid .modal-header,
body > .container-fluid .modal-footer {
    border-color: var(--fm-border) !important;
}

.content-wrapper .dropzone,
body > .container .dropzone,
body > .container-fluid .dropzone {
    background: linear-gradient(135deg, rgba(229, 9, 20, 0.10), rgba(255, 255, 255, 0.04)) !important;
    border: 1px dashed rgba(229, 9, 20, 0.42) !important;
    color: #f3f6fb !important;
    border-radius: 18px !important;
}

.content-wrapper .dropzone .text-muted,
body > .container .dropzone .text-muted,
body > .container-fluid .dropzone .text-muted {
    color: #c6ccd6 !important;
}

/* Status badges for Active/Inactive */
.badge.badge-success, .badge.text-bg-success { background-color: #16a34a !important; color: #fff !important; }
.badge.badge-secondary, .badge.text-bg-secondary { background-color: rgba(255,255,255,0.16) !important; color: rgba(255,255,255,0.72) !important; }
.badge.badge-danger, .badge.text-bg-danger { background-color: #dc2626 !important; color: #fff !important; }
.badge.badge-warning, .badge.text-bg-warning { background-color: #d97706 !important; color: #fff !important; }
.badge.text-bg-primary { background-color: #2563eb !important; color: #fff !important; }
.badge.text-bg-light { background-color: rgba(255,255,255,0.12) !important; color: rgba(255,255,255,0.86) !important; border-color: rgba(255,255,255,0.18) !important; }

/* Alert contrast in dark pages */
.content-wrapper .alert-warning,
body > .container .alert-warning {
    background: rgba(217,119,6,0.18) !important;
    border-color: rgba(217,119,6,0.45) !important;
    color: #fcd34d !important;
}

.content-wrapper .alert-danger,
body > .container .alert-danger {
    background: rgba(220,38,38,0.18) !important;
    border-color: rgba(220,38,38,0.45) !important;
    color: #fca5a5 !important;
}

.content-wrapper .alert-success,
body > .container .alert-success {
    background: rgba(22,163,74,0.18) !important;
    border-color: rgba(22,163,74,0.45) !important;
    color: #86efac !important;
}

/* Disabled buttons — legible but clearly disabled */
.btn:disabled,
.btn.disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
}

/* Links in dark context */
.content-wrapper a:not(.btn):not(.nav-link):not(.brand-link):not(.dropdown-item) {
    color: #f87171;
}
.content-wrapper a:not(.btn):not(.nav-link):not(.brand-link):not(.dropdown-item):hover {
    color: #fff;
}

/* Card headers that have Bootstrap bg-light — override for dark mode */
.content-wrapper .card-header.bg-light,
body > .container .card-header.bg-light {
    background: rgba(255,255,255,0.06) !important;
    color: rgba(255,255,255,0.90) !important;
    border-bottom: 1px solid var(--fm-border) !important;
}

/* Toastr positioning — keep away from sidebar */
#toast-container {
    margin-left: 260px;
}

@media (max-width: 768px) {
    #toast-container {
        margin-left: 0;
    }
}

/* Plain body pages (Branch Index, Devices Index) that use <body> outside content-wrapper */
body > .container h2,
body > .container h3 {
    color: #fff;
    font-weight: 700;
}

body > .container .card {
    background: rgba(15, 19, 28, 0.96) !important;
    border: 1px solid var(--fm-border) !important;
    border-radius: var(--fm-radius) !important;
    color: var(--fm-text) !important;
}

body > .container .card-header {
    background: rgba(255,255,255,0.05) !important;
    border-bottom: 1px solid var(--fm-border) !important;
    color: rgba(255,255,255,0.90) !important;
}

body > .container .btn-success.create-button {
    background: linear-gradient(135deg, var(--fm-red), #aa0c14) !important;
    border-color: var(--fm-red) !important;
}

/* inactive row in dark table */
.content-wrapper tr.inactive-row,
body > .container tr.inactive-row {
    background-color: rgba(255,255,255,0.02) !important;
    color: rgba(255,255,255,0.35) !important;
}

/* Muted text in dark — bump up contrast */
.content-wrapper .text-muted,
body > .container .text-muted {
    color: var(--fm-muted) !important;
}

/* ?? Action buttons – readable colors in dark pages ????????????????????? */
.content-wrapper .btn-warning,
body > .container .btn-warning,
body > .container-fluid .btn-warning {
    background: #b45309 !important;
    border-color: #92400e !important;
    color: #fff !important;
    border-radius: 12px !important;
}

.content-wrapper .btn-warning:hover,
body > .container .btn-warning:hover,
body > .container-fluid .btn-warning:hover {
    background: #92400e !important;
    color: #fff !important;
}

.content-wrapper .btn-secondary,
body > .container .btn-secondary,
body > .container-fluid .btn-secondary {
    background: rgba(255,255,255,0.10) !important;
    border: 1px solid rgba(255,255,255,0.30) !important;
    color: #f3f6fb !important;
    border-radius: 12px !important;
}

.content-wrapper .btn-secondary:hover,
body > .container .btn-secondary:hover,
body > .container-fluid .btn-secondary:hover {
    background: rgba(255,255,255,0.18) !important;
    color: #fff !important;
}

.content-wrapper .btn-info,
body > .container .btn-info {
    background: #0e7490 !important;
    border-color: #0c6278 !important;
    color: #fff !important;
    border-radius: 12px !important;
}

/* ?? Player page (fm-player-page) – dark overrides for pm-* elements ???? */
body.fm-player-page .pm-section-label {
    color: var(--fm-muted) !important;
    font-size: 10px;
    letter-spacing: 0.10em;
}

body.fm-player-page .pm-btn {
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255,255,255,0.22) !important;
    color: #fff !important;
}

body.fm-player-page .pm-btn-start {
    background: linear-gradient(135deg, var(--fm-red), var(--fm-red-dark)) !important;
    border-color: var(--fm-red) !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(229,9,20,0.28);
}

body.fm-player-page .pm-btn-start:hover {
    background: linear-gradient(135deg, var(--fm-red-2), var(--fm-red)) !important;
}

body.fm-player-page .pm-btn-stop:hover:not(:disabled) {
    background: rgba(255,255,255,0.14) !important;
}

body.fm-player-page .pm-next-ad {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--fm-border) !important;
    border-radius: 10px;
}

body.fm-player-page .pm-chip {
    background: rgba(255,255,255,0.07) !important;
    color: rgba(255,255,255,0.80) !important;
    border-color: rgba(255,255,255,0.14) !important;
}

body.fm-player-page .pm-target-search {
    background: rgba(255,255,255,0.06) !important;
    border-color: var(--fm-border-strong) !important;
    color: #fff !important;
}

body.fm-player-page .pm-target-search::placeholder {
    color: rgba(255,255,255,0.40) !important;
}

body.fm-player-page .pm-target-search:focus {
    border-color: var(--fm-red) !important;
    box-shadow: 0 0 0 2px rgba(229,9,20,0.16) !important;
}

body.fm-player-page .pm-target-branch-row,
body.fm-player-page .pm-target-device-row {
    color: rgba(255,255,255,0.86) !important;
}

body.fm-player-page .pm-target-branch-row:hover,
body.fm-player-page .pm-target-device-row:hover {
    background: rgba(255,255,255,0.07) !important;
}

body.fm-player-page .pm-target-badge {
    background: rgba(255,255,255,0.10) !important;
    color: rgba(255,255,255,0.72) !important;
}

body.fm-player-page .pm-target-meta {
    color: var(--fm-muted) !important;
}

body.fm-player-page .pm-target-icon {
    color: var(--fm-muted) !important;
}

body.fm-player-page .pm-target-icon--device {
    color: #60c8e8 !important;
}

body.fm-player-page .pm-progress-fill {
    background: var(--fm-red) !important;
}

body.fm-player-page .pm-icon-dot {
    background: rgba(229,9,20,0.16) !important;
}

body.fm-player-page .pm-icon-dot i {
    color: var(--fm-red-2) !important;
}

body.fm-player-page .pm-ad-card {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.09) !important;
    color: #f3f6fb !important;
}

body.fm-player-page .pm-ad-title,
body.fm-player-page .pm-prog-name {
    color: #fff !important;
}

body.fm-player-page .pm-ad-meta {
    color: var(--fm-muted) !important;
}

body.fm-player-page .pm-prog-card {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.09) !important;
    color: #f3f6fb !important;
}

body.fm-player-page .pm-badge-audio {
    background: rgba(24,95,165,0.28) !important;
    color: #93c5fd !important;
}

body.fm-player-page .pm-badge-visual {
    background: rgba(83,74,183,0.28) !important;
    color: #c4b5fd !important;
}

body.fm-player-page .pm-badge-sched {
    background: rgba(133,79,11,0.28) !important;
    color: #fcd34d !important;
}

body.fm-player-page .pm-alert-info {
    background: rgba(24,95,165,0.16) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(24,95,165,0.30) !important;
}

body.fm-player-page .pm-collapse-btn {
    background: rgba(255,255,255,0.07) !important;
    border-color: rgba(255,255,255,0.14) !important;
    color: rgba(255,255,255,0.72) !important;
}

body.fm-player-page .pm-collapse-text {
    color: rgba(255,255,255,0.80) !important;
}

body.fm-player-page .pm-next-label,
body.fm-player-page .pm-next-meta,
body.fm-player-page .pm-countdown {
    color: var(--fm-muted) !important;
}

body.fm-player-page .pm-next-title {
    color: #fff !important;
}

body.fm-player-page .pm-btn-playnow {
    border-color: var(--fm-red) !important;
    color: var(--fm-red-2) !important;
    background: transparent !important;
}

body.fm-player-page .pm-btn-playnow:hover {
    background: rgba(229,9,20,0.12) !important;
    color: #fff !important;
}

body.fm-player-page .pm-selected-target {
    background: var(--fm-red-soft) !important;
    color: #fff !important;
    border: 1px solid var(--fm-border-red) !important;
}

/* ?? Kiosk / fullscreen mode for PlayerWindow ?????????????????????????? */
body.kiosk-mode {
    width: 100vw;
    height: 100vh;
    margin: 0;
    overflow: hidden;
    background: #000 !important;
}

body.kiosk-mode .pw-panel {
    display: none !important;
}

body.kiosk-mode #visualContainer {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 1;
}

body.kiosk-mode #noProgrammingMessage {
    position: fixed !important;
    inset: 0 !important;
    z-index: 50;
}

/* ?? Scroll-to-top button — FuxionMix red ????????????????????????????? */
#scrollToTopBtn {
    background: rgba(17,24,36,0.92) !important;
    border-color: rgba(229,9,20,0.40) !important;
}

#scrollToTopBtn:hover {
    background: linear-gradient(135deg, var(--fm-red), var(--fm-red-dark)) !important;
    border-color: var(--fm-red) !important;
    box-shadow: 0 8px 20px rgba(229,9,20,0.28) !important;
}