:root{
  --bg:#070b14;
  --panel:#101827;
  --panel2:#151f32;
  --text:#eef4ff;
  --muted:#9aa8bd;
  --brand:#37b6ff;
  --brand2:#7c5cff;
  --gold:#d7ad4b;
  --danger:#ff5b6e;
  --ok:#2fd18f;
  --line:rgba(255,255,255,.08);
}
*{box-sizing:border-box}
html{min-height:100%}
body{
  margin:0;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  background:radial-gradient(circle at 20% 0%,#132844 0,#070b14 42%,#05070d 100%);
  color:var(--text);
  min-height:100vh;
}
a{color:var(--brand);text-decoration:none}

/* Login / home page */
.login-page{
  position:relative;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 24% 10%,rgba(215,173,75,.12) 0,rgba(215,173,75,0) 28%),
    radial-gradient(circle at 78% 30%,rgba(55,182,255,.12) 0,rgba(55,182,255,0) 30%),
    linear-gradient(135deg,#081223 0%,#060913 56%,#04060c 100%);
}
.login-page:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 70%);
}
.login-wrap{
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:center;
  padding:56px;
  max-width:1360px;
  margin:auto;
  position:relative;
  z-index:1;
}
.premium-hero{
  max-width:650px;
}
/* Home page top-left logo: smaller, no background box */
.home-logo-wrap{
  margin-bottom:30px;
  padding:0;
  width:min(380px,100%);
  border-radius:0;
  background:transparent;
  border:0;
  box-shadow:none;
}
.home-logo{
  display:block;
  width:min(340px,100%);
  height:auto;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  padding:9px 13px;
  border:1px solid rgba(215,173,75,.35);
  border-radius:999px;
  background:rgba(215,173,75,.08);
  color:#f0d38a;
  font-weight:800;
  letter-spacing:.7px;
  text-transform:uppercase;
  font-size:12px;
}
.hero h1{
  font-size:54px;
  line-height:1.03;
  margin:0 0 18px;
  letter-spacing:-1.3px;
}
.hero-description,.hero p{
  font-size:18px;
  color:var(--muted);
  line-height:1.72;
  max-width:650px;
  margin:0;
}
.feature-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:30px;
}
.feature{
  padding:17px 18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.022));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.feature:before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:10px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold),#fff0a8);
  box-shadow:0 0 18px rgba(215,173,75,.65);
}
.login-card,.card{
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  border:1px solid var(--line);
  border-radius:26px;
  box-shadow:0 24px 80px rgba(0,0,0,.35);
  padding:30px;
}
.premium-login-card{
  width:min(480px,100%);
  justify-self:center;
  padding:34px;
  border-color:rgba(215,173,75,.14);
  background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.032));
}
.login-card-header{text-align:center;margin-bottom:24px}
.login-card-logo{
  display:block;
  max-width:260px;
  width:78%;
  height:auto;
  margin:0 auto 16px;
}
.login-card-header h2{margin:0 0 8px;font-size:30px;letter-spacing:-.5px}
.login-card-header p{margin:0;color:var(--muted)}
.logo-box{text-align:center;margin-bottom:24px}
.logo-box img{max-width:220px;max-height:100px}
.logo-fallback{font-weight:800;font-size:28px;letter-spacing:.5px}
.field{margin-bottom:16px}
.field label{display:block;color:var(--muted);font-size:14px;margin-bottom:8px}
input,select,textarea{
  width:100%;
  padding:13px 14px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--text);
  outline:0;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(55,182,255,.45);
  box-shadow:0 0 0 4px rgba(55,182,255,.08);
}
textarea{min-height:100px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:0;
  border-radius:14px;
  padding:12px 18px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:white;
  font-weight:800;
  cursor:pointer;
  letter-spacing:.2px;
  transition:transform .16s ease,filter .16s ease,background .16s ease;
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.btn.secondary{background:rgba(255,255,255,.08);border:1px solid var(--line)}
.btn.danger{background:var(--danger)}
.btn.ok{background:var(--ok)}
.btn.full{width:100%}
.forgot-link{text-align:center;margin-top:16px;margin-bottom:0}
.login-footer{
  position:fixed;
  left:0;
  right:0;
  bottom:18px;
  z-index:2;
  text-align:center;
  color:rgba(238,244,255,.58);
  font-size:13px;
}
.alert{padding:12px 14px;border-radius:14px;margin-bottom:16px;border:1px solid var(--line);background:rgba(255,255,255,.06)}
.alert.error{border-color:rgba(255,91,110,.5);color:#ffd1d7}.alert.success{border-color:rgba(47,209,143,.5);color:#c8ffe9}

/* App layout */
.app{display:grid;grid-template-columns:270px 1fr;min-height:100vh}
.sidebar{
  background:rgba(5,8,15,.72);
  border-right:1px solid var(--line);
  padding:24px;
  position:sticky;
  top:0;
  height:100vh;
}
.sidebar-logo-wrap{
  padding:10px 10px 12px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  border:1px solid var(--line);
  margin-bottom:16px;
}
.sidebar-logo{
  display:block;
  width:100%;
  height:auto;
  max-height:76px;
  object-fit:contain;
}
.brand{font-size:22px;font-weight:900;margin-bottom:6px;letter-spacing:.2px}
.channel{color:var(--muted);font-size:13px;margin-bottom:24px}.nav{display:flex;flex-direction:column;gap:8px}.nav a{color:var(--text);padding:12px 14px;border-radius:14px}.nav a:hover,.nav a.active{background:rgba(255,255,255,.08)}.main{padding:30px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.stat{padding:22px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid var(--line)}.stat strong{font-size:30px;display:block}.table-wrap{overflow:auto;border-radius:18px;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;background:rgba(255,255,255,.035)}th,td{text-align:left;padding:14px;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-weight:600}.actions{display:flex;gap:8px;flex-wrap:wrap}.badge{display:inline-block;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.08);font-size:12px}.feed-url{font-family:Consolas,monospace;word-break:break-all;padding:14px;border-radius:14px;background:rgba(0,0,0,.25);border:1px solid var(--line)}

.action-btn,.btn-small{display:inline-flex;align-items:center;justify-content:center;min-width:64px;height:32px;padding:0 13px;border-radius:12px;font-size:13px;font-weight:800;letter-spacing:.2px;text-decoration:none;border:1px solid rgba(255,255,255,.08);transition:all .18s ease}.btn-edit{background:linear-gradient(135deg,#202633,#2e3545);color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.22)}.btn-edit:hover{transform:translateY(-1px);background:linear-gradient(135deg,#2b3344,#3a4356)}.btn-delete{background:linear-gradient(135deg,#ff4d6d,#ff6b6b);color:#fff;box-shadow:0 8px 22px rgba(255,77,109,.22)}.btn-delete:hover{transform:translateY(-1px);background:linear-gradient(135deg,#ff3158,#ff5a5a)}

@media(max-width:980px){
  .login-wrap{grid-template-columns:1fr;padding:30px;gap:28px;align-items:start}.premium-login-card{justify-self:stretch}.hero h1{font-size:40px}.feature-list,.grid{grid-template-columns:1fr}.app{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.main{padding:20px}.topbar{align-items:flex-start;flex-direction:column}.login-footer{position:relative;bottom:auto;padding:0 20px 22px}.home-logo-wrap{width:min(340px,100%)}
}
@media(max-width:560px){
  .login-wrap{padding:22px}.hero h1{font-size:34px}.login-card,.card,.premium-login-card{padding:22px}.home-logo-wrap{padding:0;width:min(300px,100%)}.login-card-logo{width:90%;max-width:230px}
}

/* Final logo/fav update - remove top logo box completely */
.home-logo-wrap,
.login-page .home-logo-wrap,
.premium-hero .home-logo-wrap{
  padding:0 !important;
  margin:0 0 30px 0 !important;
  width:min(360px,100%) !important;
  max-width:360px !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.home-logo-wrap::before,
.home-logo-wrap::after{
  content:none !important;
  display:none !important;
}
.home-logo,
.login-page .home-logo{
  display:block !important;
  width:100% !important;
  max-width:360px !important;
  height:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.18));
}
.sidebar-logo-wrap{
  padding:0 0 14px 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
.sidebar-logo{
  max-height:64px !important;
  width:100% !important;
  object-fit:contain !important;
}
@media(max-width:980px){
  .home-logo-wrap{width:min(320px,100%) !important;max-width:320px !important;}
}
@media(max-width:560px){
  .home-logo-wrap{width:min(280px,100%) !important;max-width:280px !important;}
}

/* Admin interface refinements - 2026-06-18 */
.sidebar-logo-wrap{
  display:block !important;
  text-align:left !important;
  cursor:pointer;
  margin-bottom:18px !important;
}
.sidebar-logo{
  width:188px !important;
  max-width:100% !important;
  max-height:72px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
}
.dashboard-section-title{
  margin:24px 0 12px;
  color:var(--text);
  font-size:22px;
  font-weight:900;
  letter-spacing:-.3px;
}
.api-link-grid{grid-template-columns:1fr 1.4fr}
.showcase-form-grid{grid-template-columns:1fr 1fr !important}
.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px}
.section-head h2{margin-bottom:6px}.helper-text{margin:0;color:var(--muted);font-size:14px;line-height:1.5}.drag-handle{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-right:10px;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid var(--line);color:var(--muted);cursor:grab;font-weight:900}.dragging{opacity:.58}.reorder-table tbody tr{transition:background .16s ease}.reorder-table tbody tr:hover{background:rgba(255,255,255,.035)}.action-stack{align-items:center}.btn-order{min-width:36px;width:36px;padding:0;font-size:17px;background:linear-gradient(135deg,#243149,#33415f);color:#fff}.btn-order:hover{transform:translateY(-1px);filter:brightness(1.08)}.action-btn:disabled,.btn-disabled{background:rgba(255,255,255,.06) !important;color:rgba(238,244,255,.38) !important;border-color:rgba(255,255,255,.05) !important;box-shadow:none !important;cursor:not-allowed;transform:none !important}.btn-activate{background:linear-gradient(135deg,#22c985,#39e7a5);color:#fff;box-shadow:0 8px 22px rgba(47,209,143,.22)}.btn-activate:hover{transform:translateY(-1px);filter:brightness(1.04)}.badge-active{background:rgba(47,209,143,.14);color:#c8ffe9;border:1px solid rgba(47,209,143,.28)}.badge-inactive{background:rgba(255,91,110,.14);color:#ffd1d7;border:1px solid rgba(255,91,110,.28)}
@media(max-width:980px){.api-link-grid,.showcase-form-grid{grid-template-columns:1fr !important}.sidebar-logo{width:180px !important}}

/* Admin all-user API feed page - 2026-06-18 */
.api-feed-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}.api-feed-card{padding:20px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.045)}.api-feed-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.api-feed-meta h3{margin:0 0 6px;font-size:20px;letter-spacing:-.2px}.api-feed-meta p{margin:0;color:var(--muted);line-height:1.55}.api-feed-url{margin-bottom:14px}.role-pill{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:999px;background:rgba(215,173,75,.12);border:1px solid rgba(215,173,75,.24);color:#f0d38a;font-size:12px;font-weight:800}.muted-small{color:var(--muted);font-size:12px}.empty-state{padding:22px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);text-align:center;background:rgba(255,255,255,.025)}
@media(max-width:980px){.api-feed-list{grid-template-columns:1fr}.section-head{flex-direction:column;align-items:stretch}}


/* Feed list table refinements - 2026-06-18 */
.feed-list-card{padding-bottom:26px}.feed-list-table-wrap{margin-top:18px}.feed-list-table th:nth-child(4),.feed-list-table td:nth-child(4){min-width:310px}.feed-link-cell{font-family:Consolas,monospace;word-break:break-all;color:#dbeafe}.feed-actions{min-width:220px}.feed-actions form{margin:0}.feed-actions .action-btn{white-space:nowrap}.feed-list-table tbody tr:hover{background:rgba(255,255,255,.035)}
@media(max-width:980px){.feed-list-table th:nth-child(4),.feed-list-table td:nth-child(4){min-width:240px}.feed-actions{min-width:190px}}

/* Professional list UI refresh - v4.4 */
.list-card{padding-bottom:24px}
.list-header{margin-bottom:16px}
.list-header-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.list-count-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
  color:var(--text);
  font-size:13px;
  font-weight:800;
  letter-spacing:.2px;
}
.table-pro-wrap{
  border-radius:22px;
  overflow:auto;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
}
.pro-table{
  width:100%;
  min-width:1080px;
  border-collapse:separate;
  border-spacing:0;
  background:transparent;
}
.pro-table thead th{
  padding:16px 18px;
  color:#b6c3d8;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:none;
  background:rgba(255,255,255,.025);
  border-bottom:1px solid rgba(255,255,255,.08);
  white-space:nowrap;
}
.pro-table tbody td{
  padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.07);
  vertical-align:middle;
}
.pro-table tbody tr:last-child td{border-bottom:0}
.pro-table tbody tr:hover{background:rgba(255,255,255,.025)}
.table-index{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:34px;
  padding:0 10px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  color:var(--text);
  font-size:13px;
  font-weight:800;
}
.cell-title{font-size:15px;font-weight:800;line-height:1.35;color:var(--text)}
.cell-meta{margin-top:4px;font-size:12px;line-height:1.45;color:var(--muted)}
.url-chip{
  display:block;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(5,10,18,.42);
  border:1px solid rgba(255,255,255,.08);
  color:#dbeafe;
  font-family:Consolas,Monaco,monospace;
  font-size:13px;
  line-height:1.5;
  word-break:break-all;
}
.role-pill-dark{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.08);
  color:var(--text);
}
.action-group,.move-controls,.action-stack,.feed-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.action-group form,.move-controls form,.feed-actions form{margin:0}
.empty-row td{
  padding:26px 18px !important;
  text-align:center;
  color:var(--muted);
}
.showcase-cell{display:flex;align-items:flex-start;gap:12px}
.showcases-table .drag-handle{
  flex:0 0 auto;
  margin-right:0;
}
.users-table th:nth-child(4),
.users-table td:nth-child(4),
.api-table th:nth-child(4),
.api-table td:nth-child(4),
.showcases-table th:nth-child(4),
.showcases-table td:nth-child(4){min-width:300px}
.users-table th:nth-child(7),
.users-table td:nth-child(7),
.api-table th:nth-child(6),
.api-table td:nth-child(6),
.showcases-table th:nth-child(7),
.showcases-table td:nth-child(7){min-width:190px}
.showcases-table th:nth-child(6),
.showcases-table td:nth-child(6){min-width:90px}
@media(max-width:1200px){
  .pro-table{min-width:980px}
}
@media(max-width:980px){
  .list-header-actions{width:100%}
  .list-header-actions .btn{width:100%}
  .pro-table{min-width:900px}
}

/* Manual save for drag/drop showcase order - v4.5 */
.order-save-panel{
  margin-top:16px;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.order-save-panel strong{
  display:block;
  margin-bottom:4px;
  font-size:15px;
  letter-spacing:.1px;
}
.order-save-panel.has-unsaved-order{
  border-color:rgba(55,182,255,.26);
  background:linear-gradient(135deg,rgba(55,182,255,.08),rgba(124,92,255,.055));
}
#saveShowcaseOrderBtn:disabled{
  opacity:.58;
  cursor:not-allowed;
  transform:none !important;
  filter:none !important;
}
@media(max-width:720px){
  .order-save-panel{flex-direction:column;align-items:stretch}
  .order-save-panel .btn{width:100%}
}


/* Login and password reset refinements - v4.6 */
.login-page .premium-login-card{
  min-height:clamp(600px,77vh,660px);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.login-page .forgot-password-card{
  gap:16px;
}
.support-email-box{
  width:100%;
  padding:16px 18px;
  margin:4px 0 2px;
  border-radius:18px;
  background:rgba(5,10,18,.42);
  border:1px solid rgba(255,255,255,.09);
  text-align:center;
}
.support-email-box span{
  display:block;
  color:var(--muted);
  font-size:13px;
  margin-bottom:7px;
}
.support-email-box a{
  display:block;
  font-weight:900;
  font-size:18px;
  color:#eaf4ff;
  word-break:break-word;
}
.password-help-text{
  text-align:center;
  max-width:420px;
  margin:0 auto;
}
.password-actions{
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin-top:4px;
}
@media(max-width:980px){
  .login-page .premium-login-card{
    min-height:auto;
    justify-content:flex-start;
  }
}


/* Login card top spacing correction - v4.7
   Keeps the login box professional, removes extra top height, and avoids pushing the bottom down. */
.login-page .premium-login-card{
  min-height:clamp(545px,72vh,600px) !important;
  justify-content:center !important;
  padding-top:34px !important;
  padding-bottom:34px !important;
}
.login-page .premium-login-card .login-card-header{
  margin-bottom:22px !important;
}
.login-page .premium-login-card .login-card-logo{
  max-width:240px !important;
  margin-bottom:14px !important;
}
.login-page .premium-login-card .forgot-link{
  margin-top:18px !important;
}
@media(max-width:980px){
  .login-page .premium-login-card{
    min-height:auto !important;
    padding-top:28px !important;
    padding-bottom:28px !important;
  }
}

/* Live TV management page - v4.9 */
.live-stream-form-card textarea{min-height:118px}
.live-form-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
.duration-preview{
  margin-top:8px;
  color:var(--muted);
  font-size:12px;
}
.duration-preview strong{
  color:#dbeafe;
  font-size:13px;
}
.live-table th:nth-child(4),
.live-table td:nth-child(4){min-width:320px}
.live-table th:nth-child(8),
.live-table td:nth-child(8){min-width:250px}
.live-table .action-group{align-items:center}
.live-table .url-chip{max-width:430px}
.live-stream-form .muted-small{font-weight:500}
@media(max-width:980px){
  .live-form-grid{grid-template-columns:1fr !important}
  .live-table{min-width:1050px}
}


/* Professional stream quality selector - v5.0 */
.quality-options{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  width:100%;
}
.quality-option{
  position:relative;
  display:block;
  cursor:pointer;
  user-select:none;
}
.quality-option input{
  position:absolute;
  inset:0;
  opacity:0;
  width:100%;
  height:100%;
  cursor:pointer;
}
.quality-option span{
  min-height:50px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.032));
  color:var(--text);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.quality-option strong{
  font-size:14px;
  line-height:1;
  letter-spacing:.2px;
}
.quality-option small{
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}
.quality-option:hover span{
  transform:translateY(-1px);
  border-color:rgba(55,182,255,.36);
  background:linear-gradient(180deg,rgba(55,182,255,.10),rgba(255,255,255,.038));
}
.quality-option input:checked + span{
  border-color:rgba(55,182,255,.70);
  background:linear-gradient(135deg,rgba(55,182,255,.22),rgba(124,92,255,.24));
  box-shadow:0 0 0 4px rgba(55,182,255,.08), inset 0 1px 0 rgba(255,255,255,.08);
}
.quality-option input:checked + span strong{color:#ffffff}
.quality-option input:checked + span small{color:#dbeafe}
.quality-option input:focus-visible + span{
  outline:2px solid rgba(55,182,255,.65);
  outline-offset:3px;
}
.live-stream-form select,
.live-stream-form option{
  background:#151f32;
  color:var(--text);
}
@media(max-width:560px){
  .quality-options{grid-template-columns:1fr}
}


/* Sidebar branding, separator line, and premium menu effects - v5.4 */
.sidebar{
  background:
    radial-gradient(circle at 20% 0%,rgba(55,182,255,.08),transparent 34%),
    rgba(5,8,15,.78) !important;
}
.sidebar-logo-wrap{
  position:relative !important;
  display:block !important;
  padding:0 0 22px 0 !important;
  margin:0 0 14px 0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.sidebar-logo-wrap::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(215,173,75,.05),rgba(255,235,173,.95),rgba(55,182,255,.34),rgba(124,92,255,.08));
  box-shadow:0 0 18px rgba(215,173,75,.28),0 0 24px rgba(55,182,255,.12);
}
.sidebar-logo{
  width:188px !important;
  max-width:100% !important;
  max-height:76px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
  transition:transform .22s ease,filter .22s ease;
}
.sidebar-logo-wrap:hover .sidebar-logo{
  transform:translateY(-1px);
  filter:drop-shadow(0 0 16px rgba(215,173,75,.24));
}
.brand,.channel{
  display:none !important;
}
.sidebar-channel-name{
  margin:10px 0 22px;
  color:#f2f6ff;
  font-size:18px;
  font-weight:900;
  line-height:1.25;
  letter-spacing:-.2px;
  text-shadow:0 10px 24px rgba(0,0,0,.26);
}
.nav{
  gap:10px !important;
}
.nav a{
  position:relative;
  display:flex;
  align-items:center;
  min-height:48px;
  padding:13px 16px 13px 18px !important;
  border-radius:16px !important;
  color:rgba(238,244,255,.9) !important;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(255,255,255,.006));
  border:1px solid transparent;
  overflow:hidden;
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease;
}
.nav a::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:4px;
  height:0;
  border-radius:999px;
  background:linear-gradient(180deg,var(--brand),var(--brand2));
  transform:translateY(-50%);
  transition:height .22s ease;
}
.nav a::after{
  content:"";
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  background:radial-gradient(circle at 18% 50%,rgba(55,182,255,.16),transparent 34%);
  transition:opacity .2s ease;
}
.nav a:hover{
  transform:translateX(4px);
  color:#fff !important;
  border-color:rgba(55,182,255,.18);
  background:linear-gradient(135deg,rgba(55,182,255,.12),rgba(124,92,255,.09));
  box-shadow:0 10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);
}
.nav a:hover::before,
.nav a.active::before{
  height:58%;
}
.nav a:hover::after,
.nav a.active::after{
  opacity:1;
}
.nav a.active{
  color:#fff !important;
  border-color:rgba(255,255,255,.08);
  background:linear-gradient(135deg,rgba(55,182,255,.22),rgba(124,92,255,.18)) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.28),0 0 0 1px rgba(55,182,255,.05),inset 0 1px 0 rgba(255,255,255,.08);
}
@media(max-width:980px){
  .sidebar-channel-name{margin-bottom:16px}
  .nav a:hover{transform:none}
}


/* Admin all-user Live TV visibility - v5.5 */
.admin-channel-field select{
  background-color:rgba(12,19,32,.96);
  color:var(--text);
  border-color:rgba(55,182,255,.18);
}
.admin-live-table th:nth-child(2),
.admin-live-table td:nth-child(2){
  min-width:220px;
}
.admin-live-table th:nth-child(5),
.admin-live-table td:nth-child(5){
  min-width:320px;
}


/* Dashboard channel details, admin showcase view, and password eye toggle - v5.7 */
.channel-stat strong{
  font-size:22px;
  line-height:1.25;
  word-break:break-word;
}
.admin-showcases-table th:nth-child(2),
.admin-showcases-table td:nth-child(2){
  min-width:220px;
}
.admin-showcases-table th:nth-child(5),
.admin-showcases-table td:nth-child(5){
  min-width:320px;
}
.password-field{
  position:relative;
  display:flex;
  align-items:center;
}
.password-field input{
  padding-right:54px !important;
}
.password-toggle{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(135deg,rgba(55,182,255,.12),rgba(124,92,255,.12));
  color:#eaf4ff;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  line-height:1;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
.password-toggle:hover{
  transform:translateY(-50%) scale(1.04);
  border-color:rgba(55,182,255,.28);
  background:linear-gradient(135deg,rgba(55,182,255,.22),rgba(124,92,255,.18));
  box-shadow:0 8px 24px rgba(0,0,0,.22),0 0 18px rgba(55,182,255,.14);
}
.password-toggle.is-visible{
  border-color:rgba(215,173,75,.34);
  background:linear-gradient(135deg,rgba(215,173,75,.20),rgba(124,92,255,.16));
}
.alert.error{
  background:rgba(255,91,110,.12) !important;
  color:#ffd1d7 !important;
  border-color:rgba(255,91,110,.55) !important;
  box-shadow:0 10px 28px rgba(255,91,110,.08);
}
.alert.success{
  background:rgba(47,209,143,.10) !important;
  color:#c8ffe9 !important;
}


/* v5.8: clean password eye icon without inner box */
.password-toggle{
  width:34px !important;
  height:34px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#cfe6ff !important;
  font-size:17px !important;
}
.password-toggle:hover{
  transform:translateY(-50%) scale(1.08) !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#ffffff !important;
}
.password-toggle.is-visible{
  border:0 !important;
  background:transparent !important;
  color:#f0d38a !important;
}

/* Expert UI + performance polish v8 - 2026-06-19 */
html[data-theme="dark"]{
  color-scheme:dark;
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f7fb;
  --panel:#ffffff;
  --panel2:#eef4fb;
  --text:#111827;
  --muted:#5f6b7a;
  --brand:#0ea5e9;
  --brand2:#6d5dfc;
  --gold:#ad7d18;
  --danger:#dc3545;
  --ok:#068a61;
  --line:rgba(15,23,42,.12);
}
html[data-theme="light"] body{
  background:linear-gradient(135deg,#f8fbff 0%,#edf4fc 54%,#e7edf5 100%);
  color:var(--text);
}
html[data-theme="light"] .login-page{
  background:
    radial-gradient(circle at 24% 10%,rgba(173,125,24,.10) 0,rgba(173,125,24,0) 30%),
    radial-gradient(circle at 78% 30%,rgba(14,165,233,.12) 0,rgba(14,165,233,0) 32%),
    linear-gradient(135deg,#f8fbff 0%,#eef5fd 56%,#e9eff7 100%);
}
html[data-theme="light"] .sidebar{
  background:rgba(255,255,255,.88);
  box-shadow:8px 0 26px rgba(15,23,42,.04);
}
html[data-theme="light"] .main{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0));
}
html[data-theme="light"] .card,
html[data-theme="light"] .login-card,
html[data-theme="light"] .stat,
html[data-theme="light"] .api-feed-card,
html[data-theme="light"] .showcase-row,
html[data-theme="light"] .account-row{
  background:rgba(255,255,255,.82);
  border-color:rgba(15,23,42,.12);
  box-shadow:0 18px 46px rgba(15,23,42,.07);
}
html[data-theme="light"] .nav a{color:var(--text)}
html[data-theme="light"] .nav a:hover,
html[data-theme="light"] .nav a.active{
  background:linear-gradient(135deg,rgba(14,165,233,.14),rgba(109,93,252,.12));
}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:rgba(255,255,255,.9);
  color:var(--text);
  border-color:rgba(15,23,42,.13);
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{color:#7b8797}
html[data-theme="light"] .btn.secondary,
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .action-btn,
html[data-theme="light"] .role-pill-dark,
html[data-theme="light"] .list-count-chip{
  color:var(--text);
  background:rgba(255,255,255,.85);
  border-color:rgba(15,23,42,.12);
}
html[data-theme="light"] .feed-url,
html[data-theme="light"] .url-chip,
html[data-theme="light"] .json-preview,
html[data-theme="light"] .support-email-box{
  background:rgba(248,250,252,.94);
  color:#0f172a;
  border-color:rgba(15,23,42,.12);
}
html[data-theme="light"] .showcase-video-count{
  background:rgba(6,138,97,.10);
  border-color:rgba(6,138,97,.20);
  color:#075d43;
}
html[data-theme="light"] .showcase-video-count.is-pending{
  background:rgba(15,23,42,.045);
  border-color:rgba(15,23,42,.10);
  color:#657286;
}
html[data-theme="light"] .showcase-url-with-count .showcase-link:hover{
  background:rgba(239,246,255,.98);
  border-color:rgba(37,99,235,.24);
}
html[data-theme="light"] .cell-title{color:#0f172a}
html[data-theme="light"] .cell-meta,
html[data-theme="light"] .helper-text,
html[data-theme="light"] .field label{color:#657286}
html[data-theme="light"] .badge-active{background:rgba(6,138,97,.12);color:#075d43;border-color:rgba(6,138,97,.22)}
html[data-theme="light"] .badge-inactive{background:rgba(220,53,69,.10);color:#9f1d2d;border-color:rgba(220,53,69,.20)}
html[data-theme="light"] .login-footer{color:rgba(15,23,42,.60)}
html[data-theme="light"] .feature{background:rgba(255,255,255,.72);border-color:rgba(15,23,42,.10)}
html[data-theme="light"] .eyebrow{background:rgba(173,125,24,.10);color:#8a620e;border-color:rgba(173,125,24,.24)}

.app{grid-template-columns:270px minmax(0,1fr)}
.main{min-width:0;max-width:100%;overflow-x:hidden}
.topbar{min-width:0}
.topbar>div:first-child{min-width:0}
.topbar h1,.topbar p{overflow-wrap:anywhere}
.grid{min-width:0}
.stat{min-width:0}
.dashboard-primary-grid .stat span,
.compact-stat-grid .stat span{font-size:15px;color:var(--text)}
.dashboard-primary-grid .stat strong{font-size:25px;line-height:1.15;overflow-wrap:anywhere}
.compact-stat-grid .stat{padding:18px 20px}
.compact-stat-grid .stat strong{font-size:28px}
.dashboard-feed-card{overflow:hidden}
.dashboard-feed-actions{margin-top:18px}

.theme-switch{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.065);
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.theme-switch button{
  width:42px;
  height:38px;
  border:0;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  background:transparent;
  cursor:pointer;
  font-weight:900;
  font-size:18px;
  transition:all .16s ease;
}
.theme-switch button:hover,
.theme-switch button.active{
  color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  box-shadow:0 10px 24px rgba(55,182,255,.18);
}
html[data-theme="light"] .theme-switch{background:rgba(255,255,255,.72)}
html[data-theme="light"] .theme-switch button.active{color:#fff}

/* Password field: no emoji/black icon; visible SVG-mask icon in dark and light mode */
.password-field{position:relative;display:block}
.password-field input{padding-right:48px !important}
.password-field input::-ms-reveal,
.password-field input::-ms-clear{display:none}
.password-toggle{
  position:absolute;
  top:50%;
  right:12px;
  width:30px;
  height:30px;
  transform:translateY(-50%);
  border:0;
  border-radius:10px;
  background:transparent;
  color:#eaf4ff;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.password-toggle:before{
  content:"";
  width:20px;
  height:20px;
  display:block;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C6.5 5 2.2 9.4 1 12c1.2 2.6 5.5 7 11 7s9.8-4.4 11-7c-1.2-2.6-5.5-7-11-7Zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C6.5 5 2.2 9.4 1 12c1.2 2.6 5.5 7 11 7s9.8-4.4 11-7c-1.2-2.6-5.5-7-11-7Zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8Z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.password-toggle.is-visible:after{
  content:"";
  position:absolute;
  width:22px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transform:rotate(-42deg);
}
.password-toggle:hover{background:rgba(255,255,255,.08);color:#fff}
html[data-theme="light"] .password-toggle{color:#1f2937}
html[data-theme="light"] .password-toggle:hover{background:rgba(15,23,42,.06);color:#0f172a}

/* Professional showcase list: no horizontal scroll */
.showcase-list-card{overflow:hidden}
.admin-showcase-filter{
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto auto;
  gap:12px;
  align-items:end;
  margin:12px 0 18px;
  padding:14px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.035);
}
.admin-showcase-filter .field{margin-bottom:0}
.compact-select-field select{min-height:46px}
.showcase-list-pro{
  display:grid;
  gap:12px;
  margin-top:16px;
  width:100%;
  min-width:0;
}
.showcase-row{
  display:grid;
  grid-template-columns:minmax(230px,1.18fr) minmax(150px,.75fr) minmax(220px,1.2fr) auto auto auto;
  gap:14px;
  align-items:center;
  padding:15px 16px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  min-width:0;
}
.showcase-row-main,
.showcase-row-category,
.showcase-row-url,
.showcase-row-status,
.showcase-row-move,
.showcase-row-actions{min-width:0}
.showcase-row-main{display:flex;align-items:center;gap:12px}
.showcase-row-url .url-chip{max-width:100%}
.showcase-url-with-count{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.showcase-url-with-count .showcase-link{
  flex:1 1 auto;
  min-width:0;
  text-decoration:none;
  transition:border-color .16s ease,background .16s ease,filter .16s ease;
}
.showcase-url-with-count .showcase-link:hover{
  border-color:rgba(88,183,255,.38);
  background:rgba(10,25,44,.7);
  filter:brightness(1.08);
}
.showcase-video-count{
  flex:0 0 auto;
  min-width:96px;
  padding:7px 10px;
  border-radius:13px;
  border:1px solid rgba(47,209,143,.25);
  background:rgba(47,209,143,.10);
  color:#c8ffe9;
  text-align:center;
  line-height:1.1;
}
.showcase-video-count span{
  display:block;
  font-size:9px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  opacity:.82;
}
.showcase-video-count strong{
  display:block;
  margin-top:4px;
  font-size:17px;
  font-weight:900;
}
.showcase-video-count.is-pending{
  border-color:rgba(255,255,255,.11);
  background:rgba(255,255,255,.055);
  color:var(--muted);
}
.compact-url{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:normal;
  font-size:12.5px;
  padding:10px 12px;
}
.icon-action-group,
.showcase-row-actions,
.account-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:nowrap;
}
.icon-action-group form,
.showcase-row-actions form,
.account-actions form{margin:0;display:inline-flex}
.icon-btn{
  width:36px;
  height:36px;
  min-width:36px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.07);
  color:#edf6ff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  font-size:16px;
  line-height:1;
  transition:transform .16s ease,filter .16s ease,background .16s ease;
}
.icon-btn:hover:not(:disabled):not(.is-disabled){transform:translateY(-1px);filter:brightness(1.08)}
.icon-btn:disabled,.icon-btn.is-disabled{opacity:.42;cursor:not-allowed;transform:none!important;filter:none!important}
.danger-icon{background:rgba(255,91,110,.15);border-color:rgba(255,91,110,.28);color:#ffd1d7}
.ok-icon{background:rgba(47,209,143,.14);border-color:rgba(47,209,143,.28);color:#c8ffe9}
.move-icon{background:linear-gradient(135deg,#243149,#33415f);color:#fff}
html[data-theme="light"] .move-icon{background:#eef4ff;color:#1d3557}
html[data-theme="light"] .danger-icon{background:rgba(220,53,69,.10);color:#9f1d2d;border-color:rgba(220,53,69,.18)}
html[data-theme="light"] .ok-icon{background:rgba(6,138,97,.10);color:#075d43;border-color:rgba(6,138,97,.18)}

/* Compact users/admin account list */
.compact-form-card{padding:24px}
.user-create-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:14px}
.compact-user-form .field{margin-bottom:10px}
.compact-list-card{padding:24px}
.account-list{display:grid;gap:12px;margin-top:10px}
.account-row{
  display:grid;
  grid-template-columns:54px minmax(160px,1fr) minmax(160px,1fr) minmax(150px,.75fr) minmax(190px,1.05fr) auto;
  align-items:center;
  gap:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  min-width:0;
}
.account-main,.account-channel,.account-status,.account-feed{min-width:0}
.account-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.account-actions .icon-btn{width:34px;height:34px;min-width:34px;font-size:14px}
.account-row .table-index{min-width:38px;height:32px}
.account-row .cell-title{font-size:14px}
.account-row .cell-meta{font-size:11.5px}
.account-row .url-chip{font-size:12px}

.json-preview{
  white-space:pre-wrap;
  word-break:break-word;
  background:rgba(0,0,0,.3);
  padding:18px;
  border-radius:18px;
  overflow:auto;
  border:1px solid var(--line);
  color:var(--text);
  max-height:70vh;
}
.feed-preview-actions{justify-content:flex-end}

@media(max-width:1380px){
  .showcase-row{grid-template-columns:minmax(220px,1fr) minmax(130px,.62fr) minmax(180px,.9fr) auto auto auto;gap:10px}
  .account-row{grid-template-columns:48px minmax(150px,1fr) minmax(150px,1fr) minmax(135px,.7fr) minmax(160px,.9fr) auto}
}
@media(max-width:1120px){
  .showcase-row{grid-template-columns:1fr 1fr;align-items:start}
  .showcase-row-url{grid-column:1 / -1}
  .showcase-row-status,.showcase-row-move,.showcase-row-actions{justify-content:flex-start}
  .account-row{grid-template-columns:48px 1fr 1fr;align-items:start}
  .account-status,.account-feed,.account-actions{grid-column:auto}
  .account-actions{justify-content:flex-start}
}
@media(max-width:980px){
  .topbar{align-items:flex-start;flex-direction:column}
  .theme-switch{align-self:flex-start}
  .admin-showcase-filter{grid-template-columns:1fr}
  .user-create-grid{grid-template-columns:1fr !important}
}
@media(max-width:720px){
  .showcase-row,.account-row{grid-template-columns:1fr}
  .showcase-row-main{align-items:flex-start}
  .showcase-url-with-count{align-items:stretch;flex-direction:column}
  .showcase-video-count{display:flex;align-items:center;justify-content:space-between;min-width:0;text-align:left}
  .showcase-video-count span,.showcase-video-count strong{margin:0}
  .showcase-row-status,.showcase-row-move,.showcase-row-actions,.account-actions{justify-content:flex-start}
  .feed-preview-actions .btn,.dashboard-feed-actions .btn{width:100%}
}

/* Final v8 password override to beat older !important rules */
.password-toggle{
  width:30px !important;
  height:30px !important;
  right:12px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#eaf4ff !important;
  font-size:0 !important;
}
.password-toggle:hover{
  transform:translateY(-50%) scale(1.04) !important;
  background:rgba(255,255,255,.08) !important;
  color:#ffffff !important;
}
html[data-theme="light"] .password-toggle{color:#1f2937 !important}
html[data-theme="light"] .password-toggle:hover{background:rgba(15,23,42,.06) !important;color:#0f172a !important}

/* Expert stability patch v9 - targeted UI fixes only */
.login-theme-switch{
  position:fixed;
  top:22px;
  right:24px;
  z-index:30;
  backdrop-filter:blur(12px);
}
.login-page .home-logo-wrap,
.premium-hero .home-logo-wrap{
  position:relative !important;
  width:min(320px,100%) !important;
  max-width:320px !important;
  margin-bottom:22px !important;
  padding-bottom:18px !important;
}
.login-page .home-logo,
.premium-hero .home-logo{
  max-width:320px !important;
}
.login-page .home-logo-wrap::after,
.premium-hero .home-logo-wrap::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,rgba(215,173,75,.08),rgba(255,235,173,.92),rgba(55,182,255,.34),rgba(124,92,255,.06)) !important;
  box-shadow:0 0 18px rgba(215,173,75,.22),0 0 18px rgba(55,182,255,.10) !important;
}
.login-card-logo{
  max-width:215px !important;
  width:min(74%,215px) !important;
  padding-bottom:14px !important;
  border-bottom:2px solid transparent !important;
  border-image:linear-gradient(90deg,rgba(215,173,75,.08),rgba(255,235,173,.92),rgba(55,182,255,.34),rgba(124,92,255,.06)) 1 !important;
}
.login-page .premium-login-card .login-card-logo{
  max-width:215px !important;
}
.login-card-header h2{margin-top:4px !important}

/* Native select/dropdown readability for dark and light mode */
select,
select option,
select optgroup{
  background-color:#151f32 !important;
  color:#eef4ff !important;
}
select option:checked,
select option:hover{
  background-color:#22314c !important;
  color:#ffffff !important;
}
.admin-showcase-filter{
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.026)) !important;
}
.admin-showcase-filter select{
  min-height:48px !important;
  background-color:#121c2d !important;
  color:#eef4ff !important;
  border-color:rgba(55,182,255,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.admin-showcase-filter select option{
  background-color:#121c2d !important;
  color:#eef4ff !important;
}
html[data-theme="light"] select,
html[data-theme="light"] select option,
html[data-theme="light"] select optgroup{
  background-color:#ffffff !important;
  color:#111827 !important;
}
html[data-theme="light"] select option:checked,
html[data-theme="light"] select option:hover{
  background-color:#eaf4ff !important;
  color:#0f172a !important;
}
html[data-theme="light"] .admin-showcase-filter{
  background:rgba(255,255,255,.82) !important;
}
html[data-theme="light"] .admin-showcase-filter select,
html[data-theme="light"] .admin-showcase-filter select option{
  background-color:#ffffff !important;
  color:#111827 !important;
  border-color:rgba(15,23,42,.14) !important;
}

/* User API compact professional card list */
.api-list-card{overflow:hidden}
.api-account-row{
  grid-template-columns:48px minmax(170px,1fr) minmax(150px,.8fr) minmax(112px,.42fr) minmax(220px,1.25fr) auto;
  padding:13px 14px;
}
.api-account-row .account-status{justify-content:flex-start}
.api-account-row .account-actions .icon-btn{width:34px;height:34px;min-width:34px}
.api-account-row .url-chip{max-width:100%}
@media(max-width:1180px){
  .api-account-row{grid-template-columns:48px minmax(160px,1fr) minmax(150px,1fr);align-items:start}
  .api-account-row .account-status,
  .api-account-row .account-feed,
  .api-account-row .account-actions{grid-column:auto}
  .api-account-row .account-actions{justify-content:flex-start}
}
@media(max-width:720px){
  .login-theme-switch{position:absolute;top:16px;right:16px}
  .api-account-row{grid-template-columns:1fr}
  .login-page .home-logo-wrap,.premium-hero .home-logo-wrap{width:min(280px,100%) !important;max-width:280px !important}
  .login-page .home-logo,.premium-hero .home-logo{max-width:280px !important}
}
html[data-theme="dark"] select{color-scheme:dark}
html[data-theme="light"] select{color-scheme:light}

/* Expert stability patch v10 - only Live TV list + smaller login screen */
.live-stream-list-card{
  overflow:hidden;
}
.live-card-list{
  display:grid;
  gap:12px;
  margin-top:14px;
}
.live-card-row{
  display:grid;
  grid-template-columns:50px minmax(175px,1fr) minmax(145px,.72fr) minmax(240px,1.15fr) minmax(170px,.78fr) auto;
  gap:12px;
  align-items:center;
  padding:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.025));
  min-width:0;
}
.admin-live-card-list .live-card-row{
  grid-template-columns:50px minmax(150px,.82fr) minmax(165px,.95fr) minmax(140px,.68fr) minmax(230px,1.12fr) minmax(170px,.78fr) auto;
}
.live-card-index,
.live-card-owner,
.live-card-main,
.live-card-category,
.live-card-url,
.live-card-meta,
.live-card-actions{
  min-width:0;
}
.cell-label{
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.45px;
}
.live-card-row .cell-title{
  font-size:14px;
  font-weight:900;
  line-height:1.35;
}
.live-card-row .cell-meta{
  margin-top:4px;
  font-size:12px;
  line-height:1.45;
}
.live-card-url .url-chip{
  max-width:100%;
  padding:12px 13px;
  font-size:12.5px;
  line-height:1.45;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.live-card-meta{
  display:grid;
  grid-template-columns:auto auto auto;
  gap:12px;
  align-items:center;
}
.live-card-meta .duration-title{
  font-size:14px;
  white-space:nowrap;
}
.live-card-actions{
  justify-content:flex-end;
  flex-wrap:nowrap;
}
.live-card-actions .icon-btn{
  width:34px;
  height:34px;
  min-width:34px;
  font-size:14px;
}
.live-card-actions .danger-icon:last-child{
  font-size:20px;
  font-weight:900;
}

/* Login/home screen compact sizing */
.login-wrap{
  max-width:1220px !important;
  gap:42px !important;
  padding:36px 48px !important;
}
.premium-hero{
  max-width:590px !important;
}
.login-page .home-logo-wrap,
.premium-hero .home-logo-wrap{
  width:min(285px,100%) !important;
  max-width:285px !important;
  margin-bottom:18px !important;
  padding-bottom:14px !important;
}
.login-page .home-logo,
.premium-hero .home-logo{
  max-width:285px !important;
}
.eyebrow{
  padding:7px 11px !important;
  font-size:11px !important;
  margin-bottom:13px !important;
}
.hero h1{
  font-size:46px !important;
  line-height:1.04 !important;
  margin-bottom:14px !important;
  letter-spacing:-1.1px !important;
}
.hero-description,.hero p{
  font-size:16px !important;
  line-height:1.62 !important;
}
.feature-list{
  gap:12px !important;
  margin-top:24px !important;
}
.feature{
  padding:13px 15px !important;
  border-radius:16px !important;
  font-size:15px !important;
}
.premium-login-card{
  width:min(430px,100%) !important;
  padding:28px !important;
}
.login-page .premium-login-card{
  min-height:clamp(500px,66vh,575px) !important;
}
.login-card-header{
  margin-bottom:18px !important;
}
.login-card-logo,
.login-page .premium-login-card .login-card-logo{
  max-width:185px !important;
  width:min(68%,185px) !important;
  margin-bottom:12px !important;
  padding-bottom:12px !important;
}
.login-card-header h2{
  font-size:26px !important;
}
.login-card-header p,
.login-page .field label,
.forgot-link,
.login-footer{
  font-size:13px !important;
}
.login-page input,
.login-page .btn{
  min-height:46px !important;
  padding:11px 13px !important;
  border-radius:13px !important;
}
.login-page .field{
  margin-bottom:13px !important;
}
.login-theme-switch{
  top:16px !important;
  right:18px !important;
}

html[data-theme="light"] .live-card-row{
  background:rgba(255,255,255,.78);
  border-color:rgba(15,23,42,.10);
}
html[data-theme="light"] .live-card-url .url-chip{
  background:rgba(15,23,42,.04);
  color:#0f172a;
  border-color:rgba(15,23,42,.10);
}

@media(max-width:1420px){
  .admin-live-card-list .live-card-row{
    grid-template-columns:46px minmax(140px,.82fr) minmax(150px,.9fr) minmax(130px,.64fr) minmax(210px,1fr) minmax(160px,.76fr) auto;
    gap:10px;
  }
  .live-card-row{
    grid-template-columns:46px minmax(160px,.9fr) minmax(135px,.68fr) minmax(220px,1fr) minmax(160px,.76fr) auto;
    gap:10px;
  }
}
@media(max-width:1180px){
  .admin-live-card-list .live-card-row,
  .live-card-row{
    grid-template-columns:48px 1fr 1fr;
    align-items:start;
  }
  .live-card-url,
  .live-card-meta,
  .live-card-actions{
    grid-column:auto;
  }
  .live-card-actions{justify-content:flex-start}
}
@media(max-width:980px){
  .login-wrap{
    padding:28px !important;
    gap:24px !important;
  }
  .hero h1{font-size:38px !important}
  .feature-list{grid-template-columns:1fr !important}
  .login-page .premium-login-card{min-height:auto !important}
}
@media(max-width:720px){
  .admin-live-card-list .live-card-row,
  .live-card-row{
    grid-template-columns:1fr;
  }
  .live-card-meta{grid-template-columns:1fr 1fr}
  .live-card-url .url-chip{white-space:normal;word-break:break-word}
  .login-wrap{padding:22px !important}
  .hero h1{font-size:34px !important}
  .premium-login-card{padding:22px !important}
}

/* v11 targeted live action icon alignment fix - no feed/parser logic touched */
.live-card-actions.icon-action-group{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
  align-self:center !important;
  height:100%;
}
.live-card-actions.icon-action-group form{
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:34px !important;
  line-height:0 !important;
}
.live-card-actions .live-action-btn,
.live-card-actions .icon-btn{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  padding:0 !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:0 !important;
  vertical-align:middle !important;
  box-sizing:border-box !important;
  position:relative;
  top:0 !important;
}
.live-card-actions .live-action-btn svg{
  width:17px;
  height:17px;
  display:block;
  fill:currentColor;
  flex:0 0 auto;
}
.live-card-actions .danger-icon:last-child{
  font-size:14px !important;
}
@media(max-width:1180px){
  .live-card-actions.icon-action-group{
    justify-content:flex-start !important;
  }
}

/* v12 targeted Live TV list compact fix - genre hidden from list only, add/edit forms untouched */
.live-card-category .cell-meta{display:none !important;}
.live-card-category .cell-label::after{content:'';}
.live-card-row{
  grid-template-columns:46px minmax(150px,.95fr) minmax(105px,.48fr) minmax(200px,1fr) minmax(132px,.62fr) 118px !important;
  gap:9px !important;
  padding:12px !important;
}
.admin-live-card-list .live-card-row{
  grid-template-columns:46px minmax(140px,.74fr) minmax(145px,.82fr) minmax(105px,.46fr) minmax(200px,.98fr) minmax(132px,.62fr) 118px !important;
  gap:9px !important;
  padding:12px !important;
}
.live-card-row .cell-title{font-size:13.5px !important;line-height:1.3 !important;}
.live-card-row .cell-meta{font-size:11.5px !important;line-height:1.38 !important;}
.live-card-url .url-chip{padding:10px 12px !important;font-size:12px !important;}
.live-card-meta{grid-template-columns:auto auto auto !important;gap:8px !important;}
.live-card-meta .duration-title{font-size:13px !important;}
.live-card-actions.icon-action-group{width:118px !important;min-width:118px !important;}
@media(max-width:1420px){
  .live-card-row,
  .admin-live-card-list .live-card-row{
    grid-template-columns:44px minmax(135px,.8fr) minmax(110px,.55fr) minmax(180px,1fr) minmax(128px,.68fr) 112px !important;
  }
  .admin-live-card-list .live-card-row{
    grid-template-columns:44px minmax(125px,.68fr) minmax(135px,.76fr) minmax(105px,.45fr) minmax(180px,.94fr) minmax(128px,.68fr) 112px !important;
  }
  .live-card-actions.icon-action-group{width:112px !important;min-width:112px !important;gap:6px !important;}
}
@media(max-width:1180px){
  .admin-live-card-list .live-card-row,
  .live-card-row{
    grid-template-columns:48px 1fr 1fr !important;
  }
  .live-card-actions.icon-action-group{width:auto !important;min-width:0 !important;}
}
@media(max-width:720px){
  .admin-live-card-list .live-card-row,
  .live-card-row{grid-template-columns:1fr !important;}
}

/* v13 targeted Live TV list fix - category removed from list only, stream link moved into its place */
.live-card-category{
  display:none !important;
}
.live-card-row{
  grid-template-columns:46px minmax(190px,1.05fr) minmax(270px,1.25fr) minmax(245px,.9fr) 120px !important;
  gap:12px !important;
  align-items:center !important;
}
.admin-live-card-list .live-card-row{
  grid-template-columns:46px minmax(180px,.85fr) minmax(220px,1fr) minmax(290px,1.25fr) minmax(245px,.9fr) 120px !important;
  gap:12px !important;
  align-items:center !important;
}
.live-card-url{
  min-width:0 !important;
}
.live-card-url .url-chip{
  width:100% !important;
  max-width:100% !important;
  padding:10px 12px !important;
  font-size:12px !important;
  line-height:1.35 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.live-card-meta{
  display:grid !important;
  grid-template-columns:minmax(52px,auto) minmax(74px,auto) minmax(82px,auto) !important;
  gap:12px !important;
  align-items:center !important;
  justify-content:start !important;
  min-width:0 !important;
}
.live-card-meta > div{
  min-width:0 !important;
}
.live-card-meta .badge{
  white-space:nowrap !important;
}
.live-card-actions.icon-action-group{
  width:120px !important;
  min-width:120px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
}
.live-card-actions.icon-action-group form{
  flex:0 0 auto !important;
}
.live-card-actions .live-action-btn,
.live-card-actions .icon-btn{
  flex:0 0 34px !important;
}
@media(max-width:1420px){
  .live-card-row{
    grid-template-columns:44px minmax(170px,.95fr) minmax(230px,1.1fr) minmax(230px,.88fr) 116px !important;
    gap:10px !important;
  }
  .admin-live-card-list .live-card-row{
    grid-template-columns:44px minmax(160px,.78fr) minmax(190px,.92fr) minmax(245px,1.08fr) minmax(230px,.88fr) 116px !important;
    gap:10px !important;
  }
  .live-card-meta{
    gap:9px !important;
  }
  .live-card-actions.icon-action-group{
    width:116px !important;
    min-width:116px !important;
    gap:7px !important;
  }
}
@media(max-width:1180px){
  .admin-live-card-list .live-card-row,
  .live-card-row{
    grid-template-columns:48px 1fr 1fr !important;
    align-items:start !important;
  }
  .live-card-url,.live-card-meta,.live-card-actions.icon-action-group{
    grid-column:auto !important;
  }
  .live-card-actions.icon-action-group{
    width:auto !important;
    min-width:0 !important;
    justify-content:flex-start !important;
  }
}
@media(max-width:720px){
  .admin-live-card-list .live-card-row,
  .live-card-row{
    grid-template-columns:1fr !important;
  }
  .live-card-meta{
    grid-template-columns:1fr 1fr !important;
  }
  .live-card-url .url-chip{
    white-space:normal !important;
    word-break:break-word !important;
  }
}

/* Professional compact video-count badge + merged feed/user-feed UI - v12 */
.showcase-video-count{
  flex:0 0 auto !important;
  min-width:48px !important;
  height:38px !important;
  padding:0 9px !important;
  border-radius:12px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  line-height:1 !important;
  text-align:center !important;
  white-space:nowrap !important;
}
.showcase-video-count .video-count-icon{
  width:16px;
  height:16px;
  flex:0 0 16px;
  fill:currentColor;
  opacity:.9;
}
.showcase-video-count strong{
  display:inline !important;
  margin:0 !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  font-variant-numeric:tabular-nums;
}
.user-feed-filter{margin-bottom:18px !important}
.selected-feed-list{margin-top:0}
@media(max-width:720px){
  .showcase-url-with-count{
    align-items:center !important;
    flex-direction:row !important;
  }
  .showcase-video-count{
    min-width:48px !important;
    width:auto !important;
    justify-content:center !important;
  }
}

/* Keep password fields fully masked without custom or native reveal controls. */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear{
  display:none !important;
}


/* Client-only account alignment + Channel Feed header actions - v13 */
.client-account-row{
  grid-template-columns:54px minmax(190px,1.2fr) minmax(170px,1fr) 150px minmax(210px,1.1fr) 244px !important;
}
.client-account-row > div{
  min-width:0;
}
.client-account-row .account-main,
.client-account-row .account-channel,
.client-account-row .account-status,
.client-account-row .account-feed{
  align-self:center;
}
.client-account-row .account-actions{
  width:244px;
  display:grid;
  grid-template-columns:repeat(6,34px);
  gap:8px;
  justify-content:end;
  align-items:center;
}
.client-account-row .account-actions > form{
  width:34px;
  height:34px;
}
.channel-feed-link-actions{
  justify-content:flex-end;
}
@media(max-width:1380px){
  .client-account-row{
    grid-template-columns:48px minmax(155px,1fr) minmax(145px,.95fr) 138px minmax(165px,.9fr) 244px !important;
  }
}
@media(max-width:1120px){
  .client-account-row{
    grid-template-columns:48px 1fr 1fr !important;
    align-items:start;
  }
  .client-account-row .account-status,
  .client-account-row .account-feed,
  .client-account-row .account-actions{
    grid-column:auto;
  }
  .client-account-row .account-actions{
    width:auto;
    justify-content:start;
  }
}
@media(max-width:720px){
  .client-account-row{
    grid-template-columns:1fr !important;
  }
  .client-account-row .account-actions{
    width:100%;
    grid-template-columns:repeat(6,34px);
    justify-content:start;
  }
}