/* ERIT viewer, embed and self-hosting package. "Petrol" (D-71): warm paper, petrol, IBM Plex.
   Self-contained on purpose: it must not depend on the site's stylesheets. Status keeps a
   shape (circle = present, triangle = missing) so colour is never the only signal. */
:root { color-scheme: light dark; --bg:#f5f4f0; --surface:#ffffff; --surface-2:#efede7; --ink:#141c1c; --muted:#4d5958; --line:#d8d5cc; --line-strong:#a9a59a; --brand:#1d4c52; --brand-hover:#163b40; --brand-ink:#ffffff; --brand-soft:#e3eeee; --ok:#1c6636; --ok-soft:#e5f1e8; --err:#a3202a; --err-soft:#fbe9e9; --warn:#7f4d00; --warn-soft:#faefd9; }
@font-face { font-family:"IBM Plex Sans"; font-style:normal; font-weight:100 700; font-display:swap; src:url("fonts/plex-sans-latin.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/plex-mono-400-latin.woff2") format("woff2"); }
:root[data-theme="dark"] { --bg:#0e1414; --surface:#151d1d; --surface-2:#1c2626; --ink:#e7ecea; --muted:#a2afad; --line:#2d3939; --line-strong:#4d5c5c; --brand:#86c8c8; --brand-hover:#a3d7d7; --brand-ink:#0e1414; --brand-soft:#1b3436; --ok:#74d093; --ok-soft:#14301e; --err:#ff9090; --err-soft:#3b1a1c; --warn:#f0b95c; --warn-soft:#33270f; }
@media(prefers-color-scheme:dark) { :root:not([data-theme="light"]) { --bg:#0e1414; --surface:#151d1d; --surface-2:#1c2626; --ink:#e7ecea; --muted:#a2afad; --line:#2d3939; --line-strong:#4d5c5c; --brand:#86c8c8; --brand-hover:#a3d7d7; --brand-ink:#0e1414; --brand-soft:#1b3436; --ok:#74d093; --ok-soft:#14301e; --err:#ff9090; --err-soft:#3b1a1c; --warn:#f0b95c; --warn-soft:#33270f; } }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; padding:20px; background:var(--bg); color:var(--ink); font:16px/1.55 "IBM Plex Sans",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
h1 { font-size:1.5rem; line-height:1.2; margin:0 0 6px; font-weight:600; letter-spacing:-.01em; }
h2,h3 { line-height:1.3; }
h3 { font-size:1rem; margin:22px 0 10px; }
a { color:var(--brand); text-underline-offset:3px; }
button,.btn { cursor:pointer; border:1px solid var(--line-strong); border-radius:6px; min-height:40px; padding:0 16px; background:var(--surface); color:var(--ink); font:inherit; font-size:.875rem; font-weight:500; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; white-space:normal; }
button:hover,.btn:hover { background:var(--surface-2); }
.btn-primary { background:var(--brand); border-color:var(--brand); color:var(--brand-ink); }
.btn-primary:hover { background:var(--brand-hover); }
:focus-visible { outline:2px solid var(--brand); outline-offset:2px; border-radius:4px; }
.v-drop { border:2px dashed var(--line-strong); border-radius:8px; background:var(--surface); padding:24px 16px; text-align:center; margin:18px 0 12px; cursor:pointer; }
.v-drop:hover,.v-drop.over { border-color:var(--brand); }
.v-drop.over { background:var(--brand-soft); }
.v-drop h2 { font-size:1.15rem; margin:0 0 4px; }
.v-drop p { margin:6px 0; }
.v-note,.v-privacy,.v-embed-footer { font-size:.875rem; color:var(--muted); }
.v-head { display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; justify-content:space-between; border-bottom:2px solid var(--ink); padding-bottom:14px; margin-top:22px; }
.v-badge { display:inline-block; font:.75rem/1.5 "IBM Plex Mono",ui-monospace,monospace; margin:0 6px 6px 0; padding:2px 9px; border-radius:999px; background:var(--brand-soft); color:var(--brand); }
.v-badge.alt { background:var(--surface-2); color:var(--muted); }
.v-status { font-weight:500; display:inline-flex; align-items:center; gap:8px; padding:4px 12px; border-radius:999px; }
.v-status::before { content:""; width:12px; height:12px; flex:0 0 auto; background:currentColor; }
.v-status.ok { color:var(--ok); background:var(--ok-soft); }
.v-status.ok::before { border-radius:50%; }
.v-status.bad,.v-status.warn { color:var(--err); background:var(--err-soft); }
.v-status.bad::before,.v-status.warn::before { clip-path:polygon(50% 0,100% 100%,0 100%); }
.v-warn { background:var(--warn-soft); border-radius:6px; padding:10px 14px; font-size:.875rem; }
.v-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.v-column { border-bottom:1px solid var(--line); margin-top:12px; padding-bottom:12px; min-width:0; }
.v-column h3 { color:var(--muted); font:400 .72rem "IBM Plex Mono",ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase; }
dl { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:4px 10px; font-size:.875rem; }
dt { color:var(--muted); } dd { margin:0; overflow-wrap:anywhere; }
.v-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.v-table { border-collapse:collapse; width:100%; font-size:.875rem; }
.v-table td,.v-table th { padding:8px 10px; text-align:left; }
.v-table th { background:var(--surface-2); color:var(--muted); font:400 .7rem "IBM Plex Mono",ui-monospace,monospace; letter-spacing:.1em; text-transform:uppercase; }
.v-table td { border-top:1px solid var(--line); }
.v-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.v-totals { border-top:1px solid var(--line); padding-top:12px; margin-top:20px; font-variant-numeric:tabular-nums; }
.v-totals div { display:flex; justify-content:space-between; gap:16px; }
.v-totals .grand { font-weight:600; margin-top:10px; border-top:2px solid var(--ink); padding-top:8px; }
.v-checks { padding:0; list-style:none; font-size:.875rem; }
.v-checks li { margin:6px 0; }
.v-checks li::before { content:"\25CF  OK · "; color:var(--ok); font:.75rem "IBM Plex Mono",ui-monospace,monospace; }
.v-checks li.bad::before { content:"\25B2  FEHLT · "; color:var(--err); }
.bt,.v-detail { font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.8rem; color:var(--muted); margin-right:8px; }
.v-draft pre,[data-v="raw"] { white-space:pre-wrap; overflow-wrap:anywhere; font:.8rem/1.6 "IBM Plex Mono",ui-monospace,monospace; background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:12px 14px; }
[data-v="raw"] { max-height:340px; overflow:auto; }
[data-v="filename"],.v-badge,.v-warn { overflow-wrap:anywhere; }
.v-embed-footer { border-top:1px solid var(--line); margin-top:24px; padding-top:16px; }
.v-embed-footer a { font-weight:600; color:var(--brand); }
@media(max-width:600px) { body { padding:16px; } .v-grid { grid-template-columns:1fr; gap:0; } }
/* Only public layout information crosses the iframe boundary. */