/* Shared palette. Keep this sheet after the page's structural stylesheet. */
:root,
:root[data-theme="oled"] {
  color-scheme: dark;
  --ft-bg: #000000;
  --ft-surface: #0b0b0a;
  --ft-raised: #121211;
  --ft-subtle: #1b1a16;
  --ft-border: #30302b;
  --ft-text: #f5f4f0;
  --ft-muted: #aaa89f;
  --ft-accent: #ffe86d;
  --ft-on-accent: #25251f;
  --ft-accent-hover: #f2d34f;
  --ft-accent-text: #ffe86d;
  --ft-accent-soft: #292514;
  --ft-accent-border: #665725;
  --ft-secondary: #a6a69d;
  --ft-error-bg: #2a131a;
  --ft-error: #ffb0c0;
  --ft-error-border: #683143;
  --ft-warning-bg: #271f10;
  --ft-warning: #e7c783;
  --ft-warning-border: #5c4825;
  --ft-success-bg: #12251c;
  --ft-success: #a0dfb7;
  --ft-success-border: #285a3e;
  --ft-shadow: 0 24px 72px #00000038;
  --bg: var(--ft-bg);
  --surface: var(--ft-surface);
  --panel: var(--ft-raised);
  --text: var(--ft-text);
  --ink: var(--ft-text);
  --muted: var(--ft-muted);
  --line: var(--ft-border);
  --border: var(--ft-border);
  --mint: var(--ft-accent-text);
  --green: var(--ft-accent-text);
  --lime: var(--ft-secondary);
  --violet: var(--ft-accent);
  --violet-dark: var(--ft-accent-hover);
  background: var(--ft-bg);
  color: var(--ft-text);
}
:root[data-theme="light"] {
  color-scheme: light;
  --ft-bg: #ffffff;
  --ft-surface: #ffffff;
  --ft-raised: #faf9f5;
  --ft-subtle: #f1efe7;
  --ft-border: #e3e1d8;
  --ft-text: #2d2d2d;
  --ft-muted: #68675f;
  --ft-accent-hover: #f2d34f;
  --ft-accent-text: #756000;
  --ft-accent-soft: #fff5c7;
  --ft-accent-border: #d5c16f;
  --ft-secondary: #77786d;
  --ft-error-bg: #fff1f4;
  --ft-error: #a32949;
  --ft-error-border: #f1ccd7;
  --ft-warning-bg: #fff8e8;
  --ft-warning: #815e16;
  --ft-warning-border: #ead8a9;
  --ft-success-bg: #eff9f2;
  --ft-success: #246842;
  --ft-success-border: #c4e3ce;
  --ft-shadow: 0 24px 72px #302d180b;
}
:root body {
  background: var(--ft-bg);
  color: var(--ft-text);
}
::selection {
  background: var(--ft-accent-soft);
  color: var(--ft-accent-text);
}
:root :is(button, a, input, textarea, select, summary):focus-visible {
  outline: 2px solid var(--ft-accent-text);
  outline-offset: 4px;
}
.theme-control,
.sidebar-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 44px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--ft-border);
  border-radius: 10px;
  background: var(--ft-surface);
  color: var(--ft-muted);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  flex-shrink: 0;
}
.theme-control:hover,
.sidebar-control:hover {
  background: var(--ft-accent-soft);
  color: var(--ft-accent-text);
  border-color: var(--ft-accent-border);
}
.theme-control svg,
.sidebar-control svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-control[data-current-theme="oled"] .theme-moon,
.theme-control[data-current-theme="light"] .theme-sun {
  display: none;
}
.header-actions,
.topbar-controls,
.auth-topbar {
  display: flex;
  align-items: center;
  gap: 12px;
}
.header-actions {
  justify-self: end;
}
.auth-topbar {
  justify-content: space-between;
}
.app-body .app-topbar > p {
  flex: 1;
  min-width: 0;
}
.app-body .sidebar-control {
  padding: 10px;
}
.sidebar,
.app-nav {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.sidebar::-webkit-scrollbar,
.app-nav::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.app-body .sidebar {
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Shared controls and surfaces. */
:root .button-primary {
  background: var(--ft-accent);
  color: var(--ft-on-accent);
  border-color: transparent;
  box-shadow: 0 3px 12px #ffe86d1c;
}
:root .button-primary:hover:not(:disabled) {
  background: var(--ft-accent-hover);
  color: var(--ft-on-accent);
}
:root :is(.button-secondary, .button-ghost, .button-outline, .button-icon, .header-cta) {
  background: var(--ft-surface);
  color: var(--ft-text);
  border: 1px solid var(--ft-border);
}
:root :is(.button-secondary, .button-ghost, .button-outline, .button-icon, .header-cta):hover:not(:disabled) {
  background: var(--ft-subtle);
  border-color: var(--ft-accent-border);
}
:root .text-link,
:root :is(.auth-switch, .auth-support, .label-row) a {
  color: var(--ft-accent-text);
}
:root :is(.field, .search-form, .contact-form-card) :is(input, select, textarea) {
  color: var(--ft-text);
  background: var(--ft-surface);
  border-color: var(--ft-border);
  min-height: 44px;
}
:root :is(.field, .search-form, .contact-form-card) :is(input, textarea)::placeholder {
  color: var(--ft-muted);
  opacity: 1;
}
:root :is(.field, .search-form, .contact-form-card) :is(input, select, textarea):focus {
  border-color: var(--ft-accent-text);
}
:root :is(.field, .search-form) input:disabled {
  color: var(--ft-muted);
  background: var(--ft-subtle);
}
:root .notice-info {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
  color: var(--ft-accent-text);
}
:root :is(.notice-error, .toast-error) {
  background: var(--ft-error-bg);
  border-color: var(--ft-error-border);
  color: var(--ft-error);
}
:root .notice-success {
  background: var(--ft-success-bg);
  border-color: var(--ft-success-border);
  color: var(--ft-success);
}
:root .button-text-danger {
  color: var(--ft-error);
}
:root .button-text-danger:hover {
  background: var(--ft-error-bg);
}

/* Auth and workspace use the same neutral surfaces in both palettes. */
.auth-body .auth-brand {
  background: var(--ft-surface);
  border-right: 1px solid var(--ft-border);
  color: var(--ft-text);
}
.auth-body .auth-brand::before {
  background: radial-gradient(ellipse, #ffe86d20, transparent 67%);
}
.auth-body .auth-illustration {
  background: var(--ft-raised);
  border-color: var(--ft-accent-border);
}
.auth-body :is(.auth-brand .brand, .auth-pitch h1, .illustration-label) {
  color: var(--ft-text);
}
.auth-body :is(.auth-pitch > p, .auth-trust p, .auth-brand-footer, .illustration-foot,
  .auth-back, .auth-description, .auth-support, .auth-legal, .auth-switch, .auth-divider,
  .field-hint, .password-toggle) {
  color: var(--ft-muted);
}
.auth-body :is(.mint, .auth-card .eyebrow, .illustration-path, .trust-icon) {
  color: var(--ft-accent-text);
}
.auth-body :is(.illustration-foot, .auth-support, .trust-icon) {
  border-color: var(--ft-border);
}
.auth-body .illustration-lines span {
  border-color: var(--ft-border);
}
.auth-body .illustration-dot {
  background: var(--ft-accent-text);
  box-shadow: 0 0 0 4px var(--ft-accent-soft);
}
.auth-body .auth-divider::before,
.auth-body .auth-divider::after {
  background: var(--ft-border);
}
:root :is(.field label, .label-row label) {
  color: var(--ft-text);
}
.app-body :is(.sidebar, .app-topbar, .panel, .metric-card, .account-card, .confirm-dialog) {
  background: var(--ft-surface);
  border-color: var(--ft-border);
  color: var(--ft-text);
}
.app-body :is(.sidebar > .brand, .workspace strong, .user-row strong, .app-topbar strong,
  .page-heading h1, .connection-text h3, .account-card-heading strong, .account-card h3,
  .panel-heading h2, .description-cell strong, .metric-card > strong, .account-balance,
  .empty-hero h2, .explanation-card h3) {
  color: var(--ft-text);
}
.app-body :is(.workspace > div > span, .nav-label, .app-nav a, .sidebar-note p,
  .sidebar-note strong, .sidebar-note > a, .user-row > div > span, .breadcrumb-brand,
  .secure-indicator, .page-heading p, .page-heading .eyebrow, .filters .field label,
  .sync-caption, .metric-label, .metric-card > p, .panel-heading p, .chart-legend > span,
  .panel-footnote, .panel-empty > p, .panel-empty > span, .category-header,
  .transactions-table th, .transactions-table td, .transactions-table .date-cell,
  .data-note, .connection-text p, .account-card-heading div > span, .account-number,
  .account-balance-label, .account-card-foot, .pagination, .app-footer, .empty-footnote,
  .empty-hero > p, .empty-hero .eyebrow, .explanation-card p, .security-panel > p,
  .confirm-dialog p, .initial-loading, .field-hint, .connection-source) {
  color: var(--ft-muted);
}
.app-body :is(.workspace, .chart-legend, .transactions-table th) {
  background: var(--ft-raised);
  border-color: var(--ft-border);
}
.app-body :is(.workspace-avatar, .user-avatar, .institution-avatar, .empty-symbol,
  .nav-count, .subtle-badge, .currency-badge, .explanation-card, .metric-arrow) {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
  color: var(--ft-accent-text);
}
.app-body :is(.workspace-check, .logout-button, .tiny-lock, .explanation-icon,
  .category-header > strong) {
  color: var(--ft-accent-text);
  border-color: var(--ft-accent-border);
}
.app-body :is(.app-nav a:hover, .logout-button:hover) {
  background: var(--ft-subtle);
  color: var(--ft-text);
}
.app-body .app-nav a[aria-current="page"] {
  background: var(--ft-accent-soft);
  color: var(--ft-accent-text);
}
.app-body .app-nav a[aria-current="page"] .nav-count {
  background: var(--ft-surface);
  color: var(--ft-accent-text);
}
.app-body :is(.user-row, .filters, .panel-footnote, .recent-panel .panel-heading,
  .connection-row, .transactions-table td, .transactions-table th, .pagination,
  .settings-panel .panel-heading, .account-card-foot, .app-footer, .categories-list .panel-empty) {
  border-color: var(--ft-border);
}
.app-body .filters .period-field select {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
  color: var(--ft-accent-text);
}
.app-body .empty-hero {
  background: radial-gradient(ellipse at 50% 0, var(--ft-accent-soft), transparent 70%), var(--ft-surface);
  border-color: var(--ft-border);
}
.app-body .balance-card {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
}
.app-body .balance-card :is(.metric-label, strong, p) {
  color: var(--ft-accent-text);
}
.app-body :is(.secure-indicator > span, .category-track > span) {
  background: var(--ft-accent-text);
}
.app-body .metric-label .expense {
  background: var(--ft-subtle);
  color: var(--ft-secondary);
}
.app-body .chart-label {
  fill: var(--ft-muted);
}
.app-body #cashflow-chart [stroke="#e8e8ee"] {
  stroke: var(--ft-border);
}
.app-body #cashflow-chart [stroke="#7e9c27"] {
  stroke: var(--ft-secondary);
}
.app-body #cashflow-chart [fill="#7e9c27"] {
  fill: var(--ft-secondary);
}
.app-body #cashflow-chart [stroke="#ffe86d"] {
  stroke: var(--ft-accent-text);
}
.app-body #cashflow-chart [fill="#ffe86d"] {
  fill: var(--ft-accent-text);
}
.app-body #cashflow-chart [stroke="#fff"] {
  stroke: var(--ft-surface);
}
.app-body .category-track {
  background: var(--ft-subtle);
}
.app-body .empty-chart-icon {
  color: var(--ft-accent-text) !important;
}
.app-body .transactions-table td.amount-income {
  color: var(--ft-accent-text);
}
.app-body .transactions-table td.amount-expense {
  color: var(--ft-muted);
}
.app-body :is(.status-complete, .status-neutral) {
  background: var(--ft-accent-soft);
  color: var(--ft-accent-text);
}
.app-body :is(.status-pending, .status-warning) {
  background: var(--ft-warning-bg);
  color: var(--ft-warning);
}
.app-body .status-error {
  background: var(--ft-error-bg);
  color: var(--ft-error);
}
.app-body .connection-text .connection-error {
  color: var(--ft-error);
}
.app-body .confirm-dialog {
  box-shadow: var(--ft-shadow);
}
.app-body .confirm-dialog::backdrop {
  background: #000000a3;
  backdrop-filter: blur(5px);
}
.app-body .dialog-icon {
  background: var(--ft-error-bg);
  border-color: var(--ft-error-border);
  color: var(--ft-error);
}
.app-body .toast:not(.toast-error) {
  background: var(--ft-raised);
  color: var(--ft-text);
  border-color: var(--ft-border);
}
.app-body .spinner {
  border-color: var(--ft-border);
  border-top-color: var(--ft-accent-text);
}
.app-body .pluggy-mode-option {
  background: var(--ft-raised);
  border-color: var(--ft-border);
  color: var(--ft-text);
}
.app-body .pluggy-mode-option:has(input:checked) {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
}
.app-body .pluggy-mode-option input {
  accent-color: var(--ft-accent);
}
.app-body :is(.pluggy-mode-option small, .pluggy-status-line) {
  color: var(--ft-muted);
}

/* Landing: shared typography, warm neutrals and restrained yellow accents. */
.landing-page .site-header {
  position: fixed;
  background: color-mix(in srgb, var(--ft-bg) 90%, transparent);
  border-color: var(--ft-border);
  backdrop-filter: blur(18px);
}
.landing-page .header-inner {
  grid-template-columns: 1fr auto 1fr;
  gap: 24px;
}
.landing-page .main-nav > a {
  color: var(--ft-muted);
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-size: 13px;
}
.landing-page .main-nav > a:hover {
  color: var(--ft-accent-text);
}
.landing-page .header-cta {
  min-height: 44px;
  font-size: 12px;
}
.landing-page .hero {
  padding-top: 150px;
}
.landing-page .hero-content {
  text-align: left;
}
.landing-page .hero h1 {
  max-width: 1000px;
  font-size: clamp(45px, 5.5vw, 76px);
  font-weight: 480;
  line-height: 1.12;
  letter-spacing: -0.055em;
  margin-block: 28px 24px;
}
.landing-page .hero-description {
  font-size: 17px;
  line-height: 1.8;
  max-width: 620px;
  color: var(--ft-muted);
}
.landing-page :is(.hero-actions, .hero-note) {
  justify-content: flex-start;
}
.landing-page .hero-actions {
  margin-top: 32px;
}
.landing-page .hero-actions .button {
  min-height: 50px;
  padding-inline: 22px;
  font-size: 13px;
}
.landing-page .hero-note {
  font-size: 12px;
  color: var(--ft-muted);
}
.landing-page .hero-note .icon {
  color: var(--ft-accent-text);
}
.landing-page .hero-glow {
  background: radial-gradient(ellipse, #ffe86d16, transparent 65%);
}
.landing-page .hero::after {
  background: radial-gradient(ellipse, #ffe86d0c, transparent 70%);
}
.landing-page .ecosystem {
  font-size: 10px;
  color: var(--ft-muted);
  border-color: var(--ft-border);
  background: var(--ft-surface);
  min-height: 34px;
}
.landing-page .ecosystem .icon {
  color: var(--ft-accent-text);
}
.landing-page .status-dot {
  background: var(--ft-accent-text);
  box-shadow: none;
}
.landing-page .dashboard {
  background: var(--ft-surface);
  border-color: var(--ft-border);
  border-radius: 18px;
  box-shadow: var(--ft-shadow), 0 0 0 5px var(--ft-raised);
}
.landing-page .dashboard-sidebar {
  background: var(--ft-raised);
  border-color: var(--ft-border);
}
.landing-page :is(.workspace, .metric-card, .cashflow-card, .expense-card, .cash-visual,
  .contact-form-card, .orbit-label, .step-tag, .icon-button, .period-switch, .mini-indicators > span) {
  background: var(--ft-surface);
  border-color: var(--ft-border);
  color: var(--ft-text);
}
.landing-page :is(.workspace-avatar, .sidebar-item.selected, .demo-badge,
  .metric-card.balance-card, .incoming, .metric-trend, .expense-trend,
  .solution-icon, .planning-center, .result-check, .automation-flow > span.flow-center) {
  background: var(--ft-accent-soft);
  border-color: var(--ft-accent-border);
  color: var(--ft-accent-text);
}
.landing-page :is(.sidebar-item, .workspace small, .sidebar-label, .sidebar-bottom,
  .sidebar-bottom small, .breadcrumb, .breadcrumb-slash, .overview-label,
  .dashboard-eyebrow, .metric-label, .metric-foot, .chart-legend span, .chart-y, .chart-x,
  .donut-label > span, .donut-label strong span, .expense-legend > span,
  .transactions-heading > span, .transaction-name small, .dashboard-caption,
  .connections .section-kicker, .connections > p:last-child, .connection-list > span,
  .connection-list .icon, .connection-list > i, .solution-number, .solution-card p,
  .visual-top, .visual-legend, .visual-note, .manifesto .section-kicker,
  .manifesto-bottom p, .process-steps p, .step-number, .step-tag,
  .faq-intro > p:not(.section-kicker), .faq-list details > p,
  .contact-copy > p:not(.section-kicker), .contact-assurance, .contact-assurance small,
  .contact-form-card > p, .contact-form-card label, .contact-form-card select:invalid,
  .optional, .form-privacy, .contact-result > p, .footer-top > div > p,
  .footer-links, .ecosystem-link, .ecosystem-link > span, .footer-bottom) {
  color: var(--ft-muted);
}
.landing-page :is(.dashboard-topbar, .dashboard h3, .balance-card strong,
  .expense-legend b, .transaction-name, .transaction-value,
  .transaction-row:last-child .transaction-value, .faq-list summary, .ecosystem-link b) {
  color: var(--ft-text);
}
.landing-page :is(.dashboard-topbar, .transaction-row, .sidebar-bottom,
  .contact-assurance, .mini-indicators, .faq-list details, .faq-list details:first-child) {
  border-color: var(--ft-border);
}
.landing-page :is(.outgoing, .period-switch button[aria-pressed="true"]) {
  background: var(--ft-subtle);
  color: var(--ft-text);
}
.landing-page .period-switch button {
  color: var(--ft-muted);
}
.landing-page .chart-grid {
  stroke: var(--ft-border);
}
.landing-page .expenses-line {
  stroke: var(--ft-secondary);
}
.landing-page .donut-track {
  stroke: var(--ft-subtle);
}
.landing-page .donut-one {
  stroke: var(--ft-accent-text);
}
.landing-page .donut-two {
  stroke: var(--ft-secondary);
}
.landing-page :is(.chart-legend span:last-child i, .expense-legend > span:nth-child(2) i) {
  background: var(--ft-secondary);
}
.landing-page .expense-legend > span:nth-child(3) i {
  background: var(--ft-subtle);
}
.landing-page :is(.transaction-status, .transaction-status.paid) {
  color: var(--ft-accent-text);
  border-color: var(--ft-accent-border);
}
.landing-page :is(.section-kicker, .dashboard-caption) {
  font-size: 11px;
}
.landing-page .section-heading > p,
.landing-page :is(.solution-card p, .process-steps p, .faq-intro > p:not(.section-kicker),
  .faq-list details > p, .contact-copy > p:not(.section-kicker)) {
  font-size: 14px;
  line-height: 1.85;
}
.landing-page :is(.solution-card, .solution-featured, .solution-wide) {
  background: var(--ft-surface);
  border-color: var(--ft-border);
}
.landing-page .solution-card:hover {
  border-color: var(--ft-accent-border);
}
.landing-page :is(.solution-number, .solution-card .text-link, .step-tag,
  .contact-form-card > p, .contact-assurance, .contact-assurance small,
  .contact-form-card label, .contact-form-card .button-primary,
  .form-privacy, .contact-result > p, .footer-top > div > p,
  .footer-links, .ecosystem-link, .footer-bottom) {
  font-size: 12px;
}
.landing-page .planning-ring {
  border-color: var(--ft-accent-border);
}
.landing-page :is(.planning-center, .mini-indicators i, .manifesto-symbol,
  .contact-direct, .contact-direct .icon, .contact-assurance > .icon) {
  color: var(--ft-accent-text);
}
.landing-page :is(.caption-line, .step-number > span, .faq-plus::before, .faq-plus::after) {
  background: var(--ft-accent-text);
}
.landing-page .automation-flow > span {
  color: var(--ft-accent-text);
  background: var(--ft-raised);
  border-color: var(--ft-border);
}
.landing-page .automation-flow > i {
  background: var(--ft-accent-border);
}
.landing-page .planning-center {
  box-shadow: 0 0 60px #ffe86d17;
}
.landing-page :is(.mini-tag, .projection-amount, .projection-amount span, .bar-labels) {
  color: var(--ft-muted);
  border-color: var(--ft-border);
}
.landing-page .projection-amount {
  color: var(--ft-text);
}
.landing-page .bar-chart {
  border-color: var(--ft-border);
  background: repeating-linear-gradient(0deg, transparent 0 35px, var(--ft-border) 35px 36px);
}
.landing-page .bar-chart i {
  background: var(--ft-accent);
}
.landing-page .bar-chart i:nth-child(n + 7) {
  background: var(--ft-accent-text);
}
.landing-page :is(.manifesto, .contact) {
  background: var(--ft-raised);
  border-color: var(--ft-border);
}
.landing-page .manifesto h2 {
  color: var(--ft-text);
}
.landing-page .manifesto h2 > span {
  color: var(--ft-muted);
}
.landing-page .contact-form-card :is(input, select, textarea) {
  font-size: 14px;
}
.landing-page .contact-form-card textarea {
  min-height: 100px;
}
.landing-page .contact-form-card :is(input, textarea)::placeholder {
  font-size: inherit;
}
.landing-page :is(.contact-direct, .text-link, .footer-links a) {
  min-height: 44px;
}
.landing-page .menu-toggle span {
  background: var(--ft-text);
}
.landing-page :is(.inline-icon, .icon-button) {
  color: var(--ft-muted);
}
.landing-page .skip-link,
.app-body .skip-link {
  background: var(--ft-accent);
  color: var(--ft-on-accent);
}

@media (min-width: 701px) {
  :root[data-sidebar-collapsed="true"] .app-shell {
    grid-template-columns: 76px minmax(0, 1fr);
  }
  :root[data-sidebar-collapsed="true"] .app-body .sidebar {
    padding: 25px 8px 0;
  }
  :root[data-sidebar-collapsed="true"] .sidebar > .brand {
    justify-content: center;
    margin: 2px 0 24px;
  }
  :root[data-sidebar-collapsed="true"] .sidebar :is(.brand > span, .workspace > div,
    .workspace-check, .nav-label, .app-nav a > span, .sidebar-note,
    .user-row > div, .user-row > .user-avatar) {
    display: none;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .workspace {
    justify-content: center;
    padding: 8px;
    margin: 0 0 22px;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .app-nav a {
    justify-content: center;
    padding: 12px 0;
    min-height: 46px;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .app-nav svg {
    width: 20px;
    height: 20px;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .sidebar-bottom {
    padding-top: 24px;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .user-row {
    justify-content: center;
    padding: 14px 0;
  }
  :root[data-sidebar-collapsed="true"] .sidebar .logout-button {
    margin: 0;
  }
  :root[data-sidebar-collapsed="true"] .sidebar-control-icon {
    transform: rotate(180deg);
  }
}
@media (max-width: 1000px) {
  .landing-page .header-inner {
    gap: 16px;
  }
  .landing-page .main-nav {
    gap: 20px;
  }
  .landing-page .theme-control-label {
    display: none;
  }
}
@media (min-width: 601px) and (max-width: 820px) {
  .landing-page .header-inner {
    grid-template-columns: 1fr auto auto;
  }
}
@media (max-width: 700px) {
  .app-body .sidebar {
    overflow: visible;
  }
  .sidebar-control {
    display: none;
  }
  .app-body .topbar-controls .secure-indicator,
  .app-body .theme-control-label,
  .auth-body .theme-control-label {
    display: none;
  }
  .app-body .app-topbar {
    min-height: 60px;
    gap: 10px;
  }
  .app-body .app-topbar > p {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .auth-body .auth-brand {
    border-right: 0;
    border-bottom: 1px solid var(--ft-border);
  }
}
@media (max-width: 600px) {
  .landing-page .header-inner {
    height: 76px;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
  }
  .landing-page .header-actions {
    gap: 0;
  }
  .landing-page .header-cta {
    display: none;
  }
  .landing-page .main-nav {
    background: var(--ft-surface);
    border-color: var(--ft-border);
  }
  .landing-page .hero {
    padding-top: 125px;
  }
  .landing-page .hero h1 {
    font-size: clamp(39px, 10vw, 54px);
    line-height: 1.14;
  }
  .landing-page .hero-description {
    font-size: 15px;
  }
  .landing-page .hero-actions {
    align-items: stretch;
  }
  .landing-page .hero-actions .button {
    padding-inline: 14px;
    font-size: 12px;
  }
  .landing-page .hero-note {
    align-items: flex-start;
    line-height: 1.7;
  }
  .landing-page .hero-note .icon {
    margin-top: 4px;
  }
  .landing-page .ecosystem {
    font-size: 9px;
    letter-spacing: 0.8px;
  }
  .landing-page .section-heading > p {
    font-size: 14px;
  }
  .landing-page .contact-form-card :is(input, select, textarea) {
    font-size: 16px;
  }
  .landing-page .footer-links {
    gap: 4px 24px;
  }
}