:root{--ink:#1a2226;--muted:#68757a;--line:#dfe5e3;--bg:#f4f5f3;--card:#fff;--dark:#123f3b;--acc:#0e6b5e;--warn:#9a6e1a;--warnbg:#fff3d4;--ok:#1f7a52;--okbg:#def1e5;--sub:#3b5b95;--subbg:#e2eafc;--miss:#8a3b2e;--missbg:#fbe3dd}
*{box-sizing:border-box}body{margin:0;font:14px/1.5 -apple-system,"Segoe UI",Roboto,Inter,sans-serif;color:var(--ink);background:var(--bg)}
h2{font-size:20px;margin:0 0 6px}h3{font-size:13px;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px;color:#3c4a4e}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}.small{font-size:12px}.muted{color:var(--muted);margin-top:0}
.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;background:var(--dark);color:#fff;padding:12px 20px}
.brand strong{font-size:16px}.brand span{display:block;font-size:12px;color:#b9cfca}
.rolebox{display:flex;align-items:center;gap:12px;font-size:12px}.rolebox select{padding:6px 8px;border-radius:6px;border:1px solid #2a5a54}.authnote{color:#9fc0b9;max-width:320px}
.statsbar{display:flex;gap:10px;padding:10px 20px;background:#fff;border-bottom:1px solid var(--line);font-size:12px;flex-wrap:wrap}
.stat{border:1px solid var(--line);border-radius:6px;padding:6px 12px;background:#fbfcfb}.stat b{font-size:15px;margin-right:6px}
.layout{display:block;min-height:calc(100vh - 110px)}
.sidenav{border-bottom:1px solid var(--line);background:#fff;padding:6px 20px;display:flex;align-items:center;gap:3px;overflow-x:auto}
.sidenav button{flex:0 0 auto;width:auto;border:0;background:none;text-align:left;padding:5px 10px;border-radius:5px;font-size:12px;line-height:1.4;white-space:nowrap;cursor:pointer;color:#3d4b4f}
.sidenav button.active{background:#e5f0ec;font-weight:700;color:var(--dark)}
.sidenav b{background:var(--warnbg);color:var(--warn);border-radius:10px;padding:1px 7px;font-size:11px}
main{padding:20px 22px;max-width:1200px;margin:0 auto}
.toolbar{display:flex;gap:8px;margin-bottom:10px}.spacer{flex:1}
input,select,textarea{font:13px inherit;color:var(--ink);border:1px solid #cfd8d5;border-radius:6px;padding:8px 9px;background:#fff;width:100%}
textarea{resize:vertical}label{display:block;font-size:12px;font-weight:600;margin:10px 0 0}
.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;font-size:13px}
.tbl th,.tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{background:#eef2f0;font-size:11px;text-transform:uppercase;letter-spacing:.4px}
.tbl tr:hover td{background:#f7faf8}
.pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;background:#eee;text-transform:capitalize}
.pill.validated{background:var(--okbg);color:var(--ok)}.pill.submitted{background:var(--subbg);color:var(--sub)}
.pill.draft{background:var(--warnbg);color:var(--warn)}.pill.missing{background:var(--missbg);color:var(--miss)}
.btn{border:1px solid #cfd8d5;background:#fff;border-radius:6px;padding:8px 12px;font-size:12px;cursor:pointer}
.btn.primary{background:var(--dark);border-color:var(--dark);color:#fff}
.btn.accent{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.ghost{background:transparent}
.btn:disabled{opacity:.5;cursor:default}
.editor{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.editor-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:6px}
.editor-grid{display:grid;grid-template-columns:1fr 280px;gap:20px}
.frow3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.grade-row{display:grid;grid-template-columns:1fr 95px 35px;gap:8px;align-items:end;margin-bottom:8px}.section-row{border:1px solid var(--line);border-radius:7px;background:#fbfcfb;padding:12px;margin:12px 0}.section-row label{margin-top:6px}.section-row .sec-remove{margin-top:8px}.error{color:#a33a2a}.good{color:#23704e}.help{font-size:12px;border:1px solid #b7c9c4;color:#14574b;background:#edf5f2;border-radius:50%;width:20px;height:20px;cursor:help}
.rule-confirm{display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:13px;border:1px solid #c4d6cb;border-radius:6px;background:#f2f8f3;font-size:12px;line-height:1.5}.rule-confirm input{width:auto;flex:0 0 auto;margin:2px 0 0}.actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.hint{font-size:12px;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:12px}
.card p,.card li{font-size:13px}.card pre{background:#0f1f1d;color:#d7e8e3;font-size:11px;padding:10px;border-radius:6px;overflow:auto}
.card code{background:#eef2f0;padding:1px 5px;border-radius:4px}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.summary{background:#f7faf8;border:1px solid var(--line);border-radius:6px;padding:10px;font-size:13px;margin:10px 0;white-space:pre-line}
.crit{display:flex;gap:8px;align-items:start;font-size:13px;padding:6px 0;border-bottom:1px solid var(--line)}
#opsLog{white-space:pre-line;background:#0f1f1d;color:#cfe3dd;padding:10px;border-radius:6px;min-height:60px}input[readonly]{background:#f1f3f1;color:#63706d}
.toast{position:fixed;right:18px;bottom:18px;background:#10201e;color:#fff;padding:11px 16px;border-radius:8px;font-size:13px;opacity:0;transition:.25s;max-width:420px}
.toast.show{opacity:1}
.modal{position:fixed;inset:0;background:#0008;display:grid;place-items:center}.modal[hidden],[hidden]{display:none!important}
.loginwrap{display:grid;place-items:center;padding:60px 16px}
.logincard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:26px;width:min(380px,92vw)}
.logincard h2{margin-bottom:2px}
.userbadge{font-size:12px;color:#dcebe7;background:#ffffff22;border:1px solid #ffffff44;padding:5px 10px;border-radius:12px}
.btn.light{color:#fff;border-color:#ffffff55}
.modal-box{background:#fff;border-radius:10px;padding:16px;width:min(760px,92vw);max-height:84vh;overflow:auto}
.modal-box pre{background:#0f1f1d;color:#d7e8e3;font-size:11px;padding:12px;border-radius:6px;overflow:auto;max-height:56vh}
@media(max-width:900px){.editor-grid,.twocol,.steps{grid-template-columns:1fr}.frow3{grid-template-columns:1fr}.rolebox{display:none}}
