:root { --bg:#f6f5f2; --card:#fff; --ink:#1d1d1b; --muted:#6b6b66; --line:#dddbd4; --accent:#2f5d50; --warn:#b4540b; --warnbg:#fff4e8; --bad:#a3261d; --okbg:#e8f3ee; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--ink); }
header { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; justify-content:space-between; padding:12px 16px; background:var(--card); border-bottom:1px solid var(--line); }
.brand { font-weight:700; color:var(--accent); text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:4px 14px; align-items:center; }
nav a, button.link { color:var(--ink); text-decoration:none; background:none; border:0; padding:0; font:inherit; cursor:pointer; }
main { padding:16px; max-width:1200px; margin:0 auto; }
h1 { font-size:1.4rem; margin:0 0 12px; } h2 { font-size:1.1rem; margin:0 0 8px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:16px; }
.narrow { max-width:480px; margin-left:auto; margin-right:auto; }
label { display:block; margin:0 0 12px; font-weight:600; font-size:.92rem; }
input, select { display:block; width:100%; margin-top:4px; padding:10px; font:inherit; font-weight:400; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); }
input[type=radio] { display:inline; width:auto; margin:0 8px 0 0; }
fieldset { border:1px solid var(--line); border-radius:8px; margin:0 0 12px; padding:8px 12px; } legend { font-weight:600; font-size:.92rem; }
.choice { font-weight:400; display:flex; align-items:center; margin:8px 0; }
.photo { border:2px dashed var(--accent); border-radius:10px; padding:28px 12px; text-align:center; color:var(--accent); cursor:pointer; }
.photo input { position:absolute; opacity:0; width:1px; height:1px; }
button { font:inherit; padding:10px 14px; border-radius:8px; border:1px solid var(--line); background:#fff; cursor:pointer; }
button.primary { background:var(--accent); color:#fff; border-color:var(--accent); width:100%; font-weight:600; }
button.danger { color:var(--bad); }
.flash { padding:10px 12px; border-radius:8px; margin-bottom:12px; } .flash.ok { background:var(--okbg); } .flash.error { background:#fdecea; color:var(--bad); }
.hint, small { color:var(--muted); font-weight:400; }
.badge { background:var(--warn); color:#fff; border-radius:10px; padding:0 7px; font-size:.8rem; }
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px; }
.item { display:block; color:inherit; text-decoration:none; } .item span { float:right; }
.warn { color:var(--warn); margin-top:6px; font-size:.9rem; } .okline { color:var(--accent); margin-top:6px; font-size:.9rem; }
.review { display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:900px) { .review { grid-template-columns:1.1fr 1fr; align-items:start; } .doc { position:sticky; top:12px; } }
.doc img { width:100%; border-radius:8px; border:1px solid var(--line); background:#fff; }
.doc iframe { width:100%; height:75vh; border:1px solid var(--line); border-radius:8px; background:#fff; }
.doc pre { white-space:pre-wrap; font-size:.8rem; background:#fff; padding:8px; border-radius:6px; max-height:300px; overflow:auto; }
.flagged input, .flagged select { border-color:var(--warn); background:var(--warnbg); }
.why { display:block; color:var(--warn); font-weight:400; font-size:.85rem; margin-top:3px; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.actions { display:grid; gap:8px; margin-top:8px; }
.inline { display:inline-flex; gap:6px; align-items:center; } .inline input { width:150px; margin:0; padding:6px; }
table.list { width:100%; border-collapse:collapse; background:var(--card); font-size:.92rem; display:block; overflow-x:auto; }
table.list th, table.list td { padding:8px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
.status { font-size:.8rem; padding:1px 8px; border-radius:10px; background:var(--line); }
.status.approved { background:var(--okbg); color:var(--accent); } .status.needs_review { background:var(--warnbg); color:var(--warn); }
ul.plain { list-style:none; padding:0; margin:0; } ul.plain li { padding:6px 0; border-bottom:1px solid var(--line); }
