*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}
body {
  min-height: 100vh;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  background-color: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
}
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}
input, button, textarea, select {
  font: inherit;
}
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}
ul, ol {
  list-style: none;
}
a {
  color: inherit;
  text-decoration: none;
}
table {
  border-collapse: collapse;
  width: 100%;
}
:root {
  --color-primary:        #1a6b55;
  --color-primary-light:  #22876b;
  --color-primary-dark:   #124d3d;
  --color-primary-50:     #edf7f4;
  --color-primary-100:    #c8ead9;
  --color-accent:         #f59e0b;
  --color-accent-light:   #fbbf24;
  --color-accent-dark:    #d97706;
  --color-accent-50:      #fffbeb;
  --color-success:        #16a34a;
  --color-success-bg:     #f0fdf4;
  --color-warning:        #d97706;
  --color-warning-bg:     #fffbeb;
  --color-error:          #dc2626;
  --color-error-bg:       #fef2f2;
  --color-info:           #0369a1;
  --color-info-bg:        #f0f9ff;
  --color-bg:             #f8fafc;
  --color-surface:        #ffffff;
  --color-surface-raised: #ffffff;
  --color-border:         #e2e8f0;
  --color-border-light:   #f1f5f9;
  --color-text:           #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted:     #94a3b8;
  --color-text-inverse:   #ffffff;
  --color-text-on-primary:#ffffff;
  --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;
  --leading-tight:   1.25;
  --leading-snug:    1.375;
  --leading-normal:  1.5;
  --leading-relaxed: 1.625;
  --leading-loose:   2;
  --tracking-tight:   -0.025em;
  --tracking-normal:   0em;
  --tracking-wide:     0.025em;
  --tracking-wider:    0.05em;
  --tracking-widest:   0.1em;
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;
  --radius-sm:   0.25rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-2xl:  1.5rem;
  --radius-full: 9999px;
  --shadow-xs:    0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm:    0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10);
  --shadow-md:    0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10);
  --shadow-lg:    0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10);
  --shadow-xl:    0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.10);
  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --transition-fast:   150ms ease;
  --transition-base:   200ms ease;
  --transition-slow:   300ms ease;
  --transition-slower: 500ms ease;
  --z-below:    -1;
  --z-base:      0;
  --z-raised:    10;
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-overlay:   300;
  --z-modal:     400;
  --z-toast:     500;
  --max-width-content: 800px;
  --max-width-wide:    1200px;
  --max-width-full:    1440px;
  --nav-height:        64px;
}
700;800&family=Inter:wght@400;500;600&display=swap');
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  color: var(--color-text);
  letter-spacing: var(--tracking-tight);
}
h1 { font-size: var(--text-3xl); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl);  }
h4 { font-size: var(--text-lg);  }
h5 { font-size: var(--text-base); font-weight: var(--weight-semibold); letter-spacing: var(--tracking-normal); }
h6 { font-size: var(--text-sm);   font-weight: var(--weight-semibold); letter-spacing: var(--tracking-normal); }
@media (min-width: 768px) {
  h1 { font-size: var(--text-4xl); }
  h2 { font-size: var(--text-3xl); }
  h3 { font-size: var(--text-2xl); }
}
p {
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  color: var(--color-text-secondary);
}
p + p {
  margin-top: var(--space-4);
}
strong, b {
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}
small {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
}
code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  background: var(--color-border-light);
  padding: 0.1em 0.35em;
  border-radius: var(--radius-sm);
  color: var(--color-primary-dark);
}
:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}
:focus:not(:focus-visible) {
  outline: none;
}
::selection {
  background-color: var(--color-primary-100);
  color: var(--color-primary-dark);
}
::-webkit-scrollbar        { width: 6px; height: 6px; }
::-webkit-scrollbar-track  { background: var(--color-border-light); }
::-webkit-scrollbar-thumb  { background: var(--color-border); border-radius: var(--radius-full); }
::-webkit-scrollbar-thumb:hover { background: var(--color-text-muted); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
.page-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.main-content {
  flex: 1;
  padding-top: var(--nav-height);
}
.container {
  width: 100%;
  max-width: var(--max-width-wide);
  margin-inline: auto;
  padding-inline: var(--space-4);
}
.container--narrow {
  max-width: var(--max-width-content);
}
@media (min-width: 480px)  { .container { padding-inline: var(--space-6); } }
@media (min-width: 768px)  { .container { padding-inline: var(--space-8); } }
@media (min-width: 1280px) { .container { padding-inline: var(--space-12); } }
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--nav-height);
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
  z-index: var(--z-sticky);
  transition: box-shadow var(--transition-base);
}
.site-header.scrolled {
  box-shadow: var(--shadow-md);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  max-width: var(--max-width-wide);
  margin-inline: auto;
  padding-inline: var(--space-4);
  gap: var(--space-4);
}
@media (min-width: 480px)  { .header-inner { padding-inline: var(--space-6); } }
@media (min-width: 768px)  { .header-inner { padding-inline: var(--space-8); } }
@media (min-width: 1280px) { .header-inner { padding-inline: var(--space-12); } }
.site-logo {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
  text-decoration: none;
}
.site-logo__mark {
  width: 32px;
  height: 32px;
  background: var(--color-primary);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-inverse);
  font-family: var(--font-display);
  font-weight: var(--weight-extrabold);
  font-size: var(--text-sm);
  letter-spacing: var(--tracking-tight);
  flex-shrink: 0;
}
.site-logo__text {
  font-family: var(--font-display);
  font-weight: var(--weight-extrabold);
  font-size: var(--text-lg);
  color: var(--color-text);
  letter-spacing: var(--tracking-tight);
  line-height: 1;
}
.site-logo__text span {
  color: var(--color-primary);
}
.primary-nav {
  display: none;
}
@media (min-width: 1024px) {
  .primary-nav {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex: 1;
    justify-content: center;
  }
}
.nav-item {
  position: relative;
}
.nav-item__trigger {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  cursor: pointer;
  background: none;
  border: none;
  white-space: nowrap;
  transition: color var(--transition-fast), background var(--transition-fast);
}
.nav-item__trigger:hover {
  color: var(--color-primary);
  background: var(--color-primary-50);
}
.nav-item__trigger svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  transition: transform var(--transition-fast);
}
.nav-item:hover .nav-item__trigger svg {
  transform: rotate(180deg);
}
.nav-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + var(--space-2));
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl);
  padding: var(--space-3);
  min-width: 240px;
  z-index: var(--z-dropdown);
}
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown {
  display: block;
}
.nav-dropdown__item {
  display: flex;
  flex-direction: column;
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  color: var(--color-text);
  text-decoration: none;
  transition: background var(--transition-fast);
}
.nav-dropdown__item:hover {
  background: var(--color-primary-50);
}
.nav-dropdown__item-name {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
  margin-bottom: var(--space-1);
}
.nav-dropdown__item:hover .nav-dropdown__item-name {
  color: var(--color-primary);
}
.nav-dropdown__item-desc {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  line-height: var(--leading-normal);
}
.nav-link {
  display: flex;
  align-items: center;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  text-decoration: none;
  transition: color var(--transition-fast), background var(--transition-fast);
}
.nav-link:hover,
.nav-link.active {
  color: var(--color-primary);
  background: var(--color-primary-50);
}
.header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
}
.menu-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-text);
  transition: background var(--transition-fast), color var(--transition-fast);
  flex-shrink: 0;
}
.menu-toggle:hover {
  background: var(--color-border-light);
}
.menu-toggle svg {
  width: 20px;
  height: 20px;
}
@media (min-width: 1024px) {
  .menu-toggle { display: none; }
}
.mobile-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgb(0 0 0 / 0.4);
  z-index: var(--z-overlay);
  opacity: 0;
  transition: opacity var(--transition-slow);
}
.mobile-nav-panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(320px, 90vw);
  background: var(--color-surface);
  z-index: var(--z-modal);
  transform: translateX(100%);
  transition: transform var(--transition-slow);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: var(--space-8);
}
.mobile-nav-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  background: var(--color-surface);
  z-index: 1;
}
.mobile-nav-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  background: var(--color-border-light);
  border: none;
  cursor: pointer;
  color: var(--color-text);
  transition: background var(--transition-fast);
}
.mobile-nav-close:hover {
  background: var(--color-border);
}
.mobile-nav-close svg {
  width: 18px;
  height: 18px;
}
body.nav-open .mobile-nav-overlay {
  display: block;
  opacity: 1;
}
body.nav-open .mobile-nav-panel {
  transform: translateX(0);
}
body.nav-open {
  overflow: hidden;
}
.mobile-nav-category {
  padding: var(--space-5) var(--space-5) var(--space-2);
}
.mobile-nav-category__label {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-widest);
  color: var(--color-text-muted);
  margin-bottom: var(--space-2);
}
.mobile-nav-link {
  display: flex;
  flex-direction: column;
  padding: var(--space-3) var(--space-3);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-1);
  color: var(--color-text);
  text-decoration: none;
  transition: background var(--transition-fast);
}
.mobile-nav-link:hover,
.mobile-nav-link.active {
  background: var(--color-primary-50);
}
.mobile-nav-link__name {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
  margin-bottom: 2px;
}
.mobile-nav-link:hover .mobile-nav-link__name,
.mobile-nav-link.active .mobile-nav-link__name {
  color: var(--color-primary);
}
.mobile-nav-link__desc {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  line-height: var(--leading-normal);
}
.mobile-nav-divider {
  height: 1px;
  background: var(--color-border);
  margin: var(--space-3) var(--space-5);
}
.mobile-nav-static {
  padding: var(--space-2) var(--space-5);
}
.mobile-nav-static a {
  display: block;
  padding: var(--space-3);
  border-radius: var(--radius-lg);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  transition: background var(--transition-fast), color var(--transition-fast);
}
.mobile-nav-static a:hover {
  background: var(--color-primary-50);
  color: var(--color-primary);
}
.site-footer {
  background: var(--color-text);
  color: var(--color-text-inverse);
  padding-top: var(--space-16);
  padding-bottom: var(--space-8);
  margin-top: var(--space-20);
}
.footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-10);
  padding-bottom: var(--space-10);
  border-bottom: 1px solid rgb(255 255 255 / 0.1);
}
@media (min-width: 640px) {
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .footer-grid {
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: var(--space-12);
  }
}
.footer-brand {}
.footer-brand .site-logo__mark {
  background: var(--color-primary-light);
}
.footer-brand .site-logo__text {
  color: var(--color-text-inverse);
}
.footer-brand .site-logo__text span {
  color: var(--color-accent-light);
}
.footer-tagline {
  margin-top: var(--space-4);
  font-size: var(--text-sm);
  color: rgb(255 255 255 / 0.6);
  line-height: var(--leading-relaxed);
}
.footer-privacy-note {
  margin-top: var(--space-4);
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  color: rgb(255 255 255 / 0.5);
}
.footer-privacy-note svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--color-success);
}
.footer-col__heading {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-widest);
  color: rgb(255 255 255 / 0.5);
  margin-bottom: var(--space-4);
}
.footer-col__links {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.footer-col__links a {
  font-size: var(--text-sm);
  color: rgb(255 255 255 / 0.7);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.footer-col__links a:hover {
  color: var(--color-text-inverse);
}
.footer-bottom {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding-top: var(--space-8);
  align-items: center;
  text-align: center;
}
@media (min-width: 640px) {
  .footer-bottom {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
  }
}
.footer-copyright {
  font-size: var(--text-xs);
  color: rgb(255 255 255 / 0.4);
}
.footer-legal-links {
  display: flex;
  gap: var(--space-6);
}
.footer-legal-links a {
  font-size: var(--text-xs);
  color: rgb(255 255 255 / 0.4);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.footer-legal-links a:hover {
  color: rgb(255 255 255 / 0.7);
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding-top: var(--space-6);
  padding-bottom: var(--space-2);
}
.breadcrumb__item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
}
.breadcrumb__item a {
  color: var(--color-text-muted);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.breadcrumb__item a:hover {
  color: var(--color-primary);
}
.breadcrumb__item svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.breadcrumb__item--current {
  color: var(--color-text-secondary);
  font-weight: var(--weight-medium);
}
.section {
  padding-block: var(--space-12);
}
.section--lg {
  padding-block: var(--space-20);
}
.section--sm {
  padding-block: var(--space-8);
}
.section__header {
  margin-bottom: var(--space-10);
}
.section__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-widest);
  color: var(--color-primary);
  margin-bottom: var(--space-3);
}
.section__title {
  font-size: var(--text-3xl);
  margin-bottom: var(--space-4);
}
@media (min-width: 768px) {
  .section__title { font-size: var(--text-4xl); }
}
.section__subtitle {
  font-size: var(--text-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
}
.skip-link {
  position: absolute;
  top: -100%;
  left: var(--space-4);
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  z-index: var(--z-toast);
  text-decoration: none;
  transition: top var(--transition-fast);
}
.skip-link:focus {
  top: var(--space-2);
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 0.625rem var(--space-5);
  border-radius: var(--radius-lg);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  line-height: 1;
  cursor: pointer;
  border: 2px solid transparent;
  text-decoration: none;
  white-space: nowrap;
  min-height: 44px;
  transition:
    background var(--transition-fast),
    color var(--transition-fast),
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    transform var(--transition-fast);
  user-select: none;
}
.btn:active { transform: translateY(1px); }
.btn:disabled,
.btn[aria-disabled="true"] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.btn--primary {
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  border-color: var(--color-primary);
}
.btn--primary:hover {
  background: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  box-shadow: var(--shadow-md);
}
.btn--secondary {
  background: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn--secondary:hover {
  background: var(--color-primary-50);
  box-shadow: var(--shadow-sm);
}
.btn--ghost {
  background: transparent;
  color: var(--color-text-secondary);
  border-color: var(--color-border);
}
.btn--ghost:hover {
  background: var(--color-border-light);
  color: var(--color-text);
}
.btn--accent {
  background: var(--color-accent);
  color: var(--color-text);
  border-color: var(--color-accent);
  font-weight: var(--weight-bold);
}
.btn--accent:hover {
  background: var(--color-accent-dark);
  border-color: var(--color-accent-dark);
  box-shadow: var(--shadow-md);
}
.btn--danger {
  background: var(--color-error);
  color: #fff;
  border-color: var(--color-error);
}
.btn--danger:hover { background: #b91c1c; border-color: #b91c1c; }
.btn--sm  { padding: var(--space-2) var(--space-4); font-size: var(--text-xs); min-height: 36px; }
.btn--lg  { padding: var(--space-4) var(--space-8); font-size: var(--text-base); min-height: 52px; border-radius: var(--radius-xl); }
.btn--full { width: 100%; }
.btn--loading {
  position: relative;
  color: transparent;
  pointer-events: none;
}
.btn--loading::after {
  content: '';
  position: absolute;
  width: 16px; height: 16px;
  border: 2px solid white;
  border-top-color: transparent;
  border-radius: 50%;
  animation: btn-spin 0.6s linear infinite;
}
@keyframes btn-spin { to { transform: rotate(360deg); } }
.form-group { display: flex; flex-direction: column; gap: var(--space-2); }
.form-label {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
  line-height: 1;
}
.form-label--required::after { content: ' *'; color: var(--color-error); }
.form-hint  { font-size: var(--text-xs); color: var(--color-text-muted); line-height: var(--leading-normal); }
.form-error { font-size: var(--text-xs); color: var(--color-error); display: flex; align-items: center; gap: var(--space-1); }
.form-error svg { width: 12px; height: 12px; flex-shrink: 0; }
.input, .select, .textarea {
  width: 100%;
  min-height: 44px;
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-lg);
  font-size: var(--text-base);
  font-family: var(--font-body);
  color: var(--color-text);
  line-height: var(--leading-normal);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  appearance: none;
  -webkit-appearance: none;
}
.input::placeholder, .textarea::placeholder { color: var(--color-text-muted); }
.input:hover, .select:hover, .textarea:hover { border-color: var(--color-primary-light); }
.input:focus, .select:focus, .textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgb(26 107 85 / 0.12);
}
.input--error, .select--error, .textarea--error { border-color: var(--color-error); }
.input--error:focus, .select--error:focus, .textarea--error:focus {
  box-shadow: 0 0 0 3px rgb(220 38 38 / 0.12);
}
.input-wrapper { position: relative; display: flex; align-items: center; }
.input-wrapper .input { padding-left: var(--space-10); }
.input-wrapper .input-prefix {
  position: absolute; left: var(--space-4);
  color: var(--color-text-muted); font-size: var(--text-base);
  font-weight: var(--weight-medium); pointer-events: none; user-select: none;
}
.input-wrapper .input-suffix {
  position: absolute; right: var(--space-4);
  color: var(--color-text-muted); font-size: var(--text-sm);
  pointer-events: none; user-select: none;
}
.select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--space-4) center;
  padding-right: var(--space-10);
  cursor: pointer;
}
.textarea { min-height: 120px; resize: vertical; line-height: var(--leading-relaxed); }
.range-slider {
  width: 100%; height: 6px;
  border-radius: var(--radius-full);
  background: var(--color-border);
  outline: none; appearance: none; -webkit-appearance: none; cursor: pointer;
}
.range-slider::-webkit-slider-thumb {
  appearance: none; -webkit-appearance: none;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--color-primary);
  border: 2px solid var(--color-surface);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: box-shadow var(--transition-fast), transform var(--transition-fast);
}
.range-slider::-webkit-slider-thumb:hover {
  box-shadow: 0 0 0 4px rgb(26 107 85 / 0.15);
  transform: scale(1.1);
}
.range-slider::-moz-range-thumb {
  width: 20px; height: 20px;
  border-radius: 50%; background: var(--color-primary);
  border: 2px solid var(--color-surface); box-shadow: var(--shadow-sm);
}
.check-group { display: flex; align-items: center; gap: var(--space-3); cursor: pointer; }
.check-group input[type="checkbox"],
.check-group input[type="radio"] {
  width: 18px; height: 18px;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  appearance: none; -webkit-appearance: none;
  cursor: pointer; flex-shrink: 0;
  transition: background var(--transition-fast), border-color var(--transition-fast);
  position: relative;
}
.check-group input[type="radio"] { border-radius: 50%; }
.check-group input[type="checkbox"]:checked,
.check-group input[type="radio"]:checked {
  background: var(--color-primary); border-color: var(--color-primary);
}
.check-group input[type="checkbox"]:checked::after {
  content: ''; position: absolute;
  left: 4px; top: 1px; width: 6px; height: 10px;
  border: 2px solid white; border-top: none; border-left: none;
  transform: rotate(45deg);
}
.check-group input[type="radio"]:checked::after {
  content: ''; position: absolute; inset: 3px;
  background: white; border-radius: 50%;
}
.check-group__label { font-size: var(--text-sm); color: var(--color-text); line-height: var(--leading-normal); }
.card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  box-shadow: var(--shadow-xs);
}
.card--raised  { box-shadow: var(--shadow-md); border-color: transparent; }
.card--primary { background: var(--color-primary); border-color: transparent; color: var(--color-text-on-primary); }
.card--accent  { background: linear-gradient(135deg, var(--color-primary-50), var(--color-accent-50)); border-color: var(--color-primary-100); }
.card--interactive {
  cursor: pointer;
  transition: box-shadow var(--transition-base), border-color var(--transition-base), transform var(--transition-base);
}
.card--interactive:hover {
  box-shadow: var(--shadow-lg); border-color: var(--color-primary-100); transform: translateY(-2px);
}
.card__header  { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); }
.card__title   { font-size: var(--text-lg); font-weight: var(--weight-semibold); color: var(--color-text); line-height: var(--leading-snug); }
.card__subtitle{ font-size: var(--text-sm); color: var(--color-text-muted); margin-top: var(--space-1); }
.card__body    { font-size: var(--text-sm); color: var(--color-text-secondary); line-height: var(--leading-relaxed); }
.card__footer  {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
  margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--color-border);
}
.tool-card {
  display: flex; flex-direction: column;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  text-decoration: none; color: inherit;
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--transition-base), border-color var(--transition-base), transform var(--transition-base);
}
.tool-card:hover { box-shadow: var(--shadow-lg); border-color: var(--color-primary-100); transform: translateY(-3px); }
.tool-card__icon {
  width: 44px; height: 44px;
  background: var(--color-primary-50); border-radius: var(--radius-lg);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--space-4); color: var(--color-primary);
}
.tool-card__icon svg { width: 22px; height: 22px; }
.tool-card__name { font-size: var(--text-base); font-weight: var(--weight-semibold); color: var(--color-text); margin-bottom: var(--space-2); line-height: var(--leading-snug); }
.tool-card__desc { font-size: var(--text-sm); color: var(--color-text-muted); line-height: var(--leading-relaxed); flex: 1; }
.tool-card__arrow {
  display: flex; align-items: center; gap: var(--space-1);
  margin-top: var(--space-4); font-size: var(--text-sm);
  font-weight: var(--weight-medium); color: var(--color-primary);
}
.tool-card__arrow svg { width: 14px; height: 14px; transition: transform var(--transition-fast); }
.tool-card:hover .tool-card__arrow svg { transform: translateX(3px); }
.badge {
  display: inline-flex; align-items: center; gap: var(--space-1);
  padding: 0.2rem var(--space-3);
  border-radius: var(--radius-full);
  font-size: var(--text-xs); font-weight: var(--weight-semibold);
  line-height: 1.5; white-space: nowrap;
}
.badge svg { width: 12px; height: 12px; flex-shrink: 0; }
.badge--primary { background: var(--color-primary-50); color: var(--color-primary-dark); }
.badge--success { background: var(--color-success-bg); color: var(--color-success); }
.badge--warning { background: var(--color-warning-bg); color: var(--color-warning); }
.badge--error   { background: var(--color-error-bg);   color: var(--color-error); }
.badge--neutral { background: var(--color-border-light); color: var(--color-text-secondary); }
.badge--accent  { background: var(--color-accent-50);  color: var(--color-accent-dark); }
.privacy-badge {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: var(--space-2) var(--space-4);
  background: var(--color-success-bg);
  border: 1px solid #bbf7d0;
  border-radius: var(--radius-full);
  font-size: var(--text-xs); font-weight: var(--weight-medium); color: var(--color-success);
}
.privacy-badge svg { width: 14px; height: 14px; flex-shrink: 0; }
.accordion { border: 1px solid var(--color-border); border-radius: var(--radius-xl); overflow: hidden; }
.accordion__item { border-bottom: 1px solid var(--color-border); }
.accordion__item:last-child { border-bottom: none; }
.accordion__trigger {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: var(--space-5) var(--space-6);
  background: none; border: none; cursor: pointer; text-align: left;
  gap: var(--space-4);
  transition: background var(--transition-fast);
}
.accordion__trigger:hover { background: var(--color-border-light); }
.accordion__trigger[aria-expanded="true"] { background: var(--color-primary-50); }
.accordion__question { font-size: var(--text-base); font-weight: var(--weight-medium); color: var(--color-text); line-height: var(--leading-snug); }
.accordion__trigger[aria-expanded="true"] .accordion__question { color: var(--color-primary-dark); }
.accordion__icon { width: 20px; height: 20px; flex-shrink: 0; color: var(--color-text-muted); transition: transform var(--transition-base); }
.accordion__trigger[aria-expanded="true"] .accordion__icon { transform: rotate(180deg); color: var(--color-primary); }
.accordion__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 280ms ease; background: var(--color-surface); }
.accordion__panel[aria-hidden="false"] { grid-template-rows: 1fr; }
.accordion__answer { overflow: hidden; padding: 0 var(--space-6) var(--space-5); font-size: var(--text-sm); color: var(--color-text-secondary); line-height: var(--leading-relaxed); padding-top: var(--space-2); }
.accordion__answer p + p { margin-top: var(--space-3); }
.tabs { display: flex; flex-direction: column; gap: var(--space-6); }
.tabs__list {
  display: flex; gap: var(--space-1);
  border-bottom: 2px solid var(--color-border);
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.tabs__list::-webkit-scrollbar { display: none; }
.tabs__tab {
  padding: var(--space-3) var(--space-5); border: none; background: none; cursor: pointer;
  font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--color-text-muted);
  white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px;
  transition: color var(--transition-fast), border-color var(--transition-fast);
}
.tabs__tab:hover { color: var(--color-text); }
.tabs__tab[aria-selected="true"] { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.tabs__panel { display: none; }
.tabs__panel[aria-hidden="false"] { display: block; }
.alert {
  display: flex; gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-lg); border: 1px solid;
  font-size: var(--text-sm); line-height: var(--leading-relaxed);
}
.alert svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; }
.alert__body { flex: 1; color: inherit; }
.alert__title { font-weight: var(--weight-semibold); margin-bottom: var(--space-1); }
.alert--info    { background: var(--color-info-bg);    border-color: #bae6fd; color: var(--color-info); }
.alert--success { background: var(--color-success-bg); border-color: #bbf7d0; color: var(--color-success); }
.alert--warning { background: var(--color-warning-bg); border-color: #fde68a; color: var(--color-warning); }
.alert--error   { background: var(--color-error-bg);   border-color: #fecaca; color: var(--color-error); }
.stat-group { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--space-4); }
.stat { display: flex; flex-direction: column; gap: var(--space-1); }
.stat__label {
  font-size: var(--text-xs); font-weight: var(--weight-medium);
  text-transform: uppercase; letter-spacing: var(--tracking-wider); color: var(--color-text-muted);
}
.stat__value {
  font-family: var(--font-display); font-size: var(--text-3xl);
  font-weight: var(--weight-extrabold); color: var(--color-text);
  line-height: 1; letter-spacing: var(--tracking-tight);
}
.stat__value--primary { color: var(--color-primary); }
.stat__value--accent  { color: var(--color-accent-dark); }
.stat__value--success { color: var(--color-success); }
.stat__sub { font-size: var(--text-xs); color: var(--color-text-muted); }
.divider { height: 1px; background: var(--color-border); border: none; margin-block: var(--space-8); }
.skeleton {
  background: linear-gradient(90deg, var(--color-border-light) 25%, var(--color-border) 50%, var(--color-border-light) 75%);
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.5s infinite;
  border-radius: var(--radius-md);
}
@keyframes skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.skeleton--text  { height: 1em; margin-block: 0.25em; }
.skeleton--title { height: 1.5em; width: 60%; }
.skeleton--card  { height: 120px; border-radius: var(--radius-xl); }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: var(--space-16) var(--space-8); gap: var(--space-4); }
.empty-state__icon { width: 64px; height: 64px; background: var(--color-border-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); }
.empty-state__icon svg { width: 32px; height: 32px; }
.empty-state__title { font-size: var(--text-lg); font-weight: var(--weight-semibold); color: var(--color-text); }
.empty-state__desc  { font-size: var(--text-sm); color: var(--color-text-muted); max-width: 320px; }
.content-section {
  margin-top: var(--space-10, 2.5rem);
  padding: var(--space-8, 2rem) 0;
  border-top: 1px solid var(--color-border, #e2e8f0);
}
.content-section__header {
  margin-bottom: var(--space-6, 1.5rem);
}
.content-section__eyebrow {
  display: inline-block;
  font-size: var(--text-xs, 0.75rem);
  font-weight: var(--weight-semibold, 600);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-primary, #1a6b55);
  margin-bottom: var(--space-2, 0.5rem);
}
.content-section__title {
  font-size: var(--text-xl, 1.25rem);
  font-weight: var(--weight-bold, 700);
  color: var(--color-text);
  line-height: 1.3;
}
.content-section__body {
  font-size: var(--text-base, 1rem);
  line-height: 1.7;
  color: var(--color-text-secondary, #475569);
}
.content-section__body p {
  margin-bottom: var(--space-4, 1rem);
}
.content-section__body h3 {
  font-size: var(--text-lg, 1.125rem);
  font-weight: var(--weight-semibold, 600);
  color: var(--color-text);
  margin-top: var(--space-6, 1.5rem);
  margin-bottom: var(--space-3, 0.75rem);
}
.content-section__body a {
  color: var(--color-primary, #1a6b55);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.content-section__body a:hover {
  color: var(--color-primary-dark, #145544);
}
.how-to-steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  margin-top: var(--space-5, 1.25rem);
}
.how-to-step {
  display: flex;
  gap: var(--space-4, 1rem);
  align-items: flex-start;
}
.how-to-step__number {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--color-primary-50, #edf7f4);
  color: var(--color-primary, #1a6b55);
  font-weight: var(--weight-bold, 700);
  font-size: var(--text-sm, 0.875rem);
}
.how-to-step__content h3 {
  font-size: var(--text-base, 1rem);
  font-weight: var(--weight-semibold, 600);
  color: var(--color-text);
  margin: 0 0 var(--space-1, 0.25rem);
}
.how-to-step__content p {
  font-size: var(--text-sm, 0.875rem);
  color: var(--color-text-secondary, #475569);
  line-height: 1.6;
  margin: 0;
}
.formula-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border, #e2e8f0);
  border-radius: var(--radius-lg, 0.75rem);
  padding: var(--space-6, 1.5rem);
  margin: var(--space-5, 1.25rem) 0;
}
.formula-card__expression {
  font-family: 'Georgia', 'Times New Roman', serif;
  font-size: var(--text-lg, 1.125rem);
  font-weight: 600;
  color: var(--color-text);
  text-align: center;
  padding: var(--space-4, 1rem) 0;
  letter-spacing: 0.02em;
  line-height: 1.8;
}
.formula-card__legend {
  border-top: 1px solid var(--color-border, #e2e8f0);
  padding-top: var(--space-4, 1rem);
  margin-top: var(--space-2, 0.5rem);
}
.formula-card__legend p {
  font-size: var(--text-sm, 0.875rem);
  color: var(--color-text-secondary, #475569);
  margin-bottom: var(--space-2, 0.5rem);
  line-height: 1.5;
}
.formula-card__legend p strong {
  color: var(--color-text);
  font-weight: var(--weight-semibold, 600);
  margin-right: 0.25rem;
}
.ad-slot {
  margin: var(--space-8, 2rem) 0;
  min-height: 90px;
  text-align: center;
}
.ad-slot--in-content {
  padding: var(--space-4, 1rem) 0;
}
.d-none       { display: none !important; }
.d-block      { display: block !important; }
.d-inline     { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-flex       { display: flex !important; }
.d-inline-flex{ display: inline-flex !important; }
.d-grid       { display: grid !important; }
@media (min-width: 480px) {
  .sm\:d-none  { display: none !important; }
  .sm\:d-block { display: block !important; }
  .sm\:d-flex  { display: flex !important; }
}
@media (min-width: 768px) {
  .md\:d-none  { display: none !important; }
  .md\:d-block { display: block !important; }
  .md\:d-flex  { display: flex !important; }
}
@media (min-width: 1024px) {
  .lg\:d-none  { display: none !important; }
  .lg\:d-block { display: block !important; }
  .lg\:d-flex  { display: flex !important; }
}
.flex-row     { flex-direction: row !important; }
.flex-col     { flex-direction: column !important; }
.flex-wrap    { flex-wrap: wrap !important; }
.flex-nowrap  { flex-wrap: nowrap !important; }
.flex-1       { flex: 1 1 0% !important; }
.flex-auto    { flex: 1 1 auto !important; }
.flex-none    { flex: none !important; }
.flex-shrink-0{ flex-shrink: 0 !important; }
.flex-grow-1  { flex-grow: 1 !important; }
.items-start   { align-items: flex-start !important; }
.items-center  { align-items: center !important; }
.items-end     { align-items: flex-end !important; }
.items-stretch { align-items: stretch !important; }
.justify-start   { justify-content: flex-start !important; }
.justify-center  { justify-content: center !important; }
.justify-end     { justify-content: flex-end !important; }
.justify-between { justify-content: space-between !important; }
.justify-around  { justify-content: space-around !important; }
.self-start   { align-self: flex-start !important; }
.self-center  { align-self: center !important; }
.self-end     { align-self: flex-end !important; }
.self-stretch { align-self: stretch !important; }
.flex-center  { display: flex !important; align-items: center !important; justify-content: center !important; }
.flex-between { display: flex !important; align-items: center !important; justify-content: space-between !important; }
.flex-start   { display: flex !important; align-items: center !important; justify-content: flex-start !important; }
.gap-1  { gap: var(--space-1) !important; }
.gap-2  { gap: var(--space-2) !important; }
.gap-3  { gap: var(--space-3) !important; }
.gap-4  { gap: var(--space-4) !important; }
.gap-6  { gap: var(--space-6) !important; }
.gap-8  { gap: var(--space-8) !important; }
.m-0  { margin: 0 !important; }
.m-auto { margin: auto !important; }
.mx-auto { margin-inline: auto !important; }
.my-auto { margin-block: auto !important; }
.mt-0  { margin-top: 0 !important; }
.mt-1  { margin-top: var(--space-1) !important; }
.mt-2  { margin-top: var(--space-2) !important; }
.mt-3  { margin-top: var(--space-3) !important; }
.mt-4  { margin-top: var(--space-4) !important; }
.mt-5  { margin-top: var(--space-5) !important; }
.mt-6  { margin-top: var(--space-6) !important; }
.mt-8  { margin-top: var(--space-8) !important; }
.mt-10 { margin-top: var(--space-10) !important; }
.mt-12 { margin-top: var(--space-12) !important; }
.mb-0  { margin-bottom: 0 !important; }
.mb-1  { margin-bottom: var(--space-1) !important; }
.mb-2  { margin-bottom: var(--space-2) !important; }
.mb-3  { margin-bottom: var(--space-3) !important; }
.mb-4  { margin-bottom: var(--space-4) !important; }
.mb-5  { margin-bottom: var(--space-5) !important; }
.mb-6  { margin-bottom: var(--space-6) !important; }
.mb-8  { margin-bottom: var(--space-8) !important; }
.mb-10 { margin-bottom: var(--space-10) !important; }
.mb-12 { margin-bottom: var(--space-12) !important; }
.ml-auto { margin-left: auto !important; }
.mr-auto { margin-right: auto !important; }
.p-0  { padding: 0 !important; }
.p-2  { padding: var(--space-2) !important; }
.p-4  { padding: var(--space-4) !important; }
.p-6  { padding: var(--space-6) !important; }
.p-8  { padding: var(--space-8) !important; }
.px-2 { padding-inline: var(--space-2) !important; }
.px-4 { padding-inline: var(--space-4) !important; }
.px-6 { padding-inline: var(--space-6) !important; }
.px-8 { padding-inline: var(--space-8) !important; }
.py-2 { padding-block: var(--space-2) !important; }
.py-4 { padding-block: var(--space-4) !important; }
.py-6 { padding-block: var(--space-6) !important; }
.py-8 { padding-block: var(--space-8) !important; }
.text-xs   { font-size: var(--text-xs) !important; }
.text-sm   { font-size: var(--text-sm) !important; }
.text-base { font-size: var(--text-base) !important; }
.text-lg   { font-size: var(--text-lg) !important; }
.text-xl   { font-size: var(--text-xl) !important; }
.text-2xl  { font-size: var(--text-2xl) !important; }
.text-3xl  { font-size: var(--text-3xl) !important; }
.font-regular   { font-weight: var(--weight-regular) !important; }
.font-medium    { font-weight: var(--weight-medium) !important; }
.font-semibold  { font-weight: var(--weight-semibold) !important; }
.font-bold      { font-weight: var(--weight-bold) !important; }
.font-extrabold { font-weight: var(--weight-extrabold) !important; }
.font-display { font-family: var(--font-display) !important; }
.font-body    { font-family: var(--font-body) !important; }
.font-mono    { font-family: var(--font-mono) !important; }
.text-left   { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right  { text-align: right !important; }
.leading-tight   { line-height: var(--leading-tight) !important; }
.leading-normal  { line-height: var(--leading-normal) !important; }
.leading-relaxed { line-height: var(--leading-relaxed) !important; }
.tracking-tight   { letter-spacing: var(--tracking-tight) !important; }
.tracking-normal  { letter-spacing: var(--tracking-normal) !important; }
.tracking-wide    { letter-spacing: var(--tracking-wide) !important; }
.tracking-widest  { letter-spacing: var(--tracking-widest) !important; }
.uppercase    { text-transform: uppercase !important; }
.lowercase    { text-transform: lowercase !important; }
.capitalize   { text-transform: capitalize !important; }
.normal-case  { text-transform: none !important; }
.truncate {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.whitespace-nowrap { white-space: nowrap !important; }
.break-words { overflow-wrap: break-word !important; word-break: break-word !important; }
.text-primary   { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-text-secondary) !important; }
.text-muted     { color: var(--color-text-muted) !important; }
.text-inverse   { color: var(--color-text-inverse) !important; }
.text-success   { color: var(--color-success) !important; }
.text-warning   { color: var(--color-warning) !important; }
.text-error     { color: var(--color-error) !important; }
.text-accent    { color: var(--color-accent-dark) !important; }
.bg-surface   { background-color: var(--color-surface) !important; }
.bg-primary   { background-color: var(--color-primary) !important; }
.bg-primary-50{ background-color: var(--color-primary-50) !important; }
.bg-accent-50 { background-color: var(--color-accent-50) !important; }
.bg-muted     { background-color: var(--color-border-light) !important; }
.bg-success   { background-color: var(--color-success-bg) !important; }
.bg-error     { background-color: var(--color-error-bg) !important; }
.bg-warning   { background-color: var(--color-warning-bg) !important; }
.border       { border: 1px solid var(--color-border) !important; }
.border-0     { border: none !important; }
.border-t     { border-top: 1px solid var(--color-border) !important; }
.border-b     { border-bottom: 1px solid var(--color-border) !important; }
.rounded-sm   { border-radius: var(--radius-sm) !important; }
.rounded-md   { border-radius: var(--radius-md) !important; }
.rounded-lg   { border-radius: var(--radius-lg) !important; }
.rounded-xl   { border-radius: var(--radius-xl) !important; }
.rounded-2xl  { border-radius: var(--radius-2xl) !important; }
.rounded-full { border-radius: var(--radius-full) !important; }
.w-full  { width: 100% !important; }
.w-auto  { width: auto !important; }
.h-full  { height: 100% !important; }
.h-auto  { height: auto !important; }
.min-w-0 { min-width: 0 !important; }
.max-w-content { max-width: var(--max-width-content) !important; }
.max-w-wide    { max-width: var(--max-width-wide) !important; }
.relative { position: relative !important; }
.absolute { position: absolute !important; }
.fixed    { position: fixed !important; }
.sticky   { position: sticky !important; }
.inset-0  { inset: 0 !important; }
.top-0    { top: 0 !important; }
.right-0  { right: 0 !important; }
.bottom-0 { bottom: 0 !important; }
.left-0   { left: 0 !important; }
.overflow-hidden  { overflow: hidden !important; }
.overflow-auto    { overflow: auto !important; }
.overflow-x-auto  { overflow-x: auto !important; }
.overflow-y-auto  { overflow-y: auto !important; }
.shadow-none { box-shadow: none !important; }
.shadow-sm   { box-shadow: var(--shadow-sm) !important; }
.shadow-md   { box-shadow: var(--shadow-md) !important; }
.shadow-lg   { box-shadow: var(--shadow-lg) !important; }
.opacity-0   { opacity: 0 !important; }
.opacity-50  { opacity: 0.5 !important; }
.opacity-75  { opacity: 0.75 !important; }
.opacity-100 { opacity: 1 !important; }
.cursor-pointer  { cursor: pointer !important; }
.cursor-default  { cursor: default !important; }
.cursor-not-allowed { cursor: not-allowed !important; }
.select-none { user-select: none !important; }
.select-text { user-select: text !important; }
.select-all  { user-select: all !important; }
.pointer-events-none { pointer-events: none !important; }
.pointer-events-auto { pointer-events: auto !important; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}
.not-sr-only {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
}
.transition-none { transition: none !important; }
.transition-fast { transition: all var(--transition-fast) !important; }
.transition-base { transition: all var(--transition-base) !important; }
.transition-slow { transition: all var(--transition-slow) !important; }
.animate-spin {
  animation: spin 1s linear infinite;
}
.animate-pulse {
  animation: pulse 2s ease-in-out infinite;
}
.animate-fade-in {
  animation: fade-in var(--transition-slow) ease forwards;
}
.animate-slide-up {
  animation: slide-up var(--transition-slow) ease forwards;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slide-up {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.num--positive { color: var(--color-success); }
.num--negative { color: var(--color-error); }
.num--neutral  { color: var(--color-text-muted); }
.aspect-square { aspect-ratio: 1 / 1; }
.aspect-video  { aspect-ratio: 16 / 9; }
.aspect-4-3    { aspect-ratio: 4 / 3; }
:root{--plan-ink:#123c31;--plan-soft:#edf7f2;--plan-line:#d8e8df}
[data-theme="dark"]{--color-bg:#111c19;--color-surface:#192923;--color-surface-raised:#20362d;--color-border:#375146;--color-border-light:#243a30;--color-text:#edf6ef;--color-text-secondary:#c0d2c7;--color-text-muted:#9bb5a5;--color-primary:#7bd5b0;--color-primary-dark:#9ae7c6;--color-primary-50:#233e32;--color-primary-100:#365c48;--color-success:#91d9a3;--plan-ink:#d6f7e7;--plan-soft:#20372c;--plan-line:#3c5c49}
.plan-wrap{max-width:1180px;margin:auto;padding:32px 24px 64px}.plan-intro{max-width:800px;margin:20px 0 30px}.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--color-primary-dark);margin-bottom:12px}.plan-intro h1{font-size:clamp(30px,4vw,48px);line-height:1.12;letter-spacing:-.035em;margin:0 0 18px}.plan-intro p{font-size:17px;max-width:660px}.plan-layout{display:grid;grid-template-columns:minmax(290px,390px) minmax(0,1fr);gap:24px;align-items:start}.plan-form,.plan-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:18px;padding:24px;min-width:0}.plan-form h2,.plan-card h2{font-size:21px;margin:0 0 16px}.plan-form h3{font-size:17px;margin:20px 0 12px}.plan-field{display:block;margin-bottom:16px;min-width:0}.plan-field span{display:block;font-size:13px;font-weight:650;margin-bottom:7px}.plan-field input,.plan-field select{width:100%;min-width:0;border:1px solid var(--color-border);border-radius:9px;background:var(--color-bg);color:var(--color-text);padding:11px 12px;font:inherit;min-height:44px}.plan-field small,.plan-note{font-size:12px;line-height:1.6;color:var(--color-text-secondary);display:block;margin-top:6px}.plan-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.plan-form details{border-top:1px solid var(--color-border);padding-top:16px;margin:18px 0}.plan-form summary{cursor:pointer;font-weight:650;margin-bottom:16px}.plan-actions{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.plan-button{background:var(--color-primary);color:#fff;font:inherit;font-weight:650;border:1px solid transparent;border-radius:9px;padding:10px 15px;cursor:pointer;min-height:44px}.plan-button.secondary{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}.plan-button:disabled{opacity:.45;cursor:default}.plan-result{display:grid;gap:18px;min-width:0}.plan-answer{background:var(--plan-soft);border-color:var(--plan-line)}.plan-answer .big{font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.15;letter-spacing:-.025em;color:var(--plan-ink);overflow-wrap:anywhere;margin:10px 0 14px}.plan-answer p:last-child{margin:0}.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.plan-metric{padding:16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:10px}.plan-metric span{display:block;font-size:12px;color:var(--color-text-secondary);margin-bottom:6px}.plan-metric strong{font-size:19px;overflow-wrap:anywhere}.plan-table{overflow:auto}.plan-table table{width:100%;border-collapse:collapse;font-size:13px}.plan-table th,.plan-table td{text-align:left;border-bottom:1px solid var(--color-border);padding:12px 10px;vertical-align:top}.plan-table th{color:var(--color-text-secondary);font-size:12px}.plan-card p{line-height:1.75}.plan-card ul,.guide-body ul,.guide-body ol{padding-left:22px}.plan-card li{margin:8px 0}.plan-warning{border-left:4px solid #b86e14;padding:12px 16px;background:var(--color-surface)}.plan-error{padding:20px;border:1px solid #b42318;border-radius:12px;color:var(--color-text);background:var(--color-surface)}.plan-error h2{font-size:20px}.plan-error[hidden]{display:none}.plan-guide{margin-top:30px;max-width:820px}.plan-links{display:flex;gap:16px;flex-wrap:wrap;margin:20px 0}.plan-links a{text-decoration:underline}.debt-entry{border:1px solid var(--color-border);padding:15px;border-radius:12px;margin:14px 0}.debt-entry legend{font-size:13px;font-weight:700;padding:0 5px}.debt-entry .plan-field{margin-bottom:10px}.plan-form fieldset{min-width:0}.plan-status{font-size:13px;min-height:20px}.plan-help{padding:20px;border-radius:12px;background:var(--plan-soft);margin:24px 0}.plan-report-inputs{display:none}.plan-home-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0}.plan-home-choices a{display:block;padding:26px;border:1px solid var(--plan-line);border-radius:16px;background:var(--color-surface);color:var(--color-text);text-decoration:none}.plan-home-choices a:hover{border-color:var(--color-primary);transform:translateY(-2px)}.plan-home-choices h2{font-size:21px;margin:12px 0}.plan-home-choices p{font-size:14px}.plan-home-choices b{color:var(--color-primary-dark);font-size:13px}.theme-button{position:fixed;bottom:18px;right:18px;z-index:90;border:1px solid var(--color-border);border-radius:30px;background:var(--color-surface);color:var(--color-text);padding:10px 14px;cursor:pointer;box-shadow:0 2px 8px #0001}.guide-body{max-width:760px;line-height:1.85}.guide-body h2{font-size:25px;margin:30px 0 14px}.guide-body h3{font-size:19px;margin:24px 0 10px}.guide-body a{text-decoration:underline}.guide-body .plan-table{margin:20px 0}
@media(max-width:760px){.plan-wrap{padding:20px 16px 50px}.plan-layout{grid-template-columns:1fr}.plan-form,.plan-card{padding:20px}.plan-home-choices{grid-template-columns:1fr}.plan-intro{margin-top:15px}.plan-intro h1{font-size:33px}.plan-table th,.plan-table td{padding:10px 7px}.plan-grid{gap:9px}.plan-metric{padding:12px}.plan-metric strong{font-size:17px}}
@media print{.plan-form,.plan-actions,.plan-guide,.plan-links,.theme-button,.plan-status,.plan-note.screen-only{display:none!important}.plan-wrap{max-width:none;padding:0}.plan-layout{display:block}.plan-result{display:block}.plan-card{margin:0 0 14px;padding:15px;border:1px solid #aaa;background:#fff!important;color:#111;break-inside:avoid}.plan-answer .big{color:#111}.plan-report-inputs{display:block!important;font-size:10pt;white-space:pre-wrap;margin:15px 0;border-bottom:1px solid #999;padding-bottom:12px}.plan-intro{margin:8px 0}.plan-intro h1{font-size:24pt}.plan-intro p{font-size:10pt}.plan-metric{background:#fff}.plan-table{overflow:visible}.plan-table table{font-size:9pt}.plan-table th,.plan-table td{color:#111}.plan-card details{display:block}.plan-warning{border-color:#555}}
[data-theme="dark"] .plan-button:not(.secondary){color:#11251c}
[hidden]{display:none!important}.nw-invalid .nw-hero,.nw-invalid .chart-card{display:none!important}.nw-item-row input{min-width:0} input[aria-invalid="true"]{border-color:#b42318!important} .nw-hero>div{flex-wrap:wrap} .plan-table th,.plan-table td{overflow-wrap:anywhere}
@media(max-width:420px){.plan-pair{grid-template-columns:1fr}.plan-grid{grid-template-columns:1fr}}
@media print{body.invalid-calculation .result-panel,.nw-invalid .nw-hero,.nw-invalid .chart-card{display:none!important}}
@media print{ins.adsbygoogle,.google-auto-placed,iframe,.adsbygoogle{display:none!important}}
@media print {
  @page {
    size: A4 portrait;
    margin: 20mm 18mm 20mm 18mm;
  }
  @page :first {
    margin-top: 15mm;
  }
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    animation: none !important;
    transition: none !important;
  }
  html {
    font-size: 11pt;
  }
  body {
    background: #fff !important;
    color: #000 !important;
    font-family: Georgia, 'Times New Roman', serif;
    line-height: 1.5;
  }
  .site-header,
  .primary-nav,
  .menu-toggle,
  .mobile-nav-overlay,
  .mobile-nav-panel,
  .site-footer,
  .breadcrumb,
  .calc-panel__reset,
  .optional-toggle,
  .optional-fields,
  .calc-panel__footer .btn--secondary,
  .chart-card__controls,
  .amort-view-btn,
  .table-pagination,
  .related-tools,
  .faq-section,
  .pdf-btn,
  .skip-link,
  .toast-container,
  .result-placeholder,
  .nav-dropdown,
  .calc-panel,
  .print-hidden {
    display: none !important;
  }
  .page-wrapper {
    display: block;
  }
  .main-content {
    padding-top: 0 !important;
  }
  .calc-page {
    padding-block: 0 !important;
  }
  .calc-page__header {
    padding-top: 0 !important;
    border-bottom: 2pt solid #000 !important;
    margin-bottom: 12pt !important;
    padding-bottom: 8pt !important;
  }
  .container {
    max-width: 100% !important;
    padding-inline: 0 !important;
  }
  .calc-shell {
    display: block !important;
  }
  .calc-inputs-col {
    display: none !important;
  }
  .result-panel {
    width: 100% !important;
  }
  body::before {
    content: 'MoneyMaths.net';
    display: block;
    font-family: Arial, sans-serif;
    font-size: 9pt;
    font-weight: bold;
    color: #1a6b55;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 4pt;
  }
  body::after {
    content: 'Free finance calculators at MoneyMaths.net · Printed on ' attr(data-print-date);
    display: block;
    font-family: Arial, sans-serif;
    font-size: 8pt;
    color: #666;
    margin-top: 12pt;
    padding-top: 6pt;
    border-top: 0.5pt solid #ccc;
    text-align: center;
  }
  h1 {
    font-size: 20pt !important;
    color: #000 !important;
    margin-bottom: 4pt !important;
    font-family: Arial, sans-serif !important;
    page-break-after: avoid;
  }
  h2 {
    font-size: 14pt !important;
    color: #000 !important;
    margin-top: 12pt !important;
    margin-bottom: 4pt !important;
    font-family: Arial, sans-serif !important;
    page-break-after: avoid;
  }
  h3 {
    font-size: 12pt !important;
    color: #000 !important;
    margin-top: 8pt !important;
    margin-bottom: 3pt !important;
    font-family: Arial, sans-serif !important;
    page-break-after: avoid;
  }
  p {
    font-size: 10pt !important;
    color: #333 !important;
    line-height: 1.5 !important;
    margin-bottom: 6pt !important;
  }
  a {
    color: #000 !important;
    text-decoration: none !important;
  }
  a[href]::after {
    content: none !important;
  }
  .result-hero {
    background: #f0f7f4 !important;
    border: 2pt solid #1a6b55 !important;
    border-radius: 4pt !important;
    padding: 12pt !important;
    margin-bottom: 12pt !important;
    page-break-inside: avoid;
    color: #000 !important;
  }
  .result-hero::before,
  .result-hero::after {
    display: none !important;
  }
  .result-hero__label {
    font-size: 8pt !important;
    color: #1a6b55 !important;
    font-family: Arial, sans-serif !important;
    letter-spacing: 0.08em !important;
  }
  .result-hero__value {
    font-size: 28pt !important;
    color: #1a6b55 !important;
    font-family: Arial, sans-serif !important;
  }
  .result-hero__sub {
    font-size: 9pt !important;
    color: #333 !important;
  }
  .result-hero__badges {
    display: none !important;
  }
  .result-stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6pt !important;
    margin-bottom: 12pt !important;
    page-break-inside: avoid;
  }
  .result-stat {
    border: 0.5pt solid #ccc !important;
    border-radius: 3pt !important;
    padding: 6pt !important;
    background: #fafafa !important;
  }
  .result-stat__label {
    font-size: 7pt !important;
    color: #666 !important;
    font-family: Arial, sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
  }
  .result-stat__value {
    font-size: 13pt !important;
    color: #000 !important;
    font-family: Arial, sans-serif !important;
    font-weight: bold !important;
  }
  .result-stat__value--positive { color: #15803d !important; }
  .result-stat__value--negative { color: #dc2626 !important; }
  .result-stat__value--primary  { color: #1a6b55 !important; }
  .breakdown-bar {
    border: 0.5pt solid #ccc !important;
    border-radius: 3pt !important;
    padding: 8pt !important;
    margin-bottom: 12pt !important;
    page-break-inside: avoid;
  }
  .breakdown-bar__track {
    height: 8pt !important;
    border-radius: 2pt !important;
  }
  .breakdown-bar__title {
    font-size: 10pt !important;
    font-family: Arial, sans-serif !important;
    color: #000 !important;
  }
  .breakdown-bar__legend-item {
    font-size: 9pt !important;
    color: #333 !important;
  }
  .breakdown-bar__legend-value {
    font-family: 'Courier New', monospace !important;
    font-size: 9pt !important;
  }
  .chart-card {
    border: 0.5pt solid #ccc !important;
    border-radius: 3pt !important;
    padding: 8pt !important;
    margin-bottom: 12pt !important;
    page-break-inside: avoid;
  }
  .chart-card__title {
    font-size: 11pt !important;
    font-family: Arial, sans-serif !important;
    color: #000 !important;
    margin-bottom: 6pt !important;
  }
  .chart-canvas-wrapper {
    height: 200pt !important;
  }
  .amort-card {
    border: 0.5pt solid #ccc !important;
    border-radius: 3pt !important;
    margin-bottom: 12pt !important;
  }
  .amort-card__header {
    padding: 6pt 8pt !important;
    border-bottom: 0.5pt solid #ccc !important;
  }
  .amort-card__title {
    font-size: 11pt !important;
    font-family: Arial, sans-serif !important;
    color: #000 !important;
  }
  .table-scroll {
    overflow: visible !important;
  }
  .amort-table {
    min-width: 0 !important;
    width: 100% !important;
    font-size: 8pt !important;
    font-family: 'Courier New', monospace !important;
  }
  .amort-table thead tr {
    background: #f0f0f0 !important;
  }
  .amort-table th {
    font-size: 7pt !important;
    padding: 4pt 6pt !important;
    color: #333 !important;
    font-family: Arial, sans-serif !important;
    border-bottom: 0.5pt solid #999 !important;
  }
  .amort-table td {
    font-size: 8pt !important;
    padding: 3pt 6pt !important;
    color: #000 !important;
    border-bottom: 0.25pt solid #e0e0e0 !important;
  }
  .amort-table tbody tr:hover td {
    background: none !important;
  }
  .amort-table .year-row td {
    background: #eee !important;
    font-size: 7pt !important;
    font-family: Arial, sans-serif !important;
    padding: 3pt 6pt !important;
  }
  .amort-table .totals-row td {
    background: #f0f7f4 !important;
    font-weight: bold !important;
    border-top: 1pt solid #1a6b55 !important;
    color: #1a6b55 !important;
  }
  .result-hero,
  .result-stats,
  .breakdown-bar,
  .chart-card {
    page-break-inside: avoid;
  }
  .amort-card {
    page-break-before: always;
  }
  tr {
    page-break-inside: avoid;
  }
  h2, h3 {
    page-break-after: avoid;
  }
  .print-block {
    display: block !important;
  }
  .print-inputs-summary {
    border: 0.5pt solid #ccc;
    border-radius: 3pt;
    padding: 8pt;
    margin-bottom: 12pt;
    background: #fafafa;
    page-break-inside: avoid;
  }
  .print-inputs-summary__title {
    font-size: 9pt;
    font-weight: bold;
    font-family: Arial, sans-serif;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 6pt;
  }
  .print-inputs-summary__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4pt;
  }
  .print-inputs-summary__item {
    display: flex;
    flex-direction: column;
    gap: 1pt;
  }
  .print-inputs-summary__label {
    font-size: 7pt;
    color: #666;
    font-family: Arial, sans-serif;
  }
  .print-inputs-summary__value {
    font-size: 9pt;
    font-weight: bold;
    color: #000;
    font-family: 'Courier New', monospace;
  }
  .print-privacy-note {
    font-size: 7pt;
    color: #888;
    text-align: center;
    margin-top: 8pt;
    font-family: Arial, sans-serif;
    font-style: italic;
  }
}
:root{--color-bg:#f7f8f3;--color-surface:#fff;--color-surface-raised:#fff;--color-text:#172b25;--color-text-secondary:#53645c;--color-text-muted:#62736a;--color-border:#dce3dc;--color-border-light:#eaf0e9;--color-primary:#176448;--color-primary-dark:#134e3b;--color-primary-light:#26785a;--color-primary-50:#edf4e8;--color-primary-100:#dfeccc;--color-success:#24734d;--color-accent:#a86a16;--plan-ink:#173d2e;--plan-soft:#edf4e8;--plan-line:#d5e1cc;--font-body:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-display:var(--font-body);--mm-serif:Georgia,"Times New Roman",serif;--mm-dark:#173d2e;--mm-lime:#dbeaac;--mm-shadow:0 16px 48px -28px #193e3140}
[data-theme="dark"]{color-scheme:dark;--color-text-on-primary:#14291c;--color-info:#99d5ee;--color-warning:#f0c274;--color-error:#ffa99b;--color-bg:#111d18;--color-surface:#192a22;--color-surface-raised:#20352a;--color-text:#eaf0e5;--color-text-secondary:#c0cec0;--color-text-muted:#afbfaf;--color-border:#3a5140;--color-border-light:#2e4435;--color-primary:#add598;--color-primary-dark:#c1e2ac;--color-primary-light:#c1e2ac;--color-primary-50:#263e2c;--color-primary-100:#35503c;--color-success:#add598;--color-success-bg:#243b2d;--color-warning-bg:#403722;--color-error-bg:#472e2a;--color-info-bg:#243a40;--plan-ink:#dceacb;--plan-soft:#253d2c;--plan-line:#46633e;--mm-shadow:none}
html{scroll-padding-top:24px}body{font-size:16px}a,button,input,select,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--color-primary);outline-offset:4px}button,a,summary{-webkit-tap-highlight-color:transparent}button:not(:disabled),summary{cursor:pointer}p{color:var(--color-text-secondary)}h1,h2,h3,h4{color:var(--color-text)}.main-content{padding-top:0}.page-wrapper{min-height:0}.mm-container{width:min(1180px,calc(100% - 64px));margin-inline:auto}.mm-header{background:var(--color-bg);border-bottom:1px solid var(--color-border);position:relative;z-index:100}.mm-header-inner{width:min(1240px,calc(100% - 64px));min-height:88px;margin:auto;display:flex;align-items:center;gap:30px}.mm-brand{display:inline-flex;align-items:center;gap:10px;font-weight:750;font-size:22px;letter-spacing:-.9px;color:var(--color-text);white-space:nowrap}.mm-brand-dot{color:var(--color-primary)}.mm-mark{display:inline-flex;align-items:center;justify-content:center;background:var(--mm-dark);color:#fff;width:38px;height:38px;border-radius:12px;font-family:Georgia,serif;font-size:27px;font-style:italic;letter-spacing:-3px;flex:none}.mm-mark>span{font-size:17px;align-self:flex-start;margin-top:1px}.mm-nav{margin-left:auto;display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}.mm-nav>a,.mm-menu>summary{padding:12px 0;min-height:44px;color:var(--color-text-secondary)}.mm-menu>summary{list-style:none;display:flex;align-items:center;gap:10px}.mm-menu>summary::-webkit-details-marker{display:none}.mm-nav a:hover{color:var(--color-primary)}.mm-menu-panel{position:absolute;top:calc(100% - 1px);left:50%;transform:translateX(-50%);width:min(1080px,calc(100vw - 32px));padding:28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:0 0 20px 20px;box-shadow:var(--mm-shadow);max-height:75vh;overflow:auto}.mm-menu-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px}.mm-menu-panel a{display:block;padding:10px 6px;font-size:14px;font-weight:500;border-radius:6px}.mm-menu-panel a:hover{background:var(--plan-soft)}.mm-theme{width:44px;height:44px;border:1px solid var(--color-border);border-radius:50%;background:var(--color-surface);color:var(--color-text);font-size:18px;flex:none}.mm-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:70px;padding-block:80px 70px;align-items:center}.eyebrow{font-size:11px;letter-spacing:.12em;font-weight:700;color:var(--color-primary-dark);margin-bottom:18px;line-height:1.5}.mm-hero .eyebrow{display:flex;align-items:center;gap:10px}.mm-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--color-primary);flex:none}.mm-hero h1{font-size:clamp(38px,4.4vw,62px);font-weight:550;line-height:1.1;letter-spacing:-2.8px;margin:0 0 25px}.mm-hero h1 em{font-family:var(--mm-serif);font-weight:400;color:var(--color-primary);letter-spacing:-2.4px}.mm-lead{max-width:480px;font-size:18px;line-height:1.75}.mm-hero-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin:28px 0 23px}.mm-cta{display:inline-flex;align-items:center;gap:24px;background:var(--mm-dark);color:#fff;padding:15px 21px;border-radius:10px;font-size:14px;font-weight:600;min-height:48px}.mm-cta:hover{background:#23563f;color:#fff}.mm-text-link{font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:5px}.mm-hero-note{font-size:11px;line-height:1.9}.mm-hero-note span{padding:0 5px}.mm-small{font-size:12px;line-height:1.75}.mm-sample{background:var(--color-surface);border:1px solid var(--color-border);border-radius:22px;padding:30px;box-shadow:var(--mm-shadow);transform:rotate(1deg)}.mm-sample-top{font-size:9px;letter-spacing:.1em;display:flex;gap:9px;align-items:center;margin-bottom:24px;color:var(--color-text-secondary);font-weight:700}.mm-sample h2{font-size:28px;font-weight:500;line-height:1.2;letter-spacing:-1px;margin-bottom:12px}.mm-comparison{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:27px 0 22px}.mm-comparison>div>span{font-size:12px;color:var(--color-text-secondary)}.mm-comparison strong{display:block;font-size:26px;font-weight:650;letter-spacing:-1px;font-variant-numeric:tabular-nums;margin:7px 0}.mm-comparison small{display:block;font-size:11px;letter-spacing:0;color:var(--color-text-secondary);font-weight:400}.mm-comparison p{font-size:11px;margin-top:8px}.mm-bar{height:7px;border-radius:9px;background:var(--color-border-light);overflow:hidden}.mm-bar>span{display:block;height:100%;border-radius:9px;background:var(--color-primary)}.mm-comparison>div+div .mm-bar>span{background:#a87936}.mm-sample-insight{display:flex;gap:12px;align-items:center;background:var(--plan-soft);border-radius:10px;padding:15px;margin-bottom:16px}.mm-sample-insight>span{font-size:26px;color:var(--color-primary)}.mm-sample-insight p{font-size:12px;color:var(--plan-ink);line-height:1.7}.mm-sample>a{font-size:12px;font-weight:600;display:inline-block;margin-top:15px;text-decoration:underline;text-underline-offset:4px}.mm-section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:30px}.mm-section-head .eyebrow{margin-bottom:10px}.mm-section-head h2{font-size:clamp(26px,3vw,34px);font-weight:550;line-height:1.2;letter-spacing:-1px}.mm-section-head>p{font-size:13px;line-height:1.7;flex-shrink:0}.mm-decisions{padding-block:40px 76px}.mm-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.mm-choice{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:25px;display:flex;flex-direction:column}.mm-choice:first-child{background:var(--mm-dark);border-color:var(--mm-dark);color:#fff}.mm-choice:first-child h3{color:#fff}.mm-choice:first-child p{color:#d5e3d6}.mm-choice-num{display:flex;justify-content:space-between;font-size:12px;color:var(--color-primary);margin-bottom:25px;font-variant-numeric:tabular-nums}.mm-choice:first-child .mm-choice-num{color:var(--mm-lime)}.mm-choice h3{font-size:22px;font-weight:550;line-height:1.3;letter-spacing:-.6px;max-width:260px;margin-bottom:12px}.mm-choice p{font-size:14px;line-height:1.7;margin-bottom:26px}.mm-choice-action{margin-top:auto;font-size:12px;font-weight:650}.mm-choice:hover,.mm-tool:hover,.mm-guide-card:hover{border-color:var(--color-primary);box-shadow:var(--mm-shadow)}.mm-directory{background:var(--color-surface);border-block:1px solid var(--color-border);padding:64px 0}.mm-category{margin-top:34px}.mm-category>h3{font-size:14px;font-weight:650;display:flex;align-items:center;gap:16px;margin-bottom:16px}.mm-category>h3:after{content:"";height:1px;background:var(--color-border);flex:1}.mm-tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.mm-tool{display:block;border:1px solid var(--color-border);border-radius:12px;padding:20px;background:var(--color-bg)}.mm-tool-top{display:flex;justify-content:space-between;align-items:center;color:var(--color-primary);margin-bottom:22px}.mm-tool-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--plan-soft);border:1px solid var(--plan-line);border-radius:9px;font-size:21px}.mm-tool h4{font-size:16px;font-weight:650;line-height:1.4;margin-bottom:8px;letter-spacing:-.3px}.mm-tool p{font-size:12px;line-height:1.75}.mm-reading{padding-block:70px}.mm-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.mm-guide-card{display:flex;flex-direction:column;min-height:225px;padding:27px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-surface)}.mm-guide-card .eyebrow{font-size:10px}.mm-guide-card h3{font-family:var(--mm-serif);font-size:25px;line-height:1.3;font-weight:400;margin-bottom:24px;letter-spacing:-.5px}.mm-guide-card>span:last-child{font-size:12px;display:flex;justify-content:space-between;margin-top:auto}.mm-principles{padding:30px 0 70px;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:50px}.mm-principles h2{font-size:29px;font-weight:500;letter-spacing:-1px;line-height:1.25}.mm-principles h3{font-size:15px;font-weight:650;margin-bottom:12px}.mm-principles p{font-size:13px;line-height:1.8}.mm-principles a{font-size:12px;text-decoration:underline;display:inline-block;margin-top:17px;text-underline-offset:4px}.mm-footer{border-top:1px solid var(--color-border);padding:48px max(24px,calc((100% - 1180px)/2)) 24px;background:var(--color-surface)}.mm-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:35px}.mm-footer-grid>div>p{margin-top:17px;font-size:14px;line-height:1.8}.mm-footer h2{font-size:12px;font-weight:700;margin-bottom:15px}.mm-footer nav>a{display:block;font-size:12px;color:var(--color-text-secondary);padding:6px 0}.mm-footer-bottom{border-top:1px solid var(--color-border);margin-top:36px;padding-top:22px;display:flex;justify-content:space-between;gap:25px;align-items:center}.mm-footer-bottom p{font-size:11px}.mm-footer-bottom nav{display:flex;gap:20px}.mm-footer-bottom a{font-size:11px!important}.mm-footer a:hover{text-decoration:underline;text-underline-offset:4px}
.plan-wrap{padding-top:32px}.plan-intro{margin:20px 0 32px;max-width:880px}.plan-intro h1,.page-header__title{font-size:clamp(30px,3.4vw,44px);letter-spacing:-1.4px;font-weight:550;line-height:1.15}.plan-intro p{font-size:16px;line-height:1.8}.plan-layout{gap:30px}.plan-form,.plan-card,.calc-panel,.chart-card,.table-card{box-shadow:0 4px 18px -14px #16392a25;border-color:var(--color-border);border-radius:16px}.plan-form{border-top:3px solid var(--color-primary)}.plan-form h2{font-size:19px}.plan-field input,.plan-field select,.input{background:var(--color-surface);border-radius:8px;font-size:16px;min-height:46px}.plan-field span{font-size:12px}.plan-field small,.plan-note{font-size:12px;line-height:1.8}.plan-button{border-radius:8px;min-height:44px;font-size:13px;padding:11px 15px}.plan-answer{border-top:3px solid var(--color-primary);background:var(--plan-soft)}.plan-answer .big{font-size:clamp(28px,3.7vw,43px);font-weight:600;letter-spacing:-1.5px;font-variant-numeric:tabular-nums}.plan-metric strong{font-variant-numeric:tabular-nums}.plan-metric{border-radius:9px;background:var(--color-surface)}.plan-result{min-height:340px}.plan-guide{padding-top:28px;border-top:1px solid var(--color-border)}.plan-guide h2{font-size:26px;margin-bottom:16px;letter-spacing:-.7px}.plan-guide h3{font-size:18px;margin:25px 0 10px}.plan-guide p{margin-bottom:15px}.plan-guide ol,.plan-form ol{list-style:decimal;padding-left:23px}.plan-guide ul,.plan-card ul{list-style:disc;padding-left:23px}.plan-guide li{margin-bottom:8px;color:var(--color-text-secondary)}.plan-guide a{text-decoration:underline;text-underline-offset:3px}.plan-links{font-size:12px}.plan-form details summary{font-size:14px}.plan-table th{font-weight:650}.plan-table caption{font-size:12px;color:var(--color-text-secondary);text-align:left;padding-bottom:12px}.plan-table td,.plan-table th{padding:13px 11px}.plan-table tbody tr:nth-child(even){background:var(--color-bg)}.guide-body{max-width:760px;margin:auto;font-size:16px;line-height:1.9}.guide-body p{margin:0 0 20px}.guide-body h2{font-size:27px;font-weight:550;letter-spacing:-.7px;line-height:1.3;margin:38px 0 16px;scroll-margin-top:30px}.guide-body h3{font-size:20px}.guide-body ul{list-style:disc}.guide-body ol{list-style:decimal}.guide-body li{margin:10px 0;color:var(--color-text-secondary)}main[data-page="guide"]>.plan-intro{max-width:760px;margin:25px auto 30px}main[data-page="guide"]>.plan-links{max-width:760px;margin:0 auto 20px}.mm-toc{max-width:760px;margin:0 auto 30px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface);padding:16px 20px}.mm-toc summary{font-size:13px;font-weight:650}.mm-toc ol{list-style:decimal;padding:12px 0 0 20px}.mm-toc li{font-size:13px;padding:6px 0}.mm-toc a{text-decoration:underline;text-underline-offset:3px}.guide-body .plan-home-choices{gap:12px}.guide-body .plan-home-choices a{padding:24px;transition:none}.guide-body .plan-home-choices h2{margin:0 0 10px;font-size:24px}.guide-body .plan-home-choices p{font-size:14px;margin:0}.guide-body .plan-home-choices a:hover{transform:none}.privacy-badge{font-size:11px}.nw-section{background:var(--color-surface)!important}.skip-link:focus{z-index:200}.mm-theme:disabled{visibility:hidden}.theme-button{display:none}.plan-table,.table-scroll,.amortization-table-wrapper{overscroll-behavior-x:contain}canvas{max-width:100%}.mm-header [aria-current="page"]{text-decoration:underline;text-underline-offset:5px}
@media(min-width:1000px){main[data-page="guide"]{padding-block:40px 75px}.guide-body{padding:32px 0}.calc-sidebar{top:24px}}
@media(max-width:1000px){.mm-hero{gap:32px;padding-block:50px}.mm-hero h1{letter-spacing:-1.7px}.mm-sample{padding:22px;transform:none}.mm-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-menu-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.mm-section-head>p{display:none}.mm-choice{padding:20px}.mm-principles{gap:24px}.mm-hero-actions{gap:16px}}
@media(max-width:720px){.mm-container{width:calc(100% - 36px)}.mm-header-inner{width:calc(100% - 32px);min-height:72px;gap:15px}.mm-brand{font-size:19px;gap:8px}.mm-mark{width:32px;height:32px;font-size:24px;border-radius:10px}.mm-mark>span{font-size:15px}.mm-nav{gap:16px;font-size:12px}.mm-nav-about{display:none}.mm-theme{width:38px;height:38px}.mm-hero{grid-template-columns:1fr;gap:34px;padding-block:40px 28px}.mm-hero h1{font-size:43px;letter-spacing:-1.8px}.mm-lead{font-size:16px}.mm-hero-note{font-size:10px}.mm-sample{max-width:520px;width:100%;padding:25px}.mm-sample h2{font-size:26px}.mm-comparison strong{font-size:26px}.mm-decisions{padding-block:34px 45px}.mm-choice-grid,.mm-guide-grid{grid-template-columns:1fr}.mm-choice h3{max-width:none;font-size:23px}.mm-choice-num{margin-bottom:15px}.mm-choice p{margin-bottom:18px}.mm-section-head{align-items:start;margin-bottom:24px;flex-direction:column;gap:15px}.mm-section-head h2{font-size:28px}.mm-directory{padding-block:40px}.mm-category{margin-top:25px}.mm-tool{padding:16px}.mm-tool-top{margin-bottom:15px}.mm-tool h4{font-size:15px}.mm-tool p{font-size:12px}.mm-reading{padding-block:45px}.mm-guide-card{min-height:185px}.mm-principles{grid-template-columns:1fr;gap:30px;padding:0 0 45px}.mm-footer-grid{grid-template-columns:1fr 1fr;gap:28px}.mm-footer-grid>div{grid-column:1/-1}.mm-footer-bottom{align-items:start;flex-direction:column;gap:12px}.plan-wrap{padding:24px 18px 44px}.plan-layout{gap:24px}.plan-intro h1{font-size:33px;letter-spacing:-1px}.plan-form,.plan-card{padding:20px}.guide-body{font-size:16px;line-height:1.85}.guide-body h2{font-size:25px}.plan-actions{gap:8px}.plan-result{min-height:280px}.plan-table{max-width:100%}.plan-links{gap:12px}}
@media(max-width:390px){.mm-header-inner{gap:9px}.mm-brand{font-size:17px}.mm-nav{gap:10px}.mm-nav>a{font-size:12px}.mm-theme{width:34px;height:34px}.mm-hero h1{font-size:37px}.mm-tool-grid{grid-template-columns:1fr}.mm-menu-panel{padding:18px;gap:12px}.mm-comparison{gap:16px}.mm-comparison strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media print{.mm-header,.mm-footer,.mm-toc,.skip-link{display:none!important}body{background:#fff!important;color:#111!important}.main-content{padding:0}.plan-wrap{padding:0}.guide-body{padding:0;max-width:none}.guide-body p,.guide-body li{color:#111}.plan-result{min-height:0}.plan-form{display:none!important}.plan-card,.plan-metric{box-shadow:none}.mm-hero{display:block}.mm-sample{transform:none}.plan-table{overflow:visible}}
.calc-page__title{font-size:clamp(30px,3.4vw,44px);font-weight:550;letter-spacing:-1.4px;line-height:1.15}.calc-page__desc{font-size:16px;line-height:1.8}.result-hero p{color:inherit}@media(min-width:1024px){.calc-inputs-col{top:24px}}
@media(max-width:390px){.mm-header .mm-mark{display:none}.mm-header .mm-brand{gap:0}}
.calc-shell>* , .result-panel, .chart-card, .table-card, .plan-layout>*{min-width:0;max-width:100%}
.result-hero__value{font-size:clamp(1.75rem,4vw,3rem);line-height:1.15;overflow-wrap:anywhere}
.result-stat__value,.stat-card__value{overflow-wrap:anywhere}
.mm-menu:not([open])>.mm-menu-panel{display:none}
.mm-menu-panel{grid-template-columns:repeat(3,minmax(0,1fr))}
.mm-header-inner{flex-wrap:wrap}.mm-nav{min-width:0}
@media(max-width:720px){.mm-menu-panel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:340px){.mm-header-inner{column-gap:8px}.mm-nav{gap:8px}.mm-brand{font-size:16px}.mm-theme{width:32px;height:32px}}
.plan-result[aria-busy="true"]{opacity:.6}.nw-item-row .nw-remove-btn{min-width:44px;min-height:44px}
@media print{.result-hero{background:#fff!important}.result-hero__value,.result-hero__label,.result-hero__sub,.result-hero__badge{color:#111!important}}