/* Writing Assistant · SITE CHROME BRIDGE (guest page only). NOT part of the design system and not linted by it:
   it only feeds the site's own nav + footer (render_navigation() / render_footer()), which read index1.css
   variables and base .button rules that tool pages do not load. Frozen copy of the site palette (index1.css :root),
   same pattern as search-and-cite/assets/css/site-chrome.css. Loaded after /css/nav-shared.css. */
@layer sitechrome {
  /* The site's shared upgrade modal inside the tool (ruling: keep the component, make it not look broken here): the
     tool's body sets no font (so it fell back to a serif), the CTA overflowed its card (content-box width:100%), and two
     greys were below 4.5:1 (#8a8f9c 3.2:1, #7a7f8e 4.0:1 on white). Scoped to #tpiUpgradeModal. */
  /* a11y 43 m11: the promo banner (overflow: hidden) clipped its own link's focus ring by 16px: draw it inside */
  .banner-container a:focus-visible { outline: 2px solid #FFFFFF; outline-offset: -3px; }
  #tpiUpgradeModal, #tpiUpgradeModal button { font-family: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif; }
  #tpiUpgradeModal .tpi-btn-primary { box-sizing: border-box; max-width: 100%; white-space: normal; }
  :root {
    --primary-color: #4F46E5; --secondary-color: #7C3AED; --primary-color-dark: #4A44C8;
    --bg-primary: #0D0C1D; --bg-secondary: #1A1A2E;
    --surface-glass: rgba(255, 255, 255, 0.05); --surface-glass-hover: rgba(255, 255, 255, 0.08);
    --glass-background: rgba(255, 255, 255, 0.05); --glass-background-hover: rgba(255, 255, 255, 0.08);
    --text-color: #FFFFFF; --text-primary: #FFFFFF; --text-secondary: #9CA3AF; --text-headings: #E5E7EB;
    --border-glass: rgba(255, 255, 255, 0.1); --border-glass-hover: rgba(255, 255, 255, 0.2);
    --dropdown-bg: #0D0C1D; --card-bg: rgba(255, 255, 255, 0.03);
    --transition-speed: 0.3s; --transition-ease: cubic-bezier(0.4, 0, 0.2, 1); --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --radius-sm: 0.375rem; --radius-md: 0.5rem; --radius-lg: 0.75rem;
  }
  .wa-sitenav, .wa-sitefoot { font-family: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif; color: #FFFFFF; background: #0D0C1D; position: relative; z-index: 50; }
  .wa-sitenav a, .wa-sitefoot a { color: inherit; }
  .button { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.6rem 1.2rem; border: none; border-radius: var(--radius-md); cursor: pointer; transition: all var(--transition-speed); font: 500 0.95rem/1.2 Manrope, system-ui, sans-serif; text-align: center; }
  .button-primary { background: linear-gradient(135deg, var(--primary-color), #7C3AED); color: var(--text-color); border: 1px solid transparent; }
  .button-outline { background: transparent; border: 1px solid var(--border-glass); color: var(--text-color); }
  .button-outline:hover { background: var(--surface-glass-hover); border-color: var(--border-glass-hover); }
  .profile-menu { background-color: #EB7113; }
  .nav-container :where(a, button, [tabindex]):focus-visible, .banner-container :where(a, button):focus-visible,
  .mobile-menu :where(a, button, [tabindex]):focus-visible, .wa-sitefoot :where(a, button, [tabindex]):focus-visible { outline: 2px solid #A78BFA; outline-offset: 2px; }
}

/* release 60 (a11y 48 N-M1): the upgrade modal's contrast and reflow fixes are UNLAYERED. The modal's own
   <style id="tpi-upgrade-modal-styles"> is unlayered, and unlayered rules beat every @layer whatever their specificity,
   so inside @layer sitechrome these never applied (computed #8a8f9c, 3.2:1). Scoped to #tpiUpgradeModal (id specificity
   beats the modal's class rules). The modal's card follows prefers-color-scheme (white, or #1c1f2b in OS dark), so each
   grey has a light-card and a dark-card value, both ≥ 4.5:1 (asserted by e2e upgradeModalA11y). */
#tpiUpgradeModal .tpi-resets-note, #tpiUpgradeModal .tpi-plan-price small { color: #555a67; }
#tpiUpgradeModal .tpi-btn-secondary { color: #4a4f5c; min-height: 44px; }
#tpiUpgradeModal .tpi-modal-close { color: #555a67; min-width: 44px; min-height: 44px; }
#tpiUpgradeModal :focus-visible { outline: 2px solid #5b3df5; outline-offset: 2px; }
@media (prefers-color-scheme: dark) {
  #tpiUpgradeModal .tpi-resets-note, #tpiUpgradeModal .tpi-plan-price small { color: #b9bdca; }
  #tpiUpgradeModal .tpi-btn-secondary, #tpiUpgradeModal .tpi-modal-close { color: #c8ccd8; }
}
/* reflow (SC 1.4.10): at high zoom / small viewports the card scrolls inside the viewport, so Close and "Maybe later"
   can always be reached (before: 628px card in a 400px viewport, top at −114, no scrolling) */
#tpiUpgradeModal.tpi-modal-overlay { overflow: hidden; }
#tpiUpgradeModal .tpi-modal-card { max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); overflow-y: auto; overscroll-behavior: contain; box-sizing: border-box; }