[hidden]{display:none!important}:root{color-scheme:dark;--bg:#07111f;--panel:#0c1929;--line:#203146;--ink:#f2f6fa;--muted:#8291a5;--cyan:#20d7d0;--green:#4ee69b;--amber:#ffcb69;--red:#ff6d79}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 75% -10%,#12334a 0,transparent 35%),var(--bg);color:var(--ink);font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;min-height:100vh}.topbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 max(24px,calc((100vw - 1220px)/2));justify-content:space-between;background:#07111fcc;backdrop-filter:blur(18px);position:sticky;top:0;z-index:10}.brand{display:flex;gap:12px;align-items:center;font-size:20px;font-weight:800;color:inherit;text-decoration:none;letter-spacing:.06em}.brand-mark{font-size:11px;display:grid;place-items:center;width:34px;height:34px;color:#00191d;background:var(--cyan);clip-path:polygon(15% 0,85% 0,100% 15%,100% 85%,85% 100%,15% 100%,0 85%,0 15%)}.privacy{color:var(--green);font-size:12px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);margin-right:8px}.muted{color:var(--muted)}button{font:inherit;color:inherit}.icon-button,.secondary{border:1px solid var(--line);background:#0c1929;border-radius:7px;padding:9px 14px;cursor:pointer}.icon-button:hover,.secondary:hover{border-color:var(--cyan)}main{max-width:1220px;margin:auto;padding:65px 24px}.hero{display:grid;grid-template-columns:1fr 300px;gap:50px;align-items:end;margin-bottom:48px}.eyebrow{font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.2em;color:var(--cyan)}.eyebrow span{color:var(--muted);margin-left:12px}h1{font-size:clamp(40px,5vw,65px);line-height:1.08;letter-spacing:-.045em;margin:13px 0 18px}h1 em{font-style:normal;color:var(--cyan)}.lead{color:#aeb9c7;max-width:640px;font-size:16px}.phase-card{border-left:2px solid var(--cyan);padding:8px 0 8px 24px;display:grid;gap:7px}.phase-index{font:11px ui-monospace,monospace;color:var(--muted)}.phase-card>strong{font-size:21px}.phase-track{height:3px;background:var(--line);margin:5px 0}.phase-track i{display:block;height:100%;width:3%;background:var(--cyan);box-shadow:0 0 9px var(--cyan);transition:.3s}.phase-card small{color:var(--muted)}.workspace{display:grid;grid-template-columns:1.35fr .85fr;gap:18px}.panel{background:linear-gradient(145deg,#0e1d2e,#091624);border:1px solid var(--line);border-radius:10px;padding:22px}.panel-heading,.panel-heading>div,.section-title{display:flex;align-items:center;justify-content:space-between}.panel-heading>div{justify-content:flex-start;gap:11px}.panel h2,.section-title h2{font-size:15px;margin:0}.step,.section-title>span{font:11px ui-monospace;color:var(--cyan)}.badge{font:10px ui-monospace;border:1px solid var(--line);padding:5px 9px;border-radius:99px}.badge.connected{color:var(--green);border-color:#286548}.neutral{color:var(--muted)}.optical-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}.qr-stage,.camera-stage{aspect-ratio:1;position:relative;border-radius:6px;overflow:hidden;background:#050c14}.qr-stage{padding:20px}#qrCanvas{width:100%;height:100%;display:block;background:white}.qr-caption,.camera-label{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);background:#06101bdf;padding:3px 7px;border-radius:3px;font:8px ui-monospace;color:var(--cyan);white-space:nowrap}.camera-stage video{width:100%;height:100%;object-fit:cover}.camera-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--muted);text-align:center}.camera-empty strong{color:var(--ink)}.camera-empty span{font-size:11px}.lens{width:42px;height:42px;border:1px solid #36506c;border-radius:50%;box-shadow:inset 0 0 0 9px #0b1b2b;margin-bottom:5px}.primary{border:0;background:var(--cyan);color:#001b1d;font-weight:750;border-radius:6px;padding:10px 18px;cursor:pointer}.primary:disabled,.secondary:disabled{opacity:.4;cursor:not-allowed}.camera-label{left:10px;transform:none;color:var(--green)}.camera-label span{display:inline-block;width:5px;height:5px;background:var(--green);border-radius:50%;margin-right:4px}.fallback-row{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px;margin-top:14px;font-size:11px;color:var(--muted)}.text-button{border:0;background:none;color:var(--cyan);cursor:pointer}.notice{color:var(--amber);font-size:12px}.dropzone{height:260px;border:1px dashed #344960;border-radius:7px;margin-top:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);cursor:pointer;transition:.2s}.dropzone:hover,.dropzone.dragging{border-color:var(--cyan);background:#0c2534}.dropzone input{display:none}.dropzone strong{color:var(--ink)}.dropzone small{font-size:9px;margin-top:16px}.upload-icon{font-size:25px;color:var(--cyan);border:1px solid #31526a;border-radius:50%;width:45px;height:45px;display:grid;place-items:center;margin-bottom:7px}.file-list{margin-top:12px;display:grid;gap:7px}.file-item{display:grid;grid-template-columns:1fr auto;gap:3px;padding:10px;background:#071522;border-radius:5px}.file-item span,.file-item small{overflow:hidden;text-overflow:ellipsis}.file-item small{color:var(--muted)}.transfer-actions{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}.transfer-actions .primary{margin-left:auto}.safety{color:var(--amber)}.directions{margin-top:34px}.section-title{justify-content:flex-start;gap:12px;border-bottom:1px solid var(--line);padding-bottom:14px}.toggle{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:11px;margin-left:auto}.toggle input{display:none}.toggle i{width:32px;height:17px;border-radius:20px;background:#314156;position:relative}.toggle i:after{content:"";width:11px;height:11px;border-radius:50%;background:#8f9bad;position:absolute;left:3px;top:3px;transition:.2s}.toggle input:checked+i{background:#157977}.toggle input:checked+i:after{left:18px;background:var(--cyan)}.direction-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.direction-card{border:1px solid var(--line);background:#091625;border-radius:8px;padding:19px}.direction-card header{display:flex;align-items:center;justify-content:center;gap:20px;border-bottom:1px solid var(--line);padding-bottom:14px}.endpoint{width:72px;height:50px;border:1px solid #3a526b;display:grid;place-items:center;font-size:17px}.endpoint span{font-size:8px;color:var(--muted)}.endpoint.faded{opacity:.5}.arrow{font:10px ui-monospace;color:var(--cyan)}.direction-card dl{display:grid;grid-template-columns:repeat(3,1fr);margin:14px 0 0}.direction-card dl div{padding:8px 5px}.direction-card dt{font-size:9px;color:var(--muted)}.direction-card dd{margin:2px 0;font:600 13px ui-monospace}.direction-card dd small{font-size:8px;color:var(--muted)}.diagnostics{position:fixed;right:20px;bottom:20px;width:min(430px,calc(100vw - 40px));border:1px solid #31516a;background:#07111ff5;box-shadow:0 20px 70px #000;border-radius:8px;z-index:30}.diagnostics header{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}.diagnostics button{border:0;background:none;cursor:pointer}.diagnostics pre{padding:15px;color:var(--green);font:11px/1.8 ui-monospace;white-space:pre-wrap}footer{max-width:1220px;margin:auto;padding:25px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font:10px ui-monospace}@media(max-width:850px){.privacy{display:none}.hero,.workspace,.direction-grid{grid-template-columns:1fr}.hero{gap:20px}.optical-grid{grid-template-columns:1fr}.transfer-panel{grid-row:2}.direction-card dl{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){main{padding:40px 14px}.topbar{padding:0 14px}.panel{padding:15px}.fallback-row{display:grid;gap:7px}.transfer-actions .primary{margin-left:0;width:100%}}
.role-chooser{margin-top:14px;padding:14px;border:1px solid #31516a;border-radius:7px;background:#071522;display:grid;grid-template-columns:1fr 1fr;gap:9px}.role-chooser>div{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px}.role-chooser small{color:var(--muted)}.role-button{display:grid;gap:2px;text-align:left;border:1px solid var(--line);border-radius:6px;background:#0c1929;padding:11px;cursor:pointer}.role-button:hover,.role-button[aria-pressed="true"]{border-color:var(--cyan);background:#0c2534}.role-button span{font-size:9px;color:var(--muted)}body[data-one-way-role="receiver"] .transfer-panel #dropzone,body[data-one-way-role="receiver"] #sendButton{display:none}body[data-one-way-role="sender"] #downloadButton{display:none}@media(max-width:480px){.role-chooser{grid-template-columns:1fr}.role-chooser>div{display:grid}}
.notice.warning{padding:10px 12px;border-left:3px solid var(--amber);background:#2a2112}.general-qr-result{margin-top:14px;padding:14px;border:1px solid #31516a;border-radius:7px;background:#071522;display:grid;grid-template-columns:1fr auto;gap:9px}.general-qr-result>div{display:grid}.general-qr-result small{color:var(--muted)}.general-qr-result textarea{grid-column:1/-1;min-height:92px;resize:vertical;border:1px solid var(--line);border-radius:5px;background:#050c14;color:var(--ink);padding:10px;font:12px/1.5 ui-monospace,monospace}.general-qr-result button{grid-column:2}.diagnostics>p{margin:12px 16px 0;color:var(--muted);font-size:11px}.diagnostics-actions{display:flex;gap:7px;flex-wrap:wrap;padding:12px 16px 0}.diagnostics .diagnostics-actions button{border:1px solid var(--line);background:#0c1929;padding:7px 10px}.diagnostics .diagnostics-actions .primary{border-color:var(--cyan);background:var(--cyan)}#diagnosticsActionStatus{display:block;min-height:18px;padding:6px 16px 0;color:var(--amber)}.diagnostics pre{max-height:min(48vh,480px);overflow:auto;margin:0;user-select:text}.diagnostics-qr-overlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:12px;background:#02070ded}.diagnostics-qr-card{width:min(1200px,100%);max-height:100%;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#07111f;padding:14px;display:grid;place-items:center;gap:9px}.diagnostics-qr-card header{width:100%;display:flex;justify-content:space-between;align-items:center}.diagnostics-qr-card header button{border:1px solid var(--line);border-radius:5px;background:#0c1929;color:var(--ink);font-size:20px;cursor:pointer}.diagnostics-qr-card canvas{display:block;width:min(1160px,96vw,calc(100vh - 150px));height:auto;image-rendering:pixelated;background:#fff}.diagnostics-qr-card p{margin:0;color:var(--cyan);font:11px ui-monospace}.diagnostics-qr-card small{color:var(--muted);text-align:center}@media(max-width:480px){.general-qr-result{grid-template-columns:1fr}.general-qr-result button{grid-column:1}.diagnostics{right:6px;bottom:6px;width:calc(100vw - 12px)}}
.camera-stage video.mirrored{transform:scaleX(-1)}.camera-controls{display:flex;align-items:end;gap:9px;flex-wrap:wrap;margin-top:14px}.camera-controls label{display:grid;gap:4px;color:var(--muted);font-size:10px}.camera-controls select{min-width:210px;border:1px solid var(--line);border-radius:5px;background:#071522;color:var(--ink);padding:8px}.camera-controls>span{color:var(--muted);font-size:10px}.camera-controls>span strong{color:var(--green);font-weight:600}@media(max-width:480px){.camera-controls{align-items:stretch}.camera-controls label,.camera-controls select{width:100%}}
.offline-panel{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:-40px 0 32px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#0a1726}.offline-panel div{display:grid}.offline-panel small{color:var(--muted)}.offline-indicator{width:10px;height:10px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px var(--amber)}.offline-panel[data-state="ready"] .offline-indicator{background:var(--green);box-shadow:0 0 10px var(--green)}.offline-panel[data-state="unavailable"] .offline-indicator{background:var(--red);box-shadow:0 0 10px var(--red)}.offline-panel[data-state="update"]{border-color:var(--cyan)}@media(max-width:600px){.offline-panel{grid-template-columns:auto 1fr;margin-top:-22px}.offline-panel button{grid-column:1/-1}}
#qrCanvas{transform-origin:center;transition:transform .25s}.placement-reticle{position:absolute;inset:19%;display:grid;place-items:center;pointer-events:none;color:var(--amber);z-index:2}.placement-reticle i{position:absolute;inset:0;border:2px dashed currentColor;border-radius:10px;filter:drop-shadow(0 0 5px #000)}.placement-reticle span{align-self:end;margin-bottom:-24px;padding:3px 7px;border-radius:3px;background:#06101bdf;font:9px ui-monospace}.placement-reticle[data-guidance="stable"],.placement-reticle[data-guidance="complete"]{color:var(--green)}.placement-reticle[data-guidance="move-closer"]{inset:12%}.link-feedback{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center;margin-top:12px;padding:10px;border:1px solid var(--line);border-radius:7px;background:#071522}.link-indicator,.placement-state{padding:4px 7px;border-radius:99px;background:#142235;color:var(--muted);font:10px ui-monospace}.link-indicator.confirmed{color:var(--green);background:#0f3028}.placement-state{justify-self:end;color:var(--amber)}.link-feedback>strong{grid-column:1/-1;color:var(--ink);font-size:12px}.link-complete{margin-top:10px;padding:12px 14px;border:1px solid var(--green);border-radius:7px;background:#0c2d25;display:flex;justify-content:space-between;gap:12px;color:var(--green)}.link-complete span{color:#c7f8df;font-size:11px}.link-read-pulse .topbar,.link-read-pulse .phase-card,.link-read-pulse .camera-controls,.link-read-pulse .link-feedback{animation:link-read-once .6s ease-out}@keyframes link-read-once{0%,100%{background-color:transparent}35%{background-color:#12535a}}@media(prefers-reduced-motion:reduce){#qrCanvas{transition:none}.link-read-pulse .topbar,.link-read-pulse .phase-card,.link-read-pulse .camera-controls,.link-read-pulse .link-feedback{animation:none;background-color:#12535a}}@media(max-width:600px){.link-feedback{grid-template-columns:1fr}.placement-state{justify-self:start}.link-feedback>strong{grid-column:1}.link-complete{display:grid}}

/* Standard 14-inch laptop + portrait phone optical arrangement. */
.optical-launch{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:0 auto 22px;max-width:1480px;padding:14px 20px;border:1px solid var(--line,#284058);border-radius:12px;background:#0b1c2e}.optical-launch label,.calibration-controls label{display:grid;gap:5px;color:var(--muted,#94a6b8);font-size:12px}.optical-launch small{flex:1 1 280px;color:var(--muted,#94a6b8)}.optical-channel-label{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan,#20d7d0);letter-spacing:.05em}.optical-exit{z-index:15}.qr-stage{overflow:hidden}.qr-replica-field{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--replica-columns,1),var(--replica-size,1fr));grid-template-rows:repeat(var(--replica-rows,1),var(--replica-size,1fr));align-content:center;justify-content:center;place-items:center;gap:8px;background:#030a12}.qr-replica-field canvas{display:block;max-width:100%;max-height:100%;aspect-ratio:1;image-rendering:pixelated;background:#fff;border:0;box-shadow:none;transform:none!important}.candidate-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.candidate-overlay polygon{fill:rgba(32,215,208,.12);stroke:#20d7d0;stroke-width:3;vector-effect:non-scaling-stroke}.calibration-controls{display:grid;gap:10px;margin:14px 0;padding:12px;border:1px solid var(--line,#284058);border-radius:10px}.calibration-controls output{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan,#20d7d0)}

html[data-layout="pc"],html[data-layout="pc"] body{height:100%;overflow:hidden}html[data-layout="pc"] body{max-width:none;margin:0;padding:0}html[data-layout="pc"] .topbar{position:fixed;z-index:12;left:1.5vw;top:1.5vh;width:28vw;height:12vh;padding:12px;border:1px solid var(--line,#284058);border-radius:12px;background:#07111f}html[data-layout="pc"] .topbar .privacy{position:absolute;left:12px;bottom:8px;font-size:10px}html[data-layout="pc"] main{position:fixed;inset:0;max-width:none;margin:0;padding:0;overflow:hidden}html[data-layout="pc"] .hero{display:none}html[data-layout="pc"] .optical-launch{position:fixed;z-index:12;left:33vw;top:29vh;width:34vw;margin:0;padding:8px 10px;gap:7px}html[data-layout="pc"] .optical-launch label{display:flex;align-items:center;gap:5px}html[data-layout="pc"] .optical-launch label select{max-width:120px}html[data-layout="pc"] .optical-launch small{display:none}html[data-layout="pc"] .workspace{display:block;max-width:none;margin:0;padding:0}html[data-layout="pc"] .optical-panel{position:static;padding:0;border:0;background:transparent;box-shadow:none}html[data-layout="pc"] .optical-panel>.panel-heading{position:fixed;z-index:10;left:33vw;top:37vh;width:34vw;min-height:48px;padding:8px 12px;border:1px solid var(--line,#284058);border-radius:10px;background:#0b1c2e}html[data-layout="pc"] .qr-stage{position:fixed;z-index:8;left:33vw;right:33vw;top:0;height:28vh;border:0;border-radius:0;background:#030a12}html[data-layout="pc"] .camera-stage{position:fixed;z-index:8;right:1.5vw;top:15vh;width:28vw;height:38vh;aspect-ratio:auto;background:#030a12}html[data-layout="pc"][data-preview-side="left"] .camera-stage{left:1.5vw;right:auto}html[data-layout="pc"] .camera-stage video{width:100%;height:100%;object-fit:contain}html[data-layout="pc"] .link-feedback{position:fixed;z-index:9;right:1.5vw;top:55vh;width:28vw;max-height:18vh;overflow:auto}html[data-layout="pc"][data-preview-side="left"] .link-feedback{left:1.5vw;right:auto}html[data-layout="pc"] .link-complete{position:fixed;z-index:11;right:1.5vw;top:55vh;width:28vw}html[data-layout="pc"] .camera-controls{position:fixed;z-index:9;right:1.5vw;top:75vh;width:28vw;max-height:23vh;overflow:auto;padding:12px;border:1px solid var(--line,#284058);border-radius:10px;background:#0b1c2e}html[data-layout="pc"][data-preview-side="left"] .camera-controls{left:1.5vw;right:auto}html[data-layout="pc"] .optical-panel>.notice,html[data-layout="pc"] .optical-panel>.fallback-row,html[data-layout="pc"] .optical-panel>.general-qr-result,html[data-layout="pc"] .optical-panel>.role-chooser{position:fixed;z-index:13;right:1.5vw;bottom:1vh;width:28vw;max-height:22vh;overflow:auto}html[data-layout="pc"][data-preview-side="left"] .optical-panel>.notice,html[data-layout="pc"][data-preview-side="left"] .optical-panel>.fallback-row,html[data-layout="pc"][data-preview-side="left"] .optical-panel>.general-qr-result,html[data-layout="pc"][data-preview-side="left"] .optical-panel>.role-chooser{left:1.5vw;right:auto}html[data-layout="pc"] .transfer-panel{position:fixed;z-index:7;left:1.5vw;top:15vh;width:28vw;bottom:2vh;overflow:auto}html[data-layout="pc"][data-preview-side="left"] .transfer-panel{left:auto;right:1.5vw}html[data-layout="pc"] .directions{position:fixed;z-index:7;left:33vw;top:44vh;width:34vw;bottom:2vh;margin:0;padding:14px;overflow:auto}html[data-layout="pc"] footer{display:none}html[data-layout="pc"] .diagnostics{z-index:30;right:1vw;top:1vh;bottom:1vh;width:min(520px,42vw);overflow:auto}html[data-layout="pc"] .offline-panel{position:fixed;z-index:13;left:33vw;top:44vh;width:34vw;margin:0}

html[data-layout="phone"][data-optical-active="true"],html[data-layout="phone"][data-optical-active="true"] body{height:100%;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}html[data-layout="phone"][data-optical-active="true"] body>*:not(main){display:none}html[data-layout="phone"][data-optical-active="true"] main{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;margin:0;padding:0;overflow:hidden;background:#030a12}html[data-layout="phone"][data-optical-active="true"] main>*:not(.workspace):not(.diagnostics):not(.diagnostics-qr-overlay){display:none!important}html[data-layout="phone"][data-optical-active="true"] .workspace{display:block;margin:0;padding:0}html[data-layout="phone"][data-optical-active="true"] .workspace>*:not(.optical-panel){display:none!important}html[data-layout="phone"][data-optical-active="true"] .optical-panel{position:fixed;inset:0;z-index:20;margin:0;padding:0;border:0;border-radius:0;background:#030a12;overflow:hidden}html[data-layout="phone"][data-optical-active="true"] .optical-panel>.panel-heading{position:fixed;z-index:26;left:4vw;right:4vw;top:max(8px,env(safe-area-inset-top));min-height:40px;padding:4px;border:0;background:transparent}html[data-layout="phone"][data-optical-active="true"] .panel-heading>div,html[data-layout="phone"][data-optical-active="true"] .panel-heading>.badge,html[data-layout="phone"][data-optical-active="true"] .optical-channel-label{display:none}html[data-layout="phone"][data-optical-active="true"] .optical-exit{display:block!important;margin-left:auto;padding:8px 10px}html[data-layout="phone"][data-optical-active="true"] .qr-stage{position:fixed;z-index:22;left:4vw;right:4vw;bottom:env(safe-area-inset-bottom);height:calc(30dvh - env(safe-area-inset-bottom));border:0;border-radius:8px;background:#030a12}html[data-layout="phone"][data-optical-active="true"] .camera-stage{position:fixed;z-index:21;left:4vw;right:4vw;bottom:31dvh;height:32dvh;aspect-ratio:auto;border-radius:8px;background:#07111f}html[data-layout="phone"][data-optical-active="true"] .camera-stage video{width:100%;height:100%;object-fit:contain}html[data-layout="phone"][data-optical-active="true"] .camera-empty{padding:8px}html[data-layout="phone"][data-optical-active="true"] .camera-empty .lens,html[data-layout="phone"][data-optical-active="true"] .camera-empty span{display:none}html[data-layout="phone"][data-optical-active="true"] .link-feedback{position:fixed;z-index:25;left:4vw;right:4vw;top:calc(max(8px,env(safe-area-inset-top)) + 48px);display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:0;padding:8px;max-height:24dvh;overflow:hidden;background:rgba(7,17,31,.94)}html[data-layout="phone"][data-optical-active="true"] .link-feedback strong,html[data-layout="phone"][data-optical-active="true"] .link-feedback small{grid-column:1/-1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}html[data-layout="phone"][data-optical-active="true"] .link-complete{position:fixed;z-index:27;left:4vw;right:4vw;top:38dvh}html[data-layout="phone"][data-optical-active="true"] .camera-controls,html[data-layout="phone"][data-optical-active="true"] .optical-panel>.notice,html[data-layout="phone"][data-optical-active="true"] .fallback-row,html[data-layout="phone"][data-optical-active="true"] .general-qr-result,html[data-layout="phone"][data-optical-active="true"] .role-chooser{display:none!important}

@media(max-width:700px){html:not([data-layout="pc"]) .optical-launch{margin:10px 15px}.optical-launch>*{width:100%}}

/* Minimal endpoint uses the same physical zones with fewer surrounding controls. */
html[data-layout="pc"] body>h1,html[data-layout="pc"] body>p{display:none}html[data-layout="pc"] body>.optical-launch{display:flex;position:fixed;left:33vw;top:29vh;width:34vw;margin:0}html[data-layout="pc"] body>main{position:fixed;inset:0;display:block;max-width:none;margin:0;padding:0}html[data-layout="pc"] body>main>.optical-panel{position:static}html[data-layout="pc"] body>main>.optical-panel>.optical-exit{display:none}html[data-layout="pc"] body>main>.optical-panel>.qr-stage{position:fixed;left:33vw;right:33vw;top:0;height:28vh}html[data-layout="pc"] body>main>.optical-panel>.camera-stage{position:fixed;right:1.5vw;top:15vh;width:28vw;height:38vh}html[data-layout="pc"][data-preview-side="left"] body>main>.optical-panel>.camera-stage{left:1.5vw;right:auto}html[data-layout="pc"] body>main>.optical-panel>.link-feedback{position:fixed;right:1.5vw;top:55vh;width:28vw;max-height:18vh;overflow:auto}html[data-layout="pc"][data-preview-side="left"] body>main>.optical-panel>.link-feedback{left:1.5vw;right:auto}html[data-layout="pc"] body>main>.operation-panel{position:fixed;left:1.5vw;top:2vh;width:28vw;bottom:2vh;display:flex;flex-direction:column;gap:12px;overflow:auto;padding:14px;border:1px solid #888;background:#fff}html[data-layout="pc"][data-preview-side="left"] body>main>.operation-panel{left:auto;right:1.5vw}html[data-layout="pc"] body>main>details{position:fixed;left:33vw;top:40vh;width:34vw;bottom:2vh;overflow:auto;background:#fff}

html[data-layout="phone"][data-optical-active="true"] body>main>.optical-panel{display:block!important;position:fixed;inset:0;z-index:20;background:#030a12}html[data-layout="phone"][data-optical-active="true"] body>main>.operation-panel,html[data-layout="phone"][data-optical-active="true"] body>main>details{display:none!important}html[data-layout="phone"][data-optical-active="true"] body>main>.optical-panel>.optical-exit{display:block!important;position:fixed;z-index:26;right:4vw;top:max(8px,env(safe-area-inset-top))}html[data-layout="phone"][data-optical-active="true"] body>main>.optical-panel>.qr-stage{position:fixed;z-index:22;left:4vw;right:4vw;bottom:env(safe-area-inset-bottom);height:calc(30dvh - env(safe-area-inset-bottom))}html[data-layout="phone"][data-optical-active="true"] body>main>.optical-panel>.camera-stage{position:fixed;z-index:21;left:4vw;right:4vw;bottom:calc(31dvh + env(safe-area-inset-bottom));width:auto;height:32dvh}html[data-layout="phone"][data-optical-active="true"] body>main>.optical-panel>.link-feedback{position:fixed;z-index:25;left:4vw;right:4vw;top:calc(max(8px,env(safe-area-inset-top)) + 48px);max-height:24dvh;overflow:hidden;background:#fff}
#opticalCalibrationMetrics{grid-column:1/-1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan,#20d7d0)}
html[data-layout="phone"][data-optical-active="false"] .optical-panel .optical-grid,html[data-layout="phone"][data-optical-active="false"] .optical-panel>.link-feedback,html[data-layout="phone"][data-optical-active="false"] .optical-panel>.link-complete{display:none!important}
html[data-layout="phone"][data-optical-active="false"] body>main>.optical-panel{display:none}
html[data-layout="phone"][data-optical-active="true"] body main>section.optical-panel:not(.workspace):not(.diagnostics):not(.diagnostics-qr-overlay){display:block!important}
html[data-layout="pc"] .offline-panel{left:auto;right:1.5vw;top:1.5vh;width:28vw;max-height:12vh;overflow:auto}