@font-face {
  font-family:Biryani;
  src:url("/assets/fonts/Biryani-Regular.woff2") format("woff2");
  font-weight:400;
  font-display:swap;
  ascent-override:126%;
  descent-override:50.5%;
}
@font-face {
  font-family:Biryani;
  src:url("/assets/fonts/Biryani-Bold.woff2") format("woff2");
  font-weight:700;
  font-display:swap;
  ascent-override:126%;
  descent-override:50.5%;
}
* { box-sizing:border-box; }
body { margin:0; color:#f5f5f8; background:#292b32; font:16px/1.55 Biryani,system-ui,sans-serif; }
.staff-brand, main { max-width:1180px; margin:auto; padding:20px clamp(16px,4vw,36px); }
.staff-brand { display:flex; align-items:center; gap:12px; font-weight:700; }
.staff-brand img { flex:none; object-fit:contain; }
.staff-brand p { margin:0; }
.staff-masthead { background:#fff; color:#161523; }
.staff-baseline { color:#5d5a75; font-size:.875rem; font-weight:400; }
.staff-nav { display:flex; align-items:center; flex-wrap:wrap; gap:8px 20px; margin-bottom:24px; }
a { color:inherit; text-underline-offset:3px; }
h1 { margin:0 0 12px; line-height:1.25; font-size:clamp(1.65rem,4vw,2.35rem); }
h2 { margin:20px 0 4px; font-size:1.15rem; }
.staff-note { margin:0 0 16px; color:#c9cbd4; font-size:.875rem; }
.staff-login { box-shadow:0 18px 45px #16171c80; border-radius:12px; max-width:440px; margin:24px auto; border:1px solid #555864; border-top:4px solid #fed20a; padding:clamp(18px,4vw,30px); background:#343640; }
label { display:block; font-weight:700; }
input { display:block; width:100%; min-height:44px; margin:4px 0 14px; padding:8px 10px; border:1px solid #838695; border-radius:6px; font:inherit; background:#202228; color:#fff; }
button { min-height:44px; padding:8px 14px; border:1px solid transparent; border-radius:8px; background:#fed20a; color:#161523; font:inherit; font-weight:700; cursor:pointer; }
:focus-visible { outline:2px solid #fed20a; outline-offset:3px; }
.staff-error { color:#ffb6bd; }
.question-feed { list-style:none; padding:0; margin:0; }
.question-feed p { margin:4px 0 0; overflow-wrap:anywhere; }
.question-feed time { color:#5d5a75; font-size:.8rem; font-variant-numeric:tabular-nums; }

.staff-overview {
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:end;
  gap:14px 24px;
  padding:0 0 22px;
  margin-bottom:24px;
  border-bottom:1px solid #50525d;
}
.staff-overview h1 { margin-bottom:6px; }
.staff-overview .staff-note { margin-bottom:0; }
.staff-context { margin:0 0 5px; color:#fed20a; font-size:.85rem; font-weight:700; }
.staff-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:28px; }
.lane-heading { display:flex; align-items:center; gap:10px; min-height:44px; margin-bottom:16px; }
.lane-heading h2 { margin:0; }
.lane-count { padding:2px 8px; border-radius:6px; background:#474a55; color:#fff; font-size:.8rem; font-variant-numeric:tabular-nums; }
.staff-columns section { min-width:0; }
.question-feed:not(.pinned-feed) { margin-left:5px; padding-left:20px; border-left:1px solid #696b76; }
.question-feed li { position:relative; margin:0 0 12px; }
.question-card {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:start;
  gap:8px;
  padding:16px;
  border:0;
  border-radius:9px;
  background:#f7f7fa;
  color:#161523;
  box-shadow:0 3px 10px #16171c40;
}
.question-feed:not(.pinned-feed) li::before {
  content:"";
  position:absolute;
  top:20px;
  left:-25px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#fed20a;
}
.question-feed:not(.pinned-feed) li.is-seen > .question-card {
  background:#1e2026;
  color:#e7e8ed;
  box-shadow:inset 0 0 0 1px #464954;
}
.question-feed:not(.pinned-feed) .is-seen time { color:#bfc2ce; }
.question-feed:not(.pinned-feed) li.is-seen::before { background:#b8bac5; }
.question-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:6px; }
.question-actions button {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:44px;
  padding:0 8px;
  font-size:.78rem;
  transition:background-color .16s ease, border-color .16s ease;
  border:1px solid #c3c5ce;
  background:#fff;
  color:#292b32;
}
.question-actions button[aria-pressed="true"], .question-actions button:hover { background:#fed20a; border-color:#a78a00; }
.question-feed:not(.pinned-feed) .is-seen .question-actions button:not(.question-unread):not(:hover) {
  background:#30333c;
  color:#e7e8ed;
  border-color:#595d6b;
}
.question-actions button:disabled { cursor:wait; }
#status { margin-top:12px; }
@media (max-width:700px) { .staff-columns { grid-template-columns:1fr; gap:16px; } }
@media (prefers-reduced-motion:reduce) { .question-actions button { transition:none; } }

.staff-overview { align-items:center; }
.staff-preview {
  display:grid;
  place-items:center;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#16171c;
  border:1px solid #51535f;
  border-radius:9px;
  color:#c9cbd4;
  font-size:.8rem;
  text-align:center;
}
.staff-preview iframe { width:100%; height:100%; border:0; }
.staff-view-link { font-size:.85rem; }
.staff-dialog {
  max-width:none;
  max-height:none;
  padding:0;
  overflow:hidden;
  border:1px solid #51535f;
  border-radius:12px;
  background:#292b32;
  color:#f5f5f8;
}
.programme-dialog { width:min(1080px, calc(100% - 24px)); height:min(820px, calc(100% - 24px)); }
.live-dialog { width:min(760px, calc(100% - 24px)); max-height:calc(100% - 24px); overflow:auto; }
.live-dialog .staff-preview { margin:0 16px 16px; }
.programme-dialog[open] { display:grid; grid-template-rows:auto minmax(0,1fr); }
.staff-dialog::backdrop { background:#101116bb; }
.staff-dialog header { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:12px 16px; }
.staff-dialog h2 { margin:0; }
.programme-dialog iframe { width:100%; height:100%; border:0; background:#fff; }

.staff-header-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; margin-left:auto; }
.incoming-heading { flex-wrap:wrap; }
.refresh-tools { display:flex; align-items:center; gap:10px; margin-left:auto; }
#refresh-questions {
  display:grid;
  place-items:center;
  width:44px;
  min-height:44px;
  padding:0;
  background:#373943;
  color:#f5f5f8;
  border-color:#51535f;
}
#refresh-questions:hover { background:#484b57; }
#refresh-questions[aria-disabled="true"] { cursor:wait; opacity:.65; }
.refresh-time { color:#c9cbd4; font-size:.75rem; font-variant-numeric:tabular-nums; }
@media (max-width:540px) {
  .staff-brand { flex-wrap:wrap; }
  .staff-brand-copy { flex:1; min-width:0; }
}

.question-actions .question-unread,
.question-actions .question-unread:hover {
  justify-content:center;
  min-width:44px;
  padding:0;
  border-color:transparent;
  background:transparent;
  color:inherit;
}
.question-actions .question-unread svg { width:16px; height:16px; }
.question-actions .question-unread:hover { color:#947600; }
.question-feed:not(.pinned-feed) .question-unread:hover { color:#fed20a; }