/* Teevo marketing kit: shared by the homepage and the product pages.
   Layout: full-width sections on white, a grey band between, black for the player and the film.
   Apple product images (.mock) are never animated, cropped, shadowed or overlapped, and are sized
   in true millimetres (--u is px per mm) wherever more than one is shown. Our own screens
   (.k-screen, .k-loop) may be cropped and animated. "Before" states of reveals apply only once
   kit.js adds .js, so every page reads fully without script. */
.bleed{width:100%;margin:0}
.k{--ink:#1d1d1f;--sub:#6e6e73;--surface:#f5f5f7;--card:#fff;--line:#d2d2d7;--link:#0066cc;--glow:#6ab0ff;--gold:#c99a3b;--ease:cubic-bezier(.2,.7,.2,1);--max:1180px;--radius:28px;overflow-x:clip;color:var(--ink)}
.k>section{padding:120px max(24px,calc((100% - var(--max))/2));text-align:center}
.k-band{background:var(--surface)}
.k-dark{background:#000;color:#f5f5f7;--ink:#f5f5f7;--sub:#a1a1a6;--line:#2c2c2e}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Type */
.k-title{font-size:clamp(2.4rem,5.2vw,4.25rem);line-height:1.04;letter-spacing:-.045em;font-weight:700;margin:0 auto 20px;max-width:none;color:var(--ink)}
.k-title .w{display:block}
.k-hero-title{font-size:clamp(2.6rem,6.6vw,5.75rem);letter-spacing:-.05em;line-height:1.02;margin-bottom:24px}
.k-sub{font-size:clamp(1.15rem,1.9vw,1.6rem);line-height:1.35;letter-spacing:-.018em;font-weight:500;margin:0 auto 32px;max-width:44ch;text-wrap:balance}
.k-line{font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.45;color:var(--sub);max-width:38ch;margin:0 auto;letter-spacing:-.012em}
.k-minor{font-size:17px;font-weight:600;letter-spacing:-.01em;margin:56px 0 0;color:var(--ink)}
.k-credit{font-size:12px;line-height:1.5;color:var(--sub);margin:20px auto 0;max-width:72ch;text-align:center}
.k-fine{font-size:13px;line-height:1.5;color:var(--sub);margin:36px auto 0;max-width:64ch}
.k-fine a{color:inherit}
.k-link{font-size:17px;text-decoration:none;color:var(--link)}.k-link::after{content:" ›"}.k-link:hover{text-decoration:underline}
.k-dark .k-link{color:var(--glow)}
.k-actions{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:center;align-items:center}
.k-actions .availability{font-size:15px;color:var(--ink);font-weight:600;padding:12px 22px;border-radius:999px;background:var(--surface)}
.k-band .k-actions .availability{background:#fff}
.mock{display:block;height:auto;max-width:none;margin:0 auto}
.k-screen{display:block;width:100%;height:auto}
.k-loop{display:block;width:100%;height:auto;background:#000}
.k-glyph{width:72px;height:72px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* Opening: the end of the Teevo film. Black, a blue glow swells, the icon arrives with a sheen,
   the name blurs in, the horizon arc draws, then the words. The film's end card, recreated. */
.k>.k-endcard{position:relative;overflow:hidden;background:#000;color:#f5f5f7;padding:120px max(24px,calc((100% - var(--max))/2)) 112px;text-align:center;isolation:isolate}
.k-endcard-glow{position:absolute;inset:-20% -10% auto;height:120%;z-index:-1;background:radial-gradient(42% 34% at 50% 30%,#2f6fd666,#163a7a33 45%,transparent 72%)}
.k-endcard-lockup{display:grid;justify-items:center;gap:14px;margin-bottom:56px}
.k-endcard-icon{position:relative;display:block;width:128px;height:128px;border-radius:28px;overflow:hidden;box-shadow:0 0 70px #4a9cff8c,0 0 0 1px #ffffff14}
.k-endcard-icon img{display:block;width:100%;height:100%}
.k-endcard-sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#ffffff70 50%,transparent 65%);transform:translateX(-130%)}
.k-endcard-name{margin:6px 0 0;font-size:clamp(3rem,6vw,4.6rem);font-weight:700;letter-spacing:-.04em;line-height:1;color:#fff;text-shadow:0 0 40px #6ab0ff40}
.k-endcard-arc{width:min(420px,80vw);height:30px;margin-top:-4px;overflow:visible}
.k-endcard-arc path{fill:none;stroke:url(#kEndArc);stroke-width:2;stroke-dasharray:100;stroke-dashoffset:0;filter:drop-shadow(0 0 6px #6ab0ffaa)}
.k-endcard-title{font-size:clamp(2.3rem,5.4vw,4.4rem);line-height:1.04;letter-spacing:-.045em;font-weight:700;margin:0 auto 20px;color:#fff;max-width:none}
.k-endcard-title .w{display:block}
.k-endcard-sub{font-size:clamp(1.05rem,1.6vw,1.35rem);color:#a1a1a6;margin:0 auto 36px}
.k-endcard .availability{background:#1d1d1f!important;color:#f5f5f7!important}
.k-endcard .k-link{color:var(--glow)}
@media(prefers-reduced-motion:no-preference){
  .k-endcard-glow{animation:k-swell 2.4s ease-out both}
  .k-endcard-icon{animation:k-arrive 1.3s var(--ease) .3s both,k-breathe 6s ease-in-out 2.4s infinite}
  .k-endcard-sheen{animation:k-sheen 7s ease-in-out 1.5s infinite}
  .k-endcard-name{animation:k-in 1.1s var(--ease) .9s both}
  .k-endcard-arc path{animation:k-draw 1.3s var(--ease) 1.4s both}
  .k-endcard-title .w{animation:k-in 1.1s var(--ease) 2s both}
  .k-endcard-title .w:nth-child(2){animation-delay:2.4s}
  .k-endcard-sub{animation:k-fade .9s ease 2.8s both}
  .k-endcard .k-actions{animation:k-fade .9s ease 3s both}
}
@keyframes k-swell{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@keyframes k-arrive{from{opacity:0;filter:blur(10px);transform:scale(.9)}to{opacity:1;filter:none;transform:none}}
@keyframes k-breathe{0%,100%{box-shadow:0 0 60px #4a9cff80,0 0 0 1px #ffffff14}50%{box-shadow:0 0 96px #6ab0ffb3,0 0 0 1px #ffffff1f}}
@keyframes k-sheen{0%{transform:translateX(-130%)}16%,100%{transform:translateX(130%)}}
@keyframes k-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.k-family-section{padding-top:104px!important}
.k-family-title{font-size:clamp(1.8rem,3.4vw,2.8rem);max-width:30ch}
.k-family-section .k-family{margin-top:48px}
@media(max-width:734px){.k>.k-endcard{padding:80px 20px 72px}.k-endcard-icon{width:104px;height:104px;border-radius:23px}.k-endcard-lockup{margin-bottom:40px}}

/* The films fade up behind the words (apple.com/apple-tv), then four statements over them. */
.k-endcard-film{position:absolute;inset:38% 0 0;z-index:-2;opacity:0}
.k-endcard-film video{width:100%;height:100%;object-fit:cover;opacity:.5}
.k-endcard-film::after{content:"";position:absolute;inset:0;background:linear-gradient(#000 0%,#000c 30%,#0006 70%,#000 100%)}
.k-endcard-film .k-pause{bottom:22px;right:max(24px,calc((100vw - var(--max))/2))}
@media(prefers-reduced-motion:no-preference){.k-endcard-film{animation:k-fade-in 2.4s ease 3.2s both}}
@media(prefers-reduced-motion:reduce){.k-endcard-film{opacity:1}}
@keyframes k-fade-in{to{opacity:1}}
.k-endcard-credit{font-size:11px;color:#86868b;margin:40px 0 0}
.k-film-link{border:0;background:none;padding:0;font:inherit;font-size:17px;cursor:pointer}
.k>.k-statements{position:relative;background:#000;padding:0;color:#fff;overflow:clip}
.k-statements-bg{position:sticky;top:0;height:100vh;margin-bottom:-100vh;overflow:hidden}
.k-statements-layer{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.k-statements-layer.on{opacity:1}
.k-statements-layer>img,.k-statements-layer>video{width:100%;height:100%;object-fit:cover;opacity:.5}
.k-statements-film>video{opacity:.38}
.k-statements-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(#000 0%,#0000 25%,#0000 75%,#000 100%)}
.k-statements-bg .k-pause{bottom:22px;right:24px}
.k-statements-list{position:relative;padding:40vh max(24px,calc((100% - var(--max))/2)) 30vh;display:grid;gap:34vh;text-align:center}
.k-statement{margin:0}
.k-statement-line{margin:0;font-size:clamp(2rem,4.6vw,3.6rem);font-weight:700;letter-spacing:-.04em;line-height:1.08;color:#fff;text-shadow:0 2px 30px #000a;text-wrap:balance}
.k-statement-sub{margin:18px auto 0;max-width:40ch;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.4;color:#e8e8ed;text-shadow:0 1px 18px #000;text-wrap:balance}
.k-statement .w{display:block}
.k-statement-cta{margin:0}
.k-film-open{display:inline-flex;align-items:center;gap:10px;border:0;border-radius:999px;padding:14px 26px;background:#fff;color:#000;font:600 17px/1 var(--body);cursor:pointer}
.k-film-open svg{width:14px;height:14px;fill:currentColor}
.k-film-open:hover{background:#e8e8ed}
.k-pause{position:absolute;z-index:2;bottom:14px;right:14px;width:36px;height:36px;border-radius:50%;border:0;cursor:pointer;background:#ffffff2e;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.k-pause::before,.k-pause::after{content:"";position:absolute;top:12px;width:4px;height:12px;border-radius:1px;background:#fff}
.k-pause::before{left:12px}.k-pause::after{left:20px}
.k-pause[data-state="paused"]::before{left:14px;width:0;height:0;border-radius:0;background:none;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #fff}
.k-pause[data-state="paused"]::after{display:none}
.k-pause:focus-visible{outline:3px solid var(--glow);outline-offset:3px}
.k-shot,.k-tile-media,.k-steps-inline,.k-card-media{position:relative}
.k-film-dialog{width:min(1100px,94vw);padding:0;border:0;border-radius:20px;background:#000;color:#a1a1a6;overflow:visible}
.k-film-dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}
.k-film-dialog video{display:block;width:100%;aspect-ratio:16/9;border-radius:20px 20px 0 0;background:#000}
.k-film-dialog p{font-size:12px;margin:0;padding:12px 18px 16px}
.k-film-close{position:absolute;top:-46px;right:0;width:36px;height:36px;border-radius:50%;border:0;background:#ffffff26;color:#fff;font-size:24px;line-height:1;cursor:pointer}

/* Sources: Apple One's services grid */
.k-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 28px;margin:56px auto 0;text-align:left;max-width:1080px}
.k-service{display:grid;align-content:start;gap:6px;color:var(--ink);text-decoration:none}
.k-service-icon{width:44px;height:44px;object-fit:contain;margin-bottom:8px}
.k-service-glyph{fill:none;stroke:var(--link);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.k-service strong{font-size:19px;letter-spacing:-.018em}
.k-service span{font-size:15px;color:var(--sub);line-height:1.45}
.k-service em{font-style:normal;font-size:15px;color:var(--link)}.k-service em::after{content:" ›"}
.k-service:hover em{text-decoration:underline}
.k-service-shot{margin:0;border-radius:16px;overflow:hidden;background:#000;align-self:start}
@media(max-width:900px){.k-services{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* How it works: Plex's plain icon row */
.k .k-how{gap:40px}
.k .k-how li{background:none;padding:0;border-radius:0;align-content:start}
.k .k-how-n{display:none}
.k-how-cta{margin-top:40px}
.k-band .k-how .k-glyph{color:var(--link)}

/* Devices: Apple's image accordion */
.k-accordion{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px;align-items:center;background:var(--surface);border-radius:var(--radius);padding:48px;margin-top:48px;text-align:left}
.k-accordion details{border-bottom:1px solid var(--line)}
.k-accordion details:last-child{border-bottom:0}
.k-accordion summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:20px 0;font-size:21px;font-weight:650;letter-spacing:-.02em}
.k-accordion summary::-webkit-details-marker{display:none}
.k-accordion summary::after{content:"";width:9px;height:9px;border-right:2px solid var(--sub);border-bottom:2px solid var(--sub);transform:rotate(45deg) translateY(-3px);transition:transform .25s ease}
.k-accordion details[open] summary::after{transform:rotate(-135deg)}
.k-accordion-body ul{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:8px;color:var(--sub);font-size:16px}
.k-accordion-body{padding-bottom:20px}
.k-accordion-inline{display:none}
.k-accordion-media{position:relative;min-height:420px;display:grid;place-items:center}
.k-accordion-pane{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:opacity .5s ease}
.k-accordion-pane.on{opacity:1}
.k-accordion-pane .mock{width:auto;max-width:100%;max-height:420px}
@media(max-width:900px){.k-accordion{grid-template-columns:1fr;padding:28px}.k-accordion-media{display:none}.k-accordion-inline{display:block;margin-top:16px}.k-accordion-inline .mock{width:auto;max-width:100%;max-height:360px}}

/* Organise: Apple's "Get to know" cards */
.k-know .k-carousel-track{grid-auto-columns:min(340px,78%)}
.k-know-card{position:relative;scroll-snap-align:start;background:#000;color:#f5f5f7;border-radius:var(--radius);overflow:hidden;min-height:520px;display:flex;flex-direction:column}
.k-know-eyebrow{font-size:13px;font-weight:600;color:#a1a1a6;margin:0;padding:28px 28px 6px}
.k-know-card h3{font-size:24px;line-height:1.15;letter-spacing:-.022em;margin:0;padding:0 28px 20px;color:#fff;max-width:16ch}
.k-know-media{flex:1;position:relative;min-height:0;display:grid;place-items:center;color:var(--glow)}
.k-know-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-know-open{position:absolute;right:18px;bottom:18px;width:36px;height:36px;border-radius:50%;border:0;background:#fff;color:#000;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 2px 10px #0006}
.k-know-dialog{width:min(640px,92vw);border:0;border-radius:24px;padding:40px;background:#fff;color:var(--ink);text-align:left}
.k-know-dialog::backdrop{background:#000a;backdrop-filter:blur(8px)}
.k-know-card .k-know-dialog .k-know-eyebrow{padding:0 0 6px;color:var(--sub)}
.k-know-card .k-know-dialog h3{font-size:28px;letter-spacing:-.03em;margin:0 0 12px;padding:0;color:var(--ink);max-width:none}
.k-know-dialog p{font-size:17px;line-height:1.55;color:var(--sub);margin:0 0 14px}
.k-know-lead{color:var(--ink)!important;font-weight:500}
.k-know-dialog .k-film-close{position:absolute;top:16px;right:16px;background:var(--surface);color:var(--ink)}

/* Bento: Apple TV 4K's cards, bold lead-in then grey body */
.k-tile-copy{margin:0;padding:26px 28px 18px;font-size:17px;line-height:1.4;color:var(--sub);max-width:40ch}
.k-tile-copy strong{color:var(--ink);font-weight:650}
.k-tile-ink .k-tile-copy{color:#a1a1a6}.k-tile-ink .k-tile-copy strong{color:#f5f5f7}

/* Feature categories */
.k-categories{list-style:none;padding:0;margin:48px auto 32px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:900px}
.k-categories a{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;background:#fff;color:var(--ink);text-decoration:none;font-size:17px;font-weight:600;box-shadow:0 0 0 1px #0000000d}
.k-categories span{font-size:13px;color:var(--sub);font-weight:600}
.k-categories a:hover{box-shadow:0 0 0 1px var(--line)}

/* Player: formats as a quiet row (where apple.com lists its formats) */
.k-player-auto{margin-top:18px!important}
.k-formats{margin:28px 0 0;font-size:14px;letter-spacing:.04em;color:#86868b}

/* App Capabilities: plex.tv/plans' collapsible tier table */
.k-caps{display:grid;gap:12px;max-width:980px;margin:40px auto 0;text-align:left}
.k-caps-group{background:#fff;border-radius:18px;box-shadow:0 0 0 1px #0000000f;overflow:hidden}
.k-caps-group summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:20px 24px;font-size:19px;font-weight:650;letter-spacing:-.015em}
.k-caps-group summary::-webkit-details-marker{display:none}
.k-caps-group summary span{margin-left:auto;margin-right:16px;font-size:13px;color:var(--sub);font-weight:600}
.k-caps-group summary::after{content:"+";font-size:26px;font-weight:300;color:var(--sub);transition:transform .25s ease}
.k-caps-group[open] summary::after{transform:rotate(45deg)}
.k-caps-group .k-table{margin:0;padding:0 24px 16px}
.k-na{font-size:12px;color:#aeaeb2}
.k-plan-billing{font-size:14px;color:var(--sub);margin:-12px 0 20px;min-height:1.4em}
.k-mac-keys .k-know-card{margin:0 auto}
.k-mac-keys .k-carousel-track{justify-content:center}
.k-know-dialog .k-keys{justify-content:flex-start;margin-top:20px}

/* Hero: the device family at true relative size; the row below needs room for a 200 px iPhone */
.k-hero{padding-top:64px!important;padding-bottom:88px!important}
.k-family{--u:min(calc((100vw - 64px) / 811),1.36px);margin:64px auto 0;display:grid;justify-items:center;gap:calc(var(--u) * 36)}
.k-family .m-tv{width:calc(var(--u) * 811)}
.k-family-row{display:flex;align-items:flex-end;justify-content:center;gap:calc(var(--u) * 40)}
.m-mac{width:calc(var(--u) * 385.6)}.m-ipad{width:calc(var(--u) * 221.3)}.m-iphone{width:calc(var(--u) * 74.6)}.m-ipad-l{width:calc(var(--u) * 288.7)}.m-iphone-l{width:calc(var(--u) * 152.5)}
@media(max-width:1130px){.k-family-row{display:none}}

/* Sources: marks gather around Teevo beside the real Add Source screen */
.k-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr);gap:56px;align-items:center;margin-top:64px;text-align:left}
.k-shot{margin:0;border-radius:20px;overflow:hidden;background:#000}
.k-orbit{position:relative;aspect-ratio:1;width:min(100%,420px);margin:0 auto}
.k-orbit-lines{position:absolute;inset:0;width:100%;height:100%}
.k-orbit-lines line{stroke:#c7c7cc;stroke-width:1.4;stroke-dasharray:150;stroke-dashoffset:0}
.k-orbit-core{position:absolute;left:38%;top:38%;width:24%;height:auto;border-radius:22%;box-shadow:0 0 0 1px #0000000f,0 12px 40px #6ab0ff66}
.k-orbit-mark{position:absolute;width:20%;aspect-ratio:1;display:grid;place-items:center;background:#fff;border-radius:50%;box-shadow:0 0 0 1px #0000000d,0 6px 18px #0000001a;transform:translate(-50%,-50%)}
.k-orbit-mark img{width:58%;height:58%;object-fit:contain}
.k-orbit-mark[data-service="emby"] img{width:78%}
.o0{left:50%;top:12.5%}.o1{left:85.66%;top:38.41%}.o2{left:72.04%;top:80.34%}.o3{left:27.96%;top:80.34%}.o4{left:14.34%;top:38.41%}
.k-chips{list-style:none;padding:0;margin:20px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:820px}
.k-chips li{font-size:15px;padding:8px 16px;border-radius:999px;border:1px solid var(--line)}
@media(prefers-reduced-motion:no-preference){
  .js .k-orbit-mark{opacity:0;transform:translate(-50%,-50%) scale(.6);transition:opacity .6s ease,transform .8s var(--ease)}
  .js .k-orbit-lines line{stroke-dashoffset:150;transition:stroke-dashoffset 1.1s var(--ease)}
  .js .k-orbit-core{transform:scale(.85);opacity:0;transition:transform .9s var(--ease),opacity .6s ease}
  .js .k-orbit.in .k-orbit-mark{opacity:1;transform:translate(-50%,-50%)}
  .js .k-orbit.in .k-orbit-lines line{stroke-dashoffset:0}
  .js .k-orbit.in .k-orbit-core{transform:none;opacity:1;animation:k-glow 3.2s ease-in-out 1.2s infinite}
  .js .k-orbit .o1,.js .k-orbit .l1{transition-delay:.1s}.js .k-orbit .o2,.js .k-orbit .l2{transition-delay:.2s}.js .k-orbit .o3,.js .k-orbit .l3{transition-delay:.3s}.js .k-orbit .o4,.js .k-orbit .l4{transition-delay:.4s}
}
@keyframes k-glow{0%,100%{box-shadow:0 0 0 1px #0000000f,0 12px 40px #6ab0ff55}50%{box-shadow:0 0 0 1px #0000000f,0 12px 64px #6ab0ffaa}}

/* Discovery: steps scroll past while the screen holds */
.k-steps{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:64px;margin-top:40px;text-align:left}
.k-steps-media{order:2}
.k-steps-frame{position:sticky;top:calc(50vh - 18vw);aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:#000;box-shadow:0 0 0 1px #0000000d}
.k-steps-pane{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.k-steps-pane.on{opacity:1}
.k-steps-pane img{height:100%;object-fit:cover}
.k-steps-list{list-style:none;padding:0;margin:0}
.k-steps-list li{min-height:56vh;display:flex;flex-direction:column;justify-content:center;gap:12px;transition:opacity .5s ease}
.js .k-steps-list li{opacity:.3}
.js .k-steps-list li.on{opacity:1}
.k-steps-list h3{font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.035em;line-height:1.08;margin:0}
.k-step-n{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;font-size:14px;font-weight:700}
.k-steps-inline{display:none}
.k-from-film{position:relative;display:block;height:100%}
.k-film-tag{position:absolute;left:12px;bottom:12px;font-size:11px;font-weight:600;color:#fff;background:#0009;padding:4px 9px;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

/* Live TV: a bento of real screens */
.k-bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(250px,auto);gap:20px;margin-top:56px;text-align:left}
.k-tile{position:relative;background:var(--card);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-height:230px}
.k-xl,.k-wide{grid-column:span 2;grid-row:span 2}.k-tall{grid-row:span 2}
.k-tile-title{font-size:22px;line-height:1.15;letter-spacing:-.022em;margin:0;padding:26px 28px 18px}
.k-tile-title:empty{display:none}
.k-tile-media{position:relative;flex:1;min-height:150px}
.k-tile-media>img,.k-tile-media>video,.k-tile-media>.k-from-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-tile-ink{background:#000;color:#f5f5f7}.k-tile-ink .k-tile-title{color:#f5f5f7}
.k-tile-ink .k-tile-media{display:grid;place-items:center;color:var(--glow)}
.crop-top{object-position:50% 0}.crop-left{object-position:0 40%}.crop-left-bottom{object-position:0 100%}.crop-menu{object-position:80% 18%}.crop-right{object-position:100% 20%}

/* Product pages */
.k-pills{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:4px;border-radius:999px;background:var(--surface);margin:0 auto 40px}
.k-pills a{font:600 14px/1 var(--body);padding:10px 18px;border-radius:999px;color:var(--sub);text-decoration:none}
.k-pills a[aria-current="page"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px #0000001f}
.k-platform-device{margin:56px auto 0}
.k-platform-appletv .mock{width:min(100%,1040px)}
.k-platform-mac .mock{width:min(100%,960px)}
.k-platform-ipad .mock{width:auto;max-width:100%;max-height:min(720px,80vh)}
.k-platform-iphone .mock{width:auto;max-width:100%;max-height:min(720px,80vh)}
.crop-bottom{object-position:50% 100%}
.k-mac-keys .k-keys{margin-top:40px}

/* Hubs and detail pages */
.k-page-hero{padding-bottom:64px!important}
.k-source-mark{display:block;margin:0 auto 24px;width:88px;height:88px;object-fit:contain}
.k>.k-source-detail{text-align:left;padding:40px max(24px,calc((100% - var(--max))/2)) 96px!important}
.k-source-detail h2{font-size:24px;letter-spacing:-.02em;margin:0 0 8px}
.k-source-detail p{font-size:17px;line-height:1.55;color:var(--sub);margin:0 0 24px;max-width:56ch}
.k-source-nav{list-style:none;padding:0;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.k-source-nav a{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:15px;font-weight:600}
.k-source-nav a[aria-current="page"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.k-source-nav img{width:24px;height:24px;margin:0;object-fit:contain}
.k-source-cards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;text-align:left}
.k-source-cards a{display:grid;gap:8px;padding:28px;border-radius:var(--radius);background:var(--surface);color:var(--ink);text-decoration:none;min-height:190px;align-content:start;transition:background .2s ease}
.k-source-cards a:hover{background:#ebebf0}
.k-source-cards img,.k-source-glyph{width:56px;height:56px;object-fit:contain;margin-bottom:12px}
.k-source-glyph{display:grid;place-items:center;border-radius:14px;background:var(--ink);color:#fff;font-weight:700;font-size:18px}
.k-source-cards strong{font-size:22px;letter-spacing:-.02em}
.k-source-cards span{color:var(--sub);font-size:15px}
.k-sources-grid{padding-top:0!important}
.k-split-even{grid-template-columns:1fr 1fr;gap:24px}
.k-sources-checked{max-width:820px;margin:32px auto 0;text-align:left;font-size:14px;color:var(--sub)}
.k-sources-checked summary{cursor:pointer;font-weight:600;color:var(--ink)}
.k>.k-specs{display:grid;gap:56px;text-align:left;padding-top:0!important}
.k-spec-group{display:grid;grid-template-columns:minmax(0,.35fr) minmax(0,1fr);gap:32px;border-top:1px solid var(--line);padding-top:28px}
.k-spec-group h2{font-size:28px;letter-spacing:-.03em;margin:0}
.k-spec-group dl{margin:0;display:grid;gap:20px}
.k-spec-group dt{font-weight:650;font-size:17px;margin-bottom:4px}
.k-spec-group dd{margin:0;color:var(--sub);font-size:16px;line-height:1.55;max-width:70ch}
.k>.k-whatsnew{text-align:left;padding-top:0!important}
.k-release h2{font-size:32px;letter-spacing:-.03em;margin:0 0 28px}
.k-release-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.k-release-list li{background:var(--surface);border-radius:22px;padding:26px 28px}
.k-release-list h3{font-size:19px;letter-spacing:-.018em;margin:0 0 8px}
.k-release-list p{font-size:15px;line-height:1.5;color:var(--sub);margin:0}
.k>.k-terms{max-width:760px;margin:0 auto;text-align:left;font-size:15px;line-height:1.6;color:var(--sub)}
@media(max-width:734px){.k-spec-group,.k-split-even{grid-template-columns:1fr;gap:16px}}

.k-group-nav{margin:24px auto 0}
.k-feature-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:40px;text-align:left}
.k-feature-card{background:var(--card);border-radius:22px;padding:26px 28px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:24px;box-shadow:0 0 0 1px #0000000a}
.k-feature-card:target{box-shadow:0 0 0 2px var(--link)}
.k-feature-card h3{font-size:20px;letter-spacing:-.02em;margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.k-feature-card p{font-size:15px;line-height:1.55;color:var(--sub);margin:0}
.k-note{font-size:13px!important}
.k-devices-list{list-style:none;padding:0;margin:auto 0 0;display:flex;flex-wrap:wrap;gap:6px}
.k-devices-list li{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--surface);color:var(--sub)}
.k-band .k-devices-list li{background:#f0f0f3}
.k-tag{align-self:flex-start;font-size:12px;font-weight:700;color:var(--link);background:#e8f1fb;padding:4px 10px;border-radius:999px}

.k-step-sub{font-size:17px;line-height:1.5;color:var(--sub);margin:0;max-width:34ch}
.k-tile-sub{font-size:15px;line-height:1.45;color:var(--sub);margin:-8px 0 0;padding:0 28px 18px;max-width:42ch}
.k-tile-ink .k-tile-sub{color:#a1a1a6}
.k-card p{font-size:15px;line-height:1.45;color:var(--sub);margin:-18px 0 0;padding:0 28px 28px}
.k-router-note{font-size:14px;line-height:1.5;color:#a1a1a6;margin:20px 0 0;max-width:44ch}
.k-close-line{margin-bottom:36px}
.k-episodes-copy .k-line{margin:0 0 12px}

/* How it works */
.k-how{list-style:none;padding:0;margin:48px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1000px;counter-reset:how}
.k-how li{position:relative;background:#fff;border-radius:var(--radius);padding:36px 28px 32px;display:grid;justify-items:center;gap:14px;text-align:center}
.k-how .k-glyph{width:56px;height:56px;color:var(--link)}
.k-how h3{font-size:21px;letter-spacing:-.02em;margin:0}
.k-how p{font-size:15px;color:var(--sub);margin:0;max-width:28ch}
.k-how-n{position:absolute;top:18px;left:20px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--surface);font-size:13px;font-weight:700;color:var(--sub)}
@media(max-width:734px){.k-how{grid-template-columns:1fr}}

/* App Capabilities */
.k-caps table{min-width:520px}
.k-caps thead th{font-size:14px;color:var(--sub);font-weight:600;border-bottom-color:var(--line)}
.k-caps td{text-align:center;width:12%}
.k-caps tbody th a{color:var(--ink);text-decoration:none;font-weight:500}
.k-caps tbody th a:hover{text-decoration:underline}
.k-tick{width:18px;height:18px;fill:none;stroke:var(--link);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.k-dash{color:#c7c7cc}
.k-caps-section{padding-top:96px!important}

/* Multiview and press */
.k-mv-loop{max-width:1080px;margin:40px auto 0}
.k-files{list-style:none;padding:0;margin:0 auto;max-width:720px;text-align:left}
.k-files li{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px}
.k-files span{color:var(--sub);font-size:14px}

/* Real screens as proof beside a claim, and portrait walkthroughs */
.k-proof{margin:28px 0 0;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 0 0 1px #ffffff1a;max-width:460px}
.k-proof-phone{max-width:260px;border-radius:26px;box-shadow:0 0 0 1px #0000001a}
.k-proof-phone img{aspect-ratio:9/12;object-fit:cover;object-position:50% 0}
.k-steps-portrait{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.k-steps-portrait .k-steps-frame{aspect-ratio:720/1033;width:min(100%,400px);margin:0 auto;border-radius:34px;top:calc(50vh - 290px)}
.k-steps-portrait .k-steps-pane img{object-position:50% 0}
.k-steps-portrait .k-steps-inline{max-width:340px;border-radius:28px;aspect-ratio:720/1033}
.k-steps-portrait .k-steps-inline img{height:100%;object-fit:cover;object-position:50% 0}
.crop-mid{object-position:50% 45%}

/* Player: Automatic sends each format to a player */
.k>.k-player{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:56px;align-items:center;text-align:left}
.k-player .k-title,.k-player .k-line{margin-left:0}
.k-router{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-top:44px;max-width:480px}
.k-router ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;align-content:center}
.k-router-in{grid-template-columns:auto auto}
.k-router li{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;font-weight:600;padding:7px 14px;border-radius:999px;border:1px solid #3a3a3e;color:#8e8e93;transition:color .4s ease,border-color .4s ease,box-shadow .4s ease}
.k-router li svg{width:14px;height:14px;fill:none;stroke:var(--glow);stroke-width:2;opacity:0;transition:opacity .4s ease}
.k-router li.on{color:#fff;border-color:var(--glow);box-shadow:0 0 18px #6ab0ff4d}
.k-router li.on svg{opacity:1}
.k-router-core{position:relative;display:grid;justify-items:center;gap:8px}
.k-router-core img{width:56px;height:56px;border-radius:13px;position:relative;z-index:1}
.k-router-auto{font-size:12px;color:#a1a1a6}
.k-router-beam{position:absolute;top:27px;left:-24px;right:-24px;height:2px;background:linear-gradient(90deg,transparent,var(--glow),transparent);opacity:0}
.k-router.pulse .k-router-beam{animation:k-beam .9s ease}
@keyframes k-beam{0%{opacity:0;transform:scaleX(.2)}40%{opacity:1}100%{opacity:0;transform:scaleX(1)}}
.k-player-device{margin:0}
.k-player-device .mock{width:100%}

/* Next episode: the picture, a countdown on a glowing button */
.k>.k-episodes{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:56px;align-items:center;text-align:left}
.k-episodes .k-title{margin-left:0}
.k-next{position:relative;margin:0;border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:16/9}
.k-next img{width:100%;height:100%;object-fit:cover}
.k-next::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,#000c)}
.k-next figcaption{position:absolute;left:28px;bottom:88px;z-index:1;color:#fff;font-size:15px;font-weight:600}
.k-next-btn{position:absolute;left:24px;bottom:24px;z-index:1;display:inline-flex;align-items:center;gap:10px;padding:8px 20px 8px 8px;border-radius:999px;border:1px solid #ffffff59;background:#ffffff2e;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:#fff;font:600 16px/1 var(--body);cursor:pointer;box-shadow:0 0 22px #6ab0ff80}
.k-next-btn:hover{background:#ffffff40}
.k-next-btn svg{width:36px;height:36px;transform:rotate(-90deg)}
.k-next-btn .ring-bg{fill:none;stroke:#ffffff40;stroke-width:3}
.k-next-btn .ring{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.k-next-btn .tri{fill:#fff;transform:rotate(90deg);transform-origin:22px 22px}
.k-next.run .ring{stroke-dashoffset:100;transition:stroke-dashoffset 10s linear}
.k-next.reset .ring{transition:none}
@media(prefers-reduced-motion:no-preference){.k-next-btn{animation:k-btn 2.6s ease-in-out infinite}}
@keyframes k-btn{0%,100%{box-shadow:0 0 18px #6ab0ff66}50%{box-shadow:0 0 34px #6ab0ffcc}}

/* Organise: cards scroll sideways */
.k-carousel{margin-top:48px;text-align:left}
.k-carousel-track{display:grid;grid-auto-flow:column;grid-auto-columns:min(360px,78%);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 8px;scrollbar-width:none}
.k-carousel-track::-webkit-scrollbar{display:none}
.k-card{scroll-snap-align:start;background:var(--card);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.k-card-media{aspect-ratio:4/3;position:relative;overflow:hidden;background:#000}
.k-card-media>img,.k-card-media>.k-from-film{width:100%;height:100%;object-fit:cover}
.k-card h3{font-size:22px;line-height:1.15;letter-spacing:-.022em;margin:0;padding:24px 28px 30px}
.k-card-ink .k-card-media{display:grid;place-items:center;color:var(--glow)}
.k-carousel-nav{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}
.k-carousel-nav button{width:40px;height:40px;border-radius:50%;border:0;background:#e3e3e8;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.k-carousel-nav button:hover{background:#d6d6db}
.k-carousel-nav button:disabled{opacity:.4;cursor:default}
.k-carousel-nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Devices: one tab per Apple platform */
.k-tablist{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:4px;border-radius:999px;background:var(--surface);margin:28px auto 56px}
.k-tablist button{border:0;background:transparent;font:600 15px/1 var(--body);padding:11px 22px;border-radius:999px;color:var(--sub);cursor:pointer}
.k-tablist button[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px #0000001f}
.k-panel[hidden]{display:none}
.k-panel{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);gap:56px;align-items:center;text-align:left}
.js .k-panel+.k-panel{margin-top:0}
.k-panel+.k-panel{margin-top:72px}
.k-panel-media{display:grid;justify-items:center;gap:28px}
.k-panel-media .mock{width:100%;max-width:680px}
.k-panel-ipad .mock{width:auto;max-height:560px;max-width:100%}
.k-panel-iphone .mock{width:auto;max-height:560px;max-width:100%}
.k-panel-copy ul{list-style:none;padding:0;margin:0 0 28px}
.k-panel-copy li{font-size:21px;font-weight:600;letter-spacing:-.018em;padding:14px 0;border-bottom:1px solid var(--line)}
.k-keys{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 32px}
.k-keys p{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0}
.k-keys .keys{display:flex;gap:6px}
.k-keys kbd{display:inline-grid;place-items:center;min-width:48px;height:48px;padding:0 12px;border-radius:11px;background:#fff;border:1px solid #d2d2d7;box-shadow:0 3px 0 #d2d2d7;font:500 18px/1 var(--body);color:var(--ink);transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.k-keys kbd:only-child{min-width:140px}
.k-keys .label{font-size:13px;color:var(--sub)}
.k-keys p.press kbd{transform:translateY(3px);box-shadow:0 0 0 #d2d2d7;background:#eef5ff}

/* Sync: three devices at true relative size, then "Synced." (scrolls sideways when narrow) */
.k-sync{overflow-x:auto;margin-top:56px;scrollbar-width:none}
.k-trio{display:grid;grid-template-columns:385.6fr 221.3fr 74.6fr;gap:3%;align-items:end;width:min(100%,1000px);min-width:940px;margin:0 auto}
.k-trio .mock{width:100%}
.k-synced{display:grid;justify-items:center;gap:20px;margin:48px auto 24px}
.k-sync-line{display:block;width:min(70%,640px);height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--glow),transparent)}
.k-sync-word{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;letter-spacing:-.035em}
@media(prefers-reduced-motion:no-preference){
  .js .k-sync-line{transform:scaleX(0);transition:transform 1.4s var(--ease)}
  .js .k-sync-word{opacity:0;filter:blur(10px);transition:opacity .9s ease 1.1s,filter .9s ease 1.1s,text-shadow 1.2s ease 1.6s}
  .js .k-sync.in .k-sync-line{transform:none}
  .js .k-sync.in .k-sync-word{opacity:1;filter:none;text-shadow:0 0 28px #6ab0ff66}
}

/* Every feature */
.k-index{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:40px 32px;margin:56px 0 40px;text-align:left}
.k-index h3{font-size:15px;color:var(--sub);font-weight:600;margin:0 0 12px}
.k-index ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.k-index a{display:inline-flex;gap:8px;align-items:center;padding:8px 14px;border-radius:999px;background:#fff;color:var(--ink);font-size:15px;text-decoration:none;box-shadow:0 0 0 1px #0000000a}
.k-index a:hover{box-shadow:0 0 0 1px var(--line)}
.k-badge-plus{font-size:11px;font-weight:700;color:#fff;background:linear-gradient(135deg,#a8771f,#e2b85c);padding:2px 8px;border-radius:999px}

/* Film */
.k-film video{display:block;width:min(100%,1080px);margin:16px auto 0;aspect-ratio:16/9;border-radius:20px;background:#111}

/* Compare */
.k-table{overflow-x:auto;margin:48px auto 28px;text-align:left}
.k-table table{width:100%;min-width:760px;border-collapse:collapse;font-size:15px;line-height:1.45}
.k-table th,.k-table td{padding:18px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.k-table thead th{font-size:17px;font-weight:650;border-bottom-color:var(--ink)}
.k-table tbody th{font-weight:600;width:18%}
.k-table td{color:var(--sub)}
.k-table td:nth-child(2){color:var(--ink);font-weight:500}

/* Plans, in the owner's words */
.k-plans{display:grid;grid-template-columns:1fr 1.25fr;gap:20px;max-width:900px;margin:48px auto 0;text-align:left}
.k-plan{background:#fff;border-radius:var(--radius);padding:36px;display:flex;flex-direction:column}
.k-plan h3{font-size:28px;letter-spacing:-.03em;margin:0 0 8px}
.k-plan-lead{font-size:19px;font-weight:650;margin:0 0 20px}
.k-plan-plus{box-shadow:inset 0 0 0 2px var(--link)}
.k-plan-plus .k-plan-lead{color:var(--link)}
.k-plan-price{font-size:17px;margin:16px 0 20px;min-height:1.5em}
.k-plan ul{list-style:none;padding:0;margin:0}
.k-plan li{padding:12px 0;border-top:1px solid var(--line);font-size:16px}
.k-billing{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--surface);align-self:flex-start}
.k-billing button{border:0;background:transparent;font:600 14px/1 var(--body);padding:9px 16px;border-radius:999px;color:var(--sub);cursor:pointer}
.k-billing button[aria-checked="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px #0000001f}

/* FAQ */
.k-faq{max-width:820px;margin:40px auto 0;text-align:left}
.k-faq details{border-bottom:1px solid var(--line)}
.k-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:21px;font-weight:600;letter-spacing:-.018em;padding:24px 0}
.k-faq summary::-webkit-details-marker{display:none}
.k-faq summary::after{content:"+";font-size:28px;font-weight:300;color:var(--sub);transition:transform .25s ease}
.k-faq details[open] summary::after{transform:rotate(45deg)}
.k-faq p{font-size:17px;line-height:1.55;color:var(--sub);margin:0 0 24px;max-width:66ch}

/* Close */
.k-close{padding-bottom:150px!important}
.k-close .k-title{margin-bottom:16px}

/* Reveals */
@media(prefers-reduced-motion:no-preference){
  .k-hero-title .w{animation:k-in 1.1s var(--ease) .15s both}
  .k-hero-title .w:nth-child(2){animation-delay:.55s}
  .k-hero .k-sub{animation:k-fade .9s ease 1s both}
  .k-hero .k-actions{animation:k-fade .9s ease 1.2s both}
  .js .reveal .w{opacity:0;filter:blur(12px);transform:translateY(.25em);transition:opacity 1s ease,filter 1s ease,transform 1s var(--ease)}
  .js .reveal .w:nth-child(2){transition-delay:.2s}
  .js .reveal.in .w{opacity:1;filter:none;transform:none}
  .js .stagger>*{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s var(--ease)}
  .js .stagger.in>*{opacity:1;transform:none}
  .js .stagger>:nth-child(2){transition-delay:.06s}.js .stagger>:nth-child(3){transition-delay:.12s}.js .stagger>:nth-child(4){transition-delay:.18s}.js .stagger>:nth-child(5){transition-delay:.24s}.js .stagger>:nth-child(6){transition-delay:.3s}.js .stagger>:nth-child(n+7){transition-delay:.36s}
}
.k-hero-title.reveal .w{opacity:1;filter:none;transform:none}
@keyframes k-in{from{opacity:0;filter:blur(14px);transform:translateY(.22em)}to{opacity:1;filter:none;transform:none}}
@keyframes k-fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:1000px){
  .k>.k-player,.k>.k-episodes,.k-split,.k-panel{grid-template-columns:1fr;text-align:center;gap:40px}
  .k-player .k-title,.k-player .k-line,.k-episodes .k-title{margin-left:auto}
  .k-router{margin-left:auto;margin-right:auto}
  .k-steps{grid-template-columns:1fr}
  .k-steps-media{display:none}
  .k-steps-list li{min-height:0;padding:28px 0;opacity:1!important}
  .k-steps-inline{display:block;border-radius:16px;overflow:hidden;margin-top:12px;background:#000}
  .k-bento{grid-template-columns:1fr 1fr}
  .k-xl,.k-wide{grid-column:span 2}
}
@media(max-width:734px){
  .k>section{padding-block:80px}
  .k-hero{padding-top:44px!important;padding-bottom:64px!important}
  .k-hero-title{font-size:clamp(2rem,9vw,3rem)}
  .k-bento{grid-template-columns:1fr}
  .k-xl,.k-wide{grid-column:auto}.k-xl,.k-tall{grid-row:auto}
  .k-tile-media{aspect-ratio:16/10;flex:none}
  .k-tall .k-tile-media{aspect-ratio:3/4}
  .k-plans{grid-template-columns:1fr}
  .k-plan{padding:28px}
  .k-faq summary{font-size:18px}
  .k-tablist button{padding:10px 14px}
  .k-next figcaption{left:20px;bottom:74px}.k-next-btn{left:16px;bottom:16px}
}
@media(prefers-reduced-motion:reduce){.k *{transition:none!important;animation:none!important}}
.k-mac-keys .k-carousel-nav{display:none}

/* Sync: Apple's every-screen pattern, the same Continue Watching on each device */
.k-sync-section .k-family{margin-top:48px}

/* All Features: UHF's "The Good stuff" (big capture cards, then cells) and Apple's lineup filter */
.k-filter{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:2px;padding:4px;border-radius:999px;background:#e8e8ed;margin:0 auto 18px}
.k-filter button{font:500 14px/1 var(--body);border:0;background:none;color:var(--ink);padding:10px 18px;border-radius:999px;cursor:pointer}
.k-filter button[aria-pressed="true"]{background:var(--ink);color:#fff}
.k-filter button:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.k-gs{display:grid;gap:64px;margin-top:48px;text-align:left}
.k-gs-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.k-gs-card{grid-column:span 3;background:var(--card);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;scroll-margin-top:24px}
.k-feature-group:not(.k-band) .k-gs-card{background:var(--surface)}
.k-gs-third{grid-column:span 2}
.k-gs-wide{grid-column:span 6;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center}
.k-gs-media{position:relative;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(#ececf0,#e2e2e7)}
.k-gs-fill>img,.k-gs-fill>video,.k-gs-fill>.k-from-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-gs-fit{display:grid;place-items:center;padding:7%}
.k-gs-fit>img{width:100%;height:auto;border-radius:14px}
.k-gs-phone>img,.k-gs-tablet>img{position:absolute;left:50%;top:9%;height:auto;transform:translateX(-50%)}
.k-gs-phone>img{width:34%;border-radius:12.5% 12.5% 0 0/5.8% 5.8% 0 0}
.k-gs-tablet>img{width:46%;border-radius:4% 4% 0 0/3% 3% 0 0}
.k-gs-text{padding:26px 30px 30px;display:flex;flex-direction:column;gap:10px;flex:1}
.k-gs-text h3,.k-gs-cell h3{font-size:24px;letter-spacing:-.025em;line-height:1.15;margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.k-gs-big .k-gs-text h3,.k-gs-wide .k-gs-text h3{font-size:clamp(24px,2.4vw,30px)}
.k-gs-text p,.k-gs-cell p{font-size:16px;line-height:1.5;color:var(--sub);margin:0;max-width:52ch}
.k-gs-wide .k-gs-text{padding:40px 44px}
.k-gs-cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 36px}
.k-gs-cell{border-top:1px solid var(--line);padding-top:22px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:24px}
.k-gs-cell h3{font-size:19px;letter-spacing:-.02em}
.k-gs-cell p{font-size:15px}
.k-gs-card:target,.k-gs-cell:target{outline:2px solid var(--link);outline-offset:4px}
.k-gs [hidden],[data-gs-group][hidden]{display:none!important}
.k-feature-group .k-credit{margin-top:48px}
@media(max-width:1000px){.k-gs-cells{grid-template-columns:1fr 1fr}.k-gs-third{grid-column:span 3}.k-gs-wide{grid-template-columns:1fr 1fr}}
@media(max-width:734px){
  .k-gs-cards,.k-gs-cells{grid-template-columns:1fr}
  .k-gs-card,.k-gs-third,.k-gs-wide{grid-column:auto}
  .k-gs-wide{display:flex}
  .k-gs-text,.k-gs-wide .k-gs-text{padding:22px 24px 26px}
  .k-gs-big .k-gs-text h3,.k-gs-wide .k-gs-text h3,.k-gs-text h3{font-size:22px}
  .k-gs-phone>img{width:42%}
  .k-filter button{padding:9px 13px}
}
.k-feature-group:not(.k-band) .k-gs .k-devices-list li{background:#fff}
.k-gs-cell .k-devices-list li{background:#fff}
.k-feature-group:not(.k-band) .k-gs-cell .k-devices-list li{background:var(--surface)}
.k-gs-end>img{top:auto;bottom:9%;border-radius:0 0 12.5% 12.5%/0 0 5.8% 5.8%}
@media(max-width:734px){
  .k-pills,.k-filter{display:flex;flex-wrap:nowrap;overflow-x:auto;max-width:max-content;justify-content:flex-start;scrollbar-width:none;margin-left:auto;margin-right:auto}
  .k-pills::-webkit-scrollbar,.k-filter::-webkit-scrollbar{display:none}
  .k-pills a,.k-filter button{flex:none}
}

/* Plus on the pricing page: Plex's "Go all in with Plex Pass" (a dark bento of what the plan adds) */
.k-plus-bento .k-tile{background:linear-gradient(165deg,#2b2416 0%,#161616 55%)}
.k-plus-bento .k-tile-copy{color:#a1a1a6}.k-plus-bento .k-tile-copy strong{color:#f5f5f7}
.k-plus-bento .k-tile-ink .k-tile-media{color:var(--gold)}
.k-plus-bento .k-bento{margin-bottom:40px}
/* A page hero followed by another white section needs no second top margin */
.k>.k-page-hero+section:not(.k-band):not(.k-dark){padding-top:8px}
/* A single feature group reads as one centred row of chips, not a narrow column */
.k-index-one{display:block;max-width:860px;margin-left:auto;margin-right:auto;text-align:center}
.k-index-one ul{justify-content:center}
.k-tile-media:has(>.crop-sheet){overflow:hidden}.k-tile-media .crop-sheet{object-position:50% 50%;transform:scale(2.2)}

/* Statement scenes: Teevo's own controls rebuilt around each line (kit.mjs, scenes) */
.k-scene{position:absolute;inset:0;overflow:hidden;font-size:clamp(10px,.92vw,15px);line-height:1.3;color:#f5f5f7;text-align:left}
.k-scene::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 36% 24% at 50% 50%,#000c,#0000 100%);pointer-events:none}
.k-scene-still{position:absolute;inset:-6%;width:112%;height:112%;object-fit:cover;filter:blur(30px) saturate(1.25);opacity:.5}
.k-ui{position:absolute;z-index:1;background:#1c1c1ee8;border:1px solid #ffffff1a;border-radius:1.6em;box-shadow:0 2.4em 6em #000b;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);opacity:0;transform:translateY(2.4em) scale(.96);transition:opacity .9s ease,transform 1.1s var(--ease)}
.on .k-ui{opacity:1;transform:none}
.on .k-ui:nth-child(3){transition-delay:.15s}.on .k-ui:nth-child(4){transition-delay:.3s}.on .k-ui:nth-child(5){transition-delay:.45s}
.k-ui svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.k-ui svg.f{fill:currentColor;stroke:none}
.k-ui-pad{padding:1.2em 1.3em 1.3em;display:grid;gap:.65em}
.k-ui-art{aspect-ratio:2.1;overflow:hidden;border-radius:1.6em 1.6em 0 0}
.k-ui-art img{width:100%;height:100%;object-fit:cover;display:block}
.k-ui-h{font-size:1.9em;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.k-ui-h2{font-size:1.25em;font-weight:650;letter-spacing:-.01em}
.k-ui-center{text-align:center}
.k-ui-meta{color:#a1a1a6}
.k-ui-row{display:flex;gap:.6em;align-items:center;min-width:0}
.k-ui-btn{display:inline-flex;align-items:center;gap:.45em;padding:.6em 1.25em;border-radius:999px;background:#ffffff26;font-weight:600}
.k-ui-round{width:2.5em;height:2.5em;border-radius:50%;background:#ffffff26;display:grid;place-items:center}
.k-ui-round svg{width:1.1em;height:1.1em}
.k-ui-focus{background:#fff!important;color:#000;animation:k-ui-focus 2.8s ease-in-out infinite}
.k-ui-focus small,.k-ui-focus em{color:#3a3a3c!important}
@keyframes k-ui-focus{0%,100%{box-shadow:0 .4em 1.4em #0007,0 0 0 0 #ffffff40}50%{box-shadow:0 .7em 2em #0009,0 0 0 .4em #ffffff1c}}
.k-ui-avatar{width:2.7em;height:2.7em;border-radius:50%;background:#3a3a3c;display:grid;place-items:center;font-weight:600;flex:none}
.k-ui-label{font-size:.85em;font-weight:600;color:#a1a1a6;margin-top:.15em}
.k-ui-card{display:grid;gap:.15em;width:10em}
.k-ui-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.8em;display:block}
.k-ui-card span{font-size:.9em;font-weight:600;margin-top:.3em}.k-ui-card small{color:#8e8e93;font-size:.8em}
.k-ui-card.k-ui-wide{width:100%;position:relative}
.k-ui-card.k-ui-wide .k-ui-bar{position:relative;margin:-.9em .7em .4em}
.k-ui-field{display:flex;align-items:center;gap:.55em;padding:.6em .95em;border-radius:999px;background:#ffffff1a}
.k-ui-field svg{width:1.15em;height:1.15em;color:#a1a1a6}
.k-ui-line{display:grid;grid-template-columns:6.4em minmax(0,1fr);gap:.45em}
.k-ui-ch{display:grid;justify-items:center;align-content:center;gap:.1em;padding:.55em .4em;border-radius:.9em;background:#ffffff12;font-size:.85em;font-weight:600;text-align:center}
.k-ui-ch svg{width:1.7em;height:1.7em;color:#8e8e93;stroke-width:1.2}
.k-ui-ch small{color:#8e8e93;font-weight:500}
.k-ui-line>span:last-child{display:grid;align-content:center;gap:.25em;padding:.55em .85em;border-radius:.9em;background:#ffffff12;min-width:0}
.k-ui-line b{font-size:1.05em}.k-ui-line small{color:#a1a1a6}
.k-ui-bar{display:block;height:.3em;border-radius:9px;background:#ffffff33;overflow:hidden}
.k-ui-bar>i{display:block;height:100%;width:38%;background:#fff;border-radius:inherit}
.k-ui-bar-short>i{width:14%}
.k-ui-opt{display:flex;align-items:center;gap:.6em;padding:.62em .9em;border-radius:.9em;background:#ffffff12;font-weight:500;min-width:0}
.k-ui-opt em{margin-left:auto;font-style:normal;color:#a1a1a6;display:flex;align-items:center;gap:.25em}
.k-ui-opt>small{margin-left:auto;color:#a1a1a6}
.k-ui-opt>span{display:grid;gap:.1em;min-width:0}
.k-ui-opt>span small{color:#a1a1a6;font-size:.82em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-ui-opt>svg{width:1.25em;height:1.25em;color:#a1a1a6}
.k-ui-off{color:#636366}
.k-ui-chip{display:inline-block;padding:.22em .6em;border-radius:.5em;border:1px solid #64d2ff73;color:#64d2ff;font-size:.85em;font-weight:600}
.k-ui-add{display:flex;align-items:center;gap:.5em;color:#0a84ff;font-weight:500;padding:.2em .9em}
.k-ui-chan{display:grid;gap:.4em;padding:.8em .9em;border-radius:1em;background:#ffffff12;flex:1;min-width:0}
.k-ui-chan .k-ui-ch{display:flex;justify-items:start;justify-content:flex-start;gap:.45em;padding:0;background:none;text-align:left}
.k-ui-chan .k-ui-ch svg{width:1.4em;height:1.4em}
.k-ui-chan small{color:#8e8e93;font-size:.8em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-ui-reel{display:block;overflow:hidden;border-radius:.8em;-webkit-mask-image:linear-gradient(90deg,#000 78%,#0000);mask-image:linear-gradient(90deg,#000 78%,#0000)}
.k-ui-drift{display:flex;width:max-content;animation:k-ui-drift 48s linear infinite}
.k-ui-drift img{width:6.6em;aspect-ratio:2/3;object-fit:cover;border-radius:.6em;margin-right:.6em;display:block}
@keyframes k-ui-drift{to{transform:translateX(-50%)}}
.k-ui-video{overflow:hidden}
.k-ui-video video{display:block;width:100%;aspect-ratio:2.35;object-fit:cover}
.k-ui-chrome{position:absolute;left:0;right:0;bottom:0;padding:3em 1.3em .9em;background:linear-gradient(#0000,#000d);display:grid;grid-template-columns:1fr auto;gap:.55em;align-items:end}
.k-ui-chrome b{font-size:1.55em;letter-spacing:-.01em}
.k-ui-icons{display:flex;gap:.45em}
.k-ui-icons svg{width:2.2em;height:2.2em;padding:.55em;border-radius:50%;background:#ffffff2e}
.k-ui-chrome .k-ui-bar{grid-column:1/-1}
.k-ui-chrome .k-ui-bar>i{width:31%}
.k-ui-times{grid-column:1/-1;display:flex;justify-content:space-between;color:#d1d1d6;font-size:.8em;margin-top:-.3em}
.k-ui-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;text-align:center;gap:.5em}
.k-ui-head .k-ui-round svg{transform:rotate(180deg)}
.k-ui-done{padding:.45em .95em;border-radius:999px;background:#ffffff26;font-weight:600}
.k-ui-foot{color:#8e8e93;font-size:.8em;line-height:1.4;margin-top:.2em}
.k-ui-formats .k-ui-pad{display:flex;flex-wrap:wrap;gap:.55em}
.k-ui-formats .k-ui-chip{font-size:1.05em;padding:.4em .85em}
.k-ui-tag{position:absolute;left:1.3em;top:-1.15em;padding:.32em .85em;border-radius:999px;background:#0a84ff;color:#fff;font-size:.8em;font-weight:600;box-shadow:0 .3em 1em #0a84ff66;white-space:nowrap}
.k-statements-bg .k-ui .k-pause{right:.9em;bottom:auto;top:.9em}
/* Where each panel sits: the corners, leaving the middle to the line */
.k-ui-title{left:4.5%;top:8%;width:28%}.k-ui-person{right:5.5%;top:11%;width:21%}.k-ui-search{left:7%;bottom:7%;width:25%}.k-ui-watch{right:4.5%;bottom:8%;width:24%}
.k-ui-continue{left:5%;top:11%;width:22%}.k-ui-recent{right:4.5%;top:10%;width:31%}.k-ui-sources{left:5.5%;bottom:6%;width:26%}.k-ui-posters{right:4.5%;bottom:11%;width:33%}
.k-ui-video{left:4%;top:9%;width:38%}.k-ui-players{right:5%;top:10%;width:24%}.k-ui-formats{right:7%;bottom:14%;max-width:28%}.k-ui-skipping{left:6%;bottom:6%;width:22%}
@media(max-width:734px){
  .k-scene{font-size:10px}
  .k-scene .k-ui:not(.k-ui-phone){display:none}
  .k-ui-title,.k-ui-continue,.k-ui-video{left:5%;right:5%;top:6%;width:auto}
  .k-ui-search,.k-ui-sources,.k-ui-players{left:5%;right:5%;top:auto;bottom:4%;width:auto}
}
.k-ui-toggle{margin-left:auto;width:2.6em;height:1.55em;border-radius:999px;background:#ffffff2e;position:relative;flex:none}
.k-ui-toggle::after{content:"";position:absolute;top:.15em;left:.15em;width:1.25em;height:1.25em;border-radius:50%;background:#fff;box-shadow:0 .1em .3em #0006}
.k-ui-toggle-on{background:#30d158}.k-ui-toggle-on::after{left:auto;right:.15em}
.k-ui-focus .k-ui-toggle{background:#30d158}
/* One line on screen at a time, so the next never crosses a panel */
.k-statements-list{gap:72vh}
.k-statements .k-credit{color:#86868b;position:relative}

/* Rebuilt single controls inside cards: same panel style, static, sized to the card */
.k-know-ui{padding:0 18px 70px;align-items:start}
.k-ui-static{position:relative;opacity:1;transform:none;width:100%;font-size:11.5px;box-shadow:0 1.6em 4em #000c;-webkit-backdrop-filter:none;backdrop-filter:none;background:#1c1c1e;color:#f5f5f7;text-align:left;line-height:1.3}
.k-ui-whos{background:#fff;color:#1d1d1f;border-color:#0000}
.k-ui-whos .k-ui-pad{gap:1em;padding-bottom:2em}
.k-ui-close{justify-self:start;padding:.5em 1em;border-radius:999px;background:#f2f2f7;font-weight:500}
.k-ui-people{display:flex;justify-content:center;gap:2.2em;margin-top:1.4em}
.k-ui-who{display:grid;justify-items:center;gap:.6em;font-weight:600;font-size:1.1em}
.k-ui-face{width:5em;height:5em;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#a1a1a6,#8e8e93);color:#fff;font-size:1.25em;font-weight:500}
.k-ui-face-cat{background:linear-gradient(#e0a43a,#c47f12)}
.k-ui-face-cat svg{width:3.4em;height:3.4em;color:#fff}
.k-ui-p1{animation:k-ui-pick 5s ease-in-out infinite}.k-ui-p2{animation:k-ui-pick 5s ease-in-out -2.5s infinite}
@keyframes k-ui-pick{0%,42%{transform:scale(1.12)}50%,92%{transform:none}100%{transform:scale(1.12)}}
.k-ui-tick{width:1.5em;height:1.5em;border-radius:50%;background:#0a84ff;display:grid;place-items:center;color:#fff;flex:none}
.k-ui-tick svg{width:.95em;height:.95em;stroke-width:2.2}
.k-ui-order{display:grid;gap:.45em}
.k-ui-order .k-ui-opt em svg{width:1.3em;height:1.3em}
.k-ui-o2{animation:k-ui-drag 6s var(--ease) infinite}
@keyframes k-ui-drag{0%,28%{transform:none;box-shadow:none;opacity:1}38%{transform:scale(1.03);box-shadow:0 .8em 2em #000a}52%,58%{transform:translateY(-110%) scale(1.03);box-shadow:0 .8em 2em #000a}66%,86%{transform:translateY(-110%);box-shadow:none;opacity:1}90%{transform:translateY(-110%);opacity:0}94%{transform:none;opacity:0}100%{transform:none;opacity:1}}
.k-ui-o1{animation:k-ui-drop 6s var(--ease) infinite}
@keyframes k-ui-drop{0%,38%{transform:none;opacity:1}52%,86%{transform:translateY(110%);opacity:1}90%{transform:translateY(110%);opacity:0}94%{transform:none;opacity:0}100%{transform:none;opacity:1}}

/* Bento tiles that show one rebuilt control (kit.mjs, uiTile); type scales with the tile */
.k-tile-ui{container-type:size;background:#0b0b0d;overflow:hidden}
.k-tui{position:absolute;inset:0;padding:5.5cqmin 6cqmin;font-size:clamp(8px,min(2.4cqw,4.2cqh),15px);line-height:1.25;color:#f5f5f7;text-align:left;display:grid;align-content:center;gap:.55em}
.k-tui svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.k-tui-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.k-tui>*:not(.k-tui-bg){position:relative}
/* Guide */
.k-tui-guide{align-content:start;gap:.8em;font-size:clamp(8px,min(1.75cqw,3.4cqh),14px)}
.k-g-top{display:grid;grid-template-columns:7.5em 1fr auto;gap:1em;align-items:center}
.k-g-top img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.5em}
.k-g-top>span{display:grid;gap:.2em;min-width:0}.k-g-top b{font-size:1.25em}
.k-g-top small{color:#a1a1a6}.k-g-desc{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-g-clock{align-self:start;font-weight:600;color:#d1d1d6}
.k-g-grid{position:relative;display:grid;grid-template-columns:7.5em repeat(4,minmax(0,1fr));gap:.35em}
.k-g-t{font-size:.85em;color:#8e8e93;padding-bottom:.1em}
.k-g-ch{display:grid;gap:.05em;padding:.45em .6em;border-radius:.5em;background:#2c2c2e;font-weight:600;font-size:.92em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-g-ch small{color:#8e8e93;font-weight:500;font-size:.85em}
.k-g-p{display:grid;gap:.05em;align-content:center;padding:.45em .6em;border-radius:.5em;font-weight:600;font-size:.92em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .3s,color .3s}
.k-g-p small{font-weight:500;font-size:.8em;opacity:.7}
.k-g-a{background:#5a4636}.k-g-b{background:#4a3f7a}.k-g-c{background:#2f5a4a}.k-g-dim{background:#1c1c1e;color:#d1d1d6}
.k-g-s1{grid-column:span 1}.k-g-s2{grid-column:span 2}.k-g-s3{grid-column:span 3}
.k-g-now{position:absolute;top:1.3em;bottom:0;left:calc(7.5em + .35em + (100% - 7.5em - 1.4em) * .23);width:2px;background:#9ec5ff;border-radius:2px;box-shadow:0 0 .6em #6ab0ff}
.k-g-f{position:relative;isolation:isolate;animation:k-g-text 8s ease-in-out infinite}
.k-g-f::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;opacity:0;animation:k-g-focus 8s ease-in-out infinite;animation-delay:inherit}
.k-g-f2{animation-delay:2s}.k-g-f3{animation-delay:4s}.k-g-f4{animation-delay:6s}
@keyframes k-g-focus{0%,22%{opacity:1}27%,100%{opacity:0}}
@keyframes k-g-text{0%,22%{color:#000;transform:scale(1.03);box-shadow:0 .4em 1.2em #000a}27%,100%{color:#f5f5f7;transform:none;box-shadow:none}}
/* Later: reminders */
.k-tui-later{align-content:end;gap:.7em}
.k-l-now small{color:#d1d1d6}.k-l-now b{display:block;font-size:1.5em;letter-spacing:-.01em}
.k-l-cards{display:grid;grid-template-columns:1fr 1fr;gap:.6em}
.k-l-card{display:grid;gap:.1em;padding:.7em .85em;border-radius:.9em;background:#1c1c1ee6}
.k-l-card b{font-size:1.25em}.k-l-card small{color:#a1a1a6}
.k-l-card.k-ui-focus small{color:#3a3a3c}
.k-l-hint{margin:0;color:#d1d1d6;font-size:.85em}
/* Panels: lists */
.k-tui-panel{gap:.35em;align-content:center;font-size:clamp(9px,min(3.4cqw,8.4cqh),14px)}
.k-tui-panel .k-ui-opt{padding:.5em .85em}
/* Channel menu */
.k-tui-menu{gap:.1em;align-content:center;justify-items:start;padding-left:10cqw;font-size:clamp(9px,min(3.4cqw,7.6cqh),15px)}
.k-m-item{padding:.42em 1em;border-radius:999px;font-weight:500;min-width:16em;animation:k-m-focus 8s ease-in-out infinite}
.k-m-1{animation-delay:2s}.k-m-2{animation-delay:4s}.k-m-4{animation-delay:6s}
.k-m-3,.k-m-5,.k-m-6,.k-m-7{animation:none}
@keyframes k-m-focus{0%,22%{background:#fff;color:#000;box-shadow:0 .3em 1em #000a}27%,100%{background:none;color:#f5f5f7;box-shadow:none}}
/* Multiview */
.k-tui-mv{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);height:86%;aspect-ratio:16/9;max-width:92%;padding:0;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.6em}
.k-mv-tile{position:relative;min-height:0;border-radius:.7em;overflow:hidden;animation:k-mv-focus 8s ease-in-out infinite}
.k-mv-tile img{width:100%;height:100%;object-fit:cover;display:block}
.k-mv-tile em{position:absolute;left:.6em;bottom:.6em;display:flex;align-items:center;gap:.35em;padding:.25em .6em;border-radius:999px;background:#000a;font-style:normal;font-size:.85em;font-weight:600}
.k-mv-tile em svg{width:1.15em;height:1.15em;display:none}
.k-mv-tile em svg{animation:k-mv-sound 8s step-end infinite}
.k-mv-1,.k-mv-1 em svg{animation-delay:2s}.k-mv-2,.k-mv-2 em svg{animation-delay:4s}.k-mv-3,.k-mv-3 em svg{animation-delay:6s}
@keyframes k-mv-focus{0%,22%{box-shadow:0 0 0 .22em #fff,0 .6em 1.6em #000a;transform:scale(1.02)}27%,100%{box-shadow:none;transform:none}}
@keyframes k-mv-sound{0%{display:block}25%,100%{display:none}}
/* Upright live with the guide below (iPad and iPhone) */
.k-tui-upright{align-content:start;gap:.45em;padding:5cqmin 8cqmin;font-size:clamp(8px,min(3.1cqw,2.6cqh),14px)}
.k-u-pic{display:block;border-radius:.8em;overflow:hidden;aspect-ratio:16/9}
.k-u-pic img{width:100%;height:100%;object-fit:cover;display:block}
.k-u-bar{display:flex;gap:.4em;margin:.3em 0}
.k-u-row{display:grid;grid-template-columns:7.4em 1fr 1fr;gap:.35em;position:relative}
.k-u-tap::after{content:"";position:absolute;left:55%;top:50%;width:2.2em;height:2.2em;margin:-1.1em;border-radius:50%;background:#ffffff59;animation:k-u-tap 3.2s ease-out infinite}
@keyframes k-u-tap{0%,40%{transform:scale(.3);opacity:0}50%{transform:scale(.6);opacity:1}80%,100%{transform:scale(1.6);opacity:0}}
@media(prefers-reduced-motion:reduce){.k-mv-tile em svg{display:block}.k-mv-1 em svg,.k-mv-2 em svg,.k-mv-3 em svg{display:none}}
@media(max-width:734px){
  .k-tile-media.k-tile-ui{aspect-ratio:auto;flex:none;height:230px}
  .k-xl .k-tile-media.k-tile-ui{height:300px}
  .k-wide .k-tile-media.k-tile-ui{height:220px}
  .k-tall .k-tile-media.k-tile-ui{height:400px}
}
@media(max-width:734px){.k-wide{grid-row:auto}.k-tall.k-tile-ink .k-tile-media:not(.k-tile-ui){aspect-ratio:16/9}}
/* A control tile on a phone has a set height, so it must never also carry an aspect-ratio: Safari
   sizes a stretched flex item from its ratio (400 px tall at 16:9 is 711 px wide) where Chrome
   stretches it, and the control sat off the right of the tile on iPhone. Its width is the tile's. */
@media(max-width:734px){.k-tile-media.k-tile-ui{width:100%;aspect-ratio:auto}}
/* A scene's control on its own in a tile */
.k-tui-piece{display:grid;place-items:center;align-content:center;padding:5cqmin 6cqmin;font-size:clamp(7px,min(2.5cqw,3.3cqh),15px)}
.k-ui.k-ui-in{font-size:inherit;width:min(100%,32em);max-height:100%;overflow:hidden;box-shadow:0 1.2em 3em #000c}
.k-ui.k-ui-in-video{width:min(100%,48em)}
.k-ui.k-ui-in-title{width:min(100%,30em)}
/* Small tiles show the top of the control at a readable size, fading out below */
.k-sq .k-tui-piece{font-size:clamp(9px,min(3cqw,6cqh),13px);align-content:start;padding-top:7cqmin;-webkit-mask-image:linear-gradient(#000 78%,#0000);mask-image:linear-gradient(#000 78%,#0000)}
.k-sq .k-ui.k-ui-in{max-height:none;overflow:visible}
.k-ui-in .k-ui-card.k-ui-wide img{max-height:9em}
.k-tall .k-tui-piece{font-size:clamp(9px,min(3.3cqw,2.7cqh),14px)}
/* "Powered by AI" on the episodes section: an Apple Intelligence-style gradient badge and the app's own line */
.k-ai{display:grid;justify-items:start;gap:10px;margin:28px 0 0;max-width:40ch;font-size:15px;line-height:1.5;color:var(--sub)}
.k-ai-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 11px;border-radius:999px;font-size:14px;font-weight:650;color:#fff;background:linear-gradient(100deg,#ff6a3d,#e84393 30%,#8a5cf6 65%,#3a8dff);box-shadow:0 6px 22px #8a5cf640}
.k-ai-badge svg{width:15px;height:15px;fill:currentColor}
@media(max-width:1000px){.k-ai{justify-items:center;margin-left:auto;margin-right:auto;text-align:center}}
.k-ui-ok{color:#30d158!important}.k-ui-ok svg{stroke-width:2.2}
.k-ui-signin{display:grid;justify-items:center;gap:.6em;margin-top:.4em;padding:1em;border-radius:1em;background:#ffffff0d}
.k-ui .k-ui-qr{width:7.5em;height:7.5em;padding:.5em;border-radius:.6em;background:#fff;fill:#000;stroke:none}
.k-ui-signin small{color:#a1a1a6;text-align:center}
.k-ui-pin{display:grid;justify-items:center;gap:.7em;margin-top:.5em;padding:1.1em 1em;border-radius:1em;background:#ffffff0d;text-align:center}
.k-ui-pin b{font-size:1.15em}.k-ui-pin small{color:#a1a1a6;line-height:1.35}
.k-ui-dots{display:flex;gap:.9em}
.k-ui-dots i{width:.95em;height:.95em;border-radius:50%;border:.12em solid #f5f5f7;animation:k-ui-pin 4.8s steps(1) infinite}
.k-ui-dots i:nth-child(2){animation-delay:.6s}.k-ui-dots i:nth-child(3){animation-delay:1.2s}.k-ui-dots i:nth-child(4){animation-delay:1.8s}
@keyframes k-ui-pin{0%{background:#0000}12%,70%{background:#f5f5f7}100%{background:#0000}}
/* Statements: the screen wall (real screens from every device, whole, drifting) */
.k-wall{position:absolute;inset:0;overflow:hidden;background:#000}
.k-wall::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(#000 0%,#0000 4%,#0000 34%,#000e 44%,#000e 56%,#0000 66%,#0000 96%,#000 100%)}
.k-wall-row{position:absolute;left:0;display:flex;align-items:center;width:max-content;height:31vh;animation:k-wall 90s linear infinite}
.k-wall-top{top:5vh}.k-wall-bottom{bottom:5vh;animation-direction:reverse;animation-duration:100s}
.k-wall-row img{height:100%;width:auto;margin-right:2.2vh;border-radius:1.4vh;display:block;opacity:.92;box-shadow:0 0 0 1px #ffffff26,0 1vh 4vh #000c;background:#111}
.k-wall-row img.k-wall-tall{border-radius:2.4vh}
@keyframes k-wall{to{transform:translateX(-50%)}}
.k-statements-layer:not(.on) .k-wall-row{animation-play-state:paused}
@media(max-width:734px){.k-wall-row{height:22vh}.k-wall-top{top:7vh}.k-wall-bottom{bottom:7vh}}
/* Control tiles follow the "Make it yours" cards: a black card, white headline, and the control
   floating in its own rounded panel */
.k-tile-control{background:#000}
.k-tile-control .k-tile-media.k-tile-ui{background:#000}
.k-tile-control .k-tile-copy{font-size:19px;line-height:1.3;color:#a1a1a6}
.k-tile-control .k-tile-copy strong{color:#fff;font-size:22px;letter-spacing:-.02em;display:block;margin-bottom:2px}
.k-tui:not(.k-tui-piece):not(.k-tui-mv){inset:2cqmin 6cqmin 7cqmin;padding:1.1em 1.2em;background:#1c1c1e;border:1px solid #ffffff1a;border-radius:18px;box-shadow:0 1.6em 4em #000c;overflow:hidden}
.k-tui-mv{padding:.6em;background:#1c1c1e;border:1px solid #ffffff1a;border-radius:18px;box-shadow:0 1.6em 4em #000c;height:82%}
.k-tui-later .k-tui-bg{opacity:.5}
@media(max-width:734px){.k-tile-control .k-tile-copy strong{font-size:20px}}
/* The iPhone in the devices accordion: a portrait phone needs less height to weigh the same as the others */
.k-accordion-pane .mock.k-acc-phone{max-height:330px}
.k-accordion-inline .mock.k-acc-phone{max-height:280px}

/* ---------- Spotlight controls (kit.mjs spotTile, spotCard): one control, large, in tvOS focus ---------- */
.k-spot{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:.9em;padding:7cqmin;color:#f5f5f7;text-align:left;font-size:clamp(10px,min(3.2cqw,5cqh),20px);line-height:1.25;isolation:isolate;overflow:hidden}
.k-spot::before{content:"";position:absolute;inset:-25%;z-index:-1;background:radial-gradient(closest-side at 50% 56%,var(--spot) 0%,#0000 100%);opacity:.42}
.k-spot-blue{--spot:#2f7bff}.k-spot-orange{--spot:#ff7a2f}.k-spot-amber{--spot:#ffad1f}.k-spot-teal{--spot:#1fc7c2}.k-spot-purple{--spot:#8b5cf6}.k-spot-pink{--spot:#f0499a}.k-spot-green{--spot:#2fcf6a}.k-spot-red{--spot:#ff4d5e}
.k-spot svg{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.k-spot svg .f,.k-spot svg.f{fill:currentColor;stroke:none}
.k-sq .k-spot{font-size:clamp(10px,min(4cqw,7.4cqh),18px);padding:5cqmin 7cqmin}
.k-tall .k-spot{font-size:clamp(10px,min(4.2cqw,4cqh),19px)}
.k-wide .k-spot,.k-xl .k-spot{font-size:clamp(10px,min(2.5cqw,4.4cqh),19px)}
.k-sp-panel{background:#1c1c1ef2;border:1px solid #ffffff1f;border-radius:1.1em;box-shadow:0 1.6em 4em #000c;padding:1em;width:100%}
.k-sp-stack{display:grid;gap:.5em;width:min(100%,22em)}
.k-sp-row{position:relative;isolation:isolate;display:flex;align-items:center;gap:.65em;padding:.72em 1em;border-radius:.9em;background:#2c2c2ecc;border:1px solid #ffffff14;font-weight:600;font-size:1.05em}
.k-sp-row em{margin-left:auto;font-style:normal;color:#a1a1a6;font-weight:500;display:flex;align-items:center}
.k-sp-dim{opacity:.42}
.k-sp-focus{position:relative;overflow:hidden;background:#fff!important;color:#000!important;transform:scale(1.07);box-shadow:0 1em 2.6em #000b,0 0 2.6em color-mix(in srgb,var(--spot) 60%,#0000)}
.k-sp-focus em,.k-sp-focus small{color:#3a3a3c!important}
.k-sp-focus::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,#0000 35%,#ffffffc0 50%,#0000 65%);transform:translateX(-130%);animation:k-sp-sheen 3.8s ease-in-out infinite}
@keyframes k-sp-sheen{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
/* Focus that moves from item to item */
.k-sp-f{animation:k-sp-ftext 8s ease-in-out infinite}
.k-sp-f::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;opacity:0;animation:k-sp-fbg 8s ease-in-out infinite;animation-delay:inherit}
.k-sp-f2{animation-delay:2s}.k-sp-f3{animation-delay:4s}.k-sp-f4{animation-delay:6s}
@keyframes k-sp-fbg{0%,22%{opacity:1}27%,100%{opacity:0}}
@keyframes k-sp-ftext{0%,22%{color:#000;transform:scale(1.06);box-shadow:0 .6em 1.6em #000b,0 0 1.8em color-mix(in srgb,var(--spot) 55%,#0000);z-index:1}27%,100%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}}
/* Guide */
.k-sp-guide{padding:5cqmin 6cqmin}
.k-sp-guide .k-sp-panel{display:grid;gap:.8em}
.k-sp-gtop{display:grid;grid-template-columns:6.5em 1fr auto;gap:.9em;align-items:center}
.k-sp-gtop img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.5em;display:block}
.k-sp-gtop b{display:block;font-size:1.35em;letter-spacing:-.01em}.k-sp-gtop small{color:#a1a1a6}.k-sp-gtop em{font-style:normal;align-self:start;color:#d1d1d6;font-weight:600}
.k-sp-ggrid{position:relative;display:grid;grid-template-columns:7em repeat(3,minmax(0,1fr));gap:.42em}
.k-sp-ggrid>small{color:#8e8e93;font-size:.85em}
.k-sp-ch{display:grid;align-content:center;padding:.55em .7em;border-radius:.6em;background:#2c2c2e;font-weight:600;font-size:.92em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-sp-ch small{color:#8e8e93;font-weight:500;font-size:.85em}
.k-sp-cell{position:relative;isolation:isolate;display:grid;align-content:center;gap:.05em;padding:.55em .75em;border-radius:.6em;background:#3b3560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-sp-cell b{font-size:.98em;overflow:hidden;text-overflow:ellipsis}.k-sp-cell small{font-size:.8em;opacity:.7}
.k-sp-s1{grid-column:span 1}.k-sp-s2{grid-column:span 2}.k-sp-s3{grid-column:span 3}
.k-sp-now{position:absolute;top:1.3em;bottom:0;left:calc(7em + .42em + (100% - 7em - 1.26em) * .31);width:2px;background:#9ec5ff;box-shadow:0 0 .9em #6ab0ff;border-radius:2px;z-index:2}
/* Upright live with the guide below */
.k-sp-phone{width:min(100%,17em);display:grid;gap:.5em;border-radius:1.6em;padding:.8em}
.k-sp-pic{position:relative;display:block;border-radius:1em;overflow:hidden;aspect-ratio:16/10}
.k-sp-pic img{width:100%;height:100%;object-fit:cover;display:block}
.k-sp-pic em{position:absolute;left:.7em;bottom:.5em;font-style:normal;font-weight:700;text-shadow:0 1px 6px #000}
.k-sp-urow{display:grid;grid-template-columns:6.6em 1fr;gap:.4em;position:relative}
.k-sp-tap .k-sp-cell{background:#fff;color:#000}
.k-sp-tap::after{content:"";position:absolute;left:62%;top:50%;width:2.4em;height:2.4em;margin:-1.2em;border-radius:50%;background:#ffffff80;box-shadow:0 0 0 .3em #ffffff33;animation:k-u-tap 3s ease-out infinite}
/* Reminders */
.k-sp-later{gap:1.1em}
.k-sp-card{display:grid;gap:.15em;padding:.9em 1.25em;border-radius:1em;background:#2c2c2ecc;border:1px solid #ffffff14;min-width:12em}
.k-sp-card b{font-size:1.6em;line-height:1.1}.k-sp-card span{font-weight:600;font-size:1.1em}.k-sp-card small{color:#a1a1a6}
.k-sp-toast{display:inline-flex;align-items:center;gap:.5em;padding:.55em 1.15em;border-radius:999px;background:#30d158;color:#04210d;font-weight:700;box-shadow:0 .6em 1.8em #30d15866;animation:k-sp-toast 4.4s ease-in-out infinite}
.k-sp-toast svg{transform-origin:50% 12%;animation:k-sp-ring 4.4s ease-in-out infinite}
@keyframes k-sp-toast{0%,14%{opacity:0;transform:translateY(.8em) scale(.9)}24%,86%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-.4em)}}
@keyframes k-sp-ring{0%,26%,44%,100%{transform:none}30%{transform:rotate(16deg)}35%{transform:rotate(-14deg)}40%{transform:rotate(8deg)}}
/* Channel menu */
.k-sp-menu{background:#1c1c1ef2;border:1px solid #ffffff1f;border-radius:1.2em;padding:.45em;box-shadow:0 1.6em 4em #000c;gap:.15em}
.k-sp-menu .k-sp-row{background:none;border-color:#0000;padding:.58em .95em}
/* Multiview */
.k-sp-mv{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.5em;width:min(100%,calc(80cqh * 16 / 9));aspect-ratio:16/9;padding:.5em;background:#1c1c1ef2;border:1px solid #ffffff1f;border-radius:1.2em;box-shadow:0 1.6em 4em #000c}
.k-sp-mvt{position:relative;border-radius:.7em;overflow:hidden;min-height:0;animation:k-sp-mvf 8s ease-in-out infinite}
.k-sp-mvt img{width:100%;height:100%;object-fit:cover;display:block}
.k-sp-mvt em{position:absolute;left:.6em;bottom:.6em;display:flex;align-items:center;gap:.4em;padding:.3em .75em .3em .55em;border-radius:999px;background:#000b;font-style:normal;font-weight:700;font-size:.95em}
.k-sp-mvt em svg{width:1.2em;height:1.2em;animation:k-sp-snd 8s steps(1) infinite}
.k-sp-mv1,.k-sp-mv1 em svg{animation-delay:2s}.k-sp-mv2,.k-sp-mv2 em svg{animation-delay:4s}.k-sp-mv3,.k-sp-mv3 em svg{animation-delay:6s}
@keyframes k-sp-mvf{0%,22%{box-shadow:0 0 0 .22em #fff,0 0 2.2em color-mix(in srgb,var(--spot) 65%,#0000);transform:scale(1.03);z-index:1}27%,100%{box-shadow:none;transform:none;z-index:0}}
@keyframes k-sp-snd{0%{opacity:1;color:#30d158}25%,100%{opacity:.3;color:#fff}}
/* Catch-up */
.k-sp-poster{padding:.5em .5em .9em;min-width:0;width:min(100%,15em)}
.k-sp-poster img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.7em;margin-bottom:.5em;display:block}
.k-sp-poster b{font-size:1.2em}
.k-sp-pill{display:inline-flex;align-items:center;gap:.5em;padding:.65em 1.25em;border-radius:999px;background:#2c2c2ecc;font-weight:700}
/* Cards ("Make it yours") */
.k-know-spot{container-type:size;height:360px;flex:none;position:relative}
.k-know-spot .k-spot{font-size:clamp(10px,min(4.6cqw,4.4cqh),17px);padding:5cqmin 7cqmin 17cqmin}
.k-sp-title{font-size:1.25em;font-weight:700;text-align:center;letter-spacing:-.01em;max-width:16em}
.k-sp-whos .k-sp-title{font-size:1.45em}
.k-sp-people{display:flex;gap:1.6em;margin-top:.4em}
.k-sp-who{display:grid;justify-items:center;gap:.55em;font-weight:600}
.k-sp-face{width:5.4em;height:5.4em;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#a1a1a6,#8e8e93);font-size:1.25em;font-weight:600;color:#fff}
.k-sp-cat{background:linear-gradient(#e0a43a,#c47f12)}
.k-spot .k-sp-cat svg{width:3.1em;height:3.1em}
.k-sp-w1{animation:k-sp-pick 5s ease-in-out infinite}.k-sp-w2{animation:k-sp-pick 5s ease-in-out -2.5s infinite}
@keyframes k-sp-pick{0%,42%{transform:scale(1.14);opacity:1}50%,92%{transform:scale(.9);opacity:.55}100%{transform:scale(1.14);opacity:1}}
.k-sp-w1 .k-sp-face,.k-sp-w2 .k-sp-face{box-shadow:0 0 0 .18em #fff,0 0 2.4em color-mix(in srgb,var(--spot) 70%,#0000)}
.k-sp-tick{width:1.45em;height:1.45em;border-radius:50%;background:#0a84ff;display:grid;place-items:center;color:#fff;flex:none}
.k-spot .k-sp-tick svg{width:.9em;height:.9em;stroke-width:2.4}
.k-sp-order .k-sp-stack{width:100%}
.k-sp-o2{animation:k-ui-drag 6s var(--ease) infinite}.k-sp-o1{animation:k-ui-drop 6s var(--ease) infinite}
.k-sp-add{display:flex;align-items:center;gap:.5em;color:#0a84ff;font-weight:600}
.k-sp-field{display:flex;align-items:center;gap:.6em;width:100%;padding:.8em 1.1em;border-radius:999px;background:#2c2c2ecc;border:1px solid #ffffff1f;font-size:1.12em;font-weight:500}
.k-sp-type{white-space:nowrap;clip-path:inset(0 100% 0 0);animation:k-sp-type 5s steps(15) infinite}
@keyframes k-sp-type{0%{clip-path:inset(0 100% 0 0)}45%,100%{clip-path:inset(0 0 0 0)}}
.k-sp-hit{display:grid;grid-template-columns:6em 1fr;gap:.5em;width:100%;animation:k-sp-hit 5s ease infinite}
.k-sp-hit>span:last-child{display:grid;gap:.25em;padding:.7em .9em;border-radius:.8em;background:#fff;color:#000;box-shadow:0 1em 2.4em #000b,0 0 2.4em color-mix(in srgb,var(--spot) 55%,#0000)}
.k-sp-hit>span:last-child small{color:#636366}
.k-sp-bar{display:block;height:.3em;border-radius:9px;background:#0000001f;overflow:hidden}.k-sp-bar>i{display:block;width:38%;height:100%;background:#000}
@keyframes k-sp-hit{0%,46%{opacity:0;transform:translateY(.6em)}56%,100%{opacity:1;transform:none}}
.k-sp-subs .k-sp-stack{width:min(100%,15em)}
.k-sp-qr{padding:.6em;border-radius:1em;background:#fff;box-shadow:0 0 3em color-mix(in srgb,var(--spot) 55%,#0000)}
.k-spot .k-sp-qr svg{width:8.2em;height:8.2em;fill:#000;stroke:none;display:block;padding:0;border-radius:0;background:none}
.k-sp-ok{background:#30d15826;color:#30d158}
.k-sp-lock{width:3.4em;height:3.4em;border-radius:50%;display:grid;place-items:center;background:#2c2c2e;border:1px solid #ffffff1f;box-shadow:0 0 2.6em color-mix(in srgb,var(--spot) 55%,#0000)}
.k-spot .k-sp-lock svg{width:1.6em;height:1.6em}
.k-sp-dots{display:flex;gap:1em}
.k-sp-dots i{width:1.1em;height:1.1em;border-radius:50%;border:.14em solid #f5f5f7;animation:k-ui-pin 4.8s steps(1) infinite}
.k-sp-dots i:nth-child(2){animation-delay:.6s}.k-sp-dots i:nth-child(3){animation-delay:1.2s}.k-sp-dots i:nth-child(4){animation-delay:1.8s}
.k-sp-note{color:#8e8e93;text-align:center;font-size:.8em;max-width:22em;line-height:1.35}
@media(max-width:734px){.k-know-spot{height:340px}}
/* The menu has three items, so its focus cycles every 6 s */
.k-sp-menu .k-sp-f{animation:k-sp-ftext3 6s ease-in-out infinite}
.k-sp-menu .k-sp-f::before{animation:k-sp-fbg3 6s ease-in-out infinite;animation-delay:inherit}
.k-sp-menu .k-sp-f2{animation-delay:2s}.k-sp-menu .k-sp-f3{animation-delay:4s}
@keyframes k-sp-fbg3{0%,28%{opacity:1}34%,100%{opacity:0}}
@keyframes k-sp-ftext3{0%,28%{color:#000;transform:scale(1.06);box-shadow:0 .6em 1.6em #000b,0 0 1.8em color-mix(in srgb,var(--spot) 55%,#0000);z-index:1}34%,100%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}}
.k-sq .k-sp-menu .k-sp-row{padding:.62em 1em;font-size:1.08em}
/* In cards the light belongs to the whole card, so it never stops in a line */
.k-know-spot .k-spot::before{display:none}
.k-know-card:has(.k-spot){background:radial-gradient(70% 55% at 50% 66%,color-mix(in srgb,var(--card-spot,#2f7bff) 42%,#0000),#0000 100%),#000}
.k-know-card:has(.k-spot-orange){--card-spot:#ff7a2f}.k-know-card:has(.k-spot-blue){--card-spot:#2f7bff}.k-know-card:has(.k-spot-purple){--card-spot:#8b5cf6}.k-know-card:has(.k-spot-teal){--card-spot:#1fc7c2}.k-know-card:has(.k-spot-red){--card-spot:#ff4d5e}.k-know-card:has(.k-spot-green){--card-spot:#2fcf6a}
/* Four profiles, focus moving between them */
.k-sp-four{gap:.9em}
.k-sp-who4{display:grid;justify-items:center;gap:.5em;font-weight:600;font-size:.92em;animation:k-sp-pick4 8s ease-in-out infinite}
.k-sp-who4 .k-sp-face{width:3.9em;height:3.9em;font-size:1.15em;animation:k-sp-ring4 8s ease-in-out infinite;animation-delay:inherit}
.k-sp-q1{animation-delay:2s}.k-sp-q2{animation-delay:4s}.k-sp-q3{animation-delay:6s}
@keyframes k-sp-pick4{0%,22%{transform:scale(1.16);opacity:1}27%,100%{transform:scale(.94);opacity:.6}}
@keyframes k-sp-ring4{0%,22%{box-shadow:0 0 0 .16em #fff,0 0 2.2em color-mix(in srgb,var(--spot) 75%,#0000)}27%,100%{box-shadow:none}}
.k-sp-face-grey{background:linear-gradient(#a1a1a6,#8e8e93)}.k-sp-face-blue{background:linear-gradient(#5aa9ff,#2f6fe0)}.k-sp-face-pink{background:linear-gradient(#ff7eb6,#d9417f)}
.k-spot .k-sp-who4 .k-sp-cat svg{width:2.3em;height:2.3em}
/* Search: films, people and what's on TV pop up as you type */
.k-sp-search{align-content:start;gap:.7em;padding-top:4cqmin}
.k-sp-search .k-sp-type{animation:k-sp-type6 7s steps(6) infinite}
/* Typed at about 100 ms a letter (owner: the old 250 ms read as slow), results right after. */
@keyframes k-sp-type6{0%,4%{clip-path:inset(0 100% 0 0)}13%,100%{clip-path:inset(0 0 0 0)}}
.k-sp-search .k-sp-group{animation-name:k-sp-pop-s}
@keyframes k-sp-pop-s{0%,15%{opacity:0;transform:translateY(.8em) scale(.94)}22%,90%{opacity:1;transform:none}100%{opacity:0}}
.k-sp-group{display:grid;gap:.35em;width:100%;opacity:0;animation:k-sp-pop 7s cubic-bezier(.2,1.4,.4,1) infinite}
.k-sp-group>small{font-size:.75em;font-weight:700;color:#a1a1a6;text-transform:none}
.k-sp-r2{animation-delay:.35s}.k-sp-r3{animation-delay:.7s}
@keyframes k-sp-pop{0%,30%{opacity:0;transform:translateY(.8em) scale(.94)}38%,90%{opacity:1;transform:none}100%{opacity:0}}
.k-sp-film{display:grid;grid-template-columns:5.2em 1fr;gap:.7em;align-items:center;padding:.45em;border-radius:.8em;background:#fff;color:#000;box-shadow:0 .8em 2em #000b,0 0 2.2em color-mix(in srgb,var(--spot) 55%,#0000)}
.k-sp-film img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:.5em;display:block}
.k-sp-film b{display:block;font-size:1.05em}.k-sp-film small{color:#636366;font-size:.8em}
.k-sp-persons{display:grid;grid-template-columns:1fr 1fr;gap:.4em}
.k-sp-person{display:flex;align-items:center;gap:.5em;padding:.45em .55em;border-radius:.8em;background:#2c2c2ecc;border:1px solid #ffffff14;min-width:0}
.k-sp-person i{width:2.1em;height:2.1em;border-radius:50%;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:.8em;background:linear-gradient(#636366,#48484a)}
.k-sp-person span{display:grid;min-width:0}.k-sp-person b{font-size:.86em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-sp-person small{font-size:.74em;color:#a1a1a6}
.k-sp-tv{display:grid;grid-template-columns:5.2em 1fr;gap:.4em}
.k-sp-tv>span:last-child{display:grid;align-content:center;padding:.45em .7em;border-radius:.6em;background:#3b3560}
.k-sp-tv b{font-size:.9em}.k-sp-tv small{font-size:.75em;opacity:.75}
/* The player beside "Play more video types" */
.k-player-spot{position:relative}
.k-sp-stage{position:relative;aspect-ratio:5/4;container-type:inline-size}
.k-sp-player{display:block;overflow:visible;font-size:clamp(10px,2.25cqw,17px);padding:0}
.k-sp-player::before{inset:-10%;opacity:.5}
.k-sp-video{position:absolute;left:0;top:4%;width:86%;aspect-ratio:16/9;border-radius:1.1em;overflow:hidden;border:1px solid #ffffff1f;box-shadow:0 2em 5em #000c}
.k-sp-video video{width:100%;height:100%;object-fit:cover;display:block}
.k-sp-vtag{position:absolute;left:1em;top:1em;padding:.25em .7em;border-radius:.5em;border:1px solid #64d2ffa6;color:#64d2ff;background:#000a;font-weight:700;font-size:.85em}
.k-sp-chrome{position:absolute;left:0;right:0;bottom:0;padding:3em 1.2em .9em;background:linear-gradient(#0000,#000d);display:grid;grid-template-columns:1fr auto;gap:.5em;align-items:end}
.k-sp-chrome b{font-size:1.5em}
.k-sp-icons{display:flex;gap:.45em}
.k-spot .k-sp-icons svg{width:2.1em;height:2.1em;padding:.5em;border-radius:50%;background:#ffffff2e}
.k-sp-bar2{grid-column:1/-1;display:block;height:.3em;border-radius:9px;background:#ffffff40;overflow:hidden}.k-sp-bar2>i{display:block;width:31%;height:100%;background:#fff}
.k-sp-times{grid-column:1/-1;display:flex;justify-content:space-between;color:#d1d1d6;font-size:.8em;margin-top:-.25em}
.k-sp-picker{position:absolute;right:0;bottom:3%;width:50%;display:grid;gap:.42em;padding:.9em;border-radius:1.2em;background:#1c1c1ef5;border:1px solid #ffffff24;box-shadow:0 2em 5em #000e;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.k-sp-phead{display:flex;align-items:center;justify-content:center;position:relative;padding:.2em 0 .3em}
.k-sp-phead b{font-size:1.05em}.k-sp-phead em{position:absolute;right:0;font-style:normal;font-weight:600;padding:.35em .85em;border-radius:999px;background:#ffffff26;font-size:.9em}
.k-sp-picker .k-sp-row{padding:.6em .9em;font-size:.95em}
.k-sp-picker small{color:#8e8e93;font-size:.78em;line-height:1.35;padding:0 .2em}
.k-player-spot .k-credit{margin-top:16px}
@media(max-width:1000px){.k-sp-stage{max-width:640px;margin:0 auto}}
@media(max-width:734px){.k-sp-player{font-size:clamp(8px,2.7cqw,14px)}.k-sp-picker{width:62%}}
.k-sp-video .k-pause{top:.8em;right:.8em;bottom:auto;left:auto}
/* Sync: the devices stacked close, with sync lines and a badge between them */
.k-sync-family{gap:0}
.k-sync-link{position:relative;width:calc(var(--u) * 811);padding-top:calc(var(--u) * 64)}
.k-sync-link .k-family-row{gap:calc(var(--u) * 28)}
.k-sync-lines{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.k-sync-lines path{fill:none;stroke-linecap:round}
.k-sync-base{stroke:#0a84ff40;stroke-width:1.4}
.k-sync-flow{stroke:#0a84ff;stroke-width:3.4;stroke-dasharray:0 16;animation:k-sync-flow 1.6s linear infinite}
.k-sync-back{stroke:#64d2ff;stroke-width:2.4;stroke-dasharray:0 22;animation:k-sync-back 2.2s linear infinite;opacity:.8}
@keyframes k-sync-flow{to{stroke-dashoffset:-32}}
@keyframes k-sync-back{to{stroke-dashoffset:44}}
.k-sync-badge{position:absolute;left:calc(var(--u) * 811 * .4705);top:0;width:calc(var(--u) * 40);height:calc(var(--u) * 40);min-width:34px;min-height:34px;transform:translate(-50%,-30%);border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#3a8dff,#0a5fd6);box-shadow:0 0 0 6px #0a84ff26,0 10px 30px #0a84ff66;z-index:1}
.k-sync-badge svg{width:56%;height:56%;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;animation:k-sync-spin 6s linear infinite}
@keyframes k-sync-spin{to{transform:rotate(360deg)}}
@media(max-width:1130px){.k-sync-family .k-family-row{display:flex}}
@media(max-width:700px){.k-sync-family .k-family-row,.k-sync-lines{display:none}.k-sync-link{padding-top:28px;width:auto}.k-sync-badge{position:relative;left:auto;transform:none;margin:0 auto}}
@media(prefers-reduced-motion:reduce){.k-sync-flow,.k-sync-back,.k-sync-badge svg{animation:none}}
/* Profiles: two on top, two below */
.k-sp-grid2{display:grid;grid-template-columns:repeat(2,auto);justify-content:center;gap:.9em 2.2em}
/* Best in class discovery (dark): spot demos in a bento, then search */
.k>.k-discover{background:#000}
.k-discover .k-line{color:#a1a1a6;max-width:46ch}
.k-discover .k-bento{margin-top:48px}
.k-discover .k-tile-control{background:#111113;box-shadow:0 0 0 1px #ffffff14}
.k-discover-search{margin-top:110px}
.k-discover .k-credit{color:#86868b}
.k-sp-poster-img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:.5em;box-shadow:0 .4em 1em #0008}
/* Title page */
.k-sp-titlepage{padding:5cqmin 6cqmin}
.k-sp-tp{display:grid;grid-template-columns:1.05fr 1fr;padding:0;overflow:hidden}
.k-sp-tp-art{position:relative}.k-sp-tp-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-sp-tp-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0000 55%,#1c1c1e)}
.k-sp-tp-body{display:grid;gap:.55em;padding:1.3em 1.3em 1.2em .6em;align-content:center}
.k-sp-tp-h{font-size:2.1em;letter-spacing:-.02em;line-height:1}
.k-sp-tp-body>small{color:#a1a1a6}
.k-sp-tp-btns{display:flex;gap:.45em;align-items:center;margin:.2em 0 .4em}
.k-sp-btn{position:relative;display:inline-flex;align-items:center;gap:.4em;padding:.55em 1.05em;border-radius:999px;background:#ffffff26;font-weight:650;font-size:.95em}
.k-sp-btn.k-sp-focus{transform:scale(1.05)}
.k-sp-roundb{width:2.3em;height:2.3em;border-radius:50%;display:grid;place-items:center;background:#ffffff26}
.k-sp-tp-label{color:#d1d1d6!important;font-weight:650;font-size:.85em}
.k-sp-tp-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.45em}
.k-sp-pf{border-radius:.6em;animation:k-sp-pfocus 8s ease-in-out infinite}
.k-sp-pf1{animation-delay:2s}.k-sp-pf2{animation-delay:4s}.k-sp-pf3{animation-delay:6s}
@keyframes k-sp-pfocus{0%,22%{transform:translateY(-.35em) scale(1.1);box-shadow:0 1em 2em #000c,0 0 1.8em color-mix(in srgb,var(--spot) 60%,#0000);z-index:1}27%,100%{transform:none;box-shadow:none;z-index:0}}
/* Sort and filter */
.k-sp-filter{padding:5cqmin 6cqmin}
.k-sp-fl{display:grid;gap:.75em;align-content:start;height:100%}
.k-sp-fl-h{font-size:1.25em}
.k-sp-chips{display:flex;flex-wrap:wrap;gap:.4em}
.k-sp-chip2{padding:.42em .85em;border-radius:999px;background:#ffffff1f;font-weight:600;font-size:.9em}
.k-sp-chip-on{background:#fff;color:#000}
.k-sp-chip-flip{animation:k-sp-chip 6s steps(1) infinite}
@keyframes k-sp-chip{0%,45%{background:#ffffff1f;color:#f5f5f7}50%,100%{background:#fff;color:#000}}
.k-sp-fl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5em}
.k-sp-fl-grid .k-sp-old{animation:k-sp-old 6s ease infinite}
@keyframes k-sp-old{0%,45%{opacity:1;filter:none}55%,95%{opacity:.12;filter:grayscale(1)}100%{opacity:1}}
/* Watch From */
.k-sp-wf{width:min(100%,17em);gap:.4em}
.k-sp-grp{color:#a1a1a6;font-weight:650;font-size:.8em;margin-top:.3em}
.k-sp-q{padding:.15em .5em;border-radius:.4em;border:1px solid #64d2ffa6;color:#64d2ff;font-size:.85em;font-weight:700}
.k-sp-wf .k-sp-f{animation-duration:4s}.k-sp-wf .k-sp-f::before{animation-duration:4s}
.k-sp-wf .k-sp-f3{animation-delay:2s}
/* Collection */
.k-sp-coll{position:relative;width:7.2em;height:10.4em}
.k-sp-coll img{position:absolute;inset:0;width:100%;height:auto;transition:transform .6s}
.k-sp-c3{transform:rotate(-9deg) translateX(-1.3em);filter:brightness(.55)}.k-sp-c2{transform:rotate(-4deg) translateX(-.6em);filter:brightness(.75)}
.k-tile:hover .k-sp-c3{transform:rotate(-14deg) translateX(-2.4em)}.k-tile:hover .k-sp-c2{transform:rotate(-7deg) translateX(-1.2em)}
.k-sp-count{position:absolute;right:-.6em;bottom:-.5em;z-index:1;padding:.3em .7em;border-radius:999px;background:#fff;color:#000;font-weight:700;font-size:.8em;box-shadow:0 .4em 1em #0009}
/* Person */
.k-sp-director{gap:.35em}
.k-sp-avatar{width:3.6em;height:3.6em;border-radius:50%;display:grid;place-items:center;font-weight:700;background:linear-gradient(#636366,#3a3a3c);box-shadow:0 0 0 .14em #fff,0 0 2em color-mix(in srgb,var(--spot) 60%,#0000)}
.k-sp-role{color:#a1a1a6;margin-top:-.2em}
.k-sp-known{display:grid;gap:.3em;margin-top:.5em;justify-items:center}
.k-sp-known>small{color:#a1a1a6;font-weight:650;font-size:.8em}
.k-sp-film2{display:grid;gap:.15em;width:9em}
.k-sp-film2 img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.6em;display:block}
.k-sp-film2 b{font-size:.92em;margin-top:.25em}.k-sp-film2 small{color:#8e8e93;font-size:.78em}
/* Search everything, all at once */
.k-sp-searchall{gap:1.4em;padding:7cqmin}
.k-sp-bigfield{max-width:28em;font-size:1.3em;padding:.75em 1.1em;box-shadow:0 0 0 .12em #fff,0 0 2.4em color-mix(in srgb,var(--spot) 55%,#0000)}
.k-sp-type14{animation:k-sp-type14 8s steps(14) infinite}
@keyframes k-sp-type14{0%,3%{clip-path:inset(0 100% 0 0)}22%,100%{clip-path:inset(0 0 0 0)}}
.k-sp-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9em;width:100%}
.k-sp-col{display:grid;gap:.45em;align-content:start;opacity:0;animation:k-sp-pop8 8s cubic-bezier(.2,1.4,.4,1) infinite}
.k-sp-col>small{color:#a1a1a6;font-weight:700;font-size:.8em}
.k-sp-col .k-sp-film2{width:100%}
.k-sp-col.k-sp-r2{animation-delay:.25s}.k-sp-col.k-sp-r3{animation-delay:.5s}.k-sp-col.k-sp-r4{animation-delay:.75s}
@keyframes k-sp-pop8{0%,22%{opacity:0;transform:translateY(1em) scale(.9)}30%,92%{opacity:1;transform:none}100%{opacity:0}}
.k-sp-searchall .k-sp-person{padding:.6em}
.k-spot .k-sp-person i svg{width:1.1em;height:1.1em}
.k-sp-ontv{display:grid;gap:.25em;padding:.65em .75em;border-radius:.8em;background:#3b3560}
.k-sp-ontv b{font-size:.92em}.k-sp-ontv small{font-size:.75em;opacity:.8}
.k-sp-ontv .k-sp-bar{background:#ffffff33}.k-sp-ontv .k-sp-bar>i{background:#fff}
/* Ask in your own words */
.k-sp-ask{align-content:center;gap:.8em}
.k-sp-askfield{font-size:.95em;align-items:flex-start}
.k-sp-type30{white-space:normal;clip-path:none;animation:k-sp-fadein 8s ease infinite}
@keyframes k-sp-fadein{0%,4%{opacity:0}16%,100%{opacity:1}}
.k-sp-ask .k-sp-grp{justify-self:start;opacity:0;animation:k-sp-pop8 8s ease infinite;animation-delay:.6s}
.k-sp-sugg{display:grid;grid-template-columns:1fr 1fr;gap:.55em;width:100%}
.k-sp-sugg>span{opacity:0;animation:k-sp-pop8 8s cubic-bezier(.2,1.4,.4,1) infinite}
.k-sp-sugg .k-sp-r2{animation-delay:.8s}.k-sp-sugg .k-sp-r3{animation-delay:1s}.k-sp-sugg .k-sp-r4{animation-delay:1.2s}.k-sp-sugg .k-sp-r5{animation-delay:1.4s}
@media(max-width:734px){.k-sp-cols{grid-template-columns:1fr 1fr}.k-sp-tp{grid-template-columns:1fr}.k-sp-tp-art{height:7em}.k-discover-search{margin-top:72px}}
@media(prefers-reduced-motion:reduce){.k-sp-col,.k-sp-sugg>span,.k-sp-ask .k-sp-grp,.k-sp-group{opacity:1}}
.k-sp-ask{gap:.7em}
.k-sp-ask .k-sp-sugg{grid-template-columns:repeat(2,minmax(0,6.2em));justify-content:center}
.k-sp-askfield{width:100%;border-radius:1.2em}
.k-sp-director{gap:.2em;padding-top:3cqmin;padding-bottom:3cqmin}
.k-sp-director .k-sp-avatar{width:2.7em;height:2.7em;font-size:.9em}
.k-sp-director .k-sp-known{margin-top:.25em}
.k-sp-director .k-sp-film2{width:7.4em}
.k-sq .k-sp-director{font-size:clamp(9px,min(3.4cqw,6cqh),15px)}

/* ---------- Showcase: highlights switcher (list left, stage right) ---------- */
.k-show{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:48px;align-items:center;margin-top:56px;text-align:left}
.k-show-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.k-show-list button{display:grid;gap:4px;width:100%;text-align:left;border:0;background:none;color:#86868b;padding:16px 4px 14px;cursor:pointer;font:inherit;border-bottom:1px solid #ffffff1a}
.k-show-list b{font-size:clamp(20px,2vw,26px);letter-spacing:-.02em;color:inherit;transition:color .3s}
.k-show-list span{font-size:15px;color:#6e6e73}
.k-show-list button[aria-pressed="true"]{color:#f5f5f7}
.k-show-list button[aria-pressed="true"] span{color:#a1a1a6}
.k-show-list button:focus-visible{outline:2px solid #0a84ff;outline-offset:4px;border-radius:8px}
.k-show-bar{display:block;height:2px;margin-top:10px;background:#ffffff14;border-radius:2px;overflow:hidden;visibility:hidden}
.k-show-bar>i{display:block;height:100%;width:0;background:#f5f5f7}
.k-show-list button[aria-pressed="true"] .k-show-bar{visibility:visible}
.k-show-list button.run .k-show-bar>i{animation:k-show-bar 7s linear forwards}
@keyframes k-show-bar{to{width:100%}}
.k-show-stage{position:relative;aspect-ratio:4/3;border-radius:var(--radius);background:#111113;box-shadow:0 0 0 1px #ffffff14;overflow:hidden;container-type:size}
.k-show-pane{position:absolute;inset:0;opacity:0;transform:scale(.97);transition:opacity .6s ease,transform .8s var(--ease);pointer-events:none}
.k-show-pane.on{opacity:1;transform:none;pointer-events:auto}
.k-show-pane .k-spot{font-size:clamp(10px,min(2.4cqw,3.2cqh),19px);padding:7cqmin}
@media(max-width:900px){.k-show{grid-template-columns:1fr;gap:24px}.k-show-list{grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto;gap:8px;scrollbar-width:none}.k-show-list button{border:0;padding:10px 16px;border-radius:999px;background:#1c1c1e}.k-show-list button[aria-pressed="true"]{background:#f5f5f7;color:#000}.k-show-list span,.k-show-bar{display:none}.k-show-stage{aspect-ratio:4/3.6}}
/* Stages */
.k-ds{gap:1.1em;align-content:center}
.k-ds-p{display:block;position:relative;border-radius:.6em;overflow:hidden;box-shadow:0 .6em 1.6em #000a}
.k-ds-p img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover}
.k-ds-label{justify-self:start;font-size:1.25em;font-weight:700;letter-spacing:-.01em}
.k-ds-row{display:grid;grid-template-columns:repeat(5,1fr);gap:.8em;width:100%}
/* More Like This */
.k-ds-hero{position:relative;width:100%;aspect-ratio:2.6;border-radius:1em;overflow:hidden;box-shadow:0 1.4em 3.4em #000c}
.k-ds-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-ds-hero>span{position:absolute;left:0;top:0;bottom:0;width:56%;display:grid;align-content:end;gap:.35em;padding:1.4em;background:linear-gradient(90deg,#000d,#0000)}
.k-ds-hero b{font-size:2.1em;letter-spacing:-.02em;line-height:1}.k-ds-hero small{color:#d1d1d6}
.k-ds-like .k-ds-f{animation:k-ds-focus 10s ease-in-out infinite}
.k-ds-f1{animation-delay:2s!important}.k-ds-f2{animation-delay:4s!important}.k-ds-f3{animation-delay:6s!important}.k-ds-f4{animation-delay:8s!important}
@keyframes k-ds-focus{0%,18%{transform:translateY(-.5em) scale(1.12);box-shadow:0 0 0 .16em #fff,0 1.2em 2.4em #000c,0 0 2.4em color-mix(in srgb,var(--spot) 70%,#0000);z-index:1}22%,100%{transform:none;z-index:0}}
/* Sort */
.k-ds-sort{grid-template-columns:1fr auto;align-items:center;gap:1.4em}
.k-ds-sortgrid{position:relative;width:100%;aspect-ratio:3/2.9}
.k-ds-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.7em;align-content:start}
.k-ds-ga{animation:k-ds-ga 8s ease-in-out infinite}.k-ds-gb{animation:k-ds-gb 8s ease-in-out infinite}
@keyframes k-ds-ga{0%,44%{opacity:1;transform:none}50%,94%{opacity:0;transform:translateY(.6em)}100%{opacity:1}}
@keyframes k-ds-gb{0%,44%{opacity:0;transform:translateY(.6em)}50%,94%{opacity:1;transform:none}100%{opacity:0}}
.k-ds-grid .k-ds-p::after{position:absolute;left:.4em;top:.4em;min-width:1.6em;height:1.6em;padding:0 .35em;border-radius:999px;background:#fff;color:#000;font-weight:800;font-size:.8em;display:grid;place-items:center;box-shadow:0 .2em .6em #0008}
.k-ds-n1::after{content:"1"}.k-ds-n2::after{content:"2"}.k-ds-n3::after{content:"3"}.k-ds-n4::after{content:"4"}.k-ds-n5::after{content:"5"}.k-ds-n6::after{content:"6"}
.k-ds-menu{display:grid;gap:.3em;min-width:12.5em;padding:.7em;border-radius:1.1em;background:#1c1c1ef5;border:1px solid #ffffff24;box-shadow:0 1.6em 4em #000d}
.k-ds-menu>b{padding:.2em .6em .45em;font-size:1.05em}
.k-ds-opt{position:relative;display:flex;align-items:center;padding:.6em .8em;border-radius:.7em;font-weight:600}
.k-ds-opt em{margin-left:auto;opacity:0}.k-ds-opt svg{width:1em;height:1em}
.k-ds-o0,.k-ds-o1{animation:k-ds-opt 8s ease-in-out infinite}.k-ds-o1{animation-delay:-4s}
.k-ds-o0 em,.k-ds-o1 em{animation:k-ds-tick 8s ease-in-out infinite}.k-ds-o1 em{animation-delay:-4s}
@keyframes k-ds-opt{0%,44%{background:#fff;color:#000;transform:scale(1.05);box-shadow:0 .5em 1.4em #000b}50%,100%{background:none;color:#f5f5f7;transform:none;box-shadow:none}}
@keyframes k-ds-tick{0%,44%{opacity:1}50%,100%{opacity:0}}
.k-ds-o2,.k-ds-o3,.k-ds-o4{color:#a1a1a6}
/* People */
.k-ds-people{justify-items:start;gap:.7em}
.k-ds-person{display:flex;align-items:center;gap:.8em}
.k-ds-person>span{display:grid}
.k-ds-person small{color:#a1a1a6;font-weight:600;font-size:.85em}
.k-ds-person b{font-size:1.3em;letter-spacing:-.01em}
.k-ds-face{width:2.9em;height:2.9em;border-radius:50%;display:grid;place-items:center;font-weight:700;background:linear-gradient(#636366,#3a3a3c);box-shadow:0 0 0 .14em #fff,0 0 2em color-mix(in srgb,var(--spot) 65%,#0000)}
.k-ds-face2{background:linear-gradient(#a85b8a,#6e2f57)}
.k-ds-row2{grid-template-columns:repeat(4,1fr);margin-bottom:.5em}
.k-ds-t{display:grid;gap:.3em}.k-ds-t small{color:#8e8e93;font-size:.8em;font-weight:600}
/* Collection */
.k-ds-coll{grid-template-columns:auto 1fr;align-items:end;justify-items:start;padding:7cqmin!important}
.k-ds-collbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.55;transform:scale(1.04);animation:k-ds-pan 18s ease-in-out infinite alternate}
@keyframes k-ds-pan{to{transform:scale(1.12) translateX(-2%)}}
.k-ds-coll::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#000e 0%,#0006 45%,#0000 75%)}
.k-ds-collinfo{display:grid;gap:.2em;align-self:end}
.k-ds-collinfo small{color:#ffd29a;font-weight:700;font-size:.85em}
.k-ds-collinfo b{font-size:2.6em;letter-spacing:-.03em;line-height:1}
.k-ds-collinfo span{color:#d1d1d6}
.k-ds-fan{display:flex;gap:1em;justify-self:end;align-self:end}
.k-ds-fanp{display:grid;gap:.25em;width:8.2em;animation:k-ds-lift 6s ease-in-out infinite}
.k-ds-fan1{animation-delay:3s}
.k-ds-fanp b{font-size:.95em}.k-ds-fanp small{color:#a1a1a6;font-size:.8em}
@keyframes k-ds-lift{0%,40%{transform:translateY(-.6em) scale(1.06)}50%,100%{transform:none}}
/* Watch From */
.k-ds-wf{display:grid;gap:.55em;width:min(100%,24em);padding:1.2em;border-radius:1.2em;background:#1c1c1ef2;border:1px solid #ffffff1f;box-shadow:0 1.6em 4em #000c}
.k-ds-wf>img{width:100%;aspect-ratio:2.2;object-fit:cover;border-radius:.8em}
.k-ds-wf>b{font-size:1.4em}.k-ds-wf>small{color:#a1a1a6;font-weight:600;margin-top:-.3em}
.k-ds-wf .k-sp-row>span{display:grid}.k-ds-wf .k-sp-row small{color:#a1a1a6;font-weight:500;font-size:.8em}
.k-ds-wf1,.k-ds-wf2{animation:k-ds-wf 6s ease-in-out infinite}.k-ds-wf2{animation-delay:-3s}
@keyframes k-ds-wf{0%,44%{background:#fff;color:#000;transform:scale(1.04);box-shadow:0 .6em 1.6em #000b}50%,100%{background:#2c2c2ecc;color:#f5f5f7;transform:none;box-shadow:none}}
.k-ds-wf1 small,.k-ds-wf2 small{color:inherit!important;opacity:.7}
/* Ask: voice */
.k-sp-voice{display:flex;align-items:center;gap:.8em}
.k-sp-mic{width:3em;height:3em;border-radius:50%;display:grid;place-items:center;background:#fff;color:#000;box-shadow:0 0 0 0 #30d15899;animation:k-sp-micpulse 2s ease-out infinite}
.k-spot .k-sp-mic svg{width:1.4em;height:1.4em;stroke-width:1.8}
@keyframes k-sp-micpulse{0%{box-shadow:0 0 0 0 #30d15899}70%,100%{box-shadow:0 0 0 1.1em #30d15800}}
.k-sp-wave{display:flex;align-items:center;gap:.22em;height:2.4em}
.k-sp-wave i{display:block;width:.28em;height:30%;border-radius:9px;background:#30d158;animation:k-sp-wave 1.1s ease-in-out infinite}
.k-sp-wave i:nth-child(2n){animation-delay:-.3s}.k-sp-wave i:nth-child(3n){animation-delay:-.6s}.k-sp-wave i:nth-child(4n){animation-delay:-.15s}
@keyframes k-sp-wave{0%,100%{height:25%}50%{height:100%}}
.k-sp-said{display:inline}
.k-sp-w{opacity:0;animation:k-sp-word 8s ease infinite}
.k-sp-w1{animation-delay:.25s}.k-sp-w2{animation-delay:.5s}.k-sp-w3{animation-delay:.75s}.k-sp-w4{animation-delay:1s}.k-sp-w5{animation-delay:1.25s}.k-sp-w6{animation-delay:1.5s}
@keyframes k-sp-word{0%,6%{opacity:0}10%,94%{opacity:1}100%{opacity:0}}
/* ---------- Sync: our own screens, overlapping on one line ---------- */
.k-syncs{margin:56px auto 0;max-width:1180px}
.k-syncs-stage{position:relative;width:100%;aspect-ratio:2.5}
.k-syncs-s{position:absolute;bottom:8%;display:block}
.k-syncs-s img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 0 0 1px #0000001a,0 24px 60px #0000004d}
.k-syncs-s::after{content:"";position:absolute;inset:0;border-radius:14px;pointer-events:none;background:linear-gradient(105deg,#0000 35%,#ffffff59 50%,#0000 65%);background-size:300% 100%;background-position:100% 0;animation:k-syncs-sweep 6s ease-in-out infinite}
.k-syncs-mac{left:0;width:39%;z-index:1}.k-syncs-mac img{border-radius:10px;box-shadow:none;filter:drop-shadow(0 24px 40px #0000004d)}
.k-syncs-tv{left:22%;width:56%;z-index:3}
.k-syncs-ipad{right:6%;width:30%;z-index:2}
.k-syncs-phone{right:0;width:10.5%;z-index:4;bottom:4%}.k-syncs-phone img,.k-syncs-phone::after{border-radius:18%/8.4%}
.k-syncs-mac::after{animation-delay:0s}.k-syncs-tv::after{animation-delay:.5s}.k-syncs-ipad::after{animation-delay:1s}.k-syncs-phone::after{animation-delay:1.5s}
@keyframes k-syncs-sweep{0%,10%{background-position:100% 0}35%,100%{background-position:0 0}}
.js .k-syncs .k-syncs-s{opacity:0;transition:opacity .9s ease,transform 1.1s var(--ease)}
.js .k-syncs .k-syncs-mac{transform:translateX(-8%)}.js .k-syncs .k-syncs-ipad{transform:translateX(8%)}.js .k-syncs .k-syncs-phone{transform:translateX(30%)}.js .k-syncs .k-syncs-tv{transform:translateY(6%)}
.js .k-syncs.in .k-syncs-s{opacity:1;transform:none}
.js .k-syncs.in .k-syncs-tv{transition-delay:.1s}.js .k-syncs.in .k-syncs-ipad{transition-delay:.25s}.js .k-syncs.in .k-syncs-phone{transition-delay:.4s}
.k-syncs-pill{display:inline-flex;align-items:center;gap:10px;margin-top:8px;padding:10px 18px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px #0000000f,0 10px 30px #0a84ff33;font-size:15px;font-weight:650;color:var(--ink)}
.k-syncs-pill svg{width:20px;height:20px;fill:none;stroke:#0a84ff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;animation:k-sync-spin 4s linear infinite}
@media(max-width:734px){.k-syncs-stage{aspect-ratio:1.9}.k-syncs-mac{width:44%}.k-syncs-tv{left:16%;width:62%}.k-syncs-ipad{width:36%;right:4%}.k-syncs-phone{width:15%}}
@media(prefers-reduced-motion:reduce){.k-syncs-s::after,.k-syncs-pill svg{animation:none}}
.k-ai-line{color:var(--sub)}
.k-ds-people .k-ds-row2{grid-template-columns:repeat(6,1fr);margin-bottom:.9em}.k-ds-people{gap:.55em}
.k-sp-ask .k-sp-sugg{grid-template-columns:repeat(4,minmax(0,1fr));width:100%}
.k-sp-ask{padding-top:5cqmin}
.k-syncs-tv{left:20%;width:54%}.k-syncs-ipad{right:6.5%;width:29%}

/* Voice: smoother listening. Bars scale (not resize) with their own amplitude and speed; the whole
   wave swells while listening, then settles as the words land; the mic sends out soft rings. */
.k-sp-ask{gap:1em}
.k-sp-voice{display:flex;align-items:center;justify-content:center;gap:1.1em;margin:.2em 0 .5em}
.k-sp-mic{position:relative;width:3.2em;height:3.2em;border-radius:50%;display:grid;place-items:center;background:#fff;color:#000;box-shadow:0 .5em 1.6em #0008;animation:none}
.k-sp-mic::before,.k-sp-mic::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #30d158;opacity:0;animation:k-sp-ring 2.4s cubic-bezier(.2,.6,.3,1) infinite}
.k-sp-mic::after{animation-delay:1.2s}
@keyframes k-sp-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.9);opacity:0}}
.k-sp-wave{display:block;height:2.6em;width:9.5em}
.k-sp-env{display:flex;align-items:center;justify-content:space-between;height:100%;animation:k-sp-env 8s cubic-bezier(.4,0,.2,1) infinite;transform-origin:50% 50%}
.k-sp-env i{display:block;width:.2em;height:100%;border-radius:9px;background:linear-gradient(#5ef08a,#30d158);transform:scaleY(calc(var(--a) * .25));transform-origin:50% 50%;animation-name:k-sp-bar;animation-timing-function:cubic-bezier(.45,0,.55,1);animation-iteration-count:infinite;animation-direction:alternate;will-change:transform}
@keyframes k-sp-bar{0%{transform:scaleY(calc(var(--a) * .18))}100%{transform:scaleY(var(--a))}}
@keyframes k-sp-env{0%{transform:scaleY(.12);opacity:.5}6%,30%{transform:scaleY(1);opacity:1}40%,92%{transform:scaleY(.1);opacity:.55}100%{transform:scaleY(.12);opacity:.5}}
.k-sp-askfield{margin-top:.1em}
.k-sp-w{display:inline-block;opacity:0;filter:blur(.25em);transform:translateY(.35em);animation:k-sp-word2 8s cubic-bezier(.2,.8,.2,1) infinite}
.k-sp-w0{animation-delay:.3s}.k-sp-w1{animation-delay:.55s}.k-sp-w2{animation-delay:.8s}.k-sp-w3{animation-delay:1.05s}.k-sp-w4{animation-delay:1.3s}.k-sp-w5{animation-delay:1.55s}.k-sp-w6{animation-delay:1.8s}
@keyframes k-sp-word2{0%{opacity:0;filter:blur(.25em);transform:translateY(.35em)}5%,88%{opacity:1;filter:none;transform:none}96%,100%{opacity:0;filter:blur(.2em);transform:none}}
.k-sp-ask .k-sp-grp{animation:k-sp-pop9 8s ease infinite;animation-delay:0s}
.k-sp-sugg>span{animation:k-sp-pop9 8s cubic-bezier(.2,1.3,.4,1) infinite}
.k-sp-sugg .k-sp-r2{animation-delay:.1s}.k-sp-sugg .k-sp-r3{animation-delay:.22s}.k-sp-sugg .k-sp-r4{animation-delay:.34s}.k-sp-sugg .k-sp-r5{animation-delay:.46s}
@keyframes k-sp-pop9{0%,36%{opacity:0;transform:translateY(.8em) scale(.94)}44%,90%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
@media(prefers-reduced-motion:reduce){.k-sp-env,.k-sp-env i,.k-sp-mic::before,.k-sp-mic::after{animation:none}.k-sp-w{opacity:1;filter:none;transform:none}}
.k-sp-env i:nth-child(1){--a:0.30;animation-duration:0.95s;animation-delay:-0.85s}
.k-sp-env i:nth-child(2){--a:0.21;animation-duration:0.74s;animation-delay:-0.50s}
.k-sp-env i:nth-child(3){--a:0.34;animation-duration:1.07s;animation-delay:-0.15s}
.k-sp-env i:nth-child(4){--a:0.37;animation-duration:0.86s;animation-delay:-1.01s}
.k-sp-env i:nth-child(5){--a:0.34;animation-duration:0.64s;animation-delay:-0.66s}
.k-sp-env i:nth-child(6){--a:0.60;animation-duration:0.98s;animation-delay:-0.31s}
.k-sp-env i:nth-child(7){--a:0.53;animation-duration:0.76s;animation-delay:-1.16s}
.k-sp-env i:nth-child(8){--a:0.61;animation-duration:1.10s;animation-delay:-0.81s}
.k-sp-env i:nth-child(9){--a:0.91;animation-duration:0.88s;animation-delay:-0.46s}
.k-sp-env i:nth-child(10){--a:0.65;animation-duration:0.67s;animation-delay:-0.12s}
.k-sp-env i:nth-child(11){--a:0.85;animation-duration:1.00s;animation-delay:-0.97s}
.k-sp-env i:nth-child(12){--a:0.91;animation-duration:0.79s;animation-delay:-0.62s}
.k-sp-env i:nth-child(13){--a:0.58;animation-duration:1.12s;animation-delay:-0.27s}
.k-sp-env i:nth-child(14){--a:0.78;animation-duration:0.91s;animation-delay:-1.12s}
.k-sp-env i:nth-child(15){--a:0.59;animation-duration:0.69s;animation-delay:-0.77s}
.k-sp-env i:nth-child(16){--a:0.41;animation-duration:1.03s;animation-delay:-0.43s}
.k-sp-env i:nth-child(17){--a:0.51;animation-duration:0.81s;animation-delay:-0.08s}
.k-sp-env i:nth-child(18){--a:0.31;animation-duration:1.15s;animation-delay:-0.93s}
.k-sp-env i:nth-child(19){--a:0.29;animation-duration:0.93s;animation-delay:-0.58s}
.k-sp-env i:nth-child(20){--a:0.33;animation-duration:0.72s;animation-delay:-0.23s}
.k-sp-env i:nth-child(21){--a:0.20;animation-duration:1.05s;animation-delay:-1.08s}
/* The words land left to right on one timeline (a soft mask sweeps across), in step with the wave */
.k-sp-ask .k-sp-w{opacity:1;filter:none;transform:none;animation:none}
.k-sp-said{display:inline-block;-webkit-mask-image:linear-gradient(90deg,#000 40%,#0000 60%);mask-image:linear-gradient(90deg,#000 40%,#0000 60%);-webkit-mask-size:260% 100%;mask-size:260% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:k-sp-said 8s cubic-bezier(.4,0,.2,1) infinite}
@keyframes k-sp-said{0%,4%{-webkit-mask-position:100% 0;mask-position:100% 0;opacity:1}30%,90%{-webkit-mask-position:0 0;mask-position:0 0;opacity:1}97%,100%{-webkit-mask-position:0 0;mask-position:0 0;opacity:0}}
@media(prefers-reduced-motion:reduce){.k-sp-said{animation:none;-webkit-mask-image:none;mask-image:none}}
/* Next Episode: the label never changes the button's size. Every label it shows sits in one grid
   cell, so the button is always as wide as the longest, and the countdown uses tabular digits. */
.k-next-label{display:inline-grid;justify-items:start}
.k-next-label>*{grid-area:1/1}
.k-next-ghost{visibility:hidden}
.k-next-label,.k-next-ghost,[data-next-count]{font-variant-numeric:tabular-nums}
/* One statement: it holds in the middle of a full-height wall */
.k-statements-one .k-statements-list{padding-block:42vh 40vh}
/* Sync: generic frames, and a soft halo that passes from device to device (replaces the sheen) */
.k-syncs-s::after{content:none}
.k-syncs-frame{position:relative;display:block;background:#0b0b0c;border-radius:16px;padding:1.1%;box-shadow:0 0 0 1px #ffffff12 inset,0 0 0 1px #00000026,0 26px 60px #00000052;animation:k-syncs-halo 8s ease-in-out infinite}
.k-syncs-frame img{border-radius:8px;box-shadow:none}
.k-syncs-mac .k-syncs-frame{padding:1.6% 1.6% 4.2%;border-radius:14px}
.k-syncs-mac .k-syncs-frame img{border-radius:8px;filter:none}
.k-syncs-ipad .k-syncs-frame{padding:2.6%;border-radius:22px}
.k-syncs-phone .k-syncs-frame{padding:6%;border-radius:22%/10.5%}
.k-syncs-phone .k-syncs-frame img{border-radius:16%/7.6%}
.k-syncs-tv .k-syncs-frame{padding:.9%;border-radius:10px}
.k-syncs-tv .k-syncs-frame img{border-radius:4px}
.k-syncs-stand{display:block;width:22%;height:10px;margin:0 auto;background:linear-gradient(#2a2a2c,#111);border-radius:0 0 8px 8px}
.k-syncs-tv{bottom:4%}
.k-syncs-mac .k-syncs-frame{animation-delay:0s}.k-syncs-tv .k-syncs-frame{animation-delay:2s}.k-syncs-ipad .k-syncs-frame{animation-delay:4s}.k-syncs-phone .k-syncs-frame{animation-delay:6s}
@keyframes k-syncs-halo{0%,100%{box-shadow:0 0 0 1px #ffffff12 inset,0 0 0 1px #00000026,0 26px 60px #00000052}12%{box-shadow:0 0 0 1px #ffffff12 inset,0 0 0 2px #0a84ff8c,0 0 44px #0a84ff40,0 26px 60px #00000052}26%{box-shadow:0 0 0 1px #ffffff12 inset,0 0 0 1px #00000026,0 26px 60px #00000052}}
@media(prefers-reduced-motion:reduce){.k-syncs-frame{animation:none}}
/* Trakt card */
.k-sp-trakt{gap:.8em;align-content:start;padding-top:2cqmin}
.k-tk-logo{display:block;padding:.6em .8em}
.k-tk-logo img{display:block;height:1.6em;width:auto}
.k-tk-panel{display:grid;gap:.5em;width:100%;padding:.9em;border-radius:1em;background:#1c1c1ef2;border:1px solid #ffffff1f}
.k-tk-panel>small{color:#a1a1a6;font-weight:650;font-size:.8em}
.k-tk-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.4em}
.k-tk-row img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:.4em;display:block}
.k-tk-rate{display:grid;gap:.3em;margin-top:.2em}
.k-tk-rate b{font-size:.85em}
.k-tk-hearts{display:flex;gap:.25em}
.k-tk-hearts i{width:.8em;height:.8em;border-radius:50%;background:#ffffff26;animation:k-tk-heart 6s steps(1) infinite}
.k-tk-hearts i:nth-child(-n+9){animation-name:k-tk-heart}
.k-tk-hearts i:nth-child(10){animation:none}
.k-tk-hearts i:nth-child(1){animation-delay:.1s}.k-tk-hearts i:nth-child(2){animation-delay:.2s}.k-tk-hearts i:nth-child(3){animation-delay:.3s}.k-tk-hearts i:nth-child(4){animation-delay:.4s}.k-tk-hearts i:nth-child(5){animation-delay:.5s}.k-tk-hearts i:nth-child(6){animation-delay:.6s}.k-tk-hearts i:nth-child(7){animation-delay:.7s}.k-tk-hearts i:nth-child(8){animation-delay:.8s}.k-tk-hearts i:nth-child(9){animation-delay:.9s}
@keyframes k-tk-heart{0%{background:#ffffff26}8%,90%{background:#ed1c5c}100%{background:#ffffff26}}
.k-tk-toast{display:grid;grid-template-columns:3.4em 1fr auto;gap:.6em;align-items:center;width:100%;padding:.55em .7em;border-radius:.9em;background:#fff;color:#000;box-shadow:0 .8em 2em #000b;animation:k-tk-toast 6s cubic-bezier(.2,1.2,.4,1) infinite}
.k-tk-toast img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:.4em;display:block}
.k-tk-toast span{display:grid}.k-tk-toast b{font-size:.9em}.k-tk-toast small{color:#636366;font-size:.75em}
.k-spot .k-tk-toast svg{width:1.3em;height:1.3em;color:#30d158;stroke-width:2.6}
@keyframes k-tk-toast{0%,30%{opacity:0;transform:translateY(.8em) scale(.95)}40%,92%{opacity:1;transform:none}100%{opacity:0}}
/* Audio and subtitles card */
.k-sp-tracks{gap:.8em}
.k-tr-cols{display:grid;grid-template-columns:1fr 1fr;gap:.6em;width:100%}
.k-tr-col{display:grid;gap:.32em;align-content:start;padding:.6em;border-radius:1em;background:#1c1c1ef2;border:1px solid #ffffff1f}
.k-tr-col>small{color:#a1a1a6;font-weight:650;font-size:.78em;padding:0 .3em .15em}
.k-tr-opt{position:relative;display:flex;align-items:center;gap:.3em;padding:.48em .55em;border-radius:.6em;font-weight:600;font-size:.88em;white-space:nowrap}
.k-tr-opt em{margin-left:auto;font-style:normal;font-size:.75em;font-weight:700;padding:.1em .4em;border-radius:.35em;border:1px solid #ffffff40;color:#d1d1d6}
.k-tr-a0,.k-tr-a1,.k-tr-s1,.k-tr-s2{animation:k-tr-focus 8s ease-in-out infinite}
.k-tr-a1{animation-delay:-4s}.k-tr-s2{animation-delay:-4s}
@keyframes k-tr-focus{0%,44%{background:#fff;color:#000;transform:scale(1.04);box-shadow:0 .4em 1.2em #000b}50%,100%{background:none;color:#f5f5f7;transform:none;box-shadow:none}}
.k-tr-a0 em,.k-tr-a1 em,.k-tr-s1 em{border-color:currentColor;color:inherit}
/* On-device AI card */
.k-sp-ai{gap:.8em;align-content:center}
.k-ai-badge-sm{font-size:.85em;padding:.4em .9em .4em .7em}
.k-ai-card{display:grid;gap:.55em;width:100%;padding:.9em;border-radius:1em;background:#1c1c1ef2;border:1px solid #ffffff1f;position:relative;overflow:hidden}
.k-ai-card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(100deg,#ff6a3d,#e84393,#8a5cf6,#3a8dff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.75}
.k-ai-head{display:flex;gap:.6em;align-items:center}
.k-ai-head img{width:2.4em;aspect-ratio:2/3;object-fit:cover;border-radius:.3em}
.k-ai-head span{display:grid}.k-ai-head b{font-size:1em}.k-ai-head small{color:#a1a1a6;font-size:.78em}
.k-ai-text{font-size:.92em;line-height:1.4;-webkit-mask-image:linear-gradient(180deg,#000 45%,#0000 55%);mask-image:linear-gradient(180deg,#000 45%,#0000 55%);-webkit-mask-size:100% 260%;mask-size:100% 260%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:k-ai-write 8s cubic-bezier(.4,0,.2,1) infinite}
@keyframes k-ai-write{0%,6%{-webkit-mask-position:0 100%;mask-position:0 100%}40%,100%{-webkit-mask-position:0 0;mask-position:0 0}}
.k-ai-note{color:#8e8e93;font-size:.72em}
.k-ai-recap{display:grid;gap:.1em;width:100%;padding:.6em .9em;border-radius:.9em;background:#2c2c2ecc;border:1px solid #ffffff14}
.k-ai-recap b{font-size:.92em}.k-ai-recap small{color:#a1a1a6;font-size:.75em}
@media(prefers-reduced-motion:reduce){.k-ai-text{animation:none;-webkit-mask-image:none;mask-image:none}.k-tk-toast{animation:none}}
/* The screen wall band under the hero */
.k>.k-wallband{position:relative;height:min(82vh,760px);padding:0;background:#000;overflow:hidden}
.k-wallband .k-wall::after{background:linear-gradient(#000 0%,#0000 12%,#0000 88%,#000 100%),linear-gradient(90deg,#000 0%,#0000 8%,#0000 92%,#000 100%)}
.k-wallband .k-wall-row{height:calc(min(82vh,760px) * .41)}
.k-wallband .k-wall-top{top:6%}.k-wallband .k-wall-bottom{bottom:6%}
@media(max-width:734px){.k>.k-wallband{height:62vh}.k-wallband .k-wall-row{height:26vh}}
@media(prefers-reduced-motion:reduce){.k-wallband .k-wall-row{animation:none}}
.k>.k-wallband-one{height:min(52vh,470px)}
.k-wallband-one .k-wall-top{top:50%;transform:translateY(-50%)}
.k-wallband-one .k-wall-row{height:calc(min(52vh,470px) * .74)}
.k-wallband-one .k-wall-top{animation-name:k-wall-one}
@keyframes k-wall-one{from{transform:translate(0,-50%)}to{transform:translate(-50%,-50%)}}
@media(max-width:734px){.k>.k-wallband-one{height:40vh}.k-wallband-one .k-wall-row{height:28vh}}

/* A shorter wave: 15 bars across 5.6em */
.k-sp-wave{width:5.6em}
.k-sp-env i:nth-child(1){--a:0.30;animation-duration:0.95s;animation-delay:-0.85s}
.k-sp-env i:nth-child(2){--a:0.22;animation-duration:0.74s;animation-delay:-0.50s}
.k-sp-env i:nth-child(3){--a:0.39;animation-duration:1.07s;animation-delay:-0.15s}
.k-sp-env i:nth-child(4){--a:0.46;animation-duration:0.86s;animation-delay:-1.01s}
.k-sp-env i:nth-child(5){--a:0.45;animation-duration:0.64s;animation-delay:-0.66s}
.k-sp-env i:nth-child(6){--a:0.83;animation-duration:0.98s;animation-delay:-0.31s}
.k-sp-env i:nth-child(7){--a:0.72;animation-duration:0.76s;animation-delay:-1.16s}
.k-sp-env i:nth-child(8){--a:0.74;animation-duration:1.10s;animation-delay:-0.81s}
.k-sp-env i:nth-child(9){--a:0.95;animation-duration:0.88s;animation-delay:-0.46s}
.k-sp-env i:nth-child(10){--a:0.56;animation-duration:0.67s;animation-delay:-0.12s}
.k-sp-env i:nth-child(11){--a:0.58;animation-duration:1.00s;animation-delay:-0.97s}
.k-sp-env i:nth-child(12){--a:0.50;animation-duration:0.79s;animation-delay:-0.62s}
.k-sp-env i:nth-child(13){--a:0.27;animation-duration:1.12s;animation-delay:-0.27s}
.k-sp-env i:nth-child(14){--a:0.33;animation-duration:0.91s;animation-delay:-1.12s}
.k-sp-env i:nth-child(15){--a:0.26;animation-duration:0.69s;animation-delay:-0.77s}
/* Sync with Apple's device images: the pill sits in the space between TV and row */
.k-sync-devices{margin-top:48px;gap:calc(var(--u) * 26)}
.k-sync-devices .k-family-row{gap:calc(var(--u) * 30)}
.k-sync-devices .k-syncs-pill{margin:0}
/* Sync, stacked: true sizes in mm (TV image 811 x 524, Mac 385.6 x 253.7, iPad 288.7 x 221.3,
   iPhone 74.6 x 152.3); the front devices stand 44 mm below the TV image's bottom edge */
.k-stack{--u:min(calc((100vw - 48px) / 811),1.36px);margin:56px auto 0;display:grid;justify-items:center;gap:22px}
.k-stack-stage{position:relative;width:calc(var(--u) * 811);height:calc(var(--u) * 568)}
.k-stack-d{position:absolute;display:block}
.k-stack-d .mock{width:100%;max-width:none;height:auto}
.k-stack-tv{left:0;top:0;width:calc(var(--u) * 811);z-index:0}
.k-stack-mac{left:calc(var(--u) * 205);bottom:0;width:calc(var(--u) * 385.6);z-index:1}
.k-stack-ipad{left:calc(var(--u) * 18);bottom:calc(var(--u) * 6);width:calc(var(--u) * 288.7);z-index:2}
.k-stack-phone{left:calc(var(--u) * 470);bottom:calc(var(--u) * 2);width:calc(var(--u) * 74.6);z-index:3}
.js .k-stack .k-stack-d{opacity:0;transition:opacity .9s ease,transform 1.1s var(--ease)}
.js .k-stack .k-stack-ipad{transform:translateX(-4%)}.js .k-stack .k-stack-mac{transform:translateY(6%)}.js .k-stack .k-stack-phone{transform:translateY(12%)}
.js .k-stack.in .k-stack-d{opacity:1;transform:none}
.js .k-stack.in .k-stack-mac{transition-delay:.15s}.js .k-stack.in .k-stack-ipad{transition-delay:.3s}.js .k-stack.in .k-stack-phone{transition-delay:.45s}
/* Sync stack, aligned: every device stands on the Apple TV box's baseline. The TV image is 524.4 mm
   tall with 19.8 mm of transparent margin under the box; each front image's own transparent
   bottom margin (Mac 1.1, iPad 2.7, iPhone 1.2 mm) is taken off, so the visible bottoms line up. */
.k-stack-stage{height:calc(var(--u) * 524.4)}
.k-stack-mac{bottom:calc(var(--u) * 18.7)}
.k-stack-ipad{bottom:calc(var(--u) * 17.1)}
.k-stack-phone{bottom:calc(var(--u) * 18.6)}
.k-stack{gap:0;margin-top:40px}
/* Carousels run to the edge of the window, as apple.com's "Get to know" rows do: the first card
   lines up with the page column, cards pass under both window edges as you scroll, and the last
   one can scroll fully into view. */
.k-carousel-track{--bleed:max(24px,calc((100vw - var(--max)) / 2));margin-inline:calc(-1 * var(--bleed));padding-inline:var(--bleed);scroll-padding-inline:var(--bleed)}
.k-mac-keys .k-carousel-track{margin-inline:0;padding-inline:2px}
@media(max-width:734px){.k-carousel-track{--bleed:24px}}

/* ---------- Spacing pass (Emil design-engineering review, 19 Oct) ---------- */
/* Two white sections in a row: one section's padding between them, not two */
.k>section:not(.k-band):not(.k-dark):not(.k-wallband):not(.k-endcard)+section:not(.k-band):not(.k-dark):not(.k-wallband){padding-top:32px}
/* Headings break into even lines instead of leaving one word alone */
.k-title .w{text-wrap:balance}
/* Emby's mark is a wordmark: give it the same visual weight as the square marks */
.k-service img[src*="emby"]{width:78px;height:auto;max-height:none}
/* Search Everything: names wrap rather than cut off */
.k-sp-searchall .k-sp-person b{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.15}
/* Upright guide tile: cells keep clear of the panel edge */
.k-sp-phone{padding:.9em}
/* Track options: room around the format badge */
.k-tr-opt{padding:.55em .75em}
/* Showcase pills on phones run to the window edge, like the carousels */
@media(max-width:900px){.k-show-list{margin-inline:-24px;padding-inline:24px;scroll-padding-inline:24px}}
/* Collection on phones: the fan fits its stage */
@media(max-width:734px){.k-ds-fanp{width:6.4em}.k-ds-coll{padding:6cqmin 6cqmin 8cqmin!important}}
/* Cards and pills feel pressed (Emil: scale on :active) */
.k-show-list button,.k-know-open,.k-carousel-nav button,.k-billing button,.k-filter button,.k-film-open,.k-next-btn{transition:transform 160ms cubic-bezier(.23,1,.32,1),background-color .2s ease,color .2s ease}
.k-show-list button:active,.k-know-open:active,.k-carousel-nav button:active,.k-billing button:active,.k-filter button:active,.k-film-open:active,.k-next-btn:active{transform:scale(.97)}
.k-sp-searchall .k-sp-person{padding:.6em .8em}
.k-service img[src*="emby"]{width:78px;height:44px;object-fit:contain;object-position:0 50%}
/* More Like This, smoother: each poster eases up and back down (no jump when its cycle restarts),
   only transform and opacity animate, and the focus ring is a pseudo-element that fades */
.k-ds-like .k-ds-f{animation:k-ds-lift2 10s cubic-bezier(.45,0,.2,1) infinite;will-change:transform;overflow:visible}
.k-ds-like .k-ds-f img{border-radius:.6em}
.k-ds-like .k-ds-f::after{content:"";position:absolute;inset:0;border-radius:.6em;box-shadow:0 0 0 .16em #fff,0 1.2em 2.4em #000c,0 0 2.4em color-mix(in srgb,var(--spot) 70%,#0000);opacity:0;animation:k-ds-ring2 10s cubic-bezier(.45,0,.2,1) infinite;animation-delay:inherit;pointer-events:none}
@keyframes k-ds-lift2{0%{transform:none}5%,17%{transform:translateY(-.45em) scale(1.08)}23%,100%{transform:none}}
@keyframes k-ds-ring2{0%{opacity:0}5%,17%{opacity:1}23%,100%{opacity:0}}
.k-ds-like .k-ds-p{box-shadow:0 .5em 1.2em #0009}
@media(prefers-reduced-motion:reduce){.k-ds-like .k-ds-f,.k-ds-like .k-ds-f::after{animation:none}}

/* ---------- Motion pass (Emil checklist): focus cycles ease in from rest. Each of these used to
   start its cycle already raised, so it snapped up whenever the loop restarted. ---------- */
@keyframes k-sp-pick4{0%{transform:scale(.94);opacity:.6}4%,22%{transform:scale(1.16);opacity:1}28%,100%{transform:scale(.94);opacity:.6}}
@keyframes k-sp-ring4{0%{box-shadow:0 0 0 0 #fff0}4%,22%{box-shadow:0 0 0 .16em #fff,0 0 2.2em color-mix(in srgb,var(--spot) 75%,#0000)}28%,100%{box-shadow:0 0 0 0 #fff0}}
@keyframes k-sp-fbg{0%{opacity:0}4%,22%{opacity:1}28%,100%{opacity:0}}
@keyframes k-sp-ftext{0%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}4%,22%{color:#000;transform:scale(1.06);box-shadow:0 .6em 1.6em #000b,0 0 1.8em color-mix(in srgb,var(--spot) 55%,#0000);z-index:1}28%,100%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}}
@keyframes k-sp-fbg3{0%{opacity:0}5%,28%{opacity:1}34%,100%{opacity:0}}
@keyframes k-sp-ftext3{0%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}5%,28%{color:#000;transform:scale(1.06);box-shadow:0 .6em 1.6em #000b,0 0 1.8em color-mix(in srgb,var(--spot) 55%,#0000);z-index:1}34%,100%{color:#f5f5f7;transform:none;box-shadow:none;z-index:0}}
@keyframes k-sp-mvf{0%{box-shadow:none;transform:none;z-index:0}4%,22%{box-shadow:0 0 0 .22em #fff,0 0 2.2em color-mix(in srgb,var(--spot) 65%,#0000);transform:scale(1.03);z-index:1}28%,100%{box-shadow:none;transform:none;z-index:0}}
@keyframes k-mv-focus{0%{box-shadow:none;transform:none}4%,22%{box-shadow:0 0 0 .22em #fff,0 .6em 1.6em #000a;transform:scale(1.02)}28%,100%{box-shadow:none;transform:none}}
@keyframes k-m-focus{0%{background:none;color:#f5f5f7;box-shadow:none}4%,22%{background:#fff;color:#000;box-shadow:0 .3em 1em #000a}28%,100%{background:none;color:#f5f5f7;box-shadow:none}}
@keyframes k-g-focus{0%{opacity:0}4%,22%{opacity:1}28%,100%{opacity:0}}
@keyframes k-g-text{0%{color:#f5f5f7;transform:none;box-shadow:none}4%,22%{color:#000;transform:scale(1.03);box-shadow:0 .4em 1.2em #000a}28%,100%{color:#f5f5f7;transform:none;box-shadow:none}}
@keyframes k-ds-opt{0%{background:none;color:#f5f5f7;transform:none;box-shadow:none}4%,44%{background:#fff;color:#000;transform:scale(1.05);box-shadow:0 .5em 1.4em #000b}50%,100%{background:none;color:#f5f5f7;transform:none;box-shadow:none}}
@keyframes k-ds-tick{0%{opacity:0}4%,44%{opacity:1}50%,100%{opacity:0}}
@keyframes k-ds-wf{0%{background:#2c2c2ecc;color:#f5f5f7;transform:none;box-shadow:none}4%,44%{background:#fff;color:#000;transform:scale(1.04);box-shadow:0 .6em 1.6em #000b}50%,100%{background:#2c2c2ecc;color:#f5f5f7;transform:none;box-shadow:none}}
@keyframes k-ds-lift{0%{transform:none}5%,40%{transform:translateY(-.6em) scale(1.06)}50%,100%{transform:none}}
@keyframes k-tr-focus{0%{background:none;color:#f5f5f7;transform:none;box-shadow:none}4%,44%{background:#fff;color:#000;transform:scale(1.04);box-shadow:0 .4em 1.2em #000b}50%,100%{background:none;color:#f5f5f7;transform:none;box-shadow:none}}
@keyframes k-ui-pick{0%{transform:none}5%,42%{transform:scale(1.12)}50%,100%{transform:none}}
@keyframes k-sp-pick{0%{transform:scale(.9);opacity:.55}5%,42%{transform:scale(1.14);opacity:1}50%,100%{transform:scale(.9);opacity:.55}}

/* ---------- Make it yours cards: spacing and motion ---------- */
/* Audio and subtitles: audio as a list, subtitles as chips beneath, so nothing is cramped */
.k-sp-tracks{gap:.7em}
.k-tr-cols{grid-template-columns:1fr;gap:.55em}
.k-tr-col{padding:.65em .7em}
.k-tr-subs{display:flex;flex-wrap:wrap;gap:.35em}
.k-tr-subs .k-tr-opt{padding:.42em .7em;border-radius:999px;background:#ffffff14}
.k-tr-a0,.k-tr-a1,.k-tr-s1,.k-tr-s2{animation-duration:8s}
/* Search: channel names fit */
.k-sp-tv{grid-template-columns:6.4em 1fr}
/* Trakt: keep the toast clear of the + button */
.k-sp-trakt{padding-bottom:20cqmin!important}
/* On-device AI: badge in the card's header; the summary appears with a soft blur-in (no hard
   mask edge), holds, then fades before the loop; the card's gradient edge glows while writing */
.k-sp-ai{gap:.6em;padding-bottom:18cqmin!important}
.k-ai-card{gap:.6em;padding:1em 1.05em 1.05em}
.k-ai-head{justify-content:space-between}
.k-ai-head>span:first-of-type{display:flex;gap:.6em;align-items:center}
.k-ai-head .k-ai-badge-sm{font-size:.72em;padding:.32em .7em .32em .55em;margin:0;box-shadow:none}
.k-ai-text{-webkit-mask-image:none;mask-image:none;animation:k-ai-in 9s cubic-bezier(.23,1,.32,1) infinite}
@keyframes k-ai-in{0%,6%{opacity:0;filter:blur(6px);transform:translateY(.3em)}22%,86%{opacity:1;filter:none;transform:none}94%,100%{opacity:0;filter:blur(3px);transform:none}}
.k-ai-card::before{animation:k-ai-edge 9s ease-in-out infinite}
@keyframes k-ai-edge{0%,6%{opacity:.35}16%{opacity:1}30%,100%{opacity:.5}}
.k-ai-note{animation:k-ai-note 9s ease infinite}
@keyframes k-ai-note{0%,20%{opacity:0}28%,86%{opacity:1}94%,100%{opacity:0}}
.k-ai-recap{display:flex;align-items:center;gap:.7em;padding:.65em .9em}
.k-ai-recap>span{display:grid;gap:.1em}
.k-ai-recap svg{width:1.1em;height:1.1em;color:#a1a1a6;margin-left:auto}
@media(prefers-reduced-motion:reduce){.k-ai-text,.k-ai-note,.k-ai-card::before{animation:none;opacity:1;filter:none}}
/* Trakt, simpler: the logo, the watchlist and a finished film, all still */
.k-sp-trakt{align-content:center;gap:.9em;padding-bottom:14cqmin!important}
.k-tk-done{display:grid;grid-template-columns:3.2em 1fr auto;gap:.65em;align-items:center;width:100%;padding:.6em .75em;border-radius:.9em;background:#1c1c1ef2;border:1px solid #ffffff1f}
.k-tk-done img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:.4em;display:block}
.k-tk-done span{display:grid}.k-tk-done b{font-size:.9em}.k-tk-done small{color:#a1a1a6;font-size:.75em}
.k-spot .k-tk-done svg{width:1.2em;height:1.2em;color:#30d158;stroke-width:2.6}
/* Audio card: the card's own heading names it, so the panels start straight away */
.k-sp-tracks{align-content:center}
/* AI badge stays on one line */
.k-ai-head .k-ai-badge-sm{white-space:nowrap;font-size:.68em;flex:none}
.k-ai-head .k-ai-badge-sm svg{width:1em;height:1em}
.k-ai-head .k-ai-badge-sm{display:inline-flex;align-items:center;gap:.4em}
.k-spot .k-ai-badge svg{fill:currentColor;stroke:none;width:1em;height:1em}
/* Sync stack, rearranged (TV panel spans 14–749 mm and ends 436 mm down; the box is at 650–746
   and the remote at 765–799 mm). MacBook back-left, iPad front-right ending 21 mm before the box,
   iPhone front at their join: each overlap about a fifth, as on apple.com/apple-tv-app. */
.k-stack-mac{left:calc(var(--u) * 24)}
.k-stack-ipad{left:calc(var(--u) * 340)}
.k-stack-phone{left:calc(var(--u) * 318)}
/* Entrance (Emil: once, on arrival; transform and opacity only; strong ease-out; 80 ms stagger):
   the TV settles first, then the Mac, iPad and iPhone rise into place in front of it. */
.js .k-stack .k-stack-d{opacity:0;transition:opacity 600ms cubic-bezier(.23,1,.32,1),transform 900ms cubic-bezier(.23,1,.32,1)}
.js .k-stack .k-stack-tv{transform:scale(.97)}
.js .k-stack .k-stack-mac,.js .k-stack .k-stack-ipad,.js .k-stack .k-stack-phone{transform:translateY(14%)}
.js .k-stack.in .k-stack-d{opacity:1;transform:none}
.js .k-stack.in .k-stack-tv{transition-delay:0ms}
.js .k-stack.in .k-stack-mac{transition-delay:240ms}
.js .k-stack.in .k-stack-ipad{transition-delay:320ms}
.js .k-stack.in .k-stack-phone{transition-delay:400ms}
@media(prefers-reduced-motion:reduce){.js .k-stack .k-stack-d{transform:none;transition:opacity 200ms ease}}
/* Audio and Subtitles, again: two columns as the player shows them. Formats are quiet grey text,
   not boxes. Two settings alternate slowly (12 s): English audio with subtitles Off, then Spanish
   audio with English subtitles, so the subtitles never just repeat the audio's language. */
.k-tr-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6em}
.k-tr-col{padding:.7em .6em .6em;gap:.3em;min-width:0}
.k-tr-col>small{padding:0 .5em .25em}
.k-tr-opt{position:relative;isolation:isolate;display:flex;align-items:baseline;gap:.5em;padding:.62em .7em;border-radius:.65em;font-size:.92em;animation:none;background:none;color:#f5f5f7}
.k-tr-opt em{margin-left:auto;padding:0;border:0;font-style:normal;font-weight:600;font-size:.78em;color:#8e8e93}
.k-tr-opt::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;opacity:0;transform:scale(.96)}
.k-tr-pA,.k-tr-pB{animation:k-tr-text 12s cubic-bezier(.77,0,.175,1) infinite}
.k-tr-pA::before,.k-tr-pB::before{animation:k-tr-pill 12s cubic-bezier(.77,0,.175,1) infinite}
.k-tr-pB,.k-tr-pB::before{animation-delay:-6s}
@keyframes k-tr-pill{0%,2%{opacity:0;transform:scale(.96)}8%,44%{opacity:1;transform:none}50%,100%{opacity:0;transform:scale(.96)}}
@keyframes k-tr-text{0%,2%{color:#f5f5f7}8%,44%{color:#000}50%,100%{color:#f5f5f7}}
.k-tr-pA em,.k-tr-pB em{animation:k-tr-em 12s cubic-bezier(.77,0,.175,1) infinite;animation-delay:inherit}
@keyframes k-tr-em{0%,2%{color:#8e8e93}8%,44%{color:#3a3a3c}50%,100%{color:#8e8e93}}
.k-tr-subs{display:contents}
@media(prefers-reduced-motion:reduce){.k-tr-pA,.k-tr-pA::before,.k-tr-pA em{animation:none}.k-tr-pA::before{opacity:1;transform:none}.k-tr-pA{color:#000}.k-tr-pB,.k-tr-pB::before,.k-tr-pB em{animation:none}}
/* Make it yours demos pause on their held state between plays (kit.js, data-demo) */
.k-demo-paused .k-spot,.k-demo-paused .k-spot *,.k-demo-paused .k-spot *::before,.k-demo-paused .k-spot *::after{animation-play-state:paused!important}
/* Touch guide tile: video above keeps playing; the guide below scrolls in two flicks and back */
.k-sp-pic video{width:100%;height:100%;object-fit:cover;display:block}
.k-sp-pic .k-pause{display:none}
.k-sp-gwin{position:relative;display:block;height:9.6em;overflow:hidden;border-radius:.6em;-webkit-mask-image:linear-gradient(#000 80%,#0000);mask-image:linear-gradient(#000 80%,#0000)}
.k-sp-gscroll{display:grid;gap:.4em;animation:k-sp-gscroll 10s cubic-bezier(.77,0,.175,1) infinite;will-change:transform}
.k-sp-gscroll .k-sp-urow{grid-template-columns:6.6em 1fr 1fr}
.k-sp-urow-on .k-sp-cell:not(.k-sp-next){background:#fff;color:#000}
.k-sp-next{background:#2c2c2e}
@keyframes k-sp-gscroll{0%,14%{transform:none}30%,44%{transform:translateY(-32%)}60%,78%{transform:translateY(-58%)}94%,100%{transform:none}}
.k-sp-finger{position:absolute;right:22%;top:62%;width:2.2em;height:2.2em;margin:-1.1em;border-radius:50%;background:#ffffffa6;box-shadow:0 0 0 .35em #ffffff30;opacity:0;animation:k-sp-finger 10s cubic-bezier(.77,0,.175,1) infinite}
@keyframes k-sp-finger{0%,12%{opacity:0;transform:none}15%{opacity:1;transform:none}30%{opacity:1;transform:translateY(-2.6em)}33%,44%{opacity:0;transform:translateY(-2.6em)}46%{opacity:0;transform:none}48%{opacity:1;transform:none}60%{opacity:1;transform:translateY(-2.6em)}63%,100%{opacity:0;transform:translateY(-2.6em)}}
@media(prefers-reduced-motion:reduce){.k-sp-gscroll,.k-sp-finger{animation:none}}
.k-sp-gscroll .k-sp-urow{grid-template-columns:6.2em 1fr}
.k-sp-gscroll .k-sp-cell small{opacity:.65;font-size:.78em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-sp-gwin{height:10.4em}
.k-sp-tracks .k-tr-opt{padding:.72em .75em}.k-sp-tracks .k-tr-col{gap:.34em;padding:.85em .65em .7em}

/* ---------- Sources pages in the homepage's language ---------- */
.k>.k-sources-hub{padding-top:16px}
.k-sources-how .k-line{color:#a1a1a6;max-width:52ch}
.k-sources-how .k-bento{margin-top:48px}
.k-sources-how .k-tile-control{background:#111113;box-shadow:0 0 0 1px #ffffff14}
.k>.k-source-detail{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center;text-align:left}
.k-source-copy .k-title{font-size:clamp(2rem,3.6vw,3rem);margin:0 0 16px}
.k-source-copy .k-line{margin:0 0 14px;color:#a1a1a6;max-width:44ch}
.k-source-copy h3{font-size:22px;letter-spacing:-.02em;margin:28px 0 8px;color:#f5f5f7}
.k-source-stage{position:relative;aspect-ratio:4/3.4;border-radius:var(--radius);background:#111113;box-shadow:0 0 0 1px #ffffff14;overflow:hidden;container-type:size}
.k-source-stage .k-tui{font-size:clamp(10px,min(2.6cqw,3.1cqh),16px)}
.k-source-related .k-gs{margin-top:32px}
.k-other-sources .k-source-nav a{background:#fff}
@media(max-width:1000px){.k>.k-source-detail{grid-template-columns:1fr;gap:36px}}

/* ---------- Devices page ---------- */
.k-devices-hero .k-stack{margin-top:56px}
.k-dcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:48px;text-align:left}
.k-dcard{display:flex;flex-direction:column;gap:8px;background:#fff;border-radius:var(--radius);padding:28px 26px 26px}
.k-dcard-media{height:200px;display:grid;place-items:end center;margin-bottom:16px}
.k-dcard-media .mock{max-width:100%;max-height:200px;width:auto;height:auto}
.k-dcard h3{font-size:26px;letter-spacing:-.025em;margin:0}
.k-dcard-req{margin:0;color:var(--sub);font-size:15px}
.k-dcard ul{list-style:none;padding:14px 0 0;margin:6px 0 4px;border-top:1px solid var(--line);display:grid;gap:8px;font-size:15px;line-height:1.35;flex:1}
.k-dcard .k-link{font-size:16px}
@media(max-width:1000px){.k-dcards{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.k-dcards{grid-template-columns:1fr}.k-dcard-media{height:180px}}
/* Trakt: a film is marked as watched (the button is pressed, turns to a tick) and lands in your
   Trakt history. One 6 s play, then it holds on the finished state. */
.k-sp-trakt{gap:1em}
.k-tk-film{display:grid;grid-template-columns:3.6em 1fr;grid-template-rows:auto auto;column-gap:.7em;row-gap:.65em;align-items:center;width:100%;padding:.75em;border-radius:1em;background:#1c1c1ef2;border:1px solid #ffffff1f}
.k-tk-film>img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:.45em;display:block}
.k-tk-film>span:first-of-type{display:grid}.k-tk-film b{font-size:.95em}.k-tk-film small{color:#a1a1a6;font-size:.78em}
.k-tk-btn{grid-column:1/-1;position:relative;display:grid;height:2.5em;border-radius:999px;overflow:hidden;animation:k-tk-press 6s cubic-bezier(.23,1,.32,1) infinite}
.k-tk-btn>span{grid-area:1/1;display:flex;align-items:center;justify-content:center;gap:.45em;font-weight:650;font-size:.92em;border-radius:inherit}
.k-tk-mark{background:#fff;color:#000;animation:k-tk-out 6s cubic-bezier(.23,1,.32,1) infinite}
.k-tk-watched{background:#30d158;color:#04210d;opacity:0;transform:scale(.96);animation:k-tk-in 6s cubic-bezier(.23,1,.32,1) infinite}
.k-spot .k-tk-btn svg{width:1em;height:1em;stroke-width:2.4}
@keyframes k-tk-press{0%,26%{transform:none}29%{transform:scale(.95)}34%,100%{transform:none}}
@keyframes k-tk-out{0%,29%{opacity:1}34%,100%{opacity:0}}
@keyframes k-tk-in{0%,29%{opacity:0;transform:scale(.96)}36%,100%{opacity:1;transform:none}}
.k-tk-done{animation:k-tk-land 6s cubic-bezier(.23,1,.32,1) infinite}
@keyframes k-tk-land{0%,40%{opacity:0;transform:translateY(.7em)}50%,100%{opacity:1;transform:none}}
.k-tk-done .k-tk-mini{width:auto;height:1em;aspect-ratio:auto;border-radius:0;object-fit:contain}
.k-tk-done{grid-template-columns:auto 1fr auto}
@media(prefers-reduced-motion:reduce){.k-tk-btn,.k-tk-mark,.k-tk-watched,.k-tk-done{animation:none}.k-tk-mark{opacity:0}.k-tk-watched{opacity:1;transform:none}}
.k-sources-how .k-tui-piece{font-size:clamp(8px,min(2.1cqw,2.25cqh),13px);align-content:center}
.k-sources-how .k-tall .k-tui-piece{font-size:clamp(8px,min(3.4cqw,2.6cqh),13px)}
.k-other-sources .k-source-nav a[aria-current="page"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.k-source-stage .k-tui-piece{font-size:clamp(9px,min(2.6cqw,2.4cqh),15px)}
/* Next Episode button: the label box animates its width between states (kit.js sets it) */
.k-next-label{display:inline-block;position:relative;white-space:nowrap;overflow:hidden;text-align:left;transition:width 450ms cubic-bezier(.77,0,.175,1)}
.k-next-label>*{grid-area:auto}
.k-next-ghost{position:absolute;left:0;top:0;visibility:hidden;white-space:nowrap}
[data-next-count]{display:inline-block;transition:opacity 140ms ease,filter 140ms ease}
.k-next-label.swap [data-next-count]{opacity:0;filter:blur(3px)}
@media(prefers-reduced-motion:reduce){.k-next-label{transition:none}}
/* Make it yours: the card's light drifts slowly the whole time, so a held card still feels alive */
.k-know-card:has(.k-spot){isolation:isolate}
.k-know-card:has(.k-spot)::after{content:"";position:absolute;inset:-20%;z-index:-1;background:radial-gradient(40% 32% at 50% 60%,color-mix(in srgb,var(--card-spot,#2f7bff) 38%,#0000),#0000 100%);animation:k-card-drift 14s ease-in-out infinite alternate;pointer-events:none}
.k-know-card:has(.k-spot)>*{position:relative}
.k-know-card:has(.k-spot) .k-know-open{position:absolute}
@keyframes k-card-drift{0%{transform:translate(-6%,4%) scale(1);opacity:.7}50%{transform:translate(5%,-3%) scale(1.12);opacity:1}100%{transform:translate(-2%,-6%) scale(1.04);opacity:.8}}
@media(prefers-reduced-motion:reduce){.k-know-card:has(.k-spot)::after{animation:none}}

/* ---------- Smoothness pass: composited motion only ----------
   Off-screen demos pause (kit.js adds .k-idle). Panels no longer use backdrop blur (they are
   opaque anyway). Focus loops animate transform, opacity and colour only: their shadows and rings
   now live on pseudo-elements that fade, instead of animating box-shadow every frame. Each demo
   is contained, so its repaints stay inside it. */
.k-idle,.k-idle *,.k-idle *::before,.k-idle *::after{animation-play-state:paused!important}
.k-ui,.k-sp-picker,.k-next-btn{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.k-ui{background:#1c1c1ef7}.k-sp-picker{background:#1c1c1e}
.k-spot,.k-show-stage,.k-tile-ui,.k-know-media{contain:paint}
.k-sp-f::before{box-shadow:0 .6em 1.6em #000b,0 0 1.8em color-mix(in srgb,var(--spot) 55%,#0000)}
@keyframes k-sp-ftext{0%{color:#f5f5f7;transform:none}4%,22%{color:#000;transform:scale(1.06)}28%,100%{color:#f5f5f7;transform:none}}
@keyframes k-sp-ftext3{0%{color:#f5f5f7;transform:none}5%,28%{color:#000;transform:scale(1.06)}34%,100%{color:#f5f5f7;transform:none}}
.k-sp-f{z-index:0}
.k-sp-mvt::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 .22em #fff;opacity:0;animation:k-sp-mvring 8s ease-in-out infinite;animation-delay:inherit;pointer-events:none}
@keyframes k-sp-mvf{0%{transform:none}4%,22%{transform:scale(1.03)}28%,100%{transform:none}}
@keyframes k-sp-mvring{0%{opacity:0}4%,22%{opacity:1}28%,100%{opacity:0}}
.k-sp-who4 .k-sp-face{position:relative;animation:none}
.k-sp-who4 .k-sp-face::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 .16em #fff,0 0 2.2em color-mix(in srgb,var(--spot) 75%,#0000);opacity:0;animation:k-sp-ring4b 8s ease-in-out infinite;animation-delay:inherit}
.k-sp-q0 .k-sp-face::after{animation-delay:0s}.k-sp-q1 .k-sp-face::after{animation-delay:2s}.k-sp-q2 .k-sp-face::after{animation-delay:4s}.k-sp-q3 .k-sp-face::after{animation-delay:6s}
@keyframes k-sp-ring4b{0%{opacity:0}4%,22%{opacity:1}28%,100%{opacity:0}}
@keyframes k-ds-opt{0%{background:none;color:#f5f5f7;transform:none}4%,44%{background:#fff;color:#000;transform:scale(1.05)}50%,100%{background:none;color:#f5f5f7;transform:none}}
@keyframes k-ds-wf{0%{background:#2c2c2ecc;color:#f5f5f7;transform:none}4%,44%{background:#fff;color:#000;transform:scale(1.04)}50%,100%{background:#2c2c2ecc;color:#f5f5f7;transform:none}}
@keyframes k-g-text{0%{color:#f5f5f7;transform:none}4%,22%{color:#000;transform:scale(1.03)}28%,100%{color:#f5f5f7;transform:none}}
@keyframes k-mv-focus{0%{transform:none}4%,22%{transform:scale(1.02)}28%,100%{transform:none}}
@keyframes k-m-focus{0%{background:none;color:#f5f5f7}4%,22%{background:#fff;color:#000}28%,100%{background:none;color:#f5f5f7}}
@keyframes k-ui-focus{0%,100%{transform:none}50%{transform:scale(1.015)}}
@keyframes k-sp-pfocus{0%{transform:none}4%,22%{transform:translateY(-.35em) scale(1.1)}28%,100%{transform:none}}
.k-ds-opt,.k-ds-wf1,.k-ds-wf2{box-shadow:none}

/* ---------- Technical Specifications, Apple style ---------- */
.k>.k-spec-devices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-top:8px;padding-bottom:56px}
.k-spec-devices article{display:grid;justify-items:center;gap:4px;text-align:center}
.k-spec-device{height:150px;display:grid;place-items:end center;margin-bottom:14px}
.k-spec-device .mock{max-height:150px;max-width:100%;width:auto;height:auto}
.k-spec-devices h2{font-size:22px;letter-spacing:-.02em;margin:0}
.k-spec-devices p{margin:0;color:var(--sub);font-size:15px}
.k-spec-group dl{grid-template-columns:1fr 1fr;gap:28px 40px}
.k-spec-group dl>div{border-top:1px solid var(--line);padding-top:14px}
.k-spec-group dl>div:nth-child(-n+2){border-top:0;padding-top:0}
.k-spec-group h2{position:sticky;top:24px;align-self:start}
@media(max-width:900px){.k>.k-spec-devices{grid-template-columns:1fr 1fr;gap:36px 20px}.k-spec-group dl{grid-template-columns:1fr}.k-spec-group dl>div:nth-child(2){border-top:1px solid var(--line);padding-top:14px}}
/* ---------- Compare pages: Apple's compare style. Teevo's column is tinted; the header sticks. ---------- */
.k-compare .k-table{overflow:visible}
.k-compare .k-table table{border-collapse:separate;border-spacing:0;font-size:15px}
.k-compare .k-table thead th{position:sticky;top:0;z-index:1;background:#fff;font-size:20px;letter-spacing:-.02em;padding:20px 18px;border-bottom:1px solid var(--line)}
.k-compare .k-table th,.k-compare .k-table td{padding:22px 18px}
.k-compare .k-table tbody th{font-size:16px;color:var(--ink)}
.k-compare .k-table td:nth-child(2),.k-compare .k-table thead th:nth-child(2){background:#f2f7ff}
.k-compare .k-table thead th:nth-child(2){border-radius:18px 18px 0 0;color:var(--link)}
.k-compare .k-table tbody tr:last-child td:nth-child(2){border-radius:0 0 18px 18px}
.k-compare .k-table td:nth-child(2){font-size:16px}
@media(max-width:900px){.k-compare .k-table{overflow-x:auto}.k-compare .k-table thead th{position:static}}
/* ---------- Press Kit: cards with previews ---------- */
.k-press-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;text-align:left}
.k-press-grid a{display:grid;gap:6px;text-decoration:none;color:var(--ink)}
.k-press-thumb{position:relative;display:block;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--surface)}
.k-press-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 400ms cubic-bezier(.23,1,.32,1)}
.k-press-grid li:first-child .k-press-thumb img{object-fit:contain;padding:18%}
.k-press-play{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px;border-radius:50%;background:#fffd;box-shadow:0 6px 20px #0005}
.k-press-play::after{content:"";position:absolute;left:21px;top:16px;border-left:15px solid #000;border-top:10px solid #0000;border-bottom:10px solid #0000}
.k-press-grid b{font-size:16px;margin-top:6px}.k-press-grid small{color:var(--sub);font-size:13px}
@media(hover:hover) and (pointer:fine){.k-press-grid a:hover img{transform:scale(1.03)}}
.k-compare .k-table thead th{position:static}
.k-spec-group h2{position:static}
/* Hero: "So do you." and the platforms line arrive a little later */
@media(prefers-reduced-motion:no-preference){
  .k-endcard-title .w:nth-child(2){animation-delay:3.1s}
  .k-endcard-sub{animation-delay:3.9s}
  .k-endcard .k-actions{animation-delay:4.2s}
  .k-endcard-film{animation-delay:4.3s}
}
/* Audit fixes: controls keep clear of their panel edges; the source stage fits on phones */
.k-ui-opt{padding:.64em 1em}
.k-sp-searchall .k-sp-person,.k-sp-person{padding:.6em .95em .6em .6em}
.k-sp-whos-tile{gap:.6em}.k-sp-whos-tile .k-sp-title{font-size:1.15em}.k-sp-whos-tile .k-sp-face{width:3.2em;height:3.2em}
@media(max-width:734px){.k-source-stage{aspect-ratio:3/3.9}}
/* Sync stack: the centred family (owner's pick). TV behind. MacBook front-left from the panel's left
   edge, iPad front-right ending just before the Apple TV box (650 mm), iPhone in front of them both,
   centred on the TV panel's centre line (381.5 mm). All on the box's baseline. */
.k-stack-mac{left:calc(var(--u) * 20)}
.k-stack-ipad{left:calc(var(--u) * 359)}
.k-stack-phone{left:calc(var(--u) * 344.2)}
.k-stack-mac{z-index:1}.k-stack-ipad{z-index:2}.k-stack-phone{z-index:3}

/* ---------- Device showcase on the Apple TV, Mac, iPad and iPhone pages ----------
   The list shows each feature's detail only while it's selected (Apple's highlights switcher);
   the stage shows that device's own capture whole, framed like its screen. */
.k-show-dev .k-show-list span{display:none;font-size:15px;line-height:1.45;color:#a1a1a6;max-width:40ch;margin-top:4px}
.k-show-dev .k-show-list button[aria-pressed="true"] span{display:block}
.k-show-dev .k-show-stage{aspect-ratio:16/11;background:radial-gradient(70% 60% at 50% 55%,#1d2433,#0b0b0d 75%)}
.k-show-iphone .k-show-stage,.k-show-ipad .k-show-stage{aspect-ratio:4/3.6}
.k-dev{position:absolute;inset:0;display:grid;place-items:center;padding:6%}
.k-dev .k-screen,.k-dev .k-loop{display:block;width:auto;height:auto;max-width:100%;max-height:100%;box-shadow:0 0 0 1px #ffffff1f,0 2.4em 5em #000c}
.k-dev .k-loop{width:100%}
.k-dev-appletv .k-screen,.k-dev-appletv .k-loop{border-radius:10px}
.k-dev-mac .k-screen{box-shadow:none;filter:drop-shadow(0 30px 50px #000b)}
.k-dev-ipad .k-screen{border-radius:20px}
.k-dev-iphone.k-dev-tall .k-screen{border-radius:13.5%/6.2%;max-height:100%}
.k-dev-iphone.k-dev-wide .k-screen{border-radius:7%/15%}
.k-dev-tall{padding:5% 6%}
.k-dev .k-pause{right:5%;bottom:5%}
@media(max-width:900px){.k-show-dev .k-show-list span{display:none!important}.k-show-dev .k-show-stage{aspect-ratio:4/3.4}}
.k-dev{display:flex;align-items:center;justify-content:center}
.k-dev .k-screen{min-width:0;min-height:0;object-fit:contain}
.k-dev-tall .k-screen{height:100%;width:auto;max-width:100%}
/* Plans on a white section: the Free card needs its own surface to read as a card */
.k>section:not(.k-band) .k-plan:not(.k-plan-plus){background:var(--surface)}
.k-l-card{padding:.8em 1.05em}