:root{--ink:#122a35;--muted:#617380;--navy:#0c2c3b;--teal:#187f8b;--line:#d7e5e9;--bg:#eef4f6;--soft:#ebf7f7}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);-webkit-text-size-adjust:100%}body{margin:0;min-height:100vh}button{font:inherit;cursor:pointer}button:disabled{opacity:.48;cursor:default}
.topbar{background:var(--navy);color:#fff;padding:calc(14px + env(safe-area-inset-top)) 16px 17px}.top-inner{max-width:620px;margin:auto;display:flex;align-items:center;gap:13px}.brand-icon{width:46px;height:46px;border:1px solid #93cad1;border-radius:13px;display:grid;place-items:center;font-weight:800;letter-spacing:.02em;font-size:15px;color:#fff;background:#1d6371}.brand{margin:0 0 2px;font-size:10px;letter-spacing:.13em;font-weight:750;color:#b0d7dc}.top-inner h1{margin:0;font-size:20px;letter-spacing:-.02em}
.wrap{max-width:620px;padding:17px 14px 35px;margin:auto}.panel{border:1px solid var(--line);border-radius:18px;background:#fff;padding:18px;margin:0 0 14px;box-shadow:0 2px 14px #0c2c3b0a}.eyebrow{font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin:0 0 8px}.intro-title{font-weight:800;font-size:25px;line-height:1.2;letter-spacing:-.03em;margin:0 0 10px}.description{font-size:14px;line-height:1.55;color:#485f6b;margin:0 0 14px}.notice{background:var(--soft);border:1px solid #cae5e7;border-radius:10px;display:flex;gap:10px;align-items:flex-start;padding:12px;font-size:12px;color:#275461;line-height:1.45}.notice-dot{width:9px;height:9px;flex:none;border-radius:50%;background:var(--teal);margin-top:5px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.row h2{font-size:17px;margin:0 0 13px}.small-pill{font-size:11px;font-weight:750;color:#637781;border-radius:25px;padding:5px 9px;background:#e6edf0;margin-bottom:13px}.small-pill.on{color:#216148;background:#daf3e7}
.viewfinder{border-radius:14px;overflow:hidden;background:#071822;position:relative;aspect-ratio:4/3;min-height:230px;max-height:390px}.viewfinder video{height:100%;width:100%;object-fit:cover;display:block}.viewfinder .frame-art{position:absolute;left:18%;right:18%;top:12%;bottom:12%;pointer-events:none;filter:drop-shadow(0 2px 2px #001b22)}.corner{position:absolute;height:27px;width:27px;border-color:#79efe2;border-style:solid}.tl{top:0;left:0;border-width:4px 0 0 4px;border-top-left-radius:9px}.tr{top:0;right:0;border-width:4px 4px 0 0;border-top-right-radius:9px}.bl{bottom:0;left:0;border-width:0 0 4px 4px;border-bottom-left-radius:9px}.br{bottom:0;right:0;border-width:0 4px 4px 0;border-bottom-right-radius:9px}.idle-cover{position:absolute;inset:0;background:#102936;color:#b7d4dc;display:flex;gap:10px;align-items:center;justify-content:center;flex-direction:column;font-size:12px}.idle-cover.hidden,.hidden{display:none!important}
.status{font-size:13px;font-weight:650;min-height:26px;margin:14px 0 12px;line-height:1.45;color:#265e64;overflow-wrap:anywhere}.status.error{color:#a0362d}.buttons{display:grid;grid-template-columns:1.25fr 1fr;gap:9px}.primary,.secondary{border:0;border-radius:11px;padding:14px 10px;font-weight:750;font-size:14px;min-height:50px}.primary{color:white;background:var(--teal)}.secondary{background:#e9f2f4;color:var(--navy)}.hint{margin:12px 0 0;color:var(--muted);font-size:11px;line-height:1.5}.result{border-color:#92dac5;background:#f4fffa}.result h2{font-size:30px;margin:0 0 9px;letter-spacing:-.02em;color:#0f6344;overflow-wrap:anywhere}.result .description{margin-bottom:18px}.small-print{padding:16px}.small-print p{font-size:12px;line-height:1.6;color:#5b6f79;margin:0}.small-print summary{font-size:12px;cursor:pointer;color:#2c6b77;margin:12px 0 6px}.small-print details p{white-space:pre-wrap;overflow-wrap:anywhere}footer{text-align:center;color:#6c8189;font-size:11px;margin:10px auto;padding:0 12px calc(25px + env(safe-area-inset-bottom))}button:focus-visible,summary:focus-visible{outline:3px solid #40bfcf;outline-offset:2px}@media(max-width:365px){.top-inner h1{font-size:18px}.panel{padding:15px}.viewfinder{min-height:210px}.buttons{gap:7px}.primary,.secondary{font-size:13px}}
