:root{color:#172026;background:#eef2f3;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}main{width:min(1220px,100vw - 32px);margin:0 auto;padding:28px 0 44px}.topbar{justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}h1,h2,h3,h4,p{margin:0}h1{font-size:30px;line-height:1.1}h2{font-size:18px}h3{font-size:17px}.topbar p,.deviceHeader p,.empty,.sectionTitle span,.deviceMeta,.mediaRow small{color:#65727c}button{color:#fff;min-height:42px;font:inherit;cursor:pointer;background:#176f67;border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;font-weight:750;display:inline-flex}button:disabled{opacity:.5;cursor:not-allowed}.iconButton{color:#172026;background:#fff;border:1px solid #cdd6dc;place-items:center;width:42px;height:42px;display:grid}.metrics,.grid{gap:14px;margin-bottom:14px;display:grid}.metrics{grid-template-columns:repeat(4,1fr)}.grid{grid-template-columns:1fr 1fr}.metrics div,.panel{background:#fff;border:1px solid #dce3e7;border-radius:8px;box-shadow:0 10px 28px #1c262c0f}.metrics div{align-items:center;gap:12px;min-height:84px;padding:18px;display:flex}.metrics strong{font-size:26px}.metrics span{color:#596a72}.panel{padding:20px}.wide{margin-top:14px}.sectionTitle{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.stack{gap:12px;display:grid}label{color:#3f4f58;gap:6px;font-weight:650;display:grid}input{width:100%;height:42px;font:inherit;border:1px solid #cbd5da;border-radius:8px;padding:0 12px}.fileInput,.compactFile{color:#176f67;cursor:pointer;border:1px dashed #aab8bf;border-radius:8px}.fileInput{place-items:center;min-height:74px}.compactFile{justify-content:center;align-items:center;gap:8px;min-height:42px;padding:0 12px;display:inline-flex}.fileInput input,.compactFile input{display:none}.waitingList{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.waitingList span{color:#176f67;letter-spacing:1px;background:#edf7f5;border-radius:8px;padding:6px 10px;font-weight:800}.deviceList{gap:12px;display:grid}.device{border:1px solid #dce3e7;border-radius:8px;padding:16px}.deviceHeader,.deviceActions,.deviceMeta{align-items:center;gap:10px;display:flex}.deviceHeader{justify-content:space-between;align-items:flex-start;margin-bottom:10px}.deviceTitle{min-width:0}.deviceTitle p{overflow-wrap:anywhere}.deviceActions{flex-wrap:wrap;justify-content:flex-end}.deviceMeta{flex-wrap:wrap;margin-bottom:14px;font-size:13px}.nowPlaying{background:#edf7f5;border:1px solid #b7d8d3;border-radius:8px;gap:8px;margin-bottom:14px;padding:12px;display:grid}.nowPlaying>div:first-child{align-items:center;gap:10px;min-width:0;display:flex}.nowPlaying strong,.nowPlaying small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.nowPlaying strong{color:#0d4e49}.nowPlaying small,.nowPlaying>span{color:#56716d;font-size:13px}.progressTrack{background:#cfe6e2;border-radius:999px;height:6px;overflow:hidden}.progressTrack div{border-radius:inherit;background:#176f67;height:100%}.renameRow{grid-template-columns:minmax(180px,260px) 34px 34px;gap:8px;display:grid}.status{border-radius:8px;align-items:center;gap:6px;padding:6px 9px;font-size:13px;font-weight:750;display:inline-flex}.online{color:#0d6b45;background:#e9f8ef}.offline{color:#8b3c25;background:#fff0e9}.playlistOrder{background:#fbfcfc;border:1px solid #dce3e7;border-radius:8px;gap:8px;margin-bottom:14px;padding:12px;display:grid}.playlistOrder h4{color:#3f4f58;font-size:14px}.orderRow{grid-template-columns:28px minmax(0,1fr) 34px 34px 34px;align-items:center;gap:8px;min-height:44px;display:grid}.orderRow>span{color:#176f67;background:#edf7f5;border-radius:8px;place-items:center;width:28px;height:28px;font-weight:800;display:grid}.orderRow strong,.orderRow small,.mediaRow strong,.mediaRow small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.orderRow small{color:#65727c}.miniButton{color:#172026;background:#fff;border:1px solid #cbd5da;width:34px;min-height:34px;padding:0}.miniButton.success{color:#176f67}.miniButton.danger{color:#9f3326}.deleteDeviceButton{color:#9f3326;background:#fff7f4;border:1px solid #f0c5bb;min-height:34px;padding:0 10px}.mediaPicker{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;display:grid}.media{color:#172026;text-align:left;background:#f7f9fa;border:1px solid #dce3e7;flex-direction:column;align-items:flex-start;min-height:82px;padding:12px}.media span,.media small,.media strong{overflow-wrap:anywhere;max-width:100%}.media small{color:#65727c}.media strong{color:#176f67;align-items:center;gap:6px;margin-top:6px;font-size:13px;display:inline-flex}.media.selected{color:#0d4e49;background:#edf7f5;border-color:#176f67}.searchBox{background:#fff;border:1px solid #cbd5da;border-radius:8px;grid-template-columns:32px 1fr;align-items:center;width:min(300px,100%);display:grid}.searchBox svg{color:#65727c;margin-left:10px}.searchBox input{border:0;height:40px}.uploadRow{grid-template-columns:minmax(180px,1fr) minmax(180px,1.4fr) 120px;gap:10px;margin-bottom:14px;display:grid}.mediaTable{gap:8px;display:grid}.mediaRow{border:1px solid #dce3e7;border-radius:8px;grid-template-columns:42px minmax(0,1fr) 150px 34px 94px;align-items:center;gap:10px;min-height:58px;padding:8px;display:grid}.typeBadge{color:#176f67;background:#edf7f5;border-radius:8px;place-items:center;width:42px;height:42px;display:grid}.previewButton{color:#176f67;background:#edf7f5;border:1px solid #b7d8d3;min-height:34px;padding:0 10px}.modalBackdrop{z-index:20;background:#0a1216a8;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.previewModal{background:#fff;border-radius:8px;gap:14px;width:min(900px,100%);max-height:min(720px,100vh - 48px);padding:16px;display:grid;box-shadow:0 20px 70px #00000047}.previewHeader{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.previewHeader p{color:#65727c}.previewMedia{object-fit:contain;background:#000;border-radius:8px;width:100%;max-height:calc(100vh - 160px)}.mediaRow>span{color:#65727c;align-items:center;gap:6px;font-size:13px;display:inline-flex}@media (width<=960px){main{width:min(100vw - 20px,1220px);padding-top:18px}.metrics,.grid,.uploadRow{grid-template-columns:1fr}.sectionTitle,.deviceHeader{flex-direction:column;align-items:flex-start}.deviceActions{justify-content:flex-start}.mediaRow{grid-template-columns:42px minmax(0,1fr) 34px}.mediaRow>span,.previewButton{display:none}}