:root{color-scheme:dark;--ink:#101719;--lime:#c9fa75;--soft:#aeb8b5;font-family:Tahoma,Arial,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:#f6f8f2}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid var(--lime);outline-offset:5px}[hidden]{display:none!important}#camera{position:fixed;inset:0;overflow:hidden;isolation:isolate;background:transparent}#camera>video{z-index:0!important}#camera>canvas{z-index:1!important;pointer-events:none}#camera>div{pointer-events:none}.topbar{position:fixed;z-index:10;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(22px + env(safe-area-inset-top)) 24px 22px;background:linear-gradient(#10171999,transparent);direction:ltr}.brand{font:bold 36px Arial,sans-serif;letter-spacing:-3px;text-decoration:none;color:#fff}.brand span{color:var(--lime)}.brand-dot{letter-spacing:0}.icon-button{width:44px;height:44px;border-radius:50%;border:1px solid #ffffff38;background:#10171990;color:white;font-size:21px}#menu{position:fixed;z-index:30;right:20px;top:calc(88px + env(safe-area-inset-top));width:min(340px,calc(100% - 40px));padding:24px;background:#172123f5;border:1px solid #ffffff25;border-radius:22px;box-shadow:0 24px 70px #0008;max-height:calc(100dvh - 120px);overflow:auto}#menu h2{font-size:21px}#menu p{line-height:1.9}#menu button{display:block;width:100%;padding:14px;margin-top:10px;border-radius:12px;background:#ffffff0c;color:#fff;text-align:right}.overlay{position:fixed;z-index:5;inset:0;display:grid;place-items:center;padding:105px 24px 36px;overflow:auto;background:radial-gradient(ellipse at 50% 20%,#344435 0,transparent 62%),#101719}.card{width:min(100%,410px);text-align:center}.sample-frame{width:102px;height:140px;margin:0 auto 30px;border:1px solid #c9fa7570;border-radius:5px;transform:rotate(-8deg);display:grid;place-items:center;background:linear-gradient(140deg,#5b7646,#1d3432);box-shadow:12px 12px 0 #c9fa750d}.sample-frame span{border:1px solid #c9fa7570;border-radius:50%;width:48px;height:48px;display:grid;place-items:center;color:var(--lime);font-size:16px;transform:rotate(8deg)}.eyebrow{font-size:11px;color:var(--lime);letter-spacing:.5px}h1{font-size:clamp(27px,6.9vw,36px);line-height:1.6;margin:12px 0 16px}#description{color:#d4dbd6;line-height:2;font-size:14px;margin:0 0 27px}.primary{background:var(--lime);color:#152017;border-radius:15px;padding:18px 24px;font-weight:bold;font-size:15px;min-height:54px;width:100%}.small{font-size:11px;line-height:1.9;color:var(--soft);margin:18px 0 0}#scan-guide{position:fixed;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);width:min(64vw,300px);aspect-ratio:2480/3508;pointer-events:none}#scan-guide i{position:absolute;width:28px;height:28px;border-color:#ffffffbc;border-style:solid;border-width:0}#scan-guide i:nth-child(1){top:0;left:0;border-top-width:2px;border-left-width:2px;border-top-left-radius:12px}#scan-guide i:nth-child(2){top:0;right:0;border-top-width:2px;border-right-width:2px;border-top-right-radius:12px}#scan-guide i:nth-child(3){bottom:0;left:0;border-bottom-width:2px;border-left-width:2px;border-bottom-left-radius:12px}#scan-guide i:nth-child(4){bottom:0;right:0;border-bottom-width:2px;border-right-width:2px;border-bottom-right-radius:12px}#status-bar{position:fixed;bottom:calc(28px + env(safe-area-inset-bottom));z-index:4;left:50%;transform:translateX(-50%);display:flex;gap:9px;align-items:center;background:#101719c9;border:1px solid #ffffff24;padding:13px 18px;border-radius:40px;font-size:12px;white-space:nowrap;max-width:94%;backdrop-filter:blur(12px)}.status-dot{width:6px;height:6px;flex-shrink:0;background:var(--lime);border-radius:50%}.audio-prompt{position:fixed;z-index:15;width:calc(100% - 48px);max-width:400px;bottom:calc(92px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%)}.media-source{position:fixed;width:1px;height:1px;bottom:0;left:0;opacity:.001;pointer-events:none}@media(max-height:680px){.sample-frame{width:66px;height:92px;margin-bottom:17px}h1{font-size:27px}.overlay{padding-top:100px}.small{margin-top:12px}}@media(prefers-reduced-motion:no-preference){.primary{transition:background .2s}.primary:hover{background:#dcffac}}
