:root{font-family:Segoe UI,system-ui,sans-serif;color:#e8eef5;background:#0c141c;color-scheme:dark}*{box-sizing:border-box}body{margin:0}header{padding:24px 5vw;border-bottom:1px solid #263542;display:flex;justify-content:space-between;gap:20px}.brand{font-size:20px;font-weight:700}#status{color:#77dbc1;font-size:14px;align-self:center}main{max-width:1400px;padding:60px 5vw 24px;margin:auto}#login{max-width:520px;margin:10px auto 60px}h1{font-size:clamp(32px,5vw,48px);line-height:1.1;letter-spacing:-1.5px}p{color:#acbdcc;line-height:1.6}.eyebrow{font-size:12px;letter-spacing:2px;color:#77dbc1}form{display:grid;gap:22px;margin:36px 0 20px}label{font-size:14px;display:grid;gap:10px}input{padding:15px;border:1px solid #364957;background:#141f29;border-radius:8px;font:inherit;color:white}input:focus{outline:2px solid #77dbc1}button{border:0;border-radius:8px;padding:13px 18px;background:#77dbc1;color:#0c2520;font:inherit;font-weight:600;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.note{font-size:13px}footer{text-align:center;color:#758b9b;padding:24px;font-size:12px}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}.toolbar span{margin-right:auto}.toolbar button{background:#233644;color:#e8eef5;font-size:13px}#viewport{background:#030609;border:1px solid #344958;overflow:auto;border-radius:8px;text-align:center;min-height:200px}canvas{max-width:100%;height:auto;vertical-align:middle;outline:none;touch-action:none}canvas:focus{outline:2px solid #77dbc1;outline-offset:-2px}#viewport:fullscreen{display:flex;align-items:center;justify-content:center}#viewport:fullscreen canvas{max-height:100vh;max-width:100vw;object-fit:contain}[hidden]{display:none!important}@media(max-width:600px){header{padding:18px}.brand{font-size:16px}main{padding-top:30px}.toolbar button{padding:10px}}