/* Descriptor category colors are stable navigation identities, not roast predictions. */
.flavor-filter{--flavor-spice:#76637c;--flavor-cocoa:#7b674e;--flavor-sweet:#9a713e;--flavor-floral:#687853;--flavor-fruit:#a36943;--flavor-berry:#9b5148;padding:12px 0 24px;border-bottom:1px solid var(--line);margin-bottom:24px}
.flavor-path{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:12px;min-height:44px}
.flavor-path .text-button{min-height:44px;color:var(--muted);padding:8px 0}
.flavor-path [aria-current]{color:var(--ink)}
.flavor-path>span{color:var(--muted)}
.flavor-explore{display:flex;align-items:center;gap:48px}
.flavor-wheel-wrap{flex:none;width:440px;max-width:100%}
.flavor-wheel{position:relative;width:100%;aspect-ratio:2;isolation:isolate}
.flavor-sectors{position:absolute;inset:0;transform-origin:50% 100%}
.flavor-sector{position:absolute;inset:0;border:0;padding:0;background:color-mix(in srgb,var(--flavor-tone) 23%,var(--paper));color:var(--ink);clip-path:var(--sector-shape);transition:background .4s ease}
.flavor-sector:hover{background:color-mix(in srgb,var(--flavor-tone) 38%,var(--paper))}
.flavor-sector[aria-pressed="true"]{background:var(--flavor-tone);color:var(--paper)}
.flavor-sector:focus-visible span{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.flavor-sector span{position:absolute;left:var(--sector-x);top:var(--sector-y);transform:translate(-50%,-50%) rotate(var(--sector-turn));white-space:pre-line;text-align:center;font-size:var(--type-body);line-height:1.15;font-weight:400}
.flavor-all{display:block;min-height:44px;margin:4px auto 0;color:var(--muted)}
.flavor-all[aria-pressed="true"]{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.flavor-copy{max-width:360px;min-width:0}
.flavor-copy h3{font-size:var(--type-lead);font-weight:400;margin:4px 0 12px}
.flavor-copy p{color:var(--ink);margin:0 0 8px}
.flavor-copy>.text-button{min-height:44px;color:var(--muted);padding:8px 0}
.flavor-count{display:block;margin-top:12px;min-height:24px}
.flavor-filter [hidden]{display:none!important}
@media(max-width:900px){.flavor-wheel-wrap{width:360px}.flavor-explore{gap:24px}}
@media(max-width:640px){.flavor-explore{flex-direction:column;gap:8px;align-items:center}.flavor-wheel-wrap{width:400px}.flavor-copy{text-align:center}.flavor-copy h3{display:none}.flavor-copy p{margin:0}.flavor-path{gap:8px}.flavor-filter{padding-bottom:16px}.flavor-count{margin-top:8px}}
@media(prefers-reduced-motion:reduce){.flavor-sector{transition:none}}