*{box-sizing:border-box}
:root{
  --logo-size-desktop:146px;
  --logo-size-mobile:126px;
  --logo-size:var(--logo-size-desktop);
  --logo-height:clamp(34px,calc(var(--logo-size) / 3.05),54px);
  --bg:#08090b;
  --bg-rgb:8,9,11;
  --bg-2:#111318;
  --panel:#16181f;
  --panel-2:#1d2028;
  --line:#2b303b;
  --text:#f4f6fb;
  --muted:#a3abb9;
  --soft:#7f8795;
  --accent:#e7a526;
  --accent-rgb:231,165,38;
  --accent-2:#35d6ff;
  --accent-2-rgb:53,214,255;
  --danger:#df4b54;
  --ok:#4ed58a;
  --shadow:0 22px 70px rgba(0,0,0,.45);
}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  background:
    radial-gradient(circle at 78% 8%,rgba(var(--accent-rgb),.14),transparent 30%),
    radial-gradient(circle at 18% 0,rgba(var(--accent-2-rgb),.12),transparent 28%),
    linear-gradient(180deg,var(--bg) 0,var(--bg-2) 42%,var(--bg) 100%);
  color:var(--text);
}
a{color:inherit}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit}
.topbar{
  position:sticky;
  top:0;
  z-index:20;
  height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:0 4vw;
  background:rgba(var(--bg-rgb),.78);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:max-content}
.brand.logo-only{gap:0}
.brand.logo-only .brand-name{display:none}
.brand-mark{font-size:var(--logo-height);line-height:1;color:var(--accent);display:inline-flex;align-items:center;justify-content:center;min-width:var(--logo-height);height:var(--logo-height)}
.brand-mark.has-image{color:inherit}
.brand-mark.has-image{min-width:var(--logo-size);width:var(--logo-size);height:var(--logo-height)}
.brand-logo{display:block;width:100%;height:100%;object-fit:contain}
.brand-name,.topbar strong{font-size:26px;font-weight:850;color:var(--text);letter-spacing:0}
.topbar nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-left:auto;justify-content:flex-end}
.topbar nav a,.pill-link{
  color:var(--text);
  text-decoration:none;
  padding:10px 13px;
  border-radius:999px;
  font-size:14px;
}
.topbar nav a:hover,.pill-link:hover{background:rgba(255,255,255,.08);color:#fff}
.topbar nav.marketing-nav{flex-wrap:nowrap}
.topbar .nav-menu{position:relative;display:flex;align-items:center}
.topbar .nav-menu-trigger{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.topbar .nav-menu-trigger:after{
  content:"";
  width:7px;
  height:7px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  opacity:.72;
}
.topbar .nav-submenu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:60;
  min-width:190px;
  display:grid;
  gap:4px;
  padding:8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(12,14,19,.98);
  box-shadow:0 22px 70px rgba(0,0,0,.5);
  opacity:0;
  pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .16s ease,transform .16s ease;
}
.topbar .nav-submenu:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-10px;
  height:10px;
}
.topbar .nav-menu:hover .nav-submenu,
.topbar .nav-menu:focus-within .nav-submenu{
  opacity:1;
  pointer-events:auto;
  transform:none;
}
.topbar .nav-submenu a{
  display:flex;
  align-items:center;
  min-height:40px;
  border-radius:8px;
  white-space:nowrap;
}
.topbar nav a.nav-app-link{
  margin-left:8px;
  border:1px solid rgba(var(--accent-2-rgb),.32);
  background:rgba(var(--accent-2-rgb),.08);
}
.topbar nav a[data-admin-link]{color:var(--accent)}
.mobile-menu-toggle{
  display:none;
  width:42px;
  height:42px;
  padding:0;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  place-items:center;
}
.mobile-menu-toggle span{
  display:block;
  width:18px;
  height:2px;
  margin:3px auto;
  border-radius:999px;
  background:#fff;
  transition:transform .18s ease,opacity .18s ease;
}
.mobile-nav-open .mobile-menu-toggle span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.mobile-nav-open .mobile-menu-toggle span:nth-child(2){opacity:0}
.mobile-nav-open .mobile-menu-toggle span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,520px);
  gap:42px;
  align-items:center;
  min-height:560px;
  padding:72px 5vw 50px;
  overflow:hidden;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(var(--bg-rgb),.98) 0,rgba(var(--bg-rgb),.74) 48%,rgba(var(--bg-rgb),.28) 100%),
    radial-gradient(circle at 82% 48%,rgba(var(--accent-rgb),.2),transparent 34%);
  pointer-events:none;
}
.hero>*{position:relative;z-index:1}
.hero h1{font-size:clamp(40px,6vw,78px);line-height:.95;margin:0 0 18px;max-width:840px;letter-spacing:0}
.hero p{font-size:20px;line-height:1.55;color:#cfd5df;max-width:720px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.conversion-steps{
  display:grid;
  grid-template-columns:repeat(5,minmax(130px,1fr));
  gap:10px;
  padding:0;
  margin:22px 0 0;
  list-style:none;
}
.conversion-steps li{
  position:relative;
  min-height:104px;
  padding:14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:8px;
  background:rgba(255,255,255,.045);
}
.conversion-steps li:before{
  content:counter(list-item);
  display:inline-grid;
  place-items:center;
  width:24px;
  height:24px;
  margin-bottom:10px;
  border-radius:999px;
  background:var(--accent);
  color:#101010;
  font-weight:900;
  font-size:12px;
}
.conversion-steps strong{display:block;margin-bottom:5px}
.conversion-steps span{display:block;color:var(--muted);font-size:13px;line-height:1.35}
.hero-flow{max-width:900px}
.hero-mosaic{
  display:grid;
  grid-template-columns:repeat(3,minmax(82px,1fr));
  gap:14px;
  transform:perspective(900px) rotateY(-8deg);
}
.poster-tile{
  min-height:150px;
  aspect-ratio:2/3;
  border:1px solid rgba(255,255,255,.1);
  border-radius:8px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.02)),
    linear-gradient(180deg,#293241,#11151c);
  box-shadow:var(--shadow);
  overflow:hidden;
  position:relative;
  color:inherit;
  cursor:pointer;
  display:block;
  text-decoration:none;
  transition:filter .16s ease, box-shadow .16s ease, outline-color .16s ease;
}
.poster-tile:hover,.poster-tile:focus-visible{filter:brightness(1.08);outline:2px solid rgba(var(--accent-rgb),.72);outline-offset:3px}
.poster-tile:after{
  content:attr(data-label);
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  font-size:12px;
  color:#fff;
  text-shadow:0 2px 10px #000;
}
.poster-tile:nth-child(2n){transform:translateY(26px);background:linear-gradient(145deg,rgba(var(--accent-rgb),.46),rgba(var(--bg-rgb),.92))}
.poster-tile:nth-child(3n){background:linear-gradient(145deg,rgba(var(--accent-2-rgb),.35),rgba(var(--bg-rgb),.96))}
.poster-tile:nth-child(5){transform:translateY(48px)}
.button,button{
  border:1px solid var(--accent);
  border-radius:999px;
  padding:12px 18px;
  background:var(--accent);
  color:#121212;
  font-weight:800;
  cursor:pointer;
  text-decoration:none;
}
button:hover,.button:hover{filter:brightness(1.08)}
.secondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}
input,select,textarea{
  width:100%;
  border-radius:8px;
  border:1px solid var(--line);
  padding:12px 13px;
  background:var(--bg-2);
  color:#fff;
  outline:none;
}
textarea{min-height:92px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:rgba(var(--accent-rgb),.75);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12)}
.section-kicker{margin:0 5vw 10px;color:var(--accent);font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.08em}
.section-kicker--flush{margin-left:0}
.section-kicker--compact{margin:0}
.section-title{margin:0 5vw 18px;font-size:30px}
.pricing,.portal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:18px;
  padding:24px 5vw;
}
.admin-overview-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(180px,1fr));
  gap:18px;
  align-items:start;
  grid-auto-rows:min-content;
  padding:0;
}
.admin-overview-grid .card,
.admin-overview-grid .mini-card{
  align-self:start;
}
.overview-stat-card{
  min-height:0;
  padding:20px 22px;
}
.overview-stat-card h2{
  margin:0 0 14px;
  font-size:clamp(26px,2.4vw,34px);
  line-height:1.1;
}
.overview-stat-card p{
  margin:0;
}
.overview-download-card{
  grid-column:1 / -1;
}
.overview-download-card .settings-status{
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
}
.card,.compare,.faq,.terms,.panel,.mini-card{
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  padding:22px;
  box-shadow:0 12px 40px rgba(0,0,0,.18);
}
.card:hover,.mini-card:hover{border-color:rgba(var(--accent-rgb),.35)}
.card.muted{opacity:.88}
.enterprise-card{
  border-color:rgba(var(--accent-rgb),.32);
  background:
    linear-gradient(180deg,rgba(var(--accent-rgb),.12),rgba(255,255,255,.035)),
    linear-gradient(145deg,rgba(var(--accent-2-rgb),.08),transparent 42%);
}
.enterprise-card .price{font-size:34px;color:var(--accent)}
.card h2,.panel h2{margin-top:0}
.price{font-size:42px;font-weight:900;margin:8px 0;color:#fff}
.buy,.stack,form{display:grid;gap:10px}
.compare,.faq,.terms,.narrow{margin:24px 5vw}
.compare,.faq,.terms{max-width:none}
.compare,.faq,.terms,.pricing{content-visibility:auto;contain-intrinsic-size:1px 720px}
.narrow{max-width:760px}
.feature-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
  margin:20px 5vw;
}
.feature-card{min-height:130px}
.feature-card strong{display:block;font-size:18px;margin-bottom:8px}
.toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}
.inline-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;align-items:end}
.compact-toolbar{gap:8px;justify-content:flex-start}
.compact-toolbar button{padding:8px 10px;font-size:12px}
.section-head{display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap}
.section-head .section-kicker,.media-browser-hero .section-kicker{margin:0 0 8px}
table{width:100%;border-collapse:collapse}
td,th{padding:12px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top}
th{color:#dfe4ec;font-size:13px;text-transform:uppercase}
pre{white-space:pre-wrap;background:var(--bg-2);padding:16px;border-radius:8px}
.table-wrap{overflow:auto}
.proof-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  margin-top:18px;
}
.proof-card{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:8px;
  background:rgba(255,255,255,.045);
}
.proof-card img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#090b0f;
}
.proof-card h3,.proof-card p{margin:14px}
.faq-inline{margin:18px 0;padding:0;background:transparent;border:0;box-shadow:none}
.admin-shell,.account-shell{
  display:grid;
  grid-template-columns:250px 1fr;
  min-height:calc(100vh - 72px);
}
.side-nav{
  background:rgba(9,10,13,.86);
  border-right:1px solid rgba(255,255,255,.08);
  padding:20px 14px;
  position:sticky;
  top:72px;
  height:calc(100vh - 72px);
}
.side-nav:before{content:"Browse";display:block;color:var(--soft);font-size:12px;text-transform:uppercase;letter-spacing:.08em;padding:8px 12px}
.side-nav a,.side-nav button{
  display:block;
  width:100%;
  text-align:left;
  margin:4px 0;
  padding:11px 12px;
  border-radius:8px;
  background:transparent;
  border:0;
  color:#cfd5df;
  text-decoration:none;
}
.side-nav a.active,.side-nav button.active,.side-nav a:hover,.side-nav button:hover{
  background:rgba(255,255,255,.09);
  color:#fff;
}
.side-nav a.active,.side-nav button.active{box-shadow:inset 3px 0 0 var(--accent)}
.admin-content,.account-content{padding:26px 4vw 42px;min-width:0}
.admin{display:grid;gap:20px;margin:0;min-height:100vh}
.admin>#login{max-width:520px;margin:12vh auto}
#dashboard>.toolbar{padding:18px 4vw;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(8,9,11,.72);position:sticky;top:0;z-index:10}
#dashboard>.toolbar h1{margin:0}
.inline-check{display:flex;align-items:center;gap:8px;color:#d6dce6}
.inline-check input{width:auto}
.licence-output-label{display:grid;gap:8px;margin-top:14px;color:#d6dce6}
#manualKey{font-family:Consolas,monospace;font-size:16px;color:#7dffb2}
.cookie-banner{
  position:fixed;
  left:20px;
  right:20px;
  bottom:20px;
  z-index:30;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  background:rgba(18,20,26,.94);
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  padding:18px;
  box-shadow:var(--shadow);
}
.cookie-banner p{margin:.4rem 0 0;color:#cfd5df}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.account-hero{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
  gap:18px;
  align-items:start;
}
.account-hero #accountPanel{
  min-height:280px;
  background:
    linear-gradient(90deg,rgba(18,20,26,.96),rgba(18,20,26,.74)),
    radial-gradient(circle at 80% 30%,rgba(var(--accent-rgb),.18),transparent 30%);
}
#accountPanel h1{font-size:clamp(34px,4vw,58px);line-height:1;margin:0 0 12px}
#loginPanel,#registerPanel{position:sticky;top:92px}
.legal-doc{max-width:980px;margin:32px auto;padding:0 5vw;line-height:1.65;color:#e8e8e8}
.legal-doc h1,.legal-doc h2{line-height:1.2}
.warning{border-left:4px solid #ffcc00;padding:12px 16px;background:#211d0f;color:#fff}
.fineprint,.meta{color:var(--muted);font-size:13px}
.status{color:#e7e7e7}
.mini-card{background:rgba(255,255,255,.045);border-radius:9px}
.mini-card p{margin:.45rem 0;color:#d8dee8}
.mini-card strong{display:block;font-size:16px}
.pairing-card{display:grid;gap:12px;justify-items:start}
.pairing-qr{display:grid;place-items:center;width:min(240px,100%);padding:12px;border-radius:12px;background:#fff;border:1px solid rgba(255,255,255,.18)}
.pairing-qr svg{display:block;width:100%;height:auto}
.pairing-code{display:inline-block;margin:.65rem 0;padding:12px 14px;border-radius:10px;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.14);font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:clamp(18px,4vw,24px);letter-spacing:.08em;color:#fff}
.link-card{
  color:inherit;
  cursor:pointer;
  display:block;
  position:relative;
  text-decoration:none;
  transition:transform .16s ease,border-color .16s ease,background .16s ease;
}
.link-card:hover,.link-card:focus-visible{
  background:rgba(255,255,255,.07);
  border-color:rgba(var(--accent-rgb),.48);
  outline:2px solid rgba(var(--accent-rgb),.55);
  outline-offset:3px;
  transform:translateY(-2px);
}
.card-link-label{
  color:var(--accent);
  display:inline-flex;
  font-size:13px;
  font-weight:850;
  margin-top:10px;
}
.library-rail{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:12px;
}
.library-tile{
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.16),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  overflow:hidden;
}
.library-tile.active{border-color:rgba(var(--accent-rgb),.72)}
.library-tile button{
  width:100%;
  min-height:124px;
  display:grid;
  gap:8px;
  text-align:left;
  border:0;
  background:
    radial-gradient(circle at 80% 20%,rgba(var(--accent-rgb),.22),transparent 38%),
    rgba(255,255,255,.03);
  color:#fff;
}
.library-tile span,.library-tile small{color:var(--muted)}
.library-tile strong{font-size:21px}
.media-browser-panel{padding:0;overflow:hidden}
.media-browser-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,440px);
  gap:18px;
  align-items:end;
  padding:26px;
  background:
    linear-gradient(90deg,rgba(12,15,22,.98),rgba(12,15,22,.74)),
    radial-gradient(circle at 82% 18%,rgba(var(--accent-rgb),.24),transparent 34%);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.media-browser-hero h2{font-size:clamp(30px,4vw,52px);margin:0 0 8px}
.media-search{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
}
.filter-rail{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding:16px 22px 0;
}
.chip{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#dce3ee;
  border-radius:999px;
  padding:9px 13px;
}
.chip.active,.chip:hover{border-color:rgba(var(--accent-rgb),.66);color:#fff;background:rgba(var(--accent-rgb),.14)}
.media-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(178px,1fr));
  gap:18px;
  padding:22px;
}
.media-card{
  min-width:0;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 14px 42px rgba(0,0,0,.2);
}
.media-card:hover{border-color:rgba(var(--accent-rgb),.45);transform:translateY(-2px)}
.poster-frame{
  position:relative;
  width:100%;
  aspect-ratio:2/3;
  border:0;
  border-radius:0;
  overflow:hidden;
  padding:0;
  display:grid;
  place-items:center;
  background:
    linear-gradient(145deg,rgba(var(--accent-rgb),.36),rgba(var(--bg-rgb),.9)),
    #171c26;
  color:#fff;
}
.poster-frame img{width:100%;height:100%;object-fit:cover;display:block}
.poster-frame>span:not(.play-float){font-size:34px;font-weight:900;letter-spacing:.03em}
.watch-progress{
  position:absolute;
  left:0;
  right:auto;
  bottom:0;
  width:var(--progress,0%);
  height:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  box-shadow:0 0 18px rgba(var(--accent-rgb),.45);
}
.play-float{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  text-align:center;
  padding:9px 10px;
  border-radius:8px;
  background:rgba(0,0,0,.72);
  opacity:0;
  transform:translateY(6px);
  transition:.16s ease;
}
.media-card:hover .play-float,.poster-frame:focus .play-float{opacity:1;transform:none}
.media-card-body{display:grid;gap:6px;padding:12px}
.media-card-body strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-card-body p{margin:0;color:#dce3ee;font-size:13px}
.media-card-body .meta{
  display:block;
  min-height:32px;
  overflow:hidden;
}
.media-card-grid.media-row-browser{
  grid-template-columns:1fr;
  gap:24px;
}
.media-rail-section{
  display:grid;
  gap:12px;
  min-width:0;
}
.media-rail-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:end;
}
.media-rail-head h3{
  margin:0;
  font-size:22px;
}
.media-rail-head span{
  color:var(--muted);
  font-size:13px;
}
.media-rail{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(178px,212px);
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  padding:2px 2px 12px;
  scrollbar-color:rgba(var(--accent-rgb),.45) rgba(255,255,255,.06);
}
.media-rail .media-card{
  scroll-snap-align:start;
}
.show-card .show-poster{
  cursor:default;
}
.show-card .play-float{
  opacity:1;
  transform:none;
}
.collection-poster{
  aspect-ratio:16/9;
}
.collection-card .media-card-body strong{
  white-space:normal;
}
.season-picker{
  display:grid;
  gap:6px;
  margin-top:4px;
  color:#dce3ee;
  font-size:12px;
  text-transform:uppercase;
}
.season-picker select{
  width:100%;
  min-height:38px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:#111722;
  color:#fff;
  padding:8px 10px;
}
.episode-list{
  list-style:none;
  display:grid;
  gap:8px;
  max-height:226px;
  overflow:auto;
  margin:8px 0 0;
  padding:0;
}
.episode-list li{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  padding:8px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  background:rgba(255,255,255,.04);
}
.episode-list strong{
  display:block;
  font-size:13px;
  line-height:1.25;
  white-space:normal;
}
.episode-list small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
}
.episode-list button{
  padding:7px 9px;
  font-size:12px;
}
.device-card{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.device-card.warn{border-color:rgba(255,196,87,.75);background:rgba(255,196,87,.08)}
.security-alert{border:1px solid rgba(255,196,87,.55);background:rgba(255,196,87,.1);border-radius:9px;padding:14px;color:#fff4d6}
.security-alert p{margin:.35rem 0 0;color:#ffe5a8}
.user-actions{display:flex;gap:8px;flex-wrap:wrap;min-width:320px}
.user-actions button{padding:8px 10px;font-size:12px}
.site-footer{
  margin:46px 5vw 24px;
  padding:24px 0 0;
  border-top:1px solid rgba(255,255,255,.1);
  color:#cbd2dc;
  display:grid;
  gap:22px;
}
.footer-main{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(0,2.6fr);
  gap:28px;
  align-items:start;
}
.footer-brand{
  display:grid;
  gap:12px;
  max-width:420px;
}
.footer-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(130px,1fr));
  gap:20px;
}
.site-footer nav{display:grid}
.footer-group{
  display:grid;
  gap:8px;
  align-content:start;
}
.footer-group h2{
  margin:0 0 2px;
  color:#fff;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.footer-group a{
  color:#cbd2dc;
  text-decoration:none;
}
.footer-group a:hover,
.footer-group a:focus{
  color:#fff;
  text-decoration:underline;
}
.footer-more{
  margin-top:2px;
}
.footer-more summary{
  cursor:pointer;
  color:var(--accent);
  font-weight:800;
}
.footer-more div{
  display:grid;
  gap:8px;
  margin-top:8px;
}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.site-footer p{margin:0}
.site-footer strong,.logo-preview{display:flex;align-items:center;gap:10px}
.social-links{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.social-button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:#fff;
  font-weight:800;
  text-decoration:none;
}
.social-button span{
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:999px;
  background:var(--accent);
  color:#111;
  font-size:14px;
  font-weight:950;
}
.social-button:hover{border-color:rgba(var(--accent-rgb),.58);background:rgba(var(--accent-rgb),.12)}
.download-page{box-sizing:border-box;min-height:calc(100vh - 72px);display:grid;grid-template-columns:minmax(0,1fr);align-items:start;justify-items:center;padding:42px 5vw}
.download-hero{box-sizing:border-box;width:min(1180px,100%);max-width:100%;min-width:0;background:rgba(18,20,26,.86);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:34px;box-shadow:0 24px 70px rgba(0,0,0,.28)}
.download-hero h1{max-width:100%;overflow-wrap:break-word;font-size:clamp(34px,5vw,64px);margin:0 0 14px}
.download-copy{color:#d6dce6;font-size:17px;line-height:1.65}
.download-section{margin-top:28px}
.download-section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:14px}
.download-section-head h2{margin:0;font-size:clamp(24px,3vw,34px)}
.download-section-head p{margin:0;color:var(--muted);max-width:520px}
.download-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:22px}
.download-option{display:grid;gap:10px;align-content:start;border:1px solid rgba(255,255,255,.1);border-radius:9px;background:rgba(255,255,255,.045);padding:18px}
.download-option h2{margin:0;font-size:24px}
.download-option h3{margin:0;font-size:22px}
.download-option p{margin:0;color:#d6dce6}
.download-option .hero-actions{margin-top:6px}
.download-primary[disabled]{opacity:.55;cursor:not-allowed}
.app-download-options{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.app-download-option{min-height:204px}
.store-badge-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.store-badge-link{appearance:none;display:inline-grid;place-items:center;width:216px;max-width:100%;height:64px;padding:0;border:0;border-radius:12px;background:transparent;box-shadow:0 12px 30px rgba(0,0,0,.28);text-decoration:none;cursor:pointer}
.store-badge-link img{display:block;width:216px;max-width:100%;height:64px;object-fit:contain;border-radius:12px}
.store-badge-coming{opacity:.9;filter:saturate(.85)}
.store-badge-coming:hover,.store-badge-link:focus{transform:translateY(-1px);box-shadow:0 16px 34px rgba(0,0,0,.34)}
.homepage-app-strip{display:grid;gap:12px;margin-top:20px}
.homepage-app-strip--hero{max-width:760px}
.homepage-app-strip--bottom{margin-top:42px}
.homepage-app-strip h2,.homepage-app-strip p{margin:0}
.homepage-app-badges{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.store-badge-item{display:grid;gap:7px;align-items:start}
.store-badge-caption{color:#cfd7e6;font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.homepage-store-badge{box-shadow:0 14px 40px rgba(0,0,0,.32)}
.store-coming-modal[hidden]{display:none}
.store-coming-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:20px}
.store-coming-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.72)}
.store-coming-card{position:relative;width:min(420px,100%);display:grid;gap:12px;padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:var(--panel);box-shadow:0 28px 80px rgba(0,0,0,.5)}
.store-coming-card h2,.store-coming-card p{margin:0}
.form-subsection{border-top:1px solid rgba(255,255,255,.1);padding-top:14px}
.form-subsection h3{margin:0 0 4px}
@media (max-width: 620px){
  .download-page{padding:24px 14px}
  .download-page{display:block;width:100%!important;max-width:100vw!important;overflow:hidden}
  .download-hero{width:calc(100vw - 28px)!important;max-width:calc(100vw - 28px)!important;min-width:0}
  .download-section,.download-options,.download-option{width:100%;max-width:100%;min-width:0}
  .download-hero{padding:20px}
  .download-hero h1{font-size:clamp(30px,9vw,38px);line-height:1.08}
  .download-copy,.download-section-head p,.download-option p,.download-option .meta{width:100%;max-width:calc(100vw - 70px)!important;overflow-wrap:anywhere}
  .download-option .button{box-sizing:border-box}
  .download-section-head{display:grid;align-items:start;gap:8px}
  .download-options{grid-template-columns:1fr}
  .download-option{padding:16px}
  .download-option .button{width:100%;justify-content:center;text-align:center}
  .store-badge-row{align-items:flex-start}
  .store-badge-link{width:min(216px,100%);height:64px;min-height:60px}
  .store-badge-link img{width:100%;height:64px}
  .homepage-app-badges{display:grid;grid-template-columns:1fr;align-items:start}
  .homepage-app-strip--hero{max-width:100%}
}
.troubleshooting-page{width:min(1180px,100%);margin:0 auto;padding:42px 5vw 24px;display:grid;gap:18px}
.troubleshooting-hero{
  padding:34px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:
    linear-gradient(90deg,rgba(18,20,26,.96),rgba(18,20,26,.78)),
    radial-gradient(circle at 82% 18%,rgba(var(--accent-rgb),.18),transparent 34%);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.troubleshooting-hero h1{font-size:clamp(38px,6vw,72px);line-height:1;margin:0 0 12px}
.troubleshooting-hero p{max-width:820px;color:#d6dce6;font-size:18px;line-height:1.65}
.troubleshooting-alert{
  border-radius:10px;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
}
.troubleshooting-alert strong{display:block;margin-bottom:6px;color:#fff}
.troubleshooting-alert p{margin:0;color:#d9e2ef;line-height:1.55}
.info-card{border-left:4px solid var(--accent-2)}
.warning-card{border-left:4px solid #ffcc00;background:rgba(255,204,0,.08)}
.troubleshooting-index{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:12px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  background:rgba(255,255,255,.035);
}
.troubleshooting-index a{
  text-decoration:none;
  color:#dce3ee;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  padding:9px 12px;
  background:rgba(255,255,255,.045);
  font-size:13px;
}
.troubleshooting-index a:hover{border-color:rgba(var(--accent-rgb),.65);color:#fff}
.troubleshooting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.troubleshooting-card{
  min-width:0;
  display:grid;
  gap:14px;
  align-content:start;
  padding:22px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 14px 42px rgba(0,0,0,.2);
}
.troubleshooting-card h2{margin:0;font-size:24px}
.troubleshooting-card h3{margin:0 0 8px;font-size:13px;text-transform:uppercase;color:var(--accent);letter-spacing:.08em}
.trouble-block ul,.trouble-block ol,.troubleshooter-panel ol{margin:0;padding-left:20px;color:#dce3ee;line-height:1.6}
.trouble-block li+li,.troubleshooter-panel li+li{margin-top:6px}
.troubleshooting-card pre{
  margin:0;
  overflow:auto;
  border:1px solid rgba(255,255,255,.1);
  background:#070b11;
  color:#d9f4ff;
}
.guided-card{grid-column:1/-1}
.troubleshooter-panel{
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  padding:16px;
  background:rgba(255,255,255,.045);
}
.troubleshooter-panel h3{font-size:16px;text-transform:none;letter-spacing:0;color:#fff}
.troubleshooter-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.troubleshooter-choices button{width:100%}
.guide-page{width:min(1180px,100%);margin:0 auto;padding:42px 5vw 24px;display:grid;gap:18px}
.guide-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,520px);
  gap:24px;
  align-items:center;
  padding:34px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:
    linear-gradient(90deg,rgba(18,20,26,.96),rgba(18,20,26,.78)),
    radial-gradient(circle at 82% 18%,rgba(var(--accent-rgb),.18),transparent 34%);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.guide-hero.compact{grid-template-columns:1fr}
.guide-hero h1{font-size:clamp(38px,6vw,72px);line-height:1;margin:0 0 12px}
.guide-hero p,.guide-article .lead{color:#d6dce6;font-size:18px;line-height:1.65}
.video-frame{
  overflow:hidden;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:#05070a;
  box-shadow:0 18px 50px rgba(0,0,0,.32);
}
.video-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}
.guide-grid,.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.guide-timeline{display:grid;gap:14px}
.guide-section,.blog-card,.guide-article{
  min-width:0;
  padding:22px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 14px 42px rgba(0,0,0,.18);
}
.guide-section h2,.blog-card h2{margin:0 0 10px;font-size:24px}
.guide-section p,.blog-card p,.guide-article p{color:#dce3ee;line-height:1.65}
.guide-section pre{margin-top:14px;background:#070b11;color:#d9f4ff;border:1px solid rgba(255,255,255,.1)}
.guide-callout{border-radius:10px;padding:18px;border:1px solid rgba(255,255,255,.12)}
.guide-callout strong{display:block;margin-bottom:6px}
.blog-card{display:grid;gap:8px;align-content:start}
.blog-card h2 a{text-decoration:none}
.blog-card h2 a:hover{color:var(--accent)}
.keyword-chip{
  display:inline-block;
  margin:4px 6px 0 0;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#dce3ee;
  background:rgba(255,255,255,.045);
  font-size:12px;
}
.article-page{max-width:980px}
.guide-article h1{font-size:clamp(34px,5vw,62px);line-height:1;margin:0 0 12px}
.guide-article .guide-section{box-shadow:none;background:rgba(255,255,255,.025);margin-top:16px}
.logo-upload{display:grid;gap:6px;color:#d6dce6}
.logo-preview{background:#10131a;border:1px solid var(--line);border-radius:8px;padding:12px;min-height:72px}
.range-field{display:grid;gap:8px;color:#d6dce6}
.range-field input[type="range"]{width:100%;accent-color:var(--accent)}
.range-field output{color:var(--muted);font-size:13px}
.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.settings-grid label,.price-row label{display:grid;gap:6px;color:#d6dce6}
.settings-grid .full-field,.settings-grid .form-section-title{grid-column:1/-1}
.compact-form{margin-top:16px;border-top:1px solid rgba(255,255,255,.08);padding-top:16px}
.form-section-title{margin:12px 0 0}
.tab-section[hidden]{display:none!important}
.old-price{color:#888;text-decoration:line-through;font-size:.62em;margin-right:8px}
.sale-badge{display:inline-block;vertical-align:middle;background:#ffcf33;color:#131313;border-radius:999px;padding:5px 8px;font-size:13px;font-weight:900;margin-left:8px}
.price-row{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end}
.price-row .inline-check{align-self:center}
.settings-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:12px 0}
.visit-stats .mini-card strong{font-size:clamp(26px,4vw,38px);line-height:1}
.visit-map-card{
  position:relative;
  margin:16px 0;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  overflow:hidden;
  background:
    radial-gradient(circle at 72% 18%,rgba(var(--accent-2-rgb),.16),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  box-shadow:0 18px 48px rgba(0,0,0,.22);
}
.visit-world-map{
  display:block;
  width:100%;
  min-height:280px;
}
.visit-map-inline{
  position:relative;
  z-index:1;
}
.visit-map-inline svg{
  display:block;
  width:100%;
  height:auto;
  min-height:280px;
  background:#07131f;
  border-radius:28px;
}
.visit-map-inline .world-ocean{
  fill:#07131f;
}
.visit-map-inline .world-graticule path{
  fill:none;
  stroke:rgba(255,255,255,.055);
  stroke-width:1;
}
.visit-map-inline .world-country{
  fill:rgba(255,255,255,.12);
  stroke:rgba(255,255,255,.24);
  stroke-width:.65;
  vector-effect:non-scaling-stroke;
  cursor:help;
  transition:fill .12s ease,stroke .12s ease,filter .12s ease;
}
.visit-map-inline .world-country:hover{
  fill:#d45a00;
  stroke:#fff;
  stroke-width:1.15;
  filter:drop-shadow(0 0 5px rgba(255,185,91,.38));
}
.visit-map-loading{
  display:grid;
  place-items:center;
  width:100%;
  min-height:360px;
  color:#d8dee8;
  font-weight:800;
  background:#07131f;
}
.visit-world-map-pins{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  pointer-events:none;
}
.visit-country-tooltip{
  position:absolute;
  z-index:4;
  transform:translate(-50%,calc(-100% - 12px));
  min-width:max-content;
  max-width:min(260px,calc(100% - 24px));
  padding:8px 11px;
  border:1px solid rgba(var(--accent-rgb),.45);
  border-radius:8px;
  background:rgba(9,12,17,.94);
  color:#fff;
  font-size:13px;
  font-weight:900;
  letter-spacing:0;
  box-shadow:0 12px 34px rgba(0,0,0,.42);
  pointer-events:none;
}
.visit-country-tooltip[hidden]{
  display:none;
}
.visit-country-tooltip:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6px;
  width:10px;
  height:10px;
  transform:translateX(-50%) rotate(45deg);
  border-right:1px solid rgba(var(--accent-rgb),.45);
  border-bottom:1px solid rgba(var(--accent-rgb),.45);
  background:rgba(9,12,17,.94);
}
.visit-point-pulse{
  fill:rgba(var(--accent-rgb),.18);
  stroke:rgba(var(--accent-rgb),.55);
  stroke-width:1.5;
}
.visit-point-dot{
  fill:var(--accent);
  stroke:#fff;
  stroke-width:2;
  filter:drop-shadow(0 0 10px rgba(var(--accent-rgb),.72));
}
.visit-map-empty{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  z-index:3;
  color:#d8dee8;
  font-weight:800;
  pointer-events:none;
}
.current-visits-table .visit-location{font-weight:850;color:#fff}
.current-visits-table .meta{overflow-wrap:anywhere}
.download-signing-panel{
  border:1px solid var(--line);
  border-radius:14px;
  padding:1rem;
  background:rgba(255,255,255,.035);
}
.download-signing-panel h3{
  margin:.1rem 0 .35rem;
}
.signature-hash{
  display:block;
  margin:.45rem 0 0;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  color:var(--text);
}
.warning-text{
  color:#ffd18a;
}
.ops-section{
  display:grid;
  gap:12px;
  margin-top:18px;
}
.ops-section h3{
  margin:0;
}
.operations-kpis{
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.ops-grid{
  padding:18px 0 0;
}
.mini-card.warn{
  border-color:rgba(231,165,38,.44);
  background:linear-gradient(180deg,rgba(231,165,38,.12),rgba(255,255,255,.025));
}
.compact-history{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  display:grid;
  gap:10px;
}
.addon-store-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:18px;
  margin-top:22px;
  align-items:start;
}
.addon-store-card{
  width:100%;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto 1fr;
  overflow:hidden;
  padding:0;
  border:1px solid rgba(255,255,255,.11);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
  color:#fff;
  text-align:left;
  font:inherit;
  font-weight:600;
  box-shadow:0 16px 42px rgba(0,0,0,.22);
  cursor:pointer;
  transition:border-color .16s ease, transform .16s ease, filter .16s ease;
}
.addon-store-card:hover,
.addon-store-card:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(var(--accent-rgb),.45);
  filter:brightness(1.04);
  outline:none;
}
.addon-card-art{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  aspect-ratio:16 / 7;
  min-height:116px;
  overflow:hidden;
  background:
    radial-gradient(circle at 30% 20%,rgba(var(--accent-rgb),.22),transparent 32%),
    radial-gradient(circle at 74% 18%,rgba(var(--accent-2-rgb),.2),transparent 34%),
    linear-gradient(180deg,#1e2530,#07090d);
}
.addon-card-art img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.addon-card-art>span{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(0,0,0,.42);
  color:#fff;
  font-size:28px;
  font-weight:900;
}
.addon-card-body{
  display:grid;
  gap:10px;
  padding:16px;
  min-width:0;
}
.addon-card-title{
  color:#fff;
  font-size:18px;
  line-height:1.18;
  font-weight:900;
}
.addon-card-description{
  color:#c1ccda;
  line-height:1.45;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
}
.addon-card-meta,
.addon-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.addon-card-meta span,
.addon-pill{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#eef3fa;
  font-size:13px;
  font-weight:800;
}
.addon-modal[hidden]{display:none!important}
.addon-modal{
  position:fixed;
  inset:0;
  z-index:120;
  display:grid;
  place-items:center;
  padding:24px;
}
.addon-modal-backdrop{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  border-radius:0;
  background:rgba(0,0,0,.72);
  cursor:pointer;
}
.addon-modal-card{
  position:relative;
  z-index:1;
  width:min(980px,100%);
  max-height:min(86vh,860px);
  overflow:auto;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:linear-gradient(180deg,#171a20,#0c0e12);
  box-shadow:0 28px 90px rgba(0,0,0,.55);
  padding:22px;
}
.addon-modal-close{
  position:absolute;
  top:14px;
  right:14px;
  width:42px;
  height:42px;
  padding:0;
  border-color:rgba(255,255,255,.14);
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:26px;
  line-height:1;
}
.addon-detail-head{
  display:grid;
  grid-template-columns:minmax(220px,360px) 1fr;
  gap:22px;
  align-items:end;
  padding-right:52px;
}
.addon-detail-art{
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  aspect-ratio:16 / 8;
  min-height:180px;
}
.addon-detail-head h3{
  margin:6px 0 8px;
  font-size:clamp(30px,4vw,48px);
  line-height:1.02;
}
.addon-detail-copy{
  margin:18px 0;
  color:#dce4ef;
  line-height:1.65;
}
.addon-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.addon-detail-grid section,
.addon-signature-box{
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  padding:16px;
}
.addon-detail-grid h4{
  margin:0 0 10px;
}
.addon-detail-grid ol{
  margin:0;
  padding-left:20px;
  color:#dce4ef;
  line-height:1.6;
}
.addon-signature-box{
  margin-top:16px;
}
.addon-signature-box code{
  display:block;
  max-width:100%;
  overflow:auto;
  padding:10px;
  border-radius:8px;
  background:#070b11;
  color:#d9f4ff;
  white-space:pre-wrap;
  word-break:break-all;
}
.addon-detail-actions{
  margin-top:16px;
}
body.addon-modal-open{
  overflow:hidden;
}
@media(max-width:760px){
  .addon-store-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .addon-card-art{
    min-height:132px;
  }
  .addon-card-body{
    padding:14px;
  }
  .addon-modal{
    align-items:end;
    padding:12px;
  }
  .addon-modal-card{
    width:100%;
    max-height:88vh;
    padding:18px;
    border-radius:12px 12px 10px 10px;
  }
  .addon-detail-head,
  .addon-detail-grid{
    grid-template-columns:1fr;
  }
  .addon-detail-head{
    padding-right:48px;
  }
  .addon-detail-art{
    min-height:150px;
  }
}
@media(max-width:960px){
  .hero,.account-hero{grid-template-columns:1fr}
  .hero{min-height:auto;padding-top:44px}
  .hero-mosaic{transform:none}
  .admin-overview-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .admin-shell,.account-shell{grid-template-columns:1fr}
  .side-nav{
    position:sticky;
    top:72px;
    z-index:12;
    height:auto;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
    display:flex;
    overflow:auto;
    gap:6px;
    padding:10px 12px;
    background:rgba(8,9,11,.94);
    scrollbar-width:none;
    scroll-snap-type:x proximity;
  }
  .side-nav::-webkit-scrollbar{display:none}
  .side-nav:before{display:none}
  .side-nav a,.side-nav button{white-space:nowrap;scroll-snap-align:start;min-width:max-content;text-align:center}
  .admin-content,.account-content{padding:18px}
  .media-browser-hero{grid-template-columns:1fr;padding:20px}
  .media-card-grid{grid-template-columns:repeat(auto-fill,minmax(142px,1fr));padding:16px}
  .cookie-banner{display:grid}
  #loginPanel,#registerPanel{position:static}
}
@media(max-width:620px){
  body{font-size:15px}
  .topbar{
    height:64px;
    align-items:center;
    padding:10px 14px;
    display:flex;
    gap:10px;
  }
  .brand{min-width:0;gap:9px}
  .brand-name,.topbar strong{font-size:21px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-menu-toggle{display:grid;margin-left:auto;flex:0 0 42px}
  .topbar nav{
    position:fixed;
    left:12px;
    right:12px;
    top:74px;
    z-index:25;
    display:grid;
    grid-template-columns:1fr;
    gap:6px;
    max-height:0;
    overflow:hidden;
    padding:0 10px;
    opacity:0;
    pointer-events:none;
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    background:rgba(10,12,17,.98);
    box-shadow:0 22px 70px rgba(0,0,0,.55);
    backdrop-filter:blur(18px);
    transform:translateY(-8px);
    transition:max-height .2s ease,opacity .18s ease,transform .18s ease,padding .18s ease;
  }
  .mobile-nav-open .topbar nav{
    max-height:calc(100vh - 94px);
    overflow:auto;
    padding:10px;
    opacity:1;
    pointer-events:auto;
    transform:none;
  }
  .topbar nav a,.pill-link{
    display:flex;
    min-height:44px;
    align-items:center;
    border-radius:8px;
    padding:12px;
    background:rgba(255,255,255,.045);
  }
  .hero{padding:30px 18px 22px;gap:22px}
  .hero h1{font-size:clamp(34px,12vw,48px);line-height:1}
  .hero p{font-size:16px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .conversion-steps{grid-template-columns:1fr;gap:8px}
  .conversion-steps li{min-height:auto}
  .button,button{width:100%;min-height:44px;text-align:center}
  .hero-mosaic{grid-template-columns:repeat(2,1fr);gap:10px}
  .poster-tile{min-height:96px}
  .poster-tile:nth-child(n){transform:none}
  .pricing,.portal-grid{padding:14px 14px;grid-template-columns:1fr}
  .compare,.faq,.terms,.feature-row,.section-kicker,.section-title{margin-left:18px;margin-right:18px}
  .card,.compare,.faq,.terms,.panel,.mini-card{padding:16px;border-radius:9px}
  .feature-row{grid-template-columns:1fr}
  .section-title{font-size:24px;line-height:1.15}
  .price{font-size:34px}
  .admin-shell,.account-shell{min-height:0}
  .side-nav{top:64px;padding:8px 10px}
  .side-nav a,.side-nav button{
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.045);
  }
  .side-nav a.active,.side-nav button.active{box-shadow:none;border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.14)}
  .admin-content,.account-content{padding:14px 12px 28px}
  #dashboard>.toolbar{position:static;padding:16px}
  #dashboard>.toolbar h1{font-size:26px}
  .account-hero{display:grid;gap:12px}
  #accountPanel h1{font-size:34px}
  .toolbar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .compact-toolbar{display:flex}
  .inline-form,.settings-grid,.price-row,.media-search{grid-template-columns:1fr}
  .settings-status{grid-template-columns:1fr}
  .library-rail{grid-template-columns:1fr}
  .library-tile button{min-height:94px}
  .media-browser-hero{padding:16px}
  .media-browser-hero h2{font-size:32px}
  .filter-rail{padding:12px 14px 0;overflow:auto;flex-wrap:nowrap;scrollbar-width:none}
  .filter-rail::-webkit-scrollbar{display:none}
  .chip{white-space:nowrap;min-width:max-content}
  .media-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px}
  .media-card-grid.media-row-browser{grid-template-columns:1fr;gap:20px}
  .media-rail-head{align-items:flex-start}
  .media-rail{grid-auto-columns:minmax(154px,72vw);gap:12px}
  .episode-list li{grid-template-columns:1fr}
  .episode-list button{width:100%}
  .media-card-body{padding:10px}
  .media-card-body strong{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .play-float{opacity:1;transform:none}
  .table-wrap{
    margin:0 -16px;
    padding:0 16px 8px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  table{min-width:680px}
  td,th{padding:10px}
  .user-actions{min-width:0;display:grid;grid-template-columns:1fr}
  .user-actions button{width:100%}
  .cookie-banner{left:10px;right:10px;bottom:10px;padding:14px}
  .cookie-actions{display:grid}
  .site-footer{margin:28px 18px 18px;gap:18px}
  .footer-main{grid-template-columns:1fr;gap:20px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:18px 14px}
  .footer-bottom{align-items:flex-start}
  .download-page{padding:22px 14px}
  .download-hero{padding:20px}
  .troubleshooting-page{padding:22px 14px}
  .troubleshooting-hero{padding:20px}
  .troubleshooting-hero h1{font-size:36px}
  .troubleshooting-grid{grid-template-columns:1fr}
  .troubleshooting-card{padding:16px}
  .troubleshooting-index{overflow:auto;flex-wrap:nowrap;scrollbar-width:none}
  .troubleshooting-index::-webkit-scrollbar{display:none}
  .troubleshooting-index a{white-space:nowrap}
  .guide-page{padding:22px 14px}
  .guide-hero{grid-template-columns:1fr;padding:20px}
  .guide-hero h1,.guide-article h1{font-size:36px}
  .guide-grid,.blog-grid{grid-template-columns:1fr}
  .guide-section,.blog-card,.guide-article{padding:16px}
  .price-row{grid-template-columns:1fr}
  pre{max-width:100%;overflow:auto}
}
@media(max-width:420px){
  .media-card-grid{grid-template-columns:1fr 1fr}
  .brand-name,.topbar strong{font-size:19px}
  .hero-mosaic{display:none}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{display:grid}
}

@media(max-width:760px){
  :root{
    --logo-size:var(--logo-size-mobile);
    --logo-height:clamp(30px,calc(var(--logo-size) / 3.05),48px);
  }
}
/* Keep the brand mark from being stretched by mobile header layout. */
.topbar .brand {
  align-items: center;
  min-width: 0;
}

.topbar .brand-mark {
  align-items: center;
  aspect-ratio: 1 / 1;
  display: inline-flex;
  flex: 0 0 var(--logo-size, 34px);
  height: var(--logo-size, 34px);
  justify-content: center;
  line-height: 1;
  overflow: hidden;
  width: var(--logo-size, 34px);
}

.topbar .brand-logo {
  aspect-ratio: 1 / 1;
  display: block;
  height: 100%;
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  width: 100%;
}

@media (max-width: 720px) {
  .topbar .brand {
    max-width: calc(100% - 64px);
  }

  .topbar .brand-mark {
    flex-basis: min(var(--logo-size, 34px), 44px);
    height: min(var(--logo-size, 34px), 44px);
    width: min(var(--logo-size, 34px), 44px);
  }
}

/* Final mobile override: this intentionally sits at EOF to win older app rules. */
@media(max-width:760px){
  html,
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
  }
  body:not(.account-media-app) .topbar{
    width:100%;
    max-width:100vw;
    display:grid;
    grid-template-columns:minmax(0,1fr) 44px;
    gap:10px;
    padding:8px 12px;
    overflow:visible;
  }
  body:not(.account-media-app) .topbar .brand{
    min-width:0;
    max-width:100%;
  }
  body:not(.account-media-app) .topbar .mobile-menu-toggle{
    display:grid;
    grid-column:2;
    margin-left:0;
  }
  body:not(.account-media-app) .topbar nav{
    grid-column:1 / -1;
  }
  .topbar .brand-mark{
    flex:0 0 min(var(--logo-size,34px),42px);
    width:min(var(--logo-size,34px),42px);
    height:min(var(--logo-size,34px),42px);
    min-width:0;
  }
  .topbar .brand-logo{
    width:100%;
    height:100%;
    object-fit:contain;
  }
}

@media(max-width:760px){
  .account-media-app{
    --app-header-h:60px;
  }
  .account-media-app .app-topbar{
    position:sticky;
    top:0;
    z-index:30;
    width:100%;
    max-width:100vw;
    height:var(--app-header-h)!important;
    display:grid!important;
    grid-template-columns:44px minmax(44px,auto) minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:8px 10px!important;
    overflow:hidden;
  }
  .account-media-app .mobile-menu-toggle{
    display:none!important;
  }
  .account-media-app .app-icon-button{
    grid-column:1;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    border-radius:8px;
    background:rgba(255,255,255,.05);
  }
  .account-media-app .app-brand{
    grid-column:2;
    min-width:0;
    max-width:92px!important;
    overflow:hidden;
  }
  .account-media-app .app-brand .brand-name{
    display:none!important;
  }
  .account-media-app .app-brand .brand-mark{
    flex:0 0 44px!important;
    width:44px!important;
    height:44px!important;
  }
  .account-media-app .app-top-tabs,
  .account-media-app .app-utility-nav,
  .account-media-app .topbar .app-top-tabs,
  .account-media-app .topbar .app-utility-nav{
    display:none!important;
  }
  .account-media-app .top-media-search{
    grid-column:3;
    display:block!important;
    width:100%;
    min-width:0!important;
    max-width:none!important;
    margin:0;
  }
  .account-media-app .top-media-search input{
    width:100%;
    height:42px;
    min-height:42px;
    border-radius:999px;
    padding:0 14px;
  }
  .account-media-app .account-shell{
    display:block!important;
    min-height:0;
    width:100%;
    max-width:100vw;
  }
.account-media-app .app-sidebar{
    position:fixed!important;
    top:var(--app-header-h)!important;
    left:0;
    bottom:0;
    z-index:34;
    width:min(82vw,312px)!important;
    max-width:312px;
    height:auto!important;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateX(-105%);
    transition:transform .18s ease;
  }
  .account-media-app.media-sidebar-open .app-sidebar{
    transform:translateX(0);
  }
  .account-media-app.media-sidebar-open::before{
    content:"";
    position:fixed;
    inset:var(--app-header-h) 0 0 0;
    z-index:33;
    background:rgba(0,0,0,.48);
  }
  .account-media-app .account-content{
    width:100%;
    max-width:100vw;
    padding:0 0 32px!important;
    overflow:hidden;
  }
  .account-media-app .account-content>.panel,
  .account-media-app .account-content>.account-hero{
    width:auto;
    max-width:calc(100vw - 24px);
    margin:12px!important;
  }
  .account-media-app .account-content>#media-browser{
    max-width:100vw;
    margin:0!important;
  }
  .account-media-app .account-hero{
    display:block!important;
  }
  .account-media-app .panel,
  .account-media-app .mini-card,
  .account-media-app .card{
    min-width:0;
    overflow:hidden;
  }
  .account-media-app #accountPanel h1{
    font-size:clamp(32px,11vw,44px);
    line-height:1.05;
  }
  .account-media-app .portal-grid,
  .account-media-app .settings-grid,
  .account-media-app .inline-form,
  .account-media-app .library-rail{
    grid-template-columns:1fr!important;
    padding:0!important;
  }
  .account-media-app .toolbar{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .account-media-app .toolbar.compact-toolbar{
    display:flex;
  }
  .account-media-app .media-browser-hero{
    min-height:auto;
    display:grid;
    grid-template-columns:1fr!important;
    gap:16px;
    padding:26px 14px 18px!important;
  }
  .account-media-app .media-browser-hero h2{
    font-size:clamp(34px,12vw,48px)!important;
  }
  .account-media-app .media-search{
    display:none!important;
  }
  .account-media-app .filter-rail{
    max-width:100vw;
    padding:12px 14px 0!important;
    overflow-x:auto;
    flex-wrap:nowrap;
  }
  .account-media-app .media-card-grid{
    max-width:100vw;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px;
    padding:14px!important;
  }
  .account-media-app .media-card-grid.media-row-browser{
    grid-template-columns:1fr!important;
    gap:22px;
    padding:16px 14px 36px!important;
  }
  .account-media-app .media-rail{
    width:100%;
    max-width:100%;
    grid-auto-columns:minmax(170px,74vw)!important;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
  }
  .account-media-app .media-card,
  .account-media-app .media-rail .media-card{
    width:100%;
    min-width:0;
  }
  .account-media-app .media-card-body strong,
  .account-media-app .media-card-body p,
  .account-media-app .media-card-body .meta{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .account-media-app .episode-list{
    max-height:260px;
  }
  .account-media-app .episode-list li{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:390px){
  .account-media-app .media-card-grid{
    grid-template-columns:1fr!important;
  }
  .account-media-app .media-rail{
    grid-auto-columns:minmax(168px,82vw)!important;
  }
}

/* Final brand sizing pass. Older mobile rescue rules forced square marks; keep the COMA wordmark proportional. */
.topbar .brand-mark.has-image,
.brand-mark.has-image{
  aspect-ratio:auto!important;
  flex:0 0 min(var(--logo-size),calc(100vw - 96px))!important;
  width:min(var(--logo-size),calc(100vw - 96px))!important;
  min-width:min(var(--logo-size),calc(100vw - 96px))!important;
  height:var(--logo-height)!important;
  overflow:visible!important;
}

.topbar .brand-mark.has-image .brand-logo,
.brand-mark.has-image .brand-logo{
  aspect-ratio:auto!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

.topbar .brand.logo-only{gap:0!important}

/* Final brand sizing pass. Older mobile rescue rules forced square marks; keep the COMA wordmark proportional. */
.topbar .brand-mark.has-image,
.brand-mark.has-image{
  aspect-ratio:auto!important;
  flex:0 0 min(var(--logo-size),calc(100vw - 96px))!important;
  width:min(var(--logo-size),calc(100vw - 96px))!important;
  min-width:min(var(--logo-size),calc(100vw - 96px))!important;
  height:var(--logo-height)!important;
  overflow:visible!important;
}

.topbar .brand-mark.has-image .brand-logo,
.brand-mark.has-image .brand-logo{
  aspect-ratio:auto!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

.topbar .brand.logo-only{gap:0!important}

.device-link-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 80% 10%,rgba(var(--accent-2-rgb),.18),transparent 34%),
    radial-gradient(circle at 12% 20%,rgba(var(--accent-rgb),.14),transparent 36%),
    var(--bg);
}

.device-link-page .topbar{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(8,9,11,.92);
  backdrop-filter:blur(16px);
}

.link-shell{
  width:min(920px,calc(100vw - 32px));
  margin:0 auto;
  padding:clamp(34px,8vw,86px) 0;
}

.link-card{
  display:grid;
  gap:18px;
  padding:clamp(22px,5vw,44px);
  border:1px solid var(--border);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.03));
  box-shadow:0 24px 80px rgba(0,0,0,.42);
}

.link-card h1{
  margin:0;
  font-size:clamp(38px,8vw,72px);
  line-height:1;
}

.link-card h2{
  margin:0;
}

.link-auth-state{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.045);
}

.link-login-form,
.link-code-form{
  display:grid;
  gap:12px;
  max-width:560px;
}

.link-code-form label{
  font-weight:900;
}

.link-code-form input{
  width:100%;
  min-height:70px;
  border-radius:14px;
  font-size:clamp(30px,10vw,48px);
  letter-spacing:.12em;
  text-align:center;
  text-transform:uppercase;
}

.device-preview{
  display:grid;
  gap:5px;
  padding:14px;
  border:1px solid rgba(var(--accent-rgb),.48);
  border-radius:14px;
  background:rgba(var(--accent-rgb),.1);
}

.device-preview strong,
.device-preview span,
.device-preview small{
  min-width:0;
  overflow-wrap:anywhere;
}

.device-preview small{
  color:var(--muted);
}

@media(max-width:680px){
  .device-link-page .topbar{
    height:auto;
    min-height:66px;
    padding:10px 16px;
  }

  .device-link-page .topbar .brand-name{
    display:none;
  }

  .device-link-page .marketing-nav{
    display:none;
  }

  .link-shell{
    width:min(100vw - 22px,560px);
    padding:22px 0;
  }

  .link-card{
    border-radius:14px;
    padding:20px;
  }

  .link-auth-state{
    align-items:stretch;
    flex-direction:column;
  }

  .link-auth-state button,
  .link-login-form button,
  .link-code-form button{
    width:100%;
  }
}

/* Mobile layout rescue for the marketing site and account media app. */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

img,
video,
svg,
canvas{
  max-width:100%;
}

.topbar,
.admin-shell,
.account-shell,
.account-content,
.panel,
.mini-card,
.card{
  min-width:0;
}

@media(max-width:760px){
  body:not(.account-media-app) .topbar{
    width:100%;
    max-width:100vw;
    display:grid;
    grid-template-columns:minmax(0,1fr) 44px;
    align-items:center;
    gap:10px;
    padding:8px 12px;
  }
  body:not(.account-media-app) .topbar .brand{
    min-width:0;
    max-width:100%;
  }
  body:not(.account-media-app) .topbar .mobile-menu-toggle{
    grid-column:2;
    margin-left:0;
  }
  body:not(.account-media-app) .topbar nav{
    grid-column:1 / -1;
  }
  .topbar .brand-mark{
    flex:0 0 min(var(--logo-size,34px),42px);
    width:min(var(--logo-size,34px),42px);
    height:min(var(--logo-size,34px),42px);
    min-width:0;
  }
  .topbar .brand-logo{
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .topbar .brand-name,
  .topbar strong{
    min-width:0;
    max-width:100%;
  }
  .hero,
  .pricing,
  .portal-grid,
  .feature-row,
  .compare,
  .faq,
  .terms,
  .narrow{
    max-width:100%;
  }
  .button,
  button{
    max-width:100%;
  }
  body:not(.account-media-app) table{
    min-width:0;
    width:100%;
  }
  body:not(.account-media-app) th,
  body:not(.account-media-app) td{
    overflow-wrap:anywhere;
  }
  .table-wrap table{
    min-width:680px;
  }
}

@media(max-width:760px){
  .account-media-app{
    --app-header-h:60px;
    background:#101010;
  }
  .account-media-app .app-topbar{
    position:sticky;
    top:0;
    z-index:30;
    width:100%;
    max-width:100vw;
    height:var(--app-header-h);
    display:grid;
    grid-template-columns:44px minmax(44px,auto) minmax(0,1fr);
    gap:8px;
    padding:8px 10px;
    overflow:hidden;
  }
  .account-media-app .mobile-menu-toggle{
    display:none!important;
  }
  .account-media-app .app-icon-button{
    grid-column:1;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    border-radius:8px;
    background:rgba(255,255,255,.05);
  }
  .account-media-app .app-brand{
    grid-column:2;
    display:flex;
    min-width:0;
    max-width:96px;
    overflow:hidden;
  }
  .account-media-app .app-brand .brand-name{
    display:none!important;
  }
  .account-media-app .app-brand .brand-mark{
    flex:0 0 44px;
    width:44px;
    height:44px;
  }
  .account-media-app .app-brand .brand-logo{
    object-fit:contain;
  }
  .account-media-app .app-top-tabs,
  .account-media-app .app-utility-nav{
    display:none!important;
  }
  .account-media-app .top-media-search{
    grid-column:3;
    display:block;
    min-width:0;
    max-width:none;
    width:100%;
    margin:0;
  }
  .account-media-app .top-media-search input{
    width:100%;
    height:42px;
    min-height:42px;
    padding:0 14px;
    border-radius:999px;
  }
  .account-media-app .account-shell{
    display:block;
    min-height:0;
    width:100%;
    max-width:100vw;
  }
  .account-media-app .app-sidebar{
    position:fixed;
    top:var(--app-header-h);
    left:0;
    bottom:0;
    z-index:34;
    width:min(82vw,312px);
    height:auto;
    max-width:312px;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateX(-105%);
  }
  .account-media-app.media-sidebar-open .app-sidebar{
    transform:translateX(0);
  }
  .account-media-app.media-sidebar-open::before{
    content:"";
    position:fixed;
    inset:var(--app-header-h) 0 0 0;
    z-index:33;
    background:rgba(0,0,0,.48);
  }
  .account-media-app .account-content{
    width:100%;
    max-width:100vw;
    padding:0 0 32px;
    overflow:hidden;
  }
  .account-media-app .account-content>.panel,
  .account-media-app .account-content>.account-hero{
    width:auto;
    max-width:calc(100vw - 24px);
    margin:12px;
  }
  .account-media-app .account-content>#media-browser{
    max-width:100vw;
    margin:0;
  }
  .account-media-app .account-hero{
    display:block;
  }
  .account-media-app .panel,
  .account-media-app .mini-card,
  .account-media-app .card{
    overflow:hidden;
  }
  .account-media-app #accountPanel h1{
    font-size:clamp(32px,11vw,44px);
    line-height:1.05;
  }
  .account-media-app .portal-grid,
  .account-media-app .settings-grid,
  .account-media-app .inline-form,
  .account-media-app .library-rail{
    grid-template-columns:1fr;
    padding:0;
  }
  .account-media-app .toolbar{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .account-media-app .toolbar.compact-toolbar{
    display:flex;
  }
  .account-media-app .media-browser-hero{
    min-height:auto;
    padding:26px 14px 18px;
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
  }
  .account-media-app .media-browser-hero h2{
    font-size:clamp(34px,12vw,48px);
  }
  .account-media-app .media-search{
    display:none;
  }
  .account-media-app .filter-rail{
    max-width:100vw;
    padding:12px 14px 0;
    overflow-x:auto;
    flex-wrap:nowrap;
  }
  .account-media-app .media-card-grid{
    max-width:100vw;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    padding:14px;
  }
  .account-media-app .media-card-grid.media-row-browser{
    grid-template-columns:1fr;
    gap:22px;
    padding:16px 14px 36px;
  }
  .account-media-app .media-rail{
    width:100%;
    max-width:100%;
    grid-auto-columns:minmax(170px,74vw);
    overflow-x:auto;
    overscroll-behavior-inline:contain;
  }
  .account-media-app .media-rail .media-card{
    width:100%;
  }
  .account-media-app .media-card{
    min-width:0;
  }
  .account-media-app .media-card-body strong,
  .account-media-app .media-card-body p,
  .account-media-app .media-card-body .meta{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .account-media-app .episode-list{
    max-height:260px;
  }
  .account-media-app .episode-list li{
    grid-template-columns:1fr;
  }
  .account-media-app .table-wrap{
    max-width:100%;
  }
}

@media(max-width:390px){
  .account-media-app .media-card-grid{
    grid-template-columns:1fr;
  }
  .account-media-app .media-rail{
    grid-auto-columns:minmax(168px,82vw);
  }
}

/* Final generated homepage art override. */
.art-remote-access{--card-art:url("/images/homepage/remote-access.jpg")}
.art-direct-play{--card-art:url("/images/homepage/direct-play.jpg")}
.art-transcoding{--card-art:url("/images/homepage/transcoding.jpg")}
.art-shared-libraries{--card-art:url("/images/homepage/shared-libraries.jpg")}
.art-signed-addons{--card-art:url("/images/homepage/signed-addons.jpg")}
.art-licences{--card-art:url("/images/homepage/licences.jpg")}
.art-profiles{--card-art:url("/images/homepage/profiles.jpg")}
.art-downloads{--card-art:url("/images/homepage/downloads.jpg")}
.art-backups{--card-art:url("/images/homepage/backups.jpg")}
.art-support{--card-art:url("/images/homepage/support.jpg")}

.marketing-media-home .poster-tile[class*="art-"],
.marketing-media-home .homepage-media-card[class*="art-"]{
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.18) 44%,rgba(0,0,0,.78) 100%)!important;
  background-position:center!important;
  background-size:cover!important;
}

.marketing-media-home .card-art{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.marketing-media-home .poster-tile[class*="art-"]:before,
.marketing-media-home .homepage-media-card[class*="art-"]:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg,rgba(0,0,0,.03) 0%,rgba(0,0,0,.2) 42%,rgba(0,0,0,.82) 100%),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.12),transparent 36%);
  pointer-events:none;
}

.marketing-media-home .poster-tile:after,
.marketing-media-home .homepage-media-card:after,
.marketing-media-home .homepage-media-card span{
  z-index:2;
}

/* Media app shell for app.comamediaserver.com/account.html */
.account-media-app{
  background:#141414;
}
.account-media-app .app-topbar{
  height:58px;
  justify-content:flex-start;
  gap:14px;
  padding:0 16px;
  background:rgba(5,5,5,.96);
  border-bottom:1px solid rgba(255,255,255,.07);
  box-shadow:0 8px 24px rgba(0,0,0,.28);
}
.account-media-app .app-icon-button{
  flex:0 0 42px;
  width:42px;
  height:42px;
  padding:0;
  border:0;
  border-radius:6px;
  background:transparent;
  color:transparent;
  font-size:0;
  position:relative;
}
.account-media-app .app-icon-button:before,
.account-media-app .app-icon-button:after{
  content:"";
  position:absolute;
  left:11px;
  width:20px;
  height:2px;
  border-radius:999px;
  background:#e8e8e8;
}
.account-media-app .app-icon-button:before{
  top:14px;
  box-shadow:0 7px 0 #e8e8e8;
}
.account-media-app .app-icon-button:after{top:28px}
.account-media-app .app-icon-button:hover{background:rgba(255,255,255,.08)}
.account-media-app .app-brand{
  flex:0 0 auto;
  min-width:0;
}
.account-media-app .app-brand .brand-name{
  font-size:25px;
  letter-spacing:0;
}
.account-media-app .app-top-tabs{
  display:flex;
  align-items:center;
  gap:4px;
  min-width:0;
  flex:0 1 auto;
}
.account-media-app .topbar .app-top-tabs a,
.account-media-app .topbar .app-utility-nav a{
  border-radius:5px;
  padding:9px 10px;
  color:#d9d9d9;
}
.account-media-app .topbar .app-top-tabs a:hover,
.account-media-app .topbar .app-utility-nav a:hover{
  background:rgba(255,255,255,.09);
  color:#fff;
}
.account-media-app .app-count,
.account-media-app .side-count{
  display:inline-grid;
  place-items:center;
  min-width:20px;
  height:20px;
  margin-left:6px;
  border-radius:999px;
  background:var(--accent);
  color:#111;
  font-size:12px;
  font-weight:850;
}
.account-media-app .top-media-search{
  display:block;
  flex:1 1 340px;
  max-width:620px;
  min-width:160px;
  margin:0;
}
.account-media-app .top-media-search input{
  width:100%;
  height:38px;
  border:0;
  border-radius:999px;
  background:#242424;
  color:#fff;
  padding:0 18px;
}
.account-media-app .top-media-search input:focus{
  box-shadow:0 0 0 2px rgba(var(--accent-rgb),.55);
}
.account-media-app .app-utility-nav{
  margin-left:auto;
  display:flex;
  gap:4px;
  align-items:center;
  flex:0 0 auto;
}
.account-media-app .account-shell{
  grid-template-columns:260px minmax(0,1fr);
  min-height:calc(100vh - 58px);
}
.account-media-app .app-sidebar{
  top:58px;
  height:calc(100vh - 58px);
  padding:14px 10px;
  background:linear-gradient(180deg,#171717,#111);
  border-right:1px solid rgba(255,255,255,.06);
}
.account-media-app .app-sidebar:before{display:none}
.account-media-app .app-sidebar a,
.account-media-app .app-sidebar button{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:42px;
  margin:3px 0;
  border-radius:4px;
  color:#d8d8d8;
}
.account-media-app .app-sidebar a.active,
.account-media-app .app-sidebar button.active,
.account-media-app .app-sidebar a:hover,
.account-media-app .app-sidebar button:hover{
  background:#262626;
  color:#fff;
}
.account-media-app .app-sidebar a.active,
.account-media-app .app-sidebar button.active{
  box-shadow:inset 3px 0 0 var(--accent);
}
.account-media-app .nav-glyph{
  display:inline-grid;
  place-items:center;
  flex:0 0 24px;
  width:24px;
  height:24px;
  border-radius:5px;
  background:rgba(255,255,255,.08);
  color:#e3e3e3;
  font-size:12px;
  font-weight:850;
}
.account-media-app .sidebar-divider{
  height:1px;
  margin:12px 8px;
  background:rgba(255,255,255,.09);
}
.account-media-app .sidebar-label{
  display:block;
  padding:14px 12px 6px;
  color:#8f8f8f;
  font-size:11px;
  text-transform:uppercase;
}
.account-media-app .account-content{
  padding:0 0 42px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),transparent 180px),
    #141414;
}
.account-media-app .account-content>.panel[hidden],
.account-media-app .account-content>.account-hero[hidden]{
  display:none!important;
}
.account-media-app .account-content>.panel,
.account-media-app .account-content>.account-hero{
  margin:24px 28px;
  min-height:calc(100vh - 112px);
}
.account-media-app .app-sidebar a[aria-current="page"],
.account-media-app .app-top-tabs a[aria-current="page"],
.account-media-app .app-utility-nav a[aria-current="page"],
.account-media-app .app-bottom-nav a[aria-current="page"]{
  background:#262626;
  color:#fff;
}
.account-media-app .app-sidebar a[aria-current="page"]{
  box-shadow:inset 3px 0 0 var(--accent);
}
.account-media-app .account-content>#media-browser{
  margin:0;
  min-height:calc(100vh - 58px);
}
.account-media-app .media-browser-panel{
  border:0;
  border-radius:0;
  box-shadow:none;
  background:#141414;
}
.account-media-app .media-browser-hero{
  min-height:320px;
  padding:52px 38px 34px;
  align-items:end;
  background:
    linear-gradient(90deg,rgba(20,20,20,.96),rgba(20,20,20,.72) 48%,rgba(20,20,20,.35)),
    radial-gradient(circle at 76% 22%,rgba(var(--accent-rgb),.28),transparent 34%),
    linear-gradient(135deg,#202020,#0f0f0f);
}
.account-media-app .media-browser-hero h2{
  font-size:clamp(42px,6vw,72px);
  line-height:.95;
}
.account-media-app .filter-rail{
  padding:18px 34px 0;
  background:#141414;
}
.account-media-app .chip{
  border:0;
  border-radius:4px;
  background:#252525;
  color:#d9d9d9;
}
.account-media-app .chip.active,
.account-media-app .chip:hover{
  background:var(--accent);
  color:#111;
}
.account-media-app .media-card-grid.media-row-browser{
  padding:24px 34px 62px;
  gap:28px;
  background:#141414;
}
.account-media-app .media-rail-head h3{
  font-size:20px;
}
.account-media-app .media-rail{
  grid-auto-columns:minmax(232px,292px);
  gap:10px;
  padding-bottom:18px;
}
.account-media-app .media-card{
  border:0;
  border-radius:4px;
  background:#181818;
  box-shadow:0 12px 28px rgba(0,0,0,.32);
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease;
}
.account-media-app .media-card:hover{
  transform:scale(1.035);
  background:#202020;
  box-shadow:0 18px 40px rgba(0,0,0,.5);
}
.account-media-app .media-row-browser .poster-frame{
  aspect-ratio:16/9;
  border-radius:4px 4px 0 0;
}
.account-media-app .media-card-body{
  gap:7px;
  padding:11px;
}
.account-media-app .media-card-body strong{
  font-size:14px;
}
.account-media-app .media-card-body .meta{
  min-height:0;
}
.account-media-app .season-picker select{
  border-radius:4px;
  background:#0e0e0e;
}
.account-media-app .episode-list{
  max-height:184px;
}
.account-media-app .episode-list li{
  border-radius:4px;
  background:#232323;
}
@media(max-width:1080px){
  .account-media-app .app-top-tabs{display:none}
  .account-media-app .top-media-search{max-width:none}
}
@media(max-width:960px){
  .account-media-app .account-shell{grid-template-columns:1fr}
  .account-media-app .app-sidebar{
    position:fixed;
    left:0;
    bottom:0;
    z-index:24;
    width:min(82vw,300px);
    transform:translateX(-104%);
    transition:transform .18s ease;
    box-shadow:18px 0 48px rgba(0,0,0,.42);
  }
  .account-media-app.media-sidebar-open .app-sidebar{transform:none}
  .account-media-app .side-nav a,
  .account-media-app .side-nav button{
    min-width:0;
    text-align:left;
  }
  .account-media-app .account-content>.panel,
  .account-media-app .account-content>.account-hero{
    margin:18px;
  }
  .account-media-app .media-browser-hero{padding:34px 22px 24px}
  .account-media-app .filter-rail{padding:14px 20px 0}
  .account-media-app .media-card-grid.media-row-browser{padding:20px}
}
@media(max-width:620px){
  .account-media-app .app-topbar{
    height:58px;
    display:flex;
    padding:0 10px;
    gap:8px;
  }
  .account-media-app .topbar nav{
    position:static;
    display:flex;
    max-height:none;
    opacity:1;
    pointer-events:auto;
    transform:none;
    padding:0;
    border:0;
    box-shadow:none;
    background:transparent;
  }
  .account-media-app .app-utility-nav{display:none}
  .account-media-app .app-brand .brand-name{font-size:20px}
  .account-media-app .top-media-search{
    flex:1 1 auto;
    min-width:90px;
  }
  .account-media-app .top-media-search input{
    height:36px;
    padding:0 12px;
  }
  .account-media-app .media-browser-hero{
    min-height:250px;
    grid-template-columns:1fr;
  }
  .account-media-app .media-browser-hero h2{font-size:40px}
  .account-media-app .media-search{display:none}
  .account-media-app .media-rail{
    grid-auto-columns:minmax(206px,78vw);
  }
  .account-media-app .episode-list li{grid-template-columns:1fr}
}

.player-page{
  min-height:100vh;
  overflow-x:hidden;
  background:#07131e;
  color:#fff;
}
.player-page button,
.player-page .button{
  width:auto;
  min-width:0;
  min-height:0;
  border:0;
  border-radius:0;
  padding:0;
  text-align:center;
  box-shadow:none;
}
.player-page input[type="range"]{
  width:auto;
  min-height:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.player-topbar{
  width:min(1840px,calc(100vw - 96px));
  height:96px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:34px;
  padding:0;
  background:transparent;
  border-bottom:0;
}
.player-topbar .brand{
  flex:0 0 auto;
}
.player-topbar .brand-name{
  font-size:28px;
  letter-spacing:0;
}
.player-nav{
  display:flex;
  gap:28px;
  align-items:center;
  min-width:0;
}
.player-nav a{
  color:#c8d2de;
  text-decoration:none;
  font-weight:800;
  font-size:18px;
}
.player-nav a:hover{
  color:#fff;
}
.player-titlebar{
  display:grid;
  gap:2px;
  min-width:0;
  margin-left:auto;
}
.player-titlebar span{
  color:#9fb6ca;
  font-size:13px;
  font-weight:700;
}
.player-back{
  margin-left:0;
  color:#d9e7f7;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  padding:10px 13px;
  background:rgba(255,255,255,.07);
}
.player-back:hover{
  border-color:rgba(var(--accent-2-rgb),.72);
  color:#fff;
}
.player-shell{
  width:min(1840px,calc(100vw - 96px));
  margin:0 auto;
  display:grid;
  gap:24px;
  padding:10px 0 56px;
}
.player-stage{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  min-height:0;
  max-height:calc(100vh - 230px);
  overflow:hidden;
  border-radius:8px;
  background:#000;
  box-shadow:0 26px 90px rgba(0,0,0,.48);
}
.player-stage video{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}
.player-poster{
  position:absolute;
  inset:0;
  z-index:1;
  background-size:cover;
  background-position:center;
  filter:saturate(.9);
}
.player-overlay{
  position:absolute;
  inset:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:24px;
  text-align:center;
  background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.28));
  transition:opacity .18s ease;
}
.player-overlay p{
  position:absolute;
  left:24px;
  bottom:96px;
  margin:0;
  color:#dce8f4;
  text-shadow:0 2px 10px #000;
}
.player-overlay.is-playing{
  opacity:0;
  pointer-events:none;
}
.player-overlay.error{
  opacity:1;
  pointer-events:auto;
  background:rgba(0,0,0,.72);
}
.player-big-play{
  width:78px;
  height:78px;
  border-radius:12px;
  border:0;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-weight:900;
  box-shadow:0 18px 46px rgba(0,0,0,.45);
  backdrop-filter:blur(8px);
}
.player-controls{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:5;
  display:grid;
  gap:14px;
  padding:0 20px 20px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.88));
}
.player-seek{
  width:100%!important;
  height:5px;
  accent-color:#18aee3;
  cursor:pointer;
}
.player-control-row{
  display:flex;
  gap:12px;
  align-items:center;
}
.player-control-button{
  display:inline-grid;
  place-items:center;
  min-width:58px;
  height:50px;
  padding:0 14px!important;
  border-radius:6px!important;
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
  font-weight:800;
}
.player-control-button:hover{
  background:rgba(255,255,255,.2)!important;
  filter:none;
}
.player-play-button{
  min-width:64px;
}
.player-volume-group{
  display:flex;
  align-items:center;
  gap:12px;
}
.player-volume-group input{
  width:140px!important;
  accent-color:#fff;
}
.player-time{
  color:#fff;
  font-weight:700;
  min-width:132px;
}
.player-control-spacer{
  flex:1 1 auto;
}
.player-details{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  padding:0;
}
.player-details h1{
  margin:0 0 6px;
  font-size:clamp(34px,3.6vw,48px);
}
.player-details p{
  margin:0;
  color:#aecaeb;
  font-weight:600;
}
.player-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.player-actions button,
.player-actions .button{
  min-height:42px;
  padding:10px 14px;
  border-radius:8px;
}
@media(max-width:780px){
  .player-topbar{
    width:calc(100vw - 24px);
    height:auto;
    min-height:76px;
    gap:14px;
    padding:10px 0;
  }
  .player-nav{
    display:none;
  }
  .player-titlebar span{display:none}
  .player-shell{
    width:100vw;
    padding:0 0 28px;
  }
  .player-stage{
    border-radius:0;
    max-height:none;
  }
  .player-controls{padding:0 12px 12px}
  .player-control-row{gap:8px}
  .player-volume-group input,
  .player-volume-group #muteButton{
    display:none;
  }
  .player-time{min-width:auto;font-size:13px}
  .player-control-button{min-width:48px;height:44px;padding:0 10px!important}
  .player-details{
    display:grid;
    padding:0 14px;
  }
}
/* Mobile brand logo safety override: keep image proportions and cap size. */
.topbar .brand {
  align-items: center;
  min-width: 0;
}

.topbar .brand-mark {
  align-items: center;
  aspect-ratio: 1 / 1;
  display: inline-flex;
  flex: 0 0 var(--logo-size, 34px);
  height: var(--logo-size, 34px);
  justify-content: center;
  line-height: 1;
  overflow: hidden;
  width: var(--logo-size, 34px);
}

.topbar .brand-logo {
  aspect-ratio: 1 / 1;
  display: block;
  height: 100%;
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  width: 100%;
}

@media (max-width: 720px) {
  .topbar .brand {
    max-width: calc(100% - 64px);
  }

  .topbar .brand-mark {
    flex-basis: min(var(--logo-size, 34px), 44px);
    height: min(var(--logo-size, 34px), 44px);
    width: min(var(--logo-size, 34px), 44px);
  }
}

/* Final mobile override: this intentionally sits at EOF to win older app rules. */
@media(max-width:760px){
  html,
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
  }
  body:not(.account-media-app) .topbar{
    width:100%;
    max-width:100vw;
    display:grid;
    grid-template-columns:minmax(0,1fr) 44px;
    gap:10px;
    padding:8px 12px;
    overflow:visible;
  }
  body:not(.account-media-app) .topbar .brand{
    min-width:0;
    max-width:100%;
  }
  body:not(.account-media-app) .topbar .mobile-menu-toggle{
    display:grid;
    grid-column:2;
    margin-left:0;
  }
  body:not(.account-media-app) .topbar nav{
    grid-column:1 / -1;
  }
  .topbar .brand-mark{
    flex:0 0 min(var(--logo-size,34px),42px);
    width:min(var(--logo-size,34px),42px);
    height:min(var(--logo-size,34px),42px);
    min-width:0;
  }
  .topbar .brand-logo{
    width:100%;
    height:100%;
    object-fit:contain;
  }
}

@media(max-width:760px){
  .account-media-app{
    --app-header-h:60px;
  }
  .account-media-app .app-topbar{
    position:sticky;
    top:0;
    z-index:30;
    width:100%;
    max-width:100vw;
    height:var(--app-header-h)!important;
    display:grid!important;
    grid-template-columns:44px minmax(44px,auto) minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:8px 10px!important;
    overflow:hidden;
  }
  .account-media-app .mobile-menu-toggle{
    display:none!important;
  }
  .account-media-app .app-icon-button{
    grid-column:1;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    border-radius:8px;
    background:rgba(255,255,255,.05);
  }
  .account-media-app .app-brand{
    grid-column:2;
    min-width:0;
    max-width:92px!important;
    overflow:hidden;
  }
  .account-media-app .app-brand .brand-name{
    display:none!important;
  }
  .account-media-app .app-brand .brand-mark{
    flex:0 0 44px!important;
    width:44px!important;
    height:44px!important;
  }
  .account-media-app .app-top-tabs,
  .account-media-app .app-utility-nav,
  .account-media-app .topbar .app-top-tabs,
  .account-media-app .topbar .app-utility-nav{
    display:none!important;
  }
  .account-media-app .top-media-search{
    grid-column:3;
    display:block!important;
    width:100%;
    min-width:0!important;
    max-width:none!important;
    margin:0;
  }
  .account-media-app .top-media-search input{
    width:100%;
    height:42px;
    min-height:42px;
    border-radius:999px;
    padding:0 14px;
  }
  .account-media-app .account-shell{
    display:block!important;
    min-height:0;
    width:100%;
    max-width:100vw;
  }
  .account-media-app .app-sidebar{
    position:fixed!important;
    top:var(--app-header-h)!important;
    left:0;
    bottom:0;
    z-index:34;
    width:min(82vw,312px)!important;
    max-width:312px;
    height:auto!important;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateX(-105%);
    transition:transform .18s ease;
  }
  .account-media-app.media-sidebar-open .app-sidebar{
    transform:translateX(0);
  }
  .account-media-app.media-sidebar-open::before{
    content:"";
    position:fixed;
    inset:var(--app-header-h) 0 0 0;
    z-index:33;
    background:rgba(0,0,0,.48);
  }
  .account-media-app .account-content{
    width:100%;
    max-width:100vw;
    padding:0 0 32px!important;
    overflow:hidden;
  }
  .account-media-app .account-content>.panel,
  .account-media-app .account-content>.account-hero{
    width:auto;
    max-width:calc(100vw - 24px);
    margin:12px!important;
  }
  .account-media-app .account-content>#media-browser{
    max-width:100vw;
    margin:0!important;
  }
  .account-media-app .account-hero{
    display:block!important;
  }
  .account-media-app .panel,
  .account-media-app .mini-card,
  .account-media-app .card{
    min-width:0;
    overflow:hidden;
  }
  .account-media-app #accountPanel h1{
    font-size:clamp(32px,11vw,44px);
    line-height:1.05;
  }
  .account-media-app .portal-grid,
  .account-media-app .settings-grid,
  .account-media-app .inline-form,
  .account-media-app .library-rail{
    grid-template-columns:1fr!important;
    padding:0!important;
  }
  .account-media-app .toolbar{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .account-media-app .toolbar.compact-toolbar{
    display:flex;
  }
  .account-media-app .media-browser-hero{
    min-height:auto;
    display:grid;
    grid-template-columns:1fr!important;
    gap:16px;
    padding:26px 14px 18px!important;
  }
  .account-media-app .media-browser-hero h2{
    font-size:clamp(34px,12vw,48px)!important;
  }
  .account-media-app .media-search{
    display:none!important;
  }
  .account-media-app .filter-rail{
    max-width:100vw;
    padding:12px 14px 0!important;
    overflow-x:auto;
    flex-wrap:nowrap;
  }
  .account-media-app .media-card-grid{
    max-width:100vw;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px;
    padding:14px!important;
  }
  .account-media-app .media-card-grid.media-row-browser{
    grid-template-columns:1fr!important;
    gap:22px;
    padding:16px 14px 36px!important;
  }
  .account-media-app .media-rail{
    width:100%;
    max-width:100%;
    grid-auto-columns:minmax(170px,74vw)!important;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
  }
  .account-media-app .media-card,
  .account-media-app .media-rail .media-card{
    width:100%;
    min-width:0;
  }
  .account-media-app .media-card-body strong,
  .account-media-app .media-card-body p,
  .account-media-app .media-card-body .meta{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .account-media-app .episode-list{
    max-height:260px;
  }
  .account-media-app .episode-list li{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:390px){
  .account-media-app .media-card-grid{
    grid-template-columns:1fr!important;
  }
  .account-media-app .media-rail{
    grid-auto-columns:minmax(168px,82vw)!important;
  }
}

/* Last loaded brand sizing override. Keep image logos proportional after all legacy rules. */
.topbar .brand-mark.has-image,
.brand-mark.has-image{
  aspect-ratio:auto!important;
  flex:0 0 min(var(--logo-size),calc(100vw - 96px))!important;
  width:min(var(--logo-size),calc(100vw - 96px))!important;
  min-width:min(var(--logo-size),calc(100vw - 96px))!important;
  height:var(--logo-height)!important;
  overflow:visible!important;
}
.topbar .brand-mark.has-image .brand-logo,
.brand-mark.has-image .brand-logo{
  aspect-ratio:auto!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
.topbar .brand.logo-only{gap:0!important}