/* NM24 — Aussehen der Analyse-Anzeige
   =====================================
   Etappe A des Bauplans "EINE Anzeige fuer beide Werkzeuge", 2026-08-06.

   WOERTLICHER AUSZUG aus der Live-Seite des Business Ateliers (BN-V376).
   Keine Regel veraendert, keine hinzuerfunden.

   🔴 DIE WERTE OBEN MUESSEN MIT: Die Regeln benutzen 36 Farb- und Masswerte,
      und KEINER davon ist in der Education Factory definiert. Ohne sie saehe
      die Anzeige nicht anders aus, sondern kaputt.

   🔴 LADEORT: ans ENDE. Im Business Atelier gewinnt die spaetere von zwei
      Regeln — dort stehen 92 Stilbloecke. Wer diese Datei nach vorne zieht,
      verliert gegen alles, was danach kommt. Siehe L123.

   ‼️ Etappe A aendert NICHTS am Business Atelier. Diese Datei wird zunaechst
      ausschliesslich von der Education Factory geladen. Das freigegebene
      Werkzeug kommt zuletzt dran (Etappe D).
*/

:root {
  --bg-soft: var(--nm-bg-soft);
  --blue: var(--nm-blue);
  --blue-dark: var(--nm-blue);
  --blue-light: var(--nm-blue-light);
  --gray-100: var(--nm-blue-50);
  --gray-200: var(--nm-blue-100);
  --gray-300: var(--nm-blue-200);
  --gray-500: var(--nm-blue-400);
  --gray-700: var(--nm-blue-500);
  --gray-900: var(--nm-blue-900);
  --mint: var(--nm-mint);
  --nm-bg-soft: #E9F4FF;
  --nm-blue: #002060;
  --nm-blue-100: #DCE7F2;
  --nm-blue-200: #B7CADD;
  --nm-blue-400: #6F86A8;
  --nm-blue-50: #F0F5FB;
  --nm-blue-500: #4F6688;
  --nm-blue-700: #2C436A;
  --nm-blue-900: #002060;
  --nm-blue-light: #1a3a7a;
  --nm-border-soft: #C8DAEF;
  --nm-cyan: #3B82F6;
  --nm-error: #dc2626;
  --nm-mint: #3B82F6;
  --nm-radius-lg: 20px;
  --nm-radius-md: 16px;
  --nm-shadow: 0 4px 12px rgba(0,32,96,0.08);
  --nm-success: #16a34a;
  --nm-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --nm-white: #ffffff;
  --radius-lg: var(--nm-radius-lg);
  --radius-sm: var(--nm-radius-md);
  --shadow-sm: var(--nm-shadow);
  --transition: var(--nm-transition);
  --white: var(--nm-white);
}
/* [2026-08-07] `.app` ist hier HERAUSGENOMMEN. Im Business Atelier ist das ein
   Analyse-Behaelter, in der Education Factory aber der Hauptbehaelter der ganzen
   Seite. `overflow-x: hidden` machte ihn zum Scroll-Behaelter — und damit klebten
   Kopf- und Fusszeile an einem Behaelter, der selbst nicht scrollt. Sie wanderten
   beim Scrollen einfach mit hinaus (Torsten, 07.08.).
   `max-width` bleibt: das begrenzt die Breite, ohne einen Scroll-Behaelter zu
   erzeugen. */
.app { max-width: 100%; }
.stage-content, .workspace, .center, .center-inner,
  .welcome-wrap, .wizard-wrap, .doc-display {
    max-width: 100%;
    overflow-x: hidden;
  }
.doc-display * { max-width: 100%; }
.doc-display pre, .doc-display code { word-break: break-word; white-space: pre-wrap; }
.btn {
    padding: 10px 16px; font-size: 13.5px; font-weight: 600;
    border: 1px solid var(--gray-300); background: var(--bg-soft);
    color: var(--gray-700); border-radius: var(--radius-sm); cursor: pointer;
    font-family: inherit; transition: var(--transition);
  }
.btn:hover:not(:disabled) { border-color: var(--blue); color: var(--blue); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-primary {
    background: var(--blue); color: var(--white); border-color: var(--blue);
  }
.btn-primary:hover:not(:disabled) { background: var(--blue-dark); border-color: var(--blue-dark); color: var(--white); }
.btn-pause { background: transparent; color: var(--gray-500); }
.billy-tip { font-size: 15px !important; line-height: 1.45 !important; min-height: 95px !important; }
.hero { text-align: left; padding: 39px 0 14px; display: flex; align-items: center; gap: 18px; }
.hero .billy-hero { margin: 0 !important; flex-shrink: 0; }
.hero .hero-title { margin: 0 !important; flex: 1; }
.hero-greet { display: none; }
.hero-title { font-size: 19px; font-weight: 700; margin-bottom: 0; color: var(--gray-900); letter-spacing: -0.3px; }
.hero-text { display: none; }
.chat-msg.assistant .bubble .doc-display { padding: 0 3px; border: none; box-shadow: none; background: transparent; margin: 0; font-size: 13.5px; }
.chat-msg.assistant .bubble .doc-display h1,
  .chat-msg.assistant .bubble .doc-display h2,
  .chat-msg.assistant .bubble .doc-display h3,
  .chat-msg.assistant .bubble .doc-display h4 { margin-top: 8px; margin-bottom: 4px; font-size: 13.5px; padding: 0; border: none; }
.chat-msg.assistant .bubble .doc-display p { margin-bottom: 6px; }
.chat-msg.assistant .bubble .doc-display ul, .chat-msg.assistant .bubble .doc-display ol { margin: 4px 0 8px; padding-left: 18px; }
.chat-msg.assistant .bubble .doc-display table { font-size: 12.5px; }
.loader-spinner {
    width: 36px; height: 36px;
    border: 3px solid var(--gray-200); border-top-color: var(--blue);
    border-radius: 50%; animation: spin 0.7s linear infinite;
  }
.doc-display {
    background: var(--bg-soft);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius-lg);
    padding: 28px 32px;
    margin-top: 14px;
    line-height: 1.7;
    color: var(--gray-900);
    box-shadow: var(--shadow-sm);
    font-size: 13.5px;
    overflow-wrap: break-word;
  }
.doc-display > *:first-child { margin-top: 0 !important; }
.doc-display > *:last-child { margin-bottom: 0 !important; }
.doc-display h1, .doc-display > h2:first-child {
    font-size: 26px; font-weight: 800; color: var(--mint);
    letter-spacing: -0.4px;
    margin: 32px 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--mint);
    text-transform: none;
  }
.doc-display.doc-display-podcast h1,
  .doc-display.doc-display-podcast > h2:first-child,
  .doc-display.doc-display-podcast h2 {
    color: var(--blue) !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    font-weight: 700;
  }
.doc-display.doc-display-podcast h2 { font-size: 22px; margin: 36px 0 14px; }
.doc-display > h1:first-child, .doc-display > h2:first-child { margin-top: 0; }
.doc-display h2 {
    font-size: 19px; font-weight: 700; color: var(--blue);
    margin: 36px 0 12px; letter-spacing: -0.2px;
    text-transform: none;
  }
.doc-display h3 {
    font-size: 16.5px; font-weight: 700; color: var(--gray-900);
    margin: 28px 0 10px;
    text-transform: none;
  }
.doc-display h4 {
    font-size: 13.5px; font-weight: 700; color: var(--gray-900);
    margin: 22px 0 8px;
    text-transform: none; letter-spacing: 0;
  }
.doc-display p { margin: 0 0 12px; line-height: 1.7; color: var(--gray-700); }
.doc-display strong { color: var(--gray-900); font-weight: 700; }
.doc-display em { font-style: italic; color: var(--gray-700); }
.doc-display a {
    color: var(--blue); text-decoration: underline;
    text-decoration-color: rgba(0,32,96,0.3);
    text-underline-offset: 2px;
  }
.doc-display a:hover { text-decoration-color: var(--blue); }
.doc-display ul, .doc-display ol {
    margin: 8px 0 14px; padding-left: 24px;
    color: var(--gray-700);
  }
.doc-display li { margin-bottom: 6px; line-height: 1.65; }
.doc-display li > p { margin: 4px 0; }
.doc-display li::marker { color: var(--blue); font-weight: 700; }
.doc-display ul ul, .doc-display ol ol, .doc-display ul ol, .doc-display ol ul { margin: 6px 0; }
.doc-display blockquote {
    background: linear-gradient(90deg, rgba(0,32,96,0.04), transparent);
    border-left: 3px solid var(--blue);
    padding: 10px 16px; margin: 14px 0;
    border-radius: 0 8px 8px 0;
    color: var(--gray-700); font-style: italic;
  }
.doc-display blockquote p { margin: 0; }
.doc-display table {
    width: 100%; border-collapse: collapse;
    margin: 14px 0; font-size: 13.5px;
    border: 1px solid #C8DAEF;
    border-radius: var(--radius-sm); overflow: hidden;
  }
.doc-display th, .doc-display td {
    text-align: left; padding: 10px 14px;
    border-bottom: 1px solid #C8DAEF;
    vertical-align: top;
  }
.doc-display th,
  .doc-display thead th,
  .doc-display thead tr th {
    background: var(--nm-blue) !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    font-size: 12.5px; letter-spacing: 0.3px;
    border-bottom: 1px solid var(--nm-blue);
    text-transform: none;
  }
.doc-display th *, .doc-display thead th * {
    color: #ffffff !important;
  }
.doc-display thead tr:nth-child(even) th { background: var(--nm-blue) !important; }
.doc-display tr:last-child td { border-bottom: none; }
.doc-display tbody tr:nth-child(even) td { background: #F0F7FF; }
.doc-display code {
    background: var(--gray-100);
    padding: 2px 6px; border-radius: 4px;
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 0.92em; color: var(--blue);
  }
.doc-display pre {
    background: var(--gray-900); color: var(--gray-100);
    padding: 14px 18px; border-radius: var(--radius-sm);
    margin: 14px 0; overflow-x: auto; font-size: 13px;
    line-height: 1.55;
  }
.doc-display pre code { background: transparent; color: inherit; padding: 0; }
.doc-display hr {
    border: none; border-top: 1px solid var(--gray-200);
    margin: 22px 0;
  }
.doc-display img { max-width: 100%; height: auto; border-radius: var(--radius-sm); }
.acc-controls {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 18px;
    margin-bottom: 8px;
  }
.acc-controls .btn-mini {
    padding: 6px 10px;
    font-size: 12px;
    background: transparent;
    border: 1px solid var(--gray-300);
    color: var(--gray-700);
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.15s, color 0.15s;
  }
.acc-controls .btn-mini:hover { border-color: var(--blue); color: var(--blue); }
.result-accordion {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
.acc-header {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: var(--blue);
    border: none;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    transition: background 0.18s, color 0.18s;
  }
.acc-header:hover { background: var(--blue-light); }
.acc-section.open .acc-header {
    background: var(--blue-light);  /* 2026-05-18: war --mint (Cyan), jetzt NM24-mittel-blau */
    color: #fff;
    border-bottom: none;
  }
.acc-section.open .acc-header:hover { background: var(--blue-light); filter: brightness(1.10); }
.acc-chevron {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s;
    color: #002060;  /* 2026-05-18: war weiß für dunkelblauen Header, jetzt dunkel für hellblauen Header */
    font-size: 12px;
  }
.acc-section.open .acc-chevron { transform: rotate(90deg); color: #fff; }
.acc-title { flex: 1; line-height: 1.35; }
.acc-pin {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
    color: #002060;  /* 2026-05-18: war weiß, jetzt dunkel für hellblauen Header */
    transition: color 0.15s, transform 0.15s;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
.acc-pin svg { width: 20px; height: 20px; display: block; }
.acc-pin:hover { transform: scale(1.15); }
.acc-info-icon {
    flex-shrink: 0;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(0,32,96,0.10);  /* 2026-05-18: war weiß für dunklen Header, jetzt dunkel für hellen Header */
    color: #002060;
    border: 1.5px solid rgba(0,32,96,0.50);
    font-size: 11px;
    font-weight: 700;
    font-style: italic;
    font-family: Georgia, serif;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-right: 6px;
    transition: background 0.15s, border-color 0.15s, transform 0.15s;
    user-select: none;
  }
.acc-info-icon:hover { background: rgba(0,32,96,0.20); border-color: #002060; transform: scale(1.1); }
.acc-pin { color: #002060; opacity: 0.7; }
.acc-pin.pinned { color: #002060; opacity: 1; background: rgba(0,32,96,0.12); border-radius: 8px; }
.acc-section.open .acc-pin { color: #fff; opacity: 0.85; background: transparent; border: none; }
.acc-section.open .acc-pin.pinned { color: #fff; opacity: 1; background: rgba(255,255,255,0.22); border-radius: 8px; }
.bn-light-bg .acc-pin, .acc-pin.acc-pin-on-light { color: #002060; opacity: 0.7; }
.bn-light-bg .acc-pin.pinned, .acc-pin.acc-pin-on-light.pinned { color: #002060; opacity: 1; background: rgba(0,32,96,0.10); border-radius: 8px; }
.acc-star-btn {
    width: 32px; height: 32px;
    background: transparent; border: none; cursor: pointer;
    color: rgba(255,255,255,0.55);
    padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    border-radius: 8px;
    transition: color 0.15s, transform 0.15s;
  }
.acc-star-btn:hover { color: var(--mint); transform: scale(1.12); }
.acc-star-btn.is-collected svg { fill: var(--mint); stroke: var(--mint); }
.acc-star-btn.is-collected { color: var(--mint); }
.acc-section.open .acc-star-btn { color: rgba(255,255,255,0.75); }
.acc-section.open .acc-star-btn:hover { color: #fff; }
.acc-section.open .acc-star-btn.is-collected svg { fill: #fff; stroke: #fff; }
.acc-star-btn svg { width: 18px; height: 18px; display: block; }
.acc-body {
    max-height: 0;
    opacity: 0;
    padding: 0 24px;
    background: var(--bg-soft);
    color: var(--nm-blue) !important;
    text-align: justify;
    font-size: 14px;
    line-height: 1.65;
    overflow: hidden;
    transition:
      max-height 2.0s cubic-bezier(0.22, 1, 0.36, 1),
      opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1),
      padding-top 2.0s cubic-bezier(0.22, 1, 0.36, 1),
      padding-bottom 2.0s cubic-bezier(0.22, 1, 0.36, 1);
  }
.acc-section.open .acc-body {
    max-height: 8000px;
    opacity: 1;
    padding: 22px 24px 22px;
  }
.acc-header { transition: background 0.6s ease, color 0.6s ease; }
.acc-chevron { transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1); }
.acc-pin, .acc-note-btn, .acc-star-btn, .bn-coll-remove-btn {
    transition: color 0.5s ease, transform 0.5s ease, background 0.5s ease;
  }

@media (prefers-reduced-motion: reduce) {
.acc-body { transition: none; }
.acc-header, .acc-chevron, .acc-pin, .acc-note-btn, .acc-star-btn { transition: none; }
}
.acc-body h1, .acc-body h2, .acc-body h3, .acc-body h4, .acc-body h5, .acc-body h6 {
    font-size: inherit !important;
    font-weight: 700 !important;
    color: var(--nm-blue) !important;
    line-height: 1.4 !important;
    margin: 16px 0 8px !important;
    padding: 0 !important;
  }
.acc-body h1:first-child, .acc-body h2:first-child, .acc-body h3:first-child {
    margin-top: 0 !important;
  }
.acc-body h3 { font-size: 14.5px !important; }
.acc-body h4 { font-size: 13px !important; padding-left: 18px !important; }
.acc-body h5, .acc-body h6 { padding-left: 36px !important; }
.acc-body p, .acc-body li, .acc-body td, .acc-body th,
  .acc-body strong, .acc-body b, .acc-body em, .acc-body span { color: var(--nm-blue) !important; }
.acc-body p, .acc-body li, .acc-body td, .acc-body th { font-size: 14px !important; line-height: 1.65 !important; }
.acc-body p strong, .acc-body p b,
  .acc-body li strong, .acc-body li b,
  .acc-body td strong, .acc-body td b { font-weight: 400 !important; }
.acc-body p { margin: 0 0 14px 0 !important; }
.acc-body > p:first-of-type { font-weight: 400 !important; }
.acc-body a { color: var(--blue) !important; text-decoration: underline; }
.acc-body hr { display: none !important; }
.acc-body > p[data-level="3"], .acc-body > table[data-level="3"],
  .acc-body > div[data-level="3"], .acc-body > blockquote[data-level="3"] { padding-left: 14px; }
.acc-body > p[data-level="4"], .acc-body > table[data-level="4"],
  .acc-body > div[data-level="4"], .acc-body > blockquote[data-level="4"] { padding-left: 32px; }
.acc-body > p[data-level="5"], .acc-body > p[data-level="6"],
  .acc-body > table[data-level="5"], .acc-body > table[data-level="6"],
  .acc-body > div[data-level="5"], .acc-body > div[data-level="6"],
  .acc-body > blockquote[data-level="5"], .acc-body > blockquote[data-level="6"] { padding-left: 50px; }
.acc-section.acc-section-sources .acc-body {
    background: rgba(0,32,96,0.03);
    border: 1px solid rgba(0,32,96,0.10);
    border-radius: 8px;
    padding: 14px 18px;
    margin-top: 4px;
  }
.acc-section.acc-section-sources .acc-body p,
  .acc-section.acc-section-sources .acc-body li {
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: var(--gray-700) !important;
    text-align: left;
  }
.acc-section.acc-section-sources .acc-body ul,
  .acc-section.acc-section-sources .acc-body ol {
    margin: 0;
    padding-left: 22px;
  }
.acc-section.acc-section-sources .acc-body li { margin-bottom: 8px; }
.acc-section.acc-section-sources .acc-body a {
    color: var(--blue) !important;
    text-decoration: none !important;
    font-weight: 600;
    padding: 1px 7px;
    border: 1px solid var(--blue);
    border-radius: 4px;
    font-size: 11.5px;
    margin-left: 4px;
    white-space: nowrap;
    display: inline-block;
    line-height: 1.4;
  }
.acc-section.acc-section-sources .acc-body a:hover {
    background: var(--blue);
    color: #fff !important;
  }
.acc-body table {
    text-align: left !important;
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
    margin: 12px 0;
  }
.acc-body td, .acc-body th,
  .acc-body td p, .acc-body th p,
  .acc-body td span, .acc-body th span {
    text-align: left !important;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
  }
.acc-body td, .acc-body th { padding: 6px 10px; }
.acc-body th { font-weight: 700; border-bottom: 1px solid rgba(0,32,96,0.2); }
.acc-body td { border-bottom: 1px solid rgba(0,32,96,0.08); }
.acc-body td p { margin: 0 0 4px 0 !important; }
.acc-body ul, .acc-body ol {
    margin: 10px 0 14px 0;
    padding-left: 42px;
    list-style-position: outside;
  }
.acc-body li { margin-bottom: 4px; }
.acc-body > ul[data-level="4"], .acc-body > ol[data-level="4"] { padding-left: 60px; }
.acc-body > ul[data-level="5"], .acc-body > ul[data-level="6"],
  .acc-body > ol[data-level="5"], .acc-body > ol[data-level="6"] { padding-left: 78px; }

@media print {
.acc-section .acc-body { display: block !important; }
.acc-controls, .acc-pin, .refine-sticky { display: none !important; }
}
.acc-section-refine-sub { font-size: 12.5px; color: var(--gray-700); margin-top: -4px; margin-bottom: 8px; line-height: 1.5; font-style: italic; }
.article-card-refine-input::placeholder,
  .refine-input::placeholder,
  .archi-refine-input::placeholder,
  .acc-section-refine-input::placeholder {
    font-style: italic;
    opacity: 0.85;
  }
.acc-section-refine { margin-top: 16px; padding: 0; background: transparent; border: none; }
.acc-section-refine-title { font-size: 13px; font-weight: 600; color: var(--nm-blue); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.acc-section-refine-row { display: flex; gap: 8px; align-items: stretch; }
.acc-section-refine-input {
    flex: 1; padding: 8px 12px; border: 1px solid var(--nm-border-soft); border-radius: 6px;
    font-family: inherit; font-size: 13.5px; line-height: 1.5; resize: none; min-height: 38px; height: 38px;
    background: #C8DAEF; color: var(--nm-blue); outline: none;
  }
.acc-section-refine-input:focus { border-color: var(--nm-blue); background: #C8DAEF; }
.acc-section-refine-btn {
    padding: 0 12px; background: var(--nm-blue); color: #fff; border: none;
    border-radius: 6px; font-family: inherit; font-size: 13px; font-weight: 600;
    cursor: pointer; white-space: nowrap; transition: background 0.15s;
  }
.acc-section-refine-btn:hover:not(:disabled) { background: var(--nm-blue-light); }
.acc-section-refine-btn:disabled { background: var(--nm-blue-400); cursor: not-allowed; }
.acc-section-refine-status { margin-top: 6px; font-size: 12.5px; color: var(--nm-blue-700); min-height: 16px; }
.acc-section-refine-status.active { color: var(--nm-blue); font-weight: 600; }
.acc-section-refine-status.done { color: var(--nm-success); font-weight: 600; }
.acc-section-refine-status.error { color: var(--nm-error); font-weight: 600; }
.posts-grid .btn-copy-post { padding: 8px 14px; background: var(--blue); color: white; border: none; border-radius: 6px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; gap: 6px; }
.btn-copy-post .btn-icon { display: inline-flex; align-items: center; color: var(--nm-cyan); font-size: 14px; }
.post-card-bp summary .btn-icon, .article-card-bp summary .btn-icon, .script-card-bp summary .btn-icon { display: inline-flex; align-items: center; color: var(--nm-blue); font-size: 16px; }
.posts-grid .btn-copy-post:hover { background: var(--blue-light); }
.articles-grid .btn-copy-post { padding: 8px 14px; background: var(--blue); color: white; border: none; border-radius: 6px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; gap: 6px; }
.btn-copy-post .btn-icon { display: inline-flex; align-items: center; color: var(--nm-cyan); font-size: 14px; }
.post-card-bp summary .btn-icon, .article-card-bp summary .btn-icon, .script-card-bp summary .btn-icon { display: inline-flex; align-items: center; color: var(--nm-blue); font-size: 16px; }
.articles-grid .btn-copy-post:hover { background: var(--blue-light); }
.scripts-grid .btn-copy-post { padding: 8px 14px; background: var(--blue); color: white; border: none; border-radius: 6px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; gap: 6px; }
.btn-copy-post .btn-icon { display: inline-flex; align-items: center; color: var(--nm-cyan); font-size: 14px; }
.post-card-bp summary .btn-icon, .article-card-bp summary .btn-icon, .script-card-bp summary .btn-icon { display: inline-flex; align-items: center; color: var(--nm-blue); font-size: 16px; }
.scripts-grid .btn-copy-post:hover { background: var(--blue-light); }
.loader-spinner-small { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--gray-300); border-top-color: var(--blue); border-radius: 50%; animation: spin 0.8s linear infinite; }
.btn-copy-post.bn-copied,
  .post-copy-btn.bn-copied { background: #1F5FA8 !important; color: #ffffff !important; border-color: #1F5FA8 !important; transform: scale(1.04); transition: transform 0.18s ease, background 0.18s ease; }
.doc-display a.post-img-download-btn, a.post-img-download-btn { color: #fff !important; }
#analyseInner.bn-result-first > .bn-intro-header { order: 0; }
.bn-cancel-btn {
    background: #960000 !important; color: #fff !important;
    border: none !important;
    padding: 6px 14px !important;
    border-radius: 6px !important;
    font-size: 13px !important; font-weight: 700 !important;
    cursor: pointer !important; font-family: inherit !important;
    transition: background 0.15s ease, transform 0.12s ease !important;
    line-height: 1.3 !important;
  }
.bn-cancel-btn:hover { background: #b00000 !important; transform: translateY(-1px); }
.bn-cancel-btn-large {
    padding: 11px 24px !important; font-size: 13px !important;
    border-radius: 8px !important;
  }

@media (max-width: 700px) {
.hero-greet { font-size: 11px !important; letter-spacing: 1px !important; margin-bottom: 6px !important; }
.hero-title { font-size: 17px !important; line-height: 1.3 !important; margin-bottom: 8px !important; letter-spacing: -0.2px !important; }
.hero-text { font-size: 12px !important; line-height: 1.55 !important; }
.btn { padding: 9px 16px !important; font-size: 12px !important; }
.btn-copy-post { padding: 7px 12px !important; font-size: 12px !important; }
.btn-primary, .wizard-cta { padding: 12px 20px !important; font-size: 12px !important; }
.acc-controls { gap: 6px !important; margin-top: 14px !important; }
.acc-controls .btn-mini { padding: 5px 9px !important; font-size: 11.5px !important; }
.result-accordion { gap: 5px !important; }
.acc-header { padding: 12px 14px !important; gap: 8px !important; font-size: 13px !important; line-height: 1.3 !important; }
.acc-chevron { width: 16px !important; height: 16px !important; font-size: 11px !important; }
.acc-pin { width: 28px !important; height: 28px !important; }
.acc-pin svg { width: 18px !important; height: 18px !important; }
.acc-body {
      padding: 18px 16px 18px !important;
      font-size: 12px !important;
      line-height: 1.6 !important;
      color: var(--nm-blue) !important;
      text-align: justify !important;
    }
.acc-body p strong, .acc-body p b,
    .acc-body li strong, .acc-body li b,
    .acc-body td strong, .acc-body td b { font-weight: 400 !important; }
.acc-body h1, .acc-body h2, .acc-body h3, .acc-body h4, .acc-body h5, .acc-body h6 {
      font-size: 12px !important;
      font-weight: 700 !important;
      color: var(--nm-blue) !important;
      line-height: 1.4 !important;
    }
.acc-body h1, .acc-body h2 { margin: 0 0 10px !important; padding: 0 !important; }
.acc-body h3 { margin: 14px 0 6px !important; padding: 0 !important; }
.acc-body h4 { margin: 12px 0 5px !important; padding-left: 14px !important; }
.acc-body h5, .acc-body h6 { margin: 10px 0 4px !important; padding-left: 28px !important; }
.acc-body p, .acc-body li, .acc-body td, .acc-body th {
      font-size: 12px !important;
      line-height: 1.6 !important;
      color: var(--nm-blue) !important;
    }
.acc-body p { margin: 0 0 12px 0 !important; }
.acc-body table { font-size: 12px !important; text-align: left !important; table-layout: fixed !important; }
.acc-body td, .acc-body th,
    .acc-body td p, .acc-body th p { text-align: left !important; word-wrap: break-word !important; overflow-wrap: break-word !important; hyphens: auto !important; }
.acc-body td, .acc-body th { padding: 5px 8px !important; font-size: 12px !important; }
.acc-body > p:first-of-type { font-size: 12px !important; font-weight: 400 !important; color: var(--nm-blue) !important; }
.acc-body hr { display: none !important; }
.acc-body > [data-level="3"] { padding-left: 10px !important; }
.acc-body > [data-level="4"] { padding-left: 22px !important; }
.acc-body > [data-level="5"], .acc-body > [data-level="6"] { padding-left: 34px !important; }
.acc-body > [data-level="3"] ul, .acc-body > [data-level="3"] ol,
    .acc-body > [data-level="4"] ul, .acc-body > [data-level="4"] ol,
    .acc-body > [data-level="5"] ul, .acc-body > [data-level="5"] ol { padding-left: 22px !important; }
.billy-tip {
      font-size: 12px !important;
      line-height: 1.45 !important;
      padding: 10px 12px !important;
      min-height: 78px !important;
      border-left-width: 3px !important;
    }
.doc-display table { font-size: 12.5px !important; }
.doc-display { font-size: 12px !important; line-height: 1.55 !important; }
.doc-display h1 { font-size: 19px !important; }
.doc-display h2 { font-size: 17px !important; }
.doc-display h3 { font-size: 15px !important; }
.doc-display { word-wrap: break-word; overflow-wrap: break-word; }
}
.method-card-eyebrow { font-size: 11.5px; }
.method-card-title   { font-size: 15.5px; }
.method-card-body    { font-size: 15.5px; }

@media (max-width: 480px) {
.method-card-eyebrow { font-size: 8.5px !important; color: #002060 !important; }
.method-card-title   { font-size: 12px !important; }
.method-card-body    { font-size: 12px !important; }
}

@media (max-width: 380px) {
.hero-title { font-size: 17px !important; }
}

@media (max-width: 480px) {
.hero-title { font-size: 17px !important; line-height: 1.3 !important; font-weight: 700 !important; }
button, .btn, .btn-primary { font-size: 12px !important; padding: 11px 16px !important; min-height: 40px !important; }
.btn-large { padding: 13px 22px !important; font-size: 14px !important; }
.hero, .stage-hero { padding: 18px 16px !important; }
.billy-tip { font-size: 14px !important; padding: 11px 14px !important; }
.billy-timer-display { font-size: 12px !important; padding: 4px 10px !important; }
.acc-body ul, .acc-body ol {
      padding-left: 28px !important;
      margin: 8px 0 12px !important;
      list-style-position: outside !important;
    }
.acc-body li { margin-bottom: 4px !important; padding-left: 4px !important; }
.acc-body > [data-level="3"] ul, .acc-body > [data-level="3"] ol { padding-left: 32px !important; }
.acc-body > [data-level="4"] ul, .acc-body > [data-level="4"] ol { padding-left: 44px !important; }
.acc-body > [data-level="5"] ul, .acc-body > [data-level="5"] ol,
    .acc-body > [data-level="6"] ul, .acc-body > [data-level="6"] ol { padding-left: 56px !important; }
.acc-header { font-size: 13px !important; line-height: 1.35 !important; font-weight: 700 !important; }
.acc-body { font-size: 12px !important; line-height: 1.6 !important; }
.acc-body h1, .acc-body h2, .acc-body h3,
    .acc-body h4, .acc-body h5, .acc-body h6 { font-size: 12px !important; line-height: 1.4 !important; font-weight: 700 !important; }
.acc-body p, .acc-body li, .acc-body td, .acc-body th { font-size: 12px !important; line-height: 1.6 !important; }
.acc-section.acc-section-sources .acc-body a {
      padding: 6px 12px !important;
      font-size: 12px !important;
      margin-left: 6px !important;
      display: inline-block !important;
      line-height: 1.6 !important;
    }
.acc-section.acc-section-sources .acc-body li { margin-bottom: 12px !important; }
.acc-section-refine { padding: 10px 12px !important; }
.acc-section-refine-title { font-size: 12px !important; margin-bottom: 6px !important; }
.acc-section-refine-row {
      flex-direction: column !important;
      gap: 6px !important;
    }
.acc-section-refine-input {
      font-size: 12px !important;
      padding: 9px 11px !important;
      min-height: 56px !important;
      width: 100% !important;
    }
.acc-section-refine-btn {
      width: 100% !important;
      font-size: 13px !important;
      padding: 10px 14px !important;
      min-height: 40px !important;
    }
.acc-section-refine-status { font-size: 11.5px !important; }
}

@media (max-width: 600px) {
button, .btn, .pill, .qf-pill, .acc-pin, .tab-btn,
  a.btn, a.welcome-btn, .welcome-btn,
  .out-card-cta, .out-card .btn,
  .stage-action-btn, .stage-cta,
  .nm-as-trigger, .header-logout-btn, .menu-btn {
    min-height: 44px;
  }
.acc-body, .module-body, .output-body { font-size: 14.5px; line-height: 1.6; }
.btn, .qf-pill, .pill { word-break: break-word; }
.acc-section .acc-header {
    padding: 13px 14px;
    font-size: 14.5px;
    line-height: 1.35;
    gap: 8px;
  }
.acc-section .acc-header .acc-pin { width: 32px; height: 32px; padding: 4px; }
.acc-section.open .acc-body {
    padding: 14px;
    font-size: 14.5px;
    line-height: 1.65;
  }
}

@media (max-width: 380px) {
.acc-section .acc-header { padding: 11px 12px; font-size: 14px; }
.acc-section.open .acc-body { padding: 12px; }
}

@media (max-width: 600px) {
.wizard-actions .btn,
  .wizard-actions button {
    flex: 1 1 calc(50% - 4px);
    min-height: 48px;
    font-size: 14px !important;
    padding: 12px 14px !important;
  }
.btn-pause { font-size: 13px !important; }
}

@media (max-width: 380px) {
.wizard-actions .btn, .wizard-actions button { font-size: 13.5px !important; padding: 11px 12px !important; }
}

@media (max-width: 600px) {
.posts-grid .post-card-actions button,
  .posts-grid .post-card-actions .btn {
    font-size: 12.5px;
    padding: 8px 10px;
    min-height: 38px;
  }
.acc-body::-webkit-scrollbar,
  .modal-body::-webkit-scrollbar,
  .billy-chat-body::-webkit-scrollbar { width: 0; }
.acc-section .acc-header h2,
  .acc-section .acc-header h3,
  .acc-section .acc-header span,
  .acc-section .acc-header > div {
    word-break: normal;
    overflow-wrap: anywhere;
    hyphens: auto;
  }
}
.btn, .btn-primary, .btn-generate, .save-btn, .action-btn {
  background: #002060 !important;
  color: #fff !important;
}
.btn:hover, .btn-primary:hover, .btn-generate:hover, .save-btn:hover {
  background: #960000 !important;
}
.btn-danger { background: #960000 !important; }
.acc-header, .acc-btn {
  background: #DEE9F7 !important;
  color: #002060 !important;
}
.acc-header:hover, .acc-btn:hover { background: #C8D9EE !important; }
.acc-section.open .acc-header, .acc-section.open .acc-btn {
  background: #002060 !important;
  color: #fff !important;
}
.acc-section.open .acc-chevron,
.acc-section.open .acc-pin,
.acc-section.open .acc-info-icon { color: #fff !important; }
.acc-section.open .acc-info-icon { background: rgba(255,255,255,0.15) !important; border-color: rgba(255,255,255,0.60) !important; }
.acc-body img[src^="data:image"] { max-width: 70%; height: auto; display: block; margin: 12px auto; }
html body .acc-info-icon,
html body .acc-section.open .acc-info-icon,
html body .qf-pill-info,
html body .qf-pill[data-qid="use_case"] button.active .qf-pill-info,
html body .nm24-mock-opt-info,
html body .nm24-mock-opt.active .nm24-mock-opt-info,
html body .nav-item .info-icon,
html body .nav-item.active .info-icon,
html body .nm24-own-info-btn {
  background: #002060 !important;
  color: #ffffff !important;
  border: none !important;
  font-family: Georgia, serif !important;
  font-style: italic !important;
  font-weight: 700 !important;
  border-radius: 50% !important;
}
html body .acc-info-icon:hover,
html body .acc-section.open .acc-info-icon:hover,
html body .qf-pill-info:hover,
html body .nm24-mock-opt-info:hover,
html body .nav-item .info-icon:hover,
html body .nm24-own-info-btn:hover {
  background: #003080 !important;
  color: #ffffff !important;
}
html body .hero-greet {
  color: #960000 !important;
}
html body .output-form .btn.btn-primary {
  background: #002060 !important;
  color: #ffffff !important;
  border: none !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
}
html body .output-form .btn.btn-primary:hover:not([disabled]) {
  background: #003080 !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,32,96,0.25) !important;
}
html body .wizard-actions .btn,
html body .wizard-actions button {
  background:#002060 !important; color:#fff !important; border:1px solid #002060 !important;
}

@media (hover:hover) {
html body .wizard-actions .btn:hover:not(:disabled),
  html body .wizard-actions button:hover:not(:disabled){
    background:#1a4a9e !important; border-color:#1a4a9e !important; color:#fff !important;
  }
}
html body .wizard-actions .btn:active:not(:disabled),
html body .wizard-actions button:active:not(:disabled){
  background:#960000 !important; border-color:#960000 !important; color:#fff !important;
}

@media (max-width:768px) {
html body .bn-intro-header{ padding:16px 18px !important; }
html body .bn-intro-title{ font-size:18px !important; margin:4px 0 8px !important; }
html body .bn-intro-desc{ font-size:12.5px !important; line-height:1.5 !important; }
}

@media (max-width:600px) {
html body .wizard-actions .btn{
    flex:1 1 0 !important; min-width:0 !important; width:auto !important; margin:0 !important;
    min-height:48px !important; padding:11px 6px !important;
    font-size:13.5px !important; white-space:nowrap !important;
  }
html body .hero-title{ font-size:14px !important; line-height:1.35 !important; }
html body .bn-aw-box{ margin-top:20px !important; padding:16px 16px !important; }
html body .bn-aw-box .bn-aw-billywrap{ width:64px !important; height:64px !important; }
html body .bn-aw-box img.bn-aw-billy{ width:56px !important; height:56px !important; }
html body .bn-aw-box .bn-aw-title{ font-size:14px !important; line-height:1.3 !important; }
html body .bn-aw-box .billy-tip{ font-size:14px !important; }
}

@media (max-width:768px) {
html body .bn-intro-title{ font-size:16px !important; line-height:1.3 !important; }
}

@media (max-width:600px) {
#analyseInner .bn-intro-title{ font-size:16px !important; line-height:1.3 !important; }
#analyseInner .bn-intro-desc{ font-size:12.5px !important; line-height:1.5 !important; }
}

@media (max-width:768px) {
html body .bn-intro-title{ font-size:14px !important; line-height:1.3 !important; }
#analyseInner .bn-intro-title{ font-size:14px !important; line-height:1.3 !important; }
html body .bn-intro-eyebrow{ font-size:9.5px !important; letter-spacing:0.8px !important; }
#analyseInner .bn-intro-eyebrow{ font-size:9.5px !important; letter-spacing:0.8px !important; }
}
.bn-actions-more.open .bn-more-list .btn-copy-post{ width:100%; justify-content:flex-start; }
