*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f1117;--bg-card:#1a1d27;--bg-card-hover:#222633;--bg-input:#141720;--border:#2a2e3d;--text:#e4e6ef;--text-dim:#8b8fa3;--accent:#6c5ce7;--accent-hover:#7c6ff7;--green:#00d68f;--red:#ff4d6a;--yellow:#ffc107;--blue:#4da6ff;--radius:8px;--shadow:0 2px 12px rgba(0,0,0,.3)}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;min-height:100vh}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}.layout{display:flex;min-height:100vh}.sidebar{background:var(--bg-card);border-right:1px solid var(--border);bottom:0;display:flex;flex-direction:column;left:0;padding:24px 0;position:fixed;top:0;width:240px;z-index:10}.sidebar-logo{border-bottom:1px solid var(--border);color:var(--accent);font-size:18px;font-weight:700;letter-spacing:-.5px;padding:0 24px 24px}.sidebar-logo span{color:var(--text-dim);display:block;font-size:12px;font-weight:400}.sidebar-nav{flex:1;padding:16px 12px}.sidebar-nav a{align-items:center;border-radius:var(--radius);color:var(--text-dim);display:flex;font-size:14px;font-weight:500;gap:10px;margin-bottom:2px;padding:10px 14px;transition:all .15s}.sidebar-nav a:hover{background:var(--bg-card-hover);color:var(--text)}.sidebar-nav a.router-link-active{background:var(--accent);color:#fff}.main-content{flex:1;margin-left:240px;max-width:1200px;padding:32px}.page-header{align-items:center;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;margin-bottom:28px}.page-header h1{font-size:24px;font-weight:700;margin-bottom:4px}.page-header p{color:var(--text-dim);font-size:14px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;padding:20px}.stat-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:28px}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.stat-card .label{color:var(--text-dim);font-size:12px;letter-spacing:.5px;text-transform:uppercase}.stat-card .value{font-size:28px;font-weight:700;margin-top:4px}.stat-card .value.green{color:var(--green)}.stat-card .value.red{color:var(--red)}.stat-card .value.blue{color:var(--blue)}.stat-card .value.yellow{color:var(--yellow)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;font-size:14px;width:100%}th{border-bottom:2px solid var(--border);color:var(--text-dim);font-size:12px;font-weight:600;letter-spacing:.5px;padding:10px 14px;text-align:left;text-transform:uppercase}td{border-bottom:1px solid var(--border);padding:12px 14px;vertical-align:middle}tr:hover td{background:var(--bg-card-hover)}.btn{align-items:center;border:none;border-radius:var(--radius);cursor:pointer;display:inline-flex;font-family:inherit;font-size:13px;font-weight:600;gap:6px;padding:8px 16px;transition:all .15s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-danger{background:var(--red);color:#fff}.btn-danger:hover{opacity:.85}.btn-sm{font-size:12px;padding:5px 10px}.btn:disabled{cursor:not-allowed;opacity:.5}.form-group{margin-bottom:16px}.form-group label{color:var(--text-dim);display:block;font-size:12px;font-weight:600;letter-spacing:.5px;margin-bottom:6px;text-transform:uppercase}.form-group input,.form-group select,.form-input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:inherit;font-size:14px;padding:10px 14px;transition:border-color .15s;width:100%}.form-group input:focus,.form-group select:focus,.form-input:focus{border-color:var(--accent);outline:none}.form-group input[type=checkbox]{margin-right:6px;vertical-align:middle;width:auto}.form-group select option{background:var(--bg-card);color:var(--text)}.badge{border-radius:4px;display:inline-block;font-size:11px;font-weight:700;letter-spacing:.3px;padding:3px 8px;text-transform:uppercase}.badge-green{background:#00d68f26;color:var(--green)}.badge-red{background:#ff4d6a26;color:var(--red)}.badge-yellow{background:#ffc10726;color:var(--yellow)}.badge-blue{background:#4da6ff26;color:var(--blue)}.mono{background:var(--bg-input);border-radius:4px;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:12px;padding:2px 6px}.modal-overlay{align-items:center;background:#0009;display:flex;inset:0;justify-content:center;position:fixed;z-index:100}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);max-width:560px;min-width:420px;padding:28px}.modal h2{font-size:18px;margin-bottom:20px}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.toast-container{display:flex;flex-direction:column;gap:8px;position:fixed;right:20px;top:20px;z-index:200}.toast{animation:slideIn .2s ease;border-radius:var(--radius);box-shadow:var(--shadow);font-size:13px;font-weight:500;padding:12px 20px}.toast-success{background:var(--green);color:#000}.toast-error{background:var(--red);color:#fff}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.key-detail{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);font-family:SF Mono,Fira Code,Consolas,monospace;font-size:12px;line-height:1.8;margin-top:12px;padding:14px;word-break:break-all}.toolbar{justify-content:space-between;margin-bottom:20px}.login-container,.toolbar{align-items:center;display:flex}.login-container{justify-content:center;min-height:100vh;padding:20px}.login-box{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);padding:40px;text-align:center;width:400px}.login-box h1{color:var(--accent);font-size:22px;margin-bottom:8px}.login-box p{color:var(--text-dim);font-size:13px;margin-bottom:28px}.empty-state{color:var(--text-dim);padding:48px 20px;text-align:center}.empty-state p{font-size:14px}.chart-container{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;padding:20px}.chart-container h3{color:var(--text);font-size:14px;font-weight:600;margin-bottom:16px}.charts-row{display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-bottom:16px}.bar-chart{align-items:flex-end;border-bottom:1px solid var(--border);display:flex;gap:8px;height:200px;padding:16px 0}.bar-chart .bar{background:var(--accent);border-radius:4px 4px 0 0;cursor:default;flex:1;min-width:30px;position:relative;transition:height .3s}.bar-chart .bar:hover{background:var(--accent-hover)}.bar-chart .bar-label{bottom:-24px;color:var(--text-dim)}.bar-chart .bar-label,.bar-chart .bar-value{font-size:11px;left:50%;position:absolute;transform:translate(-50%);white-space:nowrap}.bar-chart .bar-value{color:var(--text);top:-20px}.pie-chart{border-radius:50%;flex-shrink:0;height:180px;position:relative;width:180px}.pie-chart-wrapper{align-items:center;display:flex;gap:24px;padding:16px 0}.pie-legend{display:flex;flex-direction:column;gap:8px}.pie-legend-item{align-items:center;display:flex;font-size:13px;gap:8px}.pie-legend-dot{border-radius:50%;flex-shrink:0;height:12px;width:12px}.toggle{cursor:pointer;display:inline-block;height:24px;position:relative;width:44px}.toggle input{height:0;opacity:0;width:0}.toggle-slider{background:var(--border);border-radius:24px;inset:0;position:absolute;transition:background .2s}.toggle-slider:before{background:#fff;border-radius:50%;content:"";height:18px;left:3px;position:absolute;top:3px;transition:transform .2s;width:18px}.toggle input:checked+.toggle-slider{background:var(--accent)}.toggle input:checked+.toggle-slider:before{transform:translate(20px)}.setting-row{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:14px 0}.setting-row:last-child{border-bottom:none}.setting-label{font-weight:500}.setting-label small{color:var(--text-dim);display:block;font-size:12px;font-weight:400;margin-top:2px}.setting-value{color:var(--text-dim);font-family:SF Mono,Fira Code,Consolas,monospace;font-size:13px}.checkbox-grid{display:grid;gap:8px;grid-template-columns:1fr 1fr}.checkbox-grid label{align-items:center;color:var(--text);cursor:pointer;display:flex;font-size:13px;font-weight:400;gap:6px;letter-spacing:0;text-transform:none}.checkbox-grid label input[type=checkbox]{accent-color:var(--accent);height:16px;width:16px}.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text)}.btn-outline:hover{border-color:var(--accent);color:var(--accent)}.btn-secondary{background:var(--border);color:var(--text)}.btn-secondary:hover{background:var(--bg-card-hover)}