/* MAT Solutions palette, verified against matsolutions.gy on 2026-10-14.
   Layout, typography, animation timing, and interaction code remain original. */
:root {
  --mat-paper:#f4f1e9; --mat-surface:#fbfaf5; --mat-ink:#1f3151;
  --mat-body:#27486f; --mat-muted:#54657a; --mat-blue:#e0e6eb;
  --mat-sage:#e6e8db; --mat-sand:#e9e1cf; --mat-gold:#f7e399;
  --mat-accent:#246497; --mat-plum:#1f152a; --mat-card:#2a2140;
  color-scheme:dark; accent-color:var(--mat-gold);
}
::selection {background:var(--mat-gold);color:var(--mat-ink)}
html {scrollbar-color:var(--mat-muted) var(--mat-plum)}
/* Recolor the actual moving pixels, including WebGL and frame-sequence canvases. */
.process-tv>img,.process-tv>canvas,.console-body {filter:url(#mat-blue)}
.contact-crown,.contact-crown-sequence,
.feature-video,.workflow-ascii,.workflow-ascii-texture,
.process-grid,.contact-ascii,.contact-squares,.sticky>canvas,.art>canvas,.art>.fallback,
.portfolio-request>canvas,.subscription-terms-dialog>canvas {filter:url(#mat-gold)}
.console-display,.lost-board>svg {filter:url(#mat-gold)}
.contact-camera-body,.contact-sequence,#hero-carousel canvas {filter:none}
.project-preview img,.project-cursor-image,
.case-media img,.case-media video,.intro-experience img,.author img,.feature-image {filter:none}
/* Keep photographs natural even while their sections slide behind the next one. */
.intro-hero,.community {filter:none!important;opacity:1!important}
.feature-grid-static .card-visual {background:var(--mat-card)}
.intro-services {background:var(--mat-plum)}
.author-role {color:#b5c0c6;opacity:1}
/* Gold controls use navy labels and icons, never white text on yellow. */
.workflow-call>span,.subscription-call:not(.subscription-call-outline)>span,
.portfolio-request-submit>span,.intro-hint-arrow,.request-success-icon,
.contact-call,.contact-poster,.cycle-badge {color:var(--mat-ink)}
.workflow-call .button-arrow,.subscription-call:not(.subscription-call-outline) .button-arrow,
.portfolio-request-submit .button-arrow,.intro-hint-arrow img,
.portfolio-request-close img,.mobile-menu-toggle.is-open img {filter:brightness(0) saturate(100%) invert(16%) sepia(28%) saturate(1327%) hue-rotate(180deg) brightness(94%) contrast(91%)}
.portfolio-request-consents input:checked:after {color:var(--mat-ink)}
.contact-call .link-roll-stack>span:last-child {color:var(--mat-ink)}
.portfolio-request-consents label>span,.portfolio-request-input input::placeholder {color:#b5c0c6}
.portfolio-request-consents input {border-color:#b5c0c6}
.contact-legal {color:#b5c0c6}
.intro-hint-card {background:linear-gradient(180deg,var(--mat-body),var(--mat-card))}
.strategy-tag {color:var(--mat-surface)}
.skill-card[data-active=true] .strategy-tag {background:linear-gradient(var(--mat-body),var(--mat-accent))}
.skill-card[data-active=true] .ui-arrow,.skill-card[data-active=true] .ui-knob {background:var(--mat-accent)}
.skill-card[data-active=true] .ui-button {background:var(--mat-body)}
.browser-url {color:#b5c0c6}
/* Paper panels bring the light MAT palette into the subscription section. */
.subscription-plan {background:var(--mat-paper);color:var(--mat-ink)}
.subscription-plan:nth-child(2) {background:var(--mat-blue)}
.subscription-plan h3,.subscription-plan li,.subscription-plan .subscription-price {color:var(--mat-ink)}
.subscription-plan .subscription-terms {color:var(--mat-muted)}
.subscription-plan .subscription-terms:hover {color:var(--mat-accent)}
.subscription-call-outline>span {border-color:var(--mat-ink);color:var(--mat-ink)}
.subscription-call-outline .button-arrow,.subscription-call-outline:is(:hover,:focus-visible) .button-arrow {filter:brightness(0) saturate(100%) invert(16%) sepia(28%) saturate(1327%) hue-rotate(180deg) brightness(94%) contrast(91%)}
.subscription-call-outline:hover>span {background:var(--mat-sage);color:var(--mat-ink)}
.subscription-plan .link-roll-stack>span:last-child {color:var(--mat-accent)}
.contact-poster em {color:var(--mat-body)}
.contact-print,.contact-reduced-print {background:var(--mat-surface)}
.contact-print figcaption,.contact-reduced-print figcaption {color:var(--mat-ink)}
.contact-socials a:hover,.contact-socials a:focus-visible {color:var(--mat-ink)}
.contact-socials a:hover .link-roll-stack>span:last-child {color:var(--mat-ink)}
:is(a,button,input):focus-visible {outline-color:var(--mat-gold)}
.subscription-plan :is(a,button):focus-visible {outline-color:var(--mat-accent)}