:root{
  --ink:#2c2824!important;
  --ink-2:#3a342e!important;
  --muted:#6f655d!important;
  --muted-2:#857970!important;
  --paper:#fbf7f1!important;
  --surface:#fff!important;
  --surface-blue:#edf5f9!important;
  --line:#ddcfbf!important;
  --line-strong:#c7b39f!important;
  --brand:#4f7694!important;
  --brand-2:#6f9fbe!important;
  --brand-3:#a9c9dc!important;
  --teal:#4f817b!important;
  --gold:#d6aa73!important;
  --radius-xl:3px!important;
  --radius-lg:2px!important;
  --radius-md:2px!important;
  --action-blue:#4f7694;
  --action-blue-hover:#3d627c;
  --action-teal:#527a75;
  --action-teal-hover:#416660;
  --selected:#2f6f68;
  --selected-hover:#285f59;
  --reset-bg:#f1e8df;
  --reset-ink:#684f3e;
  --reset-border:#c8ad96;
}
*{scrollbar-color:#c8b49f #f6eee4}
body{color:#2c2824!important;background:linear-gradient(180deg,#fbf7f1,#f4ecdf 58%,#edf5f9)!important}
button,.button,input,select,textarea,.card,.hero-card,.category-panel,.guide,.result,.result-card,.option,.food,.alt,.winner,.drawer,.modal,.panel,.filter-card,.chip,.pill,.step-pill{border-radius:2px!important}

/* Solid action colors replace the previous brown-to-blue gradients. */
.button--primary,.primary,.btn.primary,.btn-primary,.cta{
  background:var(--action-blue)!important;
  color:#fff!important;
  border-color:var(--action-blue)!important;
}
.button--primary:hover:not(:disabled),.primary:hover:not(:disabled),.btn.primary:hover:not(:disabled),.btn-primary:hover:not(:disabled),.cta:hover:not(:disabled){
  background:var(--action-blue-hover)!important;
  border-color:var(--action-blue-hover)!important;
}
.button--secondary,.btn.secondary{
  background:#fff!important;
  color:#35576c!important;
  border-color:#9fb8c7!important;
}
.button--secondary:hover:not(:disabled),.btn.secondary:hover:not(:disabled){
  background:#eef4f7!important;
  border-color:#789caf!important;
}
.button--ghost{
  background:#edf4f7!important;
  color:#35576c!important;
  border-color:#a5bdca!important;
}
.button--ghost:hover:not(:disabled){
  background:#dfeaf0!important;
  border-color:#789caf!important;
}
.button--reset{
  background:var(--reset-bg)!important;
  color:var(--reset-ink)!important;
  border-color:var(--reset-border)!important;
}
.button--reset:hover:not(:disabled){
  background:#e7d8ca!important;
  border-color:#a88970!important;
}

/* The two hero actions each have a distinct solid color. */
.hero-actions .button--primary{
  background:var(--action-blue)!important;
  border-color:var(--action-blue)!important;
}
.hero-actions .button--ghost{
  background:var(--action-teal)!important;
  color:#fff!important;
  border-color:var(--action-teal)!important;
}
.hero-actions .button--ghost:hover:not(:disabled){
  background:var(--action-teal-hover)!important;
  border-color:var(--action-teal-hover)!important;
}

/* Selected/active controls switch to a deeper teal and gain a clear ring. */
.hero-actions .button.is-selected,
.button.is-selected,
.chip.active,
.filter-chip.active,
.tab.active,
.option.selected,
.step-pill.active,
.category-chip.is-active,
.method-filter-chip.is-active{
  background:var(--selected)!important;
  color:#fff!important;
  border-color:var(--selected)!important;
  box-shadow:0 0 0 3px rgba(47,111,104,.2),0 7px 16px rgba(47,111,104,.18)!important;
}
.hero-actions .button.is-selected:hover:not(:disabled),
.button.is-selected:hover:not(:disabled),
.chip.active:hover,
.filter-chip.active:hover,
.tab.active:hover,
.option.selected:hover,
.category-chip.is-active:hover,
.method-filter-chip.is-active:hover{
  background:var(--selected-hover)!important;
  border-color:var(--selected-hover)!important;
}
.hero-actions .button.is-selected::before{content:"✓";font-family:Arial,sans-serif;font-weight:900}
.option.selected strong,.option.selected small,.option.selected span{color:#fff!important}
.category-chip.is-active .category-count,.method-filter-chip.is-active span{color:#fff!important;opacity:.9}

.site-header,.topbar,header{background:rgba(251,247,241,.96)!important}
footer{background:#eadfce!important;color:#4d463f!important}
.logo-link,.brand{width:auto!important;text-decoration:none!important}
.tool-wordmark{display:inline-flex!important;flex-direction:column!important;color:#2c2824!important;font-weight:900!important;line-height:1.05!important;letter-spacing:-.02em!important}
.tool-wordmark small{display:block!important;margin-top:4px!important;color:#6f655d!important;font-size:9px!important;letter-spacing:.12em!important;text-transform:uppercase!important}
.logo-link img,.brand img{display:none!important}
:focus-visible{outline:3px solid rgba(47,111,104,.45)!important;outline-offset:3px!important}
.gsg-profile-banner{margin:10px auto 0;max-width:1100px;padding:8px 12px;border:1px solid #ddcfbf;background:#fffaf4;border-radius:2px;color:#6f655d;font:700 12px/1.4 "DM Sans",system-ui,sans-serif}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}