@font-face{font-family:Manrope;src:url('assets/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{--ink:#fff;--muted:#dedfe3;--glass:rgba(29,32,37,.72);--focus:rgba(241,244,249,.27);--ease:cubic-bezier(.16,1,.3,1);--unit:1px;--z-news:5;--z-launch:8;--z-modal:10;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#14191d;color:var(--ink);font-family:Manrope,Arial,sans-serif}body{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus{outline:none}button:focus-visible{outline:none}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance;letter-spacing:-.025em}button{touch-action:manipulation}#stage{height:100dvh;min-height:540px;position:relative;isolation:isolate;overflow:hidden}.backdrop,.scrim,#gallery{position:absolute;inset:0;width:100%;height:100%}.backdrop{object-fit:cover;opacity:0;transition:opacity 1.1s ease}.backdrop.active{opacity:1}.scrim{background:linear-gradient(180deg,rgba(6,12,18,.26),transparent 38%,rgba(5,10,16,.38) 55%,rgba(5,10,16,.72) 75%,rgba(5,10,16,.9));pointer-events:none}.glass,.app-circle,.avatar{background:linear-gradient(145deg,rgba(255,255,255,.13),transparent 55%),var(--glass);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(255,255,255,.09);transition:background-color .18s,transform .23s var(--ease)}button.glass:focus,button.glass:hover{background-color:var(--focus);box-shadow:inset 0 0 0 2px rgba(255,255,255,.9)}.profiles{position:absolute;top:5.6%;left:4.6%;display:flex;gap:18px;z-index:2}.profile{position:relative;width:56px;min-height:56px;padding:0}.avatar{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;font-size:20px;font-weight:500;color:#eff0f4}.profile[aria-pressed=true] .avatar{box-shadow:inset 0 0 0 2px #d9dce1}.profile:focus .avatar,.profile:hover .avatar{background-color:var(--focus);transform:scale(1.07)}.profile-name{position:absolute;top:68px;left:50%;transform:translate(-50%,4px);font-size:17px;opacity:0;transition:.18s;white-space:nowrap;text-shadow:0 2px 5px #000}.profile:focus .profile-name,.profile:hover .profile-name{opacity:1;transform:translate(-50%,0)}
#home{position:absolute;inset:0}.dock{position:absolute;left:50%;bottom:19%;transform:translateX(-50%);display:flex;align-items:flex-start;gap:30px;transition:transform .25s var(--ease);width:max-content;max-width:95%}.app{width:140px;padding:0;display:flex;flex-direction:column;align-items:center;flex-shrink:0;animation:arrive .4s var(--ease) both;animation-delay:var(--delay,0ms)}.app-circle{height:128px;width:128px;border-radius:50%;display:grid;place-items:center;position:relative;transition:transform .22s var(--ease),background-color .18s}.app:focus .app-circle,.app:hover .app-circle{transform:scale(1.08);background-color:rgba(238,243,252,.25);box-shadow:inset 0 0 0 2px rgba(255,255,255,.95),inset 0 1px 0 #fff}.app-label{font-size:22px;font-weight:500;line-height:1.4;margin-top:22px;color:#f9faff;text-shadow:0 2px 6px #000;white-space:nowrap}.logo{width:64px;height:52px;object-fit:contain;filter:grayscale(1) brightness(0) invert(1);transition:none}.app:focus .logo,.app:hover .logo,.choice:focus .logo,.choice:hover .logo{filter:none}.logo-npo{width:86px;height:60px}.logo-netflix{width:52px;height:64px}.icon{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.youtube{display:block;width:60px;height:44px;color:#fff}.app:focus .youtube,.choice:focus .youtube{color:#f03}.youtube svg{width:100%;height:100%}.provider-word{font-size:25px;font-weight:600;letter-spacing:-.035em;line-height:1.1;text-align:center}.game-pair{display:flex;gap:30px;max-width:0;opacity:0;transform:scale(.86);transform-origin:left center;overflow:hidden;transition:opacity .2s,transform .3s var(--ease)}.gaming-open .game-pair{max-width:310px;overflow:visible;opacity:1;transform:scale(1)}.gaming-open .gaming-parent{display:none}.gaming-open .app{animation:none}.game-pair .app-circle{height:128px;width:128px}.game-pair .app-label{font-size:20px}.more{position:absolute;bottom:9%;left:50%;transform:translateX(-50%);width:52px;height:44px;border-radius:50%;font-size:26px}.secondary{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);display:flex;gap:20px;align-items:center;width:max-content;max-width:96%;animation:secondary-in .25s var(--ease)}.secondary button{height:70px;min-width:76px;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:14px;position:relative}.secondary .news-link{padding:0 26px;border-radius:100px;font-size:20px;margin-right:16px}.secondary .icon{width:30px;height:30px}.scene-label{position:absolute;bottom:-30px;white-space:nowrap;font-size:16px;color:#fff;text-shadow:0 2px 4px #000}.secondary button[aria-pressed=true]{background-color:rgba(255,255,255,.43);box-shadow:inset 0 0 0 2px #fff}.scene-check{display:none;position:absolute;top:0;right:0;background:#edf0f5;border-radius:50%;color:#161c23;width:22px;height:22px;font-size:15px}.secondary button[aria-pressed=true] .scene-check{display:block}.secondary button{transition:background-color 1s,transform .2s}.secondary button:focus{transition:background-color .18s,transform .2s}.secondary-open .dock{bottom:25%}
.overlay{position:absolute;inset:0;background:rgba(5,9,15,.68);z-index:var(--z-modal);display:grid;place-items:center;padding:30px}.sheet{width:min(850px,90vw);padding:42px;border-radius:16px;background-color:rgba(25,31,39,.94);animation:sheet-in .24s var(--ease);max-height:90%;overflow:auto}.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}.sheet-heading h2{font-size:32px;font-weight:500}.sheet-heading p{font-size:18px;color:var(--muted);margin-bottom:7px}.close{width:48px;height:48px;border-radius:50%;font-size:28px;flex-shrink:0}.replacement-grid,.photo-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.choice{display:flex;align-items:center;gap:20px;border-radius:12px;padding:18px 22px;min-height:84px;text-align:left;font-size:21px;animation:item-in .3s var(--ease) both;animation-delay:var(--delay,0ms)}.choice .logo{width:50px;height:40px}.choice .logo-npo{width:66px}.choice .youtube{width:48px;height:34px}.choice .icon{width:40px;height:40px}.choice .provider-word{width:66px;font-size:18px}.choice .selection{margin-left:auto}.choice[aria-pressed=true]{box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}.sheet-description{font-size:21px;color:#eef0f4;line-height:1.65;max-width:60ch;margin-bottom:26px}.sheet-action{border-radius:100px;padding:14px 24px;font-size:20px}.photo-options{margin:24px 0}.photo-choice{padding:15px;border-radius:12px;font-size:19px}.photo-choice[aria-pressed=true]{box-shadow:inset 0 0 0 2px #fff}
.discover-view{position:absolute;inset:0;z-index:var(--z-news);background:rgba(7,12,19,.85);padding:4% 5%;overflow:hidden;animation:sheet-in .24s var(--ease)}.discover-heading{display:flex;align-items:center;gap:30px;margin-bottom:30px}.back{border-radius:100px;padding:14px 24px;font-size:20px}.discover-heading h1{font-size:40px;font-weight:450}.discover-heading p{font-size:18px;color:var(--muted);margin-left:auto}.providers{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:6px 4px 16px;scroll-behavior:smooth}.provider{font-size:20px;white-space:nowrap;padding:13px 23px;border-radius:100px;flex-shrink:0;transition:transform .2s,background-color .2s}.provider[aria-selected=true]{background-color:rgba(255,255,255,.23);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75)}.provider.watchlist{animation:item-in .28s var(--ease)}.catalogue{margin-top:20px}.catalogue-note{color:var(--muted);font-size:18px;margin:0 4px 22px}.horizontal-gallery{display:flex;gap:24px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x proximity;padding:8px 6px 22px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.content-card{flex:0 0 24%;min-width:230px;scroll-snap-align:start;position:relative;animation:item-in .3s var(--ease) both;animation-delay:var(--delay,0ms)}.poster{width:100%;padding:0;text-align:left;display:block}.poster-art{height:min(43vh,490px);border-radius:12px;overflow:hidden;background:#29323e;position:relative}.poster img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s var(--ease)}.poster:focus img,.poster:hover img{transform:scale(1.045)}.poster:focus .poster-art{box-shadow:inset 0 0 0 2px #fff;outline:2px solid #fff;outline-offset:3px}.poster h3{font-size:24px;font-weight:550;line-height:1.35;margin:17px 58px 8px 0}.poster p{font-size:17px;color:var(--muted);line-height:1.5;margin-right:50px}.watch-toggle{position:absolute;right:0;bottom:5px;width:44px;height:44px;border-radius:50%;font-size:27px}.watch-toggle[aria-pressed=true]{background-color:rgba(255,255,255,.24)}.channel-card{flex-basis:36%}.channel-card .poster-art{height:29vh;max-height:340px}.media-fallback{position:absolute;inset:0;display:grid;place-items:center;background:#29323e;color:#fff;font-size:22px;padding:24px;text-align:center}.empty-state{padding:7vh 4px;max-width:60ch}.empty-state h2{font-size:30px;margin-bottom:20px}.empty-state p{font-size:21px;line-height:1.6;margin-bottom:24px;color:var(--muted)}.loading{height:40vh;background:linear-gradient(110deg,#1b2430,#303a47);border-radius:12px;color:#fff;font-size:24px;padding:40px}.launch-view{position:absolute;inset:0;z-index:var(--z-launch);display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(8,13,20,.83);gap:22px;padding:30px;text-align:center}.launch-view .logo{filter:none;width:80px;height:80px}.launch-view h1{font-size:40px}.launch-view p{font-size:21px;line-height:1.6;max-width:50ch;color:var(--muted)}.launch-view button{border-radius:100px;padding:14px 25px;font-size:21px;margin-top:12px}.departing #home,.departing .profiles{opacity:0;transform:translateY(14px) scale(.98);transition:opacity .2s,transform .24s var(--ease)}#home,.profiles{transition:opacity .2s,transform .2s}.storage-status{position:absolute;top:18%;left:50%;transform:translateX(-50%);background:#232c39;color:#fff;z-index:9;padding:14px 24px;border-radius:12px;font-size:18px;max-width:90%;pointer-events:none}
@keyframes arrive{from{opacity:.01;transform:translateY(14px) scale(.8)}to{opacity:1;transform:none}}@keyframes secondary-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes sheet-in{from{opacity:.01;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes item-in{from{opacity:.01;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@media(min-width:2500px){#stage{zoom:2;height:50dvh}.poster-art{height:43vh;max-height:490px}.channel-card .poster-art{height:29vh;max-height:340px}.discover-view{padding:4% 5%}}
@media(max-width:1100px){.dock{gap:18px}.app{width:112px}.app-circle,.game-pair .app-circle{width:102px;height:102px}.app-label{font-size:19px}.game-pair{gap:18px}.gaming-open .game-pair{max-width:242px}.discover-heading{gap:18px}.discover-heading p{max-width:24ch;font-size:16px}.content-card{flex-basis:31%}.channel-card{flex-basis:47%}}
@media(max-width:600px){#stage{min-height:600px}.profiles{top:4%;left:6%;gap:14px}.avatar,.profile{width:46px;height:46px;min-height:46px}.avatar{font-size:17px}.profile-name{font-size:15px;top:55px}.dock{gap:8px;bottom:23%;max-width:98%}.app{width:83px}.app-circle,.game-pair .app-circle{width:74px;height:74px}.app-label{font-size:14px;margin-top:15px}.logo{width:42px;height:35px}.logo-netflix{width:33px;height:43px}.logo-npo{width:52px;height:40px}.youtube{width:41px;height:30px}.icon{width:35px;height:35px}.provider-word{font-size:17px}.gaming-open .dock{gap:4px}.gaming-open .app{width:69px}.gaming-open .app-circle{width:62px;height:62px}.gaming-open .app-label{font-size:11px}.game-pair{gap:4px}.gaming-open .game-pair{max-width:142px}.secondary-open .dock{bottom:29%}.secondary{gap:10px;bottom:12%}.secondary button{min-width:50px;height:50px}.secondary .news-link{padding:0 13px;font-size:14px;gap:6px;margin-right:0}.secondary .icon{width:23px;height:23px}.scene-label{font-size:11px;bottom:-24px}.more{bottom:12%}.sheet{width:94vw;padding:24px;max-height:92%}.overlay{padding:12px}.sheet-heading h2{font-size:24px}.sheet-heading p{font-size:15px}.sheet-heading{margin-bottom:20px}.replacement-grid{gap:8px}.choice{padding:12px;font-size:15px;gap:10px;min-height:68px}.choice .logo{width:32px;height:30px}.choice .logo-npo{width:42px}.choice .provider-word{width:42px;font-size:14px}.choice .youtube,.choice .icon{width:32px;height:28px}.sheet-description{font-size:17px}.sheet-action{font-size:17px}.photo-choice{font-size:15px;padding:13px 8px}.discover-view{padding:24px 20px}.discover-heading{flex-wrap:wrap;gap:14px;margin-bottom:20px}.discover-heading h1{font-size:26px}.discover-heading p{margin:0;width:100%;max-width:none;font-size:15px}.back{font-size:15px;padding:10px 16px}.provider{font-size:16px;padding:11px 17px}.catalogue{margin-top:12px}.catalogue-note{font-size:14px;margin-bottom:14px}.horizontal-gallery{gap:18px}.content-card,.channel-card{flex-basis:78%;min-width:235px}.poster-art{height:40vh}.channel-card .poster-art{height:24vh}.poster h3{font-size:21px}.poster p{font-size:14px}.launch-view h1{font-size:29px}.launch-view p{font-size:17px}.empty-state{padding:25px 0}.empty-state h2{font-size:25px}.empty-state p{font-size:17px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.departing #home,.departing .profiles{transform:none}}

/* Keep containers optically stable; only actionable glass responds to hover. */
.logo-npo{filter:grayscale(1) brightness(1.1)}
.game-pair:not([hidden]){animation:game-split .3s var(--ease)}
@keyframes game-split{from{opacity:.01;transform:scale(.82)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.game-pair:not([hidden]){animation:none}}

.profile-name{background:rgba(12,18,26,.9);padding:5px 12px;border-radius:100px}

/* Focus never trades away contrast over a bright sky. */
.avatar{background-color:rgba(22,29,39,.88)}
.profile:focus .avatar,.profile:hover .avatar{background-color:rgba(29,38,50,.94);box-shadow:inset 0 0 0 2px #fff}
.app-circle::before{content:"";position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(150deg,rgba(255,255,255,.16),transparent 38%,transparent 75%,rgba(255,255,255,.045));pointer-events:none}

/* R3: optical geometry is independent of font baselines. */
.more{display:grid;place-items:center;padding:0;line-height:0}
.more-arrow{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.more.pressed .more-arrow{animation:more-press .14s var(--ease) both}
@keyframes more-press{to{transform:translateY(3px) scale(.88);opacity:.5}}
.avatar{position:relative;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.avatar::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);pointer-events:none}
.profile[aria-pressed=true] .avatar::after,.profile:focus .avatar::after{box-shadow:inset 0 0 0 2px #fff}
/* Fill the screen proportionally; center crop, never stretch or letterbox. */
.backdrop.personal{object-fit:cover;object-position:center}
@media(prefers-reduced-motion:reduce){.more.pressed .more-arrow{animation:none}}

.logo-apple-tv,.app:focus .logo-apple-tv,.app:hover .logo-apple-tv,.choice:focus .logo-apple-tv,.choice:hover .logo-apple-tv{filter:brightness(0) invert(1)}
.provider{display:inline-flex;align-items:center;gap:10px}.provider .logo{width:26px;height:22px;flex-shrink:0;filter:none}.provider .logo-apple-tv{filter:brightness(0) invert(1)}
@media(max-width:600px){.provider .logo{width:23px;height:19px}.provider{gap:8px}}

.logo-youtube{filter:grayscale(1) brightness(1.3)}

.original-badge{position:absolute;top:12px;left:12px;background:#17212c;color:#fff;border-radius:6px;padding:6px 10px;font-size:15px;line-height:1.4}
.feed-attribution{font-size:15px;color:var(--muted);margin:8px 4px}.feed-attribution a{color:inherit;text-underline-offset:3px}
@media(max-width:600px){.original-badge,.feed-attribution{font-size:13px}.discover-heading p{line-height:1.5}}

/* NEW-01: fit release metadata and attribution on 720p; retain overflow access
   for unusually long titles without altering directional navigation. */
.discover-view{overflow-x:hidden;overflow-y:auto;scroll-padding-block:24px}
@media(min-width:601px) and (max-height:800px){
 .discover-heading{margin-bottom:20px}
 .poster-art{height:min(28vh,240px)}
}

/* Native media proportions: no square/short-wide crop of portrait artwork.
   Width follows available height so ordinary 720p controls remain reachable. */
.horizontal-gallery{align-items:flex-start}
.content-card:not(.channel-card){flex:0 0 min(17vw,26vh,280px);min-width:0}
.content-card:not(.channel-card) .poster-art{height:auto;max-height:none;aspect-ratio:2/3}
.channel-card .poster-art{height:auto;max-height:none;aspect-ratio:16/9}
.poster img{object-fit:contain}
.poster:focus img,.poster:hover img{transform:none}
.poster h3{overflow-wrap:anywhere}
@media(max-width:600px){
 .content-card:not(.channel-card){flex-basis:min(60vw,26vh,220px)}
 .channel-card{flex-basis:86%;min-width:0}
}

/* Visible news edge gutter, including first/last remote focus; save follows copy. */
.horizontal-gallery{padding:12px 12px 22px;scroll-padding-inline:12px;scroll-behavior:auto}
.content-card{scroll-margin-inline:12px}
.poster h3{margin-right:0}
.poster p{margin-right:0}
.watch-toggle{position:static;display:block;margin:12px 0 0 auto;flex:none}
@media(min-width:601px) and (max-height:800px){
 .content-card:not(.channel-card){flex-basis:min(17vw,22vh,240px)}
 .poster h3{font-size:20px}
 .poster p{font-size:15px}
}

/* Save actions share the row baseline and the metadata leading edge. Each
   poster stretches to the longest real copy; nothing is line-clamped. */
.horizontal-gallery{align-items:stretch}
.content-card{display:flex;flex-direction:column}
.content-card .poster{flex:1;display:flex;flex-direction:column;justify-content:flex-start}
.content-card .poster-art{flex:none}
.content-card .poster h3,.content-card .poster p{flex:none}
.watch-toggle{margin:12px auto 0 0;align-self:flex-start}

/* 1440p uses the existing2x stage: size portrait artwork in logical720p space. */
@media(min-width:2500px) and (max-height:1600px){
 .content-card:not(.channel-card){flex-basis:min(17vw,11vh,240px)}
 .poster h3{font-size:20px}.poster p{font-size:15px}
}
@media(min-width:601px) and (max-height:800px){
 .discover-heading{margin-bottom:12px}
 .catalogue{margin-top:12px}.catalogue-note{margin-bottom:14px}
}
@media(min-width:2500px) and (max-height:1600px){
 .discover-heading{margin-bottom:12px}
 .catalogue{margin-top:12px}.catalogue-note{margin-bottom:14px}
}

/* Fixed, readable feedback without replacing the four scene controls. */
.scene-status{position:absolute;width:max-content;bottom:16.5%;left:50%;transform:translateX(-50%);max-width:78%;padding:.65em 1em;margin:0;border-radius:1em;background:rgba(13,15,18,.96);color:#f2f2f2;font-size:16px;line-height:1.45;text-align:center;z-index:15;pointer-events:none}
.scene[aria-busy="true"]{opacity:.7}.scene[data-state="error"],.scene[data-state="partial"]{box-shadow:0 0 0 2px rgba(255,255,255,.65)}
@media(max-width:600px){.scene-status{font-size:14px;max-width:90%;bottom:21%}}

/* Additional settings entry leaves the established news/four-scene row unchanged. */
.secondary .connection-settings{position:absolute;left:calc(100% + 20px);top:0;width:76px;padding:0}
.connection-label{position:absolute;bottom:-30px;white-space:nowrap;font-size:16px;text-shadow:0 2px 4px #000}
@media(max-width:600px){.secondary .connection-settings{left:50%;top:auto;bottom:calc(100% + 16px);transform:translateX(-50%);width:max-content;height:44px;padding:0 16px;border-radius:100px;gap:8px}.connection-label{position:static;font-size:14px}}

.profile-notice{position:fixed;top:12%;left:50%;transform:translateX(-50%);padding:.6em 1em;font-size:clamp(18px,2vw,28px);z-index:20;pointer-events:none;}

@media(max-width:600px){.profile-notice{top:18%;}}

/* Feedback R4: one cancellable phase owner; the Home fade precedes all controls. */
.dock{bottom:15%}.more{bottom:5%}
#dock,#more{transition:opacity .22s ease;opacity:1}
.secondary-open #dock,.secondary-open #more{opacity:0;pointer-events:none;transition-delay:.14s}
.secondary-open .dock{bottom:15%}
.secondary{animation:none;bottom:8%;gap:20px}
.secondary>button{animation:controls-rise .28s var(--ease) both;animation-delay:calc(var(--control-index,0)*45ms)}
.secondary>button:nth-child(2){--control-index:1}.secondary>button:nth-child(3){--control-index:2}.secondary>button:nth-child(4){--control-index:3}.secondary>button:nth-child(5){--control-index:4}.secondary>button:nth-child(6){--control-index:5}.secondary>button:nth-child(7){--control-index:6}
.secondary .scene{width:76px;height:76px;min-width:76px;flex:0 0 76px;padding:0;aspect-ratio:1}
.secondary .home-up{position:absolute;bottom:calc(100% + 34px);left:50%;transform:translateX(-50%);width:52px;min-width:52px;height:44px;border-radius:50%;animation:none}
.scrim::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(4,8,13,.55));opacity:0;transition:opacity .55s ease;pointer-events:none}
.secondary-open .scrim::after{opacity:1}
@keyframes controls-rise{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
.horizontal-gallery{scroll-snap-type:none;padding-inline:16px;scroll-padding-inline:16px}
.content-card{animation:none}
.poster img.art-pending{opacity:0}.poster img{transition:opacity .2s ease}
.backdrop:not([src]){visibility:hidden}
.visually-hidden,.profile-notice{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.backup-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.backup-options .photo-choice{min-height:56px}
#sheet-body>.sheet-action{margin:8px 12px 8px 0}
@media(max-width:600px){.dock,.secondary-open .dock{bottom:19%}.more{bottom:8%}.secondary{bottom:12%;gap:8px}.secondary .scene{width:50px;height:50px;min-width:50px;flex-basis:50px}.secondary .home-up{bottom:calc(100% + 72px)}.backup-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){#dock,#more{transition:none}.secondary>button{animation:none}}

.backup-preview{display:block;width:100%;height:28vh;object-fit:contain;margin:12px 0;background:#14191d}.backup-controls{display:flex;gap:12px;margin-bottom:12px}.backup-controls .sheet-action{flex:1}

.secondary .scene{transition:background-color .18s,transform .2s}.secondary .scene[aria-busy=true]{transition:opacity .18s}

/* R4-IQA-001: outgoing controls remain rendered until this reverse completes.
   Parent translation preserves individual scene state and the centered up arrow. */
.secondary{opacity:1;translate:0 0;transition:opacity .22s ease,translate .22s var(--ease)}
.secondary-closing .secondary{opacity:0;translate:0 12px;pointer-events:none}
@media(prefers-reduced-motion:reduce){.secondary{transition:none;translate:none}}

/* R5: settings is a quiet gear, not another scene or stretched bubble. */
.secondary .connection-settings{background:none;box-shadow:none;border-radius:12px;width:76px;height:76px;min-width:76px;animation:none}
.secondary .connection-settings:focus,.secondary .connection-settings:hover{background:rgba(20,25,32,.8);box-shadow:inset 0 0 0 2px #fff}
.secondary .connection-settings .icon{width:30px;height:30px}
.settings-label{font-size:18px;font-weight:500;color:var(--muted)}
.settings-body .sheet-description{margin-bottom:22px}
.settings-body .photo-options{margin:12px 0 20px}
.settings-row .icon{width:26px;height:26px;flex:none}
.settings-row button{display:flex;align-items:center;gap:14px;text-align:left}
.settings-row .photo-choice{justify-content:center;min-height:62px}
.settings-playback{margin-bottom:26px}
.settings-link{width:100%;border-radius:12px;min-height:64px}
.link-chevron{margin-left:auto;font-size:28px}
.settings-connection{border-top:1px solid rgba(255,255,255,.25);padding-top:22px;margin-top:22px}
.settings-connection button{background:none;box-shadow:none}
.settings-connection button:focus,.settings-connection button:hover{box-shadow:inset 0 0 0 2px #fff;background-color:var(--focus)}
/* Native border rasterization replaces fractional inset focus shadows. Repaint
   circles at their final size, rather than magnifying a cached128px texture. */
.app-circle{flex:none;border:1px solid rgba(255,255,255,.18);background-clip:padding-box}
.app:focus .app-circle,.app:hover .app-circle{transform:none;width:138px;height:138px;margin:-5px 0;box-shadow:none;border:2px solid rgba(255,255,255,.95)}
.app:not(:focus):not(:hover) .app-circle{box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(255,255,255,.09)}
@media(max-width:1100px){.app:focus .app-circle,.app:hover .app-circle{width:110px;height:110px;margin:-4px 0}}
@media(max-width:600px){.app:focus .app-circle,.app:hover .app-circle{width:80px;height:80px;margin:-3px 0}.gaming-open .app:focus .app-circle,.gaming-open .app:hover .app-circle{width:68px;height:68px}.secondary .connection-settings{width:60px;height:44px;min-width:60px;padding:0}.settings-row .icon{width:22px;height:22px}}
/* Real refresh metadata remains separate from counts and saved/error status. */
#feed-summary{text-align:right;line-height:1.55;max-width:48ch}
#feed-summary span{display:block}
#feed-summary .refresh-timing{font-size:.9em}
.feed-status{font-size:17px;color:var(--muted);margin:0 4px 16px}
.video-heading{font-size:24px;font-weight:500;margin:0 4px 12px}
.video-section{margin-bottom:24px}
.video-section:has(.no-videos){margin-bottom:18px}
.no-videos{font-size:18px;color:var(--muted);margin:0 4px}
@media(max-width:600px){#feed-summary{text-align:left;max-width:none}.video-heading{font-size:21px}.no-videos,.feed-status{font-size:15px}}

/* R6: the settings hit/focus surface shares the avatar baseline and diameter. */
.profiles{align-items:center}
.profile-settings{display:grid;place-items:center;width:56px;height:56px;flex:none;padding:0;border-radius:50%}
.profile-settings .icon{width:30px;height:30px}
.settings-body .settings-row:not(.photo-options){margin:0;padding:14px 0;border-top:1px solid rgba(255,255,255,.25)}
.settings-body .settings-playback{margin-top:34px!important}
.settings-body .settings-row:not(.photo-options) button{width:100%;height:68px;min-height:68px;border-radius:12px;background:none;box-shadow:none}
.settings-body .settings-row:not(.photo-options) button:focus,.settings-body .settings-row:not(.photo-options) button:hover{background-color:var(--focus);box-shadow:inset 0 0 0 2px #fff}
.refresh-row{display:flex;align-items:center;gap:16px;margin:2px 4px 0}
#refresh-discovery{width:48px;height:48px;flex:none;padding:0;border-radius:50%;display:grid;place-items:center}
#refresh-discovery .icon{width:26px;height:26px}
#refresh-discovery[aria-busy=true] .icon{animation:refresh-spin 1s linear infinite}
#refresh-discovery:disabled{cursor:wait;opacity:.7}
#feed-summary{text-align:left;line-height:1.5;font-size:18px;color:var(--muted);max-width:none}
#refresh-status{font-size:17px;line-height:1.5;margin:10px 4px 0;color:var(--muted)}
#refresh-status:empty{display:none}
@keyframes refresh-spin{to{transform:rotate(360deg)}}
@media(max-width:600px){.profile-settings{width:46px;height:46px}.profile-settings .icon{width:25px;height:25px}#feed-summary,#refresh-status{font-size:15px}.settings-body .settings-row:not(.photo-options){padding:12px 0}.settings-body .settings-row:not(.photo-options) button{height:76px;min-height:76px;padding:14px 12px}.settings-body .settings-link span:not(.link-chevron){flex:1;text-align:left}}
@media(prefers-reduced-motion:reduce){#refresh-discovery[aria-busy=true] .icon{animation:none}}

/* Bounded synopsis pane keeps full safe text reachable with touch and D-pad. */
.release-plot{max-height:40vh;overflow:auto;overflow-wrap:anywhere;padding:4px;white-space:pre-wrap;outline-offset:4px}.release-plot:focus-visible{outline:2px solid #fff;border-radius:4px}

/* Complete only the focused choice entrance: remote feedback cannot wait behind
   its stagger. The sheet and all unfocused choice entrances retain their motion. */
.choice.remote-ready{animation:none;scroll-margin-block:8px}

/* Remote focus is a state, not a queued animation. Keep ambient/background and
   movement motion; the ring and provider identity must be clear on first paint. */
.app.remote-ready,.secondary>button.remote-ready{animation:none}
.remote-secondary #dock,.remote-secondary #more{transition:none}
/* A focused descendant cannot provide feedback through a near-transparent
   entrance ancestor. Retain the existing travel/scale, not its focus-hiding fade. */
.sheet:focus-within,.discover-view:focus-within{animation-name:focused-sheet-in}
.game-pair:focus-within{animation-name:focused-game-split}
@keyframes focused-sheet-in{from{translate:0 12px}to{translate:0 0}}
@keyframes focused-game-split{from{transform:scale(.82)}to{transform:scale(1)}}
.remote-secondary:not(.secondary-closing) .secondary{transition:none}
/* Keep the bounded full-screen gallery in its own paint/composite surface.
   Small foreground focus repaints must not re-raster the4K photo beneath them. */
#gallery{contain:strict;transform:translateZ(0)}
