/* Fast local font stack; no third-party font request on the critical path. */
:root {
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Landing-page offer: keep capacity details on the dedicated plans page. */
.home-plan-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 800px;
  padding: 25px 27px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  box-shadow: 0 12px 32px rgba(29, 39, 69, .055);
}
.home-plan-card h3 {
  margin: 6px 0 4px;
  font: 700 19px/1.25 var(--font-display);
  letter-spacing: -.04em;
}
.home-plan-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}
.home-plan-card .button { flex: 0 0 auto; }
.service-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 800px;
}

/* Compact, keyboard-accessible theme switch. */
.theme-toggle {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: transparent;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}
.theme-toggle:hover {
  color: var(--violet);
  background: rgba(104, 92, 245, .07);
  border-color: rgba(104, 92, 245, .3);
}
.theme-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.theme-icon-sun { display: none; }

/* Deep ink surfaces with a soft violet accent, applied consistently to every route. */
html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #ecf0fb;
  --muted: #a6b1c7;
  --faint: #8591a8;
  --paper: #0b1020;
  --white: #141b2b;
  --line: #273149;
  --violet: #a397ff;
  --violet-dark: #897afa;
  --blue: #80a5f1;
  --mint: #64c2aa;
  --night: #10182a;
  --night-soft: #182238;
  --shadow: 0 24px 70px rgba(0, 0, 0, .42);
}
html[data-theme="dark"] body { color: var(--ink); background: var(--paper); }
html[data-theme="dark"] .site-header { background: rgba(10, 15, 27, .94); border-bottom-color: rgba(46, 55, 77, .8); }
html[data-theme="dark"] .primary-nav a,
html[data-theme="dark"] .login-link,
html[data-theme="dark"] .language-select { color: #b3bed2; }
html[data-theme="dark"] .language-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%23b3bed2' stroke-width='1.5'/%3E%3C/svg%3E"); }
html[data-theme="dark"] .theme-toggle { color: #d7dcf0; border-color: #36415a; background: #151d2e; }
html[data-theme="dark"] .theme-toggle:hover { color: #fff; border-color: #8276ed; background: #20283b; }
html[data-theme="dark"] .theme-icon-moon { display: none; }
html[data-theme="dark"] .theme-icon-sun { display: block; }
html[data-theme="dark"] .menu-toggle { color: var(--ink); border-color: var(--line); background: #141b2b; }
@media (max-width: 680px) {
  html[data-theme="dark"] .primary-nav { color: var(--ink); border-color: var(--line); background: #141b2b; }
}
html[data-theme="dark"] .menu-toggle span { background: #dce2f2; }
html[data-theme="dark"] .button-dark { color: #11162a; background: #e8e7ff; }
html[data-theme="dark"] .button-outline { color: #e2e7f4; border-color: #3a455d; background: #171f30; }
html[data-theme="dark"] .button-outline:hover { color: #fff; border-color: #8276ed; background: #20283b; }
html[data-theme="dark"] .button-light { color: #e1e6f3; background: #20283b; }
html[data-theme="dark"] .hero-section { background: linear-gradient(110deg, #0e1423 0%, #121a2d 56%, #1a1b34 100%); }
html[data-theme="dark"] .hero-lede,
html[data-theme="dark"] .hero-footnote,
html[data-theme="dark"] .text-link,
html[data-theme="dark"] .section-heading > p,
html[data-theme="dark"] .steps-title > p,
html[data-theme="dark"] .faq-intro > p { color: #a4aec3; }
html[data-theme="dark"] .panel-card { border-color: #303a50; background: rgba(20, 28, 45, .97); }
html[data-theme="dark"] .panel-topline,
html[data-theme="dark"] .panel-disclaimer { border-color: #2b344a; }
html[data-theme="dark"] .panel-brand-muted,
html[data-theme="dark"] .floating-note small { color: #9ba7bd; }
html[data-theme="dark"] .server-address,
html[data-theme="dark"] .panel-stat,
html[data-theme="dark"] .panel-runtime { border-color: #2b354b; background: #101828; }
html[data-theme="dark"] .copy-button,
html[data-theme="dark"] .panel-controls button { color: #c1cadb; border-color: #354057; background: #1b2437; }
html[data-theme="dark"] .panel-controls .control-console { color: #fff; border-color: #313d57; background: #313d57; }
html[data-theme="dark"] .panel-controls .control-stop { color: #f2acba; border-color: #59404c; }
html[data-theme="dark"] .floating-note { color: #e4e8f4; border-color: #343e54; background: rgba(20, 28, 45, .97); }
html[data-theme="dark"] .note-spark,
html[data-theme="dark"] .server-icon { color: #c0b9ff; background: #292443; }
html[data-theme="dark"] .secure-icon { color: #82d3af; background: #17362f; }
html[data-theme="dark"] .status-chip { color: #a0ddbc; border-color: #315542; background: #192d28; }
html[data-theme="dark"] .demo-pill { color: #ead48a; background: #3b3520; }
html[data-theme="dark"] .services-section,
html[data-theme="dark"] .steps-section,
html[data-theme="dark"] .site-footer { background: #101726; }
html[data-theme="dark"] .plans-section,
html[data-theme="dark"] .faq-section { background: #0e1422; }
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .page-card,
html[data-theme="dark"] .page-spec,
html[data-theme="dark"] .page-step,
html[data-theme="dark"] .page-related a { color: var(--ink); border-color: #2a344a; background: #151e2f; }
html[data-theme="dark"] .service-featured { background: #191d34; }
html[data-theme="dark"] .service-card:hover,
html[data-theme="dark"] .page-card:hover,
html[data-theme="dark"] .page-related a:hover { border-color: #7268d7; }
html[data-theme="dark"] .service-copy p,
html[data-theme="dark"] .service-copy h3,
html[data-theme="dark"] .page-card h3 { color: #e3e8f5; }
html[data-theme="dark"] .service-kicker,
html[data-theme="dark"] .page-breadcrumbs,
html[data-theme="dark"] .page-side-card p,
html[data-theme="dark"] .page-section-heading > p:not(.eyebrow),
html[data-theme="dark"] .page-card p,
html[data-theme="dark"] .page-list li,
html[data-theme="dark"] .page-faq details p,
html[data-theme="dark"] .legal-page p,
html[data-theme="dark"] .legal-page li { color: #a5b0c4; }
html[data-theme="dark"] .home-plan-card,
html[data-theme="dark"] .page-side-card { color: var(--ink); border-color: #2d3650; background: linear-gradient(145deg, #161e30, #171a32); box-shadow: var(--shadow); }
html[data-theme="dark"] .home-plan-card p { color: #a5b0c4; }
html[data-theme="dark"] .plan-tag,
html[data-theme="dark"] .plan-description,
html[data-theme="dark"] .plan-small-print,
html[data-theme="dark"] .pricing-note,
html[data-theme="dark"] .page-side-card p:not(.tiny-label),
html[data-theme="dark"] .page-empty-state { color: #a4aec3; }
html[data-theme="dark"] .resource-list li { color: #b0bbcf; border-color: #293349; }
html[data-theme="dark"] .resource-list strong { color: #edf0fb; }
html[data-theme="dark"] .plan-free { border-color: #5b55a2; }
html[data-theme="dark"] .plan-star,
html[data-theme="dark"] .plan-initial,
html[data-theme="dark"] .page-card .card-index { color: #c2bbff; background: #292443; }
html[data-theme="dark"] .steps-list,
html[data-theme="dark"] .step-item,
html[data-theme="dark"] .faq-list,
html[data-theme="dark"] .faq-list details { border-color: #2a3449; }
html[data-theme="dark"] .step-item p,
html[data-theme="dark"] .faq-list details p { color: #a8b3c7; }
html[data-theme="dark"] .demo-notice,
html[data-theme="dark"] .availability-note,
html[data-theme="dark"] .page-empty-state { color: #b1bdd1; border-color: #29344a; background: #151d2d; }
html[data-theme="dark"] .page-breadcrumbs a,
html[data-theme="dark"] .page-related a { color: #bdc7db; }
html[data-theme="dark"] .page-callout { color: #bec8dc; border-color: #35405a; background: #171f31; }
html[data-theme="dark"] .page-callout strong { color: #edf0fb; }
html[data-theme="dark"] .page-callout.warning { color: #e6d9ad; border-color: #504629; background: #282318; }
html[data-theme="dark"] .page-callout.warning .callout-icon { color: #f2d47c; background: #4a3d1f; }
html[data-theme="dark"] .page-faq details { border-color: #2a3449; }
html[data-theme="dark"] .page-faq summary { color: #e5e9f5; }
html[data-theme="dark"] .page-footer-cta { color: #fff; background: linear-gradient(115deg, #171f36, #262548); }
html[data-theme="dark"] .footer-main > p,
html[data-theme="dark"] .footer-links a,
html[data-theme="dark"] .footer-bottom,
html[data-theme="dark"] .footer-bottom a { color: #a4aec2; }
html[data-theme="dark"] .preview-ribbon { color: #c0bbff; border-color: #353254; background: #1c1b32; }
html[data-theme="dark"] .modal { color: var(--ink); border-color: #303a50; background: #151d2e; }
html[data-theme="dark"] .modal-close { color: #d1d8e8; border-color: #374159; background: #20283a; }
html[data-theme="dark"] .modal-copy,
html[data-theme="dark"] .modal-footnote,
html[data-theme="dark"] .form-field > span { color: #aeb8ca; }
html[data-theme="dark"] .form-field input,
html[data-theme="dark"] .form-field select { color: #ecf0fb; border-color: #39445c; background: #101827; }
html[data-theme="dark"] .form-field input::placeholder { color: #7f8ba2; }
html[data-theme="dark"] .form-option { border-color: #374159; background: #171f31; }
html[data-theme="dark"] .form-hint { color: #a6b1c6; }
html[data-theme="dark"] .modal-callout,
html[data-theme="dark"] .dashboard-preview { color: #b8c2d5; border-color: #303a50; background: #101827; }
html[data-theme="dark"] .dashboard-preview strong,
html[data-theme="dark"] .modal-callout strong { color: #edf0fb; }
html[data-theme="dark"] .toast { color: #edf0fb; border-color: #343e54; background: #1b2437; }
html[data-theme="dark"] .button-danger { color: #ffb6c0; border-color: #5d3340; background: #351e28; }
html[data-theme="dark"] ::selection { color: #fff; background: #675cc0; }

@media (max-width: 920px) {
  .nav-shell { gap: 16px; }
  .primary-nav { gap: 16px; }
  .nav-actions { gap: 11px; }
}
@media (max-width: 680px) {
  .service-list { grid-template-columns: 1fr; max-width: 100%; }
  .home-plan-card { align-items: stretch; flex-direction: column; padding: 21px; }
  .home-plan-card .button { width: 100%; }
  .nav-shell { gap: 10px; }
  .nav-actions { gap: 8px; }
  .theme-toggle { width: 34px; height: 34px; flex-basis: 34px; }
}
@media (max-width: 430px) {
  .nav-shell { padding-inline: 14px; }
  .brand { gap: 7px; }
  .brand-name { font-size: 15px; }
  .nav-actions { gap: 6px; }
  .nav-actions .login-link { display: none; }
  .nav-actions .button-small { min-height: 35px; padding-inline: 9px; font-size: 10px; }
  .language-select { min-width: 41px; padding-right: 14px; }
  .theme-toggle { width: 32px; height: 32px; flex-basis: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}