/* Arcana Operational Layer */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --color-bg:#0a0a0a;--color-surface:#191919;--color-surface-2:#1a1c20;--color-border:#212327;--color-divider:#212327;
  --color-text:#fff;--color-text-muted:#7d8187;--color-text-faint:#4a4d52;
  --color-primary:#B38CFF;--color-success:#8CFFBF;--color-warning:#FFD36E;--color-error:#FF6B6B;
  --font-sans:Geist,Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  --text-xs:.625rem;--text-sm:.8125rem;--text-base:.875rem;--text-lg:1rem;--text-xl:1.125rem;
  --radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-pill:9999px;
  --sidebar-width:13rem;
}
html,body{height:100vh;overflow:hidden;background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-weight:400;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.app{display:grid;grid-template-columns:var(--sidebar-width) 1fr;height:100vh}

.sidebar{background:var(--color-bg);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow-y:auto}
.side-head{display:flex;align-items:center;gap:.5rem;padding:0 .75rem;height:3rem;border-bottom:1px solid var(--color-border);flex-shrink:0}
.side-head img{width:22px;height:22px}
.side-head span{font-size:var(--text-sm);color:var(--color-text);letter-spacing:-.02em}
.side-content{flex:1;display:flex;flex-direction:column;padding:.5rem .75rem;gap:0}
.side-section{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;padding:.75rem .5rem .25rem;font-weight:400}
.side-sep{height:1px;width:calc(100% - 1rem);margin:.125rem auto;background:var(--color-divider)}
.nav-item{display:flex;align-items:center;gap:.5rem;padding:.375rem .5rem;height:2rem;border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text-muted);transition:background .12s;cursor:pointer;border:none;background:none;width:100%;text-align:left;font-family:inherit;font-weight:400}
.nav-item:hover{background:rgba(255,255,255,.04);color:var(--color-text)}
.nav-item.active{background:rgba(255,255,255,.05);color:var(--color-text)}
.nav-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;border-radius:var(--radius-md)}
.nav-item.disabled{opacity:.3;cursor:default;pointer-events:none}.nav-item.disabled:hover{background:transparent;color:var(--color-text-muted)}
.side-footer{padding:.625rem .75rem;border-top:1px solid var(--color-border);margin-top:auto;flex-shrink:0}
.side-user{display:flex;align-items:center;gap:.5rem;margin-bottom:.375rem}
.side-avatar{width:1.5rem;height:1.5rem;border-radius:var(--radius-pill);background:rgba(179,140,255,.12);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-primary);flex-shrink:0}
.side-email{font-size:var(--text-sm);color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-id{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-faint);margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn-signout{width:100%;display:flex;align-items:center;justify-content:center;gap:.375rem;padding:.25rem .5rem;border-radius:var(--radius-pill);font-size:var(--text-sm);color:var(--color-text-muted);background:transparent;border:1px solid var(--color-border);cursor:pointer;font-family:inherit;font-weight:400;transition:all .12s}
.btn-signout:hover{color:var(--color-error);border-color:rgba(255,107,107,.25)}
.btn-signout:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}

.content{overflow-y:auto;background:var(--color-bg)}
.content-inner{max-width:1200px;margin:0 auto;padding:2rem 2.5rem}@media(max-width:768px){.content-inner{padding:1rem}}
.content h1{font-size:var(--text-xl);font-weight:400;letter-spacing:-.02em;color:var(--color-text);margin-bottom:1.25rem}

.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1rem}
@media(max-width:768px){.stats-grid{grid-template-columns:1fr}}
.stat{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1rem 1.25rem}
.stat-label{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.25rem}
.stat-value{font-size:1.25rem;font-weight:400;color:var(--color-text);line-height:1.2;letter-spacing:-.02em}
.stat-sub{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:.125rem}

.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:none}
.card-head{padding:.625rem 1rem;border-bottom:1px solid var(--color-border);background:var(--color-surface-2)}
.card-head h2{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em;font-weight:400}
.card-body{padding:1rem}
.empty-state{text-align:center;padding:2rem 1rem;color:var(--color-text-muted);font-size:var(--text-sm);line-height:1.6}
.empty-state code{font-family:var(--font-mono);font-size:var(--text-sm);background:var(--color-surface-2);padding:2px 8px;border-radius:var(--radius-sm);color:var(--color-text);border:1px solid var(--color-border)}

@keyframes shimmer{0%{background-position:-400% 0}100%{background-position:400% 0}}
.skel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1rem}
.skel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1rem 1.25rem}
.skel-line{height:12px;border-radius:3px;margin-bottom:8px;background:linear-gradient(100deg,var(--color-surface) 25%,var(--color-surface-2) 50%,var(--color-surface) 75%);background-size:400% 100%;animation:shimmer 1.8s infinite}.skel-line:last-child{margin-bottom:0}.w40{width:45%}.w60{width:65%}

.mobile-menu-btn{display:none}
@media(max-width:768px){
  .app{grid-template-columns:1fr}
  .sidebar{display:flex;position:fixed;inset:0;z-index:50;transform:translateX(-100%);transition:transform .25s cubic-bezier(.16,1,.3,1);width:18rem!important}
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay{display:none;position:fixed;inset:0;z-index:49;background:rgba(0,0,0,.5);pointer-events:none}
  .sidebar.open+.sidebar-overlay{display:block}
  .mobile-menu-btn{display:flex!important;position:fixed;top:.625rem;left:.625rem;z-index:51;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer}
  .stats-grid,.skel-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.skel-line{animation:none}}
