/* One selected-state palette, used on both paper and forest surfaces. */
:root{--selection-accent:#d5e87c;--selection-shade:#788d35}
[data-tone=sage]{--selection-accent:#91c5a5;--selection-shade:#477a5e}
[data-tone=clay]{--selection-accent:#e6a17c;--selection-shade:#a95532}
[data-tone=brass]{--selection-accent:#e4c26f;--selection-shade:#97732a}
[data-tone=teal]{--selection-accent:#87c7c8;--selection-shade:#367c80}
[data-tone=citron]{--selection-accent:#d5e87c;--selection-shade:#788d35}
.icon-base{fill:var(--icon-paper,var(--paper));stroke:none}
.icon-color{fill:var(--selection-accent);stroke:none;opacity:0;transition:opacity .18s ease}
.icon-color .icon-fill-secondary{fill:var(--selection-shade)}
.icon-ink{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
/* Services retain category color in every state, with opaque discs over the detailed study. */
.service-map-icon{--icon-paper:color-mix(in srgb,var(--paper) 82%,var(--selection-accent));background:color-mix(in srgb,var(--selection-accent) 78%,var(--paper));border-color:var(--selection-accent);color:var(--forest);box-shadow:0 2px 8px #12291e40}
.service-map-icon .icon-color{opacity:1}
.service-map-choice[aria-pressed=true] .service-map-icon{background:var(--selection-accent);border-color:var(--paper);color:var(--forest);box-shadow:0 0 0 3px color-mix(in srgb,var(--selection-accent) 65%,var(--forest)),0 0 0 5px var(--forest)}
.service-map-choice:hover:not(:disabled) .service-map-icon{background:var(--selection-accent);border-color:var(--paper)}
.service-map-label{color:var(--selection-accent);padding:3px 5px}
.service-map-choice[aria-pressed=true] .service-map-label{color:var(--paper);box-shadow:inset 0 -1px var(--selection-accent)}
.service-map-choice:focus-visible{outline-color:var(--selection-accent)}
.service-map-routes path.is-selected{stroke:var(--selection-accent)}
.service-list details[open] summary>span{background:var(--selection-accent);border-color:var(--selection-accent);color:var(--forest)}
.service-list details>div{border-left-color:var(--selection-accent)}
/* Workflow: the active artifact, stage control, and output rule use one tone. */
.method-steps button[aria-selected=true]{background:color-mix(in srgb,var(--selection-accent) 18%,var(--paper));border-color:var(--selection-shade)}
.method-steps button[aria-selected=true]>span{background:var(--selection-accent);border-color:var(--selection-shade)}
.method .spec-output{border-left-color:var(--selection-shade)}
.workflow-art-caption{color:var(--forest)}
/* Carry the same selection language into project collections and scale studies. */
.filters .collection-filter[aria-pressed=true]{border-bottom-color:var(--selection-shade)}
.collection-filter[aria-pressed=true] .filter-glyph{color:var(--selection-shade)}
.collection-filter[aria-pressed=true] .icon-point{fill:var(--selection-shade);stroke:var(--selection-shade)}
.craft-choices button[aria-selected=true]>b{font-weight:700}
.craft-choices button[aria-selected=true]>small{color:var(--forest)}
.craft-choices button[aria-selected=true]:before{background:var(--selection-shade)}
.craft-choices button[aria-selected=true]>span{color:var(--forest);font-weight:700}
/* The three choice rows share one compact frame and category-color treatment. */
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter){isolation:isolate;overflow:hidden;min-height:62px;border:1px solid color-mix(in srgb,var(--selection-shade) 35%,var(--paper));border-bottom:2px solid color-mix(in srgb,var(--selection-shade) 65%,var(--paper));background:color-mix(in srgb,var(--selection-accent) 18%,var(--paper));color:var(--forest);box-shadow:none;transition:background .2s,border-color .2s}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter)::before{content:'';display:block;position:absolute;z-index:-1;width:140px;height:100px;right:-85px;top:-50px;border:1px solid currentColor;border-radius:50%;box-shadow:0 0 0 10px color-mix(in srgb,currentColor 5%,transparent),0 0 0 20px color-mix(in srgb,currentColor 4%,transparent);opacity:.14;transform:rotate(-32deg);pointer-events:none}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter):is(:hover,:focus-visible){border-color:var(--selection-shade);background:color-mix(in srgb,var(--selection-accent) 30%,var(--paper))}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter):is([aria-pressed=true],[aria-selected=true],[data-active=true]){background:color-mix(in srgb,var(--selection-accent) 62%,var(--paper));border-color:var(--selection-shade)}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter,.about-actions .text-link)::before{transition:background .2s ease}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter,.about-actions .text-link):is(:hover,:focus-visible,[aria-pressed=true],[aria-selected=true],[data-active=true])::before{background:var(--selection-shade)}
.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter):focus-visible{outline:2px solid var(--selection-shade);outline-offset:4px}
.home-page :is(.connection-choice,.craft-choices button)::after{display:none}
.home-page .connection-choice{padding:6px 10px}
.home-page .connection-figure .connection-choice strong{font-size:12px;line-height:1.3}
.home-page .connection-choice span{font-size:10.5px;line-height:1.3;margin-top:3px}
.home-page .craft-choices button{padding:8px 10px}
.home-page .craft-choices button>b{font-size:13px}
.home-page .filters .collection-filter{flex-direction:row;align-items:center;gap:8px;padding:6px 24px 6px 10px;transform:none}
.home-page .filter-glyph{flex:0 0 28px;width:28px;height:30px}
.home-page .filter-text{gap:2px}
.home-page .filter-name{font-size:13px;line-height:1.25}
.home-page .filter-summary{font-size:10px;line-height:1.2}
.home-page .collection-filter .filter-count{top:6px;right:7px;font-size:9px}
.home-page .filter-arrow{bottom:6px;right:8px;font-size:14px}
.home-page .filters{margin-bottom:24px}
@media(max-width:640px){.home-page .craft-choices{gap:8px 12px}.home-page .filter-summary{display:none}}
@media(max-width:560px){.home-page .connection-choice{padding:6px 7px}.home-page .connection-figure .connection-choice strong{font-size:11px;line-height:1.35;letter-spacing:.05em}.home-page .connection-choice span{font-size:10px;line-height:1.35}.home-page .filter-name{font-size:12px}.home-page .filters .collection-filter{padding-left:8px;gap:6px}.home-page .filter-glyph{flex-basis:24px;width:24px;height:26px}}
@media(prefers-reduced-motion:reduce){.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter),.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter,.about-actions .text-link)::before{transition:none}}
@media(forced-colors:active){.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter){background:Canvas;color:ButtonText;border-color:ButtonText}.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter):is([aria-pressed=true],[aria-selected=true],[data-active=true]){background:Canvas;color:Highlight;border-color:Highlight}.home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter)::before{display:none}}
@media(prefers-reduced-motion:reduce){.icon-color{transition:none}}
/* The remaining colored rectangular actions match the compact phone selectors. */
@media(max-width:680px){
 .home-page :is(.connection-choice,.filters .collection-filter){min-height:46.5px;padding-block:4px}
 .home-page .connection-choice{padding-block:3px}
 .home-page .connection-figure .connection-choice strong{font-size:10.5px;line-height:1.2}
 .home-page .connection-choice span{font-size:9px;line-height:1.2;margin-top:1px}
 .home-page .about-actions .text-link{min-height:45px;padding-block:3px}
 .home-page .button{min-height:36px;padding-block:6px}
}
@media(max-width:380px){.home-page .about-actions .text-link{min-height:39px;padding-block:4px}}
@media(min-width:681px){
 .home-page :is(.connection-choice,.craft-choices button,.filters .collection-filter){min-height:46.5px;padding-block:4px}
 .home-page .about-actions .text-link{min-height:45px;padding-block:6px}
 .home-page .button{min-height:36px;padding-block:6px}
}
@media(forced-colors:active){.service-map-icon{background:Canvas;color:CanvasText;border-color:ButtonText;box-shadow:none}.service-map-choice[aria-pressed=true] .service-map-icon,.method-steps button[aria-selected=true]{border:2px solid Highlight;box-shadow:none}.service-map-label,.service-map-choice[aria-pressed=true] .service-map-label{color:CanvasText;background:Canvas;box-shadow:none}.icon-color{display:none}.icon-base{fill:Canvas}.icon-ink{stroke:CanvasText}.collection-filter[aria-pressed=true] .filter-glyph{color:Highlight}}
