@font-face{font-family:Inter;src:url(/assets/InterVariable.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root,.options-sheet{--page: #f4f8fe;--surface: #f9fcff;--surface-raised: #e5edf8;--surface-hover: #d9e6f8;--border: #becde1;--border-soft: #d1e0f2;--text: #11274b;--text-secondary: #405778;--muted: #50647d;--accent: #2463eb;--accent-hover: #184dcc;--focus: #2463eb;--on-accent: #fff;--landscape-opacity: .5;--poster: #d9e6f4;--floating: #f9fcfff2;--badge: #edf4fff0;--error: #a83d2d;--error-surface: #fff0e9;--error-border: #e2b7ab;--danger-surface: #ffede8;--danger-hover: #ffddd4;--lyric-muted: #687e9b;--lyric-hover: #2463eb0a;color-scheme:light}:root[data-theme=dark],:root[data-theme=dark] .options-sheet{--page: #0d1522;--surface: #142236;--surface-raised: #20324b;--surface-hover: #2c4563;--border: #526987;--border-soft: #30445f;--text: #edf4ff;--text-secondary: #c1d1e7;--muted: #a6b8d0;--accent: #8ab9ff;--accent-hover: #a6caff;--focus: #a6caff;--on-accent: #0c223e;--landscape-opacity: .07;--poster: #20324b;--floating: #142236f2;--badge: #142236f2;--error: #ffc1ab;--error-surface: #382a2d;--error-border: #8c5b54;--danger-surface: #432d32;--danger-hover: #59383d;--lyric-muted: #9dafc8;--lyric-hover: #8ab9ff0f;color-scheme:dark}:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);font-synthesis:none;font-weight:400;font-size:16px;background:var(--page)}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-width:320px;position:relative;isolation:isolate;background:var(--page)}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url(/assets/glacier-background.jpg) center bottom / cover no-repeat;opacity:var(--landscape-opacity)}button,input,select{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 18px;border:1px solid transparent;border-radius:12px;background:var(--surface-raised);color:inherit;font-weight:600;cursor:pointer;transition:background .16s,color .16s}button:hover:not(:disabled){background:var(--surface-hover)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.lucide{width:24px;height:24px;flex-shrink:0;stroke-width:1.8px;pointer-events:none}.icon-button{width:48px;height:48px;padding:12px;flex-shrink:0;background:transparent}.primary{color:var(--on-accent);background:var(--accent)}.primary:hover:not(:disabled){background:var(--accent-hover)}.primary:disabled{background:var(--surface-raised);color:var(--muted);opacity:1}input:not([type=range]):not([type=checkbox]):not([type=file]),select{min-height:52px;min-width:0;padding:12px 14px;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:10px}input::placeholder{color:var(--muted);opacity:1}input[type=checkbox]{width:22px;height:22px;accent-color:var(--accent);flex-shrink:0}input[type=range]{accent-color:var(--accent);min-height:32px;cursor:pointer}a{color:var(--accent)}.app-shell{max-width:1600px;min-height:100vh;min-height:100dvh;padding:0 3.5%;margin:auto;display:flex;flex-direction:column}.page-header{height:96px;flex-shrink:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-bottom:1px solid var(--border-soft)}.brand{display:inline-flex;align-items:center;gap:18px;color:var(--text);text-decoration:none;font-size:28px;font-weight:700;letter-spacing:-1.1px;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:60px;height:60px;border-radius:15px;background:var(--accent);color:var(--on-accent);flex-shrink:0}.brand-mark .lucide{width:34px;height:34px}.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:20px;min-width:0}.settings-trigger{width:48px}.mode-nav{display:flex;align-self:stretch;align-items:stretch;gap:22px}.mode-nav button{background:transparent;color:var(--text-secondary);border-radius:0;border:0;border-bottom:2px solid transparent;gap:12px;padding:12px 16px;font-size:19px}.mode-nav button[aria-pressed=true]{color:var(--accent);border-bottom-color:var(--accent)}main{width:100%;padding:32px 0 40px;flex:1;min-height:0}h1,h2,p{overflow-wrap:anywhere}h1{margin:0;font-size:56px;line-height:1.12;letter-spacing:-2px;font-weight:700}h2{font-weight:650;letter-spacing:-.5px}.library-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}.library-heading h1{font-size:44px}.library-actions{display:flex;align-items:center;gap:18px}.add{min-height:52px;padding:12px 24px;font-size:18px}.video-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:16px;row-gap:24px;margin-top:24px}.video-card{min-width:0}.poster{display:block;position:relative;width:100%;aspect-ratio:16 / 9;padding:0;overflow:hidden;border:0;border-radius:12px;background:var(--poster)}.poster img{display:block;width:100%;height:100%;object-fit:cover}.poster:disabled{opacity:1;cursor:default}.poster-symbol{display:grid;place-items:center;width:100%;height:100%;color:var(--muted)}.poster-symbol .lucide{width:44px;height:44px}.poster-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;display:grid;place-items:center;color:#fff;background:#122d4cbf;border:1px solid #ffffff70;border-radius:50%}.poster-play .lucide{width:23px;height:23px;fill:currentColor;margin-left:2px}.poster:hover .poster-play{background:#2463eb}.badge{position:absolute;top:12px;left:12px;padding:6px 9px;border-radius:7px;background:var(--badge);color:var(--text);font-size:12px;font-weight:600}.badge.failed{color:var(--error);background:var(--error-surface)}.card-info{padding:8px 2px 0}.card-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.card-title h2{margin:0;font-size:17px;line-height:1.35;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-title .icon-button{color:var(--text-secondary);margin-right:-8px}.card-info p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.card-info p span{margin:0 8px}.card-info .error{margin-top:8px}.import-controls{margin-top:10px}.import-controls p{font-size:14px}.import-controls button{margin-top:8px;font-size:14px}.notice{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px;margin-top:24px;background:var(--surface-raised);border-radius:12px}.notice strong{font-size:17px}.notice p{margin:6px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.6}.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:68px 24px;margin-top:36px;gap:16px}.empty-icon,.film-icon{width:56px;height:56px;color:var(--accent)}.empty h2{margin:0;font-size:27px}.empty p{margin:0;max-width:460px;color:var(--text-secondary);line-height:1.7}.empty-footnote{font-size:13px;color:var(--muted)}.empty.compact{padding:32px 20px}.eyebrow{font-size:12px;letter-spacing:1.7px;font-weight:650;color:var(--muted)}.back{background:transparent;color:var(--text-secondary);padding-left:0}.watch-heading{margin:24px 0}.watch-heading h1{margin-top:12px;font-size:32px}.file-picker{display:flex;align-items:center;gap:16px;margin:24px 0;font-size:16px}.file-picker input{max-width:100%}input::file-selector-button{border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);min-height:48px;padding:0 16px;margin-right:12px}.app-shell.watching-mode,.app-shell.lyrics-mode{max-width:none;padding:0}.watching-mode>.page-header,.watching-mode>footer,.lyrics-mode>.page-header,.lyrics-mode>footer{display:none}.watching-mode>main,.lyrics-mode>main{padding:0;min-height:100vh;min-height:100dvh}.player{--text: #f5f8ff;--text-secondary: #d8e5f7;--muted: #a9bfda;--surface-raised: #213651;--surface-hover: #324f70;--border: #526c8b;--focus: #a5c7ff;color-scheme:dark;position:relative;width:100%;height:100vh;height:100dvh;color:var(--text);background:#080d16;overflow:hidden}.screen{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.screen canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}.screen-note{position:absolute;z-index:5;display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:min(80%,640px);padding:16px 22px;color:#f5f8ff;background:#12233ced;border:1px solid #5f7b9b;border-radius:12px;line-height:1.6}.screen-note:not(.error){pointer-events:none}.player-heading{position:absolute;top:16px;left:24px;right:24px;display:inline-flex;align-items:center;gap:18px;width:fit-content;max-width:calc(100% - 48px);padding:6px 18px;background:#0b192ed4;border:1px solid #f5f8ff20;border-radius:14px}.player-heading .back{flex-shrink:0;min-height:48px;color:#f5f8ff;padding:0 12px 0 0}.player-heading h1{min-width:0;margin:0;font-size:17px;line-height:1.5;font-weight:500;letter-spacing:-.3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-controls{position:absolute;bottom:24px;left:50%;transform:translate(-50%);width:min(920px,calc(100% - 48px));padding:8px 18px 12px;background:#0b192eeb;border:1px solid #f5f8ff24;border-radius:18px}.player-heading,.player-controls{opacity:1;visibility:visible;transition:opacity .2s,visibility .2s}.player.controls-hidden .player-heading,.player.controls-hidden .player-controls{opacity:0;visibility:hidden;pointer-events:none}.timeline{display:block}.timeline input{display:block;width:100%;margin:0;min-height:32px}.control-row{display:flex;align-items:center;gap:14px}.transport-controls{display:flex;gap:6px;align-items:center}.transport-controls .play{width:52px;height:52px;border-radius:50%}.play .lucide{fill:currentColor}.skip{position:relative;gap:3px;width:58px;padding:8px 2px;font-size:11px}.skip .lucide{width:22px;height:22px}.time{font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}.time span{color:var(--muted)}.volume{margin-left:auto;display:flex;align-items:center;gap:10px}.volume .lucide{width:21px;height:21px}.volume input{width:88px}.player:fullscreen{width:100%;height:100%}.immersive-reveal{position:absolute;z-index:3;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);min-height:48px;gap:5px;padding:8px 16px;color:var(--text-secondary);background:var(--floating);border:1px solid var(--border);border-radius:28px;font-size:13px;font-weight:500}.immersive-reveal .lucide{width:18px;height:18px}.player .immersive-reveal{color:#f1f7ff;background:#102441b8;border-color:#6d86a27a}.player-status{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;color:var(--muted);font-size:13px;margin:22px 0;text-transform:capitalize}.options-sheet{position:fixed;inset:0 0 0 auto;margin:0;width:min(480px,calc(100vw - 32px));max-width:none;height:100dvh;max-height:100dvh;padding:0;overflow:auto;overscroll-behavior:contain;color:var(--text);background:var(--surface);border:0;border-left:1px solid var(--border-soft);border-radius:24px 0 0 24px;box-shadow:-12px 0 60px #142d4c24}.options-sheet::backdrop{background:#11243c70}:root[data-theme=dark] .options-sheet::backdrop,:root[data-theme=dark] .modal::backdrop{background:#030811b3}.options-sheet-heading{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;height:92px;padding:20px 24px;background:var(--surface);border-bottom:1px solid var(--border-soft)}.options-sheet-heading h2{margin:0;font-size:23px}.options-sheet-body{padding:24px}.options-sheet .sheet-description{margin:0 0 20px;font-size:21px;font-weight:600;line-height:1.5;color:var(--text)}.sheet-actions{display:flex;flex-wrap:wrap;gap:12px}.appearance-setting{display:grid;grid-template-columns:1fr minmax(120px,auto);align-items:center;gap:10px 16px;margin:0 0 24px}.appearance-setting label{font-weight:600}.appearance-setting .subtle{grid-column:1 / -1;margin:0}.diagnostics{margin:20px 0;padding:0;border:0;border-top:1px solid var(--border-soft);color:var(--text-secondary);font-size:14px;background:transparent}.diagnostics summary{min-height:56px;padding:18px 0;color:var(--text);cursor:pointer}.diagnostic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}.diagnostic-grid dt{margin-bottom:6px;color:var(--muted)}.diagnostic-grid dd{margin:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.event-list{max-height:260px;overflow:auto;font:12px ui-monospace,monospace}.event-list>div{display:flex;flex-wrap:wrap;gap:12px;padding:10px 0;border-top:1px solid var(--border-soft)}.event-list time{color:var(--muted)}.subtle{font-size:13px;line-height:1.7;color:var(--muted)}.error{color:var(--error)!important}.screen-note.error{color:#ffd6c8!important}.error-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding:16px 20px;border:1px solid var(--error-border);border-radius:12px;background:var(--error-surface);color:var(--error)}.error-banner button{background:transparent}.danger{color:var(--error);background:var(--danger-surface)}.danger:hover:not(:disabled){background:var(--danger-hover)}.modal{width:min(500px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:30px;background:var(--surface);color:var(--text);border:1px solid var(--border-soft);border-radius:20px;box-shadow:0 16px 60px #142d4c35}.modal::backdrop{background:#11243c70}.modal h2{margin:0 0 14px;font-size:27px}.modal p{color:var(--text-secondary);font-size:15px;line-height:1.7}.youtube-dialog label{display:grid;gap:8px;margin-top:24px;font-size:14px}.youtube-dialog input{width:100%}.dialog-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;margin-top:24px}.auth{margin:auto;width:min(100%,520px);padding:40px 16px}.auth h1{font-size:38px;letter-spacing:-1px}.auth form{width:100%;max-width:400px;display:grid;gap:16px;text-align:left}.auth form>label{font-size:14px;font-weight:600}.auth small{color:var(--muted);line-height:1.7}.sign-in-controls{display:grid;gap:10px;font-size:14px}.sign-in-controls label{display:flex;align-items:center;gap:10px;min-height:40px}.sign-in-recovery{background:transparent;color:var(--text-secondary);font-size:14px}footer{min-height:64px;display:flex;align-items:center;border-top:1px solid var(--border-soft);color:var(--muted);font-size:14px;flex-shrink:0}.spinner{display:inline-block;width:22px;height:22px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.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(max-width:1100px){.brand{font-size:23px;gap:12px}.brand-mark{width:50px;height:50px;border-radius:13px}.brand-mark .lucide{width:29px;height:29px}.header-actions{gap:8px}.video-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.mode-nav{gap:8px}.mode-nav button{padding:12px;font-size:17px}.library-actions{gap:10px}.add{font-size:16px;padding:14px 18px}.library-heading h1{font-size:44px}}@media(max-width:900px){.video-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px}.library-heading{align-items:flex-start}.library-actions{flex-direction:column;align-items:stretch}}@media(max-width:600px){.app-shell{padding:0 6%}.page-header{height:auto;min-height:120px;grid-template-columns:1fr auto;gap:0 12px}.brand{font-size:20px;gap:10px;letter-spacing:-.7px}.brand-mark{width:42px;height:42px;border-radius:11px}.brand-mark .lucide{width:26px;height:26px}.page-header .header-actions{grid-column:2;grid-row:1}.settings-trigger{padding:12px;width:48px;border:0}.mode-nav{grid-row:2;grid-column:1 / -1;justify-content:center;gap:32px;min-height:60px}.mode-nav button{font-size:17px;min-width:110px}main{padding-top:24px}.library-heading{align-items:center;gap:12px}.library-heading h1{font-size:30px;letter-spacing:-1px}.library-actions{flex-direction:row;width:auto;flex-shrink:0;gap:12px}.add{min-height:52px;font-size:14px;padding:12px 10px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:24px;gap:20px 12px}.card-title h2{font-size:16px}.card-info p{font-size:12px}.card-info p span{margin:0 4px}.notice{flex-direction:column;align-items:stretch;gap:12px}.empty{padding:36px 0}.file-picker{align-items:flex-start;flex-direction:column}.watch-heading h1{font-size:27px}.player-heading{top:12px;left:12px;right:12px;max-width:calc(100% - 24px);padding:4px 12px;gap:8px}.player-heading h1{font-size:14px}.player-heading .back{font-size:13px;padding-right:6px;gap:4px}.player-heading .back .lucide{width:18px}.player-controls{width:calc(100% - 24px);bottom:16px;padding:6px 10px 10px;border-radius:15px}.control-row{display:grid;grid-template-columns:minmax(0,1fr) 48px 48px;gap:6px 8px}.transport-controls{gap:2px}.transport-controls .icon-button{width:48px}.time{grid-column:2 / 4;justify-self:end;font-size:12px}.volume{grid-column:1;grid-row:2;margin-left:0;min-width:0}.volume input{width:100%;max-width:110px}.player-controls .fullscreen{margin-left:0}.options-sheet{width:100%;max-height:calc(100dvh - 24px);height:auto;inset:auto 0 0;border-left:0;border-top:1px solid var(--border-soft);border-radius:24px 24px 0 0}.options-sheet-heading{height:80px;padding:16px 20px}.options-sheet-heading h2{font-size:22px}.options-sheet-body{padding:20px}.modal{padding:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:0s!important;scroll-behavior:auto!important}}