:root{--bp-blue: #2563eb;--bp-cyan: #0ea5e9;--bp-gradient: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);--bp-gradient-soft: linear-gradient(135deg, rgba(37,99,235,.12), rgba(14,165,233,.08));--bp-glow: 0 0 40px rgba(37, 99, 235, .35);--bp-bg: #f4f7fb;--bp-surface: #ffffff;--bp-text: #0f172a;--bp-muted: #64748b;--bp-border: #e2e8f0;--bp-radius: 16px;--bp-radius-sm: 10px;--sidebar-w: 260px;--sidebar-bg: #0a0f1a;--sidebar-text: #94a3b8;--font: "Plus Jakarta Sans", system-ui, sans-serif;--ease-out: cubic-bezier(.22, 1, .36, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);background:var(--bp-bg);color:var(--bp-text);line-height:1.55;-webkit-font-smoothing:antialiased}button,input,textarea,select{font-family:inherit}a{color:var(--bp-blue);text-decoration:none}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-ring{0%{transform:scale(.95);opacity:.7}70%{transform:scale(1.15);opacity:0}to{transform:scale(1.15);opacity:0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes gradient-shift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.anim-fade-up{animation:fadeUp .65s var(--ease-out) both}.anim-fade-up-d1{animation-delay:.08s}.anim-fade-up-d2{animation-delay:.16s}.anim-fade-up-d3{animation-delay:.24s}.anim-fade-up-d4{animation-delay:.32s}.admin-layout{display:flex;min-height:100vh;background:radial-gradient(ellipse 80% 50% at 100% -10%,rgba(37,99,235,.07),transparent),radial-gradient(ellipse 60% 40% at 0% 100%,rgba(14,165,233,.06),transparent),var(--bp-bg)}.admin-sidebar{width:var(--sidebar-w);background:var(--sidebar-bg);border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;padding:1.25rem .85rem;flex-shrink:0;position:sticky;top:0;height:100vh;z-index:20}.sidebar-brand{display:flex;align-items:center;gap:.75rem;padding:.25rem .65rem 1.5rem;color:#fff;font-weight:800;font-size:1.05rem;letter-spacing:-.02em}.brand-dot{width:38px;height:38px;border-radius:11px;background:var(--bp-gradient);background-size:200% 200%;animation:gradient-shift 6s ease infinite;display:grid;place-items:center;color:#fff;font-size:.78rem;font-weight:800;box-shadow:0 4px 16px #2563eb73;flex-shrink:0}.sidebar-brand small{display:block;font-size:.65rem;font-weight:500;color:var(--sidebar-text);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}.admin-nav{display:flex;flex-direction:column;gap:4px;flex:1}.admin-nav a{display:flex;align-items:center;gap:.7rem;padding:.72rem .9rem;border-radius:12px;color:var(--sidebar-text);text-decoration:none;font-weight:500;font-size:.9rem;transition:all .25s var(--ease-out);position:relative;overflow:hidden}.admin-nav a svg{opacity:.75;transition:opacity .2s}.admin-nav a:hover{color:#e2e8f0;background:#ffffff0d;transform:translate(3px)}.admin-nav a.active{color:#fff;background:var(--bp-gradient);box-shadow:0 4px 20px #2563eb66;font-weight:600}.admin-nav a.active svg{opacity:1}.admin-nav a.nav-kiosk{margin-top:.5rem;border:1px dashed rgba(255,255,255,.12)}.sidebar-footer{margin-top:auto;padding-top:1rem;border-top:1px solid rgba(255,255,255,.08)}.sidebar-user{display:flex;align-items:center;gap:.65rem;padding:.75rem;border-radius:12px;background:#ffffff0a;margin-bottom:.5rem}.sidebar-user span{color:#cbd5e1;font-size:.8rem;font-weight:600}.sidebar-user small{color:var(--sidebar-text);font-size:.72rem}.btn-logout{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:transparent;color:var(--sidebar-text);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-logout:hover{background:#ef44441f;color:#fca5a5;border-color:#ef444440}.admin-shell{flex:1;min-width:0;display:flex;flex-direction:column}.admin-topbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.75rem;border-bottom:1px solid var(--bp-border);background:#ffffffbf;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.topbar-breadcrumb{font-size:.8rem;color:var(--bp-muted);margin-bottom:2px}.topbar-title{font-size:1.1rem;font-weight:700;letter-spacing:-.02em}.topbar-actions{display:flex;align-items:center;gap:.75rem}.month-pill{display:flex;align-items:center;gap:.4rem;padding:.45rem .85rem;border-radius:999px;border:1px solid var(--bp-border);background:#fff;font-size:.82rem;font-weight:600;color:var(--bp-text)}.live-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;position:relative}.live-dot:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:2px solid #22c55e;animation:pulse-ring 1.8s ease-out infinite}.admin-main{flex:1;padding:1.5rem 1.75rem 2.5rem;max-width:1200px;width:100%}.dash-greeting{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.dash-greeting h1{font-size:1.65rem;font-weight:800;letter-spacing:-.03em}.dash-greeting p{color:var(--bp-muted);font-size:.92rem;margin-top:.25rem}.status-chip{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .75rem;border-radius:999px;background:#ecfdf5;color:#047857;font-size:.78rem;font-weight:600;border:1px solid #a7f3d0}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.25rem}.stat-card{background:var(--bp-surface);border:1px solid var(--bp-border);border-radius:var(--bp-radius);padding:1.25rem 1.35rem;position:relative;overflow:hidden;transition:transform .3s var(--ease-out),box-shadow .3s}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--bp-gradient);opacity:0;transition:opacity .3s}.stat-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px #2563eb1a}.stat-card:hover:before{opacity:1}.stat-card-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:.75rem}.stat-card-label{font-size:.8rem;color:var(--bp-muted);font-weight:600}.stat-icon{width:40px;height:40px;border-radius:11px;background:var(--bp-gradient-soft);display:grid;place-items:center;color:var(--bp-blue)}.stat-value{font-size:2rem;font-weight:800;letter-spacing:-.03em;line-height:1;background:var(--bp-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-meta{font-size:.78rem;color:var(--bp-muted);margin-top:.5rem}.stat-trend{display:inline-flex;align-items:center;gap:.2rem;color:#16a34a;font-weight:600;font-size:.75rem;margin-top:.35rem}.hero-banner{border-radius:var(--bp-radius);padding:1.5rem 1.75rem;margin-bottom:1.25rem;background:linear-gradient(135deg,#0f172a,#1e3a5f,#0c4a6e);background-size:200% 200%;animation:gradient-shift 12s ease infinite;color:#fff;position:relative;overflow:hidden}.hero-banner:after{content:"";position:absolute;top:-50%;right:-10%;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.35),transparent 70%);pointer-events:none}.hero-banner-tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#7dd3fc;margin-bottom:.5rem}.hero-banner h2{font-size:1.35rem;font-weight:800;letter-spacing:-.02em;margin-bottom:.35rem;position:relative}.hero-banner p{font-size:.88rem;color:#94a3b8;max-width:420px;position:relative}.progress-bar{margin-top:1rem;height:6px;border-radius:999px;background:#ffffff1f;overflow:hidden;max-width:320px;position:relative}.progress-bar span{display:block;height:100%;border-radius:inherit;background:var(--bp-gradient);transition:width 1s var(--ease-out)}.panel{background:var(--bp-surface);border:1px solid var(--bp-border);border-radius:var(--bp-radius);overflow:hidden;margin-bottom:1rem;transition:box-shadow .3s}.panel:hover{box-shadow:0 8px 30px #0f172a0f}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--bp-border)}.panel-head h3{font-size:.95rem;font-weight:700}.panel-link{font-size:.82rem;font-weight:600;color:var(--bp-blue);transition:gap .2s}.panel-link:hover{text-decoration:underline}.rank-table{width:100%;border-collapse:collapse}.rank-table th{padding:.65rem 1.25rem;text-align:left;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--bp-muted);background:#f8fafc}.rank-table td{padding:.85rem 1.25rem;border-top:1px solid var(--bp-border);font-size:.9rem;transition:background .2s}.rank-table tbody tr:hover td{background:#f8fafc}.rank-num{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-weight:800;font-size:.8rem;background:#f1f5f9;color:var(--bp-muted)}.rank-num.gold{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff}.rank-num.silver{background:linear-gradient(135deg,#94a3b8,#64748b);color:#fff}.rank-num.bronze{background:linear-gradient(135deg,#d97706,#b45309);color:#fff}.person-cell{display:flex;align-items:center;gap:.75rem}.staff-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:var(--bp-gradient-soft);display:grid;place-items:center;font-weight:700;color:var(--bp-blue);font-size:.85rem;flex-shrink:0;border:2px solid #fff;box-shadow:0 2px 8px #2563eb26}.person-name{font-weight:600}.person-role{font-size:.78rem;color:var(--bp-muted)}.star-rating{display:inline-flex;gap:2px;color:#fbbf24;vertical-align:middle}.score-pill{display:inline-flex;align-items:center;gap:.35rem;font-weight:800;color:var(--bp-blue)}.page-header{margin-bottom:1.25rem}.page-title{font-size:1.4rem;font-weight:800;letter-spacing:-.02em}.page-sub{color:var(--bp-muted);font-size:.9rem;margin-top:.25rem}.card{background:var(--bp-surface);border:1px solid var(--bp-border);border-radius:var(--bp-radius);padding:1.25rem;margin-bottom:1rem;animation:fadeUp .5s var(--ease-out) both}.btn{display:inline-flex;align-items:center;gap:.45rem;padding:.6rem 1.1rem;border-radius:var(--bp-radius-sm);font-weight:600;font-size:.875rem;border:none;cursor:pointer;transition:all .25s var(--ease-out)}.btn-primary{background:var(--bp-gradient);background-size:200% 200%;color:#fff;box-shadow:0 4px 14px #2563eb4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px #2563eb66;animation:gradient-shift 3s ease infinite}.btn-ghost{background:#fff;border:1px solid var(--bp-border);color:var(--bp-text)}.btn-ghost:hover{border-color:#bfdbfe;background:#f8fafc}.btn-danger{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.form-row{margin-bottom:.9rem}.form-row label{display:block;font-size:.8rem;font-weight:600;margin-bottom:.35rem;color:var(--bp-text)}.form-row input,.form-row textarea,.form-row select{width:100%;padding:.65rem .85rem;border:1px solid var(--bp-border);border-radius:var(--bp-radius-sm);font-size:.9rem;transition:border-color .2s,box-shadow .2s;background:#fff}.form-row input:focus,.form-row textarea:focus,.form-row select:focus{outline:none;border-color:var(--bp-blue);box-shadow:0 0 0 3px #2563eb1f}.table{width:100%;border-collapse:collapse;font-size:.875rem}.table th,.table td{padding:.75rem .5rem;border-bottom:1px solid var(--bp-border);text-align:left}.table th{color:var(--bp-muted);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(ellipse at 20% 20%,rgba(37,99,235,.15),transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(14,165,233,.12),transparent 50%),#0a0f1a}.login-box{width:100%;max-width:420px;background:#fffffff7;border-radius:20px;padding:2.25rem;border:1px solid rgba(255,255,255,.2);box-shadow:0 24px 80px #00000059;animation:scaleIn .6s var(--ease-out) both}.login-box h1{font-size:1.35rem;font-weight:800;letter-spacing:-.02em}.kiosk-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#060a12;color:#fff;overflow:hidden}.kiosk-left{padding:3rem 3.5rem;display:flex;flex-direction:column;justify-content:center;position:relative}.kiosk-left:before{content:"";position:absolute;bottom:-20%;left:-20%;width:500px;height:500px;border-radius:50%;border:1px solid rgba(37,99,235,.15);pointer-events:none}.kiosk-eyebrow{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--bp-cyan);margin-bottom:1rem;animation:fadeUp .6s var(--ease-out) both}.kiosk-headline{font-size:clamp(2rem,4vw,2.75rem);font-weight:800;line-height:1.15;letter-spacing:-.03em;margin-bottom:1rem;animation:fadeUp .6s .1s var(--ease-out) both}.kiosk-headline em{font-style:normal;background:var(--bp-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.kiosk-desc{color:#94a3b8;font-size:1rem;max-width:400px;margin-bottom:2.5rem;animation:fadeUp .6s .2s var(--ease-out) both}.kiosk-steps{display:flex;gap:0;animation:fadeUp .6s .3s var(--ease-out) both}.kiosk-step{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:#64748b;padding-right:1.5rem;position:relative}.kiosk-step:not(:last-child):after{content:"";position:absolute;right:.5rem;top:50%;width:24px;height:1px;background:#ffffff26}.kiosk-step-num{width:26px;height:26px;border-radius:50%;border:1px solid rgba(37,99,235,.5);display:grid;place-items:center;font-size:.72rem;font-weight:700;color:var(--bp-cyan)}.kiosk-badge{position:absolute;top:1.5rem;right:1.5rem;display:flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#64748b}.kiosk-right{display:flex;align-items:center;justify-content:center;padding:2rem;background:radial-gradient(ellipse at center,rgba(37,99,235,.08),transparent 70%)}.kiosk-qr-card{background:#fff;border-radius:28px;padding:2rem 2.25rem;text-align:center;box-shadow:0 32px 80px #0006,0 0 0 1px #ffffff0d;animation:float 5s ease-in-out infinite,scaleIn .7s var(--ease-out) both;position:relative}.kiosk-qr-card:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:30px;background:var(--bp-gradient);z-index:-1;opacity:.5;filter:blur(20px)}.kiosk-live{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:600;color:#16a34a;margin-bottom:1.25rem}.kiosk-qr-wrap{padding:.5rem}.kiosk-qr-label{margin-top:1.25rem;font-size:1rem;font-weight:700;color:#0f172a}.kiosk-qr-sub{font-size:.8rem;color:#64748b;margin-top:.25rem}.kiosk-branch-badge{display:inline-flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;padding:.5rem .85rem;border-radius:999px;background:#2563eb1a;border:1px solid rgba(37,99,235,.2);font-size:.85rem;color:#1e3a8a}.kiosk-branch-change{border:none;background:transparent;color:#2563eb;font-weight:700;cursor:pointer;font-size:.8rem;text-decoration:underline}.kiosk-picker-layout{min-height:100vh;display:grid;place-items:center;padding:2rem 1.25rem;background:linear-gradient(135deg,#f8fafc,#eff6ff)}.kiosk-picker-card{width:min(560px,100%);background:#fff;border-radius:20px;padding:2rem 1.5rem;box-shadow:0 20px 50px #0f172a14;border:1px solid rgba(37,99,235,.1)}.kiosk-branch-grid{display:grid;gap:.75rem}.kiosk-branch-btn{display:grid;grid-template-columns:auto 1fr;gap:.25rem .85rem;align-items:center;text-align:left;width:100%;padding:1rem 1.1rem;border-radius:14px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}.kiosk-branch-btn:hover{border-color:#93c5fd;box-shadow:0 8px 24px #2563eb1f;transform:translateY(-2px)}.kiosk-branch-icon{grid-row:span 2;width:2.5rem;height:2.5rem;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;font-weight:800}.kiosk-branch-name{font-weight:700;color:#0f172a}.kiosk-branch-btn small{grid-column:2;color:#64748b;font-size:.8rem}.kiosk-footer{position:fixed;bottom:1.25rem;left:1.5rem;display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:#475569}.eval-page{min-height:100vh;padding:1.5rem;max-width:480px;margin:0 auto;animation:fadeIn .5s ease}.eval-header{text-align:center;margin-bottom:1.75rem}.eval-logo{width:80px;height:80px;border-radius:18px;object-fit:cover;margin-bottom:.85rem;box-shadow:0 8px 24px #2563eb33}.eval-logo-placeholder{width:80px;height:80px;border-radius:18px;background:var(--bp-gradient);display:inline-grid;place-items:center;color:#fff;font-weight:800;font-size:1.5rem;margin-bottom:.85rem;box-shadow:var(--bp-glow)}.staff-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1.25rem 0}.staff-pick{border:2px solid var(--bp-border);border-radius:14px;padding:1rem .75rem;text-align:center;cursor:pointer;background:#fff;transition:all .25s var(--ease-out)}.staff-pick:hover{transform:translateY(-3px);box-shadow:0 8px 20px #2563eb1a}.staff-pick.selected{border-color:var(--bp-blue);background:var(--bp-gradient-soft);box-shadow:0 4px 16px #2563eb26}.score-row{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center;margin:1.25rem 0}.score-btn{width:44px;height:44px;border-radius:10px;border:1px solid var(--bp-border);background:#fff;font-weight:700;cursor:pointer;transition:all .2s var(--ease-out)}.score-btn:hover{transform:scale(1.08);border-color:var(--bp-blue)}.score-btn.selected{background:var(--bp-gradient);color:#fff;border-color:transparent;transform:scale(1.1);box-shadow:0 4px 12px #2563eb59}@media (max-width: 900px){.admin-sidebar{display:none}.stat-grid,.kiosk-layout{grid-template-columns:1fr}.kiosk-right{min-height:50vh}.kiosk-left{padding:2rem 1.5rem;min-height:auto}.staff-grid{grid-template-columns:1fr}}