/* JoyReels H5: line-mode feed, three-action rail, compact regular player. */
.watch-stage-top,.watch-stage-rail,.watch-stage-info,.pd-player-mini-tools{display:none}
.pd-player-glance,.pd-player-ambient{display:none}
.watch-details-sheet p{line-height:1.65;color:#d5d5d5}
.pd-immersive .pd-player-stage{overflow:clip;background:#000}
.pd-immersive .pd-player-video{background:#000}
.reels-view{overflow:hidden}.reels-view #app{display:flex;flex-direction:column;height:100dvh;min-height:0}
.reels-view .viewer-header{flex-shrink:0}.reels-view .viewer-footer,.reels-view .prototype-label{display:none}
.reels-view .viewer-header{display:block}
.reels-view .mobile-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,440px);height:calc(50px + env(safe-area-inset-bottom));min-height:0;box-sizing:border-box;padding:0 0 env(safe-area-inset-bottom);grid-template-columns:repeat(4,minmax(0,1fr));background:#0c0c0e;border-top:1px solid #242426}
.reels-view .mobile-nav a{min-width:0;gap:2px;padding:5px 2px;color:#96969b}.reels-view .mobile-nav a.active{color:#fff}.reels-view .mobile-nav svg{width:22px;height:22px}.reels-view .mobile-nav span{font-size:10px;line-height:12px}
.reels-page{position:relative;display:flex;justify-content:center;flex:1;min-height:0;background:#080808;padding:16px 70px 0;margin-bottom:calc(50px + env(safe-area-inset-bottom))}
.reels-scroller{width:min(100%,440px);height:100%;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-width:none;border-radius:8px;background:#000}
.reels-scroller::-webkit-scrollbar{display:none}
.reels-card{position:relative;height:100%;min-height:100%;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;background:#000}
.reels-card>.pd-player,.reels-card .pd-player-stage{height:100%;min-height:0;max-height:none;aspect-ratio:auto;border:0;border-radius:0}
.reels-placeholder{height:100%;width:100%;background:#000}.reels-placeholder img{height:100%;width:100%;object-fit:contain}
.reels-paging{position:absolute;top:50%;left:calc(50% + 240px);transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;align-items:center}
.reels-paging>span{font-size:11px;color:#999}.reels-paging button{width:44px;height:44px;border:1px solid #ffffff20;border-radius:50%;background:#202020;color:#fff;display:grid;place-items:center}
.reels-paging button:first-of-type svg{transform:rotate(-90deg)}.reels-paging button:last-of-type svg{transform:rotate(90deg)}.reels-paging button:disabled{opacity:.3}
.reels-empty{align-items:center;text-align:center;padding:28px}.reels-empty>div{max-width:360px}.reels-empty h1{font-size:22px}.reels-empty p{color:#aaa;font-size:14px;line-height:1.6}
.pd-reel-player .pd-player-stage{touch-action:pan-y pinch-zoom}
.pd-reel-player .pd-player-brand,.pd-reel-player .pd-player-mobile-actions{display:none}
.pd-reel-player .watch-stage-top,.pd-reel-player .watch-stage-rail{display:flex}.pd-reel-player .watch-stage-info{display:block}
.watch-stage-top{position:absolute;inset:0 0 auto;z-index:7;align-items:center;gap:0;height:54px;padding:0 8px;color:white;background:linear-gradient(#0007,transparent);pointer-events:none}
.watch-stage-top a,.watch-stage-top button{pointer-events:auto;color:white;display:flex;align-items:center;justify-content:center;width:36px;min-width:36px;height:44px;border:0;background:none;padding:0}
.watch-stage-back svg{transform:rotate(180deg)}.watch-stage-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:400;flex:1}
.watch-stage-count{font-size:10px;white-space:nowrap;padding:0 10px;color:#fff}
.watch-stage-top.watch-feed-top{inset:5px auto auto 5px;width:44px;height:44px;padding:0;background:none}
.watch-feed-top button{position:relative;width:44px;height:44px;min-width:44px}
.watch-feed-top button::before{content:'';position:absolute;inset:10px;border-radius:50%;background:#3339;z-index:-1}.watch-feed-top button svg{width:15px;height:15px}
.watch-stage-rail{position:absolute;z-index:7;right:10px;bottom:109px;flex-direction:column;gap:16px;color:white}
.watch-stage-rail button{width:44px;min-height:60px;border:0;background:none;color:inherit;display:flex;align-items:center;justify-content:flex-start;flex-direction:column;gap:4px;padding:0;text-shadow:0 1px 3px #0006}
.watch-stage-rail svg{width:28px;height:28px;filter:drop-shadow(0 1px 2px #0004)}.watch-stage-rail span{font-size:12px;line-height:16px;font-weight:400;white-space:nowrap}
.watch-stage-rail .is-saved{color:#f43574}
.watch-stage-info{position:absolute;z-index:6;left:15px;right:59px;bottom:14px;color:#fff;text-shadow:0 1px 3px #0008}
.watch-stage-info button{font:inherit;color:inherit;text-align:left;padding:0;border:0;background:none}
.watch-stage-info h1{font-size:18px;font-weight:500;line-height:22px;margin:0 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.watch-stage-info h1 button{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:22px}
.watch-feed-tags{display:flex;gap:8px;overflow:auto;scrollbar-width:none;white-space:nowrap;margin:8px 0}
.watch-feed-tags span{flex:none;border:1px solid #aaa;border-radius:13px;padding:0 12px;font-size:12px;line-height:19px}
.watch-feed-summary{font-size:12px;line-height:16px;margin:4px 0 5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-weight:400}
.pd-description-expanded .watch-feed-summary{-webkit-line-clamp:6}
.watch-stage-info .watch-more{display:flex;align-items:center;gap:4px;height:24px;min-height:24px;color:#f43574;font-size:12px;font-weight:600;line-height:16px}
.watch-more svg{transform:rotate(-90deg)}.pd-description-expanded .watch-more svg{transform:rotate(90deg)}
.watch-full-info{bottom:90px;font-size:14px;line-height:20px;right:65px}
.watch-summary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:20px;width:100%;margin-bottom:8px;font-size:14px}
.watch-episode-line{display:flex;align-items:center;gap:10px;min-height:24px}.watch-stage-info .watch-episode-trigger{text-decoration:underline;font-size:13px;min-height:24px}
.watch-access{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;line-height:17px;text-shadow:none}
.watch-access.is-free{color:#6aeba5;background:#163e2d;border-radius:3px;padding:1px 4px}.watch-access.is-owned{color:#ddd;font-weight:400}.watch-access.is-paid{color:#ffdc59;font-size:16px;font-weight:800}
.pd-reel-player .pd-player-controls{display:block!important;inset:auto 0 0;height:20px;padding:0;background:none;opacity:1!important;pointer-events:auto!important;transform:none!important}
.pd-reel-player .pd-player-buttons,.pd-reel-player .pd-player-mini-tools,.pd-reel-player .pd-player-time{display:none}
.pd-reel-player .pd-player-seek{margin:0;min-height:20px;height:20px;touch-action:pan-x}
.pd-reel-player input[type=range]{height:20px;min-height:20px;border-radius:0;background:linear-gradient(to right,#fff var(--played,0%),#ffffff55 var(--played,0%)) center bottom 1px/100% 2px no-repeat}
.pd-reel-player input[type=range]::-webkit-slider-thumb{width:0;height:0;box-shadow:none}.pd-reel-player input[type=range]::-moz-range-thumb{width:0;height:0;border:0}
.pd-reel-player.pd-is-seeking input[type=range]::-webkit-slider-thumb,.pd-reel-player input[type=range]:focus-visible::-webkit-slider-thumb{width:8px;height:12px;border-radius:8px;background:#fff}
.pd-reel-player.pd-is-seeking .pd-player-time{display:flex;justify-content:center;gap:4px;position:absolute;bottom:30px;left:0;right:0;font-size:20px;line-height:24px}
.pd-reel-player.pd-is-seeking .watch-stage-info,.pd-reel-player.pd-is-seeking .watch-stage-rail{opacity:0;pointer-events:none}
.pd-reel-player .pd-player-time span+span::before{content:'/';padding-right:4px}
.pd-reel-player .pd-player-end{background:none;backdrop-filter:none;padding:0;pointer-events:none}.pd-reel-player .pd-player-end .pd-feed-replay{pointer-events:auto}
.pd-immersive .pd-player-center,.pd-feed-replay{width:64px;height:64px;border:0;background:none;box-shadow:none;backdrop-filter:none;color:#fffc;padding:6px;display:grid;place-items:center}
.pd-immersive .pd-player-center svg,.pd-feed-replay svg{width:45px;height:45px;filter:drop-shadow(0 1px 2px #0005)}
.pd-reel-player .pd-player-state{background:#0007}.pd-reel-player .pd-player-notice{top:60px;font-size:11px}
.pd-reel-player .pd-player-stage::before{content:'';position:absolute;inset:65% 0 0;z-index:1;background:linear-gradient(transparent,#000a);pointer-events:none}
.pd-immersive .pd-player-sheet{background:#242426;border-color:#363638;border-radius:16px 16px 0 0}
.pd-immersive .pd-player-sheet-heading h2{font-size:16px;font-weight:500;line-height:22px}
.pd-immersive .pd-player-sheet-heading,.pd-immersive .pd-player-sheet-content{padding-inline:15px}
.pd-immersive .pd-player-setting{font-size:14px}.pd-immersive .pd-player-setting select{background:#363638;border-color:#48484a}
.pd-immersive .pd-player-episodes .episode-cell{min-height:48px;padding:6px 4px;gap:3px;border:1px solid transparent;background:#363638;border-radius:8px;color:#fff;box-shadow:none}
.pd-immersive .pd-player-episodes .episode-cell>span{font-size:14px;font-weight:400}
.pd-immersive .pd-player-episodes .episode-cell>small{min-height:15px;line-height:15px;font-size:11px}
.pd-immersive .pd-player-episodes .episode-cell>small.episode-cost{font-size:13px;gap:3px;color:#ffdc59}
.pd-immersive .pd-player-episodes .episode-cell>small.episode-free{border:0;border-radius:3px;padding:0 4px;font-size:9px}
.pd-immersive .pd-player-episodes .episode-cell.selected{border-color:#f43574;box-shadow:none}
@media(min-width:769px){.immersive-watch .watch-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,320px)}.immersive-watch .watch-episodes{display:block!important}}
@media(max-width:900px){
.viewer-app .mobile-nav{height:calc(50px + env(safe-area-inset-bottom));min-height:0;box-sizing:border-box;padding:0 0 env(safe-area-inset-bottom);grid-template-columns:repeat(4,minmax(0,1fr));background:#0c0c0e;border-top:1px solid #242426}
.viewer-app .mobile-nav a{min-width:0;gap:2px;padding:5px 2px;color:#96969b}.viewer-app .mobile-nav a.active{color:#fff}.viewer-app .mobile-nav svg{width:22px;height:22px}.viewer-app .mobile-nav span{font-size:10px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.viewer-app .mobile-nav a.active[href="#/for-you"] svg path{fill:#fff;fill-rule:evenodd}
}
@media(max-width:768px),(max-width:1024px) and (max-height:500px) and (orientation:landscape){
body.viewer-immersive{height:100dvh;overflow:hidden;padding:0!important;background:#000}
.viewer-immersive #app{height:100dvh;min-height:0;padding:0;overflow:hidden}
.viewer-immersive .viewer-header,.viewer-immersive .viewer-footer,.viewer-immersive .prototype-label{display:none!important}
.viewer-immersive:not(.reels-view) .mobile-nav{display:none}
.immersive-watch{width:100%;max-width:none;height:100dvh;padding:0!important;margin:0!important}
.immersive-watch .watch-layout{display:block;height:100%;padding:0;margin:0}
.immersive-watch .watch-main,.immersive-watch .pd-player{height:100%}
.immersive-watch .watch-heading,.immersive-watch .watch-next,.immersive-watch .watch-trial-banner,.immersive-watch .watch-episodes,.immersive-watch .watch-main>.ad-host,.immersive-watch .pd-player-mobile-actions,.immersive-watch .pd-player-brand{display:none!important}
.immersive-watch .pd-player-stage{height:100%;width:100%;max-height:none;min-height:0;aspect-ratio:auto;border:0;border-radius:0;touch-action:pan-x pinch-zoom}
.immersive-watch .watch-stage-top,.immersive-watch .watch-stage-rail{display:flex}.immersive-watch .watch-stage-info{display:block}
.immersive-watch .pd-controls-hidden .watch-stage-top,.immersive-watch .pd-controls-hidden .watch-stage-rail,.immersive-watch .pd-controls-hidden .watch-stage-info{opacity:0;visibility:hidden;pointer-events:none}
.immersive-watch .watch-stage-top,.immersive-watch .watch-stage-rail,.immersive-watch .watch-stage-info{transition:opacity .15s}
.viewer-immersive .watch-stage-top{padding-top:env(safe-area-inset-top)}
.viewer-immersive .pd-player-sheet{max-height:min(78dvh,700px);padding-bottom:env(safe-area-inset-bottom)}
.viewer-immersive .pd-player-episodes .episode-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.viewer-immersive .pd-player-episodes .episode-cell{min-height:50px;background:#363638;border-radius:8px}
.immersive-watch .pd-player-controls{height:calc(54px + env(safe-area-inset-bottom));padding:0;background:#202022cc}
.immersive-watch .pd-player-seek{position:absolute;inset:0 0 auto;margin:0;height:16px;min-height:16px;touch-action:pan-x}
.immersive-watch input[type=range]{height:16px;min-height:16px;background:linear-gradient(to right,#fff var(--played,0%),#ffffff55 var(--played,0%)) center/100% 2px no-repeat}
.immersive-watch input[type=range]::-webkit-slider-thumb{width:6px;height:10px;box-shadow:none;border-radius:6px}
.immersive-watch .pd-player-time{position:absolute;left:15px;top:27px;gap:0;font-size:11px;color:#b6b6bc;padding:0;justify-content:flex-start}
.immersive-watch .pd-player-time span+span::before{content:'/';padding:0 3px}
.immersive-watch .pd-player-buttons{display:none}
.immersive-watch .pd-player-mini-tools{display:flex;gap:8px;position:absolute;right:15px;top:18px}
.pd-player-mini-tools button{height:24px;min-width:40px;border:0;border-radius:15px;padding:0 10px;background:#333;color:#b6b6bc;display:flex;align-items:center;justify-content:center;font-size:11px}
.pd-player-mini-tools button svg{width:14px;height:14px}
.reels-page{height:calc(100dvh - 50px - env(safe-area-inset-bottom));flex:none;padding:0;width:100%;margin:0;display:block}
.reels-scroller{width:100%;max-width:none;border-radius:0}
.reels-view .mobile-nav{display:grid!important;left:0;transform:none;width:100%;max-width:none}.reels-paging{display:none}.reels-empty{display:flex;padding:28px}
}
@media(max-width:360px){.watch-stage-info{right:58px}.watch-stage-info h1{font-size:16px}.watch-stage-rail{right:7px}.watch-stage-rail span{font-size:11px}.watch-stage-count{padding:0 4px}.watch-stage-title{font-size:13px}}
@media(max-width:1024px) and (max-height:500px) and (orientation:landscape){.watch-stage-info{max-width:62%;bottom:20px}.watch-feed-summary,.watch-more,.watch-feed-tags{display:none!important}.watch-full-info{bottom:70px}.watch-stage-rail{bottom:50px;gap:5px}.watch-stage-rail button{min-height:44px}.watch-stage-rail span{display:none}.watch-stage-top{height:44px}.watch-stage-info h1{font-size:16px;margin:0}}
@media(prefers-reduced-motion:reduce){.watch-stage-top,.watch-stage-rail,.watch-stage-info{transition:none!important}.reels-scroller{scroll-behavior:auto}}

/* The desktop feed keeps the site navigation and places story controls beside the video. */
.reels-story-panel{display:none}
@media(min-width:769px) and (max-width:1099px) and (min-height:501px){
 .reels-view .viewer-header{display:block!important}
 .reels-view .viewer-nav{display:none}
 .reels-view .mobile-nav{display:grid!important;left:0;transform:none;width:100%;max-width:none}
 .reels-page{padding:16px 64px 0}
}
@media(min-width:1100px){
 .reels-view .viewer-header{display:block!important;position:relative;flex-shrink:0}
 .reels-view .mobile-nav{display:none!important}
 .reels-page{--feed-height:min(780px,calc(100dvh - 128px));padding:24px 32px;margin-bottom:0;gap:24px;align-items:center}
 .reels-scroller{flex:none;width:calc(var(--feed-height) * .5625);height:var(--feed-height);max-width:42vw;border-radius:12px}
 .reels-paging{position:static;left:auto;top:auto;transform:none;flex:none}
 .reels-story-panel{display:block;flex:0 1 340px;max-width:340px;max-height:var(--feed-height);overflow:auto;padding:20px 0;color:#f5f5f5}
 .reels-panel-kicker{font-size:12px;color:#aaa;letter-spacing:.08em}
 .reels-story-panel h1{font-size:26px;line-height:1.3;margin:12px 0 18px;overflow-wrap:anywhere}
 .reels-panel-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13px;color:#b5b5bd}
 .reels-panel-description{font-size:14px;line-height:1.7;color:#c3c3cb;margin:20px 0;white-space:pre-line;overflow-wrap:anywhere}
 .reels-panel-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.reels-panel-tags span{border:1px solid #37373b;border-radius:5px;font-size:12px;padding:4px 7px;color:#b5b5bd}
 .reels-open-story{width:100%;min-height:44px;justify-content:center}
 .reels-panel-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.reels-panel-actions .btn{min-height:44px;justify-content:center;border-color:#38383d;background:#19191c;color:#eee}
 .reels-page .watch-stage-rail,.reels-page .watch-stage-info{display:none!important}
 .reels-empty{padding:32px}.reels-empty>div{max-width:480px}
}

.reels-panel-meta .episode-free{color:#63db94;font-weight:600}.reels-panel-meta .episode-cost{display:inline-flex;align-items:center;gap:4px;color:#f6c552;font-weight:700}
