.moderation-body { background:#eef0eb; min-height:100vh; }
.mod-sidebar { position:fixed; inset:0 auto 0 0; width:240px; background:var(--ink); color:white; padding:28px 20px; display:flex; flex-direction:column; z-index:20; }
.mod-sidebar .brand { padding:0 10px; }.mod-sidebar .brand strong { color:white; }.mod-sidebar .brand-mark i { background:#64b9c2; }
.workspace-label { margin:38px 10px 10px; color:#789696; font-size:9px; letter-spacing:1.5px; text-transform:uppercase; font-weight:850; }
.mod-sidebar nav { display:grid; gap:5px; }.mod-sidebar nav a { min-height:43px; display:flex; align-items:center; gap:11px; padding:0 12px; border-radius:8px; color:#b6cbca; font-size:12px; font-weight:700; }.mod-sidebar nav a span { width:18px; font-size:16px; }.mod-sidebar nav a b { margin-left:auto; font-size:9px; background:rgba(255,255,255,.12); min-width:22px; height:22px; display:grid; place-items:center; border-radius:99px; }.mod-sidebar nav a b.alert { background:var(--coral); color:white; }.mod-sidebar nav a:hover,.mod-sidebar nav a.active { background:#1d4a4c; color:white; }
.sidebar-bottom { margin-top:auto; }.sidebar-bottom > a { display:block; color:#8fb0ae; padding:12px; font-size:10px; border-bottom:1px solid rgba(255,255,255,.1); margin-bottom:14px; }.mod-user { display:grid; grid-template-columns:36px 1fr 24px; align-items:center; gap:9px; }.mod-user > span { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:var(--blue-2); font-size:10px; font-weight:850; }.mod-user strong,.mod-user small { display:block; }.mod-user strong { font-size:11px; }.mod-user small { color:#789696; font-size:8px; }.mod-user button { border:0; background:transparent; color:#789696; }
.mod-main { margin-left:240px; min-width:0; }.mod-header { min-height:100px; background:var(--white); border-bottom:1px solid var(--border); padding:22px 38px; display:flex; justify-content:space-between; align-items:center; }.mod-header p { margin:0; color:var(--muted); font-size:9px; }.mod-header h1 { margin:2px 0 0; font:700 27px Georgia,serif; }.mod-header-actions { display:flex; gap:10px; }.mod-header-actions label { width:310px; height:40px; display:flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:8px; padding:0 11px; }.mod-header-actions input { border:0; outline:0; background:transparent; width:100%; font-size:10px; }.notification { width:40px; height:40px; border:1px solid var(--border); border-radius:8px; background:transparent; position:relative; }.notification b { position:absolute; width:6px; height:6px; background:var(--coral); border-radius:50%; right:8px; top:7px; }
.overview,.queue { padding:32px 38px 0; }.overview-heading,.queue-top { display:flex; justify-content:space-between; align-items:flex-end; }.overview-heading h2,.queue-top h2 { margin:0; font:700 26px Georgia,serif; }.overview-heading select,.queue-actions select { height:36px; border:1px solid var(--border); border-radius:7px; background:var(--white); padding:0 12px; font-size:9px; }.mod-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:20px; }.mod-stats article { min-height:104px; background:var(--white); border:1px solid var(--border); border-radius:11px; padding:18px; display:grid; grid-template-columns:38px 1fr; gap:10px; align-items:center; }.stat-icon { width:35px; height:35px; display:grid; place-items:center; border-radius:8px; }.stat-icon.coral { background:#fce4dc;color:var(--coral); }.stat-icon.yellow { background:#fff0ca;color:#9a6a10; }.stat-icon.blue { background:#deedef;color:var(--blue); }.stat-icon.green { background:#ddede5;color:var(--green); }.mod-stats strong,.mod-stats small { display:block; }.mod-stats strong { font:700 25px Georgia,serif; }.mod-stats small { color:var(--muted); font-size:9px; }.mod-stats em { grid-column:1/-1; font-style:normal; font-size:8px; color:var(--green); }.mod-stats em.negative { color:var(--coral); }
.queue { padding-bottom:45px; }.queue-top { margin-top:8px; }.queue-top p { margin:3px 0 0; color:var(--muted); font-size:9px; }.queue-actions { display:flex; gap:8px; }.filter-button { border:1px solid var(--border); border-radius:7px; background:var(--white); padding:0 12px; font-size:9px; }.filter-button b { background:var(--blue); color:white; border-radius:99px; padding:2px 5px; margin-left:4px; }.filter-pills { display:flex; gap:6px; margin:18px 0 12px; }.filter-pills button { border:1px solid var(--border); border-radius:99px; background:var(--white); padding:7px 11px; font-size:9px; }.filter-pills button.active { background:var(--ink); color:white; }.filter-pills span { opacity:.65; margin-left:4px; }
.queue-layout { display:grid; grid-template-columns:minmax(420px,1fr) minmax(360px,.85fr); background:var(--white); border:1px solid var(--border); border-radius:12px; overflow:hidden; min-height:640px; }.queue-list { border-right:1px solid var(--border); }.queue-item { display:grid; grid-template-columns:4px 1fr; width:100%; border:0; border-bottom:1px solid var(--border); background:var(--white); text-align:left; padding:0; cursor:pointer; }.queue-item:hover,.queue-item.active { background:#f4f7f3; }.queue-item.active { box-shadow:inset 3px 0 var(--blue); }.priority { width:4px; height:100%; }.priority.high { background:var(--coral); }.priority.medium { background:var(--yellow); }.priority.low { background:#b8c2bf; }.queue-item-main { padding:17px 20px; }.queue-item-main > div { display:flex; align-items:center; justify-content:space-between; }.type-badge { border-radius:99px; padding:4px 7px; text-transform:uppercase; letter-spacing:.5px; font-size:7px; }.type-badge.problem { background:#fce2da; color:#ad3e28; }.type-badge.idea { background:#dcecef; color:var(--blue); }.queue-item-main small { color:var(--muted); font-size:8px; }.queue-item h3 { font:700 15px/1.2 Georgia,serif; margin:10px 0 4px; }.queue-item p { color:var(--muted); font-size:9px; margin:0; }.queue-item footer { display:flex; justify-content:space-between; margin-top:12px; font-size:8px; color:var(--muted); }.queue-item footer strong { color:var(--blue); }
.case-detail { padding:25px; }.case-head { display:flex; justify-content:space-between; align-items:center; }.case-head > div { display:flex; align-items:center; gap:9px; }.case-head small { color:var(--muted); }.case-head button { border:0; background:transparent; font-size:20px; color:var(--muted); }.case-detail > h2 { font:700 22px/1.15 Georgia,serif; margin:17px 0 8px; }.case-description { color:var(--muted); font-size:10px; }.case-photo { height:150px; margin:16px 0; border-radius:9px; position:relative; overflow:hidden; background:linear-gradient(#aacbd0 0 45%,#788c75 46% 56%,#6e7070 57%); }.case-photo > span { position:absolute; opacity:0; }.case-photo::before { content:""; position:absolute; inset:auto -10% 10px; height:38%; background:repeating-linear-gradient(90deg,transparent 0 28px,#e7e5d4 29px 51px,transparent 52px 79px); transform:perspective(150px) rotateX(35deg); }.crosswalk { position:absolute; left:8%; bottom:30%; width:18%; height:65%; background:linear-gradient(90deg,#485250 0 12%,#e7e5d4 13% 25%,#485250 26% 38%,#e7e5d4 39% 51%,#485250 52% 64%,#e7e5d4 65% 77%,#485250 78%); transform:perspective(100px) rotateX(15deg) skewX(-8deg); opacity:.8; }.case-photo button { position:absolute; right:10px; bottom:10px; border:0; background:rgba(16,44,46,.85); color:white; border-radius:5px; padding:6px 9px; font-size:8px; }.case-facts { display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; margin:15px 0; }.case-facts div { border-bottom:1px solid var(--border); padding-bottom:7px; }.case-facts dt { color:var(--muted); font-size:7px; text-transform:uppercase; letter-spacing:.8px; }.case-facts dd { margin:2px 0 0; font-size:9px; font-weight:750; }.duplicate-warning { display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:9px; padding:11px; border:1px solid #edd288; background:#fff7dc; border-radius:7px; }.duplicate-warning > span { color:#9a6a10; font-size:19px; }.duplicate-warning strong { font-size:9px; }.duplicate-warning p { margin:1px 0 0; color:#826f47; font-size:7px; }.duplicate-warning button { border:0; background:transparent; color:#8a600d; text-decoration:underline; font-size:8px; font-weight:800; }.assignment { display:block; margin-top:11px; }.assignment > span,.moderation-note > span { display:block; font-size:8px; font-weight:800; margin-bottom:4px; }.assignment select,.moderation-note textarea { width:100%; border:1px solid var(--border); border-radius:7px; background:white; padding:8px 10px; font-size:9px; }.moderation-note { margin-top:11px; }.case-actions { display:flex; gap:8px; margin-top:15px; }.case-actions button { min-height:39px; border-radius:7px; padding:0 14px; font-size:9px; font-weight:800; }.reject-button { background:white; border:1px solid var(--border); }.approve-button { margin-left:auto; color:white; background:var(--blue); border:0; }.approve-button span { margin-left:15px; }
.duplicate-dialog { width:min(720px,calc(100% - 24px)); border:0; border-radius:18px; padding:0; box-shadow:var(--shadow); }.duplicate-dialog::backdrop { background:rgba(5,25,27,.76); }.duplicate-dialog form { padding:28px; }.duplicate-dialog h2 { margin:0; font:700 30px Georgia,serif; }.comparison { display:grid; grid-template-columns:1fr 40px 1fr; align-items:center; gap:10px; margin:25px 0; }.comparison article { border:1px solid var(--border); border-radius:10px; padding:18px; min-height:125px; }.comparison article small { color:var(--blue); font-size:8px; font-weight:850; }.comparison article h3 { font:700 17px Georgia,serif; }.comparison article p { color:var(--muted); font-size:8px; }.comparison > span { width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#fff0ca; color:#94640a; font-size:8px; }.dialog-guidance { padding:12px; background:var(--paper); color:var(--muted); font-size:9px; border-radius:7px; }
@media(max-width:1000px){.mod-sidebar{width:190px}.mod-main{margin-left:190px}.mod-stats{grid-template-columns:1fr 1fr}.queue-layout{grid-template-columns:1fr}.queue-list{border-right:0}.case-detail{border-top:1px solid var(--border)}.mod-header-actions label{width:220px}}
@media(max-width:700px){.mod-sidebar{position:static;width:100%;height:auto}.mod-sidebar nav{grid-template-columns:1fr 1fr}.sidebar-bottom{display:none}.workspace-label{margin-top:25px}.mod-main{margin-left:0}.mod-header,.overview-heading,.queue-top{align-items:flex-start;flex-direction:column;gap:14px}.mod-header-actions,.mod-header-actions label{width:100%}.overview,.queue{padding-left:16px;padding-right:16px}.mod-stats{grid-template-columns:1fr 1fr}.queue-layout{grid-template-columns:1fr}.filter-pills{overflow:auto}.comparison{grid-template-columns:1fr}.comparison>span{margin:auto}.duplicate-dialog form{padding:20px}}

.public-response-editor { margin-top:13px; padding:13px; border:1px solid #f0d4bb; border-radius:10px; background:#fff8ef; }
.public-response-editor > div:first-child { display:flex; justify-content:space-between; gap:10px; margin-bottom:8px; }
.public-response-editor span { display:block; font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.7px; color:#8d4f22; }
.public-response-editor small { color:#a9815c; font-size:7px; text-align:right; }
.public-response-editor textarea,.public-response-editor input { width:100%; border:1px solid #e6c3a3; border-radius:7px; background:white; padding:8px 10px; font-size:9px; outline:none; }
.public-response-editor label { display:block; margin-top:9px; }
.response-guidelines { margin-top:10px; padding:10px; border-radius:8px; background:#fffdf8; border:1px dashed #e4c5a8; }
.response-guidelines strong { display:block; font-size:8px; color:var(--ink); }
.response-guidelines ul { margin:7px 0 0; padding-left:16px; color:#76583d; font-size:8px; line-height:1.55; }
.case-actions { flex-wrap:wrap; }