
  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

.cv-ann { font-size: 12.5px; font-weight: 450; letter-spacing: 0; }
  .cv-ann__inner { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; }
  .cv-ann__track { display: grid; flex: 1; max-width: 680px; text-align: center; }
  .cv-ann__msg { grid-area: 1 / 1; margin: 0; padding: 8px 0; opacity: 0; visibility: hidden; transition: opacity 0.35s var(--cv-ease); }
  .cv-ann__msg.is-active { opacity: 1; visibility: visible; }
  .cv-ann__msg a { text-underline-offset: 3px; }
  .cv-ann__nav { display: inline-flex; padding: 6px; color: inherit; background: none; border: 0; cursor: pointer; opacity: 0.8; }
  .cv-ann__nav .cv-icon { width: 16px; height: 16px; }


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* partial:header-base */
  .cv-hd { position: relative; z-index: 40; color: var(--text); padding: 0; background: transparent; isolation: isolate; transition: transform 0.35s var(--cv-ease), box-shadow 0.3s; }
  .cv-hd::before { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter: saturate(1.8) blur(18px); -webkit-backdrop-filter: saturate(1.8) blur(18px); }
  .cv-hd--border, .cv-hd.is-scrolled { box-shadow: 0 1px 0 var(--cv-line); }
  .cv-hd.is-sticky { position: sticky; top: 0; }
  .cv-hd.is-hidden { transform: translateY(-100%); }
  .cv-hd__bar { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; min-height: 64px; }
  .cv-hd__logo { display: inline-flex; align-items: center; text-decoration: none; color: var(--text); }
  .cv-hd__logo img { height: auto; max-height: 72px; object-fit: contain; }
  .cv-hd__name { font-family: var(--tf-font-heading_font, inherit); font-size: 21px; font-weight: 600; letter-spacing: -0.04em; }
  .cv-hd__name--sm { font-size: 18px; }
  .cv-hd__nav { min-width: 0; }
  .cv-hd__menu { display: flex; flex-wrap: wrap; gap: 4px 6px; list-style: none; margin: 0; padding: 0; }
  .cv-hd__link { display: inline-flex; align-items: center; gap: 4px; padding: 8px 14px; font-size: 14.5px; font-weight: 450; color: var(--text);
    text-decoration: none; cursor: pointer; list-style: none; border-radius: 999px; transition: background 0.2s; }
  .cv-hd__link::-webkit-details-marker { display: none; }
  .cv-hd__link:hover, .cv-hd__dd[open] > .cv-hd__link { background: var(--cv-soft); }
  .cv-hd__caret { width: 16px; height: 16px; transition: transform 0.2s var(--cv-ease); }
  .cv-hd__dd { position: relative; }
  .cv-hd__dd[open] .cv-hd__caret { transform: rotate(180deg); }
  .cv-hd__panel { position: absolute; top: calc(100% + 10px); inset-inline-start: 0; min-width: 260px; padding: 8px; background: var(--bg);
    border-radius: 18px; box-shadow: 0 0 0 1px var(--cv-line), 0 24px 48px -16px rgb(0 0 0 / 0.22); animation: cv-drop 0.25s var(--cv-ease); }
  @keyframes cv-drop { from { opacity: 0; transform: translateY(-6px); } }
  .cv-hd__sub, .cv-hd__sub3 { list-style: none; margin: 0; padding: 0; }
  .cv-hd__sublink, .cv-hd__sub3 a { display: block; padding: 9px 14px; font-size: 14.5px; color: var(--text); text-decoration: none; border-radius: 10px; }
  .cv-hd__sublink--all { font-weight: 600; }
  .cv-hd__sub3 a { padding-inline-start: 26px; font-size: 14px; color: var(--text-muted); }
  .cv-hd__sublink:hover, .cv-hd__sub3 a:hover { background: var(--cv-soft); }
  .cv-hd__actions { display: flex; align-items: center; justify-content: flex-end; gap: 2px; }
  .cv-hd__icon { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
    color: var(--text); background: none; border: 0; cursor: pointer; text-decoration: none; border-radius: 50%; }
  .cv-hd__icon:hover { background: var(--cv-soft); }
  .cv-hd__icon .cv-icon { width: 22px; height: 22px; }
  .cv-hd__count { position: absolute; top: 5px; inset-inline-end: 3px; min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center;
    font-size: 10.5px; font-weight: 600; line-height: 1; color: var(--btn-text); background: var(--btn); border-radius: 999px; box-shadow: 0 0 0 2px var(--bg); }
  .cv-hd__burger { display: none; }
  .cv-skip { position: fixed; top: 8px; inset-inline-start: 8px; z-index: 1000; padding: 12px 18px; font-size: 14px; font-weight: 500; color: var(--text); background: var(--bg);
    border-radius: 999px; text-decoration: none; transform: translateY(calc(-100% - 24px)); }
  .cv-skip:focus { transform: none; box-shadow: 0 0 0 1px var(--cv-line), 0 12px 32px -12px rgb(0 0 0 / 0.3); }
/* /partial:header-base */
  /* Row one: logo, search field, icons. The field takes the free width, up to a comfortable reading length. */
  .cv-hm__top { grid-template-columns: auto minmax(0, 1fr) auto; column-gap: clamp(16px, 3vw, 48px); }
  .cv-hm__logo { grid-column: 1; grid-row: 1; }
  .cv-hm__search { position: relative; grid-column: 2; grid-row: 1; justify-self: center; width: 100%; max-width: 760px; }
  .cv-hm .cv-hd__actions { grid-column: 3; grid-row: 1; }
  .cv-hm__sform { height: 48px; padding-inline-end: 4px; }
  .cv-hm__sform .cv-hd__sinput { height: 100%; font-size: 15px; }
  .cv-hm__sform input::-webkit-search-cancel-button { display: none; }
  .cv-hm__sgo { display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; color: var(--btn-text); background: var(--btn); border: 0; border-radius: 50%; cursor: pointer;
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease); }
  .cv-hm__sgo:hover { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); }
  .cv-hm__sgo:active { transform: scale(0.94); }
  .cv-hm__sgo .cv-icon { width: 18px; height: 18px; }
  /* Predictive results drop over the page below the field. */
  .cv-hm__drop { position: absolute; top: calc(100% + 8px); inset-inline: 0; z-index: 5; }
  .cv-hm__drop .cv-hd__suggest { margin: 0; padding: 10px; background: var(--bg); border-radius: 20px; box-shadow: 0 0 0 1px var(--cv-line), 0 28px 56px -20px rgb(0 0 0 / 0.28);
    animation: cv-drop 0.25s var(--cv-ease); }
  .cv-hm__search.is-dismissed .cv-hd__suggest { display: none; }
  @media (min-width: 750px) { .cv-hm__drop .cv-hd__slist--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

  /* Row two: the catalogue menu. */
  .cv-hm__row { border-top: 1px solid var(--cv-line); }
  .cv-hm__menu { display: flex; flex-wrap: wrap; gap: 2px 4px; margin: 0; padding: 6px 0; list-style: none; }
  .cv-hm--nav-left .cv-hm__menu { margin-inline-start: -14px; }
  .cv-hm--nav-center .cv-hm__menu { justify-content: center; }
  .cv-hm__dd { position: static; }
  .cv-hm__link { font-size: 14px; font-weight: 500; }
  /* The panel spans the header's full width, flush under the menu row (no gap, so moving the mouse down keeps it open). */
  .cv-hm__panel { position: absolute; top: 100%; inset-inline: 0; z-index: 4; padding-block: clamp(28px, 3vw, 44px) clamp(32px, 3.4vw, 52px); color: var(--text); background: var(--bg);
    border-top: 1px solid var(--cv-line); box-shadow: 0 36px 48px -32px rgb(0 0 0 / 0.22); animation: cv-drop 0.25s var(--cv-ease); max-height: calc(100vh - 160px); overflow-y: auto; overscroll-behavior: contain; }
  .cv-hm__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(28px, 4vw, 64px); align-items: start; }
  .cv-hm__cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 28px clamp(20px, 2.4vw, 40px); align-content: start; }
  .cv-hm__cols:not(.cv-hm__cols--deep) { grid-template-columns: minmax(0, 1fr); }
  .cv-hm__col { display: grid; gap: 12px; align-content: start; min-width: 0; }
  .cv-hm__head { font-size: 14px; font-weight: 600; letter-spacing: -0.01em; color: var(--text); text-decoration: none; }
  a.cv-hm__head:hover { text-decoration: underline; text-underline-offset: 4px; }
  .cv-hm__links { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .cv-hm__links a, .cv-hm__links span { font-size: 14.5px; color: var(--text-muted); text-decoration: none; transition: color 0.2s var(--cv-ease); }
  .cv-hm__links a:hover { color: var(--text); }
  /* Two levels only: the second-level items read as a large list. */
  .cv-hm__flat { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px clamp(20px, 2.4vw, 40px); margin: 0; padding: 0; list-style: none; }
  .cv-hm__flat a, .cv-hm__flat span { display: inline-block; padding-block: 6px; font-family: var(--tf-font-heading_font, inherit); font-size: clamp(20px, 1.8vw, 26px); font-weight: 500;
    letter-spacing: -0.03em; line-height: 1.2; color: var(--text); text-decoration: none; transition: opacity 0.2s var(--cv-ease); }
  .cv-hm__flat:hover a { opacity: 0.45; }
  .cv-hm__flat a:hover, .cv-hm__flat a:focus-visible { opacity: 1; }
  .cv-hm__all { grid-column: 1 / -1; justify-self: start; margin-top: 4px; font-size: 14px; }
  .cv-hm__promos { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 320px); gap: 20px; }
  .cv-hm__promo { position: relative; display: grid; gap: 14px; align-content: start; color: var(--text); text-decoration: none; }
  .cv-hm__pimg { display: block; aspect-ratio: 4 / 3; }
  .cv-hm__pimg:empty { display: none; }
  .cv-hm__pimg img { transition: transform 0.8s var(--cv-ease); }
  .cv-hm__pcell { display: grid; gap: 8px; align-content: start; }
  .cv-hm__promo:has(> .cv-tile-link):hover .cv-hm__pimg img { transform: scale(1.04); }
  .cv-hm__ptext { display: grid; gap: 4px; }
  .cv-hm__ptext .cv-blk-heading--auto { font-family: inherit; font-size: 16px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.3; text-transform: none; }
  .cv-hm__ptext .cv-blk-text--auto { font-size: 14px; line-height: 1.5; color: var(--text-muted); }
  .cv-hm__ptext .cv-blk-buttons { margin-top: 6px; }
  .cv-hm__ptext .cv-blk-buttons--auto .cv-btn { font-size: 14px; }
  .cv-hm__promo:not(:has(.cv-hm__pimg img)) { padding: 22px; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); }
  .cv-hm__pnote { font-size: 12px; color: var(--text-muted); padding: 8px 10px; border: 1px dashed var(--cv-line); border-radius: 10px; }

  @media (min-width: 990px) {
    .cv-hm__top { min-height: 76px; }
  }
  @media (max-width: 989px) {
    /* Phones and tablets: menu button, logo and icons on one row, the search field on its own row; the menu lives in the sheet. */
    .cv-hm__top { grid-template-columns: 1fr auto 1fr; column-gap: 8px; row-gap: 0; min-height: 64px; }
    .cv-hm .cv-hd__burger { display: inline-flex; grid-column: 1; grid-row: 1; justify-self: start; margin-inline-start: -10px; }
    .cv-hm__logo { grid-column: 2; justify-self: center; min-width: 0; }
    .cv-hm__logo img { max-width: 160px; }
    .cv-hm .cv-hd__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.1; padding-block: 0.08em; text-align: center; overflow-wrap: anywhere; }
    .cv-hm .cv-hd__name--long { font-size: 16px; }
    .cv-hm__search { grid-column: 1 / -1; grid-row: 2; max-width: none; padding-bottom: 12px; }
    .cv-hm__sform { height: 46px; }
    .cv-hm__drop { top: calc(100% - 4px); }
    .cv-hm .cv-hd__icon--desk { display: none; }
    .cv-hm__row { display: none; }
  }

/* partial:header-panels */
  .cv-hd__search { padding-block: 8px 18px; }
  .cv-hd__sform { display: flex; align-items: center; gap: 10px; padding-inline-start: 18px; background: var(--cv-soft); border-radius: 999px; }
  .cv-hd__sinput { flex: 1; min-width: 0; height: 48px; font: inherit; font-size: 16px; color: var(--text); background: transparent; border: 0; outline: none; }
  .cv-hd__suggest { display: grid; gap: 14px; margin-top: 10px; max-height: min(70vh, 640px); overflow-y: auto; overscroll-behavior: contain; }
  .cv-hd__suggest:empty { display: none; }
  .cv-hd__suggest.is-loading { opacity: 0.6; transition: opacity 0.2s; }
  .cv-hd__shead { margin: 0 0 6px; padding: 0 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
  .cv-hd__slist { display: grid; gap: 2px; }
  @media (min-width: 750px) { .cv-hd__slist--grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } }
  .cv-hd__sitem { display: flex; align-items: center; gap: 14px; padding: 8px; font-size: 15px; color: var(--text); text-decoration: none; border-radius: 14px; }
  .cv-hd__sitem:hover, .cv-hd__sitem.is-active, .cv-hd__sall:hover, .cv-hd__sall.is-active { background: var(--cv-soft); }
  .cv-hd__sthumb { flex: none; width: 52px; height: 52px; overflow: hidden; background: var(--surface); border-radius: 10px; }
  .cv-hd__sthumb img { width: 100%; height: 100%; object-fit: cover; }
  .cv-hd__stitle { min-width: 0; flex: 1; }
  .cv-hd__stitle mark { color: inherit; background: none; font-weight: 600; }
  .cv-hd__sprice { flex: none; font-size: 14px; color: var(--text-muted); }
  .cv-hd__sall { display: flex; align-items: center; gap: 10px; padding: 10px 8px; font-size: 15px; font-weight: 500; color: var(--text); text-decoration: none; border-radius: 12px; }
  .cv-hd__sall::after { content: ""; width: 18px; height: 18px; margin-inline-start: auto; background: var(--text-muted); -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; }
  [dir="rtl"] .cv-hd__sall::after { transform: scaleX(-1); }
  .cv-hd__snone { margin: 0; padding: 4px 8px; font-size: 14px; color: var(--text-muted); }
  .cv-mnav { position: fixed; inset: 0; z-index: 100; }
  .cv-mnav__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 0.3); backdrop-filter: blur(4px); opacity: 0; transition: opacity 0.3s var(--cv-ease); }
  .cv-mnav__panel { position: absolute; inset-block: 8px; inset-inline-start: 8px; width: min(calc(100vw - 16px), 400px); display: flex; flex-direction: column; border-radius: 22px;
    background: var(--bg); color: var(--text); transform: translateX(calc(-100% - 16px)); transition: transform 0.4s var(--cv-ease); overflow-y: auto; box-shadow: 0 24px 64px -12px rgb(0 0 0 / 0.3); }
  [dir="rtl"] .cv-mnav__panel { transform: translateX(100%); }
  .cv-mnav.is-open .cv-mnav__backdrop { opacity: 1; }
  .cv-mnav.is-open .cv-mnav__panel { transform: none; }
  .cv-mnav__top { display: flex; align-items: center; justify-content: space-between; padding: 14px 12px 6px 22px; }
  .cv-mnav__list { display: grid; padding: 8px 0; }
  .cv-mnav__row { display: flex; align-items: center; justify-content: space-between; padding: 12px 22px; font-size: 22px; font-weight: 500; letter-spacing: -0.03em; color: var(--text);
    text-decoration: none; cursor: pointer; list-style: none; }
  .cv-mnav__row::-webkit-details-marker { display: none; }
  .cv-mnav__group[open] > .cv-mnav__row .cv-icon { transform: rotate(180deg); }
  .cv-mnav__children { display: grid; padding: 0 22px 12px; }
  .cv-mnav__child { padding: 8px 4px; font-size: 16px; color: var(--text-muted); text-decoration: none; }
  .cv-mnav__child--deep { padding-inline-start: 28px; color: var(--text-muted); }
  .cv-mnav__foot { margin-top: auto; display: grid; gap: 4px; padding: 16px 22px 24px; }
  .cv-mnav__util { display: flex; align-items: center; gap: 12px; padding: 10px 0; font-size: 15px; color: var(--text); text-decoration: none; }
  .cv-hd__wish { position: relative; }
  .cv-mnav__badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; margin-inline-start: 6px; font-size: 12px; font-weight: 600; color: var(--btn-text); background: var(--btn); border-radius: 999px; }
  .cv-hd__loc { display: inline-flex; align-items: center; gap: 2px; }
/* partial:loc-picker */
  /* Country and language picker (partials/loc-picker.html). The trigger styles open a list dialog: under the pill (lined up with it, on the
     page grid), centred (flags with names), or a side sheet with search; a bottom sheet on phones, like the quick view and the filters.
     The list sits on a raised surface (the scheme's background lifted towards white, so it reads in dark schemes too) with a hairline and a
     shadow and scrim that deepen as the scheme darkens. Surfaces start 14px in and text 28px in, from the title to the last row. */
  .cv-loc { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
  .cv-loc__form { display: inline-flex; }
  .cv-loc__flag { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 1.15em; line-height: 1; }
  .cv-loc__select { min-height: 40px; max-width: 260px; padding: 0 38px 0 16px; font: inherit; font-size: 13.5px; color: var(--text); background-color: var(--bg);
    border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 14px center; }
  [dir="rtl"] .cv-loc__select { padding: 0 16px 0 38px; background-position: left 14px center; }
  .cv-loc__links { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
  .cv-loc__link { display: inline-flex; align-items: center; gap: 6px; padding: 0; font: inherit; font-size: 13.5px; color: var(--text-muted); background: none; border: 0; cursor: pointer;
    transition: color 0.2s var(--cv-ease); }
  .cv-loc__link:hover { color: var(--text); }
  .cv-loc__link[aria-current="true"] { color: var(--text); font-weight: 600; }
  .cv-loc abbr, .cv-loc-dlg abbr { text-decoration: none; }
  .cv-loc__trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; max-width: 100%; padding: 0 12px 0 14px; font: inherit; font-size: 13.5px; color: var(--text);
    background: var(--bg); border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: background-color 0.2s var(--cv-ease), box-shadow 0.2s var(--cv-ease); }
  .cv-loc__trigger:hover { background: var(--cv-soft); }
  .cv-loc__trigger--pill { min-height: 36px; padding: 0 10px 0 12px; gap: 6px; font-weight: 500; letter-spacing: 0.01em; font-variant-numeric: tabular-nums; }
  .cv-loc__tname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc__tmeta { color: var(--text-muted); white-space: nowrap; }
  .cv-loc__sep { width: 1px; height: 14px; background: var(--cv-line); }
  .cv-loc__chev { width: 14px; height: 14px; color: var(--text-muted); }

  .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-bg: color-mix(in srgb, var(--lift) 7%, var(--bg)); --cv-soft: color-mix(in srgb, var(--text) 7%, var(--cv-loc-bg));
    --cv-loc-edge: color-mix(in srgb, var(--text) 16%, transparent); --cv-loc-shade: rgb(0 0 0 / 0.42); --cv-loc-scrim: rgb(0 0 0 / 0.4); }
  @supports (color: rgb(from red r g b)) {
    .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-shade: rgb(from var(--bg) 0 0 0 / calc(0.66 - (r + g + b) / 2550));
      --cv-loc-scrim: rgb(from var(--bg) 0 0 0 / calc(0.6 - (r + g + b) / 2550)); }
  }
  .cv-loc-dlg { box-sizing: border-box; flex-direction: column; width: min(560px, calc(100vw - 32px)); max-width: none; max-height: min(82vh, 720px); margin: auto; padding: 0;
    overflow: hidden; color: var(--text); background: var(--cv-loc-bg); border: 0; border-radius: 22px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 30px 80px -24px var(--cv-loc-shade); }
  .cv-loc-dlg[open] { display: flex; }
  .cv-loc-dlg::backdrop { background: var(--cv-loc-scrim); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .cv-loc-dlg--sheet { width: min(440px, calc(100vw - 20px)); height: calc(100% - 20px); max-height: none; margin-block: 10px; margin-inline: auto 10px; }
  .cv-loc-dlg--pill { position: fixed; inset: auto; inset-block: var(--cv-loc-y, 72px) var(--cv-loc-b, auto); inset-inline-start: var(--cv-loc-x, 16px);
    width: var(--cv-loc-w, min(340px, calc(100vw - 32px))); max-height: min(440px, calc(100vh - 32px)); margin: 0; border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc-dlg--pill::backdrop { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .cv-loc-dlg__handle { display: none; }
  .cv-loc-dlg__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 18px 10px; padding-inline: 28px 12px; }
  .cv-loc-dlg--pill .cv-loc-dlg__head { padding-block: 12px 4px; }
  .cv-loc-dlg__title { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; }
  .cv-loc-dlg--pill .cv-loc-dlg__title { font-size: 15px; }
  .cv-loc-dlg__close { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; color: var(--text); background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
  .cv-loc-dlg__close:hover { background: var(--cv-soft); }
  .cv-loc-dlg__body { flex: 1; min-height: 0; display: grid; align-content: start; gap: 20px; padding: 4px 14px 18px; overflow-y: auto; overscroll-behavior: contain; }
  .cv-loc-dlg__group { display: grid; gap: 8px; }
  .cv-loc-dlg__sub { margin: 0; padding-inline: 14px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
  .cv-loc-dlg__search { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 10px; margin-bottom: 4px; padding-inline: 14px 8px;
    background: var(--cv-soft); border-radius: var(--cv-field-radius, 14px); box-shadow: 0 -4px 0 var(--cv-loc-bg); }
  .cv-loc-dlg__search.cv-shell:is(:focus, :has(input:focus)) { box-shadow: 0 -4px 0 var(--cv-loc-bg), 0 0 0 1px var(--text); }
  .cv-loc-dlg__search .cv-icon { flex: none; color: var(--text-muted); }
  .cv-loc-dlg__search .cv-input { min-height: 46px; padding-inline: 0; background: transparent; border: 0; }
  .cv-loc-dlg__search .cv-input:hover, .cv-loc-dlg__search .cv-input:focus { background: transparent; }
  .cv-loc-dlg__form { display: grid; }
  .cv-loc-dlg__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__list--modal { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 6px; }
  .cv-loc-dlg--modal .cv-loc-dlg__list--langs { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
  .cv-loc-dlg__list [hidden] { display: none; }
  .cv-loc-dlg__opt { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 14px; font: inherit; font-size: 15px; color: var(--text); text-align: start;
    text-decoration: none; background: transparent; border: 0; border-radius: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 0.15s var(--cv-ease); }
  .cv-loc-dlg__opt:hover { background: var(--cv-soft); }
  .cv-loc-dlg__opt[aria-current="true"] { font-weight: 600; background: var(--cv-soft); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt { min-height: 52px; box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt[aria-current="true"] { background: transparent; box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-loc-dlg__opt .cv-loc__flag { font-size: 20px; }
  /* A name in another script runs in its own direction (<bdi>) but lines up with the others. */
  .cv-loc-dlg__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc-dlg__meta { flex: none; font-size: 13.5px; font-weight: 400; color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-loc-dlg__tick { width: 18px; height: 18px; flex: none; }
  .cv-loc-dlg__none { margin: 0; padding: 10px 14px; font-size: 14px; color: var(--text-muted); }
  .cv-loc-dlg__langs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__chip { min-height: 40px; padding: 0 14px; font: inherit; font-size: 14px; color: var(--text); background: var(--cv-soft); border: 0; border-radius: 999px; cursor: pointer;
    transition: background-color 0.15s var(--cv-ease), color 0.15s var(--cv-ease); }
  .cv-loc-dlg__chip:hover { background: color-mix(in srgb, var(--text) 13%, var(--cv-loc-bg)); }
  .cv-loc-dlg__chip[aria-current="true"] { color: var(--btn-text); background: var(--btn); }
  /* Keyboard focus: a ring inside the row (the list scrolls, so an outer ring would be cut off). A list opened by a click or a tap moves
     focus to the current choice without a ring (the script marks it is-pointer until a key is pressed). */
  .cv-loc-dlg :is(.cv-loc-dlg__opt, .cv-loc-dlg__chip, .cv-loc-dlg__close):focus-visible, .cv-loc__nojs .cv-loc-dlg__opt:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
  .cv-loc-dlg.is-pointer :focus-visible, html.cv-pointer .cv-loc-dlg :focus-visible { outline: none; }
  html:has(.cv-loc-dlg[open]:not(.cv-loc-dlg--pill)) { overflow: hidden; }
  /* Without script: the trigger is a disclosure, with the choices in a panel under it (in the flow in the phone menu and the footer). */
  .cv-loc__nojs { position: relative; display: inline-block; max-width: 100%; }
  .cv-loc__nojs > summary { list-style: none; }
  .cv-loc__nojs > summary::-webkit-details-marker { display: none; }
  .cv-loc__nojs[open] .cv-loc__chev { transform: rotate(180deg); }
  .cv-loc__nojs-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 30; display: grid; gap: 12px; box-sizing: border-box; width: max-content;
    min-width: 240px; max-width: min(340px, calc(100vw - 32px)); max-height: min(60vh, 440px); overflow-y: auto; overscroll-behavior: contain; padding: 8px 8px 10px;
    color: var(--text); text-align: start; background: var(--cv-loc-bg); border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc__nojs-panel .cv-loc-dlg__sub { padding: 8px 14px 4px; }
  .cv-loc__nojs-form { display: grid; gap: 2px; }
  .cv-mnav__loc .cv-loc__nojs, .cv-ft .cv-loc__nojs { display: block; }
  .cv-mnav__loc .cv-loc__nojs-panel, .cv-ft .cv-loc__nojs-panel { position: static; width: auto; max-width: none; max-height: 50vh; margin-top: 8px; }
  @media (max-width: 749px) {
    .cv-loc-dlg, .cv-loc-dlg--sheet, .cv-loc-dlg--pill { position: fixed; inset: auto 0 0; width: 100%; height: auto; max-height: 88svh; margin: 0;
      border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0;
      box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.06), 0 -20px 60px -20px var(--cv-loc-shade); }
    .cv-loc-dlg--pill::backdrop { background: var(--cv-loc-scrim); }
    .cv-loc-dlg__handle { display: block; flex: none; width: 40px; height: 5px; margin: 9px auto 0; border-radius: 5px; background: color-mix(in srgb, var(--text) 26%, transparent); }
    .cv-loc-dlg__head { padding-top: 8px; }
    .cv-loc-dlg__body { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
    .cv-loc-dlg__close { width: 44px; height: 44px; }
    .cv-loc__link { min-height: 44px; }
    .cv-loc__select { min-height: 44px; }
    .cv-loc__trigger { min-height: 44px; }
    .cv-loc-dlg__chip { min-height: 44px; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-loc-dlg[open] { animation: cv-loc-in 0.32s var(--cv-ease); }
    .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side; }
    [dir="rtl"] .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side-rtl; }
    .cv-loc-dlg[open]::backdrop { animation: cv-loc-fade 0.3s ease-out; }
    @keyframes cv-loc-in { from { opacity: 0; transform: translateY(10px) scale(0.985); } }
    @keyframes cv-loc-side { from { transform: translateX(calc(100% + 12px)); } }
    @keyframes cv-loc-side-rtl { from { transform: translateX(calc(-100% - 12px)); } }
    @keyframes cv-loc-fade { from { opacity: 0; } }
    @media (max-width: 749px) { .cv-loc-dlg[open], .cv-loc-dlg--sheet[open], [dir="rtl"] .cv-loc-dlg--sheet[open] { animation: cv-loc-up 0.42s var(--cv-ease); } @keyframes cv-loc-up { from { transform: translateY(105%); } } }
  }
/* /partial:loc-picker */
  /* The header's pickers sit flat in the bar like its icons: no outline, a soft fill on hover. */
  .cv-hd__loc .cv-loc { flex-wrap: nowrap; gap: 2px; }
  .cv-hd__loc .cv-loc__select { height: 36px; min-height: 0; max-width: 180px; padding: 0 26px 0 10px; color: inherit; background-color: transparent; box-shadow: none;
    background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position: right 13px center, right 9px center; background-size: 4px 4px; background-repeat: no-repeat; }
  [dir="rtl"] .cv-hd__loc .cv-loc__select { padding: 0 10px 0 26px; background-position: left 9px center, left 13px center; }
  .cv-hd__loc .cv-loc__trigger { color: inherit; background: transparent; box-shadow: none; }
  .cv-hd__loc .cv-loc__chev { color: inherit; opacity: 0.6; }
  .cv-hd__loc :is(.cv-loc__select, .cv-loc__trigger):hover { background-color: var(--cv-soft); }
  .cv-hd__loc .cv-loc__link { color: inherit; opacity: 0.72; }
  .cv-hd__loc .cv-loc__link:is(:hover, [aria-current="true"]) { opacity: 1; }
  /* Phones: the bar has no room for the pickers; the menu sheet carries them. */
  .cv-mnav__loc { padding-top: 10px; }
  .cv-mnav__loc .cv-loc__select { max-width: 100%; }
  @media (max-width: 749px) { .cv-hd__loc { display: none; } }
  /* Without script the menu sheet cannot open, so phones keep the bar's picker: its disclosure, with the choices under the header. */
  @media (max-width: 749px) and (scripting: none) {
    .cv-hd__loc { display: inline-flex; }
    .cv-hd__loc .cv-loc__nojs { position: static; }
    .cv-hd__loc .cv-loc__nojs > summary { gap: 6px; padding-inline: 8px; }
    .cv-hd__loc .cv-loc__nojs > summary :is(.cv-loc__flag, .cv-loc__chev) { display: none; }
    .cv-hd__loc .cv-loc__nojs-panel { inset-inline: var(--cv-pad-x, 16px); width: auto; max-width: none; }
  }
  .cv-hd__actions .cv-hd__link { white-space: nowrap; }

  @media (max-width: 749px) {
    .cv-hd__logo { min-height: 44px; padding-block: 6px; }
    .cv-mnav__child, .cv-mnav__util { min-height: 44px; padding-block: 12px; }
  }
/* /partial:header-panels */
/* partial:quick-view */
  /* Quick view (partials/quick-view.html): a side drawer like the cart drawer on wider screens, a bottom sheet like the filter sheet on phones.
     The buy box inside is the product page's, styled by its own stylesheet (in a layer under these rules). */
  .cv-qv { position: fixed; inset: 0; z-index: 125; background: transparent; }
  .cv-qv__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 0.28); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; transition: opacity 0.3s var(--cv-ease); }
  .cv-qv__panel { position: absolute; inset-block: 10px; inset-inline-end: 10px; width: min(calc(100vw - 20px), 520px); display: flex; flex-direction: column; overflow: hidden; outline: none;
    background: var(--bg); color: var(--text); border-radius: 22px; box-shadow: -24px 0 64px -24px rgb(0 0 0 / 0.25);
    transform: translateX(calc(100% + 12px)); transition: transform 0.4s var(--cv-ease); }
  [dir="rtl"] .cv-qv__panel { transform: translateX(calc(-100% - 12px)); }
  .cv-qv.is-open .cv-qv__backdrop { opacity: 1; }
  .cv-qv.is-open .cv-qv__panel { transform: none; }
  .cv-qv__handle { display: none; }
  .cv-qv__close { position: absolute; top: 14px; inset-inline-end: 14px; z-index: 3; display: grid; place-items: center; width: 40px; height: 40px; padding: 0;
    color: var(--text); background: color-mix(in srgb, var(--bg) 82%, transparent); border: 0; border-radius: 50%; cursor: pointer;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 0 0 1px var(--cv-line); }
  .cv-qv__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; transition: opacity 0.2s; }
  /* Only a slow answer dims the details; a quick option change shows no flash. */
  .cv-qv__body.is-busy { pointer-events: none; }
  .cv-qv__body.is-busy .cv-qv__info { opacity: 0.6; transition: opacity 0.15s var(--cv-ease) 0.25s; }
  .cv-qv__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 20px 22px 26px; }
  .cv-qv__info { display: grid; gap: 16px; align-content: start; min-width: 0; }
  .cv-qv__info > .cv-eyebrow { margin: 0 0 -8px; }
  .cv-qv .cv-qv__title { margin: 0; padding-inline-end: 44px; font-size: calc(clamp(22px, 2.1vw, 28px) * var(--cv-heading-scale, 1)); line-height: 1.12; }
  .cv-qv .cv-qv__title a { color: inherit; text-decoration: none; transition: opacity 0.2s var(--cv-ease); }
  .cv-qv .cv-qv__title a:hover { opacity: 0.7; }
  .cv-qv .cv-pdp__price-wrap { margin: -4px 0 0; }
  .cv-qv .cv-pdp__price { font-size: 19px; }
  .cv-qv .cv-pdp__options { gap: 16px; }
  .cv-qv .cv-pdp__add, .cv-qv .cv-pdp__now, .cv-qv .cv-pdp__buy > .cv-btn--block { min-height: 50px; font-size: 15px; }
  .cv-qv .cv-qty__btn, .cv-qv .cv-qty__input { height: 50px; }
  .cv-qv__details { justify-self: start; font-size: 14px; }
  .cv-qv__details .cv-icon { width: 16px; height: 16px; }
  /* Media: the product page's swipe gallery with its dots, one picture at a time. */
  .cv-qv .cv-pdp__gallery { display: grid; gap: 10px; min-width: 0; }
  .cv-qv .cv-pdp__main { display: flex; gap: 8px; margin: 0; padding: 0; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0; }
  .cv-qv .cv-pdp__slide { flex: 0 0 100%; aspect-ratio: auto; border-radius: calc(var(--cv-radius, 16px) * 0.9); overflow: hidden; }
  .cv-qv .cv-pdp__slide > img, .cv-qv .cv-pdp__slide > video { width: 100%; height: auto; max-height: min(62vh, 640px); object-fit: contain; }
  .cv-qv .cv-pdp__thumbs { display: flex; flex-direction: row; justify-content: center; gap: 6px; max-height: none; overflow: visible; order: 0; }
  .cv-qv .cv-pdp__thumb { position: relative; flex: none; width: 6px; height: 6px; padding: 0; border-radius: 999px; background: color-mix(in srgb, var(--text) 22%, transparent); box-shadow: none; }
  .cv-qv .cv-pdp__thumb > img, .cv-qv .cv-pdp__thumb-kind { display: none; }
  .cv-qv .cv-pdp__thumb[aria-current="true"] { width: 20px; background: var(--text); }
  .cv-qv .cv-pdp__thumb::before { content: ""; position: absolute; inset: -10px -4px; }
  /* Waiting for the product */
  .cv-qv__ph { border-radius: calc(var(--cv-radius, 16px) * 0.6); background: var(--cv-soft); }
  .cv-qv__ph--media { aspect-ratio: var(--cv-card-ratio, 4 / 5); max-height: min(62vh, 640px); border-radius: calc(var(--cv-radius, 16px) * 0.9); }
  .cv-qv__ph--title { width: 70%; height: 30px; }
  .cv-qv__ph--line { width: 34%; height: 20px; }
  .cv-qv__ph--opts { width: 86%; height: 88px; }
  .cv-qv__ph--btn { height: 50px; border-radius: var(--cv-btn-radius, 999px); }
  @media (prefers-reduced-motion: no-preference) {
    .cv-qv__wait .cv-qv__ph { animation: cv-qv-pulse 1.2s ease-in-out infinite alternate; }
    @keyframes cv-qv-pulse { to { opacity: 0.45; } }
  }
  /* Wider screens: the picture beside the details */
  @media (min-width: 990px) {
    .cv-qv__panel { width: min(calc(100vw - 20px), 920px); }
    .cv-qv__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px; padding: 24px 26px 28px; align-items: start; }
    .cv-qv__media { position: sticky; top: 0; }
    .cv-qv__info { padding-top: 10px; }
  }
  /* Phones: a bottom sheet */
  @media (max-width: 749px) {
    .cv-qv__panel { inset: auto 0 0; width: auto; max-height: 92svh; border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0;
      box-shadow: 0 -20px 60px -20px rgb(0 0 0 / 0.35); transform: translateY(105%); transition: transform 0.42s var(--cv-ease); }
    [dir="rtl"] .cv-qv__panel { transform: translateY(105%); }
    .cv-qv.is-open .cv-qv__panel { transform: none; }
    .cv-qv__handle { display: block; position: absolute; top: 9px; left: 50%; z-index: 3; width: 40px; height: 5px; margin-left: -20px; border-radius: 5px; background: color-mix(in srgb, var(--text) 22%, transparent); }
    .cv-qv__close { top: 18px; inset-inline-end: 14px; width: 44px; height: 44px; }
    .cv-qv__grid { gap: 18px; padding: 24px 20px calc(22px + env(safe-area-inset-bottom)); }
    .cv-qv .cv-pdp__slide > img, .cv-qv .cv-pdp__slide > video { max-height: 44svh; }
    .cv-qv__ph--media { max-height: 44svh; }
  }
/* /partial:quick-view */


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* partial:card */
  .cv-card { position: relative; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
  .cv-card__media { z-index: 2; aspect-ratio: var(--cv-card-ratio, 4 / 5); }
  .cv-card__img { position: absolute; inset: 0; display: block; }
  .cv-card__img > img { width: 100%; height: 100%; object-fit: var(--cv-card-fit, cover); transition: transform 0.9s var(--cv-ease); }
  .cv-card__img > svg { width: 100%; height: 100%; }
  /* Second image: hidden until a pointer hovers the card; touch screens keep the first. */
  .cv-card__img > .cv-card__img2 { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s var(--cv-ease), transform 0.9s var(--cv-ease); }
  @media (hover: hover) { .cv-card:hover .cv-card__img > .cv-card__img2 { opacity: 1; } }
  .cv-card:hover .cv-card__img > img { transform: scale(1.04); }
  .cv-card__badges { position: absolute; top: 12px; inset-inline-start: 12px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; max-width: calc(100% - 64px); pointer-events: none; }
  .cv-badge--low { gap: 6px; color: var(--text); background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 0 0 1px color-mix(in srgb, var(--text) 8%, transparent); }
  .cv-badge--low::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
  @media (max-width: 749px) { .cv-card__badges { top: 8px; inset-inline-start: 8px; } }
  .cv-card__quick { position: absolute; inset-inline-end: 12px; bottom: 12px; z-index: 3; margin: 0; }
  .cv-card__add.cv-btn { min-height: 44px; height: 44px; max-width: 44px; padding: 0 12px; gap: 0; overflow: hidden; justify-content: flex-start;
    background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); border-radius: 999px;
    box-shadow: 0 4px 16px -4px rgb(0 0 0 / 0.18); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    transition: max-width 0.45s var(--cv-ease), background-color 0.25s, color 0.25s, gap 0.45s var(--cv-ease), transform 0.25s var(--cv-ease); }
  .cv-card__add .cv-icon { width: 20px; height: 20px; stroke-width: 1.8; }
  .cv-card__add-label { font-size: 14px; opacity: 0; transition: opacity 0.2s; }
  .cv-card__add:hover, .cv-card__add:focus-visible, .cv-card__add.is-loading, .cv-card__add.is-done { max-width: 220px; gap: 6px; background: var(--btn); color: var(--btn-text); }
  .cv-card__add:hover .cv-card__add-label, .cv-card__add:focus-visible .cv-card__add-label, .cv-card__add.is-done .cv-card__add-label { opacity: 1; }
  .cv-card__add.is-loading::before { border-color: var(--btn-text); border-right-color: transparent; }
  @media (hover: none) { .cv-card__add:hover { max-width: 44px; gap: 0; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); } .cv-card__add:hover .cv-card__add-label { opacity: 0; } }
  @media (max-width: 749px) { .cv-card__quick { inset-inline-end: 8px; bottom: 8px; } .cv-card__add.cv-btn { min-height: 38px; height: 38px; max-width: 38px; padding: 0 9px; } }
  .cv-card__info { display: grid; gap: 4px; padding-inline: 2px; }
  .cv-card__vendor { margin: 0; font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-muted); }
  .cv-card__title { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.35; letter-spacing: -0.01em; }
  .cv-card__title a { text-decoration: none; }
  .cv-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
  .cv-card__price { margin: 0; font-size: 15px; color: var(--text); }
  .cv-card__extra { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 0; }
  .cv-card__extra:empty { display: none; }
  .cv-card__rating { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-size: 13px; }
  .cv-card__rating svg { width: 13px; height: 12px; fill: currentColor; }
  .cv-card__swatches { display: flex; flex-wrap: wrap; gap: 5px; list-style: none; margin: 4px 0 0; padding: 0; }
  .cv-swatch { width: 14px; height: 14px; border-radius: 50%; background: var(--cv-sw); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 18%, transparent); }
  .cv-card__more { font-size: 12px; line-height: 14px; }
  .cv-card__pick { position: absolute; inset: 8px; z-index: 4; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: 14px; overflow-y: auto;
    background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-radius: calc(var(--cv-radius, 16px) * 0.8);
    box-shadow: 0 8px 24px -8px rgb(0 0 0 / 0.2); animation: cv-pick-in 0.25s var(--cv-ease); }
  @keyframes cv-pick-in { from { opacity: 0; transform: translateY(8px); } }
  .cv-card__pick-x { position: absolute; top: 6px; inset-inline-end: 6px; display: grid; place-items: center; width: 32px; height: 32px; color: var(--text); background: none; border: 0; border-radius: 50%; cursor: pointer; }
  .cv-card__pick-x:hover { background: var(--cv-soft); }
  .cv-card__pick-opt { display: grid; gap: 6px; }
  .cv-card__pick-name { margin: 0; font-size: 12px; font-weight: 500; color: var(--text-muted); }
  .cv-card__pick-vals { display: flex; flex-wrap: wrap; gap: 6px; }
  .cv-card__pick-val { min-width: 36px; min-height: 32px; padding: 0 10px; font: inherit; font-size: 13px; color: var(--text); background: var(--cv-soft); border: 0; border-radius: 999px; cursor: pointer; }
  .cv-card__pick-val[aria-pressed="true"] { color: var(--btn-text); background: var(--btn); }
  .cv-card__pick-val.is-off { color: color-mix(in srgb, var(--text) 40%, transparent); text-decoration: line-through; }
  .cv-card__pick-val--sw { width: 28px; min-width: 0; height: 28px; min-height: 0; padding: 0; background: var(--cv-sw); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 14%, transparent); }
  .cv-card__pick-val--sw[aria-pressed="true"] { background: var(--cv-sw); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 14%, transparent), 0 0 0 2px var(--bg), 0 0 0 3.5px var(--text); }
  .cv-card__pick-form { margin: 0; }
  .cv-card__pick-add { width: 100%; gap: 8px; }
  .cv-card__pick-price:not(:empty)::before { content: "·"; margin-inline-end: 8px; opacity: 0.6; }
  /* Inline option picker: sits above the card's full-size title link so its values stay clickable. */
  .cv-card__opts { position: relative; z-index: 2; display: grid; gap: 6px; margin-top: 4px; }
  .cv-card__opt { display: flex; flex-wrap: wrap; gap: 5px; }
  .cv-card__opt-val { min-width: 32px; min-height: 28px; padding: 0 9px; font-size: 12.5px; background: transparent; box-shadow: inset 0 0 0 1px var(--cv-line); transition: box-shadow 0.2s var(--cv-ease), background-color 0.2s var(--cv-ease), color 0.2s var(--cv-ease); }
  .cv-card__opt-val:hover { box-shadow: inset 0 0 0 1px var(--text); }
  .cv-card__opt-val[aria-pressed="true"] { box-shadow: none; }
  .cv-card__opt-val.cv-card__pick-val--sw { width: 22px; height: 22px; min-width: 0; min-height: 0; background: var(--cv-sw); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 14%, transparent); }
  .cv-card__opt-val.cv-card__pick-val--sw[aria-pressed="true"] { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 14%, transparent), 0 0 0 2px var(--bg), 0 0 0 3.5px var(--text); }
  .cv-card__opt-val.cv-card__pick-val--sw:hover { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 14%, transparent), 0 0 0 2px var(--bg), 0 0 0 3px color-mix(in srgb, var(--text) 40%, transparent); }
  .cv-card__opts.is-missing .cv-card__opt:not(:has([aria-pressed="true"])) .cv-card__opt-val { box-shadow: inset 0 0 0 1px var(--accent); }
  .cv-card__opts-hint { margin: 0; font-size: 12.5px; color: var(--accent); }
  .cv-card--editorial .cv-card__opt { justify-content: center; }
  .cv-card__opts [data-cv-pick-px] { display: none; }
  .cv-card__wishform { position: absolute; inset-block-start: 10px; inset-inline-end: 10px; z-index: 3; margin: 0; }
  .cv-card__wish { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; color: var(--text); background: color-mix(in srgb, var(--bg) 88%, transparent); border: 0; border-radius: 999px; cursor: pointer; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: transform 0.2s var(--cv-ease), color 0.2s var(--cv-ease); }
  .cv-card__wish:hover { transform: scale(1.06); }
  .cv-card__wish .cv-icon { width: 18px; height: 18px; }
  .cv-card__wish[aria-pressed="true"] { color: var(--accent); }
  .cv-card__wish[aria-pressed="true"] .cv-icon path { fill: currentColor; }
  .cv-card__wish.is-loading { opacity: 0.6; }
  @media (max-width: 749px) { .cv-card__wishform { inset-block-start: 6px; inset-inline-end: 6px; } .cv-card__wish { width: 32px; height: 32px; } }
  /* Card styles (theme setting): soft is the default above; tile sets each product on a soft panel; editorial is square, centred and quiet. */
  .cv-card--tile { gap: 0; padding: 8px; background: var(--cv-soft); border-radius: calc(var(--cv-radius, 16px) * 1.15); transition: background-color 0.3s var(--cv-ease); }
  .cv-card--tile:hover { background: color-mix(in srgb, var(--text) 8%, var(--bg)); }
  .cv-card--tile .cv-card__media { border-radius: calc(var(--cv-radius, 16px) * 0.75); background: var(--bg); }
  .cv-card--tile .cv-card__info { padding: 12px 8px 6px; }
  .cv-card--tile .cv-card__title { font-size: 14px; }
  .cv-card--tile .cv-card__price { font-weight: 600; font-size: 14px; }
  .cv-card--editorial { gap: 16px; }
  .cv-card--editorial .cv-card__media { border-radius: 0; }
  .cv-card--editorial .cv-card__info { justify-items: center; text-align: center; gap: 6px; }
  .cv-card--editorial .cv-card__title { font-size: 12.5px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
  .cv-card--editorial .cv-card__price { font-size: 14px; color: var(--text-muted); justify-content: center; }
  .cv-card--editorial .cv-card__extra { justify-content: center; }
  .cv-card--editorial .cv-card__add.cv-btn, .cv-card--editorial .cv-card__wish, .cv-card--editorial .cv-badge { border-radius: 0; }

  @media (max-width: 749px) {
    .cv-card__add.cv-btn { min-height: 44px; height: 44px; max-width: 44px; padding: 0 12px; }
    .cv-card__wish, .cv-card__pick-x { width: 44px; height: 44px; padding: 6px; }
    .cv-card__pick-val { min-width: 44px; min-height: 44px; padding: 6px 10px; }
    .cv-card__opt-val { min-width: 36px; min-height: 36px; padding: 0 10px; }
    .cv-card__opt-val.cv-card__pick-val--sw { width: 30px; height: 30px; }
  }

  @media (max-width: 749px) {
    .cv-card__quick { max-width: calc(100% - 16px); }
    .cv-card__add:focus-visible, .cv-card__add.is-loading, .cv-card__add.is-done { max-width: 220px; gap: 6px; white-space: normal; overflow-wrap: anywhere; }
    .cv-card__add-label { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  }
/* /partial:card */
  .cv-crumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; font-size: 13px; color: var(--text-muted); }
  .cv-crumbs a { color: inherit; text-decoration: none; }
  .cv-crumbs a:hover { color: var(--text); }
  .cv-pl__head { display: grid; gap: 12px; margin-bottom: clamp(24px, 3vw, 40px); }
  .cv-pl__banner { aspect-ratio: 4 / 1; margin-bottom: 12px; }
  @media (max-width: 749px) { .cv-pl__banner { aspect-ratio: 2 / 1; } }
  .cv-pl__desc { max-width: 72ch; }
/* partial:facets */
  /* Listing toolbar */
  .cv-fx-bar { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--cv-line); }
  .cv-fx-bar__filters, .cv-fx-sort__btn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 18px; font: inherit; font-size: 14px; font-weight: 500; color: var(--text);
    background: var(--cv-soft); border: 0; border-radius: var(--cv-btn-radius, 999px); cursor: pointer; list-style: none; transition: background-color 0.2s var(--cv-ease); }
  .cv-fx-bar__filters:hover, .cv-fx-sort__btn:hover { background: color-mix(in srgb, var(--text) 10%, var(--bg)); }
  .cv-fx-bar__filters .cv-icon { width: 18px; height: 18px; }
  .cv-fx-bar__n, .cv-fx-phone__n, .cv-fx__n, .cv-fx__gcount { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; font-size: 11px; font-weight: 600;
    color: var(--btn-text); background: var(--btn); border-radius: 999px; font-variant-numeric: tabular-nums; }
  .cv-fx-bar__count { margin: 0; font-size: 14px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-fx-bar__search { position: relative; flex: 1 1 220px; max-width: 340px; margin-inline-start: auto; }
  .cv-fx-bar__search .cv-icon { position: absolute; inset-inline-start: 14px; top: 50%; width: 17px; height: 17px; transform: translateY(-50%); color: var(--text-muted); pointer-events: none; }
  .cv-fx-bar__search .cv-input { min-height: 42px; padding-inline-start: 40px; font-size: 14px; border-radius: var(--cv-btn-radius, 999px); }
  .cv-fx-sort { position: relative; margin-inline-start: auto; }
  .cv-fx-bar__search + .cv-fx-sort { margin-inline-start: 0; }
  .cv-fx-sort__btn { background: transparent; box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-fx-sort__btn::-webkit-details-marker { display: none; }
  .cv-fx-sort__btn strong { font-weight: 500; }
  .cv-fx-sort__btn .cv-icon { width: 16px; height: 16px; transition: transform 0.25s var(--cv-ease); }
  .cv-fx-sort[open] .cv-fx-sort__btn .cv-icon { transform: rotate(180deg); }
  .cv-fx-sort__list { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 30; min-width: 240px; margin: 0; padding: 6px; list-style: none;
    background: var(--bg); border-radius: calc(var(--cv-radius, 16px) * 0.9); box-shadow: 0 0 0 1px var(--cv-line), 0 24px 48px -16px rgb(0 0 0 / 0.25); animation: cv-fx-pop 0.2s var(--cv-ease); }
  .cv-fx-sort__list a { display: block; padding: 10px 14px; font-size: 14px; color: var(--text); text-decoration: none; border-radius: calc(var(--cv-radius, 16px) * 0.6); }
  .cv-fx-sort__list a:hover { background: var(--cv-soft); }
  .cv-fx-sort__list a[aria-current="true"] { font-weight: 600; background: var(--cv-soft); }
  @keyframes cv-fx-pop { from { opacity: 0; transform: translateY(-6px); } }

  /* Active filter chips */
  .cv-fx-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -4px 0 22px; }
  .cv-fx-chip { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px 0 14px; font-size: 13px; color: var(--text); text-decoration: none;
    background: var(--bg); border-radius: 999px; box-shadow: inset 0 0 0 1px var(--cv-line); transition: box-shadow 0.2s, background-color 0.2s; }
  .cv-fx-chip:hover { box-shadow: inset 0 0 0 1px var(--text); }
  .cv-fx-chip__k { color: var(--text-muted); }
  .cv-fx-chip .cv-icon { width: 15px; height: 15px; }
  .cv-fx-chips__clear { margin-inline-start: 6px; font-size: 13px; }

  /* Panel: shared parts */
  .cv-fx { display: flex; flex-direction: column; min-width: 0; }
  .cv-fx__head, .cv-fx__foot, .cv-fx__end { display: none; }
  .cv-fx__group { border-bottom: 1px solid var(--cv-line); }
  .cv-fx__gname { display: flex; align-items: center; gap: 8px; padding: 16px 0; font-size: 14px; font-weight: 500; cursor: pointer; list-style: none; user-select: none; }
  .cv-fx__gname::-webkit-details-marker { display: none; }
  .cv-fx__gname > span:first-child { flex: 1; }
  .cv-fx__gname::after { content: ""; width: 16px; height: 16px; flex: none; background: currentColor; transition: transform 0.25s var(--cv-ease);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat; }
  .cv-fx__group[open] > .cv-fx__gname::after { transform: rotate(180deg); }
  .cv-fx__pop { padding-bottom: 18px; }
  .cv-fx__values { display: grid; gap: 1px; list-style: none; margin: 0; padding: 0; }
  .cv-fx__values.is-clamped > li:nth-child(n + 7) { display: none; }
  .cv-fx__value { display: flex; align-items: center; gap: 12px; padding: 7px 0; font-size: 14px; color: var(--text); text-decoration: none; }
  .cv-fx__value.is-disabled { color: var(--text-muted); opacity: 0.5; }
  .cv-fx__box { display: grid; place-items: center; width: 20px; height: 20px; flex: none; border-radius: calc(var(--cv-field-radius, 14px) * 0.4);
    box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--text) 30%, transparent); transition: background-color 0.2s, box-shadow 0.2s; }
  .cv-fx__box svg { width: 14px; height: 14px; fill: none; stroke: var(--btn-text); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
  .cv-fx__value:not(.is-disabled):hover .cv-fx__box { box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-fx__value.is-selected .cv-fx__box { background: var(--btn); box-shadow: none; }
  .cv-fx__value.is-selected .cv-fx__box svg { opacity: 1; }
  .cv-fx__vlabel { flex: 1; min-width: 0; }
  .cv-fx__vcount { font-size: 12px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-fx__values--swatch { grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 12px 6px; }
  .cv-fx__values--swatch .cv-fx__value { flex-direction: column; gap: 6px; padding: 4px 0; text-align: center; font-size: 12px; }
  .cv-fx__values--swatch .cv-fx__vcount { display: none; }
  .cv-fx__sw { width: 32px; height: 32px; flex: none; overflow: hidden; border-radius: 50%; background: var(--cv-sw); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 16%, transparent); transition: box-shadow 0.2s; }
  .cv-fx__sw img { width: 100%; height: 100%; object-fit: cover; }
  .cv-fx__value.is-selected .cv-fx__sw { box-shadow: 0 0 0 2px var(--bg), 0 0 0 3.5px var(--text); }
  .cv-fx__values--swatch .cv-fx__value:not(.is-disabled):not(.is-selected):hover .cv-fx__sw { box-shadow: 0 0 0 2px var(--bg), 0 0 0 3.5px color-mix(in srgb, var(--text) 30%, transparent); }
  /* Check list: a box when several values may be chosen, a radio dot when only one; colour values add a small dot */
  .cv-fx__value .cv-fx__dot { transition: box-shadow 0.2s; }
  .cv-fx__value:not(.is-disabled):hover .cv-fx__dot { box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-fx__value.is-selected .cv-fx__dot { box-shadow: inset 0 0 0 6px var(--btn); }
  .cv-fx__sw--dot, .cv-fx__value.is-selected .cv-fx__sw--dot { width: 14px; height: 14px; margin-inline-end: -4px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 16%, transparent); }
  /* Pills */
  .cv-fx__values--pills { display: flex; flex-wrap: wrap; gap: 8px; }
  .cv-fx__values--pills .cv-fx__value { gap: 6px; min-height: 38px; padding: 0 14px; font-size: 13px; border-radius: var(--cv-btn-radius, 999px); box-shadow: inset 0 0 0 1px var(--cv-line);
    transition: background-color 0.2s var(--cv-ease), color 0.2s var(--cv-ease), box-shadow 0.2s var(--cv-ease); }
  .cv-fx__values--pills .cv-fx__vlabel { flex: none; }
  .cv-fx__values--pills .cv-fx__value:not(.is-disabled):hover { box-shadow: inset 0 0 0 1px var(--text); }
  .cv-fx__values--pills .cv-fx__value.is-selected { color: var(--btn-text); background: var(--btn); box-shadow: none; }
  .cv-fx__values--pills .is-selected .cv-fx__vcount { color: inherit; opacity: 0.7; }
  .cv-fx__values--pills .is-disabled { box-shadow: inset 0 0 0 1px var(--cv-line); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--text) 40%, transparent); }
  /* Image tiles; a value without an image shows its name on the tile */
  .cv-fx__values--image { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 14px 10px; padding: 4px 4px 0; }
  .cv-fx__values--image .cv-fx__value { flex-direction: column; align-items: stretch; gap: 7px; padding: 2px 0; font-size: 12px; line-height: 1.3; text-align: center; }
  .cv-fx__tile { display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; background: var(--cv-soft); border-radius: calc(var(--cv-radius, 16px) * 0.6);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 8%, transparent); transition: box-shadow 0.2s var(--cv-ease); }
  .cv-fx__tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s var(--cv-ease); }
  .cv-fx__tile-text { font-family: var(--tf-font-heading_font, inherit); font-size: 24px; line-height: 1; color: var(--text-muted); text-transform: uppercase; }
  .cv-fx__values--image .cv-fx__vlabel { flex: none; }
  .cv-fx__values--image .cv-fx__value:not(.is-disabled):hover .cv-fx__tile img { transform: scale(1.05); }
  .cv-fx__values--image .cv-fx__value:not(.is-disabled):not(.is-selected):hover .cv-fx__tile { box-shadow: inset 0 0 0 1px var(--text); }
  .cv-fx__values--image .is-selected .cv-fx__tile { box-shadow: 0 0 0 2px var(--bg), 0 0 0 3.5px var(--text); }
  .cv-fx__values--image .is-selected .cv-fx__vlabel { font-weight: 500; }
  /* On/off switch (boolean filters) */
  .cv-fx__toggle { display: flex; align-items: center; gap: 12px; padding: 16px 0; font-size: 14px; font-weight: 500; color: var(--text); text-decoration: none; }
  .cv-fx__toggle.is-disabled { color: var(--text-muted); opacity: 0.5; }
  .cv-fx__switch { position: relative; width: 36px; height: 22px; flex: none; background: color-mix(in srgb, var(--text) 22%, transparent); border-radius: 999px; transition: background-color 0.25s var(--cv-ease); }
  .cv-fx__switch::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 16px; height: 16px; background: var(--bg); border-radius: 50%; box-shadow: 0 1px 3px rgb(0 0 0 / 0.25); transition: transform 0.3s var(--cv-ease); }
  .cv-fx__toggle:not(.is-disabled):hover .cv-fx__switch { background: color-mix(in srgb, var(--text) 34%, transparent); }
  .cv-fx__toggle.is-selected .cv-fx__switch { background: var(--btn); }
  .cv-fx__toggle.is-selected .cv-fx__switch::after { transform: translateX(14px); }
  [dir="rtl"] .cv-fx__toggle.is-selected .cv-fx__switch::after { transform: translateX(-14px); }
  .cv-fx__more, .cv-fx__gclear { margin-top: 8px; font-size: 13px; }
  .cv-fx__gclear { color: var(--text-muted); }
  .cv-fx__more + .cv-fx__gclear { margin-inline-start: 14px; }
  .cv-fx__vpage { display: flex; gap: 16px; margin-top: 8px; font-size: 13px; }
  .cv-fx__vsearch { margin-bottom: 10px; }
  .cv-fx__vsearch .cv-input { min-height: 40px; font-size: 14px; }
  .cv-fx__sortlist { display: grid; gap: 1px; list-style: none; margin: 0; padding: 0; }
  .cv-fx__radio { display: flex; align-items: center; gap: 12px; padding: 7px 0; font-size: 14px; color: var(--text); text-decoration: none; }
  .cv-fx__dot { width: 20px; height: 20px; flex: none; border-radius: 50%; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--text) 30%, transparent); }
  .cv-fx__radio.is-selected .cv-fx__dot { box-shadow: inset 0 0 0 6px var(--btn); }
  /* Price */
  .cv-fx__range { display: grid; gap: 14px; }
  /* The track is inset by half a thumb plus its outline, so a thumb at either end stays inside the filter column. */
  .cv-fx__slider { --cv-thumb: 22px; position: relative; height: 28px; margin: 2px calc(var(--cv-thumb) / 2 + 3px) 0; }
  .cv-fx__slider::before, .cv-fx__slider::after { content: ""; position: absolute; top: 12px; height: 4px; border-radius: 4px; }
  .cv-fx__slider::before { inset-inline: 0; background: var(--cv-line); }
  .cv-fx__slider::after { left: var(--lo, 0%); right: calc(100% - var(--hi, 100%)); background: var(--text); }
  .cv-fx__slider input { position: absolute; inset: 0 calc(var(--cv-thumb) / -2); width: calc(100% + var(--cv-thumb)); height: 28px; margin: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; z-index: 1; }
  .cv-fx__slider input::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: var(--bg); box-shadow: 0 0 0 1.5px var(--text), 0 3px 8px rgb(0 0 0 / 0.2); pointer-events: auto; cursor: grab; }
  .cv-fx__slider input::-moz-range-thumb { width: 22px; height: 22px; border: 0; border-radius: 50%; background: var(--bg); box-shadow: 0 0 0 1.5px var(--text), 0 3px 8px rgb(0 0 0 / 0.2); pointer-events: auto; cursor: grab; }
  .cv-fx__slider input::-webkit-slider-runnable-track { background: none; }
  .cv-fx__minmax { display: grid; grid-template-columns: 1fr 12px 1fr; align-items: end; gap: 8px; }
  .cv-fx__field { display: grid; gap: 4px; font-size: 12px; color: var(--text-muted); }
  .cv-fx__field .cv-input { min-height: 42px; padding: 0 14px; font-size: 14px; }
  .cv-fx__dash { height: 1px; margin-bottom: 21px; background: var(--text-muted); }
  .cv-fx__apply { justify-self: start; }
  .cv-fx__rfoot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
  .cv-fx__rfoot .cv-fx__gclear { margin-top: 0; }

  /* Sidebar: a sticky rail from 990px */
  @media (min-width: 990px) {
    .cv-pl__layout--nofx .cv-fx--sidebar { display: none; }
    .cv-pl__layout--sidebar:not(.cv-pl__layout--nofx):has(.cv-fx) { display: grid; grid-template-columns: 264px minmax(0, 1fr); gap: clamp(28px, 3vw, 48px); align-items: start; }
    .cv-fx--sidebar { position: sticky; top: var(--cv-fx-top, 24px); max-height: calc(100vh - var(--cv-fx-top, 24px) - 16px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-inline-end: 6px; }
    .cv-fx--sidebar .cv-fx__group:first-child .cv-fx__gname { padding-top: 0; }
    .cv-fx--sidebar .cv-fx__group--toggle:first-child .cv-fx__toggle { padding-top: 0; }
    .cv-fx--sidebar .cv-fx__group--sort, .cv-pl--sidebar .cv-fx-bar__filters { display: none; }
    /* Horizontal: dropdown pills in the toolbar */
    .cv-pl__layout--horizontal { display: grid; gap: 0; }
    .cv-fx--horizontal { position: relative; z-index: 6; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding-bottom: 20px; margin-bottom: 22px; border-bottom: 1px solid var(--cv-line); }
    .cv-fx--horizontal .cv-fx__body { display: flex; flex: 1; flex-wrap: wrap; gap: 8px; }
    .cv-fx--horizontal .cv-fx__end { display: flex; align-items: center; gap: 14px; }
    .cv-pl--horizontal .cv-fx-bar > :not(.cv-fx-bar__search) { display: none; }
    .cv-pl--horizontal .cv-fx-bar:not(:has(.cv-fx-bar__search)) { display: none; }
    .cv-pl--horizontal .cv-fx-bar { border: 0; padding-bottom: 0; }
    .cv-fx--horizontal .cv-fx__group { position: relative; border: 0; }
    .cv-fx--horizontal .cv-fx__group--sort, .cv-pl--horizontal .cv-fx-bar__filters { display: none; }
    .cv-fx--horizontal .cv-fx__gname { min-height: 42px; padding: 0 14px 0 18px; background: var(--cv-soft); border-radius: var(--cv-btn-radius, 999px); transition: background-color 0.2s, color 0.2s; }
    .cv-fx--horizontal .cv-fx__gname:hover { background: color-mix(in srgb, var(--text) 10%, var(--bg)); }
    .cv-fx--horizontal .cv-fx__group[open] > .cv-fx__gname { color: var(--btn-text); background: var(--btn); }
    .cv-fx--horizontal .cv-fx__group[open] .cv-fx__gcount { color: var(--btn); background: var(--btn-text); }
    .cv-fx--horizontal .cv-fx__toggle { min-height: 42px; padding: 0 14px 0 18px; background: var(--cv-soft); border-radius: var(--cv-btn-radius, 999px); transition: background-color 0.2s; }
    .cv-fx--horizontal .cv-fx__toggle:not(.is-disabled):hover { background: color-mix(in srgb, var(--text) 10%, var(--bg)); }
    .cv-fx--horizontal .cv-fx__pop { position: absolute; inset-inline-start: 0; top: calc(100% + 8px); z-index: 30; width: 320px; max-height: min(440px, 60vh); overflow-y: auto; padding: 16px 18px;
      background: var(--bg); border-radius: calc(var(--cv-radius, 16px) * 1.1); box-shadow: 0 0 0 1px var(--cv-line), 0 28px 56px -18px rgb(0 0 0 / 0.3); animation: cv-fx-pop 0.2s var(--cv-ease); }
    .cv-fx--horizontal .cv-fx__values.is-clamped > li { display: block; }
    .cv-fx--horizontal .cv-fx__more { display: none; }
    .cv-pl--horizontal .cv-fx-bar__search { margin-inline-start: 0; }
  }

  /* Drawer (and every layout from 768px to 989px): an off-canvas panel floating at the edge */
  .cv-fx-backdrop { position: fixed; inset: 0; z-index: 140; background: rgb(0 0 0 / 0.36); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: cv-fx-fade 0.25s; }
  @keyframes cv-fx-fade { from { opacity: 0; } }
  :root.cv-fx-lock { overflow: hidden; }
  @media (min-width: 768px) {
    .cv-fx--drawer, .cv-fx:is(.cv-fx--sidebar, .cv-fx--horizontal) { --cv-fx-w: 420px; }
  }
  @media (min-width: 768px) and (max-width: 989px) {
    .cv-fx--sidebar, .cv-fx--horizontal { position: fixed; inset-block: 10px; inset-inline-start: 10px; z-index: 150; width: min(var(--cv-fx-w), calc(100vw - 20px)); padding: 0 24px;
      background: var(--bg); border-radius: calc(var(--cv-radius, 16px) * 1.4); box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.4); overflow: hidden;
      transform: translateX(calc(-100% - 20px)); visibility: hidden; transition: transform 0.4s var(--cv-ease), visibility 0s 0.4s; }
    .cv-fx--sidebar.is-open, .cv-fx--horizontal.is-open { transform: none; visibility: visible; transition: transform 0.4s var(--cv-ease); }
    .cv-pl__layout--sidebar, .cv-pl__layout--horizontal { display: block; }
  }
  @media (min-width: 768px) {
    .cv-fx--drawer { position: fixed; inset-block: 10px; inset-inline-start: 10px; z-index: 150; width: min(var(--cv-fx-w), calc(100vw - 20px)); padding: 0 24px;
      background: var(--bg); border-radius: calc(var(--cv-radius, 16px) * 1.4); box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.4); overflow: hidden;
      transform: translateX(calc(-100% - 20px)); visibility: hidden; transition: transform 0.4s var(--cv-ease), visibility 0s 0.4s; }
    [dir="rtl"] .cv-fx--drawer { transform: translateX(calc(100% + 20px)); }
    .cv-fx--drawer.is-open { transform: none; visibility: visible; transition: transform 0.4s var(--cv-ease); }
  }
  @media (max-width: 989px) {
    [dir="rtl"] .cv-fx:not(.is-open) { transform: translateX(calc(100% + 20px)); }
  }
  /* Head, scrolling body and sticky footer of a drawer or sheet */
  .cv-fx.is-open .cv-fx__head, .cv-fx--drawer .cv-fx__head { display: flex; }
  .cv-fx.is-open .cv-fx__foot, .cv-fx--drawer .cv-fx__foot { display: flex; }
  .cv-fx__head { position: relative; align-items: center; gap: 10px; flex: none; padding: 22px 0 14px; border-bottom: 1px solid var(--cv-line); }
  .cv-fx__title { flex: 1; display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 500; letter-spacing: -0.02em; }
  .cv-fx__close { display: grid; place-items: center; width: 40px; height: 40px; margin-inline-end: -8px; color: var(--text); background: var(--cv-soft); border: 0; border-radius: 50%; cursor: pointer; }
  .cv-fx__handle { display: none; }
  .cv-fx.is-open .cv-fx__body, .cv-fx--drawer .cv-fx__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; margin-inline: -24px; padding-inline: 24px; }
  .cv-fx__foot { flex: none; gap: 10px; padding: 14px 0 calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--cv-line); background: var(--bg); }
  .cv-fx__foot .cv-btn { flex: 1; min-height: 50px; }
  .cv-fx__clearall { flex: 0 1 auto !important; }
  .cv-fx-phone { display: none; }

  /* Phones: one sticky "Filter & sort" button and a bottom sheet for every layout */
  @media (max-width: 767px) {
    .cv-fx-bar { display: none; }
    .cv-fx-phone { position: sticky; top: var(--cv-fx-top, 10px); z-index: 20; display: flex; align-items: center; gap: 12px; margin: 0 0 16px; transition: top 0.25s var(--cv-ease); }
    .cv-fx-phone__btn { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 20px 0 16px; font: inherit; font-size: 14px; font-weight: 500;
      color: var(--btn-text); background: var(--btn); border: 0; border-radius: var(--cv-btn-radius, 999px); box-shadow: 0 10px 24px -10px rgb(0 0 0 / 0.45); cursor: pointer; }
    .cv-fx-phone__btn .cv-icon { width: 18px; height: 18px; }
    .cv-fx-phone__n { color: var(--btn); background: var(--btn-text); }
    .cv-fx-phone__count { font-size: 13px; color: var(--text-muted);  transition: opacity 0.2s var(--cv-ease), visibility 0.2s; }
    .cv-fx-phone.is-stuck { pointer-events: none; }
    .cv-fx-phone.is-stuck .cv-fx-phone__btn { pointer-events: auto; }
    .cv-fx-phone.is-stuck .cv-fx-phone__count { opacity: 0; visibility: hidden; }
    .cv-fx { position: fixed; inset-inline: 0; bottom: 0; z-index: 150; display: flex; max-height: 88svh; padding: 0 20px; background: var(--bg);
      border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0; box-shadow: 0 -20px 60px -20px rgb(0 0 0 / 0.35);
      transform: translateY(105%); visibility: hidden; transition: transform 0.42s var(--cv-ease), visibility 0s 0.42s; }
    [dir="rtl"] .cv-fx:not(.is-open) { transform: translateY(105%); }
    .cv-fx.is-open { transform: none; visibility: visible; transition: transform 0.42s var(--cv-ease); }
    .cv-fx.is-open .cv-fx__body { margin-inline: -20px; padding-inline: 20px; }
    .cv-fx__head { padding-top: 26px; touch-action: none; }
    .cv-fx__handle { display: block; position: absolute; top: 9px; left: 50%; width: 40px; height: 5px; margin-left: -20px; border-radius: 5px; background: color-mix(in srgb, var(--text) 22%, transparent); }
    .cv-fx--horizontal .cv-fx__body { display: block; }
    .cv-pl__layout { display: block; }
  }

  @media (max-width: 767px) {
    .cv-fx__close { width: 44px; height: 44px; padding: 12px; }
    .cv-fx__value, .cv-fx__radio, .cv-fx__more, .cv-fx__gclear, .cv-fx__vpage a { min-height: 44px; padding-block: 12px; }
    .cv-fx__values--pills .cv-fx__value { padding-block: 0; }
    .cv-fx__values--swatch .cv-fx__value, .cv-fx__values--image .cv-fx__value { min-height: 0; padding-block: 4px; }
    .cv-fx__vsearch .cv-input, .cv-fx__field .cv-input { min-height: 44px; padding-block: 4px; }
    .cv-fx-chip { height: auto; min-height: 44px; padding-block: 6px; }
    .cv-fx-chips__clear { display: inline-flex; align-items: center; min-height: 44px; padding-block: 12px; }
    .cv-fx__more, .cv-fx__gclear { margin-bottom: 0; }
    .cv-fx__vpage a, .cv-fx-chips__clear { margin-block: 0; }
  }

  @media (max-width: 767px) { .cv-fx__gclear { min-width: 44px; padding-inline: 8px; } }

  @media (max-width: 767px) {
    .cv-fx__slider { --cv-thumb: 44px; }
    .cv-fx__slider, .cv-fx__slider input { height: 44px; }
    .cv-fx__slider::before, .cv-fx__slider::after { top: 20px; }
    .cv-fx__slider input::-webkit-slider-thumb { width: 44px; height: 44px; }
    .cv-fx__slider input::-moz-range-thumb { width: 44px; height: 44px; }
  }

  @media (prefers-reduced-motion: reduce) { .cv-fx__switch, .cv-fx__switch::after, .cv-fx__tile img { transition: none; } }
/* /partial:facets */
  .cv-pl__results { min-width: 0; }
  .cv-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 40px; font-size: 14px; }
  .cv-pl__empty { display: grid; gap: 16px; justify-items: center; padding: 64px 0; text-align: center; }
/* partial:listing-grid */
  /* Product layouts for listings: grid, editorial (a large lead card every seven), list (rows). */
  .cv-pl__grid--editorial { grid-auto-flow: row dense; }
  @media (min-width: 750px) {
    .cv-pl__grid--editorial { --cv-cols: 3 !important; }
    .cv-pl__grid--editorial > .cv-card:nth-child(7n + 1) { grid-column: span 2; grid-row: span 2; }
    .cv-pl__grid--editorial > .cv-card:nth-child(14n + 8) { grid-column: 2 / span 2; }
    .cv-pl__grid--editorial > .cv-card:nth-child(7n + 1) .cv-card__media { flex: 1; aspect-ratio: auto; min-height: 420px; }
    .cv-pl__grid--editorial > .cv-card:nth-child(7n + 1) .cv-card__title { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); font-family: var(--tf-font-heading_font, inherit); letter-spacing: -0.02em; font-weight: 400; text-transform: none; }
  }
  @media (max-width: 749px) {
    .cv-pl__grid--editorial > .cv-card:nth-child(5n + 1) { grid-column: 1 / -1; }
    .cv-pl__grid--editorial > .cv-card:nth-child(5n + 1) .cv-card__media { aspect-ratio: 4 / 3; }
  }
  /* A last card that would sit alone (or leave a hole) stretches across the gap with its details beside the photo, so the grid always ends on a full row. */
  @media (min-width: 750px) {
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) { grid-column: span 3; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); align-content: center; align-items: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) > * { grid-column: 2 / -1; grid-row: 1; align-self: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) > .cv-card__media { grid-column: 1; align-self: stretch; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) .cv-card__info { justify-items: start; text-align: start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) :is(.cv-card__price, .cv-card__extra) { justify-content: flex-start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 4), :nth-child(7n)) .cv-card__title { font-family: var(--tf-font-heading_font, inherit); font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); font-weight: 400; letter-spacing: -0.02em; text-transform: none; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) { grid-column: span 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); align-content: center; align-items: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) > * { grid-column: 2 / -1; grid-row: 1; align-self: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) > .cv-card__media { grid-column: 1; align-self: stretch; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) .cv-card__info { justify-items: start; text-align: start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) :is(.cv-card__price, .cv-card__extra) { justify-content: flex-start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(7n + 5)) .cv-card__title { font-family: var(--tf-font-heading_font, inherit); font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); font-weight: 400; letter-spacing: -0.02em; text-transform: none; }
  }
  @media (max-width: 749px) {
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) { grid-column: span 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); align-content: center; align-items: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) > * { grid-column: 2 / -1; grid-row: 1; align-self: center; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) > .cv-card__media { grid-column: 1; align-self: stretch; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) .cv-card__info { justify-items: start; text-align: start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) :is(.cv-card__price, .cv-card__extra) { justify-content: flex-start; }
    .cv-pl__grid--editorial > .cv-card:last-child:is(:nth-child(5n + 2), :nth-child(5n + 4)) .cv-card__title { font-family: var(--tf-font-heading_font, inherit); font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); font-weight: 400; letter-spacing: -0.02em; text-transform: none; }
  }
  .cv-pl__grid--list { grid-template-columns: minmax(0, 1fr) !important; gap: 0; }
  .cv-pl__grid--list > .cv-card { display: grid; grid-template-columns: clamp(96px, 16vw, 200px) minmax(0, 1fr); align-items: center; gap: clamp(16px, 2.6vw, 36px);
    padding-block: clamp(14px, 1.6vw, 22px); border-bottom: 1px solid var(--cv-line); }
  .cv-pl__grid--list > .cv-card:first-child { border-top: 1px solid var(--cv-line); }
  .cv-pl__grid--list .cv-card__info { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 24px; }
  .cv-pl__grid--list .cv-card__vendor, .cv-pl__grid--list .cv-card__title, .cv-pl__grid--list .cv-card__extra { grid-column: 1; }
  .cv-pl__grid--list .cv-card__price { grid-column: 2; grid-row: 1 / span 3; font-size: clamp(15px, 1.4vw, 18px); }
  .cv-pl__grid--list .cv-card__title { font-size: clamp(16px, 1.6vw, 22px); letter-spacing: -0.02em; }
  .cv-pl__grid--list .cv-card__wishform { inset-block-start: 6px; inset-inline-end: 6px; }
  .cv-pl__grid--list .cv-card__wish { width: 30px; height: 30px; }
/* /partial:listing-grid */


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* partial:cart */
  .cv-lines { display: grid; list-style: none; margin: 0; padding: 0; }
  .cv-line { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--cv-line); }
  .cv-line:first-child { padding-top: 0; }
  .cv-line.is-unavailable .cv-line__media { opacity: 0.5; }
  .cv-line__media { aspect-ratio: 1 / 1; }
  .cv-line__media > .cv-line__custom { object-fit: var(--cv-custom-fit, contain); padding: 4px; }
  .cv-group { padding: 18px 0; border-bottom: 1px solid var(--cv-line); }
  .cv-group:first-child { padding-top: 0; }
  .cv-group__head { display: grid; grid-template-columns: 96px 1fr auto; gap: 16px; align-items: start; }
  .cv-group__lines { margin: 14px 0 0; padding: 4px 12px; background: var(--cv-soft); border-radius: 16px; }
  .cv-line--member { grid-template-columns: 64px 1fr; padding: 12px 0; }
  .cv-line--member:first-child { padding-top: 12px; }
  .cv-line--member:last-child { border-bottom: 0; }
  .cv-line--member .cv-line__media { background: var(--bg); }
  .cv-line--member .cv-line__title { font-size: 14px; font-weight: 500; }
  .cv-line--member .cv-line__qty { background: var(--bg); }
  .cv-line__body { display: grid; gap: 8px; min-width: 0; }
  .cv-line__top { display: flex; justify-content: space-between; gap: 12px; }
  .cv-line__top > .cv-line__info { flex: 1; }
  .cv-line__info { display: grid; gap: 4px; min-width: 0; }
  .cv-line__title { font-size: 15px; color: var(--text); text-decoration: none; }
  a.cv-line__title { transition: opacity 0.2s var(--cv-ease); }
  a.cv-line__title:hover { opacity: 0.65; }
  .cv-line__meta, .cv-line__unit { margin: 0; font-size: 13px; color: var(--text-muted); }
  .cv-line__gift { display: flex; align-items: flex-start; gap: 6px; }
  .cv-line__gift-text { display: grid; min-width: 0; overflow-wrap: anywhere; }
  .cv-line__gift-msg { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; white-space: pre-line; }
  .cv-line__gift .cv-icon { width: 14px; height: 14px; flex: none; margin-top: 2px; }
  .cv-line__total { margin: 0; font-size: 15px; white-space: nowrap; }
  .cv-line__warn { margin: 0; font-size: 13px; color: var(--accent); }
  .cv-line__notify { font-size: 14px; }
  .cv-line__notify > summary { list-style: none; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
  .cv-line__notify[open] > summary { margin-block-end: 10px; }
  .cv-line__notify .cv-notify { padding: 14px; border-radius: 14px; }
  .cv-line__disc { margin: 0; font-size: 13px; color: var(--accent); }
  .cv-line__actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .cv-line__qty { display: inline-flex; align-items: center; background: var(--cv-soft); border-radius: var(--cv-btn-radius, 999px); }
  .cv-line__qty .cv-qty__btn { width: 38px; height: 38px; font-size: 16px; color: var(--text); background: none; border: 0; border-radius: inherit; cursor: pointer; }
  .cv-line__qty .cv-qty__btn:hover:not(:disabled) { background: color-mix(in srgb, var(--text) 7%, transparent); }
  .cv-line__qty .cv-qty__btn:disabled { opacity: 0.3; cursor: not-allowed; }
  .cv-line__q { min-width: 28px; text-align: center; font-size: 14px; }
  .cv-line__qlabel { display: contents; }
  .cv-line__qty .cv-qty__input { width: 40px; height: 38px; padding: 0; font: inherit; font-size: 14px; font-weight: 500; text-align: center; color: var(--text); background: none; border: 0; border-radius: 8px; }
  .cv-line__qty .cv-qty__input:read-only { opacity: 0.5; cursor: progress; }
  /* Remove: a quiet × at the line's top-right, after the line total. The negative margins line the cross up with the total's text. */
  .cv-line__remove { flex: none; margin: -7px -8px 0 -4px; }
  .cv-line__rm { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; color: var(--text-muted); background: none; border: 0; border-radius: 999px;
    cursor: pointer; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease), background-color 0.2s var(--cv-ease); }
  .cv-line__rm:hover { color: var(--text); background: var(--cv-soft); }
  .cv-line__rm .cv-icon { width: 16px; height: 16px; }
  .cv-line__media { border-radius: calc(var(--cv-radius, 16px) * 0.75); }
  .cv-sum { display: grid; gap: 16px; }
  .cv-sum__ship { display: grid; gap: 8px; }
  .cv-sum__ship-text { margin: 0; font-size: 14px; }
  .cv-sum__bar { display: block; height: 6px; background: var(--surface); border-radius: 3px; overflow: hidden; }
  .cv-sum__bar span { display: block; height: 100%; background: var(--text); transition: width 0.4s var(--cv-ease); }
  .cv-sum__gift { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 12px; padding: 12px; border: 1px dashed var(--cv-line); border-radius: 14px; }
  .cv-sum__gift-media { width: 52px; height: 52px; }
  .cv-sum__gift-info p { margin: 0; font-size: 14px; }
  .cv-sum__gift-title { font-weight: 500; }
  .cv-sum__nudge { margin: 0; padding: 12px 14px; font-size: 13px; background: var(--cv-soft); border-radius: 12px; }
  .cv-sum__nudge p { margin: 0; }
  .cv-sum__nudge-save { color: var(--accent); font-weight: 500; }
  .cv-sum__bundle { display: grid; gap: 8px; list-style: none; margin: 10px 0 0; padding: 0; }
  .cv-sum__bitem { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px; }
  .cv-sum__bmedia { width: 44px; height: 44px; border-radius: 8px; }
  .cv-sum__binfo { display: grid; min-width: 0; font-size: 13px; }
  .cv-sum__binfo a { color: var(--text); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-sum__codes { display: grid; gap: 10px; }
  .cv-sum__applied { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  .cv-sum__chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 6px 4px 10px; font-size: 13px; background: var(--cv-soft); border-radius: 999px; }
  .cv-sum__chip .cv-icon { width: 14px; height: 14px; }
  .cv-sum__chip button { display: inline-flex; padding: 0 4px; font-size: 16px; line-height: 1; color: var(--text); background: none; border: 0; cursor: pointer; }
  .cv-sum__chip.is-inactive { opacity: .6; text-decoration: line-through; }
  .cv-sum__chip.is-inactive button { text-decoration: none; }
  .cv-sum__codenote { margin: 4px 0 0; font-size: 12px; }
  .cv-sum__codeform > summary { font-size: 14px; font-weight: 500; cursor: pointer; list-style: none; }
  .cv-sum__codeform > summary::after { content: ""; display: inline-block; width: 12px; height: 12px; margin-inline-start: 6px; vertical-align: -0.15em; background: var(--text-muted); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / contain no-repeat; }
  .cv-sum__codeform[open] > summary::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E"); }
  .cv-sum__codeform > summary::-webkit-details-marker { display: none; }
  .cv-sum__apply { display: flex; gap: 8px; margin-top: 10px; }
  .cv-sum__apply .cv-input { flex: 1; min-width: 0; min-height: 44px; text-transform: uppercase; }
  .cv-sum__cap { margin: 0; font-size: 13px; }
  .cv-offers { border-radius: 16px; background: var(--bg); box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-offers__toggle { display: flex; align-items: center; gap: 10px; padding: 14px 16px; font-size: 14px; font-weight: 500; cursor: pointer; list-style: none; }
  .cv-offers__toggle::-webkit-details-marker { display: none; }
  .cv-offers__count { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; font-size: 12px; color: var(--btn-text); background: var(--btn); border-radius: 999px; }
  .cv-offers__caret { margin-inline-start: auto; transition: transform 0.25s var(--cv-ease); }
  .cv-offers[open] .cv-offers__caret { transform: rotate(180deg); }
  .cv-offers__list { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0 10px 10px; animation: cv-drop 0.25s var(--cv-ease); }
  @keyframes cv-drop { from { opacity: 0; transform: translateY(-6px); } }
  .cv-offer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px 12px 14px; background: var(--cv-soft); border-radius: 12px; }
  .cv-offer__body { display: grid; gap: 2px; min-width: 0; }
  .cv-offer__body p { margin: 0; }
  .cv-offer__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
  .cv-offer__code { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; padding: 2px 8px; border: 1px dashed color-mix(in srgb, var(--text) 35%, transparent); border-radius: 6px; }
  .cv-offer__value { font-size: 14px; font-weight: 500; }
  .cv-offer__name { font-size: 13px; }
  .cv-offer__save { font-size: 13px; color: var(--accent); }
  .cv-offer__unlock { font-size: 13px; font-weight: 500; }
  .cv-offer__note { font-size: 12px; color: var(--text-muted); }
  .cv-offer.is-locked .cv-offer__code { opacity: 0.6; }
  .cv-offer__form { flex: none; }
  .cv-sum__totals { display: grid; gap: 8px; margin: 0; padding-top: 12px; border-top: 1px solid var(--cv-line); }
  .cv-sum__totals div { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; }
  .cv-sum__totals dt, .cv-sum__totals dd { margin: 0; }
  .cv-sum__disc { color: var(--accent); }
  .cv-sum__total { font-size: 18px !important; font-weight: 600; }
  .cv-sum__tax { margin: -8px 0 0; font-size: 13px; }
  .cv-qty__btn { display: inline-flex; align-items: center; justify-content: center; }
  .cv-qty__ico { width: 16px; height: 16px; }
  .cv-sum__chip button .cv-icon { width: 14px; height: 14px; }

  @media (max-width: 749px) {
    a.cv-line__title { min-height: 44px; padding-block: 12px; }
    .cv-line__remove { margin: -13px -14px 0 -10px; }
    .cv-line__rm { width: 44px; height: 44px; }
    .cv-line__qty .cv-qty__btn { width: 44px; height: 44px; padding: 12px; }
    .cv-line__qty .cv-qty__input { width: 44px; height: 44px; font-size: 16px; }
    .cv-sum__codeform > summary { min-height: 44px; padding-block: 12px; }
  }
/* /partial:cart */
/* partial:notify */
  /* Back-in-stock request: a soft panel under the sold-out button; Email / Text message as a segmented choice */
  .cv-notify { display: grid; gap: 12px; padding: 18px; background: var(--cv-soft); border-radius: 18px; }
  .cv-notify__title { margin: 0; font-weight: 500; }
  .cv-notify__note { margin: 0; font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
  .cv-notify__form { display: grid; gap: 10px; }
  .cv-notify__by { min-width: 0; margin: 0; padding: 0; border: 0; }
  .cv-notify__row { display: flex; gap: 8px; flex-wrap: wrap; }
  .cv-notify__row > .cv-input, .cv-notify__phone { flex: 999 1 200px; min-width: 0; }
  .cv-notify__row .cv-input, .cv-notify .cv-phone__cc { background: var(--bg); }
  .cv-notify__row .cv-btn { flex: 1 0 auto; }
  .cv-notify__row .cv-input[hidden], .cv-notify__phone[hidden] { display: none; }
  /* In the one-line row the number is labelled like the email: for screen readers, with the example as its placeholder. */
  .cv-notify__phone .cv-phone { gap: 0; }
  .cv-notify__phone .cv-phone > .cv-label, .cv-notify__phone .cv-phone__hint { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .cv-seg { display: inline-flex; justify-self: start; padding: 3px; background: var(--bg); border-radius: 999px; box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-seg label { position: relative; padding: 7px 14px; font-size: 13px; border-radius: 999px; cursor: pointer; }
  .cv-seg input { position: absolute; opacity: 0; pointer-events: none; }
  .cv-seg label:has(input:checked) { color: var(--btn-text); background: var(--btn); }
  .cv-seg label:has(input:focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
/* /partial:notify */
  .cv-drawer { position: fixed; inset: 0; z-index: 120; background: transparent; }
  .cv-drawer__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / 0.28); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; transition: opacity 0.3s var(--cv-ease); }
  .cv-drawer__panel { position: absolute; inset-block: 0; inset-inline-end: 0; width: min(100vw, var(--cv-drawer-w, 440px)); display: flex; flex-direction: column;
    background: var(--bg); color: var(--text); transform: translateX(100%); transition: transform 0.35s var(--cv-ease); box-shadow: -24px 0 64px -24px rgb(0 0 0 / 0.25); }
  [dir="rtl"] .cv-drawer__panel { transform: translateX(-100%); }
  .cv-drawer--left .cv-drawer__panel { inset-inline-end: auto; inset-inline-start: 0; transform: translateX(-100%); }
  [dir="rtl"] .cv-drawer--left .cv-drawer__panel { transform: translateX(100%); }
  @media (min-width: 750px) { .cv-drawer--floating .cv-drawer__panel { inset-block: 10px; inset-inline-end: 10px; border-radius: 22px; overflow: hidden; }
    .cv-drawer--floating.cv-drawer--left .cv-drawer__panel { inset-inline-end: auto; inset-inline-start: 10px; } }
  .cv-drawer.is-open .cv-drawer__backdrop { opacity: 1; }
  .cv-drawer.is-open .cv-drawer__panel { transform: none; }
  .cv-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border); }
  .cv-drawer__close { display: inline-flex; padding: 8px; margin-inline-end: -8px; color: var(--text); background: none; border: 0; cursor: pointer; }
  .cv-drawer__body { flex: 1; overflow-y: auto; padding: 18px 20px; }
  .cv-drawer__foot { padding: 16px 20px 20px; border-top: 1px solid var(--border); max-height: 60vh; overflow-y: auto; }
  .cv-drawer__view { display: flex; width: fit-content; min-height: 44px; margin: 4px auto -8px; font-size: 14px; }
  .cv-drawer__empty { display: grid; gap: 16px; justify-items: center; align-content: center; flex: 1; padding: 32px; text-align: center; }
  .cv-drawer .cv-line { grid-template-columns: 80px 1fr; }
  .cv-cart-toast { position: fixed; inset-inline-end: 20px; bottom: 20px; z-index: 130; display: flex; gap: 12px; padding: 14px 18px; font-size: 14px;
    color: var(--btn-text); background: var(--btn); border-radius: var(--cv-radius, 0px); box-shadow: 0 12px 32px rgb(0 0 0 / 0.18);
    opacity: 0; transform: translateY(8px); transition: opacity 0.25s var(--cv-ease), transform 0.25s var(--cv-ease); }
  .cv-cart-toast.is-on { opacity: 1; transform: none; }
  .cv-cart-toast.cv-toast--bottom_center, .cv-cart-toast.cv-toast--top_center { inset-inline: 0; margin-inline: auto; width: max-content; max-width: calc(100vw - 32px); }
  .cv-cart-toast { --cv-tbtn: color-mix(in srgb, var(--btn-text) 72%, transparent); --cv-tbtn-hover: var(--btn-text); }

  @media (max-width: 749px) { .cv-drawer__close { min-width: 44px; min-height: 44px; padding: 12px; } }
/* partial:phone */
  /* Phone field: country button and number share one field; the country list opens below it. */
  .cv-phone { position: relative; min-width: 0; container-type: inline-size; }
  /* A narrow field (a cart line) keeps room for the number. */
  @container (max-width: 260px) { .cv-phone__cc { gap: 4px; padding-inline: 10px 6px; } .cv-phone__chev { width: 13px; height: 13px; } .cv-phone__num { padding-inline: 12px; } }
  .cv-phone__row { display: flex; min-width: 0; }
  .cv-phone__cc { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 50px; padding-inline: 14px 10px; font: inherit; font-size: 15px; color: var(--text);
    background: var(--cv-soft); border: 1px solid transparent; border-start-start-radius: var(--cv-field-radius, 14px); border-end-start-radius: var(--cv-field-radius, 14px);
    border-start-end-radius: 0; border-end-end-radius: 0; cursor: pointer; transition: background-color 0.2s, border-color 0.2s; }
  .cv-phone__cc[hidden] { display: none; }
  button.cv-phone__cc:hover { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  .cv-phone__cc--fixed { cursor: default; padding-inline-end: 14px; }
  .cv-phone__cc:focus-visible { outline: none; border-color: var(--text); background: var(--bg); }
  .cv-phone__cc[aria-expanded="true"] { background: var(--bg); border-color: var(--text); }
  .cv-phone__flag { font-size: 20px; line-height: 1; }
  .cv-phone__dial { font-variant-numeric: tabular-nums; }
  .cv-phone__chev { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; opacity: 0.6; transition: transform 0.2s; }
  .cv-phone__cc[aria-expanded="true"] .cv-phone__chev { transform: rotate(180deg); }
  /* The number field is always left-to-right, so its corners follow the page direction physically. */
  .cv-phone.is-enhanced .cv-phone__num { border-top-left-radius: 0; border-bottom-left-radius: 0; box-shadow: inset 1px 0 0 var(--cv-line); }
  [dir="rtl"] .cv-phone.is-enhanced .cv-phone__num { border-radius: var(--cv-field-radius, 14px) 0 0 var(--cv-field-radius, 14px); box-shadow: inset -1px 0 0 var(--cv-line); }
  .cv-phone__num { min-width: 0; flex: 1 1 auto; font-variant-numeric: tabular-nums; }
  [dir="rtl"] .cv-phone__num { text-align: right; }
  .cv-phone__hint { margin: 0; font-size: 13px; }
  .cv-phone__hint[hidden] { display: none; }
  .cv-phone__pop { position: absolute; z-index: 30; inset-inline: 0; inset-block-start: calc(100% + 6px); display: grid; gap: 8px; padding: 10px;
    background: var(--bg); border-radius: var(--cv-field-radius, 14px); box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.28); }
  .cv-phone__pop[hidden], .cv-phone__pop[popover]:not(:popover-open) { display: none; }
  /* With the popover API the list is in the top layer, placed by the script from the field's position. */
  .cv-phone__pop[popover] { position: fixed; inset: auto; margin: 0; border: 0; color: var(--text); overflow: visible; box-sizing: border-box;
    /* Safari gives a top-layer popover the window's height; size it to its content so the search field keeps its height. */
    height: fit-content; max-height: calc(100vh - 16px); align-content: start; }
  .cv-phone__search { min-height: 44px; }
  .cv-phone__search::-webkit-search-cancel-button { filter: grayscale(1); opacity: 0.6; cursor: pointer; }
  .cv-phone__list { max-height: min(300px, 46vh, var(--cv-phone-room, 100vh)); margin: 0; padding: 0; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
  .cv-phone__opt { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; min-height: 44px; padding: 8px 10px; font-size: 14.5px;
    border-radius: 10px; cursor: pointer; }
  .cv-phone__opt:hover, .cv-phone__opt.is-active { background: var(--cv-soft); }
  .cv-phone__opt.is-current .cv-phone__oname { font-weight: 600; }
  .cv-phone__oflag { font-size: 20px; line-height: 1; }
  .cv-phone__oname { min-width: 0; overflow-wrap: anywhere; }
  .cv-phone__odial { color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-phone__none { margin: 0; padding: 4px 10px; font-size: 14px; }
  .cv-phone__none:empty { display: none; }
  @media (prefers-reduced-motion: no-preference) { .cv-phone__pop:not([hidden]) { animation: cv-phone-in 0.18s ease-out; } @keyframes cv-phone-in { from { opacity: 0; transform: translateY(-4px); } } }
/* /partial:phone */
/* Express checkout: the platform's wallet buttons under Check out. */
.cv-drawer .cv-xc { width: 100%; min-width: 0; }
.cv-drawer .cv-xc:has(> [data-tf-express][hidden]) { display: none; }
.cv-drawer .cv-xc-hint { margin: 0; max-width: none; text-align: start; }
.cv-drawer .cv-cart__clear { margin-top: 16px; }
.cv-drawer .cv-cart__clear .cv-tbtn { font-size: 13px; }


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* Cookie banner layouts: a card in a corner (the default), a bar along the bottom, a centred dialog over a dimmed page, or a side
     panel. On phones every layout but the dialog sits along the bottom edge. */
  .cv-consent { position: fixed; z-index: 140; display: flex; pointer-events: none; background: transparent; }
  .cv-consent__box { box-sizing: border-box; display: grid; gap: 12px; width: 100%; padding: 20px; pointer-events: auto; color: var(--text); background: var(--bg);
    border-radius: calc(var(--cv-radius, 16px) * 1.1); box-shadow: 0 0 0 1px var(--cv-line), 0 24px 60px -20px rgb(0 0 0 / 0.35); font-size: 14px; }
  .cv-consent--corner { inset: auto 16px 16px; justify-content: flex-start; }
  .cv-consent--corner.cv-consent--end { justify-content: flex-end; }
  .cv-consent--corner .cv-consent__box { width: min(100%, 440px); max-height: calc(100vh - 32px); overflow-y: auto; }
  .cv-consent--bar { inset: auto 0 0; }
  .cv-consent--bar .cv-consent__box { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px 32px; max-height: 70vh; overflow-y: auto;
    padding: 18px var(--cv-pad-x, 24px) calc(18px + env(safe-area-inset-bottom)); border-radius: 0; box-shadow: 0 -1px 0 var(--cv-line), 0 -16px 40px -24px rgb(0 0 0 / 0.3); }
  .cv-consent--bar .cv-consent__box > * { grid-column: 1; }
  .cv-consent--bar .cv-consent__box > .cv-consent__actions { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
  .cv-consent--bar .cv-consent__box > .cv-consent__form--detailed { grid-column: 1 / -1; }
  .cv-consent--modal { inset: 0; place-items: center; display: grid; padding: 16px; pointer-events: auto; background: rgb(0 0 0 / 0.4);
    backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .cv-consent--modal .cv-consent__box { width: min(100%, 520px); max-height: calc(100vh - 32px); overflow-y: auto; padding: 28px; gap: 14px; }
  .cv-consent--modal .cv-consent__title { font-size: 19px; }
  .cv-consent--side { inset-block: 10px; inset-inline: auto 10px; width: min(400px, calc(100vw - 20px)); }
  .cv-consent--side.cv-consent--start { inset-inline: 10px auto; }
  .cv-consent--side .cv-consent__box { align-content: start; height: 100%; overflow-y: auto; padding: 26px 24px; gap: 14px; }
  html.cv-consent-lock { overflow: hidden; }
  .cv-consent__box p { margin: 0; }
  .cv-consent__title { font-weight: 600; font-size: 15px; letter-spacing: -0.01em; }
  .cv-consent__text { color: var(--text-muted); }
  .cv-consent__links { display: flex; flex-wrap: wrap; gap: 4px 16px; }
  .cv-consent__links a { color: var(--text); text-underline-offset: 3px; }
  .cv-consent__prefs summary .cv-icon { width: 16px; height: 16px; transition: transform 0.2s var(--cv-ease); }
  .cv-consent__prefs[open] summary .cv-icon { transform: rotate(180deg); }
  .cv-consent__form { display: grid; gap: 8px; margin-top: 10px; }
  .cv-consent__form .cv-btn { justify-self: start; }
  .cv-consent__actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .cv-consent__actions form { flex: 1 1 auto; display: grid; }
  .cv-consent--side .cv-consent__actions, .cv-consent--modal .cv-consent__actions { gap: 10px; }
  .cv-consent--side .cv-consent__actions :is(form, .cv-btn), .cv-consent--modal .cv-consent__actions :is(form, .cv-btn) { flex: 1 1 160px; min-height: 46px; }
  .cv-consent__withdraw { margin-top: 4px; }
  .cv-consent__withdraw .cv-tbtn, .cv-consent__only .cv-tbtn { font-size: 13px; }
  .cv-consent__only { justify-self: start; }
  /* Detailed categories: each with what it is for and a switch. */
  .cv-consent__form--detailed { gap: 14px; margin-top: 0; }
  .cv-consent__cats { display: grid; margin: 0; padding: 0; list-style: none; border-block: 1px solid var(--cv-line); }
  .cv-consent__cat { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
  .cv-consent__cat + .cv-consent__cat { border-top: 1px solid var(--cv-line); }
  .cv-consent__cat-text { display: grid; gap: 2px; min-width: 0; cursor: pointer; }
  .cv-consent__cat-name { font-weight: 500; color: var(--text); }
  .cv-consent__cat-desc { font-size: 13px; line-height: 1.45; color: var(--text-muted); }
  .cv-consent__always { flex: none; font-size: 12.5px; font-weight: 500; color: var(--text-muted); }
  .cv-switch { position: relative; flex: none; display: inline-flex; width: 40px; height: 24px; }
  .cv-switch input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
  .cv-switch span { position: absolute; inset: 0; border-radius: 999px; background: color-mix(in srgb, var(--text) 18%, var(--bg)); transition: background-color 0.2s var(--cv-ease); }
  .cv-switch span::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--bg);
    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2); transition: transform 0.2s var(--cv-ease); }
  .cv-switch input:checked + span { background: var(--text); }
  .cv-switch input:checked + span::after { transform: translateX(16px); }
  [dir="rtl"] .cv-switch input:checked + span::after { transform: translateX(-16px); }
  .cv-switch input:focus-visible + span { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  .cv-consent__hint { margin: 0; }
  @media (max-width: 749px) {
    .cv-consent--corner, .cv-consent--side, .cv-consent--side.cv-consent--start { inset: auto 8px 8px; width: auto; }
    .cv-consent--side .cv-consent__box { height: auto; max-height: 80vh; }
    .cv-consent--corner .cv-consent__box { width: 100%; }
    .cv-consent--bar .cv-consent__box { grid-template-columns: minmax(0, 1fr); }
    .cv-consent--bar .cv-consent__box > .cv-consent__actions { grid-column: 1; grid-row: auto; }
    .cv-consent__actions :is(form, .cv-btn) { flex: 1 1 140px; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-consent:not([hidden]) .cv-consent__box { animation: cv-consent-in 0.4s var(--cv-ease); }
    .cv-consent--modal:not([hidden]) { animation: cv-consent-fade 0.3s ease-out; }
    @keyframes cv-consent-in { from { opacity: 0; transform: translateY(12px); } }
    @keyframes cv-consent-fade { from { opacity: 0; } }
  }


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* Country prompt layouts: a centred dialog (the default), a sheet from the bottom, a bar along the top or a card in a corner. The
     dialog and the sheet dim the page and hold focus; the bar and the card leave the page usable. */
  .cv-lp { position: fixed; z-index: 150; display: flex; pointer-events: none; }
  .cv-lp__box { position: relative; box-sizing: border-box; display: grid; gap: 14px; width: 100%; padding: 24px; pointer-events: auto; color: var(--text); background: var(--bg);
    border-radius: calc(var(--cv-radius, 16px) * 1.25); box-shadow: 0 0 0 1px var(--cv-line), 0 30px 80px -24px rgb(0 0 0 / 0.45); }
  .cv-lp--modal, .cv-lp--sheet { inset: 0; padding: 16px; pointer-events: auto; background: rgb(0 0 0 / 0.4); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .cv-lp--modal { place-items: center; display: grid; }
  .cv-lp--modal .cv-lp__box { width: min(100%, 420px); padding: 28px 26px 22px; }
  .cv-lp--sheet { align-items: flex-end; justify-content: center; padding: 0; }
  .cv-lp--sheet .cv-lp__box { width: min(100%, 560px); padding: 26px 24px calc(22px + env(safe-area-inset-bottom)); border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0;
    box-shadow: 0 -20px 60px -20px rgb(0 0 0 / 0.35); }
  .cv-lp--corner { inset: auto 16px 16px; justify-content: flex-end; }
  .cv-lp--corner.cv-lp--start { justify-content: flex-start; }
  .cv-lp--corner .cv-lp__box { width: min(100%, 380px); padding: 20px; gap: 12px; }
  .cv-lp--bar { inset: 0 0 auto; }
  .cv-lp--bar .cv-lp__box { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 20px; padding: 12px calc(var(--cv-pad-x, 24px) + 40px) 12px var(--cv-pad-x, 24px);
    border-radius: 0; box-shadow: 0 1px 0 var(--cv-line), 0 16px 40px -24px rgb(0 0 0 / 0.3); }
  [dir="rtl"] .cv-lp--bar .cv-lp__box { padding: 12px var(--cv-pad-x, 24px) 12px calc(var(--cv-pad-x, 24px) + 40px); }
  html.cv-lp-lock { overflow: hidden; }
  .cv-lp__handle { display: none; }
  .cv-lp--sheet .cv-lp__handle { display: block; justify-self: center; width: 40px; height: 5px; margin: -14px 0 4px; border-radius: 5px; background: color-mix(in srgb, var(--text) 22%, transparent); }
  .cv-lp__x { position: absolute; inset-block-start: 8px; inset-inline-end: 8px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: var(--text-muted);
    background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
  .cv-lp__x:hover { color: var(--text); background: var(--cv-soft); }
  .cv-lp--bar .cv-lp__x { inset-block-start: 50%; margin-top: -20px; }
  .cv-lp__lead { display: flex; align-items: center; gap: 12px; padding-inline-end: 32px; }
  .cv-lp--bar .cv-lp__lead { padding: 0; }
  .cv-lp__flag { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 28px; line-height: 1; }
  .cv-lp--bar .cv-lp__flag, .cv-lp--corner .cv-lp__flag { font-size: 20px; }
  .cv-lp__title { margin: 0; font-family: var(--tf-font-heading_font, inherit); font-size: 19px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; text-wrap: balance; }
  .cv-lp--bar .cv-lp__title, .cv-lp--corner .cv-lp__title { font-family: inherit; font-size: 15px; letter-spacing: -0.01em; }
  .cv-lp__form { display: grid; }
  .cv-lp__go { width: 100%; gap: 10px; }
  .cv-lp--bar .cv-lp__go { width: auto; min-height: 40px; padding-inline: 18px; font-size: 14px; }
  .cv-lp__cur { font-weight: 400; opacity: 0.72; font-variant-numeric: tabular-nums; }
  .cv-lp__pick { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 12px; }
  .cv-lp__or { font-size: 13.5px; color: var(--text-muted); }
  .cv-lp__stay { justify-self: center; font-size: 14px; }
  .cv-lp--bar .cv-lp__stay { font-size: 13.5px; }
  .cv-lp__hint { margin: 0; }
  @media (max-width: 749px) {
    .cv-lp--modal { place-items: end center; padding: 0; }
    .cv-lp--modal .cv-lp__box { width: 100%; padding-bottom: calc(22px + env(safe-area-inset-bottom)); border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0; }
    .cv-lp--corner, .cv-lp--corner.cv-lp--start { inset: auto 8px 8px; justify-content: center; }
    .cv-lp--corner .cv-lp__box { width: 100%; }
    .cv-lp--bar .cv-lp__box { justify-content: flex-start; padding-block: 12px 14px; }
    .cv-lp--bar .cv-lp__x { inset-block-start: 6px; margin-top: 0; }
    .cv-lp__x { width: 44px; height: 44px; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-lp:not([hidden]) .cv-lp__box { animation: cv-lp-in 0.4s var(--cv-ease); }
    .cv-lp--sheet:not([hidden]) .cv-lp__box { animation-name: cv-lp-up; }
    .cv-lp--bar:not([hidden]) .cv-lp__box { animation-name: cv-lp-down; }
    .cv-lp--modal:not([hidden]), .cv-lp--sheet:not([hidden]) { animation: cv-lp-fade 0.3s ease-out; }
    @keyframes cv-lp-in { from { opacity: 0; transform: translateY(12px) scale(0.985); } }
    @keyframes cv-lp-up { from { transform: translateY(100%); } }
    @keyframes cv-lp-down { from { transform: translateY(-100%); } }
    @keyframes cv-lp-fade { from { opacity: 0; } }
  }
/* partial:loc-picker */
  /* Country and language picker (partials/loc-picker.html). The trigger styles open a list dialog: under the pill (lined up with it, on the
     page grid), centred (flags with names), or a side sheet with search; a bottom sheet on phones, like the quick view and the filters.
     The list sits on a raised surface (the scheme's background lifted towards white, so it reads in dark schemes too) with a hairline and a
     shadow and scrim that deepen as the scheme darkens. Surfaces start 14px in and text 28px in, from the title to the last row. */
  .cv-loc { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
  .cv-loc__form { display: inline-flex; }
  .cv-loc__flag { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 1.15em; line-height: 1; }
  .cv-loc__select { min-height: 40px; max-width: 260px; padding: 0 38px 0 16px; font: inherit; font-size: 13.5px; color: var(--text); background-color: var(--bg);
    border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 14px center; }
  [dir="rtl"] .cv-loc__select { padding: 0 16px 0 38px; background-position: left 14px center; }
  .cv-loc__links { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
  .cv-loc__link { display: inline-flex; align-items: center; gap: 6px; padding: 0; font: inherit; font-size: 13.5px; color: var(--text-muted); background: none; border: 0; cursor: pointer;
    transition: color 0.2s var(--cv-ease); }
  .cv-loc__link:hover { color: var(--text); }
  .cv-loc__link[aria-current="true"] { color: var(--text); font-weight: 600; }
  .cv-loc abbr, .cv-loc-dlg abbr { text-decoration: none; }
  .cv-loc__trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; max-width: 100%; padding: 0 12px 0 14px; font: inherit; font-size: 13.5px; color: var(--text);
    background: var(--bg); border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: background-color 0.2s var(--cv-ease), box-shadow 0.2s var(--cv-ease); }
  .cv-loc__trigger:hover { background: var(--cv-soft); }
  .cv-loc__trigger--pill { min-height: 36px; padding: 0 10px 0 12px; gap: 6px; font-weight: 500; letter-spacing: 0.01em; font-variant-numeric: tabular-nums; }
  .cv-loc__tname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc__tmeta { color: var(--text-muted); white-space: nowrap; }
  .cv-loc__sep { width: 1px; height: 14px; background: var(--cv-line); }
  .cv-loc__chev { width: 14px; height: 14px; color: var(--text-muted); }

  .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-bg: color-mix(in srgb, var(--lift) 7%, var(--bg)); --cv-soft: color-mix(in srgb, var(--text) 7%, var(--cv-loc-bg));
    --cv-loc-edge: color-mix(in srgb, var(--text) 16%, transparent); --cv-loc-shade: rgb(0 0 0 / 0.42); --cv-loc-scrim: rgb(0 0 0 / 0.4); }
  @supports (color: rgb(from red r g b)) {
    .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-shade: rgb(from var(--bg) 0 0 0 / calc(0.66 - (r + g + b) / 2550));
      --cv-loc-scrim: rgb(from var(--bg) 0 0 0 / calc(0.6 - (r + g + b) / 2550)); }
  }
  .cv-loc-dlg { box-sizing: border-box; flex-direction: column; width: min(560px, calc(100vw - 32px)); max-width: none; max-height: min(82vh, 720px); margin: auto; padding: 0;
    overflow: hidden; color: var(--text); background: var(--cv-loc-bg); border: 0; border-radius: 22px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 30px 80px -24px var(--cv-loc-shade); }
  .cv-loc-dlg[open] { display: flex; }
  .cv-loc-dlg::backdrop { background: var(--cv-loc-scrim); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .cv-loc-dlg--sheet { width: min(440px, calc(100vw - 20px)); height: calc(100% - 20px); max-height: none; margin-block: 10px; margin-inline: auto 10px; }
  .cv-loc-dlg--pill { position: fixed; inset: auto; inset-block: var(--cv-loc-y, 72px) var(--cv-loc-b, auto); inset-inline-start: var(--cv-loc-x, 16px);
    width: var(--cv-loc-w, min(340px, calc(100vw - 32px))); max-height: min(440px, calc(100vh - 32px)); margin: 0; border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc-dlg--pill::backdrop { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .cv-loc-dlg__handle { display: none; }
  .cv-loc-dlg__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 18px 10px; padding-inline: 28px 12px; }
  .cv-loc-dlg--pill .cv-loc-dlg__head { padding-block: 12px 4px; }
  .cv-loc-dlg__title { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; }
  .cv-loc-dlg--pill .cv-loc-dlg__title { font-size: 15px; }
  .cv-loc-dlg__close { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; color: var(--text); background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
  .cv-loc-dlg__close:hover { background: var(--cv-soft); }
  .cv-loc-dlg__body { flex: 1; min-height: 0; display: grid; align-content: start; gap: 20px; padding: 4px 14px 18px; overflow-y: auto; overscroll-behavior: contain; }
  .cv-loc-dlg__group { display: grid; gap: 8px; }
  .cv-loc-dlg__sub { margin: 0; padding-inline: 14px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
  .cv-loc-dlg__search { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 10px; margin-bottom: 4px; padding-inline: 14px 8px;
    background: var(--cv-soft); border-radius: var(--cv-field-radius, 14px); box-shadow: 0 -4px 0 var(--cv-loc-bg); }
  .cv-loc-dlg__search.cv-shell:is(:focus, :has(input:focus)) { box-shadow: 0 -4px 0 var(--cv-loc-bg), 0 0 0 1px var(--text); }
  .cv-loc-dlg__search .cv-icon { flex: none; color: var(--text-muted); }
  .cv-loc-dlg__search .cv-input { min-height: 46px; padding-inline: 0; background: transparent; border: 0; }
  .cv-loc-dlg__search .cv-input:hover, .cv-loc-dlg__search .cv-input:focus { background: transparent; }
  .cv-loc-dlg__form { display: grid; }
  .cv-loc-dlg__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__list--modal { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 6px; }
  .cv-loc-dlg--modal .cv-loc-dlg__list--langs { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
  .cv-loc-dlg__list [hidden] { display: none; }
  .cv-loc-dlg__opt { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 14px; font: inherit; font-size: 15px; color: var(--text); text-align: start;
    text-decoration: none; background: transparent; border: 0; border-radius: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 0.15s var(--cv-ease); }
  .cv-loc-dlg__opt:hover { background: var(--cv-soft); }
  .cv-loc-dlg__opt[aria-current="true"] { font-weight: 600; background: var(--cv-soft); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt { min-height: 52px; box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt[aria-current="true"] { background: transparent; box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-loc-dlg__opt .cv-loc__flag { font-size: 20px; }
  /* A name in another script runs in its own direction (<bdi>) but lines up with the others. */
  .cv-loc-dlg__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc-dlg__meta { flex: none; font-size: 13.5px; font-weight: 400; color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-loc-dlg__tick { width: 18px; height: 18px; flex: none; }
  .cv-loc-dlg__none { margin: 0; padding: 10px 14px; font-size: 14px; color: var(--text-muted); }
  .cv-loc-dlg__langs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__chip { min-height: 40px; padding: 0 14px; font: inherit; font-size: 14px; color: var(--text); background: var(--cv-soft); border: 0; border-radius: 999px; cursor: pointer;
    transition: background-color 0.15s var(--cv-ease), color 0.15s var(--cv-ease); }
  .cv-loc-dlg__chip:hover { background: color-mix(in srgb, var(--text) 13%, var(--cv-loc-bg)); }
  .cv-loc-dlg__chip[aria-current="true"] { color: var(--btn-text); background: var(--btn); }
  /* Keyboard focus: a ring inside the row (the list scrolls, so an outer ring would be cut off). A list opened by a click or a tap moves
     focus to the current choice without a ring (the script marks it is-pointer until a key is pressed). */
  .cv-loc-dlg :is(.cv-loc-dlg__opt, .cv-loc-dlg__chip, .cv-loc-dlg__close):focus-visible, .cv-loc__nojs .cv-loc-dlg__opt:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
  .cv-loc-dlg.is-pointer :focus-visible, html.cv-pointer .cv-loc-dlg :focus-visible { outline: none; }
  html:has(.cv-loc-dlg[open]:not(.cv-loc-dlg--pill)) { overflow: hidden; }
  /* Without script: the trigger is a disclosure, with the choices in a panel under it (in the flow in the phone menu and the footer). */
  .cv-loc__nojs { position: relative; display: inline-block; max-width: 100%; }
  .cv-loc__nojs > summary { list-style: none; }
  .cv-loc__nojs > summary::-webkit-details-marker { display: none; }
  .cv-loc__nojs[open] .cv-loc__chev { transform: rotate(180deg); }
  .cv-loc__nojs-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 30; display: grid; gap: 12px; box-sizing: border-box; width: max-content;
    min-width: 240px; max-width: min(340px, calc(100vw - 32px)); max-height: min(60vh, 440px); overflow-y: auto; overscroll-behavior: contain; padding: 8px 8px 10px;
    color: var(--text); text-align: start; background: var(--cv-loc-bg); border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc__nojs-panel .cv-loc-dlg__sub { padding: 8px 14px 4px; }
  .cv-loc__nojs-form { display: grid; gap: 2px; }
  .cv-mnav__loc .cv-loc__nojs, .cv-ft .cv-loc__nojs { display: block; }
  .cv-mnav__loc .cv-loc__nojs-panel, .cv-ft .cv-loc__nojs-panel { position: static; width: auto; max-width: none; max-height: 50vh; margin-top: 8px; }
  @media (max-width: 749px) {
    .cv-loc-dlg, .cv-loc-dlg--sheet, .cv-loc-dlg--pill { position: fixed; inset: auto 0 0; width: 100%; height: auto; max-height: 88svh; margin: 0;
      border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0;
      box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.06), 0 -20px 60px -20px var(--cv-loc-shade); }
    .cv-loc-dlg--pill::backdrop { background: var(--cv-loc-scrim); }
    .cv-loc-dlg__handle { display: block; flex: none; width: 40px; height: 5px; margin: 9px auto 0; border-radius: 5px; background: color-mix(in srgb, var(--text) 26%, transparent); }
    .cv-loc-dlg__head { padding-top: 8px; }
    .cv-loc-dlg__body { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
    .cv-loc-dlg__close { width: 44px; height: 44px; }
    .cv-loc__link { min-height: 44px; }
    .cv-loc__select { min-height: 44px; }
    .cv-loc__trigger { min-height: 44px; }
    .cv-loc-dlg__chip { min-height: 44px; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-loc-dlg[open] { animation: cv-loc-in 0.32s var(--cv-ease); }
    .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side; }
    [dir="rtl"] .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side-rtl; }
    .cv-loc-dlg[open]::backdrop { animation: cv-loc-fade 0.3s ease-out; }
    @keyframes cv-loc-in { from { opacity: 0; transform: translateY(10px) scale(0.985); } }
    @keyframes cv-loc-side { from { transform: translateX(calc(100% + 12px)); } }
    @keyframes cv-loc-side-rtl { from { transform: translateX(calc(-100% - 12px)); } }
    @keyframes cv-loc-fade { from { opacity: 0; } }
    @media (max-width: 749px) { .cv-loc-dlg[open], .cv-loc-dlg--sheet[open], [dir="rtl"] .cv-loc-dlg--sheet[open] { animation: cv-loc-up 0.42s var(--cv-ease); } @keyframes cv-loc-up { from { transform: translateY(105%); } } }
  }
/* /partial:loc-picker */


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

/* Age gate designs: a card over the page (dimmed, blurred or solid), the merchant's photo filling the screen, a split screen with the
     photo beside the panel, or a minimal card. Cards are a bottom sheet on phones. The platform's come-back-later screen
     ([data-tf-age-gate-declined]) replaces the panel and takes the same look. */
  .cv-agegate { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: 24px; overflow-y: auto; overscroll-behavior: contain;
    color: var(--text); background: rgb(0 0 0 / 0.58); }
  .cv-agegate--blur { background: rgb(0 0 0 / 0.32); backdrop-filter: blur(18px) saturate(0.9); -webkit-backdrop-filter: blur(18px) saturate(0.9); }
  .cv-agegate--solid { background: var(--cv-soft); }
  .cv-agegate__panel, .cv-agegate > [data-tf-age-gate-declined] { position: relative; z-index: 1; box-sizing: border-box; display: grid; justify-items: center; gap: 14px; width: min(100%, 460px); margin: 0;
    padding: 40px 36px 32px; text-align: center; color: var(--text); background: var(--bg); border: 0; border-radius: calc(var(--cv-radius, 16px) * 1.25);
    box-shadow: 0 30px 80px -24px rgb(0 0 0 / 0.45), 0 0 0 1px var(--cv-line); }
  .cv-agegate--solid .cv-agegate__panel, .cv-agegate--solid > [data-tf-age-gate-declined] { box-shadow: 0 0 0 1px var(--cv-line); }
  .cv-agegate__panel[hidden], .cv-agegate > [data-tf-age-gate-declined][hidden] { display: none; }
  .cv-agegate p, .cv-agegate h2 { margin: 0; }
  .cv-agegate__logo { height: auto; max-width: 100%; margin-bottom: 4px; }
  .cv-agegate__shop { font-family: var(--tf-font-heading_font, inherit); font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); }
  .cv-agegate__age { display: grid; place-items: center; width: 76px; height: 76px; margin-block: 4px 2px; font-family: var(--tf-font-heading_font, inherit); font-size: 26px; font-weight: 600;
    letter-spacing: -0.02em; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-agegate__title, .cv-agegate > [data-tf-age-gate-declined] h2 { font-family: var(--tf-font-heading_font, inherit); font-size: calc(clamp(22px, 2.2vw, 28px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; text-wrap: balance; }
  .cv-agegate__body, .cv-agegate > [data-tf-age-gate-declined] p { max-width: 36ch; font-size: 15px; line-height: 1.55; color: var(--text-muted); white-space: pre-line; text-wrap: pretty; }
  .cv-agegate__blocks { display: grid; justify-items: center; gap: 10px; width: 100%; }
  .cv-agegate .cv-blk-text--auto { max-width: 40ch; font-size: 14px; color: var(--text-muted); }
  .cv-agegate .cv-blk-heading--auto { font-size: 17px; letter-spacing: -0.01em; line-height: 1.3; }
  .cv-agegate .cv-blk-image { margin-inline: auto; }
  .cv-agegate__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin-top: 12px; }
  .cv-agegate__btn { width: 100%; min-height: 50px; }
  .cv-agegate__hint { margin: 4px 0 0; }
  .cv-agegate [data-tf-age-gate-declined] h2:focus { outline: none; }
  /* The merchant's photo (or a theme photo until one is added). */
  .cv-agegate__media { position: absolute; inset: 0; overflow: hidden; background: var(--surface); }
  .cv-agegate__media img { width: 100%; height: 100%; object-fit: cover; }
  /* Full screen: the photo fills the window under a soft scrim; the panel floats on it. */
  .cv-agegate--fullscreen { background: var(--media-backdrop); }
  .cv-agegate--fullscreen .cv-agegate__media { position: fixed; }
  .cv-agegate--fullscreen .cv-agegate__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(0 0 0 / 0.15), rgb(0 0 0 / 0.5)); }
  .cv-agegate--fullscreen .cv-agegate__panel, .cv-agegate--fullscreen > [data-tf-age-gate-declined] { background: color-mix(in srgb, var(--bg) 90%, transparent);
    backdrop-filter: blur(16px) saturate(1.1); -webkit-backdrop-filter: blur(16px) saturate(1.1); }
  /* Split: photo on one half, the panel on the other, across the whole window. */
  .cv-agegate--split { grid-template-columns: 1fr 1fr; place-items: stretch; padding: 0; background: var(--bg); }
  .cv-agegate--split .cv-agegate__media { position: relative; inset: auto; min-height: 100vh; }
  .cv-agegate--split .cv-agegate__panel, .cv-agegate--split > [data-tf-age-gate-declined] { grid-column: 2; grid-row: 1; align-self: center; justify-self: center; width: min(100%, 480px);
    padding: 48px 40px; background: transparent; box-shadow: none; border-radius: 0; }
  /* Minimal: a narrow card, smaller type, no badge ring. */
  .cv-agegate--minimal .cv-agegate__panel, .cv-agegate--minimal > [data-tf-age-gate-declined] { width: min(100%, 380px); gap: 10px; padding: 28px 24px 22px; }
  .cv-agegate--minimal .cv-agegate__age { width: auto; height: auto; margin: 0; font-size: 13px; letter-spacing: 0.08em; box-shadow: none; color: var(--text-muted); }
  .cv-agegate--minimal .cv-agegate__title { font-size: calc(19px * var(--cv-heading-scale, 1)); }
  .cv-agegate--minimal .cv-agegate__body { font-size: 14px; }
  .cv-agegate--minimal .cv-agegate__actions { grid-template-columns: 1fr; gap: 8px; margin-top: 8px; }
  .cv-agegate--minimal .cv-agegate__btn { min-height: 46px; }
  @media (max-width: 749px) {
    .cv-agegate { place-items: end center; padding: 0; }
    .cv-agegate__panel, .cv-agegate > [data-tf-age-gate-declined] { width: 100%; padding: 32px 22px calc(22px + env(safe-area-inset-bottom)); border-radius: calc(var(--cv-radius, 16px) * 1.25) calc(var(--cv-radius, 16px) * 1.25) 0 0; }
    .cv-agegate--minimal .cv-agegate__panel, .cv-agegate--minimal > [data-tf-age-gate-declined] { width: 100%; }
    .cv-agegate__actions { grid-template-columns: 1fr; }
    .cv-agegate--split { grid-template-columns: 1fr; grid-template-rows: 38vh auto; place-items: stretch; align-content: start; }
    .cv-agegate--split .cv-agegate__media { min-height: 0; grid-row: 1; }
    .cv-agegate--split .cv-agegate__panel, .cv-agegate--split > [data-tf-age-gate-declined] { grid-column: 1; grid-row: 2; align-self: start; width: 100%; padding: 28px 22px calc(22px + env(safe-area-inset-bottom)); }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-agegate { animation: cv-agegate-fade 0.3s ease-out; }
    .cv-agegate__panel, .cv-agegate > [data-tf-age-gate-declined] { animation: cv-agegate-in 0.45s var(--cv-ease, ease-out); }
    @keyframes cv-agegate-fade { from { opacity: 0; } }
    @keyframes cv-agegate-in { from { opacity: 0; transform: translateY(14px) scale(0.985); } }
  }


  /* Canvas design system. Repeated in every section, because sections are standalone. */
  :where(.cv) { --cv-pad-x: clamp(16px, 4vw, 56px); --cv-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --cv-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    --cv-soft: color-mix(in srgb, var(--text) 5%, var(--bg)); --cv-line: color-mix(in srgb, var(--text) 10%, transparent);
    font-family: var(--tf-font-body_font, "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px; line-height: 1.55; letter-spacing: -0.006em; color: var(--text); background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
  :where(.cv *) { box-sizing: border-box; }
  .cv[hidden], .cv [hidden] { display: none !important; }
  :where(.cv img) { max-width: 100%; display: block; }
  :where(.cv a) { color: inherit; }
  :where(.cv-section) { padding-block: calc(var(--cv-gap-y, clamp(56px, 8vw, 112px)) * 0.58); }
  :where(.cv-section--page) { padding-top: clamp(28px, 4vw, 56px); }
  :where(.cv-page-title) { font-size: calc(clamp(32px, 4vw, 56px) * var(--cv-heading-scale, 1)); }
  :where(.cv-wrap) { width: 100%; max-width: var(--cv-width, 1440px); margin-inline: auto; padding-inline: var(--cv-pad-x); }
  :where(.cv-app-blocks) { display: grid; gap: 16px; margin-top: 24px; }
  .cv-app-blocks:empty { display: none; }
  :where(.cv-h1, .cv-h2, .cv-h3, .cv-h4) { font-family: var(--tf-font-heading_font, inherit); font-weight: 500; line-height: 1.04;
    letter-spacing: -0.035em; text-transform: var(--cv-heading-case, none); margin: 0; text-wrap: balance; }
  :where(.cv-h1) { font-size: calc(clamp(40px, 6.4vw, 88px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h2) { font-size: calc(clamp(28px, 3.6vw, 48px) * var(--cv-heading-scale, 1)); }
  :where(.cv-h3) { font-size: calc(clamp(19px, 1.8vw, 24px) * var(--cv-heading-scale, 1)); letter-spacing: -0.02em; line-height: 1.2; }
  :where(.cv-h4) { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
  :where(.cv-eyebrow) { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--text-muted); margin: 0; }
  :where(.cv-muted) { color: var(--text-muted); }
  :where(.cv-meta > * + *)::before { content: " · "; }
  :where(.cv-rte) { line-height: 1.65; }
  :where(.cv-rte > * + *) { margin-top: 0.9em; }
  :where(.cv-rte a) { text-underline-offset: 3px; }
  :where(.cv-rte ul, .cv-rte ol) { margin: 0; padding-inline-start: 1.25em; }
  :where(.cv-rte li + li) { margin-top: 0.3em; }

  :where(.cv-btn) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 26px;
    font: inherit; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer;
    background: var(--btn); color: var(--btn-text); border: 0; border-radius: var(--cv-btn-radius, 999px); -webkit-tap-highlight-color: transparent;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 1px 2px rgb(0 0 0 / 0.08);
    transition: transform 0.25s var(--cv-ease), background-color 0.25s var(--cv-ease), color 0.25s var(--cv-ease), box-shadow 0.25s var(--cv-ease); }
  :where(.cv-btn:hover) { background: color-mix(in srgb, var(--btn) 86%, var(--bg)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12), 0 6px 18px -6px rgb(0 0 0 / 0.35); }
  :where(.cv-btn:active) { transform: scale(0.97); }
  :where(.cv-btn--outline, .cv-btn--soft) { background: var(--cv-soft); color: var(--text); box-shadow: none; }
  :where(.cv-btn--outline:hover, .cv-btn--soft:hover) { background: color-mix(in srgb, var(--text) 10%, var(--bg)); box-shadow: none; }
  :where(.cv-btn--ghost) { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--ghost:hover) { background: var(--cv-soft); box-shadow: inset 0 0 0 1px var(--cv-line); }
  :where(.cv-btn--link) { min-height: 0; padding: 0; gap: 6px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-decoration: none; }
  :where(.cv-btn--link)::after { content: ""; width: 1em; height: 1em; background: currentColor; -webkit-mask: var(--cv-arrow) center / contain no-repeat; mask: var(--cv-arrow) center / contain no-repeat; transition: transform 0.25s var(--cv-ease); }
  :where(.cv-btn--link:hover) { background: none; box-shadow: none; }
  :where([dir="rtl"] .cv-btn--link)::after { transform: scaleX(-1); }
  :where(.cv-btn--link:active) { transform: none; }
  :where(.cv-btn--plain)::after { content: none; }
  :where(.cv-btn--block) { width: 100%; }
  :where(.cv-btn--sm) { min-height: 38px; padding: 0 16px; font-size: 14px; }
  :where(.cv-btn--lg) { min-height: 56px; padding: 0 32px; font-size: 16px; }
  :where(.cv-btn:disabled, .cv-btn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; transform: none; box-shadow: none; }
  :where(.cv-btn.is-loading, .cv-btn.is-done) { opacity: 1; cursor: progress; }
  :where(.cv-btn.is-loading) > *, :where(.cv-btn.is-loading) { color: transparent; }
  :where(.cv-btn.is-loading)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%;
    border: 2px solid var(--btn-text); border-right-color: transparent; animation: cv-spin 0.7s linear infinite; }
  :where(.cv-btn--outline.is-loading, .cv-btn--soft.is-loading, .cv-btn--ghost.is-loading)::before { border-color: var(--text); border-right-color: transparent; }
  /* A link button (wishlist, share) keeps its icon and label while busy and only dims: a spinner on a borderless button reads as the control vanishing. */
  .cv-btn--link.is-loading, .cv-btn--link.is-loading > * { color: inherit; }
  .cv-btn--link.is-loading { opacity: 0.55; }
  .cv-btn--link.is-loading::before { content: none; }
  :where(.cv-btn.is-done) { animation: cv-pop 0.4s var(--cv-ease); }
  /* Text buttons: actions set as words (Clear cart, Create account, Edit, Show more), on <button>, <a> or <summary>. No underline and
     no arrow, at rest or on hover: muted at rest, ink on hover. A surface with other colours sets --cv-tbtn and --cv-tbtn-hover.
     Links inside running prose keep the browser underline; .cv-btn--link (with its arrow) is for navigation such as "Continue shopping". */
  :where(.cv-tbtn) { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0; font: inherit; font-weight: 500; letter-spacing: inherit;
    color: var(--cv-tbtn, var(--text-muted)); text-align: start; text-decoration: none; background: none; border: 0; border-radius: 4px; cursor: pointer;
    list-style: none; -webkit-tap-highlight-color: transparent; transition: color 0.2s var(--cv-ease); }
  :where(.cv-tbtn:hover) { color: var(--cv-tbtn-hover, var(--text)); text-decoration: none; }
  :where(.cv-tbtn)::-webkit-details-marker { display: none; }
  :where(.cv-tbtn:disabled, .cv-tbtn[aria-disabled="true"]) { opacity: 0.4; cursor: not-allowed; }
  @keyframes cv-spin { to { transform: rotate(360deg); } }
  @keyframes cv-pop { 0% { transform: scale(1); } 40% { transform: scale(1.04); } 100% { transform: scale(1); } }

  :where(.cv-field) { display: grid; gap: 6px; }
  :where(.cv-label) { font-size: 13px; font-weight: 500; color: var(--text-muted); }
  :where(.cv-input) { width: 100%; min-height: 50px; padding: 0 18px; font: inherit; font-size: 15px; color: var(--text); background: var(--cv-soft);
    border: 1px solid transparent; border-radius: var(--cv-field-radius, 14px); outline: none; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; }
  :where(.cv-input::placeholder) { color: color-mix(in srgb, var(--text) 45%, transparent); }
  :where(.cv-input:hover) { background: color-mix(in srgb, var(--text) 7%, var(--bg)); }
  :where(.cv-input:focus) { background: var(--bg); border-color: var(--text); box-shadow: none; }
  :where(textarea.cv-input) { min-height: 132px; padding: 14px 18px; resize: vertical; }
  :where(select.cv-input) { appearance: none; padding-inline-end: 44px; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 18px center; }
  /* Focus. Fields (text, email, phone, code, search, quantity, select, textarea) show it with their own border only, for mouse, touch and
     keyboard alike. Everything else (buttons, links, swatches, cards, checks, tabs, dots, chips) gets one thin ring, for keyboard focus only.
     A field drawn by its wrapper (newsletter pill, search bar, quantity stepper) puts .cv-shell on the wrapper, which takes the border.
     Sections only move the ring (offset, colour) or draw it on a proxy with var(--cv-ring); they never add their own. */
  :where(.cv) { --cv-ring: 2px solid var(--text); --cv-ring-offset: 2px; }
  :where(.cv :focus-visible) { outline: var(--cv-ring); outline-offset: var(--cv-ring-offset); }
  :where(.cv [tabindex="-1"]:focus-visible) { outline: none; }
  /* After a click or tap no ring shows, even where a script moved focus (a drawer focusing its close button). */
  html.cv-pointer :where(.cv :focus-visible) { outline: none; }
  :where(.cv) :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="color"]), select, textarea):focus { outline: none; }
  .cv-shell:is(:focus, :has(input:focus, select:focus, textarea:focus)) { box-shadow: 0 0 0 1px var(--text); }
  :where(.cv-check) { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
  :where(.cv-check input) { width: 18px; height: 18px; accent-color: var(--text); border-radius: 6px; }

  :where(.cv-media) { position: relative; overflow: hidden; background: var(--surface); border-radius: var(--cv-radius, 16px); isolation: isolate; }
  :where(.cv-media > img, .cv-media > svg, .cv-media > video, .cv-media > picture) { width: 100%; height: 100%; object-fit: cover; }
  /* A real product (or post) without an image: a quiet tinted tile with its name, never a placeholder drawing. */
  .cv-noimg { position: absolute; inset: 0; display: grid; place-items: center; padding: 12%; overflow: hidden; font-size: 13px; line-height: 1.35; text-align: center; color: var(--text-muted, currentColor);
    background: color-mix(in srgb, var(--text) 6%, var(--bg)); overflow-wrap: anywhere; }
  .cv-noimg--lg { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(18px, 2vw, 26px); }
  :where(.cv-price) { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; font-variant-numeric: tabular-nums; }
  :where(.cv-price__sale) { color: var(--accent); }
  :where(.cv-price__was) { color: var(--text-muted); text-decoration: line-through; font-size: 0.9em; }
  :where(.cv-badge) { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.005em;
    border-radius: 999px; background: color-mix(in srgb, var(--bg) 92%, transparent); color: var(--text); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  :where(.cv-badge--sale) { background: var(--accent); color: var(--bg); }
  :where(.cv-badge--sold) { background: color-mix(in srgb, var(--text) 82%, transparent); color: var(--bg); }
  :where(.cv-notice) { padding: 14px 18px; font-size: 14px; background: var(--cv-soft); border-radius: 14px; }
  :where(.cv-notice--ok) { background: color-mix(in srgb, var(--status-ok) 10%, var(--bg)); color: color-mix(in srgb, var(--status-ok) 80%, var(--text)); }
  /* A notice marked cv-toast floats at the bottom of the window instead of pushing the page down. */
  .cv-toast { position: fixed; z-index: 400; inset-inline: 16px; bottom: max(24px, env(safe-area-inset-bottom)); width: auto; max-width: 440px; margin: 0 auto;
    box-shadow: 0 0 0 1px var(--cv-line), 0 18px 44px -16px rgb(0 0 0 / 0.35); }
  .cv-toast[hidden] { display: none; }
  /* A confirmation toast wears the button colours of its scheme (Theme settings > Notifications); errors keep their warning colours. */
  .cv-toast.cv-notice--ok { background: var(--btn); color: var(--btn-text); }
  .cv-toast--top_center { top: max(20px, env(safe-area-inset-top)); bottom: auto; }
  .cv-toast--bottom_end { inset-inline: auto 20px; margin: 0; }
  /* The in-theme confirm dialog for destructive actions (data-cv-confirm). */
  .cv-confirm { position: fixed; inset: 0; margin: auto; height: fit-content; max-height: calc(100dvh - 32px); border: 0; padding: 24px; width: min(420px, calc(100vw - 32px)); border-radius: var(--cv-field-radius, 14px); background: var(--bg); color: var(--text);
    box-shadow: 0 0 0 1px var(--cv-line), 0 24px 64px -20px rgb(0 0 0 / 0.4); }
  .cv-confirm::backdrop { background: rgb(0 0 0 / 0.4); }
  .cv-confirm__msg { margin: 0 0 20px; font-size: 1rem; line-height: 1.5; }
  .cv-confirm__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
  @media (prefers-reduced-motion: no-preference) { .cv-toast:not([hidden]) { animation: cv-toast-in 0.2s ease-out; } @keyframes cv-toast-in { from { opacity: 0; transform: translateY(8px); } } }
  :where(.cv-notice--error) { background: color-mix(in srgb, var(--accent) 9%, var(--bg)); color: color-mix(in srgb, var(--accent) 75%, var(--text)); }
  :where(.cv-sr) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  :where(.cv-icon) { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  :where([dir="rtl"] .cv-icon--dir) { transform: scaleX(-1); }
  :where(.cv-grid) { display: grid; gap: var(--cv-grid-gap, clamp(28px, 3vw, 40px)) var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); grid-template-columns: repeat(var(--cv-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { :where(.cv-grid) { grid-template-columns: repeat(var(--cv-cols, 4), minmax(0, 1fr)); } }
  :where(.cv-head) { display: flex; flex-wrap: wrap; align-items: last baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(24px, 3.4vw, 48px); }
  :where(.cv-head--center) { flex-direction: column; align-items: center; text-align: center; }
  /* Tile cards are panels: rows sit as close as columns, so the gutters read as one even grid. */
  :where(.cv-grid:has(> .cv-card--tile)) { row-gap: var(--cv-grid-gap-x, clamp(12px, 1.6vw, 24px)); }
  :where(.cv-head p) { margin: 10px 0 0; max-width: 56ch; }
  :where(.cv-stars) { --cv-star: var(--text); display: inline-block; width: 72px; height: 13px;
    background: linear-gradient(90deg, var(--cv-star) var(--cv-rating, 0%), color-mix(in srgb, var(--text) 16%, transparent) var(--cv-rating, 0%));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M8 0l2.3 4.7 5.2.8-3.7 3.6.9 5.1L8 11.8l-4.7 2.4.9-5.1L.5 5.5l5.2-.8z'/%3E%3C/svg%3E") 0 0 / 14.4px 13px repeat-x; }
  @media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
      :where(.cv-reveal) { animation: cv-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
      @keyframes cv-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
    }
  }
  @media (prefers-reduced-motion: reduce) { :where(.cv, .cv *), :where(.cv, .cv *)::before, :where(.cv, .cv *)::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
  /* Section spacing (each section's "Space above and below"). */
  .cv-section.cv-pad--compact { padding-block: calc(var(--cv-gap-y, 96px) * 0.4); }
  .cv-section.cv-pad--relaxed { padding-block: calc(var(--cv-gap-y, 96px) * 0.9); }
  .cv-section.cv-pad--none { padding-block: 0; }
  .cv-section.cv-pad--top-none { padding-top: 0; }

  /* Use the existing 44px icon target on phones; keep the type and icons unchanged. */
  @media (max-width: 749px) {
    :where(.cv-btn--link) { min-height: 44px; padding-block: 12px; }
    :where(.cv-btn--sm) { min-height: 44px; padding-block: 12px; }
    /* The padding gives a 44px target; the equal negative margin keeps the line where it was, also inside a sentence. */
    :where(.cv-tbtn) { padding-block: 12px; margin-block: -12px; }
  }
  /* Wishlist limit: when the wishlist is full, hearts that would add are dimmed and explain at the button (on a card, across the foot of its image). */
  :where([data-cv-wish].is-full) { opacity: 0.5; cursor: not-allowed; }
  :where(.cv-wishmsg) { position: absolute; z-index: 6; inset-block-start: calc(100% + 8px); inset-inline-start: 0; width: max-content; max-width: min(280px, 80vw); margin: 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.4; text-align: start; color: var(--bg); background: var(--text); border-radius: 10px; box-shadow: 0 10px 28px -10px rgb(0 0 0 / 0.35); }
  :where(.cv-wishmsg[hidden]) { display: none; }
  :where(.cv-card__media > .cv-wishmsg) { inset: auto 8px 8px; width: auto; max-width: none; }
  @media (prefers-reduced-motion: no-preference) { :where(.cv-wishmsg) { animation: cv-wishmsg-in 0.2s var(--cv-ease, ease-out); } @keyframes cv-wishmsg-in { from { opacity: 0; transform: translateY(4px); } } }

/* Editor-only note on a section that shoppers can't see yet. */
.cv-editor-hint { margin: 0 auto 16px; max-width: 640px; padding: 10px 14px; font-size: 13px; line-height: 1.45; text-align: center; color: var(--text-muted); border: 1px dashed var(--cv-line); border-radius: 12px; }

/* Theme blocks (blocks/*.vasc): the content blocks sections, slides and tiles hold. Section's style ("auto") is the look the
   section gives that part (a slide's headline, a tile's heading); sections style .cv-blk-*--auto where they hold blocks. */
  :where(.cv-blk-eyebrow, .cv-blk-heading, .cv-blk-text) { margin: 0; }
  :where(.cv-blk-heading) { max-width: 100%; overflow-wrap: break-word; }
  :where(.cv-blk-text--small) { font-size: 14px; }
  :where(.cv-blk-text--medium) { font-size: 17px; }
  :where(.cv-blk-text--large) { font-size: calc(clamp(18px, 1.6vw, 22px)); }
  :where(.cv-blk-buttons) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  :where(.cv-blk-image) { width: var(--cv-blk-w, 100%); max-width: 100%; }
  :where(.cv-blk-image img) { display: block; width: 100%; height: auto; }
  :where(.cv-blk-image--square img) { aspect-ratio: 1 / 1; object-fit: cover; }
  :where(.cv-blk-image--portrait img) { aspect-ratio: 4 / 5; object-fit: cover; }
  :where(.cv-blk-image--landscape img) { aspect-ratio: 4 / 3; object-fit: cover; }
  :where(.cv-blk-image__ph) { display: block; aspect-ratio: 4 / 3; background: var(--cv-soft); border-radius: var(--cv-radius, 16px); overflow: hidden; }
  :where(.cv-blk-image__ph svg) { width: 100%; height: 100%; }
  :where(.cv-blk-spacer) { height: var(--cv-blk-h, 32px); width: 100%; }
  :where(.cv-blk-spacer--line) { display: flex; align-items: center; }
  :where(.cv-blk-spacer--line)::before { content: ""; flex: 1; border-top: 1px solid var(--cv-line); }
  .cv-blk-hint { margin: 0; }
  :where(.cv-blk-heading__link) { color: inherit; text-decoration: none; }
  :where(.cv-blk-heading__link:hover) { text-decoration: underline; text-underline-offset: 0.12em; text-decoration-thickness: 1px; }
/* A tile's own link (promo and split tiles, mega menu promotions): the pointer target over the whole tile. Its heading and button blocks carry the
   same link for keyboards and screen readers; they sit above it, and the rest of the content lets clicks through to it. */
  :where(.cv-tile-link) { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
  :where(.cv-tile-over) { position: relative; z-index: 2; }
  :where(.cv-tile-link ~ .cv-tile-over) { pointer-events: none; }
  :where(.cv-tile-link ~ .cv-tile-over :is(a, button, input, select, textarea, video, [tabindex])) { pointer-events: auto; }
  /* The platform metafield block (theme:metafield): the storefront writes its markup (tf-metafield); Canvas styles it. */
  :where(.tf-metafield) { display: grid; gap: 4px; }
  :where(.tf-metafield__label) { font-size: 13px; color: var(--text-muted); }
  :where(.tf-metafield__value) { font-size: 15px; overflow-wrap: anywhere; }
  :where(.tf-metafield__list) { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
  :where(.tf-metafield--list-product-reference, .tf-metafield--list-variant-reference) :where(.tf-metafield__reference) { display: inline-flex; padding: 6px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__image, .tf-metafield__video) { max-width: 100%; height: auto; border-radius: 12px; }
  :where(.tf-metafield__file) { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 14px; font-size: 14px; text-decoration: none; background: var(--cv-soft); border-radius: 999px; }
  :where(.tf-metafield__json) { margin: 0; font: inherit; white-space: pre-wrap; }
  :where(.tf-metafield-notice) { font-size: 14px; }
  :where(.cv-pl__block) { margin-block: 12px; }

.cv-ft { padding-block: var(--cv-ft-pad) 28px; }
/* partial:footer-base */
  /* Footer building blocks shared by the three footer layouts: the columns grid, the blocks a column holds, and the bottom bar. */
  .cv-ft { margin-top: auto; font-size: 14.5px; }
  .cv-ft--pad-compact { --cv-ft-pad: clamp(36px, 4.5vw, 56px); }
  .cv-ft--pad-normal { --cv-ft-pad: clamp(56px, 7vw, 96px); }
  .cv-ft--pad-relaxed { --cv-ft-pad: clamp(72px, 9vw, 136px); }
  .cv-ft__cols { display: grid; gap: 40px 24px; grid-template-columns: repeat(var(--cv-ft-cols-m, 2), minmax(0, 1fr)); }
  @media (min-width: 750px) { .cv-ft__cols { grid-template-columns: repeat(var(--cv-ft-cols-t, 2), minmax(0, 1fr)); } }
  @media (min-width: 990px) { .cv-ft__cols { grid-template-columns: repeat(var(--cv-ft-cols, 4), minmax(0, 1fr)); } }
  .cv-ft__cell { min-width: 0; }
  .cv-ft__cell:not(:has(*)) { display: none; }
  /* Wide cells (a two-column Column, the Newsletter block on its own) take two columns on desktop and a whole row below it. */
  .cv-ft__cell--wfull { grid-column: 1 / -1; }
  .cv-ft__cell--newsletter-form { max-width: 560px; }
  @media (min-width: 990px) { .cv-ft__cell:is(.cv-ft__cell--w2, .cv-ft__cell--newsletter-form) { grid-column: span 2; } .cv-ft--one .cv-ft__cell { grid-column: 1 / -1; } }
  @media (max-width: 989px) { .cv-ft__cell:is(.cv-ft__cell--w2, .cv-ft__cell--newsletter-form) { grid-column: 1 / -1; } }
  .cv-ft--center .cv-ft__cols { text-align: center; }
  .cv-ft--center :is(.cv-ftc, .cv-blk-news, .cv-blk-contact) { justify-items: center; margin-inline: auto; }
  .cv-ft--center :is(.cv-blk-menu--inline, .cv-social, .cv-pay, .cv-blk-buttons) { justify-content: center; }
  .cv-ft--center .cv-blk-image { margin-inline: auto; }

  /* A column stacks its blocks; the footer gives its headings and text their look. */
  .cv-ftc { display: grid; align-content: start; gap: 14px; min-width: 0; }
  .cv-ft .cv-blk-heading--auto { margin: 0 0 2px; font-family: inherit; font-size: 13px; font-weight: 500; letter-spacing: 0; line-height: 1.4; text-transform: none; color: var(--text-muted); }
  .cv-ft .cv-blk-text--auto { color: var(--text-muted); }
  .cv-ft .cv-blk-eyebrow { color: var(--text-muted); }
  .cv-ft .cv-blk-buttons--auto .cv-btn:not(.cv-btn--link) { min-height: 44px; padding-inline: 20px; font-size: 14px; }

  .cv-blk-menu { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
  .cv-blk-menu--inline { display: flex; flex-wrap: wrap; gap: 6px 22px; }
  .cv-blk-menu a, .cv-blk-menu span { color: var(--text); text-decoration: none; transition: opacity 0.2s; }
  .cv-blk-menu a:hover { opacity: 0.6; }

  .cv-blk-news { display: grid; gap: 12px; min-width: 0; }
  .cv-blk-news__title { margin: 0; font-family: var(--tf-font-heading_font, inherit); font-size: clamp(24px, 2.6vw, 36px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.1; color: var(--text); }
  .cv-blk-news__text { margin: 0 0 2px; color: var(--text-muted); }
  .cv-blk-news__field { display: contents; }
  .cv-ftc .cv-blk-news__title { font-size: clamp(20px, 1.8vw, 24px); }
/* partial:footer-forms */
  .cv-ft__news { position: relative; display: flex; align-items: center; gap: 6px; padding: 5px; background: var(--bg); border-radius: var(--cv-btn-radius, 999px);
    box-shadow: 0 0 0 1px var(--cv-line), 0 1px 2px rgb(0 0 0 / 0.04); transition: box-shadow 0.2s; }
  .cv-ft__news .cv-input { flex: 1 1 auto; min-width: 0; min-height: 46px; padding: 0 8px 0 16px; background: transparent; border: 0; border-radius: inherit; }
  .cv-ft__news .cv-input:hover, .cv-ft__news .cv-input:focus { background: transparent; }
  .cv-ft__news .cv-btn { flex: none; min-height: 46px; padding: 0 22px; border-radius: calc(var(--cv-btn-radius, 999px) - 2px); }
  .cv-hp { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; opacity: 0; }
/* /partial:footer-forms */

  .cv-social { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 0 -10px; padding: 0; list-style: none; }
  [dir="rtl"] .cv-social { margin: 0 -10px 0 0; }
  .cv-social a { display: inline-flex; align-items: center; gap: 8px; padding: 10px; color: var(--text); text-decoration: none; border-radius: 999px; transition: opacity 0.2s; }
  .cv-social a:hover { opacity: 0.6; }
  .cv-social--names { gap: 2px 14px; }
  .cv-social__name { font-size: 14px; }

  .cv-blk-contact { display: grid; gap: 8px; font-style: normal; color: var(--text-muted); }
  .cv-blk-contact p { margin: 0; }
  .cv-blk-contact a { color: var(--text); text-decoration: none; text-underline-offset: 3px; }
  .cv-blk-contact a:hover { text-decoration: underline; }

  .cv-pay { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
  .cv-pay li { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; font-size: 12px; font-weight: 500; letter-spacing: 0.01em;
    color: var(--text); border-radius: 6px; box-shadow: inset 0 0 0 1px var(--cv-line); }

  .cv-blk-logo { display: inline-flex; color: var(--text); text-decoration: none; }
  .cv-blk-logo img { height: auto; max-width: 100%; }
  .cv-blk-logo__name { font-family: var(--tf-font-heading_font, inherit); font-size: clamp(20px, 2vw, 26px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; }

  .cv-ft__notice { margin: 0 0 24px; }

  /* Bottom bar: the merchant's parts in one wrapping row. "Spread" sends the last part to the far end. */
  .cv-ft__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-top: 24px; font-size: 13px; color: var(--text-muted); }
  .cv-ft__cols + .cv-ft__bar, .cv-ft__cols + .cv-ft__notice + .cv-ft__bar { margin-top: clamp(48px, 6vw, 80px); }
  .cv-ft__bar--line { border-top: 1px solid var(--cv-line); }
  .cv-ft__bar--spread > :last-child, .cv-ft__bar--spread > .tf-block:last-child > .cv-ft__part { margin-inline-start: auto; }
  .cv-ft__bar--center { justify-content: center; text-align: center; }
  .cv-ft__part { margin: 0; }
  .cv-ft__part:not(:has(*)):is(div) { display: none; }
  .cv-ft__bar .cv-editor-hint { max-width: 360px; margin: 0; }
  .cv-ft__copy { color: var(--text-muted); }
  .cv-ft__policies { display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 0; list-style: none; }
  .cv-ft__policies a, .cv-ft__powered { color: inherit; text-decoration: none; }
  .cv-ft__policies a:hover, .cv-ft__powered:hover { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
  .cv-ft__consent { padding: 0; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
  .cv-ft__consent:hover { color: var(--text); }
  .cv-ft__note { max-width: 60ch; }
  .cv-ft__note > * { margin: 0; }
  .cv-ft__bar .cv-social a { color: var(--text); }
/* partial:loc-picker */
  /* Country and language picker (partials/loc-picker.html). The trigger styles open a list dialog: under the pill (lined up with it, on the
     page grid), centred (flags with names), or a side sheet with search; a bottom sheet on phones, like the quick view and the filters.
     The list sits on a raised surface (the scheme's background lifted towards white, so it reads in dark schemes too) with a hairline and a
     shadow and scrim that deepen as the scheme darkens. Surfaces start 14px in and text 28px in, from the title to the last row. */
  .cv-loc { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
  .cv-loc__form { display: inline-flex; }
  .cv-loc__flag { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 1.15em; line-height: 1; }
  .cv-loc__select { min-height: 40px; max-width: 260px; padding: 0 38px 0 16px; font: inherit; font-size: 13.5px; color: var(--text); background-color: var(--bg);
    border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 14px center; }
  [dir="rtl"] .cv-loc__select { padding: 0 16px 0 38px; background-position: left 14px center; }
  .cv-loc__links { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
  .cv-loc__link { display: inline-flex; align-items: center; gap: 6px; padding: 0; font: inherit; font-size: 13.5px; color: var(--text-muted); background: none; border: 0; cursor: pointer;
    transition: color 0.2s var(--cv-ease); }
  .cv-loc__link:hover { color: var(--text); }
  .cv-loc__link[aria-current="true"] { color: var(--text); font-weight: 600; }
  .cv-loc abbr, .cv-loc-dlg abbr { text-decoration: none; }
  .cv-loc__trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; max-width: 100%; padding: 0 12px 0 14px; font: inherit; font-size: 13.5px; color: var(--text);
    background: var(--bg); border: 0; border-radius: 999px; box-shadow: 0 0 0 1px var(--cv-line); cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: background-color 0.2s var(--cv-ease), box-shadow 0.2s var(--cv-ease); }
  .cv-loc__trigger:hover { background: var(--cv-soft); }
  .cv-loc__trigger--pill { min-height: 36px; padding: 0 10px 0 12px; gap: 6px; font-weight: 500; letter-spacing: 0.01em; font-variant-numeric: tabular-nums; }
  .cv-loc__tname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc__tmeta { color: var(--text-muted); white-space: nowrap; }
  .cv-loc__sep { width: 1px; height: 14px; background: var(--cv-line); }
  .cv-loc__chev { width: 14px; height: 14px; color: var(--text-muted); }

  .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-bg: color-mix(in srgb, var(--lift) 7%, var(--bg)); --cv-soft: color-mix(in srgb, var(--text) 7%, var(--cv-loc-bg));
    --cv-loc-edge: color-mix(in srgb, var(--text) 16%, transparent); --cv-loc-shade: rgb(0 0 0 / 0.42); --cv-loc-scrim: rgb(0 0 0 / 0.4); }
  @supports (color: rgb(from red r g b)) {
    .cv-loc-dlg, .cv-loc__nojs-panel { --cv-loc-shade: rgb(from var(--bg) 0 0 0 / calc(0.66 - (r + g + b) / 2550));
      --cv-loc-scrim: rgb(from var(--bg) 0 0 0 / calc(0.6 - (r + g + b) / 2550)); }
  }
  .cv-loc-dlg { box-sizing: border-box; flex-direction: column; width: min(560px, calc(100vw - 32px)); max-width: none; max-height: min(82vh, 720px); margin: auto; padding: 0;
    overflow: hidden; color: var(--text); background: var(--cv-loc-bg); border: 0; border-radius: 22px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 30px 80px -24px var(--cv-loc-shade); }
  .cv-loc-dlg[open] { display: flex; }
  .cv-loc-dlg::backdrop { background: var(--cv-loc-scrim); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .cv-loc-dlg--sheet { width: min(440px, calc(100vw - 20px)); height: calc(100% - 20px); max-height: none; margin-block: 10px; margin-inline: auto 10px; }
  .cv-loc-dlg--pill { position: fixed; inset: auto; inset-block: var(--cv-loc-y, 72px) var(--cv-loc-b, auto); inset-inline-start: var(--cv-loc-x, 16px);
    width: var(--cv-loc-w, min(340px, calc(100vw - 32px))); max-height: min(440px, calc(100vh - 32px)); margin: 0; border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc-dlg--pill::backdrop { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .cv-loc-dlg__handle { display: none; }
  .cv-loc-dlg__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 18px 10px; padding-inline: 28px 12px; }
  .cv-loc-dlg--pill .cv-loc-dlg__head { padding-block: 12px 4px; }
  .cv-loc-dlg__title { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; }
  .cv-loc-dlg--pill .cv-loc-dlg__title { font-size: 15px; }
  .cv-loc-dlg__close { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; color: var(--text); background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
  .cv-loc-dlg__close:hover { background: var(--cv-soft); }
  .cv-loc-dlg__body { flex: 1; min-height: 0; display: grid; align-content: start; gap: 20px; padding: 4px 14px 18px; overflow-y: auto; overscroll-behavior: contain; }
  .cv-loc-dlg__group { display: grid; gap: 8px; }
  .cv-loc-dlg__sub { margin: 0; padding-inline: 14px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
  .cv-loc-dlg__search { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 10px; margin-bottom: 4px; padding-inline: 14px 8px;
    background: var(--cv-soft); border-radius: var(--cv-field-radius, 14px); box-shadow: 0 -4px 0 var(--cv-loc-bg); }
  .cv-loc-dlg__search.cv-shell:is(:focus, :has(input:focus)) { box-shadow: 0 -4px 0 var(--cv-loc-bg), 0 0 0 1px var(--text); }
  .cv-loc-dlg__search .cv-icon { flex: none; color: var(--text-muted); }
  .cv-loc-dlg__search .cv-input { min-height: 46px; padding-inline: 0; background: transparent; border: 0; }
  .cv-loc-dlg__search .cv-input:hover, .cv-loc-dlg__search .cv-input:focus { background: transparent; }
  .cv-loc-dlg__form { display: grid; }
  .cv-loc-dlg__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__list--modal { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 6px; }
  .cv-loc-dlg--modal .cv-loc-dlg__list--langs { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
  .cv-loc-dlg__list [hidden] { display: none; }
  .cv-loc-dlg__opt { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 14px; font: inherit; font-size: 15px; color: var(--text); text-align: start;
    text-decoration: none; background: transparent; border: 0; border-radius: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 0.15s var(--cv-ease); }
  .cv-loc-dlg__opt:hover { background: var(--cv-soft); }
  .cv-loc-dlg__opt[aria-current="true"] { font-weight: 600; background: var(--cv-soft); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt { min-height: 52px; box-shadow: inset 0 0 0 1px var(--cv-line); }
  .cv-loc-dlg__list--modal .cv-loc-dlg__opt[aria-current="true"] { background: transparent; box-shadow: inset 0 0 0 1.5px var(--text); }
  .cv-loc-dlg__opt .cv-loc__flag { font-size: 20px; }
  /* A name in another script runs in its own direction (<bdi>) but lines up with the others. */
  .cv-loc-dlg__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cv-loc-dlg__meta { flex: none; font-size: 13.5px; font-weight: 400; color: var(--text-muted); font-variant-numeric: tabular-nums; }
  .cv-loc-dlg__tick { width: 18px; height: 18px; flex: none; }
  .cv-loc-dlg__none { margin: 0; padding: 10px 14px; font-size: 14px; color: var(--text-muted); }
  .cv-loc-dlg__langs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
  .cv-loc-dlg__chip { min-height: 40px; padding: 0 14px; font: inherit; font-size: 14px; color: var(--text); background: var(--cv-soft); border: 0; border-radius: 999px; cursor: pointer;
    transition: background-color 0.15s var(--cv-ease), color 0.15s var(--cv-ease); }
  .cv-loc-dlg__chip:hover { background: color-mix(in srgb, var(--text) 13%, var(--cv-loc-bg)); }
  .cv-loc-dlg__chip[aria-current="true"] { color: var(--btn-text); background: var(--btn); }
  /* Keyboard focus: a ring inside the row (the list scrolls, so an outer ring would be cut off). A list opened by a click or a tap moves
     focus to the current choice without a ring (the script marks it is-pointer until a key is pressed). */
  .cv-loc-dlg :is(.cv-loc-dlg__opt, .cv-loc-dlg__chip, .cv-loc-dlg__close):focus-visible, .cv-loc__nojs .cv-loc-dlg__opt:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
  .cv-loc-dlg.is-pointer :focus-visible, html.cv-pointer .cv-loc-dlg :focus-visible { outline: none; }
  html:has(.cv-loc-dlg[open]:not(.cv-loc-dlg--pill)) { overflow: hidden; }
  /* Without script: the trigger is a disclosure, with the choices in a panel under it (in the flow in the phone menu and the footer). */
  .cv-loc__nojs { position: relative; display: inline-block; max-width: 100%; }
  .cv-loc__nojs > summary { list-style: none; }
  .cv-loc__nojs > summary::-webkit-details-marker { display: none; }
  .cv-loc__nojs[open] .cv-loc__chev { transform: rotate(180deg); }
  .cv-loc__nojs-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 30; display: grid; gap: 12px; box-sizing: border-box; width: max-content;
    min-width: 240px; max-width: min(340px, calc(100vw - 32px)); max-height: min(60vh, 440px); overflow-y: auto; overscroll-behavior: contain; padding: 8px 8px 10px;
    color: var(--text); text-align: start; background: var(--cv-loc-bg); border-radius: 18px;
    box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.05), 0 24px 60px -18px var(--cv-loc-shade); }
  .cv-loc__nojs-panel .cv-loc-dlg__sub { padding: 8px 14px 4px; }
  .cv-loc__nojs-form { display: grid; gap: 2px; }
  .cv-mnav__loc .cv-loc__nojs, .cv-ft .cv-loc__nojs { display: block; }
  .cv-mnav__loc .cv-loc__nojs-panel, .cv-ft .cv-loc__nojs-panel { position: static; width: auto; max-width: none; max-height: 50vh; margin-top: 8px; }
  @media (max-width: 749px) {
    .cv-loc-dlg, .cv-loc-dlg--sheet, .cv-loc-dlg--pill { position: fixed; inset: auto 0 0; width: 100%; height: auto; max-height: 88svh; margin: 0;
      border-radius: calc(var(--cv-radius, 16px) * 1.5) calc(var(--cv-radius, 16px) * 1.5) 0 0;
      box-shadow: 0 0 0 1px var(--cv-loc-edge), inset 0 1px 0 rgb(255 255 255 / 0.06), 0 -20px 60px -20px var(--cv-loc-shade); }
    .cv-loc-dlg--pill::backdrop { background: var(--cv-loc-scrim); }
    .cv-loc-dlg__handle { display: block; flex: none; width: 40px; height: 5px; margin: 9px auto 0; border-radius: 5px; background: color-mix(in srgb, var(--text) 26%, transparent); }
    .cv-loc-dlg__head { padding-top: 8px; }
    .cv-loc-dlg__body { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
    .cv-loc-dlg__close { width: 44px; height: 44px; }
    .cv-loc__link { min-height: 44px; }
    .cv-loc__select { min-height: 44px; }
    .cv-loc__trigger { min-height: 44px; }
    .cv-loc-dlg__chip { min-height: 44px; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .cv-loc-dlg[open] { animation: cv-loc-in 0.32s var(--cv-ease); }
    .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side; }
    [dir="rtl"] .cv-loc-dlg--sheet[open] { animation-name: cv-loc-side-rtl; }
    .cv-loc-dlg[open]::backdrop { animation: cv-loc-fade 0.3s ease-out; }
    @keyframes cv-loc-in { from { opacity: 0; transform: translateY(10px) scale(0.985); } }
    @keyframes cv-loc-side { from { transform: translateX(calc(100% + 12px)); } }
    @keyframes cv-loc-side-rtl { from { transform: translateX(calc(-100% - 12px)); } }
    @keyframes cv-loc-fade { from { opacity: 0; } }
    @media (max-width: 749px) { .cv-loc-dlg[open], .cv-loc-dlg--sheet[open], [dir="rtl"] .cv-loc-dlg--sheet[open] { animation: cv-loc-up 0.42s var(--cv-ease); } @keyframes cv-loc-up { from { transform: translateY(105%); } } }
  }
/* /partial:loc-picker */

  @media (max-width: 749px) {
    .cv-blk-menu { gap: 0; }
    .cv-blk-menu a, .cv-blk-menu span { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; padding: 12px 4px; margin-inline: -4px; }
    .cv-blk-menu--inline a, .cv-blk-menu--inline span { margin-inline: 0; }
    .cv-ft .cv-blk-heading--auto { margin-bottom: -6px; }
    .cv-ft__policies a, .cv-ft__consent, .cv-ft__powered, .cv-blk-contact a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 12px; }
    .cv-ft__bar { gap: 4px 24px; }
    .cv-ft__bar--spread > :last-child, .cv-ft__bar--spread > .tf-block:last-child > .cv-ft__part { margin-inline-start: 0; }
  }

  /* Folding columns (the section's "Fold columns on phones"): a column that starts with a heading opens and closes behind it. */
  .cv-ftc__toggle { display: none; }
  @media (max-width: 749px) {
    .cv-ft--fold .cv-ftc.has-fold { gap: 0; padding-block: 2px; border-bottom: 1px solid var(--cv-line); }
    .cv-ft--fold .cv-ftc.has-fold .cv-ftc__head { position: relative; }
    .cv-ft--fold .cv-ftc__toggle { position: absolute; inset: 0; display: flex; align-items: center; justify-content: flex-end; width: 100%; padding: 0; color: var(--text-muted);
      background: none; border: 0; cursor: pointer; }
    .cv-ft--fold .cv-ftc__toggle .cv-icon { transition: transform 0.25s var(--cv-ease); }
    .cv-ft--fold .cv-ftc__toggle[aria-expanded="true"] .cv-icon { transform: rotate(180deg); }
    .cv-ft--fold .cv-ftc.has-fold .cv-blk-heading--auto { margin: 0; padding-block: 14px; font-size: 15px; color: var(--text); }
    .cv-ft--fold .cv-ftc.has-fold > :last-child { padding-bottom: 14px; }
    .cv-ft--fold .cv-ftc.is-folded > :not(:first-child) { display: none; }
    .cv-ft--fold .cv-ft__cols { gap: 0 24px; grid-template-columns: minmax(0, 1fr); }
  }
/* /partial:footer-base */
