:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#14314a;background:#e7f7fc;font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}#viewport,#scene,#labels{position:absolute;inset:0;width:100%;height:100%}#scene{touch-action:none}#labels{pointer-events:none}header{position:absolute;left:3.5%;right:3.5%;top:max(26px,env(safe-area-inset-top));display:flex;justify-content:space-between;align-items:center;pointer-events:none}.brand{font-size:22px;font-weight:850;letter-spacing:3px;display:flex;align-items:center;gap:12px}.brand i{display:inline-block;width:16px;height:16px;border:3px solid #00b9ce;transform:rotate(45deg);box-shadow:0 0 18px #00e4e666}.brand small{display:block;font-size:9px;font-weight:650;letter-spacing:2px;margin-left:12px;color:#5c8196}.status{display:flex;gap:8px}.status span,.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:750}.status span{padding:10px 12px;background:#ffffffb8;border:1px solid #b9dce9;border-radius:30px}.status span:first-child:before{content:'●';color:#00b5b5;margin-right:8px}#intro{position:absolute;left:7%;top:22%;width:420px;padding:32px 36px;border:1px solid #fff;border-radius:30px;background:linear-gradient(135deg,#ffffffed,#eafaffdd);box-shadow:0 24px 90px #236a8328;backdrop-filter:blur(16px)}h1{font-size:54px;line-height:1.04;letter-spacing:-2px;margin:18px 0}em{font-style:normal;color:#008caa}p{line-height:1.65;color:#526f83}button{font:inherit;font-size:14px;font-weight:700;border:1px solid #bfdeeb;border-radius:13px;background:#ffffffdf;color:#23485d;padding:14px 20px;cursor:pointer;min-height:48px;touch-action:manipulation}button:disabled{opacity:.4}button:hover{background:#dbf7ff}#begin,#next,#saveCalibration{background:#063e57;color:white;border-color:#063e57}#begin{width:100%;display:flex;justify-content:space-between}#enableCamera{display:block;margin:8px auto}button.quiet{border:0;background:transparent;color:#187992}#intro small{font-size:11px;line-height:1.7;color:#668395;display:block}footer{position:absolute;bottom:40px;left:3.5%;right:3.5%;padding:18px 22px 12px;border:1px solid #ffffffd9;background:#f5fdfff0;box-shadow:0 10px 45px #29698022;border-radius:22px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;backdrop-filter:blur(16px)}.step{display:flex;align-items:center;gap:20px;flex:1}.step>span{font-size:12px;color:#00869f;font-weight:800;white-space:nowrap;border-right:1px solid #bdd9e4;padding-right:20px}.step h2{font-size:19px;letter-spacing:-.4px;margin:0 0 4px}.step p{margin:0;font-size:12px;max-width:760px;line-height:1.5}.nav{display:flex;gap:8px}.tools{width:100%;border-top:1px solid #d9eaf0;padding-top:10px;display:flex;gap:7px;align-items:center}.tools button{font-size:10px;min-height:30px;padding:6px 10px;border-radius:8px}.tools span{font-size:8px;letter-spacing:1px;color:#688a9c;margin-left:auto}.holo{position:absolute;width:220px;padding:13px 16px;border-radius:5px 17px 17px 17px;border:1px solid #00adce7d;background:linear-gradient(135deg,#f0ffffe8,#d7f6ffb8);box-shadow:0 0 22px #00bbd32b,inset 0 0 24px #ffffffa3;backdrop-filter:blur(6px);transform:translate(-50%,-100%);pointer-events:auto;cursor:pointer;transition:opacity .3s,box-shadow .2s}.holo:before{content:'';position:absolute;left:-1px;top:-1px;width:34px;height:3px;background:#00bed2;box-shadow:0 0 10px #00bdd9}.holo strong{display:block;font-size:13px;letter-spacing:-.2px;margin:5px 0}.holo small{display:block;font-size:9px;font-weight:800;letter-spacing:1.6px;color:#0081a2}.holo p{font-size:10px;line-height:1.5;margin:4px 0;color:#416c81}.holo.active{box-shadow:0 0 32px #00cdeb5c,inset 0 0 24px #ffffffbf;border-color:#00a9c4}.holo .read{font-size:8px;letter-spacing:1px;margin-top:6px;color:#008ca1}#safety{position:absolute;bottom:12px;width:100%;text-align:center;font-size:9px;letter-spacing:1.6px;color:#5b7e8d;pointer-events:none}#specPanel{position:absolute;right:4%;top:14%;width:min(380px,90vw);border-radius:24px;background:#f5fdfff5;border:1px solid #9be2ee;padding:24px;box-shadow:0 20px 80px #21647c44;backdrop-filter:blur(20px)}#specPanel h2{font-size:23px;line-height:1.15}#specPanel p{font-size:13px}#specPanel a{font-size:12px;color:#007f99}#closeSpecs{float:right;margin:-12px -12px 10px 0}dialog{border:1px solid #9ddbe8;border-radius:24px;background:#f6feff;color:#17374c;max-width:540px;padding:28px;box-shadow:0 24px 120px #193c7160}dialog::backdrop{background:#1b46577d;backdrop-filter:blur(8px)}dialog p{font-size:12px}label{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:12px 0}input{width:110px;padding:10px;border:1px solid #bcd9e5;border-radius:8px}#ruler{height:22px;border:2px solid #00b9c9;border-top:0;margin:20px 0;position:relative}#ruler span{position:absolute;top:0;left:40%;font-size:10px}#toast{position:absolute;left:50%;top:100px;transform:translateX(-50%);border-radius:15px;background:#083e54ee;color:#fff;padding:12px 22px;font-size:12px;opacity:0;transition:opacity .25s;pointer-events:none;max-width:80vw}#filmTitles{display:none;position:absolute;left:6%;top:18%;max-width:800px;pointer-events:none}#filmTitles h1{font-size:65px;color:white;text-shadow:0 3px 25px #002b46b0}#filmTitles p{font-size:20px;color:#e2faff;text-shadow:0 2px 8px #00283c}#filmKicker{color:#8ceaf6;font-size:12px;font-weight:800;letter-spacing:4px}#fade{position:absolute;inset:0;background:#eafaff;pointer-events:none;opacity:0}.filming #filmTitles{display:block}.filming .tools{display:none}.filming header{color:white}.filming .brand small{color:#c8edfa}.filming footer{bottom:50px}.filming #safety{color:#d3f1fb}.filming #intro{display:none}.insideFilm header{color:#14314a}.insideFilm .brand small{color:#638497}.insideFilm #filmTitles{display:none}.insideFilm #safety{color:#5b7e8d}@media(max-width:1050px){.brand small{display:none}.status span{font-size:8px}footer{gap:10px;padding:12px 16px}.step p{font-size:10px}.step h2{font-size:16px}.nav button{padding:10px 14px;font-size:12px}.tools span{display:none}.holo{width:180px;padding:9px 12px}#intro{top:17%;padding:25px;width:360px}#intro h1{font-size:43px}}@media(orientation:portrait){body:after{content:'Rotate iPad to landscape for the calibrated window';position:absolute;inset:0;display:grid;place-items:center;background:#eefafff5;color:#125573;font-weight:700;padding:40px;z-index:100}}@media(prefers-reduced-motion:reduce){.holo{transition:none}}
/* ---- v2 FINAL: laser pointer, info box, light switch, panels ---- */
#leaderSvg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}#leaderLine{stroke:#5ff4ff;stroke-width:1.5;stroke-dasharray:4 3;filter:drop-shadow(0 0 4px #00e1ff)}
#laserInfo{position:absolute;width:300px;padding:14px 16px 12px;border-radius:4px 16px 16px 16px;border:1px solid #47eaff;background:linear-gradient(140deg,#062533e6,#0a3f52d0);color:#dffbff;box-shadow:0 0 28px #00d9ff55,inset 0 0 22px #00d0ff22;backdrop-filter:blur(8px);pointer-events:auto;animation:laserIn .25s ease-out}
#laserInfo:before{content:'';position:absolute;left:-1px;top:-1px;width:44px;height:3px;background:#5ff4ff;box-shadow:0 0 12px #5ff4ff}
#laserInfo.locked{border-color:#9ffcff;box-shadow:0 0 40px #00e5ff88,inset 0 0 26px #00d0ff33}
#laserInfo h3{margin:6px 0 2px;font-size:15px;letter-spacing:-.2px;color:#fff}#laserInfo .what{margin:0 0 6px;font-size:11px;color:#9fe9f5;line-height:1.4}#laserInfo ul{margin:0;padding-left:16px;font-size:11px;line-height:1.5}#laserInfo .src{display:block;margin-top:8px;font-size:8.5px;letter-spacing:.8px;color:#7fcfdc}#laserInfo .lk{color:#5ff4ff;font-size:8.5px}#laserClose{position:absolute;right:4px;top:2px;color:#9ff;min-height:44px;min-width:44px}
@keyframes holoIn{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1}}
#lightSwitch{position:absolute;right:3.5%;top:calc(max(26px,env(safe-area-inset-top)) + 52px);min-height:48px;min-width:44px;display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:24px;background:#0d1c24d9;color:#dff6ff;border:1px solid #3a6b7d}#lightSwitch i{width:34px;height:20px;border-radius:10px;background:#3b4a52;position:relative;transition:.2s}#lightSwitch i:after{content:'';position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#cfd8dc;transition:.2s}#lightSwitch.on i{background:#f2c86a}#lightSwitch.on i:after{left:16px;background:#fff;box-shadow:0 0 10px #ffe7a8}#lightSwitch b{font-size:10px;letter-spacing:1.5px;color:#f2c86a}#lightSwitch:not(.on) b{color:#8aa}
#compList,#designPanel{position:absolute;left:3.5%;top:14%;width:min(330px,40vw);max-height:62vh;overflow:auto;border-radius:20px;background:#f5fdfff2;border:1px solid #9be2ee;padding:18px;box-shadow:0 20px 80px #21647c44;backdrop-filter:blur(18px)}#compItems{display:flex;flex-direction:column;gap:6px;margin:10px 0}#compItems button{text-align:left;min-height:48px;font-size:13px}#compItems small{display:block;font-size:8px;letter-spacing:1.4px;color:#0081a2}#compList>small{font-size:10px;color:#5c7d8c}#closeComp,#closeDesign{float:right;min-height:44px;min-width:44px;font-size:20px;margin:-10px -8px 0 0}
#designPanel{left:auto;right:4%;width:min(440px,45vw)}#designPanel h2{font-size:18px;line-height:1.25;color:#7a1c12}#designList{font-size:12px;line-height:1.55;color:#28485a;padding-left:18px}#designList li{margin:6px 0}
.holo.mini{width:auto;padding:7px 10px}.holo.mini p,.holo.mini .read{display:none}.holo.mini strong{font-size:11px;margin:2px 0 0}
#handCursor{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:2px solid #5ff4ff;box-shadow:0 0 16px #00e5ff;pointer-events:none;background:conic-gradient(#5ff4ff99 calc(var(--p,0)*360deg),transparent 0)}
.tools{flex-wrap:wrap}
body.dark #safety{color:#9db7c2}
#laserInfo.name{width:240px}#laserInfo.detail{width:420px;max-height:62vh;overflow:auto}#laserInfo .detail h4{margin:10px 0 2px;font-size:10px;letter-spacing:1.4px;color:#5ff4ff;text-transform:uppercase}#laserInfo .detail p{font-size:11px;line-height:1.5;color:#cdf3fa;margin:0}#laserInfo .detail ul{font-size:11px}
#laserInfo .more{margin-top:8px;min-height:44px;padding:8px 14px;font-size:12px;background:#0d5a70;color:#eaffff;border-color:#47eaff}
#lightSwitch small{display:block;font-size:8px;letter-spacing:.6px;color:#9fb9c4;font-weight:600}
#safety{bottom:4px;font-size:8.5px;line-height:1.45;z-index:5;background:#ffffffc0;padding:2px 0}#safety b{color:#8a1c10}body.dark #safety{background:#0b1418c0}body.filming #safety{display:block!important}
footer{bottom:46px}

/* transform-only entrance: the card is never invisible, even if animations stall */
@keyframes laserIn{from{transform:translateY(6px) scale(.98)}to{transform:none}}

#levelPanel{position:fixed;z-index:15;top:84px;right:12px;width:300px;max-width:75vw;background:#101d2eeb;color:#fff;border:1px solid #63d4e5;border-radius:12px;padding:12px;font:14px system-ui}#levelPanel p{margin:8px 0}#levelPanel button{min-height:44px;margin:3px;font-size:14px}

#levelPanel p{color:#e9f6ff}#levelPanel strong{color:#fff}

#levelPanel{top:160px}#specPanel,#designPanel,#compList,#laserInfo,#lightSwitch{z-index:20}.filming #levelPanel{display:none}
