html,body{margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
img{max-width:100%}
[hidden]{display:none!important}
/* Layout: proof-sheet desk. Sticky top bar, page rail left, each section a sheet of numbered lines with a review strip under every line. */
:root{
  --espresso:#4E3B32; --terracotta:#A26C52; --cream:#F3EFE4; --paper:#FBF9F3; --stone:#C0B49C; --peach:#CE917A;
  --bg:var(--cream); --sheet:var(--paper); --ink:var(--espresso); --ink-2:#6E5D53; --ink-3:#8C7D72;
  --line:#DDD4C2; --line-2:#E9E2D4; --accent:var(--terracotta); --accent-ink:#FFFFFF; --accent-soft:#F1E3DA;
  --ok:#3E7A4F; --ok-soft:#E1EEE3; --warn:#A2621A; --warn-soft:#F6E7CF; --bad:#A83C32; --bad-soft:#F5DEDA;
  --final:#2F5E73; --final-soft:#DDEAF0; --shadow:0 1px 0 rgba(78,59,50,.06),0 6px 18px -12px rgba(78,59,50,.35);
  --display:"Unbounded","Arial Black",system-ui,sans-serif; --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --r:10px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;
  --bg:#1F1915; --sheet:#2A221D; --ink:#F1EADF; --ink-2:#CBBFB2; --ink-3:#A39587; --line:#43382F; --line-2:#372E27;
  --accent:#D39A7E; --accent-ink:#1F1915; --accent-soft:#3D2E26;
  --ok:#7FC293; --ok-soft:#233328; --warn:#E3AE68; --warn-soft:#3A2E1E; --bad:#EC8E83; --bad-soft:#3E2422;
  --final:#8FC3DA; --final-soft:#1F3039; --shadow:0 1px 0 rgba(0,0,0,.3),0 8px 22px -14px rgba(0,0,0,.7);
}}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#1F1915; --sheet:#2A221D; --ink:#F1EADF; --ink-2:#CBBFB2; --ink-3:#A39587; --line:#43382F; --line-2:#372E27;
  --accent:#D39A7E; --accent-ink:#1F1915; --accent-soft:#3D2E26;
  --ok:#7FC293; --ok-soft:#233328; --warn:#E3AE68; --warn-soft:#3A2E1E; --bad:#EC8E83; --bad-soft:#3E2422;
  --final:#8FC3DA; --final-soft:#1F3039; --shadow:0 1px 0 rgba(0,0,0,.3),0 8px 22px -14px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--sheet)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.gut{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

/* top bar */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--sheet);border-bottom:1px solid var(--line)}
.top-in{max-width:1320px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding-block:12px}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:0}
.mark{display:grid;grid-template-columns:repeat(6,5px);grid-template-rows:repeat(3,5px);gap:2px}
.mark i{display:block;border-radius:3px;background:var(--ink)}
.mark i:nth-child(1){grid-column:3/5;grid-row:1;background:var(--accent)}
.mark i:nth-child(2){grid-column:2/4;grid-row:2}.mark i:nth-child(3){grid-column:4/6;grid-row:2}
.mark i:nth-child(4){grid-column:1/3;grid-row:3}.mark i:nth-child(5){grid-column:3/5;grid-row:3}.mark i:nth-child(6){grid-column:5/7;grid-row:3}
.brand h1{font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.06em;font-size:15px;margin:0;line-height:1.1}
.brand small{display:block;font-size:12px;color:var(--ink-3);letter-spacing:0;text-transform:none;font-family:var(--body);font-weight:500;margin-top:2px}
.tabs{display:flex;gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px}
.tabs button{border:0;background:none;padding:6px 14px;border-radius:999px;font-weight:600;font-size:13px;color:var(--ink-2)}
.tabs button[aria-pressed="true"]{background:var(--ink);color:var(--sheet)}
.me{font-size:13px;color:var(--ink-2);display:flex;align-items:center;gap:8px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--stone)}
.dot.on{background:var(--ok)}

.tally{max-width:1320px;margin:0 auto;display:flex;flex-wrap:wrap;gap:6px 16px;padding-block:0 12px;font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.tally b{color:var(--ink);font-weight:700}
.bar{flex:1 1 180px;align-self:center;height:6px;border-radius:6px;background:var(--line-2);overflow:hidden;display:flex;min-width:120px}
.bar span{display:block;height:100%}

/* layout */
.wrapx{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;padding-block:24px 80px}
.rail{position:sticky;top:calc(env(safe-area-inset-top,0px) + 112px);align-self:start;max-height:calc(100vh - 140px);overflow:auto;padding-right:4px}
.rail h3{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:18px 0 6px;font-weight:700}
.rail h3:first-child{margin-top:0}
.rail button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;border:0;background:none;padding:7px 10px;border-radius:8px;font-size:14px;color:var(--ink-2)}
.rail button:hover{background:var(--line-2)}
.rail button[aria-current="true"]{background:var(--sheet);color:var(--ink);font-weight:600;box-shadow:var(--shadow)}
.cnt{font-family:var(--mono);font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.cnt .c{color:var(--warn)}
.pagesel{display:none}

.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px}
.search{flex:1 1 220px;display:flex;align-items:center;gap:8px;background:var(--sheet);border:1px solid var(--line);border-radius:999px;padding:7px 14px}
.search input{border:0;outline:0;background:none;width:100%;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--sheet);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:500;color:var(--ink-2)}
.chip[aria-pressed="true"]{border-color:var(--ink);color:var(--ink);background:var(--line-2)}
.btn{border:1px solid var(--line);background:var(--sheet);border-radius:8px;padding:7px 12px;font-size:13px;font-weight:600;color:var(--ink)}
.btn:hover{border-color:var(--stone)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.sm{padding:4px 9px;font-size:12px;border-radius:7px}
.btn[disabled]{opacity:.45;cursor:not-allowed}

.phead{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin:4px 0 6px}
.phead h2{font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:clamp(20px,2.6vw,28px);margin:0;text-wrap:balance}
.phead a{font-family:var(--mono);font-size:12px;color:var(--accent)}
.pnote{color:var(--ink-3);font-size:13px;margin:0 0 20px}
.banner{border:1px solid var(--line);background:var(--sheet);border-radius:var(--r);padding:12px 16px;font-size:14px;color:var(--ink-2);margin-bottom:18px}
.banner b{color:var(--ink)}

/* section sheet */
.sheet{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r);margin-bottom:22px;box-shadow:var(--shadow)}
.shead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 14px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.shead h3{margin:0;font-size:12px;letter-spacing:.11em;text-transform:uppercase;font-weight:700;color:var(--ink-2)}
.shead h3 em{font-style:normal;color:var(--ink-3);font-weight:500;letter-spacing:.04em;margin-left:6px;font-family:var(--mono);text-transform:none}
.row{display:grid;grid-template-columns:44px minmax(0,1fr);border-top:1px solid var(--line-2)}
.row:first-of-type{border-top:0}
.num{font-family:var(--mono);font-size:11px;color:var(--ink-3);padding:15px 0 0 18px;font-variant-numeric:tabular-nums;border-left:3px solid transparent}
.row[data-s="change"] .num{border-left-color:var(--warn)}
.row[data-s="ok"] .num{border-left-color:var(--ok)}
.row[data-s="final"] .num{border-left-color:var(--final)}
.row[data-s="comment"] .num{border-left-color:var(--stone)}
.body{padding:12px 18px 12px 4px;min-width:0}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:3px}
.kind{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:700}
.pill{font-size:11px;font-weight:600;border-radius:999px;padding:1px 8px}
.pill.change{background:var(--warn-soft);color:var(--warn)}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.final{background:var(--final-soft);color:var(--final)}
.pill.comment{background:var(--line-2);color:var(--ink-2)}
.pill.remove{background:var(--bad-soft);color:var(--bad)}
.txt{margin:0;max-width:72ch;overflow-wrap:anywhere}
.k-Headline .txt,.k-Heading .txt{font-family:var(--display);font-weight:500;font-size:17px;text-transform:uppercase;letter-spacing:.02em;line-height:1.3}
.k-Subheading .txt{font-weight:700}
.k-Label .txt{font-size:13px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--ink-2)}
.finaltxt{margin:6px 0 0;padding:6px 10px;border-radius:7px;background:var(--final-soft);color:var(--ink);max-width:72ch;font-size:14px}
.finaltxt b{color:var(--final);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-right:6px}
.acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.act{border:1px solid var(--line);background:none;border-radius:7px;padding:3px 10px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.act:hover{border-color:var(--stone);color:var(--ink)}
.act.on.ok{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.act.fin{color:var(--final)}

.form{margin-top:10px;display:grid;gap:8px;max-width:72ch;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:12px}
.form label{font-size:12px;font-weight:600;color:var(--ink-2)}
.form textarea,.form select,.form input{width:100%;background:var(--sheet);border:1px solid var(--line);border-radius:7px;padding:8px 10px;font-size:14px;resize:vertical}
.form .fr{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;align-items:center}
.form .hint{font-size:12px;color:var(--ink-3);margin-right:auto}

.notes{display:grid;gap:6px;margin-top:10px;max-width:72ch}
.note{border-left:2px solid var(--line);padding:4px 0 4px 12px;font-size:13.5px}
.note.v-change{border-left-color:var(--warn)}.note.v-remove{border-left-color:var(--bad)}.note.v-ok{border-left-color:var(--ok)}.note.v-add{border-left-color:var(--accent)}
.note.closed{opacity:.6}
.nh{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;color:var(--ink-3);font-size:12px}
.nh b{color:var(--ink);font-weight:600}
.prop{margin:3px 0 0;font-weight:500;color:var(--ink)}
.prop::before{content:"New wording: ";color:var(--warn);font-weight:700;font-size:12px}
.why{margin:2px 0 0;color:var(--ink-2)}
.nacts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.link{border:0;background:none;padding:0;font-size:12px;font-weight:600;color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.addrow{padding:10px 18px 14px 62px;border-top:1px dashed var(--line)}

.empty{padding:40px 20px;text-align:center;color:var(--ink-3)}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--sheet);padding:9px 16px;border-radius:999px;font-size:13px;font-weight:600;z-index:40;max-width:calc(100% - 32px)}

/* master */
.mgrid{display:grid;gap:22px}
.mline{padding:10px 18px;border-top:1px solid var(--line-2);display:flex;gap:14px;align-items:flex-start}
.mline:first-of-type{border-top:0}
.mline p{margin:0;flex:1;min-width:0;max-width:75ch}
.mline small{display:block;color:var(--ink-3);font-size:12px;margin-top:2px}

@media (max-width:900px){
  .wrapx{grid-template-columns:minmax(0,1fr);gap:14px;padding-block:16px 80px}
  .rail{display:none}
  .pagesel{display:block;width:100%;padding:9px 12px;border-radius:8px;border:1px solid var(--line);background:var(--sheet);font-size:15px;margin-bottom:12px}
  .row{grid-template-columns:34px minmax(0,1fr)}
  .num{padding-left:10px}
  .addrow{padding-left:16px}
  .tally{gap:4px 12px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.join{display:grid;gap:10px;background:var(--sheet);border:1px solid var(--accent);border-radius:var(--r);padding:16px 18px;margin-bottom:18px;box-shadow:var(--shadow)}
.join h3{margin:0;font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:15px;letter-spacing:.04em}
.join p{margin:0;color:var(--ink-2);font-size:14px}
.join form{display:flex;flex-wrap:wrap;gap:8px}
.join input{flex:1 1 220px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:15px}
.err{color:var(--bad);font-size:13px}
.linkbox{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}
.linkbox input{flex:1 1 260px;font-family:var(--mono);font-size:12px;background:var(--bg);border:1px solid var(--line);border-radius:7px;padding:7px 9px}
.notes.tight{margin:0 0 8px}
.addrow.flush{padding-left:18px}
.form.wide{margin-bottom:22px;max-width:none}
.gate{max-width:520px;margin:12vh auto;text-align:center;color:var(--ink-2)}
.gate h2{font-family:var(--display);font-weight:500;text-transform:uppercase;color:var(--ink);font-size:22px}
.me button{border:0;background:none;padding:0;color:var(--accent);font-weight:600;font-size:13px;text-decoration:underline;text-underline-offset:2px}
