:root{font-family:Tahoma,"Segoe UI",Arial,sans-serif;color:#18324d;background:#f4f7fb;font-synthesis:none;--blue:#245fe5;--navy:#10263e;--muted:#586c82;--line:#dce4ed;--cyan:#66d9e8}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}a{color:var(--blue)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #1693ae;outline-offset:4px}[hidden]{display:none!important}
.site-header{max-width:1180px;margin:auto;padding:26px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:21px;color:var(--navy);text-decoration:none}.privacy{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.privacy-dot{height:7px;width:7px;border-radius:50%;background:#147d75}main{max-width:1180px;margin:auto;padding:32px}.intro{margin-bottom:28px}h1{font-size:clamp(24px,3.3vw,38px);line-height:1.6;margin:0 0 8px;letter-spacing:-.7px}p{line-height:1.9}.intro p{margin:0;color:var(--muted);font-size:15px}.experience{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:30px;align-items:start}.viewer-section{min-width:0}.viewer{position:relative;overflow:hidden;isolation:isolate;background:var(--navy);aspect-ratio:4/3;border-radius:18px;color:white}#camera-video{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}#camera-plane{position:absolute;overflow:hidden;pointer-events:none}#overlay-video{position:absolute;top:0;left:0;transform-origin:0 0;object-fit:fill;max-width:none;will-change:transform}.viewfinder{position:absolute;inset:23% 20%;pointer-events:none;opacity:.6}.viewfinder i{position:absolute;width:24px;height:24px;border-color:var(--cyan);border-style:solid;border-width:0}.viewfinder i:nth-child(1){left:0;top:0;border-left-width:2px;border-top-width:2px}.viewfinder i:nth-child(2){right:0;top:0;border-right-width:2px;border-top-width:2px}.viewfinder i:nth-child(3){right:0;bottom:0;border-right-width:2px;border-bottom-width:2px}.viewfinder i:nth-child(4){left:0;bottom:0;border-left-width:2px;border-bottom-width:2px}.idle-message{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:14px;flex-direction:column;text-align:center;padding:40px}.idle-message svg{color:#92b4cf}.idle-message strong{font-size:21px}.idle-message span{font-size:13px;color:#adc5d9}.status-pill{position:absolute;top:18px;right:18px;max-width:calc(100% - 36px);display:flex;align-items:center;gap:8px;border-radius:30px;padding:10px 14px;background:rgba(7,21,37,.86);font-size:12px;line-height:1.7}#status-dot{flex-shrink:0;height:7px;width:7px;border-radius:50%;background:#b4c6d7}body[data-state=tracking] #status-dot{background:#66e8bf}body[data-state=loading] #status-dot{background:#e6c170}body[data-state=error] #status-dot{background:#ffa99d}body[data-state=tracking] .viewfinder{opacity:0}.controls{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.primary,.secondary{border:0;border-radius:9px;padding:14px 22px;min-height:48px;font-weight:700;font-size:14px}.primary{color:#fff;background:var(--blue)}.primary:hover{background:#184ecd}.secondary{background:#e5ebf3;color:var(--navy)}.secondary:hover{background:#d7e1ee}.hint{font-size:12px;color:var(--muted);margin:14px 0 0}.guide h2{font-size:16px;margin:0}.target-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:5px 0 16px}.target-heading a{font-size:11px;white-space:nowrap}.target-preview{padding:20px;background:#e7edf5;border-radius:12px;display:flex;align-items:center;justify-content:center;min-height:150px}.target-preview img{display:block;max-width:100%;max-height:230px;object-fit:contain;box-shadow:0 5px 18px #19324e16}.guide p{font-size:13px;color:var(--muted);margin:15px 0}.tips{padding:0 18px 0 0;font-size:12px;line-height:2.2;color:var(--muted)}.device-note{margin-top:24px;border-top:1px solid var(--line);padding-top:22px}.device-note strong{font-size:14px}.device-note p{font-size:12px;margin-bottom:0}.error-text{color:#a22c21;background:#fff0ed;border-radius:8px;padding:12px 16px;font-size:13px;line-height:1.9;overflow-wrap:anywhere}.error-text:empty{display:none}.setup-panel{max-width:620px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;margin-top:20px}.setup-panel h2{font-size:21px;margin:0}.setup-panel p{color:var(--muted);font-size:13px}#link-form{display:grid;gap:9px}label{font-size:13px;font-weight:700}input{width:100%;border:1px solid #bfccdb;padding:12px;border-radius:7px;background:white;color:var(--navy);min-height:46px}#link-form button{margin-top:8px;justify-self:start}#link-form label:not(:first-child){margin-top:10px}#link-result{display:grid;gap:12px;margin-top:24px}.text-link{display:inline-block;font-size:13px;margin-top:14px}footer{max-width:1116px;margin:10px auto 0;padding:22px 0 30px;font-size:11px;color:var(--muted);border-top:1px solid var(--line)}
@media(max-width:760px){.site-header{padding:18px 20px}.brand{font-size:17px;gap:9px}.brand svg{width:27px}.privacy{font-size:10px;gap:5px}main{padding:22px 16px}.intro{margin-bottom:20px}.intro p{font-size:13px}.experience{grid-template-columns:1fr;gap:26px}.viewer{aspect-ratio:3/4;border-radius:14px;max-height:68svh;min-height:300px}.status-pill{top:12px;right:12px;max-width:calc(100% - 24px)}.guide{display:grid;grid-template-columns:110px minmax(0,1fr);gap:0 18px}.target-heading{grid-column:1/-1}.target-preview{grid-column:1;padding:10px;min-height:100px;align-self:start}.guide>p{grid-column:2;margin:0;font-size:12px}.tips{grid-column:2;margin-top:-14px;font-size:11px}.device-note{grid-column:1/-1;margin-top:12px;padding-top:16px}.controls .primary{flex-grow:1}.controls .secondary{padding:12px 16px}.setup-panel{padding:20px}footer{margin:0 16px;padding:20px 0}.idle-message strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* The query-link experience is a camera surface covering the entire viewport. */
body.immersive{background:var(--navy);overflow:hidden;overscroll-behavior:none}
.immersive .site-header,.immersive .intro,.immersive .guide,.immersive footer{display:none}
.immersive main{max-width:none;margin:0;padding:0}
.immersive .experience{display:block;position:fixed;inset:0;width:100%;height:100vh;height:100dvh}
.immersive .viewer-section{width:100%;height:100%}
.immersive .viewer{width:100%;height:100%;aspect-ratio:auto;min-height:0;max-height:none;border-radius:0}
.immersive #camera-video{object-fit:cover;object-position:center}
.immersive .status-pill{top:calc(env(safe-area-inset-top,0px) + 18px);right:calc(env(safe-area-inset-right,0px) + 16px);max-width:calc(100% - 32px);z-index:2}
.immersive .viewfinder{inset:28% 16%;opacity:.5}
.immersive[data-state=tracking] .viewfinder{opacity:0}
.immersive .controls{position:fixed;left:16px;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);margin:0;display:flex;justify-content:center;gap:10px;z-index:4;pointer-events:none}
.immersive .controls button{pointer-events:auto;max-width:100%;min-height:46px;box-shadow:0 2px 16px #0002}
.immersive .controls .primary{flex-grow:0}
.immersive .secondary{background:rgba(7,21,37,.88);color:#fff;border:1px solid #ffffff40;backdrop-filter:blur(12px)}
.immersive .secondary:hover{background:#18324d}
.immersive .hint{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);left:22px;right:22px;margin:0 auto;max-width:480px;text-align:center;color:white;font-size:12px;line-height:1.9;background:rgba(7,21,37,.82);padding:10px 14px;border-radius:12px;pointer-events:none;z-index:3}
.immersive[data-state=tracking] .hint,.immersive[data-state=error] .hint,.immersive[data-state=stopped] .hint{display:none}
.immersive .error-text{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 90px);left:20px;right:20px;max-width:540px;max-height:35vh;overflow:auto;margin:0 auto;z-index:4;box-shadow:0 4px 20px #0003}
.immersive .idle-message{gap:16px;padding:24px 24px 120px;pointer-events:none}
@media(max-height:450px){.immersive .hint{bottom:75px;padding:6px 12px}.immersive .idle-message{padding-bottom:55px;gap:8px}.immersive .idle-message svg{width:32px;height:32px}.immersive .error-text{bottom:78px}.immersive .controls{bottom:calc(env(safe-area-inset-bottom,0px) + 12px)}}
