.examples-shell{padding-bottom:var(--public-section-space)}.examples-shell>.examples-hero.public-editorial-hero{align-items:center;border-bottom:1px solid var(--public-line);text-align:center}.examples-hero .page-title span{color:var(--public-gold)}.examples-intro{max-width:58ch}.examples-gallery{padding-top:var(--public-section-space-compact)}.examples-gallery-grid{width:100%}.examples-gallery-grid :is(.editorial-gallery-row,.editorial-gallery-stack){display:contents}.example-card{background:var(--public-bg);border:1px solid var(--public-line);border-radius:var(--public-radius-media);color:var(--public-text);cursor:pointer;display:block;min-width:0;overflow:hidden;padding:0;position:relative;text-align:left;width:100%}.example-card-media,.example-image-shell{background:var(--public-surface-1);border:1px solid var(--public-line);border-radius:var(--public-radius-media);display:block;overflow:hidden;position:relative;width:100%}.example-card-media img,.example-image-shell img,.examples-preview-image{display:block;height:auto;transition:transform var(--public-motion-panel) ease;width:100%}.example-card:hover .example-card-media img,.example-card:focus-visible .example-card-media img{transform:scale(1.012)}.example-card:focus-visible{border-radius:var(--public-radius-media);outline:var(--public-focus-outline);outline-offset:var(--public-focus-offset)}.example-card-overlay{align-items:center;background:var(--public-bg);display:flex;gap:16px;justify-content:space-between;min-height:100px;padding:18px;pointer-events:none;position:relative}.example-card-copy{display:grid;gap:7px;min-width:0}.example-card-title{color:var(--public-text);font-size:16px;font-weight:600;line-height:1.3;overflow-wrap:anywhere}.example-card-meta{color:var(--public-text-muted);font-size:12px;font-weight:500}.example-card-open{align-items:center;background:var(--ui-brand-gold);border:0;border-radius:var(--public-radius-control);color:var(--ui-brand-ink);display:flex;flex-shrink:0;height:44px;justify-content:center;width:44px}.examples-image-loading,.examples-image-error,.examples-gallery-state{align-items:center;color:var(--public-text-muted);display:flex;font-size:13px;justify-content:center;min-height:180px;padding:24px;text-align:center}.examples-image-loading{background:linear-gradient(100deg,transparent 20%,color-mix(in srgb,var(--public-text) 6%,transparent) 45%,transparent 70%),var(--public-surface-1);background-size:220% 100%;animation:examples-loading 1.4s linear infinite}.examples-image-error,.examples-gallery-state{border:1px solid var(--public-line);border-radius:var(--public-radius-media)}.examples-gallery-state{flex-direction:column;gap:16px;grid-column:1/-1;min-height:320px}.examples-gallery-retry{align-items:center;background:transparent;border:1px solid var(--public-line-strong);border-radius:var(--public-radius-action);color:var(--public-text);cursor:pointer;display:inline-flex;font-size:13px;font-weight:600;gap:8px;min-height:46px;padding:0 18px}.examples-gallery-retry:focus-visible{outline:var(--public-focus-outline);outline-offset:2px}.examples-lightbox-backdrop{background:color-mix(in srgb,var(--ui-brand-ink) 78%,transparent);display:grid;inset:0;overflow:auto;padding:24px;place-items:center;position:fixed;z-index:700}.examples-lightbox{background:var(--public-bg-deep);border:1px solid var(--public-line-strong);border-radius:var(--public-radius-panel);box-shadow:var(--public-shadow-modal);color:var(--public-text);display:grid;grid-template-rows:auto minmax(0,1fr) auto;max-height:calc(100dvh - 48px);max-width:min(1380px,100vw - 48px);overflow:hidden;position:relative;width:-moz-fit-content;width:fit-content;z-index:710}.examples-lightbox-header{align-items:center;border-bottom:1px solid var(--public-line);display:flex;gap:16px;justify-content:space-between;min-height:64px;min-width:0;padding:10px 14px 10px 22px;width:100%}.examples-lightbox-header>div{display:grid;gap:4px;min-width:0}.examples-lightbox-header h2,.examples-lightbox>footer{overflow-wrap:anywhere}.examples-lightbox>footer{min-width:0;width:100%}.examples-lightbox-header strong{font-size:15px;font-weight:600}.examples-lightbox-header h2{font-size:clamp(16px,2vw,22px);font-weight:600;letter-spacing:-.03em;line-height:1.2;margin:0}.examples-lightbox-header span{color:var(--public-text-muted);font-size:12px}.examples-lightbox-close{align-items:center;background:transparent;border:1px solid var(--public-line-strong);border-radius:var(--public-radius-control);color:var(--public-text);cursor:pointer;display:flex;height:44px;flex-shrink:0;justify-content:center;width:44px}.examples-lightbox-close:hover,.examples-lightbox-close:focus-visible{background:var(--public-surface-2)}.examples-lightbox-close:focus-visible{outline:var(--public-focus-outline);outline-offset:2px}.examples-lightbox-image{align-items:center;background:var(--public-bg-deep);display:flex;justify-content:center;min-height:0;overflow:auto;padding:24px}.examples-lightbox-image .example-image-shell{align-items:center;background:transparent;border:0;display:inline-flex;height:auto;justify-content:center;max-height:calc(100dvh - 276px);max-width:calc(100vw - 96px);width:auto}.examples-lightbox-image picture{display:inline-flex;max-height:inherit;max-width:inherit}.examples-lightbox-image img{height:auto;max-height:calc(100dvh - 276px);max-width:calc(100vw - 96px);-o-object-fit:contain;object-fit:contain;width:auto}@keyframes examples-loading{to{background-position:-120% 0}}@media(min-width:981px){.examples-gallery-grid{-moz-column-count:3;column-count:3;-moz-column-gap:24px;column-gap:24px;display:block}.examples-gallery-grid .example-card{-moz-column-break-inside:avoid;break-inside:avoid;display:inline-block;margin:0 0 24px}}@media(min-width:1360px){.examples-gallery-grid{-moz-column-count:4;column-count:4}}@media(min-width:761px)and (max-width:980px){.examples-gallery-grid{display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}.examples-gallery-grid :is(.editorial-gallery-row,.editorial-gallery-stack){display:contents}}@media(max-width:760px){.examples-gallery-grid{display:grid;gap:20px;grid-template-columns:1fr}.examples-lightbox-backdrop{padding:10px}.examples-lightbox{max-height:calc(100dvh - 20px);max-width:calc(100vw - 20px)}.examples-lightbox-image{padding:14px}.examples-lightbox-image .example-image-shell,.examples-lightbox-image img{max-height:calc(100dvh - 224px);max-width:calc(100vw - 48px)}}@media(prefers-reduced-motion:reduce){.example-card-media img,.example-image-shell img,.example-card-overlay{transition:none}.examples-image-loading{animation:none}}.public-marketing .examples-shell>.examples-hero.public-editorial-hero{align-items:center;display:grid;gap:clamp(28px,5vw,80px);grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);padding-block:clamp(40px,5vw,72px);text-align:left}.public-marketing .examples-hero .page-title{font-size:clamp(48px,5.8vw,96px);letter-spacing:-.055em;line-height:.98;margin:20px 0 0;max-width:14ch}.public-marketing .examples-hero .page-title>span{display:block}.public-marketing .examples-hero .page-title .examples-title-period{background:var(--ui-brand-rose);display:inline-block;height:.15em;margin-left:.04em;overflow:hidden;vertical-align:baseline;width:.15em}.examples-hero-copy{display:grid;gap:24px;justify-items:start}.public-marketing .examples-hero .examples-intro{color:var(--public-text);font-size:18px;line-height:1.55;margin:0}.examples-hero-copy .primary-link,.examples-create .primary-link{align-items:center;display:inline-flex;gap:16px}.examples-gallery-toolbar{display:grid;gap:20px;margin-bottom:28px}.examples-filters{display:flex;flex-wrap:wrap;gap:8px}.examples-filters button{align-items:center;background:var(--public-surface-1);border:1px solid var(--public-line);border-radius:var(--public-radius-control);color:var(--public-text);cursor:pointer;display:inline-flex;font:inherit;font-size:14px;font-weight:500;gap:10px;min-height:44px;padding:10px 16px}.examples-filters button[aria-pressed=true]{background:var(--ui-brand-ink);border-color:var(--ui-brand-ink);color:var(--ui-brand-light)}.examples-filters button:hover{border-color:var(--public-text)}.examples-filters button:focus-visible{outline:var(--public-focus-outline);outline-offset:3px}.examples-filters button span{opacity:.75}.examples-gallery-count{color:var(--public-text-muted);font-size:13px;margin:0}.examples-gallery-grid .example-card-media{aspect-ratio:4/3;border:0;border-radius:0}.examples-gallery-grid .example-image-shell,.examples-gallery-grid .example-image-shell picture,.examples-gallery-grid .example-image-shell img{border:0;border-radius:0;height:100%;width:100%}.examples-gallery-grid .example-image-shell img{-o-object-fit:contain;object-fit:contain}.examples-gallery-grid .examples-image-loading,.examples-gallery-grid .examples-image-error{inset:0;min-height:0;position:absolute}.example-card:hover{border-color:var(--public-text)}.example-card:hover .example-card-open,.example-card:focus-visible .example-card-open{background:var(--ui-brand-ink);color:var(--ui-brand-light)}.examples-create{align-items:center;background:var(--ui-brand-gold);border-radius:var(--public-radius-panel);display:flex;gap:32px;justify-content:space-between;margin-top:var(--public-section-space);padding:clamp(28px,4vw,56px)}.examples-create>div{min-width:0}.examples-create h2{font-size:clamp(32px,3.5vw,52px);font-weight:700;letter-spacing:-.05em;line-height:1.05;margin:16px 0;max-width:18ch}.examples-create p{color:var(--ui-brand-ink)}.examples-create .primary-link{flex-shrink:0}.public-marketing .examples-lightbox>footer{color:var(--public-text-muted);font-size:14px;padding:18px 22px}.public-marketing .examples-lightbox>footer p{font:inherit;margin:0}@media(max-width:980px){.public-marketing .examples-shell>.examples-hero.public-editorial-hero{gap:28px;grid-template-columns:1fr}.public-marketing .examples-hero .page-title{font-size:clamp(44px,8.2vw,76px)}.examples-hero-copy{max-width:54ch}}@media(max-width:760px){.examples-create{align-items:flex-start;flex-direction:column}.examples-create .primary-link{justify-content:space-between;width:100%}}@media(forced-colors:active){.example-card-open{border:1px solid ButtonText}.examples-filters button[aria-pressed=true]{border:2px solid Highlight}}
