.console-head{padding:62px 32px 30px;display:grid;grid-template-columns:1fr 330px;gap:35px;align-items:end}.console-head h1{margin-bottom:10px}.support-card{padding:22px;border-radius:17px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.support-card b,.support-card span{display:block}.support-card span{color:var(--muted);font-size:13px;margin-top:7px}.support-card.ok{border-color:#78d6ae;background:#edfbf5}.support-card.bad{border-color:#ef9aa4;background:#fff2f4}.device-connect{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 20px 16px}.device-connect article{display:grid;grid-template-columns:auto 1fr auto auto;gap:13px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:19px;box-shadow:var(--shadow)}.device-dot{width:12px;height:12px;border-radius:50%;background:#aab1c3}.connected .device-dot{background:#21a86f;box-shadow:0 0 0 5px #21a86f20}.device-connect b,.device-connect small{display:block}.device-connect small{color:var(--muted);margin-top:4px}.device-connect button,.panel-title button{border:0;background:var(--blue);color:#fff;border-radius:9px;padding:10px 12px;cursor:pointer}.device-connect .disconnect,.panel-title button:first-child{background:#edf0f7;color:var(--ink)}button:disabled{opacity:.45;cursor:not-allowed}.notice{margin:0 20px 18px;background:#fff8e9;border:1px solid #f3d9a8;border-radius:15px;padding:15px 20px;display:flex;gap:17px}.notice p{margin:0;color:#755a2c}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 20px 18px}.metrics article{background:#fff;border-radius:18px;padding:22px;box-shadow:var(--shadow)}.metrics>article>span{font-size:12px;color:var(--muted);font-weight:800}.metrics>article>b{display:block;font-size:32px;margin:18px 0 4px;color:var(--blue)}.metrics>article>small{color:var(--muted)}.metrics dl{display:grid;grid-template-columns:1fr auto;gap:7px;font-size:12px;border-top:1px solid var(--line);padding-top:14px}.metrics dt{color:var(--muted)}.metrics dd{margin:0;font-weight:750}.plot-panel,.console-grid article{background:#fff;border-radius:20px;padding:24px;box-shadow:var(--shadow)}.plot-panel{margin:0 20px 18px}.panel-title{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:14px}.panel-title span{font-size:10px;letter-spacing:1.6px;color:var(--blue);font-weight:800}.panel-title h2{margin:4px 0;font-size:21px}.plot-panel canvas{display:block;width:100%;height:360px;background:#0d1328;border-radius:13px;margin-top:17px}.legend{display:flex;gap:14px;align-items:center;margin-top:10px;font-size:12px}.legend span:before{content:"";display:inline-block;width:14px;height:3px;margin-right:5px;vertical-align:middle}.legend .gx:before{background:#55d6ff}.legend .gy:before{background:#8fffbd}.legend .gz:before{background:#f3c969}.legend small{margin-left:auto;color:var(--muted)}.console-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:18px;margin:0 20px 70px}.console-grid ul{padding-left:20px;line-height:2;color:var(--muted)}#log{background:#0d1328;color:#b9f4df;padding:16px;border-radius:12px;min-height:180px;max-height:250px;overflow:auto;white-space:pre-wrap}.help{margin-top:0}
@media(max-width:900px){.console-head,.device-connect,.console-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.device-connect article{grid-template-columns:auto 1fr}.device-connect button{grid-column:span 2}.plot-panel canvas{height:280px}}
@media(max-width:540px){.metrics{grid-template-columns:1fr}.notice{display:block}.plot-panel canvas{height:230px}}
.vision-panel{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,.8fr);gap:24px;background:#fff;border-radius:28px;padding:24px;box-shadow:0 18px 50px rgba(30,45,90,.08);margin:24px 0}.vision-stage{position:relative;overflow:hidden;min-height:360px;background:#0d1328;border-radius:20px}.vision-stage video,.vision-stage canvas{display:block;width:100%;height:100%;object-fit:cover}.vision-stage video{transform:scaleX(-1)}.vision-stage canvas{position:absolute;inset:0;transform:scaleX(-1);pointer-events:none}.vision-stage #cameraPlaceholder{position:absolute;inset:0;display:grid;place-items:center;color:#a9b4d1;font-weight:700}.vision-stage #cameraPlaceholder[hidden]{display:none}.vision-controls{display:flex;flex-direction:column;gap:14px;justify-content:center}.vision-controls label{font-weight:800;color:#34415f}.vision-controls select{width:100%;border:1px solid #d8deee;border-radius:12px;padding:13px;background:#fff;font:inherit}.vision-controls p{line-height:1.7;color:#56627e;margin:0}.vision-controls small{line-height:1.55;color:#6d7893}.vision-controls button{width:100%}
.control-label{font-weight:800;color:#34415f}.source-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pair-panel{padding:14px;border:1px solid #dce3f5;border-radius:16px;background:#f7f9ff;text-align:center}.pair-panel[hidden]{display:none}.pair-panel canvas{display:block;width:min(220px,100%);height:auto;margin:0 auto 10px;border-radius:10px}.pair-panel b,.pair-panel small{display:block;margin:8px 0}.pair-panel button{margin-top:8px}
@media(max-width:800px){.vision-panel{grid-template-columns:1fr}.vision-stage{min-height:250px}}