.echuku-scanner-page{background:linear-gradient(180deg,var(--echuku-theme-color-background),#fff);min-height:80vh;padding:clamp(28px,6vw,80px) 0}
.echuku-scanner-shell{max-width:860px}
.echuku-scanner-header{text-align:center;margin-bottom:28px}
.echuku-scanner-header h1{font-size:clamp(2rem,5vw,3.3rem)}
.echuku-scanner-card{background:rgba(255,255,255,.9);border:1px solid rgba(11,31,58,.1);border-radius:var(--echuku-theme-radius-lg);box-shadow:var(--echuku-theme-shadow);padding:clamp(16px,3vw,28px)}
.echuku-camera-stage{aspect-ratio:4/3;background:#071426;border-radius:20px;overflow:hidden;position:relative}
.echuku-camera-stage video{height:100%;object-fit:cover;width:100%}
.echuku-camera-placeholder{align-items:center;color:#fff;display:flex;flex-direction:column;inset:0;justify-content:center;padding:20px;position:absolute;text-align:center}
.echuku-scan-frame{border:3px solid rgba(255,255,255,.95);border-radius:18px;box-shadow:0 0 0 9999px rgba(2,8,20,.28);height:min(62vw,280px);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:min(62vw,280px)}
.echuku-scan-frame::before,.echuku-scan-frame::after{border-color:var(--echuku-theme-color-magenta);border-style:solid;content:"";height:42px;position:absolute;top:-3px;width:42px}
.echuku-scan-frame::before{border-width:5px 0 0 5px;border-radius:18px 0 0 0;left:-3px}
.echuku-scan-frame::after{border-width:5px 5px 0 0;border-radius:0 18px 0 0;right:-3px}
.echuku-scanner-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.echuku-manual-lookup{border-top:1px solid var(--echuku-theme-color-border);margin-top:22px;padding-top:22px}
.echuku-manual-lookup label{display:block;font-weight:750;margin-bottom:8px}
.echuku-inline-form{display:grid;gap:10px;grid-template-columns:1fr auto}
.echuku-scan-status{border-radius:12px;font-weight:700;margin-top:18px;min-height:0;padding:0;text-align:center}
.echuku-scan-status:not(:empty){background:#eef2f6;padding:14px}
.echuku-scan-status[data-state="success"]{background:#e9f7ed;color:#245f31}
.echuku-scan-status[data-state="error"]{background:#fff0f0;color:#8b1e1e}
.echuku-scan-status[data-state="loading"]{background:#eef3fb;color:var(--echuku-theme-color-navy)}
.echuku-verification-result,.echuku-attendance-result{background:#fff;border:1px solid var(--echuku-theme-color-border);border-radius:var(--echuku-theme-radius);box-shadow:var(--echuku-theme-shadow);margin-top:20px;padding:clamp(20px,4vw,34px)}
.echuku-verification-result[data-state="success"],.echuku-attendance-result[data-state="success"]{border-top:5px solid var(--echuku-theme-color-green)}
.echuku-verification-result[data-state="error"],.echuku-attendance-result[data-state="error"]{border-top:5px solid #b42318}
.echuku-result-photo{border:4px solid #fff;border-radius:50%;box-shadow:0 8px 30px rgba(11,31,58,.14);height:124px;margin:0 auto 20px;object-fit:cover;width:124px}
.echuku-result-details{display:grid;gap:0}
.echuku-result-row{border-bottom:1px solid var(--echuku-theme-color-border);display:grid;gap:10px;grid-template-columns:minmax(140px,.65fr) 1fr;padding:12px 0}
.echuku-result-row:last-child{border-bottom:0}
.echuku-result-row span{color:var(--echuku-theme-color-muted)}
.echuku-scanner-page-content{margin-top:24px}
@media (max-width:600px){.echuku-inline-form{grid-template-columns:1fr}.echuku-inline-form .echuku-button{width:100%}.echuku-result-row{grid-template-columns:1fr;gap:2px}.echuku-scanner-card{border-radius:18px}.echuku-camera-stage{border-radius:14px}}