:root{
  --accent:#8b5cf6;
  --accent-hover:#7c3aed;
  --line:#26262f;
  --surface:#121216;
  --elevated:#18181f;
  --base:#0a0a0c;
}

*{-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;background:#0a0a0c;}
body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;}

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:#2a2a33;border-radius:10px;border:2px solid var(--base);}
::-webkit-scrollbar-thumb:hover{background:#3a3a46;}
*{scrollbar-width:thin;scrollbar-color:#2a2a33 transparent;}

@keyframes pageEnter{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.page-enter{animation:pageEnter .45s cubic-bezier(.22,1,.36,1);}

@keyframes rowIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.stagger>*{animation:rowIn .4s cubic-bezier(.22,1,.36,1) both;}
.stagger>*:nth-child(1){animation-delay:.02s;}
.stagger>*:nth-child(2){animation-delay:.05s;}
.stagger>*:nth-child(3){animation-delay:.08s;}
.stagger>*:nth-child(4){animation-delay:.11s;}
.stagger>*:nth-child(5){animation-delay:.14s;}
.stagger>*:nth-child(6){animation-delay:.17s;}
.stagger>*:nth-child(7){animation-delay:.2s;}
.stagger>*:nth-child(8){animation-delay:.23s;}

.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;}
.card-hover{transition:border-color .25s,transform .25s,box-shadow .25s;}
.card-hover:hover{border-color:rgba(139,92,246,.35);transform:translateY(-2px);box-shadow:0 12px 40px -18px rgba(139,92,246,.35);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1.05rem;border-radius:.7rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.22,1,.36,1);border:1px solid transparent;white-space:nowrap;line-height:1;user-select:none;}
.btn:active{transform:scale(.97);}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.btn svg{width:1.05rem;height:1.05rem;}
.btn-sm{padding:.45rem .75rem;font-size:.8rem;border-radius:.6rem;}
.btn-icon{padding:.5rem;border-radius:.6rem;}
.btn-primary{background:linear-gradient(135deg,var(--accent),#a855f7);color:#fff;box-shadow:0 6px 20px -8px rgba(139,92,246,.7);}
.btn-primary:hover:not(:disabled){box-shadow:0 8px 26px -6px rgba(139,92,246,.8);transform:translateY(-1px);}
.btn-ghost{background:rgba(255,255,255,.04);color:#e4e4e7;border-color:var(--line);}
.btn-ghost:hover:not(:disabled){background:rgba(255,255,255,.08);border-color:#3a3a46;}
.btn-danger{background:rgba(244,63,94,.1);color:#fb7185;border-color:rgba(244,63,94,.2);}
.btn-danger:hover:not(:disabled){background:rgba(244,63,94,.18);}
.btn-subtle{background:transparent;color:#a1a1aa;}
.btn-subtle:hover:not(:disabled){background:rgba(255,255,255,.06);color:#fff;}

.label{display:block;font-size:.8rem;font-weight:500;color:#a1a1aa;margin-bottom:.4rem;}
.input,.select,textarea.input{width:100%;background:var(--base);border:1px solid var(--line);border-radius:.7rem;padding:.65rem .85rem;font-size:.875rem;color:#fff;transition:border-color .2s,box-shadow .2s;outline:none;font-family:inherit;}
.input:focus,.select:focus,textarea.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(139,92,246,.15);}
.input::placeholder{color:#52525b;}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2.25rem;cursor:pointer;}
.input-icon{position:relative;}
.input-icon svg{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);color:#52525b;width:1.05rem;height:1.05rem;pointer-events:none;}
.input-icon .input{padding-left:2.5rem;}

.data-table{width:100%;border-collapse:separate;border-spacing:0;}
.data-table thead th{text-align:left;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#71717a;padding:.85rem 1rem;border-bottom:1px solid var(--line);white-space:nowrap;}
.data-table tbody td{padding:.85rem 1rem;border-bottom:1px solid rgba(38,38,47,.6);font-size:.875rem;color:#d4d4d8;vertical-align:middle;}
.data-table tbody tr{transition:background .18s;}
.data-table tbody tr:hover{background:rgba(255,255,255,.02);}
.data-table tbody tr:last-child td{border-bottom:none;}

.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;}

.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity .25s;}
.modal.open{opacity:1;pointer-events:auto;}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);}
.modal-panel{position:relative;width:100%;max-width:34rem;background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 80px -20px rgba(0,0,0,.8);transform:scale(.95) translateY(12px);opacity:0;transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .3s;max-height:calc(100vh - 2rem);display:flex;flex-direction:column;}
.modal.open .modal-panel{transform:none;opacity:1;}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid var(--line);}
.modal-body{padding:1.5rem;overflow-y:auto;}
.modal-foot{display:flex;gap:.75rem;justify-content:flex-end;padding:1rem 1.5rem;border-top:1px solid var(--line);}

.toast{pointer-events:auto;display:flex;align-items:center;gap:.75rem;min-width:16rem;max-width:22rem;padding:.85rem 1rem;border-radius:.85rem;background:var(--elevated);border:1px solid var(--line);box-shadow:0 16px 40px -12px rgba(0,0,0,.6);transform:translateX(120%);opacity:0;transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .3s;font-size:.875rem;color:#e4e4e7;}
.toast.show{transform:none;opacity:1;}
.toast-icon{flex-shrink:0;width:1.9rem;height:1.9rem;border-radius:.6rem;display:flex;align-items:center;justify-content:center;}
.toast-success .toast-icon{background:rgba(16,185,129,.15);color:#34d399;}
.toast-error .toast-icon{background:rgba(244,63,94,.15);color:#fb7185;}
.toast-info .toast-icon{background:rgba(139,92,246,.15);color:#a78bfa;}

.switch{position:relative;display:inline-flex;height:1.55rem;width:2.85rem;flex-shrink:0;cursor:pointer;border-radius:9999px;background:#3f3f46;transition:background .25s;border:none;padding:0;}
.switch.on{background:var(--accent);}
.switch-dot{position:absolute;top:.2rem;left:.2rem;height:1.15rem;width:1.15rem;border-radius:9999px;background:#fff;transition:transform .25s cubic-bezier(.22,1,.36,1);box-shadow:0 2px 6px rgba(0,0,0,.3);}
.switch.on .switch-dot{transform:translateX(1.3rem);}

.dropdown{position:relative;}
.dropdown-menu{position:absolute;right:0;top:calc(100% + .4rem);min-width:11rem;background:var(--elevated);border:1px solid var(--line);border-radius:.85rem;box-shadow:0 20px 50px -15px rgba(0,0,0,.7);padding:.35rem;z-index:30;opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none;transition:opacity .18s,transform .18s;transform-origin:top right;}
.dropdown.open .dropdown-menu{opacity:1;transform:none;pointer-events:auto;}
.dropdown-item{display:flex;align-items:center;gap:.6rem;width:100%;padding:.55rem .7rem;border-radius:.55rem;font-size:.82rem;color:#d4d4d8;cursor:pointer;transition:background .15s,color .15s;background:none;border:none;text-align:left;}
.dropdown-item:hover{background:rgba(255,255,255,.06);color:#fff;}
.dropdown-item.danger{color:#fb7185;}
.dropdown-item.danger:hover{background:rgba(244,63,94,.12);}
.dropdown-item svg{width:1rem;height:1rem;flex-shrink:0;}

.stat-card{position:relative;overflow:hidden;}
.stat-card::before{content:"";position:absolute;top:-40%;right:-10%;width:9rem;height:9rem;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.14),transparent 70%);}

.dropzone{border:1.5px dashed var(--line);border-radius:.9rem;padding:1.75rem;text-align:center;transition:border-color .2s,background .2s;cursor:pointer;}
.dropzone:hover,.dropzone.drag{border-color:var(--accent);background:rgba(139,92,246,.05);}

.spin{animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.empty-state{text-align:center;padding:3.5rem 1rem;color:#52525b;}
.empty-state svg{margin:0 auto 1rem;width:2.5rem;height:2.5rem;opacity:.5;}

.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .6rem;border-radius:.5rem;font-size:.75rem;font-weight:500;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#a1a1aa;}

.tip-trigger{cursor:help;display:inline-block;}
.tip-float{position:fixed;z-index:70;background:var(--elevated);border:1px solid var(--line);border-radius:.6rem;padding:.6rem .75rem;box-shadow:0 16px 40px -12px rgba(0,0,0,.75);font-size:.78rem;color:#d4d4d8;max-width:18rem;opacity:0;transform:translateY(4px);transition:opacity .16s,transform .16s;pointer-events:none;display:none;}
.tip-float.show{opacity:1;transform:none;}
.tip-float .tip-line{line-height:1.5;word-break:break-word;}
.tip-float .tip-muted{color:#71717a;}
.tip-float .tip-bad{color:#fb7185;font-weight:600;}
.tip-float .tip-ok{color:#34d399;font-weight:600;}

.pagination-btn{min-width:2.25rem;justify-content:center;}

.brand{display:flex;align-items:center;justify-content:center;max-width:100%;line-height:0;}
.brand svg{height:100%;width:auto;max-width:100%;display:block;}