:root{color-scheme:dark;--bg:#0c1118;--panel:#151d27;--border:#2a3645;--text:#edf2f8;--muted:#9aa9ba;--accent:#e8f16c;--bad:#ffb094;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}[hidden]{display:none!important}button,input,select{font:inherit}button{border:0;border-radius:9px;background:var(--accent);color:#141b16;font-weight:700;padding:12px 18px;cursor:pointer;transition:filter .15s}button:hover{filter:brightness(1.08)}button:disabled{opacity:.45;cursor:wait}.secondary{background:#243141;color:var(--text);border:1px solid #3a495c}input,select{width:100%;border:1px solid #435166;border-radius:7px;background:#0e151e;color:var(--text);padding:10px;min-height:42px}input:focus,select:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input[type=color]{padding:4px}input[type=range]{padding:4px}label{display:block;font-size:13px;color:#bec9d6}label input,label select{display:block;margin-top:7px}p{color:var(--muted);line-height:1.65}h1{font-size:clamp(32px,4.5vw,56px);letter-spacing:-.055em;line-height:1.08;margin:16px 0}h2{font-size:20px;letter-spacing:-.025em;margin:0}small{color:var(--muted);line-height:1.6}.eyebrow{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.17em}.controller main{max-width:1320px;margin:auto;padding:0 36px}header{height:88px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}.brand{text-decoration:none;color:var(--text);font-size:14px;font-weight:800;letter-spacing:.08em}.brand span{color:var(--muted);font-weight:400;letter-spacing:.02em}.connection{font-size:12px;color:var(--muted)}.connection.online{color:var(--accent)}.intro{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:48px 0 34px}.intro p{max-width:540px;font-size:14px}.join-card{display:flex;flex-direction:column;gap:14px;min-width:260px;border-left:2px solid var(--accent);padding:20px 24px;background:var(--panel);border-radius:0 10px 10px 0}.join-card strong{font-size:23px;letter-spacing:-.025em}.join-card b{font-family:monospace;color:var(--accent);letter-spacing:.15em;font-size:18px}.join-card>span:not(.eyebrow){color:var(--muted);font-size:13px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:12px;margin-bottom:24px;overflow:hidden}.metrics>div{padding:20px 24px;border-right:1px solid var(--border)}.metrics>div:last-child{border:0}.metrics span{font-size:9px;font-weight:700;letter-spacing:.11em;color:var(--muted);display:block}.metrics strong{display:block;margin-top:9px;font-size:30px;letter-spacing:-.04em}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:25px}.work-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;margin-bottom:24px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.section-heading>span{font-size:11px;color:var(--muted)}.section-heading p{font-size:12px;margin:6px 0 0}.badge{padding:5px 10px;border:1px solid var(--border);border-radius:20px}.presets{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px}.preset{text-align:left;display:flex;flex-direction:column;gap:6px;background:#0e151e;border:1px solid var(--border);color:var(--text);padding:14px 12px;font-size:12px;min-height:78px}.preset small{font-size:10px;font-weight:400}.preset.selected{border-color:var(--accent);background:#262e23}.preset.selected strong{color:var(--accent)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}output{font-size:11px;color:var(--muted)}#apply{width:100%;margin-top:4px}.transport{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}.transport button{flex:1;padding:10px 8px;font-size:12px}.action-message{font-size:12px;margin:14px 0 0;min-height:20px}.preview-card{display:flex;flex-direction:column}.preview-wrap{display:flex;justify-content:center;align-items:center;flex:1;background:#080b10;border-radius:8px;padding:16px;min-height:370px}#preview{width:auto;height:410px;max-width:100%;object-fit:contain;box-shadow:0 0 0 1px #334154}.preview-card p{font-size:11px;margin:16px 0 0}.clients{margin-bottom:26px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font-size:10px;letter-spacing:.04em;color:var(--muted);font-weight:500;padding:12px 12px;border-bottom:1px solid var(--border)}td{font-size:12px;padding:14px 12px;border-bottom:1px solid #26303d}td input{width:150px;font-size:12px;min-height:30px;padding:5px 7px}.status{padding:4px 8px;border-radius:12px;background:#332a24;color:var(--bad);font-size:11px}.status.ready{background:#263525;color:var(--accent)}.client-id{display:block;font-family:monospace;color:var(--muted);font-size:9px;margin-top:5px}#empty{font-size:13px}footer{display:flex;justify-content:space-between;gap:16px;font-size:10px;color:var(--muted);padding:0 0 30px}.login{max-width:520px;margin:70px auto}.login h1{font-size:36px}.login button{margin-top:18px}.display{background:#000;display:flex;align-items:center;justify-content:center;height:100vh;height:100dvh;overflow:hidden;touch-action:manipulation}.display canvas{display:block;flex:none}.join-panel{position:fixed;z-index:2;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:stretch;max-width:440px;margin:auto;background:var(--bg);padding:32px;gap:16px}.join-panel h1{margin:4px 0}.join-panel p{font-size:14px;margin:0}.join-panel input{font-size:25px;text-align:center;letter-spacing:.15em;text-transform:uppercase}.join-panel small{font-size:11px;text-align:center}.offline{position:fixed;top:env(safe-area-inset-top,0);left:0;right:0;padding:12px;background:#662e22;color:white;text-align:center;font-size:12px;z-index:3}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:800px){.controller main{padding:0 18px}.intro{flex-direction:column;align-items:stretch;gap:12px;padding:30px 0}.join-card{min-width:0}.work-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.metrics>div{padding:15px;border-bottom:1px solid var(--border)}.metrics strong{font-size:25px}.card{padding:18px}.brand span{display:none}.section-heading{align-items:flex-start}.clients .section-heading{flex-direction:column}.preview-wrap{min-height:0}#preview{height:380px}footer{flex-direction:column}.presets{grid-template-columns:repeat(2,1fr)}}