[x-cloak] { display: none !important; }

/* ── Manrope local font ─────────────────────────────── */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200;font-display:swap;src:url('/fonts/manrope/manrope-200.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/manrope/manrope-300.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/manrope/manrope-400.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/manrope/manrope-500.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/manrope/manrope-600.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/manrope/manrope-700.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/manrope/manrope-800.woff2') format('woff2')}

/* ── v6 design system ───────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--bg:#f0f3f9;--surface:#fff;--s2:#f4f6fb;--s3:#e8ecf5;
--b1:rgba(15,28,52,.07);--b2:rgba(15,28,52,.13);
--t1:#0d1b2e;--t2:#4a5e7a;--t3:#8ea3be;
--pri:#7c3aed;--pri-h:#6d28d9;--pri-d:rgba(124,58,237,.10);--pri-g:rgba(124,58,237,.22);
--danger:#dc2626;--dan-d:rgba(220,38,38,.09);
--warn:#c2710c;--warn-d:rgba(217,119,6,.09);
--ok:#059669;--ok-d:rgba(5,150,105,.09);
--info:#0369a1;--info-d:rgba(3,105,161,.09);
--sh-sm:0 1px 4px rgba(15,28,52,.05);
--sh-md:0 4px 16px rgba(15,28,52,.08);
--sh-lg:0 10px 40px rgba(15,28,52,.12);
--sh-btn:0 2px 10px rgba(124,58,237,.30);
--r-s:6px;--r-m:10px;--r-l:14px;--r-xl:18px;
--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-12:48px;--badge-danger-bg:rgba(239,68,68,.15);--badge-danger-fg:#b91c1c;--badge-warn-bg:rgba(245,158,11,.15);--badge-warn-fg:#b45309;--badge-success-bg:rgba(34,197,94,.15);--badge-success-fg:#15803d;--badge-info-bg:rgba(59,130,246,.15);--badge-info-fg:#1d4ed8;--badge-neutral-bg:rgba(100,116,139,.15);--badge-neutral-fg:#475569;--badge-danger-border:rgba(220,38,38,.3);--badge-warn-border:rgba(217,119,6,.3);--badge-info-border:#3b82f6}
[data-theme="dark"]{
--bg:#090f1a;--surface:#0e1825;--s2:#142030;--s3:#1b2d42;
--b1:rgba(255,255,255,.055);--b2:rgba(255,255,255,.10);
--t1:#e6f0ff;--t2:#7a9cbe;--t3:#3e5f80;
--pri:#8b5cf6;--pri-h:#9d6ef8;--pri-d:rgba(139,92,246,.13);--pri-g:rgba(139,92,246,.28);
--danger:#f87171;--dan-d:rgba(248,113,113,.13);
--warn:#fbbf24;--warn-d:rgba(251,191,36,.12);
--ok:#34d399;--ok-d:rgba(52,211,153,.12);
--info:#38bdf8;--info-d:rgba(56,189,248,.12);
--sh-sm:0 1px 4px rgba(0,0,0,.35);
--sh-md:0 4px 16px rgba(0,0,0,.45);
--sh-lg:0 10px 40px rgba(0,0,0,.55);
--sh-btn:0 2px 10px rgba(139,92,246,.35);--badge-danger-bg:rgba(239,68,68,.22);--badge-danger-fg:#fca5a5;--badge-warn-bg:rgba(245,158,11,.22);--badge-warn-fg:#fcd34d;--badge-success-bg:rgba(34,197,94,.22);--badge-success-fg:#6ee7b7;--badge-info-bg:rgba(59,130,246,.22);--badge-info-fg:#93c5fd;--badge-neutral-bg:rgba(100,116,139,.22);--badge-neutral-fg:#94a3b8;--badge-danger-border:rgba(220,38,38,.45);--badge-warn-border:rgba(217,119,6,.45);--badge-info-border:#60a5fa}
body{font-family:'Manrope',sans-serif;background:var(--bg);color:var(--t1);height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:'Manrope',sans-serif}
.app{display:flex;height:100vh}

/* ── Sidebar ─────────────────────────────────────────── */
.sidebar{width:214px;min-width:214px;background:var(--surface);border-right:1px solid var(--b1);display:flex;flex-direction:column;padding:var(--sp-5) 13px var(--sp-4);transition:background .25s,border-color .25s}
.logo{padding:2px var(--sp-2) var(--sp-4)}.logo h1{font-size:18px;font-weight:900;color:var(--pri);letter-spacing:-.5px}
.logo p{font-size:10px;font-weight:500;color:var(--t3);margin-top:2px}
.new-btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;padding:9px var(--sp-3);background:var(--pri);color:#fff;border:none;border-radius:var(--r-m);font-weight:800;font-size:12.5px;cursor:pointer;box-shadow:var(--sh-btn);margin-bottom:var(--sp-5);transition:opacity .2s,transform .15s}
.new-btn:hover{opacity:.9;transform:translateY(-1px)}
.new-btn i,.nav-item i,.theme-btn i{width:16px;height:16px;flex-shrink:0}
.sec-lbl{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:1.1px;color:var(--t3);padding:0 var(--sp-2);margin-bottom:6px}
.sec-lbl--mt{margin-top:14px}
.nav{flex:1;display:flex;flex-direction:column;gap:2px}
.nav-item,.theme-btn{display:flex;align-items:center;gap:9px;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-s);cursor:pointer;font-size:12.5px;font-weight:600;color:var(--t2);border:none;background:transparent;width:100%;text-align:left;text-decoration:none;transition:background .15s,color .15s}
.nav-item:hover,.theme-btn:hover{background:var(--s2);color:var(--t1)}
.nav-item.active{background:var(--pri-d);color:var(--pri);font-weight:700}
.nav-item.active i{color:var(--pri)}.nav-item:not(.active) i,.theme-btn i{color:var(--t3)}
.nbadge{margin-left:auto;background:var(--danger);color:#fff;font-size:9px;font-weight:800;padding:1px 6px;border-radius:100px}
.sb-bot{border-top:1px solid var(--b1);padding-top:var(--sp-3);display:flex;flex-direction:column;gap:2px;margin-top:auto}
.logout-form{margin-top:2px}
.nav-item--danger,.nav-item--danger i{color:var(--danger)}
.sa-badge{display:inline-flex;align-items:center;gap:var(--sp-1);background:linear-gradient(130deg,#7c3aed,#9b005c);color:#fff;font-size:9px;font-weight:800;padding:3px 9px;border-radius:100px;margin:var(--sp-2) 0 var(--sp-4);text-transform:uppercase;letter-spacing:.6px}
.sa-badge i{width:11px;height:11px}
.sa-only-lbl{font-size:9px;font-weight:800;color:var(--pri);background:var(--pri-d);padding:2px 7px;border-radius:3px;margin-left:auto}
.nav-item.coming-soon{opacity:.5;cursor:default}
.nav-item.coming-soon:hover{background:transparent;color:var(--t2)}

/* ── Queue panel ─────────────────────────────────────── */
.queue-panel{width:288px;min-width:288px;background:var(--surface);border-right:1px solid var(--b1);display:flex;flex-direction:column;transition:background .25s}
.app.no-queue-panel .queue-panel{display:none}
.queue-panel:empty{display:none}
.q-head{padding:var(--sp-4) var(--sp-3) var(--sp-3);border-bottom:1px solid var(--b1)}
.q-head-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3)}
.q-head h2{font-size:14px;font-weight:900}
.q-cnt{background:var(--dan-d);color:var(--danger);font-size:10px;font-weight:800;padding:2px 9px;border-radius:100px}
.q-type-tabs{display:flex;gap:2px}
.q-tab{flex:1;padding:5px var(--sp-1);border:none;background:transparent;border-radius:var(--r-s);font-size:11px;font-weight:700;color:var(--t3);cursor:pointer;transition:background .15s,color .15s;text-align:center}
.q-tab.active{background:var(--pri-d);color:var(--pri)}
.q-tab:hover:not(.active){background:var(--s2);color:var(--t2)}
.q-list{flex:1;overflow-y:auto;padding:var(--sp-2)}
.q-list::-webkit-scrollbar{width:3px}
.q-list::-webkit-scrollbar-thumb{background:var(--b2);border-radius:3px}
.q-item{display:flex;gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-m);cursor:pointer;border:1.5px solid transparent;transition:background .15s,border-color .15s;background:transparent;text-align:left;width:100%;color:inherit;align-items:flex-start}
.q-item:hover{background:var(--s2)}.q-item.active{background:var(--pri-d);border-color:var(--pri)}.q-item-selected{background:var(--pri-d);border-color:var(--pri-g)}
.q-item-disabled{opacity:0.55;cursor:not-allowed}
.q-item-disabled:hover{background:transparent}
.q-cb{width:15px;height:15px;min-width:15px;border-radius:3px;border:1.5px solid var(--b2);background:var(--surface);cursor:pointer;appearance:none;margin-top:3px;flex-shrink:0;transition:background .15s}
.q-cb:checked{background:var(--pri);border-color:var(--pri);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6l3 3 5-5' stroke='white' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.q-thumb{width:64px;min-width:64px;height:42px;border-radius:var(--r-s);background:var(--s3);overflow:hidden;position:relative;flex-shrink:0}
.q-thumb img{width:100%;height:100%;object-fit:cover}
.q-type-icon{width:64px;min-width:64px;height:42px;border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.q-type-icon i{width:20px;height:20px}
.ti-video{background:var(--info-d)}.ti-video i{color:var(--info)}
.ti-audio{background:var(--pri-d)}.ti-audio i{color:var(--pri)}
.ti-text{background:var(--ok-d)}.ti-text i{color:var(--ok)}
.ti-gallery{background:var(--warn-d)}.ti-gallery i{color:var(--warn)}
.q-dur{position:absolute;bottom:2px;right:2px;background:rgba(0,0,0,.72);color:#fff;font-size:8px;font-weight:700;padding:1px var(--sp-1);border-radius:3px}
.q-info{flex:1;min-width:0}
.q-title{font-size:11.5px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}
.q-meta{font-size:10px;font-weight:500;color:var(--t3);margin-bottom:var(--sp-1)}
.q-badges{display:flex;gap:var(--sp-1);align-items:center;flex-wrap:wrap}
.vbadge{font-size:9px;font-weight:800;padding:2px 6px;border-radius:3px;text-transform:uppercase;letter-spacing:.3px}
.vb-hate{background:var(--dan-d);color:var(--danger)}
.vb-sexual{background:#fdf2f8;color:#9d174d}
[data-theme="dark"] .vb-sexual{background:rgba(244,114,182,.13);color:#f9a8d4}
.vb-spam{background:var(--pri-d);color:var(--pri)}
.vb-violence{background:var(--warn-d);color:var(--warn)}
.vb-safe{background:var(--ok-d);color:var(--ok)}
.vb-misinfo{background:var(--info-d);color:var(--info)}
.sdot-q{display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:800;padding:2px 6px;border-radius:3px}
.sd-live{background:var(--dan-d);color:var(--danger)}
.sd-hidden{background:var(--warn-d);color:var(--warn)}
.sd-pending{background:var(--s3);color:var(--t3)}
.cost-tag{font-size:9px;font-weight:700;color:var(--t3);margin-left:auto;align-self:flex-start;white-space:nowrap}
.bulk-bar{background:var(--pri);padding:var(--sp-3) var(--sp-3);display:none;align-items:center;gap:var(--sp-2)}
.bulk-bar.visible{display:flex}
.bulk-bar span{color:#fff;font-size:12px;font-weight:700;flex:1}
.bulk-btn{background:rgba(255,255,255,.15);color:#fff;border:none;border-radius:var(--r-s);padding:5px var(--sp-3);font-size:11px;font-weight:700;cursor:pointer}
.bulk-btn:hover{background:rgba(255,255,255,.25)}
.bulk-cancel{background:transparent;color:rgba(255,255,255,.7);border:none;cursor:pointer;font-size:11px;font-weight:600}

/* ── Workspace ───────────────────────────────────────── */
.workspace{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.ws-hdr{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--b1);padding:9px var(--sp-5);display:flex;align-items:center;gap:var(--sp-3);flex-shrink:0;transition:background .25s}
[data-theme="dark"] .ws-hdr{background:rgba(9,15,26,.88)}
.srch{flex:1;max-width:320px;position:relative}
.srch i,.srch svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--t3);width:14px;height:14px;pointer-events:none}
.srch input{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:100px;padding:7px var(--sp-3) 7px 30px;font-size:12px;font-weight:500;color:var(--t1);outline:none;transition:border-color .15s}
.srch input:focus{border-color:var(--pri);background:var(--surface)}
.srch input::placeholder{color:var(--t3)}
.hdr-tab{font-size:12.5px;font-weight:700;color:var(--pri);padding:5px 2px;border:none;background:none;cursor:pointer;border-bottom:2px solid var(--pri)}
.hdr-right{display:flex;align-items:center;gap:var(--sp-2);margin-left:auto}
.status-pill{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--ok);background:var(--ok-d);border:1px solid rgba(5,150,105,.22);padding:var(--sp-1) 11px;border-radius:100px;transition:color .3s,background .3s,border-color .3s}
.status-pill--warn{color:var(--warn);background:var(--warn-d);border-color:rgba(194,113,12,.22)}
.status-pill--warn .pulse-dot{background:var(--warn)}
.status-pill--error{color:var(--danger);background:var(--dan-d);border-color:rgba(220,38,38,.22)}
.status-pill--error .pulse-dot{background:var(--danger)}
/* Publish status indicator + hide/restore button (detail panel) */
.publish-status{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);margin-top:var(--sp-2);padding:6px var(--sp-3);border-radius:100px;font-size:11px;font-weight:700;background:var(--s2)}
.publish-status>span{display:inline-flex;align-items:center;gap:5px}
.publish-status.ps-live{background:var(--ok-d);color:var(--ok);border:1px solid rgba(5,150,105,.22)}
.publish-status.ps-hidden{background:var(--warn-d);color:var(--warn);border:1px solid rgba(217,119,6,.22)}
.publish-status.ps-removed{background:var(--dan-d);color:var(--danger);border:1px solid rgba(220,38,38,.22)}
.hide-btn{padding:var(--sp-1) var(--sp-3);border-radius:var(--r-s);font-size:11px;font-weight:700;cursor:pointer;border:1px solid transparent;transition:background .15s,color .15s,transform .15s;font-family:inherit}
.hide-btn-hide{background:rgba(217,119,6,.18);color:var(--warn);border-color:var(--badge-warn-border)}
.hide-btn-hide:hover{background:var(--warn);color:#fff;transform:translateY(-1px)}
.hide-btn-restore{background:rgba(5,150,105,.18);color:var(--ok);border-color:rgba(5,150,105,.3)}
.hide-btn-restore:hover{background:var(--ok);color:#fff;transform:translateY(-1px)}
.pulse-dot{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:blink 2s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.8)}}
.icon-btn{width:30px;height:30px;border-radius:var(--r-s);border:1px solid var(--b1);background:var(--surface);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t2);transition:background .15s,color .15s}
.icon-btn:hover{background:var(--s2);color:var(--t1)}.icon-btn i{width:14px;height:14px}
.av-btn{width:30px;height:30px;border-radius:50%;overflow:hidden;border:2px solid var(--pri);cursor:pointer}
.av-btn img{width:100%;height:100%;object-fit:cover}

/* ── Profile dropdown ────────────────────────────────── */
.top-bar-profile{position:relative}
.top-bar-profile-trigger{display:flex;align-items:center;gap:var(--sp-1);padding:2px 4px 2px 2px;background:transparent;border:1px solid transparent;border-radius:var(--r-m);cursor:pointer;transition:background .15s,border-color .15s}
.top-bar-profile-trigger:hover,.top-bar-profile-trigger.is-open{background:var(--s2);border-color:var(--b1)}
.top-bar-profile-chevron{width:12px;height:12px;color:var(--t3);transition:transform .15s;flex-shrink:0}
.top-bar-profile-trigger.is-open .top-bar-profile-chevron{transform:rotate(180deg)}
.top-bar-profile-menu{position:absolute;top:calc(100% + var(--sp-2));right:0;min-width:220px;background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-m);box-shadow:var(--sh-lg);padding:var(--sp-2);z-index:200}
.top-bar-profile-header{padding:var(--sp-2) var(--sp-3) var(--sp-1)}
.top-bar-profile-name{font-size:13px;font-weight:600;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-bar-profile-email{font-size:11px;color:var(--t3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-bar-profile-divider{height:1px;background:var(--b1);margin:var(--sp-1) 0}
.top-bar-profile-item{display:flex;align-items:center;gap:var(--sp-2);width:100%;padding:var(--sp-2) var(--sp-3);background:transparent;border:none;border-radius:var(--r-s);color:var(--t1);font-size:13px;text-align:left;cursor:pointer;text-decoration:none;transition:background .1s;white-space:nowrap}
.top-bar-profile-item:hover{background:var(--s2)}
.top-bar-profile-item i{width:15px;height:15px;color:var(--t3);flex-shrink:0}
.top-bar-profile-item--danger{color:var(--danger)}
.top-bar-profile-item--danger i{color:var(--danger)}
.top-bar-profile-item--danger:hover{background:var(--badge-danger-bg)}
.top-bar-profile-menu form{display:contents}
@keyframes tbp-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.tbp-enter{transition:opacity .12s,transform .12s}
.tbp-enter-start{opacity:0;transform:translateY(-4px)}
.tbp-enter-end{opacity:1;transform:translateY(0)}

/* ── Coming-soon stub icons ──────────────────────────── */
.icon-btn.top-bar-stub{cursor:default;opacity:0.6;transition:opacity .15s}
.icon-btn.top-bar-stub:hover{background:var(--surface);color:var(--t2);opacity:0.8}

/* ── Notifications dropdown ──────────────────────────── */
.top-bar-notifications{position:relative}
.top-bar-notifications-trigger{position:relative}
.top-bar-notifications-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 var(--sp-1);background:var(--badge-danger-bg);color:var(--badge-danger-fg);border-radius:8px;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;pointer-events:none}
.top-bar-dropdown{position:absolute;top:calc(100% + var(--sp-2));right:0;min-width:320px;max-width:400px;background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-m);box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:200}
.top-bar-dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--b1)}
.top-bar-dropdown-title{font-size:13px;font-weight:600;color:var(--t1)}
.top-bar-dropdown-action{font-size:11px;color:var(--pri);background:transparent;border:none;cursor:pointer;text-decoration:none}
.top-bar-dropdown-action:hover{text-decoration:underline}
.top-bar-dropdown-body{max-height:400px;overflow-y:auto}
.top-bar-dropdown-empty{padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--t3);font-size:12px}
.top-bar-dropdown-item{display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--b1);color:var(--t1);text-decoration:none;transition:background 0.1s}
.top-bar-dropdown-item:hover{background:var(--s2)}
.top-bar-dropdown-item:last-child{border-bottom:none}
.top-bar-dropdown-item.is-unread{background:rgba(59,130,246,0.04)}
.top-bar-dropdown-item-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.top-bar-dropdown-item-icon.type-appeal{background:var(--badge-warn-bg);color:var(--badge-warn-fg)}
.top-bar-dropdown-item-icon.type-moderation{background:var(--badge-info-bg);color:var(--badge-info-fg)}
.top-bar-dropdown-item-icon.type-system{background:var(--badge-neutral-bg);color:var(--badge-neutral-fg)}
.top-bar-dropdown-item-icon.action-approved{background:var(--badge-success-bg);color:var(--badge-success-fg)}
.top-bar-dropdown-item-icon.action-rejected{background:var(--badge-danger-bg);color:var(--badge-danger-fg)}
.top-bar-dropdown-item-icon i{width:14px;height:14px}
.top-bar-dropdown-item-body{flex:1;min-width:0}
.top-bar-dropdown-item-title{font-size:13px;font-weight:500;color:var(--t1);line-height:1.3}
.top-bar-dropdown-item-meta{font-size:11px;color:var(--t3);margin-top:2px}
.top-bar-history{position:relative}

/* ── Stats ribbon (queue view) ───────────────────────── */
.stats-ribbon{background:var(--surface);border-bottom:1px solid var(--b1);padding:var(--sp-2) var(--sp-5);display:flex;gap:0;flex-shrink:0;transition:background .25s}
.stat-item{flex:1;display:flex;flex-direction:column;align-items:center;padding:var(--sp-1) 0;border-right:1px solid var(--b1)}
.stat-item:last-child{border-right:none}
.stat-num{font-size:18px;font-weight:900;letter-spacing:-.5px;line-height:1}
.stat-lbl{font-size:9px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.stat-item.s-q .stat-num{color:var(--danger)}
.stat-item.s-p .stat-num{color:var(--t1)}
.stat-item.s-a .stat-num{color:var(--ok)}
.stat-item.s-e .stat-num{color:var(--warn)}

/* ── Workspace body ──────────────────────────────────── */
.ws-body{flex:1;overflow-y:auto;padding:var(--sp-4) var(--sp-5) 28px}
.ws-body::-webkit-scrollbar{width:4px}
.ws-body::-webkit-scrollbar-thumb{background:var(--b2);border-radius:4px}
.live-banner{display:flex;align-items:center;gap:var(--sp-3);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);margin-bottom:var(--sp-4);font-size:12.5px;font-weight:700}
.live-banner i{width:16px;height:16px;flex-shrink:0}
.bn-live{background:var(--dan-d);border:1px solid rgba(220,38,38,.2);color:var(--danger)}
.bn-hidden{background:var(--warn-d);border:1px solid rgba(217,119,6,.2);color:var(--warn)}
.review-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.review-hd h2{font-size:19px;font-weight:900;letter-spacing:-.4px;line-height:1.2;margin-bottom:5px}
.rev-meta{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-top:5px}
.rmeta{display:flex;align-items:center;gap:var(--sp-1);font-size:11px;font-weight:600;color:var(--t3)}
.rmeta i{width:11px;height:11px}
.tag-sm{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:10px;font-weight:700;padding:2px var(--sp-2);border-radius:4px}
.tag-channel{background:var(--pri-d);color:var(--pri)}
.tag-channel i{width:11px;height:11px}
.tag-synth{background:#fdf4ff;color:#7e22ce;border:1px solid rgba(126,34,206,.2)}
.tag-synth i{width:11px;height:11px}
[data-theme="dark"] .tag-synth{background:rgba(139,92,246,.15);color:#d8b4fe;border-color:rgba(139,92,246,.2)}
.act-row{display:flex;gap:7px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-m);font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:background .18s,color .18s,transform .12s,box-shadow .18s;white-space:nowrap;text-decoration:none}
.btn:disabled,.btn[disabled]{opacity:0.5;cursor:not-allowed}
.btn--sm{padding:var(--sp-1) var(--sp-3);font-size:12px}
.btn--lg{padding:var(--sp-3) var(--sp-6);font-size:14px}
.btn--primary{background:var(--pri);color:#fff;border-color:var(--pri);box-shadow:var(--sh-btn)}
.btn--primary:hover{background:var(--pri-h);transform:translateY(-1px)}
.btn--secondary{background:var(--s2);color:var(--t1);border-color:var(--b1)}
.btn--secondary:hover{background:var(--s3,var(--s2))}
.btn--ghost{background:transparent;color:var(--t2);border-color:var(--b2)}
.btn--ghost:hover{background:var(--s2);color:var(--t1)}
.btn--danger{background:var(--bad,var(--danger));color:#fff}
.btn--danger:hover{opacity:0.9}
.btn--success{background:var(--ok);color:#fff}
.btn--success:hover{opacity:0.9}
.btn--icon{width:30px;height:30px;padding:0;border:1px solid var(--b1);background:var(--surface);color:var(--t2);border-radius:var(--r-s);transition:all 0.15s}
.btn--icon:hover{background:var(--s2);color:var(--t1)}
.btn--icon i,.btn--icon svg{width:14px;height:14px}
.btn--icon.btn--warn{color:var(--warn);border-color:var(--badge-warn-border)}
.btn--icon.btn--warn:hover{border-color:var(--warn)}
.btn--icon.btn--ok{color:var(--ok);border-color:rgba(5,150,105,.3)}
.btn--icon.btn--ok:hover{border-color:var(--ok)}
.btn--icon.btn--danger{color:var(--bad);border-color:var(--badge-danger-border)}
.btn--icon.btn--danger:hover{border-color:var(--bad)}
.btn--icon.btn--sm{width:24px;height:24px;border:none;background:transparent;color:var(--t3)}
.btn--icon.btn--sm:hover{background:var(--s3,var(--s2));color:var(--t1)}
.btn--icon.btn--sm i,.btn--icon.btn--sm svg{width:12px;height:12px}
.btn i,.btn svg{width:13px;height:13px}
.kbd{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:3px;background:rgba(255,255,255,.2);font-size:9px;font-weight:800;margin-left:2px}
.btn-reject{background:var(--dan-d);color:var(--danger);border-color:var(--badge-danger-border)}
.btn-reject:hover{background:var(--danger);color:#fff;box-shadow:0 2px 10px rgba(220,38,38,.35);transform:translateY(-1px)}
.btn-reject .kbd,.btn-escalate .kbd{background:rgba(0,0,0,.1)}
.btn-escalate{background:var(--warn-d);color:var(--warn);border-color:var(--badge-warn-border)}
.btn-escalate:hover{background:var(--warn);color:#fff;transform:translateY(-1px)}
.btn-approve{background:var(--pri);color:#fff;border-color:var(--pri);box-shadow:var(--sh-btn)}
.btn-approve:hover{background:var(--pri-h);transform:translateY(-1px)}
.btn-hide{background:var(--warn-d);color:var(--warn);border-color:var(--badge-warn-border)}
.btn-hide:hover{background:var(--warn);color:#fff;transform:translateY(-1px)}
/* Queue action buttons: compact sizing preserved */
.btn-reject,.btn-escalate,.btn-approve,.btn-hide{font-size:12px;font-weight:800;padding:var(--sp-2) var(--sp-3);border-width:1.5px;gap:5px}
.kbd-hint{font-size:9px;font-weight:700;color:var(--t3);text-align:right;margin-top:5px;letter-spacing:.3px}

/* ── Page header component ───────────────────────────── */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-4);padding-bottom:var(--sp-4);border-bottom:1px solid var(--b1);margin-bottom:var(--sp-6)}
.page-header-intro{display:flex;flex-direction:column;gap:var(--sp-1)}
.page-header-title{font-size:20px;font-weight:700;color:var(--t1);line-height:1.2;margin:0}
.page-header-subtitle{font-size:13px;color:var(--t3);margin:0;line-height:1.45}
.page-header-actions{display:flex;align-items:center;gap:var(--sp-3);flex-shrink:0}

/* ── Player / media boxes ────────────────────────────── */
.player-box{background:#000;border-radius:var(--r-xl);overflow:hidden;position:relative;aspect-ratio:16/9;width:100%;max-width:720px;margin:0 auto var(--sp-4);box-shadow:var(--sh-lg)}
.player-box img.vid-bg{width:100%;height:100%;object-fit:cover;opacity:.5;display:block}
.player-box iframe{width:100%;height:100%;border:0;display:block}
.player-box img:not(.vid-bg){width:100%;height:100%;object-fit:cover;display:block}
.progress-bar{width:100%;height:6px;background:var(--b1);border:1px solid var(--b1);border-radius:100px;position:relative;margin-bottom:var(--sp-3);overflow:visible}
.prog-marker{position:absolute;top:50%;width:2px;height:14px;background:var(--danger);border-radius:1px;transform:translate(-50%,-50%);cursor:pointer}
.prog-marker::before{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:8px;height:8px;background:var(--danger);border-radius:50%}
.prog-marker:hover{opacity:.75}
.no-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:16/9;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-xl);margin-bottom:var(--sp-4);gap:var(--sp-2)}
.no-preview-icon{width:32px;height:32px;color:var(--t3)}
.no-preview-msg{font-size:13px;font-weight:700;color:var(--t2);margin:0}
.no-preview-sub{font-size:11px;font-family:monospace;color:var(--t3);margin:0}
.image-preview-box{display:flex;justify-content:center;align-items:center;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-xl);overflow:hidden;max-height:400px;padding:var(--sp-2);margin-bottom:var(--sp-4)}
.image-preview-box img{max-width:100%;max-height:384px;object-fit:contain;border-radius:var(--r-s)}
.play-ctr{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58px;height:58px;background:rgba(124,58,237,.88);border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 14px rgba(124,58,237,.18);transition:transform .2s}
.play-ctr:hover{transform:translate(-50%,-50%) scale(1.1)}
.play-ctr i{color:#fff;width:24px;height:24px;margin-left:2px}
.detect-box{position:absolute;top:22%;left:28%;width:118px;height:148px;border:1.5px solid var(--pri);border-radius:8px;pointer-events:none;animation:bpulse 3s ease-in-out infinite}
@keyframes bpulse{0%,100%{box-shadow:0 0 22px var(--pri-g)}50%{box-shadow:0 0 38px var(--pri-g)}}
.detect-lbl{position:absolute;top:-20px;left:0;background:var(--pri);color:#fff;font-size:8px;font-weight:800;padding:2px 7px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}
.vc{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.85),transparent);padding:var(--sp-5) var(--sp-3) var(--sp-3)}
.prog{width:100%;height:4px;background:rgba(255,255,255,.18);border-radius:100px;position:relative;cursor:pointer;margin-bottom:6px}
.prog-f{height:100%;background:var(--pri);border-radius:100px;width:31%;position:relative}
.prog-f::after{content:'';position:absolute;right:-5px;top:50%;transform:translateY(-50%);width:10px;height:10px;background:#fff;border-radius:50%;box-shadow:0 0 0 2.5px var(--pri)}
.prog-flag{position:absolute;top:-4px;width:2px;height:12px;background:var(--danger);border-radius:1px}
.prog-flag::before{content:'';position:absolute;top:-3px;left:-2px;width:6px;height:6px;background:var(--danger);border-radius:50%}
.vtime{font-size:10px;font-weight:700;color:rgba(255,255,255,.65)}
.audio-player{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-xl);padding:var(--sp-5);margin-bottom:var(--sp-4);box-shadow:var(--sh-sm)}
.audio-head{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.aud-icon{width:48px;height:48px;border-radius:var(--r-m);background:var(--pri-d);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.aud-icon i{width:22px;height:22px;color:var(--pri)}
.aud-title{font-size:15px;font-weight:800;margin-bottom:2px}
.aud-meta{font-size:11px;color:var(--t3);font-weight:500}
.waveform{display:flex;align-items:flex-end;height:56px;gap:2px;margin-bottom:var(--sp-3);overflow:hidden}
.wv-bar{flex-shrink:0;width:4px;border-radius:2px;background:var(--s3)}
.wv-bar.played{background:var(--pri)}.wv-bar.flagged{background:var(--danger) !important}
.aud-prog{width:100%;height:4px;background:var(--s3);border-radius:100px;position:relative;margin-bottom:var(--sp-2)}
.aud-prog-f{height:100%;background:var(--pri);border-radius:100px;width:38%;position:relative}
.aud-prog-f::after{content:'';position:absolute;right:-5px;top:50%;transform:translateY(-50%);width:10px;height:10px;background:var(--pri);border-radius:50%}
.aud-controls{display:flex;align-items:center;gap:var(--sp-3)}
.aud-play{width:40px;height:40px;border-radius:50%;background:var(--pri);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-btn)}
.aud-play i{color:#fff;width:18px;height:18px;margin-left:2px}
.aud-time{font-size:12px;font-weight:700;color:var(--t2)}
.flag-segs{margin-top:var(--sp-3);display:flex;flex-direction:column;gap:5px}
.fseg{display:flex;align-items:center;gap:var(--sp-2);padding:6px var(--sp-3);background:var(--dan-d);border-radius:var(--r-s);border-left:2px solid var(--danger)}
.fseg-time{font-size:10px;font-weight:800;color:var(--danger);font-family:monospace;white-space:nowrap}
.fseg-lbl{font-size:11px;font-weight:600;color:var(--t2)}
.text-viewer{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-xl);padding:var(--sp-5);margin-bottom:var(--sp-4);box-shadow:var(--sh-sm);max-height:260px;overflow-y:auto}
.text-viewer::-webkit-scrollbar{width:3px}
.text-viewer::-webkit-scrollbar-thumb{background:var(--b2);border-radius:3px}
.text-viewer h3{font-size:16px;font-weight:800;margin-bottom:var(--sp-3)}
.tv-para{font-size:12.5px;line-height:1.8;color:var(--t2);margin-bottom:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-s)}
.tv-flagged{background:var(--dan-d);border-left:3px solid var(--danger);color:var(--t1)}
.flag-mark{background:var(--danger);color:#fff;font-size:9px;font-weight:800;padding:1px 5px;border-radius:3px;margin-right:var(--sp-1);text-transform:uppercase;vertical-align:middle}
.gallery-viewer{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-xl);padding:var(--sp-4);margin-bottom:var(--sp-4);box-shadow:var(--sh-sm)}
.gal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3)}
.gal-head h3{font-size:13px;font-weight:800}
.gal-info{font-size:11px;color:var(--t3);font-weight:600}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2)}
.gal-img{position:relative;border-radius:var(--r-m);overflow:hidden;aspect-ratio:1;background:var(--s3)}
.gal-img img{width:100%;height:100%;object-fit:cover}
.gal-img.gal-f::after{content:'';position:absolute;inset:0;background:rgba(220,38,38,.3);border:2px solid var(--danger);border-radius:var(--r-m)}
.gal-flag-ico{position:absolute;top:5px;right:5px;width:20px;height:20px;background:var(--danger);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:1}
.gal-flag-ico i{color:#fff;width:10px;height:10px}
.gal-num{position:absolute;bottom:4px;left:4px;background:rgba(0,0,0,.65);color:#fff;font-size:8px;font-weight:700;padding:1px 5px;border-radius:3px;z-index:1}

/* ── Analysis cards ──────────────────────────────────── */
.analysis-row{display:grid;grid-template-columns:1fr 260px;gap:13px;margin-bottom:13px}
.card{background:var(--surface);border-radius:var(--r-l);border:1px solid var(--b1);padding:var(--sp-4);box-shadow:var(--sh-sm);transition:background .25s}
.card-h{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:800;margin-bottom:var(--sp-3)}
.card-h i{width:15px;height:15px;color:var(--pri)}
.card-icon{display:flex;align-items:center;justify-content:center}
.card-t{font-size:12.5px;font-weight:800;color:var(--t1)}
.risk-card .card-h i{color:var(--danger)}
.risk-rows{display:flex;flex-direction:column}
.risk-row{display:block;margin-bottom:var(--sp-3)}.risk-row:last-child{margin-bottom:0}
.risk-row-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px}
.risk-label{color:var(--t1);font-weight:500}
.risk-pct{display:flex;align-items:center;gap:var(--sp-2);color:var(--t2);font-size:12px}
.risk-tag{font-size:9px;font-weight:700;letter-spacing:.7px;padding:2px 6px;border-radius:var(--r-s)}
.risk-tag.tag-critical{background:var(--badge-danger-bg);color:var(--danger)}
.risk-tag.tag-medium{background:var(--badge-warn-bg);color:var(--warn)}
.risk-tag.tag-low{background:var(--s2);color:var(--t2)}
.risk-tag.tag-minimal{background:var(--s2);color:var(--t3)}
.risk-bar{height:6px;background:var(--s2);border-radius:var(--r-s);overflow:hidden}
.risk-fill{height:100%;border-radius:var(--r-s);transition:width .3s ease}
.risk-fill.fill-critical{background:var(--danger)}
.risk-fill.fill-medium{background:var(--warn)}
.risk-fill.fill-low{background:var(--pri)}
.risk-fill.fill-minimal{background:var(--t3)}
.risk-empty{padding:var(--sp-4) 0;text-align:center;color:var(--t3);font-size:13px}
.sev{font-size:9px;font-weight:800;padding:2px 6px;border-radius:3px;text-transform:uppercase;letter-spacing:.5px}
.sev-c{background:var(--dan-d);color:var(--danger)}
.sev-l{background:var(--info-d);color:var(--info)}
.sev-m{background:var(--warn-d);color:var(--warn)}
.sev-min{background:var(--ok-d);color:var(--ok)}
.bar-track{height:6px;background:var(--s2);border-radius:100px;overflow:hidden}
.bar-fill{height:100%;border-radius:100px;width:0;transition:width 1.1s cubic-bezier(.4,0,.2,1)}
.bar-c{background:var(--danger)}.bar-l{background:var(--info)}.bar-m{background:var(--warn)}.bar-min{background:var(--ok)}
.cr-top{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--b1)}
.cr-av{width:44px;height:44px;border-radius:var(--r-m);overflow:hidden;position:relative;border:1.5px solid var(--b2);flex-shrink:0}
.cr-av img{width:100%;height:100%;object-fit:cover}
.cr-badge{position:absolute;bottom:-3px;right:-3px;width:14px;height:14px;background:var(--pri);border-radius:50%;border:2px solid var(--surface);display:flex;align-items:center;justify-content:center}
.cr-badge i{width:7px;height:7px;color:#fff}
.cr-name{font-size:13px;font-weight:800;margin-bottom:1px}
.cr-since{font-size:10px;color:var(--t3);font-weight:500}
.cr-channel{display:flex;align-items:center;gap:3px;font-size:10px;font-weight:700;color:var(--pri)}
.cr-channel i{width:10px;height:10px}
.cr-rows{display:flex;flex-direction:column;gap:7px}
.cr-row{display:flex;justify-content:space-between;align-items:center}
.cr-lbl{font-size:11px;font-weight:600;color:var(--t2)}
.cr-val{font-size:12px;font-weight:800;color:var(--t1)}
.cr-val.vd{color:var(--danger)}.cr-val.vw{color:var(--warn)}.cr-val.vo{color:var(--ok)}
.tier-b{display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:800;padding:3px 7px;border-radius:4px;text-transform:uppercase}
.t-trusted{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.t-standard{background:rgba(148,163,184,.12);color:#475569;border:1px solid rgba(148,163,184,.25)}
.t-probation{background:var(--warn-d);color:var(--warn);border:1px solid rgba(217,119,6,.25)}
.t-suspended{background:var(--dan-d);color:var(--danger);border:1px solid rgba(220,38,38,.25)}
[data-theme="dark"] .t-trusted{background:rgba(52,211,153,.12);color:#6ee7b7;border-color:rgba(52,211,153,.2)}
[data-theme="dark"] .t-standard{background:rgba(148,163,184,.1);color:#94a3b8;border-color:rgba(148,163,184,.18)}
.trust-sec{padding:var(--sp-2) 0;border-bottom:1px solid var(--b1)}
.trust-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-1)}
.trust-lbl{font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.5px}
.trust-sc{display:flex;align-items:baseline;gap:var(--sp-1)}
.trust-num{font-size:18px;font-weight:900;letter-spacing:-.5px}
.trust-max{font-size:10px;font-weight:600;color:var(--t3)}
.trend{font-size:10px;font-weight:800;display:flex;align-items:center;gap:2px}
.trend i{width:12px;height:12px}
.tr-up{color:var(--ok)}.tr-dn{color:var(--danger)}.tr-st{color:var(--t3)}
.trust-track{height:5px;background:var(--s2);border-radius:100px;overflow:hidden;margin-top:6px}
.trust-fill{height:100%;border-radius:100px;width:0;transition:width 1s ease}
.tier-labels{display:flex;justify-content:space-between;margin-top:3px}
.tier-lbl-item{font-size:8.5px;font-weight:700;color:var(--t3)}
.tier-lbl-item.active-t{color:var(--pri)}
.strike-sec{padding:var(--sp-2) 0;border-bottom:1px solid var(--b1)}
.strike-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.strike-lbl{font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.5px}
.strike-cnt{font-size:12px;font-weight:800;color:var(--danger)}
.sdot{width:20px;height:20px;border-radius:50%;border:2px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;transition:background .2s;color:var(--t3)}
.sdot.hit{background:var(--danger);border-color:var(--danger);color:#fff}
.sdot.nw{border-color:var(--warn);color:var(--warn)}
.strike-next{font-size:10px;font-weight:600;color:var(--warn);margin-top:var(--sp-1);display:flex;align-items:center;gap:3px}
.strike-next i{width:11px;height:11px}
.tl-sec{padding:var(--sp-2) 0}
.tl-title{font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px}
.tl-item{display:flex;gap:var(--sp-2);margin-bottom:5px;align-items:flex-start}
.tl-item:last-child{margin-bottom:0}
.tl-dot{width:7px;height:7px;border-radius:50%;background:var(--danger);flex-shrink:0;margin-top:var(--sp-1)}
.tl-date{font-size:9px;font-weight:800;color:var(--t3)}
.tl-desc{font-size:10.5px;font-weight:600;color:var(--t2)}
.appeal-b{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:10px;font-weight:700;padding:3px 7px;border-radius:4px;background:var(--info-d);color:var(--info)}
.appeal-b i{width:10px;height:10px}
.models-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);padding:var(--sp-4);box-shadow:var(--sh-sm);margin-bottom:13px}
.model-item{display:flex;align-items:center;gap:var(--sp-3);padding:7px 0;border-bottom:1px solid var(--b1)}
.model-item:last-child{border-bottom:none;padding-bottom:0}
.mi-p{background:var(--pri-d)}.mi-p i{color:var(--pri)}
.mi-g{background:var(--ok-d)}.mi-g i{color:var(--ok)}
.mi-b{background:var(--info-d)}.mi-b i{color:var(--info)}
.ai-model-card .card-h i{color:var(--info)}
.model-row{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--b1)}.model-row:last-child{border-bottom:none}
.model-stage{display:flex;align-items:center;gap:var(--sp-3)}
.model-stage>i{width:18px;height:18px;color:var(--t3);flex-shrink:0}
.model-name{font-size:13px;font-weight:500;color:var(--t1)}
.model-stage-label{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--t3);margin-top:2px}
.model-stats{display:flex;gap:var(--sp-3);align-items:center;font-size:12px;color:var(--t2);font-variant-numeric:tabular-nums}
.model-cost{font-weight:600;color:var(--t1)}
.cost-total{display:flex;justify-content:space-between;padding-top:var(--sp-3);margin-top:var(--sp-1);border-top:1px solid var(--b1);font-size:13px;font-weight:700;color:var(--t1);font-variant-numeric:tabular-nums}
.highlights-card .card-h i{color:var(--warn)}
.highlight-row{display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--sp-3);margin-bottom:var(--sp-2);background:var(--s2);border-radius:var(--r-m);cursor:pointer;transition:background .15s}.highlight-row:last-child{margin-bottom:0}
.highlight-row:hover{background:var(--s3)}
.highlight-time{font-size:11px;font-variant-numeric:tabular-nums;color:var(--t3);min-width:80px;padding-top:2px;white-space:nowrap}
.highlight-content{flex:1;display:flex;flex-direction:column;gap:6px}
.highlight-text{font-size:13px;line-height:1.5;color:var(--t1)}
.highlight-cat{align-self:flex-start;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;padding:2px 6px;border-radius:var(--r-s)}
.highlight-cat.cat-violence{background:var(--badge-danger-bg);color:var(--danger)}
.highlight-cat.cat-hate{background:var(--badge-danger-bg);color:var(--danger)}
.highlight-cat.cat-sexual{background:rgba(236,72,153,.15);color:#ec4899}
.highlight-cat.cat-spam{background:var(--badge-warn-bg);color:var(--warn)}
.highlight-cat.cat-self_harm{background:var(--badge-danger-bg);color:var(--danger)}
.highlight-cat.cat-harassment{background:var(--badge-warn-bg);color:var(--warn)}
.highlight-cat.cat-misinformation{background:rgba(124,58,237,.15);color:var(--pri)}
.tr-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);padding:var(--sp-4);box-shadow:var(--sh-sm);margin-bottom:13px}
.tr-item{display:flex;gap:11px;padding:var(--sp-3) var(--sp-3);border-radius:var(--r-m);margin-bottom:7px}
.tr-item:last-child{margin-bottom:0}
.tr-item.tr-f{background:var(--dan-d);border-left:3px solid var(--danger)}
.tr-item.tr-w{background:var(--warn-d);border-left:3px solid var(--warn)}
.tr-time{font-size:9.5px;font-weight:800;color:var(--danger);white-space:nowrap;font-family:monospace;padding-top:2px;min-width:80px}
.tr-item.tr-w .tr-time{color:var(--warn)}
.tr-txt{font-size:12px;line-height:1.65;color:var(--t1);font-style:italic;font-weight:500}
.ai-rec{background:linear-gradient(130deg,var(--pri) 0%,#4c1d95 100%);border-radius:var(--r-l);padding:var(--sp-4);color:#fff;display:flex;align-items:flex-start;gap:var(--sp-3);box-shadow:0 4px 22px var(--pri-g);margin-bottom:13px}
.ai-rec-ico{width:34px;height:34px;min-width:34px;background:rgba(255,255,255,.14);border-radius:var(--r-s);display:flex;align-items:center;justify-content:center}
.ai-rec-ico i{width:17px;height:17px;color:#fff}
.ai-rec h4{font-size:13px;font-weight:800;margin-bottom:3px}
.ai-rec p{font-size:11.5px;opacity:.85;line-height:1.6;font-weight:500}
.notes-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);padding:var(--sp-4);box-shadow:var(--sh-sm)}
.notes-card textarea{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);font-size:12px;font-weight:500;color:var(--t1);resize:none;height:68px;outline:none;transition:border-color .15s}
.notes-card textarea:focus{border-color:var(--pri);background:var(--surface)}
.notes-card textarea::placeholder{color:var(--t3)}

@keyframes mslide{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
.ep{background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-l);overflow:hidden}
.ep-hdr{background:var(--s3);padding:var(--sp-3) var(--sp-3);border-bottom:1px solid var(--b1)}
.ep-field{display:flex;gap:var(--sp-2);margin-bottom:3px;font-size:11.5px}
.ep-field:last-child{margin-bottom:0}
.ep-ll{font-weight:800;color:var(--t3);min-width:48px}
.ep-vl{font-weight:600;color:var(--t1)}
.ep-subj{padding:var(--sp-3) var(--sp-3);border-bottom:1px solid var(--b1);font-size:13px;font-weight:800;color:var(--t1)}
.ep-body{padding:var(--sp-3)}
.ep-p{font-size:12px;line-height:1.7;color:var(--t2);margin-bottom:9px}
.ep-p:last-child{margin-bottom:0}
.ep-ts-box{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-2) var(--sp-3);margin:var(--sp-2) 0}
.ep-ts{display:flex;align-items:center;gap:var(--sp-2);padding:3px 0;font-size:11px}
.ep-ts-t{font-weight:800;color:var(--danger);font-family:monospace;min-width:96px}
.ep-ts-l{font-weight:600;color:var(--t2)}
.ep-strike{background:var(--warn-d);border-left:3px solid var(--warn);border-radius:0 var(--r-s) var(--r-s) 0;padding:var(--sp-2) var(--sp-3);margin:var(--sp-2) 0;font-size:11.5px;font-weight:700;color:var(--warn)}
.ep-appbtn{display:inline-flex;align-items:center;gap:6px;background:var(--pri);color:#fff;font-size:12px;font-weight:800;padding:7px 13px;border-radius:var(--r-m);cursor:pointer;margin-top:var(--sp-1)}

/* ── Toast ───────────────────────────────────────────── */
.toast{position:fixed;bottom:18px;right:18px;z-index:2000;padding:11px 15px;border-radius:var(--r-l);box-shadow:var(--sh-lg);font-size:12.5px;font-weight:700;display:flex;align-items:center;gap:var(--sp-2);max-width:310px;transform:translateY(70px);opacity:0;transition:transform .3s,opacity .3s}
.toast.show{transform:translateY(0);opacity:1}
.toast i{width:15px;height:15px;flex-shrink:0}
.toast.t-ok,.toast-ok{background:#065f46;color:#a7f3d0}
.toast.t-warn{background:#92400e;color:#fde68a}
.toast.t-esc{background:#1e3a8a;color:#bfdbfe}
.toast-err{background:#7f1d1d;color:#fca5a5}
.toast-info{background:#1e3a8a;color:#bfdbfe}

/* ── HK Overlay (keyboard shortcuts) ────────────────── */
.hk-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:100;align-items:center;justify-content:center}
.hk-overlay.show{display:flex}
.hk-modal{background:var(--surface);border:1px solid var(--b2);border-radius:var(--r-l);padding:var(--sp-5);width:440px;max-width:92vw}
.hk-hd{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:var(--sp-3);display:flex;justify-content:space-between;align-items:center}
.hk-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.hk-row{display:flex;align-items:center;gap:var(--sp-2);padding:5px 7px;background:var(--s2);border-radius:var(--r-s)}
.hk-key{background:var(--s3);border:1px solid var(--b2);border-radius:3px;padding:1px 6px;font-size:10px;font-family:monospace;color:var(--t1);min-width:28px;text-align:center}
.hk-desc{font-size:10px;color:var(--t2)}

/* ── Super-admin audit log ───────────────────────────── */
.body-scroll{flex:1;overflow-y:auto;padding:var(--sp-5) var(--sp-6) var(--sp-8)}
.body-scroll::-webkit-scrollbar{width:4px}
.body-scroll::-webkit-scrollbar-thumb{background:var(--b2);border-radius:4px}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);margin-bottom:var(--sp-4)}
.stat-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-4);box-shadow:var(--sh-sm);display:block;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s,border-color .15s}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--sh-md,0 4px 16px rgba(0,0,0,.10))}
.stat-card--active{border-color:var(--pri) !important;box-shadow:0 0 0 2px color-mix(in srgb,var(--pri) 25%,transparent) !important}
.stat-card--active .stat-num{color:var(--pri) !important}
.stat-card .stat-lbl{font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;display:flex;align-items:center;gap:5px}
.stat-card .stat-lbl i{width:12px;height:12px}
.stat-card .stat-num{font-size:26px;font-weight:900;letter-spacing:-.8px;line-height:1}
.stat-sub{font-size:11px;font-weight:600;color:var(--t3);margin-top:3px}
.stat-n1 .stat-num{color:var(--t1)}
.stat-n2 .stat-num{color:var(--ok)}
.stat-n3 .stat-num{color:var(--danger)}
.stat-n4 .stat-num{color:var(--warn)}
.alert-banner{display:flex;align-items:flex-start;gap:var(--sp-3);background:var(--warn-d);border-left:3px solid rgba(217,119,6,.55);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-4)}
.alert-ico{width:36px;height:36px;min-width:36px;background:var(--warn-d);border-radius:var(--r-m);display:flex;align-items:center;justify-content:center}
.alert-ico i{width:18px;height:18px;color:var(--warn)}
.alert-title{font-size:13px;font-weight:800;color:var(--warn);margin-bottom:5px}
.alert-items{display:flex;flex-direction:column;gap:var(--sp-1)}
.alert-item{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--t2)}
.alert-item i{width:13px;height:13px;color:var(--warn)}
.alert-dismiss{margin-left:auto;background:transparent;border:1px solid var(--badge-warn-border);color:var(--warn);font-size:11px;font-weight:700;padding:5px var(--sp-3);border-radius:var(--r-s);cursor:pointer;white-space:nowrap;align-self:flex-start}
.mod-section{margin-bottom:var(--sp-3)}
.section-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3)}
.section-title{font-size:13px;font-weight:800;display:flex;align-items:center;gap:6px}
.section-title i{width:14px;height:14px;color:var(--pri)}
.mod-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--sp-3)}
.mod-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);padding:var(--sp-3);box-shadow:var(--sh-sm);position:relative;overflow:hidden}
.mod-card.flagged-card{border-color:var(--badge-danger-border)}
.mod-card.flagged-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--danger)}
.mod-card.warn-card{border-color:var(--badge-warn-border)}
.mod-card.warn-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--warn)}
.mod-card.ok-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--ok)}
.mod-top{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-2);padding-bottom:var(--sp-2);border-bottom:1px solid var(--b1)}
.mod-av{width:30px;height:30px;border-radius:50%;flex-shrink:0;border:2px solid var(--b2);display:flex;align-items:center;justify-content:center;background:var(--pri-d);font-size:10px;font-weight:800;color:var(--pri)}
.mod-name{font-size:13px;font-weight:800}
.mod-role{font-size:10.5px;color:var(--t3);font-weight:500}
.mod-flag-badge{margin-left:auto;display:flex;align-items:center;gap:3px;font-size:9px;font-weight:800;padding:2px 7px;border-radius:4px}
.mfb-red{background:var(--dan-d);color:var(--danger)}
.mfb-warn{background:var(--warn-d);color:var(--warn)}
.mfb-ok{background:var(--ok-d);color:var(--ok)}
.mod-flag-badge i{width:11px;height:11px}
.mod-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}
.ms-item{display:flex;flex-direction:column;gap:1px}
.ms-lbl{font-size:9px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.4px}
.ms-val{font-size:12px;font-weight:700;color:var(--t1)}
.ms-val.v-ok{color:var(--ok)}.ms-val.v-dn{color:var(--danger)}.ms-val.v-wn{color:var(--warn)}
.ms-bar-track{height:4px;background:var(--s2);border-radius:100px;margin-top:6px;overflow:hidden}
.ms-bar-fill{height:100%;border-radius:100px;transition:width 1s ease}
.ms-bar-ok{background:var(--ok)}.ms-bar-dn{background:var(--danger)}.ms-bar-wn{background:var(--warn)}
.result-count{font-size:11px;font-weight:700;color:var(--t3);margin-left:auto;white-space:nowrap}
.export-btn{display:flex;align-items:center;gap:6px;padding:7px var(--sp-3);background:var(--pri);color:#fff;border:none;border-radius:var(--r-m);font-size:12px;font-weight:800;cursor:pointer;box-shadow:var(--sh-btn);transition:opacity .2s}
.export-btn:hover{opacity:.88}.export-btn i{width:13px;height:13px}
.log-table-wrap{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-xl);box-shadow:var(--sh-sm);overflow-x:auto;overflow-y:visible;display:flex;flex-direction:column;max-height:calc(100vh - 270px)}
.log-table-wrap::-webkit-scrollbar{height:8px}
.log-table-wrap::-webkit-scrollbar-thumb{background:var(--b1);border-radius:4px}
.log-table-wrap::-webkit-scrollbar-thumb:hover{background:var(--t3)}
.log-table-hdr{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--b1);display:flex;align-items:center;gap:var(--sp-2)}
.log-table-hdr h3{font-size:13px;font-weight:800}
.log-table-hdr .cnt{font-size:11px;font-weight:700;color:var(--t3)}
table{width:100%;border-collapse:collapse}
.log-table-wrap table{min-width:1100px;table-layout:fixed;border-collapse:collapse}
thead th{padding:var(--sp-3) var(--sp-3);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--t3);text-align:left;border-bottom:1px solid var(--b1);background:var(--s2);white-space:nowrap}
.log-table-wrap thead th{position:sticky;top:0;background:var(--s2);z-index:2}
tbody tr{border-bottom:1px solid var(--b1);transition:background .12s;cursor:default}
tbody tr:last-child{border-bottom:none}
tbody tr:hover{background:var(--s2)}
tbody tr.row-suspicious{background:rgba(220,38,38,.03)}
tbody tr.row-suspicious:hover{background:rgba(220,38,38,.06)}
td{padding:var(--sp-3) var(--sp-3);font-size:12px;font-weight:500;color:var(--t2);vertical-align:middle}
.log-table-wrap th.td-time,.log-table-wrap td.td-time{width:130px}
.log-table-wrap th.td-mod,.log-table-wrap td.td-mod{width:160px}
.log-table-wrap th.td-action,.log-table-wrap td.td-action{width:110px}
.log-table-wrap th.td-content,.log-table-wrap td.td-content{width:auto}
.log-table-wrap th.td-review,.log-table-wrap td.td-review{width:110px}
.log-table-wrap th.td-ai,.log-table-wrap td.td-ai{width:100px}
.td-ai-inner{font-size:12px;color:var(--t2)}
.log-table-wrap th.td-agreed,.log-table-wrap td.td-agreed{width:130px}
.log-table-wrap th.td-reason,.log-table-wrap td.td-reason{width:60px;text-align:center}
.log-table-wrap td.td-time,.log-table-wrap th.td-time{position:sticky;left:0;background:var(--surface);z-index:1}
.log-table-wrap thead th.td-time{background:var(--s2);z-index:3}
.log-table-wrap td.td-time,.log-table-wrap td.td-action,.log-table-wrap td.td-review,.log-table-wrap td.td-ai,.log-table-wrap td.td-agreed{white-space:nowrap}
.log-table-wrap td.td-content .content-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log-table-scroll{flex:1;min-height:0;overflow-y:auto}
.log-table-wrap th.td-action,.log-table-wrap td.td-action{width:200px}
.log-table-wrap .td-content{max-width:none}
.td-time{font-size:10.5px;font-weight:700;color:var(--t3);font-family:monospace;white-space:nowrap}
.td-av{width:26px;height:26px;border-radius:50%;flex-shrink:0;border:1.5px solid var(--b2);display:flex;align-items:center;justify-content:center;background:var(--pri-d);font-size:8px;font-weight:800;color:var(--pri)}
.td-mod-name{font-size:12px;font-weight:700;color:var(--t1);white-space:nowrap}
.act-badge{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:10px;font-weight:800;padding:3px var(--sp-2);border-radius:5px;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
.act-badge i{width:11px;height:11px}
.ab-approve{background:var(--ok-d);color:var(--ok)}
.ab-reject{background:var(--dan-d);color:var(--danger)}
.ab-escalate{background:var(--warn-d);color:var(--warn)}
.ab-override{background:var(--pri-d);color:var(--pri)}
.td-content{max-width:200px}
.content-title{font-size:12px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content-creator{font-size:10px;font-weight:600;color:var(--t3)}
.type-icon-sm{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:4px;flex-shrink:0}
.ti-v{background:var(--info-d)}.ti-v i{color:var(--info)}
.ti-a{background:var(--pri-d)}.ti-a i{color:var(--pri)}
.ti-t{background:var(--ok-d)}.ti-t i{color:var(--ok)}
.ti-g{background:var(--warn-d)}.ti-g i{color:var(--warn)}
.type-icon-sm i{width:11px;height:11px}
.time-cell{display:flex;align-items:center;gap:5px;white-space:nowrap}
.time-val{font-size:12px;font-weight:700;color:var(--t1)}
.time-flag{display:inline-flex;align-items:center;gap:2px;font-size:9px;font-weight:800;padding:1px 5px;border-radius:3px;background:var(--dan-d);color:var(--danger)}
.time-flag i{width:10px;height:10px}
.ai-match{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:10.5px;font-weight:700;padding:3px var(--sp-2);border-radius:5px;white-space:nowrap}
.ai-match i{width:11px;height:11px}
.aim-agreed{background:var(--ok-d);color:var(--ok)}
.aim-override{background:var(--dan-d);color:var(--danger)}
.aim-na{background:var(--s3);color:var(--t3)}
.note-ico{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--r-s);cursor:pointer;transition:background .15s}
.note-ico:hover{background:var(--s3)}
.note-ico i{width:13px;height:13px;color:var(--t3)}
.note-ico.has-note i{color:var(--pri)}
.suspicious-flag{display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:800;padding:1px 5px;border-radius:3px;background:var(--dan-d);color:var(--danger)}
.suspicious-flag i{width:10px;height:10px}
.pagination{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--b1);background:var(--surface)}
.pg-info{font-size:11.5px;font-weight:600;color:var(--t3)}
.pg-btns{display:flex;gap:var(--sp-1)}
.pg-btn{min-width:28px;height:28px;padding:0 var(--sp-3);border-radius:var(--r-s);border:1px solid var(--b1);background:var(--surface);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--t2);text-decoration:none;white-space:nowrap}
.pg-btn.active{background:var(--pri);color:#fff;border-color:var(--pri)}
.pg-btn:hover:not(.active){background:var(--s2)}
.pg-btn i{width:12px;height:12px}
.pg-btn:disabled{opacity:.35;cursor:not-allowed}
.al-csv-btn{display:flex;align-items:center;gap:6px;padding:7px var(--sp-3);background:var(--pri);color:#fff;border:none;border-radius:var(--r-m);font-size:12px;font-weight:800;cursor:pointer;box-shadow:var(--sh-btn);transition:opacity .2s;margin-left:auto}
.al-csv-btn:hover{opacity:.88}.al-csv-btn i{width:13px;height:13px}

/* ── Pill tabs (trash view) ──────────────────────────── */
.pill-tabs{display:flex;gap:var(--sp-1);padding:var(--sp-3) var(--sp-5) 0;border-bottom:1px solid var(--b1);background:var(--surface);flex-shrink:0;overflow-x:auto;scrollbar-width:none}
.pill-tabs::-webkit-scrollbar{display:none}
.pill-tab{display:flex;align-items:center;gap:6px;padding:6px var(--sp-3);border-radius:var(--r-s) var(--r-s) 0 0;font-size:12px;font-weight:700;color:var(--t3);border:none;background:transparent;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:color .15s,border-color .15s}
.pill-tab:hover{color:var(--t2)}
.pill-tab.active{color:var(--pri);border-bottom-color:var(--pri)}
.pill-tab .pill-count{font-size:9px;font-weight:800;padding:1px 6px;border-radius:100px;background:var(--s3);color:var(--t3);margin-left:2px}
.pill-tab.active .pill-count{background:var(--pri-d);color:var(--pri)}

/* ── Misc ────────────────────────────────────────────── */
select{color:var(--t1)}

/* ── Legacy compat (queue stat-bar pre-Step-4 adaptation) ── */
.stat-bar{background:var(--surface);border-bottom:1px solid var(--b1);padding:var(--sp-2) var(--sp-5);display:flex;gap:0;flex-shrink:0}
.stat-bar .stat-item{flex:1;display:flex;flex-direction:column;align-items:center;padding:var(--sp-1) 0;border-right:1px solid var(--b1)}
.stat-bar .stat-item:last-child{border-right:none}
.stat-item--link{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:none;border:none;border-right:1px solid var(--b1);cursor:pointer;text-align:center;padding:var(--sp-1) 0;transition:background .12s;color:inherit;font:inherit}
.stat-item--link:last-child{border-right:none}
.stat-item--link:hover{background:var(--s2)}
.stat-item--link:focus-visible{outline:2px solid var(--pri);outline-offset:-2px}
.stat-bar .stat-label{font-size:9px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.5px}
.stat-bar .stat-val{font-size:18px;font-weight:900;letter-spacing:-.5px;line-height:1;color:var(--t1)}
.stat-bar .stat-val--danger{color:var(--danger)}
.stat-bar .stat-val--success{color:var(--ok)}
.stat-bar .stat-val--brand{color:var(--pri)}
.stat-bar .stat-trend{font-size:9px;font-weight:500;color:var(--t3);margin-top:1px}
.stat-bar .t-dn{color:var(--danger)}.stat-bar .t-up{color:var(--ok)}
.queue-grid{display:flex;flex:1;overflow:hidden;gap:0}

/* Creator card — A2.2f */
.creator-hero{display:flex;align-items:flex-start;gap:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--b1);margin-bottom:var(--sp-3)}
.creator-avatar{width:56px;height:56px;border-radius:50%;background:var(--s2);flex-shrink:0}
.creator-meta{flex:1;min-width:0}
.creator-name{font-weight:700;font-size:15px;color:var(--t1)}
.creator-handle{display:block;font-size:12px;color:var(--pri);text-decoration:none;margin-top:2px}
.creator-handle:hover{text-decoration:underline}
.creator-since{font-size:11px;color:var(--t3);margin-top:var(--sp-1)}
.creator-tier{flex-shrink:0}
.tier-badge{font-size:9px;font-weight:700;letter-spacing:0.7px;padding:var(--sp-1) var(--sp-2);border-radius:var(--r-s);white-space:nowrap}
.tier-badge.tier-bronze{background:rgba(180,83,9,0.15);color:#b45309}
.tier-badge.tier-silver{background:rgba(120,113,108,0.15);color:#78716c}
.tier-badge.tier-gold{background:rgba(217,119,6,0.15);color:#d97706}
.tier-badge.tier-platinum{background:rgba(124,58,237,0.15);color:var(--pri)}
.creator-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3) var(--sp-5);padding-bottom:var(--sp-3);border-bottom:1px solid var(--b1);margin-bottom:var(--sp-3)}
.cstat{display:flex;justify-content:space-between;align-items:center;font-size:12px}
.cstat-l{color:var(--t3);text-transform:uppercase;letter-spacing:0.6px;font-size:10px}
.cstat-v{font-weight:600;color:var(--t1)}
.cstat-num{font-variant-numeric:tabular-nums}
.cstat-trend{font-size:10px;color:var(--ok);margin-left:6px;font-weight:500}
.cstat-strikes{display:flex;gap:var(--sp-1)}
.strike-dot{width:8px;height:8px;border-radius:50%;background:var(--s3);border:1px solid var(--b1)}
.strike-dot.on{background:var(--danger);border-color:var(--danger)}
.mon-badge{font-size:10px;font-weight:600;padding:2px 6px;border-radius:var(--r-s)}
.mon-badge.mon-on{background:var(--badge-success-bg);color:var(--ok)}
.mon-badge.mon-off{background:var(--s2);color:var(--t3)}
.creator-history-h{font-size:10px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);margin-bottom:var(--sp-2)}
.history-row{display:flex;gap:var(--sp-3);align-items:center;padding:6px var(--sp-2);margin-bottom:var(--sp-1);background:var(--s2);border-radius:var(--r-s);font-size:12px}
.history-row:last-child{margin-bottom:0}
.history-date{color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:11px}
.history-type{font-size:9px;font-weight:700;letter-spacing:0.7px;padding:2px 5px;border-radius:var(--r-s);white-space:nowrap}
.history-row.hist-warning .history-type{background:var(--badge-warn-bg);color:var(--warn)}
.history-row.hist-strike .history-type{background:var(--badge-danger-bg);color:var(--danger)}
.history-row.hist-violation .history-type{background:var(--badge-danger-bg);color:var(--danger)}
.history-row.hist-appeal .history-type{background:var(--badge-success-bg);color:var(--ok)}
.history-reason{color:var(--t1);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* AI Recommendation card */
.ai-rec-card{padding:0;overflow:hidden}
.ai-rec-grad{background:linear-gradient(135deg,var(--pri) 0%,#8b5cf6 100%);padding:var(--sp-4) var(--sp-5);color:white}
.ai-rec-h{display:flex;align-items:center;gap:var(--sp-2);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.7px;opacity:0.9;margin-bottom:var(--sp-3)}
.ai-rec-h i{width:16px;height:16px}
.ai-rec-conf{margin-left:auto;font-size:10px;background:rgba(255,255,255,0.2);padding:3px var(--sp-2);border-radius:var(--r-s);letter-spacing:0.5px}
.ai-rec-body{font-size:14px;line-height:1.55;margin-bottom:var(--sp-3)}
.ai-rec-meta{font-size:11px;opacity:0.85;text-transform:uppercase;letter-spacing:0.7px}
.ai-rec-verdict{font-weight:700;padding:2px 6px;border-radius:var(--r-s);background:rgba(255,255,255,0.2);margin-left:var(--sp-1)}

/* Summary card (v0.14.9) */
.summary-card{margin-top:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-l)}
.summary-card.summary-loading{opacity:0.7}
.summary-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-2)}
.summary-title{font-size:11px;font-weight:700;letter-spacing:0.08em;color:var(--t3);text-transform:uppercase}
.summary-lang-toggle{display:inline-flex;gap:var(--sp-1)}
.summary-lang-toggle button{padding:2px var(--sp-2);border:1px solid var(--b1);background:transparent;border-radius:var(--r-s);font-size:10px;font-weight:700;color:var(--t3);cursor:pointer;transition:background .12s,color .12s;font-family:inherit}
.summary-lang-toggle button.active{background:var(--pri);color:#fff;border-color:var(--pri)}
.summary-lang-toggle button:hover:not(.active){color:var(--t1)}
.summary-body p{margin:0;color:var(--t2);font-size:13px;line-height:1.5}
.summary-pending{color:var(--t3) !important;font-style:italic}

/* Internal Note + rating */
.note-card .card-h i{color:var(--info,var(--pri))}
.note-body{display:flex;flex-direction:column;gap:var(--sp-3)}
.note-row{display:flex;flex-direction:column;gap:6px}
.note-label{font-size:10px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);font-weight:600}
.star-rating{display:flex;gap:var(--sp-1)}
.star-btn{background:none;border:none;font-size:22px;line-height:1;cursor:pointer;color:var(--b1);padding:2px var(--sp-1);transition:color 0.15s}
.star-btn.on,.star-btn:hover{color:var(--warn)}
.note-textarea{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);font-family:inherit;font-size:13px;color:var(--t1);resize:vertical;min-height:70px}
.note-textarea:focus{outline:none;border-color:var(--pri)}
.note-actions{display:flex;align-items:center;gap:var(--sp-3)}
.note-saved{font-size:12px;color:var(--ok);font-weight:500}

.modal-field{margin-bottom:var(--sp-3)}
.modal-field label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);margin-bottom:var(--sp-1);font-weight:600}
.modal-value{font-size:13px;color:var(--t1);background:var(--s2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-s)}
.modal-body-text{white-space:pre-line;line-height:1.55;font-size:12px;max-height:240px;overflow-y:auto}
.modal-warn{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-3);background:rgba(245,158,11,0.1);border-left:3px solid var(--warn);border-radius:var(--r-s);margin-top:var(--sp-4);font-size:12px;color:var(--t1)}
.modal-warn i{color:var(--warn);flex-shrink:0}

/* ── Modal Dialog component ──────────────────────── */
.modal-dialog-bg{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--sp-5)}
.modal-dialog-card{background:var(--surface);border-radius:var(--r-xl);width:100%;max-height:90vh;overflow-y:auto;box-shadow:var(--sh-lg);display:flex;flex-direction:column;animation:mslide .2s ease}
.modal-dialog--sm{max-width:360px}
.modal-dialog--md{max-width:480px}
.modal-dialog--lg{max-width:640px}
.modal-dialog-header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-4) var(--sp-6);border-bottom:1px solid var(--b1);font-weight:700;font-size:14px}
.modal-dialog-header i:first-child,.modal-dialog-header svg:first-child{color:var(--pri);width:16px;height:16px;flex-shrink:0}
.modal-dialog-x{margin-left:auto;background:none;border:none;cursor:pointer;color:var(--t3);padding:var(--sp-1);border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.modal-dialog-x:hover{background:var(--s2);color:var(--t1)}
.modal-dialog-x i,.modal-dialog-x svg{width:15px;height:15px}
.modal-dialog-body{padding:var(--sp-6);overflow-y:auto;flex:1}
.modal-dialog-actions{display:flex;gap:var(--sp-3);justify-content:flex-end;padding:var(--sp-4) var(--sp-6);border-top:1px solid var(--b1)}

/* Transcript card */
.transcript-card .card-h i:first-child{color:var(--info,var(--pri))}
.card-toggle{margin-left:auto;background:var(--s2);border:1px solid var(--b1);color:var(--t1);padding:6px var(--sp-3);border-radius:var(--r-s);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:background 0.15s}
.card-toggle:hover{background:var(--s3,var(--s2))}
.card-toggle i{width:14px;height:14px}
.transcript-body{margin-top:var(--sp-3)}
.transcript-text{background:var(--s2);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-4);font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:12px;line-height:1.65;color:var(--t1);white-space:pre-wrap;word-wrap:break-word;max-height:400px;overflow-y:auto}
.transcript-meta{margin-top:var(--sp-2);font-size:11px;color:var(--t3);text-align:right;letter-spacing:0.3px}



/* Form inputs (v0.22.1 — Pattern #6) */
.input-form{display:flex;flex-direction:column;gap:var(--sp-4)}
.input-field{display:flex;flex-direction:column;gap:6px}
.input-row{display:flex;gap:var(--sp-3)}
.input-row--inline{flex-wrap:nowrap;align-items:center;gap:var(--sp-2);overflow-x:auto}
.input-row--inline .input-select{width:auto;min-width:88px;max-width:160px;font-size:12px;padding:6px var(--sp-2);flex-shrink:1}
.input-row--inline input[type="date"].input-select{width:110px;min-width:110px;max-width:110px}
.input-row--inline .input-search{flex:1 1 100px;min-width:80px}
.input-label{font-size:10px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);font-weight:600}
.input-label-meta{font-weight:400;color:var(--t3);font-size:11px;text-transform:none;letter-spacing:0}
.input-text,.input-select,.input-textarea{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);font-family:inherit;font-size:14px;color:var(--t1);transition:border-color 0.15s,background 0.15s;box-sizing:border-box}
.input-text:focus,.input-select:focus,.input-textarea:focus{outline:none;border-color:var(--pri);background:var(--surface)}
.input-text::placeholder,.input-textarea::placeholder{color:var(--t3)}
.input-search{flex:1 1 200px;min-width:0;position:relative}
.input-search i,.input-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--t3);width:14px;height:14px;pointer-events:none}
.input-search input{width:100%;background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-m);padding:7px var(--sp-3) 7px var(--sp-8);font-size:12px;font-weight:500;color:var(--t1);outline:none;transition:border-color .15s;box-sizing:border-box}
.input-search input:focus{border-color:var(--pri)}
.input-search input::placeholder{color:var(--t3)}
.input-textarea{resize:vertical;min-height:80px}
.input-textarea--tall{min-height:180px}
.input-checkbox{display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;font-size:13px}
.input-checkbox input[type=checkbox]{width:16px;height:16px}
.input-help{font-size:11px;color:var(--t3);margin-top:2px}
.input-error{border-color:var(--danger)}
.input-error-msg{font-size:12px;color:var(--danger);margin-top:2px}


/* v6 Banners */
.v6-banner{padding:var(--sp-3) var(--sp-4);border-radius:var(--r-m);font-size:13px;display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.v6-banner i{width:15px;height:15px;flex-shrink:0}
.v6-banner-success{background:rgba(5,150,105,0.10);color:var(--ok);border-left:3px solid var(--ok)}
.v6-banner-error{background:rgba(220,38,38,0.10);color:var(--danger);border-left:3px solid var(--danger)}
.v6-banner-warn{background:rgba(245,158,11,0.10);color:var(--warn);border-left:3px solid var(--warn)}

/* ──────────── Submit page ──────────── */
.submit-creator-row{margin-bottom:var(--sp-4)}
.submit-label{font-size:10px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);font-weight:600;display:block;margin-bottom:6px}
.submit-optional{font-weight:400;text-transform:none;letter-spacing:0;font-size:10px;color:var(--t3)}
.submit-input{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);font-family:inherit;font-size:14px;color:var(--t1);transition:border-color 0.15s,background 0.15s;box-sizing:border-box}
.submit-input:focus{outline:none;border-color:var(--pri);background:var(--surface)}
.submit-input::placeholder{color:var(--t3)}
.submit-textarea{width:100%;background:var(--s2);border:1px solid var(--b1);border-radius:var(--r-m);padding:var(--sp-3) var(--sp-3);font-family:inherit;font-size:14px;color:var(--t1);resize:vertical;transition:border-color 0.15s,background 0.15s;box-sizing:border-box}
.submit-textarea:focus{outline:none;border-color:var(--pri);background:var(--surface)}
.submit-textarea::placeholder{color:var(--t3)}

/* Tabs */
.submit-tabs{display:flex;gap:var(--sp-1);margin-bottom:var(--sp-4);border-bottom:1px solid var(--b1);padding-bottom:0}
.submit-tab{display:flex;align-items:center;gap:6px;padding:var(--sp-2) var(--sp-3);border:none;border-bottom:2px solid transparent;background:none;color:var(--t2);font-size:13px;font-weight:600;cursor:pointer;border-radius:var(--r-m) var(--r-m) 0 0;transition:color 0.15s,border-color 0.15s,background 0.15s;margin-bottom:-1px}
.submit-tab:hover{color:var(--t1);background:var(--s2)}
.submit-tab.active{color:var(--pri);border-bottom-color:var(--pri);background:transparent}

/* Panel */
.submit-panel{display:flex;flex-direction:column;gap:var(--sp-3)}
.submit-actions{display:flex;gap:var(--sp-3);align-items:center;margin-top:var(--sp-1)}
.submit-file-count{font-size:12px;color:var(--t2);margin:0}

/* Creator typeahead */
.typeahead-wrap{position:relative}
.typeahead{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-m);box-shadow:var(--sh-md);z-index:50;max-height:220px;overflow-y:auto}
.typeahead-item{display:flex;align-items:center;gap:var(--sp-3);padding:9px var(--sp-3);cursor:pointer;transition:background 0.12s}
.typeahead-item:hover{background:var(--s2)}
.typeahead-name{font-size:13px;font-weight:600;color:var(--t1);flex:1}
.typeahead-meta{font-size:12px;color:var(--t3)}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--pri-d);border:1px solid var(--pri-g);border-radius:var(--r-m);padding:5px var(--sp-3);font-size:13px;font-weight:600;color:var(--pri);margin-top:6px}
.chip-meta{font-size:11px;font-weight:400;color:var(--t2)}
.chip-close{background:none;border:none;cursor:pointer;color:var(--t3);font-size:15px;line-height:1;padding:0 2px;margin-left:2px;transition:color 0.12s}
.chip-close:hover{color:var(--danger)}

/* File drop zone */
.file-drop{border:2px dashed var(--b2);border-radius:var(--r-l);padding:var(--sp-8) var(--sp-6);text-align:center;transition:border-color 0.15s,background 0.15s;background:var(--s2)}
.file-drop:hover,.file-drop-active{border-color:var(--pri);background:var(--pri-d)}
.file-drop-label{display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);cursor:pointer}

/* Upload progress */
.progress-wrap{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-1)}
.progress-wrap progress{flex:1;height:6px;border-radius:3px;border:none;overflow:hidden;background:var(--s3,var(--s2))}
.progress-wrap progress::-webkit-progress-bar{background:var(--s3,var(--s2));border-radius:3px}
.progress-wrap progress::-webkit-progress-value{background:var(--pri);border-radius:3px}
.progress-wrap progress::-moz-progress-bar{background:var(--pri);border-radius:3px}
.progress-pct{font-size:12px;color:var(--t2);white-space:nowrap}

/* URL results list */
.results-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.result-row{display:flex;align-items:center;gap:var(--sp-3);padding:9px var(--sp-3);border-radius:var(--r-m);font-size:13px}
.result-row.result-ok{background:var(--ok-d);color:var(--ok)}
.result-row.result-err{background:var(--dan-d);color:var(--danger)}
.result-icon{font-weight:700;flex-shrink:0}
.result-url{flex:1;color:inherit;font-size:12px;word-break:break-all}
.result-msg{font-size:12px;color:inherit;flex-shrink:0}
.result-link{font-size:12px;color:var(--pri);text-decoration:none;flex-shrink:0}
.result-link:hover{text-decoration:underline}
.result-inline{padding:9px var(--sp-3);border-radius:var(--r-m);font-size:13px;margin:0}
.result-inline.result-ok{background:var(--ok-d);color:var(--ok)}
.result-inline.result-err{background:var(--dan-d);color:var(--danger)}

/* ──────────── Auth Layout ──────────── */
.auth-body{margin:0;overflow:auto}
.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--sp-6);background:var(--bg)}
.auth-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);box-shadow:var(--sh-md);width:100%;max-width:420px;padding:var(--sp-8) 28px;box-sizing:border-box}
.auth-brand{text-align:center;margin-bottom:28px}
.auth-logo{font-family:'Manrope',sans-serif;font-size:24px;font-weight:800;color:var(--pri);letter-spacing:-0.5px}
.auth-logo-sub{font-size:11px;text-transform:uppercase;letter-spacing:0.7px;color:var(--t3);margin-top:var(--sp-1)}
.auth-h1{font-size:18px;font-weight:700;color:var(--t1);margin:0 0 6px}
.auth-sub{font-size:13px;color:var(--t3);margin:0 0 22px}
.auth-actions{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-5)}
.auth-actions .btn--primary{width:100%}
.auth-link{text-align:center;font-size:13px;color:var(--t2);margin-top:var(--sp-4)}
.auth-link a{color:var(--pri);text-decoration:none}
.auth-link a:hover{text-decoration:underline}

/* Floating theme toggle (auth pages) */
.theme-toggle-floating{position:fixed;bottom:24px;right:24px;background:var(--surface);border:1px solid var(--b1);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--sh-sm);color:var(--t1);transition:background 0.15s}
.theme-toggle-floating:hover{background:var(--s2)}
.theme-toggle-floating i{width:16px;height:16px}

/* ──────────── Settings page (A2.6) ──────────── */
.settings-view{display:flex;flex-direction:column;gap:var(--sp-4);max-width:1200px}
.settings-section{padding-top:var(--sp-1)}
.settings-row{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--b1);font-size:13px}
.settings-label{color:var(--t3);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:600}
.settings-value{color:var(--t1)}

.settings-table{width:100%;border-collapse:collapse;font-size:13px}
.settings-table thead th{text-align:left;padding:var(--sp-2) var(--sp-3);font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--t3);font-weight:600;border-bottom:1px solid var(--b1)}
.settings-table tbody td{padding:var(--sp-3);border-bottom:1px solid var(--b1);color:var(--t1)}
.settings-table tbody tr:last-child td{border-bottom:none}
.settings-empty{text-align:center;color:var(--t3);padding:var(--sp-6);font-size:12px}
.settings-you{color:var(--t3);font-style:italic;font-size:12px}
.settings-help{font-size:12px;color:var(--t3);margin:0 0 var(--sp-3)}

.role-badge{display:inline-block;padding:2px var(--sp-2);border-radius:var(--r-s);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.role-badge.role-moderator{background:var(--badge-info-bg);color:var(--badge-info-fg)}
.role-badge.role-super_admin{background:rgba(124,58,237,.15);color:var(--pri)}


.add-moderator-form,.generate-token-form{padding-top:var(--sp-2)}

.token-display{font-family:ui-monospace,monospace;font-size:11px;margin-top:0}

.model-row{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--b1);font-size:13px}
.model-stage{font-weight:600;color:var(--t1)}
.model-detail{color:var(--t3);font-size:11px}
.model-name{text-align:right}
.model-name-mono{font-family:ui-monospace,monospace;font-size:12px;color:var(--t1)}

.threshold-row{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;border-bottom:1px solid var(--b1);gap:var(--sp-4)}
.threshold-info{flex:1}
.threshold-label{font-weight:600;color:var(--t1);font-size:14px}
.threshold-help{color:var(--t3);font-size:11px;margin-top:2px}
.threshold-control{display:flex;gap:var(--sp-2);align-items:center;flex-shrink:0}
.threshold-input{width:100px !important;text-align:center;font-family:ui-monospace,monospace}

.card-count{margin-left:auto;background:var(--s2);color:var(--t3);font-size:11px;padding:2px var(--sp-2);border-radius:var(--r-s);font-weight:600}

.v6-banner-success{background:var(--ok-d,rgba(34,197,94,.1));color:var(--ok,#22c55e);border:1px solid rgba(34,197,94,.2)}
.v6-banner-error{background:var(--dan-d,rgba(239,68,68,.1));color:var(--danger,#ef4444);border:1px solid rgba(239,68,68,.2)}
.v6-banner-warn{background:rgba(251,191,36,.1);color:var(--t1);border:1px solid rgba(251,191,36,.2)}

/* ──────────── Library shared (A2.7 / A2.7.1) ──────────── */
.type-badge{font-size:9px;font-weight:700;letter-spacing:.5px;padding:2px 6px;border-radius:var(--r-s);background:var(--s2);color:var(--t2)}
.type-badge.type-video{background:var(--badge-info-bg);color:var(--badge-info-fg)}
.type-badge.type-audio{background:rgba(168,85,247,.15);color:#a855f7}
.type-badge.type-post{background:var(--badge-success-bg);color:var(--ok)}
.type-badge.type-image_gallery{background:var(--badge-warn-bg);color:var(--warn)}

/* Library status badges — past-tense states */
.ab-approved{background:var(--ok-d);color:var(--ok)}
.ab-rejected{background:var(--dan-d);color:var(--danger)}
.ab-flagged{background:var(--warn-d,rgba(251,191,36,.15));color:var(--warn)}
.ab-pending{background:var(--s2);color:var(--t3)}
.ab-hidden{background:rgba(124,58,237,.12);color:var(--pri)}

.pg-btn-disabled{opacity:.35;cursor:not-allowed;pointer-events:none}

.bulk-bar{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);box-shadow:var(--sh-md);padding:var(--sp-3) var(--sp-4);display:flex;align-items:center;gap:var(--sp-4);z-index:100}
.bulk-count{font-size:13px;font-weight:600;color:var(--t1)}
.bulk-actions{display:flex;gap:var(--sp-2)}
.bulk-bar span{color:var(--t1)}
.bulk-btn{background:var(--s2);color:var(--t1);border:1px solid var(--b1);display:inline-flex;align-items:center;gap:4px}
.bulk-btn i{width:12px;height:12px;flex-shrink:0}
.bulk-btn:hover{background:var(--s3)}
.bulk-cancel{color:var(--t2)}
.bulk-cancel:hover{color:var(--t1)}

/* ──────────── Library Tile Grid (A2.7.1) ──────────── */
.lib-grid-toolbar{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-3);margin-bottom:var(--sp-3);font-size:12px}
.lib-count{color:var(--t3);text-transform:uppercase;letter-spacing:.5px;font-weight:600;font-size:11px;margin-right:auto}

.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--sp-4);padding-bottom:80px}

.lib-tile{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);overflow:hidden;cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex;flex-direction:column}
.lib-tile:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:var(--pri)}

.lib-tile-thumb{position:relative;aspect-ratio:16/9;background:var(--s2);overflow:hidden;display:flex;align-items:center;justify-content:center}
.lib-tile-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.lib-tile-thumb-icon{background:var(--s3,var(--s2))}
.lib-tile-thumb-icon i,.lib-tile-thumb-icon svg{width:48px;height:48px;color:var(--t3);stroke-width:1.5}

.lib-tile-status{position:absolute;top:8px;right:8px;font-size:9px !important;padding:3px 7px !important;backdrop-filter:blur(8px);background:rgba(255,255,255,.92)}
[data-theme="dark"] .lib-tile-status{background:rgba(20,20,30,.85)}

.lib-tile-check{position:absolute;top:8px;left:8px;cursor:pointer;z-index:2}
.lib-tile-check input[type=checkbox]{position:absolute;opacity:0;width:22px;height:22px;cursor:pointer;margin:0}
.lib-tile-check-box{display:block;width:22px;height:22px;border-radius:var(--r-s);background:rgba(255,255,255,.92);border:1px solid var(--b1);transition:background .15s,border-color .15s}
[data-theme="dark"] .lib-tile-check-box{background:rgba(20,20,30,.75)}
.lib-tile-check input:checked + .lib-tile-check-box{background:var(--pri);border-color:var(--pri);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:14px}
.lib-tile-check:hover .lib-tile-check-box{border-color:var(--pri)}

.lib-tile-body{padding:var(--sp-3) var(--sp-3) var(--sp-3);display:flex;flex-direction:column;gap:6px;flex:1}
.lib-tile-title{font-size:13px;font-weight:600;color:var(--t1);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.lib-tile-meta{display:flex;align-items:center;gap:var(--sp-1);font-size:11px;color:var(--t3)}
.lib-tile-creator{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib-tile-dot{color:var(--t3)}
.lib-tile-time{white-space:nowrap;flex-shrink:0}
.lib-tile-score{display:flex;justify-content:space-between;align-items:center;padding-top:6px;border-top:1px solid var(--b1);margin-top:auto;font-size:10px}
.lib-tile-score-lbl{color:var(--t3);text-transform:uppercase;letter-spacing:.5px}
.lib-tile-score-val{color:var(--t1);font-weight:600;font-variant-numeric:tabular-nums}


/* ──────────── Library list mode + view toggle (A2.7.2) ──────────── */
.lib-grid--list{grid-template-columns:1fr;gap:6px}
.lib-grid--list .lib-tile{flex-direction:row;align-items:stretch;height:80px}
.lib-grid--list .lib-tile-thumb{width:130px;min-width:130px;aspect-ratio:unset;height:100%;border-radius:0}
.lib-grid--list .lib-tile-body{flex-direction:row;align-items:center;padding:0 var(--sp-3);gap:var(--sp-4);flex:1}
.lib-grid--list .lib-tile-title{min-height:unset;-webkit-line-clamp:1;width:340px;min-width:0;flex-shrink:0}
.lib-grid--list .lib-tile-meta{flex:1}
.lib-grid--list .lib-tile-score{border-top:none;padding-top:0;margin-top:0;gap:var(--sp-1)}

.view-toggle{display:flex;border:1px solid var(--b1);border-radius:var(--r-s);overflow:hidden}
.view-toggle-btn{background:none;border:none;padding:5px var(--sp-2);cursor:pointer;color:var(--t3);display:flex;align-items:center;transition:background .12s,color .12s}
.view-toggle-btn:hover{background:var(--s2);color:var(--t1)}
.view-toggle-btn.active{background:var(--pri-dim,var(--s3,var(--s2)));color:var(--pri)}
.view-toggle-btn i{width:15px;height:15px}

/* ──────────── Appeals Page (A2.8) ──────────── */

.list-detail-layout {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: var(--sp-4);
    align-items: start;
    margin-top: var(--sp-3);
    min-height: calc(100vh - 280px);
}
@media (max-width: 900px) {
    .list-detail-layout { grid-template-columns: 1fr; }
}

.appeals-list {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.appeal-row {
    padding: var(--sp-3) var(--sp-3);
    border-bottom: 1px solid var(--b1);
    cursor: pointer;
    transition: background 0.15s;
}
button.appeal-row { display: block; width: 100%; background: none; border: none; border-bottom: 1px solid var(--b1); text-align: left; font: inherit; color: inherit; }
.appeal-row:hover { background: var(--s2); }
.appeal-row:focus-visible { outline: 2px solid var(--pri); outline-offset: -2px; }
.appeal-row-active { background: rgba(124,58,237,0.06); border-left: 3px solid var(--pri); padding-left: 11px; }
.appeal-row:last-of-type { border-bottom: none; }

.appeal-row-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.appeal-row-time { font-size: 11px; color: var(--t3); }
.appeal-row-creator { font-size: 13px; font-weight: 600; color: var(--t1); margin-bottom: var(--sp-1); }
.appeal-row-snippet {
    font-size: 12px;
    color: var(--t2);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    padding: var(--sp-12) var(--sp-5);
    text-align: center;
    color: var(--t3);
}
.empty-state-icon i,
.empty-state-icon svg {
    width: 32px;
    height: 32px;
    color: var(--t3);
    stroke-width: 1.5;
    opacity: 0.6;
}
.empty-state-text {
    font-size: 14px;
    font-weight: 600;
    color: var(--t2);
}
.empty-state-sub {
    font-size: 12px;
    color: var(--t3);
    line-height: 1.5;
    max-width: 320px;
}
.empty-state-action {
    margin-top: var(--sp-2);
}
td > .empty-state {
    padding: 30px var(--sp-3);
}

.appeals-detail {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    overflow: hidden;
    min-height: 400px;
}

.detail-card { padding: var(--sp-5); }

.detail-h {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: var(--sp-3);
    margin-bottom: var(--sp-4);
    border-bottom: 1px solid var(--b1);
}
.detail-h-creator { font-size: 15px; font-weight: 600; color: var(--t1); }
.detail-h-time { font-size: 11px; color: var(--t3); margin-top: 2px; }

.detail-section { margin-bottom: var(--sp-4); }
.detail-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--t3);
    font-weight: 600;
    margin-bottom: var(--sp-2);
}

.content-summary {
    background: var(--s2);
    border-radius: var(--r-m);
    padding: var(--sp-3);
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}
.content-summary-missing { color: var(--t3); font-style: italic; }
.content-title { font-size: 13px; font-weight: 600; color: var(--t1); }
.content-meta { display: flex; gap: var(--sp-2); align-items: center; flex-wrap: wrap; font-size: 11px; color: var(--t3); }
.content-conf { color: var(--t2); font-variant-numeric: tabular-nums; }
.content-hide-reason { font-size: 11px; color: var(--t3); font-style: italic; }

.appeal-text {
    background: var(--s2);
    border-radius: var(--r-m);
    padding: var(--sp-3);
    font-size: 13px;
    line-height: 1.55;
    color: var(--t1);
    white-space: pre-wrap;
}

.detail-decided {
    background: var(--s2);
    border-radius: var(--r-m);
    padding: var(--sp-3);
}
.decided-row { display: flex; align-items: center; gap: var(--sp-3); }
.decided-meta { font-size: 11px; color: var(--t3); }
.decision-reason {
    margin-top: var(--sp-2);
    padding-top: var(--sp-2);
    border-top: 1px solid var(--b1);
    font-size: 12px;
    color: var(--t2);
    font-style: italic;
}

.detail-actions {
    display: flex;
    gap: var(--sp-3);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--b1);
    flex-wrap: wrap;
}



.email-preview {
    background: var(--s2);
    border-radius: var(--r-m);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
    font-size: 12px;
}
.email-row { display: flex; gap: var(--sp-3); padding: var(--sp-1) 0; }
.email-row + .email-row { border-top: 1px solid var(--b1); padding-top: 6px; margin-top: var(--sp-1); }
.email-lbl { text-transform: uppercase; color: var(--t3); font-weight: 600; width: 60px; flex-shrink: 0; }
.email-val { color: var(--t1); }
.email-body {
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--b1);
    white-space: pre-wrap;
    color: var(--t1);
    font-family: var(--font-body, ui-sans-serif);
    font-size: 13px;
    line-height: 1.55;
}

/* ──────────── Analytics Page (A2.9) ──────────── */

.analytics-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
    align-items: center;
    margin: var(--sp-3) 0 var(--sp-4);
    padding: var(--sp-3) var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
}
.quick-filters, .date-inputs { display: flex; gap: 6px; align-items: center; }
.date-sep { color: var(--t3); font-size: 11px; }

.qf-btn {
    padding: 5px var(--sp-3);
    border-radius: var(--r-m);
    background: var(--s2);
    color: var(--t2);
    border: 1px solid transparent;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    transition: background 0.15s, color 0.15s;
}
.qf-btn:hover { background: var(--s3, var(--s2)); color: var(--t1); }
.qf-active { background: var(--pri); color: white; }
.qf-active:hover { background: var(--pri); color: white; opacity: 0.9; }

.analytics-loading {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--t3);
    margin-left: auto;
}
.analytics-loading i { width: 13px; height: 13px; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.analytics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-4);
    padding-bottom: var(--sp-6);
}
.chart-card { display: flex; flex-direction: column; }
.chart-card-full { grid-column: 1 / -1; }

.card-meta { color: var(--t2); font-variant-numeric: tabular-nums; font-weight: 600; }

.chart-wrap {
    position: relative;
    height: 260px;
    padding: var(--sp-1) var(--sp-1) var(--sp-2);
}
.chart-wrap canvas { width: 100% !important; height: 100% !important; }
.chart-wrap-donut { height: 230px; }

.chart-empty {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--t3);
    font-style: italic;
    font-size: 12px;
    pointer-events: none;
    background: var(--surface);
}

.stats-cell-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: var(--sp-3);
    background: var(--s2);
    padding: var(--sp-3);
    border-radius: var(--r-m);
}
.stats-cell { text-align: center; }
.stats-cell-label {
    font-size: 10.5px;
    font-weight: 700;
    color: var(--t3);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}
.stats-cell-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--t1);
    font-variant-numeric: tabular-nums;
}
.stats-cell-value-small {
    font-size: 13px;
    font-weight: 600;
    color: var(--t2);
}
.stats-cell-value-warn { color: var(--warn); }

@media (max-width: 900px) {
    .analytics-grid { grid-template-columns: 1fr; }
    .chart-card-full { grid-column: 1; }
    .analytics-filters { flex-direction: column; align-items: flex-start; gap: var(--sp-3); }
}

.chart-wrap-short { height: 140px; }

/* ──────────── Auto-mod Rules ──────────── */

.rules-table{width:100%;border-collapse:collapse;font-size:13px}
.rules-table thead th{text-align:left;padding:var(--sp-3) var(--sp-3);font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--t3);font-weight:600;border-bottom:1px solid var(--b1)}
.rules-table tbody td{padding:var(--sp-3) var(--sp-3);border-bottom:1px solid var(--b1);color:var(--t1);vertical-align:middle}
.rules-table tbody tr:last-child td{border-bottom:none}
.rules-table .td-priority{width:90px}
.rules-table .td-active{width:70px}
.rules-table .td-type{width:170px}
.rules-table .td-condition{width:220px}
.rules-table .td-action{width:140px}
.rules-table .td-fires{width:130px}
.rules-table .td-actions{width:90px;text-align:right}

.priority-badge{display:inline-block;padding:2px var(--sp-2);background:var(--s2);border-radius:var(--r-s);font-family:ui-monospace,monospace;font-size:12px;color:var(--t1)}

.toggle-btn{width:36px;height:20px;border-radius:10px;background:var(--s3,#ccc);border:none;position:relative;cursor:pointer;transition:background .15s;padding:0;flex-shrink:0}
.toggle-knob{position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:50%;transition:transform .15s;pointer-events:none}
.toggle-btn.toggle-on{background:var(--ok)}
.toggle-btn.toggle-on .toggle-knob{transform:translateX(16px)}

.type-badge.type-creator-trust{background:var(--badge-info-bg);color:var(--badge-info-fg)}
.type-badge.type-category-threshold{background:rgba(168,85,247,.15);color:#a855f7}

.amr-row{display:grid;grid-template-columns:1fr 150px;gap:12px;align-items:start}
.amr-col-grow{min-width:0}
.amr-col-fixed{min-width:0}
.action-badge{display:inline-block;padding:2px var(--sp-2);border-radius:var(--r-s);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.action-badge.action-auto-approve{background:var(--badge-success-bg);color:var(--ok)}
.action-badge.action-auto-reject{background:var(--badge-danger-bg);color:var(--danger)}
.action-badge.action-auto-flag{background:var(--badge-warn-bg);color:var(--warn)}

.cond-text{font-size:12px;color:var(--t2)}
.cond-text strong{color:var(--t1);font-family:ui-monospace,monospace}

.fires-count{font-weight:600;color:var(--t1);font-variant-numeric:tabular-nums}
.fires-when{display:block;font-size:10px;color:var(--t3);margin-top:2px}



/* ──────────── Moderators Page ──────────── */


.moderators-list {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.moderator-row {
    padding: var(--sp-3);
    border-bottom: 1px solid var(--b1);
    cursor: pointer;
    transition: background 0.15s;
}
button.moderator-row { display: block; width: 100%; background: none; border: none; border-bottom: 1px solid var(--b1); text-align: left; font: inherit; color: inherit; }
.moderator-row:hover { background: var(--s2); }
.moderator-row:focus-visible { outline: 2px solid var(--pri); outline-offset: -2px; }
.moderator-row-active { background: rgba(124, 58, 237, 0.06); border-left: 3px solid var(--pri); padding-left: 11px; }
.moderator-row:last-of-type { border-bottom: none; }

.moderator-row-h {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}
.moderator-name { font-weight: 600; font-size: 13px; color: var(--t1); }

.moderator-row-meta {
    display: flex;
    gap: var(--sp-2);
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 6px;
}
.moderator-stat { font-size: 11px; color: var(--t3); }

.moderator-row-time { font-size: 10px; color: var(--t3); }


.moderators-detail {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    overflow: hidden;
    min-height: 400px;
    padding: 0;
}

.detail-h-name { font-size: 16px; font-weight: 600; color: var(--t1); }
.detail-h-email { font-size: 12px; color: var(--t3); margin-top: 2px; }



.status-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3);
    background: var(--s2);
    border-radius: var(--r-m);
}
.status-meta { font-size: 11px; color: var(--t3); }

.status-badge {
    display: inline-block;
    padding: 2px var(--sp-2);
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.status-badge.status-active { background: var(--badge-success-bg); color: var(--ok); }
.status-badge.status-suspended { background: var(--badge-danger-bg); color: var(--bad); }

.mail-driver-hint {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-top: var(--sp-3);
    padding: var(--sp-3) var(--sp-3);
    background: rgba(245, 158, 11, 0.1);
    border-left: 3px solid rgba(217,119,6,.45);
    border-radius: var(--r-s);
    font-size: 12px;
    color: var(--t1);
}

.timeline { margin-top: var(--sp-2); }
.timeline-entry {
    display: flex;
    gap: var(--sp-3);
    padding: var(--sp-3) 0;
    border-bottom: 1px solid var(--b1);
    align-items: flex-start;
}
.timeline-entry:last-child { border-bottom: none; }
.timeline-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--t3);
    margin-top: 6px;
    flex-shrink: 0;
}
.timeline-dot-approved { background: var(--ok); }
.timeline-dot-rejected, .timeline-dot-hidden { background: var(--bad); }
.timeline-dot-flagged { background: var(--warn); }
.timeline-dot-auto-rule-fired { background: var(--pri); }
.timeline-body { flex: 1; min-width: 0; }
.timeline-action { font-size: 13px; color: var(--t1); text-transform: capitalize; }
.timeline-action-name { font-weight: 600; }
.timeline-target { color: var(--t3); }
.timeline-reason {
    font-size: 11px;
    color: var(--t2);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.timeline-time { font-size: 11px; color: var(--t3); margin-top: 2px; }
.timeline-empty {
    text-align: center;
    color: var(--t3);
    padding: var(--sp-5);
    font-style: italic;
    font-size: 12px;
}

/* ──────────── Permissions Page ──────────── */

.role-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-3);
    margin-bottom: var(--sp-5);
}
@media (max-width: 800px) {
    .role-cards { grid-template-columns: 1fr; }
}
.role-card {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    padding: var(--sp-3) var(--sp-4);
    border-left: 3px solid var(--t3);
}
.role-card-super-admin { border-left-color: var(--pri); }
.role-card-moderator { border-left-color: var(--ok); }
.role-card-h { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-2); }
.role-card-name { font-weight: 600; font-size: 14px; color: var(--t1); }
.role-card-body { font-size: 12px; color: var(--t2); line-height: 1.5; margin-bottom: var(--sp-2); }
.role-card-pages { font-size: 11px; color: var(--t3); line-height: 1.4; }
.role-card-pages strong { color: var(--t2); }

.user-section {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    margin-bottom: var(--sp-3);
    overflow: hidden;
}
.user-section-h {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--b1);
    font-weight: 600;
    font-size: 13px;
    color: var(--t1);
    background: var(--s2);
}
.user-section-count {
    margin-left: auto;
    background: var(--s3);
    border-radius: var(--r-s);
    padding: 2px var(--sp-2);
    font-size: 11px;
    color: var(--t2);
}
.user-list { display: flex; flex-direction: column; }
.user-row {
    display: grid;
    grid-template-columns: 1.5fr 1.5fr auto;
    gap: var(--sp-3);
    align-items: center;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--b1);
}
.user-row:last-child { border-bottom: none; }
.user-row-name { font-weight: 600; font-size: 13px; color: var(--t1); }
.user-row-email { font-size: 11px; color: var(--t3); margin-top: 2px; }
.user-row-meta { display: flex; flex-direction: column; gap: var(--sp-1); }
.user-row-since { font-size: 11px; color: var(--t3); }
.user-row-actions { display: flex; gap: var(--sp-1); justify-content: flex-end; }
.user-row-self-note { font-size: 11px; color: var(--t3); font-style: italic; padding: 0 var(--sp-2); }
.user-list-empty {
    padding: 30px var(--sp-5);
    text-align: center;
    color: var(--t3);
    font-size: 12px;
    font-style: italic;
}


.access-matrix-wrap {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    padding: var(--sp-3) var(--sp-4);
    margin-top: var(--sp-4);
}
.matrix-h { font-size: 13px; font-weight: 600; color: var(--t1); margin-bottom: var(--sp-3); }
.access-matrix { width: 100%; border-collapse: collapse; font-size: 12px; }
.access-matrix th {
    text-align: left;
    padding: 6px var(--sp-3);
    color: var(--t3);
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--b1);
}
.access-matrix td { padding: 6px var(--sp-3); color: var(--t1); border-bottom: 1px solid var(--b1); }
.access-matrix tr:last-child td { border-bottom: none; }
.access-matrix .matrix-page { width: 50%; }
.access-matrix .matrix-role { width: 25%; text-align: center; }
.matrix-yes { color: var(--ok); font-weight: 700; }
.matrix-no { color: var(--t3); }

.settings-moved-note {
    font-size: 12px;
    color: var(--t2);
    line-height: 1.5;
    margin-bottom: var(--sp-3);
}

/* ──────────── Creators Page ──────────── */

.creators-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    margin: var(--sp-3) 0 var(--sp-4);
    flex-wrap: wrap;
}

.filter-pills { display: flex; gap: 6px; flex-wrap: wrap; }

.filter-pill {
    padding: 6px var(--sp-3);
    border-radius: 16px;
    background: var(--surface);
    border: 1px solid var(--b1);
    color: var(--t2);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    cursor: pointer;
}
.filter-pill:hover { background: var(--s2); color: var(--t1); border-color: var(--b2); }
.filter-pill-active { background: var(--pri); color: #fff; border-color: var(--pri); }
.filter-pill-active:hover { opacity: 0.9; color: #fff; }

.creators-search-form { flex: 0 0 280px; }
.creators-search {
    width: 100%;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--b1);
    border-radius: var(--r-m);
    background: var(--surface);
    font-size: 13px;
    color: var(--t1);
    box-sizing: border-box;
}
.creators-search:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 3px rgba(124,58,237,0.1); }

@media (max-width: 800px) {
    .creators-toolbar { flex-direction: column; align-items: stretch; }
    .creators-search-form { flex: 1; }
}

/* Creator avatar circles */
.creator-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.5px;
    flex-shrink: 0;
    user-select: none;
}
.creator-avatar-lg { width: 52px; height: 52px; font-size: 16px; }
.creator-avatar-trusted   { background: var(--badge-success-bg);  color: var(--ok); }
.creator-avatar-standard  { background: var(--badge-info-bg); color: var(--badge-info-fg); }
.creator-avatar-probation { background: var(--badge-warn-bg); color: var(--warn); }
.creator-avatar-suspended { background: var(--badge-danger-bg);  color: var(--bad); }

/* Tier badges */
.tier-badge {
    display: inline-block;
    padding: 2px var(--sp-2);
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}
.tier-trusted   { background: var(--badge-success-bg);  color: var(--ok); }
.tier-standard  { background: var(--badge-info-bg); color: var(--badge-info-fg); }
.tier-probation { background: var(--badge-warn-bg); color: var(--warn); }
.tier-suspended { background: var(--badge-danger-bg);  color: var(--bad); }

/* Creator list row */
.creator-row { display: block; }
.creator-row-main { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-2); }
.creator-row-info { flex: 1; min-width: 0; }
.creator-row-name { font-weight: 600; font-size: 13px; color: var(--t1); margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.creator-row-meta { display: flex; align-items: center; gap: var(--sp-2); font-size: 11px; }
.creator-extid { color: var(--t3); font-family: ui-monospace, monospace; font-size: 10px; overflow: hidden; text-overflow: ellipsis; }

.creator-row-stats { display: flex; align-items: center; gap: var(--sp-3); font-size: 11px; color: var(--t2); }
.creator-stat { display: inline-flex; align-items: center; gap: var(--sp-1); }
.creator-stat i { width: 12px; height: 12px; }
.creator-stat-warn { color: var(--warn); }
.creator-stat-time { margin-left: auto; color: var(--t3); font-size: 10px; }

/* Detail panel header */
.creator-detail-avatar-row { display: flex; align-items: center; gap: var(--sp-3); }



/* Coming soon hint */
.creator-coming-soon {
    display: flex;
    gap: var(--sp-3);
    align-items: flex-start;
    margin: 0 0 var(--sp-4);
    padding: var(--sp-3) var(--sp-3);
    background: rgba(59,130,246,0.08);
    border-left: 3px solid var(--badge-info-border);
    border-radius: var(--r-s);
    font-size: 12px;
    color: var(--t1);
    line-height: 1.5;
}
.creator-coming-soon i { width: 16px; height: 16px; color: var(--badge-info-fg); flex-shrink: 0; margin-top: 2px; }
.creator-coming-soon strong { color: var(--t1); font-weight: 600; }

/* Tier change row */
.tier-change-row { display: flex; gap: var(--sp-2); align-items: stretch; }
.tier-change-row .v6-select { flex: 1; }

/* Spinner */
@keyframes spin { to { transform: rotate(360deg); } }
.spin { animation: spin 1s linear infinite; }

/* btn-link for inline anchor in empty state */
.btn-link { color: var(--pri); text-decoration: underline; font-size: inherit; background: none; border: none; cursor: pointer; padding: 0; }

/* ──────────── Submit Page ──────────── */

.submit-page { max-width: 800px; margin: 0 auto; }

.submit-card {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    margin-bottom: var(--sp-4);
    overflow: hidden;
}
.submit-card-h {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--b1);
    background: var(--s2);
    font-weight: 600;
    font-size: 13px;
    color: var(--t1);
}
.submit-card-h i { width: 14px; height: 14px; }
.submit-card-body { padding: var(--sp-4); }

/* Mode tabs */
.submit-tabs { display: flex; border-bottom: 1px solid var(--b1); background: var(--s2); }
.submit-tab {
    flex: 1;
    padding: var(--sp-3) var(--sp-4);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--t2);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    font-family: inherit;
}
.submit-tab:hover { color: var(--t1); background: rgba(0,0,0,0.02); }
.submit-tab-active { color: var(--pri); border-bottom-color: var(--pri); background: var(--surface); }
.submit-tab i { width: 14px; height: 14px; }
.submit-mode-body { padding: var(--sp-4); }


/* File upload area */
.file-upload-area {
    border: 2px dashed var(--b2);
    border-radius: var(--r-m);
    transition: border-color 0.15s, background 0.15s;
    cursor: pointer;
}
.file-upload-area:hover { border-color: var(--pri); background: rgba(124,58,237,0.04); }
.file-upload-active { border-color: var(--pri); background: rgba(124,58,237,0.06); border-style: solid; }
.file-upload-input { position: absolute; opacity: 0; width: 0; height: 0; }
.file-upload-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    padding: var(--sp-8) var(--sp-5);
    color: var(--t2);
    font-size: 13px;
    cursor: pointer;
}
.file-upload-active .file-upload-label { color: var(--t1); }
.file-upload-label i { width: 20px; height: 20px; }
.file-size { font-size: 11px; color: var(--t3); margin-left: var(--sp-2); }

/* Upload progress */
.upload-progress-bar {
    margin-top: var(--sp-3);
    height: 24px;
    background: var(--s2);
    border-radius: var(--r-m);
    position: relative;
    overflow: hidden;
}
.upload-progress-fill { height: 100%; background: linear-gradient(90deg, var(--pri), #a855f7); transition: width 0.2s; }
.upload-progress-text {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 11px; color: white; font-weight: 600;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* Submit action row */
.submit-actions { margin-top: var(--sp-3); display: flex; justify-content: flex-end; gap: var(--sp-2); }

/* Result rows */
.result-row {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    padding: var(--sp-3) 0;
    border-bottom: 1px solid var(--b1);
}
.result-row:last-child { border-bottom: none; }
.result-row > i { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }
.result-row-ok > i { color: var(--ok); }
.result-row-err > i { color: var(--bad); }
.result-info { flex: 1; min-width: 0; }
.result-source {
    font-family: ui-monospace, monospace;
    font-size: 11px;
    color: var(--t1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.result-msg { font-size: 11px; color: var(--t3); margin-top: 2px; }

/* Creator link dropdown (submit page uses same .creator-result* from creators page) */

/* Manual badge in queue */
.manual-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: 2px 7px;
    background: rgba(168,85,247,0.12);
    color: #a855f7;
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}
.manual-badge i { width: 10px; height: 10px; }

/* ── Score pills (A3.8) ────────────────────────────────── */
.score-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}
.score-pill.sp-clean   { background: rgba(0,229,160,0.12); color: #00e5a0; }
.score-pill.sp-low     { background: rgba(255,176,32,0.12); color: #ffb020; }
.score-pill.sp-mid     { background: rgba(255,145,0,0.15);  color: #ff9100; }
.score-pill.sp-high    { background: rgba(255,77,106,0.15); color: #ff4d6a; }
.score-pill.sp-pending { background: rgba(100,100,120,0.12); color: var(--t3); }

/* ── Live indicator (A3.8) ─────────────────────────────── */
.live-indicator {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #00e5a0;
}
.live-indicator.live-paused { color: var(--t3); }
.live-indicator.live-paused .live-dot { background: var(--t3); animation: none; }
.live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #00e5a0;
    animation: live-pulse 1.8s ease-in-out infinite;
    flex-shrink: 0;
}
@keyframes live-pulse {
    0%, 100% { opacity: 1;   transform: scale(1); }
    50%       { opacity: 0.4; transform: scale(0.7); }
}

/* ── System Status page (A3.9) ─────────────────────────── */
.status-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-4);
    margin-top: var(--sp-3);
}
@media (min-width: 1100px) {
    .status-grid { grid-template-columns: repeat(2, 1fr); }
    .status-grid .status-card:first-child { grid-column: 1 / -1; }
}

.status-card {
    background: var(--surface);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    overflow: hidden;
}
.status-card-h {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4);
    background: var(--s2);
    border-bottom: 1px solid var(--b1);
    font-weight: 600;
    font-size: 13px;
    color: var(--t1);
}
.status-card-h i { width: 14px; height: 14px; flex-shrink: 0; }
.status-card-h > span:first-of-type { flex: 1; }
.status-card-body { padding: var(--sp-4); }

/* ss-pill — namespaced to avoid clobbering the header .status-pill */
.ss-pill {
    display: inline-block;
    padding: 3px var(--sp-3);
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}
.ss-pill-fresh, .ss-pill-alive, .ss-pill-clean {
    background: rgba(5, 150, 105, 0.12); color: var(--ok);
}
.ss-pill-aging, .ss-pill-stale, .ss-pill-normal {
    background: rgba(194, 113, 12, 0.12); color: var(--warn);
}
.ss-pill-dead, .ss-pill-missing, .ss-pill-busy {
    background: rgba(220, 38, 38, 0.10); color: var(--danger);
}
.ss-pill-ok {
    background: rgba(5, 150, 105, 0.12); color: var(--ok);
}
.ss-pill-amber, .ss-pill-warning {
    background: rgba(194, 113, 12, 0.12); color: var(--warn);
}

/* Webshare proxy form */
.status-card-desc { font-size: 12px; color: var(--t3); margin: 0 0 var(--sp-3); line-height: 1.5; }
.ss-form { display: flex; flex-direction: column; gap: var(--sp-3); }
.ss-field { display: flex; flex-direction: column; gap: var(--sp-1); }
.ss-field-label { font-size: 12px; font-weight: 600; color: var(--t2); }
.ss-field-hint { font-size: 11px; color: var(--t3); }
.ss-input {
    padding: 7px var(--sp-3);
    border: 1px solid var(--b1);
    border-radius: var(--r-s);
    font-size: 13px;
    background: var(--s1);
    color: var(--t1);
    outline: none;
    transition: border-color 0.15s;
}
.ss-input:focus { border-color: var(--pri); }
.ss-file-input { font-size: 12px; color: var(--t1); width: 100%; cursor: pointer; }
.ss-form-actions { display: flex; gap: var(--sp-2); margin-top: var(--sp-1); }
.ss-btn-save, .ss-btn-test { font-size: 12px; padding: 7px var(--sp-3); }
.ss-test-ok { margin-top: var(--sp-2); font-size: 12px; color: var(--ok); font-weight: 500; }
.ss-test-fail { margin-top: var(--sp-2); font-size: 12px; color: var(--danger); font-weight: 500; }
.ss-meta { margin-top: var(--sp-3); font-size: 11px; color: var(--t3); }

/* Info grid */
.status-info-grid { display: flex; flex-direction: column; gap: 0; margin-bottom: var(--sp-3); }
.status-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    font-size: 12px;
    border-bottom: 1px solid var(--b1);
}
.status-info-row:last-child { border-bottom: none; }
.status-info-lbl { color: var(--t3); font-weight: 500; }
.status-info-val {
    color: var(--t1);
    font-family: ui-monospace, monospace;
    font-size: 11px;
    max-width: 60%;
    text-align: right;
    word-break: break-all;
}

/* Warning blocks */
.status-warning {
    display: flex;
    gap: var(--sp-3);
    align-items: flex-start;
    padding: var(--sp-3) var(--sp-3);
    background: rgba(220, 38, 38, 0.07);
    border-left: 3px solid var(--danger);
    border-radius: var(--r-s);
    margin-bottom: var(--sp-3);
    font-size: 12px;
    color: var(--t1);
    line-height: 1.5;
}
.status-warning-stale, .status-warning-busy {
    background: rgba(194, 113, 12, 0.08);
    border-left-color: var(--warn);
}
.status-warning i { width: 16px; height: 16px; color: var(--danger); flex-shrink: 0; margin-top: 2px; }
.status-warning-stale i, .status-warning-busy i { color: var(--warn); }
.status-warning strong { font-weight: 600; }
.status-warning-meta { color: var(--t2); font-size: 11px; margin-top: 2px; }
.status-warning code {
    background: var(--s2);
    padding: 1px var(--sp-1);
    border-radius: 3px;
    font-size: 10px;
    font-family: ui-monospace, monospace;
}

/* Queue depth grid */
.queue-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-3);
    background: var(--s2);
    padding: var(--sp-3);
    border-radius: var(--r-m);
}
.queue-stat { text-align: center; }
.queue-stat-lbl {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--t3);
    font-weight: 600;
    margin-bottom: 6px;
}
.queue-stat-val {
    font-size: 24px;
    font-weight: 900;
    color: var(--t1);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
}
.queue-stat-val.qs-active { color: var(--pri); }
.queue-stat-val.qs-warn   { color: var(--warn); }

/* Runbook */
.status-runbook {
    margin-top: var(--sp-4);
    border-top: 1px solid var(--b1);
    padding-top: var(--sp-3);
}
.status-runbook summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    color: var(--pri);
    user-select: none;
    padding: var(--sp-1) 0;
    list-style: none;
}
.status-runbook summary::before { content: '▶  '; font-size: 9px; }
.status-runbook[open] summary::before { content: '▼  '; }
.status-runbook summary:hover { color: var(--pri-h); }
.runbook-steps {
    margin-top: var(--sp-3);
    padding-left: var(--sp-5);
    font-size: 12px;
    color: var(--t2);
    line-height: 1.7;
}
.runbook-steps li { margin-bottom: var(--sp-2); }
.runbook-steps code {
    background: var(--s2);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 11px;
    font-family: ui-monospace, monospace;
    color: var(--t1);
}
.runbook-cmd {
    display: inline-block;
    background: var(--s3, var(--s2)) !important;
    padding: var(--sp-1) var(--sp-2) !important;
    border-radius: var(--r-s);
    font-size: 11px;
    font-family: ui-monospace, monospace;
    color: var(--t1) !important;
    margin: 3px 0;
    user-select: all;
    cursor: text;
}
.runbook-note {
    margin-top: var(--sp-3);
    font-size: 11px;
    color: var(--t3);
    line-height: 1.6;
    padding: var(--sp-3) var(--sp-3);
    background: var(--s2);
    border-radius: var(--r-s);
}
.runbook-note strong { color: var(--t2); }

/* ── Cookies Upload UI (A3.9 expansion) ────────────────── */
.status-success {
    display: flex;
    gap: var(--sp-3);
    align-items: center;
    padding: var(--sp-3) var(--sp-3);
    background: rgba(5, 150, 105, 0.08);
    border-left: 3px solid var(--ok);
    border-radius: var(--r-s);
    font-size: 12px;
    color: var(--t1);
    line-height: 1.5;
}
.status-success i { width: 16px; height: 16px; color: var(--ok); flex-shrink: 0; }

.cookies-upload-section {
    margin-top: var(--sp-4);
    padding: var(--sp-3);
    background: var(--s2);
    border-radius: var(--r-m);
}
.cookies-upload-h {
    font-size: 12px;
    font-weight: 600;
    color: var(--t1);
    margin-bottom: var(--sp-3);
}
.cookies-upload-form {
    display: flex;
    gap: var(--sp-2);
    align-items: stretch;
    margin-bottom: var(--sp-2);
}
.cookies-file-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.cookies-file-label {
    flex: 1;
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    background: var(--surface);
    border: 1px dashed var(--b2);
    border-radius: var(--r-m);
    cursor: pointer;
    font-size: 12px;
    color: var(--t2);
    transition: border-color 0.15s, color 0.15s;
}
.cookies-file-label:hover { border-color: var(--pri); color: var(--t1); border-style: solid; }
.cookies-file-label i { width: 14px; height: 14px; flex-shrink: 0; }
.cookies-upload-btn { flex-shrink: 0; }
.cookies-upload-help {
    font-size: 11px;
    color: var(--t3);
    line-height: 1.5;
    margin: 0;
}

.cookies-versions-section {
    margin-top: var(--sp-4);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--b1);
}
.cookies-versions-h {
    font-size: 12px;
    font-weight: 600;
    color: var(--t1);
    margin-bottom: var(--sp-3);
}
.cookies-versions-list { display: flex; flex-direction: column; gap: 6px; }
.cookies-version-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sp-2) var(--sp-3);
    background: var(--s2);
    border-radius: var(--r-s);
    font-size: 11px;
    border-left: 2px solid transparent;
}
.cookies-version-active {
    background: rgba(5, 150, 105, 0.07);
    border-left-color: var(--ok);
}
.cookies-version-info { display: flex; gap: var(--sp-3); align-items: center; flex: 1; }
.cookies-version-ulid { font-family: ui-monospace, monospace; color: var(--t1); font-weight: 500; }
.cookies-version-time { color: var(--t2); }
.cookies-version-size { color: var(--t3); font-family: ui-monospace, monospace; }
.cookies-version-active-tag {
    background: rgba(5, 150, 105, 0.15);
    color: var(--ok);
    padding: 2px var(--sp-2);
    border-radius: var(--r-s);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ── Status filter pills (Build 2: active/archived) ────────────── */
.ss-status-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    padding: var(--sp-1) 0 2px;
}
.ss-status-pill {
    padding: var(--sp-1) var(--sp-3);
    background: transparent;
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
    font-size: 11px;
    font-weight: 600;
    color: var(--t2);
    cursor: pointer;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ss-status-pill:hover {
    border-color: var(--pri);
    color: var(--t1);
}
.ss-status-pill-active {
    background: var(--pri);
    border-color: var(--pri);
    color: white;
}
.ss-status-pill-active:hover {
    color: white;
}
.ss-status-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 var(--sp-1);
    margin-left: var(--sp-1);
    border-radius: 8px;
    background: rgba(0,0,0,.08);
    color: inherit;
    font-size: 10px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}
.ss-status-pill-active .ss-status-count {
    background: rgba(255,255,255,.25);
}

/* ── 3-column detail layout (Build 3) ──────────────────────────── */
.r-body-3col {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: var(--sp-4);
    align-items: start;
}
.r-center,
.r-right {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    min-width: 0;
}
.r-right {
    position: sticky;
    top: 0;
}
@media (max-width: 1100px) {
    .r-body-3col {
        grid-template-columns: 1fr;
    }
    .r-right {
        position: static;
    }
}

/* Cookies expiry banner (v0.15.0) */
.cookies-banner {
    margin: 0 0 var(--sp-3) 0;
    padding: var(--sp-3) var(--sp-3);
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: var(--r-l);
}
.cookies-banner-content {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    font-size: 13px;
    color: var(--t1);
}
.cookies-banner-icon {
    font-size: 16px;
    color: rgb(245, 158, 11);
}
.cookies-banner-text {
    flex: 1;
}
.cookies-banner-action {
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--r-s);
    background: rgb(245, 158, 11);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    font-size: 12px;
}
.cookies-banner-action:hover {
    background: rgb(217, 119, 6);
}

/* Risk Factor Analysis comments card (v0.15.0) */
.rfa-comments-card {
    margin-top: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: var(--s2);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
}
.rfa-comments-header {
    margin-bottom: var(--sp-3);
}
.rfa-comments-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--t3);
    text-transform: uppercase;
}
.rfa-comments-body {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}
.rfa-comments-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.rfa-comments-category {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--t2);
    letter-spacing: 0.04em;
}
.rfa-comments-text {
    font-size: 13px;
    color: var(--t2);
    line-height: 1.4;
}

/* Worker observability (v0.16.0) */
.workers-page {
    padding: var(--sp-5);
}
.workers-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-5);
}
.workers-refresh-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-3);
    font-size: 12px;
    color: var(--t2);
}
.workers-refresh-state {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: 10px;
    width: 28px;
    color: var(--t3);
}
.workers-section {
    margin-top: var(--sp-3);
    padding: var(--sp-4);
    background: var(--s2);
    border: 1px solid var(--b1);
    border-radius: var(--r-l);
}
.workers-section-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--t3);
    margin-bottom: var(--sp-3);
}
.workers-table {
    width: 100%;
    font-size: 13px;
    border-collapse: collapse;
}
.workers-table th {
    text-align: left;
    color: var(--t3);
    font-weight: 600;
    padding: 6px var(--sp-2);
    border-bottom: 1px solid var(--b1);
}
.workers-table td {
    padding: var(--sp-2);
    color: var(--t2);
    border-bottom: 1px solid var(--b1);
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.workers-table tr:last-child td {
    border-bottom: none;
}
.workers-empty {
    text-align: center;
    color: var(--t3);
    font-style: italic;
    padding: var(--sp-5);
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Trash actions (v0.17.0) */
.action-button {
    padding: 6px var(--sp-3);
    border-radius: var(--r-s);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
}
.action-trash {
    background: var(--s2);
    color: var(--t2);
    border: 1px solid var(--b1);
}
.action-trash:hover {
    background: rgba(245, 158, 11, 0.1);
    color: rgb(180, 100, 0);
    border-color: rgba(245, 158, 11, 0.4);
}
.action-restore {
    background: rgba(34, 197, 94, 0.1);
    color: rgb(22, 130, 60);
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.action-restore:hover {
    background: rgba(34, 197, 94, 0.18);
}
.action-force-delete {
    background: rgba(220, 38, 38, 0.08);
    color: rgb(180, 30, 30);
    border: 1px solid var(--badge-danger-border);
}
.action-force-delete:hover {
    background: rgba(220, 38, 38, 0.18);
}
.trash-toolbar {
    padding: var(--sp-2) var(--sp-3);
    margin-bottom: var(--sp-3);
    display: flex;
    justify-content: flex-end;
}
.empty-trash-button {
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--r-s);
    background: rgba(220,38,38,.12);
    color: var(--danger);
    font-weight: 700;
    font-size: 11px;
    border: 1px solid var(--badge-danger-border);
    cursor: pointer;
}
.empty-trash-button:hover {
    background: rgba(220,38,38,.2);
}

/* Library trashed filter (v0.17.0) */
.library-item-trashed {
    opacity: 0.6;
}
.library-trashed-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    background: rgba(220, 38, 38, 0.1);
    color: rgb(180, 30, 30);
    border-radius: var(--r-s);
    margin-left: var(--sp-2);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.library-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--t2);
    cursor: pointer;
}

/* RFA severity badges (v0.18.0) */
.rfa-item-header {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: 2px;
}
.risk-severity {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 1px 6px;
    border-radius: var(--r-s);
    text-transform: uppercase;
}
.risk-severity-low {
    background: var(--badge-neutral-bg);
    color: rgb(71, 85, 105);
}
.risk-severity-medium {
    background: var(--badge-warn-bg);
    color: rgb(180, 100, 0);
}
.risk-severity-high {
    background: rgba(220, 38, 38, 0.15);
    color: rgb(180, 30, 30);
}

/* Bulk trash button (v0.18.0) */
.bulk-btn-trash {
    background: var(--badge-warn-bg);
    color: rgb(180, 100, 0);
    border: 1px solid rgba(245, 158, 11, 0.4);
}
.bulk-btn-trash:hover {
    background: rgba(245, 158, 11, 0.25);
}

.bulk-btn-restore {
    background: rgba(34, 197, 94, 0.12);
    color: rgb(22, 130, 60);
    border: 1px solid rgba(34, 197, 94, 0.35);
}
.bulk-btn-restore:hover {
    background: rgba(34, 197, 94, 0.22);
}

.bulk-btn-hard-delete {
    background: rgba(220, 38, 38, 0.15);
    color: rgb(200, 30, 30);
    border: 1px solid rgba(220, 38, 38, 0.4);
}
.bulk-btn-hard-delete:hover {
    background: rgba(220, 38, 38, 0.25);
}

/* Queue depth bar cells */
.queue-depth-cell {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}
.queue-depth-value {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    min-width: 32px;
    text-align: right;
}
.queue-depth-bar-track {
    flex: 1;
    height: 6px;
    background: var(--b1);
    border-radius: 3px;
    overflow: hidden;
    max-width: 200px;
}
.queue-depth-bar {
    height: 100%;
    transition: width 0.3s ease;
}
.queue-depth-normal { color: var(--t1); }
.queue-depth-normal.queue-depth-bar { background: rgb(34, 197, 94); }
.queue-depth-warning { color: rgb(180, 100, 0); }
.queue-depth-warning.queue-depth-bar { background: rgb(245, 158, 11); }
.queue-depth-critical { color: rgb(180, 30, 30); }
.queue-depth-critical.queue-depth-bar { background: rgb(220, 38, 38); }

/* Worker health alert banners */
.workers-alert {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    margin-bottom: var(--sp-4);
    border-radius: var(--r-l);
    font-size: 13px;
}
.workers-alert-critical {
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid var(--badge-danger-border);
    color: rgb(120, 20, 20);
}
.workers-alert-warning {
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.3);
    color: rgb(140, 80, 0);
}
.workers-alert-icon {
    font-size: 18px;
    flex-shrink: 0;
}
.workers-alert-text {
    flex: 1;
}
.workers-alert-text strong {
    font-weight: 700;
}
.workers-alert-text code {
    font-family: var(--mono);
    font-size: 12px;
    background: rgba(0,0,0,0.06);
    padding: 1px var(--sp-1);
    border-radius: 3px;
}

/* Audit log bulk row detail (v0.19.2) */
.bulk-detail {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.bulk-summary {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    color: var(--t1);
    font-size: 13px;
    font-family: inherit;
}
.bulk-summary:hover { color: var(--pri); }
.bulk-chevron {
    display: inline-block;
    transition: transform 0.15s ease;
    color: var(--t3);
    font-size: 10px;
}
.bulk-chevron-open { transform: rotate(90deg); }
.bulk-count { font-weight: 600; }
.bulk-action-label {
    color: var(--t3);
    font-size: 12px;
    text-transform: lowercase;
}
.bulk-ulids {
    margin-top: var(--sp-1);
    padding-left: var(--sp-4);
}
.bulk-ulids-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1);
}
.bulk-ulid {
    display: inline-block;
    font-family: ui-monospace, monospace;
    font-size: 11px;
    padding: 2px 6px;
    background: rgba(99, 102, 241, 0.08);
    color: var(--t2);
    border-radius: var(--r-s);
}
.bulk-ulids-more {
    font-size: 11px;
    color: var(--t3);
    font-style: italic;
    align-self: center;
}
.bulk-ulids-empty {
    font-size: 12px;
    color: var(--t3);
    font-style: italic;
}
/* Column width overrides for v0.19.2 */
.log-table-wrap th.td-time,.log-table-wrap td.td-time { width: 160px; }
.log-table-wrap th.td-reason,.log-table-wrap td.td-reason { width: 80px; }

/* v0.19.3 — column gap fix */
/* Inner moderator cell layout — renamed from td-mod to break the class
   collision where <td class="td-mod"> inherited display:flex, shrinking
   content to min-width and leaving blank space before the ACTION column. */
.td-mod-inner { display: flex; align-items: center; gap: var(--sp-2); }

/* ── History page table ──────────────────────────────── */
.history-table-wrap{overflow-x:auto;border:1px solid var(--b1);border-radius:var(--r-m)}
.history-table{width:100%;border-collapse:collapse;font-size:13px}
.history-table th{padding:var(--sp-2) var(--sp-3);text-align:left;font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.4px;background:var(--s2);border-bottom:1px solid var(--b1)}
.history-table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--b1);color:var(--t2);vertical-align:top}
.history-table tbody tr:last-child td{border-bottom:none}
.history-table tbody tr:hover td{background:var(--s2)}
.history-table-time{white-space:nowrap;color:var(--t3);font-size:12px}
.history-table-ulid{font-family:monospace;font-size:11px;color:var(--t3);background:var(--s2);padding:2px 4px;border-radius:3px;word-break:break-all}
.history-table-reason{max-width:280px;color:var(--t3);font-size:12px}
.history-action-approved{background:var(--badge-success-bg);color:var(--badge-success-fg)}
.history-action-rejected{background:var(--badge-danger-bg);color:var(--badge-danger-fg)}
.history-action-flagged{background:var(--badge-warn-bg);color:var(--badge-warn-fg)}
.history-action-hidden{background:var(--badge-neutral-bg);color:var(--badge-neutral-fg)}
.history-action-appeal_approved{background:var(--badge-success-bg);color:var(--badge-success-fg)}
.history-action-appeal_rejected{background:var(--badge-danger-bg);color:var(--badge-danger-fg)}
.history-pagination{margin-top:var(--sp-4)}


/* ── <x-pill> component ── */
.pill{display:inline-flex;align-items:center;gap:4px;font-weight:700;border-radius:999px;white-space:nowrap;line-height:1}
.pill--md{font-size:10.5px;padding:3px 9px}
.pill--sm{font-size:9.5px;padding:2px 7px}
.pill i{width:10px;height:10px}
.pill--success{background:var(--badge-success-bg);color:var(--badge-success-fg)}
.pill--warning{background:var(--badge-warn-bg);color:var(--badge-warn-fg)}
.pill--danger{background:var(--badge-danger-bg);color:var(--badge-danger-fg)}
.pill--info{background:var(--badge-info-bg);color:var(--badge-info-fg)}
.pill--neutral{background:var(--badge-neutral-bg);color:var(--badge-neutral-fg)}

/* ── <x-live-region> component ── */
.live-region { display: contents; }

/* ── <x-card> component (.sb-card — avoids collision with existing .card family) ── */
.sb-card{background:var(--surface);border:1px solid var(--b1);border-radius:var(--r-l);box-shadow:var(--sh-sm);overflow:hidden}
.sb-card__header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);justify-content:space-between}
.sb-card__icon{width:15px;height:15px;color:var(--pri);flex-shrink:0}
.sb-card__title{font-size:13px;font-weight:800;color:var(--t1);margin:0}
.sb-card__header-actions{display:flex;gap:var(--sp-2);align-items:center}
.sb-card__body{padding:var(--sp-4) var(--sp-5)}
.sb-card__empty{color:var(--t3);font-size:13px;font-style:italic;margin:0}
.sb-card--accent-primary{border-left:3px solid var(--pri)}
.sb-card--accent-success{border-left:3px solid var(--ok)}
.sb-card--accent-danger{border-left:3px solid var(--danger)}
.sb-card--accent-warning{border-left:3px solid var(--warn)}

/* ── <x-list-row> component ── */
.list-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--b1);transition:background 0.12s;background:var(--surface);color:var(--t1);text-decoration:none;width:100%;text-align:left;border-top:none;border-left:none;border-right:none;cursor:pointer;font:inherit}
.list-row:last-child{border-bottom:none}
.list-row:hover{background:var(--s2)}
.list-row:focus-visible{outline:2px solid var(--pri);outline-offset:-2px}
.list-row__avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--s3);display:flex;align-items:center;justify-content:center}
.list-row__avatar img{width:100%;height:100%;object-fit:cover}
.list-row__avatar-initials{font-size:12px;font-weight:700;color:var(--t2)}
.list-row__main{flex:1;min-width:0}
.list-row__title{font-size:13px;font-weight:600;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list-row__meta{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:2px}
.list-row__meta-item{font-size:11px;color:var(--t3)}
.list-row__badges{display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-top:4px}
.list-row__actions{display:flex;gap:var(--sp-1);align-items:center;flex-shrink:0}

/* ── <x-toggle-switch> component (.sb-toggle-switch — avoids collision with legacy .toggle-switch) ── */
.sb-toggle-switch-wrap{display:flex;align-items:center}
.sb-toggle-switch{display:flex;align-items:center;gap:var(--sp-3);cursor:pointer;user-select:none}
.sb-toggle-switch__input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.sb-toggle-switch__track{position:relative;display:block;width:36px;height:20px;background:var(--b2);border-radius:10px;transition:background 0.2s;flex-shrink:0}
.sb-toggle-switch__thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform 0.2s;pointer-events:none}
.sb-toggle-switch__input:checked ~ .sb-toggle-switch__track{background:var(--ok)}
.sb-toggle-switch__input:checked ~ .sb-toggle-switch__track .sb-toggle-switch__thumb{transform:translateX(16px)}
.sb-toggle-switch__input:focus-visible ~ .sb-toggle-switch__track{outline:2px solid var(--pri);outline-offset:2px}
.sb-toggle-switch__label{font-size:13px;font-weight:500;color:var(--t2)}

/* Accessibility utility — hides visually, keeps in SR tree */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
