:root{--blue:#235be8;--blue-dark:#1747bd;--ink:#142441;--muted:#8791a5;--sub:#66748b;--line:#e7ecf3;--bg:#f6f8fc;--green:#15a880;--red:#e35c60;--radius:14px;font-family:Inter,'Microsoft YaHei','PingFang SC',sans-serif;color:var(--ink);font-size:14px}*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}button,a,input,select{outline-offset:4px}button{transition:background .18s,box-shadow .18s,transform .18s}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,a:focus-visible{outline:3px solid #85aaff}a{text-decoration:none;color:inherit}svg.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.app-shell{min-height:100vh;display:flex}.sidebar{width:238px;background:#fff;border-right:1px solid var(--line);position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;padding:30px 19px 0;z-index:10}.brand{display:flex;gap:11px;align-items:center;margin:0 11px 31px;color:#163976;font-weight:800;font-size:24px;letter-spacing:-1.3px}.brand-sub{display:block;font-size:11px;letter-spacing:2.65px;font-weight:600;margin-top:3px;color:#8c97ad}.brandmark{display:flex;gap:3px;height:29px;align-items:center;transform:skewY(-10deg)}.brandmark span{width:6px;height:20px;background:var(--blue);border-radius:2px}.brandmark span:nth-child(2){height:30px}.brandmark span:nth-child(3){height:24px}.workspace{display:flex;align-items:center;gap:10px;padding:13px 10px;border:1px solid var(--line);border-radius:9px;margin:0 3px 29px}.workspace-icon{background:#eff4ff;color:var(--blue);width:30px;height:32px;display:grid;place-items:center;border:1px solid #dbe6fe;border-radius:6px;font-size:14px;font-weight:750}.workspace strong{font-size:11px;display:block}.workspace small{font-size:11px;color:#9ba5b4;display:block;margin-top:4px}.workspace .icon{width:15px;margin-left:auto;color:#99a4b4}.nav-label{font-size:11px;font-weight:700;color:#a1aabb;padding-left:15px;letter-spacing:1px;margin-bottom:11px}.nav-label.second{margin-top:27px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;padding:13px 15px;color:#6e7b92;border:0;background:none;border-radius:8px;font-size:12px;text-align:left;margin-bottom:5px;height:44px;font-weight:500}.nav-item:hover{background:#f5f7fc;color:var(--blue)}.nav-item.active{color:var(--blue);background:#edf3ff;font-weight:700;position:relative}.nav-item.active:before{content:'';position:absolute;left:-19px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--blue)}.nav-item .icon{width:18px;height:18px}.nav-count{margin-left:auto;color:#99a6bd;font-size:11px;background:#f3f6fb;padding:2px 5px;border-radius:4px}.new-dot{margin-left:auto;width:5px;height:5px;border-radius:50%;background:var(--blue)}.beta{font-size:11px;padding:3px 5px;border:1px solid #dce6fb;color:#8a9ac1;border-radius:4px;margin-left:auto;letter-spacing:.4px}.nav-divider{height:1px;background:var(--line);margin:23px 13px 14px}.sidebar-bottom{margin-top:auto;padding-top:28px}.local-note{margin:0 8px 22px;padding:16px 13px;background:#f7f9fc;border:1px solid #eaf0f7;border-radius:9px;position:relative}.local-note strong{font-size:11px;margin-left:5px}.local-note small{display:block;margin:7px 0 0 15px;font-size:11px;color:#96a0b2}.local-version{display:block;font-size:11px;letter-spacing:1.25px;color:#b1bac7;margin:14px 0 0 15px}.online-dot,.blue-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#14ad87}.blue-dot{background:#4979ed}.profile{display:flex;gap:11px;align-items:center;width:100%;padding:19px 5px 24px;border:0;border-top:1px solid var(--line);background:none;text-align:left}.avatar{height:32px;width:32px;display:grid;place-items:center;background:#eeeaff;border:1px solid #e4dffc;color:#8a76b6;border-radius:50%;font-weight:600;font-size:12px;flex-shrink:0}.avatar.small{width:29px;height:29px;font-size:11px}.profile strong{display:block;font-size:11px}.profile small{display:block;font-size:11px;color:#a3aab6;margin-top:4px}.profile .icon{width:13px;margin-left:auto;color:#a5afc1}.main-shell{margin-left:238px;width:calc(100% - 238px);display:flex;flex-direction:column;min-height:100vh}.topbar{height:72px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 35px;flex-shrink:0}.breadcrumb{font-size:11px;color:#8f9aaa;display:flex;gap:15px}.breadcrumb strong{color:#485772;font-weight:500}.breadcrumb span{color:#cbd2dd}.top-actions{display:flex;align-items:center;gap:16px}.local-time{font-size:11px;color:#8e99ac;font-variant-numeric:tabular-nums}.environment{border:1px solid #e4ebf8;background:#f7faff;color:#55739f;display:flex;align-items:center;gap:7px;border-radius:5px;font-size:11px;padding:7px 9px}.environment .icon{height:12px;width:12px;margin-left:8px}.top-divider{width:1px;height:19px;background:#e7ecf4}.icon-button{display:grid;place-items:center;padding:5px;background:none;border:0;color:#8d99ac}.icon-button .icon{width:17px}.main-shell main{padding:30px 35px 26px;flex:1;max-width:1680px;width:100%;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.eyebrow{font-size:11px;letter-spacing:1.8px;color:#8fa0b7;font-weight:700;text-transform:uppercase;margin-bottom:7px}.page-heading h1{font-size:24px;letter-spacing:-.7px;font-weight:650;margin:0 0 8px}.page-heading p{font-size:11px;color:#8a97ad;margin:0;line-height:1.7}.heading-actions{display:flex;gap:9px;align-items:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #dfe6f0;padding:9px 13px;border-radius:6px;background:#fff;color:#63738d;font-size:11px;font-weight:550;min-height:34px;white-space:nowrap}.btn .icon{width:14px;height:14px}.btn:hover{border-color:#b5c8f1;box-shadow:0 3px 9px #1748940b}.btn.primary{color:#fff;background:var(--blue);border-color:var(--blue);box-shadow:0 4px 8px #235be81c}.btn.primary:hover{background:var(--blue-dark)}.btn.danger{color:#db5964;background:#fff;border-color:#f0d9dd}.btn.dark{background:#193154;color:white;border-color:#193154}.btn.subtle{background:#f6f8fc;border-color:transparent}.btn.small{min-height:28px;padding:6px 10px;font-size:11px}.btn.link{padding:0;min-height:0;border:0;background:none;color:var(--blue);font-size:11px;box-shadow:none}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.stat-card{background:#fff;border:1px solid var(--line);padding:17px 18px 15px;border-radius:10px;position:relative}.stat-label{font-size:11px;color:#8390a6;display:flex;align-items:center;gap:7px}.stat-icon{margin-left:auto;background:#f1f5ff;color:#7a9deb;border-radius:7px;width:29px;height:29px;display:grid;place-items:center;position:absolute;right:16px;top:17px}.stat-icon .icon{width:15px}.stat-value{font-size:28px;letter-spacing:-1px;font-weight:600;line-height:1.2;margin-top:13px;font-variant-numeric:tabular-nums}.stat-value small{font-size:12px;color:#9aa6b8;letter-spacing:0;margin-left:4px;font-weight:400}.stat-foot{margin-top:10px;font-size:11px;color:#99a5b7;display:flex;gap:5px;align-items:center}.green{color:var(--green)}.blue{color:var(--blue)}.panel{background:white;border:1px solid var(--line);border-radius:11px;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:18px 21px 16px;border-bottom:1px solid #f0f3f8}.panel-title{font-size:12px;font-weight:650;display:flex;align-items:center;gap:8px}.panel-title .icon{width:15px;color:#7791bd}.panel-subtitle{font-size:11px;color:#a0adbf;margin-top:6px}.tag{font-size:11px;line-height:1.4;padding:3px 6px;border-radius:4px;background:#f0f4fb;color:#8d9bb1;border:1px solid #e9eef7;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.tag.green{background:#effaf6;color:#35a78a;border-color:#dff2eb}.tag.blue{background:#eff4ff;border-color:#e0eaff;color:#5885e8}.tag.amber{background:#fff8ea;border-color:#f8ecd0;color:#be9a4d}.tag.red{background:#fff1f1;border-color:#f7dfe1;color:#ca7079}.dashboard-main{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(360px,1fr);gap:20px;margin-bottom:21px}.device-panel{position:relative;min-height:381px}.device-panel .panel-head{position:relative;z-index:1}.device-canvas{height:273px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 70%,#eef3fe 0%,#f9fbff 43%,#fff 76%)}.device-grid{position:absolute;left:20px;right:20px;bottom:-25px;height:105px;background-image:linear-gradient(#dce5f55e 1px,transparent 1px),linear-gradient(90deg,#dce5f55e 1px,transparent 1px);background-size:24px 24px;transform:perspective(240px) rotateX(53deg);transform-origin:bottom}.head-model{position:absolute;height:245px;width:245px;left:50%;top:10px;transform:translateX(-50%);filter:drop-shadow(0 11px 8px #365aaa0d)}.diagram-label{position:absolute;font-size:11px;color:#9cacc3;display:flex;align-items:center;gap:5px;z-index:2}.diagram-label:before{content:'';width:4px;height:4px;border-radius:50%;background:#93b0ef;box-shadow:0 0 0 3px #eff4ff}.diagram-label.a{left:8%;top:70px}.diagram-label.b{right:7%;top:110px}.diagram-label.c{left:11%;top:168px}.diagram-label:after{content:'';width:33px;height:1px;background:#cedcf5}.diagram-label.b:after{order:-1}.canvas-mode{position:absolute;left:21px;bottom:14px;display:flex;gap:5px;color:#a6b1c2;font-size:11px;letter-spacing:.9px}.canvas-corner{position:absolute;right:18px;bottom:12px;display:flex;gap:6px}.canvas-corner span{display:grid;place-items:center;width:23px;height:23px;border:1px solid #e8eef8;border-radius:5px;font-size:11px;color:#9eb1ce;background:white}.device-controls{display:flex;align-items:center;justify-content:space-between;margin:0 20px 17px;padding-top:12px;border-top:1px solid #edf1f8}.device-id{font-size:11px;font-weight:650}.device-id small{display:block;font-weight:400;font-size:11px;color:#a3adbd;margin-top:4px}.control-stack{display:grid;grid-template-rows:auto 1fr;gap:15px}.quick-panel .panel-head{padding-bottom:12px}.quick-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding:14px 18px 17px}.quick-action{background:#f7f9fe;border:1px solid #e8edf6;padding:13px 5px 11px;border-radius:7px;display:flex;align-items:center;flex-direction:column;gap:8px;color:#58739e;font-size:11px}.quick-action .icon{width:20px;height:20px;color:#7395d2}.quick-action:hover{background:#edf3ff;border-color:#d3e0fc}.quick-action.stop{background:#fff9f9;border-color:#f4e9eb;color:#cd7880}.quick-action.stop .icon{color:#d88087}.motor-table{width:100%;border-collapse:collapse;text-align:left;font-size:11px}.motor-table th{font-size:11px;color:#a1adbe;font-weight:400;padding:12px 18px 9px;background:#fafbfd}.motor-table td{padding:11px 18px;border-top:1px solid #f3f5f9;color:#7383a0}.motor-table td:first-child{color:#526581;font-weight:550}.motor-table td.number{font-variant-numeric:tabular-nums;color:#3d5e8e}.motor-table .online-dot{width:4px;height:4px;margin-right:4px}.motor-bottom{padding:12px 18px;border-top:1px solid #f0f3f8;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#a5afc1}.dashboard-bottom{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(285px,1fr);gap:20px}.expression-preview{display:flex;gap:11px;padding:19px 20px}.expression-tile{flex:1;min-width:0;border:1px solid #e8edf5;border-radius:8px;background:#fcfdff;padding:13px 8px 11px;text-align:center;position:relative;transition:all .2s;cursor:pointer}.expression-tile:hover,.expression-tile.selected{border-color:#8eadf4;background:#f5f8ff;box-shadow:0 0 0 1px #dce7ff}.expression-tile .mini-face{height:48px;width:48px;color:#a6b9db;margin:auto;display:block}.expression-tile.selected .mini-face{color:#4778e0}.expression-tile strong{font-size:11px;display:block;margin-top:9px;font-weight:500;color:#6f809d}.expression-tile small{font-size:11px;color:#b0bacb;display:block;margin-top:4px}.expression-tile.selected:after{content:'✓';position:absolute;top:5px;right:6px;font-size:11px;color:var(--blue)}.panel-foot{padding:13px 20px;border-top:1px solid #edf1f7;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#9aa8bc;background:#fdfdff}.workflow-list{padding:17px 20px 12px}.workflow-row{display:flex;align-items:center;gap:11px;margin-bottom:15px}.workflow-symbol{width:29px;height:29px;border:1px solid #e3ebf8;border-radius:7px;background:#f7faff;display:grid;place-items:center;color:#8da7d1}.workflow-symbol .icon{width:14px;height:14px}.workflow-row strong{font-size:11px;font-weight:550;display:block;color:#5b7194}.workflow-row small{font-size:11px;color:#a9b3c3;display:block;margin-top:4px}.workflow-row .tag{margin-left:auto;font-size:11px}.footer{padding:16px 35px 19px;display:flex;justify-content:space-between;font-size:11px;color:#a5b0c1;letter-spacing:.2px;border-top:1px solid #eaf0f8;gap:10px}.footer .online-dot{width:4px;height:4px;margin-right:4px}.footer-divider{margin:0 8px;color:#c4cedd}.section-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(270px,1fr);gap:20px}.form-body{padding:21px}.info-strip{border:1px solid #dfe9fd;background:#f0f5ff;border-radius:8px;padding:12px 15px;color:#6a84af;font-size:11px;line-height:1.8;display:flex;gap:9px;margin-bottom:20px}.info-strip .icon{width:17px;height:17px;flex-shrink:0;margin-top:1px}.motor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.motor-card{border:1px solid var(--line);border-radius:10px;padding:18px;background:#fff}.motor-name{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;margin-bottom:20px}.motor-name small{font-size:11px;color:#9caabd;font-weight:400;margin-right:6px}.motor-current{display:flex;align-items:baseline;gap:7px;font-size:25px;letter-spacing:-.5px;margin:12px 0}.motor-current small{font-size:11px;color:#98a7bf}.range{width:100%;accent-color:var(--blue);cursor:pointer}.range-scale{font-size:11px;color:#a0aec2;display:flex;justify-content:space-between;margin-top:7px}.motor-meta{display:flex;justify-content:space-between;border-top:1px solid #edf2f8;margin-top:15px;padding-top:11px;font-size:11px;color:#94a4bc}.field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}.field label{font-size:11px;color:#637592;font-weight:500}.input,select.input,textarea.input{width:100%;border:1px solid #dee6f2;border-radius:6px;background:#fff;color:#405979;padding:10px 11px;font-size:11px;min-width:0}.input:focus{border-color:#82a6f5;outline:2px solid #e9f0ff}.field small{font-size:11px;color:#9baabe;line-height:1.7}.two-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.inline-field{display:flex;align-items:center;gap:8px;font-size:11px;color:#788ca8}.inline-field input{accent-color:var(--blue)}.notes{font-size:11px;line-height:1.9;color:#91a0b7;margin:0}.label-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.label-row h3{font-size:12px;font-weight:600;margin:0}.label-row span{font-size:11px;color:#9aabc3}.list-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #edf1f7}.list-row:last-child{border-bottom:0}.list-row .grow{flex:1;min-width:0}.list-row strong{display:block;font-size:11px;font-weight:550;color:#536f97}.list-row small{display:block;font-size:11px;color:#9bacc4;margin-top:6px}.list-row .mini-face{width:38px;height:38px;color:#91a9d1}.timeline{padding:20px}.timeline-track{display:flex;gap:8px;min-height:95px;overflow-x:auto;padding:0 0 9px;align-items:stretch}.clip{min-width:112px;position:relative;border:1px solid #d7e3fc;background:#f0f5ff;border-radius:8px;padding:13px 11px;color:#6382b5}.clip.active{background:#e0ebff;border-color:var(--blue)}.clip strong{font-size:11px;display:block;margin-bottom:17px}.clip small{font-size:11px;color:#89a1c4}.clip .remove{position:absolute;right:7px;top:6px;color:#9cafcc;background:none;border:0;font-size:15px}.timeline-ruler{display:flex;justify-content:space-between;font-size:11px;color:#a5b4c9;margin:10px 0 15px;border-top:1px solid #e8edf6;padding-top:9px}.timeline-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:16px;border-top:1px solid #edf1f8}.timeline-toolbar .inline-field{margin-left:auto;font-size:11px}.progress-track{height:4px;background:#eef2f8;border-radius:2px;overflow:hidden}.progress-fill{height:100%;width:0;background:var(--blue);transition:width .3s}.rule-card{padding:19px 20px;background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:14px}.rule-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.rule-top strong{font-size:12px}.rule-flow{display:flex;align-items:center;gap:10px;font-size:11px;color:#718bac}.rule-flow .node{background:#f5f8fd;border:1px solid #e8eef8;border-radius:6px;padding:10px 12px;flex:1;line-height:1.8}.rule-flow .node small{font-size:11px;color:#a3b2c8;display:block}.rule-flow .icon{width:16px;color:#a7b9d3}.rule-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:16px;font-size:11px;color:#9aabc1}.switch{width:29px;height:17px;border-radius:20px;border:0;background:#dce4f0;padding:2px;display:flex;align-items:center}.switch:before{content:'';height:13px;width:13px;background:white;border-radius:50%;box-shadow:0 1px 4px #30477730;transition:transform .2s}.switch.on{background:var(--blue)}.switch.on:before{transform:translateX(12px)}.camera-preview{height:260px;background:#152b48;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px}.camera-preview video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera-placeholder{text-align:center;color:#8398b5}.camera-placeholder .icon{width:38px;height:38px;stroke-width:1.2;display:block;margin:0 auto 15px}.camera-placeholder strong{font-size:11px;display:block;color:#bac9dd;font-weight:400}.camera-placeholder small{font-size:11px;display:block;margin-top:8px}.camera-badge{position:absolute;top:13px;left:13px;display:flex;align-items:center;gap:6px;font-size:11px;letter-spacing:1px;color:#adbed7;background:#172d48a1;padding:6px 8px;border-radius:4px}.camera-overlay{position:absolute;left:calc(50% - 65px);top:40px;width:130px;height:170px;border:1px dashed #6f97d745;border-radius:45%;pointer-events:none}.capture-controls{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}.sample-count{margin-left:auto;display:flex;align-items:center;font-size:11px;color:#96a6bd}.mic-visual{height:104px;display:flex;gap:4px;align-items:center;justify-content:center;background:#f7faff;border-radius:8px;border:1px solid #edf2fb}.mic-visual span{display:block;width:4px;background:#c2d4f8;border-radius:3px;height:15px}.mic-visual.recording span{animation:pulse .8s ease-in-out infinite alternate;background:#4e80e5}.mic-visual span:nth-child(3n){height:36px;animation-delay:.2s}.mic-visual span:nth-child(4n){height:53px;animation-delay:.35s}.mic-visual span:nth-child(5n){height:27px;animation-delay:.5s}@keyframes pulse{to{transform:scaleY(.25)}}.pipeline{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:20px 0}.pipeline-step{border:1px solid #e4ebf7;background:#f9fbff;border-radius:9px;text-align:center;padding:18px 8px;position:relative}.pipeline-step:not(:last-child):after{content:'→';position:absolute;right:-11px;top:42%;color:#b1c4e4;z-index:1}.pipeline-step .icon{height:25px;width:25px;color:#91afe4;display:block;margin:0 auto 12px}.pipeline-step strong{display:block;font-size:11px;font-weight:550;color:#5e7caa}.pipeline-step small{display:block;font-size:11px;color:#a2b2c9;margin-top:7px}.pipeline-step.active{border-color:#a8c2f5;background:#f0f5ff}.training-chart{width:100%;height:180px;display:block;background:linear-gradient(#fff,#fafcff)}.chart-labels{display:flex;justify-content:space-between;font-size:11px;color:#a6b4c7;margin:10px 0}.metric-pair{display:flex;gap:35px;margin-bottom:20px}.metric-pair strong{display:block;font-size:23px;font-weight:600;letter-spacing:-.5px;margin-top:7px}.metric-pair small{font-size:11px;color:#9dacbf}.empty-state{padding:27px 10px;text-align:center;color:#a1afc4;font-size:11px;line-height:1.9}.log{font:9px/1.8 ui-monospace,Consolas,monospace;color:#7e93b1;background:#f8faff;border:1px solid #e8effa;border-radius:8px;padding:13px;max-height:270px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}.serial-status{border:1px solid #e8eef7;border-radius:8px;padding:16px;display:flex;align-items:center;gap:12px;margin-bottom:17px}.serial-status .icon{width:27px;height:27px;color:#86a7df}.serial-status strong{display:block;font-size:11px}.serial-status small{font-size:11px;color:#93a6c0;display:block;margin-top:6px}.form-actions{display:flex;gap:9px;margin-top:20px}.divider{height:1px;background:var(--line);margin:20px 0}.toast-region{position:fixed;right:25px;bottom:25px;display:flex;flex-direction:column;gap:8px;z-index:100}.toast{max-width:420px;background:#1c365c;color:#e5efff;box-shadow:0 8px 30px #0f2b6030;border:1px solid #365380;border-radius:9px;padding:13px 17px;font-size:11px;line-height:1.7;animation:toast-in .2s ease-out}.toast.error{background:#61353d;border-color:#99606b}.toast.success{background:#1f5b50;border-color:#478379}@keyframes toast-in{from{transform:translateY(8px);opacity:0}}dialog{border:1px solid #dce5f3;border-radius:14px;padding:0;width:470px;max-width:calc(100vw - 35px);box-shadow:0 30px 100px #132d6630;color:var(--ink)}dialog::backdrop{background:#0a1f4433;backdrop-filter:blur(4px)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:22px 25px;border-bottom:1px solid var(--line)}.modal-header h2{font-size:16px;margin:0}.modal-close{font-size:20px;border:0;background:none;color:#91a2ba}.modal-body{padding:23px 25px}.modal-footer{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.help-list{padding-left:18px;font-size:11px;line-height:2.2;color:#7c8ca5}.compact-table{width:100%;border-collapse:collapse;font-size:11px}.compact-table th{text-align:left;color:#9cacc3;font-weight:400;padding:12px 14px;background:#f8faff}.compact-table td{padding:14px;border-top:1px solid #edf1f7;color:#718aab}.sample-list{max-height:270px;overflow-y:auto}.sample-list .list-row{padding:12px 0}.storage-note{font-size:11px;line-height:1.7;color:#9cacc3}.training-header-actions{display:flex;gap:9px}.plot-grid{stroke:#e8eef8;stroke-width:1}.empty-timeline{width:100%;border:1px dashed #d8e3f5;border-radius:8px;display:grid;place-items:center;color:#9aaec9;font-size:11px}.tiny-note{font-size:11px;color:#a5b1c3;line-height:1.8}.danger-strip{background:#fff3f3;color:#bf7981;border:1px solid #f2dfe2;border-radius:8px;padding:12px 15px;font-size:11px;line-height:1.8;margin-bottom:18px}.hidden{display:none!important}.training-inline{display:flex;align-items:center;gap:10px}.mini-metric{font-size:11px;color:#97a8c1}.motor-filters{display:flex;gap:6px;margin-bottom:17px}.filter-tab{border:1px solid #e5ecf6;background:#fff;color:#8da0bd;font-size:11px;padding:7px 12px;border-radius:5px}.filter-tab.active{background:#eff4ff;color:var(--blue);border-color:#d4e3ff}.motor-number-input{width:66px;border:1px solid #e4ebf6;border-radius:5px;color:#3c639e;padding:5px 7px;font-size:12px;text-align:center}.head-expression-status{position:absolute;top:20px;left:21px;z-index:1;font-size:11px;color:#a6b4ca;letter-spacing:.8px}.live-pill{display:inline-flex;align-items:center;gap:5px;color:#509981;font-size:11px;letter-spacing:.4px}.live-pill .online-dot{width:4px;height:4px}.dotted-line{height:1px;background:repeating-linear-gradient(90deg,#d6e1f2 0 3px,transparent 3px 6px);flex:1}.simulation-ribbon{display:flex;align-items:center;gap:8px;color:#96a7c1;font-size:11px}.simulation-ribbon .tag{font-size:11px}.expression-page .expression-preview{display:grid;grid-template-columns:repeat(3,1fr)}.expression-page .expression-tile{padding:16px 10px}.expression-page .mini-face{width:56px;height:56px}.small-note{font-size:11px;line-height:1.8;color:#92a3bb}.full-width{grid-column:1/-1}.sample-icon{width:30px;height:30px;border:1px solid #e4edf9;background:#f4f8ff;border-radius:7px;display:grid;place-items:center;color:#8daadc}.sample-icon .icon{width:14px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.empty-figure{display:flex;align-items:center;gap:8px;justify-content:center;color:#a1b1c8;padding:26px 0}.empty-figure .icon{width:22px;height:22px}.modal-body .notes{font-size:11px}.head-tag{position:absolute;right:20px;top:20px;z-index:1}.step-label{font-size:11px;letter-spacing:1.2px;color:#b0bfd3;margin-bottom:10px}.rule-actions{display:flex;gap:7px;align-items:center}.rule-actions .icon-button{font-size:16px}.counter-badge{background:#f0f4fb;padding:3px 7px;border-radius:4px;color:#8ea3c0;font-size:11px}
@media(min-width:1550px){.main-shell main{padding-top:35px}.page-heading{margin-bottom:30px}.stats-grid{gap:20px;margin-bottom:26px}.stat-card{padding:20px 22px}.stat-value{font-size:31px}.device-canvas{height:315px}.head-model{height:290px;width:290px}.device-panel{min-height:424px}.dashboard-main{gap:23px}.control-stack{gap:20px}.quick-buttons{padding:18px 21px 20px}.quick-action{padding:16px}.motor-table td{padding:15px 21px}.expression-preview{padding:23px}.expression-tile{padding:18px}.expression-tile .mini-face{height:58px;width:58px}.workflow-list{padding-top:21px}.workflow-row{margin-bottom:20px}.footer{font-size:11px}.page-heading h1{font-size:27px}.page-heading p{font-size:11px}.stat-label{font-size:11px}.panel-title{font-size:13px}}
@media(max-width:1180px){.sidebar{width:205px;padding:25px 15px 0}.main-shell{margin-left:205px;width:calc(100% - 205px)}.brand{font-size:21px;margin-left:6px}.workspace{padding:11px 8px;gap:7px}.workspace strong{font-size:11px}.main-shell main{padding:26px 24px}.topbar{padding:0 24px}.dashboard-main{grid-template-columns:1fr 1fr;gap:15px}.dashboard-bottom{grid-template-columns:1.4fr 1fr;gap:15px}.panel-head{padding:16px}.quick-buttons{padding:12px}.motor-table th,.motor-table td{padding-left:12px;padding-right:12px}.expression-preview{padding:15px;gap:7px}.diagram-label{display:none}.footer{padding-left:24px;padding-right:24px}.nav-item.active:before{left:-15px}.stats-grid{gap:11px}.stat-card{padding:16px 14px}.stat-icon{right:12px}.local-time{display:none}}
@media(max-width:980px){.sidebar{width:76px;padding:25px 10px 0}.brand{margin:0 auto 30px;justify-content:center}.brand>span:last-child,.workspace,.nav-label,.nav-item span,.sidebar-bottom,.nav-divider{display:none}.nav-item{justify-content:center;padding:13px 10px;margin-bottom:12px}.nav-item.active:before{left:-10px}.main-shell{margin-left:76px;width:calc(100% - 76px)}.dashboard-main{grid-template-columns:1fr 1fr}.page-heading h1{font-size:23px}.section-grid{grid-template-columns:1.3fr 1fr}.pipeline{gap:7px}.pipeline-step{padding:15px 5px}.pipeline-step strong{font-size:11px}}
@media(max-width:760px){.topbar{height:60px;padding:0 18px}.main-shell main{padding:22px 17px}.page-heading{align-items:flex-start;gap:12px;flex-direction:column;margin-bottom:20px}.heading-actions{align-self:stretch}.heading-actions .btn:last-child{margin-left:auto}.stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.dashboard-main,.dashboard-bottom,.section-grid,.settings-grid{grid-template-columns:1fr}.dashboard-main{gap:15px}.stat-value{font-size:26px}.control-stack{grid-template-rows:auto auto}.device-canvas{height:290px}.head-model{width:260px;height:260px}.footer{padding:15px 18px;flex-direction:column;font-size:11px;gap:8px}.top-actions{gap:10px}.top-divider,.top-actions>.icon-button{display:none}.motor-grid{gap:10px}.pipeline{grid-template-columns:repeat(3,1fr)}.pipeline-step:nth-child(3):after{display:none}.two-cols{gap:9px}.form-body{padding:18px}.page-heading p{font-size:11px}.breadcrumb{font-size:11px}.environment{font-size:11px}.rule-flow{gap:6px}.rule-flow .node{padding:8px;font-size:11px}.training-header-actions{flex-wrap:wrap}.expression-preview{gap:9px;padding:18px}.expression-tile .mini-face{height:50px;width:50px}}
@media(max-width:430px){.sidebar{width:58px;padding:22px 7px 0}.main-shell{margin-left:58px;width:calc(100% - 58px)}.main-shell main{padding:20px 12px}.topbar{padding:0 12px}.brandmark{gap:2px}.brandmark span{width:5px}.nav-item .icon{width:18px;height:18px}.top-actions .avatar{display:none}.motor-grid{grid-template-columns:1fr}.stat-card{padding:14px 12px}.stat-icon{width:24px;height:24px;top:12px;right:10px}.stat-label{font-size:11px}.stat-value{font-size:25px}.expression-preview{padding:14px;gap:6px}.expression-tile{padding:11px 4px}.expression-tile .mini-face{width:43px;height:43px}.pipeline{grid-template-columns:1fr 1fr}.pipeline-step:nth-child(2n):after{display:none}.pipeline-step:nth-child(3):after{display:block}.tag{font-size:11px}.panel-head{padding:14px}.btn{font-size:11px;padding:8px 10px}.footer{padding:14px 12px}.quick-action{font-size:11px}.heading-actions{gap:6px}.page-heading h1{font-size:21px}}

/* Readability for a working control console. */
:root{--muted:#68788e;--sub:#586b86}
.sidebar{overflow-y:auto}
.brand-sub{font-size:9px}
.nav-item{font-size:13px}
.nav-label{font-size:11px;color:#75849a}
.panel-title{font-size:14px}
.page-heading p{font-size:12px;line-height:1.8;color:#66768c}
.btn,.quick-action{font-size:12px}
.stat-label{font-size:12px;color:#66768c}
.stat-foot{font-size:11px;color:#66768c;flex-wrap:wrap;line-height:1.7}
.tag{font-size:11px}
.motor-table{font-size:12px}
.motor-table th{font-size:11px;color:#61728c}
.motor-table td{font-size:12px}
.expression-tile strong,.workflow-row strong{font-size:12px}
.expression-tile small,.workflow-row small,.panel-foot,.motor-bottom,.device-id small,.motor-meta,.field label{font-size:11px;color:#61728c;line-height:1.7}
.local-note small,.profile small{color:#6e7c94}
.local-note small{margin-left:0}
.footer{color:#677990;font-size:10px}
@media(max-width:760px){.motor-table td{font-size:11px}.btn{font-size:11px}.panel-title{font-size:13px}.top-actions .local-time{display:none}.panel-foot{flex-wrap:wrap;gap:6px}.timeline-toolbar{flex-wrap:wrap}}

/* Soft blue-gray surfaces and stronger contrast for long control sessions. */
:root{
  --blue:#2155ce;
  --blue-dark:#173f9f;
  --ink:#142741;
  --muted:#536981;
  --sub:#405875;
  --line:#ced9e7;
  --bg:#edf1f7;
  --surface:#fafbfd;
  --surface-soft:#eaf0f8;
  --green:#147960;
  --red:#b94050;
}
.sidebar{background:#f4f7fb}
.topbar{background:rgba(247,249,253,.98)}
.panel,.stat-card,.motor-card,.rule-card,dialog{background:var(--surface)}
.workspace,.serial-status{background:#f8fafd;border-color:var(--line)}
.brand-sub,.workspace small,.nav-label,.nav-count,.beta,.local-note small,
.local-version,.profile small,.breadcrumb,.local-time,.eyebrow,
.page-heading p,.stat-label,.stat-value small,.stat-foot,.panel-subtitle,
.device-id small,.motor-bottom,.expression-tile small,.workflow-row small,
.panel-foot,.footer,.motor-name small,.motor-current small,.range-scale,
.motor-meta,.field small,.notes,.label-row span,.list-row small,
.timeline-ruler,.rule-bottom,.sample-count,.pipeline-step small,
.chart-labels,.metric-pair small,.empty-state,.serial-status small,
.storage-note,.tiny-note,.mini-metric,.simulation-ribbon,.small-note,
.empty-figure,.step-label,.counter-badge{color:var(--muted)}
.nav-item,.btn,.motor-table td,.field label,.inline-field,.list-row strong,
.rule-flow,.help-list,.compact-table td,.expression-tile strong,
.workflow-row strong{color:var(--sub)}
.breadcrumb strong,.motor-table td:first-child{color:#354e6d}
.workspace .icon,.profile .icon,.icon-button,.modal-close{color:#617795}
.breadcrumb span,.footer-divider{color:#7e91ab}
.environment{background:#eaf0fb;border-color:#cbd8eb;color:#3f5d89}
.workspace-icon{background:#e6edfb;border-color:#cad8f2}
.nav-item:hover{background:#e8eef8}
.nav-item.active{background:#e0eafa;color:var(--blue)}
.nav-count,.counter-badge{background:#e5ecf6}
.beta{border-color:#cad6e9}
.local-note{background:#eaf0f8;border-color:#d4deeb}
.avatar{background:#e8e3f6;border-color:#d4cbea;color:#65508f}
.btn{background:#f8fafd;border-color:#bdcbe0}
.btn:hover{background:#edf2fa;border-color:#8da9d6;box-shadow:0 3px 9px #17489412}
.btn.primary{background:var(--blue);border-color:var(--blue);color:white}
.btn.primary:hover{background:var(--blue-dark)}
.btn.dark{background:#193154;border-color:#193154;color:white}
.btn.danger{color:#b33c4d;background:#fff4f4;border-color:#e4bfc6}
.btn.danger:hover{background:#fbe8eb;border-color:#cf9ba6}
.btn.subtle{background:#e8eef7;border-color:#d4deed}
.btn.link{background:none;color:var(--blue)}
.stat-icon{background:#e4ecfa;color:#4c70b0}
.panel-head,.motor-bottom,.panel-foot,.device-controls,.motor-meta,
.timeline-toolbar,.list-row,.compact-table td,.footer{border-color:#dbe3ef}
.panel-title .icon{color:#5475a5}
.tag{background:#e8eef7;color:#536984;border-color:#cfdbea}
.tag.green{background:#e2f3ec;color:#19755f;border-color:#bfdfd3}
.tag.blue{background:#e3ecfd;color:#315faf;border-color:#c8d8f6}
.tag.amber{background:#faf0d9;color:#866019;border-color:#e9d8a9}
.tag.red{background:#fae7eb;color:#a13d50;border-color:#e8c2ca}
.device-canvas{background:radial-gradient(ellipse at 50% 70%,#dde6f6 0%,#f0f4fb 48%,#fafbfd 80%)}
.device-grid{background-image:linear-gradient(#bdcde585 1px,transparent 1px),linear-gradient(90deg,#bdcde585 1px,transparent 1px)}
.diagram-label,.canvas-mode,.head-expression-status{color:#627b9a}
.diagram-label:after{background:#a9bedf}
.canvas-corner span{background:#f4f7fc;border-color:#cbd8eb;color:#617da4}
.quick-action{background:#eaf0fa;border-color:#cddbed;color:#3f5e8c}
.quick-action .icon{color:#4a70b1}
.quick-action:hover{background:#dfe9fa;border-color:#aabfe4}
.quick-action.stop{background:#fbeef0;border-color:#e7ccd1;color:#af4555}
.quick-action.stop .icon{color:#b14a59}
.motor-table th,.compact-table th{background:#edf2f9;color:#4e6683}
.motor-table td{border-color:#e0e7f0}
.motor-table td.number{color:#294e80}
.expression-tile{background:#f4f7fc;border-color:#cdd9e9}
.expression-tile .mini-face,.list-row .mini-face{color:#6784b2}
.expression-tile:hover,.expression-tile.selected{border-color:#6e95dc;background:#e7effd;box-shadow:0 0 0 1px #bbcef1}
.expression-tile.selected .mini-face{color:#2e61c1}
.panel-foot{background:#f0f4fa}
.workflow-symbol{background:#eaf0fa;border-color:#cbd9ed;color:#5d7dab}
.info-strip{background:#e5edfb;border-color:#c1d2ed;color:#41638f}
.input,select.input,textarea.input{background:#fdfefe;border-color:#b8c8dd;color:#294462}
.input::placeholder{color:#697f9b;opacity:1}
.input:focus{border-color:#5784db;outline:2px solid #ccdafa}
.clip{background:#e4edfc;border-color:#b9cdec;color:#3d5e91}
.clip.active{background:#d5e3fb;border-color:var(--blue)}
.clip small{color:#536e97}
.clip .remove{color:#627da5}
.timeline-ruler{border-color:#d1ddeb}
.progress-track{background:#dce5f1}
.rule-flow .node{background:#eaf0f8;border-color:#cfdbea}
.rule-flow .node small{color:#5b7392}
.rule-flow .icon{color:#6884a8}
.switch{background:#a9bbd2}
.switch.on{background:var(--blue)}
.mic-visual{background:#edf2fa;border-color:#cedbef}
.mic-visual span{background:#8cace4}
.pipeline-step{background:#eef3fa;border-color:#cfdbed}
.pipeline-step:not(:last-child):after{color:#6b89b8}
.pipeline-step .icon{color:#6588c2}
.pipeline-step strong{color:#416291}
.pipeline-step.active{background:#e1ebfc;border-color:#84a5df}
.training-chart{background:linear-gradient(#fafbfd,#eff4fc)}
.plot-grid{stroke:#d4dfed}
.log{color:#4f6b92;background:#eaf0f9;border-color:#cad8eb}
.serial-status .icon{color:#5b80ba}
.empty-timeline{color:#5b7395;border-color:#a9bddb;background:#f0f4fa}
.danger-strip{background:#faebee;color:#a04a58;border-color:#e6c2ca}
.filter-tab{background:#f7f9fd;color:#526f95;border-color:#c9d6e8}
.filter-tab.active{background:#e1ebfc;color:var(--blue);border-color:#a8c0e9}
.motor-number-input{background:#fdfefe;border-color:#b9cae1;color:#315a91}
.live-pill{color:#247a62}
.sample-icon{background:#e7effb;border-color:#c7d8f0;color:#587db8}
button:focus-visible,a:focus-visible{outline-color:#4b7ad3}/* Timeline drag targets and ordering controls. */
.timeline-help{font-size:12px;line-height:1.7;color:#536981;margin:0 0 13px}
.timeline-track{position:relative;min-height:143px;padding:12px 14px 14px;border:1px dashed #a6b8cf;border-radius:10px;background:#eef3fa;scroll-behavior:auto}
.timeline-track.drag-over{background:#e3edff;border-color:#2155ce;box-shadow:inset 0 0 0 1px #2155ce}
.expression-page .expression-tile[draggable="true"],.clip[draggable="true"]{cursor:grab}
.expression-page .expression-tile[draggable="true"]:active,.clip[draggable="true"]:active{cursor:grabbing}
.expression-tile.dragging,.clip.dragging{opacity:.5}
.clip{flex:0 0 auto;min-width:164px;max-width:280px;padding:14px 32px 10px 12px}
.clip strong{margin-bottom:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drag-grip{margin-right:6px;color:#647b97;font-size:15px;vertical-align:middle}
.clip-order{display:flex;gap:5px;margin-top:10px}
.clip-order button{border:1px solid #aabbd0;background:#f8faff;color:#33547c;border-radius:5px;padding:0 9px;line-height:24px;min-width:31px}
.clip-order button:hover:not(:disabled){background:#dce7fa;color:#164cbd}
.clip-order button:disabled{opacity:.4}
.clip.drop-before:before,.clip.drop-after:after{content:'';position:absolute;top:-7px;bottom:-7px;width:4px;background:#2155ce;border-radius:5px;box-shadow:0 0 0 2px #d8e5ff;z-index:3;pointer-events:none}
.clip.drop-before:before{left:-7px}.clip.drop-after:after{right:-7px}
.empty-timeline{width:100%;min-height:114px;display:grid;place-items:center;line-height:1.8;text-align:center;padding:18px;color:#536981}
.clip:focus-visible{outline:3px solid #6d99e5;outline-offset:3px}
@media(max-width:760px){.timeline{padding:15px}.timeline-track{min-width:0;max-width:100%}.timeline-toolbar{gap:9px}.timeline-help{font-size:12px}.clip-order button{min-width:36px;line-height:30px}.rule-actions{flex-wrap:wrap}}


/* Reusable timeline sequences, shared by the studio and automation actions. */
.sequence-library-body{padding:20px 22px}
.sequence-library-body>.tiny-note{margin:16px 0 0;line-height:1.7}
.sequence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sequence-card{min-width:0;padding:17px;border:1px solid var(--line);border-radius:13px;background:var(--surface-alt);color:var(--ink)}
.sequence-card.is-playing{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent-line)}
.sequence-card-top{display:flex;align-items:center;gap:11px}
.sequence-card-top>div:nth-child(2){min-width:0;flex:1}
.sequence-card-top strong{display:block;font-size:13px;line-height:1.6;overflow-wrap:anywhere;color:var(--ink)}
.sequence-card-top small{display:block;font-size:11px;line-height:1.8;color:var(--muted)}
.sequence-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid var(--accent-line);border-radius:11px;background:var(--accent-soft);color:var(--accent)}
.sequence-icon .icon{width:18px;height:18px}
.sequence-clip-list{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:17px 0;max-height:145px;overflow:auto}
.sequence-clip-list>span{padding:6px 9px;border:1px solid var(--line);border-radius:7px;background:var(--surface);font-size:11px;color:var(--ink);overflow-wrap:anywhere}
.sequence-clip-list>span.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.sequence-clip-list small{color:var(--muted);margin-left:4px}
.sequence-clip-list>b{font-size:12px;font-weight:400;color:var(--muted)}
.sequence-card-actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:13px;border-top:1px solid var(--line)}
.sequence-empty{padding:24px;border:1px dashed var(--line);border-radius:10px;background:var(--surface-alt);color:var(--muted);font-size:12px;line-height:1.8;text-align:center}
.sequence-save-summary{display:flex;flex-direction:column;gap:8px;padding:14px 16px;margin-bottom:14px;border:1px solid var(--line);border-radius:10px;background:var(--surface-alt);color:var(--ink);font-size:12px;line-height:1.8}
.sequence-save-summary span{color:var(--muted);max-height:140px;overflow:auto;overflow-wrap:anywhere}
@media(max-width:1000px){.sequence-grid{grid-template-columns:1fr}}
@media(max-width:600px){.sequence-library-body{padding:15px}.sequence-card{padding:14px}.sequence-card-top{flex-wrap:wrap}.sequence-card-top .tag{margin-left:49px}.sequence-library .panel-head{gap:10px;flex-wrap:wrap}}

/* Passive status messages must never block canvas controls during repeated edits. */
.toast-region,.toast-region .toast{pointer-events:none}