/* Moved verbatim from the <style> block of design/DSAT.dc.html. */
  body { margin: 0; background: #FAFAFA; }
  nav::-webkit-scrollbar { display: none; }
  @media (max-width: 1100px) { .ax-header-icons { display: none !important; } }
  a { color: var(--ax-accent-deep); text-decoration-color: color-mix(in oklab, var(--ax-accent-deep) 45%, transparent); }
  a:hover { color: var(--ax-ink-900); text-decoration-color: currentColor; }
  .module-launch { position:relative;overflow:hidden;background:#0d0d11;color:#fff;border-radius:16px;padding:28px;box-shadow:0 12px 36px rgba(9,9,11,.16);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:24px;align-items:center; }
  .module-launch:after { content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-130px;top:-170px;background:radial-gradient(circle,rgba(139,54,119,.9) 0,rgba(20,188,208,.2) 45%,transparent 70%); }
  .module-launch > * { position:relative;z-index:1; }
  .module-launch h2 { margin:6px 0 10px;font-family:var(--ax-font-brand);font-size:28px;line-height:1.08;letter-spacing:-.02em; }
  .module-launch p { margin:0;color:#c9c9d1;font-size:14px;line-height:1.65;max-width:690px; }
  .module-meta { display:flex;flex-wrap:wrap;gap:8px;margin-top:16px; }
  .module-meta span { border:1px solid #383840;border-radius:999px;padding:7px 10px;font:10.5px var(--ax-font-mono);letter-spacing:.04em;color:#dedee5; }
  .module-action { display:flex;flex-direction:column;gap:10px;align-items:stretch; }
  .module-action a { display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;color:#111116;text-decoration:none;border-radius:10px;padding:14px 16px;font-family:var(--ax-font-brand);font-size:14px;font-weight:700; }
  .module-action a:hover { background:#14BCD0;color:#071316; }
  .module-action small { color:#9d9da7;font-size:11px;line-height:1.45; }
  @media (max-width:760px) { .module-launch { grid-template-columns:1fr;padding:22px; } }

  /* Responsive remediation — DSAT page. Keeps desktop layout untouched above 860px. */
  .ax-main img { max-width:100%; height:auto; }
  @media (max-width:860px) {
    .ax-footer-inner { flex-wrap:wrap !important; }
  }
  @media (max-width:640px) {
    .ax-topbar { gap:8px !important; padding:0 12px !important; }
    .ax-wordmark { display:none !important; }
    .ax-userchip { gap:6px !important; padding:3px 8px 3px 3px !important; }
    .ax-authnote { display:none !important; }
    .ax-main { padding:20px 16px 44px !important; gap:24px !important; }
    .ax-page-title { font-size:24px !important; }
    .ax-section-title { font-size:18px !important; }
    .ax-footer-inner { flex-direction:column !important; align-items:flex-start !important; gap:14px !important; padding:20px 16px !important; }
    .ax-footer-links { flex-wrap:wrap !important; gap:10px 16px !important; }
    .module-launch { padding:18px !important; border-radius:12px !important; }
    .module-launch h2 { font-size:23px !important; }
    .ax-contact-note { overflow-wrap:break-word; }
  }

/* Spike additions: server-rendered panels are hidden until opened (inline display would otherwise win),
   and the mock-up's style-hover attributes become classes. */
main [hidden] { display: none !important; }
.dsat-tile:hover { background: var(--dsat-hover) !important; }
.dsat-close:hover { background: var(--ax-ink-25) !important; }

/* Links inside running text are underlined, so they do not rely on colour alone (WCAG 1.4.1, #2470). */
p a { text-decoration: underline; }