/* Hallprint LAB — Science page (science.js): the case picker, the engine switch, the fields and the keys on the left,
   the paper on the right, in the language of styles.css — two plates on the 940 × 504 page, numbered section titles
   (01 CASES, 02 ENGINE, 03 OUTPUT, 04 PAPER), uppercase tracked mono labels, inset dark fields, square keys, hairline
   frames with corner ticks. The preview is a white sheet with print typography (Helvetica 12 px on 1.4, 28 px margins)
   and its own light scrollbar: the one place of the interface that is not the instrument panel, on purpose. */

/* ------------------------------------------------------------------ the side plate: cases, engine, fields, keys, output */
.sci-side {
  position: absolute; left: 0; top: 0; width: 250px; height: 504px;
  padding: 10px 14px; display: flex; flex-direction: column;
}
.sci-side > .section-title { flex: 0 0 auto; margin: 0 0 5px; }
.sci-side > .section-title + .sci-list { margin-top: 1px; }
.sci-count { font-weight: 400; font-size: 9.5px; letter-spacing: 0.08em; color: var(--text-dim); }

/* the picker: a list with real checkboxes and a kind tag, as on the Compare page */
.sci-list {
  position: relative; flex: 1 1 auto; min-height: 78px;
  overflow-x: hidden; overflow-y: auto; padding: 3px 0;
  background: var(--field); box-shadow: var(--readout-shadow);
  scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent;
}
.sci-list::-webkit-scrollbar { width: 8px; }
.sci-list::-webkit-scrollbar-track { background: transparent; }
.sci-list::-webkit-scrollbar-thumb { background: var(--line-strong); border: 2px solid var(--field); }
.sci-list::-webkit-scrollbar-thumb:hover { background: var(--tick); }
.sci-item { position: relative; height: 34px; padding: 0 8px; gap: 7px; }     /* on top of .check (styles.css), the Compare register */
.sci-item:hover { background: rgba(var(--accent-rgb), 0.06); }
.sci-item.is-disabled:hover { background: none; }
.sci-item .box { flex: 0 0 12px; width: 12px; height: 12px; }
.sci-item input:checked + .box::after { left: 0; top: 0; }
.sci-name { flex: 1 1 auto; min-width: 0; font: 400 10.5px/26px var(--font-mono); letter-spacing: 0.01em; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sci-tag {
  flex: 0 0 auto; height: 14px; line-height: 14px; padding: 0 4px 0 calc(4px + 0.1em); box-sizing: border-box;
  border: 1px solid var(--line-strong);
  font: 500 8.5px/12px var(--font-label); letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-dim);
}
.sci-tag.is-virtual { border-color: var(--accent-dark); color: var(--accent); }
.sci-tag.is-etude { border-color: rgba(var(--amber-rgb), 0.55); color: var(--amber); }
.sci-empty-list { margin: 8px; font-family: var(--font-body); font-size: 11px; line-height: 1.45; color: var(--text-dim); }

/* the engine: a two-position mode key (BUILT-IN | LOCAL AI) and the read-out under it — the local server and its model
   ("Ollama · llama3.1:8b"), in amber while no model is chosen */
.sci-side > .section-title ~ .section-title { margin-top: 8px; }
.sci-engine { display: flex; width: 100%; box-sizing: border-box; flex: 0 0 auto; }
.sci-engine .segment { flex: 1 1 0; min-width: 0; height: 24px; padding: 0 2px 0 calc(2px + 0.1em); font-size: 9.5px; letter-spacing: 0.12em; overflow: hidden; text-overflow: ellipsis; }
.sci-engine .segment:disabled { opacity: 0.4; cursor: default; }
.sci-engine .segment:disabled:not([aria-checked="true"]):hover { background: var(--field); color: var(--btn-text); }   /* the lit key keeps its fill while a paper is written */
.sci-engine-hint {
  flex: 0 0 auto; height: 13px; margin: 3px 0 0; line-height: 13px;
  font: 400 9.5px/13px var(--font-mono); letter-spacing: 0.02em; color: var(--text);   /* no uppercase: a model id reads as typed */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sci-engine-hint.is-dim { color: rgba(var(--text-dim-rgb), 0.85); }
.sci-engine-hint.is-amber { color: var(--amber); }

/* the fields: label left (78 px, as .d-row: AFFILIATION needs 71), an inset dark well right — the well itself is the
   shared field register of styles.css (.page-science input[type="text"] sits in its selector lists), not a copy */
.sci-fields { flex: 0 0 auto; margin-top: 6px; }
.sci-row { display: grid; grid-template-columns: 78px minmax(0, 1fr); column-gap: 6px; align-items: center; height: 25px; cursor: default; }
.sci-row > span {
  font-family: var(--font-label); font-weight: 500; text-transform: uppercase;
  font-size: 9.5px; letter-spacing: 0.08em; color: var(--text-dim);
  white-space: nowrap; overflow: hidden;
}

/* the keys: one register, 26 px, shared with the Design page (styles.css .page-design .btn, .page-science .btn) */
.sci-run { display: flex; gap: 6px; margin-top: 8px; flex: 0 0 auto; }
.sci-write { flex: 1 1 auto; min-width: 0; }
.sci-cancel { flex: 0 0 72px; }
.sci-cancel:hover { border-color: var(--alert); color: var(--alert); box-shadow: 0 0 0 1px rgba(var(--alert-rgb), 0.22), 0 0 10px rgba(var(--alert-rgb), 0.16); }

/* the status line: two lines of mono, amber while busy, red on an error (the footer repeats it) */
.sci-status {
  flex: 0 0 auto; height: 28px; margin: 5px 0 0;
  font-family: var(--font-mono); font-size: 10px; line-height: 14px; letter-spacing: 0.01em; color: var(--text-dim);
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere;
}
.sci-status.is-busy { color: var(--amber); }
.sci-status.is-error { color: var(--alert); }
.sci-status.is-error::before { content: "[ERR] "; }

/* the output: EXPORT PDF across, COPY TEXT and SAVE .MD beneath */
.sci-output { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; flex: 0 0 auto; }
.sci-pdf { grid-column: 1 / -1; }

/* science.js could not be loaded (ui.js initScience): the reason, in the empty section */
.sci-load-error { margin: 20px; font-family: var(--font-mono); font-size: 10.5px; line-height: 1.5; color: var(--alert); }

/* ------------------------------------------------------------------ the paper plate: a white sheet in the dark frame */
.sci-main { position: absolute; left: 260px; top: 0; width: 680px; height: 504px; padding: 10px; display: flex; flex-direction: column; }
.sci-head { position: relative; flex: 0 0 auto; height: 22px; margin: 0 0 6px; }
.sci-head > .section-title { margin: 0; }
/* the badge sits on the right end of the title's rule: pages and words once the paper is laid out, and who wrote an online one */
.sci-badge {
  position: absolute; right: 0; top: 1px; z-index: 1; max-width: 500px; box-sizing: border-box;
  height: 20px; padding: 0 8px; line-height: 20px;
  font: 400 10px/20px var(--font-mono); letter-spacing: 0.02em; color: var(--text);
  background: var(--field); box-shadow: var(--readout-shadow);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sci-badge:empty { display: none; }

.sci-sheet {
  flex: 1 1 auto; min-height: 0; box-sizing: border-box;
  overflow-x: hidden; overflow-y: auto; padding: 28px;
  background: #FFFFFF; color: #111111;
  border: 1px solid var(--line-strong);
  font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1.4;
  font-feature-settings: normal; font-variant-numeric: normal;
  user-select: text; -webkit-user-select: text; cursor: auto;
  scrollbar-width: thin; scrollbar-color: #C4CBD3 #FFFFFF;
  color-scheme: light;
}
.sci-sheet:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }   /* the sheet is in the Tab order (science.js): the ring of the keys */
.sci-sheet::-webkit-scrollbar { width: 9px; }
.sci-sheet::-webkit-scrollbar-track { background: #FFFFFF; }
.sci-sheet::-webkit-scrollbar-thumb { background: #C4CBD3; border: 2px solid #FFFFFF; }
.sci-sheet::-webkit-scrollbar-thumb:hover { background: #8A939F; }
.sci-sheet ::selection { background: rgba(14, 111, 148, 0.25); color: #111111; }
.sci-empty {
  margin: 0; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 0 60px; box-sizing: border-box;
  font-family: var(--font-mono); font-size: 11px; line-height: 1.6; letter-spacing: 0.02em; color: #8A939F;
}

/* the paper: print typography — the same hierarchy as the PDF of paperdoc.js */
.sci-paper { margin: 0; }
.sci-paper .sci-title { margin: 0 0 6px; font-size: 18px; font-weight: bold; line-height: 1.25; text-align: center; letter-spacing: 0; text-transform: none; }
.sci-paper .sci-subtitle { margin: 0 0 8px; font-size: 13px; font-style: italic; text-align: center; }
.sci-paper .sci-authors { margin: 0 0 2px; font-size: 12px; text-align: center; }
.sci-paper .sci-byline { margin: 0 0 8px; font-size: 10px; color: #555555; text-align: center; }
.sci-paper .sci-keywords { margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid #999999; font-size: 10px; font-style: italic; }
.sci-paper .sci-keywords strong { font-weight: bold; }
.sci-paper .sci-heading {
  display: block; margin: 14px 0 6px; font-family: inherit; font-size: 13px; font-weight: bold; line-height: 1.3;
  letter-spacing: 0; text-transform: none; color: #111111; counter-increment: none;
}
.sci-paper .sci-heading::before, .sci-paper .sci-heading::after { display: none; content: none; }
.sci-paper .sci-heading-no { display: inline-block; min-width: 18px; margin-right: 6px; }
.sci-paper .sci-para { margin: 0 0 6px; text-align: left; }
.sci-paper em { font-style: italic; }
.sci-paper strong { font-weight: bold; }
.sci-paper .sci-figure { margin: 10px 0 12px; padding: 0; }
.sci-paper .sci-figure canvas { display: block; margin: 0 auto; max-width: 100%; height: auto; }
.sci-paper .sci-figure-missing {
  box-sizing: border-box; width: 100%; height: 160px; border: 1px solid #999999;
  display: flex; align-items: center; justify-content: center; font-size: 9px; color: #777777;
}
.sci-paper .sci-caption { margin: 4px 0 0; font-size: 10px; line-height: 1.3; font-style: italic; text-align: left; }
.sci-paper .sci-caption strong { font-weight: bold; font-style: italic; }
.sci-paper .sci-table { margin: 10px 0 12px; }
.sci-paper .sci-table .sci-caption { margin: 0 0 3px; }
.sci-paper table { width: 100%; border-collapse: collapse; border-spacing: 0; font-size: 10px; line-height: 1.25; }
.sci-paper th { font-weight: bold; text-align: left; vertical-align: bottom; padding: 2px 4px; border-top: 1px solid #333333; border-bottom: 1px solid #333333; }
.sci-paper td { text-align: left; vertical-align: top; padding: 1.5px 4px; }
.sci-paper tbody tr:last-child td { border-bottom: 1px solid #333333; }
.sci-paper th.is-right, .sci-paper td.is-right { text-align: right; white-space: nowrap; }
.sci-paper .sci-heading-refs { margin-top: 16px; }
.sci-paper .sci-refs { margin: 0; }
.sci-paper .sci-ref { margin: 0 0 3px; padding-left: 18px; text-indent: -18px; font-size: 10.5px; line-height: 1.3; }

/* name over position · file */
.sci-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.sci-text .sci-name { flex: 0 0 auto; font: 400 10.5px/14px var(--font-mono); }
.sci-sub { font: 400 9px/12px var(--font-mono); letter-spacing: 0.02em; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sci-sub:empty { display: none; }