/* Kinora 1.2 — one material system, two intentionally designed palettes. */
:root {
  color-scheme:dark;
  --bg:#202734; --surface:#2b3544; --surface-light:#37465b;
  --text:#f5f7fb; --muted:#c0cbdc; --accent:#5cb8ff; --accent-dark:#0091ff;
  --apple-blue:#0091ff; --apple-green:#30d158; --apple-yellow:#ffd600; --apple-indigo:#6d7cff;
  --danger:#ff6165; --star:#ffd600; --line:rgba(215,228,246,.13);
  --glass:rgba(99,121,151,.30); --glass-solid:#354256; --glass-edge:rgba(235,246,255,.35); --dialog-glass:rgba(47,61,82,.78);
  --shine:rgba(255,255,255,.42); --hover:rgba(231,243,255,.13); --well:rgba(11,22,39,.20);
  --selected:rgba(229,243,255,.18); --selected-edge:rgba(230,245,255,.38);
  --shadow:0 12px 38px rgba(0,5,16,.18); --ambient:rgba(86,123,168,.14);
  --focus:#5cb8ff; --primary:#0091ff; --primary-text:#061a2e; --primary-hover:#5cb8ff;
  --sheet:#273243; --backdrop:rgba(9,18,32,.48); --body-copy:#d8e1ee;
  font-family:"Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
}
:root[data-theme="light"] {
  color-scheme:light;
  --bg:#f8faff; --surface:#fff; --surface-light:#eaf0f8;
  --text:#172438; --muted:#435771; --accent:#1e6ef4; --accent-dark:#0088ff;
  --apple-blue:#0088ff; --apple-green:#008932; --apple-yellow:#ffcc00; --apple-indigo:#6155f5;
  --danger:#e9152d; --star:#a16a00; --line:rgba(45,66,96,.16);
  --glass:rgba(255,255,255,.55); --glass-solid:#f5f9ff; --glass-edge:rgba(255,255,255,.95); --dialog-glass:rgba(249,252,255,.77);
  --shine:rgba(255,255,255,1); --hover:rgba(0,136,255,.07); --well:rgba(84,124,182,.055);
  --selected:rgba(255,255,255,.77); --selected-edge:rgba(0,136,255,.20);
  --shadow:0 8px 30px rgba(55,76,108,.08); --ambient:rgba(132,168,207,.13);
  --focus:#1e6ef4; --primary:#1e6ef4; --primary-text:#fff; --primary-hover:#155bda;
  --sheet:#fbfdff; --backdrop:rgba(50,73,108,.21); --body-copy:#2c435f;
}
body {background:radial-gradient(ellipse 85% 60% at 0 0,var(--ambient),transparent 75%),radial-gradient(ellipse 65% 45% at 100% 40%,color-mix(in srgb,var(--apple-indigo) 7%,transparent),transparent 80%),var(--bg);background-attachment:fixed;color:var(--text)}
button,input,select {font-family:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {outline:2px solid var(--focus);outline-offset:4px}
.glass,.topbar {background:var(--glass-solid);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--shine),var(--shadow)}
@supports(backdrop-filter:blur(12px)) {
  .glass,.topbar {background:linear-gradient(120deg,var(--hover),transparent 60%),var(--glass);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%)}
}
/* Navigation is the floating glass plane; content stays visually grounded. */
.topbar {position:sticky;top:calc(16px + env(safe-area-inset-top));z-index:10;width:calc(100% - 64px);max-width:1392px;min-height:76px;height:auto;margin:20px auto 0;padding:12px 18px;gap:12px;border-radius:25px;isolation:isolate}
.brand {font-size:29px;font-weight:800;letter-spacing:-1.3px;gap:10px;flex-shrink:0}
.brand-mark,.brand-dot {color:var(--accent)}
.topbar .section-nav {margin-left:auto;flex-shrink:0;gap:3px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.section-button {min-height:46px;border-radius:999px;padding:0 13px;font-size:14px;font-weight:700;gap:8px;border:1px solid transparent;white-space:nowrap;color:var(--muted)}
.section-button.active {color:var(--accent);background:var(--selected);border-color:var(--selected-edge);box-shadow:inset 0 1px 0 var(--shine),0 2px 7px #00000009;color:var(--accent)}
.section-button:hover {background-color:var(--hover)}
.section-button .icon {width:18px;height:18px}
.nav-count {font-size:11px;border-radius:6px;min-width:20px;padding:2px 5px;background:var(--well);color:var(--muted)}
.search-trigger {margin-left:0;width:258px;min-width:210px;min-height:46px;padding:0 15px;border-radius:999px;font-size:14px;font-weight:550;border:1px solid var(--line);background:var(--well);box-shadow:none;color:var(--muted);white-space:nowrap}
.search-trigger:hover {background:var(--hover);border-color:var(--selected-edge)}
kbd {font-family:inherit;font-size:10px;border-radius:5px;padding:3px 5px;color:var(--muted)}
.icon-button {color:var(--muted)}
.topbar>.icon-button {border:1px solid var(--line);background:transparent;flex-shrink:0;width:44px;height:44px;margin:0}
.icon-button:hover {background:var(--hover);color:var(--text)}
.theme-toggle .theme-sun {display:none}
:root[data-theme="dark"] .theme-toggle .theme-sun {display:block}
:root[data-theme="dark"] .theme-toggle .theme-moon {display:none}
.library-main {max-width:1456px;padding:45px 48px 0}
.library-heading {margin:0 0 28px;align-items:center;gap:20px}
.library-heading h1 {font-size:44px;line-height:1.14;font-weight:800;letter-spacing:-1.6px;margin-bottom:8px}
.heading-dot {color:var(--accent)}
.library-heading p {font-size:15px;color:var(--muted);line-height:1.6}
.eyebrow {font-size:10px;font-weight:750;letter-spacing:2px;color:var(--muted)}
.button {font-size:15px;font-weight:750;min-height:48px;border-radius:14px;padding:0 21px;gap:10px}
.button .icon {width:19px;height:19px}
.primary {background:var(--primary);color:var(--primary-text);border:1px solid transparent;box-shadow:inset 0 1px 0 #ffffff30,0 4px 12px #0000000a}
.primary:hover {background:var(--primary-hover)}
.subtle {border:1px solid var(--line);background:var(--well);box-shadow:none;color:var(--text)}
.subtle:hover {background:var(--hover)}
.danger {font-size:15px;color:var(--danger);border-color:color-mix(in srgb,var(--danger) 28%,transparent);background:color-mix(in srgb,var(--danger) 8%,transparent)}
.library-toolbar {margin-bottom:25px;border-color:var(--line);padding-bottom:0;align-items:center;gap:15px}
.type-tabs {gap:26px}
.type-tab {font-size:15px;font-weight:750;gap:8px;min-height:49px;padding-bottom:14px;color:var(--muted)}
.type-tab.active {color:var(--text)}
.type-tab.active:after {height:3px;background:var(--accent);box-shadow:none}
.type-tab .icon {width:19px;height:19px}
.type-tab>span {font-size:11px;background:var(--well);color:var(--muted);padding:2px 5px;border-radius:5px}
.sort-label {align-self:center;border:0;border-radius:12px;background:transparent;box-shadow:none;padding:0 0 8px;margin:0;min-width:0}
.sort-label select {max-width:220px;min-height:44px;font-size:13px;color:var(--muted);background:transparent;padding:0 0 0 8px}
.sort-label select option {background:var(--surface);color:var(--text)}
/* Edge-to-edge artwork, one corner radius, and a readable cinematic caption. */
.poster-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.poster-card {position:relative;padding:0;border-radius:23px;border:1px solid #ffffff14;background:#17202b;box-shadow:0 8px 24px #06112120;overflow:hidden;isolation:isolate;transition:transform .22s ease,box-shadow .22s ease}
.poster-wrap {aspect-ratio:2/3;border-radius:inherit;border:0;box-shadow:none;background:linear-gradient(145deg,#3a4b60,#182332);isolation:isolate}
.poster-wrap>img {transition:transform .55s ease;will-change:auto}
.poster-wrap:before {content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;border:1px solid #ffffff22;box-shadow:inset 0 1px 0 #ffffff30;pointer-events:none}
.poster-wrap:after {content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,transparent 36%,rgba(8,14,25,.12) 48%,rgba(8,14,25,.82) 79%,#080e19 100%);pointer-events:none}
.poster-caption {position:absolute;left:0;right:0;bottom:0;z-index:3;display:block;padding:18px 20px 19px;color:#fff;pointer-events:none}
.poster-caption:before {content:"";position:absolute;inset:-100% -140%;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 34%,#ffffff16 47%,transparent 58%);transform:translateX(-110%);transition:transform .65s ease}
.poster-name {margin:0 0 9px;overflow:visible;white-space:normal;font-size:20px;font-weight:800;line-height:1.3;letter-spacing:-.25px;color:#f5f7fb}
.poster-year {font-size:13px;color:#d2dce9;line-height:1.5;margin:0}
.poster-next {font-size:12px;line-height:1.5;color:#dce8f8;margin:6px 0 0}
.poster-rating {top:13px;right:13px;bottom:auto;left:auto;z-index:3;border:1px solid #ffffff40;border-radius:999px;padding:6px 9px;color:#ffd600;background:rgba(12,20,32,.70);backdrop-filter:none;-webkit-backdrop-filter:none;font-size:12px;letter-spacing:1px;box-shadow:inset 0 1px 0 #ffffff18}
.poster-fallback {font-family:inherit;font-size:20px;color:#d2ddec;padding:24px 18px 120px}
.poster-fallback .icon {width:37px;height:37px}
.title-wordmark {position:relative;display:flex;align-items:center;min-height:56px;line-height:1.3}
.title-text {display:block}
.title-logo {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:left center;opacity:0;filter:drop-shadow(0 2px 7px #0005);transition:opacity .18s}
.logo-ready>.title-logo {opacity:1}
.title-wordmark.logo-dark {background:#edf2f8;border-radius:10px;padding:7px 10px}
.logo-dark>.title-logo {inset:7px 10px;width:calc(100% - 20px);height:calc(100% - 14px);filter:none}
@media(hover:hover) and (pointer:fine) {
  .poster-card:hover {transform:translateY(-5px);box-shadow:0 16px 34px #07102135}
  .poster-card:hover .poster-wrap {transform:none;box-shadow:none}
  .poster-card:hover .poster-wrap>img {transform:scale(1.04)}
  .poster-card:hover .poster-caption:before {transform:translateX(110%)}
}
@media(hover:none) {.poster-card:hover .poster-wrap {transform:none;box-shadow:none}}
/* Search and sheets share a material, spacing scale, and control treatment. */
dialog {border-radius:27px;border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--shine),0 24px 80px #06102035;color:var(--text)}
dialog::backdrop {background:var(--backdrop)}
.dialog-top h2 {font-size:26px;font-weight:800;letter-spacing:-.6px}
.dialog-top>.icon-button {background:var(--well)}
.search-dialog {width:800px;padding:27px;max-height:calc(100dvh - 48px)}
.search-field {min-height:58px;margin-top:22px;padding:0 17px;border-radius:16px;border:1px solid var(--line);background:var(--well);box-shadow:none;gap:12px}
.search-field:focus-within,.password-field:focus-within {border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 12%,transparent)}
.search-field input {font-size:17px;height:56px;color:var(--text)}
.search-field input::placeholder {color:var(--muted);opacity:1}
.search-field input:focus-visible,.password-field input:focus-visible {outline:none;box-shadow:none}
.search-scope {font-size:12px;font-weight:650;color:var(--muted);margin:16px 2px}
.search-results {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:10px;max-height:56dvh;min-height:170px;padding:1px 4px 4px 1px}
.search-hint {grid-column:1/-1;font-size:15px;line-height:1.8;padding:46px 20px;color:var(--muted)}
.search-hint .icon {width:33px;height:33px}
.result {padding:12px;gap:13px;align-items:center;border:1px solid var(--line);border-radius:16px;background:var(--well);box-shadow:none}
.result:hover {background:var(--hover);border-color:var(--selected-edge)}
.result-poster {width:61px;height:92px;border-radius:9px;border:1px solid var(--line);box-shadow:0 3px 10px #00000014}
.result-info h3 {font-size:17px;font-weight:800;line-height:1.35;margin:6px 0;letter-spacing:-.2px;color:var(--text)}
.result-info p {font-size:12px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}
.result-kind {display:inline-block;font-size:9px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:var(--accent);background:var(--hover);border:1px solid var(--line);border-radius:5px;padding:2px 5px}
.result-status {font-size:11px;line-height:1.6;color:var(--accent)}
.result>.icon {width:15px;color:var(--muted);flex-shrink:0}
#search-more {margin-top:16px}
.search-spinner {border-color:var(--line);border-top-color:var(--accent)}
.detail-dialog {width:1050px;border-radius:28px;background:var(--sheet);backdrop-filter:none;-webkit-backdrop-filter:none}
/* Actual backdrop artwork, not a washed-out decoration behind the text. */
.detail-cover {position:relative;height:280px;overflow:hidden;background:var(--surface-light)}
.detail-cover img {display:block;width:100%;height:100%;object-fit:cover;object-position:center 38%}
.detail-cover:after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#07102020,transparent 35%,transparent 75%,var(--sheet))}
.detail-cover+.detail-body {padding-top:25px}
.detail-cover+.detail-body .detail-poster {margin-top:-94px;position:relative;z-index:1}
.detail-navigation {position:sticky;top:16px;z-index:5;left:auto;right:auto;margin:16px 18px -60px 22px}
.detail-back {background:var(--glass-solid);border:1px solid var(--line);color:var(--text);font-size:13px;border-radius:999px;min-height:44px;padding:0 15px;box-shadow:var(--shadow)}
.detail-navigation>.icon-button {border:1px solid var(--line);color:var(--text)}
.detail-body {padding:85px 44px 38px}
.detail-hero {grid-template-columns:210px 1fr;gap:33px;margin-bottom:34px}
.detail-poster {width:210px;border-radius:17px;border:1px solid var(--line);box-shadow:0 15px 32px #06112128}
.detail-title {font-size:42px;font-weight:800;line-height:1.12;letter-spacing:-1.2px;margin:14px 0 12px}
.detail-title .title-wordmark {min-height:86px}
.detail-title .title-wordmark.logo-ready {height:86px;max-width:430px}
.detail-title .title-logo {max-height:86px}
:root[data-theme="light"] .detail-title .logo-ready:not(.logo-dark) {background:#202c3d;border-radius:13px}
:root[data-theme="light"] .detail-title .logo-ready:not(.logo-dark) .title-logo {inset:12px 16px;width:calc(100% - 32px);height:calc(100% - 24px);filter:none}
.detail-title .logo-dark {background:transparent;padding:0}
:root[data-theme="dark"] .detail-title .logo-dark {background:#edf2f8}
.detail-original {font-size:14px;line-height:1.6;margin-bottom:14px;color:var(--muted)}
.detail-kicker {font-size:10px;letter-spacing:1.7px;font-weight:800;color:var(--accent)}
.detail-kicker .icon {width:16px;height:16px}
.detail-facts {font-size:14px;line-height:1.7;gap:9px;color:var(--body-copy)}
.detail-facts>span+span:before {color:var(--muted)}
.detail-genres {font-size:14px;line-height:1.7;margin:10px 0 16px;color:var(--muted)}
.tmdb-rating {font-size:13px;gap:9px;color:var(--muted)}
.tmdb-rating strong {font-size:20px;color:var(--accent)}
.detail-actions {gap:10px;margin-top:22px}
.detail-actions>.button {font-size:14px;min-height:48px;padding:0 16px;border-radius:14px}
.detail-actions .icon {width:18px;height:18px}
.detail-personal {font-size:14px;margin-top:15px;gap:12px}
.detail-personal button {font-size:16px;min-height:44px;letter-spacing:1px;color:var(--star)}
.detail-personal .delete-action {color:var(--muted)}
.detail-section {margin-top:32px;padding-top:27px;border-color:var(--line)}
.detail-section h3 {font-size:22px;font-weight:800;letter-spacing:-.4px;margin-bottom:17px}
.detail-overview {font-size:17px;line-height:1.85;max-width:850px;color:var(--body-copy)}
.credit-lines {margin-top:23px;gap:32px}
.credit-lines div {font-size:14px;line-height:1.7;color:var(--body-copy)}
.credit-lines span {font-size:10px;letter-spacing:1.2px;font-weight:750;margin-bottom:6px;color:var(--muted)}
.cast-list {grid-template-columns:repeat(6,minmax(0,1fr));gap:21px 17px}
.cast-photo {border-radius:13px;border:1px solid var(--line);background:var(--surface-light);box-shadow:none}
.cast-person h4 {font-size:14px;font-weight:750;line-height:1.5;margin-top:10px}
.cast-person p {font-size:12px;line-height:1.5;color:var(--muted)}
.season-header .muted {font-size:14px}
.season-tabs {gap:8px;margin-top:20px}
.season-tab {min-height:44px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:700;background:var(--well);border-color:var(--line);color:var(--muted)}
.season-tab.active {background:var(--selected);border-color:var(--focus);color:var(--text);box-shadow:none}
.schedule-note {font-size:13px;line-height:1.8;color:var(--muted)}
.season-meta {font-size:14px;margin-bottom:15px;color:var(--muted)}
.episode {grid-template-columns:38px 1fr;gap:14px;padding:20px 0;border-color:var(--line)}
.episode-number {font-size:13px;color:var(--muted);padding-top:4px}
.episode h4 {font-size:17px;font-weight:750;line-height:1.6}
.episode-date {font-size:13px;color:var(--muted)}
.episode-date.future {color:var(--accent);font-weight:750}
.episode p {font-size:15px;line-height:1.8;color:var(--body-copy);margin-top:10px}
.stale-note {font-size:14px;color:var(--accent);border-color:var(--line);background:var(--well)}
.source-note {font-size:12px;line-height:1.8;color:var(--muted)}
.small-dialog {width:440px;padding:34px}
.small-dialog h2 {font-size:28px;font-weight:800;letter-spacing:-.6px}
.small-dialog>.muted {font-size:14px}
.dialog-emblem {width:57px;height:57px;border-radius:18px;border-color:var(--line);color:var(--accent);background:var(--well);box-shadow:none}
.small-dialog>.eyebrow {font-size:10px}
.rating-stars {gap:10px;margin-top:26px}
.star-button {min-width:46px;min-height:50px;color:var(--muted)}
.star-button .icon {width:33px;height:33px}
.star-button.on {color:var(--star)}
.star-button.on .icon {fill:var(--star)}
.rating-label,.text-button {font-size:14px}
.rating-label {min-height:22px}
.settings-dialog {width:530px;padding:29px}
.settings-dialog .dialog-top h2 {font-size:26px}
.settings-section {margin-top:23px;padding-top:22px}
.settings-section h3 {font-size:16px;font-weight:800}
.settings-section p {font-size:14px;line-height:1.8}
.settings-action {font-size:15px;min-height:53px;gap:13px}
.settings-action .icon {width:19px;height:19px}
.appearance-options {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:16px}
.appearance-options button {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:81px;border:1px solid var(--line);border-radius:15px;background:var(--well);color:var(--muted);font-size:13px;font-weight:700}
.appearance-options button .icon {width:22px;height:22px}
.appearance-options button[aria-pressed="true"] {border-color:var(--focus);background:var(--selected);color:var(--text);box-shadow:inset 0 1px 0 var(--shine)}
.appearance-options button:hover {background:var(--hover)}
.settings-section .appearance-caption {font-size:12px;line-height:1.6;margin:13px 0 0;color:var(--muted)}
.tmdb-link {margin:19px 0}
.tmdb-link span {font-size:12px}
.attribution {font-size:12px!important;color:var(--muted)}
.form-error {font-size:14px;color:var(--danger)}
.settings-dialog .small {font-size:13px}
.toast {font-size:14px;padding:15px 22px;border-radius:16px}
.inline-error {font-size:15px}
/* Empty and signed-out views use the same palettes as a populated library. */
.empty-state {min-height:400px;padding:22px 10px 36px}
.empty-art {height:175px;margin-bottom:18px}
.empty-cover {border-radius:14px;border-color:var(--line)}
.cover-back {background:var(--surface-light);box-shadow:var(--shadow)}
.cover-front {background:linear-gradient(140deg,var(--surface-light),var(--surface));box-shadow:inset 0 1px 0 var(--shine),var(--shadow)}
.cover-front>.icon,.empty-spark {color:var(--accent)}
.empty-cover-label {color:var(--muted)}
.empty-orbit {border-color:var(--line)}
.empty-state .eyebrow {font-size:9px;letter-spacing:1.7px}
.empty-state h2 {font-size:29px;font-weight:800;letter-spacing:-.8px}
.empty-state>p:not(.eyebrow) {font-size:15px;line-height:1.8;color:var(--muted);max-width:390px}
.empty-state .button {font-size:14px;padding:0 21px}
.footer {border-color:var(--line);margin-top:37px;font-size:11px;color:var(--muted)}
.footer button {font-size:11px;color:var(--muted)}
.login-screen {max-width:1280px;position:relative}
.login-appearance {position:absolute;right:35px;top:30px}
.login-appearance .icon-button {border:1px solid var(--line);background:var(--glass)}
.login-card {max-width:400px}
.login-card h1 {font-size:44px;font-weight:800;letter-spacing:-1.5px}
.login-card>.muted {font-size:16px;line-height:1.8}
.login-card>.eyebrow {font-size:10px}
.login-card label {font-size:14px;font-weight:700}
.password-field {border-radius:15px;background:var(--well);border-color:var(--line);min-height:55px}
.password-field>input {font-size:16px;height:54px;color:var(--text)}
.login-card .primary {border-radius:15px}
.login-footnote {font-size:12px;color:var(--muted)}
.orbit {border-color:var(--line)}
.orbit-two {border-color:var(--line)}
.orbit-core {color:var(--accent);padding:0;letter-spacing:0;transform:rotate(-10deg)}
.orbit-core .icon {width:155px;height:155px;stroke-width:.65}
.skeleton .poster-wrap {background:var(--surface-light)}
.skeleton-line {background:var(--surface-light)}
/* Wider sheets carry a little more body than small navigation controls. */
dialog.glass {background:linear-gradient(125deg,var(--hover),transparent 55%),var(--dialog-glass);backdrop-filter:blur(32px) saturate(145%);-webkit-backdrop-filter:blur(32px) saturate(145%)}
.section-button.active .icon {color:var(--apple-blue)}
.type-tab.active {color:var(--accent)}
.heading-dot {color:var(--apple-blue)}
.button,.section-button,.icon-button,.search-trigger,.type-tab,.season-tab,.result,.appearance-options button,.settings-action,.text-button {position:relative;isolation:isolate}
.icon-button.corner-close {position:absolute}
.button:before,.section-button:before,.icon-button:before,.search-trigger:before,.type-tab:before,.season-tab:before,.result:before,.appearance-options button:before,.settings-action:before,.text-button:before {content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;opacity:var(--light-on,0);background:radial-gradient(130px circle at var(--light-x,50%) var(--light-y,50%),#ffffff55,transparent 70%);box-shadow:inset 0 1px 0 #ffffff55;transition:opacity .18s ease}
:root[data-theme="light"] .button:before,:root[data-theme="light"] .section-button:before,:root[data-theme="light"] .icon-button:before,:root[data-theme="light"] .search-trigger:before,:root[data-theme="light"] .result:before,:root[data-theme="light"] .appearance-options button:before {background:radial-gradient(120px circle at var(--light-x,50%) var(--light-y,50%),#ffffffdf,transparent 70%)}
.primary:before {background:radial-gradient(140px circle at var(--light-x,50%) var(--light-y,50%),#ffffff4d,transparent 75%)!important}
@media(prefers-reduced-motion:reduce),(hover:none) {button:before {display:none!important}}
@media(min-width:1650px) {.poster-grid {grid-template-columns:repeat(5,minmax(0,1fr))}.library-main {max-width:1580px}.topbar {max-width:1516px}}
@media(max-width:1180px) {
  .topbar {width:calc(100% - 40px);gap:8px;padding:11px 14px}
  .brand {font-size:26px;gap:6px}.brand-mark {width:29px}
  .section-button {font-size:13px;padding:0 10px;gap:6px}
  .search-trigger {width:220px;min-width:190px;font-size:13px;padding:0 13px}
  .search-trigger kbd {display:none}
  .library-main {padding-left:34px;padding-right:34px}.poster-grid {gap:22px}
  .poster-caption {padding:16px 17px 17px}.poster-name {font-size:19px}
}
@media(min-width:681px) and (max-width:1000px) {
  .topbar {flex-wrap:wrap;gap:9px;padding:12px 16px;border-radius:24px}
  .topbar .section-nav {order:5;flex-basis:100%;margin:0;justify-content:center}
  .topbar .search-trigger {margin-left:auto;min-width:220px;width:230px}
  .topbar .section-button {font-size:14px;padding:0 20px;min-height:44px}
  .library-main {padding-top:32px}.library-heading h1 {font-size:40px}
  .poster-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:21px 18px}
  .poster-card {border-radius:21px}.poster-name {font-size:18px}
  .cast-list {grid-template-columns:repeat(4,minmax(0,1fr))}
  .detail-hero {grid-template-columns:170px 1fr;gap:26px}.detail-poster {width:170px}
  .detail-title {font-size:36px}.detail-actions>.button {font-size:13px;padding:0 13px}
  .detail-overview {font-size:16px}.detail-body {padding-left:32px;padding-right:32px}
}
@media(max-width:680px) {
  body {background-attachment:scroll}
  .topbar {position:relative;top:0;width:100%;min-height:83px;height:calc(83px + env(safe-area-inset-top));margin:0;padding:env(safe-area-inset-top) 21px 0;border:0;border-radius:0;gap:8px;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .brand {font-size:27px;gap:8px}.brand-mark {width:29px}
  .topbar>.search-trigger {width:44px;height:44px;min-width:44px;margin-left:auto;padding:0;justify-content:center;border-radius:50%;border:1px solid var(--line);background:var(--well);box-shadow:none}
  .search-trigger span,.search-trigger kbd {display:none}
  .topbar>.icon-button {width:44px;height:44px;min-width:44px;margin:0}
  .topbar .section-nav {position:fixed;left:50%;bottom:calc(15px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:10;display:flex;gap:4px;padding:6px;max-width:430px;width:calc(100% - 28px);border:1px solid var(--glass-edge);border-radius:999px;background:var(--glass-solid);box-shadow:inset 0 1px 0 var(--shine),0 9px 28px #06112125;backdrop-filter:none;-webkit-backdrop-filter:none}
  @supports(backdrop-filter:blur(12px)) {.topbar .section-nav {background:var(--glass);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%)}}
  .section-button {min-height:48px;padding:0 9px;font-size:12px;gap:7px;flex:1}
  .section-button .icon {width:18px;height:18px}.nav-count {min-width:18px;font-size:10px;padding:2px 4px}
  .library-main {padding:23px 21px calc(106px + env(safe-area-inset-bottom))}
  .eyebrow {font-size:9px;letter-spacing:1.8px}
  .library-heading {margin:0 0 23px;align-items:flex-start;gap:12px}
  .library-heading h1 {font-size:35px;letter-spacing:-1.2px;margin-bottom:8px;line-height:1.1}
  .library-heading p {font-size:13px;line-height:1.6;max-width:270px}
  .library-toolbar {gap:8px;padding-bottom:0;margin-bottom:20px}
  .type-tabs {gap:20px;flex-shrink:0}.type-tab {font-size:14px;gap:6px;padding-bottom:13px;min-height:46px}
  .type-tab .icon {width:17px;height:17px}.type-tab>span {font-size:10px;padding:2px 4px}
  .sort-label {max-width:43%;flex:1;min-width:0;border-radius:0;padding:0 0 8px;align-self:center}
  .sort-label select {max-width:100%;width:100%;min-height:43px;font-size:11px;text-overflow:ellipsis;padding:0 0 0 2px}
  .poster-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 13px}
  .poster-card {border-radius:18px}.poster-wrap {border-radius:inherit}
  .poster-caption {padding:12px 13px 13px}.poster-name {font-size:17px;line-height:1.3;margin:0 0 6px;letter-spacing:-.25px}
  .poster-year {font-size:12px;margin:0}.poster-next {font-size:10px;margin:4px 0 0;line-height:1.5}
  .poster-rating {top:9px;right:9px;padding:4px 6px;font-size:10px;letter-spacing:.6px}
  .title-wordmark {min-height:44px}.poster-fallback {font-size:16px;padding:14px 12px 100px}
  .poster-fallback .icon {width:28px;height:28px}
  .empty-state {min-height:365px;padding:18px 3px 25px}.empty-art {height:157px;transform:scale(.9);margin-bottom:8px}
  .empty-state h2 {font-size:25px;line-height:1.3;max-width:300px}.empty-state .eyebrow {font-size:8px}
  .empty-state>p:not(.eyebrow) {font-size:14px;line-height:1.75}.empty-state .button {font-size:14px;min-height:48px}
  .footer {font-size:10px;gap:12px;margin-top:29px;padding:23px 0;line-height:1.7}.footer button {font-size:11px}
  .search-dialog {padding:20px;max-width:calc(100% - 20px);max-height:calc(100dvh - 26px);border-radius:24px}
  .dialog-top h2 {font-size:24px}.search-field {margin-top:18px;padding:0 12px;gap:9px;min-height:56px;border-radius:15px}
  .search-field input {font-size:16px;height:54px}.search-field .icon {width:20px}
  .search-scope {font-size:11px;margin:14px 1px}
  .search-results {grid-template-columns:1fr;gap:9px;max-height:54dvh;min-height:160px}
  .search-hint {font-size:14px;padding:34px 12px;line-height:1.8}
  .result {padding:10px;gap:12px;border-radius:14px}.result-poster {width:58px;height:87px;border-radius:8px}
  .result-info h3 {font-size:17px;line-height:1.35;margin-top:6px}.result-info p {font-size:12px}
  .result-kind {font-size:9px;padding:2px 5px}.result-status {font-size:11px}
  .detail-dialog {width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0;border:0;padding-top:env(safe-area-inset-top)}
  .detail-navigation {margin:15px 15px -59px 18px;top:calc(15px + env(safe-area-inset-top))}.detail-back {font-size:12px;min-height:44px}
  .detail-body {padding:77px 22px calc(32px + env(safe-area-inset-bottom))}
  .detail-hero {grid-template-columns:110px 1fr;gap:17px;margin-bottom:25px}.detail-poster {width:110px;border-radius:14px;position:static}
  .detail-cover {height:220px}
  .detail-cover+.detail-body {padding-top:23px}
  .detail-cover+.detail-body .detail-poster {margin-top:-63px}
  .detail-title {font-size:29px;line-height:1.12;letter-spacing:-.8px;margin:12px 0 9px}
  .detail-title .title-wordmark,.detail-title .title-wordmark.logo-ready {min-height:66px;height:auto;max-width:100%}
  .detail-title .title-logo {max-height:76px}
  :root[data-theme="light"] .detail-title .logo-ready:not(.logo-dark) .title-logo {inset:9px 11px;width:calc(100% - 22px);height:calc(100% - 18px)}
  .detail-original {font-size:12px;line-height:1.6;margin-bottom:10px}
  .detail-kicker {font-size:10px;letter-spacing:1.4px}.detail-kicker .icon {width:15px;height:15px}
  .detail-facts {font-size:13px;gap:6px;line-height:1.7}.detail-facts>span+span:before {margin-right:6px}
  .detail-genres {font-size:12px;line-height:1.7;margin:9px 0 10px}
  .tmdb-rating {font-size:11px;gap:7px}.tmdb-rating strong {font-size:17px}
  .detail-hero-info .detail-actions {margin-left:-127px;margin-top:23px;gap:9px}
  .detail-hero-info .detail-actions>.button {font-size:13px;min-height:48px;flex:1;padding:0 10px;border-radius:14px}
  .detail-hero-info .detail-personal {margin-left:-127px;font-size:13px;gap:10px;margin-top:11px}
  .detail-personal button {font-size:15px}.detail-section {margin-top:26px;padding-top:23px}
  .detail-section h3 {font-size:21px;line-height:1.4;margin-bottom:16px}.detail-overview {font-size:16px;line-height:1.85}
  .credit-lines {gap:23px}.credit-lines div {font-size:14px}.credit-lines span {font-size:10px}
  .cast-list {grid-template-columns:repeat(3,minmax(0,1fr));gap:21px 13px}.cast-photo {border-radius:12px}
  .cast-person h4 {font-size:13px;line-height:1.45}.cast-person p {font-size:11px;line-height:1.6}
  .season-header {align-items:flex-start}.season-header h3 {margin:0}.season-header .muted {font-size:12px;max-width:110px;line-height:1.5;text-align:right}
  .season-tabs {gap:8px;margin:18px 0 15px}.season-tab {font-size:13px;min-height:44px;padding:0 14px}
  .season-meta {font-size:13px;line-height:1.7}.episode {grid-template-columns:28px 1fr;gap:10px;padding:18px 0}
  .episode-number {font-size:12px;padding-top:3px}.episode-top {display:block}.episode h4 {font-size:16px;line-height:1.6}
  .episode-date {font-size:12px;display:block;margin-top:5px;white-space:normal;line-height:1.7}
  .episode p {font-size:14px;line-height:1.8;margin-top:9px}.schedule-note {font-size:12px;line-height:1.8}
  .stale-note {font-size:13px;padding:13px 15px}.source-note {font-size:11px;line-height:1.8}
  .small-dialog {padding:30px 24px;max-width:calc(100% - 30px);border-radius:25px}
  .small-dialog h2 {font-size:26px}.small-dialog>.muted {font-size:14px}.small-dialog>.eyebrow {font-size:9px}
  .rating-stars {gap:8px}.star-button {min-width:44px;min-height:49px}.star-button .icon {width:31px;height:31px}
  .button {font-size:14px;min-height:48px;border-radius:14px}
  .settings-dialog {padding:23px}.settings-dialog .dialog-top h2 {font-size:24px}
  .settings-section h3 {font-size:16px}.settings-section p {font-size:13px;line-height:1.8}
  .settings-action {font-size:14px;min-height:52px}.appearance-options {gap:7px}.appearance-options button {font-size:12px;min-height:77px;border-radius:13px}
  .attribution {font-size:11px!important}.tmdb-link span {font-size:11px}.form-error {font-size:13px;line-height:1.8}
  .toast {font-size:14px;bottom:calc(96px + env(safe-area-inset-bottom));padding:14px 18px;border-radius:16px}
  .login-screen {display:block;padding:calc(65px + env(safe-area-inset-top)) 29px 35px}
  .login-appearance {top:calc(18px + env(safe-area-inset-top));right:22px}
  .login-card {max-width:365px}.login-card h1 {font-size:39px;font-weight:800;line-height:1.18}
  .login-card>.muted {font-size:15px;line-height:1.8}.login-card .brand {margin-bottom:57px}.login-art {display:none}
  .login-card>.eyebrow {font-size:10px}.login-footnote {font-size:12px}
}
@media(max-width:370px) {
  .topbar {padding-left:17px;padding-right:17px;gap:5px}.brand {font-size:25px;gap:4px}.brand-mark {width:25px}
  .library-main {padding-left:17px;padding-right:17px}.library-heading h1 {font-size:32px}.library-heading p {font-size:12px}
  .type-tabs {gap:13px}.type-tab {font-size:13px;gap:4px}.type-tab .icon {display:none}
  .sort-label {max-width:45%}.sort-label select {font-size:11px}.poster-caption {padding:10px 11px 12px}
  .poster-name {font-size:16px}.poster-year {font-size:11px}.poster-rating {font-size:9px}
  .topbar .section-nav {width:calc(100% - 24px);padding:6px;gap:3px}.section-button {font-size:11px;padding:0 7px;gap:5px}
  .section-button .icon {width:16px;height:16px}.nav-count {font-size:9px;min-width:17px}
  .detail-body {padding-left:18px;padding-right:18px}.detail-hero {grid-template-columns:98px 1fr;gap:14px}.detail-poster {width:98px}
  .detail-hero-info .detail-actions,.detail-hero-info .detail-personal {margin-left:-112px}.detail-actions>.button {font-size:12px!important}
  .small-dialog {padding:28px 20px}.rating-stars {gap:4px}
}
@media(prefers-reduced-transparency:reduce) {
  dialog.glass,.glass,.topbar,.topbar .section-nav {background:var(--glass-solid);backdrop-filter:none;-webkit-backdrop-filter:none}
  .topbar .section-nav {background:transparent}
  @media(max-width:680px) {.topbar {background:transparent}.topbar .section-nav {background:var(--glass-solid)}}
}
@media(prefers-contrast:more) {
  :root {--muted:#d4deed;--line:#9eb6d1;--body-copy:#e0e7f1;--glass-solid:#182334;--glass:#182334}
  :root[data-theme="light"] {--muted:#32455d;--line:#647b97;--body-copy:#233c58;--glass-solid:#fff;--glass:#fff}
  .section-button.active,.appearance-options button[aria-pressed="true"] {border-color:var(--focus);outline:1px solid var(--focus)}
  .poster-wrap:before {display:none}
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .poster-card:hover,.poster-card:hover .poster-wrap>img {transform:none}
  .poster-caption:before {display:none}
}