@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--blue:#1575c9;--deep:#074f99;--teal:#27b9ac;--light:#e5fffa;--white:#fff;--ink:#07549b;--spring:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:'DM Sans',system-ui,sans-serif;color:var(--ink);background:linear-gradient(150deg,#0c71cd,#13a5b2);font-size:14px}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #00ceba;outline-offset:5px}button:disabled{cursor:wait;opacity:.65}[hidden]{display:none!important}svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.round-button{width:46px;height:46px;background:#fff;color:var(--deep);border-radius:50%;display:grid;place-items:center;box-shadow:0 5px 20px #0066bb24;pointer-events:auto;flex-shrink:0;font-size:28px}.round-button:hover{color:var(--teal)}.primary{display:flex;align-items:center;justify-content:center;gap:35px;min-height:52px;padding:15px 25px;border-radius:18px;background:linear-gradient(110deg,#1479ce,#16aaa9);color:white;font-weight:700;font-size:14px;box-shadow:0 9px 22px #1575c92a}.primary span{font-size:20px}.text-button{background:none;color:var(--blue);padding:12px;font-size:12px;font-weight:600}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px #27b9ac12;flex-shrink:0}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2px;color:#109c9b}
#camera{position:fixed;inset:0;overflow:hidden;z-index:0;isolation:isolate}#camera canvas{pointer-events:none}#scanner{position:fixed;inset:0;pointer-events:none;z-index:5;background:linear-gradient(#126fc81a,transparent 25%,transparent 70%,#0068b52e)}.scan-top{position:absolute;top:max(20px,env(safe-area-inset-top));left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:3}.camera-label{display:flex;gap:10px;align-items:center;border-radius:40px;padding:13px 20px;background:#fff;color:var(--deep);font-size:9px;font-weight:700;letter-spacing:1.7px;box-shadow:0 5px 20px #0066bb24}#scan-guide{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:min(82vw,460px);text-align:center;transition:opacity .25s}body.tracked #scan-guide,body.has-state #scan-guide{opacity:0;pointer-events:none}.reticle{position:relative;height:clamp(185px,25vw,265px);margin-bottom:30px}.reticle i{position:absolute;width:36px;height:36px;border:solid white;border-width:0;filter:drop-shadow(0 2px 6px #086acb40)}.reticle i:nth-child(1){left:0;top:0;border-top-width:3px;border-left-width:3px;border-radius:22px 0 0}.reticle i:nth-child(2){right:0;top:0;border-top-width:3px;border-right-width:3px;border-radius:0 22px 0 0}.reticle i:nth-child(3){left:0;bottom:0;border-bottom-width:3px;border-left-width:3px;border-radius:0 0 0 22px}.reticle i:nth-child(4){right:0;bottom:0;border-bottom-width:3px;border-right-width:3px;border-radius:0 0 22px}.scan-line{position:absolute;left:5%;width:90%;height:2px;box-shadow:0 0 18px #5ffff1;background:linear-gradient(90deg,transparent,#85fff2,transparent);animation:sweep 3s ease-in-out infinite}.guide-label{display:inline-flex;gap:11px;align-items:center;padding:13px 20px;background:#fff;border-radius:40px;font-weight:600;font-size:13px;box-shadow:0 8px 25px #0077bb25}#scan-guide>p{color:white;font-size:12px;text-shadow:0 1px 8px #0053a5}body.has-state .scan-bottom{display:none}.scan-bottom{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:15px;right:15px;display:flex;align-items:center;flex-direction:column;gap:15px}#tracking-status{font-size:11px;line-height:1.5;background:#fff;border-radius:30px;padding:10px 17px;color:var(--deep);box-shadow:0 6px 25px #0069b629}#side-switch{display:flex;gap:5px;background:#fff;padding:5px;border-radius:30px;pointer-events:auto;box-shadow:0 5px 25px #005bbf2e}#side-switch button{border-radius:25px;padding:11px 17px;background:white;color:var(--blue);font-size:11px;font-weight:600}#side-switch button.selected{background:var(--blue);color:#fff}
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#fff;overflow:hidden;transition:opacity .55s,visibility .55s}.loader.dismiss{opacity:0;visibility:hidden;pointer-events:none}.loader-glow{position:absolute;width:min(90vw,600px);height:min(90vw,600px);background:radial-gradient(circle,#4de2cf14,transparent 65%);border-radius:50%;animation:glow 3s ease-in-out infinite}.loader-inner{text-align:center;position:relative}.loader-orbit{position:relative;width:170px;height:170px;margin:0 auto 27px;display:grid;place-items:center}.loader-orbit img{position:relative;width:108px;height:108px;border-radius:50%;box-shadow:0 15px 35px #1799b62e;animation:logo-pulse 2.4s ease-in-out infinite}.orbit-ring{position:absolute;border-radius:50%;border:1.5px solid}.ring-one{inset:8px;border-color:#1bb9ad33;border-top-color:#20b7ac;border-bottom-color:#1d79ca;animation:spin 2.2s linear infinite}.ring-two{inset:0;border-color:transparent;border-left-color:#278ac94d;border-right-color:#24c9b74d;animation:spin 4.3s linear infinite reverse}.orbit-dot{position:absolute;inset:0;animation:spin 2.2s linear infinite}.orbit-dot:after{content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:#26b7ad;left:calc(50% - 3px);top:5px;box-shadow:0 0 15px #26b7ad80}.loader-wordmark{font-family:Manrope,system-ui,sans-serif;font-weight:800;font-size:25px;letter-spacing:5px;color:#126fb8}.loader-wordmark>span{display:block;font-size:8px;letter-spacing:3px;margin-top:8px;color:#159f9b}.progress{height:3px;width:150px;background:#dff9f3;margin:27px auto 15px;overflow:hidden;border-radius:5px}.progress>span{display:block;width:5%;height:100%;border-radius:5px;background:linear-gradient(90deg,#197bd1,#28c3ac);transition:width .4s}.loader p{font-size:11px;color:#117fba;margin:0}.loading-dots{display:flex;justify-content:center;gap:5px;margin-top:18px}.loading-dots i{width:4px;height:4px;background:#22b6ac;border-radius:50%;animation:dot-hop 1.2s ease-in-out infinite}.loading-dots i:nth-child(2){animation-delay:.15s}.loading-dots i:nth-child(3){animation-delay:.3s}.loader-brands{position:absolute;bottom:max(40px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:20px;width:100%}.loader-brands>img{width:100px;height:30px;object-fit:contain}.loader-brands>span{color:#24b5ac;font-size:13px}
#camera-state{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:16px;right:16px;max-width:420px;margin:auto;background:white;border-radius:28px;padding:24px;text-align:center;pointer-events:auto;box-shadow:0 18px 60px #005db530;animation:rise .65s var(--spring) both}#camera-state h2{font:700 22px Manrope,system-ui,sans-serif;margin:12px 0;color:var(--deep)}#camera-state p{font-size:13px;line-height:1.7;color:#1878b7;margin:0 auto 20px;max-width:310px}#camera-state .primary{width:100%}.state-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:#e5fffa;color:#16a99d;margin:auto}
.ar-content{display:flex;width:1000px;gap:36px;align-items:center;justify-content:center;pointer-events:auto}.logo-float{flex:1;min-width:0;animation:levitate 4s ease-in-out infinite}.logo-float:nth-child(2){animation-delay:-2s}.ar-tile{position:relative;display:flex;flex-direction:column;align-items:stretch;width:100%;background:#fff!important;color:var(--deep);border:3px solid white;border-radius:32px;padding:30px;box-shadow:0 8px 0 #2fbcad,0 26px 65px #0063a638;text-align:left;isolation:isolate;animation:logo-enter .8s var(--spring) both;pointer-events:auto;transition:box-shadow .2s,scale .2s}.logo-float:nth-child(2) .ar-tile{animation-delay:.13s;box-shadow:0 8px 0 #287ed1,0 26px 65px #0063a638}.ar-tile:hover{scale:1.025;box-shadow:0 10px 0 #2fbcad,0 30px 70px #0063a640}.ar-tile:active{scale:.97}.tile-index{font-size:13px;font-weight:700;letter-spacing:2px;color:#17aaa3;margin-bottom:26px}.ar-tile img{display:block;width:100%;height:105px;background:#fff;object-fit:contain}.tile-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:25px;padding-top:22px;border-top:2px solid #e4faf5;font-size:17px;font-weight:600}.play-button{display:grid;place-items:center;width:48px;height:48px;background:linear-gradient(135deg,#1d8ad0,#28bdad);border-radius:50%;color:white;flex-shrink:0;box-shadow:0 6px 14px #168fc92e}.play-button svg{width:21px;height:21px;fill:currentColor;stroke:none}
#demo-stage{position:absolute;left:50%;top:42%;width:min(84vw,560px);transform:translate(-50%,-50%);perspective:1000px;pointer-events:none;transition:top .6s var(--spring)}.demo-card{display:block;width:100%;border-radius:16px;transform:rotateX(18deg) rotate(-6deg);box-shadow:0 25px 65px #0057ae38;animation:card-enter .7s var(--spring) both}.demo-content{position:absolute;inset:0 -12px;display:flex;align-items:center;pointer-events:none}.demo-content .ar-content{width:100%;gap:14px;transform:translateY(-12px)}.demo-content .ar-tile{padding:19px;border-radius:20px;border-width:2px;box-shadow:0 5px 0 #2fbcad,0 14px 35px #0063a638}.demo-content .logo-float:nth-child(2) .ar-tile{box-shadow:0 5px 0 #287ed1,0 14px 35px #0063a638}.demo-content .ar-tile img{height:64px}.demo-content .tile-index{font-size:8px;letter-spacing:1px;margin-bottom:15px}.demo-content .tile-footer{font-size:11px;padding-top:13px;margin-top:16px;gap:8px;border-width:1px}.demo-content .play-button{width:32px;height:32px}.demo-content .play-button svg{width:15px;height:15px}
#contact-dock{position:absolute;bottom:max(27px,env(safe-area-inset-bottom));left:16px;right:16px;width:min(calc(100% - 32px),430px);margin:auto;pointer-events:none;z-index:2}.dock-person{display:flex;align-items:center;gap:11px;margin:0 5px 15px;color:white;text-shadow:0 1px 10px #005ca550;animation:rise .6s var(--spring) both}.dock-avatar{width:43px;height:43px;padding:4px;border-radius:50%;background:white;box-shadow:0 5px 18px #0069b830}.dock-avatar img{width:100%;height:100%;border-radius:50%}.dock-person h2{font:700 21px Manrope,system-ui,sans-serif;letter-spacing:-.5px;margin:0}.dock-person p{font-size:10px;margin:3px 0 0;font-weight:500}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.contact-action{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-width:0;background:#fff;color:var(--deep);padding:16px;border-radius:22px;box-shadow:0 6px 0 #0c76ba13,0 15px 40px #0063a625;pointer-events:auto;min-height:120px;text-align:left;position:relative;overflow:hidden;animation:contact-enter .65s var(--spring) both;transition:translate .2s,box-shadow .2s}.contact-action:nth-child(2){animation-delay:.08s}.contact-action:nth-child(3){animation-delay:.16s}.contact-action:nth-child(4){animation-delay:.24s}.action-icon{width:35px;height:35px;display:grid;place-items:center;border-radius:12px;background:#e5fffa;color:#0aa795;margin-bottom:14px}.action-icon svg{width:19px;height:19px}.action-arrow{position:absolute;right:16px;top:17px;font-size:17px;color:#2795c5}.action-title{font-size:12px;font-weight:700;display:block}.action-value{font-size:10px;line-height:1.5;color:#1676b8;margin-top:3px;display:block;overflow-wrap:anywhere}.contact-action:hover{translate:0 -4px;box-shadow:0 8px 0 #21bdb520,0 18px 40px #0063a630}.contact-action:active{scale:.97}.contact-action.save-action{color:#fff;background:linear-gradient(135deg,#147bd0,#14aaa7)}.save-action .action-icon{background:#ffffff26;color:white}.save-action .action-arrow,.save-action .action-value{color:#fff}body.has-contact .scan-bottom{bottom:auto;top:max(86px,calc(env(safe-area-inset-top) + 66px))}body.has-contact #tracking-status{font-size:10px}body.has-contact #side-switch{position:fixed;bottom:max(15px,env(safe-area-inset-bottom))}body.demo.has-contact #contact-dock{bottom:max(81px,calc(env(safe-area-inset-bottom) + 60px))}body.demo.has-contact #demo-stage{top:28%;width:min(65vw,360px)}body.demo.has-contact #tracking-status{display:none}
 dialog{background:#fff;color:var(--deep);border:0;border-radius:28px;padding:25px;width:min(730px,calc(100% - 28px));max-height:90svh;box-shadow:0 25px 90px #0056ad45}dialog::backdrop{background:#005eac80;backdrop-filter:blur(16px)}.modal-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.modal-top h2{font:700 25px Manrope,system-ui,sans-serif;letter-spacing:-.5px;margin:7px 0 0}.modal-top .round-button{background:#e8fcf8;box-shadow:none;color:#0b9297}#video-slot video{display:block;width:100%;max-height:60svh;background:#0069b4;border-radius:17px}dialog p,dialog li{font-size:12px;line-height:1.8;color:#1776ad}dialog ol{padding-left:20px}dialog li{padding:7px 0}#help-dialog .primary{width:100%;margin-top:22px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes glow{50%{transform:scale(1.25);opacity:.55}}@keyframes logo-pulse{50%{transform:scale(.94);box-shadow:0 10px 28px #1799b626}}@keyframes dot-hop{0%,60%,100%{translate:0 0;opacity:.45}30%{translate:0 -5px;opacity:1}}@keyframes sweep{0%,100%{top:10%;opacity:.4}50%{top:90%;opacity:1}}@keyframes logo-enter{from{opacity:0;translate:0 90px;scale:.75;rotate:-5deg}to{opacity:1;translate:0 0;scale:1;rotate:0deg}}@keyframes rise{from{opacity:0;translate:0 30px}to{opacity:1;translate:0 0}}@keyframes contact-enter{from{opacity:0;translate:0 70px;scale:.85;rotate:3deg}to{opacity:1;translate:0 0;scale:1;rotate:0deg}}@keyframes levitate{0%,100%{translate:0 0}50%{translate:0 -12px}}@keyframes card-enter{from{opacity:0;translate:0 25px}to{opacity:1;translate:0 0}}
@media(max-width:450px){.scan-top{left:16px;right:16px;top:max(16px,env(safe-area-inset-top))}.round-button{width:42px;height:42px}.camera-label{font-size:8px;padding:12px 17px;letter-spacing:1.3px}.demo-content .ar-tile{padding:13px;border-radius:17px}.demo-content .tile-index{font-size:6px;margin-bottom:12px;letter-spacing:.8px}.demo-content .ar-tile img{height:46px}.demo-content .tile-footer{font-size:9px;padding-top:11px;margin-top:13px;gap:5px}.demo-content .play-button{width:27px;height:27px}.demo-content .play-button svg{width:12px;height:12px}.contact-action{padding:14px;min-height:115px;border-radius:20px}.action-value{font-size:10px;letter-spacing:-.1px}.dock-person{margin-bottom:12px}.dock-person h2{font-size:20px}.action-icon{margin-bottom:11px}.loader-orbit{width:155px;height:155px}.loader-orbit img{width:100px;height:100px}dialog{padding:20px}.modal-top h2{font-size:22px}}
@media(max-height:700px){#contact-dock{width:min(calc(100% - 32px),430px)}.contact-action{min-height:91px;padding:11px 14px;border-radius:18px}.action-icon{width:29px;height:29px;margin-bottom:7px}.action-icon svg{width:16px;height:16px}.dock-person{margin-bottom:9px}.dock-avatar{width:35px;height:35px}.dock-person h2{font-size:18px}.dock-person p{font-size:9px}body.demo.has-contact #demo-stage{top:26%;width:220px}.reticle{height:155px}#scan-guide{top:43%}}
@media(orientation:landscape) and (max-height:550px){#contact-dock{left:auto;right:22px;width:380px;bottom:20px}.contact-grid{gap:8px}.contact-action{min-height:90px}.dock-person{margin-bottom:8px}body.demo.has-contact #demo-stage{left:24%;top:48%;width:220px}body.has-contact .scan-bottom{left:20px;right:auto;top:auto;bottom:20px}body.demo.has-contact #contact-dock{bottom:20px}body.has-contact #side-switch{position:static}.loader-brands{bottom:20px}.loader-inner{scale:.8}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.contact-action>span:last-child{width:100%;min-width:0}
@media(max-width:360px){.action-value{font-size:9px;white-space:nowrap;letter-spacing:-.15px}}

/* Fixed brand palette: never inherit native dark-mode control surfaces. */
:root{color-scheme:only light}
html,body,#scanner,#camera,.loader,dialog{color-scheme:only light}
button,a.contact-action,.camera-label,.guide-label,#tracking-status,#side-switch,#camera-state,dialog,.loader{forced-color-adjust:none}
button{appearance:none;-webkit-appearance:none;color-scheme:only light;background:#fff!important;color:#07549b!important}
button:disabled{background:#fff!important;color:#07549b!important;opacity:1}
.ar-tile,.ar-tile:hover,.ar-tile:active,.contact-action,.contact-action:hover,.contact-action:active,.contact-action.save-action,.round-button,.primary,.text-button,#side-switch button{background:#fff!important;background-image:none!important;color:#07549b!important}
.ar-tile img,.loader,.camera-label,.guide-label,#tracking-status,#side-switch,#camera-state,dialog,.dock-avatar{background-color:#fff!important}
.primary{border:2px solid #1575c9}
.contact-action.save-action .action-icon{background:#e5fffa;color:#0aa795}
.contact-action.save-action .action-arrow{color:#2795c5}
.contact-action.save-action .action-value{color:#1676b8}
#side-switch button{border:2px solid transparent;padding:9px 15px}
#side-switch button.selected{border-color:#1575c9;background:#fff!important;color:#07549b!important}
@media(prefers-color-scheme:dark){:root{color-scheme:only light}button,.ar-tile,a.contact-action,dialog,.loader,#camera-state{color-scheme:only light;background-color:#fff!important}}

.contact-action:nth-child(5){animation-delay:.32s}.contact-action:nth-child(6){animation-delay:.4s}
@media(max-height:700px) and (orientation:portrait){body.demo.has-contact #demo-stage{top:18%;width:130px}}
@media(orientation:landscape) and (max-height:550px){.contact-grid{grid-template-columns:repeat(3,1fr)}#contact-dock{width:min(480px,calc(100% - 32px))}body.demo.has-contact #demo-stage{left:12%;width:130px}.action-value{font-size:9px}}

#scan-help{padding:0;line-height:1;aspect-ratio:1}#scan-help svg{width:24px;height:24px;flex-shrink:0}