:root { --staff-ink:#20201d; --staff-paper:#f7f4ee; --staff-surface:#fffefa; --staff-line:rgba(32,32,29,.14); --staff-muted:#77766f; --staff-blue:#1769e0; --staff-moss:#536452; --staff-coral:#fa7657; }
* { box-sizing:border-box; }
body.staff-page { min-width:320px; min-height:100vh; margin:0; background:var(--staff-paper); color:var(--staff-ink); font-family:Arial,sans-serif; }
.staff-login { position:fixed; z-index:20; inset:0; display:grid; place-items:center; overflow:auto; padding:24px; background:radial-gradient(circle at 85% 15%,rgba(250,118,87,.18),transparent 27%),var(--staff-paper); }
.staff-login-panel { width:min(100%,440px); padding:32px; border:1px solid var(--staff-line); background:var(--staff-surface); box-shadow:0 20px 60px rgba(32,32,29,.12); }
.staff-brand { display:inline-block; color:var(--staff-ink); font:24px Georgia,serif; letter-spacing:-.04em; text-decoration:none; }.staff-brand span { color:var(--staff-coral); }
.staff-kicker { margin:20px 0 8px; color:var(--staff-muted); font:10px/1.3 "Courier New",monospace; letter-spacing:.13em; text-transform:uppercase; }
.staff-login h1 { margin:0 0 22px; font:400 46px/.92 Georgia,serif; letter-spacing:-.05em; }.staff-login-panel>label,.staff-form label,.staff-panel>label { display:block; margin:12px 0; color:#555750; font:10px "Courier New",monospace; text-transform:uppercase; }
.staff-login input,.staff-login select,.staff-form input,.staff-form select,.staff-form textarea,.staff-panel>label select,.staff-search { display:block; width:100%; margin-top:5px; padding:10px; border:1px solid var(--staff-line); border-radius:0; outline-color:var(--staff-blue); background:white; color:var(--staff-ink); font:12px Arial,sans-serif; text-transform:none; }
.staff-credential-hint,.rotation-note { color:var(--staff-muted); font-size:11px; line-height:1.5; }.rotation-note { padding:11px; background:#fff5de; color:#76540c; }
.staff-sso-providers { display:flex; flex-direction:column; gap:8px; margin:14px 0; padding-top:14px; border-top:1px solid var(--staff-line); }
.staff-sso-button { display:block; width:100%; min-height:36px; border:1px solid var(--staff-line); background:white; color:var(--staff-ink); cursor:pointer; font:11px "Courier New",monospace; text-transform:uppercase; }
.staff-sso-button:hover { border-color:var(--staff-blue); color:var(--staff-blue); }
.staff-primary,.staff-secondary,.staff-danger,.staff-danger-soft { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:38px; border:1px solid transparent; padding:9px 13px; cursor:pointer; font:11px "Courier New",monospace; text-transform:uppercase; }.staff-primary { width:100%; background:var(--staff-ink); color:white; }.staff-primary:hover { background:var(--staff-blue); }.staff-primary:disabled { opacity:.55; cursor:wait; }.staff-secondary { background:white; border-color:var(--staff-line); color:var(--staff-ink); }.staff-secondary:hover { border-color:var(--staff-blue); color:var(--staff-blue); }.staff-danger { width:100%; background:#a83224; color:white; }.staff-danger-soft { border-color:#f0c6bf; background:#fff1ee; color:#a83224; }.staff-error { min-height:16px; margin:12px 0 0; color:#a83224; font-size:11px; }
.hidden { display:none !important; }
.staff-captcha-box { margin:15px 0; border:1px solid var(--staff-line); padding:11px; background:#f8f7f2; }.staff-captcha-question { display:flex; align-items:center; justify-content:space-between; gap:8px; }.staff-captcha-question .staff-kicker { margin:0; }.staff-captcha-question strong { color:var(--staff-ink); font:700 15px "Courier New",monospace; }.staff-captcha-question button { width:30px; height:30px; border:1px solid var(--staff-line); background:white; color:var(--staff-blue); cursor:pointer; font-size:18px; }.staff-captcha-box label { display:block; margin:9px 0 5px; color:#555750; font:9px "Courier New",monospace; text-transform:uppercase; }.staff-captcha-box input { display:block; width:100%; margin-top:4px; padding:9px; border:1px solid var(--staff-line); background:white; font:14px "Courier New",monospace; }.staff-captcha-box input:disabled { opacity:.5; }.staff-captcha-box small { color:var(--staff-muted); font-size:10px; line-height:1.4; }
.staff-captcha-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }.staff-captcha-heading .staff-kicker { margin:0; }.staff-captcha-tools { display:flex; gap:6px; }.staff-captcha-tool { min-height:30px; border:1px solid var(--staff-line); padding:5px 8px; background:white; color:var(--staff-blue); cursor:pointer; font:10px "Courier New",monospace; }.staff-captcha-tool:disabled { cursor:wait; opacity:.5; }.staff-captcha-image { display:block; width:min(100%,260px); height:auto; min-height:72px; margin:12px auto; border:1px solid var(--staff-line); background:var(--staff-paper); }.staff-captcha-prompt { display:block; margin:14px 0; color:var(--staff-ink); font:700 15px "Courier New",monospace; }
.staff-error-details { max-height:180px; overflow:auto; margin:8px 0 0; border:1px solid var(--staff-line); padding:10px; background:#f8f7f2; color:#555750; font:10px/1.5 "Courier New",monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.staff-captcha-box { margin:15px 0; border:1px solid var(--staff-line); padding:11px; background:#f8f7f2; }.staff-captcha-question { display:flex; align-items:center; justify-content:space-between; gap:8px; }.staff-captcha-question .staff-kicker { margin:0; }.staff-captcha-question strong { color:var(--staff-ink); font:700 15px "Courier New",monospace; }.staff-captcha-question button { width:30px; height:30px; border:1px solid var(--staff-line); background:white; color:var(--staff-blue); cursor:pointer; font-size:18px; }.staff-captcha-box label { display:block; margin:9px 0 5px; color:#555750; font:9px "Courier New",monospace; text-transform:uppercase; }.staff-captcha-box input { display:block; width:100%; margin-top:4px; padding:9px; border:1px solid var(--staff-line); background:white; font:14px "Courier New",monospace; }.staff-captcha-box input:disabled { opacity:.5; }.staff-captcha-box small { color:var(--staff-muted); font-size:10px; line-height:1.4; }
.staff-dashboard { display:grid; min-height:100vh; grid-template-columns:230px minmax(0,1fr); }.staff-sidebar { position:sticky; top:0; display:flex; height:100vh; flex-direction:column; border-right:1px solid var(--staff-line); padding:22px 16px 14px; background:#fffefa; }.staff-sidebar .staff-kicker { margin:33px 10px 10px; }.staff-sidebar nav { display:grid; gap:4px; }.staff-sidebar nav a { display:flex; align-items:center; gap:10px; padding:11px 10px; color:#686a63; font:11px "Courier New",monospace; text-decoration:none; }.staff-sidebar nav a span { color:var(--staff-coral); font-size:9px; }.staff-sidebar nav a:hover,.staff-sidebar nav a.is-active { background:#f0f2fa; color:var(--staff-blue); }.staff-sidebar nav a b { margin-left:auto; color:var(--staff-coral); }.staff-sidebar-user { display:flex; align-items:center; gap:10px; margin-top:auto; border-top:1px solid var(--staff-line); padding:16px 4px 4px; }.staff-sidebar-user>span:first-child { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#e7ebfa; color:var(--staff-blue); font-weight:bold; }.staff-sidebar-user strong,.staff-sidebar-user small { display:block; }.staff-sidebar-user strong { max-width:150px; overflow:hidden; font-size:11px; text-overflow:ellipsis; }.staff-sidebar-user small { margin-top:4px; color:var(--staff-muted); font:9px "Courier New",monospace; }
.staff-display-name { padding:0 4px 4px; }.staff-link-button { padding:0; border:0; background:transparent; color:var(--staff-blue); cursor:pointer; font:10px "Courier New",monospace; text-decoration:underline; }.display-name-form { margin-top:8px; }.display-name-form label { display:block; margin-bottom:4px; color:var(--staff-muted); font:9px "Courier New",monospace; text-transform:uppercase; }.display-name-form input { display:block; width:100%; padding:7px; border:1px solid var(--staff-line); background:white; color:var(--staff-ink); font:12px Arial,sans-serif; }.display-name-actions { display:flex; gap:6px; margin-top:6px; }.display-name-actions button { flex:1; padding:6px; border:1px solid var(--staff-line); background:transparent; color:var(--staff-ink); cursor:pointer; font-size:11px; }.display-name-actions button[type="submit"] { border-color:var(--staff-blue); background:var(--staff-blue); color:#fff; }.field-error { min-height:14px; margin:6px 0 0; color:var(--staff-coral); font-size:10px; }
.staff-main { display:flex; min-width:0; height:100vh; flex-direction:column; }.staff-topbar { display:flex; min-height:76px; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--staff-line); padding:12px 26px; background:rgba(255,254,250,.94); }.staff-topbar .staff-kicker { margin:0 0 5px; }.staff-topbar h1 { margin:0; font:400 24px Georgia,serif; }.staff-status { display:flex; align-items:center; gap:18px; color:var(--staff-muted); font:10px "Courier New",monospace; text-transform:uppercase; }.staff-status #connection-state { color:#a83224; }.staff-status #connection-state.is-online { color:#287747; }.staff-status #connection-state i { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:currentColor; }.staff-status button { border:1px solid var(--staff-line); padding:8px 10px; background:white; color:var(--staff-ink); cursor:pointer; font:10px "Courier New",monospace; }
.staff-ttl { display:flex; flex-direction:column; gap:3px; border-left:1px solid var(--staff-line); padding-left:16px; }.staff-ttl>span { color:var(--staff-muted); font-size:8px; letter-spacing:.12em; }.staff-ttl strong { color:var(--staff-ink); font:700 14px "Courier New",monospace; font-variant-numeric:tabular-nums; }
.staff-chat-form { display:flex; gap:8px; border-top:1px solid var(--staff-line); padding:12px 16px; }.staff-chat-form input { flex:1; min-width:0; padding:9px 10px; border:1px solid var(--staff-line); background:white; color:var(--staff-ink); font:12px Arial,sans-serif; }.staff-chat-form button { width:auto; border:1px solid var(--staff-blue); padding:9px 14px; background:var(--staff-blue); color:#fff; cursor:pointer; font:10px "Courier New",monospace; text-transform:uppercase; }
.staff-chat-message strong[data-profile-user] { cursor:pointer; text-decoration:underline dotted; text-underline-offset:2px; }
.staff-chat-message strong[data-profile-user]:hover { color:var(--staff-blue); }
.staff-dashboard.attendee-view .staff-sidebar,.staff-dashboard.attendee-view .staff-section:not(#room-chat),.staff-dashboard.attendee-view .broadcast-panel,.staff-dashboard.attendee-view #shield-mode,.staff-dashboard.attendee-view #staff-chat-lock,.staff-dashboard.attendee-view .staff-chat-actions { display:none !important; }
.staff-dashboard.attendee-view { grid-template-columns:minmax(0,1fr); }
.staff-dashboard.attendee-view .staff-grid-live { grid-template-columns:minmax(0,1fr); }
#toggle-attendee-view.is-active { border-color:var(--staff-blue); background:var(--staff-blue); color:#fff; }
.staff-content { width:min(1500px,100%); margin:0 auto; padding:24px 26px 50px; overflow:auto; }.staff-section { display:none; margin-bottom:34px; scroll-margin-top:18px; }.staff-section.is-active-section { display:block; }.staff-overview-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; margin-bottom:28px; }.staff-stat-card { border:1px solid var(--staff-line); background:var(--staff-surface); padding:14px 16px; }.staff-stat-label { display:block; color:var(--staff-muted); font:9px "Courier New",monospace; letter-spacing:.06em; text-transform:uppercase; }.staff-stat-card strong { display:block; margin-top:8px; color:var(--staff-ink); font:400 26px Georgia,serif; }.staff-quick-links { display:flex; flex-wrap:wrap; gap:10px; }.staff-quick-links button { width:auto; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:14px; margin-bottom:14px; }.section-heading .staff-kicker { margin:0 0 6px; }.section-heading h2 { margin:0; font:400 30px Georgia,serif; letter-spacing:-.03em; }.staff-grid { display:grid; gap:14px; }.staff-grid-chat { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.staff-grid-single { grid-template-columns:minmax(0,1fr); }.staff-grid-cases { grid-template-columns:repeat(2,minmax(0,1fr)); }.staff-grid-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }.staff-panel { min-width:0; border:1px solid var(--staff-line); background:var(--staff-surface); }.staff-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--staff-line); padding:14px 16px; background:#f8f7f2; }.staff-panel-heading h3 { margin:0; font:400 17px Georgia,serif; }.staff-small-button { border:1px solid #eccbc5; padding:6px 8px; background:white; color:#a83224; cursor:pointer; font:9px "Courier New",monospace; text-transform:uppercase; }.staff-count { color:var(--staff-coral); font:10px "Courier New",monospace; text-transform:uppercase; }.staff-chat-messages { max-height:450px; min-height:230px; overflow:auto; padding:12px 16px; }.staff-chat-message { position:relative; border-bottom:1px solid #eeede7; padding:12px 0; font:12px/1.5 Arial,sans-serif; }.staff-chat-message strong { margin-right:5px; color:var(--staff-blue); }.staff-chat-actions { display:flex; gap:5px; margin-top:7px; }.staff-chat-actions button,.staff-list button { border:1px solid var(--staff-line); padding:5px 7px; background:white; color:#555750; cursor:pointer; font:9px "Courier New",monospace; text-transform:uppercase; }.staff-chat-actions button:hover,.staff-list button:hover { border-color:var(--staff-blue); color:var(--staff-blue); }.staff-list { display:grid; max-height:420px; gap:8px; overflow:auto; padding:12px; }.staff-list-card { border:1px solid var(--staff-line); padding:11px; background:white; }.staff-list-card p { margin:0 0 7px; color:#555750; font-size:11px; line-height:1.45; }.staff-list-card small { color:var(--staff-muted); font:9px "Courier New",monospace; }.staff-list-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }.staff-list-actions button[data-decision="approved"],.staff-list-actions button[data-decision="actioned"] { color:#287747; }.staff-list-actions button[data-decision="denied"],.staff-list-actions button[data-decision="dismissed"] { color:#8d483f; }.staff-empty { margin:0; padding:14px 8px; color:#96968d; font-size:11px; }
.staff-form { display:grid; gap:10px; padding:14px 16px; }.staff-form label { margin:0; }.staff-form-row { display:grid; grid-template-columns:minmax(0,1fr) 110px; gap:9px; }.staff-form .staff-primary { width:auto; justify-self:start; }.staff-sanctions { max-height:230px; border-top:1px solid var(--staff-line); }.staff-form-inline { display:flex; align-items:end; gap:10px; padding:14px 16px; }.staff-form-inline label { flex:1; margin:0; }.staff-form-inline .staff-primary,.staff-form-inline .staff-secondary { flex:none; width:auto; }.staff-panel>label { padding:0 16px; }.staff-check { display:flex !important; align-items:center; gap:8px; margin:12px 0 !important; text-transform:none !important; }.staff-check input { accent-color:var(--staff-blue); }.staff-divider { height:1px; margin:4px 16px 14px; background:var(--staff-line); }.staff-search { width:min(230px,45vw); margin:0; }.staff-history { max-height:540px; overflow:auto; padding:8px 16px; }.staff-history-row { display:grid; grid-template-columns:155px 130px minmax(0,1fr); gap:12px; border-bottom:1px solid #eeede7; padding:12px 0; color:#555750; font-size:10px; line-height:1.5; }.staff-history-row time { color:var(--staff-muted); font:9px "Courier New",monospace; }.staff-history-row strong { color:var(--staff-blue); font-weight:600; }.staff-toast { position:fixed; z-index:200; right:20px; bottom:20px; max-width:min(400px,calc(100vw - 40px)); transform:translateY(10px); opacity:0; border:1px solid #30312d; padding:12px 15px; background:#20201d; color:white; font:11px "Courier New",monospace; transition:opacity .2s ease,transform .2s ease; pointer-events:none; }.staff-toast.is-visible { transform:none; opacity:1; }
@media(max-width:900px) { .staff-dashboard { grid-template-columns:74px minmax(0,1fr); }.staff-sidebar { padding:15px 8px; }.staff-sidebar .staff-brand { align-self:center; font-size:18px; }.staff-sidebar .staff-kicker,.staff-sidebar nav a:not(.is-active) { font-size:0; }.staff-sidebar nav a { justify-content:center; }.staff-sidebar nav a span,.staff-sidebar nav a b { display:none; }.staff-sidebar-user { justify-content:center; }.staff-sidebar-user>span:last-child { display:none; }.staff-grid-chat { grid-template-columns:1fr; } }
@media(max-width:640px) { .staff-dashboard { display:block; }.staff-sidebar { position:static; display:block; width:100%; height:auto; border-right:0; border-bottom:1px solid var(--staff-line); padding:10px 14px; }.staff-sidebar nav { display:flex; overflow:auto; margin-top:10px; }.staff-sidebar nav a { flex:none; }.staff-sidebar nav a span,.staff-sidebar nav a b { display:inline; }.staff-sidebar-user { display:none; }.staff-topbar { align-items:flex-start; flex-direction:column; padding:14px 16px; }.staff-status { flex-wrap:wrap; gap:10px; }.staff-content { padding:17px 14px 36px; }.section-heading h2 { font-size:25px; }.staff-grid-cases,.staff-grid-controls { grid-template-columns:1fr; }.staff-form-inline { align-items:stretch; flex-direction:column; }.staff-history-row { grid-template-columns:1fr; gap:3px; }.staff-login-panel { padding:24px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; } }
.staff-profile-modal { position:fixed; z-index:80; inset:0; display:grid; place-items:center; overflow:auto; padding:20px; background:rgba(20,24,22,.62); }.staff-profile-card { position:relative; width:min(100%,560px); max-height:min(85vh,760px); overflow:auto; border:1px solid var(--staff-line); padding:24px; background:var(--staff-surface); box-shadow:0 20px 60px rgba(0,0,0,.24); }.staff-profile-close { position:absolute; top:14px; right:16px; border:0; background:transparent; color:var(--staff-muted); cursor:pointer; font-size:24px; }.staff-profile-card .staff-kicker { margin:0 0 8px; }.staff-profile-card h2 { margin:0; font:400 32px Georgia,serif; }.staff-profile-subtitle { margin:8px 0 0; color:var(--staff-muted); font-size:11px; }.staff-profile-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:18px 0; }.staff-profile-stat { min-width:0; border:1px solid var(--staff-line); padding:10px; background:white; }.staff-profile-stat strong,.staff-profile-stat span { display:block; }.staff-profile-stat strong { overflow-wrap:anywhere; font:16px Georgia,serif; }.staff-profile-stat span { margin-top:5px; color:var(--staff-muted); font:9px "Courier New",monospace; text-transform:uppercase; }.staff-profile-history-heading { display:flex; justify-content:space-between; border-top:1px solid var(--staff-line); padding:13px 0 8px; font-size:11px; }.staff-profile-history-heading span { color:var(--staff-muted); font:10px "Courier New",monospace; }.staff-profile-history { max-height:240px; overflow:auto; }.staff-profile-message { border-bottom:1px solid #eeede7; padding:10px 0; color:#555750; font-size:11px; line-height:1.45; }.staff-profile-message time { display:block; margin-bottom:4px; color:var(--staff-muted); font:9px "Courier New",monospace; }.staff-profile-pagination { display:flex; justify-content:space-between; padding:9px 0; }.staff-profile-pagination button,.staff-profile-actions button { border:1px solid var(--staff-line); padding:7px 9px; background:white; color:var(--staff-ink); cursor:pointer; font:9px "Courier New",monospace; text-transform:uppercase; }.staff-profile-pagination button:disabled { opacity:.4; cursor:default; }.staff-profile-actions { display:flex; flex-wrap:wrap; gap:7px; border-top:1px solid var(--staff-line); padding-top:14px; }.staff-profile-actions label { display:flex; width:100%; align-items:center; gap:10px; color:var(--staff-muted); font:9px "Courier New",monospace; text-transform:uppercase; }.staff-profile-actions input { width:90px; padding:7px; border:1px solid var(--staff-line); background:white; font:12px Arial,sans-serif; }.staff-profile-actions [data-profile-sanction="suspension"],.staff-profile-actions [data-profile-sanction="ban-user"],.staff-profile-actions #staff-profile-ban-ip { color:#a83224; }
@media(max-width:640px) { .staff-profile-card { padding:20px; }.staff-profile-stats { grid-template-columns:1fr; } }
.logs-toolbar { display:grid; grid-template-columns:minmax(150px,1fr) minmax(220px,2fr) 90px auto; align-items:end; gap:10px; margin:12px 0; }
.logs-toolbar label { min-width:0; margin:0; color:#555750; font:9px "Courier New",monospace; text-transform:uppercase; }
.logs-toolbar input,.logs-toolbar select { display:block; width:100%; min-width:0; margin-top:5px; border:1px solid var(--staff-line); padding:9px; background:white; color:var(--staff-ink); font:12px Arial,sans-serif; text-transform:none; }
.logs-toolbar .staff-secondary { min-width:90px; }
.logs-status { min-height:16px; margin:8px 0; color:var(--staff-muted); font:10px "Courier New",monospace; }
.logs-panel { overflow:hidden; }
.logs-table-wrap { width:100%; overflow:auto; }
.logs-table { width:100%; min-width:820px; border-collapse:collapse; text-align:left; }
.logs-table th { position:sticky; top:0; border-bottom:1px solid var(--staff-line); padding:11px 10px; background:#f8f7f2; color:var(--staff-muted); font:9px "Courier New",monospace; text-transform:uppercase; }
.logs-table td { max-width:360px; border-bottom:1px solid #eeede7; padding:10px; color:#555750; font-size:11px; vertical-align:top; }
.logs-table td time { color:var(--staff-muted); font:9px "Courier New",monospace; white-space:nowrap; }
.logs-table td:nth-child(2) { color:var(--staff-ink); font-weight:600; text-transform:capitalize; }
.logs-details { overflow-wrap:anywhere; line-height:1.45; }
.log-score-high { color:#a83224 !important; font-weight:700; }
.log-decision { display:inline-block; border:1px solid var(--staff-line); padding:3px 6px; font:9px "Courier New",monospace; text-transform:uppercase; }
.log-decision.is-held { border-color:#eccbc5; background:#fff1ee; color:#a83224; }
.log-decision.is-allowed { border-color:#b8d9bf; background:#eef8f0; color:#287747; }
.log-decision.is-unverified { border-color:#e3cf9d; background:#fff8e8; color:#76540c; }
.logs-pagination { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; }
.logs-pagination span { color:var(--staff-muted); font:10px "Courier New",monospace; }
@media(max-width:640px) { .logs-toolbar { grid-template-columns:1fr 1fr; }.logs-toolbar label:nth-child(2) { grid-column:1/-1; }.logs-toolbar .staff-secondary { width:100%; } }