:root{--bg: #090C10;--surface: #10151C;--surface-elevated: #161D26;--surface-alt: #1D2430;--surface-hover: #232C3A;--surface-active: #2A3546;--border-subtle: rgba(255, 255, 255, .04);--border: rgba(255, 255, 255, .08);--border-light: rgba(255, 255, 255, .15);--border-focus: rgba(212, 175, 55, .45);--accent: #D4AF37;--accent-hover: #E2BE46;--accent-soft: rgba(212, 175, 55, .12);--accent-border: rgba(212, 175, 55, .25);--accent-text: #E5C466;--text: #F3F5F8;--text-secondary: #C5CBD6;--text-muted: #828D9F;--text-dim: #545F72;--emerald: #10B981;--emerald-soft: rgba(16, 185, 129, .12);--emerald-border: rgba(16, 185, 129, .28);--up: var(--emerald);--up-soft: var(--emerald-soft);--rose: #F43F5E;--rose-soft: rgba(244, 63, 94, .12);--rose-border: rgba(244, 63, 94, .28);--down: var(--rose);--down-soft: var(--rose-soft);--sky: #38BDF8;--sky-soft: rgba(56, 189, 248, .12);--sky-border: rgba(56, 189, 248, .28);--radius-xs: 8px;--radius-sm: 12px;--radius-md: 16px;--radius-lg: 20px;--radius-xl: 24px;--radius-2xl: 30px;--radius-pill: 9999px;--font-serif: "Cinzel", serif;--font-sans: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .25);--shadow-card: 0 10px 30px -6px rgba(0, 0, 0, .45), 0 2px 8px -2px rgba(0, 0, 0, .3);--shadow-floating: 0 18px 48px -10px rgba(0, 0, 0, .6), 0 4px 16px -2px rgba(0, 0, 0, .35);--shadow-glow: 0 0 24px rgba(212, 175, 55, .16)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg);background-image:radial-gradient(circle at 18% 10%,rgba(212,175,55,.025) 0%,transparent 40%),radial-gradient(circle at 82% 80%,rgba(16,185,129,.02) 0%,transparent 45%);color:var(--text);font-family:var(--font-sans);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--surface-active);border-radius:var(--radius-pill)}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.app-layout{display:flex;min-height:100vh;background-color:var(--bg);position:relative}.sidebar-backdrop{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000000a6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:60;transition:opacity .25s ease}.sidebar{width:268px;position:fixed;top:16px;bottom:16px;left:16px;background:#10151ceb;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);border:1px solid var(--border);border-radius:var(--radius-xl);display:flex;flex-direction:column;z-index:70;box-shadow:var(--shadow-floating);transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}.sidebar-header{padding:22px 20px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between}.sidebar-brand-box{display:flex;align-items:center;gap:12px}.sidebar-logo{height:38px;width:auto;object-fit:contain;filter:brightness(0) invert(1)}.sidebar-brand{font-family:var(--font-serif);font-size:15px;font-weight:700;letter-spacing:.6px;color:var(--text);line-height:1.2}.sidebar-sub{font-size:10.5px;color:var(--accent);text-transform:uppercase;letter-spacing:1.2px;font-weight:600;margin-top:2px}.sidebar-close-btn{display:none;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:6px;border-radius:var(--radius-xs)}.sidebar-nav{padding:20px 14px;flex:1;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.nav-item{display:flex;align-items:center;gap:12px;padding:11px 16px;border-radius:var(--radius-md);color:var(--text-muted);text-decoration:none;font-weight:500;font-size:13.5px;transition:all .2s cubic-bezier(.16,1,.3,1);cursor:pointer;border:1px solid transparent;background:transparent;text-align:left;width:100%}.nav-item:hover{background-color:var(--surface-alt);color:var(--text);transform:translate(2px)}.nav-item.active{background-color:var(--accent-soft);color:var(--accent-text);border-color:var(--accent-border);font-weight:600;box-shadow:0 4px 14px #d4af371a}.sidebar-footer{padding:16px 14px;border-top:1px solid var(--border-subtle);background:#0000002e;border-radius:0 0 var(--radius-xl) var(--radius-xl)}.user-profile{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:var(--radius-md);background:var(--surface-alt);border:1px solid var(--border-subtle)}.user-info{display:flex;align-items:center;gap:10px;min-width:0}.user-avatar{width:34px;height:34px;border-radius:var(--radius-pill);background:linear-gradient(135deg,#d4af3733,#10b98126);border:1px solid var(--accent-border);display:flex;align-items:center;justify-content:center;color:var(--accent-text);font-weight:700;font-size:13px;flex-shrink:0}.user-name{font-weight:600;font-size:12.5px;color:var(--text);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-role{font-size:10.5px;color:var(--accent);font-weight:500}.main-content{margin-left:300px;flex:1;display:flex;flex-direction:column;min-height:100vh;padding:16px 24px 32px 0;max-width:1560px}.header{min-height:64px;background:#10151cd1;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:16px;z-index:40;box-shadow:var(--shadow-card);margin-bottom:24px}.header-left{display:flex;align-items:center;gap:14px}.menu-toggle-btn{display:none;background:var(--surface-alt);border:1px solid var(--border);color:var(--text);padding:8px;border-radius:var(--radius-sm);cursor:pointer;align-items:center;justify-content:center}.header-title-box{display:flex;align-items:center;gap:12px}.header-title{font-size:17.5px;font-weight:700;color:var(--text);letter-spacing:-.3px}.header-actions{display:flex;align-items:center;gap:12px}.content-body{display:flex;flex-direction:column;gap:24px;flex:1}.grid-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.stat-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px 24px;display:flex;align-items:flex-start;justify-content:space-between;box-shadow:var(--shadow-card);transition:all .25s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.stat-card:hover{border-color:var(--border-light);transform:translateY(-2px);box-shadow:var(--shadow-floating)}.stat-title{font-size:12.5px;color:var(--text-muted);font-weight:500;margin-bottom:8px;display:flex;align-items:center;gap:6px}.stat-value{font-size:26px;font-weight:700;color:var(--text);letter-spacing:-.8px;line-height:1.2}.stat-sub{font-size:12px;color:var(--text-dim);margin-top:6px}.stat-icon{width:44px;height:44px;border-radius:var(--radius-md);background-color:var(--surface-alt);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--accent-text);flex-shrink:0;transition:all .25s ease}.stat-card:hover .stat-icon{border-color:var(--accent-border);background-color:var(--accent-soft)}.panel-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);overflow:hidden;transition:border-color .2s ease}.panel-card-header{padding:20px 26px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.panel-card-title{font-size:15.5px;font-weight:700;color:var(--text);letter-spacing:-.3px}.panel-card-body{padding:24px 26px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 18px;border-radius:var(--radius-md);font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .2s cubic-bezier(.16,1,.3,1);text-decoration:none;font-family:inherit;line-height:1.3}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg,#dfbe55,#c79e2a);color:#0e1319;border:none;box-shadow:0 4px 14px #d4af3740;font-weight:600}.btn-primary:hover{background:linear-gradient(135deg,#e9ca65,#d4ab34);box-shadow:0 6px 20px #d4af3759;transform:translateY(-1px)}.btn-secondary{background-color:var(--surface-alt);color:var(--text-secondary);border:1px solid var(--border)}.btn-secondary:hover{background-color:var(--surface-hover);color:var(--text);border-color:var(--border-light);transform:translateY(-1px)}.btn-danger{background-color:var(--rose-soft);color:var(--rose);border:1px solid var(--rose-border)}.btn-danger:hover{background-color:var(--rose);color:#fff;box-shadow:0 4px 14px #f43f5e4d}.btn-emerald{background-color:var(--emerald-soft);color:var(--emerald);border:1px solid var(--emerald-border)}.btn-emerald:hover{background-color:var(--emerald);color:#0e1319;font-weight:700}.btn-sm{padding:6px 12px;font-size:12px;border-radius:var(--radius-sm);gap:5px}.btn-icon{width:36px;height:36px;padding:0;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:var(--radius-pill);font-size:11.5px;font-weight:600;letter-spacing:.2px}.badge-gold{background-color:var(--accent-soft);color:var(--accent-text);border:1px solid var(--accent-border)}.badge-success{background-color:var(--emerald-soft);color:var(--emerald);border:1px solid var(--emerald-border)}.badge-danger{background-color:var(--rose-soft);color:var(--rose);border:1px solid var(--rose-border)}.badge-muted{background-color:var(--surface-alt);color:var(--text-muted);border:1px solid var(--border)}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table{width:100%;border-collapse:separate;border-spacing:0;text-align:left}.table th{padding:13px 18px;font-size:11.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);background-color:var(--surface-elevated);border-bottom:1px solid var(--border-subtle);font-weight:600;white-space:nowrap}.table th:first-child{border-top-left-radius:var(--radius-sm);border-bottom-left-radius:var(--radius-sm)}.table th:last-child{border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm)}.table td{padding:15px 18px;border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);vertical-align:middle;font-size:13.5px;transition:background-color .15s ease}.table tr:last-child td{border-bottom:none}.table tbody tr:hover td{background-color:#ffffff05;color:var(--text)}.form-group{margin-bottom:18px}.form-label{display:block;font-size:12.5px;font-weight:600;margin-bottom:7px;color:var(--text-secondary)}.form-hint{font-size:11.5px;color:var(--text-muted);margin-top:5px}.form-input,.form-textarea,.form-select{width:100%;background-color:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-md);padding:11px 16px;color:var(--text);font-size:13.5px;font-family:inherit;transition:all .2s cubic-bezier(.16,1,.3,1);outline:none}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--accent);background-color:var(--surface-elevated);box-shadow:0 0 0 3px var(--accent-soft)}.form-textarea{resize:vertical;min-height:90px}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000000bf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;animation:fadeIn .2s ease-out}.modal-content{background-color:var(--surface);border:1px solid var(--border-light);border-radius:var(--radius-2xl);width:100%;max-width:640px;max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow-floating);overflow:hidden;animation:modalScale .25s cubic-bezier(.16,1,.3,1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalScale{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{padding:22px 28px;border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:16.5px;font-weight:700;color:var(--text);letter-spacing:-.3px}.modal-body{padding:26px 28px;overflow-y:auto;flex:1}.modal-footer{padding:18px 28px;border-top:1px solid var(--border-subtle);background-color:#0000002e;display:flex;align-items:center;justify-content:flex-end;gap:12px}.image-upload-box{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:26px;text-align:center;cursor:pointer;background-color:var(--surface-alt);transition:all .2s ease;position:relative;overflow:hidden;display:block}.image-upload-box:hover{border-color:var(--accent);background-color:var(--accent-soft)}.image-preview{width:100%;max-height:200px;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--border)}.checkbox-label{display:flex;align-items:center;gap:12px;cursor:pointer;font-weight:500;-webkit-user-select:none;user-select:none;font-size:13.5px}.checkbox-custom{width:20px;height:20px;border-radius:var(--radius-xs);border:1px solid var(--border-light);background-color:var(--surface-alt);display:flex;align-items:center;justify-content:center;color:transparent;transition:all .2s cubic-bezier(.16,1,.3,1);flex-shrink:0}input[type=checkbox]:checked+.checkbox-custom{background:linear-gradient(135deg,#dfbe55,#c79e2a);border-color:var(--accent);color:#0e1319}.filter-tabs{display:flex;align-items:center;gap:6px;background-color:var(--surface-elevated);padding:5px;border-radius:var(--radius-pill);border:1px solid var(--border-subtle)}.filter-tab{padding:6px 14px;border-radius:var(--radius-pill);font-size:12.5px;font-weight:600;border:none;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .2s ease}.filter-tab:hover{color:var(--text)}.filter-tab.active{background-color:var(--accent-soft);color:var(--accent-text);box-shadow:0 2px 8px #00000040}.pulse-dot{width:8px;height:8px;border-radius:50%;position:relative;display:inline-block}.pulse-dot.green{background-color:var(--emerald);box-shadow:0 0 10px var(--emerald)}.pulse-dot.green:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:2px solid var(--emerald);animation:pulseAnim 2s infinite}@keyframes pulseAnim{0%{transform:scale(.9);opacity:.8}50%{transform:scale(1.6);opacity:0}to{transform:scale(.9);opacity:0}}.spin{animation:spinAnim 1s linear infinite}@keyframes spinAnim{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 30%,#151c26,#090c10 75%);padding:24px}.login-card{width:100%;max-width:440px;background:#10151ce6;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);border:1px solid var(--border-light);border-radius:var(--radius-2xl);padding:40px;box-shadow:var(--shadow-floating);position:relative;overflow:hidden}.login-logo{height:54px;width:auto;object-fit:contain;margin:0 auto 18px;display:block;filter:brightness(0) invert(1)}.login-title{font-family:var(--font-serif);font-size:21px;font-weight:700;text-align:center;margin-bottom:4px;letter-spacing:.6px;color:var(--text)}.login-sub{font-size:13px;color:var(--text-muted);text-align:center;margin-bottom:30px}@media(max-width:1200px){.grid-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){.sidebar{width:250px}.main-content{margin-left:280px;padding-right:18px}}@media(max-width:768px){.sidebar-backdrop{display:block;opacity:0;pointer-events:none}.sidebar-backdrop.active{opacity:1;pointer-events:auto}.sidebar{position:fixed;top:0;bottom:0;left:0;margin:0;border-radius:0 var(--radius-xl) var(--radius-xl) 0;width:280px;transform:translate(-105%);transition:transform .3s cubic-bezier(.16,1,.3,1)}.sidebar.open{transform:translate(0)}.sidebar-close-btn{display:flex}.main-content{margin-left:0;padding:12px 14px 28px}.header{top:10px;margin-bottom:18px;padding:10px 14px;border-radius:var(--radius-md)}.menu-toggle-btn{display:flex}.grid-stats{grid-template-columns:1fr;gap:14px}.panel-card-header,.panel-card-body{padding:18px}.form-row{grid-template-columns:1fr}.filter-tabs{width:100%;overflow-x:auto;justify-content:flex-start}}.switch-control{position:relative;display:inline-block;width:56px;height:30px;flex-shrink:0}.switch-control input{opacity:0;width:0;height:0;position:absolute}.switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--surface-alt);border:1px solid var(--border-light);border-radius:var(--radius-pill);transition:all .25s cubic-bezier(.4,0,.2,1)}.switch-slider:before{position:absolute;content:"";height:22px;width:22px;left:3px;bottom:3px;background-color:var(--text-muted);border-radius:50%;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 5px #00000059}.switch-control input:checked+.switch-slider{background-color:var(--emerald);border-color:var(--emerald);box-shadow:0 0 16px #10b98166}.switch-control input:checked+.switch-slider:before{transform:translate(26px);background-color:#fff}.switch-control input:focus-visible+.switch-slider{outline:2px solid var(--accent);outline-offset:2px}
