@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,system-ui,sans-serif;color:#edf0f8;background:#0c111b;font-size:16px;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b2a2ff;outline-offset:3px}button{color:inherit;background:#202938;border:1px solid #374054;border-radius:12px;min-height:48px;padding:12px 18px;font-size:.875rem;font-weight:700}button:hover{background:#2b3548}.primary{background:#b7a2ff;color:#181029;border-color:#b7a2ff}.primary:hover{background:#c8b8ff}.ghost{background:transparent}a{color:#c7b8ff}header{height:88px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #252d3b;background:#101621}.brand{display:flex;align-items:center;gap:13px}.mark{background:#b7a2ff;color:#131020;border-radius:11px;padding:10px;font-size:1.25rem;font-weight:800;letter-spacing:-1px}.brand strong{display:block;font-size:1rem}.brand small{color:#9aa5b9;font-size:.8rem}.header-right{font-size:.875rem;color:#a9b2c4}.layout{max-width:1340px;margin:auto;display:grid;grid-template-columns:210px 1fr;min-height:calc(100vh - 88px)}nav{border-right:1px solid #252d3b;padding:32px 18px;display:flex;flex-direction:column;gap:10px}nav button{border:0;background:transparent;text-align:left;color:#a9b2c4;display:flex;align-items:center;gap:12px}nav button.selected{background:#b7a2ff16;color:#cbbbff}nav small{margin:0 18px 10px;color:#6f7e97;letter-spacing:2px;font-size:.75rem}main{padding:36px 40px 80px;min-width:0}.eyebrow{color:#9e8bdc;font-size:.75rem;letter-spacing:2px;font-weight:800;margin:0 0 8px}h1{font-size:2rem;letter-spacing:-1px;margin:0}h2{font-size:1.125rem;margin:0}p{color:#a9b2c4;line-height:1.65}.topline{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:26px}.subline{font-size:.875rem;margin:8px 0 0}.banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px;border:1px solid #685d38;background:#27251c;border-radius:14px;margin-bottom:24px;color:#e5cf93;font-size:.875rem}.banner p{margin:3px 0 0;color:#bcb294;font-size:.875rem}.banner button{white-space:nowrap;border-color:#6a6044;background:transparent;color:#ebdcae}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:28px}.stat{border:1px solid #2c3445;border-radius:15px;padding:20px;background:#141b27}.stat strong{font-size:2rem;display:block;letter-spacing:-1px}.stat span{font-size:.875rem;color:#a9b2c4}.stat:nth-child(2) strong{color:#8cddbf}.stat:nth-child(3) strong{color:#c5b1ff}.toolbar{display:flex;gap:12px;margin-bottom:20px}input,select{width:100%;border:1px solid #333d50;border-radius:12px;background:#141b27;color:#eff2fa;padding:14px;min-height:48px}input::placeholder{color:#8d9bb1}.toolbar select{width:185px}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.card{background:#151d2a;border:1px solid #2d3749;border-radius:17px;padding:22px}.card-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.screenicon{width:46px;height:46px;border-radius:12px;background:#252a43;color:#bdabff;display:grid;place-items:center}.icon{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.badge{font-size:.75rem;font-weight:700;padding:6px 9px;border-radius:7px;background:#243142;color:#b8c6d8}.badge.online{color:#92dbbd;background:#183a32}.badge.offline{color:#efb5a6;background:#392b29}.card .client{margin:23px 0 5px;color:#a7b0c4;font-size:.75rem;letter-spacing:1px;font-weight:700}.card h2{font-size:1.15rem;overflow-wrap:anywhere}.meta{font-size:.875rem;margin:7px 0 22px;color:#8d9bb1}.card-bottom{border-top:1px solid #2a3445;padding-top:16px;display:flex;gap:10px;align-items:center;justify-content:space-between}.enabled{font-size:.875rem;color:#a8b7ce}.card-bottom button{background:#242e41;border-color:#3c4560;padding:10px 14px}.empty{padding:42px 24px;border:1px dashed #414c62;border-radius:16px;text-align:center;grid-column:1/-1}.connection{max-width:650px;background:#151d2a;border:1px solid #2d3749;border-radius:18px;padding:26px}.connection label{display:block;margin:24px 0 9px;font-weight:700;font-size:.875rem}.connection button{margin-top:18px}.hint{font-size:.875rem;color:#9ba7ba}.error{color:#ffb8aa;background:#462a28;border-radius:10px;padding:12px;font-size:.875rem}.success{color:#93dfbc}dialog{border:1px solid #43516a;border-radius:20px;background:#141c2a;color:#eef1fa;width:min(540px,calc(100% - 24px));padding:26px;max-height:85dvh}dialog::backdrop{background:#03060bbc;backdrop-filter:blur(4px)}.dialoghead{display:flex;justify-content:space-between;align-items:center;gap:12px}.dialoghead button{padding:10px 15px}.detailrows{margin:22px 0}.detailrow{padding:14px 0;border-bottom:1px solid #2d3749;display:flex;justify-content:space-between;gap:16px;font-size:.875rem}.detailrow span{color:#9ba7ba}.actions{display:grid;gap:10px}.playlist{list-style:none;padding:0;counter-reset:track}.playlist li{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid #2d3749;font-size:.875rem;overflow-wrap:anywhere}.playlist li:before{counter-increment:track;content:counter(track,decimal-leading-zero);color:#b9a6ff;font-size:.8rem}.playlist small{display:block;color:#9ba7ba;margin-top:3px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#e5eafa;color:#151e30;border-radius:12px;padding:16px 22px;z-index:8;box-shadow:0 10px 40px #0008;max-width:90vw;font-size:.875rem}.footnote{font-size:.75rem;color:#77869d;margin-top:25px}button .icon{vertical-align:middle;margin-right:5px}@media(min-width:1400px){main{padding-top:44px}.cards{gap:20px}}@media(max-width:900px){.layout{grid-template-columns:170px 1fr}main{padding:28px 24px}.cards{grid-template-columns:1fr}.header-right{display:none}}@media(max-width:600px){header{height:76px;padding:0 20px}.layout{display:block}nav{position:fixed;bottom:0;left:0;right:0;z-index:5;background:#111827f5;backdrop-filter:blur(15px);border-right:0;border-top:1px solid #30394a;flex-direction:row;padding:9px 12px max(9px,env(safe-area-inset-bottom));gap:8px}nav small{display:none}nav button{flex:1;flex-direction:column;justify-content:center;gap:5px;font-size:.75rem;padding:7px}main{padding:25px 18px 115px}h1{font-size:1.65rem}.topline{gap:8px}.topline>button{padding:10px 12px}.banner{align-items:flex-start;flex-direction:column;padding:16px;gap:10px}.banner button{min-height:40px;padding:8px 12px}.stats{gap:8px;margin-bottom:23px}.stat{padding:14px 12px}.stat strong{font-size:1.65rem}.stat span{font-size:.75rem}.toolbar{flex-wrap:wrap}.toolbar select{width:100%}.card{padding:20px}.toast{bottom:105px}.connection{padding:20px}dialog{padding:20px}}