@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#10263f;background:#f4f9ff;font-family:Sora,Avenir Next,sans-serif;font-weight:400;line-height:1.35}*{box-sizing:border-box}body{background:radial-gradient(circle at 16% -12%,#2b8fc93d,#0000 40%),radial-gradient(circle at 88% 5%,#194d9a26,#0000 38%),linear-gradient(#f6fbff 0%,#f3f7fb 100%);min-height:100vh;margin:0;overflow-x:hidden}#root{min-height:100vh}.dot{border-radius:50%;width:10px;height:10px;margin-right:.45rem;display:inline-block}.dot.online{background:#16c47f}.dot.offline{background:#f97316}.tabs{flex-wrap:wrap;gap:.5rem;display:flex}.tabs button{cursor:pointer;background:#fff;border:1px solid #cdd9e4;border-radius:999px;padding:.58rem .95rem;transition:all .18s}.tabs button.active{color:#113684;border-color:#1f49aa;font-weight:700;box-shadow:inset 0 0 0 1px #1f49aa}button.secondary{color:#0d3b66;background:#e9f0f7}.icon-button{cursor:pointer;border:none;border-radius:9px;justify-content:center;align-items:center;width:32px;min-width:32px;height:32px;padding:0;transition:filter .14s;display:inline-flex}.icon-button svg{fill:currentColor;width:15px;height:15px}.icon-button:hover{filter:brightness(.9)}.icon-button.active-icon{color:#fff;background:linear-gradient(105deg,#0c5168,#19499a)}.icon-text-btn{cursor:pointer;white-space:nowrap;border:none;border-radius:10px;align-items:center;gap:.34rem;padding:.48rem .78rem;font-size:.88rem;font-weight:700;line-height:1.2;transition:filter .15s,opacity .15s;display:inline-flex}.icon-text-btn svg{fill:currentColor;flex-shrink:0;width:15px;height:15px}.icon-text-btn:disabled{opacity:.45;cursor:not-allowed}.primary-btn{color:#fff;background:linear-gradient(105deg,#0c5168,#19499a)}.primary-btn:hover:not(:disabled){filter:brightness(1.08)}.secondary-btn{color:#0d3b66;background:#e9f0f7}.secondary-btn:hover:not(:disabled){filter:brightness(.95)}.danger-btn{color:#9f1239;background:#fef2f2}.danger-btn:hover:not(:disabled){filter:brightness(.95)}.report-card{background:#fff;border:1px solid #dbe5ef;border-radius:18px;padding:1rem;box-shadow:0 14px 30px #0a243f12}.panel-subtitle{color:#5b6f83;margin:.35rem 0 .7rem;font-size:.92rem}.checkbox-row{align-items:center;gap:.5rem;font-weight:600;display:flex!important}.form-actions{flex-wrap:wrap;gap:.5rem;display:flex}.empty{color:#3f3f46;margin:1rem 0}.kiosk{gap:1.1rem;width:min(1220px,100% - 2rem);margin:1.2rem auto 2.4rem;display:grid}.controls{gap:.5rem;display:grid}.controls input{background:#ffffffe6;border:1px solid #c8d6e4;border-radius:14px;padding:.95rem 1rem;font-size:1rem}.status-message{color:#2f3133;margin:0}.device-lock-screen h2{margin:0}.device-lock-screen p{margin:.5rem 0}.device-lock-meta{color:#4a6078;font-size:.9rem}.device-pairing-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;margin-top:.8rem;display:grid}.device-panel{background:#fcfeff;border:1px solid #deebf6;border-radius:12px;gap:.5rem;padding:.75rem;display:grid}.device-panel h3{margin:0}.device-panel p{color:#5f7488;margin:0;font-size:.9rem}.device-panel input,.device-panel textarea{width:100%;font:inherit;border:1px solid #cedbe7;border-radius:9px;padding:.58rem}@media (width<=840px){.device-pairing-columns{grid-template-columns:1fr}}.kiosk-header{color:#f8fbff;background:radial-gradient(circle at 84% 18%,#fff3,#0000 42%),linear-gradient(125deg,#0c5168 0%,#15327a 62%,#23295f 100%);border:1px solid #ffffff2e;border-radius:22px;grid-template-columns:2fr 1fr;gap:1rem;padding:1.3rem 1.35rem;display:grid;box-shadow:0 20px 40px #0b1b4645}.kiosk-header h1{color:#fff;letter-spacing:-.02em;margin:0;font-size:clamp(1.8rem,3vw,2.55rem)}.kiosk-device-pill{color:#e6f2ff;background:#0c1c4052;border:1px solid #e2eeff59;border-radius:999px;margin:.45rem 0 0;padding:.28rem .58rem;font-size:.82rem;display:inline-block}.kiosk-device-pill strong{color:#fff}.status-panel{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff26;border:1px solid #ffffff3d;border-radius:14px;place-self:start end;align-items:center;gap:.45rem;width:max-content;padding:.45rem .65rem;font-weight:600;display:flex}@media (width<=840px){.kiosk-header{grid-template-columns:1fr}.status-panel{justify-self:start}}.kiosk-top-attendees{background:linear-gradient(160deg,#fff 0%,#f4f9ff 100%);border:1px solid #d9e2ee;border-radius:16px;padding:.82rem .95rem;box-shadow:0 10px 24px #0b244214}.kiosk-top-attendees summary{cursor:pointer;color:#113764;font-size:1rem;font-weight:700;list-style:none}.kiosk-top-attendees summary::-webkit-details-marker{display:none}.kiosk-top-attendees summary:after{content:"Show";float:right;letter-spacing:.06em;text-transform:uppercase;color:#44607d;font-size:.76rem}.kiosk-top-attendees[open] summary:after{content:"Hide"}.kiosk-top-attendees-timer{color:#4f6277;margin:.35rem 0 0;font-size:.74rem}.kiosk-top-attendees-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:.75rem;display:grid}.kiosk-top-attendees-column{background:#fff;border:1px solid #d6e2f0;border-radius:12px;padding:.65rem}.kiosk-top-attendees-column h3{color:#153b69;margin:0 0 .45rem;font-size:.95rem}.kiosk-top-attendees-column ol{gap:.34rem;margin:0;padding-left:1.2rem;display:grid}.kiosk-top-attendees-column li{color:#25303c;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;font-size:.84rem;display:grid}.kiosk-top-name{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.kiosk-top-attendees-empty{color:#5a6773;margin:.55rem 0 0;font-size:.85rem}@media (width<=900px){.kiosk-top-attendees-grid{grid-template-columns:1fr}}.student-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.82rem;display:grid}.student-card{text-align:left;background:#fff;border:1px solid #dbe5ef;border-radius:16px;flex-direction:column;padding:.78rem;transition:transform .18s,box-shadow .18s;display:flex;box-shadow:0 12px 28px #0b264414}.student-card.checked-in{background:linear-gradient(165deg,#f1fff4 0%,#e4fbe7 100%);border-color:#8fd2a0;box-shadow:0 12px 26px #227a3d1f}.student-card:hover{transform:translateY(-2px);box-shadow:0 16px 30px #0b254521}.student-card-top{grid-template-columns:auto 1fr auto;align-items:start;gap:.58rem;display:grid}.student-card img{background:#edf2f7;border-radius:12px}.student-card h2{margin:0;font-size:1rem;line-height:1.2}.student-meta{color:#4b5563;margin:0;font-size:.8rem}.attendance-counters{flex-wrap:wrap;gap:.3rem;margin:.1rem 0;display:flex}.attendance-counter{color:#29425c;letter-spacing:.01em;background:#f4f8fb;border:1px solid #c8d6e5;border-radius:999px;align-items:center;padding:.08rem .4rem;font-size:.69rem;font-weight:700;line-height:1.45;display:inline-flex}.student-primary{gap:.15rem;min-width:0;display:grid}.student-meta-last,.student-meta-inline-counters{text-align:left;white-space:nowrap;text-overflow:ellipsis;width:100%;margin-top:.38rem;overflow:hidden}.student-card button{color:#fff;cursor:pointer;background:linear-gradient(105deg,#0c5168,#19499a);border:none;border-radius:10px;padding:.52rem .55rem;font-size:.84rem;font-weight:700;line-height:1}.student-card button:hover{filter:brightness(1.08)}.student-card button:disabled{cursor:not-allowed;filter:none;opacity:.9}.card-actions{gap:.34rem;display:flex}.compact-actions{flex-direction:column;align-items:stretch}.checked-in-action{border:1px solid #74b98a;color:#2f5f3f!important;background:#e7f8ec!important}.student-card button.secondary{color:#0d3b66;background:#e9f0f7}.admin-access-bar{flex-wrap:wrap;align-items:center;gap:.65rem;padding:.62rem 1rem;display:flex}.admin-access-label{color:#1e3a5f;white-space:nowrap;font-size:.9rem;font-weight:700}.admin-access-note{color:#b45309}.admin-access-form-inline{flex-wrap:wrap;flex:1;align-items:center;gap:.45rem;display:flex}.admin-access-form-inline input{border:1px solid #cedbe7;border-radius:9px;flex:1;min-width:0;padding:.4rem .65rem;font-size:.88rem}.admin-devices-grid{grid-template-columns:1.35fr 1fr;gap:1rem;display:grid}.admin-devices-grid h2{margin:0}.device-register-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-bottom:.8rem;display:grid}.device-register-form label{gap:.3rem;font-weight:600;display:grid}.device-register-form button{grid-column:1/-1;justify-self:start}.device-list,.token-list{gap:.65rem;display:grid}.device-row,.token-row{background:#fcfeff;border:1px solid #deebf6;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.6rem;padding:.62rem;display:flex}.device-row-meta p,.token-row p{color:#5f7488;margin:.2rem 0 0;font-size:.88rem}.device-row-actions{flex-wrap:wrap;gap:.4rem;display:flex}.pairing-token{word-break:break-all;margin-top:0}.device-panel-textarea{width:100%;font:inherit;border:1px solid #cedbe7;border-radius:9px;padding:.58rem}.pairing-qr{background:#fff;border:1px solid #deebf6;border-radius:12px;width:220px;max-width:100%;margin-top:.6rem;padding:.35rem}.event-filter-row{align-items:center;gap:.5rem;margin:.5rem 0 .75rem;display:flex}.event-filter-row select{background:#fff;border:1px solid #c9dff0;border-radius:6px;flex:1;padding:.35rem .5rem;font-size:.85rem}.event-list{flex-direction:column;gap:.35rem;max-height:320px;display:flex;overflow-y:auto}.event-row{background:#f7fafd;border-left:3px solid #c9dff0;border-radius:6px;align-items:center;gap:.6rem;padding:.4rem .6rem;font-size:.82rem;display:flex}.event-row.event-action-revoked,.event-row.event-action-token-revoked{background:#fff5f5;border-left-color:#e53e3e}.event-row.event-action-token-rotated{background:#fffaf0;border-left-color:#d69e2e}.event-row.event-action-activated{background:#f0fff4;border-left-color:#38a169}.event-row.event-action-deactivated{background:#f7fafc;border-left-color:#718096}.event-action-badge{text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;font-size:.78rem;font-weight:600}.event-meta{color:#4a6785;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:.8rem;overflow:hidden}@media (width<=840px){.admin-devices-grid,.device-register-form{grid-template-columns:1fr}}.admin-reports-section{gap:1rem;display:grid}.report-filter-row{flex-wrap:wrap;align-items:flex-start;gap:.9rem;display:flex}.report-filter-row h2{white-space:nowrap;align-self:center;margin:0}.report-filter-row .report-filter-form{flex:1;margin-bottom:0}.report-filter-actions{align-items:flex-end;gap:.4rem;display:flex}.report-filters{background:radial-gradient(circle at 80% 14%,#9dddff59,#0000 40%),linear-gradient(135deg,#f0f8ff 0%,#f5faff 45%,#fdfcff 100%)}.report-filter-form{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.65rem;margin-bottom:.65rem;display:grid}.report-filter-form label{gap:.35rem;font-weight:600;display:grid}.report-filter-form input{border:1px solid #ccdae8;border-radius:11px;padding:.65rem}.report-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.kpi-card{background:linear-gradient(160deg,#fff 0%,#f6fbff 100%)}.kpi-label{text-transform:uppercase;letter-spacing:.1em;color:#3f5f7d;margin:0;font-size:.76rem;font-weight:700}.metric{letter-spacing:-.02em;color:#122d77;margin:.36rem 0;font-size:clamp(2rem,3vw,2.35rem);font-weight:800}.sparkline-card{background:linear-gradient(170deg,#fff 0%,#f6fbff 100%);min-width:0}.sparkline-head{justify-content:space-between;align-items:baseline;gap:.6rem;display:flex}.sparkline-head h2{margin:0}.sparkline-max{color:#48617a;font-size:.88rem;font-weight:600}.sparkline-wrap{background:linear-gradient(#f6faff 0%,#eef4fb 100%);border:1px solid #dbe6f2;border-radius:12px;height:220px;margin-top:.7rem;padding:.6rem;position:relative;overflow:auto hidden}.trend-scroll{width:100%}.trend-bars{min-width:max(100%, max-content);align-items:flex-end;gap:10px;width:max-content;height:100%;display:flex}.trend-bar-item{flex:none;grid-template-rows:auto 1fr auto;align-items:end;gap:.35rem;width:34px;display:grid}.trend-bar-track{justify-content:center;align-items:flex-end;height:150px;display:flex}.trend-bar-value{text-align:center;color:#395267;font-size:.76rem;font-weight:700;line-height:1}.trend-bar-value.active{color:#102d58}.trend-bar{cursor:pointer;background:linear-gradient(#2a75c8 0%,#2353a6 100%);border:1px solid #0000;border-radius:4px 4px 2px 2px;flex:none;width:18px;min-height:6px;padding:0}.trend-bar:hover{filter:brightness(1.06)}.trend-bar:focus-visible{outline:none}.trend-bar.active{border-color:#102d58;box-shadow:0 0 0 1px #102d5829}.trend-bar-date{text-align:center;color:#60768c;white-space:nowrap;opacity:0;min-height:1.1em;font-size:.7rem;transition:opacity .14s}.trend-bar-date.visible{opacity:1}.trend-active-day{text-align:center;color:#213f62;min-height:1.2rem;margin:.5rem 0 0;font-size:.84rem;font-weight:600}.report-panels{grid-template-columns:1.15fr 1fr;gap:1rem;min-width:0;display:grid}.panel-card h2{margin:0}.analytics-list,.alerts-list{gap:.65rem;margin:0;padding:0;list-style:none;display:grid}.analytics-list li,.alerts-list li{background:#fcfeff;border:1px solid #deebf6;border-radius:12px;padding:.62rem .72rem}.analytics-row{justify-content:space-between;align-items:center;gap:.65rem;display:flex}.bar-track{background:#e7eff8;border-radius:999px;width:100%;height:8px;margin-top:.45rem;overflow:hidden}.bar-fill{background:linear-gradient(95deg,#1586a3 0%,#2557b0 100%);border-radius:999px;min-width:8px;height:100%;display:block}.alerts-list p{color:#5f7488;margin:.32rem 0 0;font-size:.9rem}.alert-value{color:#b33c2d}@media (width<=840px){.report-kpis,.report-panels{grid-template-columns:1fr}}.attendance-mini-cal{gap:.35rem;display:grid}.attendance-cal-label{color:#4b6a8a;margin:0 0 .3rem;font-size:.8rem}.attendance-cal-grid{grid-template-columns:repeat(6,1fr);gap:4px;display:grid}.cal-dot{color:#4a6080;letter-spacing:.01em;-webkit-user-select:none;user-select:none;background:#dde8f5;border-radius:4px;justify-content:center;align-items:center;width:100%;padding:4px 2px;font-size:.68rem;font-weight:600;display:flex}.cal-dot.present{color:#fff;background:#22c55e}.admin-form,.admin-list{background:#fff;border:1px solid #dbe5ef;border-radius:18px;padding:1rem;box-shadow:0 14px 30px #0a243f12}.admin-form{gap:.65rem;display:grid}.admin-form-inline{grid-column:1/-1}.admin-form-title{text-transform:uppercase;letter-spacing:.08em;color:#3f5f7d;margin:0 0 .35rem;font-size:.82rem;font-weight:700}.admin-form-fields{flex-wrap:wrap;align-items:flex-end;gap:.65rem;margin-top:.5rem;display:flex}.admin-form-fields label{flex:140px;gap:.3rem;font-size:.88rem;font-weight:600;display:grid}.admin-form input,.admin-form select{border:1px solid #cedbe7;border-radius:11px;padding:.65rem}.admin-form-fields .checkbox-row{flex:none;align-self:flex-end;padding-bottom:.55rem}.admin-form-fields .form-actions{flex:none;align-self:flex-end}.admin-list-header{flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.5rem;display:flex}.admin-list-header h2{white-space:nowrap;margin:0}.admin-student-search{border:1px solid #cedbe7;border-radius:9px;flex:1;min-width:120px;padding:.38rem .65rem;font-size:.88rem}.admin-list-item{border-bottom:1px dashed #d6e0ea;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem 0;display:flex}.admin-list-item p,.admin-list-info p{margin-top:.2rem}.admin-list-info{flex:1;min-width:0}.admin-attendance-counters{flex-wrap:wrap;gap:.28rem;margin-top:.28rem;display:flex}.admin-attendance-counter{color:#29425c;letter-spacing:.01em;background:#f4f8fb;border:1px solid #c8d6e5;border-radius:999px;align-items:center;padding:.08rem .42rem;font-size:.68rem;font-weight:700;line-height:1.45;display:inline-flex}.admin-list-actions{flex-shrink:0;align-items:center;gap:.28rem;display:flex}.student-attendance-panel{border-top:1px solid #e5edf5;width:100%;margin-top:.35rem;padding:.6rem 0 .15rem}.admin-sync-row{flex-wrap:wrap;align-items:center;gap:.65rem;padding:.62rem 1rem;display:flex}.sync-status-pill{align-items:center;font-size:.9rem;font-weight:700;display:flex}.sync-stat{color:#374151;white-space:nowrap;font-size:.87rem}.sync-stat-grow{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.admin-sub-tabs{border-bottom:2px solid #d6e4f0;padding-bottom:0}.admin-sub-tabs button{border-bottom:none;border-radius:10px 10px 0 0}.admin-sub-tabs button.active{background:#f0f7ff;border-color:#1f49aa #1f49aa #f0f7ff;border-bottom-style:solid;border-bottom-width:2px;margin-bottom:-2px}
