@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&display=swap');
:root{--orange:#ff9000;--bg:#262626;--panel:#323232;--muted:#aaa}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f5f5f5;font:15px 'Noto Sans TC',Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button{border:0;background:none;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--orange);outline-offset:4px}button:hover,a:hover{color:var(--orange)}.wrap{width:calc(100% - 96px);max-width:1440px;margin:auto}header{height:76px;background:#080808ed;display:flex;align-items:center;gap:35px;padding:0 35px;position:sticky;top:0;z-index:30;backdrop-filter:blur(18px)}.logo{font-size:32px;letter-spacing:-1.7px;color:var(--orange);font-weight:500;white-space:nowrap}.logo span{font-weight:400}nav{display:flex;gap:24px;align-items:center;white-space:nowrap;height:100%;flex:1}nav a{font-size:16px;font-weight:700;height:100%;display:flex;align-items:center;border-bottom:3px solid transparent}nav a.active{border-color:var(--orange);color:var(--orange)}.usernav{display:flex;align-items:center;gap:17px;white-space:nowrap;font-size:14px}.search-icon{width:40px;height:40px;background:#333;border-radius:50%;display:grid;place-items:center}.icon{width:21px;height:21px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8}.menu-toggle{display:none}.hero{position:relative;background:#060606;overflow:hidden}.hero img{display:block;width:100%;aspect-ratio:1440/460;object-fit:cover}.hero .arrow{position:absolute;top:43%;font-size:40px;width:45px;height:64px;background:#0003;border-radius:4px}.hero .prev{left:15px}.hero .next{right:15px}.hero-bottom{position:absolute;bottom:24px;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between}.dots{display:flex;gap:8px}.dot{padding:0;width:8px;height:8px;border-radius:50%;background:#999}.dot.on{background:var(--orange)}.hero-link{position:absolute;inset:0}.hero-caption{position:absolute;left:5%;bottom:65px;background:linear-gradient(90deg,#000c,transparent);padding:16px 80px 16px 0}.hero-caption h1{margin:0 0 10px;font-size:32px}.hero-caption p{margin:0;color:#ccc}.hero-bottom .small{color:#ddd;background:#0009;padding:6px 12px;border-radius:3px}.subnav{display:flex;justify-content:center;gap:35px;padding:17px;background:#202020;border-bottom:1px solid #414141}.subnav a{color:#ddd}.section{padding:32px 0 8px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.section-heading h2{font-size:24px;font-weight:500;margin:0;display:flex;align-items:center;gap:12px}.round-icon{background:var(--orange);height:30px;width:30px;display:grid;place-items:center;border-radius:50%;font-size:18px}.more{font-size:14px;white-space:nowrap}.rail-wrap{position:relative}.rail{display:flex;gap:20px;overflow:auto;scrollbar-width:none;scroll-behavior:smooth;padding:2px 0 16px}.rail::-webkit-scrollbar{display:none}.card{min-width:0;position:relative}.rail .card{flex:0 0 calc((100% - 120px)/7)}.poster{position:relative;border-radius:7px;overflow:hidden;background:#383838;aspect-ratio:7/10;transition:transform .2s}.poster img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.card:hover .poster img{transform:scale(1.045)}.poster:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#0007);pointer-events:none}.card-title{display:block;margin-top:11px;line-height:1.6;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{position:absolute;top:0;left:0;background:#ed8600;padding:3px 8px;font-size:12px;z-index:2;border-radius:6px 0 5px 0}.badge.green{background:#298641}.save{position:absolute;bottom:40px;right:8px;width:31px;height:31px;border-radius:50%;background:#000a;z-index:3;font-size:21px;opacity:0}.card:hover .save,.save.saved{opacity:1}.save.saved{color:var(--orange)}.rail-arrow{position:absolute;right:-28px;top:36%;font-size:34px;z-index:2}.rail-arrow.left{left:-28px;right:auto}.channels .channel{flex:0 0 calc((100% - 140px)/8);text-align:center}.channel img{display:block;width:100%;aspect-ratio:1;border-radius:12px;transition:filter .2s}.channel:hover img{filter:brightness(1.2)}.channel p{margin:10px 0 0;font-size:15px}.live-dot{display:inline-block;background:#ee2737;width:8px;height:8px;border-radius:50%;margin-right:6px}.page-head{padding:38px 0 10px}.breadcrumbs{color:#aaa;font-size:13px;margin:0 0 25px}.page-head h1{font-size:32px;margin:12px 0 25px}.tabs{display:flex;gap:34px;border-bottom:1px solid #515151;margin-bottom:25px;overflow:auto;white-space:nowrap}.tabs button,.tabs a{padding:14px 3px;border-bottom:3px solid transparent;font-size:18px}.tabs .active{color:var(--orange);border-bottom-color:var(--orange)}.filters{padding:24px 0 12px}.filter-row{display:flex;align-items:flex-start;gap:22px;line-height:1.9;padding:9px 0;border-bottom:1px solid #393939}.filter-label{color:#aaa;min-width:40px;padding:5px 0}.filter-options{display:flex;gap:9px 20px;flex-wrap:wrap}.chip{padding:5px 9px;font-size:14px;border-radius:3px;color:#ddd}.chip.active{color:var(--orange);background:#45341e}.result-top{display:flex;align-items:center;justify-content:space-between;margin:28px 0 22px}.result-top h2{font-size:24px;font-weight:500;margin:0}.result-top select{background:#333;color:#fff;border:1px solid #666;padding:8px 14px;border-radius:3px}.grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:28px 20px;padding-bottom:40px}.empty{text-align:center;padding:80px 15px;color:#aaa}.rank-number{position:absolute;left:-10px;bottom:26px;font-size:90px;font-style:italic;font-weight:900;color:var(--orange);text-shadow:3px 3px 0 #222;z-index:4;line-height:1}.rank .card-title{padding-left:35px}.rank .meta{color:#aaa;font-size:12px;padding-left:35px;margin:3px 0}.details-visual{position:relative;background:#090909;height:480px;overflow:hidden}.details-visual>img{width:100%;height:100%;object-fit:cover;opacity:.6;filter:blur(1px)}.details-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#080808f5 6%,#080808bb 37%,transparent 100%),linear-gradient(0deg,#262626,transparent 50%)}.details-feature{position:absolute;inset:0;display:flex;align-items:center;gap:35px;z-index:2}.detail-poster{width:205px;height:293px;border-radius:6px;object-fit:cover;box-shadow:0 10px 35px #0008}.detail-copy{max-width:650px}.detail-copy h1{font-size:36px;margin:0 0 10px}.meta{color:#bbb;font-size:14px}.score{color:var(--orange);font-size:19px;margin-left:18px}.summary{line-height:1.9;color:#ddd}.actions{display:flex;gap:13px;margin:25px 0}.btn{background:var(--orange);color:#131313;border:1px solid var(--orange);padding:12px 28px;border-radius:4px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px}.btn:hover{background:#ffa82e;color:#111}.btn.secondary{background:#ffffff12;color:white;border-color:#888}.btn.secondary:hover{border-color:var(--orange);color:var(--orange)}.detail-body{padding-top:15px}.episodes{display:grid;grid-template-columns:repeat(10,1fr);gap:13px;margin:25px 0}.episodes a{border:1px solid #666;border-radius:3px;padding:12px;text-align:center}.episodes a:hover{border-color:var(--orange)}.info-table{line-height:2.3;color:#ccc;max-width:900px;padding-bottom:30px}.info-table b{display:inline-block;width:75px;color:#888;font-weight:400}.still{width:320px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}.player-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:25px;margin:35px auto}.player{aspect-ratio:16/9;background:#030303;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.player-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;filter:blur(3px)}.player-prompt{position:relative;text-align:center;padding:25px}.player-prompt h2{font-size:22px}.play-round{border:2px solid #ddd;border-radius:50%;width:70px;height:70px;display:inline-grid;place-items:center;font-size:28px}.player-controls{position:absolute;bottom:0;left:0;right:0;padding:15px;background:#0008;display:flex;gap:18px;align-items:center}.progress{height:3px;background:#777;flex:1}.progress i{display:block;width:0;height:100%;background:var(--orange)}.side-list{background:#303030;padding:18px;border-radius:5px;max-height:530px;overflow:auto}.side-list a{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #444}.side-list img{width:55px;height:78px;object-fit:cover}.side-list small{color:#999;display:block;margin-top:10px}.auth-shell{min-height:650px;display:grid;place-items:center;padding:50px 20px;background:radial-gradient(ellipse at 50% 0,#58402b55,transparent 60%),#202020}.auth-box{width:430px;max-width:100%;padding:35px 40px;background:#303030;border:1px solid #454545;border-radius:9px}.auth-box h1{font-size:25px;margin:0 0 26px;text-align:center}.auth-box label{display:block;margin:18px 0 8px;font-size:14px;color:#ddd}.input{width:100%;padding:13px 15px;border:1px solid #666;border-radius:4px;background:#242424;color:#fff;outline:none}.input:focus{border-color:var(--orange)}.auth-box .btn{width:100%;margin-top:22px}.auth-links{display:flex;justify-content:space-between;font-size:13px;margin:18px 0;color:#ccc}.divider{display:flex;align-items:center;gap:15px;color:#999;margin:25px 0;font-size:12px}.divider:before,.divider:after{content:'';flex:1;height:1px;background:#555}.auth-note{font-size:12px;color:#999;line-height:1.8;text-align:center}.error{color:#ffaf70;font-size:13px;min-height:18px}.plans-head{text-align:center;background:radial-gradient(ellipse at 50% 20%,#85552366,transparent 70%);padding:65px 20px 35px}.plans-head h1{font-size:42px;margin:5px 0 18px}.plans-head p{color:#bbb;font-size:20px}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;max-width:1050px;margin:25px auto 65px}.plan{border:1px solid #777;background:#303030;border-radius:12px;padding:36px 30px;position:relative}.plan.featured{border:2px solid var(--orange);background:linear-gradient(145deg,#51402b,#303030)}.plan .ribbon{position:absolute;top:-15px;left:25px;background:var(--orange);color:#111;padding:4px 20px;border-radius:20px}.plan h2{font-size:25px}.price{font-size:44px;font-weight:700;margin:20px 0 5px}.price small{font-size:15px;font-weight:400}.plan p{color:#aaa}.plan ul{padding-left:20px;line-height:2.5;min-height:125px}.plan .btn{width:100%}.benefits{background:#1e1e1e;padding:45px 20px;text-align:center}.benefit-grid{display:flex;justify-content:center;gap:80px;margin-top:35px}.benefit-grid span{display:block;font-size:35px;color:var(--orange);margin-bottom:12px}.faq{max-width:850px;margin:40px auto 70px}details{border-bottom:1px solid #555;padding:20px 0}summary{cursor:pointer;font-size:18px}details p{color:#bbb;line-height:1.9}.search-page{padding-top:40px}.search-form{display:flex;gap:12px;max-width:750px;margin:15px auto 35px}.search-form .input{font-size:18px}.keywords{display:flex;flex-wrap:wrap;gap:14px;margin:20px 0 45px}.keyword{border:1px solid #666;border-radius:30px;padding:8px 20px}.channel-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:25px;padding:30px 0 60px}.channel-grid .channel{text-align:center}.schedule{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:20px;background:#333;margin-bottom:10px}.schedule.current{border-left:3px solid var(--orange)}footer{background:#191919;margin-top:45px;padding:40px 0 25px;color:#bbb}.footer-top{display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:30px}.footer-top h3{color:#eee;font-size:16px;font-weight:500}.footer-top a{display:block;margin:14px 0;font-size:13px}.copyright{border-top:1px solid #414141;margin-top:35px;padding-top:25px;display:flex;align-items:center;justify-content:space-between;font-size:11px}.demo-label{font-size:11px;color:#777;letter-spacing:1px}.fixed-tools{position:fixed;right:22px;bottom:26px;z-index:20;display:flex;flex-direction:column;gap:12px}.fixed-tools button,.fixed-tools a{border-radius:50%;background:#050505e8;box-shadow:0 3px 12px #0006;width:48px;height:48px;display:grid;place-items:center;font-size:20px}#toast{position:fixed;bottom:40px;left:50%;transform:translate(-50%,30px);background:#111f;border:1px solid #777;padding:15px 30px;z-index:100;border-radius:6px;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}.overlay{position:fixed;inset:0;background:#000b;z-index:90;display:grid;place-items:center;padding:20px}.modal{position:relative;max-width:450px;width:100%;border:1px solid #666;background:#333;padding:35px;border-radius:8px;text-align:center}.modal p{line-height:1.9;color:#bbb}.modal .close{position:absolute;right:12px;top:8px;font-size:24px}.form-check{display:flex;gap:10px;align-items:flex-start;color:#aaa;font-size:12px;margin:16px 0}.mobile-only{display:none}.paging{text-align:center;margin:10px 0 40px}.paging button{border:1px solid #555;padding:10px 17px;margin:4px}.paging .active{color:var(--orange);border-color:var(--orange)}
header{height:62px;gap:40px;padding:0 20px}nav{gap:20px}nav a{font-size:16px}.logo{font-size:30px}.usernav{gap:14px}.channels .channel{flex-basis:calc((100% - 150px)/6)}.channels{gap:30px}.details-visual{height:420px}.detail-poster{display:none}.details-visual>img{position:absolute;right:0;width:72%;filter:none;opacity:.6;object-position:50% 42%}.details-visual:after{background:linear-gradient(90deg,#222 15%,#222e 35%,#2227 60%,#2222),linear-gradient(0deg,#262626,transparent 20%)}.details-feature{align-items:flex-start;padding-top:28px}.detail-copy{max-width:710px}.detail-copy .breadcrumbs{margin-bottom:25px}.detail-copy h1{font-size:32px;margin-bottom:30px}.detail-copy .meta{margin-bottom:8px}.detail-copy .summary{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;line-height:1.8}.detail-copy .actions .btn{border-radius:25px}.details-feature .actions{margin-top:22px}.detail-body{padding-top:0}
.news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:35px;margin:30px 0}.news-card{background:#303030;border-radius:8px;overflow:hidden;padding-bottom:20px}.news-card img{width:100%;aspect-ratio:1440/460;object-fit:cover}.news-card h2,.news-card p{margin-left:22px;margin-right:22px}.news-card h2{font-size:22px}.site-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:30px 0 60px}.site-grid a{padding:20px;background:#333;border:1px solid #444;border-radius:5px}.modal{max-height:90vh;overflow:auto}.player:fullscreen{width:100vw;height:100vh}.form-check input{accent-color:var(--orange)}
@media(max-width:600px){.news-grid{grid-template-columns:1fr}.news-card h2{font-size:19px}.site-grid{grid-template-columns:repeat(2,1fr)}.site-grid a{font-size:13px;padding:15px}.benefits h2{font-size:21px}}
nav{flex:0 0 auto}.usernav{margin-left:auto}header>.search-icon{flex-shrink:0;margin-left:-20px}
@media(max-width:600px){header{gap:12px}header>.search-icon{margin-left:auto;width:33px;height:33px}.usernav{margin-left:0}.details-feature{padding-top:35px}.details-visual{height:480px}.details-visual>img{width:100%;opacity:.5}.detail-copy h1{margin-bottom:18px}.detail-copy .summary{-webkit-line-clamp:4}.channel p{min-height:18px}}
@media(min-width:1600px){header{gap:55px;padding:0 4%}nav{gap:30px}.rail .card{flex-basis:calc((100% - 140px)/8)}}
@media(max-width:1250px){header{gap:23px;padding:0 22px}nav{gap:15px}nav a{font-size:14px}.usernav{gap:12px;font-size:13px}.usernav .optional{display:none}.rail .card{flex-basis:calc((100% - 100px)/6)}.grid{grid-template-columns:repeat(6,minmax(0,1fr))}.channels .channel{flex-basis:calc((100% - 100px)/6)}}
@media(max-width:900px){header{height:65px;flex-wrap:wrap;gap:16px;padding:0 22px}.logo{font-size:27px}nav{order:3;position:absolute;left:0;right:0;top:65px;height:45px;background:#111e;overflow:auto;padding:0 22px;gap:24px;scrollbar-width:none}nav a{font-size:14px}header{margin-bottom:45px}.usernav{margin-left:auto}.wrap{width:calc(100% - 44px)}.hero img{min-height:270px;object-fit:cover}.hero-caption h1{font-size:24px}.rail .card{flex-basis:calc((100% - 60px)/4)}.channels .channel{flex-basis:calc((100% - 80px)/5)}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.channel-grid{grid-template-columns:repeat(4,1fr)}.section-heading h2{font-size:21px}.footer-top{grid-template-columns:repeat(3,1fr)}.footer-brand{grid-column:1/-1}.plans{margin:25px 22px 45px;gap:12px}.plan{padding:25px 18px}.price{font-size:35px}.benefit-grid{gap:30px}.detail-copy h1{font-size:28px}.details-feature{gap:25px}.detail-poster{width:160px;height:229px}.player-layout{grid-template-columns:1fr}.side-list{display:none}.episodes{grid-template-columns:repeat(6,1fr)}.details-visual{height:450px}.summary{font-size:14px}.subnav{gap:25px}}
@media(max-width:600px){header{padding:0 16px}.usernav .optional,.usernav .plan-link{display:none}.usernav{font-size:12px}.wrap{width:calc(100% - 32px)}.hero img{min-height:210px;aspect-ratio:16/8;object-fit:cover;object-position:60%}.hero .arrow{font-size:28px;width:25px;height:45px}.hero .prev{left:3px}.hero .next{right:3px}.hero-bottom{bottom:13px}.hero-caption{left:7%;bottom:45px;padding:10px 15px 10px 0}.hero-caption h1{font-size:22px}.hero-caption p{font-size:11px}.hero-bottom .small{display:none}.section{padding-top:25px}.section-heading{margin-bottom:16px}.section-heading h2{font-size:19px;gap:8px}.round-icon{width:26px;height:26px;font-size:15px}.more{font-size:12px}.rail{gap:12px}.rail .card{flex-basis:calc((100% - 30px)/3.3)}.card-title{font-size:13px;margin-top:7px}.channels .channel{flex-basis:calc((100% - 36px)/4.2)}.channel img{border-radius:8px}.channel p{font-size:12px}.rail-arrow{display:none}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 12px}.save{opacity:1;bottom:35px;width:25px;height:25px;font-size:17px}.badge{font-size:9px;padding:2px 5px}.subnav{justify-content:flex-start;padding:13px 16px;gap:26px;overflow:auto;font-size:13px;white-space:nowrap}.page-head{padding-top:25px}.page-head h1{font-size:27px}.filter-row{gap:8px;font-size:13px}.filter-options{gap:5px}.chip{font-size:12px;padding:4px 7px}.filter-label{min-width:34px}.footer-top{grid-template-columns:repeat(2,1fr);gap:10px 25px}.footer-top h3{font-size:14px}.copyright{display:block;line-height:2}.copyright .demo-label{display:block}.fixed-tools{right:12px;bottom:16px}.fixed-tools button,.fixed-tools a{width:40px;height:40px}.detail-poster{display:none}.details-feature{align-items:flex-end;padding-bottom:25px}.details-visual{height:460px}.details-visual>img{object-position:center}.details-visual:after{background:linear-gradient(0deg,#262626,#0008 70%,transparent)}.detail-copy h1{font-size:30px}.detail-copy .summary{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.actions{gap:8px;flex-wrap:wrap;margin-bottom:0}.btn{padding:11px 20px;font-size:14px}.tabs{gap:25px}.tabs button,.tabs a{font-size:15px}.episodes{grid-template-columns:repeat(5,1fr);gap:9px}.plans-head{padding-top:40px}.plans-head h1{font-size:31px}.plans-head p{font-size:16px}.plans{grid-template-columns:1fr;gap:25px}.plan ul{min-height:auto}.price{font-size:43px}.benefit-grid{flex-wrap:wrap;gap:30px;font-size:13px}.benefit-grid>div{width:26%}.auth-box{padding:30px 24px}.player-layout{margin-top:20px}.player-prompt h2{font-size:17px}.player-prompt p{font-size:12px}.play-round{width:45px;height:45px;font-size:20px}.player-controls{font-size:10px;padding:8px;gap:10px}.channel-grid{grid-template-columns:repeat(3,1fr);gap:20px 12px}.rank-number{font-size:55px;bottom:23px;left:-3px}.rank .card-title,.rank .meta{padding-left:23px}.rank .meta{font-size:10px}.search-form{gap:8px}.search-form .input{font-size:15px}.search-form .btn{padding:10px 18px}.keyword{font-size:13px;padding:7px 15px}.result-top h2{font-size:20px}.result-top select{font-size:12px}.faq{margin:30px 16px}.info-table{font-size:13px}.still{width:250px}.hero .dot{width:6px;height:6px}.dots{gap:6px}}

/* Content covers: reference desktop 4 columns, 3:4 ratio, 16px gap. */
.poster{aspect-ratio:3/4;border-radius:12px}
.poster img{object-fit:contain}
.rail{gap:16px}
.rail .card{flex:0 0 calc((100% - 48px)/4)}
.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 16px}
@media(min-width:901px){
 .section.wrap,.wrap:has(>.grid){max-width:1248px}
 .rail .card{flex-basis:calc((100% - 48px)/4)}
}
@media(min-width:601px) and (max-width:900px){
 .rail .card{flex-basis:calc((100% - 32px)/3)}
 .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:600px){
 .poster{border-radius:10px}
 .rail{gap:12px}
 .rail .card{flex-basis:calc((100% - 12px)/2)}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
}