:root{--ch1-color: #1D9E75;--ch2-color: #2196F3;--ch3-color: #FF9800;--ch4-color: #9C27B0;--bg-primary: #111111;--bg-surface: rgba(0, 0, 0, .85);--bg-overlay: rgba(0, 0, 0, .75);--bg-modal: rgba(0, 0, 0, .92);--text-primary: #FFFFFF;--text-secondary: #B0B0B0;--text-muted: #666666;--accent-warning: #FF5722;--accent-success: #4CAF50;--accent-info: #2196F3;--space-xs: 8px;--space-sm: 16px;--space-md: 24px;--space-lg: 40px;--space-xl: 64px;--font-body: 24px;--font-lg: 32px;--font-xl: 40px;--font-xxl: 56px;--font-title: 72px;--fade-duration: .4s;--overlay-duration: .3s;--focus-ring-color: #FFFFFF;--focus-ring-width: 4px;--focus-ring-offset: 4px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100vw;height:100vh;overflow:hidden;background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--font-body);line-height:1.4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;cursor:none}#video-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1;background:#000;transition:opacity var(--fade-duration) ease-in-out}#video-container video,#video-container iframe{width:100%;height:100%;object-fit:contain;display:block}#video-container.fade-out{opacity:0}#video-container.fade-in{opacity:1}#channel-overlay{position:fixed;bottom:var(--space-lg);left:var(--space-lg);z-index:10;display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--bg-overlay);border-radius:16px;border-left:6px solid var(--ch1-color);opacity:0;transform:translateY(20px);transition:opacity var(--overlay-duration) ease-out,transform var(--overlay-duration) ease-out;pointer-events:none}#channel-overlay.visible{opacity:1;transform:translateY(0)}#channel-overlay .channel-number{font-size:var(--font-xxl);font-weight:700;min-width:80px;text-align:center}#channel-overlay .channel-info{display:flex;flex-direction:column;gap:4px}#channel-overlay .channel-name{font-size:var(--font-lg);font-weight:600}#channel-overlay .channel-program{font-size:var(--font-body);color:var(--text-secondary)}#channel-overlay[data-channel="1"]{border-left-color:var(--ch1-color)}#channel-overlay[data-channel="2"]{border-left-color:var(--ch2-color)}#channel-overlay[data-channel="3"]{border-left-color:var(--ch3-color)}#channel-overlay[data-channel="4"]{border-left-color:var(--ch4-color)}#guide-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:20;background:var(--bg-surface);display:none;flex-direction:column;opacity:0;transition:opacity var(--overlay-duration) ease-out}#guide-overlay.visible{display:flex;opacity:1}#guide-overlay .guide-header{padding:var(--space-lg) var(--space-xl);display:flex;align-items:center;justify-content:space-between}#guide-overlay .guide-title{font-size:var(--font-xxl);font-weight:700}#guide-overlay .guide-time{font-size:var(--font-lg);color:var(--text-secondary)}#guide-overlay .guide-grid{flex:1;padding:0 var(--space-xl) var(--space-lg);display:flex;flex-direction:column;gap:var(--space-sm);overflow:hidden}#guide-overlay .guide-row{display:flex;align-items:stretch;gap:var(--space-sm);min-height:120px}#guide-overlay .guide-channel-label{width:200px;min-width:200px;display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm);font-size:var(--font-lg);font-weight:600;border-radius:12px}#guide-overlay .guide-channel-label .channel-icon{font-size:var(--font-xl)}#guide-overlay .guide-programs{flex:1;display:flex;gap:4px;overflow:hidden}#guide-overlay .guide-slot{flex:1;padding:var(--space-sm) var(--space-md);background:#ffffff14;border-radius:12px;display:flex;flex-direction:column;justify-content:center;gap:4px;overflow:hidden;transition:background .15s ease}#guide-overlay .guide-slot.now-playing{background:#ffffff2e;border:2px solid rgba(255,255,255,.4)}#guide-overlay .guide-slot.focused{background:#ffffff38;border:3px solid var(--focus-ring-color);box-shadow:0 0 16px #ffffff40;transform:scale(1.02);z-index:2}#guide-overlay .guide-row.focused-row{background:#ffffff0a;border-radius:12px}#guide-overlay .guide-slot:focus{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}#guide-overlay .guide-slot .slot-title{font-size:var(--font-body);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#guide-overlay .guide-slot .slot-time{font-size:18px;color:var(--text-secondary)}#lock-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:50;background:var(--bg-primary);display:none;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);opacity:0;transition:opacity var(--fade-duration) ease-in-out}#lock-screen.visible{display:flex;opacity:1}#lock-screen .lock-icon{font-size:120px}#lock-screen .lock-message{font-size:var(--font-xxl);font-weight:600;text-align:center;max-width:800px;line-height:1.3}#lock-screen .lock-submessage{font-size:var(--font-lg);color:var(--text-secondary);text-align:center}#lock-screen.visible .lock-icon{animation:lock-float 4s ease-in-out infinite}@keyframes lock-float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}#countdown-overlay{position:fixed;bottom:var(--space-lg);right:var(--space-lg);z-index:30;display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--bg-overlay);border-radius:12px;opacity:0;transform:translateY(20px);transition:opacity var(--overlay-duration) ease-out,transform var(--overlay-duration) ease-out;pointer-events:none}#countdown-overlay.visible{opacity:1;transform:translateY(0)}#countdown-overlay.subtle{padding:var(--space-xs) var(--space-sm)}#countdown-overlay.subtle .countdown-text{font-size:20px}#countdown-overlay.prominent{padding:var(--space-md) var(--space-lg);background:#ff5722d9}#countdown-overlay.prominent .countdown-text{font-size:var(--font-lg);font-weight:600}#countdown-overlay .countdown-icon{font-size:var(--font-lg)}#countdown-overlay .countdown-text{font-size:var(--font-body);color:var(--text-primary)}#cap-warning{position:fixed;top:var(--space-lg);left:50%;transform:translate(-50%) translateY(-100px);z-index:35;padding:var(--space-md) var(--space-xl);background:var(--accent-warning);border-radius:16px;font-size:var(--font-lg);font-weight:600;text-align:center;white-space:nowrap;opacity:0;transition:opacity var(--overlay-duration) ease-out,transform var(--overlay-duration) ease-out;pointer-events:none}#cap-warning.visible{opacity:1;transform:translate(-50%) translateY(0)}#pin-prompt{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:100;background:var(--bg-modal);display:none;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);opacity:0;transition:opacity var(--overlay-duration) ease-out}#pin-prompt.visible{display:flex;opacity:1}#pin-prompt .pin-title{font-size:var(--font-xxl);font-weight:700}#pin-prompt .pin-subtitle{font-size:var(--font-lg);color:var(--text-secondary)}#pin-prompt .pin-dots{display:flex;gap:var(--space-md)}#pin-prompt .pin-dot{width:32px;height:32px;border-radius:50%;border:3px solid var(--text-primary);background:transparent;transition:background .15s ease}#pin-prompt .pin-dot.filled{background:var(--text-primary)}#pin-prompt .pin-error{font-size:var(--font-body);color:var(--accent-warning);min-height:36px}#pin-prompt .pin-keypad{display:grid;grid-template-columns:repeat(3,100px);gap:var(--space-sm);margin-top:var(--space-md)}#pin-prompt .pin-key{width:100px;height:80px;display:flex;align-items:center;justify-content:center;font-size:var(--font-xl);font-weight:600;background:#ffffff1a;border:2px solid transparent;border-radius:12px;color:var(--text-primary);cursor:pointer;transition:background .15s ease,border-color .15s ease}#pin-prompt .pin-key:hover,#pin-prompt .pin-key:focus{background:#fff3}#pin-prompt .pin-key:focus{outline:none;border-color:var(--focus-ring-color)}#login-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:200;background:#1d1d2b;display:none;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity var(--fade-duration) ease-in-out}#login-screen.visible{display:flex;opacity:1}#login-screen .login-content{display:flex;flex-direction:column;align-items:center;gap:var(--space-xl);width:100%;max-width:1200px;padding:0 var(--space-xl)}#login-screen .login-branding{text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-sm)}#login-screen .login-logo{font-size:80px;font-weight:800;letter-spacing:2px;color:var(--text-primary)}#login-screen .login-tagline{font-size:var(--font-xl);color:var(--text-secondary);font-weight:500}#login-screen .login-columns{display:flex;align-items:stretch;gap:0;width:100%}#login-screen .login-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);padding:var(--space-lg) var(--space-xl)}#login-screen .login-col-title{font-size:var(--font-lg);font-weight:600;color:var(--text-secondary);text-align:center}#login-screen .login-divider{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-md) 0;min-width:60px}#login-screen .login-divider-line{flex:1;width:2px;background:#ffffff26}#login-screen .login-divider-text{font-size:var(--font-body);font-weight:700;color:var(--text-muted);padding:var(--space-sm) 0}#login-screen .login-form{display:flex;flex-direction:column;gap:var(--space-sm);width:100%;max-width:400px}#login-screen .login-label{font-size:20px;color:var(--text-secondary);font-weight:500}#login-screen .login-input{width:100%;padding:var(--space-md);font-size:var(--font-body);font-family:inherit;color:var(--text-primary);background:#ffffff14;border:2px solid rgba(255,255,255,.15);border-radius:12px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}#login-screen .login-input::placeholder{color:var(--text-muted)}#login-screen .login-input:focus,#login-screen .login-input.login-focused{border-color:var(--focus-ring-color);box-shadow:0 0 0 3px #ffffff26}#login-screen .login-button{margin-top:var(--space-sm);padding:var(--space-md) var(--space-lg);font-size:var(--font-lg);font-weight:700;font-family:inherit;color:#fff;background:#1d9e75;border:3px solid transparent;border-radius:12px;cursor:pointer;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}#login-screen .login-button:hover{background:#24b888}#login-screen .login-button:focus,#login-screen .login-button.login-focused{border-color:var(--focus-ring-color);box-shadow:0 0 0 3px #ffffff26}#login-screen .login-button:disabled{opacity:.6;cursor:default}#login-screen .login-error{font-size:20px;color:var(--accent-warning);min-height:28px;text-align:center}#login-screen .login-qr-container{width:200px;height:200px;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border-radius:16px;overflow:hidden}#login-screen .login-qr-img{width:200px;height:200px;display:block}#login-screen .login-qr-instruction{font-size:20px;color:var(--text-secondary);text-align:center;line-height:1.5}#login-screen .login-qr-instruction strong{color:var(--text-primary)}#login-screen .login-qr-code{font-size:var(--font-lg);color:var(--text-secondary);text-align:center}#login-screen .login-qr-code strong{font-size:var(--font-xl);font-weight:800;letter-spacing:6px;color:#1d9e75;font-family:monospace,-apple-system,BlinkMacSystemFont,sans-serif}#login-screen .login-qr-status{font-size:20px;color:var(--text-muted);display:flex;align-items:center;gap:4px}#login-screen .login-dots:after{content:"";animation:login-loading-dots 1.5s steps(4,end) infinite}@keyframes login-loading-dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}to{content:""}}#login-screen .login-footer{font-size:20px;color:var(--text-muted);text-align:center}#login-screen .login-footer strong{color:var(--text-secondary)}#login-screen .login-offline-msg{font-size:var(--font-xl);color:var(--accent-warning);text-align:center;padding:var(--space-xl)}*:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}*:focus:not(:focus-visible){outline:none}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}#guide-overlay .guide-detail-panel{position:absolute;bottom:40px;left:40px;right:40px;padding:var(--space-md) var(--space-lg);background:#000000d9;border-left:5px solid var(--text-secondary);border-radius:12px;display:flex;flex-direction:column;gap:6px;min-height:80px;z-index:10}#guide-overlay .guide-detail-panel .detail-channel{font-size:20px;font-weight:600}#guide-overlay .guide-detail-panel .detail-title{font-size:var(--font-lg);font-weight:700;color:var(--text-primary)}#guide-overlay .guide-detail-panel .detail-meta{font-size:20px;color:var(--text-secondary)}#guide-overlay .guide-detail-panel .detail-description{font-size:20px;color:var(--text-secondary);line-height:1.4;max-width:900px}#guide-overlay .guide-detail-panel .detail-empty{font-size:var(--font-body);color:var(--text-muted)}#guide-overlay .guide-time-markers{min-height:36px;margin-bottom:var(--space-xs)}#guide-overlay .guide-markers{height:36px}#countdown-overlay.prominent{animation:countdown-pulse 1.5s ease-in-out infinite}@keyframes countdown-pulse{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(0) scale(1.05)}}