/* Staff hub. Builds on /assets/css/site.css. */
.btn-small { padding: .45rem .9rem; font-size: .9rem; }
body.staff { min-height: 100vh; display: flex; flex-direction: column; background: radial-gradient(1200px 700px at 50% 10%, #0d1c38 0%, var(--bg) 60%); }
.staff-main { flex: 1; width: 100%; max-width: 960px; margin: 0 auto; padding: 2rem var(--pad) 3rem; }
.site-header .container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.staff-nav { display: flex; align-items: center; gap: .9rem; color: var(--muted); font-size: .9rem; }
.staff-nav [hidden], .staff-email[hidden] { display: none !important; }
.staff-navlink { color: var(--text); text-decoration: none; white-space: nowrap; }
.staff-navlink:hover, .staff-navlink:focus-visible { color: var(--warm); text-decoration: underline; }
.staff-email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 34ch; }
.staff-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 2rem; margin-top: 1rem; max-width: 560px; }
.staff-card form { display: grid; gap: .6rem; margin-top: 1rem; }
.staff-card input { padding: .7rem .9rem; border-radius: 10px; border: 1px solid var(--line); background: var(--bg-2); color: var(--text); font: inherit; }
.preview-banner { border: 1px dashed var(--warm); color: var(--warm); border-radius: 10px; padding: .5rem .8rem; font-size: .85rem; text-align: center; }
.hub-title { font-family: var(--font-display); font-weight: 500; margin: .25rem 0 1.5rem; }
.hub-grid { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.hub-tile { position: relative; display: flex; flex-direction: column; gap: .35rem; height: 100%; padding: 1.5rem; border-radius: var(--radius);
  background: var(--surface); border: 1px solid var(--line); color: var(--text); text-decoration: none; transition: border-color .15s, transform .15s; }
.hub-tile:hover, .hub-tile:focus-visible { border-color: var(--warm); transform: translateY(-2px); outline: none; }
.hub-sophia { background: linear-gradient(160deg, rgba(139,92,246,.22), rgba(255,95,210,.08) 60%, rgba(45,226,196,.06)); border-color: rgba(180,124,255,.4); }
.hub-name { font-family: var(--font-display); font-size: 1.4rem; }
.hub-desc { color: var(--muted); font-size: .95rem; }
.hub-icon { font-size: 1.6rem; color: var(--warm); }
.hub-orb { width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(circle at 38% 32%, #fff 0%, #ffb3ec 22%, #ff5fd2 45%, #7b3cf0 75%, #1b0a35 100%); box-shadow: 0 0 22px rgba(255,95,210,.55); }
.hub-tag { position: absolute; top: 1rem; right: 1rem; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--warm); border: 1px solid rgba(243,207,142,.4); border-radius: 999px; padding: .15rem .5rem; }
@media (max-width: 600px) { .staff-email { display: none; } .brand-name { font-size: .95rem; } }

/* 9 Nov 2026 (Jamie t451u): staff moderation runs inside /staff/ with the staff look */
.staff-crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; padding: 0; margin: 0 0 .5rem; color: var(--muted); font-size: .9rem; }
.staff-crumbs li + li::before { content: "›"; margin-right: .4rem; color: var(--line); }
.staff-crumbs a { color: var(--brand-steel); }
.staff-exit { margin-top: 1.5rem; font-size: .95rem; color: var(--muted); }
.staff-exit a { color: var(--brand-steel); }
.staff-card.wide { max-width: none; }
.staff-card h2 { font-family: var(--font-display); font-weight: 500; font-size: 1.3rem; margin: 1.75rem 0 .5rem; }
.staff-card .tiny { font-size: .8rem; }
.mod-list { list-style: none; padding: 0; margin: .5rem 0; display: grid; gap: .75rem; }
.mod-item { background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 1rem; display: grid; gap: .4rem; justify-items: start; }
.mod-item.urgent { border-color: #e07a7a; }
.mod-item .row-between { width: 100%; }
.row-between { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; }
.row { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.msg-body { white-space: pre-wrap; word-break: break-word; font-family: inherit; margin: .25rem 0; color: var(--text); }
blockquote.msg-body { border-left: 3px solid var(--line); padding-left: .8rem; margin-left: 0; }
.chip { display: inline-block; font-size: .78rem; border: 1px solid var(--line); border-radius: 999px; padding: .1rem .55rem; color: var(--muted); }
.chip.bad { border-color: #e07a7a; color: #f3a3a3; }
.notice { color: var(--warm); font-weight: 600; margin: .25rem 0; }
.err { color: #f3a3a3; min-height: 1.2em; }
.stack { display: grid; gap: .5rem; margin-top: 1rem; max-width: 560px; }
.stack select, .stack textarea { padding: .65rem .8rem; border-radius: 10px; border: 1px solid var(--line); background: var(--bg-2); color: var(--text); font: inherit; }
.stack textarea { min-height: 5rem; }
.check { display: flex; gap: .5rem; align-items: flex-start; font-size: .9rem; color: var(--muted); }
.confirm { border: 1px solid var(--warm); border-radius: 12px; padding: 1rem; background: rgba(243,207,142,.06); }
.btn-danger { background: #b84a4a; border-color: #b84a4a; color: #fff; }
.btn-danger:hover, .btn-danger:focus-visible { background: #c95b5b; }
.mod-log { padding-left: 1.2rem; display: grid; gap: .35rem; font-size: .9rem; color: var(--muted); }
.mod-log strong { color: var(--text); }
@media (max-width: 600px) { .staff-nav { gap: .6rem; } .staff-navlink { font-size: .85rem; } .staff-card { padding: 1.25rem; } }
/* phone header: logo + Staff home · Main site · Sign in/out must fit a 360–390 px screen */
@media (max-width: 480px) { .site-header .brand-name { display: none; } .staff-nav { gap: .55rem; } .site-header .btn-small { padding: .35rem .7rem; } }
