:root{color-scheme:light}
body{margin:0;font-size:14px}
img{max-width:100%}

/* Layout: a reading pane holds the document; a review rail beside it holds every proposed change and the export gate. */
:root{
  --bg:#eef2f3;--paper:#fff;--ink:#17272c;--muted:#566a70;--line:#cfd9dc;--logo:#2f7276;--accent:#2f7276;--accent-ink:#fff;--soft:#dcebe6;
  --person:#ffe58a;--place:#bfe3f7;--date:#e0d3f7;--contact:#f8cfdc;--manual:#c9edc4;--check-line:#a65f00;--mark-ink:#17272c;--warn-bg:#fff1d6;--warn-ink:#6a4300;--good:#1d6b3f;
  --head:"Quicksand",system-ui,sans-serif;--body:system-ui,sans-serif;--doc:Georgia,serif;--mono:ui-monospace,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --logo:#67c3cf;--bg:#10191c;--paper:#18252a;--ink:#e6eef0;--muted:#9db0b6;--line:#2e4148;--accent:#67c3cf;--accent-ink:#08272c;--soft:#1f3a40;
  --person:#6d5a12;--place:#1f5472;--date:#4b3a70;--contact:#70334a;--manual:#2c5b33;--check-line:#e6a64a;--mark-ink:#f4f7f8;--warn-bg:#3d2f13;--warn-ink:#f5d9a0;--good:#7bd3a0;color-scheme:dark}}
:root[data-theme="dark"]{
  --logo:#67c3cf;--bg:#10191c;--paper:#18252a;--ink:#e6eef0;--muted:#9db0b6;--line:#2e4148;--accent:#67c3cf;--accent-ink:#08272c;--soft:#1f3a40;
  --person:#6d5a12;--place:#1f5472;--date:#4b3a70;--contact:#70334a;--manual:#2c5b33;--check-line:#e6a64a;--mark-ink:#f4f7f8;--warn-bg:#3d2f13;--warn-ink:#f5d9a0;--good:#7bd3a0;color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--body)}
.wrap{max-width:1280px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 32px;display:grid;gap:14px}
h1{font:700 1.45rem/1.15 var(--head);margin:0;text-wrap:balance}
.brand{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;min-width:0}
.logo-link{display:block;color:var(--ink);line-height:0;border-radius:4px}
.logo{display:block;height:84px;width:auto;max-width:100%}
.brand h1 small{display:block;font:400 .92rem/1.3 var(--body);color:var(--muted);margin-top:2px}
.brand h1{border-left:1px solid var(--line);padding-left:18px}
@media (max-width:600px){.brand h1{border-left:0;padding-left:0;width:100%}}
header{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between}
.promise{color:var(--muted);margin:0}
.label{font:500 .72rem/1.2 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.drop{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;background:var(--paper);border:1.5px dashed var(--line);padding:12px 14px;border-radius:6px}
.drop.over{border-color:var(--accent);background:var(--soft)}
.drop p{margin:0;flex:1 1 280px;min-width:0}
.drop small{display:block;color:var(--muted)}
button,.btn{font:700 .92rem/1.2 var(--body);padding:9px 13px;border-radius:5px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer}
button.primary,.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
button:disabled{opacity:.45;cursor:not-allowed}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.notice{margin:0;padding:9px 12px;border-radius:5px;background:var(--warn-bg);color:var(--warn-ink)}
.notice:empty{display:none}
.notice ul{margin:4px 0 0;padding-left:18px}
.main{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.pane{background:var(--paper);border:1px solid var(--line);border-radius:6px;min-width:0}
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:6px;flex:1 1 auto}
.tabs button{border:0;background:none;color:var(--muted);padding:7px 10px;border-radius:4px}
.tabs button[aria-selected="true"]{background:var(--soft);color:var(--ink)}
[hidden]{display:none!important}
#tab-clean{background:#f4b95a;color:#17272c}
#tab-clean[aria-selected="true"]{background:var(--accent);color:var(--accent-ink)}
#doc{font:400 1rem/1.65 var(--doc);padding:18px 22px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:72vh;overflow:auto;margin:0}
mark{color:var(--mark-ink);border-radius:2px;padding:0 2px;cursor:pointer}
mark.person{background:var(--person)}mark.place{background:var(--place)}mark.date{background:var(--date)}mark.contact{background:var(--contact)}mark.manual{background:var(--manual)}
mark.check{background:none;color:inherit;border-bottom:2px dotted var(--check-line);border-radius:0;padding:0}
mark.off{background:none;color:inherit;text-decoration:underline dotted var(--muted)}
mark.check.chosen{background:var(--person);color:var(--mark-ink);border-bottom:0}
.ph{font:500 .84em var(--mono);background:var(--soft);padding:0 3px;border-radius:2px}
.rail{display:grid;position:sticky;top:calc(env(safe-area-inset-top,0px) + 10px);max-height:calc(100vh - 20px);grid-template-rows:auto minmax(0,1fr) auto}
.rail-top{padding:10px 12px;border-bottom:1px solid var(--line)}
.rail-top strong{font-size:1.05rem}
.add{display:flex;gap:6px;margin-top:8px}
.add input{flex:1;min-width:0}
input[type=text],textarea{font:400 .92rem var(--body);padding:7px 8px;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--ink);width:100%}
textarea{resize:vertical;min-height:48px}
.list{overflow:auto;padding:4px 12px 10px;min-height:140px}
details{border-bottom:1px solid var(--line);padding:7px 0}
details:last-child{border-bottom:0}
summary{cursor:pointer;display:flex;gap:8px;align-items:center;font-weight:700}
summary .swatch{width:12px;height:12px;border-radius:2px;flex:none}
summary .n{margin-left:auto;font:500 .78rem var(--mono);color:var(--muted)}
.hint{color:var(--muted);font-size:.86rem;margin:4px 0}
.row{display:grid;grid-template-columns:20px minmax(0,1fr) minmax(0,.9fr);gap:6px;align-items:center;padding:3px 0}
.row label{overflow-wrap:anywhere;font-size:.9rem;cursor:pointer}
.row label small{color:var(--muted);font:400 .72rem var(--mono)}
.row input[type=text]{font:400 .78rem var(--mono);padding:4px 5px}
.keep{padding-top:8px}
.export{border-top:1px solid var(--line);padding:10px 12px;display:grid;gap:8px}
.scan{margin:0;font-size:.88rem}
.scan.ok{color:var(--good)}.scan.warn{color:var(--warn-ink);background:var(--warn-bg);padding:5px 7px;border-radius:4px}
.confirm{display:grid;grid-template-columns:20px 1fr;gap:6px;font-size:.9rem;cursor:pointer}
.buttons{display:flex;flex-wrap:wrap;gap:6px}
.buttons button{flex:1 1 auto}
#status{min-height:1.2em;margin:0;font-size:.86rem;color:var(--muted)}
.head-side{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:0;width:min(680px,calc(100vw - 32px));max-height:calc(100vh - 32px)}
dialog::backdrop{background:rgba(10,24,28,.62)}
.about{display:flex;flex-direction:column;max-height:calc(100vh - 34px)}
.about-body{overflow:auto;padding:20px 22px 8px;min-height:0}
.about h2{font:700 1.3rem/1.2 var(--head);margin:0 0 8px;text-wrap:balance}
.about h3{font:700 1rem/1.3 var(--head);margin:16px 0 3px}
.about p,.about ol{margin:0 0 6px;max-width:62ch}
.about ol{padding-left:22px}
.about li{margin-bottom:4px}
.about-foot{border-top:1px solid var(--line);padding:12px 22px;display:grid;gap:10px}
.about-foot .row-end{display:flex;justify-content:flex-end}
.limits{color:var(--muted);font-size:.88rem;max-width:75ch;margin:0}
@media (max-width:900px){.main{grid-template-columns:minmax(0,1fr)}.rail{position:static;max-height:none}#doc{max-height:60vh}.list{max-height:420px}}
@media (max-height:820px){.rail{position:static;max-height:none}.list{max-height:380px}}
@media (prefers-reduced-motion:no-preference){.drop{transition:background .15s}}