/* TrendMeta 2026 professional light refresh.
   Loaded last so legacy dark-theme declarations cannot leak into public or
   operational surfaces. The only deliberately dark surface is .signal-stage. */
:root {
  color-scheme: light;
  --tm-bg: #f5f7fb;
  --tm-surface: #ffffff;
  --tm-surface-raised: #f8fafc;
  --tm-ink: #172033;
  --tm-muted: #607087;
  --tm-line: #dfe5ed;
  --tm-accent: #2563eb;
  --tm-accent-hover: #1d4ed8;
  --tm-accent-ink: #ffffff;
  --blue: #607087;
  --ink: #172033;
  --muted: #607087;
  --line: #dfe5ed;
  --green: #087a55;
  --green-soft: #e9f8f1;
  --red: #b42318;
  --red-soft: #fff0ee;
  --amber: #9a5b05;
  --blue-soft: #eef5ff;
}

html, body { background: var(--tm-bg); color: var(--tm-ink); }

/* Public landing */
.landing-page {
  background:
    radial-gradient(circle at 12% 8%, rgba(37,99,235,.08), transparent 27rem),
    linear-gradient(#fbfcfe, #f5f7fb 62%, #ffffff);
  color: var(--tm-ink);
}
.landing-page .site-header { background: rgba(255,255,255,.82); border-color: var(--tm-line); }
.landing-page .site-header nav a { color: #526176; }
.landing-page .site-header nav a:hover,
.landing-page .section h2,
.landing-page .login-section h2,
.landing-page .feature-card h3,
.landing-page .knowledge-card h3,
.landing-page .faq-list summary,
.landing-page .login-form h3,
.landing-page .footer-col h4 { color: var(--tm-ink); }
.landing-page .hero h1 { color: #111827; }
.landing-page .hero h1 > span { color: #5b6b82; }
.landing-page .hero-announcement,
.landing-page .feature-card,
.landing-page .knowledge-card,
.landing-page .workflow-step-card,
.landing-page .tools-container,
.landing-page .testimonial-card,
.landing-page .login-form {
  background: rgba(255,255,255,.92);
  border-color: #dce3ec;
  box-shadow: 0 18px 45px -38px rgba(16,24,40,.45);
}
.landing-page .feature-card:hover,
.landing-page .knowledge-card:hover { border-color: #9cbcf8; }
.landing-page .feature-card p,
.landing-page .feature-card > small,
.landing-page .knowledge-card > p,
.landing-page .section-description,
.landing-page .section-heading > p:not(.eyebrow),
.landing-page .faq-list details p,
.landing-page .login-grid > div > p:not(.eyebrow),
.landing-page .footer-desc,
.landing-page .footer-col nav a { color: #65758b; }
.landing-page .feature-card ul { color: #334155; }
.landing-page .knowledge-art { background: #f1f5f9; border-color: #dce3ec; }
.landing-page .faq-list,
.landing-page .faq-list details { border-color: #dce3ec; }
.landing-page .login-section { background: #f0f4f9; border-color: #dce3ec; }
.landing-page .login-form label { color: #334155; }
.landing-page .login-form input,
.landing-page .tool-fields input,
.landing-page .tool-fields-single input {
  background: #ffffff; color: #111827; border-color: #cfd8e5;
}
.landing-page .site-footer { background: #ffffff; border-color: #dce3ec; }
.landing-page .footer-bottom { border-color: #e3e8ef; color: #718096; }
.landing-page .footer-col nav a:hover { color: #1d4ed8; }

/* Keep the real product preview dark: it represents the live workspace and
   remains visually separate from the page background. */
.landing-page .platform-preview,
.landing-page .preview-chrome { box-shadow: 0 30px 70px -45px rgba(15,23,42,.6); }

/* Pointer and scroll-reactive CTA inspired by the interaction pattern the user
   referenced, implemented independently with a lightweight canvas. */
.signal-section { padding-top: 42px; padding-bottom: 82px; }
.signal-stage {
  position: relative; min-height: clamp(500px, 62vw, 720px); overflow: hidden;
  display: flex; align-items: center; border-radius: 34px; isolation: isolate;
  background: #030509; color: #ffffff; box-shadow: 0 34px 80px -48px rgba(15,23,42,.7);
}
.signal-stage::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(circle at 28% 50%, rgba(37,99,235,.18), transparent 35%);
}
.signal-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.signal-content { position: relative; max-width: 570px; padding: clamp(40px,7vw,92px); }
.signal-kicker { margin: 0 0 18px; color: #7aa6ff; font-size: 11px; font-weight: 750; letter-spacing: .14em; }
.signal-content h2 { margin: 0; color: #fff; font-size: clamp(38px,5vw,70px); line-height: .99; letter-spacing: -.055em; font-weight: 590; }
.signal-content > p:not(.signal-kicker) { max-width: 520px; margin: 26px 0 0; color: #bac4d3; font-size: 16px; line-height: 1.75; }
.signal-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.signal-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 11px 20px; border-radius: 999px; font-size: 13px; font-weight: 650; }
.signal-button-light { background: #fff; color: #111827; }
.signal-button-dark { background: #202631; color: #fff; border: 1px solid #343d4c; }
.signal-button:focus-visible { outline: 3px solid #7aa6ff; outline-offset: 4px; }
.signal-motion-note { position: absolute; right: 34px; bottom: 28px; color: #70809a; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

/* Registration */
.register-page { background: #f7f8fb !important; color: #172033 !important; }
.register-page::before, .register-page::after, .register-page .auth-orb { display: none !important; }
.register-page .public-nav { width: min(1240px, calc(100% - 48px)); min-height: 82px; padding: 0; border-color: #dfe5ed; }
.register-page .public-nav nav a { color: #526176; }
.register-page .register-layout {
  width: min(1240px, calc(100% - 48px)); grid-template-columns: minmax(0,1fr) minmax(480px,560px);
  gap: clamp(60px,7vw,110px); align-items: center; margin: 0 auto; padding: 78px 0 110px;
}
.register-page .register-copy { max-width: 610px; }
.register-page .register-copy h1 { color: #111827; font-size: clamp(44px,5.2vw,72px); line-height: 1.01; }
.register-page .register-copy h1 em { color: #627187; }
.register-page .register-copy p { color: #607087; font-size: 17px; }
.register-page .register-copy li { color: #334155; }
.register-page .register-copy li::before { background: #e8f6ef; color: #087a55; }
.register-page .auth-badge { background: #eaf7f0; border-color: #c7e9d8; color: #146c4d; }
.register-page .register-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.register-page .register-proof span { background: #fff; border-color: #dfe5ed; color: #66758a; border-radius: 12px; }
.register-page .register-proof b { color: #172033; }
.register-page .auth-card {
  width: 100%; padding: 34px; background: #ffffff !important; color: #172033 !important;
  border: 1px solid #d9e1eb !important; border-radius: 20px !important;
  box-shadow: 0 30px 80px -50px rgba(15,23,42,.5) !important;
}
.register-page .auth-card-head > span { color: #2563eb; }
.register-page .auth-card-head h2,
.register-page .auth-form label span { color: #172033; }
.register-page .auth-card-head p,
.register-page .auth-card-foot,
.register-page .register-form small,
.register-page .register-terms span { color: #64748b !important; }
.register-page .auth-form input:not([type="checkbox"]) { background: #fff; color: #111827; border: 1px solid #cfd8e5; min-height: 48px; }
.register-page .auth-form input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.register-page .auth-submit { background: #2563eb !important; color: #fff !important; border-radius: 10px; box-shadow: none !important; }

/* Editorial blog */
.blog-page {
  --blog-bg: #fbfaf6; --blog-surface: #ffffff; --blog-raised: #f4f1e9;
  --blog-ink: #171713; --blog-muted: #68675f; --blog-line: #dfddd5; --blog-accent: #9a6a20;
  background: var(--blog-bg) !important; color: var(--blog-ink) !important;
}
.blog-page::before, .blog-page::after { display: none !important; }
.blog-page .public-nav { width: min(1440px, calc(100% - 64px)); min-height: 88px; padding: 0; border-color: var(--blog-line); }
.blog-page .public-nav nav a { color: #555750; }
.blog-page .public-nav-cta { background: #171713 !important; color: #fff !important; border-color: #171713 !important; }
.blog-page main.blog-shell, .blog-page main.article-shell {
  max-width: 1440px !important; width: calc(100% - 64px) !important;
  margin-inline: auto !important; overflow: visible !important; contain: none !important;
}
.blog-page .blog-hero { grid-template-columns: minmax(0,1fr) 360px; padding: 88px 0 60px; gap: 80px; }
.blog-page .blog-hero h1 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; font-size: clamp(48px,5.6vw,82px); line-height: 1.02; letter-spacing: -.04em; }
.blog-page .blog-hero h1 span { color: #77766d; }
.blog-page .blog-discovery { grid-template-columns: minmax(0,1fr) 340px; padding: 38px 0; }
.blog-page .blog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 34px 28px; }
.blog-page .blog-card,
.blog-page .blog-card-featured { grid-column: auto; border: 0; border-radius: 0; background: transparent; overflow: visible; transform: none; }
.blog-page .blog-card:hover { transform: none; }
.blog-page .blog-card-cover { display: block; width: 100%; max-height: none; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid #d8d5ce; border-radius: 14px; }
.blog-page .blog-card-content,
.blog-page .blog-card-featured .blog-card-content { padding: 20px 0 0; }
.blog-page .blog-card h3,
.blog-page .blog-card-featured h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(25px,2.2vw,35px); line-height: 1.16; font-weight: 500; margin: 16px 0 12px; }
.blog-page .blog-card p { color: #68675f; font-size: 15px; line-height: 1.75; }
.blog-page .blog-card footer { border-color: var(--blog-line); color: #77766d; }
.blog-page .blog-card-kicker { color: #8f661f; text-transform: uppercase; letter-spacing: .1em; }
.blog-page .blog-feature-label { color: #8f661f; }
.blog-page .blog-cta { background: #f2eee3; border-color: #d8d2c3; }
.blog-page .article-header { max-width: 1060px; }
.blog-page .article-header h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(44px,5.2vw,76px); font-weight: 500; }
.blog-page .article-cover { width: 100%; max-height: 680px; border-radius: 18px; }
.blog-page .article-layout { grid-template-columns: 260px minmax(0,820px); gap: 80px; }
.blog-page .article-body { color: #343630; font-family: Georgia, "Times New Roman", serif; font-size: 19px; line-height: 1.88; }
.blog-page .article-body h2, .blog-page .article-body h3 { color: #171713; }
.blog-page .article-toc,
.blog-page .article-checklist,
.blog-page .article-note,
.blog-page .article-product-cta { background: #fff; border-color: var(--blog-line); }
.blog-page .site-footer { width: min(1440px, calc(100% - 64px)); background: transparent; color: #5f625c; border-color: var(--blog-line); }
.blog-page .footer-col h4 { color: #171713; }
.blog-page .footer-col nav a, .blog-page .footer-desc { color: #66685f; }

/* Customer workspace */
.app-shell {
  min-height: 100vh; display: grid !important; grid-template-columns: 250px minmax(0,1fr) !important;
  background: #f4f6fa !important; color: #172033 !important;
}
.app-shell .sidebar {
  position: sticky !important; top: 0; width: auto !important; height: 100vh !important;
  padding: 24px 16px !important; background: #ffffff !important; color: #172033 !important;
  border-right: 1px solid #dfe5ed !important; box-shadow: none !important;
}
.app-shell .brand strong, .app-shell .sidebar b { color: #172033 !important; }
.app-shell .brand small, .app-shell .sidebar small { color: #758398 !important; }
.app-shell .nav-item { color: #56657a !important; background: transparent !important; }
.app-shell .nav-item:hover { background: #f1f5f9 !important; color: #172033 !important; }
.app-shell .nav-item.active { width: auto !important; height: auto !important; position: relative !important; background: #eaf1ff !important; color: #1d4ed8 !important; border: 1px solid #cadbff !important; box-shadow: none !important; }
.app-shell .nav-item.active svg { color: #2563eb !important; stroke: #2563eb !important; filter: none !important; }
.app-shell .saas-sidebar-card,
.app-shell .sidebar-user-card { background: #f7f9fc !important; border-color: #dfe5ed !important; color: #172033 !important; }
.app-shell .sidebar-footer { border-color: #e2e8f0 !important; }
.app-shell .main-content {
  grid-column: 2 !important; width: 100% !important; max-width: none !important; min-width: 0 !important;
  margin: 0 !important; padding: 0 clamp(22px,3vw,48px) 64px !important; background: #f4f6fa !important;
}
.app-shell .topbar { border-color: #dfe5ed !important; }
.app-shell .topbar h1, .app-shell h2, .app-shell h3, .app-shell h4, .app-shell b, .app-shell strong { color: #172033; }
.app-shell .eyebrow { color: #416693 !important; }
.app-shell .workspace-chip,
.app-shell .user-pill { background: #fff !important; color: #526176 !important; border-color: #d7e0ea !important; }
.app-shell .panel,
.app-shell .feed-card,
.app-shell .group-card,
.app-shell .account-card,
.app-shell .metric-card,
.app-shell .section-intro,
.app-shell .welcome-card,
.app-shell .operations-band,
.app-shell .analytics-toolbar,
.app-shell .meta-hierarchy-panel,
.app-shell .pinterest-hero {
  background: #fff !important; color: #172033 !important; border-color: #dfe5ed !important;
  box-shadow: 0 12px 30px -28px rgba(15,23,42,.45) !important;
}
.app-shell .muted,
.app-shell p:not(.eyebrow),
.app-shell small { color: #65758a; }
.app-shell input,
.app-shell select,
.app-shell textarea { background: #fff !important; color: #172033 !important; border-color: #cfd8e5 !important; }
.app-shell input:focus, .app-shell select:focus, .app-shell textarea:focus { border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37,99,235,.1) !important; }
.app-shell .btn.primary { background: #2563eb !important; color: #fff !important; border-color: #2563eb !important; box-shadow: none !important; }
.app-shell .btn.secondary, .app-shell .btn.light, .app-shell .btn.soft { background: #fff !important; color: #334155 !important; border-color: #cfd8e5 !important; box-shadow: none !important; }
.app-shell .table-wrap { max-width: 100%; overflow: auto; background: #fff; border-radius: 0 0 12px 12px; }
.app-shell .table-wrap table { width: 100%; min-width: 1080px; color: #27364a; }
.app-shell table th { background: #f1f4f8 !important; color: #526176 !important; border-color: #dfe5ed !important; }
.app-shell table td { color: #27364a !important; border-color: #e5eaf0 !important; }
.app-shell table tbody tr:hover { background: #f7f9fc !important; }
.app-shell .product-cell { min-width: 430px; }
.app-shell .product-cell img { width: 48px; height: 48px; object-fit: cover; }
.app-shell .price-old { color: #7b8798 !important; }
.app-shell .status-chip { background: #edf5ff !important; color: #315f96 !important; border-color: #cfe1f5 !important; }
.app-shell .status-chip.off { background: #f1f3f6 !important; color: #65758a !important; border-color: #dce2e9 !important; }
.app-shell .toggle span { background: #cbd5e1 !important; }
.app-shell .toggle input:checked + span { background: #2563eb !important; }
.app-shell .analytics-trust-panel { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(420px,1fr); gap: 26px; align-items: center; padding: 24px; margin: 18px 0; }
.app-shell .analytics-trust-panel p { max-width: 780px; margin-bottom: 0; line-height: 1.75; }
.app-shell .analytics-trust-items { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.app-shell .analytics-trust-items span { display: grid; gap: 5px; padding: 13px; border: 1px solid #dce3ec; border-radius: 10px; background: #f8fafc; color: #65758a; font-size: 11px; line-height: 1.5; }
.app-shell .analytics-trust-items b { font-size: 12px; }
.app-shell .finance-executive-dashboard,
.app-shell .fin-breakdown-grid { gap: 12px !important; }
.app-shell .finance-executive-dashboard > *,
.app-shell .fin-breakdown-grid > * { background: #fff !important; color: #172033 !important; border: 1px solid #dfe5ed !important; box-shadow: none !important; }
.app-shell #finance-summary .finance-executive-dashboard strong,
.app-shell #finance-summary .fin-breakdown-grid b { color: #172033 !important; }
.app-shell #finance-summary .finance-executive-dashboard div,
.app-shell #finance-summary .fin-breakdown-grid span,
.app-shell #finance-summary .fin-breakdown-grid small { color: #65758a !important; }
.app-shell .finance-empty-state { display: grid; gap: 8px; padding: 28px; border: 1px dashed #c9d3df; border-radius: 12px; background: #f8fafc; }
.app-shell .finance-empty-state b { font-size: 17px; }
.app-shell .finance-empty-state span { color: #65758a; font-size: 13px; line-height: 1.7; }

/* SaaS owner admin */
.admin-body { background: #f4f6fa !important; color: #172033 !important; grid-template-columns: 250px minmax(0,1fr) !important; }
.admin-body .admin-sidebar { width: 250px !important; background: #fff !important; color: #172033 !important; border-right: 1px solid #dfe5ed !important; }
.admin-body .public-brand b, .admin-body h1, .admin-body h2, .admin-body h3, .admin-body b { color: #172033 !important; }
.admin-body .public-brand small, .admin-body .admin-sidebar small { color: #738196 !important; }
.admin-body .sidebar-org-select { border-color: #e2e8f0; }
.admin-body .org-dropdown-box { background: #f7f9fc !important; color: #27364a !important; border-color: #d7e0ea !important; }
.admin-body .admin-sidebar nav button, .admin-body .admin-sidebar nav a { color: #56657a !important; }
.admin-body .admin-sidebar nav button:hover, .admin-body .admin-sidebar nav a:hover { background: #f1f5f9 !important; color: #172033 !important; }
.admin-body .admin-sidebar nav button.active { background: #eaf1ff !important; color: #1d4ed8 !important; border-color: #cadbff !important; box-shadow: none !important; }
.admin-body .admin-sidebar nav button.active svg { stroke: #2563eb !important; filter: none !important; }
.admin-body .sidebar-user-card { background: #f7f9fc !important; border-color: #dfe5ed !important; }
.admin-body .admin-main { grid-column: 2; min-width: 0; background: #f4f6fa; }
.admin-body .admin-main > header { border-color: #dfe5ed !important; }
.admin-body .admin-metrics article,
.admin-body .admin-info-grid article,
.admin-body .admin-form,
.admin-body .admin-coupon-list,
.admin-body .admin-table-wrap,
.admin-body .admin-activity-card,
.admin-body .admin-runtime-panel { background: #fff !important; color: #172033 !important; border-color: #dfe5ed !important; box-shadow: 0 12px 30px -28px rgba(15,23,42,.45) !important; }
.admin-body p, .admin-body small, .admin-body .admin-activity span, .admin-body .admin-activity time { color: #65758a !important; }
.admin-body input, .admin-body select, .admin-body textarea { background: #fff !important; color: #172033 !important; border-color: #cfd8e5 !important; }
.admin-body .admin-table-wrap th { background: #f1f4f8 !important; color: #526176 !important; }
.admin-body .admin-table-wrap td { color: #27364a !important; border-color: #e5eaf0 !important; }
.admin-body .admin-table-wrap tbody tr:hover { background: #f7f9fc !important; }
.admin-body .btn.primary, .admin-body button[type="submit"] { background: #2563eb !important; color: #fff !important; border-color: #2563eb !important; box-shadow: none !important; }
.admin-body .btn.secondary, .admin-body .admin-row-actions button:not(.danger) { background: #fff !important; color: #334155 !important; border-color: #cfd8e5 !important; box-shadow: none !important; }

/* Account and editorial operations use the same light workspace language. */
.saas-page,
.blog-admin-body { background: #f4f6fa !important; color: #172033 !important; }
.saas-page .tm-wordmark,
.blog-admin-body .tm-wordmark { filter: brightness(0) saturate(100%) invert(12%) sepia(12%) saturate(1478%) hue-rotate(176deg) brightness(92%); }
.saas-page .saas-page-nav,
.blog-admin-body .blog-admin-header { background: #fff !important; color: #172033 !important; border-color: #dfe5ed !important; }
.saas-page .saas-page-nav nav a,
.blog-admin-body .blog-admin-header nav { color: #56657a !important; }
.saas-page .account-card,
.saas-page .account-plan,
.blog-admin-body .content-list-panel,
.blog-admin-body .content-editor,
.blog-admin-body .content-dialog,
.blog-admin-body .quick-blog-strip { background: #fff !important; color: #172033 !important; border-color: #dfe5ed !important; box-shadow: none !important; }
.saas-page .account-heading p,
.saas-page .account-card p,
.saas-page .account-plan small,
.blog-admin-body .content-page-title p,
.blog-admin-body .content-help,
.blog-admin-body small { color: #65758a !important; }
.saas-page input,
.saas-page select,
.saas-page textarea,
.blog-admin-body input,
.blog-admin-body select,
.blog-admin-body textarea,
.blog-admin-body .content-block,
.blog-admin-body .content-search-preview { background: #f8fafc !important; color: #172033 !important; border-color: #cfd8e5 !important; }
.blog-admin-body .content-post-list button,
.blog-admin-body .content-block-controls button,
.blog-admin-body .content-revision-row button { background: #fff !important; color: #334155 !important; border-color: #d7e0ea !important; }
.blog-admin-body .content-post-list button[aria-current="true"],
.saas-page .account-plan.current { background: #eef5ff !important; border-color: #bcd3fb !important; }
.blog-admin-body .content-live-notice,
.blog-admin-body .content-notice { background: #f8fafc !important; color: #526176 !important; }

/* The legacy bundle contains malformed footer declarations. Keep the public
   footer geometry explicit here so a desktop viewport can never inherit the
   mobile one-column layout. */
.landing-page .footer-grid,
.blog-page .footer-grid {
  display: grid !important;
  grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(0, 1fr)) !important;
  gap: 40px !important;
  align-items: start;
}

@media (max-width: 1100px) {
  .register-page .register-layout { grid-template-columns: 1fr; }
  .register-page .register-copy, .register-page .auth-card { max-width: 720px; margin-inline: auto; }
  .blog-page .blog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blog-page .blog-hero { grid-template-columns: 1fr; gap: 38px; }
  .blog-page .blog-hero-aside { border-left: 0; border-top: 1px solid var(--blog-line); padding: 28px 0 0; }
  .app-shell .analytics-trust-panel { grid-template-columns: 1fr; }
  .landing-page .footer-grid,
  .blog-page .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 900px) {
  .app-shell { display: block !important; }
  .app-shell .sidebar { position: relative !important; width: 100% !important; height: auto !important; border-right: 0 !important; border-bottom: 1px solid #dfe5ed !important; }
  .app-shell .main-content { width: 100% !important; padding: 0 20px 48px !important; }
  .admin-body { display: block !important; }
  .admin-body .admin-sidebar { position: relative !important; width: 100% !important; height: auto !important; border-right: 0 !important; border-bottom: 1px solid #dfe5ed !important; }
  .admin-body .admin-main { width: 100%; padding: 0 20px 50px !important; }
  .blog-page .article-layout { grid-template-columns: 1fr; gap: 34px; }
  .blog-page .article-sidebar { position: static; }
}

@media (max-width: 700px) {
  .signal-section { padding-inline: 12px; }
  .signal-stage { min-height: 590px; border-radius: 24px; align-items: flex-end; }
  .signal-content { padding: 34px 28px 74px; }
  .signal-content h2 { font-size: 42px; }
  .signal-actions { align-items: stretch; flex-direction: column; }
  .signal-motion-note { left: 28px; right: auto; bottom: 24px; }
  .register-page .public-nav, .register-page .register-layout { width: calc(100% - 32px); }
  .register-page .register-layout { padding: 44px 0 70px; }
  .register-page .register-copy h1 { font-size: 45px; }
  .register-page .register-proof { grid-template-columns: 1fr; }
  .register-page .auth-card { padding: 24px; }
  .register-page .register-form { grid-template-columns: 1fr; }
  .register-page .register-form .wide-field { grid-column: 1; }
  .register-page .auth-card { order: -1; }
  .blog-page .public-nav, .blog-page .blog-shell, .blog-page .article-shell, .blog-page .site-footer { width: calc(100% - 32px); }
  .blog-page .public-nav { padding-block: 14px; }
  .blog-page .blog-hero { padding: 52px 0 36px; }
  .blog-page .blog-hero h1 { font-size: 48px; }
  .blog-page .blog-discovery { grid-template-columns: 1fr; gap: 24px; }
  .blog-page .blog-grid { grid-template-columns: 1fr; gap: 42px; }
  .blog-page .blog-card h3, .blog-page .blog-card-featured h3 { font-size: 30px; }
  .blog-page .article-header h1 { font-size: 42px; }
  .blog-page .article-body { font-size: 18px; }
  .app-shell .analytics-trust-items { grid-template-columns: 1fr; }
  .app-shell #view-products .table-wrap { margin-inline: 0; overflow: visible; background: transparent; }
  .app-shell #view-products .table-wrap table { min-width: 0; display: block; }
  .app-shell #view-products .table-wrap thead { display: none; }
  .app-shell #view-products .table-wrap tbody { display: grid; gap: 14px; }
  .app-shell #view-products .table-wrap tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 16px; padding: 18px; background: #fff; border: 1px solid #dfe5ed; border-radius: 14px; }
  .app-shell #view-products .table-wrap td { display: grid; grid-template-columns: 88px minmax(0,1fr); gap: 10px; align-items: center; padding: 0 !important; border: 0 !important; min-width: 0; }
  .app-shell #view-products .table-wrap td::before { content: attr(data-label); color: #718096; font-size: 11px; font-weight: 650; }
  .app-shell #view-products .table-wrap td[data-label="Ürün"] { grid-column: 1 / -1; display: block; padding-bottom: 14px !important; border-bottom: 1px solid #e5eaf0 !important; }
  .app-shell #view-products .table-wrap td[data-label="Ürün"]::before { display: none; }
  .app-shell #view-products .product-cell { min-width: 0; }
  .app-shell #view-products .product-cell img { width: 64px; height: 64px; }
  .app-shell #view-products .table-wrap td[data-label="İşlem"] .btn { width: 100%; }
  .admin-body .admin-main { padding-inline: 16px !important; }
  .landing-page .footer-grid,
  .blog-page .footer-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
}

@media (max-width: 470px) {
  .app-shell #view-products .table-wrap tr { grid-template-columns: 1fr; }
  .app-shell #view-products .table-wrap td[data-label="Ürün"] { grid-column: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .signal-canvas { opacity: .55; }
}

/* Dark workspace surfaces. The public blog intentionally remains editorial white. */
:root { color-scheme: dark; }
.blog-page { color-scheme: light; }
.landing-page,
.register-page,
.app-shell,
.admin-body,
.saas-page,
.blog-admin-body {
  background: #0b0f14 !important;
  color: #edf4fb !important;
}
.landing-page {
  background:
    radial-gradient(900px 520px at 76% 8%, rgba(37,99,235,.16), transparent 62%),
    radial-gradient(760px 520px at 12% 34%, rgba(14,165,233,.09), transparent 68%),
    #0b0f14 !important;
}
.landing-page .site-header,
.landing-page .site-footer,
.register-page .public-nav,
.saas-page .saas-page-nav,
.blog-admin-body .blog-admin-header {
  background: rgba(11,15,20,.94) !important;
  border-color: rgba(148,163,184,.18) !important;
}
.landing-page .site-header nav a,
.landing-page .footer-col nav a,
.landing-page .footer-desc,
.register-page .public-nav nav a,
.saas-page .saas-page-nav nav a,
.blog-admin-body a { color: #9aaabd !important; }
.landing-page .hero h1,
.landing-page .section h2,
.landing-page .login-section h2,
.landing-page .feature-card h3,
.landing-page .knowledge-card h3,
.landing-page .faq-list summary,
.landing-page .login-form h3,
.landing-page .footer-col h4,
.register-page .register-copy h1,
.register-page .register-copy li,
.register-page .auth-card-head h2,
.register-page .auth-form label span,
.saas-page h1, .saas-page h2, .saas-page h3,
.blog-admin-body h1, .blog-admin-body h2, .blog-admin-body h3 {
  color: #edf4fb !important;
}
.landing-page .hero h1 > span,
.landing-page .feature-card p,
.landing-page .feature-card > small,
.landing-page .knowledge-card > p,
.landing-page .section-description,
.landing-page .section-heading > p:not(.eyebrow),
.landing-page .faq-list details p,
.landing-page .login-grid > div > p:not(.eyebrow),
.register-page .register-copy p,
.register-page .register-copy li,
.register-page .auth-card-head p,
.register-page .auth-card-foot,
.register-page .register-form small,
.register-page .register-terms span,
.saas-page p, .saas-page small,
.blog-admin-body p, .blog-admin-body small { color: #9aaabd !important; }
.landing-page .hero-announcement,
.landing-page .feature-card,
.landing-page .knowledge-card,
.landing-page .workflow-step-card,
.landing-page .tools-container,
.landing-page .testimonial-card,
.landing-page .login-form,
.register-page .auth-card,
.register-page .register-proof span,
.saas-page .account-card,
.saas-page .account-plan,
.blog-admin-body .content-list-panel,
.blog-admin-body .editor-panel {
  background: #151b23 !important;
  border-color: rgba(148,163,184,.2) !important;
  color: #edf4fb !important;
}
.landing-page .knowledge-art,
.landing-page .login-section,
.register-page .register-proof span { background: #111820 !important; border-color: rgba(148,163,184,.2) !important; }
.landing-page .login-form input,
.landing-page .tool-fields input,
.landing-page .tool-fields-single input,
.register-page .auth-form input:not([type="checkbox"]),
.saas-page input, .saas-page select, .saas-page textarea,
.blog-admin-body input, .blog-admin-body select, .blog-admin-body textarea {
  background: #0b0f14 !important;
  color: #edf4fb !important;
  border-color: #334155 !important;
}
.register-page .auth-submit { background: #2563eb !important; }
.app-shell .sidebar,
.admin-body .admin-sidebar { background: #10151b !important; border-color: rgba(148,163,184,.18) !important; }
.app-shell .main-content,
.admin-body .admin-main { background: #0b0f14 !important; color: #edf4fb !important; }
.app-shell .brand strong, .app-shell .sidebar b,
.app-shell .topbar h1, .app-shell h2, .app-shell h3, .app-shell h4,
.app-shell b, .app-shell strong,
.admin-body h1, .admin-body h2, .admin-body h3, .admin-body h4,
.admin-body b, .admin-body strong { color: #edf4fb !important; }
.app-shell .nav-item { color: #9aaabd !important; }
.app-shell .nav-item:hover { background: #1b2430 !important; color: #edf4fb !important; }
.app-shell .nav-item.active { background: #172b46 !important; color: #7cc4ff !important; border-color: #245487 !important; }
.app-shell .saas-sidebar-card, .app-shell .sidebar-user-card,
.app-shell .panel, .app-shell .feed-card, .app-shell .group-card,
.app-shell .account-card, .app-shell .metric-card, .app-shell .section-intro,
.app-shell .welcome-card, .app-shell .operations-band, .app-shell .analytics-toolbar,
.app-shell .meta-hierarchy-panel, .app-shell .pinterest-hero,
.admin-body .admin-metrics article, .admin-body .admin-card,
.admin-body .admin-table-wrap, .admin-body .panel {
  background: #151b23 !important;
  color: #edf4fb !important;
  border-color: rgba(148,163,184,.2) !important;
}
.app-shell .muted, .app-shell p:not(.eyebrow), .app-shell small,
.admin-body p, .admin-body small { color: #9aaabd !important; }
.app-shell input, .app-shell select, .app-shell textarea,
.admin-body input, .admin-body select, .admin-body textarea {
  background: #0b0f14 !important; color: #edf4fb !important; border-color: #334155 !important;
}
.app-shell .table-wrap, .admin-body .admin-table-wrap { background: #151b23 !important; }
.app-shell table th, .admin-body table th { background: #1b2430 !important; color: #b7c4d3 !important; border-color: rgba(148,163,184,.2) !important; }
.app-shell table td, .admin-body table td { color: #e5edf5 !important; border-color: rgba(148,163,184,.16) !important; }
.app-shell table tbody tr:hover, .admin-body table tbody tr:hover { background: #1a232d !important; }
.app-shell #view-products .table-wrap { background: #151b23 !important; }
.app-shell #view-products .table-wrap tr { background: #151b23 !important; border-color: rgba(148,163,184,.2) !important; }
.app-shell .btn.secondary, .app-shell .btn.light, .app-shell .btn.soft,
.admin-body .btn.secondary, .admin-body .btn.light, .admin-body .btn.soft { background: #1e2935 !important; color: #dce7f1 !important; border-color: #3b4a5b !important; }
.landing-page .site-footer .footer-bottom { border-color: rgba(148,163,184,.18) !important; color: #8292a6 !important; }

/* Cursor-reactive star field for the complete public homepage. */
.landing-page { position: relative; }
.landing-page .page-particles-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none;
  z-index: 0; opacity: .62; mix-blend-mode: screen;
}
.landing-page > *:not(.page-particles-canvas) { position: relative; z-index: 1; }
