/* AntTechHR Attendance Scanner — responsive vanilla CSS */
:root{--blue:#2563eb;--blue-dark:#1d4ed8;--blue-soft:#eff6ff;--navy:#10233f;--ink:#172b4d;--muted:#718096;--line:#e5ebf4;--surface:#fff;--bg:#f5f8fd;--green:#10a66a;--green-soft:#e9fbf3;--purple:#7957e8;--purple-soft:#f2edff;--radius:18px;--shadow:0 12px 35px rgba(30,64,120,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:14px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.hidden{display:none!important}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,#60a5fa,#2563eb);color:#fff;font-weight:800;font-size:26px;font-style:italic;box-shadow:0 7px 16px #2563eb30}.brand strong{display:block;font-size:19px;letter-spacing:-.7px}.brand strong span{color:var(--blue)}.brand small{display:block;margin-top:3px;font-size:9px;letter-spacing:1.4px;color:#8b9ab1;font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;border-radius:10px;padding:11px 15px;font-weight:700;font-size:12px;transition:transform .18s,box-shadow .18s,background .18s}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,#3985ff,#225be8);color:white;box-shadow:0 6px 15px #2563eb26}.btn-green{background:var(--green);color:#fff}.btn-purple{background:var(--purple);color:#fff}.btn-outline{background:#fff;border-color:#dbe4f0;color:#536782}.btn-outline:hover{border-color:#9db9f2;background:#f8fbff}.btn-soft{background:#edf4ff;color:#245edb}.btn-danger{background:#dc3545;color:#fff}.btn-danger-outline{border-color:#f1c7cc;color:#c92a3a;background:#fff}.btn-full{width:100%}.btn-small{padding:9px 12px;font-size:11px}.eyebrow,.mini-label{font-size:10px;font-weight:800;letter-spacing:1.5px}.blue-eyebrow{color:var(--blue)}.pulse-dot{display:inline-block;width:7px;height:7px;background:#49d69c;border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px #49d69c22}.toast{position:fixed;top:20px;right:20px;z-index:1000;max-width:min(380px,calc(100vw - 32px));padding:14px 18px;border-radius:12px;background:#10233f;color:white;box-shadow:0 12px 35px #10233f35;opacity:0;transform:translateY(-10px);pointer-events:none;transition:.25s;font-size:13px}.toast.show{opacity:1;transform:translateY(0)}.toast.error{background:#b42332}.toast.success{background:#087c53}
/* Login */
.login-layout{min-height:100vh;display:grid;grid-template-columns:minmax(360px,1fr) minmax(440px,1fr);background:#fff}.login-hero{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:42px clamp(28px,6vw,94px);background:radial-gradient(ellipse at 0% 100%,#bfdbfe 0,transparent 48%),linear-gradient(145deg,#f0f7ff,#e7f1ff 75%,#dceaff)}.brand-large{position:relative;z-index:2}.brand-large .brand-mark{width:48px;height:48px;font-size:30px}.brand-large strong{font-size:23px}.brand-large small{font-size:10px}.hero-copy{position:relative;z-index:2;max-width:470px;margin:auto 0;padding:60px 0}.hero-copy .eyebrow{color:#2b67c9}.hero-copy h1{font-size:clamp(38px,4vw,57px);line-height:1.13;letter-spacing:-2.5px;margin:22px 0 18px;color:#14294a}.hero-copy h1 span{color:#2c6ee9}.hero-copy>p{font-size:15px;line-height:1.8;color:#667a97;max-width:410px}.hero-features{display:grid;gap:22px;margin-top:38px}.feature{display:flex;align-items:center;gap:14px}.feature-icon{width:42px;height:42px;border-radius:14px;background:#fff;color:var(--blue);display:grid;place-items:center;font-size:20px;box-shadow:0 8px 22px #2563eb12}.feature b,.feature small{display:block}.feature b{font-size:12px}.feature small{font-size:11px;color:#7a8ba5;margin-top:4px}.hero-footer{position:relative;z-index:2;font-size:10px;color:#8498b5}.hero-decoration{position:absolute;border:1px solid #fff9;border-radius:50%;pointer-events:none}.decoration-one{width:340px;height:340px;right:-150px;bottom:-100px;box-shadow:0 0 0 35px #fff2,0 0 0 70px #fff1}.decoration-two{width:140px;height:140px;right:12%;top:19%;background:#fff2}.login-side{display:grid;place-items:center;padding:40px}.login-card{width:min(100%,410px);padding:clamp(25px,4vw,44px);border:1px solid #edf1f7;border-radius:22px;background:#fff;box-shadow:0 20px 65px #183b7210}.mobile-brand{display:none}.login-heading{margin-bottom:29px}.login-heading .mini-label{color:var(--blue)}.login-heading h2{font-size:27px;letter-spacing:-1px;margin:12px 0 8px}.login-heading p{color:var(--muted);font-size:12px;line-height:1.6;margin:0}.login-card>label{display:block;font-size:11px;font-weight:700;margin:17px 0 8px}.input-wrap{display:flex;align-items:center;gap:10px;min-height:47px;border:1px solid #dfe7f2;border-radius:10px;padding:0 12px;transition:.2s}.input-wrap:focus-within{border-color:#76a4ff;box-shadow:0 0 0 3px #2563eb12}.input-icon{color:#7f91ac;font-size:17px}.input-wrap input{width:100%;min-width:0;border:0;outline:0;color:var(--ink);font-size:12px;background:transparent}.input-wrap input::placeholder{color:#a1aec1}.reveal-btn{border:0;background:transparent;color:#7c8ca4;padding:5px}.login-options{display:flex;justify-content:space-between;align-items:center;margin:17px 0 24px;font-size:10px}.check-label{display:flex;align-items:center;gap:7px;color:#61738d;cursor:pointer}.check-label input{accent-color:var(--blue)}.text-button{border:0;background:none;color:var(--blue);font-size:10px;font-weight:700}.login-card .btn-primary{min-height:47px}.demo-note{display:flex;gap:8px;align-items:flex-start;padding:11px;margin-top:17px;background:#f2f7ff;border-radius:9px;color:#6e809b;font-size:10px;line-height:1.5}.demo-note span{color:var(--blue)}.login-legal{text-align:center;font-size:9px;line-height:1.8;color:#9aa8bb;margin:35px 0 0}
/* App shell */
.app-shell{min-height:100vh}.sidebar{position:fixed;z-index:50;inset:0 auto 0 0;width:250px;display:flex;flex-direction:column;padding:25px 16px 17px;background:linear-gradient(180deg,#142a49,#102139);color:#d8e4f6}.sidebar-brand{padding:0 8px 31px;color:#fff}.sidebar-brand .brand-mark{width:37px;height:37px;border-radius:11px;font-size:22px}.sidebar-brand strong{font-size:17px;color:#fff}.sidebar-brand strong span{color:#79aaff}.sidebar-brand small{font-size:8px;color:#8ca4c5;letter-spacing:1.3px}.nav-caption{padding:0 12px 12px;color:#7890b0;font-size:9px;font-weight:800;letter-spacing:1.5px}.side-nav{display:flex;flex-direction:column;gap:5px}.nav-link{display:flex;align-items:center;gap:13px;width:100%;padding:12px;border:0;border-radius:10px;background:transparent;color:#b5c5da;text-align:left;font-size:11px;font-weight:600;transition:.2s}.nav-link:hover{background:#ffffff0c;color:white}.nav-link.active{background:linear-gradient(100deg,#2d75f5,#245bd2);color:#fff;box-shadow:0 6px 15px #07172a35}.nav-icon{width:19px;text-align:center;font-size:17px}.nav-tag{margin-left:auto;background:#ffffff25;border-radius:5px;padding:3px 5px;font-size:8px}.nav-caption-spaced{padding-top:27px}.sidebar-bottom{margin-top:auto}.sidebar-help{display:flex;align-items:center;gap:9px;padding:12px 10px;margin-bottom:17px;border:1px solid #ffffff12;border-radius:12px;background:#ffffff08}.help-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#ffffff14;color:#b8d2ff;font-weight:800}.sidebar-help b,.sidebar-help small{display:block}.sidebar-help b{font-size:10px;color:#eef4ff}.sidebar-help small{font-size:9px;color:#8ca2c1;margin-top:4px}.sidebar-help>span{margin-left:auto;color:#8ca2c1}.user-mini{display:flex;align-items:center;gap:9px;padding:15px 4px 0;border-top:1px solid #ffffff14}.avatar{flex-shrink:0;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#c7ddff,#7baaff);color:#17499c;font-size:11px;font-weight:800}.user-mini-text{min-width:0;flex:1}.user-mini-text b,.user-mini-text small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-mini-text b{font-size:10px;color:#fff}.user-mini-text small{font-size:9px;color:#8da4c4;margin-top:4px}.logout-icon{border:0;background:transparent;color:#a9bad3;font-size:20px}.main-column{min-height:100vh;margin-left:250px}.topbar{height:72px;position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,3vw,43px);background:#ffffffed;backdrop-filter:blur(12px);border-bottom:1px solid #e9eef5}.breadcrumbs{display:flex;align-items:center;gap:11px;font-size:11px}.breadcrumbs span{color:#91a0b6}.breadcrumbs b{color:#c1cbd9;font-weight:400}.breadcrumbs strong{color:#344762}.topbar-right{display:flex;align-items:center;gap:24px}.today-date{font-size:10px;color:#77879f}.icon-btn{position:relative;width:34px;height:34px;border:1px solid #e6edf6;border-radius:10px;background:#fff;color:#63748e;font-size:16px}.notification-btn i{position:absolute;right:7px;top:6px;width:5px;height:5px;border-radius:50%;background:#3478f6}.top-user{display:flex;align-items:center;gap:9px}.avatar-small{width:34px;height:34px;font-size:10px}.top-user b,.top-user small{display:block}.top-user b{font-size:10px}.top-user small{font-size:9px;color:#8a9ab0;margin-top:4px}.chevron{color:#8292a9;margin-left:3px}.menu-toggle{display:none}.page-content{max-width:1500px;margin:0 auto;padding:34px clamp(20px,3vw,43px) 22px}.page{display:none;animation:pageIn .24s ease}.page.active{display:block}@keyframes pageIn{from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none}}.welcome-row,.page-title-row{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.welcome-row h1,.page-title-row h1{margin:10px 0 8px;font-size:clamp(25px,2.4vw,31px);letter-spacing:-1.1px;color:#182d4c}.welcome-row p,.page-title-row p{margin:0;color:#8492a7;font-size:12px}.wave{color:#f5b83c;font-size:21px}.date-pill{display:flex;align-items:center;gap:11px;padding:11px 15px;border:1px solid #e5ebf4;border-radius:12px;background:#fff}.date-pill>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#edf4ff;color:var(--blue);font-size:18px}.date-pill small,.date-pill b{display:block}.date-pill small{font-size:8px;color:#92a0b3;font-weight:800;letter-spacing:1px}.date-pill b{margin-top:5px;font-size:11px}.status-banner{display:flex;align-items:center;gap:13px;padding:17px 20px;margin-bottom:28px;border:1px solid #dbeafe;border-radius:14px;background:linear-gradient(100deg,#edf5ff,#f7faff)}.status-symbol{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:12px;background:#dbeafe;color:#2563eb;font-size:19px;font-weight:800}.status-banner>div:nth-child(2){flex:1}.status-banner b{font-size:12px}.status-banner p{margin:5px 0 0;font-size:10px;color:#7d8da4}.status-pill{white-space:nowrap;border-radius:20px;padding:7px 10px;background:#fff;border:1px solid #dce7f7;color:#6480a4;font-size:9px;font-weight:700}.status-banner.is-checked-in{border-color:#b9f0d7;background:#effcf6}.status-banner.is-checked-in .status-symbol{background:#d7f8e8;color:#07945b}.status-banner.is-checked-out{border-color:#d7cdfd;background:#f7f4ff}.status-banner.is-checked-out .status-symbol{background:#e9e1ff;color:#7450d9}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.section-heading h2{font-size:15px;letter-spacing:-.3px;margin:0 0 6px}.section-heading p{font-size:10px;color:#8795a9;margin:0}.live-indicator{display:flex;align-items:center;gap:7px;font-size:10px;color:#7b8ca4}.live-indicator i{width:6px;height:6px;background:#21bd7a;border-radius:50%;box-shadow:0 0 0 4px #21bd7a18}.action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.action-card{min-width:0;padding:21px;border:1px solid #e5ebf4;border-radius:16px;background:#fff;box-shadow:0 5px 20px #1c3d6b04}.action-card-top{display:flex;align-items:center;justify-content:space-between}.action-icon,.summary-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;font-size:21px;font-weight:700}.green-icon{background:var(--green-soft);color:var(--green)}.purple-icon{background:var(--purple-soft);color:var(--purple)}.blue-icon{background:var(--blue-soft);color:var(--blue)}.action-state{padding:6px 9px;border-radius:20px;background:#f5f7fb;color:#8a98ab;font-size:9px;font-weight:700}.action-card h3{font-size:16px;margin:17px 0 6px}.action-card>p{font-size:11px;color:#8492a7;margin:0 0 24px}.action-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding-top:15px;border-top:1px solid #eff2f7}.action-bottom small,.action-bottom b{display:block}.action-bottom small{font-size:8px;letter-spacing:.8px;color:#9aa7b9;font-weight:700}.action-bottom b{font-size:17px;margin-top:6px}.action-bottom .btn{font-size:10px;padding:10px 12px}.history-heading{margin-top:31px}.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.summary-card{display:flex;align-items:center;gap:13px;padding:17px;border:1px solid #e5ebf4;border-radius:14px;background:#fff}.summary-icon{width:39px;height:39px;flex-shrink:0}.summary-card small,.summary-card b,.summary-card span{display:block}.summary-card small{font-size:10px;color:#8291a7}.summary-card b{font-size:16px;margin:6px 0}.summary-card span{font-size:9px;color:#9aa7b8}.bottom-note{display:flex;gap:10px;align-items:flex-start;padding:13px 15px;margin-top:20px;border:1px solid #e2ebfa;border-radius:12px;background:#f0f6ff;color:#7186a4}.bottom-note>span{color:#3478ed;font-size:15px}.bottom-note p{margin:0;font-size:10px;line-height:1.7}.bottom-note b{color:#4d6485}.bottom-note code{font-size:10px;background:#e0ebfc;padding:2px 4px;border-radius:4px}.app-footer{display:flex;justify-content:space-between;gap:15px;padding-top:25px;margin-top:27px;border-top:1px solid #e7edf5;color:#98a5b7;font-size:9px}.app-footer i{display:inline-block;width:3px;height:3px;background:#b4c0d0;border-radius:50%;vertical-align:middle;margin:0 6px}
/* Scanner */
.scanner-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(240px,.8fr);align-items:start;gap:18px}.scanner-card,.scan-info-card,.table-card,.profile-card,.settings-card{border:1px solid #e5ebf4;border-radius:16px;background:#fff;box-shadow:0 5px 22px #1c3d6b04}.scanner-card{padding:22px}.scanner-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}.scanner-card-head h2{font-size:16px;margin:0 0 7px}.scanner-card-head p{font-size:11px;color:#8795a9;margin:0}.secure-label{white-space:nowrap;border-radius:20px;background:#eefaf4;color:#169760;padding:7px 10px;font-size:9px;font-weight:700}.secure-label span{font-size:7px;margin-right:4px}.scanner-stage{overflow:hidden;position:relative;min-height:310px;border-radius:15px;background:#101923}.reader{width:100%;min-height:310px;position:relative}.reader video{width:100%!important;height:310px!important;object-fit:cover!important;border-radius:14px}.reader img{max-width:100%}.reader #qr-shaded-region{border-color:#4f9aff!important}.reader__scan_region{min-height:280px!important}.reader__dashboard{padding:10px!important;color:#dbeafe!important;font-size:12px!important}.reader__dashboard button{padding:8px 12px;border:0;border-radius:8px;background:#2e72ee;color:#fff}.reader__dashboard select{padding:7px;border-radius:7px}.scanner-placeholder{min-height:310px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#c5d4e8;text-align:center;position:relative}.camera-glyph{display:grid;place-items:center;width:52px;height:52px;border:1px solid #ffffff28;border-radius:16px;background:#ffffff0b;color:#7cb5ff;font-size:25px;margin-bottom:5px}.scanner-placeholder b{font-size:13px}.scanner-placeholder>span{font-size:10px;color:#8da0b8}.scan-frame{position:absolute;width:170px;height:170px;opacity:.65;pointer-events:none}.scan-frame i{position:absolute;width:26px;height:26px;border-color:#59a6ff;border-style:solid}.scan-frame i:nth-child(1){top:0;left:0;border-width:3px 0 0 3px;border-radius:8px 0 0}.scan-frame i:nth-child(2){top:0;right:0;border-width:3px 3px 0 0;border-radius:0 8px 0 0}.scan-frame i:nth-child(3){bottom:0;left:0;border-width:0 0 3px 3px;border-radius:0 0 0 8px}.scan-frame i:nth-child(4){bottom:0;right:0;border-width:0 3px 3px 0;border-radius:0 0 8px 0}.camera-status{display:flex;align-items:center;gap:11px;margin-top:15px;padding:12px;border:1px solid #eaf0f7;border-radius:11px;background:#fbfdff}.camera-status-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e6f7f5;color:#0a9c9a;font-size:18px}.camera-status>div{flex:1}.camera-status b,.camera-status small{display:block}.camera-status b{font-size:10px}.camera-status small{font-size:9px;color:#8796aa;margin-top:4px}.camera-status-dot{width:7px;height:7px;border-radius:50%;background:#b3bfce}.camera-status-dot.on{background:#14b879;box-shadow:0 0 0 4px #14b8791c}.scanner-controls{display:flex;gap:10px;margin-top:15px}.scanner-controls .btn{flex:1}.scanner-tip{display:flex;align-items:flex-start;gap:8px;margin-top:17px;color:#7d90ab}.scanner-tip>span{color:#3678eb}.scanner-tip p{font-size:10px;line-height:1.6;margin:0}.scan-info-card{padding:23px}.scan-info-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:15px;background:var(--green-soft);color:var(--green);font-size:23px;margin-bottom:19px}.scan-info-icon.checkout{background:var(--purple-soft);color:var(--purple)}.scan-info-card .mini-label{color:#8c9bb0;font-size:9px}.scan-info-card h2{font-size:21px;margin:8px 0}.scan-info-card>p{font-size:11px;line-height:1.7;color:#8190a5;margin:0}.info-divider{height:1px;background:#edf1f6;margin:22px 0 16px}.info-line{display:flex;justify-content:space-between;gap:12px;margin:14px 0;font-size:10px}.info-line span{color:#8795a9}.info-line b{text-align:right;font-size:10px}.scan-info-card>.btn{margin-top:18px}.scan-result{display:flex;align-items:flex-start;gap:10px;padding:12px;margin-top:15px;border-radius:11px;background:#eafbf3;color:#087b4c}.scan-result .result-check{display:grid;place-items:center;flex-shrink:0;width:25px;height:25px;border-radius:50%;background:#c9f5df;font-weight:800}.scan-result b{font-size:11px}.scan-result p{font-size:10px;line-height:1.5;margin:5px 0 0;color:#378466}
/* History/profile/settings */
.filter-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}.search-box{display:flex;align-items:center;gap:9px;width:min(100%,340px);padding:0 13px;height:41px;border:1px solid #e1e8f2;border-radius:10px;background:#fff;color:#8b9bb0}.search-box input{width:100%;border:0;outline:0;font-size:11px}.record-count{font-size:10px;color:#8492a7}.record-count b{color:#324865}.table-card{overflow:hidden}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{background:#f8faff;color:#8795aa;font-size:9px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:15px 18px;border-bottom:1px solid #e8edf5}td{padding:16px 18px;border-bottom:1px solid #eff2f7;font-size:11px;color:#536782}tbody tr:last-child td{border-bottom:0}.empty-state{text-align:center;padding:42px 18px;color:#8b9bb0;white-space:normal}.table-status{display:inline-block;padding:6px 9px;border-radius:20px;background:#e8fbf2;color:#0c9960;font-size:9px;font-weight:700}.table-status.partial{background:#fff5df;color:#aa7814}.profile-card{overflow:hidden;max-width:750px}.profile-cover{height:120px;background:linear-gradient(120deg,#2563eb,#65a8ff);position:relative;overflow:hidden}.profile-cover:after{content:"";position:absolute;width:300px;height:300px;border:1px solid #ffffff30;border-radius:50%;right:8%;top:-210px;box-shadow:0 0 0 30px #ffffff12,0 0 0 60px #ffffff0b}.profile-body{padding:0 27px 28px}.profile-avatar{width:70px;height:70px;border:5px solid #fff;margin-top:-35px;position:relative;font-size:17px}.profile-body h2{font-size:20px;margin:13px 0 5px}.profile-role{font-size:11px;color:#8594a9;margin:0}.profile-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;padding:23px 0;margin:24px 0;border-top:1px solid #edf1f6;border-bottom:1px solid #edf1f6}.profile-details small,.profile-details b{display:block}.profile-details small{font-size:8px;letter-spacing:.8px;color:#8d9bb0;font-weight:800}.profile-details b{font-size:11px;margin-top:9px;overflow-wrap:anywhere}.settings-card{padding:0 22px}.settings-row{display:flex;align-items:center;gap:14px;padding:21px 0;border-bottom:1px solid #edf1f6}.settings-row:last-child{border-bottom:0}.settings-row-icon{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border-radius:12px;background:#eff5ff;color:#3475e8;font-size:18px}.settings-row-copy{flex:1;min-width:130px}.settings-row-copy b,.settings-row-copy small{display:block}.settings-row-copy b{font-size:12px}.settings-row-copy small{font-size:10px;line-height:1.5;color:#8997aa;margin-top:5px}.setting-input{width:min(240px,35%);padding:10px 12px;border:1px solid #dfe7f2;border-radius:9px;outline:0;font-size:11px}.setting-input:focus{border-color:#76a4ff}.sidebar-scrim{display:none}.mobile-nav{display:none}.modal-backdrop{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:#10233f80;backdrop-filter:blur(4px)}.modal-card{width:min(100%,390px);padding:28px;border-radius:18px;background:#fff;text-align:center;box-shadow:0 20px 70px #07172a3b}.modal-symbol{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;margin:0 auto 14px;background:#fff3df;color:#bd8014;font-size:20px;font-weight:800}.modal-card h2{font-size:18px;margin:0 0 8px}.modal-card p{font-size:12px;line-height:1.6;color:#7d8ba0}.modal-actions{display:flex;justify-content:center;gap:10px;margin-top:22px}.modal-actions .btn{min-width:100px}
@media(min-width:1500px){.page-content{padding-top:42px}.action-card{padding:25px}.scanner-layout{grid-template-columns:minmax(0,1.8fr) minmax(270px,.7fr)}}
@media(max-width:1100px){.sidebar{width:220px}.main-column{margin-left:220px}.topbar{padding:0 22px}.page-content{padding:28px 22px}.today-date{display:none}.scanner-layout{grid-template-columns:1fr}.scan-info-card{display:grid;grid-template-columns:55px 1fr;column-gap:15px;align-items:center}.scan-info-icon{grid-row:span 3;margin:0}.scan-info-card .mini-label,.scan-info-card h2,.scan-info-card>p{grid-column:2}.scan-info-card h2{margin:4px 0}.scan-info-card>p{margin-bottom:5px}.scan-info-card .info-divider,.scan-info-card .info-line,.scan-info-card>.btn,.scan-result{grid-column:1/-1}.scan-info-card .info-divider{margin:15px 0}.scan-info-card>.btn{margin-top:12px}}
@media(max-width:760px){.login-layout{grid-template-columns:1fr;min-height:100dvh;background:linear-gradient(160deg,#edf5ff,#fff 45%)}.login-hero{display:none}.login-side{padding:22px;min-height:100dvh}.login-card{padding:27px 23px;border-radius:19px;box-shadow:0 14px 45px #183b7210}.mobile-brand{display:flex;margin-bottom:35px}.login-heading h2{font-size:25px}.login-legal{margin-top:26px}.sidebar{transform:translateX(-100%);transition:transform .25s ease;width:265px;box-shadow:15px 0 40px #07172a20}.sidebar.open{transform:translateX(0)}.sidebar-scrim.show{display:block;position:fixed;inset:0;z-index:40;background:#0a1c3580}.main-column{margin-left:0;padding-bottom:74px}.topbar{height:62px;padding:0 17px}.menu-toggle{display:grid;place-items:center;order:0}.breadcrumbs{margin-right:auto;margin-left:12px;gap:7px;font-size:10px}.topbar-right{gap:11px}.top-user>div:nth-child(2),.top-user .chevron{display:none}.notification-btn{display:none}.page-content{padding:25px 16px 20px}.welcome-row{align-items:flex-start}.welcome-row h1,.page-title-row h1{font-size:25px}.welcome-row p,.page-title-row p{font-size:11px;line-height:1.6}.date-pill{padding:8px}.date-pill>span{width:30px;height:30px}.date-pill b{font-size:9px}.status-banner{align-items:flex-start;padding:13px;gap:10px}.status-symbol{width:32px;height:32px;border-radius:10px}.status-banner b{font-size:11px}.status-banner p{font-size:9px;line-height:1.5}.status-pill{font-size:8px;padding:6px 7px}.section-heading h2{font-size:14px}.section-heading p{font-size:9px;line-height:1.5}.action-grid{gap:11px}.action-card{padding:14px;border-radius:14px}.action-icon{width:35px;height:35px;font-size:18px}.action-state{font-size:8px;padding:5px 6px}.action-card h3{font-size:14px;margin-top:13px}.action-card>p{font-size:10px;line-height:1.5;min-height:30px;margin-bottom:14px}.action-bottom{display:block}.action-bottom b{font-size:15px}.action-bottom .btn{width:100%;margin-top:13px;padding:10px 5px;font-size:9px;gap:5px}.summary-grid{grid-template-columns:1fr;gap:9px}.summary-card{padding:13px}.summary-card b{font-size:15px}.history-heading{margin-top:25px}.bottom-note{padding:11px;margin-top:15px}.bottom-note p{font-size:9px}.app-footer{font-size:8px}.page-title-row{align-items:flex-start}.page-title-row>.btn{flex-shrink:0;font-size:10px;padding:9px}.scanner-card{padding:15px}.scanner-card-head{margin-bottom:14px}.scanner-card-head h2{font-size:14px}.scanner-card-head p{font-size:10px;line-height:1.5}.secure-label{font-size:8px;padding:6px 7px}.scanner-stage,.reader,.scanner-placeholder{min-height:260px}.reader video{height:260px!important}.scan-frame{width:145px;height:145px}.scanner-controls{gap:8px}.scanner-controls .btn{font-size:10px;padding:11px 8px}.scan-info-card{padding:17px}.filter-row{align-items:flex-start}.search-box{height:38px}.table-card{border-radius:12px}.profile-details{grid-template-columns:1fr;gap:17px}.profile-details b{margin-top:6px}.settings-card{padding:0 15px}.settings-row{gap:10px;flex-wrap:wrap}.settings-row-icon{width:34px;height:34px}.settings-row-copy{flex:1}.setting-input{width:100%;margin-left:44px}.settings-row .btn{margin-left:44px}.mobile-nav{position:fixed;z-index:35;left:0;right:0;bottom:0;display:flex;justify-content:space-around;align-items:center;height:67px;padding:5px 7px calc(5px + env(safe-area-inset-bottom));border-top:1px solid #e6edf6;background:#ffffffed;backdrop-filter:blur(16px)}.mobile-nav-link{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;height:52px;border:0;border-radius:10px;background:transparent;color:#8b9bb0}.mobile-nav-link span{font-size:19px;line-height:1}.mobile-nav-link small{font-size:8px;font-weight:700}.mobile-nav-link.active{color:var(--blue);background:#eff5ff}.mobile-nav-link.active span{transform:translateY(-1px)}}
@media(max-width:390px){.page-content{padding-left:12px;padding-right:12px}.welcome-row h1{font-size:22px}.date-pill{gap:6px}.date-pill>span{display:none}.action-grid{grid-template-columns:1fr}.action-card>p{min-height:0}.action-bottom{display:flex}.action-bottom .btn{width:auto;margin-top:0;padding:9px}.status-banner{flex-wrap:wrap}.status-pill{margin-left:42px}.scanner-card-head{flex-direction:column}.profile-body{padding-left:18px;padding-right:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
