:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#edf2f7;background:#080b10;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;height:100%;margin:0}body{overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}.app-shell{display:grid;grid-template-rows:72px 1fr;width:100%;height:100%;background:radial-gradient(circle at 70% 15%,rgba(76,142,199,.08),transparent 32%),#080b10}.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid rgba(255,255,255,.08);background:#090c11eb;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10}.eyebrow{margin:0 0 2px;color:#6f7f91;font-size:10px;font-weight:800;letter-spacing:.22em}h1{margin:0;font-size:20px;font-weight:660;letter-spacing:-.02em}.connection{display:flex;align-items:center;gap:8px;color:#7f8c9a;font-size:11px;font-weight:800;letter-spacing:.08em}.connection span{width:8px;height:8px;border-radius:999px;background:#6a7078;box-shadow:0 0 0 4px #ffffff08}.connection.online{color:#99e8bd}.connection.online span{background:#4ad48d;box-shadow:0 0 14px #4ad48db3}.connection.demo{color:#f0c779}.connection.demo span{background:#dca84d;box-shadow:0 0 14px #dca84d80}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 390px;min-height:0}.viewport{position:relative;min-width:0;min-height:0}.viewport canvas{display:block}.viewport-hint{position:absolute;left:20px;bottom:18px;padding:8px 11px;border:1px solid rgba(255,255,255,.08);border-radius:8px;color:#7f8b98;background:#080b10b8;font-size:11px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}.pose-badge,.movement-live-badge{position:absolute;top:18px;padding:12px 14px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#080b10b8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}.pose-badge{left:20px;display:flex;align-items:center;gap:14px}.movement-live-badge{right:20px;display:grid;gap:3px}.movement-live-badge span{color:#78c7ff;font-size:9px;font-weight:900;letter-spacing:.16em}.movement-live-badge strong{font-size:14px}.pose-badge>div{display:grid;gap:3px}.pose-badge i{width:1px;height:28px;background:#ffffff17}.pose-badge span{color:#667687;font-size:9px;font-weight:800;letter-spacing:.16em}.pose-badge strong{min-width:52px;font-size:18px;font-variant-numeric:tabular-nums}.panel{min-height:0;padding:18px;overflow-y:auto;border-left:1px solid rgba(255,255,255,.08);background:#0a0e14f0}.panel-section{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.07)}.panel-section:first-child{padding-top:0}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-title span{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.section-title small{color:#5e6b79;font-size:10px}.category-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:10px}.category-tabs button{min-height:32px;padding:0 5px;border:1px solid rgba(255,255,255,.08);border-radius:7px;color:#788696;background:#10161d;font-size:9px;font-weight:800}.category-tabs button.active{border-color:#79c7ff94;color:#e2f3ff;background:#4c9acf2b}.movement-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.movement-card{display:grid;min-height:84px;padding:10px;text-align:left;border:1px solid rgba(255,255,255,.08);border-radius:9px;color:#dce4ec;background:#10161e}.movement-card strong{align-self:end;margin-bottom:5px;font-size:11px}.movement-card span{align-self:start;color:#697888;font-size:9px;line-height:1.35}.movement-card:hover{background:#151d27}.movement-card.active{border-color:#79c7ffa6;background:linear-gradient(145deg,#4a95cc2e,#10161ee6);box-shadow:inset 0 0 0 1px #79c7ff14}.movement-player{display:grid;gap:10px;margin-top:12px;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#070b1085}.movement-selected{display:flex;align-items:center;justify-content:space-between}.movement-selected>div{display:grid;gap:3px}.movement-selected small{color:#596878;font-size:8px;font-weight:900;letter-spacing:.14em}.movement-selected strong{font-size:13px}.movement-selected>span{color:#7a8999;font-size:10px;font-variant-numeric:tabular-nums}.play-mode-row{display:flex;align-items:center;justify-content:space-between;color:#758493;font-size:10px}.segmented-control{display:grid;grid-template-columns:1fr 1fr;min-width:132px;padding:3px;border-radius:8px;background:#0c1117}.segmented-control button{min-height:29px;border:0;border-radius:6px;color:#687788;background:transparent;font-size:9px;font-weight:800}.segmented-control button.active{color:#e6f5ff;background:#1a2c39;box-shadow:0 0 0 1px #79c7ff2e}.movement-actions{display:grid;grid-template-columns:1fr 72px;gap:8px}.play-button,.stop-button{min-height:40px;border-radius:8px;font-size:10px;font-weight:850}.play-button{border:1px solid rgba(121,199,255,.5);color:#e9f7ff;background:#388bc538}.play-button:hover{background:#409ddc4d}.stop-button{border:1px solid rgba(255,255,255,.1);color:#b5c0cb;background:#121820}.movement-progress{height:3px;overflow:hidden;border-radius:999px;background:#17202a}.movement-progress span{display:block;height:100%;border-radius:inherit;background:#75c8ff;transition:width 80ms linear}.playback-note{margin:-3px 0 0;color:#566574;font-size:8px}.telemetry-row{display:flex;align-items:baseline;justify-content:space-between;min-height:29px;color:#798695;font-size:12px}.telemetry-row strong{color:#edf2f7;font-size:13px;font-variant-numeric:tabular-nums}.telemetry-row small{margin-left:5px;color:#667483;font-size:9px;font-weight:600}.animation-grid,.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.animation-button,.preset-grid button{min-height:38px;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#cfd8e2;background:#121821;font-size:10px;font-weight:700}.animation-button:hover,.preset-grid button:hover{background:#19222d}.animation-button.active{border-color:#79c7ffb8;color:#dff3ff;background:#4699d333;box-shadow:inset 0 0 0 1px #79c7ff24}.joint-control{display:block;margin:18px 0}.joint-heading{display:flex;justify-content:space-between;margin-bottom:8px;color:#8592a0;font-size:11px}.joint-heading strong{color:#dce4ec;font-variant-numeric:tabular-nums}.joint-heading strong small{margin-left:6px;color:#657483;font-size:9px;font-weight:600}.joint-control input{width:100%;accent-color:#79c7ff}.range-labels{display:flex;justify-content:space-between;margin-top:4px;color:#566270;font-size:9px}.controls{display:grid;gap:9px}.secondary-button,.estop-button{width:100%;min-height:42px;border-radius:8px;font-size:11px;font-weight:850;letter-spacing:.06em}.secondary-button{border:1px solid rgba(255,255,255,.12);color:#dce4ec;background:#141a22}.secondary-button:hover{background:#1a222d}.estop-button{border:1px solid rgba(255,104,104,.55);color:#ffd8d8;background:#9d1f1f38}.estop-button:hover{background:#bc282857}.engineering-note{margin:16px 0 0;color:#687583;font-size:10px;line-height:1.55}.error-message{margin:14px 0 0;color:#ff9d9d;font-size:11px;line-height:1.5}@media(max-width:980px){.workspace{grid-template-columns:minmax(0,1fr) 350px}}@media(max-width:860px){body{overflow:auto}.app-shell{min-height:100%;height:auto}.workspace{grid-template-columns:1fr;grid-template-rows:62vh auto}.panel{border-top:1px solid rgba(255,255,255,.08);border-left:0}.viewport-hint{display:none}}.face-tracker-section{padding-top:0}.camera-preview{position:relative;width:100%;aspect-ratio:16 / 10;overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:radial-gradient(circle at 50% 45%,rgba(77,103,128,.15),transparent 38%),#080c11}.camera-preview video{width:100%;height:100%;display:block;object-fit:cover;transform:scaleX(-1);opacity:0;transition:opacity .16s ease}.camera-preview.active video{opacity:1}.camera-placeholder{position:absolute;inset:0;display:grid;place-content:center;gap:5px;padding:20px;text-align:center;pointer-events:none}.camera-placeholder strong{color:#a9b5c1;font-size:11px}.camera-placeholder span{max-width:220px;color:#566574;font-size:9px;line-height:1.45}.camera-crosshair{position:absolute;left:50%;top:50%;width:42px;height:42px;transform:translate(-50%,-50%);pointer-events:none}.camera-crosshair:before{content:"";position:absolute;inset:0;border:1px solid rgba(121,199,255,.36);border-radius:50%}.camera-crosshair i,.camera-crosshair b{position:absolute;display:block;background:#79c7ff75}.camera-crosshair i{left:50%;top:-7px;width:1px;height:56px}.camera-crosshair b{left:-7px;top:50%;width:56px;height:1px}.face-box{position:absolute;border:1.5px solid rgba(91,222,153,.88);border-radius:8px;box-shadow:inset 0 0 0 1px #5bde9924,0 0 14px #5bde9921;pointer-events:none;transition:left 80ms linear,top 80ms linear,width 80ms linear,height 80ms linear}.face-box span{position:absolute;left:-1px;top:-20px;padding:2px 5px;border-radius:5px 5px 5px 0;color:#bff4d6;background:#0f422ae0;font-size:8px;font-weight:800}.tracker-actions{display:grid;margin-top:9px}.tracker-start-button,.tracker-stop-button{min-height:42px;border-radius:8px;font-size:10px;font-weight:850}.tracker-start-button{border:1px solid rgba(91,222,153,.45);color:#d9fae7;background:#2f99612b}.tracker-start-button:hover{background:#2f996140}.tracker-stop-button{border:1px solid rgba(255,255,255,.12);color:#d7dee6;background:#131a22}.tracker-slider{display:block;margin-top:12px}.tracker-slider>div{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:6px;color:#71808f;font-size:10px}.tracker-slider strong{color:#dce5ed;font-variant-numeric:tabular-nums}.tracker-slider input{width:100%;accent-color:#5bde99}.tracker-options{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.tracker-options label{display:flex;align-items:center;gap:7px;min-height:36px;padding:0 9px;border:1px solid rgba(255,255,255,.07);border-radius:7px;color:#778694;background:#0f151c;font-size:9px}.tracker-options input{accent-color:#5bde99}.tracker-note{margin:9px 0 0;color:#586675;font-size:8px;line-height:1.5}