
  /* ---------- IEEE-style page ---------- */
  :root {
    --paper: #fefefe;
    --ink: #1a1a1a;
    --ink-soft: #444;
    --rule: #cfcfcf;
    --link: oklch(46% 0.13 250);
    --link-visited: oklch(40% 0.10 290);
    --figure-bg: #f6f6f4;
    --figure-stripe: #ececea;
  }

  html { background: var(--paper) }
  body {
    font-family: "STIX Two Text", "Times New Roman", Times, serif;
    font-size: 10pt;
    line-height: 1.28;
    color: var(--ink);
    background: var(--paper);
    max-width: 8.5in;
    margin: 0 auto;
    padding: 0.75in 0.6in 0.9in;
    box-shadow: 0 0 0 1px #dcdbd6, 0 8px 32px rgba(0,0,0,0.06);
    text-align: justify;
    hyphens: auto;
    -webkit-hyphens: auto;
  }

  /* ---------- Title block ---------- */
  header {
    text-align: center;
    margin-bottom: 22pt;
  }
  header > h1 {
    font-size: 22pt;
    font-weight: 500;
    line-height: 1.15;
    margin: 0 0 14pt 0;
    letter-spacing: 0.005em;
  }
  .authors {
    font-size: 11pt;
    font-weight: 500; 
    margin: 0 0 2pt 0;
  }
  .affiliation {
    font-size: 10pt;
    font-style: italic;
    color: var(--ink-soft);
    margin: 0;
    line-height: 1.35;
    text-indent: 0;
  }
  .affiliation .email {
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-style: normal;
    font-size: 8.5pt;
  }

  /* ---------- Two-column body ---------- */
  main {
    column-count: 2;
    column-gap: 0.25in;
    column-rule: none;
    text-align: justify;
  }

  /* ---------- Abstract & Index Terms ---------- */
  .abstract, .index-terms {
    font-size: 9pt;
    font-weight: 1000;
    line-height: 1.3;
    text-indent: 0;
  }
  .abstract::before {
    padding-left: 10pt;
    content: "Abstract—";
    font-weight: 700;
    font-style: normal;
  }
  .index-terms::before {
    padding-left: 10pt;
    content: "Index Terms—";
    font-weight: 700;
    font-style: italic;
  }
  .index-terms { font-style: italic; }

  /* ---------- Section headings ---------- */
  h2 {
    font-size: 10pt;
    font-weight: 400;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 14pt 0 6pt 0;
    font-variant: small-caps;
    break-after: avoid-page;
  }
  h3 {
    font-size: 10pt;
    font-weight: 400;
    font-style: italic;
    margin: 10pt 0 4pt 0;
    text-align: left;
    break-after: avoid-page;
  }

  /* ---------- Paragraphs ---------- */
  p {
    margin: 0 0 0 0;
    text-indent: 1.2em;
  }
  h2 + p, h3 + p, .abstract, .index-terms {
    text-indent: 0;
  }

  /* ---------- Lists ---------- */
  ul, ol {
    margin: 4pt 0 4pt 0;
    padding-left: 1.4em;
  }
  ul li, ol li {
    margin-bottom: 2pt;
    text-align: justify;
  }

  /* ---------- Links ---------- */
  a { color: var(--link); text-decoration: none; }
  a:hover { text-decoration: underline; }
  a:visited { color: var(--link-visited); }

  /* ---------- Figures ---------- */
  figure {
    margin: 8pt 0 8pt 0;
    break-inside: avoid;
    text-align: center;
  }
  figure svg {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--rule);
  }
  figcaption {
    line-height: 1.3;
    margin-top: 4pt;
    text-align: left;
    text-indent: 0;
    position: relative;
  }
  figcaption .label {
    font-variant: small-caps;
  }

  /* ---------- References ---------- */
  ol.references {
    list-style: none;
    counter-reset: ref;
    padding-left: 0;
    font-size: 8.5pt;
    line-height: 1.3;
  }
  ol.references li {
    counter-increment: ref;
    padding-left: 1.6em;
    text-indent: -1.6em;
    margin-bottom: 3pt;
    text-align: justify;
  }
  ol.references li::before {
    content: "[" counter(ref) "]\00a0";
    font-weight: 400;
  }

  /* ---------- Inline reference citations ---------- */
  cite.ref {
    font-style: normal;
  }

  /* ---------- Publication list ---------- */
  ol.pubs {
    list-style: none;
    counter-reset: pub;
    padding-left: 0;
    font-size: 9pt;
    line-height: 1.3;
  }
  ol.pubs li {
    counter-increment: pub;
    padding-left: 1.8em;
    text-indent: -1.8em;
    margin-bottom: 4pt;
    text-align: justify;
  }
  ol.pubs li::before {
    content: "[P" counter(pub) "]\00a0";
    font-weight: 500;
  }
  .venue { font-style: italic; }

  /* ---------- Small monospace bits ---------- */
  code, .mono {
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 0.88em;
  }

  /* ---------- Address ------------ */
  p.address {
    text-indent: 0;
    margin: 1em;
  }

  /* ---------- News list ---------- */
  dl.news {
    margin: 4pt 0;
    font-size: 9pt;
  }
  dl.news dt {
    float: left;
    clear: left;
    width: 4.2em;
    font-variant-numeric: tabular-nums;
    color: var(--ink-soft);
    font-style: italic;
  }
  dl.news dd {
    margin-left: 4.6em;
    margin-bottom: 2pt;
  }

  /* ---------- Footer ---------- */
  footer.colophon {
    margin-top: 18pt;
    padding-top: 8pt;
    border-top: 0.5pt solid var(--rule);
    font-size: 8pt;
    color: var(--ink-soft);
    text-align: center;
    column-span: all;
    font-style: italic;
  }

  canvas {
    display: block;
    width: 100%;
    height: auto;
		touch-action: none;
  }
  /* ---------- Print ---------- */
  @media print {
    html { background: white; }
    body {
      box-shadow: none;
      margin: 0;
      padding: 0.75in 0.6in;
      max-width: none;
    }
  }

  /* ---------- Small screens: collapse to one column ---------- */
  @media (max-width: 720px) {
    body { padding: 0.5in 0.4in; font-size: 11pt; }
    main.body { column-count: 1; }
    h1.paper-title { font-size: 18pt; }
  }
</style>

<style>
.cite {
  position: relative;
  color: inherit;
  text-decoration: none;
}

.cite-popup {
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%) translateY(6px);

  opacity: 0;
  pointer-events: none;
  transition: opacity .2s, transform .2s;

  padding: .4em .6em;
  border-radius: .4em;
  background: black;
  color: white;
  white-space: nowrap;
  font-size: .85em;
}

.cite:hover .cite-popup {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}