:root {
	color-scheme: dark;
	--bg: #101310;
	--panel: #1a1e19;
	--text: #f3f3e9;
	--muted: #a4ada0;
	--line: #30372e;
	--green: #c7ed89;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Arial, Helvetica, sans-serif; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, select { cursor: pointer; }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--green); outline-offset: 5px; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }
.topbar { display: flex; align-items: center; gap: 42px; min-height: 92px; padding: 20px 5%; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 12px; font-size: 27px; font-weight: 800; letter-spacing: -1.4px; white-space: nowrap; }
.brand-server { font-weight: 400; color: var(--green); }
.brand-icon { display: grid; place-items: center; width: 38px; height: 38px; background: var(--green); color: var(--bg); border-radius: 10px; font-family: Georgia, serif; font-size: 30px; padding-bottom: 5px; }
nav { display: flex; flex-wrap: wrap; gap: 5px; }
.nav-item { border: 0; background: none; color: var(--muted); padding: 12px 15px; border-radius: 8px; font-size: 14px; }
.nav-item.active { background: #252c23; color: var(--green); }
.nav-item:hover { color: white; background: #252c23; }
.navigation-panel { display: contents; }
.menu-toggle { display: none; }
.home-label { margin-left: auto; font: 10px monospace; letter-spacing: 1.3px; white-space: nowrap; color: var(--muted); }
.home-label i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--green); margin-right: 8px; }
.account-actions { margin-left: auto; font-size: 12px; color: var(--muted); white-space: nowrap; }
.account-actions a:hover { color: var(--green); }
.account-actions a + a { margin-left: 16px; }
.activity-card { width: min(100%, 1200px) !important; }
.activity-card h2 { margin: 32px 0 10px; }
.activity-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 28px 0; }
.activity-stats > div { border: 1px solid var(--line); padding: 18px; border-radius: 12px; }
.activity-stats strong { display: block; font-size: 28px; color: var(--green); }
.activity-stats span { display: block; font-size: 12px; color: var(--muted); margin-top: 8px; }
.activity-filters { display: flex; gap: 20px; flex-wrap: wrap; margin: 16px 0; }
.activity-filters input, .activity-filters select { padding: 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: inherit; }
.table-scroll { overflow-x: auto; }
.activity-card table { width: 100%; border-collapse: collapse; font-size: 13px; text-align: left; }
.activity-card td, .activity-card th { padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; min-width: 110px; }
.activity-card th { color: var(--muted); font-weight: 500; }
@media (max-width: 650px) { .activity-stats { grid-template-columns: repeat(2, 1fr); } .activity-card { padding: 22px !important; } }
.auth-page { min-height: 100dvh; display: grid; place-items: center; padding: 30px 20px; background: radial-gradient(ellipse at top, #25321e, var(--bg) 65%); }
.auth-card { width: min(100%, 430px); background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 36px; }
.auth-card .brand { margin-bottom: 38px; }
.auth-card .eyebrow { font-size: 9px; letter-spacing: 1.4px; }
.auth-card h1 { font-size: 30px; }
.approval-pending { border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin-top: 20px; }
.approval-pending p { line-height: 1.5; font-size: 14px; }
.approval-pending .approval-status { color: var(--green, #c4ed84); font-weight: 700; margin-top: 0; }
#pendingEmail { overflow-wrap: anywhere; font-weight: 600; }
.approval-pending .button { width: 100%; margin-top: 10px; }
.people-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
.signin-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:20px 0; }
.signin-summary > div { padding:16px; background:var(--bg); border:1px solid var(--line); border-radius:12px; }
.signin-summary strong { display:block; font-size:26px; color:var(--green); }
.signin-summary span,.signin-row small,.signin-row time { color:var(--muted); font-size:13px; }
.signin-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.signin-row > div { min-width:0; }
.signin-row .button { flex-shrink:0; }
.signin-row p { margin:7px 0; }
.signin-row small { display:block; }
.signin-row.blocked strong { color:#ffb3a7; }
.signin-row.warning strong { color:#f0d387; }
.signin-events { max-height:400px; overflow:auto; margin-top:12px; }
#signInHistory { margin-top:20px; }
.apk-downloads { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.apk-downloads a { display:flex; align-items:center; justify-content:center; gap:10px; }
.apk-downloads svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.7; }
@media (max-width:600px) {
	.signin-summary { gap:8px; }
	.signin-summary > div { padding:12px; }
	.signin-row { align-items:flex-start; flex-direction:column; gap:8px; }
	.apk-downloads { grid-template-columns:1fr; }
}
.auth-description { color: #c3c9bd; font-size: 14px; line-height: 1.65; margin: 16px 0 25px; }
.auth-field { display: flex; flex-direction: column; gap: 9px; font-size: 13px; margin-bottom: 20px; }
.auth-field input { width: 100%; background: var(--bg); border: 1px solid #46503f; border-radius: 7px; color: var(--text); padding: 13px; font-size: 16px; }
.auth-note { color: var(--muted); font-size: 12px; line-height: 1.65; }
.auth-card form > .button { width: 100%; }
#authMessage { color: var(--green); font-size: 13px; line-height: 1.6; }
.settings-card { width: min(100%, 550px); }
.remote-address { margin: 26px 0; padding: 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.remote-address h2 { font-size: 18px; }
.remote-address > a { display: block; color: var(--green); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; text-decoration: underline; text-underline-offset: 3px; }
.settings-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin: 28px 0; }
.settings-actions a { font-size: 12px; color: var(--muted); }
.hero { display: flex; align-items: center; gap: 24px; margin: 26px 5% 0; padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.hero > img { flex: 0 0 auto; width: 106px; height: 159px; object-fit: cover; border-radius: 6px; }
.hero-content { min-width: 0; max-width: 850px; }
.eyebrow { margin: 0 0 18px; font: 10px monospace; letter-spacing: 2.2px; color: var(--green); }
h1 { font-size: 27px; line-height: 1.15; letter-spacing: -.8px; margin: 0 0 10px; text-wrap: balance; }
.hero .eyebrow { font-size: 9px; margin-bottom: 10px; letter-spacing: 1.6px; }
.hero-description { max-width: 720px; color: var(--muted); line-height: 1.5; font-size: 13px; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hero-meta { color: var(--muted); font-size: 11px; margin: 11px 0 14px; }
.coming-section { padding: 30px 5% 0; }
.coming-calendar { display: none; }
.coming-section .hero { margin: 0 0 20px; }
.coming-section .shelf-heading { margin-bottom: 20px; }
.coming-section .filters { margin: 20px 0 18px; }
.coming-date { display: block; color: var(--green); font-size: 13px; line-height: 1.6; }
.coming-episode { display: block; color: var(--text); font-size: 12px; margin-top: 5px; }
.coming-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.coming-card { display: flex; gap: 15px; align-items: flex-start; padding: 14px; text-align: left; color: var(--text); background: var(--panel); border: 1px solid var(--line); border-radius: 10px; }
.coming-card:hover { border-color: var(--green); }
.coming-card > img { width: 60px; height: 90px; object-fit: cover; border-radius: 5px; }
.coming-card-text { min-width: 0; }
.coming-card-text > strong { display: block; font-size: 14px; line-height: 1.4; margin-bottom: 5px; }
.coming-card-text small { display: block; font-size: 11px; line-height: 1.5; color: var(--muted); margin-top: 5px; }
.coming-note { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 16px 0 0; }
.coming-details { padding-top: 48px; }
.coming-details .button { display: inline-block; margin-top: 22px; }
.upcoming-schedule { display: grid; gap: 10px; margin-top: 15px; }
.upcoming-episode { display: grid; gap: 5px; padding: 15px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.ratings { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.rating-score { display: inline-flex; align-items: center; gap: 9px; border: 1px solid #454e38; background: #22291e; border-radius: 6px; padding: 8px 10px; line-height: 1.3; }
.rating-score > span { color: #c3c9bd; font-size: 11px; }
.rating-score > strong { color: var(--green); font-size: 14px; white-space: nowrap; }
a.rating-score:hover { border-color: var(--green); }
.compact-ratings { margin: 8px 0; gap: 5px; }
.compact-ratings .rating-score { padding: 5px 6px; gap: 6px; }
.compact-ratings .rating-score > span { font-size: 10px; }
.compact-ratings .rating-score > strong { font-size: 11px; }
.ratings-empty { color: var(--muted); font-size: 12px; }
@media (max-width: 1100px) { .coming-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 650px) {
	.coming-grid { grid-template-columns: 1fr; }
	.coming-section .shelf-heading { gap: 8px; }
	.coming-section .shelf-heading .button { padding: 8px; font-size: 11px; }
}
.button { padding: 13px 21px; border: 1px solid var(--line); border-radius: 7px; font-size: 13px; font-weight: 600; }
.button.primary { background: var(--green); color: #182111; border-color: var(--green); }
.button.secondary { background: #232a22; color: var(--text); }
.button.quiet { background: transparent; color: var(--muted); border-color: transparent; }
.button.quiet:hover { color: var(--green); }
.button:hover { filter: brightness(1.13); }
.button:disabled { opacity: .5; cursor: wait; }
.hero .button { padding: 9px 13px; font-size: 12px; margin: 0 5px 0 0; }
.releases { padding: 32px 5% 0; }
.shelf-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.shelf-description { margin: 9px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.shelf-heading .button { white-space: nowrap; }
.release-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 100px) / 6); gap: 20px; overflow-x: auto; padding: 0 0 16px; scrollbar-color: #48563d transparent; scrollbar-width: thin; scroll-snap-type: x proximity; }
.release-grid .card { scroll-snap-align: start; align-self: start; }
.release-grid .release-episode { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.release-grid .poster .badge { display: none; }
.collection { padding: 34px 5% 65px; min-height: 420px; }
.collection-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.collection-toolbar .eyebrow { margin-bottom: 11px; color: var(--muted); font-size: 9px; }
h2 { margin: 0; font-size: 27px; letter-spacing: -.8px; }
#count { font: 12px monospace; color: var(--muted); margin-left: 8px; letter-spacing: 0; }
.tools { display: flex; gap: 12px; }
.search { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 7px; background: #191d18; padding: 0 14px; }
.search span { font-size: 25px; color: var(--muted); }
.search input { background: none; border: 0; color: var(--text); padding: 14px 10px; font-size: 12px; width: 255px; }
select { background: #191d18; color: var(--text); border: 1px solid var(--line); border-radius: 7px; padding: 13px 30px 13px 12px; font-size: 12px; }
.filters { display: flex; gap: 8px; margin: 27px 0; }
.chip { border: 1px solid var(--line); background: none; color: var(--muted); padding: 8px 16px; border-radius: 30px; font-size: 12px; }
.chip.active { background: var(--green); border-color: var(--green); color: #17200e; }
.status { color: var(--muted); line-height: 1.7; }
.grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 32px 20px; }
.card { display: block; align-self:start; min-width: 0; border: 0; background: none; text-align: left; padding: 0; }
.poster { position: relative; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 9px; background: #252d22; border: 1px solid #ffffff0b; }
.poster img { position: relative; width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.card:hover .poster img { transform: scale(1.04); }
.poster .fallback { position: absolute; inset: 0; display: grid; place-items: center; padding: 20px; text-align: center; font-size: 24px; font-family: Georgia, serif; color: #c7d8b8; background: radial-gradient(ellipse at top left, #4a6040, #182016); }
.poster .badge { position: absolute; top: 10px; left: 10px; background: #101310db; padding: 5px 7px; border-radius: 4px; font: 9px monospace; letter-spacing: 1px; }
.poster .play-mark { position: absolute; bottom: 12px; right: 12px; display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; background: var(--green); color: var(--bg); opacity: 0; transition: opacity .2s; }
.card:hover .play-mark, .card:focus-visible .play-mark { opacity: 1; }
.card h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; line-height: 1.5; margin: 12px 0 4px; font-weight: 500; }
.card p { color: var(--muted); font-size: 11px; margin: 0; line-height: 1.5; }
.card > .compact-ratings { min-height:32px; align-items:center; }
.more { text-align: center; margin-top: 38px; }
footer { border-top: 1px solid var(--line); margin: 0 5%; padding: 30px 0 35px; display: flex; align-items: center; gap: 28px; color: var(--muted); }
.footer-brand { font-size: 20px; gap: 0; color: var(--text); }
footer p { font-size: 12px; }
footer > span { margin-left: auto; font: 9px monospace; letter-spacing: 2px; }
dialog { padding: 0; color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 14px; width: min(860px, 94vw); max-height: 92dvh; }
dialog::backdrop { background: #000b; backdrop-filter: blur(7px); }
.close { position: absolute; right: 16px; top: 16px; z-index: 2; border: 1px solid #ffffff25; border-radius: 50%; width: 38px; height: 38px; background: #101310dd; font-size: 25px; }
.detail-art { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; display: block; background: #252d22; }
.detail-content { padding: 28px 32px 34px; }
.detail-content h2 { font-size: 34px; margin: 12px 0; }
.detail-content .overview { color: #c3c9bd; line-height: 1.7; font-size: 14px; }
.detail-meta { color: var(--muted); font-size: 12px; line-height: 1.7; }
.episode-list { display: grid; gap: 9px; margin-top: 20px; }
.episode-share-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.episode-share-row > .share-panel { grid-column: 1 / -1; }
.share-button { margin-left: 8px; }
.share-panel { padding: 20px; margin-top: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.share-panel h3 { margin-top: 0; font-size: 18px; }
.share-panel p { color: var(--muted); line-height: 1.5; font-size: 13px; }
.share-entry, .share-result { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 12px; }
.share-entry span { flex: 1; min-width: 160px; font-size: 13px; color: var(--muted); }
.share-url { flex: 1; min-width: 0; width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--text); }
.share-panel .button { min-height: 44px; }
.episode { display: flex; align-items: center; width: 100%; gap: 16px; padding: 16px; text-align: left; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; }
.episode-number { color: var(--green); font: 15px monospace; min-width: 20px; }
.episode-text { flex: 1; }
.episode-title { display: block; font-size: 14px; margin-bottom: 5px; }
.episode-overview { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--muted); font-size: 12px; line-height: 1.5; }
.season-picker { margin-top: 20px; }
#player { width: min(1150px, 98vw); }
.player-header { position: relative; display: flex; justify-content: space-between; padding: 24px 70px 24px 24px; }
.player-header .eyebrow { font-size: 9px; margin-bottom: 10px; }
.player-header h2 { font-size: 20px; }
video { display: block; width: 100%; max-height: 61dvh; aspect-ratio: 16 / 9; background: black; }
#playerStatus { color: var(--muted); font-size: 12px; margin: 15px 24px; }
.player-settings { display: flex; align-items: end; gap: 14px; flex-wrap: wrap; padding: 6px 24px 14px; }
.player-settings label { display: flex; flex-direction: column; gap: 8px; font-size: 11px; color: var(--muted); }
.player-settings select { max-width: 270px; }
.player-note { margin: 4px 24px 22px; font-size: 11px; color: var(--muted); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
@media (max-width: 1150px) {
	.home-label { display: none; }
	.grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.release-grid { grid-auto-columns: calc((100% - 80px) / 5); }
	.topbar { gap: 25px; }
	.collection-toolbar { align-items: start; }
	.search input { width: 210px; }
}
@media (max-width: 850px) {
	.coming-calendar { display: block; }
	.coming-section > .shelf-heading, .coming-section > #comingFilters, .coming-section > #comingGrid, .coming-section > #comingMore, .coming-section > #comingStatus { display: none; }
	.calendar-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
	.calendar-heading span { color: var(--muted); font-size: 12px; }
	.calendar-days { display: grid; }
	.calendar-day { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 12px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line); }
	.calendar-date { display: grid; gap: 3px; }
	.calendar-date strong { color: var(--green); font-size: 12px; }
	.calendar-date span { color: var(--muted); font-size: 10px; }
	.calendar-day-items { display: flex; flex-wrap: wrap; gap: 2px 14px; align-items: center; }
	.calendar-empty { color: var(--muted); font-size: 11px; }
	.calendar-summary { color: var(--muted); font-size: 11px; line-height: 1.5; margin: 10px 0 2px; }
	.calendar-item { display: inline-flex; flex-wrap: wrap; align-items: baseline; column-gap: 6px; min-height: 28px; max-width: 100%; padding: 5px 0; text-align: left; background: transparent; border: 0; line-height: 1.4; }
	.calendar-item strong { font-size: 12px; overflow-wrap: anywhere; }
	.calendar-item span { color: var(--muted); font-size: 11px; white-space: nowrap; }
	.calendar-item:hover strong { color: var(--green); }
	.coming-section { padding-top: 20px; }
	.coming-section .hero, .coming-section .shelf-description, .coming-section > .coming-note { display: none; }
	.coming-section .shelf-heading { flex-direction: row; align-items: center; gap: 8px; margin-bottom: 8px; }
	.coming-section h2 { font-size: 22px; }
	.coming-section .shelf-heading .button { padding: 8px; font-size: 11px; }
	.coming-section .filters { margin: 0 0 8px; }
	.coming-section .chip { min-height: 44px; }
	.coming-grid { grid-template-columns: 1fr; gap: 0; }
	.coming-card { min-height: 58px; padding: 9px 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; align-items: center; }
	.coming-card > img, .coming-card-text small, .coming-card .ratings { display: none; }
	.coming-card-text { width: 100%; }
	.coming-card-text > strong { font-size: 13px; margin-bottom: 1px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
	.coming-card .coming-date { font-size: 12px; line-height: 1.5; }
	#comingMore { min-height: 44px; padding: 10px 0; font-size: 12px; }
	.topbar { position: relative; z-index: 20; flex-wrap: nowrap; justify-content: space-between; gap: 12px; min-height: 72px; padding: 12px 5%; }
	.topbar .brand { font-size: 25px; }
	.topbar .brand-icon { width: 34px; height: 34px; }
	.menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); font-size: 13px; }
	.menu-icon { font-size: 18px; line-height: 1; }
	.menu-open .menu-toggle { border-color: var(--green); color: var(--green); }
	.navigation-panel { display: none; position: absolute; top: calc(100% - 1px); left: 5%; right: 5%; max-height: calc(100dvh - 90px); overflow-y: auto; overscroll-behavior: contain; background: #191e18; border: 1px solid var(--line); border-radius: 0 0 12px 12px; padding: 12px; box-shadow: 0 18px 35px #0008; }
	.menu-open .navigation-panel { display: block; }
	.navigation-panel nav { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 6px; }
	.navigation-panel .nav-item { display: flex; align-items: center; min-height: 48px; padding: 12px; text-align: left; font-size: 14px; }
	.navigation-panel .account-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin: 10px 0 0; border-top: 1px solid var(--line); padding-top: 8px; white-space: normal; }
	.navigation-panel .account-actions:not(:has(a:not([hidden]), button:not([hidden]))) { display: none; }
	.navigation-panel .account-actions a, .navigation-panel .account-actions .button { display: inline-flex; align-items: center; min-height: 44px; margin: 0; padding: 10px 12px; font-size: 12px; }
	.navigation-panel .local-routing:not([hidden]) { margin-top: 8px; padding: 12px; border-radius: 8px; gap: 6px 12px; font-size: 12px; line-height: 1.6; }
	.navigation-panel .local-routing .button, .navigation-panel .local-routing a { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 0; }
	.hero { gap: 18px; padding: 18px; }
	.hero > img { width: 90px; height: 135px; }
	.hero .button { padding: 8px 10px; font-size: 11px; }
	.release-grid { grid-auto-columns: calc((100% - 42px) / 3.5); gap: 14px; }
	.collection-toolbar { flex-direction: column; gap: 20px; }
	.tools { width: 100%; }
	.search { flex: 1; }
	.search input { width: 100%; }
	.grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 25px 14px; }
	footer > span { display: none; }
}
@media (max-width: 550px) {
	.brand { font-size: 25px; }
	.hero { align-items: start; gap: 14px; margin-top: 18px; padding: 14px; }
	.hero > img { width: 70px; height: 105px; }
	h1 { font-size: 21px; letter-spacing: -.5px; }
	.hero-description { display: none; }
	.hero .eyebrow { font-size: 8px; letter-spacing: .8px; }
	.hero-meta { font-size: 10px; margin: 8px 0 12px; }
	.hero .button { margin-bottom: 6px; }
	.hero .button.quiet { display: block; margin-bottom: 0; padding-left: 0; }
	.shelf-heading { align-items: start; flex-direction: column; gap: 8px; margin-bottom: 15px; }
	.shelf-heading .button { padding: 0; font-size: 11px; }
	.release-grid { grid-auto-columns: calc((100% - 28px) / 2.7); }
	.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 11px; }
	.collection { padding-left: 5%; padding-right: 5%; }
	h2 { font-size: 24px; }
	.tools { gap: 8px; }
	.search { min-width: 0; padding: 0 8px; }
	.search input { min-width: 0; padding-left: 6px; }
	.tools select { max-width: 125px; padding-right: 8px; }
	.card h3 { font-size: 11px; margin-top: 8px; }
	.card p { font-size: 10px; }
	.poster { border-radius: 6px; }
	.poster .badge { font-size: 7px; top: 6px; left: 6px; padding: 4px; }
	footer { gap: 18px; }
	footer p { font-size: 10px; }
	.detail-content { padding: 22px; }
	.detail-content h2 { font-size: 28px; }
	.player-settings { padding: 4px 16px 12px; gap: 12px; }
	.player-settings select { max-width: 190px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
.cast-panel { padding: 4px 24px 16px; }
.cast-panel p { font-size: 13px; color: var(--muted, #aeb5ac); margin: 9px 0; }
.cast-panel svg { vertical-align: middle; margin-right: 7px; }
.cast-panel a { color: inherit; font-size: 13px; }
#castControls:not([hidden]) { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 12px; }
.cast-seek { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 180px; font-size: 12px; }
.cast-seek input { flex: 1; min-width: 70px; }
#video[hidden] { display: none; }
.local-routing:not([hidden]) { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; padding: 12px 5%; background: #19211b; font-size: 13px; }
.local-routing a { color: inherit; }
.local-routing .button { font-size: 12px; padding: 6px 10px; }

#liveGuide { margin-top: 22px; }
.guide-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.guide-toolbar p, .guide-note { color: var(--muted); font-size: 12px; line-height: 1.6; }
.guide-toolbar p { margin: 0; }
.guide-toolbar .button { padding: 7px 0 7px 12px; white-space: nowrap; }
.guide-head, .guide-row { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(0, 1.4fr) minmax(0, 1.2fr) 85px; gap: 24px; align-items: center; padding: 14px 18px; }
.guide-head { color: var(--muted); font: 10px monospace; letter-spacing: 1.4px; border-bottom: 1px solid var(--line); }
.guide-head span:nth-child(2) { color: var(--green); }
.guide-rows { border: 1px solid var(--line); border-top: 0; border-radius: 0 0 9px 9px; overflow: hidden; }
.guide-row { min-height: 86px; border-bottom: 1px solid var(--line); }
.guide-row:last-child { border-bottom: 0; }
.guide-row:nth-child(2n) { background: #171c16; }
.guide-row:hover { background: #20271e; }
.guide-channel, .guide-programme, .guide-schedule-item { border: 0; background: none; padding: 0; text-align: left; min-width: 0; }
.guide-channel { display: flex; align-items: center; gap: 12px; }
.guide-logo { width: 44px; height: 38px; object-fit: contain; flex: 0 0 auto; }
.guide-channel-name { min-width: 0; }
.guide-channel-name small { display: block; color: var(--muted); font: 10px monospace; margin-bottom: 5px; }
.guide-channel-name strong { font-size: 12px; line-height: 1.5; display: block; overflow-wrap: anywhere; }
.guide-cell { min-width: 0; }
.guide-programme { display: block; width: 100%; }
.guide-programme strong { font-size: 13px; font-weight: 500; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.guide-programme:hover strong, .guide-channel:hover strong { color: var(--green); }
.guide-time { display: block; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; line-height: 1.5; margin-top: 4px; }
.guide-progress { display: block; width: 100%; max-width: 240px; height: 3px; margin-top: 8px; border: 0; border-radius: 3px; overflow: hidden; background: #35402f; accent-color: var(--green); }
.guide-progress::-webkit-progress-bar { background: #35402f; }
.guide-progress::-webkit-progress-value { background: var(--green); }
.guide-progress::-moz-progress-bar { background: var(--green); }
.guide-missing { font-size: 12px; color: #899382; }
.guide-watch { border: 1px solid #495d36; color: var(--green); background: #25301e; border-radius: 6px; padding: 9px 10px; font-size: 12px; white-space: nowrap; }
.guide-watch:hover { background: var(--green); color: var(--bg); }
.guide-mobile-label { display: none; }
.guide-note { margin: 16px 0; }
.guide-details { padding-top: 36px; }
.guide-details > .eyebrow { padding-right: 40px; }
.guide-schedule-title { margin: 30px 0 14px; font-size: 15px; font-weight: 500; }
.guide-schedule-item { display: grid; grid-template-columns: 110px 1fr auto; gap: 12px; align-items: center; width: 100%; padding: 14px 10px; border-top: 1px solid var(--line); }
.guide-schedule-item.selected { background: #263020; }
.guide-schedule-item strong { font-size: 13px; line-height: 1.5; font-weight: 500; }
.guide-schedule-item .guide-time { margin: 0; }
.guide-live { color: var(--green); font: 9px monospace; }
@media (max-width: 1000px) {
	.guide-head, .guide-row { grid-template-columns: minmax(150px, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) 75px; gap: 14px; padding: 12px; }
	.guide-logo { width: 32px; height: 32px; }
}
@media (max-width: 650px) {
	.guide-head { display: none; }
	.guide-rows { border-top: 1px solid var(--line); border-radius: 8px; }
	.guide-row { grid-template-columns: minmax(0, 1fr) 82px; gap: 12px 18px; padding: 16px; }
	.guide-channel { grid-column: 1; grid-row: 1; }
	.guide-channel-name strong { font-size: 13px; }
	.guide-watch { grid-column: 2; grid-row: 1; }
	.guide-cell { grid-column: 1 / -1; display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 0 10px; }
	.guide-mobile-label { display: block; color: var(--muted); font-size: 10px; line-height: 20px; }
	.guide-progress { grid-column: 2; max-width: none; }
	.guide-cell .guide-time { display: inline; margin-left: 8px; }
	.guide-programme strong { display: inline; }
	.guide-toolbar { align-items: start; gap: 10px; }
	.guide-toolbar .button { font-size: 11px; padding-top: 0; }
	.guide-schedule-item { grid-template-columns: 90px 1fr; gap: 8px; }
	.guide-schedule-item .guide-live { grid-column: 2; }
}

/* Tellybox: one calm visual language across browsing, playback and administration. */
.brand-logo { display: block; width: 190px; height: 62px; object-fit: contain; }
.topbar { padding-block: 10px; gap: 28px; }
body { font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
button, a { touch-action: manipulation; }
button { transition: background .16s ease, border-color .16s ease, transform .16s ease; }
button:active { transform: scale(.985); }
.settings-header { display: flex; align-items: center; justify-content: space-between; padding: 16px max(5%, calc((100vw - 1100px) / 2)); border-bottom: 1px solid var(--line); }
.settings-shell { width: min(1100px, 90%); margin: 44px auto 80px; }
.settings-shell h1 { font-size: clamp(32px, 5vw, 48px); letter-spacing: -1.7px; margin: 8px 0; }
.settings-intro, .settings-heading p { color: var(--muted); }
.settings-tabs { margin: 30px 0; padding-bottom: 20px; border-bottom: 1px solid var(--line); gap: 8px; }
.settings-tabs .chip { min-height: 46px; }
.settings-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.settings-heading h2 { margin-bottom: 4px; }
.settings-box { background: var(--panel); border: 1px solid var(--line); border-radius: 18px; padding: 24px; margin: 16px 0; }
.settings-box h2, .settings-box h3 { margin-top: 0; }
.settings-box p { color: var(--muted); line-height: 1.6; }
.settings-box summary { cursor: pointer; font-weight: 650; min-height: 24px; }
.settings-box input:not([type=checkbox]), .settings-box select { border: 1px solid var(--line); border-radius: 10px; padding: 12px; background: var(--bg); color: var(--text); }
.settings-box form { max-width: 500px; }
.settings-link { display: flex; justify-content: space-between; padding: 24px; border: 1px solid var(--line); border-radius: 16px; }
.device-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,290px),1fr)); gap: 16px; }
.device-card { margin: 0; }
.device-card .approval-code { font-size: 28px; letter-spacing: 4px; color: var(--green); margin-block: 12px; font-variant-numeric: tabular-nums; }
.device-card .eyebrow { color: var(--green); font-size: 10px; }
.device-card label { display: block; margin: 18px 0; }
.device-card button { margin: 4px 8px 4px 0; }
.preference-row { display: flex; align-items: center; gap: 24px; justify-content: space-between; padding-block: 16px; }
.preference-row small { display: block; color: var(--muted); max-width: 550px; margin-top: 8px; line-height: 1.5; }
.preference-row input { accent-color: var(--green); width: 24px; height: 24px; flex-shrink: 0; }
.episode-list { gap: 12px; }
.episode-share-row { align-items: center; }
.episode { display: flex; gap: 20px; align-items: flex-start; padding: 16px; border-radius: 16px; min-width: 0; text-align: left; }
.episode-thumb { width: 180px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 9px; background: var(--line); flex-shrink: 0; }
.episode-kicker { display: block; color: var(--muted); font-size: 11px; letter-spacing: 1px; margin-bottom: 5px; }
.episode-title { font-size: 18px; }
.episode-overview { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.5; margin: 7px 0; }
.episode-action { display: block; color: var(--green); font-size: 13px; margin-top: 9px; }
.season-picker { min-height: 48px; border-radius: 10px; padding: 10px 16px; margin-bottom: 20px; }
.detail-content { padding: clamp(20px,4vw,44px); }
@media(max-width:650px) {
	.brand-logo { width: 150px; height: 50px; }
	.settings-header { padding: 12px 5%; }
	.settings-header .button { font-size: 12px; }
	.settings-shell { margin-top: 26px; }
	.settings-box { padding: 20px; }
	.settings-tabs { flex-wrap: nowrap; overflow-x: auto; }
	.settings-tabs .chip { white-space: nowrap; }
	.episode { padding: 12px; gap: 12px; }
	.episode-thumb { width: 104px; }
	.episode-title { font-size: 15px; }
	.episode-overview { font-size: 12px; }
	.episode-share-row { flex-wrap: wrap; }
	.episode-share-row>.episode { flex-basis: 100%; }
	.episode-share-row>.button { margin-left: auto; padding: 8px 12px; min-height: 36px; }
}
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
.timetable { width: 100%; min-width: 950px; }
.guide-rows { overflow: auto; max-height: 75vh; border: 1px solid var(--line); border-radius: 16px; scrollbar-color: var(--line) var(--bg); }
.timetable-row { display: grid; grid-template-columns: 155px 1fr; border-bottom: 1px solid var(--line); }
.timetable-channel { position: sticky; left: 0; z-index: 3; background: #1a2019; padding: 14px; border: 0; border-right: 1px solid var(--line); text-align: left; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.timetable-channel small { color: var(--green); }
.timetable-header { position: sticky; top: 0; z-index: 5; background: var(--bg); min-height: 42px; font-size: 12px; }
.timetable-times { display: grid; grid-template-columns: repeat(8,1fr); align-items: center; }
.timetable-times span { padding-left: 10px; color: var(--muted); }
.timetable-track { position: relative; height: 86px; }
.timetable-programme { position: absolute; top: 3px; bottom: 3px; background: var(--panel); border: 1px solid var(--bg); border-radius: 7px; padding: 12px; text-align: left; overflow: hidden; }
.timetable-programme strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; }
.timetable-programme small { display: block; color: var(--muted); white-space: nowrap; margin-top: 5px; font-size: 11px; }
.timetable-programme.on-now { background: #283622; }
.timetable-programme:hover { border-color: var(--green); }
.timetable-now { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--green); z-index: 2; opacity: .6; pointer-events: none; }
.timetable-empty { background: none; border: 0; margin: 24px; color: var(--muted); }
.browser-preference { display: flex; gap: 12px; align-items: center; margin: 25px 5% 40px; color: var(--muted); font-size: 14px; }
.browser-preference input { accent-color: var(--green); width: 20px; height: 20px; }
@media(max-width:650px) { .timetable-row { grid-template-columns: 110px 1fr; } .timetable-channel { padding: 10px; font-size: 12px; } .guide-toolbar { flex-wrap: wrap; gap: 8px; } }

.brand-logo { mix-blend-mode: lighten; }

.up-next:not([hidden]) { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:16px; background:var(--panel,#182018); border-radius:16px; }
.up-next strong { flex-basis:100%; }
.series-continue { white-space:normal; text-align:left; margin:12px 0; }

.health-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin: 22px 0 30px; }
.health-card, .health-disk { min-width: 0; background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
.health-label, .health-card small, .health-disk small { display: block; color: var(--muted); font-size: 12px; line-height: 1.5; }
.health-value { display: block; font-size: clamp(24px,3vw,32px); margin: 12px 0; font-variant-numeric: tabular-nums; letter-spacing: -1px; }
.server-health progress { display: block; appearance: none; width: 100%; height: 7px; margin-top: 16px; border: 0; border-radius: 8px; overflow: hidden; background: var(--line); }
.server-health progress::-webkit-progress-bar { background: var(--line); }
.server-health progress::-webkit-progress-value { background: var(--green); }
.server-health progress::-moz-progress-bar { background: var(--green); }
.health-disks { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.health-disk h4 { margin: 0 0 12px; font-size: 15px; }
.health-disk-free { display: block; font-size: 23px; }
.health-disk small { margin-top: 12px; }
.server-health .health-warning { color: #f1c777; }
.health-more { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 20px; }
.health-more dl { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; font-size: 13px; }
.health-more dt { color: var(--muted); }
.health-more dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
@media(max-width:900px) { .health-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:500px) { .health-disks { grid-template-columns: 1fr; } .health-card { padding: 13px; } .health-value { font-size: 23px; } .server-health .settings-heading { align-items: flex-start; flex-wrap: wrap; } }

.episode-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.episode-actions .button { white-space: nowrap; min-height: 44px; }
.episode-download-panel .button { margin: 8px 8px 0 0; }
@media(max-width:650px) {
	.episode-share-row > .episode, .episode-share-row > .episode-actions { grid-column: 1 / -1; }
	.episode-actions { padding: 0 8px 8px; }
}

.taste-controls { display:flex; gap:10px; margin:16px 0; flex-wrap:wrap; }
.taste-controls button { display:inline-flex; align-items:center; gap:8px; }
.taste-controls [aria-pressed="true"] { color:var(--green); background:#293923; }

.download-qualities { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:16px 0; }
.download-quality { display:flex; flex-direction:column; gap:7px; padding:16px 12px; border:1px solid var(--line); border-radius:14px; background:var(--panel); text-align:left; }
.download-quality span { font-size:16px; } .download-quality small,.download-note { color:var(--muted); line-height:1.5; }
.download-quality.active { border-color:var(--green); box-shadow:inset 0 0 0 1px var(--green); }
.download-quality.active strong { color:var(--green); }
@media(max-width:700px) {
	.download-qualities { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.calendar-days { display:flex; gap:12px; overflow-x:auto; align-items:flex-start; padding:2px 0 10px; scroll-snap-type:x proximity; }
	.calendar-day { flex:0 0 230px; display:block; background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:15px; scroll-snap-align:start; }
	.calendar-date { display:flex; gap:8px; align-items:baseline; margin-bottom:10px; }
	.calendar-day-items { display:flex; flex-direction:column; align-items:stretch; gap:8px; }
	.calendar-item { display:flex; flex-direction:column; align-items:flex-start; padding:0; gap:2px; }
	.calendar-item strong { font-size:13px; } .calendar-date strong { font-size:13px; }
}
/* Always-on channels are a browse-and-play collection, separate from the EPG. */
.channel-groups { display:flex; gap:10px; overflow-x:auto; padding:8px 2px 20px; scrollbar-width:thin; }
.channel-groups .chip { flex:0 0 auto; white-space:nowrap; }
.guide-warning { color:#e7c47d !important; font-size:11px; line-height:1.3; }
.source-note { display:block; color:#b6c5ad; font-size:12px; line-height:1.5; margin-top:6px; }
.recordings-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:20px 0; color:var(--muted); }
.recordings-list { display:grid; gap:18px; }
.recording-card { display:grid; grid-template-columns:140px minmax(0,1fr) auto; align-items:center; gap:24px; border:1px solid var(--line); border-radius:16px; padding:22px; background:#181e17; }
.recording-art { width:140px; height:92px; object-fit:contain; background:#242c22; border-radius:10px; padding:12px; }
.recording-body h3 { font-size:21px; margin:8px 0; }
.recording-description { color:var(--muted); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.recording-actions { display:flex; gap:10px; flex-wrap:wrap; }
.recording-state { display:inline-block; font-size:12px; font-weight:600; color:var(--green); }
.state-recording,.recording-dot { color:#ffaca8; }
.state-failed { color:#ffd292; }
.record-button { border:1px solid #e4989266; background:#452725; color:#ffe4e1; }
.recording-dot { display:block; font-size:10px; margin-top:3px; }
#recordingFilters { flex-wrap:wrap; }
@media(max-width:700px){
	.recordings-toolbar { align-items:flex-start; }
	.recordings-toolbar p { margin:0; line-height:1.5; }
	.recording-card { grid-template-columns:64px minmax(0,1fr); padding:16px; gap:14px; }
	.recording-art { width:64px; height:64px; padding:7px; }
	.recording-body h3 { font-size:18px; }
	.recording-actions { grid-column:1/-1; }
}
.collection-toolbar .tools { flex-wrap:wrap; }
.guide-details .guide-warning { font-size:14px; padding:12px; background:#30291a; border-radius:10px; }
.nonstop-grid { grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:24px; }
.nonstop-tile { position:relative; min-width:0; align-self:start; }
.nonstop-tile .nonstop-card { width:100%; }
.nonstop-favourite { position:absolute; top:12px; right:12px; width:44px; height:44px; display:grid; place-items:center; padding:0; border:1px solid #ffffff66; border-radius:50%; background:#101310e8; color:#fff; font-size:28px; line-height:1; box-shadow:0 2px 12px #0006; }
.nonstop-favourite.saved { color:var(--green); border-color:var(--green); }
.nonstop-favourite:hover, .nonstop-favourite:focus-visible { background:var(--green); color:var(--bg); outline:3px solid #fff; outline-offset:2px; }
.nonstop-card { display:flex; flex-direction:column; text-align:left; gap:9px; background:transparent; border:0; color:var(--text,#eef4eb); padding:4px; border-radius:18px; cursor:pointer; }
.nonstop-card strong { font-size:1rem; line-height:1.4; }
.nonstop-card small { color:#aeb6aa; line-height:1.4; }
.nonstop-art { position:relative; aspect-ratio:2/3; width:100%; border-radius:14px; overflow:hidden; background:linear-gradient(140deg,#28352b,#141b16); }
.nonstop-art img { width:100%; height:100%; object-fit:cover; }
.nonstop-play { position:absolute; right:10px; bottom:10px; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#cbf38b; color:#142010; }
.nonstop-card:hover .nonstop-art { box-shadow:0 0 0 2px #cbf38b; }
.nonstop-card:focus-visible { outline:3px solid #cbf38b; outline-offset:4px; }
@media(max-width:600px) { .nonstop-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; } }
@media(max-width:600px) {
	.collection-toolbar .tools .search { flex:1 1 100%; width:100%; }
	.collection-toolbar .tools > label:not(.search) { flex:1 1 calc(50% - 4px); min-width:0; }
	.collection-toolbar .tools select { width:100%; max-width:none; }
	#grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 12px; }
}

.library-category { display:flex; align-items:center; gap:12px; color:var(--muted); margin:16px 0; }
.library-category select { max-width:75%; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--text); }

/* Episode actions belong to the episode, not a competing column of large buttons. */
.episode-share-row { display:flex; flex-flow:column nowrap; align-items:stretch; gap:0; min-width:0; background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.episode-share-row > .episode { flex:0 0 auto; width:100%; border:0; border-radius:0; background:transparent; margin:0; }
.episode-share-row .episode-text { min-width:0; flex:1; }
.episode-share-row .episode-title { display:block; overflow-wrap:anywhere; }
.episode-actions { display:flex; align-items:center; justify-content:flex-end; gap:4px; padding:4px 12px 8px; border-top:1px solid var(--line); }
.episode-source { margin-right:auto; padding:8px 4px; color:var(--muted); font-size:12px; }
.compact-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:9px 12px; background:transparent; border:0; border-radius:9px; color:var(--text); font-size:13px; white-space:nowrap; }
.compact-action svg { width:18px; height:18px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.compact-action:hover { background:var(--line); color:var(--green); }
.compact-action:focus-visible,.episode-share-row>.episode:focus-visible { outline:2px solid var(--green); outline-offset:-3px; }
.episode-share-row > .share-panel { margin:0 12px 12px; }
.nonstop-tile > .compact-action { margin-top:4px; color:var(--muted); }
@media(max-width:430px) {
	.episode-share-row .episode-thumb { width:88px; }
	.episode-actions { padding:4px 8px 8px; flex-wrap:wrap; }
	.episode-source { flex:1 1 100%; padding-bottom:0; }
	.episode-actions .compact-action { flex:1; }
}
.detail-content > .button { margin:4px 8px 8px 0; }
.series-sources { color:var(--muted); font-size:13px; line-height:1.6; margin:12px 0; }

/* Compact opinion controls with equal touch targets and a visible selected state. */
.taste-controls { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.taste-controls .button { min-height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:12px; background:var(--panel); font-size:13px; }
.taste-controls .button[aria-pressed="true"] { color:var(--bg); background:var(--green); border-color:var(--green); }
.taste-controls .button:focus-visible { outline:2px solid var(--green); outline-offset:3px; }
.episode-release { display:block; color:var(--muted); font-size:12px; line-height:1.5; margin:4px 0; }
.episode-release:empty { display:none; }

/* Compact administration and explicit favourites linking. */
.admin-overview { display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px; }
.admin-overview .settings-box { margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:12px; }
.admin-overview h3 { margin:0 0 auto;font-size:1.25rem; }
.device-card { display:flex;flex-direction:column;align-items:flex-start;gap:10px; }
.device-card h3,.device-card p { margin:0; }
.device-card .button { margin-top:auto; }
.device-dialog { width:min(600px,calc(100vw - 32px));max-height:90dvh;overflow:auto;border:1px solid #3c473c;border-radius:18px;background:#171d18;color:#eef4ed;padding:24px; }
.device-dialog::backdrop { background:#000b; }
.device-dialog input,.device-dialog select { width:100%;min-height:44px;box-sizing:border-box; }
.device-dialog .settings-heading { align-items:center;gap:16px; }
.device-dialog .settings-heading h2 { margin:0; }
.linked-collections { border:1px solid #394439;border-radius:12px;padding:14px;margin:18px 0;max-height:230px;overflow:auto; }
.collection-choice { display:flex;align-items:center;gap:12px;padding:8px 0; }
.collection-choice input { width:20px;min-height:20px; }
.device-danger { border-top:1px solid #394439;margin-top:24px;padding-top:18px; }
.connection-edit { margin:18px 0; }

/* A compact route badge shares the logo row without becoming another navigation item. */
.brand-connection { display: inline-flex; align-items: center; gap: 6px; position: relative; flex-shrink: 0; }
.connection-badge { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid transparent; border-radius: 50%; color: var(--muted); background: transparent; }
.connection-badge svg { width: 19px; height: 19px; }
.connection-badge[data-route="local"] { color: var(--green); }
.connection-badge[data-route="relay"] { color: #9dbfe5; }
.connection-badge:hover, .connection-badge[aria-expanded="true"] { background: var(--panel); border-color: var(--line); }
.connection-note { position: absolute; top: calc(100% + 8px); left: 0; z-index: 100; width: min(320px, calc(100vw - 40px)); padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); color: var(--text); box-shadow: 0 12px 32px #0008; font-size: 13px; line-height: 1.5; }
.auth-card .brand-connection { margin-bottom: 38px; }
.auth-card .brand-connection .brand { margin-bottom: 0; }

@media (max-width: 420px) {
	.topbar { gap: 8px; }
	.topbar .brand-logo { width: 132px; }
}

.season-selector { margin:24px 0 18px; padding:18px; background:var(--panel,#1b2119); border-radius:16px; }
.season-selector h3 { margin:0 0 14px; font-size:1.3rem; }
.season-tabs { display:flex; gap:12px; overflow-x:auto; padding:4px 4px 12px; }
.season-tab { flex:0 0 auto; min-width:125px; min-height:64px; padding:12px 20px; border:2px solid #606b55; border-radius:12px; background:#252d22; color:#f6f7ef; font:inherit; font-weight:700; cursor:pointer; }
.season-tab small { display:block; margin-top:4px; font-size:.8em; font-weight:400; }
.season-tab[aria-pressed=true] { background:#c4ed80; color:#101310; border-color:#c4ed80; }
.season-tab:focus-visible { outline:3px solid #fff; outline-offset:3px; }
@media (max-width: 600px) {
	.season-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:240px; overflow-y:auto; overflow-x:hidden; padding:4px; }
	.season-tab { min-width:0; padding:12px 8px; }
}

.skip-intro { margin: 12px; }
.up-next { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 20px; border-radius: 18px; background: #1b2219; }
.up-next[hidden], .skip-intro[hidden] { display:none; }
.up-next strong { flex: 1 1 240px; }

/* End-of-episode destination: context first, artwork-led suggestions second. */
.up-next.episode-ended:not([hidden]) { display:grid; grid-template-columns:minmax(230px,1fr) minmax(0,1.5fr); align-items:start; gap:32px; padding:28px; }
.episode-end-summary h2 { margin:10px 0; font-size:28px; }
.episode-end-summary h3 { margin:24px 0 8px; }
.episode-end-summary p,.episode-end-more p { margin:6px 0 16px; }
.episode-end-summary .button { margin:4px 8px 4px 0; }
.episode-end-cards { display:flex; gap:12px; overflow-x:auto; padding:5px; }
.episode-end-card { flex:0 0 140px; display:flex; flex-direction:column; align-items:stretch; gap:8px; padding:9px; border:2px solid transparent; border-radius:12px; background:#242d22; color:var(--text,#f4f5ee); text-align:left; cursor:pointer; }
.episode-end-card img { width:100%; aspect-ratio:2/3; object-fit:cover; border-radius:7px; background:#30392c; }
.episode-end-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.6em; font-weight:700; line-height:1.3; }
.episode-end-card small { color:var(--accent,#caf084); }
.episode-end-card:is(:focus-visible,:hover) { border-color:#f5f7ed; outline:2px solid #f5f7ed; outline-offset:2px; }
@media(max-width:700px) { .up-next.episode-ended:not([hidden]) { grid-template-columns:minmax(0,1fr); padding:20px; gap:20px; } .episode-end-card { flex-basis:124px; } }

.catchup-list{display:grid;gap:12px}.catchup-list details{padding:16px;border-radius:12px;background:var(--panel,#192019)}.catchup-list summary{cursor:pointer;padding:10px}.catchup-list details button{display:block;width:100%;text-align:left;margin-top:8px}.upload-period{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:12px 0}.upload-period label{display:grid;gap:6px;flex:1;min-width:100px}.upload-period input{width:100%;padding:12px}.account-controls{margin-top:16px}.account-controls summary{cursor:pointer;padding:10px 0}.account-controls form{display:grid;gap:14px}.account-controls label{display:grid;gap:8px}.account-controls input[type=number]{padding:12px}

.next-preview{display:flex;gap:16px;align-items:center;flex:1 1 280px;min-width:0}.next-preview img{width:128px;aspect-ratio:16/9;object-fit:cover;border-radius:10px}.next-preview>div{display:grid;gap:6px;min-width:0}.next-preview strong{font-size:19px;flex:auto}.next-actions{display:flex;gap:12px}.up-next>progress{flex-basis:100%;width:100%;height:4px;accent-color:var(--green,#c6ed83)}@media(max-width:500px){.next-actions{width:100%}.next-actions button{flex:1}.next-preview img{width:104px}}

/* Tellybox ident: gentle breathing, with a still alternative for reduced motion. */
.brand-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;pointer-events:none}.brand-loading img{width:88px;height:88px;filter:drop-shadow(0 0 22px #c7ed8928);animation:tellybox-breathe 1.5s ease-in-out infinite alternate}.loading-dots{color:var(--accent,#c7ed89);letter-spacing:9px;font-size:15px;padding-left:9px}.video-stage{position:relative;background:#000}.video-stage video{display:block;width:100%}.player-loading{position:absolute;inset:0;min-height:0}.player-loading[hidden]{display:none}#playerStatus:empty{display:none}@keyframes tellybox-breathe{from{opacity:.65;filter:drop-shadow(0 0 10px #c7ed8918)}to{opacity:1;filter:drop-shadow(0 0 28px #c7ed8938)}}@media(prefers-reduced-motion:reduce){.brand-loading img{animation:none}}
.catchup-content{padding:28px}.catchup-content h2{margin-bottom:24px}.catchup-browser{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;height:min(68vh,640px)}.catchup-channels{display:flex;flex-direction:column;gap:8px;overflow:auto;padding:3px 8px 3px 3px}.catchup-main{display:flex;flex-direction:column;min-width:0;min-height:0}.catchup-main h3{margin:4px 0 16px}.catchup-dates{display:flex;gap:8px;overflow:auto;flex-shrink:0;padding:3px 3px 12px}.catchup-chip{border:1px solid transparent;border-radius:12px;padding:14px 16px;min-height:48px;background:#252c24;color:var(--text,#f3f3e9);font:inherit;cursor:pointer;text-align:left;flex-shrink:0}.catchup-dates .catchup-chip{white-space:nowrap}.catchup-chip[aria-pressed=true]{background:#c7ed89;color:#101310}.catchup-programmes{overflow:auto;display:flex;flex-direction:column;gap:10px;padding:3px}.catchup-programme{display:flex;align-items:center;gap:16px;padding:18px 16px;background:#1a1e19;color:#f3f3e9;border:1px solid #30372e;border-radius:14px;text-align:left;font:inherit;cursor:pointer;flex-shrink:0}.catchup-time{color:#c7ed89;flex:0 0 48px;font-variant-numeric:tabular-nums}.catchup-copy{display:grid;gap:6px;flex:1;min-width:0}.catchup-copy strong{font-size:17px}.catchup-copy small,.catchup-overview{color:#a4ada0;font-size:13px}.catchup-overview{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.catchup-play{border-radius:50%;background:#2c3824;color:#c7ed89;display:grid;place-items:center;flex:0 0 38px;height:38px;font-size:14px}.catchup-chip:focus-visible,.catchup-programme:focus-visible{outline:3px solid #fff;outline-offset:1px}.catchup-programme:hover{border-color:#c7ed89}@media(max-width:650px){.catchup-content{padding:18px}.catchup-browser{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:14px;height:70vh}.catchup-channels{flex-direction:row;padding-bottom:8px}.catchup-channels .catchup-chip{white-space:nowrap}.catchup-programme{gap:10px;padding:14px 12px}.catchup-copy strong{font-size:16px}}