@layer tokens,base,glass;@layer components{.tpl-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px;margin:0;padding:0;list-style:none;display:grid}.tpl-card{border-radius:var(--r-xl);padding:var(--s-2);gap:var(--s-2);transition:transform var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out);align-content:start;display:grid;position:relative}.tpl-card:active{transition-duration:var(--dur-1);transform:scale(.98)}.tpl-card:focus-within{outline:2px solid var(--focus);outline-offset:2px}.tpl-card__img{border-radius:calc(var(--r-xl) - 8px);aspect-ratio:584/150;box-shadow:inset 0 0 0 1px rgba(var(--ov), .06);place-items:center;padding:8px;display:grid;overflow:hidden}.tpl-card__img img{object-fit:contain;width:100%;height:100%}.tpl-card__body{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 10px;padding:4px 8px 6px;display:grid}.tpl-card__name{font-size:var(--fs-16);letter-spacing:-.01em;margin:0;font-weight:700;line-height:1.3}.tpl-card__name a{color:var(--text);text-decoration:none}.tpl-card__name a:after{content:"";border-radius:inherit;position:absolute;inset:0}.tpl-card__name a:focus-visible{outline:none}@media (hover:hover) and (pointer:fine){.tpl-card:hover:not(:active){border-color:var(--line-hover);transform:translateY(-2px)}.tpl-card:hover .tpl-card__name a{color:var(--ember-ink)}}.tpl-card__meta{font-size:var(--fs-13);color:var(--text-3);grid-column:1;margin:0}.tpl-card__body>.pro,.tpl-card__body>.tpl-plan{grid-area:1/2/span 2}.tpl-plan{border-radius:var(--r-xs);padding:3px 6px}.tpl-plan--free{color:var(--text-2);box-shadow:inset 0 0 0 1px var(--line-2)}.tpl-index{padding-bottom:var(--sec-y);gap:clamp(36px,5vw,64px);display:grid}.tpl-filters{border-radius:var(--r-xl);gap:12px;padding:16px 18px;display:grid}.tpl-filter{border:0;grid-template-columns:76px minmax(0,1fr);align-items:start;gap:10px;margin:0;padding:0;display:grid}.tpl-filter legend{float:left;font-size:var(--fs-13);color:var(--text-2);padding:9px 0 0;font-weight:600}.tpl-filter .chips{gap:6px}.tpl-filter .chip .pro{padding:2px 5px}.tpl-dot{width:10px;height:10px;box-shadow:inset 0 0 0 1px rgba(var(--ov), .25);border-radius:50%;flex:none}.chips__group{border-left:1px solid var(--line-2);align-items:center;height:34px;margin-left:2px;padding-left:6px;display:inline-flex}.swatch-chip{cursor:pointer;width:34px;height:34px;transition:transform var(--dur-1) var(--ease-out);border-radius:50%;place-items:center;display:grid;position:relative}.swatch-chip .tpl-dot{width:22px;height:22px;transition:box-shadow var(--dur-2) var(--ease-out)}.swatch-chip:has(input:checked) .tpl-dot{box-shadow:inset 0 0 0 1px rgba(var(--ov), .25), 0 0 0 2px var(--bg), 0 0 0 4px var(--ember-line)}.swatch-chip:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.swatch-chip:active{transform:scale(.94)}@media (hover:hover) and (pointer:fine){.swatch-chip:hover .tpl-dot{box-shadow:inset 0 0 0 1px rgba(var(--ov), .25), 0 0 0 2px var(--bg), 0 0 0 4px var(--line-hover)}}@media (pointer:coarse){.swatch-chip{width:var(--hit);height:var(--hit)}.chips__group{height:var(--hit)}}.tpl-reset{visibility:hidden;opacity:0;transition:opacity var(--dur-2) var(--ease-out), visibility 0s linear var(--dur-2)}.tpl-reset.is-on{visibility:visible;opacity:1;transition:opacity var(--dur-2) var(--ease-out), visibility 0s}.tpl-filters__foot{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;padding-top:10px;display:flex}.tpl-count{font-size:var(--fs-13);color:var(--text-2);align-items:baseline;gap:.35em;display:inline-flex}.tpl-count__n{font-family:var(--font-mono);color:var(--text);font-variant-numeric:tabular-nums;font-weight:600;display:inline-flex;position:relative}.tpl-count__n .dg{width:auto;min-width:.652em}.tpl-group{gap:18px;display:grid}.tpl-group__head{gap:8px;display:grid}.tpl-group__head p{color:var(--text-2);max-width:62ch;margin:0}.tpl-group__head .link svg{stroke:currentColor;fill:none;stroke-width:2px;width:14px;height:14px}.tpl-empty{border-radius:var(--r-lg);color:var(--text-2);flex-wrap:wrap;align-items:center;gap:12px;margin:0;padding:16px 18px;display:flex}.tpl-license-note{padding-bottom:var(--sec-y)}.tpl-license-note p{color:var(--text-2);margin:8px 0 0}.tpl-head h1{margin:10px 0 14px;font-size:clamp(2rem,1.3rem + 2.6vw,3.2rem)}.tpl-hero{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(24px,4vw,56px);margin-top:8px;display:grid}.tpl-tags{flex-wrap:wrap;align-items:center;gap:8px;margin:0;display:flex}.tpl-tag{font-size:var(--fs-13);color:var(--text-2);border-radius:var(--r-pill);background:rgba(var(--ov), .06);box-shadow:inset 0 0 0 1px var(--line);padding:4px 10px}.tpl-ctas{margin-top:22px}.tpl-note{font-size:var(--fs-14);color:var(--text-3);max-width:56ch;margin:14px 0 0}.tpl-figure{border-radius:var(--r-2xl);gap:10px;margin:0;padding:10px;display:grid}.tpl-frame{border-radius:calc(var(--r-2xl) - 10px);box-shadow:inset 0 0 0 1px rgba(var(--ov), .06);place-items:center;padding:clamp(14px,3vw,28px) clamp(10px,2vw,20px);display:grid}.tpl-frame img{width:100%;height:auto;max-width:min(100%, var(--w,584px))}.tpl-figure figcaption{font-size:var(--fs-13);color:var(--text-3);padding:0 8px 4px;line-height:1.5}.tpl-figure figcaption .mono{font-size:var(--fs-12);font-variant-numeric:tabular-nums;color:var(--text-2);white-space:nowrap;font-stretch:88%}.tpl-body{grid-template-columns:minmax(0,1fr) minmax(0,380px);align-items:start;gap:clamp(24px,5vw,64px);padding-block:8px clamp(24px,4vw,48px);display:grid}.tpl-body__text h2{margin-top:1.6em}.tpl-body__text .meta-line{margin-top:2em}.tpl-steps li::marker{color:var(--ember-ink);font-family:var(--font-mono);font-weight:600}.tpl-spec{border-radius:var(--r-xl);padding:16px 20px;position:sticky;top:96px}.tpl-spec h2{margin:0 0 6px}.tpl-spec dl{margin:0;display:grid}.tpl-spec dl>div{border-bottom:1px solid var(--line);font-size:var(--fs-14);grid-template-columns:110px minmax(0,1fr);gap:12px;padding:9px 0;display:grid}.tpl-spec dl>div:last-child{border-bottom:0}.tpl-spec dt{color:var(--text-3)}.tpl-spec dd{color:var(--text);overflow-wrap:anywhere;margin:0}.tpl-spec dd a{color:var(--ember-ink)}.tpl-swatches{gap:4px;display:grid}.tpl-swatches>span{align-items:center;gap:8px;display:flex}.tpl-swatches i{width:14px;height:14px;box-shadow:inset 0 0 0 1px rgba(var(--ov), .25);border-radius:4px;flex:none}.tpl-swatches .mono{font-size:var(--fs-12);color:var(--text-3)}.tpl-related{padding-block:8px var(--sec-y);gap:18px;display:grid}.tpl-license{padding-bottom:var(--sec-y)}.tpl-license section h2{margin-top:1.8em}.tpl-license__links{margin-top:2em}.tpl-teaser__foot{margin-top:20px}@media (width<=960px){.tpl-hero,.tpl-body{grid-template-columns:minmax(0,1fr)}.tpl-figure{order:-1}.tpl-spec{position:static}}@media (width<=560px){.tpl-filter{grid-template-columns:minmax(0,1fr);gap:6px}.tpl-filter legend{padding:0}.tpl-spec dl>div{grid-template-columns:96px minmax(0,1fr)}}}@layer utilities;
