:root {
  --carbon: #06110c;
  --slate: #0e2018;
  --slate-raised: #173126;
  --line: #284a3a;
  --paper: #f2fbf6;
  --muted: #a7bbaf;
  --amber: #e3c66a;
  --cyan: #46d889;
  --red: #ff727c;
  --green: #68e3a2;
  --display: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  --body: "Segoe UI", Arial, sans-serif;
  --mono: Consolas, "Courier New", monospace;
  --z-mobile-nav: 400;
  --z-backdrop: 500;
  --z-drawer: 700;
}

* { box-sizing: border-box; }
/* O atributo semântico hidden deve vencer receitas de display dos componentes. */
[hidden] { display: none !important; }
html { background: var(--carbon); color: var(--paper); font-family: var(--body); }
body { margin: 0; min-width: 320px; background: linear-gradient(rgb(6 17 12 / .76),rgb(6 17 12 / .95)),url('/assets/sinal_cinema_background.png') center top/cover fixed,var(--carbon); }
button, input, select { font: inherit; }
button, a, label, select { -webkit-tap-highlight-color: transparent; }
button, a, select { touch-action: manipulation; }

.warning-bar {
  min-height: 60px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px clamp(18px, 4vw, 64px);
  color: #211d12;
  background: var(--amber);
  border-bottom: 3px solid #765f21;
}
.warning-bar div { display: flex; flex-wrap: wrap; gap: 5px 16px; align-items: baseline; }
.warning-bar strong { font-family: var(--display); font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; }
.warning-bar span:last-child { font-size: .86rem; }
.warning-mark { padding: 5px 8px; border: 2px solid currentColor; font-family: var(--mono); font-weight: 800; font-size: .75rem; }

.app-shell { width: min(1500px, calc(100% - 36px)); margin: 0 auto; padding: 54px 0 32px; }
.intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 32px; align-items: end; padding-bottom: 52px; }
.eyebrow { margin: 0 0 9px; color: var(--cyan); font-family: var(--mono); font-size: .73rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin: 0; font-family: var(--display); font-size: clamp(3.4rem, 8vw, 7.5rem); line-height: .82; letter-spacing: -.055em; text-transform: uppercase; }
h1 span { color: transparent; -webkit-text-stroke: 1px var(--cyan); }
.intro-copy { max-width: 640px; margin: 0 0 5px; color: #c0cbc7; font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.6; }

.source-panel, .workspace { border-top: 1px solid var(--line); }
.source-panel { padding: 28px 0 38px; }
.section-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.section-heading.compact { margin-bottom: 18px; }
.section-heading h2 { margin: 0; font-family: var(--display); font-size: 1.35rem; letter-spacing: -.02em; text-transform: uppercase; }
.step { display: grid; width: 38px; height: 38px; place-items: center; color: var(--carbon); background: var(--cyan); font-family: var(--mono); font-size: .78rem; font-weight: 800; }
.source-grid { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr); gap: 16px; }
.url-form { min-height: 155px; border: 1px solid var(--line); background: color-mix(in srgb, var(--slate) 90%, transparent); }
.url-form { display: flex; flex-direction: column; justify-content: center; padding: 25px; }
.url-form label, .field-label { margin-bottom: 8px; color: var(--paper); font-family: var(--mono); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.input-row { display: grid; grid-template-columns: 1fr auto; }
input, select { min-width: 0; border: 1px solid var(--line); border-radius: 0; color: var(--paper); background: #0e1518; outline: none; }
input:focus, select:focus { border-color: var(--cyan); box-shadow: 0 0 0 2px color-mix(in srgb, var(--cyan) 25%, transparent); }
.input-row input { height: 46px; padding: 0 13px; border-right: 0; }
.input-row button { min-height: 46px; border: 0; padding: 0 20px; color: #071414; background: var(--cyan); font-weight: 800; cursor: pointer; }
.input-row button:hover { background: #83dedb; }
.url-form p { margin: 9px 0 0; color: var(--muted); font-size: .78rem; }
.source-message { min-height: 24px; margin-top: 13px; color: var(--muted); font-family: var(--mono); font-size: .78rem; }
.source-message[data-state="success"] { color: var(--green); }
.source-message[data-state="error"] { color: var(--red); }
.import-progress { width: 100%; height: 5px; margin-top: 6px; border: 0; border-radius: 0; color: var(--cyan); background: var(--slate); }
.import-progress::-webkit-progress-bar { background: var(--slate); }
.import-progress::-webkit-progress-value { background: var(--cyan); }
.import-progress::-moz-progress-bar { background: var(--cyan); }

.workspace { display: grid; grid-template-columns: 260px minmax(300px, .75fr) minmax(420px, 1.25fr); min-height: 670px; }
.workspace[hidden] { display: none; }
.catalog-controls, .catalog, .player-panel { padding: 28px 22px; }
.catalog-controls { padding-left: 0; border-right: 1px solid var(--line); }
.catalog { max-height: 760px; overflow-y: auto; border-right: 1px solid var(--line); scrollbar-color: var(--line) transparent; align-content: start; }
.catalog[data-kind="movies"],.catalog[data-kind="series"] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.player-panel { padding-right: 0; }
.search, select { width: 100%; height: 44px; padding: 0 11px; margin-bottom: 18px; }
.catalog-kind-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 0 0 22px; background: var(--line); }
.catalog-kind-tabs button { display: grid; gap: 4px; min-width: 0; min-height: 62px; place-content: center; border: 0; color: var(--muted); background: var(--slate); cursor: pointer; }
.catalog-kind-tabs button:hover, .catalog-kind-tabs button:focus-visible { color: var(--paper); background: var(--slate-raised); outline: 1px solid var(--cyan); outline-offset: -1px; }
.catalog-kind-tabs button[aria-selected="true"] { color: var(--carbon); background: var(--cyan); }
.catalog-kind-tabs span { font-family: var(--mono); font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.catalog-kind-tabs strong { font-family: var(--display); font-size: 1.15rem; }
.search-shell { position: relative; }
.search-shell .search { padding-right: 42px; }
.search-clear { position: absolute; top: 5px; right: 5px; display: grid; width: 34px; height: 34px; place-items: center; border: 0; color: var(--muted); background: transparent; font-size: 1.35rem; cursor: pointer; }
.search-clear:hover, .search-clear:focus-visible { color: var(--carbon); background: var(--cyan); outline: none; }
.search-clear[hidden] { display: none; }
.playlist-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 7px 0 0; background: var(--line); }
.playlist-stats div { padding: 14px; background: var(--slate); }
.playlist-stats dt { color: var(--muted); font-family: var(--mono); font-size: .66rem; text-transform: uppercase; }
.playlist-stats dd { margin: 5px 0 0; font-family: var(--display); font-size: 1.7rem; font-weight: 800; }
.catalog-mobile-heading,.filter-open,.filter-drawer-heading,.mobile-home-intro,.mobile-home-shortcuts,.mobile-bottom-nav,.player-mobile-toolbar { display:none; }
.filter-backdrop { display:none; }
.filter-drawer { position:static; display:block; width:auto; max-width:none; max-height:none; margin:0; padding:0; border:0; color:inherit; background:transparent; }
.playback-diagnostics > summary { display: none; }
.catalog-filter-fields { display: block; }
.catalog-item { width:100%; min-width:0; color:var(--paper); text-align:left; cursor:pointer; }
.catalog-item-live { display:grid; grid-template-columns:48px 1fr auto; gap:11px; min-height:72px; align-items:center; padding:10px 11px; border:0; border-bottom:1px solid #28363c; background:transparent; }
.catalog-item-live .item-index { display:none; }
.catalog-item-poster { position:relative; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; gap:0 7px; overflow:hidden; padding:0 0 12px; border:1px solid var(--line); border-radius:12px; background:var(--slate); }
.catalog-art { position:relative; display:grid; overflow:hidden; place-items:center; border:1px solid color-mix(in srgb,var(--cyan) 22%,var(--line)); border-radius:10px; color:var(--paper); background:linear-gradient(145deg,hsl(var(--cover-tone) 44% 28%),hsl(calc(var(--cover-tone) + 28) 58% 10%)); }
.catalog-art::before { content:""; position:absolute; inset:0; opacity:.22; background:repeating-linear-gradient(115deg,transparent 0 13px,rgb(255 255 255 / .14) 13px 14px); }
.catalog-art-signal,.catalog-art-initials { position:relative; z-index:1; }
.catalog-art-signal { color:var(--cyan); font-size:1.05rem; }
.catalog-art-initials { font:800 .78rem var(--mono); letter-spacing:.08em; }
.catalog-item-live .catalog-art { width:46px; height:46px; }
.catalog-item-poster .catalog-art { grid-column:1 / -1; width:100%; aspect-ratio:2 / 3; border:0; border-bottom:1px solid var(--line); border-radius:0; }
.catalog-item-poster .catalog-art-signal { position:absolute; top:13px; left:13px; font-size:1.35rem; }
.catalog-item-poster .catalog-art-initials { font-size:clamp(1.2rem,3vw,2.2rem); }
.catalog-item-poster .item-index { display:none; }
.catalog-item-poster .item-text { padding:12px 0 0 12px; }
.catalog-item-poster .item-text strong { white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.25; }
.catalog-item-poster .item-protocol { align-self:start; margin:12px 10px 0 0; }
.catalog-item:hover, .catalog-item:focus-visible { background: var(--slate-raised); outline: 1px solid var(--cyan); outline-offset: -1px; }
.catalog-item[aria-current="true"] { color: #071414; background: var(--cyan); }
.catalog-item-poster[aria-current="true"] .catalog-art { filter:saturate(.72) brightness(.82); }
.item-index, .item-protocol { font-family: var(--mono); font-size: .68rem; }
.item-index { color: var(--muted); }
.catalog-item[aria-current="true"] .item-index { color: #254746; }
.item-text { display: grid; min-width: 0; gap: 4px; }
.item-text strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-text span { overflow: hidden; color: var(--muted); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.catalog-item[aria-current="true"] .item-text span { color: #254746; }
.item-protocol { padding: 4px 5px; border: 1px solid currentColor; }
.catalog-state { grid-column:1 / -1; display:grid; min-height:260px; place-content:center; justify-items:center; gap:10px; padding:38px 20px; color:var(--muted); text-align:center; }
.catalog-state strong { color:var(--paper); font:800 1.35rem var(--display); text-transform:uppercase; }
.catalog-state p { max-width:360px; margin:0; line-height:1.5; }
.catalog-spinner { width:34px; height:34px; border:3px solid var(--line); border-top-color:var(--cyan); border-radius:50%; animation:catalog-spin .8s linear infinite; }
.catalog-state-action,.catalog-inline-error button { min-height:42px; padding:0 14px; border:1px solid var(--cyan); border-radius:9px; color:var(--cyan); background:transparent; font-weight:800; cursor:pointer; }
.catalog-state-action:hover,.catalog-state-action:focus-visible,.catalog-inline-error button:hover,.catalog-inline-error button:focus-visible { color:var(--carbon); background:var(--cyan); }
.catalog-inline-error { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; padding:12px; border:1px solid var(--red); color:var(--red); background:rgb(255 114 124 / .08); font-size:.78rem; }
.load-more { grid-column:1 / -1; width: 100%; min-height: 48px; margin-top: 12px; border: 1px solid var(--cyan); color: var(--cyan); background: transparent; font-family: var(--mono); font-size: .72rem; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.load-more:hover, .load-more:focus-visible { color: var(--carbon); background: var(--cyan); outline: none; }
input:disabled, select:disabled { opacity: .5; cursor: wait; }

.video-frame { position: relative; aspect-ratio: 16 / 9; background: #030506; border: 1px solid var(--line); overflow: hidden; }
.video-frame::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: repeating-linear-gradient(0deg, transparent 0 3px, rgb(255 255 255 / .018) 3px 4px); }
video { display: block; width: 100%; height: 100%; object-fit: contain; }
.video-placeholder { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; color: var(--muted); background: radial-gradient(circle, #172126, #06090a 65%); }
.video-placeholder[hidden] { display: none; }
.video-placeholder span { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid var(--line); color: var(--cyan); }
.video-placeholder p { font-size: .8rem; }
.now-playing { padding: 19px 0; }
.now-playing h3 { margin: 0 0 8px; font-family: var(--display); font-size: clamp(1.4rem, 3vw, 2.2rem); line-height: 1; text-transform: uppercase; }
.redacted-url { margin: 0; color: var(--muted); font-family: var(--mono); font-size: .72rem; line-height: 1.5; }
.signal-trace { display: grid; grid-template-columns: 10px 1fr; gap: 12px; padding: 16px; border: 1px solid var(--line); background: var(--slate); }
.signal-dot { width: 9px; height: 9px; margin-top: 4px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px rgb(155 171 165 / .1); }
.signal-trace[data-state="loading"] .signal-dot { background: var(--amber); animation: pulse 1s infinite alternate; }
.signal-trace[data-state="playing"] .signal-dot, .signal-trace[data-state="ready"] .signal-dot { background: var(--green); }
.signal-trace[data-state="error"] .signal-dot { background: var(--red); }
.signal-trace dl { display: grid; grid-template-columns: 90px 100px 1fr; gap: 13px; margin: 0; }
.signal-trace dt { color: var(--muted); font-family: var(--mono); font-size: .61rem; letter-spacing: .08em; text-transform: uppercase; }
.signal-trace dd { margin: 3px 0 0; font-size: .78rem; line-height: 1.4; }
.back-to-catalog,.mobile-playback-help { display: none; }
footer { display: flex; justify-content: space-between; gap: 20px; padding: 22px max(18px, calc((100vw - 1500px) / 2)); border-top: 1px solid var(--line); color: var(--muted); font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }

html { scroll-behavior: smooth; scrollbar-color: color-mix(in srgb,var(--cyan) 50%,var(--line)) var(--carbon); scrollbar-width: thin; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: var(--carbon); }
*::-webkit-scrollbar-thumb { background: color-mix(in srgb,var(--cyan) 42%,var(--line)); border: 2px solid var(--carbon); border-radius: 99px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline: 3px solid #b7f4d0; outline-offset: 3px; }
.topbar { position: sticky; top: 0; z-index: 20; display: flex; min-height: 72px; align-items: center; gap: 18px; padding: 10px max(18px,calc((100vw - 1500px)/2)); border-bottom: 1px solid var(--line); background: rgb(6 17 12 / .92); backdrop-filter: blur(18px); }
.topbar p { margin-left: auto; color: var(--muted); font-size: .76rem; }
.account-actions { display: flex; align-items: center; gap: 9px; padding-left: 16px; border-left: 1px solid var(--line); }
.account-actions form { margin: 0; }
.account-actions span { max-width: 180px; overflow: hidden; color: var(--paper); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.account-actions a,.account-actions button { min-height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--cyan); background: var(--slate); font: 700 .68rem var(--mono); text-decoration: none; text-transform: uppercase; cursor: pointer; }
.account-actions a { display: inline-flex; align-items: center; }
.account-actions a:hover,.account-actions button:hover { color: var(--carbon); background: var(--cyan); }
.brand { display: flex; align-items: center; gap: 11px; color: var(--paper); text-decoration: none; }
.brand > span:last-child { display: grid; line-height: 1; }
.brand strong { font-family: var(--display); font-size: 1.28rem; letter-spacing: .12em; }
.brand small { margin-top: 4px; color: var(--cyan); font: 700 .57rem var(--mono); letter-spacing: .18em; }
.brand-signal { display: flex; height: 32px; align-items: end; gap: 3px; transform: skew(-10deg); }
.brand-signal i { display: block; width: 6px; background: var(--cyan); }
.brand-signal i:nth-child(1){height:13px}.brand-signal i:nth-child(2){height:22px}.brand-signal i:nth-child(3){height:31px}
.lab-badge,.privacy-chip { padding: 7px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--cyan); background: var(--slate); font: 700 .67rem var(--mono); text-transform: uppercase; letter-spacing: .08em; }
main { width: min(1500px,calc(100% - 36px)); margin: 0 auto; scroll-margin-top:72px; }
.hero { min-height: 520px; display: grid; align-content: center; grid-template-columns: minmax(260px,.78fr) minmax(620px,1.22fr); gap: clamp(35px,5vw,90px); padding: 70px 0 64px; }
.hero-copy h1 { max-width: 650px; font-size: clamp(3.4rem,7vw,6.8rem); color: var(--paper); text-transform: none; line-height: .92; }
.hero-copy > p:last-child { max-width: 570px; color: var(--muted); font-size: 1.05rem; line-height: 1.6; }
.module-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 12px; align-items: center; }
.module-grid button,.module-grid a { position: relative; display: flex; min-height: 220px; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 24px 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; color: var(--paper); background: linear-gradient(155deg,rgb(23 49 38 / .95),rgb(8 29 20 / .94)); text-align: left; text-decoration: none; cursor: pointer; transform: skew(-3deg); transition: transform .16s,border-color .16s,background .16s; }
.module-grid button:nth-child(1),.module-grid button:nth-child(2),.module-grid button:nth-child(3){grid-column:span 2}.module-grid a{grid-column:span 3;min-height:150px}
.module-grid button > *,.module-grid a > * { transform: skew(3deg); }
.module-grid button > span,.module-grid a > span { margin-bottom:auto; color: var(--cyan); font-size: 2rem; }
.module-grid strong { font-family: var(--display); font-size: 1.18rem; text-transform: uppercase; letter-spacing: .02em; }
.module-grid small { color: var(--muted); line-height: 1.35; }
.module-grid a:hover,.module-grid a:focus-visible,.module-grid button:not(:disabled):hover,.module-grid button:not(:disabled):focus-visible { border-color: var(--cyan); background: linear-gradient(155deg,#1c4b35,#0d271b); transform: skew(-3deg) translateY(-4px); }
.module-grid button:disabled { opacity: .58; cursor: not-allowed; }
.source-panel { scroll-margin-top: 88px; padding: 42px; border: 1px solid var(--line); border-radius: 18px; background: rgb(14 32 24 / .94); }
.source-panel .section-heading { justify-content: space-between; }
.playlist-picker { display: grid; grid-template-columns: minmax(220px, .45fr); margin-bottom: 22px; }
.playlist-picker label { margin-bottom: 8px; color: var(--paper); font: 700 .72rem var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.playlist-picker select { margin: 0; }
.url-form { min-height: 0; padding: 0; border: 0; background: transparent; }
.input-row { gap: 10px; }
.input-row input { height: 52px; border: 1px solid var(--line); border-radius: 12px; }
.secret-field,.password-shell { position: relative; min-width: 0; }
.secret-field input,.password-shell input { width: 100%; padding-right: 84px; }
.secret-field .secret-toggle-control,.password-shell .secret-toggle-control { position: absolute; width: 1px; height: 1px; opacity: 0; }
.secret-toggle { position: absolute; top: 6px; right: 6px; display: inline-flex; min-height: 40px; align-items: center; margin: 0; padding: 0 10px; border: 0; border-radius: 8px; color: var(--cyan); background: var(--slate-raised); font: 700 .67rem var(--mono); cursor: pointer; text-transform: none; letter-spacing: 0; }
.secret-toggle:hover { color: var(--carbon); background: var(--cyan); }
.secret-toggle-control:focus-visible + .secret-toggle { outline: 3px solid var(--focus,#b7f4d0); outline-offset: 3px; }
.input-row button { min-height: 52px; border-radius: 11px; background: var(--cyan); }
.workspace { margin-top: 50px; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: rgb(8 26 18 / .96); }
.catalog-controls { padding-left: 22px; }
.player-panel { padding-right: 22px; }
.lab-settings { scroll-margin-top: 88px; display: grid; grid-template-columns: .65fr 1.35fr; gap: 50px; padding: 68px 0; }
.lab-settings h2 { margin: 0; font: 800 clamp(2rem,4vw,3.8rem)/.95 var(--display); }
.lab-settings ul { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0; padding: 1px; list-style: none; background: var(--line); }
.lab-settings li { display: grid; gap: 7px; padding: 22px; background: var(--slate); }
.lab-settings li strong { color: var(--cyan); }
.lab-settings li span { color: var(--muted); font-size: .84rem; line-height: 1.45; }

.auth-page { min-height: 100vh; background-position: center; }
.auth-shell { width: min(1180px,calc(100% - 36px)); min-height: 100vh; display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(44px,8vw,120px); align-items: center; padding: 64px 0; }
.auth-brand { display: grid; align-content: space-between; min-height: 690px; }
.auth-brand h1,.admin-intro h1 { margin: 0; font: 800 clamp(3.7rem,7.5vw,7rem)/.82 var(--display); letter-spacing: -.055em; text-transform: uppercase; }
.auth-brand h1 span,.admin-intro h1 span { color: transparent; -webkit-text-stroke: 1px var(--cyan); }
.auth-brand > div > p:last-child,.admin-intro > p:last-child { max-width: 610px; color: var(--muted); font-size: 1rem; line-height: 1.65; }
.auth-notes { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin: 0; padding: 1px; list-style: none; background: var(--line); }
.auth-notes li { display: grid; gap: 14px; min-height: 118px; padding: 18px; background: rgb(14 32 24 / .94); }
.auth-notes strong { color: var(--cyan); font: 800 .7rem var(--mono); }
.auth-notes span { color: var(--muted); font-size: .76rem; line-height: 1.45; }
.auth-console { position: relative; padding: clamp(26px,4vw,46px); border: 1px solid var(--line); border-radius: 18px; background: rgb(8 26 18 / .97); }
.auth-console::before { content:""; position:absolute; top:0; left:0; width:94px; height:4px; background:var(--cyan); }
.auth-console-heading { display: flex; gap: 14px; align-items: center; margin-bottom: 32px; }
.auth-console-heading h2 { margin: 0; font: 800 1.7rem var(--display); text-transform: uppercase; }
.signal-status { width: 11px; height: 11px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 6px rgb(104 227 162 / .12); }
.auth-field { display: grid; margin-bottom: 18px; }
.auth-field[hidden] { display:none; }
.auth-field label,.admin-panel label { margin-bottom: 8px; color: var(--paper); font: 700 .7rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.auth-field > input,.password-shell input,.admin-panel > form > input { height: 50px; padding: 0 13px; border-radius: 11px; }
.field-help,.field-error,.form-message { min-height: 19px; margin: 6px 0 0; color: var(--muted); font-size: .74rem; line-height: 1.45; }
.field-error,.form-message[data-state="error"] { color: var(--red); }
.form-message[data-state="success"] { color: var(--green); }
.form-alert { margin: 8px 0 15px; padding: 12px; border-left: 3px solid var(--red); color: var(--red); background: rgb(255 114 124 / .08); font-size: .8rem; }
.auth-submit,.primary-action,.secondary-action,.primary-link { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; border: 1px solid var(--cyan); border-radius: 10px; padding: 0 18px; color: var(--carbon); background: var(--cyan); font-weight: 800; text-decoration: none; cursor: pointer; }
.auth-submit { width: 100%; margin-top: 8px; }
.auth-submit:hover,.primary-action:hover,.primary-link:hover { background: #7be7aa; }
.auth-submit:disabled,.primary-action:disabled,.secondary-action:disabled { opacity: .55; cursor: wait; }
.auth-footnote { margin: 18px 0 0; color: var(--muted); font-size: .74rem; text-align: center; }

.admin-shell { padding: 72px 0 90px; }
.admin-intro { display: grid; grid-template-columns: 1fr .65fr; gap: 28px; align-items: end; margin-bottom: 64px; }
.admin-intro .eyebrow,.admin-intro h1 { grid-column: 1; }
.admin-intro > p:last-child { grid-column: 2; grid-row: 1 / span 2; align-self: end; }
.admin-create-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.admin-panel { padding: 28px; border: 1px solid var(--line); border-radius: 16px; background: rgb(14 32 24 / .94); }
.admin-panel form { display:grid; }
.admin-panel input { width:100%; margin-bottom:15px; }
.admin-panel .password-shell { margin-bottom: 0; }
.admin-panel .primary-action { justify-self:start; margin-top:12px; }
.access-section { margin-top: 58px; padding-top: 38px; border-top: 1px solid var(--line); }
.access-section > .section-heading { justify-content:space-between; }
.section-copy { max-width: 720px; margin: -8px 0 25px; color: var(--muted); line-height:1.55; }
.access-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:start; }
.access-card { display:flex; min-height:300px; flex-direction:column; padding:22px; border:1px solid var(--line); border-radius:15px; background:rgb(8 26 18 / .96); }
.access-card-heading { display:flex; justify-content:space-between; gap:12px; align-items:start; padding-bottom:15px; border-bottom:1px solid var(--line); }
.access-card-heading h3 { margin:0; font:800 1.25rem var(--display); text-transform:uppercase; }
.access-card-heading span { color:var(--muted); font:.67rem var(--mono); text-align:right; }
.access-card fieldset { display:grid; gap:8px; margin:18px 0; padding:0; border:0; }
.access-card legend { margin-bottom:10px; color:var(--muted); font:700 .67rem var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.access-check { display:flex; min-height:48px; align-items:center; gap:11px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; cursor:pointer; }
.access-check:hover { border-color:var(--cyan); }
.access-check input { width:18px; height:18px; accent-color:var(--cyan); }
.access-check span { display:grid; gap:2px; }
.access-check small { color:var(--muted); }
.secondary-action { margin-top:auto; color:var(--cyan); background:transparent; }
.secondary-action:hover { color:var(--carbon); background:var(--cyan); }
.card-import-form { display:grid; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.card-import-form > label { margin-bottom:8px; color:var(--paper); font:700 .67rem var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.card-import-form .secret-field input[type="password"],.card-import-form .secret-field input[type="text"] { width:100%; height:46px; padding:0 78px 0 11px; border-radius:9px; }
.playlist-import-action { min-height:44px; margin-top:9px; border:0; border-radius:9px; color:var(--carbon); background:var(--cyan); font-weight:800; cursor:pointer; }
.playlist-import-action:hover { background:#7be7aa; }
.playlist-import-action:disabled { opacity:.55; cursor:wait; }
.playlist-import-status { min-height:36px; }
.playlist-import-status[data-state="loading"] { color:var(--amber); }
.access-dialog { width:min(520px,calc(100% - 30px)); max-height:calc(100dvh - 30px); padding:0; border:1px solid var(--line); border-radius:16px; color:var(--paper); background:var(--slate); }
.access-dialog::backdrop { background:rgb(0 0 0 / .72); backdrop-filter:blur(5px); }
.access-dialog form { padding:28px; }
.access-dialog h2 { margin:0 0 14px; font:800 1.65rem var(--display); text-transform:uppercase; }
.access-dialog p:not(.eyebrow) { color:var(--muted); line-height:1.55; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
.dialog-actions > button:first-child { min-height:48px; padding:0 16px; border:1px solid var(--line); border-radius:10px; color:var(--paper); background:transparent; cursor:pointer; }

.error-page { min-height:100vh; display:grid; place-items:center; }
.error-shell { width:min(760px,calc(100% - 36px)); padding:40px; border-left:4px solid var(--amber); background:rgb(8 26 18 / .96); }
.error-code { margin:70px 0 14px; color:var(--amber); font:700 .75rem var(--mono); letter-spacing:.12em; }
.error-shell h1 { font-size:clamp(2.5rem,6vw,5rem); }
.error-shell > p:not(.error-code) { max-width:600px; color:var(--muted); line-height:1.6; }
.error-shell .primary-link { margin-top:18px; }

@keyframes pulse { to { opacity: .35; } }
@keyframes catalog-spin { to { transform:rotate(360deg); } }

@media (max-width: 1100px) {
  .hero { grid-template-columns: 1fr; }
  .workspace { grid-template-columns: 230px 1fr; }
  .player-panel { grid-column: 1 / -1; padding: 28px 0; border-top: 1px solid var(--line); }
  .catalog { border-right: 0; }
  .auth-shell { grid-template-columns:1fr; padding:42px 0; }
  .auth-brand { min-height:560px; }
  .access-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width: 720px) {
  body { padding-bottom:calc(72px + env(safe-area-inset-bottom)); background:linear-gradient(rgb(6 17 12 / .84),rgb(6 17 12 / .97)),url('/assets/sinal_cinema_background.png') center top/cover fixed,var(--carbon); }
  .topbar { min-height:64px; gap:8px; padding:8px 12px; }
  .topbar p,.lab-badge { display:none; }
  .account-actions { margin-left:auto; gap:6px; padding-left:0; border-left:0; }
  .account-actions span { display:none; }
  .account-actions a,.account-actions button { min-height:40px; padding:0 9px; font-size:.61rem; }
  .account-actions a { display:inline-flex; }
  .brand { gap:8px; }
  .brand strong { font-size:1.08rem; }
  .brand-signal { height:28px; }
  main { width:min(100% - 24px,1500px); }
  .hero { display:none; }
  .mobile-home-intro { display:block; padding:26px 0 22px; border-bottom:1px solid var(--line); }
  .mobile-home-intro h1 { max-width:330px; font-size:clamp(2.65rem,13vw,4rem); line-height:.88; text-transform:none; }
  .mobile-home-intro > p:last-child { margin:14px 0 0; color:var(--muted); font-size:.9rem; line-height:1.5; }
  .source-panel { margin-top:12px; padding:0 16px 20px; border:1px solid var(--line); border-radius:16px; background:rgb(14 32 24 / .94); scroll-margin-top:76px; }
  .source-panel .section-heading { margin-bottom:16px; }
  .source-panel > .section-heading { padding-top:20px; }
  .privacy-chip { display:none; }
  .playlist-picker { margin-bottom:12px; }
  .mobile-home-shortcuts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:18px; }
  .mobile-home-shortcuts button { display:grid; min-width:0; min-height:104px; align-content:space-between; gap:4px; padding:13px 10px; border:1px solid var(--line); border-radius:12px; color:var(--paper); background:linear-gradient(145deg,var(--slate-raised),var(--carbon)); text-align:left; cursor:pointer; }
  .mobile-home-shortcuts button > span { color:var(--cyan); font-size:1rem; }
  .mobile-home-shortcuts button strong { font:800 .9rem var(--display); text-transform:uppercase; }
  .mobile-home-shortcuts button small { overflow:hidden; color:var(--muted); font:.62rem var(--mono); text-overflow:ellipsis; white-space:nowrap; }
  .mobile-home-shortcuts button:hover,.mobile-home-shortcuts button:focus-visible { border-color:var(--cyan); background:var(--slate-raised); }
  .mobile-home-shortcuts button:disabled { opacity:.48; cursor:not-allowed; }
  .lab-settings{grid-template-columns:1fr}.lab-settings ul{grid-template-columns:1fr}
  .warning-bar { align-items: flex-start; }
  .warning-bar div { display: grid; }
  .app-shell { width: min(100% - 28px, 1500px); padding-top: 38px; }
  .intro, .source-grid, .workspace { grid-template-columns: 1fr; }
  .intro { gap: 25px; padding-bottom: 38px; }
  h1 { font-size: clamp(3rem, 17vw, 5rem); }
  .source-grid { gap: 12px; }
  .url-form { min-height: 140px; padding: 18px; }
  .input-row { grid-template-columns: 1fr; gap: 8px; }
  .input-row input { border-right: 1px solid var(--line); }
  .workspace { display:block; margin-top:28px; }
  .catalog-controls { padding:16px 14px; border-right:0; border-bottom:1px solid var(--line); }
  .workspace[data-view="catalog"] .player-panel { display:none; }
  .workspace[data-view="player"] .catalog-controls,.workspace[data-view="player"] .catalog { display:none; }
  .desktop-catalog-heading,.catalog-kind-tabs { display:none; }
  .catalog-mobile-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; }
  .catalog-mobile-heading .eyebrow { margin-bottom:4px; }
  .catalog-mobile-heading h2 { margin:0; font:800 1.55rem var(--display); text-transform:uppercase; }
  .catalog-mobile-heading p:last-child { margin:4px 0 0; color:var(--muted); font-size:.72rem; }
  .filter-open { display:inline-flex; min-height:46px; align-items:center; gap:7px; padding:0 12px; border:1px solid var(--line); border-radius:10px; color:var(--paper); background:var(--slate); font:700 .7rem var(--mono); cursor:pointer; }
  .filter-open:hover,.filter-open:focus-visible { border-color:var(--cyan); color:var(--cyan); }
  .filter-open b { display:grid; min-width:20px; height:20px; place-items:center; border-radius:999px; color:var(--carbon); background:var(--cyan); font-size:.62rem; }
  body.filter-modal-open { overflow:hidden; }
  .filter-backdrop { position:fixed; inset:0; z-index:var(--z-backdrop); display:block; background:rgb(0 0 0 / .7); backdrop-filter:blur(4px); }
  .filter-drawer { position:fixed; inset:0 auto 0 0; z-index:var(--z-drawer); display:none; width:min(88vw,360px); height:100vh; height:100dvh; max-height:none; margin:0; padding:0 16px 24px; overflow-y:auto; overscroll-behavior:contain; border:0; border-right:1px solid var(--line); border-radius:0 16px 16px 0; color:var(--paper); background:var(--carbon); box-shadow:20px 0 50px rgb(0 0 0 / .45); -webkit-overflow-scrolling:touch; touch-action:pan-y; }
  .filter-drawer[data-open="true"] { display:block; }
  .filter-drawer-heading { position:sticky; top:0; z-index:2; display:flex; min-height:76px; align-items:center; justify-content:space-between; gap:16px; margin:0 -16px 18px; padding:12px 16px; border-bottom:1px solid var(--line); background:rgb(6 17 12 / .97); }
  .filter-drawer-heading .eyebrow { margin-bottom:3px; }
  .filter-drawer-heading h3 { margin:0; font:800 1.2rem var(--display); text-transform:uppercase; }
  .filter-drawer-heading button { display:grid; width:44px; height:44px; place-items:center; border:1px solid var(--line); border-radius:10px; color:var(--paper); background:var(--slate); font-size:1.45rem; cursor:pointer; }
  .filter-drawer-heading button:hover,.filter-drawer-heading button:focus-visible { color:var(--carbon); background:var(--cyan); }
  .catalog-filter-fields { display:block; padding:0; }
  .catalog-filter-fields .playlist-stats { margin-bottom:0; }
  .catalog { max-height:none; padding:12px; overflow:visible; border-right:0; border-bottom:1px solid var(--line); }
  .catalog[data-kind="movies"],.catalog[data-kind="series"] { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .catalog-item-live { min-height:70px; padding:10px 4px; }
  .catalog-item-poster { border-radius:11px; }
  .catalog-item-poster .item-text { padding:10px 0 0 10px; }
  .catalog-item-poster .item-text strong { font-size:.83rem; }
  .catalog-item-poster .item-text span { font-size:.68rem; }
  .catalog-item-poster .item-protocol { margin:10px 8px 0 0; font-size:.58rem; }
  .catalog-state { min-height:340px; }
  .player-panel { padding:0 14px 24px; scroll-margin-top:0; }
  .player-mobile-toolbar { position:sticky; top:64px; z-index:100; display:flex; min-height:54px; align-items:center; justify-content:space-between; gap:12px; margin:0 -14px 20px; padding:6px 14px; border-bottom:1px solid var(--line); background:rgb(6 17 12 / .97); }
  .player-mobile-toolbar button { display:inline-flex; min-height:42px; align-items:center; gap:7px; padding:0 13px; border:1px solid var(--cyan); border-radius:10px; color:var(--cyan); background:var(--slate); cursor:pointer; }
  .player-mobile-toolbar button strong { font:800 .72rem var(--mono); text-transform:uppercase; }
  .player-mobile-toolbar > span { color:var(--muted); font:700 .68rem var(--mono); text-transform:uppercase; }
  .back-to-catalog { display:flex; width:100%; min-height:48px; align-items:center; justify-content:center; margin:0 0 14px; border:1px solid var(--cyan); border-radius:10px; color:var(--cyan); background:transparent; font-weight:800; text-align:center; text-decoration:none; cursor:pointer; }
  .back-to-catalog:hover,.back-to-catalog:focus-visible { color:var(--carbon); background:var(--cyan); }
  .redacted-url { display:none; }
  .playback-diagnostics { margin-top:10px; border:1px solid var(--line); border-radius:11px; background:var(--slate); }
  .playback-diagnostics > summary { display:flex; min-height:46px; align-items:center; justify-content:space-between; padding:0 13px; color:var(--muted); font:700 .68rem var(--mono); cursor:pointer; list-style:none; text-transform:uppercase; }
  .playback-diagnostics > summary::-webkit-details-marker { display:none; }
  .playback-diagnostics > summary::after { content:"+"; color:var(--cyan); font-size:1rem; }
  .playback-diagnostics[open] > summary::after { content:"−"; }
  .playback-diagnostics .signal-trace { border-width:1px 0 0; }
  .mobile-playback-help { display:block; margin-top:10px; color:var(--muted); font-size:.76rem; line-height:1.5; }
  .mobile-playback-help summary { min-height:44px; display:flex; align-items:center; color:var(--cyan); font:700 .68rem var(--mono); cursor:pointer; text-transform:uppercase; }
  .mobile-playback-help p { margin:0 0 8px; }
  .signal-trace dl { grid-template-columns: 1fr 1fr; }
  .trace-result { grid-column: 1 / -1; }
  .mobile-bottom-nav { position:fixed; right:0; bottom:0; left:0; z-index:var(--z-mobile-nav); display:grid; grid-template-columns:repeat(4,1fr); min-height:64px; padding:4px 6px calc(4px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:rgb(6 17 12 / .96); backdrop-filter:blur(16px); pointer-events:auto; }
  .mobile-bottom-nav button { display:grid; min-width:0; min-height:56px; place-content:center; justify-items:center; gap:3px; border:0; border-radius:10px; color:var(--muted); background:transparent; cursor:pointer; }
  .mobile-bottom-nav button span { font-size:1.05rem; line-height:1; }
  .mobile-bottom-nav button strong { font:700 .62rem var(--mono); }
  .mobile-bottom-nav button:hover,.mobile-bottom-nav button:focus-visible { color:var(--paper); background:var(--slate); }
  .mobile-bottom-nav button[aria-current="page"] { color:var(--cyan); background:rgb(70 216 137 / .09); }
  .mobile-bottom-nav button:disabled { opacity:.42; cursor:not-allowed; }
  footer { display: grid; padding-bottom:24px; }
  .playlist-picker{grid-template-columns:1fr}.auth-shell{width:min(100% - 28px,1180px)}.auth-brand{min-height:500px}.auth-notes{grid-template-columns:1fr}.auth-notes li{min-height:0}.admin-intro,.admin-create-grid{grid-template-columns:1fr}.admin-intro>.eyebrow,.admin-intro h1,.admin-intro>p:last-child{grid-column:1;grid-row:auto}.access-grid{grid-template-columns:1fr}.access-section>.section-heading{align-items:flex-start}.access-section .privacy-chip{display:none}.dialog-actions{display:grid}.dialog-actions button{width:100%}
}

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