:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#173c35;background:#f3f7f5;font-size:16px}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit}.scanner-shell{max-width:1200px;margin:auto;padding:22px 28px}.scanner-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.eyebrow{margin:0 0 6px;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:#628078;font-weight:750}h1{font-size:clamp(24px,3vw,34px);letter-spacing:-.035em;margin:0 0 6px;font-weight:650}.date{margin:0;color:#658077;font-size:14px}#clockTime{font-variant-numeric:tabular-nums}.scanner-tools{display:flex;align-items:center;gap:9px;flex-shrink:0}.icon-button,.manage-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid #d4e2db;background:#ffffffc9;border-radius:14px;text-decoration:none;color:#26564b}.icon-button{width:44px;padding:10px}.icon-button svg{width:24px;height:24px}.manage-button{gap:7px;padding:10px 13px;font-size:13px;font-weight:650}.manage-button svg{width:15px;height:15px}.icon-button:hover,.manage-button:hover{background:#e5f0e9}.cameraStage{width:100%;height:clamp(320px,65svh,780px);position:relative;overflow:hidden;border-radius:28px;background:#132f2a;box-shadow:0 12px 40px #20443810}.cameraStage video{display:block;width:100%;height:100%;object-fit:contain;transform:scaleX(-1)}.cameraStage[data-facing=environment] video{transform:none}.poseOverlay{position:absolute;bottom:0;left:0;right:0;padding:28px 16px 18px;background:linear-gradient(transparent,#0b211d9c);text-align:center;font-size:13px;color:#f4fff9;pointer-events:none;z-index:1}.start-camera{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:15px 25px;border:1px solid #ffffff45;border-radius:18px;background:#f3fff4;color:#195342;font-weight:700;z-index:3}.scan-feedback{text-align:center;min-height:68px;padding:16px 8px 4px}.scan-feedback h2{font-size:21px;margin:0 0 5px}.scan-feedback h2:empty{display:none}#scanStatus{font-size:15px;line-height:1.45;margin:0;color:#49675e;overflow-wrap:anywhere}.scanner-footer{display:flex;justify-content:center;gap:8px 18px;flex-wrap:wrap;font-size:11px;color:#779087;margin-top:10px}.demo-label{color:#7c8173}.setup-card{max-width:620px;background:white;padding:28px;border:1px solid #d8e5dd;border-radius:24px;margin:28px auto}.setup-card h2{font-size:22px}.setup-card p{color:#617c71;line-height:1.6}.gateButton{display:inline-block;background:#0f766e;color:white;padding:13px 18px;border-radius:13px;text-decoration:none}#repeatScan{margin:12px auto 0;max-width:580px}#repeatScan button{min-height:44px;border:0;border-radius:12px;padding:11px 18px;background:#146c54;color:white;margin:4px;font-weight:650}#repeatScan .secondary{background:#e5eee8;color:#2d5144}#repeatScan small{font-size:11px;color:#6b8175}
.welcome{position:absolute;bottom:40px;left:5%;right:5%;display:flex;align-items:center;gap:12px;padding:14px 18px;background:#f3fff7f5;border:1px solid #b5e2c6;border-radius:22px;box-shadow:0 8px 32px #092b3030;pointer-events:none;color:#174a3c}.welcome[data-state=pending]{background:#f0f8fff5;border-color:#b7d9ec}.welcome .buddy{width:76px;min-width:60px;height:76px}.welcome strong,.welcome span,.welcome small{display:block}.welcome strong{font-size:1.2rem}.welcome #welcomeName{font-size:1rem;font-weight:600;overflow-wrap:anywhere}.welcome small{margin-top:4px}.sparkles{color:#ddb146;font-size:1.5rem}.celebrate{animation:welcomeIn .45s cubic-bezier(.2,.8,.25,1) both}.celebrate .buddy{animation:sunHello 1.1s ease-in-out both}.celebrate .sparkles{animation:sparkle 1.1s ease-in-out both}#repeatScan{padding:14px;background:#fff8e5;border-radius:16px}#repeatScan small{display:block;margin-top:8px}@keyframes welcomeIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}@keyframes sunHello{0%,100%{transform:rotate(0)}25%{transform:rotate(-9deg)}65%{transform:rotate(9deg)}}@keyframes sparkle{0%,100%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}@media(prefers-reduced-motion:reduce){.celebrate,.celebrate *{animation:none!important}}@media(max-width:480px){.welcome{gap:8px;padding:10px;bottom:40px}.welcome .buddy{width:56px;height:56px}.welcome strong{font-size:1.05rem}.sparkles{display:none}}

#repeatScan[data-band=recent]{background:#f0f7f4}#repeatScan[data-band=recent] button{padding:8px 12px;font-size:.9rem}
.cameraStage .poseOverlay{background:none;z-index:1;font-size:13px}.cameraStage .welcome{z-index:2;bottom:60px;background:#f3fff7}.cameraStage .welcome[data-state=pending]{background:#f0f8ff}


#idleScreen{position:absolute;inset:0;z-index:5;width:100%;height:100%;border:0;border-radius:28px;background:radial-gradient(circle at 25% 15%,#e3f2dc,#f0f6ef 70%);color:#214d3b;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;cursor:pointer}#idleClock{font-size:clamp(4rem,13vw,8rem);font-weight:550;letter-spacing:-.065em;font-variant-numeric:tabular-nums}#idleScreen strong{font-size:clamp(1.1rem,3vw,1.55rem);font-weight:600}#idleDevice{font-size:14px;color:#5a7b65}#idleSync{font-size:11px;color:#6b8974}.idleSchool{letter-spacing:.18em;font-size:11px;text-transform:uppercase;color:#6d8a70}.cameraStage .welcome{bottom:54px;left:8%;right:8%;z-index:2}.cameraStage .poseOverlay{inset:auto 0 0}.poseOverlay:before{display:none}@media(max-width:600px){.scanner-shell{padding:18px 14px}.scanner-header{align-items:flex-start;gap:8px;margin-bottom:16px}.scanner-tools{gap:6px}.manage-button{padding:10px;font-size:12px}.manage-button svg{display:none}.icon-button{width:42px;min-height:42px}.date{font-size:12px}h1{font-size:24px}.cameraStage{height:61svh;min-height:310px;border-radius:23px}.scanner-footer{gap:5px 12px;margin-top:6px}.welcome{left:4%!important;right:4%!important}.scan-feedback{padding-top:13px}}@media(max-width:360px){h1{font-size:21px}.manage-button{padding:9px 8px}.scanner-tools{gap:4px}}@media(max-height:500px){.cameraStage{min-height:240px;height:65svh}.scanner-shell{padding-top:12px}.scanner-header{margin-bottom:12px}}

.scanner-tools .icon-button,.scanner-tools .manage-button{width:44px;height:44px;min-height:44px;padding:10px;border-radius:50%;background:#ffffffbd;border-color:#d3e2da}.scanner-tools .manage-button svg,.scanner-tools .icon-button svg{display:block;width:22px;height:22px}.scanner-tools :focus-visible{outline:3px solid #6aaf94;outline-offset:3px}
