/* Vision Lab: shared visual language for student and operator surfaces. */
:root,html.light{--bg:#f5f5f8;--sf:#fff;--sf2:#f0eff5;--bd:#e3e1eb;--tx:#252331;--fg:#252331;--dim:#706d80;--panel:#fff;--accent:#7051d6;--accent-text:#6241c6;--accent-dim:#eee9fc;--accent-glow:rgba(112,81,214,.15);--red:#ce3b50;--purple:#7051d6;--yellow:#a77318;--cyan:#267f89;--blue:#4369c8;}
html.dark{--bg:#16151c;--sf:#201e29;--sf2:#2b2837;--bd:#393545;--tx:#f1eff7;--fg:#f1eff7;--dim:#aaa4ba;--panel:#201e29;--accent:#b19af7;--accent-text:#c4afff;--accent-dim:#352b50;--accent-glow:rgba(177,154,247,.12);--red:#ff8393;}
body{letter-spacing:-.015em;}
button,select,textarea,input{font-family:var(--font-ui,inherit);}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}
.brand-lockup{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:750;letter-spacing:-.6px;color:var(--tx);}
.brand-lockup img{width:34px!important;height:34px!important;border-radius:10px;}
.brand-lockup small{font-weight:450;color:var(--dim);}
#intro{position:fixed;justify-content:center;background:var(--bg);padding:40px;}
.intro-bg{display:none;}
.intro-content{display:grid;grid-template-columns:1.1fr 1fr;grid-template-areas:'brand brand' 'title visual' 'tag visual' 'pipe visual' 'langs visual' 'hw visual' 'footer footer';column-gap:76px;row-gap:0;width:100%;max-width:1120px;text-align:left;padding:0;}
.intro-content>*{animation:none;opacity:1;transform:none;}
.intro-logo{grid-area:brand;margin:0 0 68px;}
.intro-title{grid-area:title;font-family:var(--font-ui);font-size:clamp(38px,4.8vw,66px);font-weight:750;letter-spacing:-.065em;line-height:1.12;margin:0 0 22px;}
.intro-title strong{display:block;background:none;-webkit-text-fill-color:var(--accent);filter:none;animation:none;font-weight:750;}
.intro-tagline{grid-area:tag;font-size:16px;line-height:1.8;letter-spacing:-.01em;max-width:380px;margin:0 0 25px;}
.intro-hw{grid-area:hw;justify-self:start;background:none;border:0;border-radius:0;margin:18px 0 0;padding:0;font-size:12px;font-weight:450;}
.intro-hero{grid-area:visual;align-self:stretch;position:relative;display:flex;align-items:center;width:100%;margin:0;min-height:350px;background:var(--accent-dim);border-radius:28px;overflow:hidden;}
.intro-hero::before{content:'VISION / LAB';position:absolute;left:28px;top:28px;font-size:12px;font-weight:650;letter-spacing:.16em;color:var(--accent-text);}
.intro-hero::after{content:'01  SEE     /     02  THINK     /     03  MOVE';position:absolute;bottom:28px;left:28px;right:28px;border-top:1px solid var(--bd);padding-top:18px;font-size:11px;letter-spacing:.06em;color:var(--dim);}
.intro-hero svg{width:125%;max-width:none;flex-shrink:0;margin-left:-13%;}
.intro-hero svg *{animation:none!important;}
.intro-pipe{grid-area:pipe;justify-content:flex-start;gap:12px;font-family:var(--font-ui);margin:0 0 32px;font-size:11px;letter-spacing:.09em;}
.intro-pipe .pp{animation:none;color:var(--dim);background:none;padding:0;border:0;box-shadow:none;}
.lang-cards{grid-area:langs;justify-content:flex-start;gap:10px;margin:0;}
.lang-card{width:118px;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 12px;border:1px solid var(--bd);background:var(--sf);border-radius:10px;color:var(--tx);font-family:var(--font-ui);}
.lang-card:first-child{background:var(--accent);border-color:var(--accent);color:var(--sf);}
.lang-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 6px 16px var(--accent-glow);}
.lang-card::after{display:none;}
.lang-code,.lang-card:hover .lang-code{width:auto;height:auto;margin:0;background:none;box-shadow:none;border-radius:0;font-size:10px;color:inherit;opacity:.75;transform:none;}
.lang-card .name{font-size:14px;font-weight:650;color:inherit;}
.intro-footer{grid-area:footer;margin-top:60px;padding-top:22px;border-top:1px solid var(--bd);display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--font-ui);font-size:11px;color:var(--dim);text-align:left;}
.intro-footer a{border:0;padding:0;margin:0;border-radius:0;color:var(--dim);font-size:12px;}
.intro-footer a:hover{background:none;color:var(--accent);transform:none;}
#app{height:100dvh;}
.hd{height:76px;padding:0 32px;border-bottom:1px solid var(--bd);background:var(--sf);}
.hd-logo{border:0;background:none;padding:0;}
.hd-sub{font-size:12px;letter-spacing:.04em;}
.hd-badge{background:var(--accent-dim);color:var(--accent-text);font-family:var(--font-ui);font-size:12px;height:34px;}
.hd-btn,.lang-sw{background:transparent;height:40px;border-radius:9px;}
.hd-icons{padding-left:10px;border-left:1px solid var(--bd);}
.workspace-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:24px 32px 18px;}
.workspace-head h1{font-size:23px;font-weight:700;letter-spacing:-.035em;}
.workspace-head p{font-size:13px;color:var(--dim);}
.main{grid-template-columns:minmax(0,1fr) 360px;gap:22px;padding:0 32px 26px;}
.cam-area{background:var(--sf);border:1px solid var(--bd);border-radius:16px;overflow:hidden;}
.camera-heading{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;font-size:13px;font-weight:650;}
.camera-heading span:last-child{font-size:10px;color:var(--dim);letter-spacing:.1em;font-weight:500;}
.cam-box{border-radius:0;}
#camIdle{background:#eeedf3!important;gap:16px!important;}
html.dark #camIdle{background:#24212e!important;}
#camIdle>div:first-child{width:72px;height:72px;border:1px solid var(--bd);border-radius:22px;background:var(--sf);display:grid;place-items:center;font-size:28px!important;color:var(--accent)!important;}
#camIdleTitle{font-size:20px!important;font-weight:650!important;}
#camIdleSub{font-size:13px!important;}
#camIdleKey,#camIdleBle{border:0!important;background:var(--sf);font-size:11px!important;color:var(--dim)!important;}
.cam-steps{top:16px;right:16px;background:rgba(255,255,255,.9);padding:4px;gap:1px;border-radius:8px;}
.mode-pill{font-size:11px;padding:6px 11px;border-radius:5px;color:#777181;}
.mode-pill.search,.mode-pill.track,.mode-pill.arrive{background:var(--accent);color:var(--sf);}
.cam-mission{top:16px;left:16px;font-size:14px;padding:8px 12px;max-width:48%;border-radius:8px;}
.cam-status{left:16px;bottom:16px;font-size:10px;border-radius:6px;}
.side{gap:12px;}
.card{border:1px solid var(--bd);border-radius:14px;padding:18px;gap:14px;}
.card-mission{order:-1;}
.section-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:650;color:var(--tx);}
.section-label .icon{color:var(--accent);width:17px;height:17px;}
.card-hd{font-size:12px;letter-spacing:0;color:var(--dim);}
.live-dot{width:6px;height:6px;box-shadow:none;background:var(--accent);}
.card-brain{flex:1;min-height:175px;}
.brain-body{gap:12px;flex-direction:column;flex:0 0 auto;}
.reason-box{font-size:15px;line-height:1.65;font-weight:450;flex:0 0 auto;min-height:1.65em;max-height:160px;}
.ai-frame-wrap:has(.ai-frame[style*="none"]){display:none;}
.ai-frame-wrap{display:flex;width:100%;max-width:220px;align-self:center;}
.ai-frame-image{position:relative;width:100%;flex:none;}
.ai-frame{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;}
#aiFrameOverlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.metrics{gap:0;border-top:1px solid var(--bd);padding-top:13px;}
.metric{flex:1;}
.metric .k{font-size:10px;color:var(--dim);letter-spacing:0;}
.metric .v{font-size:18px;font-family:var(--font-ui);font-weight:650;}
.motor-row{gap:10px;}
.motor-gauge{border:1px solid var(--bd);border-radius:10px;padding:10px 14px;gap:8px;}
.motor-gauge .nm{font-size:10px;color:var(--dim);}
.motor-gauge .bar{height:3px;}
.card-log{padding:13px 16px;}
.log-wrap{height:62px;font-size:11px;}
.le,.le .t{color:var(--dim);}
.lt-title{font-size:11px;font-weight:450;color:var(--dim);letter-spacing:0;line-height:1.5;}
.lt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-height:134px;gap:6px;scrollbar-width:thin;padding-right:4px;}
.chip{border:1px solid transparent;background:var(--sf2);color:var(--dim);font-family:var(--font-ui);font-size:12px;border-radius:7px;justify-content:center;padding:9px 7px;}
.lt-chip{min-height:38px;}
.lt-chip.active{background:var(--accent-dim);border:1px solid var(--accent);color:var(--accent-text);font-weight:650;}
.btn-go{background:var(--accent);color:var(--sf);font-weight:650;}
.btn-go:hover{background:var(--accent-text);box-shadow:0 4px 12px var(--accent-glow);}
.btn-stop{border:1px solid var(--bd);background:var(--sf);}
.prompt-input{font-size:14px;border:1px solid var(--bd);background:var(--sf2);}
.drawer{background:var(--sf);border-left:1px solid var(--bd);box-shadow:-12px 0 40px rgba(30,20,50,.08);}
.drawer-overlay{background:rgba(30,25,45,.28);backdrop-filter:blur(3px);}
#guideModal,#missionModal{background:rgba(30,25,45,.35)!important;backdrop-filter:blur(6px);overflow-y:auto;}
#guideModal>div,#missionModal>div{box-shadow:0 24px 90px rgba(30,25,45,.15);max-height:90dvh;overflow:auto;}
#gCloseBtn,#mModalBtn{color:var(--sf)!important;}
html.stage-on .workspace-head,html.stage-on .camera-heading{display:none;}
html.stage-on .cam-area{border:0;border-radius:0;height:auto;}
@media(min-width:1500px){.main{grid-template-columns:minmax(0,1fr) 400px;}.lt-grid{max-height:176px;}.card{padding:22px;}.reason-box{font-size:18px;}.log-wrap{height:90px;}}
@media(max-width:1000px){.hd{padding:0 20px;height:66px;}.workspace-head{padding:20px;}.main{grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:minmax(0,1fr);padding:0 20px 20px;gap:16px;}.intro-content{column-gap:35px;}.intro-logo{margin-bottom:40px;}.intro-footer{margin-top:38px;}.brand-lockup small{display:none;}}
@media(max-width:760px){#app{height:auto;min-height:100dvh;}.hd{flex-wrap:wrap;height:auto;min-height:72px;padding:14px 16px;gap:10px;}.hd-r{margin-left:auto;}.brand-lockup{font-size:17px;}.brand-lockup img{width:28px!important;height:28px!important;}.hd-badge{display:none;}.hd-sub{display:none;}.workspace-head{padding:20px 16px 14px;}.workspace-head p{display:none;}.main{display:flex;flex-direction:column;padding:0 16px 20px;overflow:visible;}.cam-area{height:400px;flex-shrink:0;}.side{overflow:visible;}.lt-grid{max-height:176px;grid-template-columns:repeat(5,minmax(0,1fr));}.card-brain{min-height:180px;}.camera-heading{padding:14px 16px;}#intro{padding:28px 24px;justify-content:flex-start;}.intro-content{display:flex;flex-direction:column;max-width:520px;}.intro-logo{margin-bottom:36px;}.intro-title{font-size:48px;}.intro-tagline{font-size:14px;}.intro-hero{display:flex;min-height:220px;height:220px;order:6;margin:28px 0 0;}.intro-hero svg{width:100%;margin:0;}.intro-pipe{margin-bottom:22px;}.intro-footer{order:7;flex-direction:column;align-items:flex-start;margin-top:26px;}.lang-card{flex:1;width:auto;}.intro-hw{font-size:11px;}.cam-steps{top:12px;right:12px;}.cam-mission{top:52px;max-width:80%;}.mode-pill{padding:5px 9px;}}
@media(max-width:420px){.hd-r{width:100%;justify-content:space-between;}.hd-icons{border:0;padding-left:0;}.cam-area{height:380px;}.lt-grid{grid-template-columns:repeat(4,minmax(0,1fr));}.intro-title{font-size:42px;}.lang-card{gap:5px;padding:14px 8px;}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}}

/* v40: explicit controls, readable settings and balanced workspace. */
.main{grid-template-columns:minmax(0,1fr) minmax(390px,34%);}
.hd-r{gap:12px;}.hd-icons{gap:8px;}
.hd-badge{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;line-height:34px;}
.hd-btn{font-size:13px;white-space:nowrap;}
.connect-robot{background:var(--accent-dim);color:var(--accent-text);padding:0 14px;}
.ble-dot{background:var(--dim);}.ble-dot.on{background:#248367;box-shadow:none;}
.tool-menu{position:relative;}
.tool-menu summary{list-style:none;cursor:pointer;}
.tool-menu summary::-webkit-details-marker{display:none;}
.tool-menu summary::after{content:'⌄';font-size:12px;margin-left:4px;}
.tool-menu-panel{position:absolute;right:0;top:48px;z-index:50;background:var(--sf);padding:8px;min-width:220px;border:1px solid var(--bd);border-radius:12px;box-shadow:0 12px 36px rgba(30,20,50,.12);}
.tool-menu-panel .hd-btn{width:100%;justify-content:flex-start;}
.voice-mission{margin-left:auto;display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid var(--bd);border-radius:7px;background:var(--sf);color:var(--dim);cursor:pointer;font-size:12px;white-space:nowrap;}
.voice-mission:hover{color:var(--accent);border-color:var(--accent);}
.voice-mission.listening{color:var(--red);border-color:var(--red);}
.camera-heading{padding:15px 20px;}
.cam-area>.cam-steps{position:static;flex-shrink:0;background:var(--sf);border-radius:0;backdrop-filter:none;padding:0 20px 14px;gap:0;counter-reset:phase;border-bottom:1px solid var(--bd);}
.cam-steps .mode-pill{counter-increment:phase;position:relative;padding:0 15px 0 0;gap:7px;font-size:12px;color:var(--dim);border-radius:0;background:none;font-weight:500;}
.cam-steps .mode-pill::before{content:counter(phase);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--bd);font-size:11px;color:var(--dim);}
.cam-steps .mode-pill:not(:last-child)::after{content:'→';margin-left:8px;color:var(--dim);opacity:.6;}
.cam-steps .mode-pill.search,.cam-steps .mode-pill.track,.cam-steps .mode-pill.arrive{color:var(--accent-text);font-weight:650;}
.cam-steps .mode-pill:is(.search,.track,.arrive)::before{background:var(--accent);border-color:var(--accent);color:var(--sf);}
.cam-mission{max-width:85%;}
.side{gap:14px;scrollbar-width:thin;}
.card-mission{gap:16px;}
.local-targets{gap:10px;}
.lt-title{font-size:12px;}
.target-search{width:100%;min-height:40px;padding:10px 12px;background:var(--sf);border:1px solid var(--bd);border-radius:8px;color:var(--tx);font-size:13px;}
.target-search::placeholder{color:var(--dim);}
.lt-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:220px;gap:7px;}
.lt-chip{font-size:13px;min-height:40px;overflow-wrap:anywhere;line-height:1.35;}
.lt-chip[hidden],.lt-empty[hidden]{display:none;}
.target-selection{font-size:12px;color:var(--accent-text);font-weight:600;}
.lt-empty{font-size:13px;color:var(--dim);padding:10px 0;}
.prompt-row{gap:10px;}
.prompt-row .btn{min-height:46px;height:auto;padding:12px 14px;font-size:14px;}
.prompt-row .btn-go{flex:1;}
.prompt-row .btn-stop{flex:0 0 30%;width:auto;color:var(--red);border-color:var(--red);}
.prompt-row .btn-stop:disabled{opacity:1;color:var(--dim);border-color:var(--bd);background:var(--sf2);}
.prompt-row .btn-stop:not(:disabled){background:var(--red);color:#fff;font-weight:750;}
.card-brain{flex:none;min-height:190px;}
.brain-body{min-height:62px;max-height:none;}
.reason-box{font-size:15px;line-height:1.65;}
.metrics{margin-top:4px;flex-shrink:0;gap:12px;}
.metric{min-width:0;}
.metric .k,.metric .v{overflow-wrap:anywhere;}
.metric .k{font-size:11px;}.metric .v{font-size:20px;}
.motor-gauge .nm{font-family:var(--font-ui);font-size:11px;letter-spacing:0;}
.card-log{flex:1;min-height:100px;gap:10px;}.log-wrap{height:auto;min-height:58px;max-height:180px;}
.le{flex-wrap:wrap;column-gap:8px;}.le .m{min-width:100px;}.le .t{font-size:10px;}
.drawer{width:min(440px,100vw);right:-460px;visibility:hidden;}
.drawer.open{right:0;visibility:visible;}
.drawer-hd{padding:20px 24px;}.drawer-x{width:36px;height:36px;}
.drawer-body{padding:22px 24px;}
.cfg-section{padding-bottom:20px;margin-bottom:22px;border-bottom:1px solid var(--bd);}
.cfg-section h4,.advanced-settings summary{font-size:14px;font-weight:650;color:var(--tx);letter-spacing:0;text-transform:none;font-family:var(--font-ui);margin-bottom:14px;}
.cfg-row{align-items:center;gap:12px;margin-bottom:14px;}
.cfg-row label{flex:0 0 39%;min-width:0;font-size:13px;line-height:1.45;}
.cfg-row input,.cfg-row select{min-width:0;width:0;min-height:40px;font-size:13px;padding:8px 10px;}
.cfg-row:has(#provider),.cfg-row:has(#model),.cfg-row:has(#apiKey){flex-direction:column;align-items:stretch;gap:7px;}
.cfg-row:has(#provider) select,.cfg-row:has(#model) select,.cfg-row:has(#apiKey) input{width:100%;}
.advanced-settings summary{cursor:pointer;margin-bottom:0;line-height:1.5;}
.advanced-settings[open] summary{margin-bottom:20px;}
.advanced-settings summary .icon{margin-right:7px;}
.advanced-settings .cfg-row:has(#scanTestBtn){display:block;}
.advanced-settings .cfg-row:has(#scanTestBtn)>label{display:none;}
.pill-row{gap:7px;}.pill{font-family:var(--font-ui);min-height:40px;padding:8px 10px;font-size:13px;}
.ble-slot{padding:15px;gap:12px;}.ble-slot .info{min-width:0;}.ble-slot .info .lbl{font-family:var(--font-ui);font-size:12px;}.ble-slot .info .name{overflow-wrap:anywhere;}
.ble-slot button{min-height:38px;padding:8px 12px;font-size:13px;}
.ble-grp h4,.ble-grp .srow label{font-family:var(--font-ui);letter-spacing:0;text-transform:none;}
.ble-grp .srow label{width:115px;min-width:115px;line-height:1.4;}
.ble-grp .srow input{min-width:0;}
#bleGrpSave{color:var(--sf)!important;min-height:38px;}
.ble-grp>div:has(>#invFBBtn){flex-direction:column;}
#invFBBtn,#swpLRBtn{justify-content:space-between;min-height:42px;}
.ble-grp .btn-stop{width:auto;}
#groupModal>div,#dupModal>div{max-height:90dvh;overflow:auto;}
html.font-l .main{grid-template-columns:minmax(0,1fr) minmax(440px,40%);}
html.stage-on .cam-area>.cam-steps{display:none!important;}
@media(min-width:1500px){.main{grid-template-columns:minmax(0,1fr) minmax(460px,30%);}.lt-grid{max-height:260px;}.card-brain{min-height:200px;}.brain-body{min-height:68px;}.reason-box{font-size:17px;}.card-log{flex:0 0 auto;}.log-wrap{max-height:125px;}}
@media(max-width:1100px){.hd{padding:0 20px;}.hd-sub,.hd-badge{display:none;}.main{grid-template-columns:minmax(0,1fr) 390px;gap:16px;}.workspace-head p{font-size:12px;}.lt-grid{max-height:180px;}.card{padding:17px;}}
@media(max-width:850px){#app{height:auto;min-height:100dvh;}.main,html.font-l .main{display:flex;flex-direction:column;overflow:visible;}.cam-area{height:440px;flex-shrink:0;}.side{overflow:visible;}.card-brain{min-height:175px;}.card-log{min-height:100px;}.lt-grid{max-height:220px;grid-template-columns:repeat(5,minmax(0,1fr));}.workspace-head p{display:none;}}
@media(max-width:760px){.hd{padding:14px 16px;gap:12px;}.hd-r{width:100%;justify-content:space-between;margin-left:0;gap:6px;}.hd-icons{border:0;padding:0;gap:4px;}.hd-btn{font-size:12px;padding:0 9px;gap:5px;}.hd-btn .icon{width:17px;height:17px;}.lang-sw{padding:0 4px;}.cam-area{height:410px;}.cam-area>.cam-steps{padding:0 16px 12px;}.cam-mission{top:16px;}.card-mission{gap:14px;}.drawer-body{padding:20px;}.drawer-hd{padding:16px 20px;}}
@media(max-width:420px){.lt-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:225px;}.hd-btn{padding:0 6px;font-size:11px;gap:4px;}.hd-icons{gap:2px;}.hd-btn .icon{width:15px;height:15px;}.ble-dot{width:5px;height:5px;}.tool-menu summary::after{display:none;}.cam-area{height:395px;}.drawer-body{padding:18px;}.cfg-row label{flex-basis:38%;}.voice-mission{font-size:11px;padding:7px;}.section-label{font-size:14px;}}
@media(min-width:851px) and (max-height:800px){.card-mission{padding:16px;gap:12px;}.local-targets{gap:8px;}.lt-grid{max-height:126px;}.card-brain{min-height:172px;padding:16px;}.brain-body{min-height:45px;}}
#camIdleSub{white-space:pre-line;}
html.dark{color-scheme:dark;}html.light{color-scheme:light;}
@media(max-width:760px){.hd-r{display:contents;}.lang-sw{margin-left:auto;}.hd-icons{width:100%;flex-wrap:wrap;justify-content:space-between;}.hd-icons>.hd-btn{flex:0 0 auto;min-width:max-content;}.tool-menu summary{justify-content:center;}#camIdle{gap:12px!important;}#camIdle>div:first-child{width:56px;height:56px;font-size:24px!important;}}