@font-face { font-family: Inter; src: url("assets/fonts/inter-regular.ttf") format("truetype"); font-weight: 400; }
@font-face { font-family: Inter; src: url("assets/fonts/inter-semibold.ttf") format("truetype"); font-weight: 600; }
@font-face { font-family: Inter; src: url("assets/fonts/inter-bold.ttf") format("truetype"); font-weight: 700; }

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #050507; color: #fff; font-family: Inter, Arial, sans-serif; }
button { font: inherit; color: inherit; }
#canvas { position: absolute; width: 1920px; height: 1080px; overflow: hidden; background: #0b0b0f; transform-origin: 0 0; }
#app { width: 100%; height: 100%; }
.is-hidden { display: none !important; }
.startup-intro { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; overflow: hidden; background: #000; opacity: 1; transition: opacity 180ms ease; }
.startup-intro.is-finishing { opacity: 0; }
.startup-intro-video { position: absolute; top: 0; left: 0; width: 1920px; height: 1080px; object-fit: cover; background: #000; opacity: 0; }
.startup-intro.is-playing .startup-intro-video { opacity: 1; }
.startup-intro-poster { position: absolute; top: 0; left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 1920px; height: 1080px; background: radial-gradient(circle at 50% 45%, #211835 0, #08080b 42%, #000 76%); opacity: 1; transition: opacity 100ms linear; }
.startup-intro.is-playing .startup-intro-poster { opacity: 0; }
.startup-intro-poster img { width: 176px; height: 176px; border-radius: 42px; box-shadow: 0 24px 70px rgba(0,0,0,.55); }
.startup-intro-poster span { margin-top: 28px; color: rgba(255,255,255,.9); font-size: 24px; font-weight: 600; letter-spacing: 8px; }
.startup-intro.is-fallback .startup-intro-poster { opacity: 1; animation: startupFallback 3100ms ease-in-out both; }
@keyframes startupFallback { 0% { opacity: 0; transform: scale(.96); } 20%, 78% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.025); } }
.shell { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 100%; padding: 22px; background: radial-gradient(circle at 88% 5%, #211835 0, #0b0b0f 34%, #0b0b0f 100%); }
.panel { height: 1036px; border: 1px solid rgba(255,255,255,.1); background: linear-gradient(180deg, #181820, #111116); }

.rail { position: relative; width: 226px; padding: 14px 12px; border-radius: 22px 0 0 22px; }
.account-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 72px; padding: 8px; margin-bottom: 11px; border-radius: 16px; background: rgba(255,255,255,.045); }
.account-card { width: 100%; border: 2px solid transparent; outline: 0; color: #F4F4F6; text-align: left; cursor: pointer; }
.account-card:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.account-card:focus span { color: #09090C; }
.account-card img { width: 52px; height: 52px; margin-right: 12px; border-radius: 14px; }
.account-card strong, .account-card span { display: block; }
.account-card strong { font-size: 20px; letter-spacing: -.35px; }
.account-card span { margin-top: 4px; color: #a0a0a0; font-size: 11px; letter-spacing: .7px; }
#rail-list button, #category-list button { width: 100%; border: 2px solid transparent; background: transparent; outline: 0; }
/* PARIDADE-DESIGN-TOKENS-2026-09-06 achado 4: o Android so tem 2 factores de
   escala de foco, TvTokens.FocusScale=1.03 (linhas/pilulas/botoes/menu) e
   FocusScaleArtCard=1.05 (cartoes com capa dominante). Todo transform:scale
   de :focus neste ficheiro segue um dos dois -- nunca um terceiro valor. */
.rail-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 53px; padding: 0 10px; margin-bottom: 3px; border-radius: 13px; color: #a0a0a8; font-size: 16px; font-weight: 500; text-align: left; transition: color 120ms ease, background 120ms ease, transform 120ms ease; }
.rail-item.is-selected { color: #fff; background: rgba(142,115,230,.17); }
.rail-item:focus { color: #fff; border-color: #8e73e6 !important; background: rgba(142,115,230,.2) !important; box-shadow: 0 8px 24px rgba(0,0,0,.35); transform: scale(1.03); }
.rail-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 34px; height: 34px; margin-right: 9px; border-radius: 50%; color: #9f8bee; background: rgba(255,255,255,.045); }
.rail-icon svg { width: 23px; height: 23px; fill: currentColor; }
.rail-item.is-selected .rail-icon, .rail-item:focus .rail-icon { color: #fff; background: #5c3bb0; }
.rail-version { position: absolute; bottom: 15px; left: 25px; color: #676773; font-size: 9px; letter-spacing: 1.2px; }

.category-panel { width: 286px; padding: 28px 16px; border-left: 0; }
header h1, header h2 { margin: 5px 0 22px; }
header h1 { font-size: 32px; letter-spacing: -.8px; }
.eyebrow { color: #9f8bee; font-size: 12px; font-weight: 700; letter-spacing: 1.7px; }
.category-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 55px; padding: 0 14px; margin-bottom: 7px; border-radius: 12px; color: #a0a0a8; font-size: 17px; text-align: left; transition: color 120ms ease, background 120ms ease, transform 120ms ease; }
.category-item small { color: #777783; font-size: 13px; }
.category-item.is-selected { color: #fff; background: rgba(142,115,230,.13); }
.category-item.is-selected small { color: #9f8bee; }
.category-item:focus { color: #fff; border-color: #8e73e6 !important; background: rgba(142,115,230,.2) !important; box-shadow: 0 8px 24px rgba(0,0,0,.28); transform: scale(1.03); }

.stage { width: 1364px; padding: 28px 24px 0; border-left: 0; border-radius: 0 22px 22px 0; background: #0b0b0f; }
.stage-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 126px; padding: 0 6px; }
.stage-header h2 { margin-top: 6px; font-size: 35px; letter-spacing: -1px; }
.header-meta { padding-top: 9px; color: #808692; font-size: 14px; }
.header-meta > span { margin-left: 14px; }
.sync-status { color: #8e73e6; font-size: 11px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; }
.source-scope { max-width: 190px; overflow: hidden; color: #858A98; font-size: 11px; font-weight: 600; letter-spacing: .4px; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.source-scope.is-active { color: #70A5E0; }
.is-offline .sync-status { color: #e6b94e; }
.is-offline .stage-header { border-bottom: 1px solid rgba(230,185,78,.18); }
.platform-pill { padding: 7px 12px; border: 1px solid rgba(142,115,230,.34); border-radius: 999px; color: #9f8bee; text-transform: uppercase; }
.stage-body { display: -webkit-box; display: -ms-flexbox; display: flex; width: 1316px; height: 850px; }
.content-viewport { position: relative; height: 850px; overflow: hidden; }
#content-spacer { width: 1px; opacity: 0; }
#content-window { position: absolute; top: 0; left: 0; width: 100%; }
.channel-mode .content-viewport { width: 820px; }
.poster-mode .content-viewport { width: 1316px; }
/* Channel list layout ("channelListExpanded" on Android, default on): a
   3-column layout (channels | schedule | preview) instead of the classic
   2-column one. This shell renders at a FIXED virtual 1920x1080 canvas
   (#canvas, scaled via transform, never reflowed) -- .stage-body is always
   exactly 1316px, so there is no Android-style width-threshold fallback to
   compute at runtime; the 3-column budget below either applies or it
   doesn't, decided purely by the .agenda-on modifier. */
.stage-body.agenda-on .content-viewport { width: 560px; }
.poster-mode #content-window { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.channel-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: calc(100% - 10px); height: 80px; margin: 4px 5px; padding: 0 14px; border: 2px solid transparent; border-radius: 13px; outline: 0; background: #121218; text-align: left; transition: border 120ms ease, background 120ms ease, transform 120ms ease; }
.channel-row:focus { border-color: #8e73e6; background: #211b30; box-shadow: 0 10px 30px rgba(0,0,0,.38); transform: scale(1.03); }
.channel-row.is-selected .channel-logo { color: #fff; background: #5c3bb0; }
.channel-number { width: 47px; color: #808692; font-size: 15px; text-align: center; }
.channel-logo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 54px; height: 54px; margin: 0 16px 0 4px; border-radius: 12px; background: #242431; color: #a0a0a0; font-size: 13px; font-weight: 700; }
.channel-logo-image { width: 100%; height: 100%; object-fit: contain; border-radius: 10px; }
.channel-logo-fallback { display: none; }
.channel-logo.is-image-broken .channel-logo-fallback { display: inline; }
.channel-logo.is-image-broken .channel-logo-image, .is-image-broken > img { display: none; }
.channel-copy { position: relative; display: block; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; padding-right: 18px; }
.channel-copy strong, .channel-copy small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.channel-copy strong { margin-bottom: 6px; font-size: 19px; }
.channel-copy small { color: #a0a0a0; font-size: 13px; }
.channel-favorite { display: inline-block; margin-left: 10px; color: #f0c94b; font-size: 14px; vertical-align: 2px; }
.row-progress { position: absolute; left: 0; right: 18px; bottom: -11px; height: 3px; border-radius: 3px; background: #292934; }
.row-progress i { display: block; height: 100%; border-radius: 3px; background: #8e73e6; }
.channel-live { margin-left: auto; padding: 5px 8px; border-radius: 6px; color: #9f8bee; background: rgba(142,115,230,.12); font-size: 10px; font-weight: 700; }
.channel-skeleton { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: calc(100% - 10px); height: 80px; margin: 4px 5px; padding: 0 18px; border-radius: 13px; background: #121218; }
.channel-skeleton i, .channel-skeleton b, .channel-skeleton span { display: block; border-radius: 8px; background: rgba(255,255,255,.08); animation: skeletonPulse 1200ms ease-in-out infinite alternate; }
.channel-skeleton i { width: 44px; height: 44px; margin-right: 20px; border-radius: 12px; }
.channel-skeleton b { width: 300px; height: 16px; }
.channel-skeleton span { width: 130px; height: 12px; margin-left: auto; }
.content-empty-state { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; min-height: 220px; padding: 34px; color: #A0A0A8; }
.content-empty-state strong { color: #F4F4F6; font-size: 22px; }
.content-empty-state span { margin-top: 8px; font-size: 15px; }
.content-empty-action { min-width: 154px; margin-top: 22px; padding: 12px 22px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 17px; cursor: pointer; }
.content-empty-action:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.content-error-state { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: 100%; min-height: 260px; padding: 34px; color: #A0A0A8; }
.content-error-state strong { color: #F4F4F6; font-size: 24px; }
.content-error-state span { max-width: 520px; margin-top: 9px; font-size: 16px; line-height: 1.45; }
.content-retry { min-width: 150px; margin-top: 22px; padding: 12px 22px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 17px; cursor: pointer; }
.content-retry:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }

.schedule-panel { display: none; width: 0; height: 850px; overflow: hidden; }
.stage-body.agenda-on .schedule-panel { display: block; width: 328px; height: 850px; margin-left: 24px; overflow-y: auto; }
.schedule-heading { margin-bottom: 12px; }
.schedule-heading .eyebrow { color: #9f8bee; font-size: 12px; letter-spacing: 1.5px; }
.schedule-row { display: block; width: calc(100% - 6px); min-height: 58px; margin: 0 3px 6px; padding: 9px 12px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: #121218; text-align: left; cursor: pointer; }
.schedule-row:focus { border-color: #8e73e6; background: #211b30; box-shadow: 0 10px 30px rgba(0,0,0,.38); transform: scale(1.03); }
.schedule-row-time { display: block; margin-bottom: 4px; color: #808692; font-size: 12px; }
.schedule-row-title { display: block; overflow: hidden; color: #F4F4F6; font-size: 15px; white-space: nowrap; text-overflow: ellipsis; }
.schedule-row.is-current .schedule-row-time { color: #9f8bee; }
.schedule-row-reminder { margin-left: 6px; color: #70A5E0; font-size: 11px; }
.schedule-empty { padding: 20px 4px; color: #a0a0a8; font-size: 14px; line-height: 1.4; }

.poster-card { display: block; width: 168px; height: 292px; padding: 0; margin: 0 20px 14px 0; overflow: visible; border: 3px solid transparent; border-radius: 17px; outline: 0; background: transparent; text-align: left; transition: transform 130ms ease, border 130ms ease, box-shadow 130ms ease; }
.poster-card:focus { z-index: 2; border-color: #8e73e6; background: #17131f; box-shadow: 0 18px 40px rgba(0,0,0,.62), 0 0 0 2px rgba(142,115,230,.18); transform: scale(1.05); }
.poster-art { position: relative; display: block; width: 162px; height: 220px; overflow: hidden; border-radius: 13px; background: linear-gradient(155deg, #3c294e, #101016 72%); }
.poster-art-image { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; opacity: .82; }
.poster-art:after { position: absolute; right: -34px; bottom: 24px; width: 120px; height: 120px; border: 5px solid currentColor; border-radius: 50%; content: ""; opacity: .45; }
.poster-monogram { position: absolute; left: 18px; top: 20px; z-index: 1; color: rgba(255,255,255,.84); font-size: 58px; font-weight: 700; letter-spacing: -4px; }
.poster-cover-title { position: absolute; right: 14px; bottom: 48px; left: 14px; z-index: 2; max-height: 48px; overflow: hidden; color: #fff; font-size: 15px; font-weight: 700; line-height: 18px; text-shadow: 0 2px 8px rgba(0,0,0,.8); }
.poster-cover-meta { position: absolute; right: 14px; bottom: 29px; left: 14px; z-index: 2; overflow: hidden; color: rgba(255,255,255,.78); font-size: 9px; white-space: nowrap; text-overflow: ellipsis; text-shadow: 0 2px 8px rgba(0,0,0,.8); }
.poster-play { position: absolute; left: 56px; top: 91px; z-index: 2; width: 50px; height: 50px; border: 2px solid currentColor; border-radius: 50%; background: rgba(8,8,11,.46); font-size: 20px; line-height: 46px; text-align: center; text-indent: 3px; }
.poster-art small { position: absolute; left: 14px; bottom: 12px; z-index: 2; padding: 4px 7px; border-radius: 5px; background: rgba(8,8,11,.55); color: rgba(255,255,255,.8); font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.poster-favorite { position: absolute; top: 12px; right: 12px; z-index: 3; width: 30px; height: 30px; border-radius: 50%; background: #70A5E0; color: #09090C; font-size: 18px; line-height: 30px; text-align: center; }
.poster-progress { position: absolute; right: 12px; bottom: 7px; left: 12px; z-index: 3; display: block; height: 3px; overflow: hidden; border-radius: 3px; background: rgba(255,255,255,.22); }
.poster-progress i { display: block; height: 100%; background: #70A5E0; }
.poster-card > strong { display: -webkit-box; height: 38px; margin: 9px 7px 1px; overflow: hidden; font-size: 14px; line-height: 19px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.poster-meta { display: block; margin: 0 7px; overflow: hidden; color: #808692; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }
.poster-skeleton { width: 168px; height: 292px; margin: 0 20px 14px 0; border-radius: 17px; background: #121218; }
.poster-skeleton i, .poster-skeleton b, .poster-skeleton span { display: block; margin-right: 14px; margin-left: 14px; border-radius: 8px; background: rgba(255,255,255,.08); animation: skeletonPulse 1200ms ease-in-out infinite alternate; }
.poster-skeleton i { width: 140px; height: 210px; margin-top: 14px; }
.poster-skeleton b { width: 112px; height: 13px; margin-top: 12px; }
.poster-skeleton span { width: 82px; height: 10px; margin-top: 8px; }
@keyframes skeletonPulse { from { opacity: .42; } to { opacity: .9; } }
.settings-shortcut { width: 42px; height: 42px; margin-left: 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 12px; background: rgba(255,255,255,.06); color: #fff; font-size: 23px; line-height: 38px; text-align: center; cursor: pointer; }
.settings-shortcut:focus { border-color: #8e73e6; outline: 0; box-shadow: 0 0 0 2px rgba(142,115,230,.2); }
.diagnostics-status { max-width: 420px; padding: 6px 9px; border: 1px solid rgba(112,165,224,.35); border-radius: 8px; color: #70A5E0; font-size: 10px; letter-spacing: .2px; }
.local-media-list { display: block; max-height: 430px; overflow: auto; margin: 22px 0; }
.local-media-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 82px; margin: 0 0 8px; padding: 0; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.045); color: #fff; text-align: left; }
.local-media-open { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-height: 82px; padding: 12px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: transparent; color: #fff; text-align: left; cursor: pointer; }
.local-media-open:focus { border-color: #8e73e6; outline: 0; box-shadow: 0 0 0 2px rgba(142,115,230,.2); }
.local-media-remove { width: 42px; height: 42px; margin-right: 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; outline: 0; background: rgba(255,255,255,.06); color: #A0A0A8; font-size: 25px; line-height: 35px; cursor: pointer; }
.local-media-remove:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.local-media-prepare { min-width: 118px; margin: 0 8px; padding: 8px 10px; border: 1px solid rgba(112,165,224,.42); border-radius: 9px; outline: 0; background: rgba(112,165,224,.12); color: #70A5E0; font-size: 11px; font-weight: 700; cursor: pointer; }
.local-media-prepare:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.local-media-art { display: block; width: 48px; height: 48px; margin-right: 12px; border-radius: 10px; background: linear-gradient(145deg, #704db2, #1e1831); color: #fff; font-size: 25px; line-height: 48px; text-align: center; }
.local-media-art.has-image { position: relative; overflow: hidden; background: #171721; }
.local-media-art.has-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.local-media-art.has-image > span { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; background: linear-gradient(145deg, #704db2, #1e1831); }
.local-media-art.has-image.is-image-broken > span { display: flex; }
.local-media-open > span:nth-child(2) { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }
.local-media-item strong, .local-media-item small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.local-media-item small { margin-top: 5px; color: #9da2b2; font-size: 11px; }
.local-media-item i { display: block; height: 4px; margin-top: 8px; overflow: hidden; border-radius: 3px; background: rgba(255,255,255,.14); }
.local-media-item i b { display: block; height: 100%; background: #8e73e6; }
.local-media-item em { margin-left: 12px; color: #b8a8f1; font-size: 11px; font-style: normal; }
.surface-empty { margin: 22px 0; color: #a5a8b4; }
.surface-action { min-width: 190px; margin: 16px 10px 0 0; padding: 13px 22px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 17px; }
.surface-action:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.addons-card { width: 1560px; max-height: 940px; padding: 42px 50px 36px; overflow: hidden auto; border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: #1A1A22; box-shadow: 0 24px 70px rgba(0,0,0,.68); }
.addons-paste { margin-top: 18px; padding: 48px 40px 34px; border-radius: 22px; background: #20202A; }
.addons-paste-button { min-width: 260px; padding: 18px 30px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #F4F4F6; color: #09090C; font-size: 23px; cursor: pointer; }
.addons-paste-button:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.addons-paste-editor { margin-top: 24px; padding: 22px; border: 1px solid rgba(112,165,224,.35); border-radius: 14px; background: rgba(0,0,0,.16); }
.addons-paste-editor label { display: block; margin-bottom: 9px; color: #F4F4F6; font-size: 15px; }
.addon-address-input { box-sizing: border-box; width: 100%; padding: 14px 16px; border: 2px solid rgba(255,255,255,.16); border-radius: 10px; outline: 0; background: #111116; color: #F4F4F6; font: inherit; font-size: 17px; }
.addon-address-input:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.22); }
.addons-paste-editor div { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 14px; }
.addon-add-confirm, .addon-add-cancel { margin-right: 10px; padding: 10px 16px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #334057; color: #F4F4F6; font-weight: 600; }
.addon-add-cancel { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #A0A0A8; }
.addon-add-confirm:focus, .addon-add-cancel:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.addon-address-state { min-height: 18px; margin: 13px 0 0 !important; color: #70A5E0 !important; font-size: 13px !important; }
.addons-paste p { max-width: 1180px; margin: 24px 8px 0; color: #A0A0A8; font-size: 17px; line-height: 1.55; }
.addons-card h2 { margin: 58px 8px 86px; color: #F4F4F6; font-size: 31px; font-weight: 400; }
.addons-installed-label { display: block; margin: 0 8px 16px; }
.addons-installed { overflow: hidden; border-radius: 22px; background: #20202A; }
.addon-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 102px; padding: 14px 24px; border-bottom: 1px solid rgba(255,255,255,.08); }
.addon-row:last-child { border-bottom: 0; }
.addon-mark { display: block; width: 52px; height: 52px; margin-right: 18px; border-radius: 50%; color: #F4F4F6; font-size: 25px; line-height: 52px; text-align: center; }
.addon-aio { background: #F4F4F6; color: #20202A; }
.addon-torrentio { border: 2px solid #00B85A; color: #00B85A; font-weight: 700; }
.addon-custom { background: #334057; color: #70A5E0; }
.addon-row strong { width: 240px; color: #F4F4F6; font-size: 22px; font-weight: 400; }
.addon-row small { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #A0A0A8; font-size: 16px; text-align: right; }
.addon-move { width: 74px; height: 58px; margin-left: 14px; border: 0; border-radius: 30px; outline: 0; background: #334057; color: #70A5E0; font-size: 28px; cursor: pointer; }
.addon-move:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.addons-card .search-close { margin-top: 28px; }
.cloud-sync-card { width: 920px; min-height: 560px; padding: 58px 66px 42px; border: 1px solid rgba(112,165,224,.48); border-radius: 28px; background: linear-gradient(145deg, #202633, #111116 72%); box-shadow: 0 30px 90px rgba(0,0,0,.7); }
.cloud-sync-card h2 { margin: 12px 0 14px; color: #F4F4F6; font-size: 36px; font-weight: 400; }
.cloud-sync-intro { max-width: 730px; margin: 0; color: #A0A0A8; font-size: 18px; line-height: 1.55; }
.cloud-sync-status-list { margin: 34px 0 24px; border-top: 1px solid rgba(255,255,255,.1); }
.cloud-sync-status-list div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; min-height: 62px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.1); color: #A0A0A8; font-size: 18px; }
.cloud-sync-status-list strong { color: #F4F4F6; font-weight: 400; text-align: right; }
.cloud-sync-state { min-height: 27px; color: #70A5E0; font-size: 17px; }
.cloud-sync-account { margin: 28px 0 24px; padding: 22px 24px; border: 1px solid rgba(112,165,224,.24); border-radius: 18px; background: rgba(7,8,13,.38); }
.cloud-sync-account-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; color: #A0A0A8; font-size: 14px; letter-spacing: .16em; }
.cloud-sync-account-heading strong { color: #F4F4F6; font-size: 16px; font-weight: 500; letter-spacing: .02em; }
.cloud-sync-account-detail { min-height: 25px; margin: 10px 0 18px; color: #A0A0A8; font-size: 16px; }
.cloud-sync-login { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 14px; }
.cloud-sync-login label { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #A0A0A8; font-size: 14px; }
.cloud-sync-login input { display: block; width: 100%; margin-top: 7px; padding: 11px 13px; border: 1px solid rgba(255,255,255,.16); border-radius: 9px; outline: 0; box-sizing: border-box; background: rgba(255,255,255,.08); color: #F4F4F6; font: inherit; }
.cloud-sync-login input:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.cloud-sync-account-actions { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 16px; }
.cloud-sync-account-actions button { margin-right: 10px; padding: 10px 15px; border: 1px solid rgba(255,255,255,.15); border-radius: 10px; outline: 0; background: rgba(255,255,255,.08); color: #F4F4F6; font-size: 15px; }
.cloud-sync-account-actions button:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.cloud-sync-account-actions button:disabled { opacity: .48; }
.cloud-sync-devices { margin: 0 0 24px; padding: 22px 24px; border: 1px solid rgba(112,165,224,.24); border-radius: 18px; background: rgba(7,8,13,.38); }
.cloud-sync-devices-heading { color: #A0A0A8; font-size: 14px; letter-spacing: .16em; }
.cloud-sync-devices-state { min-height: 20px; margin: 10px 0 0; color: #A0A0A8; font-size: 15px; }
.cloud-sync-devices-list { margin-top: 10px; }
.cloud-sync-device-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.1); }
.cloud-sync-device-row:last-child { border-bottom: 0; }
.cloud-sync-device-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 3px; }
.cloud-sync-device-info strong { color: #F4F4F6; font-size: 15px; font-weight: 500; }
.cloud-sync-device-info span { color: #A0A0A8; font-size: 13px; }
.cloud-sync-device-badge { padding: 2px 7px; border: 1px solid rgba(112,165,224,.5); border-radius: 6px; background: rgba(112,165,224,.16); color: #70A5E0; font-size: 11px; font-weight: 600; letter-spacing: .04em; }
.cloud-sync-device-revoke { -webkit-box-flex: 0; -ms-flex: none; flex: none; margin-left: 14px; padding: 8px 13px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; outline: 0; background: rgba(255,255,255,.08); color: #F4F4F6; font-size: 13px; }
.cloud-sync-device-revoke:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.cloud-sync-device-revoke:disabled { opacity: .48; }
.cloud-sync-devices-empty { margin: 10px 0 0; color: #A0A0A8; font-size: 13px; }
.cloud-sync-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 34px; }
.cloud-sync-card footer button { min-width: 170px; margin-right: 14px; padding: 14px 24px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: rgba(255,255,255,.08); color: #A0A0A8; font-size: 18px; }
.cloud-sync-card footer .cloud-sync-run { background: #F4F4F6; color: #09090C; }
.cloud-sync-card footer .cloud-sync-view-profiles { background: rgba(112,165,224,.16); color: #F4F4F6; }
.cloud-sync-card footer button:focus { border-color: #70A5E0; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.cloud-sync-card footer button:disabled { opacity: .48; }
.accent-copper { color: #bd7045; background: linear-gradient(155deg, #6b3925, #111116 72%); }
.accent-slate { color: #8091ad; background: linear-gradient(155deg, #353c4b, #111116 72%); }
.accent-ocean { color: #3a93d2; background: linear-gradient(155deg, #214f72, #0d131a 72%); }
.accent-violet { color: #8e73e6; background: linear-gradient(155deg, #49416f, #111116 72%); }
.accent-forest { color: #46a36b; background: linear-gradient(155deg, #21543a, #0d1510 72%); }
.accent-crimson { color: #d14b56; background: linear-gradient(155deg, #68262c, #160d0f 72%); }
.accent-gold { color: #d2ad25; background: linear-gradient(155deg, #68571c, #17140b 72%); }

.preview-panel { width: 472px; height: 850px; margin-left: 24px; padding: 0 2px 0 0; }
.poster-mode .preview-panel { display: none; }
.stage-body.agenda-on .preview-panel { width: 380px; }
.stage-body.agenda-on .preview-video { width: 378px; }
.preview-video { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 470px; height: 264px; margin-bottom: 32px; overflow: hidden; border: 1px solid #2d2d39; border-radius: 17px; background: radial-gradient(circle, #3d2d62 0, #17131f 55%, #09090c 100%); }
.preview-art { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 100%; overflow: hidden; color: #8e73e6; }
.preview-art img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; opacity: .82; }
.preview-art.has-image:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(8,8,11,.08), rgba(8,8,11,.54)); content: ""; }
.preview-art.has-image > .preview-mark { display: none; }
.preview-art.has-image.is-image-broken > img { display: none; }
.preview-art.has-image.is-image-broken > .preview-mark { display: block; }
.preview-mark { width: 98px; height: 98px; border: 3px solid rgba(255,255,255,.1); border-radius: 50%; color: #8e73e6; font-size: 68px; font-weight: 700; line-height: 92px; text-align: center; }
.live-pill { position: absolute; top: 14px; right: 14px; padding: 7px 10px; border-radius: 6px; background: #8e3f3f; font-size: 10px; font-weight: 700; }
.preview-copy h2 { margin: 9px 0 20px; font-size: 28px; letter-spacing: -.6px; }
.preview-copy h3 { margin: 0 0 9px; font-size: 20px; line-height: 1.35; }
.preview-copy p { margin: 0; color: #a0a0a0; font-size: 15px; }
.progress-track { width: 100%; height: 5px; margin-top: 22px; overflow: hidden; border-radius: 6px; background: #292934; }
.progress-track span { display: block; height: 100%; background: #8e73e6; }
.help-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-top: 106px; padding: 17px 19px; border-radius: 15px; background: #17171f; }
.help-card strong { margin-bottom: 9px; color: #9f8bee; font-size: 13px; }
.help-card span { margin-top: 5px; color: #a0a0a0; font-size: 13px; }

.notice { position: absolute; left: 50%; bottom: 50px; z-index: 20; min-width: 600px; max-width: 1050px; padding: 20px 28px; border: 1px solid #8e73e6; border-radius: 14px; background: #1a1724; box-shadow: 0 12px 50px rgba(0,0,0,.55); font-size: 18px; text-align: center; transform: translateX(-50%); }
.pairing-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(5,5,7,.94); }
.pairing-card { width: 720px; min-height: 520px; padding: 52px 64px; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); text-align: center; }
.pairing-brand { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 56px; color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 4px; }
.pairing-brand img { width: 48px; height: 48px; margin-right: 15px; border-radius: 13px; }
.pairing-state { min-height: 50px; color: #fff; font-size: 30px; font-weight: 600; letter-spacing: -.5px; }
.pairing-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 158px; margin-top: 24px; color: #a0a0a8; font-size: 16px; line-height: 1.55; }
.pairing-presentation { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; }
.pairing-code-stack { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
/* Sizing (width/height/grid-template-columns/rows) is set inline by
   renderPairingQr() (src/services/pairingQr.ts), driven by the encoded QR's
   real module count — a real QR is not always 21x21 (version 1), unlike the
   decorative pattern this replaced. Only chrome that doesn't depend on the
   module count lives here. */
.pairing-visual { margin-right: 28px; padding: 9px; box-sizing: content-box; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.pairing-visual i { display: block; }
.pairing-code { margin: 4px 0 17px; color: #fff; font-size: 52px; font-weight: 700; letter-spacing: 9px; }
.pairing-help { max-width: 520px; }
.pairing-transient-error { margin-top: 12px; color: #f3bd78; font-size: 13px; }
.pairing-source-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; max-width: 520px; margin-top: 20px; }
.pairing-source-row { display: block; padding: 9px 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: rgba(255,255,255,.04); color: #fff; font-size: 14px; }
.pairing-source-row + .pairing-source-row { margin-top: 7px; }
.pairing-url { max-width: 600px; margin-top: 17px; overflow: hidden; color: #8e73e6; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.pairing-copy { margin-top: 12px; padding: 8px 14px; border: 1px solid rgba(142,115,230,.7); border-radius: 8px; outline: 0; background: rgba(142,115,230,.1); color: #fff; font-size: 12px; }
.pairing-copy:focus { background: #5c3bb0; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.pairing-action { min-width: 180px; margin-top: 34px; padding: 15px 26px; border: 2px solid #8e73e6; border-radius: 12px; outline: 0; background: rgba(142,115,230,.14); color: #fff; font-weight: 600; }
.pairing-action:focus { background: #5c3bb0; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.details-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(5,5,7,.94); }
.details-card { width: 860px; max-height: 900px; padding: 48px 58px; overflow: hidden; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.details-heading h2 { margin: 7px 0 10px; font-size: 34px; }
.details-heading p { margin: 0; color: #a0a0a8; font-size: 16px; }
.movie-details-meta { margin-top: 22px; color: #9f8bee; font-size: 14px; }
.details-play { min-width: 180px; margin-top: 28px; padding: 14px 24px; border: 2px solid #8e73e6; border-radius: 11px; outline: 0; background: #5c3bb0; color: #fff; font-weight: 600; }
.details-play:disabled { cursor: not-allowed; opacity: .5; }
.details-play:focus { background: #7653d2; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.details-state { margin: 28px 0 14px; color: #a0a0a8; font-size: 15px; }
.details-episodes { max-height: 560px; overflow: hidden auto; }
.episode-season { margin: 18px 0 7px; color: #9f8bee; font-size: 12px; font-weight: 700; letter-spacing: 1.3px; text-transform: uppercase; }
.episode-item { display: block; width: 100%; min-height: 64px; margin: 7px 0; padding: 12px 16px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: rgba(255,255,255,.05); color: #a0a0a8; text-align: left; }
.episode-item strong { display: block; margin-top: 4px; color: #fff; font-size: 17px; }
.episode-item:focus { border-color: #8e73e6; background: rgba(142,115,230,.22); box-shadow: 0 8px 25px rgba(0,0,0,.3); }
.details-close { min-width: 160px; margin-top: 22px; padding: 13px 22px; border: 2px solid #8e73e6; border-radius: 11px; outline: 0; background: rgba(142,115,230,.14); color: #fff; font-weight: 600; }
.details-close:focus { background: #5c3bb0; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.details-retry { min-width: 160px; margin-top: 14px; padding: 11px 20px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.details-retry:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.search-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(5,5,7,.94); }
.search-card { width: 900px; max-height: 900px; padding: 48px 58px; overflow: hidden; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.search-card h2 { margin: 8px 0 22px; font-size: 32px; }
.about-help-card { width: 980px; max-height: 900px; }
.help-intro { max-width: 760px; margin: 0 0 26px; color: #A0A0A8; font-size: 17px; line-height: 1.5; }
.help-facts { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 20px 0 28px; }
.help-facts div { min-width: 150px; margin-right: 12px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 13px; background: rgba(255,255,255,.045); }
.help-facts span, .help-facts strong { display: block; }
.help-facts span { color: #858A98; font-size: 12px; text-transform: uppercase; letter-spacing: .8px; }
.help-facts strong { margin-top: 7px; color: #F4F4F6; font-size: 17px; font-weight: 500; }
.help-command-list { padding: 22px 24px; border: 1px solid rgba(112,165,224,.28); border-radius: 16px; background: rgba(112,165,224,.08); }
.help-command-list h3 { margin: 0 0 12px; color: #F4F4F6; font-size: 20px; font-weight: 500; }
.help-command-list p { margin: 9px 0 0; color: #A0A0A8; font-size: 15px; line-height: 1.55; }
.help-command-list b { color: #70A5E0; font-weight: 600; }
.help-boundary { margin: 24px 0 0; color: #70707B; font-size: 13px; line-height: 1.5; }
.about-help-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 22px; }
.about-help-card footer button { min-width: 150px; margin: 0 12px 0 0; padding: 13px 18px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.about-help-card footer button:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.about-help-card footer .search-close { margin-top: 0; }
.privacy-card { width: 980px; max-height: 900px; }
.privacy-intro { max-width: 800px; margin: 0 0 24px; color: #A0A0A8; font-size: 17px; line-height: 1.5; }
.privacy-facts { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 20px 0 26px; }
.privacy-facts div { min-width: 170px; margin-right: 12px; padding: 14px 16px; border: 1px solid rgba(112,165,224,.24); border-radius: 13px; background: rgba(112,165,224,.08); }
.privacy-facts span, .privacy-facts strong { display: block; }
.privacy-facts span { color: #858A98; font-size: 12px; text-transform: uppercase; letter-spacing: .8px; }
.privacy-facts strong { margin-top: 7px; color: #F4F4F6; font-size: 16px; font-weight: 500; }
.privacy-boundary { padding: 20px 24px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.045); }
.privacy-boundary h3 { margin: 0 0 8px; color: #F4F4F6; font-size: 19px; font-weight: 500; }
.privacy-boundary h3:not(:first-child) { margin-top: 18px; }
.privacy-boundary p { margin: 0; color: #A0A0A8; font-size: 15px; line-height: 1.55; }
.privacy-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 22px; }
.privacy-card footer button { min-width: 170px; margin: 0 12px 0 0; padding: 13px 18px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.privacy-card footer button:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.settings-card { width: 820px; }
.settings-list { margin: 10px 0 8px; border-top: 1px solid rgba(255,255,255,.1); }
.settings-list div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 18px 4px; border-bottom: 1px solid rgba(255,255,255,.08); color: #a0a0a8; font-size: 15px; }
.settings-list strong { color: #fff; font-weight: 500; }
.settings-list .setting-toggle { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 18px 4px; border: 0; border-bottom: 1px solid rgba(255,255,255,.08); outline: 0; background: transparent; color: #a0a0a8; font: inherit; text-align: left; }
.settings-list .setting-toggle strong { color: #5cc8ff; font-weight: 600; }
.settings-list .setting-toggle:focus { border-radius: 8px; background: rgba(255,255,255,.08); box-shadow: 0 0 0 3px rgba(92,200,255,.35); }
.setting-pin { min-width: 220px; margin-top: 16px; padding: 13px 22px; border: 2px solid #5cc8ff; border-radius: 11px; outline: 0; background: rgba(92,200,255,.12); color: #fff; font-weight: 600; }
.setting-pin:focus { background: rgba(92,200,255,.28); box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.pin-card { width: 620px; text-align: center; }
.pin-card h2 { margin-bottom: 24px; }
.pin-input { width: 260px; padding: 14px 18px; border: 2px solid #4a405f; border-radius: 12px; outline: 0; background: #0d0c12; color: #fff; font-size: 32px; letter-spacing: 12px; text-align: center; }
.pin-input:focus { border-color: #8e73e6; box-shadow: 0 0 0 3px rgba(142,115,230,.2); }
.pin-help { color: #a0a0a8; font-size: 14px; }
.reduced-motion *, .reduced-motion *::before, .reduced-motion *::after { -webkit-transition-duration: 0.01ms !important; transition-duration: 0.01ms !important; -webkit-animation-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
.settings-disconnect { min-width: 240px; margin-top: 20px; padding: 13px 22px; border: 2px solid #9e4f5a; border-radius: 11px; outline: 0; background: rgba(158,79,90,.14); color: #f1b6be; font-weight: 600; }
.settings-disconnect:focus { border-color: #d77986; background: rgba(158,79,90,.28); box-shadow: 0 0 0 3px rgba(255,255,255,.16); }
.search-input { width: 100%; padding: 15px 18px; border: 2px solid #4a405f; border-radius: 12px; outline: 0; background: #0d0c12; color: #fff; font: inherit; font-size: 20px; }
.search-input:focus { border-color: #8e73e6; box-shadow: 0 0 0 3px rgba(142,115,230,.2); }
.tv-keyboard { margin-top: 14px; }
.tv-keyboard-row { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 5px; }
.tv-key { width: 58px; height: 38px; margin-right: 5px; border: 2px solid transparent; border-radius: 8px; outline: 0; background: #202633; color: #F4F4F6; font-size: 15px; cursor: pointer; }
.tv-key:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.tv-key-space { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
.tv-keyboard-actions .tv-key { width: 118px; }
.profile-keyboard { margin: 18px 0 10px; }
.profile-keyboard .tv-key { width: 54px; height: 34px; font-size: 14px; }
.profile-keyboard .tv-keyboard-actions .tv-key { width: 112px; }
.search-card .search-results { max-height: 270px; }
.search-state { min-height: 24px; margin: 16px 0 8px; color: #a0a0a8; font-size: 14px; }
.search-results { max-height: 510px; overflow: hidden auto; }
.search-result { display: block; width: 100%; min-height: 66px; margin: 7px 0; padding: 10px 16px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: rgba(255,255,255,.05); color: #a0a0a8; text-align: left; }
.search-result span { margin-right: 10px; color: #9f8bee; font-size: 10px; font-weight: 700; }
.search-result strong { color: #fff; font-size: 17px; }
.search-result small { display: block; margin-top: 4px; color: #888894; }
.search-result:focus { border-color: #8e73e6; background: rgba(142,115,230,.22); }
.search-result-art { display: inline-block; width: 46px; height: 58px; margin-right: 14px; overflow: hidden; border-radius: 7px; background: #202633; color: #F4F4F6; font-size: 22px; line-height: 58px; object-fit: cover; text-align: center; vertical-align: middle; }
.search-result-art img, .history-result-art img, .favorite-result-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.image-fallback-label { display: none; }
.is-image-broken > .image-fallback-label { display: block; }
.search-result > span:not(.search-result-art) { display: inline-block; width: 72px; margin-right: 4px; color: #70A5E0; font-size: 10px; font-weight: 700; vertical-align: middle; }
.search-result strong, .search-result small { display: inline-block; vertical-align: middle; }
.search-result strong { width: 330px; }
.search-close { min-width: 160px; margin-top: 20px; padding: 13px 22px; border: 2px solid #8e73e6; border-radius: 11px; outline: 0; background: rgba(142,115,230,.14); color: #fff; font-weight: 600; }
.search-close:focus { background: #5c3bb0; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.empty-surface-action { min-width: 154px; margin: 18px 0 0; padding: 11px 22px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 16px; cursor: pointer; }
.empty-surface-action:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.surface-overlay { background: rgba(5,5,7,.88); }
.surface-card { width: 760px; min-height: 500px; padding: 58px 66px; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); text-align: center; }
.surface-card h2 { margin: 14px 0 12px; color: #fff; font-size: 36px; letter-spacing: -.8px; }
.surface-summary { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 18px auto 8px; color: #A0A0A8; font-size: 13px; }
.surface-summary span { margin: 0 6px; padding: 8px 12px; border-radius: 9px; background: rgba(255,255,255,.07); }
.surface-summary strong { margin-right: 4px; color: #70A5E0; font-size: 16px; }
.surface-card p { max-width: 520px; margin: 0 auto; color: #a0a0a8; font-size: 17px; line-height: 1.55; }
.surface-icon { width: 90px; height: 90px; margin: 42px auto 20px; border-radius: 26px; background: rgba(142,115,230,.18); color: #b6a5ff; font-size: 48px; line-height: 90px; }
.surface-recording { color: #ff8d9e; background: rgba(230,86,112,.16); }
.surface-download { color: #70d3ff; background: rgba(92,200,255,.16); }
.surface-skeleton { max-width: 500px; margin: 38px auto 5px; }
.surface-skeleton span { display: block; height: 13px; margin: 10px 0; border-radius: 8px; background: rgba(255,255,255,.08); }
.surface-skeleton span:nth-child(1) { width: 100%; }
.surface-skeleton span:nth-child(2) { width: 78%; margin-right: auto; }
.surface-skeleton span:nth-child(3) { width: 56%; margin-right: auto; }
.sources-card { width: 980px; max-height: 820px; padding: 48px 58px 36px; overflow: hidden; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.sources-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.sources-header h2 { margin: 8px 0 8px; color: #fff; font-size: 36px; letter-spacing: -.8px; }
.sources-header p { max-width: 650px; margin: 0; color: #a0a0a8; font-size: 16px; line-height: 1.45; }
.sources-summary { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 130px; padding: 12px 16px; border-radius: 14px; background: rgba(112,165,224,.12); color: #a0a0a8; }
.sources-summary strong { margin-right: 10px; color: #70A5E0; font-size: 32px; }
.sources-summary span { font-size: 11px; line-height: 1.2; text-transform: uppercase; letter-spacing: .8px; }
.sources-list { max-height: 470px; margin: 30px 0 20px; overflow: hidden auto; }
.source-manager-entry { margin: 8px 0 14px; }
.source-manager-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 82px; margin: 8px 0; padding: 12px 18px; border: 2px solid transparent; border-radius: 15px; outline: 0; background: rgba(255,255,255,.055); color: #fff; text-align: left; }
.source-manager-row:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.28); }
.source-manager-icon { display: inline-block; width: 50px; height: 50px; margin-right: 16px; border-radius: 14px; background: #202633; color: #70A5E0; font-size: 24px; font-weight: 700; line-height: 50px; text-align: center; }
.source-manager-copy { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }
.source-manager-copy strong, .source-manager-copy small, .source-manager-status b, .source-manager-status small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.source-manager-copy strong { font-size: 19px; }
.source-manager-copy small { margin-top: 6px; color: #858A98; font-size: 13px; }
.source-manager-status { width: 160px; margin-left: 20px; text-align: right; }
.source-manager-status b { color: #70A5E0; font-size: 14px; font-weight: 600; }
.source-manager-status.is-refreshing b { color: #f0c94b; }
.source-manager-status.is-error b { color: #f18d9e; }
.source-manager-status small { margin-top: 5px; color: #858A98; font-size: 12px; }
.source-manager-chevron { width: 25px; margin-left: 12px; color: #858A98; font-size: 28px; text-align: right; }
.source-manager-preview { cursor: default; opacity: .82; }
.source-manager-row:focus .source-manager-icon, .source-manager-row:focus .source-manager-copy small, .source-manager-row:focus .source-manager-status small, .source-manager-row:focus .source-manager-chevron { color: #3b5d89; }
.source-manager-row.is-selected { border-color: rgba(112,165,224,.58); background: rgba(112,165,224,.12); }
.source-manager-all { border-color: rgba(255,255,255,.1); }
.source-manager-row.is-selected .source-manager-status b { color: #70A5E0; }
.source-manager-entry-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 8px; margin: -2px 10px 0 0; }
.source-manager-toggle { min-width: 78px; height: 32px; padding: 0 10px; border: 1px solid rgba(112,165,224,.42); border-radius: 8px; outline: 0; background: rgba(112,165,224,.12); color: #70A5E0; font-size: 12px; font-weight: 700; }
.source-manager-toggle:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.source-manager-move { width: 42px; height: 32px; border: 1px solid rgba(112,165,224,.42); border-radius: 8px; outline: 0; background: rgba(112,165,224,.12); color: #70A5E0; font-size: 18px; font-weight: 700; }
.source-manager-move:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.source-manager-move:disabled { border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.025); color: #50505b; }
.sources-empty { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 220px; padding: 35px 40px; border: 1px dashed rgba(255,255,255,.16); border-radius: 16px; background: rgba(255,255,255,.025); text-align: center; }
.sources-empty-icon { width: 58px; height: 58px; margin-bottom: 16px; border-radius: 50%; background: rgba(112,165,224,.13); color: #70A5E0; font-size: 34px; line-height: 58px; }
.sources-empty strong { color: #fff; font-size: 22px; }
.sources-empty p { max-width: 540px; margin: 9px 0 0; color: #858A98; font-size: 15px; line-height: 1.45; }
.sources-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.sources-actions button { min-width: 160px; margin-right: 12px; padding: 13px 18px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.sources-actions button:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.sources-actions button:disabled { border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.04); color: #656572; }
.sources-actions .search-close { min-width: 120px; margin-top: 0; }
.sources-privacy { margin: 22px 0 0; color: #70707b; font-size: 12px; }
.guide-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(5,5,7,.94); }
.guide-card { width: 1060px; max-height: 920px; padding: 44px 54px; overflow: hidden; border: 1px solid rgba(142,115,230,.5); border-radius: 28px; background: linear-gradient(145deg, #211b30, #111116 70%); box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.guide-heading h2 { margin: 7px 0 8px; font-size: 34px; }
.guide-heading p { margin: 0; color: #a0a0a8; font-size: 16px; }
.guide-toolbar { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 18px; }
.guide-period { min-width: 132px; margin-right: 10px; padding: 9px 16px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #A0A0A8; font-size: 14px; }
.guide-period:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.guide-state { min-height: 24px; margin: 24px 0 10px; color: #a0a0a8; font-size: 14px; }
.guide-empty-state { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-height: 220px; padding: 28px; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; background: rgba(255,255,255,.025); color: #a0a0a8; }
.guide-empty-state strong { color: #f4f4f6; font-size: 22px; }
.guide-empty-state span { margin-top: 8px; font-size: 15px; }
.guide-sources { min-width: 154px; margin-top: 20px; padding: 11px 22px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 17px; cursor: pointer; }
.guide-sources:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.guide-scale { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; margin: 6px 0 2px; padding: 0 16px; color: #70707b; font-size: 9px; font-weight: 700; letter-spacing: 1px; }
.guide-scale span:first-child { width: 320px; }
.guide-scale span:not(:first-child) { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: left; }
.guide-results { max-height: 620px; overflow: hidden auto; }
.guide-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 70px; margin: 7px 0; padding: 10px 16px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: rgba(255,255,255,.05); color: #a0a0a8; text-align: left; }
.guide-row:focus { border-color: #8e73e6; background: rgba(142,115,230,.22); }
.guide-number { width: 46px; color: #9f8bee; font-size: 15px; font-weight: 700; }
.guide-channel-logo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex: 0 0 42px; flex: 0 0 42px; width: 42px; height: 42px; margin-right: 12px; overflow: hidden; border-radius: 9px; background: #202633; color: #70A5E0; font-size: 10px; font-weight: 700; }
.guide-channel-logo img, img.guide-channel-logo { display: block; width: 100%; height: 100%; object-fit: contain; }
.guide-channel-logo .image-fallback-label { width: 100%; height: 100%; line-height: 42px; text-align: center; }
.guide-row strong { width: 220px; overflow: hidden; color: #fff; font-size: 17px; white-space: nowrap; text-overflow: ellipsis; }
.guide-now { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; overflow: hidden; color: #fff; font-size: 15px; white-space: nowrap; text-overflow: ellipsis; }
.guide-now b { display: block; overflow: hidden; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; }
.guide-time { display: block; margin-top: 5px; color: #888894; font-size: 10px; letter-spacing: .4px; }
.guide-progress { display: block; width: 88%; height: 3px; margin-top: 4px; overflow: hidden; border-radius: 3px; background: #292934; }
.guide-progress i { display: block; height: 100%; border-radius: 3px; background: #8e73e6; }
.guide-track { position: relative; display: block; width: 88%; height: 27px; margin-top: 7px; overflow: hidden; }
.guide-segment { position: absolute; top: 0; display: block; box-sizing: border-box; min-width: 0; height: 27px; padding: 4px 7px; overflow: hidden; border-radius: 5px; background: rgba(255,255,255,.08); color: #a0a0a8; }
.guide-segment.is-current { background: rgba(142,115,230,.32); color: #fff; }
.guide-segment b, .guide-segment small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.guide-segment b { font-size: 10px; font-weight: 600; }
.guide-segment small { margin-top: 1px; color: #888894; font-size: 8px; }
.guide-row small { width: 250px; overflow: hidden; color: #888894; white-space: nowrap; text-overflow: ellipsis; }
.guide-row { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
.guide-channel-button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex: 0 0 320px; flex: 0 0 320px; min-width: 0; padding: 7px 12px; border: 2px solid transparent; border-radius: 9px; outline: 0; background: transparent; color: #F4F4F6; text-align: left; }
.guide-channel-button:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.guide-channel-button .guide-number { -ms-flex: 0 0 38px; flex: 0 0 38px; width: 38px; }
.guide-channel-button .guide-channel-logo { -ms-flex: 0 0 42px; flex: 0 0 42px; }
.guide-channel-button strong { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: auto; margin-left: 0; }
.guide-channel-button:focus .guide-channel-logo { background: #202633; color: #70A5E0; }
.guide-program-cell { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; padding: 8px 8px 8px 16px; }
.guide-program-cell .guide-now { height: 29px; }
.guide-program-cell .guide-now b { display: inline-block; max-width: 55%; }
.guide-program-cell .guide-time, .guide-program-cell .guide-progress { display: none; }
.guide-program-track { position: relative; display: block; width: 100%; height: 43px; margin-top: 4px; overflow: hidden; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); background: repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0, rgba(255,255,255,.025) 1px, transparent 1px, transparent 12.5%); }
.guide-program { position: absolute; top: 4px; box-sizing: border-box; min-width: 0; height: 34px; padding: 4px 7px; overflow: hidden; border: 1px solid transparent; border-radius: 5px; outline: 0; background: rgba(255,255,255,.08); color: #A0A0A8; text-align: left; }
.guide-program.is-current { background: rgba(112,165,224,.32); color: #F4F4F6; }
.guide-program:focus { z-index: 2; border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.guide-program b, .guide-program small { display: block; width: auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.guide-program b { font-size: 10px; font-weight: 600; }
.guide-program small { margin-top: 1px; color: #888894; font-size: 8px; }
.guide-program:focus small { color: #303039; }
.guide-program.is-replayable { border-left: 2px solid #70A5E0; }
.guide-replay-badge { position: absolute; right: 4px; bottom: 3px; color: #70A5E0; font-size: 9px; font-style: normal; }
.guide-program:focus .guide-replay-badge { color: #09090C; }
.guide-program-empty { box-sizing: border-box; padding: 14px 8px; color: #777783; font-size: 11px; }
.guide-reminder { min-height: 25px; margin-top: 5px; padding: 3px 9px; border: 1px solid rgba(112,165,224,.55); border-radius: 999px; outline: 0; background: rgba(112,165,224,.1); color: #AFCBF0; font-size: 10px; }
.guide-reminder.is-set { border-color: rgba(240,201,75,.7); background: rgba(240,201,75,.12); color: #f0c94b; }
.guide-reminder:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.35); }
.guide-next { display: block; width: auto !important; margin-top: 4px; }
.guide-close { min-width: 160px; margin-top: 20px; padding: 13px 22px; border: 2px solid #8e73e6; border-radius: 11px; outline: 0; background: rgba(142,115,230,.14); color: #fff; font-weight: 600; }
.guide-close:focus { background: #5c3bb0; box-shadow: 0 0 0 3px rgba(255,255,255,.2); }
.guide-retry { min-width: 160px; margin: 8px 12px 0 0; padding: 13px 22px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.guide-retry:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.reminders-overlay { background: rgba(5,5,7,.94); }
.reminders-card { width: 760px; max-height: 820px; padding: 48px 56px 40px; overflow: hidden; }
.reminders-card h2 { margin: 8px 0 10px; color: #fff; font-size: 36px; }
.reminders-intro { max-width: 620px; margin: 0; color: #A0A0A8; font-size: 16px; line-height: 1.45; }
.reminders-list { max-height: 470px; margin: 28px 0 18px; overflow: hidden auto; }
.reminder-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 70px; margin: 8px 0; padding: 10px 14px 10px 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.05); }
.reminder-row > div { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }
.reminder-row strong, .reminder-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reminder-row strong { color: #fff; font-size: 18px; }
.reminder-row small { margin-top: 6px; color: #858A98; font-size: 13px; }
.reminder-remove, .reminders-guide { padding: 10px 16px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.reminder-remove { margin-left: 16px; border-color: rgba(241,141,158,.6); color: #f1a2b0; }
.reminder-remove:focus, .reminders-guide:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.reminders-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; }
.reminders-card footer button { margin-right: 12px; }
.reminders-empty { min-height: 170px; padding: 35px; border: 1px dashed rgba(255,255,255,.16); border-radius: 16px; text-align: center; }
.reminders-empty span { display: block; color: #70A5E0; font-size: 34px; }
.reminders-empty strong { display: block; margin-top: 10px; color: #fff; font-size: 22px; }
.reminders-empty p { margin: 8px 0 0; color: #858A98; font-size: 14px; }
.statistics-overlay { background: rgba(5,5,7,.94); }
.statistics-card { width: 900px; max-height: 760px; padding: 54px 64px 46px; }
.statistics-card h2 { margin: 9px 0 12px; color: #fff; font-size: 38px; }
.statistics-intro { max-width: 720px; margin: 0; color: #A0A0A8; font-size: 17px; line-height: 1.45; }
.statistics-grid { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 34px 0 24px; }
.statistics-grid > div { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-height: 130px; margin-right: 14px; padding: 22px 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.05); }
.statistics-grid > div:last-child { margin-right: 0; }
.statistics-grid strong, .statistics-grid span { display: block; }
.statistics-grid strong { color: #F4F4F6; font-size: 34px; font-weight: 400; }
.statistics-grid span { margin-top: 12px; color: #858A98; font-size: 14px; }
.statistics-updated { margin: 0; color: #858A98; font-size: 14px; }
.statistics-updated strong { color: #F4F4F6; font-weight: 400; }
.statistics-state { min-height: 22px; margin: 28px 0 20px; color: #70A5E0; font-size: 15px; }
.statistics-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; }
.statistics-card footer button { margin-right: 12px; padding: 12px 18px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.statistics-card footer button:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.statistics-card footer .statistics-reset { border-color: rgba(241,162,176,.65); color: #F1A2B0; }
.statistics-card footer .statistics-reset:focus { border-color: #70A5E0; color: #09090C; }
.entitlement-card { width: 900px; max-height: 780px; padding: 54px 64px 46px; }
.entitlement-card h2 { margin: 9px 0 12px; color: #fff; font-size: 38px; }
.entitlement-intro { max-width: 720px; margin: 0 0 26px; color: #A0A0A8; font-size: 17px; line-height: 1.45; }
.entitlement-status { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 16px 20px; border: 1px solid rgba(112,165,224,.35); border-radius: 14px; background: rgba(112,165,224,.1); }
.entitlement-status span { color: #858A98; font-size: 14px; }
.entitlement-status strong { color: #70A5E0; font-size: 17px; font-weight: 600; }
.entitlement-state { min-height: 22px; margin: 22px 0 20px; color: #70A5E0; font-size: 15px; }
.entitlement-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.entitlement-card footer button { margin: 0 12px 12px 0; padding: 12px 18px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.entitlement-card footer button:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.entitlement-card footer .entitlement-clear { border-color: rgba(241,162,176,.65); color: #F1A2B0; }
.entitlement-card footer .entitlement-clear:focus { border-color: #70A5E0; color: #09090C; }
.capability-overlay { background: rgba(5,5,7,.94); }
.capability-card { width: 900px; max-height: 720px; padding: 54px 64px 46px; }
.capability-card h2 { margin: 9px 0 28px; color: #fff; font-size: 38px; }
.capability-status { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 16px 20px; border: 1px solid rgba(112,165,224,.35); border-radius: 14px; background: rgba(112,165,224,.1); }
.capability-status span { color: #858A98; font-size: 14px; }
.capability-status strong { color: #70A5E0; font-size: 17px; font-weight: 600; }
.capability-description { margin: 28px 0 22px; color: #A0A0A8; font-size: 17px; line-height: 1.5; }
.capability-fallback { padding: 18px 20px; border-left: 3px solid #70A5E0; border-radius: 0 12px 12px 0; background: rgba(255,255,255,.05); }
.capability-fallback span, .capability-fallback strong { display: block; }
.capability-fallback span { color: #858A98; font-size: 13px; }
.capability-fallback strong { margin-top: 7px; color: #F4F4F6; font-size: 17px; font-weight: 400; }
.capability-note { margin: 25px 0 26px; color: #777783; font-size: 13px; line-height: 1.45; }
.capability-card .search-close { min-width: 150px; padding: 12px 18px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.capability-card .search-close:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.native-video { position: absolute; top: 0; left: 0; z-index: 1; display: none; width: 1920px; height: 1080px; background: #000; }
.native-video.is-visible { display: block; }
.player-layer { position: absolute; top: 0; left: 0; z-index: 2; width: 1920px; height: 1080px; background: linear-gradient(180deg, rgba(0,0,0,.72), transparent 25%, transparent 72%, rgba(0,0,0,.8)); }
.player-top, .player-bottom { position: absolute; left: 56px; right: 56px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.player-top { top: 42px; font-size: 25px; }
.player-top span { color: #a0a0a0; font-size: 14px; text-transform: uppercase; }
.player-top > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.player-top .player-live-pill { margin-right: 14px; padding: 6px 10px; border-radius: 6px; background: #9d4141; color: #fff; font-size: 11px; font-weight: 700; }
.player-top .player-live-pill.is-vod { background: #334057; color: #70A5E0; }
.player-bottom { bottom: 42px; color: #d0d0d5; font-size: 17px; }
.player-state { position: absolute; top: 50%; left: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 15px 22px; border-radius: 999px; background: rgba(11,11,15,.8); transform: translate(-50%, -50%); }
.player-infobar { position: absolute; right: 72px; bottom: 104px; left: 72px; z-index: 3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; min-height: 152px; padding: 26px 34px; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: rgba(17,17,22,.9); box-shadow: 0 16px 60px rgba(0,0,0,.46); }
.player-info-main { min-width: 0; }
.player-info-main h2 { max-width: 1000px; margin: 6px 0 5px; color: #F4F4F6; font-size: 30px; }
.player-info-main p { margin: 0; color: #A0A0A8; font-size: 17px; }
.player-info-main > small#player-info-next { display: block; margin-top: 5px; color: #777783; font-size: 13px; }
.player-info-main small { display: block; margin-top: 13px; color: #A0A0A8; font-size: 12px; }
.player-info-track { width: 950px; max-width: 100%; height: 5px; margin-top: 16px; overflow: hidden; border-radius: 5px; background: #292934; }
.player-info-track i { display: block; height: 100%; background: #70A5E0; }
.player-control-hints { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 14px; }
.player-control-hints span { margin-right: 10px; padding: 6px 9px; border-radius: 7px; background: rgba(255,255,255,.08); color: #A0A0A8; font-size: 10px; letter-spacing: .2px; }
.player-retry { margin-left: 4px; padding: 5px 11px; border: 1px solid #70A5E0; border-radius: 7px; outline: 0; background: #202633; color: #F4F4F6; font-size: 10px; }
.player-retry:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.player-tracks { margin-left: 4px; padding: 5px 11px; border: 1px solid #70A5E0; border-radius: 7px; outline: 0; background: #202633; color: #F4F4F6; font-size: 10px; }
.player-tracks:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.player-tracks:disabled { border-color: rgba(255,255,255,.12); color: #777783; opacity: .65; }
.player-info-clock { min-width: 210px; padding-left: 30px; text-align: right; }
.player-info-clock strong, .player-info-clock span { display: block; }
.player-info-clock strong { color: #F4F4F6; font-size: 46px; font-weight: 400; }
.player-info-clock span { margin-top: 6px; color: #A0A0A8; font-size: 14px; }
.spinner { display: inline-block; width: 22px; height: 22px; margin-right: 12px; border: 3px solid rgba(255,255,255,.2); border-top-color: #8e73e6; border-radius: 50%; animation: spin 900ms linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* D1 — Android TV visual language. Literal fallbacks keep older Tizen engines safe. */
#app { --tv-bg: #0B0B0F; --tv-bg-deep: #050507; --tv-surface: #111116; --tv-surface-alt: #1A1A22; --tv-surface-raised: #202633; --tv-text-primary: #F4F4F6; --tv-text-secondary: #A0A0A8; --tv-text-muted: #777783; --tv-accent: #7C5BD8; --tv-accent-strong: #5C3BB0; --tv-accent-wash: rgba(124,91,216,.18); --tv-accent-focus: rgba(124,91,216,.3); --tv-accent-text: #8D70DD; --tv-focus-surface: #F4F4F6; --tv-focus-text: #09090C; --tv-focus-outline: #7C5BD8; --tv-radius-large: 20px; --tv-radius-row: 12px; }

/* The catalogue surface follows the TV reference: compact icon rail + open canvas. */
.shell.is-poster-surface { padding: 0; background: #0B0B0F; }
.shell.is-poster-surface .rail { width: 120px; height: 1080px; padding: 28px 12px; border: 0; border-right: 1px solid rgba(255,255,255,.08); border-radius: 0; background: #0B0B0F; }
.shell.is-poster-surface .account-card { width: 72px; height: 72px; padding: 0; margin: 0 auto 28px; border-radius: 50%; background: #416EAA; }
.shell.is-poster-surface .account-card img { width: 72px; height: 72px; margin: 0; border-radius: 50%; }
.shell.is-poster-surface .account-card div { display: none; }
.shell.is-poster-surface .rail-item { width: 72px; height: 72px; padding: 0; margin: 0 auto 16px; border-radius: 50%; color: #A0A0A8; }
.shell.is-poster-surface .rail-item > span:last-child { display: none; }
.shell.is-poster-surface .rail-item.is-selected { background: rgba(112,165,224,.18); color: #70A5E0; }
.shell.is-poster-surface .rail-item:focus { border-color: #70A5E0 !important; background: rgba(112,165,224,.24) !important; box-shadow: 0 10px 28px rgba(0,0,0,.42), 0 0 0 2px rgba(112,165,224,.2); transform: scale(1.04); }
.shell.is-poster-surface .rail-icon, .shell.is-poster-surface .rail-item.is-selected .rail-icon { width: 72px; height: 72px; margin: 0; border-radius: 50%; color: currentColor; background: #181820; }
.shell.is-poster-surface .rail-item.is-selected .rail-icon { background: transparent; }
.shell.is-poster-surface .rail-icon svg { width: 30px; height: 30px; }
.shell.is-poster-surface .rail-version { display: none; }
.shell.is-poster-surface .category-panel { display: none; }
.shell.is-poster-surface.is-category-focus .category-panel { display: block; width: 286px; padding: 28px 16px; border-right: 1px solid rgba(255,255,255,.08); border-left: 0; border-radius: 0; background: #111116; }
.shell.is-poster-surface.is-category-focus .stage { width: 1470px; -webkit-box-flex: 0; -ms-flex: 0 0 1470px; flex: 0 0 1470px; }
.shell.is-poster-surface .stage { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: auto; padding: 32px 44px 0 56px; border: 0; border-radius: 0; background: #0B0B0F; }
.shell.is-poster-surface .stage-header { height: 122px; padding: 0; }
.shell.is-poster-surface .stage-header h2 { font-size: 38px; }
.shell.is-poster-surface .stage-body { display: block; width: 100%; height: 900px; }
.shell.is-poster-surface .poster-mode .content-viewport { width: 100%; height: 900px; overflow: hidden auto; }
.shell.is-poster-surface .poster-mode #content-window { width: 100%; }
.shell.is-poster-surface .poster-card { width: 230px; height: 366px; margin: 0 14px 20px 0; border-radius: 20px; }
.shell.is-poster-surface .poster-art { width: 224px; height: 306px; border-radius: 17px; background: linear-gradient(155deg, #273a55, #0C0D12 72%); }
.shell.is-poster-surface .poster-card:focus { border-color: #70A5E0; background: transparent; box-shadow: 0 20px 44px rgba(0,0,0,.64), 0 0 0 2px rgba(112,165,224,.2); transform: scale(1.05); }
.shell.is-poster-surface .poster-card > strong { margin: 10px 8px 1px; font-size: 16px; line-height: 20px; }
.shell.is-poster-surface .poster-meta { margin: 0 8px; font-size: 11px; }
.shell.is-poster-surface .poster-monogram { left: 22px; top: 22px; font-size: 76px; }
.shell.is-poster-surface .poster-cover-title { right: 16px; bottom: 52px; left: 16px; font-size: 17px; line-height: 20px; }
.shell.is-poster-surface .poster-cover-meta { right: 16px; bottom: 30px; left: 16px; font-size: 10px; }
.shell.is-poster-surface .poster-favorite { top: 14px; right: 14px; width: 36px; height: 36px; font-size: 21px; line-height: 36px; }
.shell.is-poster-surface .poster-progress { right: 16px; bottom: 9px; left: 16px; }
.shell.is-poster-surface .poster-skeleton { width: 230px; height: 366px; margin-right: 14px; border-radius: 20px; }
.shell.is-poster-surface .poster-skeleton i { width: 202px; height: 294px; margin-top: 14px; }
.shell.is-poster-surface .poster-play { left: 85px; top: 126px; width: 54px; height: 54px; line-height: 50px; }
.shell.is-poster-surface .stage { position: relative; overflow: hidden; }
.shell.is-poster-surface .stage-header { position: relative; z-index: 2; height: 356px; }
.vod-hero { position: absolute; top: 0; right: 0; left: 0; z-index: 0; height: 470px; overflow: hidden; }
.vod-hero-backdrop { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #111116; }
.vod-hero-backdrop:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, #0B0B0F 0%, rgba(11,11,15,.92) 32%, rgba(11,11,15,.34) 75%, #0B0B0F 100%), linear-gradient(0deg, #0B0B0F 0%, transparent 55%); content: ""; }
.vod-hero-backdrop img { position: absolute; top: 0; right: 0; width: 70%; height: 100%; object-fit: cover; opacity: .82; }
.vod-hero-backdrop.has-image > .vod-hero-fallback { display: none; }
.vod-hero-backdrop.has-image.is-image-broken > .vod-hero-fallback { display: block; }
.vod-hero-fallback { position: absolute; top: 10%; right: 16%; width: 390px; height: 390px; border-radius: 50%; color: rgba(255,255,255,.85); font-size: 220px; line-height: 390px; text-align: center; }
.vod-hero-copy { position: absolute; top: 112px; left: 0; z-index: 1; width: 630px; }
.vod-hero-copy h3 { max-height: 110px; margin: 12px 0 12px; overflow: hidden; color: #F4F4F6; font-size: 48px; line-height: 1.05; }
.vod-hero-copy p { max-width: 590px; margin: 0; color: #A0A0A8; font-size: 19px; }
.vod-hero-badges { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 22px; color: #F4F4F6; font-size: 13px; }
.vod-hero-badges span { margin-right: 10px; padding: 8px 12px; border-radius: 8px; background: #202633; }
.shell.is-poster-surface .stage-body { position: relative; z-index: 2; height: 590px; }
.shell.is-poster-surface .poster-mode .content-viewport { height: 590px; }

/* Common focus contract: white focused surface, black text, blue outline. */
.rail-item:focus, .category-item:focus, .channel-row:focus, .poster-card:focus, .search-result:focus, .guide-row:focus, .episode-item:focus, .local-media-item:focus { outline: 0; border-color: #70A5E0 !important; }
.settings-list .setting-toggle:focus, .details-play:focus, .details-retry:focus, .details-close:focus, .search-close:focus, .setting-pin:focus, .settings-disconnect:focus, .pairing-action:focus, .pairing-copy:focus { border-color: #70A5E0; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.settings-list .setting-toggle:focus { background: #F4F4F6; color: #09090C; }
.settings-list .setting-toggle:focus strong { color: #09090C; }
.details-play, .search-close, .details-close, .setting-pin, .pairing-action, .guide-close { border-color: #70A5E0; background: #202633; }
.details-play:focus, .search-close:focus, .details-close:focus, .setting-pin:focus, .pairing-action:focus, .guide-close:focus { background: #F4F4F6; color: #09090C; }
.details-overlay, .search-overlay, .pairing-overlay, .guide-overlay { background: rgba(5,5,7,.82); }
.details-card, .search-card, .pairing-card, .guide-card, .surface-card { border-color: rgba(255,255,255,.12); border-radius: 20px; background: #1A1A22; box-shadow: 0 24px 70px rgba(0,0,0,.68); }
.eyebrow, .sync-status, .movie-details-meta { color: #70A5E0; }
.platform-pill { border-color: rgba(112,165,224,.38); color: #70A5E0; }
.progress-track span, .row-progress i, .guide-progress i { background: #70A5E0; }

/* Full-screen VOD detail composition, matching the supplied TV captures. */
.details-card.movie-details-card, .details-card.series-details-card { position: relative; width: 1920px; height: 1080px; max-height: none; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: #0B0B0F; }
.details-backdrop { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; background: #111116; }
.details-backdrop:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, #0B0B0F 4%, rgba(11,11,15,.94) 28%, rgba(11,11,15,.35) 64%, rgba(11,11,15,.68) 100%), linear-gradient(0deg, rgba(11,11,15,.95), transparent 46%, rgba(11,11,15,.28)); content: ""; }
.details-backdrop img { position: absolute; top: 0; right: 0; width: 72%; height: 100%; object-fit: cover; opacity: .86; }
.details-backdrop[data-image-fallback] > .details-backdrop-fallback { display: none; }
.details-backdrop[data-image-fallback].is-image-broken > .details-backdrop-fallback { display: block; }
.details-side-rail { position: absolute; top: 0; bottom: 0; left: 0; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 120px; padding: 62px 16px 24px; border-right: 1px solid rgba(255,255,255,.08); background: rgba(7,8,12,.58); }
.details-side-rail > img { width: 72px; height: 72px; margin-bottom: 28px; border-radius: 50%; background: #416EAA; }
.details-side-rail > nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.details-side-rail-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 72px; height: 72px; margin-bottom: 16px; padding: 0; border: 0; border-radius: 50%; outline: 0; color: #A0A0A8; background: rgba(24,24,32,.86); cursor: pointer; }
.details-side-rail-item.is-active { color: #70A5E0; background: rgba(112,165,224,.24); box-shadow: 0 0 0 2px rgba(112,165,224,.24); }
.details-side-rail-item:focus { color: #09090C; background: #F4F4F6; box-shadow: 0 0 0 3px rgba(112,165,224,.75); }
.details-side-rail-item svg { width: 31px; height: 31px; fill: currentColor; }
.details-content { position: relative; z-index: 1; width: 820px; height: 100%; padding: 120px 0 70px 255px; }
.series-details-card .details-content { width: 1420px; }
.details-heading h2 { margin: 13px 0 12px; color: #F4F4F6; font-size: 52px; line-height: 1.05; }
.details-heading p { max-width: 680px; color: #A0A0A8; font-size: 21px; line-height: 1.4; }
.details-badges { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 24px; color: #F4F4F6; font-size: 16px; }
.details-badges span { margin-right: 12px; padding: 9px 14px; border-radius: 8px; background: #202633; }
.details-state { color: #A0A0A8; }
.details-cast-empty { color: #A0A0A8; font-size: 15px; }
.series-details-card .details-episodes { width: 1120px; max-height: 390px; margin-top: 20px; }
.series-details-card .episode-item { display: inline-block; width: 350px; min-height: 90px; margin: 7px 10px 7px 0; vertical-align: top; }
.details-tabs { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 26px; border-bottom: 1px solid rgba(255,255,255,.14); }
.details-tab { margin-right: 28px; padding: 0 0 13px; border: 0; border-bottom: 4px solid transparent; outline: 0; background: transparent; color: #A0A0A8; font-size: 17px; }
.details-tab.is-selected { border-bottom-color: #70A5E0; color: #F4F4F6; }
.details-tab:focus { color: #70A5E0; }
.details-panel { min-height: 230px; }
.season-selector { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 18px; }
.season-option { margin-right: 10px; padding: 9px 17px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #A0A0A8; font-size: 14px; }
.season-option.is-selected { background: #416EAA; color: #F4F4F6; }
.season-option:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.details-cast-grid { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 30px; }
.details-cast-grid > div { width: 190px; margin-right: 18px; text-align: center; }
.cast-avatar { display: block; width: 92px; height: 92px; margin: 0 auto 12px; border-radius: 50%; background: linear-gradient(145deg, #536d8f, #202633); color: #F4F4F6; font-size: 38px; line-height: 92px; }
.details-cast-grid strong, .details-cast-grid small { display: block; }
.details-cast-grid strong { color: #F4F4F6; font-size: 16px; }
.details-cast-grid small { margin-top: 5px; color: #A0A0A8; font-size: 12px; }
.trailer-panel { margin-top: 24px; }
.trailer-preview { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 480px; height: 210px; border-radius: 16px; background: linear-gradient(145deg, #304c68, #111116 74%); color: #F4F4F6; }
.trailer-preview span { width: 64px; height: 64px; border: 2px solid #F4F4F6; border-radius: 50%; font-size: 25px; line-height: 60px; text-align: center; text-indent: 4px; }
.trailer-preview small { position: absolute; margin: 160px 0 0; color: #A0A0A8; font-size: 10px; letter-spacing: 2px; }
.trailer-panel p { color: #A0A0A8; font-size: 14px; }
.trailer-play { padding: 11px 18px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; }
.trailer-play:focus { background: #F4F4F6; color: #09090C; }
.related-grid { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 26px; overflow: hidden; }
.related-item { width: 146px; margin-right: 14px; padding: 0; border: 2px solid transparent; border-radius: 13px; outline: 0; background: transparent; color: #F4F4F6; text-align: left; }
.related-item:focus { border-color: #70A5E0; background: rgba(255,255,255,.08); }
.related-item > span { display: block; width: 142px; height: 190px; overflow: hidden; border-radius: 11px; background: #202633; color: #F4F4F6; font-size: 42px; line-height: 190px; text-align: center; }
.related-item img { width: 100%; height: 100%; object-fit: cover; }
.related-art-fallback { display: none; }
.related-art-fallback.is-visible, [data-image-fallback].is-image-broken > .related-art-fallback, [data-image-fallback].is-image-broken > .episode-art-fallback { display: block; }
.related-item strong, .related-item small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.related-item strong { margin: 8px 5px 2px; font-size: 13px; }
.related-item small { margin: 0 5px; color: #A0A0A8; font-size: 10px; }
.episode-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.episode-art { display: block; -ms-flex: 0 0 72px; flex: 0 0 72px; width: 72px; height: 70px; margin-right: 14px; overflow: hidden; border-radius: 9px; background: #202633; color: #70A5E0; font-size: 28px; line-height: 70px; text-align: center; }
.episode-art img { width: 100%; height: 100%; object-fit: cover; }
.episode-art-fallback { display: none; }
.episode-copy { display: block; min-width: 0; }
.episode-copy small, .episode-copy strong, .episode-copy em { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.episode-copy small { color: #70A5E0; font-size: 10px; font-weight: 700; letter-spacing: 1px; }
.episode-copy strong { margin-top: 5px; }
.episode-copy em { margin-top: 5px; color: #A0A0A8; font-size: 11px; font-style: normal; }
.movie-details-card .details-play { margin-top: 32px; padding: 16px 28px; border-radius: 999px; font-size: 18px; }
.details-actions { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 26px; }
.details-actions button { min-width: 150px; margin-right: 10px; padding: 13px 18px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; }
.details-actions button:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.details-actions .details-play { margin-top: 0; }
.details-actions .details-favorite, .details-actions .details-download { width: 82px; min-width: 82px; height: 82px; padding: 0; font-size: 34px; }
.details-actions .details-favorite { color: #70A5E0; }
.details-actions .details-favorite.is-active { background: #70A5E0; color: #09090C; }
.details-actions .details-download { color: #F4F4F6; }
.details-download { color: #70A5E0 !important; }
.details-download:focus { color: #09090C !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.movie-details-card .details-close, .series-details-card .details-close { display: block; margin-top: 18px; }
.movie-related { width: 1120px; margin-top: 38px; }
.movie-related h3 { margin: 0 0 10px; color: #F4F4F6; font-size: 25px; font-weight: 400; }
.movie-related .related-grid { margin-top: 0; }
.details-backdrop-fallback:before { position: absolute; top: 14%; right: 12%; width: 520px; height: 520px; border: 4px solid rgba(255,255,255,.28); border-radius: 50%; content: ""; opacity: .5; }

/* Hub drawer: content remains visible behind the navigation, as on Android TV. */
.hub-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; background: rgba(5,5,7,.42); }
.hub-drawer { position: absolute; top: 0; bottom: 0; left: 0; width: 620px; padding: 42px 26px 30px 36px; border: 1px solid rgba(255,255,255,.18); border-radius: 0 28px 28px 0; background: #1A1A22; box-shadow: 20px 0 80px rgba(0,0,0,.58); }
.hub-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 74px; padding: 0 18px 22px; border-bottom: 1px solid rgba(255,255,255,.12); color: #70A5E0; }
.hub-heading strong { font-size: 36px; font-weight: 400; }
.hub-heading-icon { display: block; width: 46px; height: 46px; margin-right: 22px; border-radius: 50%; background: #202633; color: #70A5E0; font-size: 19px; line-height: 46px; text-align: center; }
.hub-nav { padding-top: 22px; }
.hub-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 74px; margin: 0 0 8px; padding: 0 20px; border: 3px solid transparent; border-radius: 20px; outline: 0; background: transparent; color: #A0A0A8; font-size: 29px; text-align: left; }
.hub-item.is-selected { color: #70A5E0; background: rgba(112,165,224,.08); }
.hub-item:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 10px 28px rgba(0,0,0,.35); transform: scale(1.03); }
.hub-item-icon { display: block; width: 54px; height: 54px; margin-right: 24px; border-radius: 50%; background: #202633; color: currentColor; font-size: 31px; line-height: 54px; text-align: center; }

/* Home dashboard: the Hub's Home destination is a real surface, not an alias for Live. */
.home-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; overflow: hidden; background: rgba(5,5,7,.94); }
.home-surface { position: relative; width: 1920px; height: 1080px; padding: 58px 86px 34px 150px; overflow: hidden; background: #0B0B0F; }
.home-backdrop { position: absolute; top: 0; right: 0; width: 1120px; height: 680px; opacity: .42; background: radial-gradient(circle at 70% 28%, rgba(112,165,224,.34), transparent 42%), linear-gradient(135deg, transparent 12%, rgba(34,45,65,.5) 55%, transparent 86%); pointer-events: none; }
.home-header, .home-hero, .home-section, .home-footer { position: relative; z-index: 1; }
.home-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.home-header h2 { margin: 11px 0 8px; color: #F4F4F6; font-size: 43px; font-weight: 500; letter-spacing: -1px; }
.home-header p { margin: 0; color: #A0A0A8; font-size: 17px; }
.home-header-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; padding-top: 10px; color: #A0A0A8; font-size: 13px; }
.home-profile-name { color: #F4F4F6; font-size: 17px; }
.home-cache-state { margin-top: 8px; color: #70A5E0; }
.home-hero { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 340px; margin-top: 34px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: linear-gradient(90deg, #171820 0%, rgba(23,24,32,.88) 48%, rgba(23,24,32,.32) 100%); box-shadow: 0 25px 70px rgba(0,0,0,.4); }
.home-hero-art { position: relative; -ms-flex: 0 0 470px; flex: 0 0 470px; height: 340px; overflow: hidden; background: linear-gradient(145deg, #304c68, #111116 74%); }
.home-hero-art:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, transparent 55%, #171820 100%), linear-gradient(0deg, rgba(11,11,15,.55), transparent 62%); content: ""; }
.home-hero-art img { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.home-hero-fallback { position: absolute; top: 106px; left: 200px; z-index: 1; color: rgba(255,255,255,.82); font-size: 105px; font-weight: 700; }
.home-hero-copy { padding: 42px 52px; }
.home-hero-copy h3 { max-width: 690px; margin: 12px 0 10px; color: #F4F4F6; font-size: 37px; }
.home-hero-meta { margin: 0; color: #A0A0A8; font-size: 18px; }
.home-hero-description { max-width: 700px; min-height: 44px; margin: 16px 0 0; color: #D1D1D6; font-size: 16px; line-height: 1.45; }
.home-actions { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 22px; }
.home-actions button, .home-footer button { min-width: 170px; margin-right: 12px; padding: 12px 22px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 16px; cursor: pointer; }
.home-actions .home-play { background: #F4F4F6; color: #09090C; }
.home-actions button:focus, .home-footer button:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.home-actions button:disabled { opacity: .45; }
.home-section { margin-top: 30px; }
.home-section-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }
.home-section-heading h3 { margin: 0; color: #F4F4F6; font-size: 25px; font-weight: 500; }
.home-section-count { margin-left: 13px; color: #808692; font-size: 13px; }
.home-card-row { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; min-height: 230px; margin-top: 16px; overflow: hidden; }
.home-card { width: 190px; min-width: 190px; height: 242px; margin-right: 18px; padding: 0; border: 3px solid transparent; border-radius: 15px; outline: 0; background: transparent; color: #F4F4F6; text-align: left; cursor: pointer; }
.home-card:focus { border-color: #70A5E0; background: #171820; box-shadow: 0 12px 30px rgba(0,0,0,.5); transform: scale(1.05); }
.home-card-art { position: relative; display: block; width: 184px; height: 178px; overflow: hidden; border-radius: 12px; background: linear-gradient(145deg, #304c68, #111116 74%); }
.home-card-art:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(0deg, rgba(5,5,7,.85), transparent 62%); content: ""; }
.home-card-art img { width: 100%; height: 100%; object-fit: cover; opacity: .86; }
.home-card-art > span:not(.home-hero-fallback) { position: absolute; top: 42px; left: 80px; z-index: 1; color: rgba(255,255,255,.8); font-size: 58px; font-weight: 700; }
.home-card-art i { position: absolute; right: 10px; bottom: 9px; left: 10px; z-index: 2; display: block; height: 4px; border-radius: 4px; background: #70A5E0; }
.home-card strong, .home-card small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.home-card strong { margin: 9px 5px 2px; font-size: 15px; }
.home-card small { margin: 0 5px; color: #A0A0A8; font-size: 11px; }
.home-secondary-section { position: relative; z-index: 1; margin-top: 13px; }
.home-secondary-section .home-section-heading h3 { font-size: 20px; }
.home-secondary-section .home-section-heading > span { margin-left: 12px; color: #808692; font-size: 12px; }
.home-mini-row { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 10px; overflow: hidden; }
.home-mini-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 282px; min-width: 282px; height: 82px; margin-right: 14px; padding: 6px; border: 2px solid transparent; border-radius: 12px; outline: 0; background: rgba(255,255,255,.045); color: #F4F4F6; text-align: left; cursor: pointer; }
.home-mini-card:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 10px 24px rgba(0,0,0,.4); }
.home-mini-art { position: relative; display: block; width: 68px; height: 68px; min-width: 68px; overflow: hidden; border-radius: 8px; background: linear-gradient(145deg, #304c68, #111116 74%); }
.home-mini-art img { width: 100%; height: 100%; object-fit: cover; opacity: .86; }
.home-mini-art b { position: absolute; top: 17px; left: 28px; z-index: 1; color: rgba(255,255,255,.8); font-size: 29px; }
.home-mini-card > span:last-child { display: block; min-width: 0; margin-left: 11px; }
.home-mini-card strong, .home-mini-card small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.home-mini-card strong { font-size: 14px; }
.home-mini-card small { margin-top: 7px; color: #A0A0A8; font-size: 10px; }
.home-mini-card:focus small { color: #303038; }
.home-loading-skeleton { display: -webkit-box; display: -ms-flexbox; display: flex; }
.home-loading-skeleton i { display: block; width: 184px; height: 178px; margin-right: 18px; border-radius: 12px; background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.12), rgba(255,255,255,.05)); animation: skeletonPulse 1200ms ease-in-out infinite alternate; }
.home-empty { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-height: 170px; color: #A0A0A8; }
.home-empty strong { color: #F4F4F6; font-size: 21px; }
.home-empty span { margin-top: 8px; font-size: 14px; }
.home-footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); color: #808692; font-size: 13px; }
.home-footer button { min-width: 110px; margin: 0; padding: 8px 16px; font-size: 13px; }
.favorites-card { width: 1050px; }
.favorite-entry { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; margin: 7px 0; }
.favorite-result { min-height: 94px; padding-left: 12px; }
.favorite-entry .favorite-result { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin: 0; }
.favorite-remove { min-width: 112px; margin-left: 10px; border: 2px solid transparent; border-radius: 11px; outline: 0; background: rgba(255,255,255,.06); color: #A0A0A8; font: inherit; }
.favorite-remove:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.favorite-result-art { display: inline-block; width: 58px; height: 70px; margin-right: 16px; overflow: hidden; border-radius: 9px; background: #202633; color: #F4F4F6; font-size: 24px; line-height: 70px; text-align: center; vertical-align: middle; }
.favorite-result-art.favorite-result-art { object-fit: cover; }
.favorite-result > span:not(.favorite-result-art) { display: inline-block; width: 70px; margin-right: 4px; color: #70A5E0; font-size: 10px; font-weight: 700; vertical-align: middle; }
.favorite-result strong, .favorite-result small { display: inline-block; vertical-align: middle; }
.favorite-result strong { width: 340px; }
.favorite-result small { color: #A0A0A8; }
.history-card { width: 1050px; }
.history-result { min-height: 94px; padding-left: 12px; }
.history-result-art { display: inline-block; width: 58px; height: 70px; margin-right: 16px; overflow: hidden; border-radius: 9px; background: #202633; color: #F4F4F6; font-size: 24px; line-height: 70px; text-align: center; vertical-align: middle; }
.history-result-art.history-result-art { object-fit: cover; }
.history-result > span:not(.history-result-art) { display: inline-block; width: 70px; margin-right: 4px; color: #70A5E0; font-size: 10px; font-weight: 700; vertical-align: middle; }
.history-result strong, .history-result small { display: inline-block; vertical-align: middle; }
.history-result strong { width: 340px; }
.history-result small { color: #A0A0A8; }
.history-actions { display: -webkit-box; display: -ms-flexbox; display: flex; }
.history-actions button { margin-right: 12px; }
.history-clear { min-width: 180px; margin-top: 20px; padding: 13px 22px; border: 2px solid rgba(255,255,255,.2); border-radius: 11px; outline: 0; background: rgba(255,255,255,.06); color: #A0A0A8; }
.history-clear:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.history-clear:disabled { opacity: .38; }
.search-retry { min-width: 160px; margin-top: 20px; padding: 13px 22px; border: 2px solid #70A5E0; border-radius: 11px; outline: 0; background: #202633; color: #F4F4F6; font-weight: 600; }
.search-retry:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.overlay-loading-skeleton { padding: 12px 0; }
.overlay-loading-skeleton i { display: block; height: 70px; margin: 10px 0; border-radius: 12px; background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.12), rgba(255,255,255,.05)); }
.overlay-loading-skeleton i:nth-child(2) { opacity: .72; }
.overlay-loading-skeleton i:nth-child(3) { opacity: .48; }

/* Settings is a full TV surface, with the same section rail as the reference. */
.settings-card { width: 1760px; height: 980px; max-height: 980px; padding: 0; overflow: hidden; }
.settings-surface { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 100%; }
.settings-sidebar { -ms-flex: 0 0 330px; flex: 0 0 330px; padding: 46px 20px 32px; border-right: 1px solid rgba(255,255,255,.08); background: #0B0B0F; }
.settings-sidebar-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 72px; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.08); color: #F4F4F6; font-size: 23px; letter-spacing: 3px; }
.settings-sidebar-icon { display: block; width: 40px; height: 40px; margin-right: 16px; color: #70A5E0; font-size: 28px; line-height: 40px; text-align: center; }
.settings-nav { padding-top: 22px; }
.settings-nav-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 64px; margin: 0 0 8px; padding: 0 18px; border: 2px solid transparent; border-radius: 16px; outline: 0; background: transparent; color: #A0A0A8; text-align: left; }
.settings-nav-item.is-selected { color: #70A5E0; background: rgba(112,165,224,.11); }
.settings-nav-item:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.settings-nav-icon { display: block; width: 32px; margin-right: 14px; color: currentColor; font-size: 22px; text-align: center; }
.settings-sidebar-back { width: 100%; margin-top: 28px; padding: 24px 18px 0; border-top: 1px solid rgba(255,255,255,.08); border-right: 0; border-bottom: 0; border-left: 0; outline: 0; background: transparent; color: #A0A0A8; font-size: 20px; text-align: left; cursor: pointer; }
.settings-sidebar-back:focus { color: #F4F4F6; border-top-color: #70A5E0; }
.settings-main { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 54px 72px 36px; overflow: hidden auto; background: #0B0B0F; }
.settings-main-header { padding-bottom: 28px; }
.settings-main-header h2 { margin: 12px 0 0; color: #F4F4F6; font-size: 36px; }
.settings-list { margin: 0; border-top: 0; }
.settings-list div { min-height: 70px; padding: 18px 24px; border-bottom: 1px solid rgba(255,255,255,.08); color: #A0A0A8; font-size: 18px; }
.settings-list div .settings-row-label { color: #F4F4F6; }
.settings-list .settings-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 70px; padding: 18px 24px; border: 2px solid transparent; border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 12px; outline: 0; background: transparent; color: #A0A0A8; font: inherit; text-align: left; }
.settings-list .settings-row .settings-row-label { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #F4F4F6; }
.settings-list .settings-row strong { display: inline-block; max-width: 460px; padding: 8px 14px; border-radius: 10px; background: #202633; color: #A0A0A8; font-weight: 400; text-align: right; }
.settings-list .settings-row:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.settings-list .settings-row:focus .settings-row-label, .settings-list .settings-row:focus strong, .settings-list .settings-row:focus .settings-row-icon { background: transparent; color: #09090C; }
.settings-row-icon { display: inline-block; width: 38px; margin-right: 14px; color: #A0A0A8; font-size: 20px; text-align: center; }
.settings-row-label { display: inline-block; min-width: 360px; }
.settings-list div strong { color: #A0A0A8; font-weight: 400; }
.settings-list .settings-heading { min-height: 38px; padding: 28px 0 9px; border-bottom: 0; color: #A0A0A8; font-size: 16px; letter-spacing: 2px; }
.settings-list .setting-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 78px; padding: 18px 24px; border: 2px solid transparent; border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 12px; outline: 0; background: transparent; color: #A0A0A8; text-align: left; }
.settings-row-copy { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }
.settings-row-copy .settings-row-label { display: block; min-width: 0; }
.settings-row-copy small { display: block; margin-top: 5px; color: #858A98; font-size: 14px; line-height: 1.35; }
.settings-list .setting-toggle strong { min-width: 82px; padding: 9px 14px; border-radius: 999px; background: #202633; color: #70A5E0; text-align: center; }
.settings-list .setting-toggle:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.settings-list .setting-toggle:focus strong, .settings-list .setting-toggle:focus span, .settings-list .setting-toggle:focus small { color: #09090C; }
.settings-list .setting-toggle:focus strong { background: transparent; }
.settings-list .setting-accent { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 78px; padding: 18px 24px; border: 2px solid transparent; border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 12px; outline: 0; background: transparent; color: #A0A0A8; text-align: left; }
.settings-list .setting-accent strong { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #70A5E0; font-weight: 400; text-align: right; }
.setting-accent strong b { margin-left: 22px; color: #F4F4F6; font-size: 27px; font-weight: 400; }
.settings-list .setting-accent:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.settings-list .setting-accent:focus strong, .settings-list .setting-accent:focus strong b, .settings-list .setting-accent:focus .settings-row-icon { color: #09090C; }
.settings-list .settings-action { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 78px; padding: 18px 24px; border: 2px solid transparent; border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 12px; outline: 0; background: transparent; color: #A0A0A8; text-align: left; }
.settings-list .settings-action strong { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; color: #70A5E0; font-weight: 400; text-align: right; }
.settings-list .settings-action strong b { margin-left: 22px; color: #F4F4F6; font-size: 27px; font-weight: 400; }
.settings-list .settings-action:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 2px rgba(112,165,224,.3); }
.settings-list .settings-action:focus strong, .settings-list .settings-action:focus strong b, .settings-list .settings-action:focus .settings-row-icon { color: #09090C; }
.accent-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 80; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(5,5,7,.74); }
.accent-picker { width: 880px; max-height: 930px; padding: 48px 58px 34px; overflow: hidden; border-radius: 28px; background: #111116; box-shadow: 0 28px 90px rgba(0,0,0,.7); }
.accent-picker h2 { margin: 8px 0 24px; color: #F4F4F6; font-size: 34px; font-weight: 400; }
.accent-options { max-height: 700px; overflow: hidden auto; }
.accent-option { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 74px; margin: 8px 0; padding: 0 26px; border: 3px solid transparent; border-radius: 18px; outline: 0; background: transparent; color: #F4F4F6; font-size: 25px; text-align: left; }
.accent-option.is-selected { color: #F4F4F6; }
.accent-option:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.accent-option b { margin-left: auto; font-size: 32px; font-weight: 400; }
.accent-swatch { display: block; width: 50px; height: 50px; margin-right: 24px; border-radius: 50%; background: #A3A4AD; }
.accent-swatch-1 { background: #6E98C0; }
.accent-swatch-2 { background: #4B83C2; }
.accent-swatch-3 { background: #537DC8; }
.accent-swatch-4 { background: #4B9FA1; }
.accent-swatch-5 { background: #65A77E; }
.accent-swatch-6 { background: #D17B20; }
.accent-swatch-7 { background: #7C5BD8; }
.accent-picker footer { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 20px; color: #A0A0A8; font-size: 17px; }
.accent-picker footer button { margin-right: 22px; padding: 8px 0; border: 0; outline: 0; background: transparent; color: #A0A0A8; font: inherit; }
.accent-picker footer button:focus { color: #F4F4F6; }
.confirm-exit-card { width: 620px; padding: 44px 46px; text-align: center; border-radius: 24px; background: #111116; box-shadow: 0 28px 90px rgba(0,0,0,.7); }
.confirm-exit-card h2 { margin: 14px 0 10px; color: #F4F4F6; font-size: 30px; font-weight: 400; }
.confirm-exit-card p { margin: 0 0 30px; color: #A0A0A8; font-size: 17px; }
.confirm-exit-card footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.confirm-exit-cancel, .confirm-exit-confirm { margin: 0 10px; padding: 13px 30px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 16px; cursor: pointer; }
.confirm-exit-confirm { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #A0A0A8; }
.confirm-exit-cancel:focus, .confirm-exit-confirm:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
#app.tv-accent-silver .eyebrow, #app.tv-accent-silver .sync-status, #app.tv-accent-silver .movie-details-meta, #app.tv-accent-silver .platform-pill { color: #A3A4AD; }
#app.tv-accent-steel .eyebrow, #app.tv-accent-steel .sync-status, #app.tv-accent-steel .movie-details-meta, #app.tv-accent-steel .platform-pill { color: #6E98C0; }
#app.tv-accent-ocean .eyebrow, #app.tv-accent-ocean .sync-status, #app.tv-accent-ocean .movie-details-meta, #app.tv-accent-ocean .platform-pill { color: #537DC8; }
#app.tv-accent-lagoon .eyebrow, #app.tv-accent-lagoon .sync-status, #app.tv-accent-lagoon .movie-details-meta, #app.tv-accent-lagoon .platform-pill { color: #4B9FA1; }
#app.tv-accent-forest .eyebrow, #app.tv-accent-forest .sync-status, #app.tv-accent-forest .movie-details-meta, #app.tv-accent-forest .platform-pill { color: #65A77E; }
#app.tv-accent-sunset .eyebrow, #app.tv-accent-sunset .sync-status, #app.tv-accent-sunset .movie-details-meta, #app.tv-accent-sunset .platform-pill { color: #D17B20; }
.settings-main .setting-pin, .settings-main .settings-disconnect, .settings-main .search-close { margin-right: 12px; }

.profile-card { width: 860px; max-height: 880px; padding: 54px 64px 42px; overflow: hidden auto; border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: #1A1A22; box-shadow: 0 24px 70px rgba(0,0,0,.68); }
.profile-card h2 { margin: 10px 0 12px; color: #F4F4F6; font-size: 38px; font-weight: 400; }
.profile-intro { margin: 0 0 28px; color: #A0A0A8; font-size: 17px; }
.profile-entry { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 10px 0; }
.profile-option { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-height: 88px; padding: 12px 18px; border: 2px solid transparent; border-radius: 14px; outline: 0; background: rgba(255,255,255,.045); color: #F4F4F6; text-align: left; cursor: pointer; }
.profile-option.is-active { border-color: rgba(112,165,224,.7); background: rgba(112,165,224,.12); }
.profile-option:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.profile-option:focus small, .profile-option:focus b { color: #09090C; }
.profile-avatar { display: block; width: 58px; height: 58px; margin-right: 18px; border-radius: 50%; background: #416EAA; color: #F4F4F6; font-size: 28px; line-height: 58px; text-align: center; }
.profile-option > span:nth-child(2) { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
.profile-option strong, .profile-option small { display: block; }
.profile-option strong { font-size: 22px; font-weight: 400; }
.profile-option small { margin-top: 6px; color: #858A98; font-size: 14px; }
.profile-option b { color: #70A5E0; font-size: 26px; font-weight: 400; }
.profile-edit, .profile-remove { min-width: 90px; margin-left: 9px; padding: 12px 10px; border: 2px solid transparent; border-radius: 10px; outline: 0; background: transparent; color: #A0A0A8; cursor: pointer; }
.profile-edit:focus, .profile-remove:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.profile-remove { color: #D18A8A; }
.profile-editor { margin-top: 24px; padding: 22px; border: 1px solid rgba(112,165,224,.45); border-radius: 14px; background: rgba(112,165,224,.08); }
.profile-editor label { display: block; margin-bottom: 10px; color: #F4F4F6; font-size: 17px; }
.profile-name-input { width: 100%; padding: 14px 16px; border: 2px solid #70A5E0; border-radius: 10px; outline: 0; background: #F4F4F6; color: #09090C; font-size: 20px; }
.profile-editor-help { margin: 10px 0 16px; color: #A0A0A8; font-size: 14px; }
.profile-save, .profile-add, .profile-editor-cancel { margin: 0 10px 0 0; padding: 13px 20px; border: 2px solid #70A5E0; border-radius: 999px; outline: 0; background: #202633; color: #F4F4F6; font-size: 16px; cursor: pointer; }
.profile-save:focus, .profile-add:focus, .profile-editor-cancel:focus { background: #F4F4F6; color: #09090C; box-shadow: 0 0 0 3px rgba(112,165,224,.3); }
.profile-actions { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); }
.profile-actions .search-close { margin-left: auto; }
.tracks-card { width: 760px; max-height: 720px; padding: 52px 64px 42px; overflow: hidden auto; border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: #1A1A22; box-shadow: 0 24px 70px rgba(0,0,0,.68); }
.tracks-card h2 { margin: 10px 0 12px; color: #F4F4F6; font-size: 38px; font-weight: 400; }
.tracks-card > p { margin: 0 0 30px; color: #A0A0A8; font-size: 17px; }
.tracks-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 92px; padding: 14px 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.045); }
.tracks-icon { display: block; width: 58px; height: 58px; margin-right: 18px; border-radius: 50%; background: #416EAA; color: #F4F4F6; font-size: 18px; line-height: 58px; text-align: center; }
.tracks-row > span:nth-child(2) { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
.tracks-row strong, .tracks-row small { display: block; }
.tracks-row strong { color: #F4F4F6; font-size: 21px; font-weight: 400; }
.tracks-row small { margin-top: 6px; color: #858A98; font-size: 14px; }
.tracks-toggle { min-width: 86px; padding: 10px 14px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #70A5E0; cursor: pointer; }
.tracks-toggle:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.tracks-audio-row { margin-top: 12px; }
.tracks-audio-toggle { min-width: 112px; padding: 10px 14px; border: 2px solid transparent; border-radius: 999px; outline: 0; background: #202633; color: #70A5E0; cursor: pointer; }
.tracks-audio-toggle:focus { border-color: #70A5E0; background: #F4F4F6; color: #09090C; }
.tracks-note { margin: 24px 0 26px; color: #858A98; font-size: 14px; line-height: 1.5; }

/* Accent colour is a product-wide TV theme, not a label-only preference. */
#app .rail-item.is-selected, #app .category-item.is-selected { color: var(--tv-text-primary, #fff); background: var(--tv-accent-wash, rgba(112,165,224,.18)); }
#app .rail-item:focus, #app .category-item:focus, #app .channel-row:focus, #app .poster-card:focus, #app .schedule-row:focus { border-color: var(--tv-accent, #70A5E0) !important; box-shadow: 0 10px 30px rgba(0,0,0,.38), 0 0 0 2px var(--tv-accent-focus, rgba(112,165,224,.3)); }
/* PARIDADE-DESIGN-TOKENS-2026-09-06 B6/Lote 3, Decisao 6: o .rail-item:focus/
   .category-item:focus abaixo (linha ~36/50) tinham o fundo do foco em
   #8e73e6 fixo com !important, ganhando sempre a este bloco #app -- a borda
   seguia o accent escolhido mas o fundo ficava sempre na cor antiga. Aqui
   passa a acompanhar o accent tambem; o literal antigo la em baixo fica so
   como recurso pre-JS. */
#app .rail-item:focus, #app .category-item:focus { background: var(--tv-accent-wash, rgba(142,115,230,.2)) !important; }
#app .account-card:focus, #app .settings-shortcut:focus, #app .settings-list button:focus, #app .details-actions button:focus, #app .player-control-hints button:focus, #app .tracks-toggle:focus, #app .tracks-audio-toggle:focus, #app .search-close:focus, #app .surface-action:focus, #app .profile-option:focus { border-color: var(--tv-accent, #70A5E0); box-shadow: 0 0 0 3px var(--tv-accent-focus, rgba(112,165,224,.3)); }
#app .content-empty-action:focus, #app .guide-sources:focus, #app .empty-surface-action:focus { border-color: var(--tv-accent, #70A5E0); box-shadow: 0 0 0 3px var(--tv-accent-focus, rgba(112,165,224,.3)); }
#app .content-empty-action, #app .guide-sources, #app .empty-surface-action { border-color: var(--tv-accent, #70A5E0); }
#app .rail-item.is-selected .rail-icon, #app .category-item.is-selected small, #app .channel-live, #app .channel-row.is-selected .channel-logo, #app .poster-favorite, #app .poster-progress i, #app .row-progress i, #app .guide-progress i, #app .progress-track span, #app .player-info-track i { color: var(--tv-accent, #70A5E0); background-color: var(--tv-accent, #70A5E0); }
#app .schedule-row.is-current .schedule-row-time, #app .schedule-row-reminder { color: var(--tv-accent-text, #70A5E0); }
#app .channel-live { background: var(--tv-accent-wash, rgba(112,165,224,.18)); }
#app .poster-favorite { color: var(--tv-focus-text, #09090C); }
#app .settings-nav-item.is-selected, #app .profile-option.is-active { color: var(--tv-accent-text, #70A5E0); background: var(--tv-accent-wash, rgba(112,165,224,.18)); }
#app .details-tab.is-selected, #app .details-tab:focus, #app .profile-option b, #app .tracks-toggle, #app .player-tracks, #app .player-retry { color: var(--tv-accent-text, #70A5E0); }
#app .details-tab.is-selected { border-bottom-color: var(--tv-accent, #70A5E0); }
#app .details-side-rail-item.is-active { color: var(--tv-accent-text, #70A5E0); background: var(--tv-accent-wash, rgba(112,165,224,.18)); box-shadow: 0 0 0 2px var(--tv-accent-focus, rgba(112,165,224,.3)); }
#app .details-side-rail-item:focus, #app .accent-option:focus { border-color: var(--tv-accent, #70A5E0); box-shadow: 0 0 0 3px var(--tv-accent-focus, rgba(112,165,224,.3)); }
#app .player-top .player-live-pill.is-vod, #app .player-tracks, #app .player-retry { border-color: var(--tv-accent, #70A5E0); }