.app{min-height:100vh;background-color:var(--color-white)}.header{position:fixed;top:0;left:0;right:0;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-5);background-color:var(--color-white);z-index:100}.header-left{display:flex;align-items:center;gap:var(--spacing-5);min-width:169px}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:var(--radius-full-pill);background:transparent;color:var(--color-near-black)}.icon-button:hover{background-color:var(--color-subtle-background)}.logo{display:inline-flex;align-items:center;text-decoration:none}.logo-wordmark{display:inline-flex;align-items:center;gap:var(--spacing-1)}.logo-play{display:inline-flex;align-items:center}.logo-text{font-family:var(--font-roboto);font-size:20px;font-weight:700;line-height:1;letter-spacing:-1.2px;color:var(--color-near-black)}.header-center{display:flex;align-items:center;gap:var(--spacing-2);flex:1;max-width:640px;margin:0 var(--spacing-9)}.search{display:flex;flex:1;height:40px}.search-input{flex:1;height:40px;padding:0 var(--spacing-5);font-family:var(--font-roboto);font-size:16px;line-height:22px;color:var(--color-near-black);border:1px solid var(--color-border-grey);border-right:none;border-radius:var(--radius-pill) 0 0 var(--radius-pill);box-shadow:var(--shadow-search-input-inset);outline:none}.search-input::placeholder{color:var(--color-secondary-grey)}.search-input:focus{border-color:var(--color-youtube-blue)}.search-button{display:inline-flex;align-items:center;justify-content:center;width:64px;height:40px;color:var(--color-near-black);background-color:var(--color-light-grey-surface);border:1px solid var(--color-border-grey);border-radius:0 var(--radius-pill) var(--radius-pill) 0}.search-button:hover{border-color:var(--color-hover-border-grey)}.mic-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--color-near-black);background-color:var(--color-subtle-background);border:none;border-radius:var(--radius-full-pill)}.mic-button:hover{background-color:var(--color-border-grey)}.header-right{display:flex;align-items:center;justify-content:flex-end;min-width:169px}.avatar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:14px;font-weight:500;color:var(--color-white);background-color:var(--color-youtube-blue);border:none;border-radius:var(--radius-full-pill)}.body{display:flex;padding-top:56px}.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;padding:var(--spacing-3);background-color:var(--color-white);overflow-y:auto}.nav-item{display:flex;align-items:center;gap:var(--spacing-7);width:100%;height:40px;padding:0 var(--spacing-3);border:none;border-radius:var(--radius-chip);background:transparent;color:var(--color-near-black);font-family:var(--font-roboto);font-size:14px;font-weight:400;text-align:left}.nav-item:hover{background-color:var(--color-subtle-background)}.nav-item--active{background-color:var(--color-subtle-background);font-weight:500}.nav-item-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--color-near-black)}.main{flex:1;margin-left:240px;padding:var(--spacing-5) var(--spacing-7) var(--spacing-9)}.chips{display:flex;gap:var(--spacing-3);margin-bottom:var(--spacing-7)}.chip{height:32px;padding:0 var(--spacing-3);font-family:var(--font-roboto);font-size:14px;font-weight:500;color:var(--color-near-black);background-color:var(--color-subtle-background);border:none;border-radius:var(--radius-chip);white-space:nowrap}.chip:hover{background-color:var(--color-border-grey)}.chip--active{color:var(--color-white);background-color:var(--color-near-black)}.chip--active:hover{background-color:var(--color-near-black)}.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-9) var(--spacing-5)}.video-card{display:flex;flex-direction:column}.video-card--link{text-decoration:none;color:inherit;cursor:pointer}.video-card--link:hover .video-title{color:var(--color-youtube-blue)}.video-thumbnail{position:relative;width:100%;aspect-ratio:16 / 9;background-color:var(--color-border-grey);border-radius:var(--radius-card);overflow:hidden}.video-thumbnail-img{width:100%;height:100%;object-fit:cover;display:block}.video-info{display:flex;gap:var(--spacing-3);margin-top:var(--spacing-3)}.video-avatar{flex-shrink:0;width:36px;height:36px;background-color:var(--color-border-grey);border-radius:var(--radius-full-pill);overflow:hidden}.video-avatar-img{width:100%;height:100%;object-fit:cover;display:block}.video-text{display:flex;flex-direction:column}.video-title{margin:0;font-size:16px;font-weight:500;line-height:22px;color:var(--color-near-black);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-channel{margin:var(--spacing-2) 0 0;font-size:14px;font-weight:400;line-height:20px;color:var(--color-secondary-grey)}.video-meta{margin:0;font-size:14px;font-weight:400;line-height:20px;color:var(--color-secondary-grey)}@media (max-width: 1100px){.video-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 700px){.video-grid{grid-template-columns:1fr}.header-center{margin:0 var(--spacing-3)}}.watch-page{display:flex;gap:var(--spacing-9);max-width:2100px;margin:0 auto;padding:var(--spacing-7) var(--spacing-6) var(--spacing-13);padding-top:calc(56px + var(--spacing-7));align-items:flex-start}.watch-main{flex:1 1 0;min-width:0}.player{width:100%}.player-stage{position:relative;width:100%;aspect-ratio:16 / 9;background-color:var(--color-near-black);border-radius:var(--radius-card);overflow:hidden;display:flex;align-items:center;justify-content:center}.player-slide-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.player-slide-content{position:relative;z-index:1;max-width:70%;text-align:center;color:var(--color-white);padding:var(--spacing-7)}.player-slide-eyebrow{margin:0 0 var(--spacing-3);font-size:14px;font-weight:500;letter-spacing:1px;text-transform:uppercase;opacity:.85}.player-slide-title{margin:0 0 var(--spacing-3);font-size:32px;font-weight:700;line-height:1.2}.player-slide-subtitle{margin:0 0 var(--spacing-5);font-size:16px;font-weight:400;opacity:.9}.player-slide-body{margin:0;font-size:15px;font-weight:400;line-height:22px;opacity:.85}.player-arrow{position:absolute;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--color-white);background-color:#0006;border:none;border-radius:var(--radius-full-pill);z-index:2}.player-arrow:hover{background-color:#000000a6}.player-arrow--left{left:var(--spacing-3)}.player-arrow--right{right:var(--spacing-3)}.player-counter{position:absolute;right:var(--spacing-3);bottom:var(--spacing-3);z-index:2;padding:var(--spacing-1) var(--spacing-2);font-size:13px;font-weight:500;color:var(--color-white);background-color:#0009;border-radius:var(--radius-chip)}.player-dots{display:flex;justify-content:center;gap:var(--spacing-2);margin-top:var(--spacing-3)}.player-dot{width:8px;height:8px;padding:0;border:none;border-radius:var(--radius-full-pill);background-color:var(--color-border-grey);cursor:pointer}.player-dot--active{background-color:var(--color-near-black);width:22px}.watch-info{margin-top:var(--spacing-5)}.watch-title{margin:0 0 var(--spacing-3);font-size:20px;font-weight:700;line-height:28px;color:var(--color-near-black)}.watch-actions-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--spacing-3)}.watch-channel{display:flex;align-items:center;gap:var(--spacing-3)}.watch-channel-avatar{flex-shrink:0;width:40px;height:40px;border-radius:var(--radius-full-pill);background-color:var(--color-border-grey);overflow:hidden}.watch-channel-avatar img{width:100%;height:100%;object-fit:cover;display:block}.watch-channel-text{display:flex;flex-direction:column}.watch-channel-name{font-size:16px;font-weight:500;color:var(--color-near-black)}.watch-channel-subs{font-size:12px;font-weight:400;color:var(--color-secondary-grey)}.contact-button{margin-left:var(--spacing-5);height:36px;padding:0 var(--spacing-5);font-family:var(--font-roboto);font-size:14px;font-weight:500;color:var(--color-white);background-color:var(--color-near-black);border:none;border-radius:var(--radius-full-pill);cursor:pointer}.contact-button:hover{background-color:#272727}.watch-actions{display:flex;align-items:center;gap:var(--spacing-2)}.like-pill{display:flex;align-items:center;height:36px;background-color:var(--color-subtle-background);border-radius:var(--radius-full-pill)}.like-pill-btn{display:inline-flex;align-items:center;gap:var(--spacing-2);height:36px;padding:0 var(--spacing-3);font-family:var(--font-roboto);font-size:14px;font-weight:500;color:var(--color-near-black);background:transparent;border:none;border-radius:var(--radius-full-pill);cursor:pointer}.like-pill-btn:hover{background-color:var(--color-border-grey)}.like-pill-btn--icon{padding:0 var(--spacing-3)}.like-pill-divider{width:1px;height:24px;background-color:var(--color-border-grey)}.action-pill{display:inline-flex;align-items:center;gap:var(--spacing-2);height:36px;padding:0 var(--spacing-4);font-family:var(--font-roboto);font-size:14px;font-weight:500;color:var(--color-near-black);background-color:var(--color-subtle-background);border:none;border-radius:var(--radius-full-pill);cursor:pointer}.action-pill:hover{background-color:var(--color-border-grey)}.description-card{margin-top:var(--spacing-5);padding:var(--spacing-3);background-color:var(--color-subtle-background);border-radius:var(--radius-card)}.description-meta{margin:0 0 var(--spacing-2);font-size:14px;font-weight:500;color:var(--color-near-black)}.description-text{margin:0;font-size:14px;font-weight:400;line-height:20px;color:var(--color-near-black);white-space:pre-wrap}.comments{margin-top:var(--spacing-9)}.comments-count{margin:0 0 var(--spacing-7);font-size:16px;font-weight:700;color:var(--color-near-black)}.comment-add{display:flex;align-items:center;gap:var(--spacing-5);margin-bottom:var(--spacing-9)}.comment-avatar{flex-shrink:0;width:40px;height:40px;border-radius:var(--radius-full-pill);background-color:var(--color-border-grey)}.comment-avatar--me{display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:500;color:var(--color-white);background-color:var(--color-youtube-blue)}.comment-add-input{flex:1;height:32px;padding:0 0 var(--spacing-2);font-family:var(--font-roboto);font-size:14px;color:var(--color-near-black);background:transparent;border:none;border-bottom:1px solid var(--color-border-grey);outline:none}.comment-add-input:focus{border-bottom:2px solid var(--color-near-black)}.comment-list{list-style:none;margin:0;padding:0}.comment{display:flex;gap:var(--spacing-5);margin-bottom:var(--spacing-7)}.comment-body{flex:1;min-width:0}.comment-head{display:flex;align-items:baseline;gap:var(--spacing-2)}.comment-name{font-size:13px;font-weight:500;color:var(--color-near-black)}.comment-time{font-size:12px;font-weight:400;color:var(--color-secondary-grey)}.comment-text{margin:var(--spacing-1) 0 var(--spacing-2);font-size:14px;font-weight:400;line-height:20px;color:var(--color-near-black)}.comment-actions{display:flex;align-items:center;gap:var(--spacing-3)}.comment-action{display:inline-flex;align-items:center;gap:var(--spacing-1);font-family:var(--font-roboto);font-size:12px;font-weight:500;color:var(--color-secondary-grey);background:transparent;border:none;cursor:pointer}.comment-action svg{width:18px;height:18px}.comment-reply{font-family:var(--font-roboto);font-size:13px;font-weight:500;color:var(--color-near-black);background:transparent;border:none;cursor:pointer}.recommended{flex:0 0 30%;max-width:560px;display:flex;flex-direction:column;gap:var(--spacing-3)}.rec-item{display:flex;gap:var(--spacing-3)}.rec-item--link{text-decoration:none;color:inherit;cursor:pointer}.rec-item--link:hover .rec-title{color:var(--color-youtube-blue)}.rec-thumbnail{flex:0 0 56%;aspect-ratio:16 / 9;background-color:var(--color-border-grey);border-radius:var(--radius-chip);overflow:hidden}.rec-thumbnail img{width:100%;height:100%;object-fit:cover;display:block}.rec-text{flex:1;min-width:0}.rec-title{margin:0;font-size:14px;font-weight:500;line-height:20px;color:var(--color-near-black);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.rec-channel{margin:var(--spacing-2) 0 0;font-size:12px;font-weight:400;line-height:18px;color:var(--color-secondary-grey)}.rec-meta{margin:0;font-size:12px;font-weight:400;line-height:18px;color:var(--color-secondary-grey)}@media (max-width: 1000px){.watch-page{flex-direction:column}.recommended{flex:1 1 auto;width:100%;max-width:none}.rec-item{max-width:480px}.rec-thumbnail{flex:0 0 168px}}@media (max-width: 600px){.player-slide-title{font-size:22px}.player-slide-content{max-width:88%}.watch-actions-row{align-items:flex-start}}:root{--color-near-black: #0f0f0f;--color-pure-black: #000000;--color-white: #ffffff;--color-youtube-blue: #065fd4;--color-secondary-grey: #606060;--color-light-grey-surface: #f8f8f8;--color-border-grey: #d3d3d3;--color-hover-border-grey: #c6c6c6;--color-subtle-background: #f1f1f1;--color-youtube-red: #ff0000;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 14px;--spacing-5: 16px;--spacing-6: 18px;--spacing-7: 24px;--spacing-8: 32px;--spacing-9: 40px;--spacing-10: 42px;--spacing-11: 56px;--spacing-12: 72px;--spacing-13: 120px;--radius-pill: 20px;--radius-card: 12px;--radius-chip: 10px;--radius-full-pill: 100px;--radius-avatar: 18px;--font-roboto: "Roboto", Arial, sans-serif;--shadow-search-input-inset: inset 0px 1px 2px 0px rgb(238, 238, 238);--shadow-card-elevation: 0px 8px 23px 0px rgba(0, 0, 0, .2)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-roboto);color:var(--color-near-black);background-color:var(--color-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:inherit;cursor:pointer}ul{margin:0;padding:0;list-style:none}