:root{
  --bg:#EEEDE9; --panel:#F8F7F4; --ink:#1E2328; --muted:#5E656D; --line:#D6D3CC; --line2:#C4C0B7;
  --accent:#C8641E; --accent-ink:#fff; --sel:#F2B705; --bad:#C0392B; --warn:#D98E04; --pub:#2F6690; --est:#8A8F96;
  --font-body:'General Sans','Segoe UI',sans-serif; --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --r:6px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:14px/1.4 var(--font-body)}
body{display:grid;grid-template-columns:300px 1fr 300px;grid-template-rows:auto 1fr auto;grid-template-areas:"top top top" "lib stage insp" "status status status";height:100vh;overflow:hidden}
.mono{font-family:var(--font-mono)}
.muted{color:var(--muted)}
button{font:inherit;font-size:13px;border:1px solid var(--line2);background:#fff;color:var(--ink);border-radius:var(--r);padding:5px 10px;cursor:pointer}
button:hover{border-color:var(--ink)}
button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
button.danger{color:var(--bad)}
button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
input{font:inherit;font-size:13px;border:1px solid var(--line2);border-radius:var(--r);padding:5px 7px;background:#fff;color:var(--ink);min-width:0}
.top{grid-area:top;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel)}
.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
h1{font-size:18px;margin:0;font-weight:600}
.sub{font-size:12px;color:var(--muted)}
.tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:var(--r);overflow:hidden}
.seg button{border:0;border-radius:0;padding:5px 12px;background:#fff}
.seg button.on{background:var(--ink);color:#fff}
.chk{display:flex;align-items:center;gap:5px;font-size:13px}
.num{display:flex;align-items:center;gap:5px;font-size:13px}
.num input{width:56px}
.ghost{background:transparent}
.filebtn{border:1px solid var(--line2);border-radius:var(--r);padding:5px 10px;font-size:13px;cursor:pointer}
.filebtn input{display:none}
.lib{grid-area:lib;border-right:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;min-height:0}
.libhead{padding:10px 12px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.filters button{font-size:12px;padding:3px 8px}
.filters button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.list{overflow:auto;flex:1;padding:4px 0}
.grp{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:10px 12px 4px}
.item{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;padding:6px 12px;cursor:pointer;border-left:3px solid transparent}
.item:hover{background:#fff}
.item.sel{background:#fff;border-left-color:var(--sel)}
.item .dot{width:10px;height:10px;border-radius:2px}
.item .nm{font-size:13px;line-height:1.25}
.item .md{font-size:11px;color:var(--muted)}
.item .st{font-size:11px;font-family:var(--font-mono);color:var(--muted)}
.item .st.in{color:var(--pub)}
.item .st.bad{color:var(--bad)}
.item .st.warn{color:var(--warn)}
.addrow{border-top:1px solid var(--line);padding:8px 12px;display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12px}
.addrow button{font-size:12px;padding:3px 8px}
#stage{grid-area:stage;position:relative;min-width:0;min-height:0;overflow:hidden;background:#E4E2DC}
#stage canvas{display:block}
.hint{position:absolute;left:12px;bottom:12px;right:12px;max-width:620px;font-size:12px;color:var(--muted);background:rgba(248,247,244,.92);border:1px solid var(--line);border-radius:var(--r);padding:6px 10px;pointer-events:none}
.insp{grid-area:insp;border-left:1px solid var(--line);background:var(--panel);overflow:auto;padding:14px}
.insp h2{font-size:15px;margin:0 0 6px;font-weight:600}
.insp p{margin:0 0 10px;color:var(--muted);font-size:13px}
.legend{display:flex;flex-direction:column;gap:6px;font-size:12px;margin-top:14px}
.sw{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:8px;vertical-align:-2px}
.sw.pub{background:var(--pub)}.sw.est{background:repeating-linear-gradient(45deg,var(--est) 0 3px,#fff 3px 6px);border:1px solid var(--est)}
.sw.bad{background:var(--bad)}.sw.warn{background:var(--warn)}
.badge{display:inline-block;font-size:11px;padding:2px 7px;border-radius:99px;border:1px solid;margin:2px 4px 6px 0}
.badge.pub{color:var(--pub)}.badge.est{color:#6b7077}.badge.bad{color:var(--bad)}.badge.warn{color:#9a6503}.badge.ok{color:#2e7d4f}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:12px;margin:8px 0}
.kv dt{color:var(--muted)}.kv dd{margin:0}
.fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin:8px 0}
.fields label{display:flex;flex-direction:column;font-size:11px;color:var(--muted);gap:2px}
.fields input{width:100%}
.gaps{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;font-size:12px;margin:8px 0}
.gaps div{display:flex;justify-content:space-between;border-bottom:1px dotted var(--line2)}
.btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.note{font-size:12px;color:var(--muted);border-left:2px solid var(--line2);padding-left:8px;margin:8px 0}
.issues{margin:6px 0;padding:0;list-style:none;font-size:12px}
.issues li{padding:2px 0}
.status{grid-area:status;display:flex;gap:18px;padding:6px 16px;font-size:12px;border-top:1px solid var(--line);background:var(--panel);color:var(--muted);flex-wrap:wrap}
.status b{color:var(--ink);font-weight:500}
.status .bad b{color:var(--bad)}
.lbl{font:11px/1.1 var(--font-body);color:#1E2328;background:rgba(255,255,255,.85);padding:1px 4px;border-radius:3px;white-space:nowrap;pointer-events:none;border:1px solid rgba(0,0,0,.08)}
.lbl.dim{font-family:var(--font-mono);background:var(--ink);color:#fff;border:0}
.lbl.big{font-size:12px;font-weight:600;background:transparent;border:0;color:var(--muted)}
dialog{border:1px solid var(--line2);border-radius:10px;padding:0;background:var(--panel);color:var(--ink)}
.dlg{padding:18px;display:flex;flex-direction:column;gap:10px;min-width:360px}
.dlg h2{margin:0;font-size:16px}
.dlg label{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:3px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dlg menu{display:flex;justify-content:flex-end;gap:8px;margin:0;padding:0}
@media (max-width:1100px){body{grid-template-columns:240px 1fr 260px}}
@media (max-width:820px){
  body{grid-template-columns:1fr;grid-template-rows:auto 55vh auto auto auto;grid-template-areas:"top" "stage" "insp" "lib" "status";overflow:auto;height:auto}
  .lib{max-height:50vh}.tools{justify-content:flex-start}.top{flex-direction:column;align-items:flex-start}
}
@media (max-width:700px){.hint{display:none}}
select{font:inherit;font-size:13px;border:1px solid var(--line2);background:#fff;color:var(--ink);border-radius:var(--r);padding:5px 8px;cursor:pointer}
.bulk{display:flex;gap:6px;margin-top:8px}
.bulk button{font-size:12px;padding:3px 8px}
button:disabled{opacity:.45;cursor:default}
.item.hid .nm,.item.hid .md{opacity:.5}
.lbl.dim.gapm{background:#1F5FA8}
.lbl.dim.gapw{background:#C8641E}
.lbl.dim.gapm,.lbl.dim.gapw{font-size:10px;padding:0 3px}
.kg{font-weight:600}.kg.m{color:#1F5FA8}.kg.w{color:#C8641E}