:root{font-family:Arial,sans-serif;background:#101b16;color:#f3eddb;color-scheme:dark}*{box-sizing:border-box}body{margin:0}a{color:#c9ebc4}#picker-canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#setup{position:relative;max-width:590px;margin:28px auto;background:#18372ded;padding:28px;border-radius:20px;border:1px solid #adc99d44}#setup small:first-of-type{display:block;letter-spacing:2px;font-size:10px;color:#b3cdac;margin-top:25px}h1{font:52px Georgia,serif;line-height:1.05;margin:20px 0;color:#e9dcb5}p{line-height:1.65;font-size:14px}.small{font-size:12px;color:#b5c7b7}.guide{display:grid;gap:10px;padding:16px;background:#0d251b;border-radius:10px;border:1px solid #b9d6aa55}.guide b{font-size:14px}.guide span{font-size:11px;color:#c5bda9}label{display:flex;gap:10px;align-items:center;font-size:13px;margin:15px 0}button{border:0;background:#d1e5b9;color:#193427;padding:12px 16px;border-radius:9px;font:inherit;min-height:44px;cursor:pointer}button:disabled{opacity:.45}.secondary{background:#2b4a3c;color:#dde9d6}#status{white-space:pre-line;color:#e4d8ac}details{margin:20px 0}summary{cursor:pointer;font-size:13px}input{accent-color:#c7dfb3}.ar-mode,.ar-mode body{background:transparent!important}.ar-mode #setup{display:none!important}.ar-mode #picker-canvas{opacity:0}#hud{position:fixed;inset:0;display:flex;pointer-events:none}.eye{width:50%;height:100%;position:relative;--optical-center:50%}.eye:first-child{border-right:1px solid #c9d6ba44}.reticle{position:absolute;left:var(--optical-center);top:50%;transform:translate(-50%,-50%);font-size:24px;color:#fff2c6;text-shadow:0 1px 4px black}.readout{position:absolute;left:var(--optical-center);bottom:6%;width:76%;height:64px;transform:translateX(-50%);padding:8px;border-radius:7px;background:#12251ddd;color:#f2e9d3;font-size:11px;line-height:16px;text-align:center;white-space:pre-line;overflow:hidden;border-top:1px solid #e6d3a577}.picker-score{position:absolute;top:17%;left:var(--optical-center);transform:translateX(-50%);font-size:15px;white-space:nowrap;padding:7px 10px;background:#12251dcc;border-radius:6px}.guide-chip{position:absolute;top:24%;left:var(--optical-center);transform:translateX(-50%);color:#f1e8ce;background:#173427c9;padding:5px 8px;border-radius:5px;white-space:nowrap;font-size:9px;letter-spacing:1px}.inspect-note{position:absolute;top:34%;left:var(--optical-center);transform:translateX(-50%);font-size:13px;white-space:nowrap;color:#fff0b9;text-shadow:0 1px 4px black}.hand-check{position:absolute;top:3%;left:var(--optical-center);transform:translateX(-50%);width:92px;height:69px;border-radius:5px;border:1px solid #afcbae77}#controls{position:fixed;top:8px;right:8px;display:flex;gap:6px;z-index:3}#controls button{font-size:10px;min-height:30px;padding:7px;opacity:.8}[hidden]{display:none!important}@media(max-width:650px){#setup{margin:10px;padding:22px}h1{font-size:42px}}@media(max-height:500px){.picker-score{top:23%;font-size:12px}.guide-chip{top:32%;font-size:7px}.inspect-note{top:40%;font-size:10px}.hand-check{width:72px;height:54px}.readout{font-size:9px;bottom:4%;height:58px;padding:5px}}

#landscape-ui{position:fixed;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%);pointer-events:none}#landscape-ui #controls{position:absolute;pointer-events:auto}#hud{position:absolute}.inspect-note{font-size:18px;font-weight:bold;background:#173427d9;padding:7px 12px;border-radius:7px}.reticle{opacity:.35}@media(max-height:500px){.inspect-note{font-size:14px;top:39%;padding:5px 8px}}

.inspect-note:empty{display:none}

html.ar-mode,html.ar-mode body{width:100%;height:100%;overflow:hidden}#landscape-ui{overflow:hidden}#controls{flex-wrap:wrap;justify-content:flex-end;max-width:95%}

/* Native XR overlay rotation varies by device; draw headset text in the XR image. */
.ar-mode #hud,.ar-mode #controls{display:none!important}