:root{--bg: #f5f6fb;--panel: #ffffff;--ink: #121735;--muted: #667085;--line: #e1e5f0;--brand: #2638d8;--brand-dark: #111749;--brand-2: #4458f0;--accent: #f7cf10;--accent-ink: #171203;--danger: #d92d20;--ok: #16875f;--shadow: 0 18px 50px rgba(17, 23, 73, .1)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,rgba(247,207,16,.2),transparent 28rem),radial-gradient(circle at 84% 12%,rgba(38,56,216,.14),transparent 28rem),linear-gradient(135deg,#fbfcff 0%,var(--bg) 55%,#eef1ff 100%);color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}.app-shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh;transition:grid-template-columns .22s ease}.app-shell.sidebar-collapsed{grid-template-columns:92px minmax(0,1fr)}.sidebar{display:flex;flex-direction:column;gap:28px;padding:28px;background:linear-gradient(180deg,#111749fa,#1e2b9ff5);border-right:1px solid rgba(247,207,16,.26);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);transition:padding .22s ease}.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{flex:0 0 auto;display:grid;place-items:center;width:50px;height:50px;border-radius:8px;background:#fff;border:1px solid rgba(247,207,16,.42);box-shadow:0 12px 30px #00000029}.brand-mark img{width:42px;height:42px;object-fit:contain}.brand strong,.brand span{display:block}.brand strong{color:#fff}.brand span{margin-top:3px;color:#ffffffad;font-size:13px}.brand-copy,.nav-item span,.scanner-link span{opacity:1;transition:opacity .16s ease,width .22s ease;white-space:nowrap}nav{display:grid;gap:10px}.nav-item,.scanner-link,.sidebar-toggle,.ghost-btn,.primary-btn,.secondary-btn,.icon-btn,.danger-btn,.confirm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:0;border-radius:8px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease;text-decoration:none}.sidebar-toggle{flex:0 0 auto;width:40px;padding:0;background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.18)}.nav-item{justify-content:flex-start;padding:0 14px;background:transparent;color:#ffffffb8;text-align:left;font-weight:700}.nav-item.active,.nav-item:hover{background:#f7cf1029;color:#fff}.nav-item.active{box-shadow:inset 3px 0 0 var(--accent)}.scanner-link{margin-top:auto;background:var(--accent);color:var(--accent-ink);font-weight:800}.sidebar-collapsed .sidebar{padding:24px 20px;align-items:center}.sidebar-collapsed .sidebar-head{display:grid;justify-items:center}.sidebar-collapsed .brand{justify-content:center}.sidebar-collapsed .brand-copy,.sidebar-collapsed .nav-item span,.sidebar-collapsed .scanner-link span{width:0;opacity:0;overflow:hidden}.sidebar-collapsed nav{width:100%}.sidebar-collapsed .nav-item,.sidebar-collapsed .scanner-link{width:52px;padding:0;justify-content:center}.sidebar-collapsed .scanner-link{margin-left:auto;margin-right:auto}main{padding:30px}.topbar,.section-heading,.toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px}.topbar{margin-bottom:22px}.eyebrow{margin:0 0 8px;color:var(--brand);font-weight:800;text-transform:uppercase;font-size:12px}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(28px,4vw,46px);letter-spacing:0}h2{margin-bottom:6px}.section-heading p{margin-bottom:0;color:var(--muted)}.top-actions,.modal-actions{display:flex;gap:10px;align-items:center}.primary-btn{padding:0 16px;background:var(--accent);color:var(--accent-ink);font-weight:800;box-shadow:0 12px 25px #f7cf103d}.secondary-btn{padding:0 14px;background:#edf0ff;color:var(--brand);font-weight:800}.ghost-btn{padding:0 14px;background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:700}.danger-btn{width:40px;padding:0;background:#fff0ee;color:var(--danger);font-weight:800}.primary-btn:hover,.secondary-btn:hover,.ghost-btn:hover,.danger-btn:hover,.scanner-link:hover,.confirm-btn:not(:disabled):hover{transform:translateY(-1px)}.primary-btn:disabled,.confirm-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.metrics article,.view,.modal-card,.list-card,.login-card{background:#ffffffe0;border:1px solid rgba(223,229,238,.85);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.metrics article{padding:18px;border-radius:8px}.metrics span{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:700}.metrics strong{display:block;margin-top:10px;font-size:34px}.view{position:relative;padding:22px;border-radius:8px}.toolbar{margin:22px 0 16px;justify-content:flex-start;flex-wrap:wrap}label{display:grid;gap:7px;color:var(--muted);font-size:13px;font-weight:700}.search-box{flex:1 1 300px}.input-icon{position:relative}.input-icon svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted)}.input-icon input{padding-left:38px;width:100%}input,select{height:44px;min-width:150px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);outline:none;padding:0 12px}input:focus,select:focus{border-color:var(--brand-2);box-shadow:0 0 0 4px #2638d824}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:930px}th,td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}th{color:var(--muted);font-size:12px;text-transform:uppercase}td{font-size:14px}small{color:var(--muted)}.status-pill,.badge{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:800}.status-pill.pending,.badge.pending{background:#fff6e6;color:#9a5a00}.status-pill.checked-in,.badge.checked-in{background:#e9f8f1;color:var(--ok)}.row-actions{display:flex;gap:8px;justify-content:flex-end}.row-actions button{width:36px;min-height:34px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--ink)}.inline-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:22px}.list-card{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px;border-radius:8px}.list-card small{display:block;margin-top:5px;color:var(--muted)}.refresh-chip{position:absolute;top:14px;right:16px;z-index:2;display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;border:1px solid rgba(247,207,16,.4);border-radius:999px;background:#fffffff0;color:var(--brand-dark);font-size:12px;font-weight:800;box-shadow:0 10px 24px #17203314;animation:softEnter .18s ease both}.soft-spinner{width:14px;height:14px;border:2px solid rgba(38,56,216,.18);border-top-color:var(--brand);border-radius:999px;animation:spin .8s linear infinite}.skeleton-row td,.skeleton-card{animation:softEnter .22s ease both}.skeleton-line,.skeleton-button{display:block;overflow:hidden;position:relative;border-radius:999px;background:#e8eef5}.skeleton-line{width:min(150px,100%);height:12px}.skeleton-line.wide{width:min(190px,100%)}.skeleton-line.short{width:76px;height:10px;margin-top:9px}.skeleton-line.title{width:150px;height:14px}.skeleton-button{width:38px;height:34px;border-radius:8px}.skeleton-line:after,.skeleton-button:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.76),transparent);animation:shimmer 1.25s ease-in-out infinite}.soft-empty{display:grid;place-items:center;gap:6px;min-height:150px;padding:24px;color:var(--muted);text-align:center;animation:softEnter .22s ease both}.soft-empty strong{color:var(--ink)}.soft-empty p{margin:0;max-width:340px}@keyframes shimmer{to{transform:translate(100%)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes softEnter{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:18px;background:#1720336b;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20}.modal-card{width:min(520px,calc(100vw - 28px));display:grid;gap:16px;padding:22px;border-radius:8px}.modal-wide{width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 40px);overflow:auto}.modal-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.modal-heading h2{margin:0}.icon-btn{width:38px;min-height:38px;background:#f1f4f9;color:var(--muted);font-weight:800}.form-note{min-height:22px;margin:0;color:var(--muted);font-size:13px}.form-note.warn{color:var(--danger);font-weight:800}.qr-card{justify-items:center;text-align:center}.qr-box{display:grid;place-items:center;width:282px;min-height:282px;border-radius:8px;background:#fff;border:1px solid var(--line)}.qr-box img{width:280px;height:280px}.download-link{width:100%}.checkbox-grid{display:grid;gap:8px;margin-top:10px;max-height:220px;overflow:auto;padding:8px;border:1px solid var(--line);border-radius:8px}.checkbox-item{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)}.checkbox-item input{width:auto;min-width:0;height:auto}.login-shell,.boot-screen{min-height:100vh;display:grid;place-items:center;padding:24px}.login-shell{position:relative;overflow:hidden;background:linear-gradient(115deg,#111749eb,#2638d8c7 48%,#111749b3),url(/brand/kaebauk-hero.png) center / cover no-repeat}.login-shell:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 16% 16%,rgba(247,207,16,.34),transparent 24rem),linear-gradient(90deg,#111749db,#11174957)}.login-shell:after{content:"";position:absolute;inset:auto -12% -35% 42%;height:58%;background:#f7cf102e;transform:rotate(-8deg);filter:blur(2px)}.login-stage{position:relative;z-index:1;display:grid;width:min(440px,100%)}.login-card{align-self:center;width:100%;display:grid;gap:15px;padding:30px;border-radius:8px;background:#ffffffeb;border:1px solid rgba(255,255,255,.72);box-shadow:0 30px 80px #03082247;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.login-card h1{font-size:42px}.login-card input{background:#fffffff0}.password-field{display:flex;align-items:center;width:100%;height:44px;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#fffffff0;transition:border-color .18s ease,box-shadow .18s ease}.password-field input{flex:1 1 auto;height:100%;min-width:0;border:0;border-radius:0;background:transparent;padding:0 12px;line-height:44px}.password-field input:focus{box-shadow:none}.password-field:focus-within{border-color:var(--brand-2);box-shadow:0 0 0 4px #2638d824}.password-field button{flex:0 0 38px;display:grid;place-items:center;width:38px;height:100%;border:0;border-radius:0;background:transparent;color:var(--muted)}.password-field button:hover{background:#edf0ff;color:var(--brand)}.login-card .primary-btn{min-height:48px;margin-top:4px}.login-brand{display:flex;align-items:center;gap:12px}.login-brand img{width:58px;height:58px;object-fit:contain;border-radius:8px;border:1px solid var(--line)}.login-brand .eyebrow{margin-bottom:4px}.login-brand strong{color:var(--ink)}.boot-card{position:relative;width:min(440px,100%);display:grid;justify-items:start;gap:12px;padding:30px;border-radius:8px;background:#ffffffeb;border:1px solid rgba(247,207,16,.26);box-shadow:var(--shadow)}.boot-card .refresh-chip{position:static;margin-top:8px}.module-loading{display:grid;gap:16px;min-height:180px;align-content:center}.module-loading .refresh-chip{top:18px}.subcopy{color:var(--muted);margin-bottom:0}.toast{position:fixed;right:22px;bottom:22px;max-width:min(420px,calc(100vw - 44px));padding:13px 15px;border-radius:8px;background:var(--brand-dark);color:#fff;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);transition:opacity .18s ease,transform .18s ease;pointer-events:none;z-index:30}.toast.show{opacity:1;transform:translateY(0)}.scanner-page{margin:-30px;min-height:100vh;background:radial-gradient(circle at 20% 10%,rgba(247,207,16,.24),transparent 26rem),linear-gradient(135deg,var(--brand-dark) 0%,#2537d2 42%,#f3f5fb 42.2%,#eef1ff 100%)}.scanner-mobile-top{display:none}.scanner-shell{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:22px;width:min(1180px,calc(100% - 36px));margin:0 auto;padding:28px 0}.scanner-panel,.result-panel{border:1px solid rgba(223,229,238,.86);border-radius:8px;background:#ffffffeb;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.scanner-panel{padding:24px}.result-panel{display:grid;gap:18px;padding:22px;align-content:start}.camera-card{position:relative;display:grid;place-items:center;min-height:min(50vh,480px);overflow:hidden;border-radius:8px;background:linear-gradient(135deg,#111749e6,#2638d8d6)}.camera-card video{width:100%;height:100%;min-height:min(50vh,480px);object-fit:cover}.scan-frame{position:absolute;z-index:2;display:grid;place-items:center;width:min(64vw,280px);aspect-ratio:1;border:2px solid rgba(247,207,16,.92);border-radius:8px;color:#ffffffb8;box-shadow:0 0 0 999px #030a125c;pointer-events:none}.scan-frame:after{content:"";position:absolute;left:16px;right:16px;top:18px;height:2px;background:var(--accent);box-shadow:0 0 18px #f7cf10e0;animation:scanline 2.2s ease-in-out infinite}.camera-state{position:absolute;z-index:3;bottom:16px;left:16px;right:16px;min-height:42px;display:grid;place-items:center;border-radius:8px;background:#ffffffe6;font-weight:800;text-align:center;padding:0 10px}.controls,.manual-form{display:flex;gap:10px;margin-top:14px}.manual-form{align-items:end}.confirm-btn{width:100%;background:var(--brand-dark);color:#fff;min-height:54px;font-weight:800}.status-header{display:flex;align-items:flex-start;gap:10px}.status-dot{width:12px;height:12px;margin-top:6px;border-radius:999px;background:var(--muted);box-shadow:0 0 0 6px #6b72801f}.status-dot.success{background:var(--ok);box-shadow:0 0 0 6px #16875f1f}.status-dot.warn{background:var(--accent);box-shadow:0 0 0 6px #ffb84c29}.status-dot.error{background:var(--danger);box-shadow:0 0 0 6px #d92d201f}.status-dot.pulse{background:var(--brand);box-shadow:0 0 0 6px #176b871f;animation:dotPulse .9s ease-in-out infinite}.guest-card{min-height:280px;border:1px solid var(--line);border-radius:8px;background:#fbfcfe;padding:18px}.empty-state{display:grid;place-items:center;align-content:center;min-height:240px;color:var(--muted);text-align:center;gap:8px}.guest-name{margin:0 0 8px;font-size:28px}.guest-id{color:var(--muted);font-size:13px;font-weight:800}.result-message{margin:6px 0 0;color:var(--muted)}.detail-list{display:grid;gap:12px;margin-top:22px}.detail-row{display:flex;justify-content:space-between;gap:18px;padding-bottom:12px;border-bottom:1px solid var(--line)}.detail-row span{color:var(--muted);font-size:13px;font-weight:700}.detail-row strong{text-align:right}.mini-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mini-stats article{padding:16px;border:1px solid var(--line);border-radius:8px;background:#fff}.mini-stats span{display:block;color:var(--muted);font-size:13px;font-weight:700}.mini-stats strong{display:block;margin-top:8px;font-size:32px}.skeleton-line.stat{width:54px;height:30px;border-radius:8px}@keyframes dotPulse{0%,to{transform:scale(1);opacity:.72}50%{transform:scale(1.18);opacity:1}}@keyframes scanline{0%,to{transform:translateY(0)}50%{transform:translateY(230px)}}@media(max-width:920px){.app-shell{grid-template-columns:1fr}.sidebar{position:sticky;top:0;z-index:5;flex-direction:row;align-items:center;padding:14px;overflow-x:auto}.app-shell.sidebar-collapsed{grid-template-columns:1fr}.sidebar-collapsed .sidebar{flex-direction:row;align-items:center;padding:14px}.sidebar-collapsed .sidebar-head{display:flex;justify-items:stretch}.sidebar-collapsed .brand-copy,.sidebar-collapsed .nav-item span{display:none}.sidebar-collapsed .nav-item,.sidebar-collapsed .scanner-link{width:46px;min-width:46px}.sidebar-collapsed .scanner-link span{display:none}nav{display:flex}.scanner-link{min-width:150px;margin-top:0}main{padding:18px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar,.section-heading{align-items:flex-start;flex-direction:column}.scanner-page{margin:-18px}.scanner-shell{grid-template-columns:1fr;width:min(100% - 24px,1180px)}.login-stage{width:min(440px,100%)}}@media(max-width:560px){.brand span{display:none}.metrics{grid-template-columns:1fr}.top-actions,.inline-form,.primary-btn,.secondary-btn,.ghost-btn,.inline-form input{width:100%}.controls,.manual-form{flex-direction:column}}@media(max-width:760px){.scanner-mode .sidebar{display:none}.scanner-mode main{padding:0}.scanner-page{margin:0;min-height:100dvh;padding:max(12px,env(safe-area-inset-top)) 12px max(18px,env(safe-area-inset-bottom));background:radial-gradient(circle at 20% 0%,rgba(247,207,16,.24),transparent 18rem),linear-gradient(180deg,var(--brand-dark) 0%,#2537d2 46%,#eef1ff 46.2%,#f7f8fc 100%)}.scanner-mobile-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;color:#fff}.scanner-mobile-brand{display:flex;align-items:center;gap:10px;min-width:0}.scanner-mobile-brand img{width:42px;height:42px;object-fit:contain;border-radius:8px;background:#fff;border:1px solid rgba(247,207,16,.42)}.scanner-mobile-brand span,.scanner-mobile-brand strong{display:block}.scanner-mobile-brand span{color:#ffffffb8;font-size:12px;font-weight:800}.scanner-mobile-brand strong{color:#fff;font-size:18px}.mobile-scan-status{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:999px;background:#ffffff1f;color:#ffffffc7;border:1px solid rgba(255,255,255,.16);font-size:12px;font-weight:900}.mobile-scan-status.active{background:#f7cf10f2;color:var(--accent-ink);border-color:#f7cf10f2}.scanner-shell{width:100%;gap:12px;padding:0;align-items:stretch}.scanner-panel{padding:0;border:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.scanner-panel>header{display:none}.camera-card{min-height:0;height:clamp(360px,58dvh,560px);border:1px solid rgba(247,207,16,.3);border-radius:8px;box-shadow:0 24px 60px #03082252}.camera-card video{min-height:0;height:100%}.scan-frame{width:min(72vw,300px);box-shadow:0 0 0 999px #030a1247,inset 0 0 28px #f7cf101f}.camera-state{left:12px;right:12px;bottom:12px;min-height:38px;font-size:13px;background:#ffffffeb}.controls{position:sticky;bottom:max(12px,env(safe-area-inset-bottom));z-index:8;display:grid;grid-template-columns:1fr;margin-top:10px;padding:10px;border:1px solid rgba(255,255,255,.5);border-radius:8px;background:#ffffffdb;box-shadow:0 18px 45px #03082233;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.controls .primary-btn,.controls .ghost-btn{width:100%;min-height:54px;font-size:15px}.manual-form{display:grid;grid-template-columns:1fr auto;align-items:end;margin-top:10px;padding:12px;border-radius:8px;background:#ffffffeb;box-shadow:0 14px 32px #1117491f}.manual-form .secondary-btn{width:auto;min-width:92px}.result-panel{gap:12px;padding:14px;border-radius:8px;background:#fffffff5;box-shadow:0 18px 42px #1117491f}.status-header{align-items:center}.guest-card{min-height:auto;padding:14px}.empty-state{min-height:128px}.guest-name{font-size:24px}.detail-list{gap:8px;margin-top:14px}.detail-row{padding-bottom:9px}.confirm-btn{min-height:54px}.mini-stats article{padding:12px}.mini-stats strong{font-size:26px}}@media(max-width:430px){.camera-card{height:clamp(330px,56dvh,500px)}.manual-form{grid-template-columns:1fr}.manual-form .secondary-btn{width:100%}}.camera-card{position:relative;overflow:hidden;min-height:340px;background:#101010}.scanner-video,.html5-qr-reader{width:100%;height:100%;min-height:340px;object-fit:cover}.html5-qr-reader{display:none;border:0!important;background:#101010}.html5-qr-reader.active{display:block}.html5-qr-reader video{width:100%!important;height:100%!important;min-height:340px;object-fit:cover!important}.html5-qr-reader img{display:none}.html5-qr-reader>div{border:0!important}.html5-qr-reader #qr-shaded-region{border-width:0!important}.scan-frame{pointer-events:none;z-index:5}.camera-state{z-index:6}