:root{font-family:Segoe UI,Arial,sans-serif;color:#e7edf7;background:#101724;color-scheme:dark}*{box-sizing:border-box}body{margin:0}header,main{max-width:1240px;margin:auto;padding:24px}header,.heading,.filters{display:flex;align-items:center;justify-content:space-between;gap:20px}header{border-bottom:1px solid #29364b}a{color:#9cbcf9;text-decoration:none}h1{font-size:36px;margin:6px 0}h2{font-size:20px}.eyebrow{color:#8ba4ca;font-size:12px;letter-spacing:2px}.muted,dt{color:#9aaac2}button,input,select{font:inherit;border-radius:8px;padding:10px 14px;border:1px solid #415470}button{background:#315dc5;color:white;cursor:pointer}button:disabled{opacity:.5;cursor:wait}input,select{background:#172235;color:inherit}.summary{display:flex;gap:16px;flex-wrap:wrap;margin:24px 0}.summary div,.panel,.device{background:#182335;border:1px solid #2c3d56;border-radius:14px;padding:22px}.summary div{flex:1;min-width:140px}.summary strong{font-size:30px;display:block}.panel{margin:20px 0}form{display:flex;gap:16px;align-items:end;flex-wrap:wrap}label{display:flex;gap:12px;align-items:center}.devices{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:18px;margin-top:20px}.status{font-size:13px;color:#f0be78}.status.ONLINE{color:#76dfb1}.status.DISABLED{color:#ef8b95}dl{display:grid;grid-template-columns:1fr 1fr;gap:10px}dd{margin:0;overflow-wrap:anywhere}.device button{background:#3e2835;border-color:#855066}.event{padding:12px 0;border-bottom:1px solid #304057;font-size:13px}#code{font-family:monospace;font-size:18px;overflow-wrap:anywhere}#error{background:#582c38;padding:16px;border-radius:8px}@media(max-width:600px){header,main{padding:16px}.heading{display:block}h1{font-size:28px}form,label{align-items:stretch;flex-direction:column}}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.actions button{background:#29426b;border-color:#486795}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}details{margin:12px 0}
#screen{display:block;width:100%;max-height:65vh;background:#080d15;border:1px solid #415470;border-radius:10px}#state{padding:16px;background:#203c38;border-radius:8px;font-weight:600}#session-info{font-size:20px;font-weight:600}

.remote-console{background:#f3f6f4;color:#172e29;color-scheme:light}.remote-console header{border-color:#d8e3dd}.remote-console a{color:#23614d}.remote-console .eyebrow{color:#47715f}.remote-console .muted,.remote-console dt{color:#667970}.remote-console .panel,.remote-console .device,.remote-console .summary div{background:#fff;border-color:#d6e2db}.remote-console input,.remote-console select{background:#fff;border-color:#bdcfc5;color:#172e29}.remote-console button{background:#24644e;border-color:#24644e}.remote-console .summary{gap:10px;margin:18px 0}.remote-console .summary div{padding:12px 20px}.remote-console .summary strong{font-size:23px}.remote-workspace{display:grid;grid-template-columns:1fr 1fr;gap:22px}.remote-workspace .panel{margin:0;padding:28px}.remote-workspace h2{font-size:25px;margin:8px 0 24px}.remote-workspace .stack{display:flex;align-items:stretch;flex-direction:column;gap:8px;width:100%}.remote-workspace input,.remote-workspace select{width:100%;min-height:45px}.identity-line{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0}.identity-line strong{font-size:32px;letter-spacing:2px}.access-mode{background:#eef5f0;border:1px solid #d9e8dd;border-radius:10px;padding:16px;margin-top:22px}.access-mode p{line-height:1.5;margin-bottom:0}.connect-panel form{display:grid;gap:20px}.connect-panel .primary{min-height:48px;font-weight:600}.remote-console details{border-top:1px solid #d6e2db;padding-top:16px}.remote-console summary{cursor:pointer}.remote-console .device-number{font-size:20px;font-weight:600}.remote-console .status.ONLINE{color:#267151}.remote-console #connect-error{background:#ffebe8;color:#952c23;padding:12px;border-radius:8px}.remote-console #error{background:#ffebe8;color:#952c23}.remote-console #remote-viewer{width:100%;height:780px;border:0;border-radius:12px;background:#101724}.remote-console .device button{margin:4px}.remote-console .event{border-color:#d6e2db}#viewer-panel[hidden]{display:none}@media(max-width:760px){.remote-workspace{grid-template-columns:1fr}.identity-line{flex-wrap:wrap}.remote-workspace .panel{padding:20px}.remote-console #remote-viewer{height:700px}}

[hidden]{display:none!important}

.remote-console #state{background:#e6f1e8;color:#183e2c}

#relay-screen{display:block;width:100%;max-height:75vh;object-fit:contain;background:#101923;outline:2px solid transparent}#relay-screen:focus{outline-color:#3475d9}