/* V3 — color as navigation; motion only in response to an action. */
:root{--motion-out:cubic-bezier(.23,1,.32,1)}
.hero-context{display:grid;grid-template-columns:minmax(0,1fr) 188px;align-items:center;gap:24px;align-self:center;padding:0}
.hero-details>p{font-size:14px;line-height:1.65;color:#a5a5a8;margin:0 0 19px;letter-spacing:-.2px}
.hero-details>p br{display:none}.hero-details .collection-stats{gap:22px}.hero-details .collection-stats strong{font-size:28px}
.category-orbit{width:188px;height:188px;border-radius:37px;background:#1f1f20;position:relative;display:grid;place-items:center;padding-bottom:15px}
.dot-cluster{display:grid;grid-template-columns:repeat(4,38px);grid-template-rows:repeat(2,38px)}
.dot-button{width:38px;height:38px;position:relative;padding:0;border-radius:50%;display:grid;place-items:center;outline-offset:0}
.orbit-dot{width:21px;height:21px;background:var(--dot-color);border-radius:50%;display:block;position:relative;transition:transform 220ms var(--motion-out),opacity 160ms ease;transform:translate(0,0) scale(1)}
.orbit-dot:after{content:'';position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--dot-color);opacity:0;transform:scale(.9);transition:opacity 160ms ease,transform 220ms var(--motion-out)}
.dot-button[aria-pressed=true] .orbit-dot:after{opacity:.8;transform:scale(1)}
.dot-button.is-preview .orbit-dot{transform:translate(0,-2px) scale(1.12)}
.dot-caption{position:absolute;bottom:23px;left:10px;right:10px;text-align:center;font-size:10px;color:#9b9b9e;line-height:1.3;pointer-events:none}
.dot-button:focus-visible{outline:1px solid var(--dot-color)}
.directory-layout{grid-template-columns:270px minmax(0,1fr);gap:30px}.filters{padding-right:20px}.filter-heading{height:38px;margin-bottom:10px}.filter-heading h3{font-size:16px;color:var(--white);font-weight:400;display:flex;align-items:center;gap:16px}.filter-letter{font-size:13px;color:#68686c}.filter-option{font-size:13px;line-height:1.5;align-items:center;gap:13px;padding:10px 0;color:#99999f;border-radius:0;transition:color 140ms ease}.filter-option:hover{background:transparent}.filter-option>span:not(.filter-count){flex:1;min-width:0}.filter-option .filter-count{font-size:12px;color:#68686c;margin-left:0;font-variant-numeric:tabular-nums}.filter-option input{appearance:none;position:relative;display:block;width:17px;height:17px;flex:0 0 17px;border:2px solid var(--cat-color);border-radius:50%;background:transparent;margin:0;box-shadow:none;cursor:pointer}.filter-option input:checked{background:transparent;border-color:var(--cat-color);box-shadow:none}.filter-option input:before{content:'';position:absolute;inset:3px;background:var(--cat-color);border-radius:50%;transform:scale(.65);opacity:0;transition:transform 180ms var(--motion-out),opacity 140ms ease}.filter-option input:checked:before{transform:scale(1);opacity:1}.filter-option:has(input:checked){color:var(--white)}.filter-option input:focus-visible{outline:2px solid var(--cat-color);outline-offset:5px}.all-category{padding:11px 9px;margin-bottom:9px}.all-category.selected{background:#1b1b1c}.advanced{margin-top:21px}.filter-foot{margin-top:16px}
.home-categories .category-card{transition:transform 200ms var(--motion-out),filter 160ms ease;transform:translateY(0);will-change:auto}
.category-arrow{display:block;transition:transform 200ms var(--motion-out)}
.home-categories .category-card[aria-pressed=true]{box-shadow:inset 0 0 0 2px #f1f1f4}
.category-check{opacity:0;transform:translateY(2px);transition:opacity 150ms ease,transform 180ms var(--motion-out)}
.category-card[aria-pressed=true] .category-check{opacity:1;transform:translateY(0)}
.category-card.is-preview:not([aria-pressed=true]){box-shadow:inset 0 0 0 1px #12121355}
.home-search button{transition:transform 140ms var(--motion-out),background-color 140ms ease}.home-search button span{display:inline-block;transition:transform 180ms var(--motion-out)}
.home-search button:active,.view-toggle button:active,.pagination button:active:not(:disabled),.share-button:active{transform:scale(.97)}
.home-categories .category-card:active{transform:translateY(0) scale(.99)}
.dot-button:active .orbit-dot{transform:scale(.91)}
.brand .flower{transform:rotate(0deg);transition:transform 240ms var(--motion-out)}
.site-icon{transition:transform 180ms var(--motion-out)}
.external-arrow{transition:transform 180ms var(--motion-out),color 120ms ease}
.view-toggle button,.pagination button,.share-button{transition:transform 140ms var(--motion-out)}
.toast{transition:opacity 180ms ease,transform 220ms var(--motion-out)}
@media(hover:hover) and (pointer:fine){
  .category-orbit:hover .orbit-dot{transform:translate(var(--dx),var(--dy))}
  .category-orbit .dot-button.is-preview .orbit-dot{transform:translate(var(--dx),calc(var(--dy) - 2px)) scale(1.14)}
  .home-categories .category-card:hover{transform:translateY(-2px);filter:brightness(1.035)}
  .home-categories .category-card:hover .category-arrow{transform:translateX(2px)}
  .home-search button:hover span{transform:translate(2px,-2px)}
  .brand:hover .flower{transform:rotate(90deg)}
  .filter-option:hover{color:#e0e0e4}
  .listing-main:hover .site-icon{transform:translateY(-1px)}
}
@media(max-width:1100px){
 .hero-context{grid-template-columns:minmax(0,1fr) 160px;gap:18px}.category-orbit{width:160px;height:160px;border-radius:31px;padding-bottom:14px}.dot-cluster{grid-template-columns:repeat(4,32px);grid-template-rows:repeat(2,32px)}.dot-button{width:32px;height:32px}.orbit-dot{width:19px;height:19px}.dot-caption{font-size:9px;bottom:18px}.hero-details>p{font-size:12px}.hero-details .collection-stats{gap:12px}.hero-details .collection-stats>span{display:block}.hero-details .collection-stats strong{font-size:25px;margin-right:4px}.directory-layout{grid-template-columns:240px minmax(0,1fr);gap:24px}.filters{padding-right:8px}.filter-option{font-size:12px;gap:11px}.filter-option .filter-count{font-size:11px}
}
@media(max-width:900px) and (min-width:761px){.home-intro{column-gap:30px}.hero-context{grid-template-columns:1fr 136px;gap:14px}.category-orbit{width:136px;height:150px;border-radius:28px}.dot-cluster{grid-template-columns:repeat(4,29px);grid-template-rows:repeat(2,33px)}.dot-button{width:29px;height:33px}.orbit-dot{width:17px;height:17px}.hero-details .collection-stats{gap:9px;font-size:9px}.hero-details>p{font-size:11px}}
@media(max-width:760px){
 .home-intro{display:block}.hero-copy h1{font-size:51px}.hero-context{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:20px}.hero-details{max-width:330px;flex:1}.hero-details>p{font-size:13px;margin:0 0 15px}.hero-details .collection-stats{display:flex;font-size:10px}.hero-details .collection-stats>span{display:flex}.hero-details .collection-stats strong{font-size:24px}.category-orbit{flex-shrink:0}.directory-layout{grid-template-columns:1fr;gap:14px}.filters{padding:0}.filters.mobile-open #category-filters{column-gap:18px}.filter-option{font-size:11px;padding:9px 0;gap:9px;min-height:44px}.filter-option input{width:16px;height:16px;flex-basis:16px}.filter-option .filter-count{display:none}.filter-heading h3{font-size:14px}.home-categories .category-card:active{transform:scale(.99)}
}
@media(max-width:480px){
 .hero-context{margin-top:20px;gap:22px}.hero-details>p{font-size:12px;line-height:1.7;margin:0}.hero-details .collection-stats{display:none}.category-orbit{width:144px;height:144px;border-radius:29px;padding-bottom:14px}.dot-cluster{grid-template-columns:repeat(4,30px);grid-template-rows:repeat(2,32px)}.dot-button{width:30px;height:32px}.orbit-dot{width:18px;height:18px}.dot-caption{font-size:8px;bottom:17px}.home-intro{padding-top:28px}.hero-discovery{margin-top:23px}.home-search button span{display:none}.filters.mobile-open #category-filters{gap:0 16px}.filter-option{font-size:11px;line-height:1.45}.filter-option input{flex-basis:15px;width:15px;height:15px}.filter-option input:before{inset:2px}
}
@media(max-width:350px){.hero-context{gap:14px}.category-orbit{width:130px;height:136px}.dot-cluster{grid-template-columns:repeat(4,28px)}.dot-button{width:28px}.orbit-dot{width:17px;height:17px}.hero-details>p{font-size:11px}.dot-caption{font-size:8px;bottom:15px}}
/* Keyboard navigation and reduced-motion settings stay immediate. */
html[data-input=keyboard]{scroll-behavior:auto}
html[data-input=keyboard] *,html[data-input=keyboard] *:before,html[data-input=keyboard] *:after{animation:none!important;transition:none!important}
html[data-input=keyboard] .orbit-dot,html[data-input=keyboard] .brand .flower,html[data-input=keyboard] .category-card,html[data-input=keyboard] .category-arrow,html[data-input=keyboard] .site-icon,html[data-input=keyboard] .home-search button span{transform:none!important}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*:before,*:after{animation:none!important;transition:none!important}
 .orbit-dot,.brand .flower,.category-card,.category-arrow,.site-icon,.home-search button span{transform:none!important}
}

/* Clear labels for first-time visitors; preserve the original visual rhythm. */
.share-button{width:auto;min-width:66px;padding:0 10px;font-size:11px;white-space:nowrap}
.filter-guidance{font-size:11px;color:#96969b;margin:0 0 8px 9px}
.results-toolbar{flex-wrap:wrap;row-gap:12px}.result-controls{margin-left:auto}
@media(max-width:760px){.filter-guidance{display:none}.filters.mobile-open .filter-guidance{display:block;grid-column:1/-1;grid-row:2;margin:0;padding-top:8px}.filters.mobile-open #category-filters{grid-row:3}.home-section-heading{gap:20px}.home-section-heading>span{text-align:right}}
@media(max-width:480px){.results-toolbar>p{width:100%}.result-controls{width:100%;justify-content:space-between}.sort-wrap{font-size:10px}.sort-wrap select{max-width:126px}.home-section-heading>span{max-width:115px;line-height:1.5}.share-button{font-size:10px;min-width:62px;padding:0 8px}.dot-caption{font-size:9px}}
@media(max-width:350px){.sort-wrap{gap:2px}.sort-wrap select{max-width:114px}.result-controls{gap:5px}}

/* Real brand marks inherit the existing category color and tile treatment. */
.site-logo{display:block;width:23px;height:23px;flex:none;background:currentColor;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}
@media(max-width:760px){.site-logo{width:21px;height:21px}}

/* Five-column directory, with readable cards at narrower widths. */
.results.grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.results.grid .directory-row{min-width:0}
@media(max-width:1200px){.results.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.results.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.results.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.results.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Eight categories retain the reference's two-row palette and dot navigation. */
.home-categories .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.dot-cluster{grid-template-columns:repeat(4,38px);grid-template-rows:repeat(2,38px)}
.dot-button{width:38px;height:38px}.orbit-dot{width:21px;height:21px}
.tool-api{font-size:10px;color:var(--muted);text-decoration:underline;text-decoration-color:#474749;text-underline-offset:3px;line-height:1.5}
.tool-api:hover,.evidence-link{color:var(--green)}
.directory-row{grid-template-columns:minmax(0,1fr) 145px 115px 36px}
.list-head{grid-template-columns:minmax(0,1fr) 260px 36px}
.grid .tool-api{width:100%;order:3;font-size:9px;margin-top:-9px}
.grid .bookmark{margin-left:auto}.grid .row-category{align-self:center}
.grid .site-name{overflow-wrap:anywhere}
@media(max-width:1100px){.dot-cluster{grid-template-columns:repeat(4,32px);grid-template-rows:repeat(2,32px)}.dot-button{width:32px;height:32px}.orbit-dot{width:19px;height:19px}}
@media(max-width:760px){.home-categories .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.directory-row{grid-template-columns:minmax(0,1fr) 120px 100px 32px}.list-head{grid-template-columns:minmax(0,1fr) 220px 32px}.advanced-body{display:flex;flex-direction:column;align-items:stretch}.dot-cluster{grid-template-columns:repeat(4,30px)}.dot-button{width:30px}.orbit-dot{width:18px}}
@media(max-width:480px){.directory-row{grid-template-columns:minmax(0,1fr) 32px}.tool-api{grid-column:1;grid-row:3;padding-left:43px;font-size:10px}.grid .tool-api{padding-left:0}.grid .row-category{flex-basis:calc(100% - 32px)}.list-head{grid-template-columns:1fr 32px}.hero-context{gap:14px}.category-orbit{width:144px;height:144px}.dot-cluster{grid-template-columns:repeat(4,30px);grid-template-rows:repeat(2,32px)}}
