/* Scoped to ARIA; existing page components retain their styles. */
.bf-aria {
  --aria-bg: #fff; --aria-text: #173044; --aria-muted: #526579;
  --aria-accent: #0f766e; --aria-tint: #edf8f6; --aria-border: #cddfdd;
  width: calc(100% - 32px); max-width: 1200px; margin: 32px auto;
  padding: clamp(20px, 3vw, 36px); border: 1px solid var(--aria-border);
  border-radius: 18px; background: var(--aria-bg); color: var(--aria-text);
  font-family: inherit; line-height: 1.6; scroll-margin-top: 100px;
}
.bf-aria[data-theme="dark"] {
  --aria-bg: #0d1b2e; --aria-text: #f1f5f9; --aria-muted: #b3c2d2;
  --aria-accent: #5eead4; --aria-tint: #163039; --aria-border: #2a4153;
}
.bf-aria[data-theme="gold"] {
  --aria-bg: #111827; --aria-text: #f0ece0; --aria-muted: #c1bba9;
  --aria-accent: #e8c96a; --aria-tint: #2b2930; --aria-border: #51482f;
}
.bf-aria * { box-sizing: border-box; }
.bf-aria .bf-aria-intro { display: flex; align-items: center; gap: 24px; }
.bf-aria .bf-aria-avatar { width: 120px; height: 140px; object-fit: contain; flex-shrink: 0; }
.bf-aria .bf-aria-title { margin: 0; font-family: inherit; font-size: 1.8rem; color: var(--aria-text); }
.bf-aria .bf-aria-subtitle { color: var(--aria-accent); font-size: .86rem; font-weight: 600; }
.bf-aria .bf-aria-welcome { margin: 8px 0 0; color: var(--aria-text); }
.bf-aria .bf-aria-note { margin: 8px 0 0; font-size: .78rem; color: var(--aria-muted); }
.bf-aria .bf-aria-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.bf-aria .bf-aria-button {
  appearance: none; font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer;
  color: var(--aria-accent); background: var(--aria-tint); border: 1px solid var(--aria-border);
  border-radius: 9px; padding: 10px 15px; min-height: 44px; text-align: left;
}
.bf-aria .bf-aria-button:hover { border-color: var(--aria-accent); }
.bf-aria .bf-aria-button:focus-visible, .bf-aria .bf-aria-input:focus-visible {
  outline: 3px solid var(--aria-accent); outline-offset: 3px;
}
.bf-aria .bf-aria-form { margin-top: 18px; }
.bf-aria .bf-aria-label { display: block; margin-bottom: 6px; font-size: .86rem; color: var(--aria-muted); }
.bf-aria .bf-aria-input-row { display: flex; gap: 8px; }
.bf-aria .bf-aria-input {
  min-width: 0; flex: 1; border: 1px solid var(--aria-border); border-radius: 9px;
  background: var(--aria-bg); color: var(--aria-text); font: inherit; padding: 11px 13px;
}
.bf-aria .bf-aria-reply { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--aria-border); }
.bf-aria .bf-aria-message { margin: 0; color: var(--aria-text); }
.bf-aria .bf-aria-reply:empty { display: none; }
@media (max-width: 600px) {
  .bf-aria .bf-aria-intro { gap: 12px; align-items: flex-start; }
  .bf-aria .bf-aria-avatar { width: 76px; height: 98px; }
  .bf-aria .bf-aria-title { font-size: 1.5rem; }
  .bf-aria .bf-aria-input-row { flex-wrap: wrap; }
  .bf-aria .bf-aria-input { flex-basis: 100%; }
}