:root {
    --bg: #18181b;
    --card: rgba(39,39,42,0.25);
    --muted: #94a3b8;
  }
  
  html, body, #root {
    height: 100%;
  }
  
  body {
    margin: 0;
    padding: 0;
    background: var(--bg);
    color: #fff;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .container-centered { max-width: 1024px; margin-left: auto; margin-right: auto; }
  .clickable { cursor: pointer; }
  .text-muted { color: var(--muted); }
  
  .avatar-sm { width: 2.5rem; height: 2.5rem; border-radius: 9999px; object-fit: cover; }
  .avatar-md { width: 3.5rem; height: 3.5rem; border-radius: 9999px; object-fit: cover; }
  
  :focus { outline: 3px solid rgba(59,130,246,0.35); outline-offset: 2px; }