/* HTML source to Markdown: a warm, two-page editing surface. */
.tn-htm-page #htmTool {
  --htm-paper:#faf6ee; --htm-surface:#fffdf7; --htm-wash:#f5efdf;
  --htm-ink:#1a1208; --htm-muted:#5a4a30; --htm-line:#b8a888;
  --htm-soft:#ddd4be; --htm-action:#ede6d4; --htm-hover:#dfd4bb;
  --htm-accent:#c44a00; --htm-primary:#1a1208; --htm-primary-text:#faf6ee;
  color:var(--htm-ink); background:var(--htm-paper); min-width:0;
  border-top:3px double var(--htm-ink); border-bottom:1px solid var(--htm-line);
  padding:18px 20px;
}
.tn-htm-page #htmTool *, .tn-htm-page #htmTool *::before, .tn-htm-page #htmTool *::after { box-sizing:border-box; }
.tn-htm-page #htmTool [hidden] { display:none!important; }
.tn-htm-page #htmTool :is(button,textarea,input,label) { -webkit-text-fill-color:currentColor; }
.tn-htm-page #htmTool :is(button,.htm-file) {
  display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px;
  padding:10px 15px; border:1px solid var(--htm-line); border-radius:0;
  background:var(--htm-action); color:var(--htm-ink); box-shadow:none;
  font:800 13px/1.3 'Courier New',monospace; text-align:center; cursor:pointer;
  transition:background-color 150ms ease,color 150ms ease,transform 150ms ease;
}
.tn-htm-page #htmTool :is(button,.htm-file):hover:not(:disabled) { background:var(--htm-hover); transform:translateY(-1px); }
.tn-htm-page #htmTool :is(button,.htm-file):active:not(:disabled) { transform:scale(.96); }
.tn-htm-page #htmTool button:disabled { opacity:.45; cursor:not-allowed; }
.tn-htm-page #htmTool :is(button,textarea,input):focus-visible,
.tn-htm-page #htmTool .htm-file:focus-within { outline:2px solid var(--htm-accent); outline-offset:3px; }
.tn-htm-page #htmTool .htm-deck {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:10px 25px; padding:2px 0 17px; border-bottom:1px solid var(--htm-soft);
}
.tn-htm-page #htmTool .htm-deck p { margin:0; color:var(--htm-muted); font-size:13px; line-height:1.55; }
.tn-htm-page #htmTool .htm-deck strong { color:var(--htm-ink); font-weight:800; }
.tn-htm-page #htmTool .htm-notation { display:flex; gap:9px; align-items:center; font:800 12px/1.3 'Courier New',monospace; white-space:nowrap; }
.tn-htm-page #htmTool .htm-notation span { background:var(--htm-wash); padding:7px 10px; }
.tn-htm-page #htmTool .htm-notation b { color:var(--htm-accent); font-size:17px; }
.tn-htm-page #htmTool .htm-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; padding:17px 0; }
.tn-htm-page #htmTool .htm-pane { min-width:0; border:1px solid var(--htm-line); background:var(--htm-surface); display:flex; flex-direction:column; transition:border-color 150ms ease; }
.tn-htm-page #htmTool .htm-pane:focus-within { border-color:var(--htm-accent); }
.tn-htm-page #htmTool .htm-pane--result { background:var(--htm-wash); }
.tn-htm-page #htmTool[data-state="ready"] .htm-pane--result { border-color:var(--htm-accent); }
.tn-htm-page #htmTool .htm-pane-head { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:70px; padding:12px 18px; border-bottom:1px solid var(--htm-soft); }
.tn-htm-page #htmTool .htm-pane-head label:not(.htm-file) { display:grid; gap:3px; min-width:0; }
.tn-htm-page #htmTool .htm-pane-head strong { font-size:16px; font-weight:800; line-height:1.35; }
.tn-htm-page #htmTool .htm-pane-head small { color:var(--htm-accent); font:800 11px/1.4 'Courier New',monospace; letter-spacing:.1em; }
.tn-htm-page #htmTool .htm-file { position:relative; flex:none; }
.tn-htm-page #htmTool .htm-file input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.tn-htm-page #htmTool .htm-result-symbol { color:var(--htm-accent); font:800 24px/1 Georgia,serif; }
.tn-htm-page #htmTool :is(#htmInput,#htmOutput) {
  display:block; flex:1; width:100%; min-width:0; min-height:360px; resize:vertical;
  border:0; border-radius:0; box-shadow:none; padding:21px 18px;
  background:transparent; color:var(--htm-ink);
  font:14px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace;
  white-space:pre; overflow:auto; tab-size:2;
}
.tn-htm-page #htmTool :is(#htmInput,#htmOutput)::placeholder { color:var(--htm-muted); opacity:.75; }
.tn-htm-page #htmTool :is(#htmInput,#htmOutput):focus-visible { outline-offset:-4px; }
.tn-htm-page #htmTool #htmInput[aria-invalid="true"] { background:var(--htm-wash); }
.tn-htm-page #htmTool .htm-pane-foot { min-height:81px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 14px; padding:12px 18px; border-top:1px solid var(--htm-soft); }
.tn-htm-page #htmTool .htm-pane-foot > span { color:var(--htm-muted); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.tn-htm-page #htmTool .htm-actions { display:flex; flex-wrap:wrap; gap:7px; }
.tn-htm-page #htmTool #htmDownload { background:var(--htm-primary); border-color:var(--htm-primary); color:var(--htm-primary-text); -webkit-text-fill-color:var(--htm-primary-text); }
.tn-htm-page #htmTool #htmDownload:hover:not(:disabled) { background:var(--htm-accent); border-color:var(--htm-accent); }
.tn-htm-page #htmTool .htm-tool-foot { display:flex; justify-content:space-between; flex-wrap:wrap; align-items:start; gap:10px 25px; padding:0 0 17px; }
.tn-htm-page #htmTool #htmStatus { margin:0; min-height:24px; color:var(--htm-muted); font-size:13px; line-height:1.7; }
.tn-htm-page #htmTool[data-state="error"] #htmStatus { color:var(--htm-accent); }
.tn-htm-page #htmTool .htm-privacy { margin:0; color:var(--htm-muted); font-size:12px; line-height:1.65; }
.tn-htm-page #htmTool #htmWarnings { margin:0 0 17px; padding:12px 17px 12px 35px; border:1px solid var(--htm-soft); background:var(--htm-wash); color:var(--htm-muted); font-size:12px; line-height:1.7; }
.tn-htm-page #htmTool :is(code,pre,kbd,samp) { padding:0; border:0; border-radius:0; background:transparent; color:inherit; -webkit-text-fill-color:inherit; }
.tn-htm-page .htm-ad { width:min(900px,100%); min-height:90px; margin-inline:auto; background:transparent; }
.tn-htm-page .htm-ad--top { margin-top:54px; margin-bottom:18px; }
.tn-htm-page .htm-ad--bottom { margin-top:16px; margin-bottom:26px; }
.tn-htm-page .htm-ad ins { max-width:100%; }
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-l="dark"],[data-scheme="auto"][data-d="dark"]) .tn-htm-page #htmTool,
html[data-scheme="dark"] body:not([data-scheme="light"]) .tn-htm-page #htmTool {
  --htm-paper:#241d12; --htm-surface:#322a1a; --htm-wash:#2c2517;
  --htm-ink:#efe6d2; --htm-muted:#c3b492; --htm-line:#6f6047; --htm-soft:#574a37;
  --htm-action:#2c2517; --htm-hover:#3b301e; --htm-accent:#e8823f;
  --htm-primary:#6a3b1f; --htm-primary-text:#f7ead1; color-scheme:dark;
}
@media(prefers-color-scheme:dark) {
  body[data-scheme="auto"] .tn-htm-page #htmTool {
    --htm-paper:#241d12; --htm-surface:#322a1a; --htm-wash:#2c2517;
    --htm-ink:#efe6d2; --htm-muted:#c3b492; --htm-line:#6f6047; --htm-soft:#574a37;
    --htm-action:#2c2517; --htm-hover:#3b301e; --htm-accent:#e8823f;
    --htm-primary:#6a3b1f; --htm-primary-text:#f7ead1; color-scheme:dark;
  }
}
@media(max-width:720px) {
  .tn-htm-page .htm-ad--top { margin-top:48px; }
  .tn-htm-page #htmTool { padding:14px 12px; }
  .tn-htm-page #htmTool .htm-workspace { grid-template-columns:minmax(0,1fr); gap:12px; padding:13px 0; }
  .tn-htm-page #htmTool .htm-pane-head { min-height:57px; padding:10px 14px; }
  .tn-htm-page #htmTool :is(#htmInput,#htmOutput) { flex:0 0 auto; height:220px; min-height:220px; padding:14px; font-size:16px; line-height:1.6; }
  .tn-htm-page #htmTool .htm-pane-foot { min-height:0; padding:10px 14px; }
  .tn-htm-page #htmTool .htm-notation { white-space:normal; }
}
@media(prefers-reduced-motion:reduce) {
  .tn-htm-page #htmTool :is(button,.htm-file) { transition:none; transform:none!important; }
  .tn-htm-page #htmTool .htm-pane { transition:none; }
}
