@layer properties,theme,base;@layer components{.story-points{gap:2rem;display:grid}@media (width>=48rem){.story-points{grid-template-columns:repeat(3,minmax(0,1fr))}}.story-points>div{border-top:1px solid var(--htchat-border-strong);padding-top:1.25rem}.story-points h3{font-size:1.125rem}.story-points p{margin-top:.625rem;line-height:1.65}.small-print{gap:2rem;font-size:.875rem;line-height:1.65;display:grid}@media (width>=48rem){.small-print{grid-template-columns:repeat(3,minmax(0,1fr))}}.small-print h2{font-size:.9375rem;font-weight:600}.small-print p{margin-top:.5rem}.small-print a{color:var(--htchat-action-text);text-decoration:underline}.search-trigger{border:1px solid var(--htchat-border-strong);border-radius:var(--htchat-radius-md);background:var(--htchat-surface);width:100%;height:3.75rem;box-shadow:var(--htchat-shadow-md);color:var(--htchat-placeholder);cursor:text;transition:border-color var(--htchat-duration-hover) var(--htchat-ease-standard);align-items:center;gap:.875rem;padding-inline:1.25rem;font-size:1.0625rem;display:flex}.search-trigger>svg{width:1.25rem;height:1.25rem;color:var(--htchat-ink)}.search-trigger:hover{border-color:var(--htchat-action)}.logo-stage{flex-direction:column;display:flex}.logo-stage>.stage{border-radius:var(--htchat-radius-lg);border:1px solid var(--htchat-border-med);place-items:center;min-height:13rem;padding:2.5rem;display:grid}.logo-stage>.stage img{width:100%;max-width:22rem}.logo-stage h3{margin-top:1.25rem;font-size:1.25rem}.logo-stage p{color:var(--htchat-subtle);margin-top:.375rem}.size-ladder{gap:2.25rem;display:grid}.size-ladder li{gap:.75rem;display:grid}.size-ladder .rule{border-inline:1px solid var(--htchat-subtle);height:.75rem;position:relative}.size-ladder .rule:after{content:"";border-top:1px solid var(--htchat-subtle);position:absolute;inset:50% 0 auto}.size-ladder .size-label{color:var(--htchat-subtle);justify-content:space-between;font-size:.8125rem;display:flex}.clear-space{border:1.5px dashed var(--htchat-action);border-radius:var(--htchat-radius-sm);background:var(--htchat-action-subtle);padding:2.5rem;display:inline-grid;position:relative}.clear-space img{background:var(--htchat-surface);width:5rem;height:5rem}.clear-space .gap-label{color:var(--htchat-action-text);white-space:nowrap;font-size:.75rem;font-weight:600;position:absolute;top:.5rem;left:50%;translate:-50%}.rule-list li{border-top:1px solid var(--htchat-border-med);gap:.75rem;padding-block:.75rem;display:flex}.rule-list li svg{width:1.125rem;height:1.125rem;color:var(--htchat-error);flex-shrink:0;margin-top:.1875rem}.swatches{background:var(--htchat-border-med);border:1px solid var(--htchat-border-med);border-radius:var(--htchat-radius-lg);grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;display:grid;overflow:hidden}@media (width>=64rem){.swatches{grid-template-columns:repeat(4,minmax(0,1fr))}}.swatches>li{background:var(--htchat-surface);flex-direction:column;display:flex}.swatches .fill{background:var(--swatch);height:7.5rem}@media (width>=64rem){.swatches .fill{height:9rem}}.swatches .facts{align-content:start;gap:.25rem;padding:1rem 1.125rem 1.25rem;display:grid}.swatches h3{font-size:1rem;font-weight:600}.swatches p{color:var(--htchat-subtle);font-size:.8125rem;line-height:1.45}.copy-hex{border-radius:var(--htchat-radius-sm);font-variant-numeric:tabular-nums;cursor:pointer;justify-self:start;align-items:center;gap:.375rem;min-height:2.5rem;margin-left:-.5rem;padding-inline:.5rem;font-size:.875rem;display:inline-flex}.copy-hex svg{width:.875rem;height:.875rem;color:var(--htchat-subtle)}.copy-hex:hover{background:var(--htchat-canvas)}.kind-chips{flex-wrap:wrap;gap:.5rem;display:flex}.kind-chips li{border:1px solid var(--htchat-border-med);border-radius:var(--htchat-radius-pill);align-items:center;gap:.5rem;padding:.375rem .75rem .375rem .5rem;font-size:.875rem;display:inline-flex}.kind-chips li:before{content:"";border-radius:var(--htchat-radius-pill);background:var(--swatch);width:.75rem;height:.75rem}.specimen{border-top:1px solid var(--htchat-border-strong);gap:1rem 2.5rem;padding-block:2rem;display:grid}@media (width>=64rem){.specimen{grid-template-columns:16rem minmax(0,1fr)}}@media (width>=64rem){.specimen[data-variant=example]{grid-template-columns:12rem minmax(0,1.4fr) minmax(0,1fr);align-items:baseline}}.dir-group{border-top:1px solid var(--htchat-ink);scroll-margin-top:calc(var(--header-h) + 1.5rem);gap:1.25rem;margin-top:3.5rem;padding-top:1.25rem;display:grid}@media (width>=64rem){.dir-group{scroll-margin-top:calc(var(--header-h) + 6rem);grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:2.5rem}.dir-group>header{top:calc(var(--header-h) + 6.5rem);align-self:start;position:sticky}}.dir-group h2{letter-spacing:-.02em;font-size:clamp(1.5rem,1.25rem + .8vw,1.875rem);line-height:1.15}.dir-list{display:grid}@media (width>=48rem){.dir-list{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2.5rem}}.entry{border-bottom:1px solid var(--htchat-border-med)}.entry>a{gap:1rem;height:100%;padding-block:1.5rem;display:grid}.entry .logo-plate{height:7.5rem;padding:1rem 1.5rem}.entry .logo-plate img{max-height:5.5rem}.entry .logo-plate{transition:border-color var(--htchat-duration-surface) var(--htchat-ease-standard)}.entry a:hover .logo-plate{border-color:var(--htchat-border-strong)}.products{gap:1rem;display:grid}@media (width>=40rem){.products{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=80rem){.products{grid-template-columns:repeat(3,minmax(0,1fr))}}.product>a{border:1px solid var(--htchat-border-med);border-radius:var(--htchat-radius-lg);background:var(--htchat-surface);height:100%;transition:border-color var(--htchat-duration-surface) var(--htchat-ease-standard), box-shadow var(--htchat-duration-surface) var(--htchat-ease-standard);flex-direction:column;padding:.75rem .75rem 1.25rem;display:flex}.product>a:hover{border-color:var(--htchat-border-strong);box-shadow:var(--htchat-shadow-md)}.product>a>.logo-plate{border:0;height:7.5rem;padding:1rem 1.5rem}.product>a>.logo-plate img{max-height:5.5rem}.product>a>.logo-plate{background:var(--htchat-canvas)}.product>a>:not(.logo-plate){padding-inline:.5rem}.product-name{color:var(--htchat-ink);text-underline-offset:.2em;margin-top:1rem;font-size:1.0625rem;font-weight:600;line-height:1.3}a:hover>.product-name{text-decoration:underline}@media (width>=40rem){.product-name{font-size:1.125rem}}.product-sum{margin-top:.375rem;font-size:.875rem;line-height:1.55}@media (width>=40rem){.product-sum{font-size:.9375rem}}.product-tags{color:var(--htchat-ink);margin-top:auto;padding-top:.5rem;font-size:.75rem;font-weight:500}@media (width>=40rem){.product-tags{padding-top:1rem;font-size:.8125rem}}}@layer utilities;