@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;700&family=IBM+Plex+Serif:wght@400;600;700&family=JetBrains+Mono:wght@500&display=swap');

    :root {
      --bg: #f6f7fb;
      --paper: #ffffff;
      --ink: #1a1b22;
      --muted: #5f6375;
      --line: #e0e4f1;
      --primary: #1f2b7b;
      --accent: #2e4de0;
      --accent-soft: #eef2ff;
      --note: #f9fbff;
      --ok: #0f766e;
      --warn: #9a3412;
      --shadow: 0 16px 42px rgba(23, 35, 74, 0.12);
      --radius: 14px;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      font-family: 'IBM Plex Serif', serif;
      color: var(--ink);
      background:
        radial-gradient(circle at 12% -8%, #dfe6ff 0%, rgba(223, 230, 255, 0) 45%),
        radial-gradient(circle at 94% 14%, #f0efff 0%, rgba(240, 239, 255, 0) 40%),
        var(--bg);
      line-height: 1.72;
    }

    .lp-top {
      all: initial;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 10px;
      width: 100%;
      padding: 9px 18px;
      background: #0b0b12;
      position: relative;
      z-index: 999999;
      border-bottom: 2px solid #caa14b;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    }

    .lp-brand {
      all: initial;
      box-sizing: border-box;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #f5f2e8;
      text-decoration: none;
      font: 800 13px/1.2 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
      letter-spacing: 0.6px;
      cursor: pointer;
    }

    .lp-dot {
      all: initial;
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #caa14b;
      box-shadow: 0 0 8px #caa14b;
    }

    .lp-wrap {
      all: initial;
      display: flex;
      align-items: center;
      gap: 12px;
      box-sizing: border-box;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    }

    .lp-meta {
      all: initial;
      color: #8b8b96;
      font: 500 11px/1.2 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    }

    .lp-link {
      all: initial;
      box-sizing: border-box;
      color: #caa14b;
      text-decoration: none;
      font: 700 11px/1.2 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
      border: 1px solid rgba(202, 161, 75, 0.55);
      padding: 5px 11px;
      border-radius: 20px;
      white-space: nowrap;
      cursor: pointer;
    }

    .shell {
      width: min(1200px, 95vw);
      margin: 22px auto 46px;
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 22px;
    }

    .toc {
      position: sticky;
      top: 14px;
      align-self: start;
      background: rgba(255, 255, 255, 0.84);
      backdrop-filter: blur(8px);
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 14px;
      box-shadow: 0 8px 24px rgba(34, 48, 98, 0.07);
      font-family: 'IBM Plex Sans', sans-serif;
    }

    .toc h2 {
      font-size: 14px;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      margin-bottom: 10px;
      color: var(--primary);
    }

    .toc ul {
      list-style: none;
      display: grid;
      gap: 6px;
    }

    .toc a {
      display: block;
      text-decoration: none;
      color: #2b3356;
      font-size: 13px;
      border-radius: 8px;
      padding: 6px 8px;
      transition: 0.2s ease;
    }

    .toc a:hover {
      background: var(--accent-soft);
      color: var(--accent);
    }

    .paper {
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: clamp(24px, 4vw, 44px);
    }

    .paper h1,
    .paper h2,
    .paper h3,
    .paper h4 {
      font-family: 'IBM Plex Sans', sans-serif;
      line-height: 1.28;
      letter-spacing: -0.01em;
    }

    .title {
      text-align: center;
      margin-bottom: 26px;
    }

    .title h1 {
      font-size: clamp(1.5rem, 4vw, 2.1rem);
      margin-bottom: 10px;
      color: #111433;
    }

    .meta {
      color: var(--muted);
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.95rem;
    }

    .abstract {
      margin: 24px 0;
      padding: 16px 18px;
      background: linear-gradient(145deg, #f8faff, #f3f6ff);
      border: 1px solid #dfe7ff;
      border-left: 4px solid var(--accent);
      border-radius: 10px;
    }

    .abstract-title {
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.95rem;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--primary);
      margin-bottom: 8px;
    }

    p {
      text-align: justify;
      margin-bottom: 13px;
      font-size: 1.02rem;
    }

    .keywords {
      font-family: 'IBM Plex Sans', sans-serif;
      color: #3c4268;
      font-size: 0.92rem;
      margin-bottom: 22px;
    }

    section {
      margin-top: 26px;
    }

    section h2 {
      font-size: 1.3rem;
      margin-bottom: 10px;
      border-bottom: 2px solid #e8ecfa;
      padding-bottom: 6px;
      color: #151b49;
    }

    section h3 {
      font-size: 1.07rem;
      margin: 16px 0 8px;
      color: #1f2b7b;
    }

    ul {
      margin: 10px 0 14px 24px;
    }

    li {
      margin-bottom: 7px;
    }

    .eq {
      margin: 15px 0;
      padding: 12px;
      border: 1px solid #e4e8f8;
      border-left: 3px solid #6a7fe8;
      border-radius: 8px;
      background: var(--note);
      text-align: center;
      overflow-x: auto;
    }

    .table-wrap {
      overflow-x: auto;
      margin: 14px 0 8px;
      border: 1px solid #e5e9fa;
      border-radius: 10px;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      min-width: 620px;
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.92rem;
    }

    th,
    td {
      border-bottom: 1px solid #edf0fb;
      padding: 10px 12px;
      vertical-align: top;
      text-align: left;
    }

    th {
      color: #161d4a;
      background: #f6f8ff;
      font-weight: 700;
    }

    .badge-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin: 14px 0;
    }

    .badge {
      border: 1px solid #dee5ff;
      background: #f7f9ff;
      border-radius: 10px;
      padding: 10px;
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.86rem;
      color: #384382;
    }

    .references {
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.93rem;
      line-height: 1.62;
    }

    .references li {
      margin-bottom: 9px;
    }

    .footer-bar {
      margin-top: 28px;
      border-top: 1px solid #e8ecfa;
      padding-top: 15px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 10px;
      font-family: 'IBM Plex Sans', sans-serif;
      font-size: 0.88rem;
      color: #62698b;
    }

    .footer-bar a {
      color: var(--accent);
      text-decoration: none;
      font-weight: 600;
    }

    @media (max-width: 980px) {
      .shell {
        grid-template-columns: 1fr;
      }

      .toc {
        position: static;
      }

      .badge-row {
        grid-template-columns: 1fr;
      }
    }
