:root{--gold:#f59e0b;--gold-dark:#d97706;--gold-light:#fcd34d;--dark:#0f172a;--dark-card:#1e293b;--dark-border:#334155;--text-light:#f8fafc;--text-muted:#94a3b8;--danger:#ef4444;--success:#22c55e}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}h1,h2,h3,h4,h5,h6{color:var(--text-light)}body{background-color:var(--dark);color:var(--text-light);min-height:100vh;margin:0;padding:0;font-family:Inter,sans-serif}.smt-navbar{border-bottom:1px solid var(--dark-border);z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);padding:14px 0;position:sticky;top:0}.smt-navbar .brand{color:var(--gold);align-items:center;gap:10px;font-size:1.1rem;font-weight:700;text-decoration:none;display:flex}.smt-navbar .brand img{object-fit:contain;width:32px;height:32px}.smt-navbar .nav-links{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.smt-navbar .nav-link-item{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;padding:6px 14px;font-size:.875rem;font-weight:500;text-decoration:none;transition:all .2s}.smt-navbar .nav-link-item:hover{color:var(--gold);background:#f59e0b1a}.smt-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:16px;padding:24px;box-shadow:0 4px 24px #0000004d}.smt-card-header{border-bottom:1px solid var(--dark-border);align-items:center;gap:10px;margin-bottom:20px;padding-bottom:16px;display:flex}.smt-card-header h2{color:var(--text-light);margin:0;font-size:1.1rem;font-weight:600}.smt-card-header .icon{background:linear-gradient(135deg, var(--gold), var(--gold-dark));color:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;display:flex}.btn-gold{background:linear-gradient(135deg, var(--gold), var(--gold-dark));color:#0f172a;cursor:pointer;border:none;border-radius:10px;padding:10px 20px;font-size:.875rem;font-weight:600;transition:all .2s}.btn-gold:hover{background:linear-gradient(135deg, var(--gold-light), var(--gold));transform:translateY(-1px);box-shadow:0 4px 12px #f59e0b66}.btn-outline-gold{color:var(--gold);border:1px solid var(--gold);cursor:pointer;background:0 0;border-radius:10px;padding:9px 20px;font-size:.875rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.btn-outline-gold:hover{color:var(--gold);background:#f59e0b1a}.btn-danger-sm{color:var(--danger);cursor:pointer;background:#ef444426;border:1px solid #ef44444d;border-radius:8px;padding:5px 12px;font-size:.8rem;font-weight:500;transition:all .2s}.btn-danger-sm:hover{background:#ef444440}.btn-success-sm{color:var(--success);cursor:pointer;background:#22c55e26;border:1px solid #22c55e4d;border-radius:8px;padding:5px 12px;font-size:.8rem;font-weight:500;transition:all .2s}.btn-success-sm:hover{background:#22c55e40}.btn-info-sm{color:#63b3ed;cursor:pointer;background:#63b3ed26;border:1px solid #63b3ed4d;border-radius:8px;padding:5px 12px;font-size:.8rem;font-weight:500;text-decoration:none;transition:all .2s;display:inline-block}.btn-info-sm:hover{color:#63b3ed;background:#63b3ed40}.btn-warning-sm{color:var(--gold);cursor:pointer;background:#fbbf2426;border:1px solid #fbbf244d;border-radius:8px;padding:5px 12px;font-size:.8rem;font-weight:500;transition:all .2s}.btn-warning-sm:hover{background:#fbbf2440}.smt-form-group{margin-bottom:16px}.smt-form-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:.8rem;font-weight:500;display:block}.smt-input{border:1px solid var(--dark-border);width:100%;color:var(--text-light);background:#ffffff0d;border-radius:10px;outline:none;padding:10px 14px;font-family:Inter,sans-serif;font-size:.9rem;transition:border-color .2s}.smt-input:focus{border-color:var(--gold);background:#f59e0b0d}.smt-input::placeholder{color:var(--text-muted)}.smt-select{border:1px solid var(--dark-border);width:100%;color:var(--text-light);cursor:pointer;background:#ffffff0d;border-radius:10px;outline:none;padding:10px 14px;font-family:Inter,sans-serif;font-size:.9rem}.smt-select option{background:var(--dark-card);color:var(--text-light)}.smt-table{border-collapse:collapse;width:100%;font-size:.875rem}.smt-table th{color:var(--gold);text-transform:uppercase;letter-spacing:.08em;text-align:left;border-bottom:1px solid var(--dark-border);white-space:nowrap;background:#f59e0b14;padding:12px 16px;font-size:.75rem;font-weight:600}.smt-table td{color:var(--text-light);vertical-align:middle;border-bottom:1px solid #33415580;padding:12px 16px}.smt-table tr:last-child td{border-bottom:none}.smt-table tr:hover td{background:#ffffff05}.foto-thumb{object-fit:cover;border:1px solid var(--dark-border);border-radius:8px;width:48px;height:60px}.foto-member{object-fit:cover;border:3px solid var(--gold);border-radius:16px;width:150px;height:180px;box-shadow:0 8px 24px #f59e0b4d}.badge-aktif{color:var(--success);background:#22c55e26;border:1px solid #22c55e4d;border-radius:6px;padding:3px 8px;font-size:.75rem;font-weight:500}.badge-blokir{color:var(--danger);background:#ef444426;border:1px solid #ef44444d;border-radius:6px;padding:3px 8px;font-size:.75rem;font-weight:500}.smt-alert{border-radius:10px;margin-bottom:16px;padding:12px 16px;font-size:.875rem}.smt-alert-danger{color:#fca5a5;background:#ef44441a;border:1px solid #ef44444d}.smt-alert-success{color:#86efac;background:#22c55e1a;border:1px solid #22c55e4d}.smt-alert-info{color:#93c5fd;background:#63b3ed1a;border:1px solid #63b3ed4d}.auth-wrapper{background:linear-gradient(135deg,#0f172a 0%,#1a2744 50%,#0f172a 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-card{background:var(--dark-card);border:1px solid var(--dark-border);border-radius:24px;width:100%;max-width:420px;padding:40px;box-shadow:0 25px 60px #00000080}.auth-logo{text-align:center;margin-bottom:28px}.auth-logo img{object-fit:contain;width:60px;height:60px;margin-bottom:12px}.auth-logo h1{color:var(--gold);margin:0;font-size:1.4rem;font-weight:700}.auth-logo p{color:var(--text-muted);margin:4px 0 0;font-size:.85rem}.member-bg{background-image:url(/assets/img/bg.png);background-position:50%;background-size:cover;background-attachment:scroll;min-height:100vh}.member-overlay{background:#0f172abf;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex}.member-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;background:#1e293be6;border:1px solid #f59e0b4d;border-radius:24px;width:100%;max-width:420px;padding:36px;box-shadow:0 25px 60px #00000080}.qr-img{border:3px solid var(--gold);background:#fff;border-radius:12px;max-width:220px;padding:8px}.search-bar{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.search-bar input{flex:1;min-width:200px}.stat-card{background:var(--dark-card);border:1px solid var(--dark-border);text-align:center;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;height:100%;min-height:90px;padding:20px 12px;display:flex}.stat-card .stat-number{color:var(--gold);word-break:break-all;font-size:1.6rem;font-weight:700;line-height:1.2}.stat-card .stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:4px;font-size:.7rem}.smt-divider{border:none;border-top:1px solid var(--dark-border);margin:20px 0}@media (max-width:768px){.smt-card{border-radius:12px;padding:16px}.auth-card{border-radius:16px;padding:28px 20px}.member-card{padding:24px 16px}.smt-table{font-size:.8rem}.smt-table th,.smt-table td{padding:10px}.smt-navbar .nav-links{display:none}.smt-navbar .mobile-menu-btn{display:block}}@media (max-width:480px){.smt-table th:nth-child(n+5),.smt-table td:nth-child(n+5){display:none}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--dark)}::-webkit-scrollbar-thumb{background:var(--dark-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gold-dark)}.spinner{border:3px solid var(--dark-border);border-top-color:var(--gold);border-radius:50%;width:36px;height:36px;margin:40px auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media print{body{color:#000;background:#fff}.no-print{display:none}}
