/* Local colour comparison: the Whisker layout and image pixels stay unchanged. */
:root {
  --ink: #18243a;
  --muted: #566478;
  --blue: #2654dd;
  --line: #e7ecf4;
  --soft: #f4f7fd;
  --mustard: #ffb938;
  --paper: #fff;
}

body { color: var(--ink); background: #fff; }
::selection { color: #fff; background: #2654dd; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline-color: #2654dd; }

.product-header { background: #fffffff2; border-color: var(--line); }
.brand-mark { color: #fff; background: var(--blue); }
.header-brand-caption, .menu-label { color: var(--muted); }
.product-nav { color: #566478; }
.product-nav > a:hover, .services-menu[open] summary, .services-menu summary:hover { color: var(--blue); }
.header-app, .button { color: #fff; background: var(--blue); border-color: var(--blue); }
.header-app:hover, .button:hover { background: #1b43ba; border-color: #1b43ba; box-shadow: 0 4px 0 #2654dd19; }
.header-mobile-menu summary { color: #34435c; border-color: #dce3ef; }
.header-mobile-menu[open] summary { color: var(--blue); background: #edf2ff; border-color: #b7c7f3; }
.mobile-menu-panel, .services-panel { background: #fff; border-color: #dce3ef; box-shadow: 0 18px 50px #18243a25; }
.mobile-menu-panel a, .services-panel a { color: #34435c; }
.mobile-menu-panel a:hover, .services-panel a:hover { color: var(--blue); background: #f1f5ff; }

.hero { background: radial-gradient(ellipse at 50% 10%, #ebf1ff 0, transparent 62%), linear-gradient(#fcfdff, #f8faff); border-color: var(--line); }
.hero::before { background: radial-gradient(ellipse at 22% 40%, #c7d6ff66, transparent 60%), url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.15' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.hero .eyebrow { color: #4063b8; }
.hero .eyebrow > span { background: var(--blue); }
.hero h1 { color: var(--ink); }
.hero h1 > span { color: var(--blue); }
.hero-description { color: var(--muted); }
.hero-accounting { color: #81510a; background: linear-gradient(transparent 60%, #ffce7166 60%); }
.hero-secondary { color: #3b5ca4; }
.audience-line { color: #566478; }
.hero-topics { color: #536279; border-color: #e1e7f3; }
.hero-topics svg { stroke: #4a70d9; }
.character-orbit { border-color: #2654dd22; background: #e3ecff66; box-shadow: 0 0 0 32px #dce7ff22, 0 0 0 33px #2654dd12; }
.character-orbit::before, .character-orbit::after { background: #6b8ce2; }
.character-tag { color: #304c82; background: #eff5ffcc; border-color: #2654dd3d; }
.character-tag::before { background: #2654dd; }
.hero-field-note, .hero-scroll { color: #566478; }
.hero-scroll { border-color: #2654dd22; }

.section-heading h2, .step-details h3, .operation-heading h3, .product-slide h3, .chart-card h3 { color: var(--ink); }
.section-label { color: var(--blue); }
.section-heading > p:not(.section-label) { color: var(--muted); }
.workflow-section { background: transparent; border-color: var(--line); }
.workflow-accounting-note { color: #785313 !important; border-inline-start-color: #ffb938; }
.workflow-list li { background: #fff; border-color: #dce5f4; }
.workflow-list li:first-child { background: #f2f6ff; border-color: #bacdf6; }
.workflow-list li:not(:last-child)::before { border-color: #bbcdf0; }
.workflow-list li:not(:last-child)::after { border-color: #7e9bd2; }
.step-icon { color: var(--blue); background: #edf3ff; border-color: #e0e9fb; }
.workflow-step:first-child .step-icon { color: #fff; background: var(--blue); border-color: var(--blue); }
.step-number, .step-number strong { color: #566478; }
.step-chevron { stroke: #526a96; }
.step-output { color: #3b5fa0; border-color: var(--line); }
.accounting-callout { color: #442b07; background: #ffb938; }
.accounting-scope { color: #604008; }
.accounting-border rect { stroke: #8a4b09; }
.operations-overview-card { background: #fff; border-color: var(--line); }
.operation-heading .feature-icon { color: var(--blue); background: #edf3ff; border-color: #dce5f4; }
.operations-overview-card > p { color: var(--muted); }

.product-views-section { background: #f4f7fd; border-color: var(--line); }
.carousel-pages button, .carousel-controls button { color: #3b5fa0; background: transparent; border-color: #c8d5ee; }
.carousel-pages button[aria-pressed="true"] { color: #fff; background: var(--blue); border-color: var(--blue); }
.carousel-pages button:hover:not([aria-pressed="true"]), .carousel-controls button:hover:not(:disabled) { color: #1b43ba; background: #e7efff; border-color: #9eb5ed; }
.carousel-status { color: var(--muted); }
.product-slide { background: #fff; border-color: #dce5f4; }
.carousel-image { background: #fff; border-color: #dce5f4; }
.carousel-image > span { color: #3b5fa0; background: #edf3ff; border-color: #dce5f4; }
.carousel-category { color: var(--blue); }
.product-slide p, .product-slide ul { color: var(--muted); }
.product-slide ul { border-color: var(--line); }
.product-slide li::before { color: var(--blue); }

.tutorials-section { color: var(--ink); background: #f4f7fd; border-block-color: var(--line); }
.tutorials-section .section-label, .tutorial-details .carousel-category { color: var(--blue); }
.tutorials-section .section-heading h2, .tutorial-details h3 { color: var(--ink); }
.tutorials-section .section-heading > p:not(.section-label), .tutorial-details p { color: var(--muted); }
.tutorial-carousel .tutorial-slide { background: #fff; border-color: #dce5f4; }
.tutorial-media, .tutorial-media video { background: #14233f; }
.tutorial-poster { color: #fff; background: radial-gradient(ellipse at 25% 85%, #294b854d, transparent 70%), #14233f; }
.tutorial-poster::before { border-color: #ffffff0b; }
.tutorial-brand { color: #b9c9e4; }
.tutorial-outline, .tutorial-play { color: #d9e5fc; }
.tutorial-play { background: #ffffff0b; border-color: #8fa8d05c; }
.tutorial-soon { color: #ffdc93; background: #f7c15c0b; border-color: #e0bb702e; }
.tutorial-soon::before { background: #ffcf75; }
.tutorial-availability { color: #566478; border-color: var(--line); }
.tutorial-carousel .carousel-pages button, .tutorial-carousel .carousel-controls button { color: #3b5fa0; background: transparent; border-color: #c8d5ee; }
.tutorial-carousel .carousel-pages button[aria-pressed="true"] { color: #fff; background: var(--blue); border-color: var(--blue); }
.tutorial-carousel .carousel-pages button:hover:not([aria-pressed="true"]), .tutorial-carousel .carousel-controls button:hover:not(:disabled) { color: #1b43ba; background: #e7efff; border-color: #9eb5ed; }
.tutorial-carousel .carousel-status { color: var(--muted); }

.reports-section { border-color: var(--line); }
.chart-demo-note > span { color: #785313; background: #fff5df; border-color: #efdeb7; }
.chart-demo-note > p { color: var(--muted); }
.chart-card { background: #fff; border-color: var(--line); }
.chart-category, .chart-description, .chart-readout-label, .chart-axis, .chart-weeks, .chart-selection label, .chart-card figcaption, .report-bar-label { color: var(--muted); }
.chart-unit { color: #566478; background: #f4f7fc; }
.chart-readout-value { color: var(--blue); }
.profit-chart-card .chart-readout-value { color: #28866c; }
.profit-chart-card .chart-readout-value.is-negative { color: #a36312; }
.chart-selection, .chart-card figcaption { border-color: var(--line); }
.chart-select { color: #344d79; background: #f8faff; border-color: #dce5f3; accent-color: var(--blue); }
.chart-grid-line { stroke: #e7ecf4; }
.chart-zero-line { stroke: #8798b2; }
.chart-selection-line { stroke: #8da8df; }
.chart-area { fill: #2654dd14; }
.chart-sales-line, .chart-sales-point { stroke: #2654dd; }
.chart-sales-point { fill: #fff; }
.chart-sales-point.is-selected { fill: #2654dd; }
.chart-profit-bar { fill: #28866c; }
.chart-profit-bar.is-negative { fill: #cf922e; }
.chart-legend .profit-key { background: #28866c; }
.chart-legend .loss-key { background: #cf922e; }
.report-bar-label strong { color: var(--ink); }
.report-bar-track { background: #f0f4fa; }
.report-bar-row:nth-child(1) .report-bar-track > span { background: #2654dd; }
.report-bar-row:nth-child(2) .report-bar-track > span { background: #87a4ec; }
.report-bar-row:nth-child(3) .report-bar-track > span { background: #28866c; }
.report-bar-row:nth-child(4) .report-bar-track > span { background: #6785c2; }
.dues-bars .report-bar-row:nth-child(1) .report-bar-track > span { background: #cf922e; }
.dues-bars .report-bar-row:nth-child(2) .report-bar-track > span { background: #2654dd; }
.dues-bars .report-bar-row:nth-child(3) .report-bar-track > span { background: #87a4ec; }

.faq-list details { background: transparent; border-color: transparent; border-bottom-color: var(--line); }
.faq-list details[open] { background: #f1f5ff; border-color: #dce5f4; }
.faq-list summary { color: var(--ink); }
.faq-list summary > span { color: var(--blue); border-color: #bacdf6; }
.faq-list p { color: var(--muted); }
.faq-list p a { color: var(--blue); }
.closing-inner { background: #f3f7ff; border-color: #dbe5fa; }
.closing-inner .section-label { color: var(--blue); }
.closing-inner h2 { color: var(--ink); }
.contact-description { color: var(--muted); }
.contact-messenger { color: #3b5ca4; }
.contact-actions .button { color: #fff; background: var(--blue); border-color: var(--blue); }
.contact-actions .button:hover { background: #1b43ba; border-color: #1b43ba; }

.marketing-footer { color: #e9effb; background: #14233d; }
.marketing-footer .brand-mark { color: #fff; background: #4671f2; }
.marketing-footer h2, .marketing-footer .brand-name, .footer-license bdi { color: #fff; }
.footer-description, .footer-company-description, .footer-links a, .footer-contact a, .footer-license { color: #c2cee3; }
.footer-integrations, .footer-bottom p, .footer-bottom a { color: #a9bcdf; }
.footer-company, .footer-license, .footer-bottom::before { border-color: #34425b; }
.footer-links a:hover, .footer-contact a:hover, .footer-bottom a:hover { color: #fff; }

.mobile-demo-bar { background: #fffffff5; border-color: var(--line); box-shadow: 0 -4px 18px #18243a12; }
.mobile-demo-bar .button { color: #fff; background: var(--blue); border-color: var(--blue); }
.mobile-demo-bar .button:hover { background: #1b43ba; border-color: #1b43ba; }
.image-viewer { color: var(--ink); background: #fff; border-color: #dce5f4; box-shadow: 0 20px 90px #14233d55; }
.image-viewer::backdrop { background: #14233dd9; }
.viewer-toolbar, .viewer-controls { border-color: var(--line); }
.viewer-toolbar button, .viewer-controls button { color: #30456a; background: #f8faff; border-color: #dce5f4; }
.viewer-toolbar button:hover, .viewer-controls button:hover { color: #18243a; background: #e7efff; }
.viewer-scale, .viewer-hint { color: #566478; }
.viewer-image-area { background: #eaf0f7; }
.step-details summary:focus-visible, .product-carousel :focus-visible, .chart-select:focus-visible, .contact-actions a:focus-visible, .mobile-demo-bar a:focus-visible, .image-viewer :focus-visible, .tutorial-carousel :focus-visible { outline-color: #2654dd; }
.faq-list summary:focus-visible { outline-color: #2654dd; background: #e7efff; }
.marketing-footer a:focus-visible { outline-color: #9aaff9; }

@media (min-width: 1120px) {
  .step-number strong { color: #49699f; }
}
