/* The Security Library (server-rendered by api/src/Support/SecurityLibrary.php). These pages are not the single-page app, so they have a small stylesheet of
   their own; the look is the app's public pages: the white top bar, the notched card corners, and the circuit-board sections (the same image files, never
   recolored: the traces are translucent and the color behind them is the section's own -- green #6bab84, blue #4470af, the page gray). Text never sits on
   a busy board: it is on a white panel or a white card. The public pages have no dark mode, so neither do these. */
@font-face {
  font-family: 'Roboto Flex';
  font-style: normal;
  font-weight: 100 1000;
  font-stretch: 100%;
  font-display: swap;
  src: url(/public/fonts/robotoflex-variable-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto Flex';
  font-style: normal;
  font-weight: 100 1000;
  font-stretch: 100%;
  font-display: swap;
  src: url(/public/fonts/robotoflex-variable-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --text: #2b3a46;          /* a little darker than the app's #334450: long reading keeps a comfortable contrast */
  --heading: #0d1b2a;       /* the app's heading color */
  --muted: #55636f;         /* 5.9:1 on white */
  --link: #1759b8;          /* the app's blue, a little deeper: 6.6:1 on white */
  --page: #f4f4f3;
  --border: #a2a9b1;
  --soft-border: #d6d9dc;
  --green: #6bab84;
  --blue: #4470af;
  --green-dark: #1f7d49;
  --green-tint: #eef6f1;
  --radius: 15px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 16px; }
body {
  margin: 0;
  font-family: 'Roboto Flex', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: var(--text);
  background: var(--page);
}
a { color: var(--link); text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, summary:focus-visible, .lib-skip:focus { outline: 3px solid #e59a00; outline-offset: 2px; border-radius: 4px; }
img { max-width: 100%; height: auto; }
[hidden] { display: none !important; }
.lib-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Skip link: off screen until a keyboard user reaches it. */
.lib-skip { position: absolute; left: 8px; top: -60px; z-index: 10; padding: 10px 16px; background: #fff; color: var(--link); font-weight: 600; border: 2px solid var(--link); }
.lib-skip:focus { top: 8px; }

/* The top bar and the page frame of the app's public pages, copied from public/app/app.css (.public-page, .public-topbar, .brand, .public-nav-link) and
   public/css/styles.css + app.css (.select), with the effective values the app gives them (the app's #app-root rules make links outline 3px and
   selects 16px with the padding set inline on the select). Keep in step with those rules. */
.public-page { display: flex; flex-direction: column; min-height: 100vh; }
.public-topbar { display: flex; align-items: center; justify-content: space-between; padding: 12px 24px; background: white; border-bottom: 1px solid #a2a9b1; flex-shrink: 0; line-height: normal; font-size: 16px; font-weight: 400; color: #444455; }
.public-topbar .brand { display: flex; align-items: center; gap: 8px; font-weight: 500; font-size: 16px; color: #334450; text-decoration: none; }
.public-topbar nav { display: flex; align-items: center; gap: 4px; }
.public-topbar .public-nav-link { text-decoration: none; color: #334450; font-weight: 500; font-size: 16px; border-radius: 8px; padding: 6px 8px; white-space: nowrap; }
.public-topbar .public-nav-link:hover { background-color: #cccccc; color: #1967d4; }
.public-topbar a:focus-visible { outline: 3px solid #1967d4; outline-offset: 2px; }
.brand-logo { height: 28px; width: auto; max-width: none; display: block; flex-shrink: 0; }
.public-topbar .select {
  -webkit-appearance: none; appearance: none;
  box-sizing: border-box; width: 68px; min-width: 0; height: auto; margin: 0 0 0 12px; padding: 4px 22px 4px 8px;
  font-family: 'Roboto Flex', sans-serif; font-size: 16px; line-height: normal; color: rgb(60, 80, 100);
  border: 2px solid #cccccc; border-radius: 8px; outline: none; cursor: pointer;
  background-color: white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23556666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 12px 8px;
}
.public-topbar .select:focus { border-color: #1967d4; box-shadow: 0px 2px 4px #ccccdd; }

/* A circuit-board section: the board is an <img> behind the content (so the ones below the fold load lazily), over the section's own color. */
.lib-hero, .lib-band { position: relative; isolation: isolate; overflow: clip; }
.lib-board { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; max-width: none; object-fit: cover; pointer-events: none; }
/* A tall section's board: a layer as high as the window that stays in view while the section scrolls (overflow: clip, not hidden, so the sticky still works). */
.lib-board-wrap { position: absolute; inset: 0; z-index: -1; overflow: clip; pointer-events: none; }
.lib-board-wrap .lib-board { position: sticky; top: 0; z-index: auto; display: block; inset: auto; height: 100vh; min-height: 480px; }

/* The banner of the public pages: green, notched corners, with a light panel over the traces. */
.lib-hero {
  margin: 20px 24px 0;
  padding: 44px 24px;
  text-align: center;
  background: var(--green);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  border-top-left-radius: 0;
  border-bottom-right-radius: 0;
}
.lib-hero-panel { max-width: 880px; margin: 0 auto; padding: 14px 16px; }
.lib-hero h1 { margin: 0; font-size: 34px; line-height: 1.2; font-weight: 600; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.28); }
.lib-lead { margin: 12px 0 0; font-size: 19px; line-height: 1.5; color: #e8ecf5; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.28); }
.lib-meta { margin: 12px 0 0; font-size: 14.5px; color: #e8ecf5; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.28); }
.lib-meta a { color: #fff; }

.lib-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.lib-wrap-article { padding-bottom: 40px; }

.lib-breadcrumb { margin: 16px 0 14px; font-size: 14px; }
.lib-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 2px 0; margin: 0; padding: 0; list-style: none; color: var(--muted); }
.lib-breadcrumb li + li::before { content: '\203A'; margin: 0 8px; color: var(--muted); }
.lib-breadcrumb [aria-current] { color: var(--muted); }

/* Expand all / collapse all (shown by library.js; without script the panels still open one by one). */
.lib-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 10px; margin: 0 0 16px; }
.lib-toolbar button { padding: 7px 16px; font: inherit; font-size: 15px; font-weight: 600; color: var(--link); background: #fff; border: 1px solid var(--link); border-radius: 8px; cursor: pointer; }
.lib-toolbar button:hover { background: #eef3fb; }
.lib-status { font-size: 14px; color: var(--muted); }

/* The library page: one section per group, each over its own board. */
.lib-band { margin-top: 28px; padding: 44px 24px 48px; }
.lib-band-green { background: var(--green); }
.lib-band-blue { background: var(--blue); }
.lib-band-gray { background: var(--page); }
.lib-band-inner { position: relative; max-width: 920px; margin: 0 auto; }
.lib-group-head { margin: 0 0 22px; padding: 14px 24px; text-align: center; }
.lib-band-green .lib-group-head, .lib-band-blue .lib-group-head {
  background: rgba(255, 255, 255, 0.94);
  border-radius: var(--radius);
  border-top-left-radius: 0;
  border-bottom-right-radius: 0;
}
.lib-group-head h2 { margin: 0; font-size: 27px; line-height: 1.25; font-weight: 600; color: var(--heading); }
.lib-group-head p { margin: 6px 0 0; color: var(--text); }
.lib-panels { display: grid; gap: 12px; }

.lib-panel {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  border-top-left-radius: 0;
  border-bottom-right-radius: 0;
  box-shadow: 0 2px 8px rgba(13, 27, 42, 0.12);
  scroll-margin-top: 16px;
}
.lib-panel[open] { box-shadow: 0 6px 18px rgba(13, 27, 42, 0.2); }
.lib-panel summary {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 20px;
  grid-template-rows: auto auto;
  column-gap: 16px;
  align-items: center;
  padding: 16px 18px;
  list-style: none;
  cursor: pointer;
  border-radius: inherit;
}
.lib-panel summary::-webkit-details-marker { display: none; }
.lib-panel summary:hover { background: #f6faf7; }
.lib-panel-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--green-dark); background: #e4f1e9; border-radius: 50%; flex: none; }
.lib-panel summary .lib-panel-icon { grid-row: 1 / span 2; grid-column: 1; }
.lib-panel summary h3 { grid-column: 2; margin: 0; font-size: 18.5px; line-height: 1.35; font-weight: 600; color: var(--heading); }
.lib-panel-desc { grid-column: 2; font-size: 15px; line-height: 1.5; color: var(--muted); }
.lib-chevron { grid-column: 3; grid-row: 1 / span 2; width: 10px; height: 10px; justify-self: center; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform 0.2s ease; }
.lib-panel[open] .lib-chevron { transform: rotate(-135deg); }
.lib-panel-body { padding: 4px 22px 22px 78px; }
.lib-panel-body h4 { margin: 20px 0 6px; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.lib-panel-body .lib-summary { margin: 0; }

/* Smooth open and close where the browser can animate a details element; elsewhere it simply opens. */
@media (prefers-reduced-motion: no-preference) {
  :root { interpolate-size: allow-keywords; }
  .lib-panel::details-content { block-size: 0; overflow: hidden; transition: block-size 0.28s ease, content-visibility 0.28s allow-discrete; }
  .lib-panel[open]::details-content { block-size: auto; }
  .lib-panel[open] .lib-panel-body { animation: lib-fade 0.3s ease; }
  html { scroll-behavior: smooth; }
}
@keyframes lib-fade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.lib-checks { margin: 0 0 6px; padding: 0; list-style: none; }
.lib-checks li { position: relative; margin: 7px 0; padding-left: 28px; }
.lib-checks li::before { content: ''; position: absolute; left: 4px; top: 0.5em; width: 6px; height: 11px; border-right: 2.5px solid var(--green-dark); border-bottom: 2.5px solid var(--green-dark); transform: rotate(40deg); }
.lib-qa { margin: 0; }
.lib-qa dt { margin: 14px 0 2px; font-weight: 700; color: var(--heading); }
.lib-qa dd { margin: 0; }
.lib-readmore { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 22px 0 0; }
.lib-readmore a { display: inline-block; padding: 10px 20px; font-weight: 600; color: #fff; text-decoration: none; background: var(--link); border-radius: 8px; }
.lib-readmore a:hover { background: #0f4a9c; }
.lib-card-meta { font-size: 13.5px; color: var(--muted); }

/* A topic page */
.lib-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 32px; align-items: start; }
.lib-toc { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow: auto; padding: 16px 18px; background: #fff; border: 1px solid var(--soft-border); border-radius: 10px; font-size: 14.5px; line-height: 1.45; }
.lib-toc h2 { margin: 0 0 8px; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.lib-toc ol { margin: 0; padding-left: 20px; }
.lib-toc li { margin: 6px 0; }
.lib-toc a { text-decoration: none; }
.lib-toc a:hover { text-decoration: underline; }

.lib-article { max-width: calc(72ch + 80px); padding: 30px 40px 32px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); border-top-left-radius: 0; border-bottom-right-radius: 0; box-shadow: 0 2px 8px rgba(13, 27, 42, 0.1); }
.lib-article .lib-summary { margin: 0 0 8px; padding: 14px 18px; font-size: 18.5px; line-height: 1.6; background: var(--green-tint); border-left: 5px solid #3f8a5f; border-radius: 0 8px 8px 0; }
.lib-article h2 { margin: 38px 0 10px; font-size: 25px; line-height: 1.3; color: var(--heading); }
.lib-article h3 { margin: 24px 0 6px; font-size: 19px; line-height: 1.35; color: var(--heading); }
.lib-article p { margin: 0 0 14px; }
.lib-article ul, .lib-article ol { margin: 0 0 16px; padding-left: 26px; }
.lib-article li { margin: 5px 0; }
.lib-article li > ul, .lib-article li > ol { margin: 6px 0 4px; }
.lib-article code { padding: 1px 5px; font-family: Consolas, 'Courier New', monospace; font-size: 0.9em; background: #eceff1; border-radius: 4px; overflow-wrap: anywhere; }
.lib-article pre { margin: 0 0 18px; padding: 14px 16px; overflow-x: auto; font-size: 14.5px; line-height: 1.5; background: #1f2a33; color: #e8edf1; border-radius: 8px; }
.lib-article pre code { padding: 0; background: none; color: inherit; overflow-wrap: normal; }
.lib-article blockquote { margin: 0 0 16px; padding: 4px 18px; color: var(--muted); border-left: 4px solid var(--soft-border); }
.lib-article table { width: 100%; margin: 0 0 18px; border-collapse: collapse; font-size: 15.5px; line-height: 1.5; }
.lib-article th, .lib-article td { padding: 8px 10px; text-align: left; vertical-align: top; border: 1px solid var(--soft-border); }
.lib-article th { background: #eef0f2; }
.lib-article dl { margin: 0 0 16px; }
.lib-article dt { margin-top: 16px; font-weight: 700; color: var(--heading); scroll-margin-top: 16px; }
.lib-article dd { margin: 2px 0 0; }
.lib-article .lib-note { margin: 0 0 16px; padding: 12px 16px; background: #fff8e5; border-left: 5px solid #d9a400; border-radius: 0 8px 8px 0; }
.lib-article a { overflow-wrap: anywhere; }

/* Key takeaways: a callout. */
.lib-takeaways { margin: 38px 0 0; padding: 18px 24px 10px; background: var(--green-tint); border: 1px solid #b9d7c5; border-left: 5px solid var(--green-dark); border-radius: 0 10px 10px 0; }
.lib-article .lib-takeaways h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 21px; color: var(--green-dark); }
.lib-takeaways .lib-icon { flex: none; }
.lib-faq-item { margin: 0 0 12px; padding: 12px 18px 4px; background: #f7f8f9; border: 1px solid var(--soft-border); border-left: 4px solid var(--blue); border-radius: 0 8px 8px 0; }
.lib-article .lib-faq-item h3 { margin: 0 0 6px; font-size: 17.5px; }
.lib-howfits { margin: 38px 0 0; padding: 16px 22px 6px; font-size: 16px; background: #eef3fb; border: 1px solid #c4d3ea; border-left: 5px solid var(--blue); border-radius: 0 10px 10px 0; }
.lib-article .lib-howfits h2 { margin: 0 0 8px; font-size: 20px; }
.lib-references { font-size: 15.5px; }
.lib-references li { overflow-wrap: anywhere; }
.lib-reviewed { margin: 28px 0 0; padding-top: 14px; font-size: 14px; color: var(--muted); border-top: 1px solid var(--soft-border); }

/* Related topics: cards on a gray board. */
.lib-related { margin-top: 12px; padding-bottom: 40px; }
.lib-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.lib-card { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); border-top-left-radius: 0; border-bottom-right-radius: 0; box-shadow: 0 2px 8px rgba(13, 27, 42, 0.1); }
.lib-card h3 { margin: 0 0 4px; font-size: 17px; line-height: 1.35; }
.lib-card h3 a { color: var(--heading); text-decoration: none; }
.lib-card h3 a:hover { color: var(--link); text-decoration: underline; }
.lib-card p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.lib-back { margin: 22px 0 0; text-align: center; font-weight: 600; }

/* The footer of the app's public pages (copied from public/app/app.css: .marketing-footer, .marketing-footer-full, .marketing-footer-links). */
.marketing-page { flex: 1; background: var(--page); }
.marketing-footer { display: flex; justify-content: center; gap: 20px; padding: 24px; font-size: 14px; line-height: normal; color: #334450; }
.marketing-footer a { color: #1967d4; text-decoration: none; }
.marketing-footer a:hover { text-decoration: underline; }
.marketing-footer-full { flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.marketing-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; font-weight: 600; }
.marketing-footer .lib-disclaimer { max-width: 760px; margin: 0; line-height: 1.5; color: var(--muted); }

@media (max-width: 960px) {
  .lib-layout { grid-template-columns: 1fr; gap: 20px; }
  .lib-toc { position: static; max-height: none; }
  .lib-article { max-width: none; }
}
@media (max-width: 600px) {
  body { font-size: 16.5px; }
  .lib-hero { margin: 14px 12px 0; padding: 20px 12px; }
  .lib-hero-panel { padding: 18px 16px; }
  .lib-hero h1 { font-size: 26px; }
  .lib-lead { font-size: 17px; }
  .lib-wrap { padding: 0 12px; }
  .lib-band { padding: 30px 12px 34px; }
  .lib-group-head { padding: 12px 14px; }
  .lib-group-head h2 { font-size: 23px; }
  .lib-panel summary { grid-template-columns: 38px minmax(0, 1fr) 16px; column-gap: 12px; padding: 14px 12px; }
  .lib-panel-icon { width: 38px; height: 38px; }
  .lib-panel summary h3 { font-size: 17px; }
  .lib-panel-body { padding: 2px 16px 18px; }
  .lib-article { padding: 18px 16px 22px; }
  .lib-article h2 { font-size: 22px; }
  .lib-article .lib-summary { font-size: 17.5px; }
}

/* Search: a large rounded box in the banner (it is a plain GET form; library.js makes it live). The ring is on the box so the focus is easy to see. */
.lib-search { max-width: 420px; margin: 4px auto 12px; text-align: center; }
.lib-search label { display: block; margin: 0 0 4px; font-size: 14px; font-weight: 600; color: var(--heading); }
.lib-search-box { display: flex; align-items: center; gap: 8px; padding: 3px 4px 3px 12px; background: #fff; border: 2px solid var(--border); border-radius: 999px; transition: box-shadow 0.15s ease, border-color 0.15s ease; }
.lib-search-box:focus-within { border-color: var(--link); box-shadow: 0 0 0 4px rgba(25, 89, 184, 0.28); }
.lib-search-icon { flex: none; width: 18px; height: 18px; color: var(--muted); }
.lib-search input { flex: 1; min-width: 0; padding: 6px 0; font: inherit; font-size: 15px; text-align: left; color: var(--text); background: transparent; border: 0; outline: 0; -webkit-appearance: none; appearance: none; }
.lib-search input::placeholder { color: #66737e; opacity: 1; }
.lib-search input::-webkit-search-cancel-button, .lib-search input::-webkit-search-decoration { -webkit-appearance: none; display: none; }
.lib-clear { display: flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; padding: 0; color: var(--text); background: #eef0f2; border: 0; border-radius: 50%; cursor: pointer; }
.lib-clear:hover { background: #dde2e6; }
.lib-search-go { flex: none; padding: 6px 16px; font: inherit; font-size: 14px; font-weight: 600; color: #fff; background: var(--link); border: 0; border-radius: 999px; cursor: pointer; }
.lib-search-go:hover { background: #0f4a9c; }
.lib-count { min-height: 1.5em; margin: 8px 4px 0; font-size: 14px; color: var(--text); }
.lib-count .lib-clear-link { margin-left: 8px; font-weight: 600; }
.lib-search-hint { margin: 2px 4px 0; font-size: 13px; color: var(--muted); }
.lib-article mark, .lib-panel mark { padding: 0 2px; color: inherit; background: #ffe58a; border-radius: 3px; }
.lib-snippet { margin: 0 0 14px; padding: 8px 12px; font-size: 15px; line-height: 1.5; background: #fffbea; border-left: 4px solid #e5b800; border-radius: 0 6px 6px 0; }
.lib-empty { max-width: 760px; margin: 24px auto 8px; padding: 18px 24px 8px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); border-top-left-radius: 0; border-bottom-right-radius: 0; box-shadow: 0 2px 8px rgba(13, 27, 42, 0.1); }
.lib-empty p { margin: 0 0 8px; }
.lib-empty ul { margin: 0 0 10px; padding-left: 22px; }
.lib-empty li { margin: 4px 0; }
.marketing-footer { background: var(--page); }
@media (max-width: 600px) {
  .lib-search input { font-size: 16px; }
  .lib-search-go { padding: 9px 16px; }
  .lib-search-box { padding-left: 12px; }
}

/* On paper: the article only, links followed by their addresses, nothing the reader cannot use. */
@media print {
  body { font-size: 11pt; background: #fff; color: #000; }
  .lib-skip, .public-topbar, .lib-toc, .marketing-footer-links, .lib-breadcrumb, .lib-related, .lib-toolbar, .lib-search, .lib-board { display: none; }
  .lib-hero, .lib-band { margin: 0 0 10pt; padding: 0; background: none; border: 0; text-align: left; box-shadow: none; }
  .lib-hero-panel, .lib-group-head { padding: 0; background: none; border: 0; box-shadow: none; }
  .lib-hero h1 { font-size: 22pt; }
  .lib-wrap { max-width: none; padding: 0; }
  .lib-layout { display: block; }
  .lib-article, .lib-panel { max-width: none; padding: 0; border: 0; border-radius: 0; box-shadow: none; }
  .lib-article h2, .lib-article h3 { break-after: avoid; }
  .lib-article pre, .lib-article table, .lib-faq-item, .lib-takeaways { break-inside: avoid; }
  .lib-summary, .lib-takeaways, .lib-howfits, .lib-faq-item { background: none; }
  .lib-article a { color: #000; }
  .lib-article a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; overflow-wrap: anywhere; }
  .lib-panel-body { padding: 0; }
  .lib-readmore a { color: #000; background: none; padding: 0; }
}

/* The cookie and analytics banner (public/js/consent.js): a bar at the bottom of the public pages, shown only when analytics is switched on and the visitor has not chosen yet. */
.consent-bar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 3000;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px;
    padding: 14px 20px;
    background: #ffffff; color: #1d2530;
    border-top: 2px solid #4470af; box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.12);
    font-size: 15px; line-height: 1.45;
}
.consent-bar p { margin: 0; max-width: 760px; }
.consent-bar a { color: #4470af; font-weight: 600; text-decoration: underline; }
.consent-buttons { display: flex; gap: 10px; flex: 0 0 auto; }
.consent-buttons button {
    min-width: 96px; padding: 9px 18px; font: inherit; font-weight: 600; cursor: pointer;
    border: 2px solid #4470af; border-radius: 10px 2px 10px 2px;
}
.consent-accept { background: #4470af; color: #ffffff; }
.consent-decline { background: #ffffff; color: #4470af; }
.consent-buttons button:focus-visible { outline: 3px solid #6bab84; outline-offset: 2px; }
@media (max-width: 640px) { .consent-bar { padding: 12px 16px; } .consent-buttons { width: 100%; } .consent-buttons button { flex: 1; } }