/* Legacy Claims & Customer Support Enterprise Lernportal
   v36 Navigation, Theme & PDF Fix
   Zentrale, konsolidierte UI-Schicht – offline und Safari/iPhone-tauglich. */

:root,
html[data-theme="light"] {
  color-scheme: light;
  --portal-bg: #f3f6fa;
  --portal-bg-accent: #eaf1f9;
  --portal-surface: #ffffff;
  --portal-surface-2: #f8fafc;
  --portal-surface-3: #edf3f9;
  --portal-text: #172235;
  --portal-muted: #5f6d80;
  --portal-brand: #174f7e;
  --portal-brand-strong: #0e3d67;
  --portal-accent: #287f92;
  --portal-accent-soft: #e5f3f4;
  --portal-line: #d6e0eb;
  --portal-line-strong: #bdcad8;
  --portal-ok: #176b4f;
  --portal-ok-bg: #e9f7f1;
  --portal-ok-line: #9dd9c3;
  --portal-warn: #805b13;
  --portal-warn-bg: #fff7df;
  --portal-warn-line: #e9cf80;
  --portal-code: #101827;
  --portal-code-head: #172236;
  --portal-code-text: #e7eef8;
  --portal-code-line: #33445d;
  --portal-shadow: 0 18px 45px rgba(25, 46, 73, 0.09);
  --portal-shadow-soft: 0 8px 24px rgba(25, 46, 73, 0.07);
  --portal-radius-lg: 24px;
  --portal-radius-md: 17px;
  --portal-radius-sm: 11px;
  --portal-max: 1160px;
  --portal-nav-bg: rgba(255, 255, 255, 0.92);
  --portal-row-alt: #f5f8fb;

  /* Kompatibilitäts-Aliase für bestehende Seiten */
  --v31-bg: var(--portal-bg);
  --v31-panel: var(--portal-surface);
  --v31-panel-2: var(--portal-surface-2);
  --v31-text: var(--portal-text);
  --v31-muted: var(--portal-muted);
  --v31-brand: var(--portal-brand);
  --v31-brand-2: var(--portal-accent);
  --v31-line: var(--portal-line);
  --v31-soft: var(--portal-surface-3);
  --v31-soft-2: var(--portal-bg-accent);
  --v31-ok: var(--portal-ok-bg);
  --v31-ok-line: var(--portal-ok-line);
  --v31-warn: var(--portal-warn-bg);
  --v31-warn-line: var(--portal-warn-line);
  --v31-shadow: var(--portal-shadow);
  --v31-code: var(--portal-code);
  --v31-code-text: var(--portal-code-text);
  --v31-code-line: var(--portal-code-line);
  --v31-radius: var(--portal-radius-lg);
  --v31-max: var(--portal-max);
}

html[data-theme="dark"],
html.theme-dark,
body[data-theme="dark"],
body.theme-dark,
body.dark {
  color-scheme: dark;
  --portal-bg: #09111d;
  --portal-bg-accent: #0d1928;
  --portal-surface: #111d2c;
  --portal-surface-2: #152337;
  --portal-surface-3: #1a2a40;
  --portal-text: #edf3fb;
  --portal-muted: #b2bfd0;
  --portal-brand: #9fc9f2;
  --portal-brand-strong: #c6e0fb;
  --portal-accent: #82cbd2;
  --portal-accent-soft: #16323a;
  --portal-line: #31445b;
  --portal-line-strong: #435a73;
  --portal-ok: #8ee0bf;
  --portal-ok-bg: #102c25;
  --portal-ok-line: #2f8569;
  --portal-warn: #f0d087;
  --portal-warn-bg: #302713;
  --portal-warn-line: #8f7435;
  --portal-code: #050a12;
  --portal-code-head: #0c1420;
  --portal-code-text: #e8f0fb;
  --portal-code-line: #3b4f69;
  --portal-shadow: 0 20px 52px rgba(0, 0, 0, 0.38);
  --portal-shadow-soft: 0 10px 28px rgba(0, 0, 0, 0.28);
  --portal-nav-bg: rgba(12, 23, 37, 0.94);
  --portal-row-alt: #162538;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--portal-bg); }
body,
body.v31-polish {
  margin: 0;
  background: var(--portal-bg) !important;
  color: var(--portal-text) !important;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.68;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

::selection { background: var(--portal-brand); color: var(--portal-surface); }
.skip-link {
  position: fixed;
  z-index: 5000;
  top: 8px;
  left: 8px;
  transform: translateY(-160%);
  padding: .65rem .85rem;
  border-radius: 10px;
  background: var(--portal-brand-strong);
  color: #fff !important;
  font-weight: 800;
  transition: transform .15s ease;
}
.skip-link:focus { transform: translateY(0); }

main,
.wrap,
.page,
.content,
.container { color: var(--portal-text); }
.wrap,
.page,
main.wrap {
  width: min(100%, var(--portal-max));
  max-width: var(--portal-max) !important;
  margin-inline: auto;
  padding: 30px clamp(16px, 3vw, 34px) 60px !important;
}

h1, h2, h3, h4 { text-wrap: balance; }
h1 {
  color: var(--portal-text) !important;
  letter-spacing: -.035em;
  line-height: 1.08;
}
h2, h3, h4 { color: var(--portal-brand) !important; }
p, li, td, th, dd { overflow-wrap: anywhere; }
.muted, .small, .footer, .v31-footer { color: var(--portal-muted) !important; }
a { color: var(--portal-brand) !important; text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover { text-decoration: underline; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible {
  outline: 3px solid var(--portal-accent);
  outline-offset: 3px;
}


/* v36: Kompatibilitätsvariablen für ältere, lokal eingebettete Seitenthemes.
   Die Aliaswerte folgen immer den zentralen Portalvariablen. */
:root,
html[data-theme="light"],
html[data-theme="dark"],
html.theme-light,
html.theme-dark {
  --bg: var(--portal-bg);
  --panel: var(--portal-surface);
  --panel2: var(--portal-surface-2);
  --card: var(--portal-surface);
  --text: var(--portal-text);
  --ink: var(--portal-text);
  --muted: var(--portal-muted);
  --blue: var(--portal-brand);
  --brand: var(--portal-brand);
  --brand2: var(--portal-accent);
  --accent: var(--portal-accent);
  --accent2: var(--portal-brand);
  --line: var(--portal-line);
  --soft: var(--portal-surface-3);
  --green: var(--portal-ok-bg);
  --ok: var(--portal-ok-bg);
  --okline: var(--portal-ok-line);
  --warn: var(--portal-warn-bg);
  --codebg: var(--portal-code);
  --code-bg: var(--portal-code);
  --code-head: var(--portal-code-head);
  --codetext: var(--portal-code-text);
  --code-text: var(--portal-code-text);
  --codeborder: var(--portal-code-line);
  --shadow: var(--portal-shadow-soft);
}

/* Globale Navigation */
.v31-topbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--portal-nav-bg) !important;
  border-bottom: 1px solid var(--portal-line);
  box-shadow: 0 8px 28px rgba(17, 34, 54, .07);
  backdrop-filter: blur(16px) saturate(150%);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
}
.v31-nav {
  width: min(100%, 1220px);
  margin: 0 auto;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.v31-spacer { flex: 1 1 20px; }
.v31-brand {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin-right: .35rem;
  color: var(--portal-text) !important;
  font-size: .94rem;
  font-weight: 850;
  letter-spacing: -.015em;
  text-decoration: none !important;
}
.v31-brand-mark {
  width: 30px;
  height: 30px;
  padding: 6px;
  border-radius: 9px;
  background: linear-gradient(145deg, var(--portal-brand), var(--portal-accent));
  color: #fff;
  box-shadow: var(--portal-shadow-soft);
  flex: 0 0 auto;
}
.v31-btn,
.v31-tool,
.btn,
.control-btn,
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-height: 38px;
  padding: .48rem .7rem;
  border: 1px solid var(--portal-line) !important;
  border-radius: 12px !important;
  background: var(--portal-surface-2) !important;
  color: var(--portal-brand) !important;
  box-shadow: none !important;
  font: inherit;
  font-size: .88rem;
  font-weight: 760;
  line-height: 1.1;
  text-decoration: none !important;
  cursor: pointer;
  white-space: nowrap;
  transition: transform .14s ease, border-color .14s ease, background .14s ease;
  -webkit-tap-highlight-color: transparent;
}
.v31-btn:hover,
.v31-tool:hover,
.btn:hover,
.control-btn:hover,
.theme-toggle:hover {
  transform: translateY(-1px);
  border-color: var(--portal-line-strong) !important;
  background: var(--portal-surface-3) !important;
  text-decoration: none !important;
}
.v31-btn[aria-current="page"] {
  background: var(--portal-accent-soft) !important;
  border-color: var(--portal-accent) !important;
  color: var(--portal-brand-strong) !important;
}
.v31-home { background: var(--portal-surface-3) !important; color: var(--portal-text) !important; }
.v31-theme { min-width: 43px; user-select: none; touch-action: manipulation; }
.v31-theme .theme-label { font-size: .84rem; font-weight: 800; }
.nav-icon, .theme-icon-svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  stroke-width: 1.9;
}

/* Flächen, Karten und Klappbereiche */
.card,
.tile,
details,
.quality-card,
.pattern-card,
.code-card {
  border: 1px solid var(--portal-line) !important;
  background: var(--portal-surface) !important;
  color: var(--portal-text) !important;
  border-radius: var(--portal-radius-md) !important;
  box-shadow: var(--portal-shadow-soft) !important;
}
.card, .tile { overflow: hidden; }
.card { padding: clamp(19px, 2.4vw, 27px); }
.grid { align-items: stretch; gap: 17px !important; }
.grid .card, .grid .tile { min-width: 0; }
.card:hover, a.card:hover, a.tile:hover {
  border-color: var(--portal-line-strong) !important;
  box-shadow: var(--portal-shadow) !important;
  text-decoration: none !important;
}
.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 5vw, 52px) !important;
  border: 1px solid var(--portal-line) !important;
  border-radius: var(--portal-radius-lg) !important;
  background:
    radial-gradient(circle at 85% 18%, color-mix(in srgb, var(--portal-accent) 18%, transparent), transparent 36%),
    linear-gradient(145deg, var(--portal-surface), var(--portal-bg-accent)) !important;
  color: var(--portal-text) !important;
  box-shadow: var(--portal-shadow) !important;
}
.hero h1 { margin: .3rem 0 .75rem; font-size: clamp(2.25rem, 6vw, 4.8rem); max-width: 17ch; }
.hero p { max-width: 68ch; }
.tag {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: .26rem .65rem;
  border: 1px solid var(--portal-line) !important;
  border-radius: 999px;
  background: var(--portal-surface-3) !important;
  color: var(--portal-brand) !important;
  font-size: .78rem;
  font-weight: 820;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.notice, .note-ok {
  padding: 17px 19px;
  border: 1px solid var(--portal-ok-line) !important;
  border-radius: var(--portal-radius-md) !important;
  background: var(--portal-ok-bg) !important;
  color: var(--portal-text) !important;
}
.warn { background: var(--portal-warn-bg) !important; border-color: var(--portal-warn-line) !important; }
blockquote {
  margin: 18px 0;
  padding: 14px 18px;
  border: 1px solid var(--portal-line) !important;
  border-left: 4px solid var(--portal-accent) !important;
  border-radius: 0 var(--portal-radius-sm) var(--portal-radius-sm) 0 !important;
  background: var(--portal-surface-2) !important;
  color: var(--portal-text) !important;
}
details { margin: 15px 0; overflow: clip; }
summary {
  position: relative;
  padding: 16px 48px 16px 18px;
  color: var(--portal-brand) !important;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}
summary::-webkit-details-marker { display: none; }
summary::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
  transition: transform .16s ease;
}
details[open] > summary::after { transform: translateY(-30%) rotate(225deg); }
details[open] > summary { border-bottom: 1px solid var(--portal-line); }
.details-body { padding: 0 18px 18px; }

/* Portal-Startseite */
.portal-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  gap: clamp(24px, 5vw, 58px);
  align-items: center;
}
.hero-eyebrow { color: var(--portal-accent) !important; font-size: .82rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
.hero-actions .v31-btn:first-child {
  background: var(--portal-brand-strong) !important;
  border-color: var(--portal-brand-strong) !important;
  color: #fff !important;
}
.hero-visual {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--portal-line);
  border-radius: 20px;
  background: color-mix(in srgb, var(--portal-surface) 76%, transparent);
}
.hero-visual svg { display: block; width: 100%; height: auto; color: var(--portal-brand); }
.portal-section { margin-top: 42px; }
.section-heading { display: flex; gap: 18px; align-items: end; justify-content: space-between; margin-bottom: 16px; }
.section-heading h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.15rem); }
.section-heading p { margin: 0; max-width: 55ch; color: var(--portal-muted); }
.portal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.portal-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 220px;
  padding: 23px;
  border: 1px solid var(--portal-line);
  border-radius: var(--portal-radius-md);
  background: var(--portal-surface);
  color: var(--portal-text) !important;
  box-shadow: var(--portal-shadow-soft);
  text-decoration: none !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.portal-card:hover { transform: translateY(-3px); border-color: var(--portal-accent); box-shadow: var(--portal-shadow); }
.portal-card h3 { margin: 20px 0 8px; color: var(--portal-text) !important; font-size: 1.25rem; }
.portal-card p { margin: 0; color: var(--portal-muted); }
.portal-card .portal-link { margin-top: auto; padding-top: 18px; color: var(--portal-brand); font-weight: 800; }
.portal-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: var(--portal-accent-soft);
  color: var(--portal-brand-strong);
}
.portal-icon svg { width: 22px; height: 22px; }
.portal-kicker { color: var(--portal-accent) !important; font-size: .76rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.portal-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}
.meta-item { padding: 14px 16px; border-left: 3px solid var(--portal-accent); background: var(--portal-surface-2); border-radius: 0 12px 12px 0; }
.meta-item strong { display: block; color: var(--portal-text); }
.meta-item span { color: var(--portal-muted); font-size: .9rem; }

/* Tabellen */
.table-wrap {
  max-width: 100%;
  margin: 17px 0;
  overflow-x: auto !important;
  border: 1px solid var(--portal-line) !important;
  border-radius: 15px;
  background: var(--portal-surface) !important;
  -webkit-overflow-scrolling: touch;
}
table {
  width: 100%;
  max-width: 100% !important;
  min-width: 640px;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse;
  background: var(--portal-surface) !important;
  color: var(--portal-text) !important;
}
th, td {
  padding: 11px 13px !important;
  border: 1px solid var(--portal-line) !important;
  color: var(--portal-text) !important;
  text-align: left;
  vertical-align: top;
}
th {
  background: var(--portal-surface-3) !important;
  color: var(--portal-brand-strong) !important;
  font-weight: 820;
}
tbody tr:nth-child(even),
tbody tr:nth-child(even) td { background: var(--portal-row-alt) !important; }
tbody tr:nth-child(odd),
tbody tr:nth-child(odd) td { background: var(--portal-surface) !important; }

/* Code, Pfade und Syntaxfarben */
code, .path, .path-block {
  max-width: 100%;
  padding: .12em .36em;
  border: 1px solid var(--portal-line) !important;
  border-radius: 7px;
  background: var(--portal-surface-3) !important;
  color: var(--portal-text) !important;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.path-block { display: block; padding: 10px 12px; line-height: 1.45; }
pre,
pre.sourceCode,
.code-card pre {
  position: relative;
  max-width: 100%;
  margin: 17px 0;
  padding: 20px !important;
  overflow: auto;
  border: 1px solid var(--portal-code-line) !important;
  border-radius: 15px !important;
  background: var(--portal-code) !important;
  color: var(--portal-code-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
  tab-size: 4;
  -webkit-overflow-scrolling: touch;
}
pre code,
pre.sourceCode code {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  white-space: pre;
  overflow-wrap: normal;
  word-break: normal;
}
.code-head {
  border-color: var(--portal-code-line) !important;
  background: var(--portal-code-head) !important;
  color: var(--portal-code-text) !important;
}
.copy-btn, .v31-copy {
  position: absolute;
  z-index: 3;
  top: 9px;
  right: 10px;
  min-width: 34px;
  min-height: 30px;
  padding: 4px 8px;
  border: 1px solid var(--portal-code-line) !important;
  border-radius: 8px;
  background: var(--portal-code-head) !important;
  color: var(--portal-code-text) !important;
  font: inherit;
  font-size: .78rem;
  cursor: pointer;
}
/* Pandoc/Highlight-Syntaxfarben */
pre .kw, pre .cf, pre .dt { color: #8ecbff !important; font-weight: 650; }
pre .st, pre .ss, pre .sc { color: #a8dc9f !important; }
pre .co { color: #8f9db1 !important; font-style: italic; }
pre .fu { color: #e7c77b !important; }
pre .at, pre .an { color: #d5a7ff !important; }
pre .dv, pre .bn, pre .fl { color: #f3ad8f !important; }
pre .op, pre .bu { color: #c8d5e6 !important; }
pre .er { color: #ff9a9a !important; text-decoration: underline; }

/* Spezielle Inhaltsraster */
.pattern-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)); gap: 18px; }
.pattern-card { min-width: 0; overflow: hidden; }
.pattern-card h2 { margin: .35rem 0 !important; padding: 0 !important; border: 0 !important; font-size: clamp(1.22rem, 2.2vw, 1.62rem) !important; }
.pattern-card code, .pattern-card .path, .pattern-card .path-block { display: block; }
.quality-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 13px; }
.quality-card { padding: 18px; }
.quality-card strong { display: block; margin-top: 4px; color: var(--portal-brand-strong) !important; font-size: 1.65rem; line-height: 1.1; }
.v31-tools { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 22px; }
.v31-footer, .footer { margin-top: 42px; padding-top: 18px; border-top: 1px solid var(--portal-line); }

/* Formularfelder */
input, textarea, select {
  max-width: 100%;
  border: 1px solid var(--portal-line) !important;
  border-radius: 10px !important;
  background: var(--portal-surface-2) !important;
  color: var(--portal-text) !important;
}



/* v36: hervorgehobene Handbuch-/PDF-Karte */
.portal-card-feature {
  border-color: color-mix(in srgb, var(--portal-accent) 55%, var(--portal-line)) !important;
  background:
    radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--portal-accent) 18%, transparent), transparent 42%),
    var(--portal-surface) !important;
}
.portal-card-feature .portal-icon { width: 48px; height: 48px; }
.portal-badges { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 4px; }
.portal-badge {
  display: inline-flex;
  align-items: center;
  padding: .28rem .58rem;
  border: 1px solid var(--portal-line);
  border-radius: 999px;
  background: var(--portal-surface-3);
  color: var(--portal-brand-strong);
  font-size: .77rem;
  font-weight: 820;
}
.portal-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 18px; }
.portal-card-actions .v31-btn:first-child {
  background: var(--portal-brand-strong) !important;
  border-color: var(--portal-brand-strong) !important;
  color: #fff !important;
}

/* v36: browserlesbare Java-Quellcodeansichten im JetBrains-Dark-Stil */
.source-view-meta { display: grid; grid-template-columns: minmax(0,1fr); gap: 8px; margin: 16px 0; }
.source-view-meta code { display: block; padding: 10px 12px; }
.source-link-label { display: block; margin-bottom: 5px; color: var(--portal-brand-strong); font-weight: 850; }
a.path-block code { display: block; padding: 0; border: 0 !important; background: transparent !important; color: inherit !important; }
pre.jetbrains-dark { background: #2b2b2b !important; border-color: #45494a !important; color: #bcbec4 !important; }
pre.jetbrains-dark code { color: #bcbec4 !important; }
pre.jetbrains-dark .k, pre.jetbrains-dark .kd, pre.jetbrains-dark .kn, pre.jetbrains-dark .kp, pre.jetbrains-dark .kr,
pre.jetbrains-dark .kt { color: #cf8e6d !important; font-weight: 650; }
pre.jetbrains-dark .s, pre.jetbrains-dark .s1, pre.jetbrains-dark .s2, pre.jetbrains-dark .sa, pre.jetbrains-dark .sb,
pre.jetbrains-dark .sc, pre.jetbrains-dark .sd, pre.jetbrains-dark .se, pre.jetbrains-dark .sh, pre.jetbrains-dark .si,
pre.jetbrains-dark .sr, pre.jetbrains-dark .ss, pre.jetbrains-dark .sx { color: #6aab73 !important; }
pre.jetbrains-dark .c, pre.jetbrains-dark .c1, pre.jetbrains-dark .cm, pre.jetbrains-dark .cp,
pre.jetbrains-dark .cpf, pre.jetbrains-dark .cs { color: #7a7e85 !important; font-style: italic; }
pre.jetbrains-dark .nc, pre.jetbrains-dark .nn, pre.jetbrains-dark .nd { color: #b3ae60 !important; }
pre.jetbrains-dark .nf, pre.jetbrains-dark .fm { color: #56a8f5 !important; }
pre.jetbrains-dark .na, pre.jetbrains-dark .nv, pre.jetbrains-dark .vi, pre.jetbrains-dark .vc,
pre.jetbrains-dark .vg { color: #c77dbb !important; }
pre.jetbrains-dark .mi, pre.jetbrains-dark .mf, pre.jetbrains-dark .mh, pre.jetbrains-dark .mo,
pre.jetbrains-dark .il { color: #2aacb8 !important; }
pre.jetbrains-dark .o, pre.jetbrains-dark .ow, pre.jetbrains-dark .p { color: #bcbec4 !important; }
pre.jetbrains-dark .err { color: #ff6b68 !important; text-decoration: underline; }


@media (max-width: 900px) {
  .portal-hero-grid { grid-template-columns: 1fr; }
  .hero-visual { max-width: 560px; }
  .portal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-meta { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .v31-nav { align-items: flex-start; gap: 6px; padding: 8px 10px; }
  .v31-brand { width: 100%; }
  .v31-btn, .v31-tool { min-height: 36px; padding: .45rem .58rem; font-size: .84rem; }
  .v31-theme .theme-label, .v31-hide-mobile { display: none !important; }
  .wrap, .page, main.wrap { padding-top: 20px !important; padding-bottom: 42px !important; }
  .hero { border-radius: 20px !important; }
  .portal-grid { grid-template-columns: 1fr; }
  .portal-card { min-height: 190px; }
  .section-heading { display: block; }
  .section-heading p { margin-top: 6px; }
  .pattern-grid { grid-template-columns: 1fr; }
  .table-wrap table { min-width: 560px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

@media print {
  .v31-topbar, .v31-tools, .copy-btn, .v31-copy, .skip-link { display: none !important; }
  body { background: #fff !important; color: #111 !important; }
  .wrap, .page, main.wrap { width: 100%; max-width: none !important; padding: 0 !important; }
  .card, .tile, details, .hero, .quality-card, .pattern-card { box-shadow: none !important; break-inside: avoid; }
  a { color: #111 !important; text-decoration: underline; }
}