:root { --brand: #1F7A5C; --brand-soft: #E8F5F0; --bg: #E8F5F0; }
.scan-box { position: relative; width: 100%; aspect-ratio: 1; border-radius: 18px; overflow: hidden; background: #0f2a22; margin-bottom: 12px; }
.scan-box video { width: 100%; height: 100%; object-fit: cover; }
.scan-box .frame { position: absolute; inset: 18%; border: 3px solid rgba(255,255,255,.85); border-radius: 18px; pointer-events: none; }
.scan-box .off { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #cfe9df; font-size: 14px; text-align: center; padding: 20px; }
.who { text-align: center; padding: 6px 0 14px; }
.who .nm { font-size: 22px; font-weight: 700; }
.who .meta { color: var(--muted); font-size: 13.5px; margin-top: 2px; }
.who .bal { font-size: 30px; font-weight: 700; color: var(--brand); margin-top: 8px; }
.result { text-align: center; padding: 10px 0; }
.result .big { font-size: 40px; font-weight: 700; color: var(--brand); }
.result .ok { font-size: 18px; font-weight: 600; margin-bottom: 4px; }
.manual { display: flex; gap: 8px; margin-top: 4px; }
.manual .input { flex: 1; }