:root{
  --bg:#ffffff; --fg:#1d1c2c; --muted:#5f5e6e; --line:#e7e6f0;
  --card:#f7f6fc; --accent:#534ab7; --accent-soft:#eeedfe;
  --code-bg:#f1eff8; --code-fg:#3c3489;
  --cap:#0f6e56; --cap-bg:#e1f5ee; --contract:#185fa5; --contract-bg:#e6f1fb;
  --note:#5f5e5a; --note-bg:#f1efe8; --warn:#a32d2d; --warn-bg:#fcebeb;
  --bar:#26215c; --bar-fg:#eeedfe;
}
html[data-theme="dark"]{
  --bg:#16151f; --fg:#e9e8f2; --muted:#a9a7bd; --line:#2b2940;
  --card:#1e1d2c; --accent:#afa9ec; --accent-soft:#26215c;
  --code-bg:#211f33; --code-fg:#cecbf6;
  --cap:#5dcaa5; --cap-bg:#0f3a30; --contract:#85b7eb; --contract-bg:#0c2c4a;
  --note:#b4b2a9; --note-bg:#23222e; --warn:#f09595; --warn-bg:#3a1c1c;
  --bar:#1b1830; --bar-fg:#cecbf6;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{display:flex;flex-direction:column;background:var(--bg);color:var(--fg);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 16px;background:var(--bar);color:var(--bar-fg);position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:9px;font-size:14px;letter-spacing:.2px}
.brand b{font-weight:600}
.bar-actions{display:flex;gap:8px}
.bar-actions button{font:inherit;font-size:13px;padding:6px 11px;border-radius:7px;cursor:pointer;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:var(--bar-fg)}
.bar-actions button:hover{background:rgba(255,255,255,.16)}
#themeBtn{min-width:34px}
.drop{flex:1;overflow:auto;padding:34px 20px 60px;position:relative}
.drop.dragover{outline:2px dashed var(--accent);outline-offset:-12px;background:var(--accent-soft)}
.doc{max-width:760px;margin:0 auto}
.status{padding:6px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;background:var(--bg)}

/* empty state */
.empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.empty-card{text-align:center;color:var(--muted);max-width:430px;pointer-events:auto}
.empty.hidden{display:none}
.empty-mark{font-size:60px;color:var(--accent);line-height:1}
.empty-card h2{color:var(--fg);font-weight:500;margin:.4em 0 .2em}
.ghost{margin-top:10px;font:inherit;padding:8px 14px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--fg)}

/* rendered document */
.sd-meta{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:26px}
.sd-doctitle{font-size:30px;font-weight:600;margin:0 0 12px;letter-spacing:-.01em}
.sd-chips{display:flex;flex-wrap:wrap;gap:6px}
.sd-chip{font-size:12px;padding:2px 9px;border-radius:999px;background:var(--card);color:var(--muted);border:1px solid var(--line)}
.sd-chip-owner{color:var(--accent);border-color:var(--accent)}
.sd-chip-cap{color:var(--cap);border-color:var(--cap)}
.sd-tag{font-size:12px;padding:2px 9px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
.sd-h{font-weight:600;line-height:1.25;margin:1.5em 0 .5em;scroll-margin-top:64px}
.sd-h1{font-size:26px} .sd-h2{font-size:21px} .sd-h3{font-size:18px}
.sd-h4,.sd-h5,.sd-h6{font-size:16px;color:var(--muted)}
.sd-p{margin:.7em 0}
.sd-icode,.sd-pre code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.sd-icode{background:var(--code-bg);color:var(--code-fg);padding:1px 6px;border-radius:5px;font-size:.9em}
.sd-pre{position:relative;background:var(--code-bg);border:1px solid var(--line);border-radius:10px;
  padding:14px 16px;overflow:auto;margin:1em 0;font-size:13.5px;line-height:1.55}
.sd-pre code{color:var(--code-fg);white-space:pre}
.sd-lang{position:absolute;top:8px;right:12px;font-size:11px;color:var(--muted);text-transform:lowercase}
.sd-list{margin:.7em 0;padding-left:1.4em}
.sd-li{margin:.3em 0}
.sd-li .sd-p{margin:.2em 0}
.sd-link{color:var(--accent)}
.sd-ref{color:var(--accent);text-decoration:none;border-bottom:1px dashed var(--accent)}
.sd-ref:hover{background:var(--accent-soft)}
.sd-ref-block{display:inline-block;margin:.4em 0;padding:4px 10px;border:1px solid var(--accent);border-radius:7px;border-bottom-style:solid}
.sd-tablewrap{overflow:auto;margin:1em 0}
.sd-table{border-collapse:collapse;width:100%;font-size:14px}
.sd-table th,.sd-table td{border:1px solid var(--line);padding:7px 11px;text-align:left;vertical-align:top}
.sd-table th{background:var(--card);font-weight:600}
.sd-quote{margin:1em 0;padding:.4em 1em;border-left:3px solid var(--accent);color:var(--muted);background:var(--card)}
.sd-rule{border:0;border-top:1px solid var(--line);margin:1.8em 0}
.sd-fig{margin:1.2em 0;text-align:center}
.sd-fig img{max-width:100%;border:1px solid var(--line);border-radius:10px}
.sd-fig figcaption{color:var(--muted);font-size:13px;margin-top:6px}
.sd-callout{margin:1.1em 0;border:1px solid var(--line);border-left-width:4px;border-radius:9px;padding:12px 15px;background:var(--card)}
.sd-callout-kind{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.sd-callout-body :first-child{margin-top:0}.sd-callout-body :last-child{margin-bottom:0}
.sd-callout-capability{border-left-color:var(--cap);background:var(--cap-bg)} .sd-callout-capability .sd-callout-kind{color:var(--cap)}
.sd-callout-contract{border-left-color:var(--contract);background:var(--contract-bg)} .sd-callout-contract .sd-callout-kind{color:var(--contract)}
.sd-callout-note{border-left-color:var(--note);background:var(--note-bg)} .sd-callout-note .sd-callout-kind{color:var(--note)}
.sd-callout-warning{border-left-color:var(--warn);background:var(--warn-bg)} .sd-callout-warning .sd-callout-kind{color:var(--warn)}
.sd-err,.sd-warn-banner{padding:12px 15px;border-radius:9px;margin-bottom:16px}
.sd-err{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn)}
.sd-warn-banner{background:var(--note-bg);color:var(--note);border:1px solid var(--line);font-size:13px}
.sd-unknown{color:var(--warn);font-style:italic}