*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{height:100%}.live-clock-container{display:flex;flex-direction:column;align-items:center}.live-clock-time-row{display:flex;align-items:center;gap:8px;background:#1e293b;border-radius:10px;padding:10px 14px}.live-clock-indicator{display:flex;align-items:center;gap:6px}.live-clock-dot{width:8px;height:8px;background:#22c55e;border-radius:50%;box-shadow:0 0 8px #22c55e;animation:pulse 1.5s ease-in-out infinite}.live-clock-label{color:#22c55e;font-size:10px;font-weight:600}.live-clock-time{font-family:SF Mono,Roboto Mono,monospace}.live-clock-time.shimmer{background:linear-gradient(90deg,#fff,#60a5fa,#fff);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 2s linear infinite}.live-clock-date{font-size:11px;text-align:center;margin-top:8px;opacity:.7}.action-button{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border:none;border-radius:10px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:transform .1s,opacity .2s;margin-bottom:8px}.action-button.full-width{width:100%}.action-button:active{transform:scale(.97)}.action-button:last-child{margin-bottom:0}.action-button.disabled{opacity:.5;cursor:not-allowed}.action-button.disabled:active{transform:none}.action-button-icon{display:flex;align-items:center;font-size:16px}.action-button-label{white-space:nowrap}.status-pill{padding:8px 12px;border-radius:8px;color:#fff;font-weight:700;text-align:center;display:inline-block}.photo-capture-overlay{position:fixed;inset:0;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;z-index:1000}.photo-capture-title{color:#fff;font-size:16px;font-weight:600;margin-bottom:16px}.photo-capture-frame{width:200px;height:200px;border-radius:12px;overflow:hidden;border:3px solid #fff;margin-bottom:20px}.photo-capture-frame video{width:100%;height:100%;object-fit:cover}.photo-capture-frame video.mirror{transform:scaleX(-1)}.photo-capture-actions{display:flex;gap:12px}.photo-capture-cancel,.photo-capture-capture{padding:12px 24px;border:none;border-radius:10px;color:#fff;font-size:14px;font-weight:600;cursor:pointer}.photo-capture-cancel{background:#64748b}.photo-capture-capture{background:#22c55e}.photo-capture-error{text-align:center;color:#fff}.photo-capture-error p{margin-bottom:16px}.photo-capture-error button{padding:12px 24px;background:#64748b;border:none;border-radius:10px;color:#fff;font-size:14px;font-weight:600;cursor:pointer}.lanyard-v-assembly{display:flex;flex-direction:column;align-items:center;width:340px;height:120px;margin-bottom:-1px;overflow:visible}.lanyard-v-svg{width:100%;height:100%;overflow:visible}.lanyard-assembly{display:flex;flex-direction:column;align-items:center}.lanyard-strap{width:28px;height:80px;background-size:100% 40px;border-radius:4px}.lanyard-clip{width:36px;height:18px;background:linear-gradient(180deg,#94a3b8,#64748b);border-radius:4px 4px 0 0;position:relative;display:flex;align-items:center;justify-content:center}.lanyard-clip:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:24px;height:10px;background:#64748b;border-radius:0 0 4px 4px}.lanyard-clip-hole{width:8px;height:8px;background:#475569;border-radius:50%}.lanyard-image{object-fit:contain;object-position:bottom}.live-indicator{display:flex;align-items:center;gap:6px}.live-indicator-dot{border-radius:50%}.live-indicator-dot.pulse{animation:pulse 1.5s ease-in-out infinite}.live-indicator-label{font-size:10px;font-weight:600;text-transform:uppercase}.badge-renderer{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;box-shadow:0 10px 40px #0000004d}.badge-pulse{animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.1)}}.badge-shimmer{background:linear-gradient(90deg,currentColor 0%,rgba(255,255,255,.8) 50%,currentColor 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:shimmer 3s linear infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.badge-renderer button{transition:transform .15s ease,filter .15s ease}.badge-renderer button:hover{filter:brightness(1.1)}.badge-renderer button:active{transform:scale(.98)}.loading-page{min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.loading-spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.2);border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-message{color:#94a3b8;font-size:14px}.error-page{min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;align-items:center;justify-content:center;padding:20px}.error-card{background:#0f172a;border-radius:16px;padding:40px;text-align:center;max-width:320px;box-shadow:0 10px 40px #0000004d;border:2px solid #ef4444}.error-icon{font-size:48px;margin-bottom:16px;color:#ef4444}.error-title{color:#fff;font-size:20px;font-weight:700;margin:0 0 12px}.error-message{color:#94a3b8;font-size:14px;margin:0;line-height:1.5}.error-retry{margin-top:24px;padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border:none;border-radius:10px;color:#fff;font-size:14px;font-weight:600;cursor:pointer}.error-retry:active{transform:scale(.97)}.signed-out-page{min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;align-items:center;justify-content:center;padding:20px}.signed-out-card{background:#0f172a;border-radius:16px;padding:40px;text-align:center;max-width:320px;box-shadow:0 10px 40px #0000004d;border:2px solid #22c55e}.signed-out-icon{font-size:28px;margin-bottom:16px;color:#22c55e}.signed-out-title{color:#fff;font-size:22px;font-weight:700;margin:0 0 12px}.signed-out-message{color:#94a3b8;font-size:14px;margin:0 0 20px;line-height:1.5}.signed-out-time{background:#22c55e33;border:1px solid #22c55e;border-radius:8px;padding:12px;color:#22c55e;font-size:14px;font-weight:600}.signed-out-note{color:#64748b;font-size:12px;margin:20px 0 0}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.visitor-badge-page{min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:60px 20px 20px;overflow:hidden;font-family:system-ui,-apple-system,sans-serif}.badge-container{perspective:1500px;width:340px;height:540px;margin-top:0;cursor:pointer}.badge-flipper{position:relative;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d}.badge-flipper.flipped{transform:rotateY(180deg)}.badge-front,.badge-back{position:absolute;width:340px;height:540px;backface-visibility:hidden;border-radius:20px;overflow:hidden}.badge-back{transform:rotateY(180deg)}.badge-header{background:linear-gradient(135deg,#1e40af,#3b82f6);padding:12px 16px;display:flex;align-items:center;justify-content:space-between}.badge-logo{width:44px;height:44px;border-radius:10px;object-fit:contain;background:#fff3}.badge-logo-placeholder{width:44px;height:44px;background:#fff3;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:8px;color:#fff;font-weight:700}.badge-header-text{text-align:right}.badge-type{font-size:12px;color:#fff;font-weight:700}.badge-org{font-size:9px;color:#ffffffb3}.badge-content{flex:1;background:#f8fafc;padding:16px;display:flex;flex-direction:column}.badge-photo{width:100px;height:100px;border-radius:12px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border:3px solid #e2e8f0;display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;overflow:hidden;margin:0 auto 12px}.badge-photo img{width:100%;height:100%;object-fit:cover}.badge-photo-icon{font-size:28px;color:#fff}.badge-photo-text{font-size:10px;color:#fff;margin-top:4px}.badge-name{text-align:center;color:#1e293b;font-size:22px;font-weight:800;line-height:1.2}.badge-company{text-align:center;color:#3b82f6;font-size:13px;margin-top:4px;font-weight:600}.badge-visiting{text-align:center;color:#64748b;font-size:11px;margin-top:2px}.badge-clock-container{background:#1e293b;border-radius:10px;padding:10px 14px;margin:12px 0}.badge-clock-row{display:flex;align-items:center;justify-content:space-between}.badge-live-indicator{display:flex;align-items:center;gap:6px;color:#22c55e;font-size:10px;font-weight:600}.badge-live-dot{width:8px;height:8px;background:#22c55e;border-radius:50%;box-shadow:0 0 8px #22c55e;animation:pulse 1.5s ease-in-out infinite}.badge-time{font-family:SF Mono,Roboto Mono,monospace;font-size:16px;font-weight:700;background:linear-gradient(90deg,#fff,#60a5fa,#fff);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 2s linear infinite}.badge-date{color:#64748b;font-size:11px;text-align:center;margin-bottom:12px}.badge-footer{display:flex;gap:10px;align-items:center;margin-top:auto}.badge-qr-wrap{background:#fff;border-radius:8px;padding:4px;border:1px solid #e2e8f0}.badge-footer-right{flex:1}.badge-id{font-family:monospace;font-size:10px;color:#64748b;margin-bottom:6px}.badge-back-header{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:14px}.badge-back-logo{width:40px;height:40px;border-radius:8px;object-fit:contain;background:#ffffff1a}.badge-back-logo-placeholder{width:40px;height:40px;background:#ffffff1a;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:8px;color:#fff;font-weight:700}.badge-back-name{color:#fff;font-size:14px;font-weight:700}.badge-back-org{color:#64748b;font-size:10px}.badge-section{margin-bottom:12px}.badge-section-title{color:#fff6;font-size:10px;font-weight:600;text-transform:uppercase;margin-bottom:8px}.badge-back-footer{text-align:center;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);margin-top:auto;color:#ffffff4d;font-size:10px}.badge-hint{color:#fff6;font-size:12px;text-align:center;margin-top:16px}