:root{--bg:#07080d;--bg-2:#0a0c14;--panel:#11141d;--surface:#11141d;--surface-2:#171b27;--surface-3:#1d2230;--surface-hover:#1a1f2c;--text:#eef1f7;--text-soft:#c4cad8;--muted:#8a93a6;--accent:#e11d2a;--accent-2:#f34;--accent-dark:#b3141f;--blue:#3b82f6;--blue-2:#60a5fa;--green:#22c55e;--red:#ef4444;--amber:#f59e0b;--border:#ffffff14;--border-strong:#ffffff24;--ring:#e11d2a8c;--grad-accent:linear-gradient(135deg, #f34 0%, #e11d2a 50%, #b3141f 100%);--grad-blue:linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);--grad-surface:linear-gradient(180deg, #ffffff0a, #fff0);--glow-accent:0 0 0 1px #e11d2a40, 0 8px 30px #e11d2a2e;--radius-sm:10px;--radius:16px;--radius-lg:22px;--shadow-sm:0 1px 2px #0006;--shadow:0 18px 40px -12px #000000a6;--shadow-lg:0 30px 70px -20px #000000bf;--ease:cubic-bezier(.16, 1, .3, 1);--t-fast:.16s var(--ease);--t:.26s var(--ease);--font-ui:"Inter", system-ui, -apple-system, "Segoe UI", "Tahoma", sans-serif;--font-display:"Sora", var(--font-ui)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-ui);color:var(--text);background-color:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;letter-spacing:.1px;background-image:radial-gradient(900px at 12% -5%,#e11d2a29,#0000 45%),radial-gradient(900px at 92% 8%,#3b82f629,#0000 45%),radial-gradient(1100px at 50% 115%,#3b82f61a,#0000 50%);background-attachment:fixed}.constellation{z-index:-1;pointer-events:none;opacity:.7;position:fixed;inset:0}a{color:var(--blue-2);transition:color var(--t-fast);text-decoration:none}a:hover{color:#93c5fd}::selection{color:#fff;background:#e11d2a59}*{scrollbar-width:thin;scrollbar-color:#ffffff2e transparent}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#ffffff29 padding-box padding-box;border:2px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ffffff47 padding-box padding-box}.app-shell{flex-direction:column;min-height:100vh;display:flex}.content{width:100%;max-width:1280px;animation:page-in .4s var(--ease) both;flex:1;margin:0 auto;padding:32px 24px 80px}@keyframes page-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.navbar{-webkit-backdrop-filter:blur(18px)saturate(140%);border-bottom:1px solid var(--border);z-index:50;background:#0a0c14b8;position:sticky;top:0}.navbar:after{content:"";background:linear-gradient(90deg, transparent, var(--accent) 30%, var(--blue) 70%, transparent);opacity:.85;height:2px;position:absolute;bottom:-1px;left:0;right:0}.navbar-inner{align-items:center;gap:4px;max-width:1280px;margin:0 auto;padding:12px 24px;display:flex}.nav-logo{font-family:var(--font-display);letter-spacing:1.2px;color:#fff;align-items:center;gap:11px;margin-left:auto;font-size:20px;font-weight:800;display:inline-flex}.nav-logo-img{object-fit:cover;border:1px solid var(--border-strong);border-radius:50%;width:40px;height:40px;box-shadow:0 0 18px -4px #3b82f68c}.nav-item{position:relative}.nav-link{color:var(--text-soft);border-radius:var(--radius-sm);cursor:pointer;font-size:14.5px;font-weight:500;font-family:var(--font-ui);transition:background var(--t-fast), color var(--t-fast), transform var(--t-fast);white-space:nowrap;background:0 0;border:none;align-items:center;gap:7px;padding:9px 14px;display:inline-flex}.nav-link:hover{color:#fff;background:#ffffff12}.nav-link.active{background:var(--grad-accent);color:#fff;box-shadow:0 6px 18px -6px #e11d2a99}.dropdown{-webkit-backdrop-filter:blur(20px)saturate(150%);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:60;transform-origin:0 0;min-width:220px;animation:dropdown-in .18s var(--ease) both;background:#141822eb;padding:8px;position:absolute;top:calc(100% + 10px);left:0}@keyframes dropdown-in{0%{opacity:0;transform:translateY(-6px)scale(.98)}to{opacity:1;transform:none}}.dropdown a{border-radius:var(--radius-sm);color:var(--text-soft);cursor:pointer;transition:background var(--t-fast), color var(--t-fast);align-items:center;gap:10px;padding:10px 12px;font-size:14px;display:flex}.dropdown a:hover{color:#fff;background:#ffffff12}.card{background:var(--surface);background-image:var(--grad-surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);transition:border-color var(--t), transform var(--t), box-shadow var(--t);margin-bottom:22px;padding:22px}.card:hover{border-color:var(--border-strong)}.card h2,.card h3{font-family:var(--font-display);letter-spacing:.2px;margin-top:0;font-weight:700}.card h3{color:var(--text);font-size:16px}.page-title{color:#fff;font-family:var(--font-display);letter-spacing:.3px;margin:0 0 22px;padding-left:16px;font-size:28px;font-weight:800;position:relative}.page-title:before{content:"";background:var(--grad-accent);border-radius:999px;width:5px;position:absolute;top:4px;bottom:4px;left:0;box-shadow:0 0 16px #e11d2a99}.btn{border-radius:var(--radius-sm);font-size:14px;font-weight:600;font-family:var(--font-ui);cursor:pointer;color:#fff;transition:transform var(--t-fast), box-shadow var(--t-fast), filter var(--t-fast), background var(--t-fast);box-shadow:var(--shadow-sm);border:1px solid #0000;justify-content:center;align-items:center;gap:7px;padding:9px 16px;display:inline-flex;position:relative}.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:focus-visible{box-shadow:0 0 0 3px var(--ring);outline:none}.btn-blue{background:var(--grad-blue);box-shadow:0 8px 20px -8px #3b82f699}.btn-green{background:linear-gradient(135deg,#34d399,#16a34a);box-shadow:0 8px 20px -8px #22c55e80}.btn-red{background:linear-gradient(135deg,#f87171,#dc2626);box-shadow:0 8px 20px -8px #ef444480}.btn-gray{background:var(--surface-3);color:var(--text-soft);border-color:var(--border);box-shadow:none}.btn-gray:hover{background:var(--surface-hover);color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed;filter:none;box-shadow:none;transform:none}.icon-btn{cursor:pointer;color:var(--muted);transition:background var(--t-fast), color var(--t-fast), transform var(--t-fast);background:0 0;border:none;border-radius:9px;padding:7px;display:inline-flex}.icon-btn:hover{background:#ffffff14;transform:translateY(-1px)}.icon-edit{color:var(--blue-2)}.icon-delete{color:var(--red)}.icon-history{color:var(--muted)}.icon-pay{color:var(--green)}.table-toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.table-toolbar .spacer{flex:1}.search-input,.filter-bar select,.filter-bar input,.form-field input,.form-field select,.form-field textarea{border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:14px;font-family:var(--font-ui);color:var(--text);background:var(--bg-2);transition:border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);padding:10px 12px}.search-input::placeholder,.form-field input::placeholder,.form-field textarea::placeholder{color:var(--muted)}.search-input:focus,.filter-bar select:focus,.filter-bar input:focus,.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--accent);background:var(--surface-2);outline:none;box-shadow:0 0 0 3px #e11d2a2e}.search-input{min-width:240px}input[type=date],input[type=time],input[type=month]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}table.data{border-collapse:separate;border-spacing:0;width:100%;color:var(--text-soft);font-size:14px}table.data th,table.data td{text-align:left;border-bottom:1px solid var(--border);padding:13px 14px}table.data thead th{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--muted);letter-spacing:.6px;text-transform:uppercase;white-space:nowrap;background:var(--surface-2);border-bottom:1px solid var(--border-strong);font-size:12px;font-weight:600;position:sticky;top:0}table.data thead th:first-child{border-top-left-radius:12px}table.data thead th:last-child{border-top-right-radius:12px}table.data tbody tr{transition:background var(--t-fast)}table.data tbody tr:hover td{background:#ffffff0a}table.data td{color:var(--text)}.pagination{color:var(--muted);justify-content:center;align-items:center;gap:10px;margin-top:18px;font-size:14px;display:flex}.badge{letter-spacing:.3px;border:1px solid #0000;border-radius:999px;align-items:center;gap:6px;padding:4px 11px;font-size:11.5px;font-weight:600;display:inline-flex}.badge:before{content:"";background:currentColor;border-radius:999px;width:6px;height:6px;box-shadow:0 0 8px}.badge-active{color:#4ade80;background:#22c55e24;border-color:#22c55e4d}.badge-soon{color:#fbbf24;background:#f59e0b24;border-color:#f59e0b4d}.badge-expired{color:#f87171;background:#ef444424;border-color:#ef44444d}.tick{color:var(--green);font-weight:700}.cross{color:var(--red);font-weight:700}.filter-bar{flex-wrap:wrap;align-items:end;gap:12px;margin-bottom:18px;display:flex}.filter-bar label{color:var(--muted);flex-direction:column;gap:6px;font-size:12px;font-weight:500;display:flex}.modal-backdrop{-webkit-backdrop-filter:blur(8px);z-index:100;animation:fade-in .2s var(--ease) both;background:#04060b99;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface-2);background-image:var(--grad-surface);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius-lg);width:100%;max-width:560px;max-height:90vh;box-shadow:var(--shadow-lg);animation:modal-in .26s var(--ease) both;padding:26px;overflow-y:auto}@keyframes modal-in{0%{opacity:0;transform:translateY(12px)scale(.97)}to{opacity:1;transform:none}}.modal h3{font-family:var(--font-display);margin-top:0;font-weight:700}.form-field{flex-direction:column;gap:6px;margin-bottom:15px;display:flex}.form-field label{color:var(--text-soft);font-size:13px;font-weight:500}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.modal-actions{justify-content:flex-end;gap:10px;margin-top:10px;display:flex}.stat-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;display:grid}.stat-card{background:var(--surface-2);background-image:var(--grad-surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform var(--t), border-color var(--t), box-shadow var(--t);padding:20px;position:relative;overflow:hidden}.stat-card:before{content:"";background:var(--grad-accent);opacity:.9;height:3px;position:absolute;top:0;left:0;right:0}.stat-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.stat-card .label{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:12.5px;font-weight:500}.stat-card .value{font-family:var(--font-display);letter-spacing:.3px;margin-top:8px;font-size:30px;font-weight:800}.stat-card .sub{color:var(--muted);margin-top:6px;font-size:12.5px}.alert-banner{background:linear-gradient(100deg, var(--accent), var(--accent-dark));color:#fff;border-radius:var(--radius);box-shadow:var(--glow-accent);border:1px solid #ffffff1f;align-items:center;gap:14px;margin-bottom:22px;padding:16px 20px;display:flex;position:relative;overflow:hidden}.alert-banner:after{content:"";pointer-events:none;background:radial-gradient(600px at 100% 0,#ffffff2e,#0000 60%);position:absolute;inset:0}.alert-banner .btn{box-shadow:none;background:#fff3;border-color:#ffffff40}.alert-banner .btn:hover{background:#ffffff52}.footer{text-align:center;color:var(--muted);border-top:1px solid var(--border);padding:24px;font-size:13px}.login-wrap{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{-webkit-backdrop-filter:blur(22px)saturate(150%);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:380px;animation:modal-in .4s var(--ease) both;background:#141822b3;padding:40px 38px}.kwekly-wrap{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.kwekly-card{border-radius:var(--radius-lg);text-align:center;color:#fff;width:380px;box-shadow:var(--shadow-lg), 0 0 60px -20px #e11d2a99;background:radial-gradient(500px at 50% -10%,#e11d2a38,#0000 60%),linear-gradient(165deg,#161a24,#0c0e15);border:1px solid #e11d2a73;padding:36px 32px;position:relative;overflow:hidden}.kwekly-card .brand{font-family:var(--font-display);letter-spacing:5px;background:linear-gradient(120deg, #fff, var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:32px;font-weight:800}.kwekly-card .champion{font-family:var(--font-display);margin:18px 0 4px;font-size:21px;font-weight:700}.kwekly-stat{border-bottom:1px solid #ffffff1a;justify-content:space-between;padding:12px 0;font-size:14px;display:flex}.kwekly-stat .muted{color:#fff9}.attended{color:#4ade80;margin:18px 0;font-size:22px;font-weight:700}.muted{color:var(--muted)}.error-text{color:#fca5a5;border-radius:var(--radius-sm);background:#ef44441f;border:1px solid #ef44444d;margin:4px 0;padding:9px 12px;font-size:13px}.schedule-grid input,.schedule-grid select{width:100%}.skeleton{background:linear-gradient(90deg, var(--surface-2) 25%, var(--surface-3) 37%, var(--surface-2) 63%);border-radius:var(--radius-sm);background-size:400% 100%;animation:1.4s infinite shimmer}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.recharts-cartesian-grid line{stroke:#ffffff12}.recharts-text,.recharts-cartesian-axis-tick-value{fill:var(--muted);font-size:12px}.recharts-default-tooltip{background:var(--surface-3)!important;border:1px solid var(--border-strong)!important;border-radius:var(--radius-sm)!important;box-shadow:var(--shadow)!important;color:var(--text)!important}.recharts-tooltip-label,.recharts-tooltip-item{color:var(--text)!important}.recharts-legend-item-text{color:var(--text-soft)!important}@media (width<=900px){.navbar-inner{flex-wrap:wrap;gap:2px;padding:10px 16px}.nav-logo{order:-1;width:100%;margin-bottom:6px;margin-left:0}.content{padding:22px 16px 64px}.page-title{font-size:23px}.form-row{grid-template-columns:1fr}.dropdown{min-width:200px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
