:root{--paper:#f5f3ed;--ink:#15251f;--muted:#64736d;--panel:#10231d;--line:#15251f1f;--lime:#c9ff69;--green:#18794e;--green-soft:#e4f7ec;--red:#b4232d;--red-soft:#fdebed;--white:#fff}*{box-sizing:border-box}html{background:var(--paper);color:var(--ink)}body{background:radial-gradient(circle at 12% 4%, #c9ff6933, transparent 25rem), var(--paper);min-width:320px;color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,system-ui,sans-serif}button,input,textarea,select{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{width:min(100%,560px);min-height:100svh;padding:max(22px, env(safe-area-inset-top)) 20px max(28px, env(safe-area-inset-bottom));margin:0 auto}.topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:34px;display:flex}.brand{letter-spacing:.12em;align-items:center;gap:10px;font-size:12px;font-weight:800;display:inline-flex}.brand-mark{background:var(--ink);width:28px;height:28px;box-shadow:inset 0 0 0 7px var(--lime);border-radius:9px;position:relative}.privacy-pill{border:1px solid var(--line);min-height:30px;color:var(--muted);background:#ffffffa8;border-radius:999px;align-items:center;gap:7px;padding:6px 10px;font-size:11px;font-weight:700;display:inline-flex}.privacy-dot{background:var(--green);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #18794e1f}.intro{margin-bottom:22px}.eyebrow{color:var(--green);letter-spacing:.14em;margin:0 0 10px;font-size:12px;font-weight:900}h1{letter-spacing:-.06em;margin:0;font-size:clamp(36px,11vw,56px);line-height:1.02}.intro-copy{max-width:34rem;color:var(--muted);margin:14px 0 0;font-size:15px;line-height:1.8}.camera-card{background:var(--panel);border:1px solid #ffffff14;border-radius:30px;overflow:hidden;box-shadow:0 24px 60px #10231d2e}.camera-stage{aspect-ratio:4/5;background:radial-gradient(circle at 50% 32%,#c9ff6921,#0000 12rem),#0a1914;place-items:center;min-height:390px;display:grid;position:relative;overflow:hidden}.camera-video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.idle-panel,.success-panel{z-index:2;text-align:center;width:min(82%,330px);color:var(--white);position:relative}.camera-symbol{border:2px solid #ffffffd1;border-radius:18px;place-items:center;width:78px;height:60px;margin:0 auto 22px;display:grid;position:relative}.camera-symbol:before{content:"";background:#ffffffd1;border-radius:7px 7px 0 0;width:30px;height:12px;position:absolute;top:-10px}.camera-symbol:after{content:"";border:6px solid var(--lime);border-radius:50%;width:22px;height:22px}.idle-panel h2,.success-panel h2{letter-spacing:-.035em;margin:0;font-size:25px}.idle-panel p,.success-panel p{color:#ffffffab;margin:10px 0 0;font-size:13px;line-height:1.7}.guide-shade{z-index:2;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.guide-frame{aspect-ratio:2.75;border:2px solid var(--lime);border-radius:18px;width:86%;position:relative;box-shadow:0 0 0 999px #040e0a6b}.guide-frame:before,.guide-frame:after{content:"";background:var(--lime);border-radius:50%;width:9px;height:9px;position:absolute;top:50%;transform:translateY(-50%)}.guide-frame:before{left:-5px}.guide-frame:after{right:-5px}.guide-label{color:var(--white);letter-spacing:.06em;white-space:nowrap;background:#05140ed6;border-radius:999px;padding:7px 12px;font-size:11px;font-weight:800;position:absolute;bottom:-39px;left:50%;transform:translate(-50%)}.scan-overlay{z-index:4;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--white);text-align:center;background:#05120dc7;place-items:center;display:grid;position:absolute;inset:0}.scan-overlay p{margin:15px 0 0;font-size:14px;font-weight:800}.scan-ring{border:5px solid #ffffff26;border-top-color:var(--lime);border-radius:50%;width:56px;height:56px;margin:0 auto;animation:.9s linear infinite spin}.progress{background:#ffffff26;border:0;border-radius:999px;width:180px;height:5px;margin-top:18px;overflow:hidden}.progress::-webkit-progress-bar{background:#ffffff26}.progress::-webkit-progress-value{border-radius:inherit;background:var(--lime)}.progress::-moz-progress-bar{border-radius:inherit;background:var(--lime)}.success-mark{background:var(--lime);width:82px;height:82px;color:var(--panel);border-radius:50%;place-items:center;margin:0 auto 22px;font-size:42px;font-weight:900;display:grid;box-shadow:0 0 0 12px #c9ff691a}.camera-controls{z-index:5;background:var(--panel);padding:18px;position:relative}.primary-button,.secondary-button{cursor:pointer;border-radius:17px;width:100%;min-height:54px;font-weight:900;transition:transform .16s,filter .16s}.primary-button{background:var(--lime);color:var(--panel);border:0;box-shadow:0 9px 24px #c9ff6924}.secondary-button{color:var(--white);background:0 0;border:1px solid #ffffff3d}.primary-button:active,.secondary-button:active{transform:scale(.985)}.primary-button:disabled,.secondary-button:disabled{cursor:wait;filter:grayscale(.5);opacity:.55}.result-card{border:1px solid;border-radius:19px;gap:13px;margin-top:14px;padding:17px;display:flex}.result-card.error{background:var(--red-soft);color:var(--red);border-color:#b4232d2e}.result-card.success{background:var(--green-soft);color:var(--green);border-color:#18794e2e}.result-icon{border:2px solid;border-radius:50%;flex:none;place-items:center;width:29px;height:29px;font-weight:900;display:grid}.result-card strong{font-size:14px;display:block}.result-card p{margin:5px 0 0;font-size:12px;line-height:1.65}.privacy-note{color:var(--muted);align-items:flex-start;gap:12px;margin-top:19px;padding:0 4px;font-size:12px;line-height:1.65;display:flex}.privacy-lock{border:2px solid var(--green);border-radius:4px;flex:none;width:18px;height:15px;margin-top:3px;position:relative}.privacy-lock:before{content:"";border:2px solid var(--green);border-bottom:0;border-radius:8px 8px 0 0;width:8px;height:8px;position:absolute;top:-9px;left:3px}.hidden-canvas{display:none}@keyframes spin{to{transform:rotate(360deg)}}@media (min-width:700px){.app-shell{padding-top:38px;padding-bottom:48px}.camera-stage{min-height:480px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (forced-colors:active){.guide-frame,.result-card,.primary-button,.secondary-button{border:2px solid canvastext}}