:root{--accent:#e6333d;--accent-dark:#c9212b;--ink:#18181b;--muted:#6b6b72;--line:#e8e8eb;--soft:#f5f5f7;--radius:18px;--shadow:0 8px 30px rgba(20,20,30,.08)}
*{box-sizing:border-box}html{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Noto Sans CJK SC",sans-serif;color:var(--ink);background:#fff}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}.public-body{min-height:100vh}.kids-header{height:70px;display:flex;align-items:center;padding:0 max(18px,env(safe-area-inset-left));position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(232,232,235,.8)}.brand{display:inline-flex;align-items:center;gap:11px;font-size:20px;font-weight:800;letter-spacing:-.02em;min-height:48px}.brand-mark{width:38px;height:30px;border-radius:11px;background:linear-gradient(145deg,#ff4e58,var(--accent));display:grid;place-items:center;box-shadow:0 5px 14px rgba(230,51,61,.25)}.brand-mark span{display:block;margin-left:3px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid #fff}.kids-main{width:min(1500px,100%);margin:auto;padding:20px clamp(16px,3vw,40px) 60px}.section-block{margin:8px 0 38px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px}.section-heading h1,.section-heading h2{font-size:clamp(22px,3vw,29px);letter-spacing:-.03em;margin:0}.channel-strip{display:flex;gap:18px;overflow-x:auto;padding:4px 2px 14px;scrollbar-width:thin;scroll-snap-type:x proximity}.channel-bubble{min-width:94px;width:94px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px;scroll-snap-align:start;padding:5px;border-radius:18px}.channel-bubble:focus-visible,.video-card:focus-visible,.pill-button:focus-visible{outline:4px solid rgba(230,51,61,.3);outline-offset:3px}.channel-bubble img,.avatar-fallback{width:76px;height:76px;border-radius:50%;object-fit:cover;background:linear-gradient(145deg,#ffd6d8,#f36870);display:grid;place-items:center;color:#fff;font-size:28px;font-weight:800;border:3px solid #fff;box-shadow:0 3px 16px rgba(20,20,30,.13)}.channel-bubble strong{font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:26px 18px}.video-card{display:block;min-width:0;border-radius:var(--radius);transition:transform .16s ease,background .16s ease;padding-bottom:9px}.video-card:active{transform:scale(.985);background:var(--soft)}.thumb-wrap{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;position:relative;background:#e8e8eb}.thumb-wrap img,.thumb-placeholder{width:100%;height:100%;display:block;object-fit:cover}.thumb-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#ffe1e3,#ece8ff)}.play-dot{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--accent);padding-left:3px;box-shadow:var(--shadow)}.duration,.preparing-badge{position:absolute;right:8px;bottom:8px;padding:3px 6px;border-radius:6px;background:rgba(20,20,24,.82);color:#fff;font-size:12px;font-weight:700}.preparing-badge{left:8px;right:auto;background:rgba(230,51,61,.92)}.card-copy{padding:11px 5px 0}.card-copy h3{font-size:17px;line-height:1.35;margin:0 0 5px;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-copy p,.card-copy time{font-size:14px;color:var(--muted);margin:0}.card-copy time:before{content:" · "}.pager{display:flex;justify-content:center;gap:12px;margin:32px 0}.pill-button{display:inline-grid;place-items:center;min-width:116px;min-height:48px;border-radius:999px;background:var(--accent);color:#fff;font-weight:750}.pill-button.secondary{color:var(--ink);background:var(--soft)}.friendly-empty{text-align:center;background:var(--soft);border-radius:24px;padding:52px 20px}.friendly-empty>span{font-size:54px}.friendly-empty h1,.friendly-empty h2{margin:12px 0 6px}.friendly-empty p{color:var(--muted);margin:0}.friendly-empty.full-page{margin:8vh auto;max-width:660px}.channel-hero{display:flex;align-items:center;gap:18px;padding:16px 0 30px}.channel-hero img,.avatar-fallback.large{width:94px;height:94px;border-radius:50%;object-fit:cover}.channel-hero h1{font-size:clamp(26px,5vw,38px);margin:0 0 5px;letter-spacing:-.035em}.channel-hero p{color:var(--muted);margin:0}.back-button{width:48px;height:48px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-size:24px;flex:none}.watch-shell{max-width:1240px;margin:auto}.player-section{max-width:1100px;margin:auto}.player-frame{background:#0d0d0f;border-radius:clamp(0px,2vw,22px);overflow:hidden;aspect-ratio:16/9;box-shadow:0 12px 38px rgba(0,0,0,.15)}.player-frame video{display:block;width:100%;height:100%;background:#000}.watch-info{padding:18px 4px 28px;border-bottom:1px solid var(--line)}.watch-info h1{font-size:clamp(22px,4vw,32px);line-height:1.25;margin:0 0 10px;letter-spacing:-.03em}.watch-info a{font-size:17px;font-weight:700;color:var(--accent)}.watch-info time{font-size:14px;color:var(--muted);margin-left:10px}.more-section{padding-top:28px}.prepare-panel{height:100%;background:#17171b;color:#fff;text-align:center;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;overflow:hidden}.prepare-visual{position:absolute;inset:0}.prepare-visual img{width:100%;height:100%;object-fit:cover;opacity:.35;filter:blur(2px)}.prepare-shade{position:absolute;inset:0;background:rgba(8,8,10,.4)}.prepare-panel h2,.prepare-panel p,.spinner{position:relative;z-index:2}.prepare-panel h2{margin:20px 0 5px;font-size:clamp(20px,4vw,30px)}.prepare-panel p{margin:0;color:#d9d9dd}.spinner{width:48px;height:48px;border-radius:50%;border:5px solid rgba(255,255,255,.28);border-top-color:#fff;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:520px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:900px){.video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.kids-main{padding-top:28px}.channel-strip{gap:25px}.recommendations{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1280px){.video-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.recommendations{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:600px){.kids-main{padding-left:12px;padding-right:12px}.kids-header{height:62px}.brand{font-size:18px}.section-heading,.channel-hero,.watch-info{padding-left:4px;padding-right:4px}.player-frame{margin-left:-12px;margin-right:-12px;border-radius:0}.channel-hero{gap:11px}.channel-hero img,.avatar-fallback.large{width:72px;height:72px}.back-button{width:42px;height:42px}.video-grid{gap-bottom:20px}.recommendations{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}.recommendations .card-copy h3{font-size:15px}.recommendations .card-copy p,.recommendations .card-copy time{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.spinner{animation-duration:2s}.video-card{transition:none}}
.brand-mark{width:36px;height:36px;border-radius:50%;background:linear-gradient(145deg,#ff5a65 15%,#d84f9b 100%);color:#fff;font-size:22px;line-height:1;box-shadow:0 5px 14px rgba(216,79,155,.23)}
.card-copy time:before{content:""}
.playable-badge{position:absolute;left:8px;bottom:8px;padding:4px 7px;border-radius:7px;background:rgba(20,132,88,.94);color:#fff;font-size:12px;font-weight:800}.paused-badge{background:rgba(138,100,19,.94)}.channel-nav{margin-bottom:24px}.home-layout{display:grid;grid-template-areas:"side" "main";gap:24px}.home-main{grid-area:main;min-width:0}.home-sidebar{grid-area:side;min-width:0}.channel-shelf{margin:0 0 36px}.channel-shelf .section-heading{margin-bottom:13px}.more-link{display:inline-flex;align-items:center;gap:4px;min-height:42px;padding:0 10px;border-radius:999px;color:var(--accent);font-size:14px;font-weight:800}.more-link span{font-size:24px;line-height:1}.more-link:active{background:#fff0f1}.channel-video-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,31%);gap:16px;overflow-x:auto;padding:2px 2px 14px;scroll-snap-type:x proximity;scrollbar-width:thin}.channel-video-row .video-card{scroll-snap-align:start}.home-sidebar{display:grid;align-content:start;gap:18px}.sidebar-section{border:1px solid var(--line);border-radius:20px;background:#fafafa;padding:15px}.sidebar-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:0 0 10px}.sidebar-heading h2{font-size:19px;margin:0}.sidebar-heading small{color:var(--muted);font-size:11px}.sidebar-list{display:grid;gap:12px}.sidebar-video{display:grid;grid-template-columns:128px minmax(0,1fr);gap:10px;align-items:start;border-radius:12px;padding:4px}.sidebar-video:active{background:#eee}.sidebar-thumb{aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:10px;background:#e8e8eb;display:grid;place-items:center}.sidebar-thumb img{width:100%;height:100%;object-fit:cover}.sidebar-thumb b{position:absolute;right:5px;bottom:5px;padding:2px 4px;border-radius:4px;background:rgba(20,20,24,.82);color:#fff;font-size:10px}.sidebar-thumb i{position:absolute;left:0;bottom:0;height:4px;background:var(--accent)}.sidebar-video strong{font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sidebar-video small,.sidebar-video em{display:block;margin-top:4px;color:var(--muted);font-size:11px;font-style:normal}.sidebar-video em{color:var(--accent);font-weight:700}.sidebar-empty{color:var(--muted);font-size:13px;margin:3px 0}.continue-video .sidebar-thumb i{display:block}
@media(min-width:820px){.home-layout{grid-template-columns:minmax(0,1fr) 280px;grid-template-areas:"main side";align-items:start}.home-sidebar{position:sticky;top:90px}.channel-video-row{grid-auto-columns:minmax(230px,48%)}}
@media(min-width:1180px){.home-layout{grid-template-columns:minmax(0,1fr) 330px;gap:30px}.channel-video-row{grid-auto-columns:minmax(240px,31.5%)}}
@media(max-width:600px){.channel-video-row{grid-auto-columns:82%;gap:12px}.sidebar-section{padding:13px}.sidebar-video{grid-template-columns:118px minmax(0,1fr)}.home-layout{gap:18px}.channel-shelf{margin-bottom:30px}}
.playlist-public-shelf{margin-bottom:38px}.playlist-empty{padding:24px;border-radius:16px;background:var(--soft);color:var(--muted);text-align:center}.playlist-hero img{border-radius:16px;aspect-ratio:16/9;width:150px;height:auto}.playlist-parent{color:var(--accent)!important;font-weight:750;margin-bottom:5px!important}
@media(max-width:600px){.playlist-hero{align-items:center}.playlist-hero img{width:105px}.playlist-public-shelf .channel-video-row{grid-auto-columns:82%}}
.viewer-menu{margin-left:auto;display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.viewer-menu form{margin:0}.viewer-menu button{min-height:40px;padding:0 14px;border:0;border-radius:999px;background:var(--soft);color:var(--ink);font-weight:750}.viewer-login-wrap{min-height:calc(100vh - 130px);display:grid;place-items:center;padding:30px 0}.viewer-login-card{width:min(430px,100%);padding:34px;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);background:#fff}.viewer-login-icon{width:58px;height:58px;border-radius:19px;display:grid;place-items:center;background:linear-gradient(145deg,#ff5a65,#d84f9b);color:#fff;font-size:28px;box-shadow:0 8px 22px rgba(216,79,155,.24)}.viewer-login-card h1{font-size:30px;letter-spacing:-.035em;margin:20px 0 7px}.viewer-login-card>p{color:var(--muted);margin:0 0 23px}.viewer-login-error{padding:12px 14px;margin-bottom:16px;border-radius:12px;background:#fff0f1;color:#9b222d}.viewer-login-form{display:grid;gap:16px}.viewer-login-form label{font-weight:750;font-size:14px}.viewer-login-form input{display:block;width:100%;height:50px;margin-top:7px;padding:0 14px;border:1px solid #d4d4d9;border-radius:13px;background:#fff}.viewer-login-form input:focus{outline:4px solid rgba(230,51,61,.15);border-color:var(--accent)}.viewer-login-form button{min-height:52px;margin-top:4px;border:0;border-radius:14px;background:var(--accent);color:#fff;font-weight:800}.viewer-login-form button:active{background:var(--accent-dark)}
@media(max-width:600px){.viewer-login-wrap{padding:12px 0;align-items:start}.viewer-login-card{border:0;box-shadow:none;padding:28px 12px}.viewer-menu span{display:none}.viewer-menu button{min-height:38px;padding:0 12px}}