/* FlatcastX Public UI V1 | 30.10.2026 | No database changes.
   Scope: html[data-fx-site-theme=dark] ONLY. Admin pages are not patched.
   Intentionally never recolor #fx-room, room artwork/canvases, image/video,
   custom DJ themes or the sound/mixer controls. */
:root { --fx-site-night-bg:#101b2b; --fx-site-night-top:#1c2c42; --fx-site-night-panel:#1e3048;
  --fx-site-night-card:#243c56; --fx-site-night-border:#39536f; --fx-site-night-text:#e7f0ff;
  --fx-site-night-muted:#a7bfdc; --fx-site-night-accent:#78baff; --fx-site-night-input:#15263b; }
html[data-fx-site-theme="dark"] {color-scheme:dark}
html[data-fx-site-theme="dark"] body{background-color:var(--fx-site-night-bg)!important;color:var(--fx-site-night-text)!important}
/* Main lobby and public guides. Existing light styling remains untouched. */
html[data-fx-site-theme="dark"] :is(.page,.wrapper,body>.container,body>.wrap,.reg-card,.fx-recovery-shell){background:var(--fx-site-night-top)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important;box-shadow:0 8px 28px #050c1a88!important}
html[data-fx-site-theme="dark"] :is(.layout,.content,.sidebar,.reg-body,.menu-content){border-color:var(--fx-site-night-border)!important;color:var(--fx-site-night-text)!important}
html[data-fx-site-theme="dark"] :is(.menu-block,.search-card,.reg-header,.fx-static-page-card,.fx-static-page-head,.fx-static-page-content,.fx-static-page-state,.fx-seo-intro,.fx-package-card,.fx-package-intro,.fx-package-features,.fx-order-card,.fx-order-panel,.fx-yayinal-card,.fx-yayinal-row,.fx-topic-grid>a,.feature,.note,.stat-box,.panel,.card,.box):not(#fx-room):not(#fx-dj-wrap):not(.mixer-window):not(#fx-room *){background:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important;box-shadow:none!important}
html[data-fx-site-theme="dark"] :is(.menu-title,.section-bar,.section-title,.menu-header,.top-banner,.reg-header,.fx-static-page-head,.fx-package-heading,.fx-package-header){background:var(--fx-site-night-card)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.stream-row,.radio-row,.radio-item,.radio-list-item,.yayin-row,.radio-table tr,.stream-side-cell,.fx-seo-topic-links a,.fx-order-field,.fx-package-feature,.fx-static-page-content blockquote){background:var(--fx-site-night-card)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.stream-row,.radio-row,.radio-table tr,.yayin-row):hover{background:#2c4968!important}
html[data-fx-site-theme="dark"] :is(.menu-content a,.auth-link,.stream-title,.stream-desc,.stream-link,.fx-seo-intro a,.fx-static-page-content a,.fx-topic-grid a,.footer-link a,.info-text,.stat-line,.fx-seo-intro p,.fx-topic-grid small,.fx-static-page-date,.fx-package-features li,.fx-package-card p,.fx-package-card li,.fx-last-member-line){color:var(--fx-site-night-muted)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.menu-content a:hover,.auth-link:hover,.stream-link:hover,.fx-seo-intro a:hover,.fx-static-page-content a:hover,.fx-topic-grid a:hover,.footer-link a:hover){color:var(--fx-site-night-accent)!important}
html[data-fx-site-theme="dark"] :is(h1,h2,h3,h4,h5,h6,.section-header,.fx-static-page-head h2,.fx-seo-intro h1,.feature b,.fx-topic-grid a){color:#bcdcff!important}
html[data-fx-site-theme="dark"] :is(p,li,dt,dd,small,label,td,th,.info-text,.fx-static-page-content,.fx-seo-intro,.fx-package-card){border-color:var(--fx-site-night-border)}
html[data-fx-site-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select,.login-input,.m-input,.search-row input,.fx-order-field input,.fx-order-field textarea){background:var(--fx-site-night-input)!important;color:var(--fx-site-night-text)!important;border-color:#517091!important}
html[data-fx-site-theme="dark"] :is(input,textarea)::placeholder{color:#94aecb!important;opacity:1}
html[data-fx-site-theme="dark"] :is(table,.radio-table,thead,tbody,td,th,tr){border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.radio-table th,thead th){background:var(--fx-site-night-card)!important;color:var(--fx-site-night-text)!important}
html[data-fx-site-theme="dark"] :is(.radio-table td,.sid-tag,.pass-box){background-color:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.modal-content,.popup-content,.dialog-content,.swal2-popup){background:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.modal-content h2,.modal-content h3,.swal2-title,.swal2-html-container){color:var(--fx-site-night-text)!important}
html[data-fx-site-theme="dark"] :is(.fx-static-page-content h1,.fx-static-page-content h2,.fx-static-page-content h3){color:#bcdcff!important}
html[data-fx-site-theme="dark"] :is(.hero,.top-hero){color:#fff}
html[data-fx-site-theme="dark"] .hero :is(h1,h2,h3,p){color:#fff!important}
/* Light inline fragments inside the main lobby, not user-created radio stage. */
html[data-fx-site-theme="dark"] .page :is([style*="background:#fff"],[style*="background: #fff"],[style*="background-color:#fff"],[style*="background-color: #fff"],[style*="background:#f8"],[style*="background: #f8"],[style*="background:#f4"],[style*="background: #f4"]):not(.top-hero):not(.hero){background:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important}
html[data-fx-site-theme="dark"] .page :is([style*="color:#111"],[style*="color: #111"],[style*="color:#333"],[style*="color: #333"],[style*="color:#004"],[style*="color:#005"]):not(.admin-link){color:var(--fx-site-night-text)!important}
html[data-fx-site-theme="dark"] .page :is(.search-card,.menu-block,.fx-order-status,.modal-content) *{border-color:var(--fx-site-night-border)}
html[data-fx-site-theme="dark"] a:focus-visible,html[data-fx-site-theme="dark"] button:focus-visible{outline:2px solid var(--fx-site-night-accent);outline-offset:2px}

/* Additional homepage modals, profile view, paging and support panels. */
html[data-fx-site-theme="dark"] :is(.ad-box,.profile-body,.profile-badge,.fx-inline-settings-box,.fx-packages-empty,.fx-yayinal-error,.fx-yayinal-back,.fx-recovery-step,#fx-support-home-notice){background:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.pagination a,.pagination span,.top-pagination a,.top-pagination span,.more-btn,.lang-select){background:var(--fx-site-night-card)!important;color:#c5e2ff!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.stream-count,.lang-select-label,.fx-package-discount,.profile-body p,.profile-body span){color:var(--fx-site-night-muted)!important}
html[data-fx-site-theme="dark"] :is(.fx-package-featured,.fx-package-card.featured){border-color:#78baff!important}

/* Root-level registration, guides and radio tools cards. Keep image-based radio
   skins, audio/mixer drawings and individualized theme canvases untouched. */
html[data-fx-site-theme="dark"] body>.container :is(.radio-table,.info-text,.sid-tag,.pass-box),
html[data-fx-site-theme="dark"] .wrap :is(.content,.feature,.note,.fx-topic-grid a),
html[data-fx-site-theme="dark"] .reg-card :is(.reg-header,.reg-body,.form-group,.footer-link){color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] .wrap :is(.feature,.note,.fx-topic-grid a){background:var(--fx-site-night-card)!important}
html[data-fx-site-theme="dark"] .wrapper .sidebar{background:var(--fx-site-night-top)!important}
html[data-fx-site-theme="dark"] .wrapper .content{background:var(--fx-site-night-top)!important}

html[data-fx-site-theme="dark"] :is(.fx-status-wrap,.fx-status-note,.fx-status-card,.fx-status-summary,.fx-status-barbox){background:var(--fx-site-night-panel)!important;color:var(--fx-site-night-text)!important;border-color:var(--fx-site-night-border)!important}
html[data-fx-site-theme="dark"] :is(.fx-status-title,.fx-status-chart-title,.fx-status-date,.fx-status-card b){color:#bcdcff!important}
html[data-fx-site-theme="dark"] :is(.fx-status-card span,.fx-status-time,.fx-status-chart-sub){color:var(--fx-site-night-muted)!important}

/* Resilient, high-contrast floating site-level appearance controls. */
#fx-appearance{position:fixed;z-index:2147481000;left:clamp(8px,1.5vw,20px);bottom:clamp(8px,1.8vw,22px);width:auto;max-width:min(310px,calc(100vw - 16px));direction:ltr;font-family:Arial,Helvetica,sans-serif!important;font-size:14px!important;line-height:1.4!important;color:#e7f0ff;isolation:isolate;text-align:left;pointer-events:none}
#fx-appearance *{box-sizing:border-box;font-family:inherit!important;line-height:inherit}
#fx-appearance :is(button,span,strong){font-size:14px!important}
#fx-appearance button{pointer-events:auto;cursor:pointer;touch-action:manipulation;appearance:none;-webkit-appearance:none}
#fx-appearance-toggle{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 13px;min-height:38px;color:#eff7ff;background:#233e5c;border:1px solid #5d90c1;border-radius:999px;font-weight:700;box-shadow:0 4px 17px #0006;white-space:nowrap}
#fx-appearance-toggle:hover{background:#31577d}
#fx-appearance-toggle svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
#fx-appearance-panel{pointer-events:auto;margin-bottom:8px;min-width:270px;padding:14px;background:#1c2c42;color:#e7f0ff;border:1px solid #4a6685;border-radius:14px;box-shadow:0 10px 36px #0009}
#fx-appearance-panel[hidden]{display:none!important}
#fx-appearance .fx-appearance-head{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:12px}
#fx-appearance .fx-appearance-head strong{color:#e7f0ff;font-weight:800}
#fx-appearance .fx-ap-close{width:28px;height:28px;background:#263c57;color:#e7f0ff;border:1px solid #486788;border-radius:8px}
#fx-appearance .fx-appearance-label{display:block;color:#bcd4ec;font-size:12px!important;font-weight:700;margin:12px 0 6px}
#fx-appearance .fx-theme-switch,#fx-appearance .fx-reader-row{display:flex;align-items:center;gap:6px}
#fx-appearance .fx-theme-choice{flex:1;padding:8px 9px;background:#283e58;color:#dfedfc;border:1px solid #455d7a;border-radius:8px;font-weight:700}
#fx-appearance .fx-theme-choice[aria-pressed="true"]{background:#76b7f9;color:#102138;border-color:#abd5ff}
#fx-appearance .fx-reader-button{flex:0 0 38px;height:35px;background:#263e59;color:#e9f4ff;border:1px solid #496a89;border-radius:8px;font-weight:700}
#fx-appearance .fx-reader-button:disabled{cursor:not-allowed;opacity:.48}
#fx-appearance .fx-reader-value{flex:1;text-align:center;color:#eaf3ff;font-weight:800;font-variant-numeric:tabular-nums}
#fx-appearance .fx-reset{width:100%;padding:8px 11px;margin-top:10px;background:transparent;color:#c3ddf7;border:1px solid #486788;border-radius:8px}
#fx-appearance button:focus-visible{outline:3px solid #aacfff;outline-offset:2px}
@media(max-width:480px){#fx-appearance{left:8px;bottom:8px}#fx-appearance-toggle{padding:8px 11px;min-height:36px}#fx-appearance-panel{min-width:260px}}
/* Reader magnification: JS records original computed sizes, CSS changes only
   text-bearing nodes. No changes to widths, image dimensions or stream UI. */
html:not([data-fx-reader-level="0"]) [data-fx-readable="1"]{font-size:calc(var(--fx-base-font-size) * var(--fx-reader-ratio,1))!important}
@media(prefers-reduced-motion:reduce){#fx-appearance *{transition:none!important}}

/* V3.9: Allow large reader magnification (up to 190% of normal text size).
   Action controls enlarge their text as well, including submit/reset/button inputs.
   Keep the size of radio artwork, player canvas and the appearance widget stable. */
html[data-fx-reader-level]:not([data-fx-reader-level="0"]) body .page :is(
  .menu-content a,button:not(.play-btn),input[type="submit"],input[type="button"],input[type="reset"],
  .btn-login,.btn-search,.fx-status-btn,.fx-v34-radio-list-link,.fx-yayinal-back,
  .auth-link,.pagination a,.pagination span,.top-pagination a,.top-pagination span
){
  white-space:normal!important;
  overflow-wrap:anywhere;
  line-height:1.3;
}
html[data-fx-reader-level]:not([data-fx-reader-level="0"]) body .page :is(
  button:not(.play-btn),input[type="submit"],input[type="button"],input[type="reset"],
  .btn-login,.fx-status-btn,.fx-v34-radio-list-link
){
  height:auto;
  min-height:36px;
  max-width:100%;
}
html[data-fx-reader-level]:not([data-fx-reader-level="0"]) body .page :is(
  .sidebar .menu-content a,.stream-info,.stream-title,.stream-desc,.stream-url
){min-width:0}
html[data-fx-reader-level]:not([data-fx-reader-level="0"]) body .page :is(
  .stream-title,.stream-desc,.stream-url
){overflow-wrap:anywhere}
/* The public site's selection lists can wrap instead of clipping enlarged captions. */
html[data-fx-reader-level]:not([data-fx-reader-level="0"]) body .page select{max-width:100%}

/* V4.1: prominent, readable appearance access button, independent from reader zoom. */
#fx-appearance #fx-appearance-toggle{
  min-height:43px!important;
  padding:10px 17px!important;
  color:#fff!important;
  background:linear-gradient(115deg,#0065a7 0%,#087fb7 52%,#075b92 100%)!important;
  border:1px solid #f2c75e!important;
  box-shadow:0 5px 18px rgba(2,26,60,.44),inset 0 1px 0 rgba(255,255,255,.28)!important;
  font-weight:800!important;
  letter-spacing:.1px;
  transition:filter .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
#fx-appearance #fx-appearance-toggle::after{
  content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;
  background:#ffd556;box-shadow:0 0 7px #ffd556a8;
}
#fx-appearance #fx-appearance-toggle:hover{
  filter:brightness(1.13);transform:translateY(-2px);
  box-shadow:0 8px 21px rgba(0,62,120,.45),0 0 0 2px rgba(30,175,241,.23)!important;
}
#fx-appearance #fx-appearance-toggle:focus-visible{outline:3px solid #ffd763!important;outline-offset:3px}
@media(prefers-reduced-motion:reduce){#fx-appearance #fx-appearance-toggle{transition:none!important;transform:none!important}}