/* Bambooz shared design system — every subsite links this file.
   <link rel="stylesheet" href="/shared/bambooz-ui.css"> */

@font-face { font-family:'Figtree'; src:url('/shared/fonts/Figtree-Regular.ttf'); font-weight:400; font-display:swap; }
@font-face { font-family:'Figtree'; src:url('/shared/fonts/Figtree-Medium.ttf'); font-weight:500; font-display:swap; }
@font-face { font-family:'Figtree'; src:url('/shared/fonts/Figtree-SemiBold.ttf'); font-weight:600; font-display:swap; }
@font-face { font-family:'Figtree'; src:url('/shared/fonts/Figtree-Bold.ttf'); font-weight:700; font-display:swap; }
@font-face { font-family:'Tektur'; src:url('/shared/fonts/Tektur-SemiBold.ttf'); font-weight:600; font-display:swap; }

:root {
  --bg-primary:#0a0c0f; --bg-secondary:#0e1013; --bg-panel:#15181c;
  --bg-card-hover:#1b1f25; --bg-icon-well:#1f2328;
  --accent:#6ec69c; --accent-hover:#88d8b0; --accent-blue:#7fb8d6;
  --accent-gold:#d0a85f; --accent-danger:#e16f6f;
  --accent-surface:rgba(110,198,156,0.09);
  --text-primary:#e6e8eb; --text-secondary:#7e848c; --text-dim:#5a6068;
  --border-color:#22262c;
  --radius-card:12px; --radius-btn:8px;
  --font-body:'Figtree',system-ui,sans-serif; --font-brand:'Tektur',monospace;
}

.bz-body {
  background:var(--bg-primary); color:var(--text-primary);
  font-family:var(--font-body); line-height:1.6; min-height:100vh; margin:0;
  -webkit-font-smoothing:antialiased;
}

/* Unified top nav — identical on every subsite */
.bz-nav {
  display:flex; align-items:center; justify-content:space-between;
  height:56px; padding:0 24px; border-bottom:1px solid var(--border-color);
  background:var(--bg-primary); position:sticky; top:0; z-index:50;
}
.bz-nav-brand {
  font-family:var(--font-brand); font-weight:600; font-size:1rem;
  color:var(--text-primary); text-decoration:none; letter-spacing:.02em;
}
.bz-nav-brand .bz-dot { color:var(--accent); }
.bz-nav-sub { color:var(--text-secondary); font-size:.85rem; margin-left:10px; }
.bz-nav-links { display:flex; gap:4px; }
.bz-nav-links a {
  color:var(--text-secondary); text-decoration:none; font-size:.85rem;
  padding:6px 12px; border-radius:var(--radius-btn); transition:all .15s ease;
}
.bz-nav-links a:hover { color:var(--text-primary); background:var(--bg-panel); }
.bz-nav-links a.bz-active { color:var(--accent); background:var(--accent-surface); }

.bz-card {
  background:var(--bg-panel); border:1px solid var(--border-color);
  border-radius:var(--radius-card); padding:20px; transition:all .15s ease;
}
a.bz-card { display:block; text-decoration:none; color:var(--text-primary); }
a.bz-card:hover { background:var(--bg-card-hover); border-color:#2e3440; transform:translateY(-2px); }

.bz-btn {
  display:inline-block; padding:9px 18px; border-radius:var(--radius-btn);
  font-family:var(--font-body); font-weight:600; font-size:.9rem;
  border:1px solid var(--border-color); background:var(--bg-panel);
  color:var(--text-primary); cursor:pointer; text-decoration:none; transition:all .15s ease;
}
.bz-btn:hover { background:var(--bg-card-hover); }
.bz-btn-primary { background:var(--accent); border-color:var(--accent); color:#0a0c0f; }
.bz-btn-primary:hover { background:var(--accent-hover); border-color:var(--accent-hover); }

.bz-input {
  background:var(--bg-secondary); border:1px solid var(--border-color);
  border-radius:var(--radius-btn); color:var(--text-primary);
  font-family:var(--font-body); padding:9px 12px; font-size:.9rem;
}
.bz-input:focus { outline:none; border-color:var(--accent); }

.bz-badge {
  display:inline-block; font-size:.72rem; font-weight:600; padding:2px 9px;
  border-radius:999px; background:var(--accent-surface); color:var(--accent);
}
.bz-badge-dim { background:var(--bg-icon-well); color:var(--text-secondary); }