@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--navy-800:#1f2937;--navy-700:#334155;--blue-soft:#94a3b8;--blue-text:#e2e8f0;--bg:#f1f5f9;--panel:#fff;--border:#e2e8f0;--text:#0f172a;--muted:#64748b;--accent:#0f172a;--accent-hover:#1e293b;--accent-ink:#fff;--danger:#c23b3b;--danger-bg:#fdecec;--online:#2f9e6a;--online-bg:#e7f7ef;--online-border:#b7e4c7;--offline:#c23b3b;--offline-bg:#fdecec;color:var(--text);background:var(--bg);font-family:Inter,Segoe UI,system-ui,sans-serif;font-size:15px;line-height:1.45}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);min-height:100vh;color:var(--text);margin:0;overflow:hidden}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{background:var(--accent);color:var(--accent-ink);cursor:pointer;border:0;border-radius:8px;padding:.55rem 1.05rem;font-weight:600}button:hover{background:var(--accent-hover)}button.secondary{color:var(--navy-800);background:#fff;border:1px solid #c5d0dc;font-weight:600}button.secondary:hover{background:#eef3f8;border-color:#aebccd}button.danger{border:1px solid var(--danger);color:var(--danger);background:#fff;font-weight:600}button.danger:hover{background:var(--danger-bg)}button:disabled{opacity:.5;cursor:not-allowed}input,select{border:1px solid var(--border);width:100%;color:var(--text);background:#fff;border-radius:8px;padding:.55rem .75rem}input:focus,select:focus{border-color:var(--navy-700);outline:2px solid #1e3a5633}label{color:var(--muted);gap:.35rem;font-size:.85rem;font-weight:500;display:grid}.app{background:var(--bg);grid-template-columns:176px 1fr;height:100vh;display:grid;overflow:hidden}.sidebar{color:var(--blue-text);background:linear-gradient(#0f172a 0%,#111827 100%);border-right:1px solid #94a3b81f;flex-direction:column;height:100vh;padding:0 .55rem .7rem;display:flex;position:sticky;top:0;overflow:hidden}.sidebar-brand{text-align:center;background:#0f172a;border-bottom:1px solid #94a3b81f;flex-direction:column;justify-content:center;align-items:center;gap:.35rem;margin:0 -.55rem;padding:.85rem .85rem .75rem;display:flex}.sidebar-brand-logo{width:min(132px,100%);height:auto;display:block}.sidebar-brand-title{color:#f8fafc;letter-spacing:.01em;font-size:.72rem;font-weight:600;line-height:1.25}.sidebar-nav{flex-direction:column;flex:1;gap:.15rem;margin-top:.65rem;display:flex}.nav-item{color:var(--blue-soft);border-radius:8px;align-items:center;gap:.55rem;padding:.58rem .6rem;font-size:.84rem;font-weight:500;display:flex}.nav-item:hover{color:#f8fafc;background:#94a3b81a}.nav-item.active{color:#f8fafc;background:#38bdf824;font-weight:600}.sidebar-footer{border-top:1px solid #94a3b81f;gap:.3rem;margin-top:auto;padding-top:.7rem;display:grid}.sidebar-user-card{background:#94a3b814;border-radius:8px;align-items:center;gap:.5rem;min-width:0;padding:.4rem .45rem;display:flex}.sidebar-avatar{color:#f8fafc;background:#1e293b;border-radius:7px;flex-shrink:0;place-items:center;width:28px;height:28px;font-size:.78rem;font-weight:700;display:grid}.sidebar-user-name{color:#f8fafc;font-size:.78rem;font-weight:600}.sidebar-user-email{color:var(--blue-soft);word-break:break-all;font-size:.62rem;line-height:1.3}.nav-logout{width:100%;color:var(--blue-soft);cursor:pointer;text-align:left;background:0 0;border:0;border-radius:8px;align-items:center;gap:.5rem;padding:.5rem .55rem;font-size:.8rem;font-weight:500;display:flex}.nav-logout:hover{color:#fecaca;background:#ef444424}.workspace{grid-template-rows:68px 1fr;min-width:0;height:100vh;min-height:0;display:grid;overflow:hidden}.top{border-bottom:1px solid var(--border);z-index:20;background:#fff;justify-content:space-between;align-items:center;gap:1rem;padding:0 1.6rem;display:flex}.top-left{align-items:center;gap:.85rem;min-width:0;display:flex}.top-title{color:var(--navy-800);font-size:1.15rem;font-weight:700}.top-back{color:var(--navy-800);white-space:nowrap}.top-back:hover{color:#0284c7}.top-right{align-items:center;margin-left:auto;display:flex}.top-status{border:1px solid var(--border);background:#f8fafc;border-radius:999px;align-items:center;gap:.45rem;padding:.32rem .7rem;display:inline-flex}.status-dot{background:var(--online);width:7px;height:7px;box-shadow:0 0 0 3px var(--online-bg);border-radius:50%;flex-shrink:0}.status-label{color:var(--online);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;font-size:.72rem;font-weight:700}.top-status-sep{background:#cbd5e1;flex-shrink:0;width:1px;height:.9rem}.top-version{color:var(--navy-700);letter-spacing:.02em;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.72rem;font-weight:600}main{width:100%;min-height:0;padding:1.5rem 1.75rem 2rem;overflow:auto}.center{min-height:100vh;color:var(--muted);background:var(--bg);place-items:center;display:grid}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1.1rem 1.2rem;box-shadow:0 1px 2px #12203308}.row{flex-wrap:wrap;align-items:end;gap:.75rem;display:flex}.row>*{flex:1;min-width:140px}.filter-bar{flex-wrap:nowrap;align-items:end;gap:.65rem;padding:.85rem 1rem;display:flex}.filter-bar .filter-search{flex:1.4 180px;min-width:140px}.filter-bar .filter-field{flex:0 120px;min-width:100px}.filter-bar .filter-actions{flex:none;align-items:end;gap:.5rem;margin-left:auto;display:flex}.filter-bar .filter-actions button{white-space:nowrap;flex:none}.filter-bar label{margin:0}@media (width<=900px){.filter-bar{flex-wrap:wrap}.filter-bar .filter-actions{width:100%;margin-left:0}.filter-bar .filter-actions button{flex:1}}.stack{gap:1rem;display:grid}h1{color:var(--navy-800);margin:0 0 .75rem;font-size:1.55rem;font-weight:700}h2{color:var(--navy-800);margin:0 0 .75rem;font-size:1rem;font-weight:700}.muted{color:var(--muted);font-size:.9rem}.error{color:#8f2222;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:.65rem .8rem}.ok{color:#166534;background:var(--online-bg);border:1px solid var(--online-border);border-radius:8px;padding:.65rem .8rem}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--border);vertical-align:middle;padding:.85rem .75rem}th{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;background:#e9eef5;font-size:.72rem;font-weight:700}td{font-weight:500}.cell-strong{color:var(--text);font-weight:700}.col-narrow{white-space:nowrap;width:1%}.actions{justify-content:flex-end;gap:.4rem;display:flex}.th-actions{text-align:right}.clickable-row{cursor:pointer}.clickable-row:hover td{background:#f1f5f9}.icon-btn{width:34px;height:34px;color:var(--navy-800);cursor:pointer;background:#fff;border:1px solid #c5d0dc;border-radius:8px;place-items:center;padding:0;display:inline-grid}.icon-btn:hover{background:#eef3f8;border-color:#aebccd}.icon-btn.danger{border-color:var(--danger);color:var(--danger);background:#fff}.icon-btn.danger:hover{background:var(--danger-bg)}.key-icon-btn{color:#1e3a5f;background:linear-gradient(#f8fafc 0%,#e8eef5 100%);border-color:#9eb4c9;border-radius:10px;width:38px;height:38px;box-shadow:0 1px 2px #0f172a0f}.key-icon-btn:hover{color:#0f2744;background:linear-gradient(#fff 0%,#dce6f0 100%);border-color:#7f98b0}.modal-backdrop{z-index:100;background:#0f172a73;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal-card{border:1px solid var(--border);background:#fff;border-radius:12px;gap:.65rem;width:min(400px,100%);padding:1.25rem 1.35rem;display:grid;box-shadow:0 18px 40px #0f172a38}.modal-card.wide{width:min(640px,100%)}.modal-card-head{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.modal-card-head h2{margin:0}.device-meta-row{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.device-meta-row .row{flex:1;min-width:0}.modal-card h2{margin:0;font-size:1.1rem}.modal-card .muted{margin:0;line-height:1.45}.modal-actions{justify-content:flex-end;gap:.55rem;margin-top:.45rem;display:flex}button.danger.solid{background:var(--danger);border:1px solid var(--danger);color:#fff}button.danger.solid:hover{background:#a83232;border-color:#a83232}.status-text.offline{color:var(--offline);font-weight:700}.status-text.online{color:var(--online);font-weight:700}.login-wrap{background:linear-gradient(150deg, #0f172a 0%, #1e293b 46%, var(--bg) 46%);place-items:center;min-height:100vh;padding:1rem;display:grid}.login-card{border:1px solid var(--border);background:#fff;border-radius:14px;gap:.9rem;width:min(400px,100%);padding:1.6rem;display:grid;box-shadow:0 16px 40px #060e1838}.login-card h1{margin:0}.login-version{text-align:center;margin:0;font-size:.78rem}.password-field{display:block;position:relative}.password-field input{box-sizing:border-box;width:100%;padding-right:2.75rem}.password-toggle{width:2.1rem;height:2.1rem;color:var(--muted,#64748b);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:0;display:inline-flex;position:absolute;top:50%;right:.35rem;transform:translateY(-50%)}.password-toggle:hover{color:var(--text,#0f172a);background:#0f172a0f}.key-row{align-items:stretch;gap:.65rem;margin-top:.55rem;display:flex}.key-box{word-break:break-all;min-width:0;color:var(--text);background:#f7fafc;border:1px dashed #9eb4c9;border-radius:8px;flex:1;padding:.75rem;font-family:ui-monospace,Consolas,monospace}.key-row button{flex-shrink:0;align-self:center}.playlist-card{gap:1rem;display:grid}.playlist-head{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.playlist-head h2{margin:0 0 .25rem}.playlist-head .muted{margin:0}.playlist-head-meta{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:.25rem;display:flex}.playlist-dirty{color:#b45309;background:#fff7ed;border:1px solid #fdba74;border-radius:999px;padding:.15rem .55rem;font-size:.72rem;font-weight:700}.playlist-grid-du{grid-template-columns:1.1fr 1fr 1fr;gap:.85rem;min-height:280px;display:grid}.du-toggles{flex-shrink:0;gap:.35rem;margin-left:auto;display:flex}.du-toggle{border:1px solid var(--border);color:var(--muted);cursor:pointer;background:#fff;border-radius:999px;align-items:center;gap:.3rem;padding:.2rem .5rem;font-size:.72rem;font-weight:700;display:inline-flex}.du-toggle input{width:auto;margin:0}.du-toggle.on{color:var(--navy-800);background:#eff6ff;border-color:#93c5fd}.playlist-panel{border:1px solid var(--border);background:#f8fafc;border-radius:10px;flex-direction:column;min-height:260px;display:flex;overflow:hidden}.playlist-panel-title{border-bottom:1px solid var(--border);color:var(--navy-800);background:#fff;justify-content:space-between;align-items:center;gap:.5rem;padding:.65rem .85rem;font-size:.88rem;font-weight:700;display:flex}.playlist-list{gap:.35rem;max-height:340px;padding:.65rem;display:grid;overflow:auto}.playlist-empty{text-align:center;flex:1;place-content:center;gap:.35rem;padding:1.5rem 1rem;display:grid}.playlist-empty a{color:#0284c7;font-size:.88rem;font-weight:600}.playlist-item{cursor:pointer;background:#fff;border:1px solid #0000;border-radius:8px;align-items:flex-start;gap:.65rem;padding:.6rem .7rem;display:flex}.playlist-item:hover{border-color:#cbd5e1}.playlist-item.checked{background:#eff6ff;border-color:#93c5fd}.playlist-item-body{gap:.12rem;min-width:0;display:grid}.playlist-order-item{border:1px solid var(--border);background:#fff;border-radius:8px;align-items:center;gap:.65rem;padding:.55rem .65rem;display:flex}.playlist-order-num{background:var(--navy-800);color:#fff;border-radius:999px;flex-shrink:0;place-items:center;width:24px;height:24px;font-size:.72rem;font-weight:700;display:grid}.playlist-order-actions{gap:.3rem;margin-left:auto;display:flex}.playlist-footer{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.85rem;display:flex}@media (width<=1100px){.playlist-grid-du{grid-template-columns:1fr}}.dash-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;display:grid}.dash-stat{background:var(--panel);border:1px solid var(--border);min-height:0;color:inherit;border-radius:10px;align-items:center;gap:.75rem;padding:.7rem .85rem;transition:border-color .12s,background .12s;display:flex}a.dash-stat:hover{background:#f8fafc;border-color:#94a3b8}.dash-stat-icon{width:36px;height:36px;color:var(--navy-800);background:#e2e8f0;border-radius:9px;flex-shrink:0;place-items:center;display:grid}.dash-stat-icon.online{background:var(--online-bg);color:var(--online)}.dash-stat-body{flex:1;min-width:0}.dash-stat-label{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;font-weight:700;line-height:1.2}.dash-stat-row{flex-wrap:wrap;align-items:baseline;gap:.55rem;margin-top:.12rem;display:flex}.dash-stat-value{color:var(--navy-800);font-size:1.35rem;font-weight:700;line-height:1.1}.dash-stat-meta{color:var(--muted);font-size:.78rem;font-weight:500}.hevc-badge{white-space:nowrap;border-radius:999px;align-items:center;padding:.18rem .55rem;font-size:.72rem;font-weight:700;display:inline-flex}.hevc-badge.ok{background:var(--online-bg);color:var(--online);border:1px solid var(--online-border)}.hevc-badge.no{background:var(--offline-bg);color:var(--offline);border:1px solid #fecaca}.upload-card{gap:1.25rem;display:grid}.upload-card-head h2{margin:0 0 .35rem}.upload-card-head .muted{max-width:42rem;margin:0}.upload-form-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);align-items:start;gap:1rem 1.1rem;display:grid}.upload-field{gap:.35rem;min-width:0;display:grid}.upload-field-span2{grid-column:1/-1}.field-label{color:var(--navy-800);font-size:.82rem;font-weight:600}.required-mark{color:var(--danger)}.upload-field.has-error input{border-color:var(--danger);background:#fffbfb}.field-hint{font-size:.8rem;font-weight:500}.field-hint.error{color:#b91c1c}.field-hint.ok{color:var(--online)}.file-picker{background:#f8fafc;border:1px dashed #cbd5e1;border-radius:10px;flex-wrap:wrap;align-items:center;gap:.65rem;padding:.65rem .75rem;display:flex}.file-picker input[type=file]{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.file-picker-btn{cursor:pointer;color:var(--navy-800);background:#fff;border:1px solid #c5d0dc;border-radius:8px;align-items:center;padding:.45rem .85rem;font-size:.85rem;font-weight:600;display:inline-flex}.file-picker-btn:hover{background:#eef3f8}.file-picker-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.upload-form-actions{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:flex-end;gap:.65rem;padding-top:.25rem;display:flex}@media (width<=640px){.upload-form-grid{grid-template-columns:1fr}.upload-field-span2{grid-column:auto}}.upload-progress{gap:.4rem;display:grid}.upload-progress-bar{background:#e2e8f0;border-radius:999px;height:12px;overflow:hidden}.upload-progress-fill{background:linear-gradient(90deg,#0f172a,#0284c7);height:100%;transition:width .25s}.upload-progress-label{color:var(--navy-800);font-size:.85rem;font-weight:600}.health-card-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.75rem;display:flex}.health-card-head h2{margin:0}.health-card-ts{font-size:.82rem}.health-metrics{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:.65rem;display:grid}.health-metric{border:1px solid var(--border);background:#f8fafc;border-radius:10px;gap:.28rem;min-width:0;padding:.7rem .8rem;display:grid}.health-metric-label{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;font-weight:700}.health-metric-value{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:1.05rem;font-weight:700;line-height:1.2;overflow:hidden}.health-meter{background:#e2e8f0;border-radius:999px;height:4px;margin-top:.15rem;display:block;overflow:hidden}.health-meter-fill{border-radius:inherit;background:#334155;height:100%;display:block}.health-metric.temp-ok .health-metric-value{color:var(--online)}.health-metric.temp-warm .health-metric-value{color:#b45309}.health-metric.temp-hot .health-metric-value{color:var(--danger)}.screens-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.screens-grid.screens-count-1{grid-template-columns:minmax(0,1fr);max-width:36rem}.screen-card{border:1px solid var(--border);background:#f8fafc;border-radius:10px;gap:.7rem;min-width:0;padding:.85rem .95rem;display:grid}.screen-card-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.screen-card-title{align-items:center;gap:.5rem;min-width:0;display:flex}.screen-state{text-transform:uppercase;letter-spacing:.04em;color:var(--navy-700);background:#e2e8f0;border-radius:999px;align-items:center;padding:.12rem .45rem;font-size:.72rem;font-weight:700;display:inline-flex}.screen-state.playing{background:var(--online-bg);color:var(--online);border:1px solid var(--online-border)}.screen-now{border:1px solid var(--border);background:#fff;border-radius:8px;gap:.25rem;padding:.65rem .75rem;display:grid}.screen-now-file{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:700;overflow:hidden}.screen-meta-row{justify-content:space-between;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.screen-sequence{gap:.3rem;max-height:180px;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.screen-sequence li{color:var(--muted);background:#fff;border:1px solid #0000;border-radius:7px;grid-template-columns:1.4rem 1fr;align-items:center;gap:.45rem;min-width:0;padding:.35rem .5rem;font-size:.84rem;display:grid}.screen-sequence li.current{color:var(--navy-800);background:var(--online-bg);border-color:var(--online-border);font-weight:700}.screen-seq-num{color:var(--blue-soft);text-align:center;font-size:.72rem;font-weight:700}.screen-sequence li.current .screen-seq-num{color:var(--online)}.screen-seq-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.screen-empty{margin:0;font-size:.85rem}@media (width<=900px){.screens-grid,.screens-grid.screens-count-1{grid-template-columns:1fr;max-width:none}body{overflow:auto}.app{grid-template-columns:1fr;height:auto;overflow:visible}.sidebar{height:auto;position:relative}.workspace{height:auto;overflow:visible}.dash-grid{grid-template-columns:1fr}}