
:root{--paper:#f7f6f2;--ink:#20241f;--muted:#8a8d82;--line:#e5e6de;--accent:#ea623b;--soft:#eeeee6;--card:#fff;--nav:rgba(247,246,242,.96)}*{box-sizing:border-box}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{border:0;background:none;color:inherit;cursor:pointer;padding:0}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}body{margin:0;background:#dedfd7;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:14px}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}img{-webkit-user-drag:none;user-select:none;display:block;width:100%;height:100%;object-fit:cover}h1,h2,h3,p{margin:0}#phone{max-width:440px;height:100dvh;min-height:0;margin:auto;background:var(--paper);position:relative;overflow:hidden;box-shadow:0 0 80px #27332812}#main{position:absolute;inset:0;overflow:auto;overscroll-behavior-y:contain;padding-bottom:100px;scrollbar-width:none}#main.has-mini{padding-bottom:174px}header{padding:23px 23px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:9px;font-size:25px;font-weight:800;letter-spacing:-1.4px}.brand-mark{width:25px;height:28px;background:var(--accent);border-radius:7px;display:grid;place-items:center;transform:rotate(-6deg)}.brand-mark svg{width:15px;height:15px;fill:var(--paper);stroke:var(--paper);transform:rotate(6deg)}.icon-btn{display:grid;place-items:center;width:39px;height:39px;border-radius:50%}.icon-btn:hover{background:var(--soft)}.head-actions{display:flex;align-items:center;gap:2px}.avatar{background:#e4e8dc;color:#6d765f;width:32px;height:32px;border-radius:50%;font-size:12px;font-weight:700}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--muted)}.intro{padding:17px 24px 19px}.intro h1{font-size:29px;letter-spacing:-1.6px;font-weight:650;line-height:1.4;margin:7px 0}.intro h1 em{font-style:normal;color:var(--accent)}.intro p{color:var(--muted);font-size:12px;letter-spacing:-.3px}.chips{display:flex;gap:7px;padding:0 24px 22px;overflow:auto;scrollbar-width:none}.chip{white-space:nowrap;border:1px solid var(--line);border-radius:30px;padding:9px 15px;font-size:12px;color:#74796b}.chip.active{color:white;background:var(--ink);border-color:var(--ink)}.hero{margin:0 24px 25px;position:relative;height:258px;border-radius:19px;overflow:hidden;text-align:left;width:calc(100% - 48px);color:white;background:#798575}.hero img{transition:transform .5s}@media(hover:hover) and (pointer:fine){.hero:hover img{transform:scale(1.03)}}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#111c1ad9,transparent 80%)}.hero-top{position:absolute;top:17px;left:17px;z-index:1;border:1px solid #ffffff66;background:#ffffff20;backdrop-filter:blur(8px);border-radius:20px;padding:6px 10px;font-size:9px;letter-spacing:1px}.hero-copy{position:absolute;bottom:22px;left:21px;right:20px;z-index:1}.hero-copy .eyebrow{color:#ffffffb5;font-size:9px}.hero-copy h2{font-size:25px;line-height:1.3;letter-spacing:-1px;margin:9px 0}.hero-bottom{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#ffffffad}.play-disc{width:36px;height:36px;border-radius:50%;background:white;color:#283b30;display:grid;place-items:center}.play-disc svg{width:14px;height:14px;fill:currentColor}.section-head{display:flex;align-items:center;justify-content:space-between;margin:0 24px 13px}.section-head h2{font-size:17px;letter-spacing:-.7px}.text-btn{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:3px}.text-btn svg{width:13px;height:13px}.horizontal{display:flex;gap:13px;padding:0 24px 26px;overflow:auto;scrollbar-width:none}.small-card{width:185px;flex:none;text-align:left}.thumb{position:relative;overflow:hidden;border-radius:12px;background:#d8ddd4;aspect-ratio:16/9}.duration{position:absolute;right:7px;bottom:7px;background:#0b171bc7;color:#fff;border-radius:4px;font-size:9px;padding:3px 5px;font-variant-numeric:tabular-nums}.progress-line{position:absolute;bottom:0;height:3px;background:var(--accent);left:0}.small-card h3{font-size:12px;margin-top:10px;font-weight:650;line-height:1.5;letter-spacing:-.4px}.meta{font-size:10px;color:var(--muted);margin-top:5px}.cards{padding:0 24px}.wide-card{margin-bottom:23px}.wide-card .thumb{border-radius:14px;width:100%}.card-info{display:flex;gap:10px;margin-top:11px;align-items:flex-start}.channel{border-radius:50%;width:30px;height:30px;background:#e2e6d9;color:#70785e;display:grid;place-items:center;font-size:10px;flex:none}.card-info h3{font-size:13px;line-height:1.55;letter-spacing:-.4px;font-weight:650}.card-info .icon-btn{margin-left:auto;width:25px;height:25px}.card-info .icon-btn svg{width:17px}.card-copy{flex:1;text-align:left}.footer-note{margin:22px 24px;text-align:center;font-size:10px;color:#a3a79c;line-height:1.8}nav{position:absolute;bottom:0;left:0;right:0;height:calc(73px + env(safe-area-inset-bottom));padding:11px 25px calc(12px + env(safe-area-inset-bottom));display:flex;justify-content:space-around;background:var(--nav);backdrop-filter:blur(20px);border-top:1px solid var(--line);z-index:15}nav button{color:#9a9e92;display:flex;align-items:center;flex-direction:column;gap:6px;min-width:58px;font-size:9px}nav button.active{color:var(--ink)}nav button.active:before{content:'';width:4px;height:4px;background:var(--accent);position:absolute;top:5px;border-radius:50%}.page-title{font-size:23px;letter-spacing:-1px;font-weight:700}.searchbox{margin:12px 24px 24px;display:flex;align-items:center;border-bottom:2px solid var(--ink);gap:11px;padding:13px 0}.searchbox input{background:none;border:0;outline:none;width:100%;font-size:18px;letter-spacing:-.7px;color:var(--ink)}.searchbox input::placeholder{color:#a3a699}.searchbox svg{width:20px}.list{padding:0 24px}.list-item{display:flex;align-items:center;gap:13px;margin-bottom:17px;text-align:left;width:100%}.list-item .thumb{width:124px;flex:none}.list-item h3{font-size:12px;line-height:1.55;letter-spacing:-.3px}.list-item .meta{font-size:9px}.list-item .copy{flex:1}.label{font-size:10px;color:var(--muted);padding:0 24px;margin-bottom:16px}.suggestions{margin:0 24px 26px;display:flex;gap:8px;flex-wrap:wrap}.suggestions button{background:var(--soft);border-radius:7px;padding:10px 13px;font-size:12px}.empty{padding:50px 24px;text-align:center;color:var(--muted);line-height:2}.collection{display:flex;align-items:center;gap:14px;padding:15px;background:var(--card);border:1px solid var(--line);border-radius:13px;margin-bottom:11px;text-align:left;width:100%}.collection .tile{display:grid;place-items:center;width:49px;height:49px;background:#f4e7df;border-radius:10px;color:var(--accent)}.collection h3{font-size:13px}.collection>svg{margin-left:auto;width:16px;color:var(--muted)}.library-intro{margin:10px 24px 25px;display:flex;align-items:center;gap:14px}.library-intro .avatar{width:48px;height:48px;font-size:17px}.library-intro h2{font-size:20px;letter-spacing:-.7px}.divider{height:1px;background:var(--line);margin:22px 24px}.watch-page{padding-top:0}.watch-content{padding:22px 24px}.watch-content .eyebrow{color:var(--accent)}.watch-content h1{font-size:22px;letter-spacing:-1px;line-height:1.5;margin:9px 0}.creator-row{display:flex;align-items:center;gap:10px;margin:21px 0}.creator-row .channel{width:36px;height:36px}.creator-row h3{font-size:12px}.follow{margin-left:auto;background:var(--ink);color:var(--paper);border-radius:24px;padding:9px 16px;font-size:11px}.follow.on{background:var(--soft);color:var(--ink)}.action-row{display:flex;gap:7px;overflow:auto;margin-bottom:20px}.action-row button{display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:22px;padding:10px 13px;white-space:nowrap;font-size:10px}.action-row svg{width:15px;height:15px}.action-row button.on{border-color:var(--accent);color:var(--accent)}.description{padding:16px;background:var(--soft);border-radius:12px;color:#777d70;font-size:11px;line-height:1.9}.description strong{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}.chapter{display:flex;gap:13px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;text-align:left;width:100%}.chapter span:first-child{color:var(--accent);font-size:10px;font-variant-numeric:tabular-nums}.preview-tag{font-size:9px;border:1px solid var(--line);padding:5px 7px;border-radius:5px;color:var(--muted)}#player{display:none;position:absolute;left:0;right:0;top:0;z-index:25;background:#131a16;color:white;overflow:hidden;touch-action:none}#player.watch{display:block;top:64px;aspect-ratio:16/10}#player.full{display:block;inset:0;z-index:40;height:100%;aspect-ratio:auto;background:#101610}#player.mini{display:flex;top:auto;bottom:calc(81px + env(safe-area-inset-bottom));left:12px;right:12px;height:62px;border-radius:12px;background:var(--ink);box-shadow:0 5px 22px #18201125;padding:7px;align-items:center;gap:10px;touch-action:none;cursor:pointer}#player.mini #scene{width:80px;height:48px;border-radius:7px;position:static;flex:none}#scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#player.full #scene{object-fit:contain}.player-scrim{position:absolute;inset:0;background:linear-gradient(#0006,transparent 40%,#0008)}.player-top{position:absolute;top:13px;left:13px;right:13px;display:flex;justify-content:space-between;align-items:center}.player-top .icon-btn{width:30px;height:30px;background:#0002}.player-caption{font-size:9px;letter-spacing:1px;color:#ffffffa8}.player-center{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:flex;justify-content:center;align-items:center;gap:36px}.player-center button{width:39px;height:39px;display:grid;place-items:center;position:relative}.player-center button svg{width:30px;height:30px}.player-center .big-play{background:#ffffffed;color:#27342b;border-radius:50%;width:53px;height:53px}.player-center .big-play svg{width:23px;height:23px}.ten{font-size:9px;font-weight:600;position:absolute;top:15px;left:13px}.player-bottom{position:absolute;bottom:13px;left:17px;right:17px}.time-row{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-bottom:8px;font-variant-numeric:tabular-nums}.time-row .right{display:flex;align-items:center;gap:13px}.time-row button{font-size:10px}.time-row svg{width:17px;height:17px}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:3px;background:#ffffff55;border-radius:5px;display:block;accent-color:var(--accent)}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;background:var(--accent);border-radius:50%}#player.full .player-top{top:calc(20px + env(safe-area-inset-top));left:22px;right:22px}#player.full .player-bottom{bottom:calc(50px + env(safe-area-inset-bottom));left:25px;right:25px}#player.full .player-center{gap:58px}#player.full .player-caption{font-size:10px}.swipe-hint{display:none;position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:9px;color:#ffffff66;letter-spacing:.4px}#player.full .swipe-hint{display:block}.mini-info,.mini-buttons{display:none}#player.mini .player-scrim,#player.mini .player-top,#player.mini .player-center,#player.mini .player-bottom,#player.mini .swipe-hint{display:none}#player.mini .mini-info{display:block;min-width:0;flex:1}.mini-info h3{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-info p{color:#bac2b6;font-size:9px;margin-top:5px}#player.mini .mini-buttons{display:flex;gap:9px;padding-right:6px}.mini-buttons button{width:24px;height:30px;display:grid;place-items:center}.mini-buttons svg{width:18px}.player-ui{transition:opacity .2s}#player.hide-controls:not(.mini) .player-ui{opacity:0;pointer-events:none}#seek-flash{position:absolute;top:50%;transform:translateY(-50%);background:#0006;border-radius:50%;width:95px;height:95px;display:none;place-items:center;font-size:16px;font-weight:600;pointer-events:none}#seek-flash.left{left:12px}#seek-flash.right{right:12px}#caption{position:absolute;bottom:70px;left:10%;right:10%;font-size:12px;text-align:center;display:none}#caption span{background:#0009;padding:4px 8px}#sheet-backdrop{display:none;position:absolute;inset:0;background:#15201766;z-index:60;backdrop-filter:blur(3px)}#sheet-backdrop.open{display:flex;align-items:flex-end}#sheet{background:var(--paper);color:var(--ink);width:100%;padding:11px 24px calc(26px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;max-height:80%;overflow:auto;animation:rise .2s ease}.handle{width:32px;height:4px;background:#d6d9d0;margin:0 auto 22px;border-radius:5px}.sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.sheet-head h2{font-size:19px;letter-spacing:-.8px}.sheet-option{display:flex;width:100%;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line);font-size:13px}.sheet-option.selected{color:var(--accent)}.sheet-option svg{width:17px}.sheet-copy{color:var(--muted);font-size:12px;line-height:1.9}.toggle{width:34px;height:21px;border-radius:20px;background:var(--accent);position:relative}.toggle:after{content:'';position:absolute;width:15px;height:15px;border-radius:50%;background:white;top:3px;right:3px}#toast{position:absolute;bottom:calc(155px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,10px);background:#243025ed;color:white;padding:12px 18px;border-radius:24px;font-size:11px;white-space:nowrap;z-index:80;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}.sim-label{background:#fff2;border:1px solid #fff3;border-radius:4px;font-size:8px;letter-spacing:.5px;padding:3px 5px;color:#fffc}.watch-spacer{aspect-ratio:16/10}.view-all{border-bottom:1px solid var(--line)}@keyframes rise{from{transform:translateY(100%)}to{transform:translateY(0)}}@media(min-width:600px) and (hover:hover) and (pointer:fine){body{padding:22px 0}#phone{height:calc(100dvh - 44px);border-radius:29px;border:1px solid #cdd1c5}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Expanded playback uses the viewport, not the phone preview frame. */
body.player-expanded{padding:0;overflow:hidden;background:#101610}
#phone.player-expanded{position:fixed;inset:0;width:100%;max-width:none;height:100vh;height:100dvh;min-height:0;margin:0;border:0;border-radius:0;box-shadow:none}
#phone.player-expanded #player.full{inset:0;width:100%;height:100%;border-radius:0}
#phone.player-expanded .player-top{top:calc(16px + env(safe-area-inset-top));left:calc(18px + env(safe-area-inset-left));right:calc(18px + env(safe-area-inset-right))}
#phone.player-expanded .player-bottom{left:calc(24px + env(safe-area-inset-left));right:calc(24px + env(safe-area-inset-right));bottom:calc(44px + env(safe-area-inset-bottom))}
#phone.player-expanded .swipe-hint{bottom:calc(15px + env(safe-area-inset-bottom))}
#phone.player-expanded #sheet{max-width:540px;margin:0 auto}
@media(orientation:landscape){
 #phone.player-expanded .player-top{top:calc(10px + env(safe-area-inset-top))}
 #phone.player-expanded .player-bottom{bottom:calc(16px + env(safe-area-inset-bottom))}
 #phone.player-expanded .swipe-hint{display:none}
 #phone.player-expanded .player-center{gap:56px}
 #phone.player-expanded #caption{bottom:calc(70px + env(safe-area-inset-bottom))}
}

/* Live application states. */
header{padding-top:calc(17px + env(safe-area-inset-top))}.watch-header{height:64px;padding:12px 18px}#player.watch{top:64px;aspect-ratio:16/9}.watch-spacer{aspect-ratio:16/9}#scene{object-fit:contain;background:#0e140f}#player.watch #scene{object-fit:contain}.top-note{margin:0 24px 20px;color:var(--muted);font-size:11px;line-height:1.8}.empty-state{margin:18px 24px;padding:30px 20px;border:1px dashed #d2d7cb;border-radius:18px;text-align:center;line-height:1.9;color:var(--muted)}.empty-state h2{color:var(--ink);font-size:19px;margin:12px 0 7px;letter-spacing:-.8px}.empty-state svg{width:32px;height:32px;color:var(--accent)}.primary{background:var(--ink);color:var(--paper);padding:12px 18px;border-radius:24px;font-size:12px;display:inline-flex;align-items:center;gap:7px;justify-content:center}.primary.accent{background:var(--accent);color:white}.outline{border:1px solid var(--line);border-radius:22px;padding:11px 16px;font-size:12px}.empty-state .primary{margin-top:17px}.error-box{padding:16px;margin:14px 24px;border:1px solid #e7b9a9;border-radius:12px;color:#af4c2e;font-size:12px;line-height:1.8}.error-box button{margin-top:8px;text-decoration:underline}.load-more{display:block;margin:12px auto 24px}.spinner{display:inline-block;width:22px;height:22px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.loading-page{padding:70px;text-align:center;color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}.input-field{width:100%;padding:13px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;font-size:14px;margin:12px 0;outline-color:var(--accent)}.sheet-form{margin-top:12px}.sheet-form label{font-size:12px}.sheet-form button[type=submit]{width:100%}.sheet-error{color:#b84629;line-height:1.7;font-size:12px}.channel-row{display:flex;align-items:center;gap:12px;margin:0 24px;padding:16px 0;border-bottom:1px solid var(--line)}.channel-avatar{width:46px;height:46px;border-radius:50%;overflow:hidden;background:var(--soft);display:grid;place-items:center;flex:none}.channel-avatar img{object-fit:cover}.channel-row .copy{flex:1;min-width:0}.channel-row h3{font-size:13px;line-height:1.5}.channel-row .meta{line-height:1.7}.row-controls{display:flex;align-items:center;gap:5px}.row-controls .icon-btn{width:30px;height:34px}.row-controls svg{width:17px}.playlist-row{position:relative;padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:13px}.playlist-row .list-item{margin:0}.playlist-row .row-controls{justify-content:flex-end;margin-top:5px}.playlist-row.dragging{opacity:.45}.playlist-row.drag-target{border-top:2px solid var(--accent)}.list-item .copy{min-width:0}.collection .tile img{border-radius:9px}.count-label{font-size:10px;color:var(--muted)}.tabs{display:flex;gap:7px;margin:0 24px 22px}.tabs button{padding:9px 18px;border-radius:20px;border:1px solid var(--line);font-size:12px}.tabs .active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.result-channel{display:flex;align-items:center;gap:12px;margin-bottom:19px}.result-channel .copy{flex:1}.result-channel h3{font-size:13px}.result-channel button{font-size:11px}.list .empty-state{margin:10px 0}.watch-content h1{font-size:20px}.description{white-space:pre-line;max-height:210px;overflow:auto}.watch-content .action-row{margin-top:17px}.resume-choice{background:#f2e9df;border-radius:10px;padding:13px;font-size:11px;display:flex;gap:8px;justify-content:space-between;align-items:center;margin:15px 0}.resume-choice button{color:var(--accent);white-space:nowrap}.status-pill{font-size:9px;color:white;background:#ffffff22;padding:4px 8px;border-radius:5px}.player-loader{position:absolute;inset:0;z-index:4;display:none;align-items:center;justify-content:center;flex-direction:column;gap:10px;background:#07120dc9;text-align:center;padding:25px}.player-loader.show{display:flex}.player-loader p{font-size:12px;line-height:1.65;max-width:330px}.player-loader .elapsed{font-size:10px;color:#b4bfb6}.player-loader .buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:4px}.player-loader button{font-size:11px;border:1px solid #ffffff55;color:white;padding:8px 12px;border-radius:20px}.player-loader .primary{background:var(--accent);border-color:var(--accent)}#player.watch .player-loader{gap:7px;padding:20px}#player.watch .player-loader .spinner{width:20px;height:20px}#player.mini .player-loader{display:none}.player-top{z-index:5}.player-center,.player-bottom{z-index:3}#player.busy .player-center,#player.busy .player-bottom{visibility:hidden}#player.mini .mini-info p.error{color:#ffc5ab}.player-loader .error-icon{font-size:25px;line-height:1}.watch-meta{line-height:1.8}#player.full .player-top{top:calc(16px + env(safe-area-inset-top))}#phone.player-expanded .player-top{left:calc(15px + env(safe-area-inset-left));right:calc(15px + env(safe-area-inset-right))}.player-top .icon-btn{min-width:36px;min-height:36px}.time-row .right button{min-width:30px;min-height:30px}#seek{height:5px}#seek::-webkit-slider-thumb{width:15px;height:15px}.player-center button{width:44px;height:44px}.player-center .ten{top:17px;left:15px}.time-row .right{gap:6px}.channel-pills{display:flex;gap:8px;overflow:auto;padding:0 24px 17px;scrollbar-width:none}.channel-pills button{font-size:11px;padding:8px 12px;background:var(--soft);border-radius:20px;white-space:nowrap}.channel-pills button.active{background:var(--ink);color:var(--paper)}.feed-date{font-size:10px;color:var(--muted)}.action-row button svg{pointer-events:none}.offline-note{padding:9px 24px;background:#f7e0d2;font-size:11px;color:#a14e2d}.muted{color:var(--muted)}.move-handle{cursor:grab;touch-action:none;color:var(--muted)}.drop-marker{outline:2px solid var(--accent)}#player.mini .mini-buttons button{min-width:28px}.sheet-head .icon-btn{flex:none}button:disabled{opacity:.45;cursor:wait}.safe-top{padding-top:env(safe-area-inset-top)}.full-width{width:100%}.progress-line{max-width:100%}#phone.player-expanded #sheet-backdrop{z-index:60}#phone.player-expanded #toast{bottom:35px}.main-header-actions{display:flex;gap:4px}.watch-header{padding-top:12px}

.discovery-heading{display:flex;justify-content:space-between;align-items:center;margin:12px 24px 20px}.region-badge{font-size:10px;border:1px solid var(--line);padding:6px 10px;border-radius:20px;color:var(--muted)}.discovery-tabs{padding-bottom:24px}.discovery-list{padding:0 20px}.discovery-card{display:flex;align-items:center;gap:9px;padding:14px 0;border-bottom:1px solid var(--line)}.discovery-rank{width:25px;flex:none;text-align:center;font-size:19px;color:var(--accent);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-1px}.discovery-open{display:flex;align-items:center;gap:11px;flex:1;text-align:left;min-width:0}.discovery-open .thumb{width:106px;flex:none;border-radius:9px}.discovery-open .copy{min-width:0;flex:1}.discovery-open h3{font-size:12px;line-height:1.5;letter-spacing:-.35px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.discovery-open .meta{display:block;font-size:9px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.discovery-card>.icon-btn{width:23px;flex:none}.discovery-card>.icon-btn svg{width:17px}.discovery-list .duration{font-size:8px;padding:2px 4px;bottom:5px;right:5px}

/* Device-aware light/dark surfaces and unified browser chrome. */
:root{--backdrop:#e4e5df;--mini-bg:#20241f}
:root[data-theme="dark"]{--paper:#101114;--ink:#f0f1f3;--muted:#a0a3ad;--line:#2a2c33;--accent:#ff805a;--soft:#1c1e24;--card:#17191e;--nav:rgba(16,17,20,.97);--backdrop:#07080a;--mini-bg:#22252c;color-scheme:dark}
:root[data-theme="light"]{color-scheme:light}
html,body{background:var(--paper)}
html[data-player-expanded="true"],body.player-expanded{background:#000}
#phone{border-color:var(--line)}
.chip{color:var(--muted)}.chip.active{color:var(--paper)}
.channel,.collection .tile,.avatar{background:var(--soft);color:var(--muted)}
.thumb{background:var(--soft)}.description{color:var(--muted)}.handle{background:var(--line)}
.empty-state{border-color:var(--line)}.footer-note,nav button{color:var(--muted)}
.searchbox input::placeholder{color:var(--muted)}
#player,#player.full,#scene{background:#000;color:#fff}
#player.mini{background:var(--mini-bg);color:#fff}
#player .icon-btn:hover{background:#ffffff20}
.player-center .big-play{background:#fffffff0;color:#181a1e}
.player-loader{background:#000b}
.history-item{position:relative;display:flex;gap:8px;align-items:center;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.history-item .list-item{margin:0;flex:1;min-width:0}.history-item .icon-btn{flex:none;width:36px;height:44px;color:var(--muted)}
.history-item .list-item .thumb{width:116px}.history-item .copy{min-width:0}.history-item h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.search-cards .wide-card{margin-bottom:27px}.search-cards .card-info h3{font-size:14px;line-height:1.55}
:root[data-theme="dark"] .error-box{border-color:#70402e;color:#ffad94}
@media(min-width:600px) and (hover:hover) and (pointer:fine){body{background:var(--backdrop)}body.player-expanded{background:#000}}

/* The watch details scroll only below the opaque, persistent player and header. */
#watch-chrome{position:absolute;inset:0 0 auto;height:calc(64px + env(safe-area-inset-top));background:var(--paper);z-index:19}
#watch-chrome[hidden]{display:none}
#watch-chrome .watch-header{height:100%;padding-top:calc(12px + env(safe-area-inset-top));background:var(--paper)}
#player.watch{top:calc(64px + env(safe-area-inset-top))}
#main.watch-page{top:calc(64px + env(safe-area-inset-top) + var(--watch-video-height,247.5px));background:var(--paper)}
.video-story{margin-top:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.video-story summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;padding:14px 0;font-size:12px;font-weight:600;color:var(--ink)}
.video-story summary::-webkit-details-marker{display:none}.video-story summary span{margin-left:auto;font-size:10px;color:var(--muted);font-weight:400}.video-story summary svg{width:17px;height:17px;transition:transform .15s}.video-story[open] summary svg{transform:rotate(180deg)}
.video-story .description{margin:0 0 14px;padding:0;background:none;border:0;max-height:none;overflow:visible;font-size:12px;line-height:1.9}
.reveal-header{position:sticky;top:0;z-index:6;background:var(--paper);transform:translateY(calc(-100% - 1px));transition:transform .18s ease;border-bottom:1px solid transparent}
.header-revealed .reveal-header{transform:translateY(0);border-bottom-color:var(--line)}
.search-header{padding:6px 0}.search-header .searchbox{margin:0 24px;padding:7px 0;gap:8px}.search-header .searchbox input{min-width:0;font-size:17px}.search-header .icon-btn{width:36px;height:40px;flex:none}.search-header .icon-btn svg{width:18px;height:18px}#clear-search{color:var(--muted)}#clear-search[hidden]{display:none}#search-results{padding-top:8px}.search-header+.tabs{margin-top:15px;margin-bottom:20px}
.autoplay-control{display:inline-flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;font-size:11px;color:var(--ink)}
.switch-track{position:relative;display:inline-block;width:32px;height:18px;border-radius:12px;background:var(--muted);flex:none;transition:background .15s}
.switch-track:after{content:'';position:absolute;left:3px;top:3px;width:12px;height:12px;border-radius:50%;background:#fff;transition:transform .15s}
.autoplay-control[aria-checked="true"] .switch-track{background:var(--accent)}.autoplay-control[aria-checked="true"] .switch-track:after{transform:translateX(14px)}
#sheet>.autoplay-control{width:100%;padding:16px 0;border-bottom:1px solid var(--line);font-size:13px}
#player .autoplay-control{color:#fff;padding:0;min-width:40px;min-height:36px;justify-content:center}
.up-next-head{gap:8px}.up-next-head h2{font-size:16px}.up-next-head .autoplay-control{white-space:nowrap}
.player-loader.recovery{background:none;pointer-events:none;padding:0!important;gap:0!important}.player-loader.recovery .spinner{width:24px;height:24px;filter:drop-shadow(0 1px 3px #000);color:white}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){.reveal-header,.switch-track,.switch-track:after{transition:none}}
#previous-video:disabled,#next-video:disabled{cursor:default;opacity:.35}
nav{padding-left:12px;padding-right:12px}nav button{min-width:48px}
.nas-intro{margin-top:26px}.nas-location{display:flex;align-items:center;gap:7px;margin:0 18px 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}.nas-location>div{flex:1;min-width:0}.nas-location strong{font-size:13px}.nas-location p{font-size:10px;color:var(--muted);margin-top:5px;overflow-wrap:anywhere}.nas-location>.icon-btn{flex:none}.nas-list{padding:0 24px}.nas-file{display:flex;align-items:center;width:100%;gap:12px;text-align:left;padding:15px 0;border-bottom:1px solid var(--line)}.nas-file-icon{width:44px;height:44px;flex:none;border-radius:10px;background:var(--soft);display:grid;place-items:center;color:var(--muted)}.nas-file-icon.folder{color:var(--accent)}.nas-file-copy{flex:1;min-width:0}.nas-file-copy strong{font-size:12px;font-weight:550;line-height:1.6;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.nas-file-copy small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.nas-file>svg{width:16px;height:16px;flex:none;color:var(--muted)}#nas-roots{resize:vertical;min-height:80px;line-height:1.6;font:14px -apple-system,BlinkMacSystemFont,sans-serif}.nas-watch-path{font-size:11px;color:var(--muted);overflow-wrap:anywhere;line-height:1.8;margin:12px 0}.nas-watch h1{overflow-wrap:anywhere}.nas-autoplay{margin:18px 0}.nas-autoplay .autoplay-control{width:100%}
.nas-folder-actions{display:flex;gap:10px;padding:0 24px 12px}.nas-folder-actions .outline{display:flex;align-items:center;gap:7px}.nas-folder-actions svg{width:16px;height:16px}.nas-folder-actions button{min-height:42px}.nas-autoplay{display:flex;gap:22px}.nas-autoplay .autoplay-control{flex:1;width:auto}.shuffle-control>span:first-child{display:flex;align-items:center;gap:7px}.shuffle-control svg{width:16px;height:16px}#sheet>.shuffle-control{width:100%;padding:12px 0 20px}
.nas-filter{display:flex;align-items:center;gap:9px;margin:0 24px 18px;padding:4px 0;border-bottom:1px solid var(--line)}.nas-filter>svg{width:18px;height:18px;color:var(--muted)}.nas-filter input{min-width:0;width:100%;border:0;background:none;color:var(--ink);font:16px -apple-system,BlinkMacSystemFont,sans-serif;outline:none;padding:10px 0}.nas-filter .icon-btn{width:34px;height:38px;flex:none;color:var(--muted)}.nas-filter [hidden]{display:none}
.player-loader.nas-quiet{background:none;padding:0;pointer-events:none}.nas-waiting{display:flex;align-items:center;gap:9px;background:#0008;padding:9px 12px;border-radius:24px;max-width:90%;font-size:11px}.nas-waiting .spinner{width:18px!important;height:18px!important}.nas-waiting button{pointer-events:auto;padding:4px 9px}.nas-elapsed{white-space:nowrap}
#seek-preview{position:absolute;z-index:8;top:50%;left:50%;transform:translate(-50%,-50%);padding:13px 20px;min-width:150px;background:#000b;backdrop-filter:blur(8px);border-radius:14px;color:#fff;pointer-events:none;text-align:center;font-variant-numeric:tabular-nums}#seek-preview[hidden]{display:none}#seek-preview strong{display:block;font-size:20px;white-space:nowrap}#seek-preview span{display:block;font-size:12px;margin-top:6px;color:#ffffffb8}
.channel-open-copy{text-align:left}.result-channel button.channel-avatar{font-size:inherit}.result-channel .channel-open-copy{font-size:inherit}.result-channel .channel-open-copy .meta{color:var(--accent)}.channel-page-head{margin-top:15px}.channel-row .copy button{width:100%}.main-header-actions{flex:none}.page-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.player-top-copy{flex:1;min-width:0;margin:0 10px;display:flex;flex-direction:column;gap:5px;align-items:flex-start;pointer-events:none}#player-title{width:100%;font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 4px #0009}.player-top-copy .status-pill{font-size:8px}#player.full #player-title{font-size:14px}.playlist-shuffle-start{display:inline-flex;align-items:center;gap:5px}.playlist-shuffle-start svg{width:16px;height:16px}#main:has(#playlist-items)>.section-head{flex-wrap:wrap;gap:9px}#main:has(#playlist-items)>.section-head>.count-label{margin-right:auto}

.failure-hint{font-size:10px!important;color:#d1d6d1}.nas-favorites{display:flex;gap:8px;overflow:auto;padding:0 24px 10px}.nas-favorites>span{display:flex;align-items:center;flex:none;border:1px solid var(--line);border-radius:20px}.nas-favorites button{display:flex;align-items:center;gap:5px;padding:9px;font-size:11px}.nas-favorites svg{width:14px;height:14px}.nas-favorites>span>button:first-child{max-width:220px;overflow:hidden;white-space:nowrap}.queue-entry{padding:12px 0;border-bottom:1px solid var(--line)}.queue-entry .row-controls{justify-content:flex-end}.shorts-entry{margin:0 24px 18px}.shorts-channel-label{display:flex;align-items:center;gap:12px;margin:0 24px 15px;font-size:12px}.shorts-channel-label select{flex:1;min-width:0;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:12px}#shorts-url-form{display:flex;gap:8px;margin:0 24px 18px;align-items:center}#shorts-url-form input{min-width:0;font-size:12px}#shorts-url-form button{flex:none}.shorts-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px;padding:0 24px 20px}.shorts-grid button{text-align:left;min-width:0}.shorts-grid img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:14px;background:var(--soft)}.shorts-grid strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.6;margin-top:7px}#player.shorts{display:block;position:absolute;inset:0;width:100%;height:100%;border-radius:0;z-index:40;background:#080808}#player.shorts #scene{width:100%;height:100%;object-fit:contain}#player.shorts .player-bottom{bottom:calc(115px + env(safe-area-inset-bottom))}#player.shorts .player-top{top:calc(12px + env(safe-area-inset-top))}#shorts-caption{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));left:20px;right:20px;z-index:3;text-shadow:0 1px 4px #000;background:linear-gradient(transparent,#0008);pointer-events:none}#shorts-caption[hidden]{display:none}#shorts-caption h3{font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#shorts-caption p{font-size:11px;margin-bottom:7px}#shorts-caption div{display:flex;gap:12px;justify-content:flex-end;margin-top:7px}#shorts-caption button{pointer-events:auto;padding:7px 12px;background:#ffffff24;border-radius:15px;font-size:11px}#phone.player-expanded #player.shorts{inset:0}

.discovery-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none}.discovery-tabs .chip{flex:none;white-space:nowrap}#player.shorts.hide-controls #shorts-caption>div{visibility:hidden;pointer-events:none}.shorts-grid small{display:block;font-size:10px;line-height:1.6;color:var(--muted);margin-top:4px}

.nas-account-label{display:block;color:var(--muted);font-size:9px;margin-top:4px}

/* Independent channel links keep video and channel tap targets separate. */
.channel{overflow:hidden}.channel-link{text-align:left;font:inherit;color:inherit}.channel-link:hover{text-decoration:underline}.video-card-open{display:block;width:100%;text-align:left}.row-video-thumb{flex:none}.creator-row>div{flex:1;min-width:0}.app-version{margin-top:20px;border-top:1px solid var(--line);padding-top:18px}.app-version>p:first-child{font-weight:650}.app-version span{font-size:11px;font-weight:400;color:var(--muted)}.app-version .outline{margin-top:12px;padding:10px 15px}

/* Browsing in landscape uses the viewport rather than a portrait phone frame. */
@media (orientation:landscape) and (min-width:560px){
 body{padding:0}
 #phone:not(.player-expanded){width:100%;max-width:1200px;height:100dvh;border:0;border-radius:0;box-shadow:none;--landscape-rail:76px;--landscape-left:calc(var(--landscape-rail) + env(safe-area-inset-left));--landscape-content:calc(100% - var(--landscape-left) - env(safe-area-inset-right))}
 #phone:not(.player-expanded) #main{left:var(--landscape-left);right:env(safe-area-inset-right);padding-bottom:24px}
 #phone:not(.player-expanded) #main.has-mini{padding-bottom:94px}
 #phone:not(.player-expanded) #nav{inset:0 auto 0 0;width:var(--landscape-left);height:auto;padding:calc(12px + env(safe-area-inset-top)) 6px calc(12px + env(safe-area-inset-bottom)) calc(6px + env(safe-area-inset-left));flex-direction:column;justify-content:space-evenly;border-top:0;border-right:1px solid var(--line)}
 #phone:not(.player-expanded) #nav button{position:relative;min-width:0;width:100%;padding:7px 0;gap:4px}
 #phone:not(.player-expanded) #nav button.active:before{top:50%;left:1px;transform:translateY(-50%)}
 #phone:not(.player-expanded) #main>header{padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:10px}
 #phone:not(.player-expanded) .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
 #phone:not(.player-expanded) .wide-card{margin-bottom:0;min-width:0}
 #phone:not(.player-expanded) .card-copy{min-width:0}
 #phone:not(.player-expanded) .card-info h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 #phone:not(.player-expanded) .discovery-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
 #phone:not(.player-expanded) .discovery-card{min-width:0}
 #phone:not(.player-expanded) .shorts-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 #phone:not(.player-expanded) #player.mini{left:calc(var(--landscape-left) + 12px);right:calc(12px + env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom))}
 #phone:not(.player-expanded) #watch-chrome{left:var(--landscape-left);right:env(safe-area-inset-right)}
 #phone:not(.player-expanded) #player.watch{left:var(--landscape-left);right:auto;width:calc(var(--landscape-content)*.55);max-height:calc(100dvh - 64px - env(safe-area-inset-top) - env(safe-area-inset-bottom));aspect-ratio:16/9}
 #phone:not(.player-expanded) #main.watch-page{left:calc(var(--landscape-left) + var(--landscape-content)*.55);top:calc(64px + env(safe-area-inset-top));padding-bottom:24px;border-left:1px solid var(--line)}
 #phone:not(.player-expanded) .watch-content{padding:16px 18px}
 #phone:not(.player-expanded) .watch-content h1{font-size:18px}
 #phone:not(.player-expanded) .watch-content .action-row{flex-wrap:wrap}
 #phone:not(.player-expanded) #related-section .list{padding:0 18px}
 #phone:not(.player-expanded) #related-section .list-item{gap:9px}
 #phone:not(.player-expanded) #related-section .thumb{width:90px}
 #phone:not(.player-expanded) #sheet{max-width:540px;margin:0 auto;max-height:92%}
 #phone:not(.player-expanded) #toast{bottom:calc(90px + env(safe-area-inset-bottom));max-width:calc(100% - 32px);white-space:normal;text-align:center}
}
@media (orientation:landscape) and (min-width:1050px){
 #phone:not(.player-expanded) .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
 #phone:not(.player-expanded) .shorts-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media (orientation:landscape) and (min-width:560px) and (max-width:759px){
 #phone:not(.player-expanded) .discovery-list{grid-template-columns:minmax(0,1fr)}
}

.list-sort{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:0 24px 18px;font-size:11px;color:var(--muted)}.list-sort select{max-width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card);color:var(--ink);font:inherit;font-size:12px}

#airplay-button[hidden]{display:none}#airplay-button.connected{color:#ff9c7c}

/* Family administration and private local reports. */
.admin-detail{display:block;font-size:12px;line-height:1.6;color:var(--muted);margin-top:4px;white-space:normal}
.admin-device{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.report-message{white-space:pre-wrap;overflow-wrap:anywhere;padding:16px 0}
.report-context{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.6;padding:14px;border-radius:12px;background:var(--surface);max-height:260px;overflow:auto}
.nas-file-icon:not(.folder){position:relative;width:80px;min-width:80px;height:50px;overflow:hidden;border-radius:7px}
.nas-file-icon img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#151515}

.nas-recent{margin:20px 0 24px}.nas-recent h2{font-size:16px;margin:0 24px 12px}.nas-recent-strip{display:flex;gap:12px;overflow-x:auto;padding:0 24px 8px;scroll-snap-type:x proximity}.nas-recent-card{position:relative;flex:0 0 160px;min-width:0;scroll-snap-align:start}.nas-recent-play{display:block;width:100%;text-align:left;color:var(--ink)}.nas-recent-play strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.5;padding-right:24px;margin:8px 0 4px;overflow-wrap:anywhere}.nas-recent-play small{font-size:11px;color:var(--muted)}.nas-recent-thumb{position:relative;display:grid;place-items:center;aspect-ratio:16/9;background:var(--card);border-radius:9px;overflow:hidden}.nas-recent-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#151515}.nas-recent-progress{position:absolute;bottom:0;left:0;height:3px;background:var(--accent)}.nas-recent-card>.icon-btn{position:absolute;right:-7px;top:92px;width:32px;height:32px}.nas-recent-card>.icon-btn svg{width:14px;height:14px}

/* Fullscreen follows the video aspect ratio even while device rotation is locked. */
#player{transform:translateY(var(--gesture-y,0px))}
#phone.player-expanded #player.turned{inset:auto;left:50%;top:50%;width:var(--turned-width);height:var(--turned-height);aspect-ratio:auto;transform-origin:center;transform:translate(-50%,-50%) rotate(90deg) translateY(var(--gesture-y,0px));--player-safe-top:env(safe-area-inset-right);--player-safe-right:env(safe-area-inset-bottom);--player-safe-bottom:env(safe-area-inset-left);--player-safe-left:env(safe-area-inset-top)}
#phone.player-expanded #player.turned .player-top{top:calc(12px + var(--player-safe-top));left:calc(18px + var(--player-safe-left));right:calc(18px + var(--player-safe-right))}
#phone.player-expanded #player.turned .player-bottom{left:calc(24px + var(--player-safe-left));right:calc(24px + var(--player-safe-right));bottom:calc(44px + var(--player-safe-bottom))}
#phone.player-expanded #player.turned[data-layout=landscape] .player-bottom{bottom:calc(16px + var(--player-safe-bottom))}
#phone.player-expanded #player.turned[data-layout=landscape] .player-center{gap:56px}
#phone.player-expanded #player.turned.shorts .player-bottom{bottom:calc(115px + var(--player-safe-bottom))}
#phone.player-expanded #player.turned #shorts-caption{bottom:calc(18px + var(--player-safe-bottom));left:calc(20px + var(--player-safe-left));right:calc(20px + var(--player-safe-right))}

#phone.player-expanded.player-turned #sheet-backdrop{inset:auto;left:50%;top:50%;width:var(--turned-width);height:var(--turned-height);transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}
#phone.player-expanded.player-turned #sheet{padding-bottom:calc(26px + env(safe-area-inset-left))}
#phone.player-expanded.player-turned #toast{left:35px;top:50%;bottom:auto;transform:translate(-50%,-50%) rotate(90deg);max-width:calc(var(--turned-width) - 40px);white-space:normal;text-align:center}

.nas-batch-total,.nas-batch-item progress{display:block;width:100%;height:7px;accent-color:var(--accent);margin:10px 0}.nas-batch-current{padding:14px;background:var(--soft);border-radius:12px;font-size:13px;overflow-wrap:anywhere}.nas-batch-current small,.nas-batch-item small{display:block;font-size:11px;color:var(--muted);line-height:1.7;margin-top:5px;overflow-wrap:anywhere}.nas-batch-item{padding:15px 0;border-bottom:1px solid var(--line)}.nas-batch-item strong{display:block;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
