@font-face{font-family:Manrope;src:url('/vendor/manrope-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Manrope;src:url('/vendor/manrope-500.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:Manrope;src:url('/vendor/manrope-600.ttf') format('truetype');font-weight:600;font-display:swap}@font-face{font-family:Manrope;src:url('/vendor/manrope-700.ttf') format('truetype');font-weight:700;font-display:swap}@font-face{font-family:Manrope;src:url('/vendor/manrope-800.ttf') format('truetype');font-weight:800;font-display:swap}
:root{font-family:Manrope,'Segoe UI',sans-serif;font-size:16px;color:#25242e;background:#f6f5f8;color-scheme:light;--ink:#25242e;--muted:#777580;--purple:#7554c6;--lilac:#e9e0fc;--border:#e8e6ed;--focus:#7352c2}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:not-allowed}a{color:inherit;text-decoration:none}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[hidden]{display:none!important}.icon-library{position:absolute;width:0;height:0;overflow:hidden}:focus-visible{outline:3px solid #7150be;outline-offset:5px}.skip-link{position:fixed;z-index:10;top:-80px;background:white;padding:15px;border-radius:10px}.skip-link:focus{top:10px;left:100px}button{color:var(--ink);background:white;border:1px solid var(--border);border-radius:12px;min-height:48px;font-weight:700}button:hover:not(:disabled){border-color:#b9a7df}button:active:not(:disabled){transform:translateY(1px)}
.rail{position:fixed;inset:0 auto 0 0;width:88px;background:#292832;color:#aaa7b5;display:flex;align-items:center;flex-direction:column;padding:28px 12px;gap:20px;z-index:2}.brand{width:48px;height:48px;background:#d7c5fb;border-radius:16px;color:#332547;display:grid;place-items:center;margin-bottom:40px}.brand svg{width:30px;height:30px}.rail>a:not(.brand),.rail>button{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:7px;width:64px;min-height:66px;background:transparent;border:0;color:inherit;border-radius:14px;font-size:10px;font-weight:600}.rail .rail-active{color:#e3d5ff!important;background:#40374f!important}.rail>button:hover{background:#393741}.rail-bottom{margin-top:auto;font-size:13px;font-weight:700;color:#e2dfe9;text-align:center}.rail-bottom span{display:block;font-size:8px;color:#aaa7b5;margin-top:5px}.app-shell{margin-left:88px}.topbar{height:100px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 42px;border-bottom:1px solid var(--border)}.wordmark{font-size:22px;font-weight:800;letter-spacing:-1px}.wordmark>span:first-child{font-weight:400;margin:0 2px;color:#8e8899}.wordmark-dot{color:#8b62d8}.top-actions{display:flex;align-items:center;gap:28px}.local-badge{font-size:11px;color:#666270;display:flex;gap:7px;align-items:center}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#719382;flex-shrink:0}.profile-chip{display:flex;align-items:center;gap:10px;background:transparent;border:0;font-size:12px;min-height:44px;padding:0}.avatar{display:grid;place-items:center;width:36px;height:36px;background:#ece6f5;border:1px solid #dbd0eb;border-radius:50%;color:#68547f;font-size:13px;font-weight:800}.chevron{font-size:18px;color:#8a8593}main{max-width:1500px;margin:auto;padding:40px 42px 20px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:34px}.eyebrow{font-size:10px;letter-spacing:1.9px;font-weight:800;color:#8c829c;margin:0 0 10px}h1{font-size:clamp(30px,3.4vw,48px);line-height:1.16;letter-spacing:-2px;font-weight:800;margin:0}h1>span{color:#92909a;font-weight:500}.page-subtitle{font-size:13px;color:#797682;margin:12px 0 0;line-height:1.6}.secondary-button{min-height:46px;padding:11px 18px;background:#fff;border:1px solid #dedbe6;font-size:12px;white-space:nowrap}.primary-button{min-height:48px;padding:12px 18px;background:#302d3a;color:white;border:1px solid #302d3a;font-size:12px;display:flex;align-items:center;justify-content:center;gap:20px}.primary-button:hover:not(:disabled){background:#4b3f64;border-color:#4b3f64}.dashboard{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}.remote-section,.setup-column{min-width:0}.device-switcher{display:flex;gap:12px;margin-bottom:20px}.device{display:flex;align-items:center;gap:12px;flex:1;min-width:0;border:1px solid var(--border);border-radius:15px;background:#efedf3;padding:16px;font-size:13px;font-weight:700}.device svg{width:22px;height:22px}.device div>span{display:block;font-size:9px;color:#80798c;font-weight:500;margin-top:4px}.device.active{background:#fff;border-color:#cec1e6;box-shadow:0 4px 12px #40305204}.device.active>svg{color:#7554a4}.device-dot{margin-left:auto;width:6px;height:6px;background:#9e85c5;border-radius:50%}.device.unavailable{color:#77727f}.remote-card{background:white;border:1px solid var(--border);border-radius:23px;padding:25px;box-shadow:0 6px 25px #31204503}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading h2{font-size:22px;letter-spacing:-.8px;margin:0;font-weight:700}.section-heading .eyebrow{font-size:9px;letter-spacing:1.7px;margin-bottom:6px}.pill{font-size:10px;border:1px solid #e6e1ed;border-radius:8px;padding:6px 12px;color:#797280;background:#faf9fc}.connection-status{font-size:10px;color:#85808c;padding:0;margin:12px 0 24px;line-height:1.6}.connection-status:before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#a3a0ad;margin-right:7px}body[data-connected=true] .connection-status:before{background:#648c75}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.grid button{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:139px;padding:18px 14px 17px;background:#f7f6f9;border:1px solid #eeecf2;border-radius:15px;text-align:left;isolation:isolate}.control-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#eeebf2;color:#736c7d}.control-icon svg{width:21px;height:21px}.control-label{font-size:12px;font-weight:700;line-height:1.35;margin-top:20px;z-index:1}.focus-label{position:absolute;top:18px;right:12px;font-size:8px;letter-spacing:.6px;text-transform:uppercase;font-weight:800;display:none;color:#795bac}.grid button.selected:not(:disabled){background:#e9e0fb;border-color:#c7b1ef;box-shadow:0 0 0 2px #ffffff,0 0 0 3px #e3d7f4}.grid button.selected:not(:disabled) .control-icon{background:#d9c8f4;color:#584072}.grid button.selected:not(:disabled) .focus-label{display:block}.grid button.selected:before{content:'';position:absolute;inset:auto auto 0 0;height:4px;width:var(--hold-progress,0%);background:#8b63cf;z-index:0}.grid button:disabled{color:#96919d;background:#faf9fc;opacity:.7}.grid button:disabled .control-icon{color:#aaa3b3}.result-line{border-top:1px solid #efedf3;margin-top:24px;padding-top:16px;display:flex;align-items:flex-start;gap:8px}.result-dot{margin-top:6px;width:5px;height:5px;border-radius:50%;background:#b2a5c7;flex-shrink:0}#result{margin:0;font-size:11px;line-height:1.6;color:#7c7688}.hold-feedback{display:flex;gap:17px;align-items:center;background:#292632;color:white;padding:23px;border-radius:19px;margin-top:20px;box-shadow:0 6px 15px #2d234312}.hold-icon{background:#3e374c;color:#ceb5f7;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex-shrink:0}.hold-copy{flex:1;min-width:0}.hold-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.hold-title strong{font-size:13px;font-weight:700}.hold-title>span{font-size:9px;letter-spacing:1px;color:#c7b4e5;background:#40364e;border-radius:5px;padding:4px 7px}#hold-status{font-size:10px;line-height:1.6;color:#c7c0d3;margin:7px 0 13px}#hold-progress{display:block;width:100%;height:5px;border:0;border-radius:10px;overflow:hidden;background:#514858;accent-color:#d7bbff}#hold-progress::-webkit-progress-bar{background:#514858}#hold-progress::-webkit-progress-value{background:#d7bbff}#hold-progress::-moz-progress-bar{background:#d7bbff}.gesture-guide{display:flex;justify-content:center;gap:24px;color:#87808f;font-size:10px;margin-top:18px}.gesture-guide span{display:flex;gap:7px;align-items:center}.gesture-guide b{font-size:16px;font-weight:500;color:#6e637e}.vision-card{border:1px solid var(--border);border-radius:23px;padding:20px;background:white}.vision-card .section-heading h2{font-size:15px;letter-spacing:-.3px}.private-label{font-size:9px;color:#7e7886;display:flex;align-items:center;gap:5px}.private-label .status-dot{width:4px;height:4px}.camera-preview{position:relative;line-height:0;background:#26222d;border-radius:14px;margin-top:18px;overflow:hidden;min-height:156px}.camera-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#c8bbdc}.camera-empty svg{width:35px;height:35px;stroke-width:1}.camera-empty span{font-size:10px;line-height:1.4;color:#aba0b9}video{position:relative;display:block;width:100%;min-height:156px;max-height:220px;object-fit:contain;transform:scaleX(-1)}.camera-preview canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:scaleX(-1)}.preview-label{position:absolute;top:12px;left:12px;padding:5px 7px;border-radius:5px;font-size:7px;letter-spacing:1px;line-height:1;color:#e9e1f2;background:#302837aa}.camera-preview.live .camera-empty{display:none}#direction{font-size:11px;font-weight:700;color:#84758d;background:#f3eff8;padding:10px 12px;margin-top:12px;border-radius:9px;line-height:1.4}#direction[data-direction=center],#direction[data-direction=left],#direction[data-direction=right]{color:#624788;background:#ede3fc}#tracking{font-size:10px;line-height:1.6;color:#827a8b;min-height:32px;margin:10px 2px}.row{display:flex;gap:8px}.camera-actions .primary-button{flex:1;justify-content:space-between}.camera-actions .secondary-button{font-size:11px;padding-inline:15px}.camera-legend{font-size:9px;line-height:1.6;color:#8b8394;text-align:center;margin:12px 0 0}.setup-card{border:1px solid var(--border);border-radius:18px;background:white;margin-top:18px;overflow:hidden}details+details{border-top:1px solid var(--border)}summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px;font-size:11px;font-weight:700;min-height:56px}summary::-webkit-details-marker{display:none}summary>span:first-child{display:flex;gap:10px;align-items:center}.step-marker{font-size:8px;color:#8e809f;letter-spacing:1px}.summary-toggle{font-size:18px;font-weight:400;color:#a092b1}details[open] .summary-toggle{transform:rotate(45deg)}.details-content{padding:0 18px 18px}.setup-hint{font-size:10px;line-height:1.7;color:#8a8293;margin:0 0 13px}.saved-status{font-size:10px;color:#79628f;font-weight:600;line-height:1.5;margin:0 0 10px}.calibration-steps button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex:1;min-height:66px;font-size:10px;background:#faf8fc;border-radius:10px}.calibration-steps button span{font-size:9px;color:#9887ad}.calibration-steps button[data-complete=true]{background:#ede4f8;border-color:#d9c7ed}.calibration-steps button[data-active=true]{background:#dac5f6;border-color:#9271bd}#calibration{font-size:10px;line-height:1.6;color:#7c6b8e;margin:12px 0 0}label{display:block;font-size:11px;font-weight:700;margin:0 0 9px}input{display:block;width:100%;min-width:0;min-height:48px;padding:12px 14px;background:#fcfbfd;border:1px solid #e4dfec;border-radius:10px;color:var(--ink);font-size:13px}input::placeholder{color:#a69bae}.connect-form{display:flex;gap:6px}.connect-form input{font-size:11px}.connect-form button{font-size:10px;padding:10px}.connect-form+.setup-hint{margin-top:10px;margin-bottom:0}footer{display:flex;justify-content:space-between;gap:15px;margin-top:28px;padding:18px 0;border-top:1px solid var(--border);font-size:9px;color:#938b9e}footer>span:first-child{display:flex;gap:7px;align-items:center}
dialog{width:min(460px,calc(100% - 32px));padding:30px;border:1px solid #e4dced;border-radius:26px;background:#fdfcfe;box-shadow:0 25px 100px #25163330;color:var(--ink);max-height:90dvh;overflow:auto}dialog::backdrop{background:#25203166;backdrop-filter:blur(7px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.dialog-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#eadffb;color:#75549a}.icon-button{font-size:24px;min-height:44px;width:44px;border:0;color:#94859f;background:transparent}.dialog-heading+.eyebrow{font-size:9px}dialog h2{font-size:32px;letter-spacing:-1.2px;line-height:1.18;margin:8px 0 14px}.dialog-intro{font-size:13px;line-height:1.7;color:#8a7f92;margin:0 0 24px}.create-profile{width:100%;margin-top:12px;justify-content:space-between}.profile-list{display:grid;gap:8px;margin-bottom:20px}.profile-option{display:flex;align-items:center;gap:12px;text-align:left;padding:12px;border:1px solid #e6ddee;min-height:66px}.profile-option>div{display:flex;flex-direction:column;gap:4px;flex:1}.profile-option strong{font-size:13px}.profile-option small{font-size:10px;color:#8c7f96;font-weight:400}.profile-option.active{background:#f0e8fa;border-color:#c6aee4}.profile-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:10px}.text-button{font-size:10px;min-height:44px;padding:8px;border:0;background:transparent;color:#7a668e}.profile-privacy{border-top:1px solid #e8e0ed;margin:15px 0 0;padding-top:16px;font-size:9px;line-height:1.7;color:#998ba4}#profile-message{font-size:12px;line-height:1.5;color:#8e4f61}.text-button:hover{color:#43295e}
@media(min-width:1450px){.dashboard{grid-template-columns:minmax(0,1fr) 350px;gap:32px}.grid button{min-height:165px;padding:22px}.control-label{font-size:14px}.control-icon{width:42px;height:42px}.remote-card{padding:30px}.focus-label{top:24px;right:15px}.camera-preview,video{min-height:190px}}
@media(max-width:1180px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid button{min-height:125px}.device{padding:12px;gap:8px}.device svg{width:19px;height:19px}.device-dot{display:none}.dashboard{grid-template-columns:minmax(0,1fr) 285px;gap:20px}.topbar{margin-inline:28px}main{padding-inline:28px}.remote-card{padding:20px}.focus-label{font-size:7px}.page-heading h1{font-size:35px;letter-spacing:-1.6px}.page-heading h1>span{display:block}.device div>span{font-size:8px}.device{font-size:11px}}
@media(max-width:850px){.rail{width:68px;padding-inline:7px}.rail>a:not(.brand),.rail>button{width:52px}.brand{width:43px;height:43px}.app-shell{margin-left:68px}.dashboard{grid-template-columns:1fr}.setup-column{display:grid;grid-template-columns:1fr 1fr;gap:18px}.setup-card{margin:0;align-self:start}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.grid button{min-height:135px}.control-label{font-size:11px}.focus-label{font-size:6px;right:7px}.local-badge{display:none}.topbar{height:80px}.page-heading{margin-bottom:24px}.page-heading h1>span{display:inline}.page-heading h1{font-size:30px}.page-heading{align-items:flex-start}#pause{font-size:10px;padding:10px}.device{padding:16px}.device div>span{font-size:9px}main{padding-top:28px}}
@media(max-width:600px){.rail{display:none}.app-shell{margin:0}.topbar{margin:0 20px;height:76px}.wordmark{font-size:19px}.top-actions{gap:0}.profile-chip{font-size:11px}.profile-chip .chevron{display:none}main{padding:25px 18px 15px}.page-heading{flex-wrap:wrap;gap:18px}.page-heading h1{font-size:31px}.page-heading h1>span{display:block}.page-heading .eyebrow{font-size:8px}#pause{margin-top:0;font-size:11px}.page-subtitle{font-size:12px}.device-switcher{gap:8px}.device{padding:12px;gap:8px}.device svg{width:18px;height:18px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.grid button{min-height:128px;padding:18px}.control-label{font-size:13px}.focus-label{font-size:8px;right:15px}.setup-column{grid-template-columns:1fr}.vision-card{padding:20px}.camera-preview,video{max-height:240px}.setup-card{margin-top:0}.gesture-guide{gap:15px;font-size:9px}.hold-feedback{padding:20px;gap:12px}.hold-icon{width:40px;height:40px}.hold-title strong{font-size:12px}.remote-card{padding:19px}.section-heading h2{font-size:22px}footer{flex-wrap:wrap;font-size:9px}dialog{padding:25px}.device.unavailable{background:#efedf3}.connect-form button{padding:12px 18px}.setup-hint,#tracking,.saved-status,#calibration{font-size:12px}.camera-legend{font-size:10px}summary{font-size:13px}.calibration-steps button{font-size:12px}.connection-status{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}@media(forced-colors:active){button,input{border:1px solid ButtonText}.grid button.selected{outline:3px solid Highlight}.focus-label{display:block}}
/* Keep active controls legible and reduce scrolling on laptop screens. */
.control-label{font-size:14px}.connection-status,#result{font-size:12px}.hold-title strong{font-size:14px}#hold-status{font-size:12px}#direction{font-size:12px}#tracking,.saved-status,#calibration,.setup-hint{font-size:11px}.camera-legend{font-size:10px}.device{font-size:13px}.device div>span{font-size:10px}.profile-privacy{font-size:11px}.dialog-intro{color:#716777}.profile-chip{font-size:13px}.hold-feedback{position:sticky;bottom:16px;z-index:1}.setup-column{position:sticky;top:18px}
@media(min-width:851px) and (max-width:1180px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.grid button{min-height:112px;padding:14px 12px}.control-label{font-size:13px}.focus-label{font-size:7px;right:9px;top:12px}.control-icon{width:32px;height:32px}.page-heading h1>span{display:inline}.topbar{height:82px}.page-heading{margin-bottom:26px}main{padding-top:30px}.page-heading h1{font-size:34px}.remote-card{padding:20px}.section-heading h2{font-size:21px}.control-icon svg{width:20px;height:20px}.focus-label{top:53px;left:12px;right:auto}.control-label{margin-top:24px}}
@media(max-width:850px){.setup-column{position:static}.hold-feedback{bottom:8px}.control-label{font-size:13px}}
.hold-feedback{position:static}.grid button{scroll-margin-block:24px}.profile-chip #profile-label{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-option strong{overflow-wrap:anywhere}.profile-option>div{min-width:0}.page-subtitle{color:#77707f}.dialog-intro{font-size:14px}.profile-option small{font-size:11px}
@media(max-width:600px){.profile-chip #profile-label{max-width:95px}.profile-privacy{font-size:11px}}

/* Warm plum, high-contrast palette. System colors remain in charge in forced-colors mode. */
@media (forced-colors: none) {
  :root {
    --ink: #291b32; --muted: #594360; --purple: #872c79;
    --lilac: #f0d9f1; --border: #e4d7e7; --control-border: #916a9a;
    --focus: #81216f; color: var(--ink); background: #fcf7fc;
  }
  button, input { color: var(--ink); }
  button { background: #ffffff; }
  .rail { background: #32163d; color: #e9c9ee; }
  .rail .rail-active { color: #fff4ff!important; background: #78336e!important; }
  .rail > button:hover { background: #51224f; }
  .brand { color: #32163d; background: #e6b5e8; }
  .rail-bottom { color: #fff4ff; }
  .rail-bottom span { color: #e9c9ee; }
  .wordmark > span:first-child, .wordmark-dot { color: #872c79; }
  .avatar { background: #f0d9f1; border-color: #916a9a; color: #60265e; }
  .local-badge, .chevron, .eyebrow, h1 > span, .page-subtitle,
  .device div > span, .device.unavailable, .pill, .connection-status,
  #result, .gesture-guide, .gesture-guide b, .private-label, #direction,
  #tracking, .camera-legend, .step-marker, .summary-toggle, .setup-hint,
  .saved-status, #calibration, .calibration-steps button span, footer,
  .icon-button, .dialog-intro, .profile-option small, .profile-privacy,
  .text-button { color: var(--muted); }
  .text-button:hover { color: #602052; }
  .primary-button, #start, #connect { color: #fff; background: #872c79; border-color: #872c79; }
  .primary-button:hover:not(:disabled), #start:hover:not(:disabled), #connect:hover:not(:disabled) { color: #fff; background: #68205e; border-color: #68205e; }
  .secondary-button, .remote-card, .vision-card, .setup-card, .profile-option { background: #ffffff; }
  .device { background: #f3edf5; border-color: #e4d7e7; }
  .device.active { background: #f0d9f1; border-color: #916a9a; }
  .device.active > svg { color: #872c79; }
  .device.unavailable { background: #f3edf5; }
  .pill { background: #f8edf8; border-color: #e4d7e7; }
  .grid button { background: #fcf6ff; border-color: var(--control-border); }
  .control-icon { background: #efddf7; color: #6f287c; }
  .grid button.selected:not(:disabled) {
    background: #e6b5e8; border-color: #872c79;
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #872c79;
  }
  .grid button.selected:not(:disabled) .control-icon { background: #872c79; color: #fff; }
  .focus-label { color: #542052; }
  .grid button.selected::before { background: #872c79; }
  .grid button:disabled { color: #6c5a73; background: #f0eaf2; opacity: 1; border-color: #b3a0ba; border-style: dashed; }
  .grid button:disabled .control-icon { color: #6c5a73; background: #e5dbe9; }
  .result-line { border-color: #e4d7e7; }
  .hold-feedback { background: #452047; color: #fcf7fc; }
  .hold-icon { background: #64365f; color: #f6c8ee; }
  .hold-title > span { background: #64365f; color: #f0d9f1; }
  #hold-status { color: #f7dff7; }
  #hold-progress { height: 8px; background: #f0d9f1; accent-color: #872c79; }
  #hold-progress::-webkit-progress-bar { background: #f0d9f1; }
  #hold-progress::-webkit-progress-value { background: #872c79; }
  #hold-progress::-moz-progress-bar { background: #872c79; }
  .camera-preview { background: #32163d; }
  .camera-empty { color: #f0d9f1; }
  .camera-empty span { color: #e9c9ee; }
  .preview-label { color: #fcf7fc; background: #32163d; }
  #direction { background: #f3edf5; }
  #direction[data-direction=center], #direction[data-direction=left], #direction[data-direction=right] { color: #60265e; background: #f0d9f1; }
  .calibration-steps button { background: #fcf6ff; }
  .calibration-steps button[data-complete=true] { background: #f0d9f1; border-color: #916a9a; }
  .calibration-steps button[data-active=true] { background: #e6b5e8; border-color: #872c79; }
  input { color: var(--ink); background: #ffffff; border-color: var(--control-border); }
  input::placeholder { color: var(--muted); opacity: 1; }
  .secondary-button, .calibration-steps button, .profile-option { border-color: var(--control-border); }
  button:hover:not(:disabled) { border-color: var(--focus); }
  :focus-visible { outline-color: var(--focus); }
  .rail :focus-visible { outline-color: #f4bff0; }
  .status-dot, .device-dot { background: #8b367d; }
  .connection-status::before, .result-dot { background: #916a9a; }
  body[data-connected=true] .connection-status::before { background: #436347; }
  dialog { color: var(--ink); background: #fcf7fc; border-color: #e4d7e7; }
  dialog::backdrop { background: #32163d66; }
  .dialog-mark { background: #f0d9f1; color: #872c79; }
  .icon-button, .text-button { background: transparent; }
  .profile-option.active { background: #f0d9f1; border-color: #872c79; }
  .profile-privacy { border-color: #e4d7e7; }
  #profile-message { color: #a12d43; }
}
/* Supporting text remains readable without changing the control workflow. */
.local-badge, .eyebrow, .section-heading .eyebrow, .device div > span,
.pill, .private-label, .step-marker, .calibration-steps button span,
.hold-title > span, .profile-privacy, footer { font-size: 12px; }
.page-subtitle, .connection-status, #result, #hold-status, #direction,
#tracking, .camera-legend, .setup-hint, .saved-status, #calibration,
.dialog-intro, .profile-option small { font-size: 14px; }
.gesture-guide { font-size: 12px; flex-wrap: wrap; }
.control-label { font-size: 16px; }
.focus-label { font-size: 10px; }
.calibration-steps button, summary, label, .text-button { font-size: 13px; }
input, .connect-form input { font-size: 16px; }
.connect-form button { font-size: 13px; }
.preview-label { font-size: 10px; }
@media (max-width: 1180px) and (min-width: 851px) {
  .grid button { min-height: 134px; }
}
@media (max-width: 850px) and (min-width: 601px) {
  .grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Guided setup is separate from everyday room controls. */
[hidden] { display: none !important; }
.setup-nudge { padding: 16px 20px; border: 1px solid var(--control-border); border-radius: 20px; background: #f0d9f1; }
.setup-nudge p { margin: 0 0 10px; font-weight: 700; }
.profile-settings { padding: 18px; margin: 20px 0; border-radius: 18px; background: #f0d9f1; }
.profile-settings p { margin: 0 0 14px; font-size: 15px; line-height: 1.6; }
.profile-settings-actions { display: flex; flex-wrap: wrap; gap: 10px; }
dialog.setup-dialog { width: min(680px,calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 28px; overflow-y: auto; box-sizing: border-box; }
.setup-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.setup-heading .eyebrow { margin: 0; }
.setup-dialog h2 { font-size: clamp(25px,4vw,34px); line-height: 1.18; margin: 16px 0; }
.setup-copy { font-size: 17px; line-height: 1.65; color: var(--ink); margin: 0 0 18px; }
.setup-target { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 80px; padding: 12px; background: #f0d9f1; color: #542052; border-radius: 20px; margin: 18px 0; }
#setup-symbol { font-size: 42px; font-weight: 700; line-height: 1.2; }
#setup-target-label { font-size: 18px; font-weight: 700; }
.setup-target[data-direction="left"] { justify-content: flex-start; }
.setup-target[data-direction="right"] { justify-content: flex-end; }
.setup-dialog .vision-card { padding: 18px; border: 1px solid var(--control-border); }
.setup-dialog .camera-preview { height: 160px; aspect-ratio: auto; }
.setup-dialog .camera-legend { margin-bottom: 0; }
.setup-dialog .camera-legend, .setup-dialog .preview-label { display: none; }
.setup-dialog[data-step="center"] .camera-actions,
.setup-dialog[data-step="left"] .camera-actions,
.setup-dialog[data-step="right"] .camera-actions { display: none; }
.setup-dialog[data-step="center"] #tracking,
.setup-dialog[data-step="left"] #tracking,
.setup-dialog[data-step="right"] #tracking { display: none; }
.setup-dialog #saved-status { display: none; }
.setup-dialog .section-heading { margin-bottom: 12px; }
.setup-dialog .section-heading h2 { margin: 0; font-size: 18px; }
.setup-dialog .calibration-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 14px; }
.setup-dialog .calibration-steps > div { display: grid; gap: 5px; justify-items: center; border: 1px solid var(--control-border); border-radius: 14px; padding: 12px 4px; color: var(--ink); background: white; }
.setup-dialog .calibration-steps > div[data-active="true"] { outline: 3px solid #872c79; background: #f0d9f1; }
.setup-dialog .calibration-steps > div[data-complete="true"] { background: #f0d9f1; border-color: #872c79; }
.calibration-number { font-weight: 800; }
.setup-dialog .calibration-steps small { font-size: 12px; color: var(--ink); }
.setup-note { font-size: 14px; line-height: 1.6; color: var(--muted); }
.setup-error { font-size: 15px; line-height: 1.5; color: #a12d43; font-weight: 600; }
.setup-note:empty, .setup-error:empty { display: none; }
.setup-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: 22px; position: sticky; bottom: -28px; background: #fcf7fc; padding: 12px 0; z-index: 1; }
.setup-footer .primary-button { margin-left: auto; }
.setup-dialog button, .profile-settings button, .setup-nudge button { min-height: 48px; font-size: 15px; }
#setup-later { display: block; margin: 12px auto 0; }
.setup-dialog button:disabled { opacity: 1; background: #ede7ef; color: #594360; border-color: #916a9a; cursor: default; }
@media (max-width: 480px) {
 dialog.setup-dialog { padding: 20px; }
 .setup-footer { bottom: -20px; }
 .setup-copy { font-size: 16px; }
 .setup-footer { flex-wrap: wrap; }
 .setup-footer button { flex: 1; }
 .profile-settings-actions { flex-direction: column; }
}