/* Blurt — single-page landing in the style of a literature paper. No diagrams. */
:root {
  --paper: #faf8f1;
  --ink: #1b1a15;
  --muted: #6b685d;
  --rule: #ddd7c8;
  --rule-strong: #2a2820;
  --accent: #2b50f5;        /* Blurt blue (the wordmark dot) */
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Hoefler Text", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, system-ui, sans-serif;
  --mono: "SF Mono", ui-monospace, Menlo, monospace;
  --col: 940px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--serif); background: var(--paper); color: var(--ink);
  line-height: 1.62; font-size: 18.5px; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
.paper { max-width: var(--col); margin: 0 auto; padding: 0 28px 80px; }
a { color: var(--accent); text-decoration: none; border-bottom: 1px solid rgba(43,80,245,0.3); }
a:hover { border-bottom-color: var(--accent); }

/* brand wordmark: lowercase "blurt" + blue dot */
.brandmark { font-family: var(--sans); font-weight: 500; font-size: 30px; letter-spacing: -0.025em;
  color: var(--ink); display: inline-flex; align-items: center; gap: 9px; }
.brandmark .bdot { width: 10px; height: 10px; border-radius: 50%; background: var(--accent);
  box-shadow: inset 0 0 0 1.5px rgba(20,30,90,0.55); }

/* ---- title block ---- */
.head { text-align: center; padding: 80px 0 22px; }
.head .venue { font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.head h1 { font-size: clamp(30px, 4.6vw, 44px); line-height: 1.12; letter-spacing: -0.015em; font-weight: 700; margin: 18px auto 14px; max-width: 18ch; }
.head .authors { font-style: italic; color: var(--ink); font-size: 17px; }
.head .meta { font-family: var(--mono); font-size: 12px; color: var(--muted); margin-top: 8px; letter-spacing: 0.04em; }
.head .dl { margin-top: 26px; }

hr { border: 0; border-top: 1px solid var(--rule); margin: 28px 0; }
hr.thick { border-top: 2px solid var(--rule-strong); }

/* ---- abstract (full width, above the columns) ---- */
.abstract { font-size: 16.5px; color: #2a2820; max-width: 760px; margin: 0 auto; }
.abstract p { text-align: justify; hyphens: auto; }
.abstract .lead { font-variant: small-caps; letter-spacing: 0.06em; font-weight: 700; }

/* ---- body in two columns, like a real paper ---- */
.body { counter-reset: sec; column-count: 2; column-gap: 42px; column-rule: 1px solid var(--rule); }
.body > h2 { break-inside: avoid; break-after: avoid; }
.body > p { break-inside: auto; }
/* elements that should span both columns */
.body > table, .body > .footnotes, .body > .center { column-span: all; }
.body > table { margin-top: 22px; }
.head, .abstract, hr { column-span: all; }
.body h2 { counter-increment: sec; font-size: 21px; font-weight: 700; letter-spacing: -0.01em; margin: 34px 0 10px; }
.body h2::before { content: counter(sec) ".\00a0\00a0"; color: var(--accent); font-variant-numeric: lining-nums; }
.body p { margin: 12px 0; text-align: justify; hyphens: auto; }
.body p:first-of-type::first-letter, .firstcap::first-letter {
  float: left; font-size: 56px; line-height: 0.78; font-weight: 700; padding: 6px 9px 0 0; color: var(--ink);
}
.body .sc { font-variant: small-caps; letter-spacing: 0.04em; }
.body em { color: #2a2820; }

/* ---- table (booktabs) ---- */
table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 16px; }
caption { caption-side: top; text-align: left; font-style: italic; color: var(--muted); font-size: 14px; margin-bottom: 8px; }
caption b { font-style: normal; color: var(--ink); }
thead th { text-align: left; border-top: 2px solid var(--rule-strong); border-bottom: 1px solid var(--rule-strong); padding: 8px 8px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; }
tbody td { padding: 8px 8px; border-bottom: 1px solid var(--rule); }
tbody tr:last-child td { border-bottom: 2px solid var(--rule-strong); }
td .v { font-family: var(--mono); color: var(--accent); }

/* ---- download button (understated, paper-appropriate) ---- */
.dlbtn {
  display: inline-block; font-family: var(--mono); font-size: 14px; letter-spacing: 0.04em;
  padding: 11px 22px; border: 1.5px solid var(--rule-strong); border-radius: 3px; color: var(--ink);
  background: #fffdf6; box-shadow: 3px 3px 0 var(--rule-strong); transition: all .12s ease;
}
.dlbtn:hover { transform: translate(-1px,-1px); box-shadow: 4px 4px 0 var(--rule-strong); border-bottom-color: var(--rule-strong); }
.center { text-align: center; }
.sysline { font-family: var(--mono); font-size: 12px; color: var(--muted); margin-top: 10px; letter-spacing: 0.03em; }

.footnotes { font-size: 13.5px; color: var(--muted); border-top: 1px solid var(--rule); margin-top: 40px; padding-top: 14px; }
.footnotes p { margin: 5px 0; text-align: left; }
.footnotes .wm { font-family: var(--mono); }

@media (max-width: 560px) { body { font-size: 17px; } }