/* PHP2Shell exposure check.
   A working tool, not a landing page: input on the left, result on the right,
   reference data underneath. Light only. The crimson and warm neutrals come
   from sqzer.com; status colours are kept separate from the brand colour so
   "vulnerable" never reads as decoration. No inline styles: the CSP forbids
   them. */

@font-face {
  font-family: "JetBrains Mono";
  src: url("fonts/jetbrains-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("fonts/jetbrains-mono-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #f6f4ef;
  --panel: #ffffff;
  --sunken: #f9f8f5;
  --code: #f3f1ec;
  --line: #e3ded4;
  --line-2: #cfc8bb;
  /* Edges of form controls: 3.8:1 on the white pane, 3.6:1 on the textarea fill
     (WCAG 1.4.11 asks for 3:1). --line and --line-2 stay for dividers. */
  --control: #8a8275;
  --text: #1c1915;
  --muted: #57524a;
  --faint: #6f695f;
  --brand: #a51c30;
  --brand-dark: #771120;
  --ink: #23201b;

  --ok: #067647;   --ok-bg: #ecfdf3;   --ok-line: #abefc6;
  --bad: #b42318;  --bad-bg: #fef3f2;  --bad-line: #fecdca;
  --warn: #b54708; --warn-bg: #fffaeb; --warn-line: #fedf89;
  --info: #344054; --info-bg: #f2f4f7; --info-line: #d0d5dd;

  /* Pretendard covers Hangul and Latin with one design and stays crisp at small sizes on Windows. */
  --sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", "Segoe UI", Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --radius: 6px;
  --max: 84rem;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }

/* Everything is sized in rem, so the root size scales text and spacing together. */
html { -webkit-text-size-adjust: 100%; font-size: 125%; }
[hidden] { display: none !important; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 0.9375rem;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--brand); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--brand-dark); }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

code, pre, textarea, .mono { font-family: var(--mono); }
code { font-size: 0.86em; }
:where(p, li, td, dd) code { padding: 0.05em 0.3em; border-radius: 3px; background: var(--code); }
code.lit { white-space: nowrap; }

h1, h2, h3, h4 { margin: 0; line-height: 1.25; }

/* Korean: break between words, not inside them, and prefer Korean system faces. */
html[lang="ko"] body { word-break: keep-all; overflow-wrap: anywhere; }
html[lang="ko"] .badge { letter-spacing: 0; }
html[lang="ko"] .block h4, html[lang="ko"] .verdict-label { letter-spacing: 0.02em; }
/* In tables, "anywhere" would let automatic column sizing squeeze a cell down
   to one character; break-word still breaks a word that cannot fit, but only
   after the columns are sized around whole words. */
table { overflow-wrap: break-word; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.skip { position: absolute; left: -999px; top: 0; z-index: 10; padding: 0.4rem 0.8rem; background: var(--ink); color: #fff; }
.skip:focus { left: 0.5rem; top: 0.5rem; }

/* ── Top bar ─────────────────────────────────────────────────────── */

.topbar { background: var(--panel); border-bottom: 1px solid var(--line); }
.topbar-in {
  display: flex;
  align-items: center;
  gap: 0.6rem 1.25rem;
  flex-wrap: wrap;
  max-width: var(--max);
  margin: 0 auto;
  padding: 0.7rem 1.5rem;
}
.brand { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--brand); text-decoration: none; }
.brand span { font-family: var(--mono); font-size: 0.9rem; font-weight: 700; color: var(--text); letter-spacing: -0.01em; }
.cves { display: flex; gap: 0.4rem; }
.cves a {
  padding: 0.12rem 0.45rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 0.72rem;
  color: var(--muted);
  text-decoration: none;
}
.cves a:hover { border-color: var(--brand); color: var(--brand); }
.topbar-end { display: flex; align-items: center; gap: 1rem; margin-left: auto; }
.lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  height: 2rem;
  padding: 0 0.55rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 700;
  text-decoration: none;
}
.lang-toggle:hover { color: var(--brand); border-color: var(--brand); }
.topbar-end { gap: 0.5rem; }
.report-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  height: 2rem;
  padding: 0 0.7rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}
.report-link svg { flex: none; color: var(--brand); }
.report-link:hover { color: var(--brand); border-color: var(--brand); }
.source { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 4px; color: var(--text); }
.source:hover { color: var(--brand); background: var(--sunken); }

/* ── Workspace ───────────────────────────────────────────────────── */

.workspace {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 1.25rem;
  align-items: start;
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.5rem;
}
.pane {
  min-width: 0;
  padding: 1.4rem 1.5rem 1.5rem;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.pane-result { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow: auto; }

h1 { font-size: 1.3rem; font-weight: 650; letter-spacing: -0.01em; }
.lede { margin: 0.45rem 0 0; color: var(--muted); font-size: 0.9rem; max-width: 62ch; }

.step { margin-top: 1.4rem; }
.step-head { display: flex; align-items: center; gap: 0.55rem; font-size: 0.95rem; font-weight: 650; }
.step-head label { cursor: pointer; }
.step-n {
  display: inline-grid;
  place-items: center;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  font-family: var(--mono);
  font-size: 0.7rem;
  font-weight: 700;
}
.step > .step-head, .step-head-row { margin-bottom: 0.65rem; }
.step-head-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; }

/* Collector */
/* The tab strip never scrolls: when the labels do not fit, each tab shrinks and
   its label wraps onto a second line, so every tab stays visible. */
.collector { border: 1px solid var(--line); border-radius: var(--radius); container-type: inline-size; }
.tabs { display: flex; border-bottom: 1px solid var(--line); background: var(--sunken); border-radius: var(--radius) var(--radius) 0 0; }
.tab {
  flex: 0 1 auto;
  position: relative;
  padding: 0.6rem 0.9rem;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.35;
  cursor: pointer;
}
.tab:first-child { border-top-left-radius: calc(var(--radius) - 1px); }
.tab:hover { color: var(--text); }
.tab:focus-visible { outline-offset: -2px; }
.tab[aria-selected="true"] { color: var(--text); background: var(--panel); }
.tab[aria-selected="true"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--brand); }
.tab-hint { margin-left: 0.25rem; font-size: 0.7rem; font-weight: 500; color: var(--ok); }
@container (max-width: 28rem) {
  .tab-hint { display: none; }
}
.tab-panel { padding: 0.9rem; }
.tab-panel[hidden] { display: none; }
.panel-title { display: none; }

.get { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.btn-download { gap: 0.45rem; text-decoration: none; }
.btn-download:hover { color: var(--text); }
.btn-download svg { flex: none; color: var(--brand); }
.or {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0.8rem 0 0.5rem;
  font-size: 0.74rem;
  color: var(--faint);
}
.or::after { content: ""; flex: 1; height: 1px; background: var(--line); }

.cmdline {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  padding: 0.2rem 0.25rem 0.2rem 0.7rem;
  background: var(--code);
  border: 1px solid var(--line);
  border-radius: 4px;
}
.cmd {
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  padding: 0.4rem 0;
  font-size: 0.78rem;
  color: var(--text);
  white-space: nowrap;
  scrollbar-width: thin;
}
.cmd::before { content: "$ "; color: var(--faint); }
.cmd.multi { margin: 0; white-space: pre; line-height: 1.7; }
.copy {
  flex: none;
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.copy:hover { background: var(--line); color: var(--text); }
.copy .i-check { display: none; }
.copy.is-done { color: var(--ok); }
.copy.is-done .i-copy { display: none; }
.copy.is-done .i-check { display: block; }

.howto { margin: 0.75rem 0 0; padding-left: 1.15rem; font-size: 0.84rem; color: var(--muted); }
.howto li + li { margin-top: 0.25rem; }
.sha { margin: 0.6rem 0 0; font-family: var(--mono); font-size: 0.68rem; color: var(--faint); word-break: break-all; }
.sha:empty { display: none; }

/* Form */
textarea {
  display: block;
  width: 100%;
  min-height: 15rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--control);
  border-radius: 4px;
  background: var(--sunken);
  color: var(--text);
  font-size: 0.78rem;
  line-height: 1.55;
  resize: vertical;
}
textarea::placeholder { color: var(--faint); }
textarea:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(165, 28, 48, 0.12); background: var(--panel); }

select {
  min-height: 2.25rem;
  max-width: 100%;
  padding: 0 2rem 0 0.6rem;
  border: 1px solid var(--control);
  border-radius: 4px;
  background: var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2357524a' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 0.55rem center / 0.9rem;
  color: var(--text);
  font: inherit;
  font-size: 0.85rem;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}
.select-sm { min-height: 1.9rem; font-size: 0.8rem; color: var(--muted); }

/* Example inputs: picking one does nothing until Load is pressed. */
.examples { display: flex; flex: 0 1 auto; align-items: center; gap: 0.4rem; min-width: 0; margin-left: auto; }
.examples select { flex: 0 1 auto; min-width: 0; }
.examples .btn { flex: none; }
/* Keep the examples beside the heading on wider screens: the select gives up
   width before the row wraps. Phones put them on their own row instead. */
#check-form > .step-head-row { flex-wrap: nowrap; }
#check-form > .step-head-row > .step-head { flex: none; }

.form-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.75rem; }
.field { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; font-size: 0.78rem; font-weight: 600; color: var(--muted); }
.field select { min-width: 14rem; }
.form-buttons { display: flex; gap: 0.5rem; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  padding: 0 0.95rem;
  border: 1px solid var(--control);
  border-radius: 4px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
}
.btn:hover { background: var(--sunken); border-color: var(--muted); }
.btn-primary { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn-primary:hover { background: #000; border-color: #000; }
.btn-sm { min-height: 1.9rem; padding: 0 0.7rem; font-size: 0.8rem; }

.fine { display: flex; align-items: center; gap: 0.35rem; margin: 0.7rem 0 0; font-size: 0.76rem; color: var(--faint); }
.fine svg { flex: none; }
.fine-block { margin: 0.4rem 0 0; font-size: 0.84rem; color: var(--muted); }
.noscript { margin: 0 0 1rem; padding: 0.75rem 0.9rem; border: 1px solid var(--warn-line); border-radius: 4px; background: var(--warn-bg); color: var(--warn); font-size: 0.85rem; }
.noscript a { color: inherit; }

/* Without JavaScript. A browser parses the contents of <noscript> as elements
   only when scripting is off, so p.noscript exists only then and these rules
   never apply to the scripted page. All collection methods are shown one after
   another, and controls and tables that need the script are left out. */
body:has(p.noscript) .tabs,
body:has(p.noscript) .copy,
body:has(p.noscript) .examples,
body:has(p.noscript) #upstream-table,
body:has(p.noscript) .ref-col .disclosure { display: none; }
body:has(p.noscript) .tab-panel[hidden] { display: block !important; }
body:has(p.noscript) .tab-panel + .tab-panel { border-top: 1px solid var(--line); }
body:has(p.noscript) .panel-title { display: block; margin: 0 0 0.7rem; font-size: 0.85rem; font-weight: 650; }

/* ── Result ──────────────────────────────────────────────────────── */

.empty p { margin: 0 0 0.9rem; color: var(--muted); font-size: 0.88rem; }
.legend { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.legend th, .legend td { padding: 0.5rem 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.legend th { width: 8.5rem; padding-right: 0.75rem; font-weight: 400; }
.legend td { color: var(--muted); }

.badge {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border: 1px solid;
  border-radius: 4px;
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}
.badge-patched, .badge-ok { color: var(--ok); background: var(--ok-bg); border-color: var(--ok-line); }
.badge-vulnerable, .badge-pending, .badge-bad, .badge-high { color: var(--bad); background: var(--bad-bg); border-color: var(--bad-line); }
.badge-restart, .badge-warn, .badge-medium { color: var(--warn); background: var(--warn-bg); border-color: var(--warn-line); }
.badge-unknown, .badge-info { color: var(--info); background: var(--info-bg); border-color: var(--info-line); }

.verdict {
  --v: var(--info); --v-bg: var(--info-bg); --v-line: var(--info-line);
  padding: 1rem 1.1rem;
  border: 1px solid var(--v-line);
  border-left: 4px solid var(--v);
  border-radius: var(--radius);
  background: var(--v-bg);
}
.verdict[data-verdict="patched"] { --v: var(--ok); --v-bg: var(--ok-bg); --v-line: var(--ok-line); }
.verdict[data-verdict="vulnerable"], .verdict[data-verdict="pending"] { --v: var(--bad); --v-bg: var(--bad-bg); --v-line: var(--bad-line); }
.verdict[data-verdict="restart"] { --v: var(--warn); --v-bg: var(--warn-bg); --v-line: var(--warn-line); }
.verdict-label { margin: 0 0 0.3rem; font-family: var(--sans); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--v); }
.verdict h3 { font-size: 1.15rem; font-weight: 650; }
.verdict h3:focus { outline: none; }
.reasons { margin: 0.55rem 0 0; padding-left: 1.1rem; font-size: 0.88rem; }
.reasons li + li { margin-top: 0.3rem; }
.verdict-meta { margin: 0.7rem 0 0; font-size: 0.74rem; color: var(--muted); }

.block { margin-top: 1.25rem; }
.block h4 { margin-bottom: 0.5rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.block > p { margin: 0 0 0.6rem; font-size: 0.84rem; color: var(--muted); }

.kv { width: 100%; border-collapse: collapse; font-size: 0.84rem; }
.kv th, .kv td { padding: 0.42rem 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.kv tr:last-child > * { border-bottom: 1px solid var(--line); }
.kv th { width: 9.5rem; padding-right: 0.75rem; font-weight: 500; color: var(--muted); }
.kv td { overflow-wrap: anywhere; }
.kv td.mono { font-size: 0.8rem; }
.kv .badge { margin-right: 0.4rem; }

.actions { margin: 0; padding-left: 1.2rem; font-size: 0.88rem; }
.actions li + li { margin-top: 0.6rem; }
.actions .cmdline { margin-top: 0.35rem; }

.mit { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.mit th, .mit td { padding: 0.45rem 0.6rem 0.45rem 0; text-align: left; vertical-align: top; }
.mit thead th { font-size: 0.7rem; font-weight: 600; color: var(--faint); border-bottom: 1px solid var(--line); }
.mit tbody tr.mit-row > * { border-top: 1px solid var(--line); }
.mit tbody tr.mit-row:first-child > * { border-top: 0; }
.mit td.setting { font-family: var(--mono); font-size: 0.78rem; font-weight: 700; overflow-wrap: break-word; word-break: normal; }
.mit td.value { font-family: var(--mono); font-size: 0.78rem; white-space: nowrap; color: var(--muted); }
.mit td.status { text-align: right; padding-right: 0; }
/* On phones the value and status move under the setting name (see the 40rem query). */
.mit-inline { display: none; }
.mit tr.mit-note td { padding-top: 0; color: var(--muted); font-size: 0.8rem; }

.plain { margin: 0; padding-left: 1.1rem; font-size: 0.86rem; }
.plain li + li { margin-top: 0.35rem; }
.indicators { list-style: none; margin: 0; padding: 0; font-size: 0.86rem; }
.indicators li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.55rem; align-items: start; }
.indicators li + li { margin-top: 0.45rem; }
.indicators .badge { margin-top: 0.1rem; }

/* ── Reference ───────────────────────────────────────────────────── */

.reference { border-top: 1px solid var(--line); background: var(--panel); }
.reference-in {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 2.5rem;
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.75rem 1.5rem 2rem;
}
.ref-col h2 { margin: 0 0 0.6rem; font-size: 0.95rem; font-weight: 650; }
.ref-col h2:not(:first-child) { margin-top: 1.4rem; }

.data { width: 100%; border-collapse: collapse; font-size: 0.84rem; }
.data th, .data td { padding: 0.45rem 0.75rem 0.45rem 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.data thead th { font-size: 0.72rem; font-weight: 600; color: var(--faint); }
.data tbody th { font-weight: 600; white-space: nowrap; }
.data td.mono { font-family: var(--mono); font-size: 0.78rem; white-space: nowrap; }
/* Long distribution versions may wrap, but only at the <wbr> that app.js puts
   after "-" and "~" and before "+", never inside a number. */
.data td.ver { white-space: normal; overflow-wrap: normal; word-break: normal; }
.data .ver-line { display: block; }
.data .dim { color: var(--faint); font-weight: 400; }
.data .eol::before { content: " · "; }
.data .badge { margin-left: 0.35rem; }

.disclosure { margin-top: 0.8rem; border: 1px solid var(--line); border-radius: var(--radius); }
.disclosure > summary { padding: 0.55rem 0.8rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; }
.disclosure > summary::marker { color: var(--faint); }
.disclosure[open] > summary { border-bottom: 1px solid var(--line); }
.disclosure > table, .disclosure > div { padding: 0 0.8rem 0.6rem; }
.disclosure > table { display: block; overflow-x: auto; }
.rh-intro { margin: 0.6rem 0; font-size: 0.82rem; color: var(--muted); }
.rh { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.rh th, .rh td { padding: 0.35rem 0.75rem 0.35rem 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.rh th { white-space: nowrap; font-weight: 600; }
.rh td { font-family: var(--mono); overflow-wrap: anywhere; }

.method { margin: 0; padding-left: 1.2rem; font-size: 0.84rem; color: var(--muted); }
.method li + li { margin-top: 0.3rem; }

.footer { max-width: var(--max); margin: 0 auto; padding: 1rem 1.5rem 2rem; }
.footer p { margin: 0; font-size: 0.78rem; color: var(--faint); }
.footer a { color: var(--muted); }

/* ── Narrow screens ──────────────────────────────────────────────── */

/* Media queries count rem from the browser default (16px), not the root size above. */
@media (max-width: 75rem) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  .pane-result { position: static; max-height: none; overflow: visible; }
  .reference-in { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
}
@media (max-width: 40rem) {
  html { font-size: 112.5%; }
  .topbar-in, .workspace, .reference-in, .footer { padding-left: 1rem; padding-right: 1rem; }
  .workspace { padding-top: 1rem; gap: 1rem; }
  .pane { padding: 1.1rem 1rem 1.2rem; }
  .tab-hint { display: none; }
  .tab { padding: 0.6rem; font-size: 0.8rem; }
  /* 16px or more, or iOS Safari zooms the page when the field gets focus. */
  textarea, select, select.select-sm { font-size: 1rem; }
  #check-form > .step-head-row { flex-wrap: wrap; }
  .examples { flex: 1 1 100%; }
  .examples select { flex: 1 1 auto; }
  .form-row { flex-direction: column; align-items: stretch; }
  .field select { min-width: 0; width: 100%; }
  .form-buttons .btn { flex: 1; }
  .kv th { width: 7rem; }
  .legend th { width: 7.5rem; }
  .data th, .data td { padding-right: 0.5rem; }
  .data th:last-child, .data td:last-child { padding-right: 0; }
  .disclosure > table, .disclosure > div { padding-left: 0.6rem; padding-right: 0.6rem; }
  .data .eol { display: block; white-space: normal; }
  .data .eol::before { content: none; }
  .data tbody th { white-space: normal; }
  .mit td.value, .mit td.status, .mit thead th:not(:first-child) { display: none; }
  .mit-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 0.2rem 0.5rem; margin-top: 0.15rem; font-weight: 400; color: var(--muted); }
}

/* Phones: buttons share the brand row, the report button shrinks to its icon,
   and the CVE links take the second row. */
@media (max-width: 30rem) {
  .topbar-end { order: 2; }
  .cves { order: 3; width: 100%; }
  .report-link { padding: 0; width: 2rem; justify-content: center; }
  .report-link span { display: none; }
  .lang-toggle svg { display: none; }
  .brand span { font-size: 0.8rem; }
}