/* ─── Reset & Variables ──────────────────────────────── */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --blue:       #0D72B5;
      --blue-dark:  #0a5a91;
      --blue-light: #e8f3fb;
      --dark:       #181818;
      --white:      #ffffff;
      --gray-50:    #f8fafc;
      --gray-100:   #f1f5f9;
      --gray-200:   #e2e8f0;
      --gray-400:   #94a3b8;
      --gray-600:   #475569;
      --gray-900:   #0f172a;
      --radius:     8px;
      --shadow:     0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06);
      --shadow-md:  0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -1px rgba(0,0,0,.06);
    }

    html { font-size: 15px; }

    body {
      font-family: 'Roboto', system-ui, Arial, sans-serif;
      background: var(--gray-100);
      color: var(--gray-900);
      min-height: 100vh;
      line-height: 1.5;
    }

    /* ─── Header ─────────────────────────────────────────── */
    header {
      background: var(--dark);
      padding: 0 2rem;
      height: 60px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      position: sticky;
      top: 0;
      z-index: 100;
      box-shadow: 0 2px 8px rgba(0,0,0,.4);
    }

    .header-left {
      display: flex;
      align-items: center;
      gap: 1rem;
    }

    .header-logo {
      height: 32px;
      width: auto;
      object-fit: contain;
    }

    .header-title {
      color: var(--white);
      font-size: 1.1rem;
      font-weight: 600;
      letter-spacing: .02em;
    }

    .header-divider {
      width: 1px;
      height: 24px;
      background: rgba(255,255,255,.2);
    }

    .header-subtitle {
      color: var(--gray-400);
      font-size: 0.85rem;
    }

    #api-settings-btn {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.15);
      color: var(--white);
      padding: .35rem .85rem;
      border-radius: var(--radius);
      font-size: .82rem;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: .4rem;
      transition: background .15s;
    }
    #api-settings-btn:hover { background: rgba(255,255,255,.15); }

    #app-lang-select {
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.15);
      color: var(--white);
      padding: .3rem .55rem;
      border-radius: var(--radius);
      font-size: .8rem;
      cursor: pointer;
      outline: none;
      transition: background .15s;
    }
    #app-lang-select:hover { background: rgba(255,255,255,.15); }
    #app-lang-select option { background: #222; color: var(--white); }

    /* ─── Layout ─────────────────────────────────────────── */
    .page {
      max-width: 1100px;
      margin: 0 auto;
      padding: 2rem 1.5rem 4rem;
    }

    /* ─── Card ───────────────────────────────────────────── */
    .card {
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      padding: 1.5rem;
      box-shadow: var(--shadow);
      margin-bottom: 1.25rem;
    }

    .card-title {
      font-size: 1rem;
      font-weight: 600;
      color: var(--gray-900);
      margin-bottom: 1.25rem;
      padding-bottom: .6rem;
      border-bottom: 2px solid var(--blue-light);
      display: flex;
      align-items: center;
      gap: .5rem;
    }

    .card-title svg { color: var(--blue); }

    /* ─── Form ───────────────────────────────────────────── */
    .form-group {
      margin-bottom: 1rem;
    }

    label {
      display: block;
      font-size: .82rem;
      font-weight: 600;
      color: var(--gray-600);
      margin-bottom: .35rem;
      text-transform: uppercase;
      letter-spacing: .04em;
    }

    input[type="text"],
    input[type="number"],
    select,
    textarea {
      width: 100%;
      padding: .55rem .75rem;
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      font-size: .92rem;
      font-family: inherit;
      color: var(--gray-900);
      background: var(--gray-50);
      transition: border-color .15s, box-shadow .15s;
      outline: none;
    }

    input[type="text"]:focus,
    input[type="number"]:focus,
    select:focus,
    textarea:focus {
      border-color: var(--blue);
      box-shadow: 0 0 0 3px rgba(13,114,181,.12);
      background: var(--white);
    }

    textarea { resize: vertical; min-height: 90px; }

    select { cursor: pointer; }

    .form-row {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 1rem;
    }

    .form-row-2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
    }

    .form-row-3 {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 1rem;
    }

    .form-row-4 {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      gap: 1rem;
    }

    /* Checkbox row */
    .checkbox-group {
      display: flex;
      flex-wrap: wrap;
      gap: .5rem .75rem;
      margin-top: .25rem;
    }

    .checkbox-label {
      display: flex;
      align-items: center;
      gap: .4rem;
      font-size: .88rem;
      font-weight: 400;
      text-transform: none;
      letter-spacing: 0;
      color: var(--gray-900);
      cursor: pointer;
    }

    .checkbox-label input[type="checkbox"] {
      width: 15px;
      height: 15px;
      cursor: pointer;
      accent-color: var(--blue);
    }

    /* Hint text */
    .hint {
      font-size: .75rem;
      color: var(--gray-400);
      margin-top: .25rem;
    }

    /* Collapsible */
    details {
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      margin-bottom: 1rem;
      overflow: hidden;
    }

    summary {
      padding: .75rem 1rem;
      font-size: .88rem;
      font-weight: 600;
      color: var(--gray-600);
      cursor: pointer;
      background: var(--gray-50);
      list-style: none;
      display: flex;
      align-items: center;
      gap: .5rem;
      user-select: none;
    }

    summary::-webkit-details-marker { display: none; }

    summary::before {
      content: '▶';
      font-size: .65rem;
      color: var(--blue);
      transition: transform .2s;
    }

    details[open] summary::before { transform: rotate(90deg); }
    details[open] summary { border-bottom: 1px solid var(--gray-200); }

    .details-body {
      padding: 1rem;
    }

    /* ─── Buttons ────────────────────────────────────────── */
    .btn {
      display: inline-flex;
      align-items: center;
      gap: .45rem;
      padding: .6rem 1.2rem;
      border-radius: var(--radius);
      font-size: .9rem;
      font-weight: 600;
      cursor: pointer;
      transition: all .15s;
      border: none;
      outline: none;
    }

    .btn-primary {
      background: var(--blue);
      color: var(--white);
    }
    .btn-primary:hover:not(:disabled) { background: var(--blue-dark); }
    .btn-primary:disabled { opacity: .5; cursor: not-allowed; }

    .btn-secondary {
      background: var(--white);
      color: var(--blue);
      border: 1px solid var(--blue);
    }
    .btn-secondary:hover { background: var(--blue-light); }

    .btn-ghost {
      background: transparent;
      color: var(--gray-600);
      border: 1px solid var(--gray-200);
    }
    .btn-ghost:hover { background: var(--gray-100); }

    .btn-danger {
      background: transparent;
      color: #dc2626;
      border: 1px solid #fca5a5;
      padding: .3rem .6rem;
      font-size: .78rem;
    }
    .btn-danger:hover { background: #fef2f2; }

    .btn-large {
      padding: .75rem 2rem;
      font-size: 1rem;
      width: 100%;
      justify-content: center;
    }

    /* ─── Status ─────────────────────────────────────────── */
    #status-section { display: none; }

    .status-header {
      display: flex;
      align-items: center;
      gap: .75rem;
      margin-bottom: 1rem;
    }

    .spinner {
      width: 20px;
      height: 20px;
      border: 2.5px solid var(--blue-light);
      border-top-color: var(--blue);
      border-radius: 50%;
      animation: spin .7s linear infinite;
      flex-shrink: 0;
    }

    @keyframes spin { to { transform: rotate(360deg); } }

    .status-label {
      font-weight: 600;
      color: var(--blue);
      font-size: .95rem;
    }

    .progress-bar-wrap {
      background: var(--gray-100);
      border-radius: 99px;
      height: 6px;
      overflow: hidden;
    }

    .progress-bar {
      height: 100%;
      background: linear-gradient(90deg, var(--blue), #38bdf8);
      border-radius: 99px;
      width: 0%;
      transition: width .5s ease;
      animation: pulse-bar 2s ease-in-out infinite;
    }

    @keyframes pulse-bar {
      0%, 100% { opacity: 1; }
      50% { opacity: .7; }
    }

    .stage-list {
      margin-top: 1rem;
      display: flex;
      flex-direction: column;
      gap: .4rem;
    }

    .stage-item {
      display: flex;
      align-items: center;
      gap: .6rem;
      font-size: .83rem;
      color: var(--gray-400);
    }

    .stage-item.done { color: var(--gray-600); }
    .stage-item.active { color: var(--blue); font-weight: 600; }

    .stage-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: var(--gray-200);
      flex-shrink: 0;
    }
    .stage-item.done .stage-dot { background: #22c55e; }
    .stage-item.active .stage-dot {
      background: var(--blue);
      animation: pulse-dot 1s ease-in-out infinite;
    }

    @keyframes pulse-dot {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.4); }
    }

    /* ─── Plan Review Section ───────────────────────────── */
    #plan-hil-section { display: none; }

    .plan-reasoning-box {
      background: var(--blue-light);
      border: 1px solid #bfdbfe;
      border-radius: var(--radius);
      padding: .75rem 1rem;
      margin-bottom: 1rem;
      font-size: .88rem;
      color: var(--gray-900);
      line-height: 1.55;
    }

    .plan-section-card {
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      padding: 1rem;
      margin-bottom: .75rem;
      background: var(--gray-50);
    }

    .plan-section-card details {
      border: none;
      border-radius: 4px;
      margin-bottom: 0;
      margin-top: .5rem;
      overflow: visible;
    }

    .plan-section-card details summary {
      padding: .3rem .5rem;
      font-size: .78rem;
      font-weight: 600;
      color: var(--gray-600);
      background: transparent;
      border: none;
      border-radius: 4px;
    }

    .plan-section-card details[open] summary {
      border-bottom: none;
    }

    .plan-section-card details .details-body {
      padding: .4rem .5rem .1rem;
    }

    .subquery-pill {
      display: inline-block;
      padding: .2rem .55rem;
      background: var(--white);
      border: 1px solid var(--gray-200);
      border-radius: 99px;
      font-size: .75rem;
      color: var(--gray-600);
      line-height: 1.5;
    }

    .writer-instructions-box {
      font-size: .82rem;
      color: var(--gray-600);
      padding: .4rem .6rem;
      background: #f0fdf4;
      border: 1px solid #86efac;
      border-radius: 4px;
      margin-top: .4rem;
    }

    .writer-instructions-box strong { color: #166534; }


    /* ─── HIL Section ────────────────────────────────────── */
    #hil-section { display: none; }

    .hil-banner {
      background: #fef3c7;
      border: 1px solid #fbbf24;
      border-radius: var(--radius);
      padding: .75rem 1rem;
      margin-bottom: 1.25rem;
      font-size: .88rem;
      color: #92400e;
      display: flex;
      gap: .5rem;
    }

    .query-list {
      display: flex;
      flex-direction: column;
      gap: .5rem;
      margin-bottom: 1rem;
    }

    .query-item {
      display: flex;
      align-items: center;
      gap: .5rem;
    }

    .query-item input[type="text"] {
      flex: 1;
    }

    .hil-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-top: .75rem;
      border-top: 1px solid var(--gray-200);
    }

    /* ─── Results ────────────────────────────────────────── */
    #results-section { display: none; }

    .results-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 1.25rem;
      padding-bottom: .75rem;
      border-bottom: 2px solid var(--blue-light);
    }

    .results-title {
      font-size: 1.1rem;
      font-weight: 700;
      color: var(--gray-900);
      display: flex;
      align-items: center;
      gap: .5rem;
    }

    .cost-badge {
      display: inline-flex;
      align-items: center;
      gap: .3rem;
      background: var(--gray-100);
      border: 1px solid var(--gray-200);
      border-radius: 99px;
      padding: .2rem .65rem;
      font-size: .77rem;
      color: var(--gray-600);
      font-weight: 500;
    }

    .results-meta {
      margin-bottom: 1.25rem;
    }
    .results-report-title {
      font-size: 1.55rem;
      font-weight: 700;
      color: var(--gray-900);
      line-height: 1.25;
    }

    /* Markdown content */
    .md-body {
      line-height: 1.7;
      color: var(--gray-900);
    }

    .md-body h1 { font-size: 1.7rem; margin: 0 0 1rem; }
    .md-body h2 { font-size: 1.35rem; color: var(--blue); margin: 2rem 0 .75rem; padding-bottom: .35rem; border-bottom: 1px solid var(--blue-light); }
    .md-body h3 { font-size: 1.1rem; color: var(--blue); margin: 1.5rem 0 .5rem; }
    .md-body h4 { font-size: 1rem; color: var(--blue); font-style: italic; margin: 1.25rem 0 .4rem; }
    .md-body p { margin-bottom: .9rem; text-align: justify; }
    .md-body ul, .md-body ol { margin: .5rem 0 .9rem 1.4rem; }
    .md-body li { margin-bottom: .4rem; }
    .md-body table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
    .md-body th { background: var(--blue); color: white; padding: .5rem .75rem; text-align: left; font-size: .88rem; }
    .md-body td { padding: .5rem .75rem; border-bottom: 1px solid var(--gray-200); font-size: .9rem; }
    .md-body tr:nth-child(even) td { background: var(--gray-50); }
    .md-body strong { color: var(--gray-900); }
    .md-body blockquote { border-left: 3px solid var(--blue); padding-left: .9rem; color: var(--gray-600); margin: 1rem 0; font-style: italic; }
    .md-body code { background: var(--gray-100); padding: .1rem .35rem; border-radius: 4px; font-size: .85em; }
    .md-body pre { background: var(--gray-100); padding: 1rem; border-radius: var(--radius); overflow-x: auto; margin: 1rem 0; }
    .md-body pre code { background: none; padding: 0; }
    .md-body hr { border: none; border-top: 1px solid var(--gray-200); margin: 1.5rem 0; }

    /* Citation links */
    .cite-link {
      font-size: .72em;
      vertical-align: super;
      line-height: 1;
      color: var(--blue);
      text-decoration: none;
      font-weight: 600;
      padding: 0 .1rem;
    }
    .cite-link:hover { text-decoration: underline; }

    /* References */
    .references-section {
      margin-top: 2rem;
      padding-top: 1.25rem;
      border-top: 1px solid var(--gray-200);
    }

    .references-title {
      font-size: .88rem;
      font-weight: 700;
      color: var(--gray-600);
      text-transform: uppercase;
      letter-spacing: .05em;
      margin-bottom: .75rem;
    }

    .ref-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: .5rem;
    }

    .ref-item {
      display: flex;
      gap: .6rem;
      font-size: .82rem;
      line-height: 1.45;
    }

    .ref-num {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      background: var(--blue-light);
      color: var(--blue);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: .72rem;
      font-weight: 700;
      margin-top: .1rem;
    }

    .ref-title { font-weight: 600; color: var(--gray-900); }
    .ref-url { color: var(--blue); word-break: break-all; }
    .ref-url:hover { text-decoration: underline; }
    .ref-date { color: var(--gray-400); font-size: .77rem; }

    /* ─── Alert / Error ──────────────────────────────────── */
    .alert {
      padding: .75rem 1rem;
      border-radius: var(--radius);
      font-size: .88rem;
      margin-bottom: 1rem;
    }

    .alert-error {
      background: #fef2f2;
      border: 1px solid #fca5a5;
      color: #991b1b;
    }

    .alert-success {
      background: #f0fdf4;
      border: 1px solid #86efac;
      color: #166534;
    }

    /* ─── Modal ──────────────────────────────────────────── */
    .modal-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,.5);
      z-index: 200;
      align-items: center;
      justify-content: center;
    }

    .modal-overlay.open { display: flex; }

    .modal-box {
      background: var(--white);
      border-radius: var(--radius);
      padding: 1.5rem;
      width: 420px;
      max-width: 90vw;
      box-shadow: var(--shadow-md);
    }

    .modal-title {
      font-size: 1rem;
      font-weight: 700;
      margin-bottom: 1rem;
    }

    .modal-actions {
      display: flex;
      justify-content: flex-end;
      gap: .5rem;
      margin-top: 1.25rem;
    }

    /* ─── Print / PDF ─────────────────────────────────────── */
    @media print {
      header, #form-section, #api-settings-btn,
      #status-section, #hil-section,
      .results-header .btn,
      .results-meta .cost-badge,
      .modal-overlay { display: none !important; }

      body { background: white; font-size: 12pt; }
      .page { max-width: 100%; padding: 0; }
      .card { box-shadow: none; border: none; padding: 0; }
      #results-section { display: block !important; }

      .md-body h2 { color: #0D72B5; border-bottom: 1px solid #0D72B5; }
      .md-body h3 { color: #0D72B5; }
      .md-body h4 { color: #0D72B5; }

      .ref-num { background: #e8f3fb; color: #0D72B5; }

      @page {
        size: A4;
        margin: 20mm 15mm;
        @bottom-left { content: "Atrineo AG"; font-size: 10pt; color: #0D72B5; }
        @bottom-right { content: "Page " counter(page); font-size: 10pt; }
      }
    }

    /* ─── Responsive ─────────────────────────────────────── */
    @media (max-width: 640px) {
      .form-row, .form-row-2, .form-row-3, .form-row-4 { grid-template-columns: 1fr; }
      header { padding: 0 1rem; }
      .page { padding: 1rem 1rem 3rem; }
    }

    /* ─── Tabs ──────────────────────────────────────────────── */
    .tab-nav {
      display: flex;
      margin-bottom: 1.5rem;
      border-bottom: 2px solid var(--gray-200);
    }

    .tab-btn {
      background: none;
      border: none;
      border-bottom: 2px solid transparent;
      margin-bottom: -2px;
      padding: .65rem 1.4rem;
      font-size: .92rem;
      font-weight: 600;
      color: var(--gray-600);
      cursor: pointer;
      transition: color .15s, border-color .15s;
      outline: none;
    }
    .tab-btn:hover { color: var(--blue); }
    .tab-btn.active { color: var(--blue); border-bottom-color: var(--blue); }

    /* ─── Publication cards ──────────────────────────────────── */
    .pub-card {
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      padding: 1rem 1.25rem;
      margin-bottom: .75rem;
      background: var(--gray-50);
      transition: border-color .15s, box-shadow .15s;
    }
    .pub-card:hover { border-color: #bfdbfe; box-shadow: var(--shadow); }

    .pub-card-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: .75rem;
      margin-bottom: .4rem;
    }
    .pub-title {
      font-size: .95rem;
      font-weight: 600;
      color: var(--gray-900);
      line-height: 1.4;
      flex: 1;
    }
    .pub-meta { font-size: .78rem; color: var(--gray-600); margin-bottom: .4rem; }
    .pub-abstract {
      font-size: .82rem;
      color: var(--gray-600);
      line-height: 1.55;
      margin-bottom: .45rem;
    }
    .pub-keywords { font-size: .74rem; color: var(--blue); margin-bottom: .45rem; }
    .pub-links { display: flex; gap: .4rem; }
    .pub-link {
      display: inline-block;
      padding: .18rem .55rem;
      border-radius: 99px;
      border: 1px solid var(--gray-200);
      background: var(--white);
      color: var(--blue);
      font-size: .74rem;
      font-weight: 600;
      text-decoration: none;
    }
    .pub-link:hover { background: var(--blue-light); }
    .pub-link-oa { border-color: #86efac; color: #166534; background: #f0fdf4; }
    .pub-link-oa:hover { background: #dcfce7; }
    .pub-summary-md p { margin: 0 0 .65em; }
    .pub-summary-md p:last-child { margin-bottom: 0; }
    .pub-summary-md ul, .pub-summary-md ol { margin: .3em 0 .65em 1.2em; }
    .pub-summary-md em { font-style: italic; }
    .pub-summary-md h1 { font-size:1.3rem; font-weight:700; margin:2.5rem 0 .75rem; }
    .pub-summary-md h2 { font-size:1.15rem; font-weight:700; margin:2.5rem 0 .65rem; padding-top:1.25rem; border-top:2px solid #e5e7eb; }
    .pub-summary-md h3 { font-size:1rem; font-weight:700; margin:2rem 0 .55rem; padding-top:.75rem; border-top:1px solid #eee; }
    .pub-summary-md h4 { font-size:.93rem; font-weight:600; margin:1.5rem 0 .4rem; }
    .pub-summary-md h5 { font-size:.88rem; font-weight:600; margin:1.1rem 0 .35rem; color:var(--gray-600); }
    .pub-summary-md table { border-collapse:collapse; width:100%; margin:.75rem 0; font-size:.85rem; }
    .pub-summary-md table th { background:#f8f9fa; border:1px solid #dee2e6; padding:6px 10px; font-weight:600; text-align:left; }
    .pub-summary-md table td { border:1px solid #dee2e6; padding:6px 10px; vertical-align:top; }

    /* ─── Publication HIL selection ──────────────────────────── */
    .pub-hil-section-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: .6rem 0 .5rem;
      border-bottom: 1px solid var(--gray-200);
      margin-bottom: .75rem;
    }
    .pub-hil-section-title {
      font-weight: 700;
      font-size: .9rem;
      color: var(--gray-900);
      display: flex;
      align-items: center;
      gap: .4rem;
    }
    .pub-hil-monitor-details {
      margin-top: 1rem;
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      overflow: hidden;
    }
    .pub-hil-monitor-details > summary {
      padding: .65rem .9rem;
      cursor: pointer;
      font-weight: 600;
      font-size: .87rem;
      color: var(--gray-600);
      background: var(--gray-50);
      list-style: none;
      display: flex;
      align-items: center;
      gap: .4rem;
      user-select: none;
    }
    .pub-hil-monitor-details > summary::-webkit-details-marker { display: none; }
    .pub-hil-monitor-details > summary::before {
      content: '▶';
      font-size: .65rem;
      color: var(--gray-400);
      transition: transform .15s;
    }
    .pub-hil-monitor-details[open] > summary::before { transform: rotate(90deg); }
    .pub-hil-monitor-details .details-body { padding: .75rem; }
    .pub-sel-card {
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      margin-bottom: .5rem;
      transition: border-color .15s, box-shadow .15s;
      background: var(--white);
    }
    .pub-sel-card:has(.pub-sel-cb:checked) {
      border-color: var(--blue);
      background: #f0f7ff;
    }
    .pub-sel-label {
      display: flex;
      align-items: flex-start;
      gap: .75rem;
      padding: .75rem;
      cursor: pointer;
    }
    .pub-sel-cb {
      margin-top: .2rem;
      flex-shrink: 0;
      width: 16px;
      height: 16px;
      accent-color: var(--blue);
      cursor: pointer;
    }
    .pub-sel-body { flex: 1; min-width: 0; }
    .pub-sel-header {
      display: flex;
      align-items: baseline;
      gap: .5rem;
      flex-wrap: wrap;
      margin-bottom: .25rem;
    }
    .pub-sel-score {
      font-size: .75rem;
      font-weight: 700;
      color: var(--white);
      background: var(--blue);
      border-radius: 99px;
      padding: .1rem .45rem;
      flex-shrink: 0;
    }
    .pub-sel-title {
      font-weight: 600;
      font-size: .88rem;
      color: var(--gray-900);
      flex: 1;
    }
    .pub-sel-reason {
      font-size: .8rem;
      color: var(--gray-600);
      font-style: italic;
      margin-top: .25rem;
      line-height: 1.45;
    }
    #pub-hil-selected-badge {
      background: var(--blue);
      color: var(--white);
      font-size: .78rem;
      font-weight: 700;
      padding: .15rem .5rem;
      border-radius: 99px;
      min-width: 1.6rem;
      text-align: center;
    }

    /* ─── Full-text unobtainable HIL ─────────────────────────── */
    .pub-fulltext-card {
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      padding: .85rem;
      margin-bottom: .75rem;
      background: var(--white);
    }
    .pub-fulltext-card-header {
      display: flex;
      align-items: baseline;
      gap: .5rem;
      flex-wrap: wrap;
      margin-bottom: .3rem;
    }
    .pub-fulltext-textarea {
      width: 100%;
      min-height: 90px;
      margin-top: .5rem;
      border: 1px solid var(--gray-300);
      border-radius: var(--radius);
      padding: .5rem .6rem;
      font-size: .82rem;
      font-family: inherit;
      color: var(--gray-800);
      resize: vertical;
      box-sizing: border-box;
    }
    .pub-fulltext-textarea:focus {
      outline: none;
      border-color: var(--blue);
      box-shadow: 0 0 0 2px var(--blue-light);
    }
    .pub-fulltext-textarea-label {
      font-size: .78rem;
      font-weight: 600;
      color: var(--gray-500);
      margin-top: .5rem;
      display: block;
    }

    /* ─── Misc ───────────────────────────────────────────── */
    .hidden { display: none !important; }

    .tag {
      display: inline-flex;
      align-items: center;
      padding: .15rem .5rem;
      border-radius: 99px;
      font-size: .75rem;
      font-weight: 600;
    }
    .tag-blue { background: var(--blue-light); color: var(--blue); }
    .tag-green { background: #f0fdf4; color: #166534; border: 1px solid #86efac; }

    .icon { width: 16px; height: 16px; display: inline-block; vertical-align: middle; }

    /* ─── Profile Review Form ────────────────────────────────── */
    .pf-section {
      margin-bottom: 1.5rem;
    }
    .pf-section-header {
      display: flex;
      align-items: flex-start;
      gap: .75rem;
      margin-bottom: .75rem;
      padding-bottom: .5rem;
      border-bottom: 1px solid var(--gray-200);
    }
    .pf-section-icon {
      width: 28px;
      height: 28px;
      border-radius: 6px;
      background: var(--blue-light);
      color: var(--blue);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin-top: 1px;
    }
    .pf-section-title {
      font-size: .9rem;
      font-weight: 700;
      color: var(--gray-900);
      line-height: 1.2;
    }
    .pf-section-desc {
      font-size: .78rem;
      color: var(--gray-600);
      margin-top: .2rem;
      line-height: 1.45;
    }
    .pf-feature-row {
      display: grid;
      grid-template-columns: 44px 1fr;
      gap: .5rem;
      align-items: start;
      margin-bottom: .5rem;
    }
    .pf-feature-id {
      background: var(--blue-light);
      color: var(--blue);
      font-size: .75rem;
      font-weight: 700;
      border-radius: 6px;
      height: 36px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      letter-spacing: .03em;
    }
    .pf-feature-row textarea {
      font-size: .85rem;
      padding: .4rem .6rem;
      line-height: 1.4;
      min-height: 36px;
      resize: vertical;
    }
    .pf-list-textarea {
      font-size: .83rem;
      line-height: 1.6;
      resize: vertical;
    }
    .pf-collapsible {
      margin-top: .5rem;
      border: 1px solid var(--gray-200);
      border-radius: var(--radius);
      overflow: hidden;
    }
    .pf-collapsible summary {
      padding: .6rem .85rem;
      font-size: .82rem;
      font-weight: 600;
      color: var(--gray-600);
      cursor: pointer;
      background: var(--gray-50);
      user-select: none;
      list-style: none;
      display: flex;
      align-items: center;
      gap: .4rem;
    }
    .pf-collapsible summary::before {
      content: '›';
      font-size: 1rem;
      transition: transform .15s;
      display: inline-block;
    }
    .pf-collapsible[open] summary::before { transform: rotate(90deg); }
    .pf-collapsible-body {
      padding: .85rem;
      border-top: 1px solid var(--gray-200);
    }
    .pf-diff-card {
      background: var(--gray-50);
      border: 1px solid var(--gray-200);
      border-radius: 6px;
      padding: .65rem .8rem;
      margin-bottom: .6rem;
      font-size: .82rem;
    }
    .pf-diff-id {
      font-weight: 700;
      color: var(--blue);
      font-size: .75rem;
      margin-bottom: .3rem;
    }
    .pf-diff-label {
      font-size: .72rem;
      font-weight: 600;
      color: var(--gray-600);
      text-transform: uppercase;
      letter-spacing: .04em;
      margin-top: .4rem;
      margin-bottom: .15rem;
    }
  /* ── Patent Search GUI ───────────────────────────────────── */
  .pat-qb-wrap { border:1px solid var(--gray-200); border-radius:10px; overflow:hidden; }
  .pat-qb-header { background:var(--gray-50); padding:.6rem 1rem; font-weight:600; font-size:.84rem; color:var(--gray-700); border-bottom:1px solid var(--gray-200); display:flex; align-items:center; gap:.5rem; }
  .pat-query-textarea { width:100%; min-height:72px; resize:vertical; font-family:monospace; font-size:.84rem; padding:.5rem .75rem; border:1.5px solid var(--gray-300); border-radius:6px; background:#fff; color:var(--gray-900); line-height:1.5; }
  .pat-query-textarea:focus { border-color:var(--blue); outline:none; box-shadow:0 0 0 3px rgba(13,114,181,.12); }
  .pat-op-row { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; align-items:center; }
  .pat-op-btn { padding:.28rem .65rem; font-size:.79rem; font-weight:600; border:1.5px solid var(--gray-300); border-radius:5px; background:#fff; cursor:pointer; color:var(--gray-700); transition:all .15s; white-space:nowrap; }
  .pat-op-btn:hover { background:var(--blue); color:#fff; border-color:var(--blue); }
  .pat-op-btn.op-and  { border-color:#16a34a; color:#16a34a; }
  .pat-op-btn.op-and:hover  { background:#16a34a; color:#fff; }
  .pat-op-btn.op-or   { border-color:#2563eb; color:#2563eb; }
  .pat-op-btn.op-or:hover   { background:#2563eb; color:#fff; }
  .pat-op-btn.op-not  { border-color:#dc2626; color:#dc2626; }
  .pat-op-btn.op-not:hover  { background:#dc2626; color:#fff; }
  .pat-op-btn.op-prox { border-color:#7c3aed; color:#7c3aed; }
  .pat-op-btn.op-prox:hover { background:#7c3aed; color:#fff; }
  .pat-op-btn.op-field { border-color:var(--gray-400); color:var(--gray-600); font-weight:500; font-size:.76rem; }
  .pat-prox-n { width:64px; font-size:.8rem; border:1.5px solid var(--gray-300); border-radius:4px; padding:.18rem .35rem; text-align:center; }
  .pat-field-select { font-size:.8rem; border:1.5px solid var(--gray-300); border-radius:5px; padding:.28rem .5rem; background:#fff; cursor:pointer; }
  .pat-search-filters { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.6rem; align-items:center; }
  .pat-filter-input { font-size:.8rem; border:1.5px solid var(--gray-300); border-radius:5px; padding:.28rem .55rem; width:90px; background:#fff; }
  .pat-filter-input.wide { width:140px; }
  .pat-search-btn { padding:.45rem 1.2rem; font-size:.84rem; font-weight:600; }

  .pat-results-wrap { margin-top:1rem; }
  .pat-results-header { display:flex; align-items:center; justify-content:space-between; padding:.5rem .75rem; background:var(--gray-50); border:1px solid var(--gray-200); border-radius:8px 8px 0 0; font-size:.83rem; font-weight:600; }
  .pat-result-card { border:1px solid var(--gray-200); border-top:none; padding:.7rem .85rem; background:#fff; display:flex; gap:.75rem; align-items:flex-start; transition:background .12s; }
  .pat-result-card:last-child { border-radius:0 0 8px 8px; }
  .pat-result-card:hover { background:var(--gray-50); }
  .pat-result-body { flex:1; min-width:0; }
  .pat-result-id { font-size:.74rem; font-weight:700; color:var(--blue); font-family:monospace; white-space:nowrap; }
  .pat-result-title { font-size:.86rem; font-weight:600; color:var(--gray-900); line-height:1.35; margin:.1rem 0; }
  .pat-result-meta { font-size:.76rem; color:var(--gray-500); margin:.1rem 0; }
  .pat-result-abstract { font-size:.80rem; color:var(--gray-600); line-height:1.45; margin-top:.25rem; }
  .pat-add-btn { flex-shrink:0; padding:.3rem .65rem; font-size:.78rem; font-weight:600; border:1.5px solid var(--blue); border-radius:5px; background:#fff; color:var(--blue); cursor:pointer; transition:all .15s; white-space:nowrap; }
  .pat-add-btn:hover { background:var(--blue); color:#fff; }
  .pat-add-btn.added { background:var(--blue); color:#fff; border-color:var(--blue); opacity:.6; cursor:default; }

  .pub-results-list > .pat-result-card:first-child { border-top:1px solid var(--gray-200); border-radius:8px 8px 0 0; }
  .pub-result-graph-links { display:flex; gap:.5rem; margin-top:.3rem; }
  .pub-result-graph-links a { font-size:.73rem; color:var(--blue); text-decoration:none; }
  .pub-result-graph-links a:hover { text-decoration:underline; }

  .pat-queue-wrap { margin-top:1rem; border:2px solid var(--blue-light); border-radius:10px; overflow:hidden; }
  .pat-queue-header { background:var(--blue-light); padding:.55rem 1rem; display:flex; align-items:center; justify-content:space-between; }
  .pat-queue-header-left { font-weight:700; font-size:.86rem; color:var(--blue); display:flex; align-items:center; gap:.5rem; }
  .pat-queue-badge { background:var(--blue); color:#fff; border-radius:20px; padding:.05rem .55rem; font-size:.78rem; font-weight:700; }
  .pat-queue-list { max-height:260px; overflow-y:auto; }
  .pat-queue-item { display:flex; align-items:center; gap:.6rem; padding:.5rem .85rem; border-bottom:1px solid var(--gray-100); font-size:.82rem; }
  .pat-queue-item:last-child { border-bottom:none; }
  .pat-queue-item-id { font-family:monospace; font-size:.75rem; font-weight:700; color:var(--blue); flex-shrink:0; }
  .pat-queue-item-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--gray-800); }
  .pat-queue-remove { flex-shrink:0; background:none; border:none; cursor:pointer; color:var(--gray-400); font-size:1rem; padding:0 .2rem; line-height:1; }
  .pat-queue-remove:hover { color:#dc2626; }
  .pat-queue-empty { padding:1rem; text-align:center; color:var(--gray-400); font-size:.83rem; }
  .pat-queue-actions { padding:.65rem 1rem; display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--gray-200); background:#fff; }
  .pat-history-btn { font-size:.78rem; }