/* Generated from src/styles/tokens.css. */
/* Shared at build time by postcss.config.mjs, including on Chromium 38.
   Sizes are Onest CSS pixels for the 1080p layout, not Apple's point values. */
:root {
  --rating-good: #2eaa38;
  --rating-neutral: #656565;
  --rating-top: #c6b6f4;
  --rating-top-ink: #231b35;
  --control-focus-ring: inset 0 0 0 2px #f4f4f4;
  --control-focus-ring-light: inset 0 0 0 3px #121212;
  /* Static login glass. */
  --glass-login-fallback: rgba(27, 27, 33, .96);
  --glass-inner-light: rgba(255, 255, 255, .065);
  --glass-drop-shadow: rgba(0, 0, 0, .14);
  --glass-login: rgba(27, 27, 33, .46);
  --glass-input: rgba(5, 6, 9, .54);
  --glass-input-line: rgba(255, 255, 255, .045);
  --glass-input-focus: rgba(5, 6, 9, .72);
  --glass-divider: rgba(255, 255, 255, .07);
  /* Small icon accents on the settings landing page. */
  --brand-purple-soft: #c39aff;
  --brand-pink-soft: #ee96c0;
  --brand-orange-soft: #f5b083;
  --brand-yellow-a20: rgba(255, 209, 20, 0.20);
  --status-unread: #e5484d;
  --qr-paper: #ffffff;
  --qr-ink: #101218;
  --r-segment: 22px;
  --shadow-dialog: 0 24px 80px rgba(0, 0, 0, 0.4);
  --context-menu-scrim: rgba(0, 0, 0, 0.52);
  --context-menu-surface: rgba(24, 23, 22, 0.96);
  --context-menu-divider: rgba(255, 255, 255, 0.09);
  --context-menu-shadow: 0 22px 64px rgba(0, 0, 0, 0.48);
  /* Palette and translucent layers shared by TV and companion pages. */
  --black: #000000;
  --oled-bg: var(--black);
  --scrim-90: rgba(9, 9, 9, 0.9);
  --shade-87: rgba(0, 0, 0, 0.87);
  --shade-50: rgba(0, 0, 0, 0.5);
  --shade-14: rgba(0, 0, 0, 0.14);
  --shade-18: rgba(0, 0, 0, 0.18);
  --scrim-48: rgba(9, 9, 9, 0.48);
  --scrim-56: rgba(9, 9, 9, 0.56);
  --warning-fill-a46: rgba(125, 83, 30, 0.46);
  --warning-text: #ffe3b0;
  --scrim-78: rgba(9, 9, 9, 0.78);
  --scrim-82: rgba(9, 9, 9, 0.82);
  --scrim-92: rgba(9, 9, 9, 0.92);
  --line-strong: #595959;
  --scrim-96: rgba(9, 9, 9, 0.96);
  --surface-deep: #070707;
  --scrim-97: rgba(9, 9, 9, 0.97);
  --scrim-70: rgba(9, 9, 9, 0.7);
  --scrim-16: rgba(9, 9, 9, 0.16);
  --scrim-94: rgba(9, 9, 9, 0.94);
  --scrim-34: rgba(9, 9, 9, 0.34);
  --shade-46: rgba(0, 0, 0, 0.46);
  --scrim-68: rgba(9, 9, 9, 0.68);
  --imdb-yellow: #f5c518;
  --tmdb-ink: #0d253f;
  --tmdb-blue: #01b4e4;
  --shade-72: rgba(0, 0, 0, 0.72);
  --scrim-0: rgba(9, 9, 9, 0);
  --shade-38: rgba(0, 0, 0, 0.38);
  --white: #ffffff;
  --shade-84: rgba(0, 0, 0, 0.84);
  --shade-48: rgba(0, 0, 0, 0.48);
  --white-a88: rgba(255, 255, 255, 0.88);
  --shade-52: rgba(0, 0, 0, 0.52);
  --scrim-12: rgba(9, 9, 9, 0.12);
  --scrim-72: rgba(9, 9, 9, 0.72);
  --shade-55: rgba(0, 0, 0, 0.55);
  --brand-pink-a62: rgba(255, 22, 148, 0.62);
  --brand-pink-a25: rgba(255, 22, 148, 0.25);
  --brand-pink-a7: rgba(255, 22, 148, 0.07);
  --brand-pink-a0: rgba(255,22,148,0);
  --brand-purple-a42: rgba(100, 20, 232, 0.42);
  --brand-purple-a13: rgba(100, 20, 232, 0.13);
  --brand-purple-a0: rgba(100,20,232,0);
  --brand-glow-a48: rgba(255, 119, 32, 0.48);
  --brand-glow-a17: rgba(255,119,32,.17);
  --brand-glow-a4: rgba(255, 119, 32, 0.04);
  --brand-glow-a0: rgba(255,119,32,0);
  --brand-pink: #ff1694;
  --brand-purple: #6414e8;
  --brand-yellow: #ffd114;
  --shade-8: rgba(0, 0, 0, 0.08);
  --shade-86: rgba(0, 0, 0, 0.86);
  --surface-dialog: #191919;
  --surface-control: #242424;
  --surface-selected: #363636;
  --danger-surface: rgba(229, 72, 77, 0.12);
  --success-surface: rgba(48, 209, 88, 0.12);
  --danger-text: #ffb4ac;
  --danger-fill: #8c1d18;
  --focus-muted: #484848;
  --shade-60: rgba(0, 0, 0, 0.6);
  --white-a65: rgba(255, 255, 255, 0.65);
  --status-success: #30d158;
  --shade-54: rgba(0, 0, 0, 0.54);
  --shade-62: rgba(0, 0, 0, 0.62);
  --scrim-9: rgba(9, 9, 9, 0.09);
  --shade-34: rgba(0, 0, 0, 0.34);
  --scrim-88: rgba(9, 9, 9, 0.88);
  --scrim-45: rgba(9, 9, 9, 0.45);
  --scrim-80: rgba(9, 9, 9, 0.8);
  --scrim-20: rgba(9, 9, 9, 0.2);
  --brand-pink-a22: rgba(255,22,148,.22);
  --brand-purple-a24: rgba(100,20,232,.24);
  --scrim-62: rgba(9, 9, 9, 0.62);
  --shade-35: rgba(0, 0, 0, 0.35);
  --white-a62: rgba(255, 255, 255, 0.62);
  --shade-0: rgba(0, 0, 0, 0);
  --shade-90: rgba(0, 0, 0, 0.9);
  --scrim-75: rgba(9, 9, 9, 0.75);
  --white-a38: rgba(255, 255, 255, 0.38);
  --shade-75: rgba(0, 0, 0, 0.75);
  --bg: var(--black);
  --ink: #090909;
  --surface-1: rgba(255, 255, 255, 0.06);
  --surface-2: rgba(255, 255, 255, 0.1);
  --surface-3: rgba(255, 255, 255, 0.16);
  /* A control the pointer or the remote is on, when it keeps its own text. */
  --surface-focus: rgba(255, 255, 255, 0.22);
  /* Solid dark grounds: a poster before it loads, a sheet's inset well. */
  --surface-raised: #161616;
  --surface-sunken: #0e0e0e;
  --hairline: var(--line);
  --line: rgba(255, 255, 255, 0.08);
  --text: #f4f4f4;
  --text-2: #bebebe;
  /* Light plate behind third-party channel logos: most are drawn for white and vanish on the dark surfaces. */
  --logo-plate: #e9e7e1;
  --logo-plate-ink: #4a4a4f;
  --text-3: #a6a6a6;
  --paper: #f4f4ef;
  --muted: var(--text-2);
  --accent: var(--paper);
  /* The inverted focus: paper behind, ink on it. */
  --focus-fill: var(--paper);
  --focus-ink: #121212;
  /* The orange disc of the mark; also the colour of danger. Never a selection. */
  --brand-orange: #ff5b16;
  --brand-warm: var(--paper);
  --r-badge: 8px;
  --r-control: 16px;
  --r-card: 20px;
  --r-panel: 28px;
  --r-pill: 999px;
  /* Shared 4dp spacing scale. Handheld CSS consumes this directly; TV can
     adopt it component-by-component without changing its current geometry. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  /* Android handheld roles. CSS px map to dp in the device-width WebView;
     Android fontScale is applied natively through WebView textZoom. */
  --mobile-gutter: var(--space-4);
  --mobile-touch-target: 48px;
  --mobile-primary-control-height: 52px;
  --mobile-app-bar-height: 64px;
  --mobile-navigation-height: 72px;
  --mobile-navigation-item-height: 56px;
  --mobile-navigation-inline-inset: var(--space-3);
  --mobile-navigation-bottom-gap: var(--space-2);
  --mobile-navigation-padding: var(--space-2);
  --mobile-navigation-clearance: calc(var(--mobile-navigation-height) + var(--mobile-navigation-bottom-gap) + var(--space-5));
  --mobile-navigation-indicator-width: 64px;
  --mobile-navigation-indicator-height: 32px;
  --mobile-navigation-background: var(--scrim-82);
  --mobile-navigation-border: var(--line);
  --mobile-navigation-active-background: var(--surface-3);
  --mobile-navigation-blur: 24px;
  --mobile-navigation-saturation: 1.2;
  --mobile-navigation-rail-width: 80px;
  --mobile-navigation-drawer-width: 216px;
  --mobile-app-bar-blur: 20px;
  --mobile-app-bar-saturation: 1.15;
  --mobile-app-bar-motion: 220ms cubic-bezier(0.16, 1, 0.3, 1);
  /* Handheld typography scale. Components consume roles rather than choosing
     local pixel sizes; the native WebView applies the Android font scale. */
  --mobile-type-caption: 12px;
  --mobile-type-label: 14px;
  --mobile-type-body: 16px;
  --mobile-type-body-emphasis: 18px;
  --mobile-type-title-small: 20px;
  --mobile-type-title: 24px;
  --mobile-type-heading: 28px;
  --mobile-type-headline: 32px;
  --mobile-type-display: 38px;
  --mobile-type-display-large: 58px;
  --mobile-type-hero: 52px;
  --mobile-type-hero: clamp(40px, 6.2vw, 52px);
  --mobile-type-stat: 78px;
  --mobile-type-stat: clamp(58px, 7vw, 78px);
  /* Semantic mobile text roles. Components use these names; the numeric scale
     above stays private to the theme so one role cannot drift screen by screen. */
  --mobile-text-caption: var(--mobile-type-caption);
  --mobile-text-supporting: var(--mobile-type-label);
  --mobile-text-body: var(--mobile-type-body);
  --mobile-text-action: var(--mobile-type-body);
  --mobile-text-card-title: var(--mobile-type-body-emphasis);
  --mobile-text-section-title: var(--mobile-type-title-small);
  --mobile-text-screen-title: var(--mobile-type-title);
  --mobile-text-page-title: var(--mobile-type-heading);
  --mobile-text-hero-title: var(--mobile-type-headline);
  --mobile-text-display-title: var(--mobile-type-headline);
  --mobile-text-stat: var(--mobile-type-stat);
  --mobile-text-stat-large: var(--mobile-type-display-large);
  --mobile-switch-width: 52px;
  --mobile-switch-height: 32px;
  --mobile-switch-thumb: 24px;
  --mobile-switch-inset: var(--space-1);
  --mobile-switch-travel: 20px;
  --mobile-title-large: var(--mobile-text-page-title);
  --mobile-title-medium: var(--mobile-text-section-title);
  --mobile-title-setup: var(--mobile-text-screen-title);
  --mobile-body: var(--mobile-text-body);
  --mobile-label: var(--mobile-text-supporting);
  --mobile-meta: var(--mobile-text-caption);
  --mobile-leading-title: 1.15;
  --mobile-leading-heading: 1.25;
  --mobile-leading-card: 1.3;
  --mobile-leading-meta: 1.35;
  --mobile-leading-label: 1.4;
  --mobile-leading-body: 1.5;
  --mobile-tracking-title: -0.025em;
  --mobile-tracking-heading: -0.015em;
  --mobile-tracking-setup: -0.02em;
  --mobile-reading-measure: 38ch;
  --mobile-radius-sheet: var(--r-panel);
  --mobile-page-heading-gap: var(--space-5);
  --mobile-page-section-gap: var(--space-8);
  --mobile-page-block-gap: var(--space-6);
  --mobile-page-item-gap: var(--space-3);
  --mobile-page-header-title: var(--mobile-text-screen-title);
  --mobile-page-header-icon: var(--mobile-text-screen-title);
  --mobile-profile-art-reserve: calc(var(--space-8) * 3);
  --mobile-profile-card-min-height: calc(var(--space-8) * 3 + var(--space-4));
  --mobile-profile-leading-size: calc(var(--space-8) * 2);
  --mobile-profile-illustration-reserve: calc(var(--space-8) * 4);
  --mobile-profile-illustration-size: calc(var(--space-8) * 2 + var(--space-2));
  --mobile-person-card-height: calc(var(--space-8) * 3);
  --mobile-person-compact-avatar: calc(var(--space-8) * 2 + var(--space-1));
  --mobile-person-portrait-size: calc(var(--space-8) * 3 + var(--space-2));
  --mobile-person-shelf-width: calc(var(--space-8) * 3 + var(--space-5));
  --mobile-detail-rating-inline-padding: var(--space-2);
  --mobile-detail-rating-height: 40px;
  --mobile-detail-meta-gap: var(--space-2);
  --mobile-sheet-viewport-height: 92dvh;
  --mobile-status-bar-clearance: calc(var(--space-8) * 2);
  --mobile-torrent-row-min-height: calc(var(--space-8) * 3 + var(--space-2));
  --mobile-torrent-leading-width: calc(var(--space-8) * 2);
  --mobile-player-primary-control: calc(var(--space-8) * 2);
  --mobile-player-secondary-control: calc(var(--space-8) + var(--space-6));
  --mobile-player-option-control: var(--mobile-touch-target);
  --mobile-player-control-surface: var(--scrim-56);
  --mobile-person-card-viewport-limit: 82vw;
  --mobile-person-card-width: calc(var(--space-8) * 9 + var(--space-6));
  --mobile-person-avatar-size: calc(var(--space-8) * 3 - var(--space-1));
  --mobile-nav-shadow: 0 16px 44px var(--shade-75), inset 0 1px 0 var(--glass-inner-light);
  --mobile-pressed-opacity: .72;
  --mobile-press-duration: 60ms;
  --stroke-hairline-width: 1px;
  /* Detail page: badge edges and the veil over an episode still. Raw colours are not allowed in
     the TV sheets — they are inlined from here at build time, so webOS 3 reads them too. */
  --quality-badge-line: rgba(255, 255, 255, .48);
  --quality-badge-fill: rgba(255, 255, 255, .1);
  --episode-still-veil: rgba(0, 0, 0, .68);
  --episode-progress-track: rgba(255, 255, 255, .42);
  /* Source choice before sign-in: film stills fade into a cool near-black. */
  --cinema-ground: #08090b;
  --cinema-ground-a12: rgba(8, 9, 11, .12);
  --cinema-ground-a22: rgba(8, 9, 11, .22);
  --cinema-ground-a25: rgba(8, 9, 11, .25);
  --cinema-ground-a66: rgba(8, 9, 11, .66);
  --cinema-text: #f5f4f2;
  --cinema-hint: #97999f;
  /* One 1080p content-to-heading step between sections of a detail page. */
  --space-detail-section: 40px;
  --fs-caption: 24px;
  --fs-body: 28px;
  --fs-control: 28px;
  --fs-card: 26px;
  --fs-headline: 32px;
  --fs-section: 40px;
  --fs-title: 56px;
  --fs-display: 72px;
  --lh-caption: 1.3334;
  --lh-body: 1.4286;
  --lh-control: 1.2858;
  --lh-card: 1.3077;
  --lh-headline: 1.25;
  --lh-section: 1.2;
  --lh-title: 1.1429;
  --lh-display: 1.1112;
  --fw-regular: 400;
  --fw-medium: 600;
  --fw-bold: 700;
  --icon-m: 28px;
  --icon-l: 36px;
  --icon-mobile: 24px;
  --focus-scale-control: 1.025;
  --focus-scale-media: 1.04;
  --focus-lift-media: -8px;
  --focus-ring: 0 0 0 3px #fff;
  /* The same ring held off the artwork by the ground: it stays visible on a white poster. */
  --focus-ring-offset: 0 0 0 3px #000, 0 0 0 6px #fff;
  --shadow-focus: 0 16px 36px rgba(0, 0, 0, 0.5);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --t-page: 220ms;
  --motion-focus: 180ms cubic-bezier(0.22, 1, 0.36, 1);
  --pad: 96px;
  /* Global layers, bottom to top. Values below 30 stack inside a component and stay numbers. */
  --z-chrome: 30;
  --z-chrome-raised: 31;
  --z-panel-scrim: 38;
  --z-drawer-scrim: 40;
  --z-drawer: 41;
  --z-panel: 42;
  --z-menu: 45;
  --z-overlay: 60;
  --z-filters-scrim: 80;
  --z-filters: 81;
  --z-choice: 85;
  --z-loading: 90;
  --z-toast-offline: 99;
  --z-sheet: 100;
  --z-choice-phone: 110;
  --z-system: 200;
}