:root { --ink:#1d2433; --muted:#667085; --line:#d9dde5; --bg:#f6f7f9; --card:#fff; --accent:#1f4e79; --bad:#b42318; --warn:#b54708; --ok:#067647; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.45 -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; color:var(--ink); background:var(--bg); }
a { color:var(--accent); }
header.top { display:flex; align-items:center; gap:24px; padding:10px 24px; background:#13243a; color:#fff; flex-wrap:wrap; }
header.top a { color:#dbe6f3; text-decoration:none; margin-right:16px; }
header.top .brand { font-weight:700; color:#fff; }
header.top nav { flex:1; }
header.top .muted { color:#9fb2c8; }
main { max-width:1180px; margin:0 auto; padding:20px 24px 80px; }
h1 { font-size:24px; margin:8px 0; } h3 { margin:6px 0; font-size:16px; }
.muted { color:var(--muted); } .small { font-size:13px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:16px; margin:14px 0; }
.card.narrow { max-width:420px; margin:60px auto; }
.card.warn { border-color:var(--warn); }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.between { justify-content:space-between; }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.stack { display:flex; flex-direction:column; gap:12px; }
.cols { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
label { display:flex; flex-direction:column; gap:4px; font-weight:600; font-size:13px; }
label.check { flex-direction:row; align-items:center; font-weight:400; }
input, select, textarea { font:inherit; padding:7px 9px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); width:100%; }
input[type=file], input[type=checkbox] { width:auto; }
textarea { font-family: "Times New Roman", Georgia, serif; font-size:15px; resize:vertical; }
input.num { width:80px; display:inline-block; font-weight:700; }
button, .button { font:inherit; padding:7px 14px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); cursor:pointer; text-decoration:none; display:inline-block; }
button.primary, .button.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
button:disabled { opacity:.5; cursor:not-allowed; }
button.link { border:0; background:none; color:var(--accent); padding:0; }
header.top button.link { color:#dbe6f3; }
.danger { color:var(--bad) !important; }
button.approve.on { background:var(--ok); border-color:var(--ok); color:#fff; }
form.inline { display:inline; }
.notice { padding:10px 14px; border-radius:6px; background:#eef4fb; border:1px solid #c7d9ee; margin:10px 0; }
.notice.error { background:#fef3f2; border-color:#fecdca; color:var(--bad); }
table.grid { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); }
table.grid th, table.grid td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
tr.inactive td { color:var(--muted); text-decoration:line-through; }
.badge { font-size:12px; padding:2px 8px; border-radius:10px; background:#eef0f3; color:var(--muted); }
.badge.drafted { background:#eef4fb; color:var(--accent); }
.badge.reviewed { background:#ecfdf3; color:var(--ok); }
.badge.drafting { background:#fffaeb; color:var(--warn); }
.badge.error { background:#fef3f2; color:var(--bad); }
.flags { list-style:none; padding:0; margin:8px 0; }
.flag { font-size:13px; padding:4px 8px; border-left:3px solid var(--warn); background:#fffaeb; margin:3px 0; }
.flag.bad { border-color:var(--bad); background:#fef3f2; color:var(--bad); }
.chips { display:flex; flex-direction:column; gap:4px; margin:8px 0; }
.chip { font-size:13px; background:#f2f4f7; border-radius:6px; padding:4px 8px; }
.sources ul { margin:6px 0; padding-left:18px; font-size:13px; color:var(--muted); }
.sources li.used { color:var(--ink); }
.redraft input { flex:1; min-width:240px; }
.req { border-left:4px solid var(--line); }
.req[data-status=reviewed] { border-left-color:var(--ok); }
.req[data-status=drafted] { border-left-color:var(--accent); }
.req[data-status=error] { border-left-color:var(--bad); }
.pre { white-space:pre-wrap; }
details > summary { cursor:pointer; font-weight:600; }
.danger-zone { margin-top:30px; text-align:right; }
code { background:#f2f4f7; padding:1px 4px; border-radius:4px; font-size:12px; }
h2 { font-size:18px; margin:6px 0; }
.subcard { border:1px dashed var(--line); border-radius:6px; padding:10px 12px; margin:10px 0; }
.tablewrap { overflow-x:auto; margin:10px 0; }
.sources li.danger { color:var(--bad); }
.tabs { display:flex; gap:6px; flex-wrap:wrap; margin:10px 0; }
.tabs a { padding:5px 12px; border:1px solid var(--line); border-radius:16px; background:#fff; text-decoration:none; color:var(--ink); font-size:13px; }
.tabs a.on { background:var(--accent); color:#fff; border-color:var(--accent); }
.badge.ct { background:#f4ebff; color:#5925dc; }
form.retag select { width:auto; font-size:13px; padding:3px 6px; }
.card.master { border-left:4px solid var(--accent); }
.notice-warn { border-left:4px solid #f5c400; background:#fffbe6; }
.modal { position:fixed; inset:0; background:rgba(16,24,40,.45); display:flex; align-items:center; justify-content:center; z-index:50; padding:16px; }
.modal-box { max-width:520px; width:100%; }
.brand-title { font-weight:700; color:var(--accent); letter-spacing:.02em; margin:0 0 4px; }
.qr { display:flex; justify-content:center; margin:8px 0; }
.qr svg { width:220px; height:220px; }
.steps { padding-left:20px; margin:6px 0; }
.codes { display:grid; grid-template-columns:repeat(2, 1fr); gap:8px; margin:12px 0; }
.codes code { font-size:15px; padding:6px; text-align:center; }
.timeline { display:flex; flex-direction:column; gap:6px; margin:10px 0; }
.tl-row { display:grid; grid-template-columns:200px 200px 1fr auto; gap:8px; align-items:start; padding:6px 0; border-bottom:1px solid var(--line); }
.tl-row.inactive textarea, .tl-row.inactive input { color:var(--muted); text-decoration:line-through; }
.tl-desc { font-family:inherit; font-size:14px; }
.tl-actions { display:flex; gap:8px; align-items:center; }
.tl-src { grid-column:1 / -1; }
.doc-preview { font-family:"Times New Roman", Georgia, serif; background:#fff; border:1px solid var(--line); padding:16px 24px; max-height:600px; overflow-y:auto; }
.doc-preview p { margin:0 0 8px; white-space:pre-wrap; }
@media (max-width:720px) { .tl-row { grid-template-columns:1fr; } }
