/* Mock-only Shell chrome — reproduces apps/web/components/Shell.tsx */
.shell { min-height: 100vh; background: var(--color-bg); display: grid; grid-template-rows: auto 1fr; }
.shell-nav {
  position: sticky; top: 0; z-index: 20;
  background: var(--color-brand); color: var(--color-brand-ink);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.shell-nav-inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 var(--space-5);
  display: flex; align-items: center; justify-content: space-between;
  height: 64px; gap: var(--space-5);
}
.shell-wordmark { font-weight: var(--weight-bold); font-size: var(--text-lg); letter-spacing: -.01em; color: var(--color-brand-ink); text-decoration: none; }
.shell-wordmark span { color: var(--color-brand-accent); }
.shell-nav-tabs { display: flex; gap: var(--space-4); font: var(--weight-semi) var(--text-sm)/1 var(--font-sans); }
.shell-nav-tabs a { color: var(--color-brand-ink); opacity: .7; text-decoration: none; padding: var(--space-2) 0; border-bottom: 2px solid transparent; }
.shell-nav-tabs a.active { opacity: 1; border-bottom-color: var(--color-brand-accent); }
.shell-nav-tabs a:hover { opacity: 1; }
.shell-nav-actions { display: flex; align-items: center; gap: var(--space-3); }
.shell-icon-btn {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,.06); color: var(--color-brand-ink);
  display: flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; position: relative;
}
.shell-icon-btn:hover { background: rgba(255,255,255,.12); }
.shell-icon-btn .badge { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--radius-pill); background: var(--color-alert); color: white; font: var(--weight-bold) 10px/16px var(--font-sans); display: flex; align-items: center; justify-content: center; }
.shell-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-brand-accent); color: var(--color-brand);
  display: flex; align-items: center; justify-content: center;
  font: var(--weight-bold) var(--text-sm)/1 var(--font-sans);
  cursor: pointer;
}
.shell-main { padding: var(--space-7) var(--space-5); }
.container { max-width: 1100px; margin: 0 auto; }
