/* Native same-origin navigation and same-document updates use one transition layer. */
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) { animation: vt-fade-out var(--dur-2, 160ms) var(--ease-exit, ease-out) both; }
  ::view-transition-new(root) { animation: vt-fade-in var(--dur-3, 220ms) var(--ease-emphasized, ease-out) both; }
  .product-detail-visual { view-transition-name: product-visual; }
  .product-detail-summary { view-transition-name: product-summary; }
  .product-story { view-transition-name: product-story; }
  ::view-transition-group(product-visual), ::view-transition-group(product-summary), ::view-transition-group(product-story) {
    animation-duration: var(--dur-3, 220ms);
    animation-timing-function: var(--ease-standard, ease-out);
  }
}
@keyframes vt-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes vt-fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
.public-site{min-height:100dvh;max-width:100%;overflow-wrap:anywhere;background:var(--canvas);color:var(--ink-900)}
.public-wordmark{font-size:1.6rem;font-weight:800;letter-spacing:-.06em;text-decoration:none;color:var(--ink-900)}.public-wordmark span{color:var(--appearance-accent);margin-left:.35em}
.public-site main{max-width:62rem;padding:clamp(1rem,4vw,3rem);margin:auto}.public-document{padding-block:1rem 4rem}.public-document h1{font-size:clamp(1.8rem,calc(5vw * var(--ui-font-scale,1)),3rem);line-height:1.25;text-wrap:balance;margin:.6em 0}.public-document__eyebrow{font-size:.85rem;color:var(--ink-600);letter-spacing:.12em}.public-document__meta{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0 2.5rem}.public-document__meta time{color:var(--ink-600)}.public-document .studio-markdown{line-height:1.85;max-width:100%}.public-images{display:flex;gap:1rem;overflow-x:auto;margin-block:1rem}.public-images img{width:8rem;aspect-ratio:1;object-fit:cover;border-radius:.75rem}.public-site footer{padding:2rem;text-align:center;color:var(--ink-600);border-top:1px solid var(--line)}
.public-hero{min-height:65dvh;display:flex;flex-direction:column;align-items:stretch;justify-content:center;position:relative;padding-block:3rem;isolation:isolate}.public-hero>span{font-size:.75rem;letter-spacing:.16em;color:var(--ink-600)}.public-hero h1{font-size:clamp(3.4rem,calc(14vw * var(--ui-font-scale,1)),8rem);line-height:1.05;letter-spacing:-.07em;margin:.3em 0}.public-hero p{font-size:1.4rem}.public-orbit{position:absolute;right:5%;top:18%;font-size:clamp(7rem,20vw,15rem);color:var(--appearance-accent);opacity:.16;z-index:-1}

.public-wordmark{display:inline-flex;align-items:center;gap:10px}.public-orbit .brand-mark{max-width:40vw;height:auto}.public-document__meta .btn{display:inline-flex;align-items:center;gap:8px}.public-document__meta .btn>svg{width:20px;height:20px}
.public-legal { max-width: 76ch; margin-inline: auto; padding-block: 2rem 4rem; overflow-wrap: anywhere; }
.public-legal h1 { font-size: clamp(1.5rem, 4vw, 2.4rem); line-height: 1.3; }
.public-legal h2 { font-size: 1.2rem; line-height: 1.4; margin-block: 2rem .75rem; }
.public-legal p { line-height: 1.8; }
.public-legal-links { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; }
.public-site > footer { flex-wrap: wrap; gap: 1rem; }

.public-site main.public-commerce-main{max-width:78rem}

.public-hero--shop{min-height:55dvh;align-items:stretch;text-align:center;padding-block:2rem 4rem}.public-hero--shop h1{font-size:clamp(2.5rem,7vw,5rem);text-wrap:balance}.public-hero--shop p{font-size:1.05rem;line-height:1.8;color:var(--ink-600)}.public-search{max-width:100%;width:48rem;margin-inline:auto}.public-search .btn{border-radius:999px;min-height:2.75rem;background:var(--ink-900);color:var(--surface);white-space:normal;padding:.65rem 1.2rem}
/* A field keeps its input space; action alignment comes from the shared semantic group. */
.site-search { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; padding: .6rem; border: 1px solid var(--line-strong, GrayText); border-radius: 1.5rem; background: var(--surface, Canvas); }
.site-search-field { display: flex; align-items: center; flex: 1 1 12rem; min-inline-size: 0; border-radius: inherit; gap: .5rem; }
.site-search-field > svg { flex: none; inline-size: 1.25rem; block-size: 1.25rem; color: var(--appearance-secondary, GrayText); }
.site-search-field > input { box-sizing: border-box; flex: 1; inline-size: 100%; min-inline-size: 0; min-block-size: var(--ui-control-size, 44px); padding: .5rem; margin: 0; border: 0; border-radius: inherit; outline: none; box-shadow: none; background: transparent; color: inherit; font: inherit; }
.site-search-field > input:focus-visible { outline: none; box-shadow: none; }
.site-search:focus-within { border-color: var(--appearance-accent, Highlight); box-shadow: 0 0 0 1px var(--appearance-accent, Highlight); }
.site-search-actions { gap: .65rem; max-inline-size: 100%; }
.site-search-actions > :is(button, a) { max-width: 100%; }

@media (max-width: 48rem) and (orientation: portrait) {
  .site-search { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; gap: .4rem; }
  .site-search:focus-within { box-shadow: none; }
  .site-search-field { flex-basis: 100%; inline-size: 100%; border: 1px solid var(--line-strong, GrayText); border-radius: .8rem; background: var(--surface, Canvas); }
  .site-search-field > svg { display: none; }
  .site-search-field:focus-within { border-color: var(--appearance-accent, Highlight); box-shadow: 0 0 0 1px var(--appearance-accent, Highlight); }
}
