:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#ecf7f4;background:#071b21;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:300px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.43;cursor:not-allowed}.scanner-shell{min-height:100dvh;background:radial-gradient(ellipse at top left,#12483c,#0b2830 40%,#071922 85%);padding-bottom:max(25px,env(safe-area-inset-bottom))}.scanner-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px max(16px,env(safe-area-inset-left));border-bottom:1px solid #ffffff1a;background:#0b2530bb;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.scanner-header>div:first-child{display:flex;gap:9px;align-items:center}.scanner-header img{width:46px;height:46px;border-radius:13px}.scanner-header span:not(.scanner-status){font-size:20px;letter-spacing:-.05em;font-weight:900}.scanner-header span b{color:#23c99d}.scanner-header span small{display:block;margin-top:1px;letter-spacing:.15em;font-size:8px;color:#9ebbb9;font-weight:800}.scanner-status{display:flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid #ffffff2c;border-radius:999px;background:#ffffff09;font-size:10px;font-weight:780;color:#bdcbcd;white-space:nowrap}.scanner-status span{width:8px;height:8px;border-radius:99px;background:#d59a30}.scanner-status.active{color:#66f7c6;background:#0bc48c17;border-color:#27cc9c55}.scanner-status.active span{background:#28d9a2;box-shadow:0 0 0 4px #28d9a221}.scanner-content{width:min(570px,100%);margin:0 auto;padding:23px 17px 45px;display:grid;gap:14px}.scanner-unpaired{display:grid;justify-items:stretch;gap:14px;padding:30px 18px;border:1px solid #ffffff20;border-radius:24px;background:#122d33aa;text-align:center}.scanner-unpaired-icon{display:grid;place-items:center;justify-self:center;width:75px;height:75px;border:1px solid #28b99466;border-radius:23px;background:#21be9240;color:#70f6cc}.scanner-eyebrow{font-size:10px;letter-spacing:.18em;font-weight:850;color:#37dca9}.scanner-unpaired h1{font-size:clamp(25px,7vw,33px);line-height:1.09;letter-spacing:-.04em;margin:0}.scanner-unpaired p{color:#b4cdca;font-size:13px;line-height:1.68;margin:0}.scanner-main-action{display:flex;justify-content:center;align-items:center;gap:9px;width:100%;min-height:54px;padding:9px 14px;border:1px solid #0fc997;border-radius:14px;color:#072b24;background:#17c99a;font-size:14px;font-weight:850;box-shadow:0 10px 23px #08bf8b1e}.scanner-main-action.stop{background:transparent;border-color:#fff5;color:#e3f5f2;box-shadow:none}.scanner-linked{display:grid;gap:17px}.scanner-binding{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #29bf9566;border-radius:16px;background:#1cc19317}.scanner-binding>svg{flex:0 0 auto;color:#29d8a6}.scanner-binding>div{flex:1;min-width:0;display:grid;gap:3px}.scanner-binding>div small{font-size:9px;letter-spacing:.12em;font-weight:850;color:#60dfbb}.scanner-binding>div strong{font-size:15px}.scanner-binding>div span{font-size:11px;color:#adbfbd}.scanner-binding>button{display:grid;place-items:center;width:34px;height:34px;background:#ffffff08;border:1px solid #ffffff2b;border-radius:10px;color:#ddd}.scanner-view{display:grid;gap:12px}.scanner-placeholder{display:grid;justify-items:center;align-content:center;gap:12px;aspect-ratio:4/3;border:1px solid #ffffff26;border-radius:19px;background:linear-gradient(140deg,#0e2830,#0a1e23);text-align:center}.scanner-placeholder svg{color:#42cda4;filter:drop-shadow(0 0 22px #28d0a144)}.scanner-placeholder strong{font-size:16px}.scanner-placeholder span{font-size:12px;color:#a9bab9}.scanner-video{position:relative;overflow:hidden;aspect-ratio:4/3;background:#000;border:1px solid #33cba599;border-radius:19px}.scanner-video video{display:block;width:100%;height:100%;object-fit:cover}.scanner-reticle{position:absolute;pointer-events:none;top:28%;right:12%;bottom:28%;left:12%;border:3px solid #31edb9;border-radius:14px;box-shadow:0 0 0 150px #031a1933,0 0 15px #11cfa2a3}.scanner-reticle:after{content:"";position:absolute;left:3%;right:3%;top:50%;height:2px;background:#22eab17e}.scanner-torch{position:absolute;z-index:3;top:10px;right:10px;display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff66;border-radius:12px;background:#062724dd;color:#fff}.scanner-last{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 14px;border:1px solid #ffffff22;border-radius:15px;background:#ffffff09}.scanner-last>div{display:grid;grid-template-columns:21px auto;column-gap:9px;row-gap:3px;align-items:center;min-width:0}.scanner-last svg{grid-row:1/3;color:#3cdcae}.scanner-last span{font-size:10px;color:#b0c9c3}.scanner-last strong{font-size:13px;overflow-wrap:anywhere}.scanner-last>small{font-size:10px;color:#b3c3c0;white-space:nowrap}.scanner-pending{display:grid;gap:9px;padding:14px;border:1px solid #e0a34d7d;border-radius:14px;background:#c8792e18}.scanner-pending strong{display:flex;gap:8px;align-items:center;font-size:12px;color:#efba70}.scanner-pending p{margin:0;color:#dfc2a6;line-height:1.6;font-size:11px}.scanner-pending>button,.scanner-pending-confirm button{min-height:39px;border:1px solid #ebb46b67;border-radius:9px;color:#082324;background:#e5b264;font-size:12px;font-weight:790}.scanner-pending>button{display:flex;align-items:center;justify-content:center;gap:7px}.scanner-pending-confirm{display:grid;grid-template-columns:1fr 1fr;gap:9px}.scanner-pending-confirm button:first-child{background:transparent;color:#ecbd79}.scanner-manual{padding:13px;border:1px solid #ffffff20;border-radius:12px;background:#ffffff05}.scanner-manual summary{font-size:11px;font-weight:750;cursor:pointer}.scanner-manual form{display:flex;gap:8px;margin-top:12px}.scanner-manual input{flex:1;min-width:0;height:42px;padding:0 10px;background:#18353c;color:#fff;border:1px solid #ffffff28;border-radius:9px;font-size:13px}.scanner-manual button{padding:0 13px;border:0;border-radius:9px;background:#1acc9e;color:#042c23;font-size:12px;font-weight:800}.scanner-notice,.scanner-error{display:flex;align-items:flex-start;gap:9px;padding:13px;border:1px solid #20cfa055;border-radius:12px;background:#0ac28d1d;color:#b0f8dd;font-size:11px;line-height:1.6}.scanner-notice svg,.scanner-error svg{flex:0 0 auto;margin-top:2px}.scanner-error{background:#d4a04e19;border-color:#d4a04e77;color:#ffd396}.scanner-footnote{display:flex;align-items:flex-start;gap:8px;margin:7px 0 0;color:#91a7a5;font-size:10px;line-height:1.7}.scanner-footnote svg{flex:0 0 auto;margin-top:1px;color:#36c89c}@media(max-width:380px){.scanner-header{gap:6px;padding:12px}.scanner-header img{width:38px;height:38px}.scanner-header span:not(.scanner-status){font-size:18px}.scanner-status{font-size:9px;padding:7px}.scanner-content{padding:17px 10px 35px}.scanner-last{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
