/* This experiment is isolated from the approved viewer. */
/* Lift the viewing center, limited by the space above the picture and its fade. */
.stage{--player-lift:min(clamp(14px,3dvh,28px),max(0px,calc(41% - var(--screen-height)/2)));--player-center:calc(50% - var(--player-lift))}
.show-card{top:var(--player-center)}
:is(.mobile-viewing .stage,.stage:fullscreen){--player-lift:0px;--player-center:50%}
.stage:focus-visible{outline:none}
.stage.keyboard-navigation:focus-visible{outline:2px solid var(--mint);outline-offset:-3px}
/* Sound stays at the upper right; the expanded-view exit stays at left. */
.player-top{justify-content:flex-end}
.player-top .exit-expanded{position:absolute;left:0;margin-right:0}
.popcorn-canvas{position:absolute;z-index:2;pointer-events:none}
.player-top .sound-icon-only{width:38px;height:38px;min-width:38px;padding:0;border-radius:50%}
.player-top .sound-prompt{max-width:calc(100% - 94px);white-space:nowrap;justify-content:center}
/* Live shots and feed replays use the same creator-colored playback frame. */
.show-card[data-offset="0"].creator-glow{border-color:transparent}
:is(.show-card[data-offset="0"].creator-glow,.user-shot-overlay):before{
 content:'';position:absolute;inset:0;z-index:6;pointer-events:none;border-radius:inherit;
 --shot-frame-color:var(--creator-color,var(--control-neutral));
 box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--shot-frame-color) 88%,transparent),inset 0 0 28px color-mix(in srgb,var(--shot-frame-color) 62%,transparent),0 0 28px color-mix(in srgb,var(--shot-frame-color) 30%,transparent);
 animation:user-shot-frame-glow 2.4s ease-in-out infinite
}
@keyframes user-shot-frame-glow{50%{opacity:.64;box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--shot-frame-color) 72%,transparent),inset 0 0 22px color-mix(in srgb,var(--shot-frame-color) 38%,transparent),0 0 22px color-mix(in srgb,var(--shot-frame-color) 22%,transparent)}}
@media(prefers-reduced-motion:reduce){:is(.show-card[data-offset="0"].creator-glow,.user-shot-overlay):before{animation:none}}
.mode-row{display:flex;align-items:center;justify-content:center;position:relative;padding:11px 0 3px;min-height:62px;width:min(1040px,100vw);overflow:hidden}
.world-nav{position:relative;width:100%;height:48px;overflow:hidden;isolation:isolate;touch-action:pan-y}
.channel-viewport{position:absolute;inset:0;overflow:hidden;--rail-clear-left:0px;--rail-clear-right:0px;--rail-fade-left:14%;--rail-fade-right:14%;mask-image:linear-gradient(90deg,transparent var(--rail-clear-left),#000 var(--rail-fade-left),#000 calc(100% - var(--rail-fade-right)),transparent calc(100% - var(--rail-clear-right)));-webkit-mask-image:linear-gradient(90deg,transparent var(--rail-clear-left),#000 var(--rail-fade-left),#000 calc(100% - var(--rail-fade-right)),transparent calc(100% - var(--rail-clear-right)))}
.world-pill.live-placeholder{visibility:hidden;pointer-events:none}
.world-pill.live-placeholder.is-collapsed{display:none}
.world-nav>.live-anchor{position:absolute;top:50%;left:0;transform:translateY(-50%);z-index:2;margin:0}
.world-nav .live-pill.is-compact{min-width:0}
.live-pill.is-compact .live-audience{display:inline}
.channel-track{position:absolute;left:50%;top:5px;display:flex;align-items:center;gap:10px;width:max-content;will-change:transform}
.world-pill{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:38px;padding:0 18px;border:1px solid #e5edf04a;border-radius:999px;color:#e7ecee;background:#11171b33;font-size:13px;font-weight:500;white-space:nowrap;transition:background .25s,border-color .25s,color .25s,box-shadow .25s}
.world-pill:hover{background:#ffffff14;border-color:#e5edf096}.world-pill[aria-pressed="true"]{background:#ffffff14;color:#f0f4f2;border-color:#e5edf096}
.world-pill .channel-live-dot{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:#79eea5;box-shadow:0 0 7px #79eea570}
.world-nav[aria-busy="true"] .world-pill{cursor:default}
@keyframes live-pulse{0%{box-shadow:0 0 0 0 #5cf09d55}65%,100%{box-shadow:0 0 0 7px #5cf09d00}}
.wheel[aria-hidden="true"]{pointer-events:none}.changing-world .wheel{will-change:transform,opacity}
.live-metric{position:absolute;left:50%;transform:translateX(-50%);z-index:16;display:flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;color:#d1dfd8;font-size:12px;font-weight:450;letter-spacing:.015em;text-shadow:0 1px 9px #000,0 2px 12px #000;pointer-events:none;line-height:20px}
.live-queue{top:calc(var(--player-center) + var(--screen-height)/2 + 10px);color:#c7d1ce}
.broadcast-card{background:radial-gradient(ellipse at 50% 35%,#25413a66,transparent 75%),#121c20}.broadcast-card .poster:not([src]){display:none}.broadcast-card .preview-label small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.16em;line-height:1.8;color:#b6ccbd}
.wish-card .preview-label small{color:#d7bdff;font-size:12px;text-transform:none;letter-spacing:.025em}.wish-creator{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.35}
.broadcast-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;text-align:center;gap:12px;background:radial-gradient(ellipse at 50% 45%,#31544145,transparent 72%),#11191f;z-index:2}.broadcast-placeholder .eyebrow{color:var(--mint)}.broadcast-placeholder h2{font-weight:500;font-size:clamp(23px,3vw,36px);letter-spacing:-.025em;line-height:1.2;margin:0;max-width:80%}.broadcast-placeholder p{color:#a5b8ad;font-size:13px;margin:0;max-width:32ch}.broadcast-placeholder button,.live-error a{margin-top:8px;border:1px solid #5cf09d70;border-radius:999px;background:#5cf09d09;color:var(--mint);font-size:13px;padding:8px 16px}
.wish-button{margin-left:auto}
.live-error{gap:10px}.live-error a{display:inline-block}.live-error .retry{font-size:13px}
:is(.mobile-viewing .stage,.stage:fullscreen) .live-metric{transition:opacity .3s;opacity:0;top:auto;bottom:76px}
:is(.mobile-viewing .stage,.stage:fullscreen).controls-shown .live-metric{opacity:1}
@media(max-width:700px){.mode-row{min-height:61px;padding-top:8px}.channel-track{gap:8px}.world-pill{font-size:12px;padding:0 13px;min-height:36px}.world-pill.live-pill{min-width:90px;font-size:13px}.live-queue{top:calc(var(--player-center) + var(--screen-height)/2 + 8px)}.live-metric{font-size:11px}.broadcast-placeholder{gap:8px;padding:18px}.broadcast-placeholder h2{font-size:22px}.broadcast-placeholder p{font-size:12px}.broadcast-placeholder button{margin-top:3px;padding:6px 12px}.show-actions .credits-button[hidden]+.wish-button{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.world-pill{transition:none}.live-pill .live-dot{animation:none}}

.channel-actions{display:flex;align-items:center;gap:9px;flex:none;margin-left:auto}
.share-button{color:#e2e8ec;border-color:#e2e8ec59}.share-button:hover{background:#ffffff14}.share-button:focus-visible{outline-color:#e2e8ec}
.share-link{display:block;width:100%;min-height:44px;margin:0 0 14px;padding:10px 12px;border:1px solid #ffffff29;border-radius:9px;background:#0e151b;color:#d7e6f5;font:13px/1.5 -apple-system,BlinkMacSystemFont,system-ui,sans-serif}.share-link:focus{outline:2px solid #83baff;outline-offset:2px}
.share-copy-button{width:100%;background:var(--control-message);color:#041b0a}.share-copy-button:hover{background:color-mix(in srgb,var(--control-message) 76%,white)}#share-status:empty{display:none}
@media(max-width:700px){.channel-actions{gap:8px}.show-actions{row-gap:9px}}

/* Played wishes sit above the broadcast; wish activity opens beneath it. */
.viewing-live-channel{--screen:min(68vw,1100px,calc(max(160px,100dvh - 480px)*1.77778))}
.viewing-live-channel .now-playing{display:block;padding-top:10px}.viewing-live-channel .now-playing h1{margin-bottom:9px}.viewing-live-channel .show-actions{width:100%;margin:0;justify-content:space-between}
.live-channel .wheel{mask-image:linear-gradient(transparent,#000 8%,#000 91%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 8%,#000 91%,transparent)}
.live-channel .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.88 + 100px)) translateZ(-150px) rotateX(-43deg) scale(.94)}
.live-channel .show-card[data-offset="2"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.5 + 95px)) translateZ(-330px) rotateX(-59deg) scale(.9)}
.next-card .poster:not([src]){display:none}.next-card{background:radial-gradient(ellipse at 40% 30%,#52614c66,transparent 75%),linear-gradient(125deg,#18252c,#181d27)}
.next-card .preview-label{top:10%!important;bottom:auto!important;padding:10px 20px!important;background:none!important}
.live-dock{position:absolute;top:calc(var(--player-center) + var(--screen-height)/2 + 12px);left:50%;width:var(--screen);transform:translateX(-50%);z-index:17;display:flex;flex-direction:column;gap:11px;padding:0 2px}
.wish-line{display:flex;align-items:center;justify-content:center;min-width:0}.wish-button{margin:0;min-height:39px;padding:0 18px;border-color:#c3a0ff;color:#d7bdff;background:#ae7afa18;box-shadow:0 0 22px #a56bfa12;flex:none}.wish-button:hover{background:#ae7afa30}.wish-button:focus-visible{outline-color:#c3a0ff}

/* One creator-colored button owns the active wish's identity and credits. */
.creator-pill{position:absolute;top:calc(var(--player-center) - var(--screen-height)/2 - 12px);left:50%;transform:translate(-50%,-100%);z-index:18;display:inline-flex;align-items:center;gap:9px;max-width:calc(var(--screen) - 24px);min-height:42px;padding:5px 15px 5px 6px;border:1px solid var(--creator-color,#aab6c0);border-radius:999px;background:color-mix(in srgb,var(--creator-color,#aab6c0) 24%,#0c151b);color:#f2f5f6;box-shadow:0 4px 18px #0004;backdrop-filter:blur(12px);pointer-events:auto}
.creator-pill:hover{background:color-mix(in srgb,var(--creator-color,#aab6c0) 34%,#0c151b)}.creator-pill:focus-visible{outline-color:var(--creator-color,#aab6c0)}
.creator-pill .live-avatar{width:30px;height:30px;background:color-mix(in srgb,var(--creator-color,#aab6c0) 28%,#16212a);border-color:#ffffff30;color:#f2f5f6}.creator-pill .live-display-name{font-size:14px;max-width:320px;color:inherit}
.changing-world>:is(.video-status,.live-dock){opacity:0;pointer-events:none}
@media(max-width:700px){.creator-pill{min-height:40px;padding:5px 13px 5px 5px;gap:8px;top:calc(var(--player-center) - var(--screen-height)/2 - 10px)}.creator-pill .live-avatar{width:28px;height:28px}}

.replay-actions{display:flex;align-items:center;gap:9px}.save-button{border-color:#e5d495;color:#f2dc88}.save-button[aria-pressed="true"] svg{fill:currentColor}.return-live{display:flex;align-items:center;gap:6px;padding:8px 0 8px 8px;background:none;color:var(--mint);font-size:12px;margin-left:auto;white-space:nowrap}.return-live .live-dot{width:5px;height:5px}.replay-prompt{margin:0;color:#c0c8ce;font-size:12px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dialog-actions{display:flex;gap:10px;margin-top:20px}.dialog-actions>*{flex:1;min-height:40px}.empty-credits{color:#91a49a;font-size:14px!important;padding:24px 0!important}.purple-button{background:#c3a0ff;color:#25143f}.purple-button:hover{background:#d5bdff}
#clip-dialog .dialog-actions{flex-wrap:wrap}#clip-dialog .dialog-actions>*{flex:1 1 120px;min-width:0;justify-content:center}#clip-dialog #download-clip{flex-basis:100%}
#wishes-dialog{max-width:500px}.wish-tabs{display:flex;align-items:center;gap:6px;margin:20px 0 12px;flex-wrap:wrap}.wish-tabs button,.wish-tabs a{font-size:12px;padding:7px 11px;border-radius:20px;color:#abb4be;background:transparent}.wish-tabs button[aria-pressed="true"]{color:#e0ceff;background:#b58aff18;box-shadow:inset 0 0 0 1px #c3a0ff55}.wish-tabs a{margin-left:auto;color:#c1abd9}.wish-tabs a:hover{color:white}
.wish-list{list-style:none;padding:0;margin:0;max-height:42dvh;overflow-y:auto;overscroll-behavior:contain}.wish-list li{display:flex;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid #ffffff12}.wish-list img{width:76px;aspect-ratio:16/9;object-fit:cover;border-radius:6px;flex:none}.wish-list li>div{flex:1;min-width:0}.wish-list p{font-size:13px;line-height:1.55;margin:5px 0 0;color:#d1d6dd;overflow-wrap:anywhere}.wish-status{font-size:10px;color:#bda6dc;letter-spacing:.03em}.play-wish{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;border:1px solid #ffffff2c;background:transparent;color:#d5e7db}.play-wish svg{width:14px;height:14px}.wish-empty{font-size:14px;color:#9aa9a1;min-height:100px;justify-content:center;text-align:center;padding:24px!important}.clip-preview{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px;margin:0 0 18px}#clip-description{overflow-wrap:anywhere}#clip-link{margin-top:18px}
:is(.mobile-viewing .stage,.stage:fullscreen) :is(.live-dock,.video-status){display:none}
@media(max-width:700px){.viewing-live-channel{--screen:min(calc(100vw - 32px),calc(max(160px,100dvh - 465px)*1.77778))}.viewing-live-channel .stage{min-height:calc(var(--screen-height) + 220px)}.viewing-live-channel .now-playing{width:calc(100vw - 32px);padding-top:5px}.viewing-live-channel .now-playing h1{font-size:23px;margin-bottom:7px}.live-dock{gap:9px;top:calc(var(--player-center) + var(--screen-height)/2 + 11px)}.wish-line{gap:12px}.wish-button{min-height:36px;padding:0 13px}.live-channel .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 100px)) translateZ(-130px) rotateX(-39deg) scale(.94)}.replay-actions{gap:7px}.replay-actions .subscribe-button{padding:0 10px}.return-live{font-size:11px}.replay-prompt{font-size:11px}.wish-tabs{gap:3px}.wish-tabs a,.wish-tabs button{padding:7px 9px}.wish-list img{width:64px}}
@media(max-width:700px) and (max-height:800px) and (orientation:portrait){.viewing-live-channel{overflow:auto}.viewing-live-channel .app{height:auto;min-height:100dvh}.viewing-live-channel .stage{height:calc(var(--screen-height) + 220px);flex:none}}
@media(orientation:landscape) and (max-height:550px){.viewing-live-channel{--screen:min(56vw,calc(max(120px,100dvh - 310px)*1.77778))}.viewing-live-channel .stage{min-height:calc(var(--screen-height) + 190px)}.viewing-live-channel{overflow:auto}.viewing-live-channel .app{height:auto}.mobile-viewing.viewing-live-channel .stage{min-height:0}.mobile-viewing.viewing-live-channel{overflow:hidden}}

/* Contributor identity is shared with creator credits. */
.live-avatar{position:relative;display:grid;place-items:center;width:36px;height:36px;flex:none;overflow:hidden;border-radius:50%;border:1px solid #b8d7c638;background:#263c32;color:#c8e6d5;font-size:12px;font-weight:600;letter-spacing:.02em}.live-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.live-display-name{font-size:14px;font-weight:550;color:#e3eae7;max-width:150px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:700px){.live-display-name{max-width:none;flex:0 1 auto}.live-avatar{width:32px;height:32px}.live-dock{gap:8px}}

/* Keep the upcoming show's artwork visible behind readable preview copy. */
.broadcast-placeholder.has-poster{background:linear-gradient(180deg,#07101755,#071017a6 45%,#071017bf);text-shadow:0 2px 14px #0009}.broadcast-placeholder.has-poster p{color:#d0ded7}.broadcast-placeholder.has-poster button{background:#10241bd9;backdrop-filter:blur(10px)}

/* Saving stays on the video; replay context lives directly below it. */
.stage>.replay-actions{position:absolute;z-index:18;top:calc(var(--player-center) + var(--screen-height)/2 - 1px);left:50%;transform:translate(-50%,-100%);width:calc(var(--screen) - 2px);min-height:64px;padding:12px 14px;border-radius:0 0 12px 12px;background:none;justify-content:space-between;gap:14px;pointer-events:none;text-shadow:0 1px 8px #000}
.replay-actions button{pointer-events:auto}
.replay-actions .save-button{width:40px;height:40px;padding:0;border:0;color:#f2dc88;background:#10161b66;backdrop-filter:blur(8px)}.replay-actions .save-button:hover{background:#f2dc8830}.replay-actions .save-button svg{width:23px;height:23px}.replay-actions .save-button:focus-visible{outline-color:#f2dc88}
.replay-actions .share-button{width:40px;height:40px;padding:0;border:0;color:#e2e8ec;background:#10161b66;backdrop-filter:blur(8px)}.replay-actions .share-button svg{width:20px;height:20px}.replay-actions .share-button:hover{background:#ffffff14}
.video-actions{position:absolute;top:calc(var(--player-center) + var(--screen-height)/2 + 12px);left:50%;transform:translateX(-50%);width:var(--screen);z-index:18;display:flex;justify-content:flex-end;pointer-events:none;transition:top .42s cubic-bezier(.22,.9,.3,1),width .42s cubic-bezier(.22,.9,.3,1)}
.video-actions button{pointer-events:auto}
.video-actions .share-button{width:96px;min-height:36px;padding:0;font-size:14px}
.changing-world>.video-actions{opacity:0;pointer-events:none}.changing-world>.video-actions button{pointer-events:none}
:is(.mobile-viewing .stage,.stage:fullscreen)>.video-actions{display:none}
.composing-live .video-actions{display:flex}
.show-actions>.replay-dock-actions{margin-left:auto;flex:none}
@media(max-width:700px){.replay-actions .share-button{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.video-actions{transition:none}}
.replay-dock{position:absolute;z-index:17;top:calc(var(--player-center) + var(--screen-height)/2 + 12px);left:50%;width:var(--screen);transform:translateX(-50%);display:flex;flex-direction:column;gap:12px;padding:0 2px}
.replay-dock .replay-prompt{font-size:14px;line-height:1.5;min-height:21px;overflow-wrap:anywhere;text-shadow:0 2px 6px #000}
.replay-dock-actions{display:flex;align-items:center;justify-content:center;gap:10px}
.replay-dock-actions .return-live{margin:0;min-height:36px;padding:8px 16px;justify-content:center;border:1px solid #79eea580;border-radius:999px;color:var(--mint);background:#10241bd9;backdrop-filter:blur(10px);font-size:13px;line-height:18px;box-shadow:0 3px 16px #0003}.replay-dock-actions .return-live:hover{background:#1c3a2aed;border-color:var(--mint)}
.changing-world>:is(.replay-actions,.replay-dock){opacity:0;pointer-events:none}.changing-world>.replay-actions button{pointer-events:none}
.viewing-live-replay .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.88 + 115px)) translateZ(-150px) rotateX(-43deg) scale(.94)}
.viewing-live-replay .show-card[data-offset="2"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.5 + 115px)) translateZ(-330px) rotateX(-59deg) scale(.9)}
:is(.mobile-viewing .stage,.stage:fullscreen)>.replay-actions{top:auto;bottom:max(10px,env(safe-area-inset-bottom));width:min(calc(100vw - 24px),calc(100dvh * 1.77778));transform:translateX(-50%);border-radius:0}
:is(.mobile-viewing .stage,.stage:fullscreen)>.replay-dock{display:none}
.mobile-viewing.viewing-live-channel .now-playing{display:none}
@media(max-width:700px){.stage>.replay-actions{min-height:54px;padding:9px 10px;gap:9px;border-radius:0 0 8px 8px}.replay-actions .save-button{width:36px;height:36px}.replay-dock{gap:10px;top:calc(var(--player-center) + var(--screen-height)/2 + 10px)}.replay-dock .replay-prompt{font-size:13px;line-height:1.5}.replay-dock-actions{gap:7px}.replay-dock-actions .return-live{min-height:34px;padding:7px 13px;font-size:12px}.viewing-live-replay .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 110px)) translateZ(-130px) rotateX(-39deg) scale(.94)}}

/* Creator and show credits share the same quiet actions and thumbnail treatment. */
.person-credits{flex:none;display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:3px 9px;border:1px solid #ffffff36;border-radius:999px;background:transparent;color:#c6d1d8;font-size:12px;line-height:1.3;white-space:nowrap}.person-credits:hover{border-color:#ffffff70;color:#fff;background:#ffffff08}
.contributor-name-group{display:flex;align-items:center;flex:1 1 auto;min-width:0;gap:7px;flex-wrap:wrap}.contributor-name-group .contributor-name{flex:0 1 auto}#contributors .avatar{position:relative;overflow:hidden}#contributors .avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#creator-dialog{max-width:500px}.creator-heading{display:flex;align-items:center;gap:15px;margin:24px 0 16px}.creator-heading h2{margin:0;min-width:0;overflow-wrap:anywhere}.creator-avatar{width:60px;height:60px;flex:none;position:relative;overflow:hidden;display:grid;place-items:center;border:1px solid #b8d7c638;border-radius:50%;background:#263c32;color:#c8e6d5;font-size:23px}.creator-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#creator-bio{line-height:1.6;overflow-wrap:anywhere;margin-bottom:18px}
.creator-shot-count{margin:0 0 15px;color:#9facb1;font-size:14px;line-height:1.5}
.creator-shots-retry{margin:0 0 15px;padding:7px 14px;border:1px solid #aab6c180;border-radius:999px;background:#24313b;color:#e4ebee;font-size:13px}
.creator-shots-retry:hover{background:#34434f}
/* Each creator shot plays in place, with the rest of the list available by scrolling. */
.creator-shots{--creator-gallery-height:min(55dvh,560px);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px;max-height:var(--creator-gallery-height);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none}
.creator-shots::-webkit-scrollbar{display:none}
.creator-shots.has-more{mask-image:linear-gradient(#000 calc(100% - 22px),transparent);-webkit-mask-image:linear-gradient(#000 calc(100% - 22px),transparent)}
.creator-shots li{min-width:0;flex:none}
.creator-shot{display:block;width:100%;padding:0;text-align:left;color:#c7d2cd}
.creator-shot-media{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #ffffff24;border-radius:8px;background:#10171c}
.creator-shot-media>img,.creator-shot-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.creator-shot-video{object-fit:contain}
.creator-shot-caption{margin:9px 0 0;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.creator-shot-play,.creator-shot-audio{position:absolute;z-index:14;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid #ffffff55;border-radius:50%;background:#10171cc9;backdrop-filter:blur(8px);color:#fff}
.creator-shot-play{left:50%;top:50%;transform:translate(-50%,-50%);transition:opacity .18s,background .18s}
.creator-shot-play svg{width:21px;height:21px}
.creator-shot-media:not(.is-playing) .creator-shot-play svg{fill:currentColor;stroke-width:1}
.creator-shot-media.is-playing .creator-shot-play{left:8px;top:8px;transform:none;width:32px;height:32px}
.creator-shot-audio{right:5px;top:5px;width:30px;height:30px;border-color:#ffffff30}
.creator-shot-audio:after{content:'';position:absolute;inset:-5px}
.creator-shot-audio svg{width:16px;height:16px}
.creator-shot-play:hover,.creator-shot-audio:hover{background:#293b46ed}
.creator-shot-media.is-loading .creator-shot-play{opacity:.65}
.creator-empty{min-height:120px;display:grid;place-items:center;text-align:center;color:#93a59a;font-size:14px;padding:20px}

@media(max-width:700px){.creator-heading{gap:12px}.creator-heading h2{font-size:27px}.creator-avatar{width:52px;height:52px}.creator-shots{gap:18px}.contributor-name-group{gap:5px}}

/* Let the carousel use spare portrait space, with details at the page bottom. */
@media(max-width:700px) and (orientation:portrait){
 body:not(.mobile-viewing){overflow-y:auto}
 body:not(.mobile-viewing) .app{height:100dvh;min-height:0}
 body:not(.mobile-viewing) main{flex:1 0 auto;min-height:0}
 body:not(.mobile-viewing) .stage:not(:fullscreen){height:auto;flex:1 0 auto;min-height:calc(var(--screen-height) + 145px)}
 body.viewing-live-channel:not(.mobile-viewing) .stage:not(:fullscreen){min-height:calc(var(--screen-height) + 220px)}
 .viewing-live-channel:not(.viewing-live-replay):not(.mobile-viewing) .live-channel:not(:fullscreen) .next-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.87 + 104px)) translateZ(-130px) rotateX(-39deg) scale(.94)}
 body:not(.mobile-viewing) .now-playing{flex:0 0 auto;min-height:0;margin-top:0;padding-bottom:max(12px,env(safe-area-inset-bottom))}
}

/* Keep the replay prompt and return action above the restored show footer. */
body.viewing-live-replay:not(.mobile-viewing) .stage:not(:fullscreen){min-height:calc(var(--screen-height) + 270px)}


/* The wish field stays visible beside its action pill. */
.live-composer{--composer-color:var(--control-purple);display:flex;align-items:center;gap:10px;width:100%;max-width:760px;align-self:center;margin:0}
.composer-dock{width:100%;max-width:760px;align-self:center;flex:none}
.viewing-live-broadcast .show-actions>.credits-button{margin-left:auto}
.viewing-live-broadcast .show-actions>.replay-dock-actions:has(.return-live[hidden]):not(:has(#save-clip:not([hidden]),#channel-subscribe:not([hidden]),#share:not([hidden]))){display:none}
.composer-row{display:flex;align-items:center;justify-content:flex-end;min-width:0;flex:1 1 auto;gap:var(--control-gap)}
.composer-choice{display:flex;align-items:center;gap:var(--control-gap);min-width:0;flex:0 0 auto}
.composer-choice.is-open{flex:1 1 0}
.composer-choice>.compact-action svg{width:16px;height:16px}
.composer-choice>.compact-action{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;flex:none;min-height:44px;padding:0 var(--control-inset);gap:var(--control-gap);font-size:14px}
.composer-slot{position:relative;height:44px;flex:1 1 0;min-width:0;display:flex;align-items:center;overflow:visible;transition:background var(--control-speed),border-color var(--control-speed)}
.composer-slot input{width:100%;height:100%;min-width:0;border:0;border-radius:inherit;outline:0;background:transparent;padding:0 44px 0 16px;font:16px/1.45 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;color:#f1f3f5;caret-color:var(--composer-color);user-select:text}
.composer-slot input::placeholder{color:#aab6c0}
.composer-close{position:absolute;right:5px;top:50%;width:32px;height:32px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;transform:translateY(-50%)}
.composer-close:before{content:'';position:absolute;inset:-5px}
.composer-close svg{width:13px;height:13px;stroke-width:2}
.show-card{transition:top .42s cubic-bezier(.22,.9,.3,1),width .42s cubic-bezier(.22,.9,.3,1),height .42s cubic-bezier(.22,.9,.3,1),transform 600ms cubic-bezier(.2,.8,.2,1),opacity 500ms ease,filter 500ms ease}
.live-dock,.video-status{transition:top .42s cubic-bezier(.22,.9,.3,1),width .42s cubic-bezier(.22,.9,.3,1)}
.composing-live.viewing-live-channel{--screen-height:calc(var(--screen)*.5625)}
.composing-live .stage{--player-center:calc(var(--screen-height)/2 + 56px);min-height:calc(var(--screen-height) + 220px);touch-action:pan-y}
.composing-live .wheel{mask-image:none;-webkit-mask-image:none}
.composing-live .show-card:not([data-offset="0"]){opacity:0;visibility:hidden;pointer-events:none}
@media(max-width:700px){
 body.composing-live:not(.mobile-viewing){--screen:100vw;--screen-height:calc(var(--screen)*.5625);--composer-chrome:100px;overflow:hidden}
 body.composing-live:not(.mobile-viewing) .app{position:fixed;top:var(--compose-top,0px);left:0;width:100%;height:var(--compose-viewport,100dvh);min-height:0}
 body.composing-live:not(.mobile-viewing) .topbar{height:50px}
 body.composing-live.composer-hide-nav:not(.mobile-viewing){--composer-chrome:50px}
 body.composing-live.composer-hide-header:not(.mobile-viewing){--composer-chrome:0px}
 body.composing-live.composer-hide-nav:not(.mobile-viewing) .mode-row,
 body.composing-live.composer-hide-header:not(.mobile-viewing) .topbar{display:none}
 body.composing-live:not(.mobile-viewing) main{flex:1 1 auto;min-height:0}
 body.composing-live:not(.mobile-viewing) main>#stage:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 5px);height:auto;min-height:0;flex:1 1 auto}
 body.composing-live:not(.mobile-viewing) .show-card[data-offset="0"]{border-left:0;border-right:0;border-radius:0}
 body.composing-live:not(.mobile-viewing) main>#stage:not(:fullscreen) .show-card[data-offset="0"] video{object-fit:cover}
 body.composing-live:not(.mobile-viewing) .now-playing{display:none}
 .composing-live .live-dock{width:calc(100vw - 32px);gap:8px}
}
@media(prefers-reduced-motion:reduce){.live-dock,.video-status{transition:none}.composer-slot,.composer-start,.composer-slot input,.composer-close{transition:none}}

:is(#wish-activity-list,#show-history-list)>.wish-event[data-state="playing"]{
 background-image:linear-gradient(105deg,transparent 0 30%,color-mix(in srgb,var(--wish-color) 58%,transparent) 44%,#ffffff70 50%,color-mix(in srgb,var(--wish-color) 48%,transparent) 56%,transparent 70%);
 background-size:280% 100%;animation:wish-card-wave 4.2s linear infinite
}
@keyframes wish-card-wave{from{background-position:130% 0}to{background-position:-130% 0}}
@media(prefers-reduced-motion:reduce){:is(#wish-activity-list,#show-history-list)>.wish-event[data-state="playing"]{animation:none;background-position:50% 0}}


/* Wish activity grows beneath the composer without interrupting playback. */
.live-activity{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;max-width:520px;align-self:center;text-align:left;user-select:none;touch-action:none;outline-offset:3px}
.wish-activity-list{--wish-top-fade:0px;--wish-bottom-fade:56px;position:relative;flex:1;min-height:0;list-style:none;margin:0;padding:3px 3px 2px;overflow:hidden;pointer-events:none;overscroll-behavior:contain;scrollbar-width:none;mask-image:linear-gradient(transparent,#000 var(--wish-top-fade),#000 calc(100% - var(--wish-bottom-fade)),transparent);-webkit-mask-image:linear-gradient(transparent,#000 var(--wish-top-fade),#000 calc(100% - var(--wish-bottom-fade)),transparent)}
.wish-event{--wish-color:#cdb1ff;display:flex;align-items:center;gap:9px;min-height:52px;margin:0 0 6px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--wish-color) 28%,transparent);border-radius:13px;background:color-mix(in srgb,var(--wish-color) 8%,#0a1017b8);transition:background .35s,border-color .35s,box-shadow .35s}
.channel-show{--wish-color:#9bdac3;display:block;padding:11px 13px}
.channel-show .wish-event-name{white-space:normal}
.channel-show .wish-event-prompt{white-space:normal;font-style:normal;line-height:1.4;margin-top:5px}
.world-pill.is-unavailable{opacity:.45}
.wish-event-avatar{position:relative;display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid color-mix(in srgb,var(--wish-color) 38%,transparent);border-radius:50%;overflow:hidden;color:var(--wish-color);background:color-mix(in srgb,var(--wish-color) 13%,#111820);font-size:12px;font-weight:600}
.wish-event-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.wish-event-copy{flex:1;min-width:0}
.wish-event-heading{display:flex;align-items:center;gap:9px;min-width:0;line-height:17px}
.wish-event-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--wish-color);font-size:13px;font-weight:650}
.wish-event-state{display:flex;align-items:center;gap:5px;flex:none;margin-left:auto;color:color-mix(in srgb,var(--wish-color) 74%,white);font-size:12px;font-weight:500;white-space:nowrap}
.wish-event-prompt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:1px 0 0;color:#ced6de;font-size:13px;line-height:17px;font-style:italic}
.wish-event[data-state="playing"]{background:color-mix(in srgb,var(--wish-color) 17%,#0a1017);border-color:color-mix(in srgb,var(--wish-color) 68%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--wish-color) 12%,transparent)}
.wish-event[data-state="playing"] .wish-event-state:before{content:'';width:5px;height:5px;border-radius:50%;background:var(--wish-color);box-shadow:0 0 6px var(--wish-color);animation:wish-activity-pulse 1.8s ease-in-out infinite}
.wish-event[data-state="played"] .wish-event-state{opacity:.7}
/* Your own wish, first line of the stream: received, place in line, making, seconds to screen (F06,
   restored 2026-09-21). Mint because it is about you; same size as the stream's other status. */
.personal-wish-status{margin:0;flex:none;padding:6px 15px 4px;font-size:12px;line-height:1.5;color:var(--mint);text-align:center}
.wish-activity-status{margin:0;min-height:0;flex:1;display:flex;align-items:center;justify-content:center;text-align:center;color:#a9a4b5;font-size:12px;padding:8px 15px}
.wish-activity-list:not([hidden])+.wish-activity-status{flex:none;padding:3px 10px}
@keyframes wish-activity-pulse{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.wish-event{transition:none}.wish-event[data-state="playing"] .wish-event-state:before{animation:none}}
.viewing-live-channel{--screen-height:calc(var(--screen)*.5625)}
.viewing-live-broadcast .stage{--player-center:min(calc(50% - var(--player-lift)),calc(var(--screen-height)/2 + 88px));touch-action:pan-y}
.viewing-live-broadcast .show-card{touch-action:none}
body.viewing-live-broadcast:not(.mobile-viewing) .stage:not(:fullscreen){min-height:calc(var(--screen-height) + 326px)}
.viewing-live-broadcast:not(.mobile-viewing) .live-channel:not(:fullscreen) .next-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.88 + 154px)) translateZ(-150px) rotateX(-43deg) scale(.94)}
.composing-live .live-activity{display:flex}
.composing-live.viewing-live-broadcast .stage{--player-center:calc(var(--screen-height)/2 + 56px)}
@media(max-width:700px){
 .viewing-live-broadcast:not(.mobile-viewing) .live-channel:not(:fullscreen) .next-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.87 + 158px)) translateZ(-130px) rotateX(-39deg) scale(.94)}
 body.composing-live.viewing-live-broadcast:not(.mobile-viewing) .stage:not(:fullscreen){min-height:0}
}
:is(.mobile-viewing .stage,.stage:fullscreen){--player-center:50%}

@media(min-width:701px){
 .viewing-live-broadcast{--screen:min(68vw,1100px,calc(max(140px,100dvh - 570px)*1.77778))}
}
@media(min-width:701px) and (max-height:690px){
 body.viewing-live-broadcast:not(.mobile-viewing){overflow:auto}
 body.viewing-live-broadcast:not(.mobile-viewing) .app{height:auto;min-height:100dvh}
}

@media(min-width:701px){body.composing-live.viewing-live-broadcast:not(.mobile-viewing) .stage:not(:fullscreen){min-height:calc(var(--screen-height) + 185px)}}


/* The Live audience travels with its channel pill; creator credits stay above the shot. */
.world-pill.live-pill{border-color:var(--mint);color:var(--mint);background:#0b171f3d;font-weight:600;gap:9px;padding:0 15px}
.world-pill.live-pill:hover,.world-pill.live-pill[aria-pressed="true"]{background:#79eea514;border-color:var(--mint);box-shadow:0 0 18px #79eea510}
.live-pill .live-audience{color:#d6e3dc;font-size:.9em;font-weight:500;font-variant-numeric:tabular-nums}
.live-pill .live-dot{width:6px;height:6px;animation:live-pulse 2.4s ease-out infinite}
.live-pill.is-off-air .live-dot{animation:none;opacity:.4}
.video-status{position:absolute;top:calc(var(--player-center) - var(--screen-height)/2 - 12px);left:50%;transform:translate(-50%,-100%);z-index:18;display:flex;align-items:center;justify-content:center;width:calc(var(--screen) - 8px);min-height:42px;pointer-events:none}
.video-status .creator-pill{position:relative;top:auto;left:auto;transform:none;width:auto;min-width:0;max-width:100%;min-height:38px;flex:0 1 auto}
.video-status .creator-pill .live-display-name{min-width:0}
.video-status .creator-pill .live-avatar{width:26px;height:26px}
/* A playing wish uses the same color as its creator pill. */
@media(max-width:700px){.video-status{gap:7px;top:calc(var(--player-center) - var(--screen-height)/2 - 10px)}.world-pill.live-pill{padding:0 12px;gap:7px}.video-status .creator-pill{min-height:36px;padding:4px 9px 4px 5px;gap:6px}.video-status .creator-pill .live-display-name{font-size:12px}}
@media(prefers-reduced-motion:reduce){.live-pill .live-dot{animation:none}.video-status{transition:none}}

/* A swipe reveals more of the room while the same live player keeps running. */
body.viewing-live-activity:not(.composing-live,.mobile-viewing) .live-channel:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 16px)}
body.viewing-live-activity:not(.composing-live,.mobile-viewing) .live-channel:not(:fullscreen):has(.creator-pill:not([hidden])){--player-center:calc(var(--screen-height)/2 + 56px)}
.viewing-live-activity .show-card:not([data-offset="0"]){opacity:0;visibility:hidden;pointer-events:none}
.viewing-live-activity .live-channel .wheel{mask-image:none;-webkit-mask-image:none}
.viewing-live-broadcast .live-dock{bottom:0}
.viewing-live-broadcast:not(.composing-live) .live-dock{top:calc(var(--player-center) + var(--screen-height)/2 + 58px)}
.viewing-live-broadcast .live-composer{flex:none}
.viewing-live-activity .live-dock{bottom:20px}
.viewing-live-activity .live-activity{user-select:text;touch-action:pan-y}
.viewing-live-activity .wish-activity-list{--wish-top-fade:12px;--wish-bottom-fade:40px;overflow-y:auto;pointer-events:auto;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;padding-bottom:12px}
.viewing-live-activity .activity-at-start .wish-activity-list{--wish-top-fade:0px}
.viewing-live-activity .activity-at-end .wish-activity-list{--wish-bottom-fade:0px}

/* The live footer keeps its space; wishes recede behind its upper edge. */
@media(max-width:700px) and (orientation:portrait){
 body:not(.mobile-viewing):not(.composing-live){overflow:hidden}
 body:not(.mobile-viewing):not(.composing-live) .app{height:100dvh;min-height:0}
 body:not(.mobile-viewing):not(.composing-live) main{flex:1 1 0;min-height:0}
 body:not(.mobile-viewing):not(.composing-live) .stage:not(:fullscreen){height:auto;flex:1 1 0;min-height:0}
 body.viewing-live-broadcast:not(.mobile-viewing,.composing-live) .now-playing{position:relative;flex:0 0 auto;margin-top:-20px;padding-top:12px;padding-bottom:max(12px,env(safe-area-inset-bottom));z-index:20}
 body.viewing-live-broadcast:not(.mobile-viewing,.composing-live) .now-playing:before{content:'';position:absolute;inset:-12px -16px 0;z-index:-1;pointer-events:none;background:linear-gradient(transparent,#0b10158c 34px,#0b1015b8)}
 body:not(.mobile-viewing):not(.composing-live) .now-playing{position:relative;flex:0 0 auto;min-height:0;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 body:not(.mobile-viewing):not(.composing-live) .now-playing h1{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 body:not(.mobile-viewing):not(.composing-live) .show-actions{flex-wrap:nowrap}
 body:not(.mobile-viewing):not(.composing-live) .credits-button{min-width:0;flex:0 1 auto}
 body:not(.mobile-viewing):not(.composing-live) #credits-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 body:not(.mobile-viewing):not(.composing-live) .show-actions .return-live{min-height:36px;padding:0 12px;font-size:12px}
}

/* Leave a clear strip beneath the other live channel streams. */
body:not(.viewing-live-channel,.mobile-viewing) .stage:not(:fullscreen){min-height:calc(var(--screen-height) + 205px)}
.stage:not(.live-channel) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.83 + 56px)) translateZ(-150px) rotateX(-43deg) scale(.94)}
.stage:not(.live-channel) .show-card[data-offset="2"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.5 + 56px)) translateZ(-330px) rotateX(-59deg) scale(.9)}
.replay-dock-actions .return-live{min-height:40px;font-size:14px;border-color:#79eea594;background:#79eea512}
.replay-dock-actions .return-live:focus-visible{outline-color:var(--mint)}
@media(max-width:700px){.stage:not(.live-channel) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 56px)) translateZ(-130px) rotateX(-39deg) scale(.94)}}

/* Show information travels with the picture; return actions are centered in the footer. */
.below-video{position:absolute;top:calc(var(--player-center) + var(--screen-height)/2 + 12px);bottom:0;left:50%;width:var(--screen);transform:translateX(-50%);z-index:18;display:flex;flex-direction:column;gap:12px;pointer-events:none;transition:top .42s cubic-bezier(.22,.9,.3,1),width .42s cubic-bezier(.22,.9,.3,1)}
.show-details{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:14px;flex:none;min-width:0;pointer-events:auto}
.show-details-copy{min-width:0}
.show-details h1{font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:580;margin:0 0 5px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.show-details .credits-button{min-height:30px;max-width:100%;padding:0;gap:6px;font-size:13px;line-height:1.4}
.show-details #credits-label{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.show-details .credits-word{flex:none;margin-left:3px}
.show-details>.video-actions{position:static;top:auto;left:auto;transform:none;width:auto;align-self:start}
#below-video>.live-dock,#below-video>.replay-dock{position:static;top:auto;bottom:auto;left:auto;transform:none;width:100%;min-height:0;padding:0;pointer-events:auto}
#below-video>.live-dock{flex:1}
#below-video>.replay-dock{flex:none}
.page-footer{position:relative;z-index:20;flex:0 0 auto;width:var(--screen);margin:0 auto;padding:8px 0 max(12px,env(safe-area-inset-bottom));min-height:64px}
.page-footer>.show-actions{width:100%;min-height:44px;justify-content:flex-end;flex-wrap:nowrap;margin:0;gap:0}
.page-footer .replay-dock-actions:has(.return-live[hidden]):not(:has(#save-clip:not([hidden]),#channel-subscribe:not([hidden]),#share:not([hidden]))){display:none}
.page-footer:before{content:'';position:absolute;inset:-20px -16px 0;z-index:-1;pointer-events:none;background:linear-gradient(transparent,#0b101573 30px,#0b10159c)}
.viewing-live-activity .below-video{bottom:12px}
.changing-world>.below-video,.changing-world>.below-video *{pointer-events:none}
.composing-live .show-details{display:grid}.composing-live .page-footer{display:block}
.mobile-viewing .page-footer,:is(.mobile-viewing .stage,.stage:fullscreen)>.below-video{display:none}
.stage:not(.live-channel) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.83 + 88px)) translateZ(-150px) rotateX(-43deg) scale(.94)}
@media(max-width:700px){
 .below-video{top:calc(var(--player-center) + var(--screen-height)/2 + 10px);gap:10px}
 .show-details{gap:10px}.show-details h1{font-size:20px}.show-details .credits-button{font-size:12px}
 .page-footer{width:calc(100vw - 32px)}
 .page-footer .return-live{min-height:36px;padding:0 12px;font-size:12px}
 .composing-live #below-video{width:calc(100vw - 32px)}
 .stage:not(.live-channel) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 88px)) translateZ(-130px) rotateX(-39deg) scale(.94)}
}
@media(prefers-reduced-motion:reduce){.below-video{transition:none}}

/* Compact show actions stay with the title; the granted total lives in the footer. */
.show-details{align-items:center}
.show-details-copy{display:flex;align-items:center;flex-wrap:wrap;gap:6px 9px}
.show-details h1{flex:0 1 auto;max-width:calc(100% - 72px);margin:0}
.show-details .compact-action{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:84px;min-height:28px;height:28px;gap:5px;padding:0 10px;border:1px solid #ffffff36;border-radius:999px;background:transparent;color:#c6d1d8;font-size:12px;line-height:1;white-space:nowrap}
.show-details .compact-action:after{content:'';position:absolute;inset:-8px 0}
.show-details .compact-action:hover{background:#ffffff09;border-color:#ffffff66}
.show-details .compact-action.share-button{color:#e2e8ec;border-color:#e2e8ec59}
.show-details .compact-action.share-button:hover{background:#ffffff14}
.show-details .compact-action svg{width:13px;height:13px}
.show-details>.video-actions{align-self:center}
.page-footer>.show-actions{justify-content:space-between;gap:12px}
.wish-total{display:flex;align-items:center;gap:7px;min-width:0;margin-right:auto;color:#c3ccd0;font-size:13px}
.wish-total>span[data-icon]{flex:none;color:var(--mint)}
.wish-total svg{width:16px;height:16px}
.wish-total #credits-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.activity-scrollable .live-activity{user-select:text;touch-action:pan-y}
.activity-scrollable .wish-activity-list{--wish-top-fade:12px;--wish-bottom-fade:40px;overflow-y:auto;pointer-events:auto;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;padding-bottom:12px}
.activity-scrollable .activity-at-start .wish-activity-list{--wish-top-fade:0px}
.activity-scrollable .activity-at-end .wish-activity-list{--wish-bottom-fade:0px}

/* Center every desktop player; Live's details and wishes share the space below. */
body.desktop-viewer-layout{--live-gap:28px;--live-column:calc((var(--screen) - var(--live-gap))/2);--screen:min(1040px,calc(100vw - 96px),calc(max(180px,100dvh - 470px)*1.77778));--screen-height:calc(var(--screen)*.5625);overflow:hidden}
body.desktop-viewer-layout:not(.mobile-viewing) .app{height:100dvh;min-height:0}
body.desktop-viewer-layout:not(.mobile-viewing) main{flex:1 1 0;min-height:0}
/* Outrank the legacy broadcast, replay, and composer minimum heights. */
body.desktop-viewer-layout:not(.mobile-viewing) main>#stage:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 56px);height:auto;min-height:0;flex:1 1 0;overflow:visible;z-index:21}
.desktop-viewer-layout .channel-track{left:50%}
.desktop-live-layout .below-video{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:var(--live-gap);row-gap:12px;bottom:0}
.desktop-live-layout .show-details{grid-column:1;grid-row:1;grid-template-columns:minmax(0,1fr);align-self:start;align-items:start;gap:10px}
.desktop-live-layout .show-details-copy{grid-row:1}
.desktop-live-layout .show-details>.show-description{grid-row:2;display:-webkit-box;-webkit-line-clamp:4}
.desktop-live-layout .show-details>.video-actions{grid-row:3;justify-self:start;align-self:start}
body.desktop-live-layout #below-video>.live-dock{position:relative;grid-column:2;grid-row:1/-1;align-self:stretch;left:auto;top:auto;bottom:auto;transform:none;width:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;backdrop-filter:none;gap:0}
.desktop-live-layout #below-video>.replay-dock{grid-column:1;grid-row:2;min-width:0}
.desktop-live-layout .live-activity{display:flex;max-width:none;min-width:0}
.desktop-live-layout .live-activity .wish-activity-list{padding:3px 0 12px}
.desktop-live-layout .wish-event{align-items:flex-start;padding:9px 10px}
.desktop-live-layout .wish-event-heading{flex-wrap:wrap;gap:2px 8px}
.desktop-live-layout .wish-event-name{max-width:100%}
body.desktop-viewer-layout .page-footer{min-height:64px;margin-bottom:12px}
body.desktop-live-layout .page-footer{display:block;width:var(--screen);margin-left:auto;margin-right:auto;padding:8px 0 max(12px,env(safe-area-inset-bottom));border:0;border-radius:0;background:transparent;backdrop-filter:none}
.desktop-live-layout .page-footer:before{display:none}
.desktop-live-layout .wish-total{font-size:12px;gap:5px}
.desktop-live-layout .wish-total svg{width:14px;height:14px}
.desktop-live-layout #composer-dock{position:absolute;top:calc(100% + 8px);left:0;right:0;width:auto;max-width:none;z-index:22}
.desktop-live-layout.composing-live .show-details{display:grid}
.desktop-live-layout.composing-live .video-actions{display:flex}
.desktop-live-layout.composing-live .page-footer>.show-actions{visibility:visible}
.desktop-live-layout.composing-live .live-activity{display:flex}
.desktop-live-layout.composing-live .composer-slot input{padding-left:18px}
/* Touch-capable desktops can navigate the copy without claiming the feed's gestures. */
.desktop-viewer-layout .wheel,.desktop-viewer-layout .show-details,.desktop-viewer-layout .page-footer{touch-action:none}
@media(min-width:900px) and (max-height:700px){
 .desktop-live-layout .show-details{gap:6px}
 .desktop-live-layout .show-details h1{font-size:18px;-webkit-line-clamp:1}
 .desktop-live-layout .show-details>.show-description{-webkit-line-clamp:2}
}
@media(max-width:700px){.wish-total{font-size:12px;gap:5px}.show-details-copy{gap:6px 8px}.show-details{gap:9px}}

/* Keep room for creator credits without shifting the live picture as wishes play. */
body.viewing-live-broadcast:not(.composing-live):not(.mobile-viewing) #stage:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 56px)}
.show-details h1{max-width:100%}
.show-details>.video-actions{gap:8px}

/* New wishes arrive at the bottom; older activity recedes above them. */
.wish-activity-list,.viewing-live-activity .wish-activity-list,.activity-scrollable .wish-activity-list{display:flex;flex-direction:column;--wish-top-fade:32px;--wish-bottom-fade:0px}
.wish-activity-list>.wish-event{flex:none}
.wish-activity-list>.wish-event:first-child{margin-top:auto}

.show-details .show-description{grid-column:1/-1;margin:0;color:#b9c5cb;font-size:14px;line-height:1.5;max-width:70ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.show-details:has(.show-description:not([hidden])){row-gap:8px}
.stage:not(.live-channel):has(.show-description:not([hidden])) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*.83 + 148px)) translateZ(-150px) rotateX(-43deg) scale(.94)}

/* Compact avatar playback and a reaction capsule that opens inward. */
.wish-event{position:relative;gap:8px}
.wish-event-avatar{width:32px;height:32px;overflow:visible}
.wish-event:has(.wish-reactions.is-open){z-index:2}
.wish-reactions{position:relative;flex:none;align-self:flex-start;width:34px;height:34px;pointer-events:auto;touch-action:manipulation}
.wish-reaction-trigger,.wish-reaction-option{position:relative;display:grid;place-items:center;flex:none;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--wish-color);font-size:20px;line-height:1;cursor:pointer;touch-action:manipulation}
.wish-reaction-trigger{z-index:2;border:1px solid color-mix(in srgb,var(--wish-color) 45%,transparent);background:color-mix(in srgb,var(--wish-color) 8%,#111920);font-size:19px}
.wish-reaction-trigger:after,.wish-reaction-option:after{content:'';position:absolute;inset:-5px 0}
.wish-reaction-trigger svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.wish-reaction-trigger:hover,.wish-reactions.has-reaction .wish-reaction-trigger{background:color-mix(in srgb,var(--wish-color) 23%,#111920);border-color:var(--wish-color)}
.wish-reactions.has-reaction .wish-reaction-trigger svg{fill:var(--wish-color)}
.wish-reaction-options{position:absolute;right:0;top:-4px;display:flex;align-items:center;gap:3px;height:42px;padding:4px 40px 4px 5px;border:1px solid color-mix(in srgb,var(--wish-color) 45%,#273039);border-radius:999px;background:#111a23f5;box-shadow:0 4px 16px #0006;opacity:0;visibility:hidden;transform:scaleX(.24);transform-origin:right center;pointer-events:none;transition:transform .2s ease,opacity .15s ease,visibility .2s}
.wish-reactions.is-open .wish-reaction-options{opacity:1;visibility:visible;transform:scaleX(1);pointer-events:auto}
.wish-reaction-option:hover,.wish-reaction-option[aria-pressed="true"]{background:color-mix(in srgb,var(--wish-color) 24%,transparent)}
.wish-event-heading{flex-wrap:wrap;gap:1px 7px}
.wish-event-name{max-width:100%}
.wish-event-state{margin-left:0}
.wish-event-avatar:focus-visible,.wish-reactions button:focus-visible{outline:2px solid var(--wish-color);outline-offset:3px}
@media(max-width:700px) and (orientation:portrait){
 body:not(.composing-live):not(.mobile-viewing){--screen:min(calc(100vw - 32px),calc(max(160px,100dvh - 465px)*1.77778));--screen-height:calc(var(--screen)*.5625)}
 body:not(.composing-live):not(.mobile-viewing) main>#stage:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 56px);min-height:0}
 .stage:not(.live-channel):has(.show-description:not([hidden])) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 148px)) translateZ(-130px) rotateX(-39deg) scale(.94)}
}
@media(prefers-reduced-motion:reduce){.wish-reaction-options,.desktop-viewer-layout .channel-track{transition:none}}

/* Read the full wish, then tap anywhere on its card to replay it. */
.wish-event .wish-event-prompt,.desktop-live-layout .wish-event .wish-event-prompt{display:block;-webkit-line-clamp:unset;white-space:pre-wrap;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;min-height:0;margin-top:1px;font-size:13px;line-height:17px}
.wish-event-replay{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;pointer-events:auto;cursor:pointer}
.wish-event-replay:hover{background:color-mix(in srgb,var(--wish-color) 7%,transparent)}
.wish-event-replay:focus-visible{outline:2px solid var(--wish-color);outline-offset:-2px}
.wish-event .wish-reactions{z-index:2}

.wish-event-avatar{z-index:2;padding:0;pointer-events:auto;cursor:pointer;touch-action:pan-y}
.wish-event-avatar:after{content:"";position:absolute;inset:-6px;border-radius:inherit}
.wish-event-avatar:hover{border-color:var(--wish-color)}
.replay-dock .replay-prompt{text-align:center;display:block;-webkit-line-clamp:unset;white-space:pre-wrap;overflow:visible}

/* Show credits share the live wish feed's compact, creator-colored cards. */
#credits-dialog{max-width:500px}
#contributors{border-top:0;margin-top:24px}
#contributors>.wish-event{align-items:flex-start;gap:8px;padding:9px 10px;border-bottom-color:color-mix(in srgb,var(--wish-color) 28%,transparent)}
:is(#credits-dialog,#creator-dialog)>.dialog-actions{justify-content:flex-end}
:is(#credits-dialog,#creator-dialog)>.dialog-actions>.subscribe-button{flex:0 0 auto;min-height:32px;padding:4px 12px;font-size:14px}

/* Feed scrolling belongs to the feed, including its mobile outer gutters. */
body:not(.mobile-viewing) .stage:not(:fullscreen){touch-action:pan-y}
body:not(.viewing-live-channel) main,body:not(.viewing-live-channel):not(.mobile-viewing) .stage:not(:fullscreen){touch-action:none}
.show-card[data-offset="0"]{touch-action:none}
#below-video>#replay-dock{flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding-bottom:14px}
@media(max-width:700px) and (orientation:portrait){
 #live-activity{width:100vw;max-width:none;align-self:center}
 #wish-activity-list{padding-left:calc((100vw - var(--screen))/2 + 3px);padding-right:calc((100vw - var(--screen))/2 + 3px)}
}

/* The Save label is used by the desktop playback action row. */
.save-clip-label{display:none}

/* Keep the replay return centered independently of the action pills. */
.page-footer .replay-dock-actions{position:absolute;left:50%;top:8px;margin:0;transform:translateX(-50%)}
.page-footer .replay-dock-actions .return-live{margin:0}
.page-footer .wish-total{max-width:calc(50% - 96px)}

/* Replaying a wish uses the same tint as its creator pill. */
.page-footer .replay-dock-actions .return-live.creator-return{color:#f2f5f6;border-color:var(--return-color);background:color-mix(in srgb,var(--return-color) 24%,#0c151b)}
.page-footer .replay-dock-actions .return-live.creator-return:hover{border-color:var(--return-color);background:color-mix(in srgb,var(--return-color) 34%,#0c151b)}
.page-footer .replay-dock-actions .return-live.creator-return:focus-visible{outline-color:var(--return-color)}

/* The activity feed and persistent wish composer operate independently. */
#live-dock #composer-dock{position:static;order:2;flex:none;width:100%;max-width:none;transform:none;margin-top:12px}
#live-dock #live-activity{order:1;flex:0 1 auto;min-height:0;height:auto;max-height:100%;margin-top:auto}
#live-dock #wish-activity-list{flex:0 1 auto}
.activity-heading{display:flex;align-items:center;justify-content:flex-end;flex:none;min-height:30px;padding:0 3px 2px}
.activity-heading .icon-button{position:relative;width:28px;height:28px;background:#0a111a99;border-color:#ffffff26}
.activity-heading .icon-button:before{content:'';position:absolute;inset:-8px}
#live-dock .wish-system{--wish-color:#fff;border-color:#ffffff87;background:#ffffff12;color:#f2f5f6;font-size:14px;line-height:1.5;padding:12px 14px}
#live-dock .wish-system{align-items:flex-start}
#live-dock .wish-system-avatar{pointer-events:none;cursor:default;overflow:hidden;border-color:var(--mint);background:#fff}
#live-dock .wish-system-avatar:after{content:none}
/* Lift only the off-air copy; the picture and player keep their geometry. */
.broadcast-placeholder.off-air>:is(.eyebrow,h2,p){transform:translateY(-12px)}
.composing-live .show-details-copy,.composing-live .show-details>.show-description{display:none}
.composing-live .show-details>.video-actions{grid-column:1/-1;justify-self:end}
@media(max-width:700px){
 .composing-live #below-video{gap:6px}
 .composing-live #live-dock #composer-dock{margin-top:6px}
 .composing-live #wish-activity-list{padding:3px 19px 2px}
 .composing-live .activity-heading{padding:0 19px 2px}
}

/* Signed in, the Backstage slot holds you: avatar and name, opening a small menu. Ported from
   the pre-Chad front page's #mechip. Same pill as "Go Backstage!" so nothing shifts on sign-in. */
.account-chip{position:relative;flex:0 0 auto}
.account-chip-button{display:inline-flex;align-items:center;gap:8px;padding:0 12px 0 5px;max-width:190px}
.account-chip-avatar{flex:0 0 auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:#06190d;text-transform:uppercase;overflow:hidden}
.account-chip-avatar{position:relative}
.account-chip-avatar img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.account-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:172px;padding:4px;background:#0f1713f2;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px #0008;backdrop-filter:blur(14px);z-index:60;display:flex;flex-direction:column}
.account-menu a,.account-menu button{display:block;text-align:left;background:none;border:0;color:var(--text);font:inherit;font-size:13px;padding:9px 10px;border-radius:8px;text-decoration:none;cursor:pointer}
.account-menu a:hover,.account-menu button:hover,.account-menu a:focus-visible,.account-menu button:focus-visible{background:#79eea51f;color:var(--mint);outline:none}
.account-menu button{color:var(--muted)}

/* Mobile controls sit close to the header and leave the picture at the top of the stage. */
.backstage-mobile-label{display:none}
@media(max-width:700px){
 body:not(.composing-live):not(.mobile-viewing){--screen:100vw;--screen-height:calc(var(--screen)*.5625)}
 body:not(.mobile-viewing) .app{touch-action:pan-y}
 .topbar{height:50px;padding:0 14px;gap:10px}
 .wordmark{font-size:16px;letter-spacing:.2em}
 .backstage-button{height:30px;padding:0 12px;font-size:12px}
 .account-chip-button{padding:0 3px}
 .account-chip-name{display:none}
 .account-chip-avatar{width:22px;height:22px;font-size:11px}
 .backstage-desktop-label{display:none}
 .backstage-mobile-label{display:inline}
 .mode-row{height:50px;min-height:50px;padding:0}
 .world-nav{height:50px}
 .channel-track{top:11px;gap:6px}
 .world-pill,.world-pill.live-pill{min-width:0;min-height:28px;height:28px;padding:0 10px;gap:6px;font-size:11px}
 .wheel,.live-channel .wheel{mask-image:none;-webkit-mask-image:none}
 body:not(.composing-live):not(.mobile-viewing) main>#stage:not(:fullscreen),
 body.viewing-live-broadcast:not(.composing-live):not(.mobile-viewing) main>#stage:not(:fullscreen){--player-center:calc(var(--screen-height)/2 + 5px)}
 body:not(.composing-live):not(.mobile-viewing) .show-card[data-offset="0"]{border-left:0;border-right:0;border-radius:0}
 body:not(.composing-live):not(.mobile-viewing) main>#stage:not(:fullscreen) .show-card[data-offset="0"] video{object-fit:cover}
 body.viewing-live-broadcast:not(.composing-live,.mobile-viewing) main>#stage:not(:fullscreen) .show-card[data-offset="0"] video{transform:scale(1.02);transform-origin:center}
 .show-details{margin-inline:16px}
 .show-details>.video-actions{justify-self:end}
 #show-title{font-size:18px}
 #show-description{font-size:12px}
 #show-description:not([hidden]){display:block;-webkit-line-clamp:unset;overflow:visible;text-overflow:clip}
 #wish-total{display:none!important}
 .page-footer{min-height:52px;padding:0}
 .page-footer:before{display:none}
 .page-footer>.show-actions{position:fixed;left:0;right:0;bottom:0;z-index:35;width:100%;min-height:52px;margin:0;padding:8px 16px max(8px,env(safe-area-inset-bottom));gap:8px;justify-content:flex-end;pointer-events:auto}
 .page-footer>.show-actions:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:#08101840;border-top:1px solid #ffffff0a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
 .page-footer #composer-dock{position:fixed;left:16px;right:16px;bottom:max(8px,env(safe-area-inset-bottom));z-index:40;flex:0 0 auto;width:auto;max-width:none;margin:0;pointer-events:auto}
 .page-footer #live-composer{position:relative;display:block;width:100%}
 .page-footer #broadcast-actions,.page-footer #wish-choice{width:100%}
 .page-footer #wish-choice.is-open{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--control-gap);flex:1 1 auto}
 .page-footer #wish-slot{width:auto;min-width:0}
 .page-footer #credits{--control-height:36px;display:inline-flex;align-items:center;justify-content:center;flex:none;width:auto;min-width:88px;min-height:36px;height:36px;padding:0 13px;gap:6px;font-size:13px;line-height:1;white-space:nowrap}
 .page-footer #credits svg{width:16px;height:16px}
 .page-footer #credits-text{display:inline}
 .page-footer #return-live{display:none!important}
 .page-footer .replay-dock-actions{position:fixed;left:16px;bottom:calc(max(8px,env(safe-area-inset-bottom)) + 52px);top:auto;z-index:35;display:flex;flex-direction:column-reverse;align-items:flex-start;gap:8px;margin:0;transform:none}
 .page-footer .replay-dock-actions :is(.subscribe-button,.share-button){display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;height:36px;padding:0 13px;font-size:13px}
 .show-details #save-clip.mobile-shot-save{--control-accent:var(--control-gold)}
 .show-details #save-clip.mobile-shot-save .save-clip-label{display:inline}
 .show-details #save-clip.mobile-shot-save svg{width:13px;height:13px}
 body.composing-live:not(.mobile-viewing) .page-footer>.show-actions{left:0;right:0;width:100%}
 body.composing-live:not(.mobile-viewing) .page-footer #composer-dock{position:fixed;top:calc(var(--composer-chrome) + 5px + 56.25vw + 8px);left:16px;right:16px;z-index:40;flex:1 1 auto;width:auto;max-width:none;margin:0}
 body.composing-live:not(.mobile-viewing) .page-footer #live-composer,
 body.composing-live:not(.mobile-viewing) .page-footer #broadcast-actions{width:100%}
 body.composing-live:not(.mobile-viewing) .page-footer .composer-choice.is-open{width:100%;flex:1 1 auto}
 body.composing-live:not(.mobile-viewing) .page-footer .composer-choice:not(.is-open),
 body.composing-live:not(.mobile-viewing) .page-footer #credits{display:none}
 body.composing-live:not(.mobile-viewing) .page-footer .replay-dock-actions{display:none}
 body.viewing-live-channel:not(.mobile-viewing) .page-footer #credits{display:none!important}
 .page-footer .composer-slot{height:36px}
 .page-footer .composer-close{right:4px;width:28px;height:28px}
 .page-footer .composer-slot input{padding-right:38px}
 .page-footer .composer-choice>.compact-action{min-height:36px;height:36px;padding:0 13px;font-size:13px}

 /* Mobile opens the same creator-colored activity feeds directly below the player. */
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) .show-card:not([data-offset="0"]){opacity:0;visibility:hidden;pointer-events:none}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) #below-video{bottom:0;gap:0}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) .show-details{position:relative;z-index:2;margin-inline:16px;padding-bottom:10px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) :is(#live-dock,#show-history){flex:1 1 auto;min-height:0;width:100%;max-width:none;pointer-events:auto}
 body.live-feed-open:not(.mobile-viewing) #live-dock .live-activity{flex:1 1 auto;min-height:0;height:auto;max-height:none;margin-top:0}
 body.history-open:not(.mobile-viewing) #show-history{display:flex;flex-direction:column;align-self:stretch;user-select:text;touch-action:pan-y}
 body.history-open:not(.mobile-viewing) #show-history-list,
 body.live-feed-open:not(.mobile-viewing) #wish-activity-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;touch-action:pan-y;scrollbar-width:none;padding:10px 10px 5px;--wish-top-fade:38px;--wish-bottom-fade:0px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) .activity-at-start :is(#wish-activity-list,#show-history-list){--wish-top-fade:0px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) .activity-has-scrolled :is(#wish-activity-list,#show-history-list){--wish-bottom-fade:64px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) .activity-at-end :is(#wish-activity-list,#show-history-list){--wish-bottom-fade:0px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) :is(#wish-activity-list,#show-history-list)>.wish-event{align-items:flex-start;margin-bottom:8px}
 body:is(.live-feed-open,.history-open):not(.mobile-viewing) :is(#wish-activity-list,#show-history-list)>.wish-event:last-child{margin-bottom:0}

 /* User shots replace the visible picture in place while the feed remains below it. */
 body.history-overlay-open:not(.mobile-viewing) .show-card[data-offset="0"]>.player-top{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
 body.history-overlay-open:not(.mobile-viewing) .wheel{pointer-events:none}
 body.history-overlay-open:not(.mobile-viewing) .user-shot-overlay{
  position:absolute;left:50%;top:var(--player-center);z-index:28;width:var(--screen);height:var(--screen-height);overflow:visible;
  transform:translate(-50%,-50%);border:0;border-radius:0;background:#05080c;box-shadow:none;pointer-events:auto
 }
 body.history-overlay-open:not(.mobile-viewing) .user-shot-overlay video{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;background:#05080c}
 body.history-overlay-open:not(.mobile-viewing) .user-shot-identity{display:none}
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay .user-shot-creator,
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay .user-shot-follow,
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay>#save-clip,
 body.history-overlay-open:not(.mobile-viewing):not(.desktop-theater) #stage #history-overlay .user-shot-sound{
  --control-height:32px;--control-inset:9px;--control-gap:5px;--control-icon:13px;--control-font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:32px;min-height:32px;font-size:11px;line-height:1;white-space:nowrap;background:#0b131bbd;backdrop-filter:blur(14px);box-shadow:0 4px 16px #0007
 }
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay .user-shot-creator{position:static;top:auto;left:auto;width:100%;max-width:100%;min-width:0;padding:0 9px 0 2px;transform:none;--control-accent:var(--creator-color,var(--control-neutral))}
 body.history-overlay-open:not(.mobile-viewing) .user-shot-avatar{width:26px;height:26px;font-size:10px}
 body.history-overlay-open:not(.mobile-viewing) .user-shot-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay .user-shot-follow{position:absolute;left:8px;bottom:8px;z-index:3;padding:0 9px;--control-accent:#34c759}
 body.history-overlay-open:not(.mobile-viewing) .user-shot-player-top{z-index:4}
 body.history-overlay-open:not(.mobile-viewing):not(.desktop-theater) .user-shot-player-top{top:8px;left:8px;right:8px}
 body.history-overlay-open:not(.mobile-viewing):not(.desktop-theater) #stage #history-overlay .user-shot-sound{padding:0 9px}
 body.history-overlay-open:not(.mobile-viewing):not(.desktop-theater) #stage #history-overlay .user-shot-sound.sound-icon-only{width:32px;min-width:32px;padding:0}
 body.history-overlay-open:not(.mobile-viewing) #stage #history-overlay>#save-clip{position:absolute;right:8px;bottom:8px;z-index:3;width:32px;min-width:32px;padding:0;border-color:#e5d49599;--control-accent:var(--control-gold)}
 body.history-overlay-open:not(.mobile-viewing) #history-overlay .user-shot-follow{display:none!important}
 body.history-overlay-open:not(.mobile-viewing) .show-details{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
 body.history-overlay-open:not(.mobile-viewing) .show-details-copy{display:flex;grid-column:1}
 body.history-overlay-open:not(.mobile-viewing) .show-details>.show-description{display:none}
 body.history-overlay-open:not(.mobile-viewing) .show-details>.video-actions{grid-column:2}
}

/* Keep adjacent channel cards readable below the details on small screens. */
@media(max-width:700px){
 .stage:not(.live-channel) .show-card[data-offset="1"],
 .stage:not(.live-channel):has(.show-description:not([hidden])) .show-card[data-offset="1"]{transform:translate(-50%,calc(-50% + var(--screen-height)*1.01 + 95px)) translateZ(-30px) rotateX(-10deg) scale(.98);filter:brightness(.92) saturate(.98);opacity:.96}
 .stage:not(.live-channel) .show-card[data-offset="1"] .preview-label{font-size:17px;line-height:1.25;padding:9px 14px 30px;background:linear-gradient(#050a0bcc,transparent)}
 .stage:not(.live-channel) .show-card[data-offset="1"] .preview-label small{display:block;margin-bottom:2px;color:#bceccf;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
}
/* the episode rail — everyone's wishes against the episode on air on a recorded channel (Raina, 2026-09-28). Rows are the
   live rail's rows; only the heading differs: a label, not an icon slot. */
.episode-rail .activity-heading{display:flex;flex-direction:column;align-items:flex-start;gap:1px;margin:0;min-height:0;padding:0 3px 6px}
.episode-rail .episode-rail-label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#a9a4b5;white-space:nowrap}
.episode-rail .episode-rail-show{font-size:15px;font-weight:600;color:#f1edf7;line-height:1.2;overflow-wrap:anywhere}
.episode-rail .activity-heading:empty{display:none}
.episode-rail .wish-event-state{white-space:nowrap}
/* the rail lists and scrolls on every layout: the live list sizes itself off the live dock's bottom edge and only
   takes pointer events when the feed is expanded; a channel has neither, and without this the list is 12 px tall on a
   phone (measured in WebKit 2026-09-28). Bounded so a long rail never pushes the channel's lineup off the screen. */
.episode-rail{flex:none;min-height:0}
.episode-rail .wish-activity-list{flex:none;max-height:38dvh;overflow-y:auto;pointer-events:auto;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;padding-bottom:10px;--wish-top-fade:0px;--wish-bottom-fade:0px}
.episode-rail .wish-event{pointer-events:auto}
.episode-rail .wish-event.is-playing{border-color:color-mix(in srgb,var(--wish-color) 70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--wish-color) 45%,transparent)}

/* Share beside the Wish button on a phone (Raina, 2026-09-28): the composer row is flex, the wish slot is flex:1 1 0, so the
   input shortens by exactly the Share button's width and nothing else moves. */
@media(max-width:700px){#broadcast-actions>#share{flex:none;order:-1;margin-right:2px}}
@media(max-width:700px){#broadcast-actions>#share{height:44px;min-height:44px;padding:0 12px;white-space:nowrap;flex-direction:row;gap:6px}#broadcast-actions>#share span{display:inline}}

/* a wish from the original broadcast (Raina, 2026-09-28: "add the wished live."): the same row, its time line carrying the
   words "wished live", and the live colour on its edge so the two kinds read apart at a glance. */
.episode-rail .wish-event.wished-live{--wish-color:#6ee7b7}

/* PHONE, recorded channel, signed in (Raina, 2026-10-02 00:54: the lineup and the rail overlapped, Shows sat under Wish,
   Share was taller than the row). Shows rides beside the title; the bottom row is Share · box · Wish at one height; the
   lineup and the episode's wishes take turns, as on the desktop. */
@media(max-width:700px){
 .show-details-copy:has(+ #recorded-actions.title-shows){display:contents}
 #now-playing:has(#recorded-actions.title-shows){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px}
 #now-playing:has(#recorded-actions.title-shows)>:not(.show-details-copy):not(#recorded-actions){grid-column:1/-1}
 #recorded-actions.title-shows{grid-column:2;grid-row:1;display:flex;margin:0}
 #recorded-actions.title-shows>:not(#credits){display:none}
 #recorded-actions.title-shows #credits{min-height:36px;height:36px;padding:0 13px;font-size:13px;display:inline-flex;align-items:center;gap:6px;flex-direction:row;white-space:nowrap}
 #recorded-actions.title-shows #credits-text{display:inline}
 html body #broadcast-actions>#share{display:inline-flex;justify-content:center;height:36px;min-height:36px;flex-direction:row;align-items:center;gap:6px;padding:0 12px;font-size:13px;line-height:1}
 html body #broadcast-actions>#share svg{width:15px;height:15px}
 body.history-open:not(.viewing-live-channel) #live-dock>#episode-rail{display:none}
 body:not(.viewing-live-channel) #live-dock>#episode-rail{padding-inline:16px;box-sizing:border-box}
 /* the "can't wish here" line wraps and starts under the title — it ran off the right edge in Safari */
 .show-details-copy #live-why{text-align:left;white-space:normal;padding:4px 0 0;flex:0 1 auto;min-width:0;max-width:100%}
 /* no composer (a channel nobody can wish on, or signed out): Share sits IN the bottom bar, left, level with Shows —
    it floated 52px above the bar and the open lineup ran under it */
 body:not(.composing-live) .page-footer .replay-dock-actions:has(#share:not([hidden])){bottom:max(8px,env(safe-area-inset-bottom));z-index:36}
}
