:root{color-scheme:light;--bg: #f4f4f0;--surface: #ffffff;--surface-soft: #f6f5f1;--ink: #20242c;--ink-muted: #5b6470;--line: #e4e2dc;--blue-700: #0b4e8a;--blue-500: #0a78cf;--blue-50: #eef5fb;--amber: #fca700;--amber-hover: #fcb22e;--green: #0f9d58;--green-bg: #e7f6ee;--red: #c0392b;--red-bg: #fdefec;--radius: 16px;--shadow: 0 4px 18px rgba(32, 36, 44, .07);font-family:Poppins,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}input,select{font-family:inherit;font-size:16px;color:var(--ink)}.page{max-width:720px;margin:0 auto;padding:18px 16px 56px}.page-narrow{max-width:560px;margin:0 auto;padding:18px 16px 56px}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:4px 0 16px}.logo{display:block;width:120px;height:56px;object-fit:contain;object-position:center}.logo-left{justify-self:start}.logo-right{justify-self:end}.logo-hidden{visibility:hidden}.header-center{text-align:center}.event-heading{margin:0;font-size:22px;font-weight:700;letter-spacing:.01em;color:var(--blue-700);line-height:1.25}.event-sub{margin:2px 0 0;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-muted);font-weight:600}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 18px}.card+.card{margin-top:16px}.field{margin-bottom:16px}.field:last-child{margin-bottom:0}.label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}.label span.required{color:var(--red)}.help{font-size:12px;color:var(--ink-muted);margin-top:5px}.input,.select{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--surface);transition:border-color .15s ease,box-shadow .15s ease}.input:focus,.select:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px #0a78cf26}.input.invalid,.select.invalid{border-color:var(--red)}select.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235b6470' d='M1 1.5 6 6.5 11 1.5' stroke='%235b6470' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:34px;white-space:nowrap;text-overflow:ellipsis}.error-text{font-size:12px;color:var(--red);margin-top:5px}.visitor-card{border:1px solid var(--line);border-radius:14px;padding:16px 14px;background:var(--surface-soft)}.visitor-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}.visitor-title h3{margin:0;font-size:14px;font-weight:700;color:var(--blue-700)}.visitor-count-badge{font-size:12px;font-weight:700;color:var(--blue-700);background:var(--blue-50);border-radius:999px;padding:3px 10px}.row{display:flex;align-items:center;gap:10px}.row-between{justify-content:space-between}.btn{border:none;border-radius:12px;font-weight:700;font-size:15px;padding:13px 18px;transition:transform .05s ease,background .2s ease,box-shadow .2s ease}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--amber);color:var(--ink);box-shadow:0 6px 18px #fca70059}.btn-primary:hover:not(:disabled){background:var(--amber-hover)}.btn-blue{background:var(--blue-700);color:#fff}.btn-blue:hover{background:var(--blue-500)}.btn-outline{background:var(--surface);border:1px solid var(--line);color:var(--ink)}.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--blue-700)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-lg{width:100%;padding:15px 18px;font-size:16px}.step-bar{display:flex;align-items:center;gap:8px;margin:4px 0 18px}.step-bar .step-dot{width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}.step-bar .step-dot.done,.step-bar .step-dot.active{color:#fff}.step-bar .step-line{flex:1;height:2px;border-radius:2px}.banner{border-radius:12px;padding:12px 14px;font-size:14px;margin:0 0 16px}.banner.error,.alert-error{background:var(--red-bg);color:var(--red)}.banner.success,.alert-success{background:var(--green-bg);color:var(--green)}.success-check{width:64px;height:64px;border-radius:999px;background:var(--green-bg);color:var(--green);display:flex;align-items:center;justify-content:center;font-size:32px;margin:12px auto 6px}.success-title{text-align:center;font-size:20px;font-weight:700;color:var(--ink);margin:0}.success-sub{text-align:center;color:var(--ink-muted);font-size:13px;margin:6px 0 0}.qr-card{border:1px solid var(--line);border-radius:14px;padding:14px;text-align:center}.qr-card img.qr{width:150px;height:150px;image-rendering:pixelated}.qr-card .qr-name{font-weight:700;font-size:15px;margin:8px 0 2px}.qr-card .qr-meta{font-size:12px;color:var(--ink-muted);margin:0 0 10px}.page-checkin{padding-top:16px}.event-heading-sm{font-size:19px;letter-spacing:.01em}.sub-label{font-size:13px;color:var(--ink-muted);margin:6px 0 16px}.link-button{background:none;border:none;padding:0;color:var(--blue-700);font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:2px}.checkin-scanner{padding:16px}.camera-wrap{position:relative;border-radius:14px;overflow:hidden;background:var(--surface-soft);border:1.5px dashed var(--line)}.camera-frame{width:100%;aspect-ratio:4 / 3;min-height:260px;background:#101318}.camera-frame video{width:100%;height:100%;object-fit:cover}.camera-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px;background:#f6f5f1f0;text-align:center}.scan-icon{width:74px;height:74px;border-radius:999px;border:3px solid var(--blue-700);color:var(--blue-700);display:flex;align-items:center;justify-content:center;font-size:40px;line-height:1;margin-bottom:16px}.visit-detail{margin-top:16px}.visit-name{margin:0;font-size:22px;font-weight:700;color:var(--blue-700)}.visit-expired-title{margin:0 0 8px;font-size:18px;font-weight:700;color:var(--red)}.visitor-name-lg{margin:12px 0 0;font-size:26px;font-weight:700;color:var(--ink)}.attendance-success{margin-top:16px;padding:32px 18px}.success-check.ok{background:var(--green-bg);color:var(--green);width:72px;height:72px;font-size:38px}.btn-mark{box-shadow:0 6px 18px #fca70059;font-size:17px;padding:16px 18px}.scan-box{border:1.5px dashed var(--line);border-radius:12px;padding:20px 12px;text-align:center;background:var(--surface-soft);min-height:96px}.scan-token-input{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.detail-label{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-muted);font-weight:600;margin-bottom:2px}.detail-value{font-size:14px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}.pill{display:inline-flex;align-items:center;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;white-space:nowrap}.pill-green{background:var(--green-bg);color:#0a7039}.pill-red{background:var(--red-bg);color:var(--red)}.pill-grey{background:var(--surface-soft);color:var(--ink-muted)}.muted{color:var(--ink-muted)}.text-center{text-align:center}.footer-note{text-align:center;font-size:12px;color:var(--ink-muted);margin-top:26px}@media(min-width:640px){.page{padding-top:36px}.logo{width:160px;height:75px}.event-heading{font-size:26px}.visitor-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}}@media(max-width:480px){.topbar{gap:4px;margin:2px 0 14px}.logo{width:96px;height:44px}.event-heading{font-size:16px;line-height:1.2}.event-sub{font-size:10px;letter-spacing:.16em}}