/* 6ix Pet Studio v2 — only the v2-only parts. Everything else is the live Studio (studio.css) and PDP (pdp.css).
   Tokens only (no hex apart from #fff), square corners, every button restates hover/focus/active (Kadence trap).
   Loaded only when the sixm-studio-v2 gate renders v2. */

/* Lettering fonts for the print (self-hosted latin + latin-ext, OFL / Apache-2.0; licences beside the files).
   Namespaced "S6M2 …" so the theme's UI fonts are never touched. */
@font-face{font-family:'S6M2 Abril Fatface';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/abril-fatface/abril-fatface-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Abril Fatface';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/abril-fatface/abril-fatface-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Anton';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/anton/anton-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Anton';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/anton/anton-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Manufacturing Consent';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/manufacturing-consent/manufacturing-consent-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Manufacturing Consent';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/manufacturing-consent/manufacturing-consent-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Graduate';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/graduate/graduate-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Sedgwick Ave Display';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/sedgwick-ave-display/sedgwick-ave-display-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Sedgwick Ave Display';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/sedgwick-ave-display/sedgwick-ave-display-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Cherry Bomb One';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/cherry-bomb-one/cherry-bomb-one-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Cherry Bomb One';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/cherry-bomb-one/cherry-bomb-one-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Yellowtail';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/yellowtail/yellowtail-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Yellowtail';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/yellowtail/yellowtail-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Metal Mania';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/metal-mania/metal-mania-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Metal Mania';font-style:normal;font-weight:400;font-display:block;src:url(../studio-v2/fonts/metal-mania/metal-mania-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Pixelify Sans';font-style:normal;font-weight:700;font-display:block;src:url(../studio-v2/fonts/pixelify-sans/pixelify-sans-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Pixelify Sans';font-style:normal;font-weight:700;font-display:block;src:url(../studio-v2/fonts/pixelify-sans/pixelify-sans-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 JetBrains Mono';font-style:normal;font-weight:700;font-display:block;src:url(../studio-v2/fonts/jetbrains-mono/jetbrains-mono-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 JetBrains Mono';font-style:normal;font-weight:700;font-display:block;src:url(../studio-v2/fonts/jetbrains-mono/jetbrains-mono-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'S6M2 Inter';font-style:normal;font-weight:700 900;font-display:block;src:url(../studio-v2/fonts/inter/inter-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'S6M2 Inter';font-style:normal;font-weight:700 900;font-display:block;src:url(../studio-v2/fonts/inter/inter-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ---------- base / Kadence trap ---------- */
.s6m-sv2 [hidden] { display: none !important; }
.s6m-sv2 button, .s6m-sv2 button:hover, .s6m-sv2 button:focus, .s6m-sv2 button:active,
.s6m-sv2-review button, .s6m-sv2-review button:hover, .s6m-sv2-review button:focus, .s6m-sv2-review button:active,
.s6m-sv2 .s6m-modal button, .s6m-sv2 .s6m-modal button:hover, .s6m-sv2 .s6m-modal button:focus, .s6m-sv2 .s6m-modal button:active { border-radius: 0; box-shadow: none; }
.s6m-sv2 :where(a, button, input, select, textarea, summary, canvas):focus-visible { outline: 2px solid var(--6m-ink); outline-offset: 2px; }
.s6m-sv2 .s6m-customizer__subtitle { max-width: 520px; }
.s6m-sv2-note { text-align: center; color: var(--6m-muted); font: 12px/1.5 var(--6m-sans); margin: -12px 0 18px; }
.s6m-sv2-muted { color: var(--6m-muted); font: 11px var(--6m-mono); letter-spacing: .08em; }
.s6m-sv2-help { color: var(--6m-muted); font: 13px/1.5 var(--6m-sans); margin: 8px 0 0; }
.s6m-sv2-help:empty { display: none; }
.s6m-sv2-preview-strip { position: relative; z-index: 12; padding: 8px 18px; background: var(--6m-bg-3); color: var(--6m-ink); font: 600 11px var(--6m-mono); letter-spacing: .14em; text-align: center; }

/* ghost / link buttons in the v2 look */
.s6m-sv2 .s6m-sv2-ghost, .s6m-sv2-review .s6m-sv2-ghost,
.s6m-sv2 .s6m-sv2-ghost:hover, .s6m-sv2-review .s6m-sv2-ghost:hover,
.s6m-sv2 .s6m-sv2-ghost:focus, .s6m-sv2-review .s6m-sv2-ghost:focus,
.s6m-sv2 .s6m-sv2-ghost:active, .s6m-sv2-review .s6m-sv2-ghost:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2-ghost { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 12px; border: 1px solid var(--6m-line); font: 600 11px var(--6m-mono); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.s6m-sv2 .s6m-sv2-ghost:hover, .s6m-sv2-review .s6m-sv2-ghost:hover { border-color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-ghost.is-danger:hover, .s6m-sv2 .s6m-sv2-ghost.is-danger:focus { color: var(--6m-signal); border-color: var(--6m-signal); }
.s6m-sv2 .s6m-sv2-ghost[aria-pressed="true"], .s6m-sv2 .s6m-sv2-ghost[aria-pressed="true"]:hover, .s6m-sv2 .s6m-sv2-ghost[aria-pressed="true"]:focus { background: var(--6m-ink); color: #fff; border-color: var(--6m-ink); }
.s6m-sv2-ghost:disabled { opacity: .35; cursor: not-allowed; }
.s6m-sv2 .s6m-sv2-link, .s6m-sv2 .s6m-sv2-link:hover, .s6m-sv2 .s6m-sv2-link:focus, .s6m-sv2 .s6m-sv2-link:active,
.s6m-sv2-review .s6m-sv2-link, .s6m-sv2-review .s6m-sv2-link:hover, .s6m-sv2-review .s6m-sv2-link:focus, .s6m-sv2-review .s6m-sv2-link:active { background: transparent; color: var(--6m-ink); }
.s6m-sv2-link { border: 0; padding: 6px 0; min-height: 32px; font: 11px var(--6m-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.s6m-sv2 .s6m-customizer__add-btn:hover, .s6m-sv2 .s6m-customizer__add-btn:focus, .s6m-sv2 .s6m-customizer__add-btn:active { background: var(--6m-ink); color: #fff; }
.s6m-sv2 .s6m-customizer__add-btn:disabled { background: var(--6m-line); border-color: var(--6m-line); color: var(--6m-muted); cursor: not-allowed; opacity: 1; }
.s6m-sv2 .s6m-customizer__cta:not(:disabled):hover, .s6m-sv2 .s6m-customizer__cta:not(:disabled):focus, .s6m-sv2 .s6m-customizer__cta:not(:disabled):active,
.s6m-sv2-review .s6m-customizer__cta:not(:disabled):hover, .s6m-sv2-review .s6m-customizer__cta:not(:disabled):focus, .s6m-sv2-review .s6m-customizer__cta:not(:disabled):active { background: var(--6m-ink); color: #fff; }
.s6m-sv2 .s6m-customizer__cta--ghost:not(:disabled):hover, .s6m-sv2 .s6m-customizer__cta--ghost:not(:disabled):focus, .s6m-sv2 .s6m-customizer__cta--ghost:not(:disabled):active,
.s6m-sv2-review .s6m-customizer__cta--ghost, .s6m-sv2-review .s6m-customizer__cta--ghost:not(:disabled):hover, .s6m-sv2-review .s6m-customizer__cta--ghost:not(:disabled):focus { background: transparent; color: var(--6m-ink); border-color: var(--6m-line); }
.s6m-sv2 .s6m-customizer__garment-btn:hover, .s6m-sv2 .s6m-customizer__garment-btn:focus, .s6m-sv2 .s6m-customizer__garment-btn:active,
.s6m-sv2 .s6m-customizer__zone-btn:hover, .s6m-sv2 .s6m-customizer__zone-btn:focus, .s6m-sv2 .s6m-customizer__zone-btn:active,
.s6m-sv2 .s6m-customizer__size:hover, .s6m-sv2 .s6m-customizer__size:focus, .s6m-sv2 .s6m-customizer__size:active { background: transparent; color: var(--6m-ink); }
.s6m-sv2 .s6m-customizer__garment-btn.is-active, .s6m-sv2 .s6m-customizer__garment-btn.is-active:hover, .s6m-sv2 .s6m-customizer__garment-btn.is-active:focus,
.s6m-sv2 .s6m-customizer__zone-btn.is-active, .s6m-sv2 .s6m-customizer__zone-btn.is-active:hover, .s6m-sv2 .s6m-customizer__zone-btn.is-active:focus,
.s6m-sv2 .s6m-customizer__size.is-active, .s6m-sv2 .s6m-customizer__size.is-active:hover, .s6m-sv2 .s6m-customizer__size.is-active:focus { background: var(--6m-ink); color: #fff; }
.s6m-sv2 .s6m-customizer__size.is-unavailable { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.s6m-sv2 .s6m-tool:hover, .s6m-sv2 .s6m-tool:focus, .s6m-sv2 .s6m-tool:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2 .s6m-tool:hover:not(:disabled) { background: var(--6m-bg-2); border-color: var(--6m-ink); }
.s6m-sv2 .s6m-tool.is-active, .s6m-sv2 .s6m-tool.is-active:hover, .s6m-sv2 .s6m-tool.is-active:focus { background: var(--6m-ink); color: #fff; border-color: var(--6m-ink); }
.s6m-sv2 .s6m-tool[data-6m2-tool="again"]:hover:not(:disabled), .s6m-sv2 .s6m-tool[data-6m2-tool="delete"]:hover:not(:disabled) { color: var(--6m-signal); border-color: var(--6m-signal); }
.s6m-sv2 .s6m-customizer__swatch, .s6m-sv2 .s6m-customizer__swatch:hover, .s6m-sv2 .s6m-customizer__swatch:focus, .s6m-sv2 .s6m-customizer__swatch:active { background: var(--swatch-color); }
.s6m-sv2 .s6m-customizer__swatch.is-active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--6m-ink); }
.s6m-sv2 .sixm-chip, .s6m-sv2 .sixm-chip:hover, .s6m-sv2 .sixm-chip:focus, .s6m-sv2 .sixm-chip:active { background: #fff; color: var(--6m-ink); border-radius: 0; box-shadow: none; }
.s6m-sv2 .sixm-chip.sixm-chip--dark, .s6m-sv2 .sixm-chip.sixm-chip--dark:hover, .s6m-sv2 .sixm-chip.sixm-chip--dark:focus { background: var(--6m-ink); color: #fff; border-color: var(--6m-ink); }
.s6m-sv2 .sixm-chip { cursor: pointer; }
.s6m-sv2 .s6m-customizer__trust { list-style: none; }

/* restoring the on-device draft: a loading line instead of a flash of the empty studio. The animation un-hides
   the studio after 6 s even if the script never ran (no permanent blank page). */
.s6m-sv2-loading { display: none; }
.s6m-sv2--loading .s6m-sv2-loading { display: block; margin: 0 0 16px; text-align: center; color: var(--6m-muted); font: 600 11px var(--6m-mono); letter-spacing: .14em; }
.s6m-sv2--loading .s6m-customizer__cols, .s6m-sv2--loading .s6m-customizer__garments { visibility: hidden; animation: s6m-sv2-unhide 0s linear 6s forwards; }
@keyframes s6m-sv2-unhide { to { visibility: visible; } }

/* ---------- editor column (desktop keeps the live 3-column grid) ---------- */
@media (min-width: 900px) { .s6m-sv2-editor { display: contents; } }
.s6m-sv2-stagewrap .s6m-customizer__stage { touch-action: none; }
.s6m-sv2-view { position: absolute; inset: 0; transform-origin: 0 0; transition: transform .2s ease; }
.s6m-sv2 .s6m-customizer__zone { touch-action: none; }
.s6m-sv2 .s6m-customizer__zone canvas { cursor: grab; }
.s6m-sv2 .s6m-customizer__zone canvas:active { cursor: grabbing; }
.s6m-sv2-hints { position: absolute; inset: 0; pointer-events: none; }
.s6m-sv2-hint { position: absolute; transform: translate(-50%, 34px); white-space: nowrap; padding: 3px 6px; background: rgba(255, 255, 255, .86); color: var(--6m-muted); font: 9px var(--6m-mono); letter-spacing: .12em; text-transform: uppercase; }
.s6m-sv2-hint.is-dark { background: rgba(10, 10, 10, .6); color: #fff; }
.s6m-sv2-hint.is-example { transform: translate(-50%, 6px); }
.s6m-sv2-guides { position: absolute; inset: 0; pointer-events: none; }
.s6m-sv2-guides i { position: absolute; background: rgb(196 30 30); }
.s6m-sv2-guides i[data-6m2-guide="v"] { left: 50%; top: 0; bottom: 0; width: 1px; }
.s6m-sv2-guides i[data-6m2-guide="h"] { top: 50%; left: 0; right: 0; height: 1px; }
.s6m-sv2-sel { position: absolute; left: 0; top: 0; border: 1px solid rgb(196 30 30); pointer-events: none; transform-origin: 50% 50%; }
.s6m-sv2-sel i { position: absolute; width: 12px; height: 12px; background: rgb(196 30 30); border: 1px solid var(--6m-ink); pointer-events: auto; touch-action: none; }
.s6m-sv2-sel i::after { content: ""; position: absolute; inset: -12px; }
.s6m-sv2-sel [data-6m2-handle="nw"] { left: -7px; top: -7px; cursor: nwse-resize; }
.s6m-sv2-sel [data-6m2-handle="ne"] { right: -7px; top: -7px; cursor: nesw-resize; }
.s6m-sv2-sel [data-6m2-handle="sw"] { left: -7px; bottom: -7px; cursor: nesw-resize; }
.s6m-sv2-sel [data-6m2-handle="se"] { right: -7px; bottom: -7px; cursor: nwse-resize; }
.s6m-sv2-sel [data-6m2-handle="rot"] { left: 50%; top: -30px; margin-left: -6px; cursor: grab; }
.s6m-sv2-sel [data-6m2-handle="rot"]::before { content: ""; position: absolute; left: 5px; top: 11px; width: 1px; height: 18px; background: rgb(196 30 30); }
.s6m-sv2-drop { position: absolute; inset: 6px; display: flex; align-items: center; justify-content: center; border: 2px dashed var(--6m-signal); background: rgba(255, 255, 255, .82); color: var(--6m-signal); font: 700 12px var(--6m-mono); letter-spacing: .14em; pointer-events: none; }
.s6m-sv2 .s6m-customizer__stage.is-zoomed .s6m-sv2-hint { display: none; }
.s6m-sv2-mini { display: none; }

/* selected-item toolbar + dpi meter */
.s6m-sv2-photo-tools { margin-top: 10px; }
.s6m-sv2-photo-tools__row { display: flex; flex-wrap: wrap; gap: 10px 14px; justify-content: center; align-items: flex-end; }
.s6m-sv2-tg { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.s6m-sv2-tg__cap { font: 9px var(--6m-mono); letter-spacing: .12em; color: var(--6m-muted); }
.s6m-sv2-tg__btns { display: flex; }
.s6m-sv2-tg__btns button + button { margin-left: -1px; }
.s6m-sv2-tg--acts { flex-direction: row; gap: 4px; }
@media (min-width: 900px) { .s6m-sv2-tg--move { display: none; } }
.s6m-sv2 .s6m-sv2-photo-tools button, .s6m-sv2 .s6m-sv2-photo-tools button:hover, .s6m-sv2 .s6m-sv2-photo-tools button:focus, .s6m-sv2 .s6m-sv2-photo-tools button:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2-photo-tools button { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 6px 8px; border: 1px solid var(--6m-line); font: 10px var(--6m-mono); letter-spacing: .12em; cursor: pointer; }
.s6m-sv2-photo-tools button svg { display: block; }
.s6m-sv2 .s6m-sv2-photo-tools button:hover { border-color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-photo-tools button.is-danger:hover { color: var(--6m-signal); border-color: var(--6m-signal); }
.s6m-sv2-meter { margin: 8px 0 0; text-align: center; font: 600 10px var(--6m-mono); letter-spacing: .12em; }
.s6m-sv2-meter::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; vertical-align: 0; background: var(--color-success); }
.s6m-sv2-meter.is-amber::before { background: var(--color-lowstock); }
.s6m-sv2-meter.is-red::before { background: var(--6m-signal); }

/* step chips (phones) */
.s6m-sv2-chips { display: none; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 8px 0 2px; }
.s6m-sv2-chips::-webkit-scrollbar { display: none; }
.s6m-sv2-chips .sixm-chip { flex: 0 0 auto; min-height: 36px; }

/* ---------- steps ---------- */
.s6m-sv2-step { display: block; border-top: 1px solid var(--6m-line); padding: 18px 0 22px; }
.s6m-sv2-step__label { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin: 0 0 12px; color: var(--6m-ink); font: 400 11px var(--6m-mono); letter-spacing: .14em; text-transform: uppercase; list-style: none; cursor: default; }
.s6m-sv2-step__n { color: var(--6m-signal); font-style: normal; margin-right: 2px; }
.s6m-sv2-step__label::-webkit-details-marker { display: none; }
.s6m-sv2-step__label b { color: var(--6m-muted); font-weight: 400; }
.s6m-sv2-step__label em { color: var(--6m-muted); font-style: normal; font-weight: 400; }
.s6m-sv2-fold > summary { cursor: pointer; }
.s6m-sv2-fold > summary::after { content: "−"; color: var(--6m-ink); font: 600 14px var(--6m-mono); }
.s6m-sv2-fold:not([open]) > summary::after { content: "+"; }
.s6m-sv2-fold:not([open]) > summary { margin: 0; }
.s6m-sv2-summary { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--6m-muted); font-weight: 400; text-align: right; }
.s6m-sv2-fold[open] .s6m-sv2-summary { display: none; }
.s6m-sv2 [data-6m2-step="color"] { padding-bottom: 4px; }
.s6m-sv2 .s6m-customizer__field-label b { font-weight: 400; color: var(--6m-muted); }
.s6m-sv2-sub { margin: 16px 0 0; }
.s6m-sv2-sub__label { display: block; margin: 0 0 8px; color: var(--6m-ink); font: 11px var(--6m-mono); letter-spacing: .14em; text-transform: uppercase; }
.s6m-sv2-sub--pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.s6m-sv2-chipline { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.s6m-sv2-chipline:empty { display: none; }

/* 01 design */
.s6m-sv2-collection { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.s6m-sv2 .s6m-sv2-collection .sixm-chip { min-height: 40px; }
.s6m-sv2 .s6m-sv2-collection .sixm-chip[aria-pressed="true"], .s6m-sv2 .s6m-sv2-collection .sixm-chip[aria-pressed="true"]:hover, .s6m-sv2 .s6m-sv2-collection .sixm-chip[aria-pressed="true"]:focus { background: var(--6m-ink); color: #fff; border-color: var(--6m-ink); }
.s6m-sv2-designs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.s6m-sv2 .s6m-sv2-design, .s6m-sv2 .s6m-sv2-design:hover, .s6m-sv2 .s6m-sv2-design:focus, .s6m-sv2 .s6m-sv2-design:active { background: var(--6m-bg-2); color: var(--6m-ink); }
.s6m-sv2-design { position: relative; display: block; padding: 3px; border: 1px solid var(--6m-line); cursor: pointer; text-align: center; }
/* example pets on a tile (preview only): one small tag, the stage hint's type */
.s6m-sv2-design__ex { position: absolute; top: 6px; left: 6px; padding: 2px 4px; background: rgba(255, 255, 255, .86); color: var(--6m-muted); font: 7px/1 var(--6m-mono); font-style: normal; letter-spacing: .12em; pointer-events: none; }
.s6m-sv2-design__ex[hidden] { display: none; }
.s6m-sv2-design canvas { display: block; width: 100%; height: auto; aspect-ratio: 380 / 460; }
.s6m-sv2-design span { display: block; min-height: 24px; padding: 4px 1px 1px; font: 9px/1.2 var(--6m-mono); letter-spacing: .06em; }
.s6m-sv2 .s6m-sv2-design:hover { border-color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-design[aria-pressed="true"], .s6m-sv2 .s6m-sv2-design[aria-pressed="true"]:hover, .s6m-sv2 .s6m-sv2-design[aria-pressed="true"]:focus { border-color: var(--6m-ink); box-shadow: inset 0 0 0 1px var(--6m-ink); background: #fff; }
.s6m-sv2 .s6m-sv2-design[aria-pressed="true"] span { background: var(--6m-ink); color: #fff; }

/* 02 photos */
.s6m-sv2-photos { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.s6m-sv2-photos:empty { display: none; }
.s6m-sv2 .s6m-sv2-photo, .s6m-sv2 .s6m-sv2-photo:hover, .s6m-sv2 .s6m-sv2-photo:focus, .s6m-sv2 .s6m-sv2-photo:active { background: var(--6m-bg-2); color: var(--6m-ink); }
.s6m-sv2-photo { position: relative; width: 72px; padding: 0 0 22px; border: 1px solid var(--6m-line); cursor: pointer; }
.s6m-sv2-photo canvas { display: block; width: 70px; height: 70px; }
.s6m-sv2-photo.is-sel { border-color: var(--6m-ink); box-shadow: 0 0 0 1px var(--6m-ink); }
.s6m-sv2-photo.is-over { opacity: .45; }
.s6m-sv2-photo.is-add { min-height: 94px; font: 400 26px var(--6m-mono); color: var(--6m-muted); padding: 0; }
.s6m-sv2-photo.is-pending { min-height: 94px; display: flex; align-items: center; justify-content: center; }
.s6m-sv2-photo__step { position: absolute; left: 0; right: 0; bottom: 0; padding: 3px 2px; font: 7.5px/1.2 var(--6m-mono); letter-spacing: .04em; text-align: center; color: var(--6m-ink); background: #fff; border-top: 1px solid var(--6m-line); overflow: hidden; }
.s6m-sv2-photo .s6m-sv2-dot { position: absolute; top: 4px; right: 4px; }
.s6m-sv2-dot { display: inline-block; width: 8px; height: 8px; background: var(--color-success); border: 1px solid #fff; }
.s6m-sv2-dot.is-amber { background: var(--color-lowstock); }
.s6m-sv2-dot.is-red { background: var(--6m-signal); }
.s6m-sv2-dot.is-busy { background: var(--6m-ink); animation: s6m-sv2-blink 1s steps(2) infinite; }
@keyframes s6m-sv2-blink { 50% { opacity: .2; } }
.s6m-sv2-add { width: 100%; min-height: 48px; }
.s6m-sv2-photo-panel { margin-top: 12px; padding: 12px; border: 1px solid var(--6m-line); background: var(--6m-bg-3); }
.s6m-sv2-photo-panel__line { margin: 0 0 8px; font: 600 11px var(--6m-mono); letter-spacing: .1em; }
.s6m-sv2-photo-panel__row { display: flex; flex-wrap: wrap; gap: 6px; }
.s6m-sv2-notes p { margin: 8px 0 0; color: var(--6m-muted); font: 13px/1.5 var(--6m-sans); }

/* free design layers */
.s6m-sv2-layers { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
.s6m-sv2-layers:empty { display: none; }
.s6m-sv2-layer { display: flex; gap: 6px; align-items: stretch; }
.s6m-sv2 .s6m-sv2-layer__name, .s6m-sv2 .s6m-sv2-layer__name:hover, .s6m-sv2 .s6m-sv2-layer__name:focus, .s6m-sv2 .s6m-sv2-layer__name:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2-layer__name { flex: 1; min-width: 0; min-height: 44px; padding: 8px 12px; border: 1px solid var(--6m-line); text-align: left; font: 11px var(--6m-mono); letter-spacing: .08em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.s6m-sv2-layer.is-sel .s6m-sv2-layer__name { border-color: var(--6m-ink); box-shadow: inset 0 0 0 1px var(--6m-ink); }

/* 03 text */
.s6m-sv2-field { margin: 0 0 12px; }
.s6m-sv2 input[type].s6m-sv2-input, .s6m-sv2 input[type].s6m-sv2-input:hover, .s6m-sv2 input[type].s6m-sv2-input:focus, .s6m-sv2 input[type].s6m-sv2-input:active { display: block; width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--6m-line); border-radius: 0; background: #fff; color: var(--6m-ink); font: 16px var(--6m-sans); box-shadow: none; box-sizing: border-box; }
.s6m-sv2 input[type].s6m-sv2-input:focus { outline: none; border-color: var(--6m-ink); }
.s6m-sv2 input[type].s6m-sv2-input:disabled { background: var(--6m-bg-2); color: var(--6m-muted); }
.s6m-sv2 input[type].s6m-sv2-input::placeholder { color: var(--6m-muted); opacity: 1; }
.s6m-sv2 .s6m-sv2-years input[type].s6m-sv2-input { text-align: center; }
/* range sliders: square ink thumb on a hairline (no Kadence grey-blue box) */
.s6m-sv2 input[type=range], .s6m-sv2 input[type=range]:hover, .s6m-sv2 input[type=range]:focus, .s6m-sv2 input[type=range]:active { -webkit-appearance: none; appearance: none; width: 100%; height: 24px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.s6m-sv2 input[type=range]::-webkit-slider-runnable-track { height: 2px; border: 0; border-radius: 0; background: var(--6m-ink); }
.s6m-sv2 input[type=range]::-moz-range-track { height: 2px; border: 0; border-radius: 0; background: var(--6m-ink); }
.s6m-sv2 input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin-top: -8px; border: 2px solid var(--6m-ink); border-radius: 0; background: #fff; box-shadow: none; }
.s6m-sv2 input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border: 2px solid var(--6m-ink); border-radius: 0; background: #fff; box-shadow: none; }
/* the hue slider shows the hue wheel (art colour control; the gradient is set inline by ui.js) */
.s6m-sv2 input[type=range][data-6m2-hue] { height: 16px; border: 1px solid var(--6m-line); }
.s6m-sv2 input[type=range][data-6m2-hue]::-webkit-slider-runnable-track { height: 14px; background: transparent; }
.s6m-sv2 input[type=range][data-6m2-hue]::-moz-range-track { height: 14px; background: transparent; }
.s6m-sv2 input[type=range][data-6m2-hue]::-webkit-slider-thumb { margin-top: -2px; }
.s6m-sv2 .s6m-customizer__field-value.is-max { color: var(--6m-signal); font-weight: 600; }
.s6m-sv2-fieldnote { margin: 6px 0 0; color: var(--6m-muted); font: 12px/1.45 var(--6m-sans); }
.s6m-sv2-fieldnote:empty { display: none; }
.s6m-sv2-years__row { display: grid; grid-template-columns: 1fr auto 1fr auto; gap: 8px; align-items: center; }
/* the Driver's Licence card's own lines (TEXT step): one row per card row, NAME + SIGNATURE, then MORE LINES */
.s6m-sv2-card { margin: 4px 0 12px; padding-top: 12px; border-top: 1px solid var(--6m-line); }
.s6m-sv2-card__head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 0 0 8px; }
.s6m-sv2-card__head .s6m-sv2-sub__label { margin: 0; }
.s6m-sv2-card__more { margin: 4px 0 0; border-top: 1px solid var(--6m-line); }
.s6m-sv2-card__more > summary { padding: 10px 0; cursor: pointer; color: var(--6m-ink); font: 600 11px var(--6m-mono); letter-spacing: .1em; }
.s6m-sv2-card__row { display: flex; gap: 8px; }
.s6m-sv2-card__f { flex: 1 1 0; min-width: 0; }
.s6m-sv2-step.is-card-only > .s6m-sv2-sub, .s6m-sv2-step.is-card-only > .s6m-sv2-target, .s6m-sv2-step.is-card-only > .s6m-sv2-ai { display: none !important; }
[data-6m2-tips-for][hidden] { display: none; }
.s6m-sv2-letters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.s6m-sv2 .s6m-sv2-letter, .s6m-sv2 .s6m-sv2-letter:hover, .s6m-sv2 .s6m-sv2-letter:focus, .s6m-sv2 .s6m-sv2-letter:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2-letter { display: block; padding: 0; border: 1px solid var(--6m-line); cursor: pointer; text-align: center; }
.s6m-sv2-letter canvas { display: block; width: 100%; height: 52px; }
.s6m-sv2-letter span { display: block; padding: 5px 2px; border-top: 1px solid var(--6m-line); font: 9px var(--6m-mono); letter-spacing: .08em; }
.s6m-sv2 .s6m-sv2-letter:hover { border-color: var(--6m-ink); }
.s6m-sv2-letter.is-active { outline: 2px solid var(--6m-ink); outline-offset: -1px; }
.s6m-sv2 .s6m-sv2-letter.is-active span { background: var(--6m-ink); color: #fff; }
.s6m-sv2-letter[aria-disabled="true"] { opacity: .35; cursor: not-allowed; }
.s6m-sv2-colours { display: flex; flex-wrap: wrap; gap: 6px; }
.s6m-sv2 .s6m-sv2-colour, .s6m-sv2 .s6m-sv2-colour:hover, .s6m-sv2 .s6m-sv2-colour:focus, .s6m-sv2 .s6m-sv2-colour:active { background: var(--sw); color: var(--6m-ink); }
.s6m-sv2-colour { width: 28px; height: 28px; padding: 0; border: 1px solid rgba(10, 10, 10, .18); cursor: pointer; }
.s6m-sv2-colour--sm { width: 22px; height: 22px; }
.s6m-sv2-colour.is-active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--6m-ink); }
.s6m-sv2 .s6m-sv2-colour.is-custom, .s6m-sv2 .s6m-sv2-colour.is-custom:hover, .s6m-sv2 .s6m-sv2-colour.is-custom:focus { width: auto; padding: 0 8px; background: #fff; font: 600 9px var(--6m-mono); letter-spacing: .1em; }
.s6m-sv2-colours--sm { margin-top: 8px; }
.s6m-sv2-seg { display: inline-flex; flex-wrap: wrap; }
.s6m-sv2 .s6m-sv2-seg button, .s6m-sv2 .s6m-sv2-seg button:hover, .s6m-sv2 .s6m-sv2-seg button:focus, .s6m-sv2 .s6m-sv2-seg button:active { background: #fff; color: var(--6m-ink); border-radius: 0; box-shadow: none; }
.s6m-sv2 .s6m-sv2-seg button.is-active, .s6m-sv2 .s6m-sv2-seg button.is-active:hover, .s6m-sv2 .s6m-sv2-seg button.is-active:focus { background: var(--6m-ink); color: #fff; }
.s6m-sv2-seg button { min-width: 44px; min-height: 40px; padding: 8px 10px; margin: 0 -1px -1px 0; border: 1px solid var(--6m-line); font: 11px var(--6m-mono); letter-spacing: .1em; cursor: pointer; }
/* ARCH STRENGTH: its own row under SHAPE, with a small mono label */
.s6m-sv2-subrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 8px; }
.s6m-sv2-subrow[hidden] { display: none; }
.s6m-sv2-minilabel { color: var(--6m-muted); font: 9px var(--6m-mono); letter-spacing: .12em; text-transform: uppercase; }
/* OUTLINE / SHADOW: one full-width row each, never wrapping a lone button */
.s6m-sv2-seg--fill { display: flex; flex-wrap: nowrap; width: 100%; }
.s6m-sv2-seg--fill button { flex: 1 1 0; min-width: 0; padding: 8px 4px; }
.s6m-sv2-seg[hidden] { display: none; }
.s6m-sv2-ai__style { margin-top: 10px; }
.s6m-sv2-seg output { display: inline-flex; align-items: center; justify-content: center; min-width: 58px; border: 1px solid var(--6m-line); margin: 0 -1px -1px 0; font: 11px var(--6m-mono); }
.s6m-sv2-target { display: flex; width: 100%; margin-top: 4px; }
.s6m-sv2-target button { flex: 1; }
.s6m-sv2 [data-6m2-seg="aligny"] { margin-top: 6px; }

/* 04 extras */
.s6m-sv2-extras__row { margin: 0 0 14px; }
.s6m-sv2-tiles { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #fff calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #fff calc(100% - 28px), transparent); }
.s6m-sv2-tiles::-webkit-scrollbar { display: none; }
.s6m-sv2-tiles.is-end { -webkit-mask-image: none; mask-image: none; }
@media (min-width: 768px) {
  .s6m-sv2-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); overflow: visible; -webkit-mask-image: none; mask-image: none; }
  .s6m-sv2-tile span { max-width: none; }
  .s6m-sv2-tiles > .s6m-sv2-tile { min-width: 0; overflow-wrap: anywhere; }
}
.s6m-sv2-sub__label--more { margin-top: 12px; }
.s6m-sv2 .s6m-sv2-tile, .s6m-sv2 .s6m-sv2-tile:hover, .s6m-sv2 .s6m-sv2-tile:focus, .s6m-sv2 .s6m-sv2-tile:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2-tile { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; min-width: 64px; min-height: 64px; padding: 6px 8px; border: 1px solid var(--6m-line); font: 9px/1.25 var(--6m-mono); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.s6m-sv2-tile span { max-width: 88px; }
.s6m-sv2-tile--img { width: 64px; padding: 6px; background: var(--6m-bg-2); }
.s6m-sv2-tile--img img { width: 44px; height: 44px; object-fit: contain; }
.s6m-sv2-tile--set { width: 72px; min-height: 72px; }
.s6m-sv2-tile--set img { width: 56px; height: 56px; }
@media (min-width: 768px) { .s6m-sv2 [data-6m2-clusters].s6m-sv2-tiles { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); } .s6m-sv2-tile--img { width: auto; } }
.s6m-sv2 .s6m-sv2-tile:hover { border-color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-tile.is-active, .s6m-sv2 .s6m-sv2-tile.is-active:hover, .s6m-sv2 .s6m-sv2-tile.is-active:focus { border-color: var(--6m-ink); box-shadow: inset 0 0 0 1px var(--6m-ink); background: var(--6m-bg-2); }
.s6m-sv2-ai { margin-top: 16px; padding: 14px; border: 1px solid var(--6m-line); min-width: 0; overflow: hidden; }
.s6m-sv2-ai .s6m-customizer__cta { box-sizing: border-box; max-width: 100%; }
.s6m-sv2-step, .s6m-sv2-sub, .s6m-sv2-extras__row { min-width: 0; }
.s6m-sv2-ai__head { display: flex; align-items: center; gap: 8px; }
.s6m-sv2-ai__head .s6m-sv2-sub__label { margin: 0; flex: 1; }
.s6m-sv2-ai .s6m-sv2-tiles { margin-top: 10px; }
.s6m-sv2-ai .s6m-sv2-input { margin-top: 10px; }
.s6m-sv2-ai .s6m-customizer__cta { margin-top: 10px; }

/* 05 colour + size nudge */
.s6m-sv2-needs { outline: 2px solid var(--6m-signal); outline-offset: 6px; animation: s6m-sv2-needs .45s 2; }
@keyframes s6m-sv2-needs { 50% { outline-offset: 10px; } }

/* ---------- review drawer (cart drawer values) ---------- */
.s6m-sv2-review { position: fixed; inset: 0; z-index: 2147483100; }
.s6m-sv2-review__backdrop { position: absolute; inset: 0; background: rgb(0 0 0 / .15); }
.s6m-sv2-review__panel { position: absolute; top: 0; right: 0; bottom: 0; width: 95vw; max-width: 480px; height: 100dvh; display: flex; flex-direction: column; background: #fff; box-shadow: var(--shadow-drawer); animation: s6m-sv2-in .2s ease; }
@keyframes s6m-sv2-in { from { transform: translateX(100%); } to { transform: none; } }
.s6m-sv2-review__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 25px; border-bottom: 1px solid var(--6m-line); }
.s6m-sv2-review__head h2:focus, .s6m-sv2-done__title:focus { outline: none; }
.s6m-sv2-review__head h2 { margin: 0; font: 400 22px/1.1 var(--6m-display); text-transform: uppercase; letter-spacing: .01em; color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-review__close, .s6m-sv2 .s6m-sv2-review__close:hover, .s6m-sv2 .s6m-sv2-review__close:focus, .s6m-sv2 .s6m-sv2-review__close:active { background: transparent; color: var(--6m-ink); }
.s6m-sv2-review__close { width: 40px; height: 40px; border: 0; font: 400 30px/1 var(--6m-sans); cursor: pointer; }
.s6m-sv2-review__body { flex: 1; overflow-y: auto; padding: 18px 25px 28px; }
.s6m-sv2-review .s6m-tabs__list { display: flex; gap: 20px; border-bottom: 1px solid var(--6m-line); margin-bottom: 12px; overflow-x: auto; }
.s6m-sv2 .s6m-sv2-review .s6m-tabs__tab, .s6m-sv2 .s6m-sv2-review .s6m-tabs__tab:hover, .s6m-sv2 .s6m-sv2-review .s6m-tabs__tab:focus, .s6m-sv2 .s6m-sv2-review .s6m-tabs__tab:active { background: transparent; color: var(--6m-muted); }
.s6m-sv2 .s6m-sv2-review .s6m-tabs__tab.is-active { color: var(--6m-ink); }
.s6m-sv2-review .s6m-tabs__tab { flex: 0 0 auto; padding: 10px 0; border: 0; border-bottom: 2px solid transparent; font: 600 11px var(--6m-mono); letter-spacing: .18em; cursor: pointer; }
.s6m-sv2-review .s6m-tabs__tab.is-active { border-bottom-color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-mock, .s6m-sv2 .s6m-sv2-mock:hover, .s6m-sv2 .s6m-sv2-mock:focus, .s6m-sv2 .s6m-sv2-mock:active { background: var(--6m-bg-2); }
.s6m-sv2-mock { display: block; width: 100%; padding: 0; border: 1px solid var(--6m-line); cursor: zoom-in; }
.s6m-sv2-mock canvas { display: block; width: 100%; height: auto; aspect-ratio: 1; }
.s6m-sv2-ai-note { margin: 6px 0 0; }
.s6m-sv2-checks { margin: 16px 0; }
.s6m-sv2-checks__sum { margin: 0 0 8px; font: 700 11px var(--6m-mono); letter-spacing: .12em; color: var(--color-success); }
.s6m-sv2-checks__sum.is-block { color: var(--6m-signal); }
.s6m-sv2-check { display: flex; align-items: center; gap: 10px; padding: 8px 10px; margin-top: 6px; border: 1px solid var(--6m-line); font: 13px/1.4 var(--6m-sans); }
.s6m-sv2-check.is-block { background: var(--6m-signal-soft); }
.s6m-sv2-check span { flex: 1; }
.s6m-sv2-check__mark { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; background: var(--6m-signal); color: #fff; font: 700 12px var(--6m-mono); font-style: normal; }
.s6m-sv2-review__price { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 10px 0 14px; }
.s6m-sv2-review__name { font: 600 13px/1.4 var(--6m-sans); text-transform: uppercase; letter-spacing: .02em; }
.s6m-sv2-review__sum { margin: -8px 0 14px; text-align: right; color: var(--6m-muted); font: 600 10px var(--6m-mono); letter-spacing: .12em; }
.s6m-sv2-review__sum[hidden] { display: none; }
.s6m-sv2-review .s6m-pdp__price-now { font: 700 24px var(--6m-sans); }
.s6m-sv2-review .s6m-pdp__opt-head { display: flex; justify-content: flex-start; align-items: baseline; gap: 6px; margin-bottom: 10px; font: 11px var(--6m-mono); letter-spacing: .14em; }
.s6m-sv2-review .s6m-pdp__opt-head .s6m-sv2-link { margin-left: auto; }
.s6m-sv2-review .s6m-pdp__sizes { display: grid; grid-template-columns: repeat(auto-fit, minmax(56px, 1fr)); gap: 6px; }
.s6m-sv2 .s6m-sv2-review .s6m-pdp__size, .s6m-sv2 .s6m-sv2-review .s6m-pdp__size:hover, .s6m-sv2 .s6m-sv2-review .s6m-pdp__size:focus, .s6m-sv2 .s6m-sv2-review .s6m-pdp__size:active { background: #fff; color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-review .s6m-pdp__size.is-active, .s6m-sv2 .s6m-sv2-review .s6m-pdp__size.is-active:hover, .s6m-sv2 .s6m-sv2-review .s6m-pdp__size.is-active:focus { background: var(--6m-ink); color: #fff; }
.s6m-sv2-review [data-6m2-more-sizes] { margin-top: 10px; }
.s6m-sv2-rcolours { margin: 14px 0 0; }
.s6m-sv2-rcolours__list { display: flex; flex-wrap: wrap; gap: 8px; }
.s6m-sv2 .s6m-sv2-rcolour, .s6m-sv2 .s6m-sv2-rcolour:hover, .s6m-sv2 .s6m-sv2-rcolour:focus, .s6m-sv2 .s6m-sv2-rcolour:active { background: var(--swatch-color); color: var(--6m-ink); }
.s6m-sv2-rcolour { position: relative; width: 36px; height: 36px; padding: 0; border: 1px solid var(--6m-line); cursor: pointer; }
.s6m-sv2 .s6m-sv2-rcolour.is-active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--6m-ink); }
.s6m-sv2-rcolour b { position: absolute; top: -7px; right: -7px; min-width: 18px; height: 18px; padding: 0 4px; background: var(--6m-ink); color: #fff; font: 700 10px/18px var(--6m-mono); text-align: center; }
.s6m-sv2-qty { display: grid; gap: 6px; margin: 8px 0 0; }
.s6m-sv2-qty__row { display: grid; grid-template-columns: 1fr 44px 48px 44px; align-items: center; gap: 0; border: 1px solid var(--6m-line); padding-left: 12px; font: 12px var(--6m-mono); }
.s6m-sv2-qty__row output { text-align: center; }
.s6m-sv2-qty__row .s6m-sv2-ghost { border-width: 0 0 0 1px; }
.s6m-sv2-printnotes { margin: 14px 0 0; border-top: 1px solid var(--6m-line); padding-top: 12px; }
.s6m-sv2-printnotes summary { display: flex; justify-content: space-between; gap: 10px; cursor: pointer; font: 11px var(--6m-mono); letter-spacing: .14em; list-style: none; }
.s6m-sv2-printnotes summary::-webkit-details-marker { display: none; }
.s6m-sv2-printnotes summary::after { content: "+"; font: 600 14px var(--6m-mono); }
.s6m-sv2-printnotes[open] summary::after { content: "−"; }
.s6m-sv2-printnotes em { color: var(--6m-muted); font-style: normal; }
.s6m-sv2-printnotes textarea { margin-top: 10px; }
.s6m-sv2-review__foot { margin-top: 4px; }
.s6m-sv2-tick { display: flex; gap: 10px; align-items: flex-start; margin: 16px 0 6px; font: 13px/1.5 var(--6m-sans); cursor: pointer; }
.s6m-sv2-tick input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--6m-ink); flex: 0 0 auto; }
.s6m-sv2-loader { margin: 12px 0 0; }
.s6m-sv2-loader ol { list-style: none; margin: 0 0 8px; padding: 0; font: 600 11px/1.8 var(--6m-mono); letter-spacing: .12em; }
.s6m-sv2-loader li.is-done { color: var(--6m-muted); }
.s6m-sv2-loader li.is-done::before { content: "✓ "; }
.s6m-sv2-loader__bar { height: 2px; background: var(--6m-line); }
.s6m-sv2-loader__bar i { display: block; height: 2px; width: 0; background: var(--6m-ink); transition: width .2s; }
.s6m-sv2-done { text-align: center; }
.s6m-sv2-done__title { margin: 4px 0 12px; font: 400 34px/1 var(--6m-display); text-transform: uppercase; }
.s6m-sv2-done__img { display: block; width: 240px; height: 240px; margin: 0 auto 10px; background: var(--6m-bg-2); }
.s6m-sv2-done .s6m-customizer__cta { margin-top: 8px; }

/* sheets (live .s6m-modal) */
.s6m-sv2-tips { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.s6m-sv2-tips figure { margin: 0; text-align: center; }
.s6m-sv2-tips img { width: 100%; height: auto; border: 1px solid var(--6m-line); }
.s6m-sv2-tips figcaption { margin-top: 6px; font: 600 10px var(--6m-mono); letter-spacing: .12em; }
.s6m-sv2-tiplist { margin: 0; padding-left: 18px; font: 13px/1.6 var(--6m-sans); }
.s6m-sv2-crop, .s6m-sv2-sv { display: block; width: 100%; height: auto; border: 1px solid var(--6m-line); touch-action: none; cursor: move; background: var(--6m-bg-2); }
.s6m-sv2-range { display: grid; grid-template-columns: 110px 1fr; align-items: center; gap: 10px; font: 10px var(--6m-mono); letter-spacing: .12em; }
.s6m-sv2-range input[type=range] { width: 100%; }
.s6m-sv2-custom-preview { height: 32px; border: 1px solid var(--6m-line); }

/* toast */
/* 6M Rewards line under the trust lines and in the ADDED sheet: same rule, type and ink as the buy area */
.s6m-sv2-rewards { display: flex; text-align: left; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin-top: 12px; padding: 10px 14px; border: 1px solid var(--6m-line); background: #fff; }
.s6m-sv2-rewards[hidden] { display: none; }
.s6m-sv2-rewards__text { flex: 1 1 220px; margin: 0; color: var(--6m-ink); font-size: 12px; line-height: 1.55; }
.s6m-sv2-rewards__text b { font-weight: 700; }
.s6m-sv2-rewards__star { margin-right: 6px; color: var(--6m-ink); }
.s6m-sv2 .s6m-sv2-rewards__open, .s6m-sv2-review .s6m-sv2-rewards__open { flex: 0 0 auto; white-space: nowrap; }
.s6m-sv2-rewards--done { margin: 4px 0 14px; }
.s6m-sv2-toast { position: fixed; left: 50%; bottom: 96px; z-index: 2147482500; max-width: calc(100vw - 36px); transform: translateX(-50%); padding: 12px 16px; background: var(--6m-ink); color: #fff; font: 600 11px var(--6m-mono); letter-spacing: .12em; text-align: center; box-shadow: var(--shadow-drawer); }

/* ---------- phones: sticky compact stage, chips, bottom bar ---------- */
.s6m-sv2-bar { display: none; }
@media (max-width: 899px) {
  .s6m-sv2 .s6m-customizer__cols { gap: 0; }
  .s6m-sv2 .s6m-customizer__cols { grid-template-columns: minmax(0, 1fr); }
  /* live order: the tool row sits ABOVE the stage and scrolls away; only the stage + step chips stay pinned */
  .s6m-sv2 .s6m-customizer__cols > .s6m-customizer__toolbar { position: static; flex-direction: row; flex-wrap: nowrap; gap: 4px; margin: 0 0 8px; }
  .s6m-sv2 .s6m-customizer__cols > .s6m-customizer__toolbar .s6m-tool { flex: 1 1 0; width: auto; min-width: 44px; height: auto; min-height: 56px; padding: 6px 2px; }
  .s6m-sv2 .s6m-customizer__cols > .s6m-customizer__toolbar .s6m-tool svg { width: 18px; height: 18px; }
  .s6m-sv2 .s6m-customizer__cols > .s6m-customizer__toolbar .s6m-tool span { font-size: 8px; line-height: 1.15; letter-spacing: .06em; text-align: center; }
  .s6m-sv2-editor { position: sticky; top: var(--header-height, 60px); z-index: 5; display: flex; flex-direction: column; min-width: 0; margin: 0 -18px; padding: 6px 18px 0; background: #fff; border-bottom: 1px solid var(--6m-line); box-shadow: 0 -8px 0 #fff; }
  .s6m-sv2-editor > * { min-width: 0; }
  .s6m-sv2 .s6m-customizer__controls { min-width: 0; }
  .s6m-sv2-editor .s6m-customizer__stage-wrap { order: 1; position: static; }
  /* the pinned stack stays under ~46% of the screen: stage ≤ 32vh */
  .s6m-sv2-editor .s6m-customizer__stage { width: min(100%, 32vh, 330px); margin: 0 auto; }
  .s6m-sv2-editor.is-min .s6m-customizer__stage { width: 120px; }
  body.s6m-sv2-typing .s6m-sv2-editor .s6m-customizer__stage { width: min(100%, 180px); }
  .s6m-sv2-editor .s6m-customizer__zone-tabs { margin-top: 6px; }
  .s6m-sv2-mini { display: block; position: absolute; right: 0; top: 0; z-index: 2; min-height: 32px; padding: 4px 8px; border: 1px solid var(--6m-line); font: 600 9px var(--6m-mono); letter-spacing: .1em; cursor: pointer; }
  .s6m-sv2 .s6m-sv2-mini, .s6m-sv2 .s6m-sv2-mini:hover, .s6m-sv2 .s6m-sv2-mini:focus, .s6m-sv2 .s6m-sv2-mini:active { background: #fff; color: var(--6m-ink); }
  .s6m-sv2-stagewrap { position: relative; }
  .s6m-sv2-chips { display: flex; order: 3; gap: 4px; -webkit-mask-image: linear-gradient(90deg, #fff calc(100% - 24px), transparent); mask-image: linear-gradient(90deg, #fff calc(100% - 24px), transparent); }
  .s6m-sv2-chips.is-end { -webkit-mask-image: none; mask-image: none; }
  .s6m-sv2-chips .sixm-chip { flex: 1 0 auto; justify-content: center; padding: 0 7px; font-size: 10px; letter-spacing: .08em; }
  .s6m-sv2-photo-tools { order: 4; margin-top: 4px; }
  .s6m-sv2-photo-tools__row { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; align-items: stretch; gap: 8px; padding-bottom: 4px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #fff calc(100% - 24px), transparent); mask-image: linear-gradient(90deg, #fff calc(100% - 24px), transparent); }
  .s6m-sv2-photo-tools__row::-webkit-scrollbar { display: none; }
  .s6m-sv2-tg { flex: 0 0 auto; }
  .s6m-sv2-tg__cap { display: none; }
  .s6m-sv2-photo-tools button { flex: 0 0 auto; }
  /* phones: SIZE and ALIGN come first so all six ALIGN buttons are on screen without scrolling (drag already moves
     the item; MOVE's arrows sit at the end of the scroller) */
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg { order: 5; }
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg[aria-label="Size"] { order: 1; }
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg[aria-label="Align to the print area"] { order: 2; }
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg[data-6m2-tg="rotate"] { order: 3; }
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg[data-6m2-tg="fit"] { order: 4; }
  .s6m-sv2-photo-tools__row > .s6m-sv2-tg--move { order: 9; }
  .s6m-sv2-photo-tools .s6m-sv2-tg__btns button { min-width: 40px; padding: 6px 4px; }
  .s6m-sv2 .s6m-customizer__controls { padding-top: 16px; }
  .s6m-sv2 .s6m-customizer__controls > .s6m-customizer__cta, .s6m-sv2 .s6m-customizer__controls > .s6m-customizer__status { scroll-margin-bottom: 120px; }
  .s6m-sv2-designs { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .s6m-sv2-review__panel { width: 100vw; max-width: none; }
  .s6m-sv2-review__head { padding: 16px 18px; }
  .s6m-sv2-review__body { padding: 14px 18px 0; }
  .s6m-sv2-review__foot { position: sticky; bottom: 0; z-index: 2; margin: 12px -18px 0; padding: 4px 18px calc(12px + env(safe-area-inset-bottom, 0)); background: #fff; border-top: 1px solid var(--6m-line); box-shadow: 0 -8px 24px rgba(0, 0, 0, .06); }
  .s6m-sv2-review__foot .s6m-sv2-tick { margin-top: 10px; }
}
@media (max-width: 767px) {
  /* shown only while the inline CTA is off screen (ui.js), so a phone never shows two size buttons at once */
  .s6m-sv2-bar.sticky-atc { display: flex; z-index: 90; padding-bottom: calc(12px + env(safe-area-inset-bottom, 0)); }
  .s6m-sv2-bar.sticky-atc:not(.is-visible) { visibility: hidden; transition: transform .3s, visibility 0s .3s; }
  .s6m-sv2-bar .sticky-atc__price strong { font: 700 16px var(--6m-sans); }
  .s6m-sv2-bar .s6m-sv2-barcta { width: auto; margin: 0; }
  .s6m-sv2 .s6m-sv2-bar .s6m-sv2-barcta:disabled, .s6m-sv2 .s6m-sv2-bar .s6m-sv2-barcta:disabled:hover { border-color: var(--6m-line); background: var(--6m-line); color: var(--6m-muted); cursor: not-allowed; opacity: 1; transform: none; }
  /* phones: the site floaters (6M Rewards icon, WhatsApp) would sit on the Studio's own controls and step chips, so
     the Studio page hides the two buttons below 768px (owner can reverse this one rule). The Rewards drawer itself
     stays: the Studio's own 6M Rewards line opens it (ui.js rewardsInit). */
  body.s6m-sv2-page #sixm-launcher #sixm-launcher-btn, body.s6m-sv2-page .s6m-wa { display: none !important; }
  body.s6m-sv2-page .s6m-sv2-toast { bottom: 150px; }
}
/* tablets + desktop: the 6M Rewards launcher and WhatsApp button stay, as small icons stacked in the corner, and the
   Studio keeps a right gutter wide enough for them so they never sit on its tiles and buttons */
@media (min-width: 768px) {
  body.s6m-sv2-page #sixm-launcher { right: 12px; bottom: 16px; }
  body.s6m-sv2-page #sixm-launcher #sixm-launcher-btn { width: 48px; height: 48px; padding: 0; gap: 0; justify-content: center; }
  body.s6m-sv2-page #sixm-launcher .sixm-launcher-label { display: none; }
  body.s6m-sv2-page .s6m-wa { right: 12px; bottom: 76px; width: 48px; height: 48px; }
  body.s6m-sv2-page .s6m-wa .s6m-wa__icon { width: 24px; height: 24px; }
  /* the "Join 6M Rewards" bubble sits to the LEFT of the icon (not above it, where the WhatsApp icon is) */
  body.s6m-sv2-page #sixm-launcher #sixm-nudge { bottom: 2px; right: calc(100% + 10px); }
  body.s6m-sv2-page:has(#sixm-nudge:not([hidden])) .s6m-wa { bottom: 76px; }
  body.s6m-sv2-page .s6m-sv2 .s6m-customizer__inner { padding-right: max(32px, calc(72px - max(0px, (100vw - 1320px) / 2))); }
}
/* the "Join 6M Rewards" bubble only shows while it is clear of the Studio (ui.js rewardsNudge sets the class when it
   overlaps nothing: editor, sticky bar, toast, review or sheet); the Studio's own Rewards line does the promoting */
body.s6m-sv2-page #sixm-launcher #sixm-nudge:not([hidden]) { visibility: hidden; opacity: 0; pointer-events: none; transition: none; }
body.s6m-sv2-page.s6m-sv2-nudge-ok #sixm-launcher #sixm-nudge:not([hidden]) { visibility: visible; opacity: 1; pointer-events: auto; transition: opacity .2s; }
/* its downward tail pointed at the icon above which it no longer sits (docked left on tablets+, no icon on phones) */
body.s6m-sv2-page #sixm-launcher #sixm-nudge::after { display: none; }
@media (max-width: 419px) {
  .s6m-sv2-designs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .s6m-sv2-letters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .s6m-sv2-sub--pair { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .s6m-sv2-view, .s6m-sv2-loader__bar i { transition: none; }
  .s6m-sv2-review__panel, .s6m-sv2-needs, .s6m-sv2-dot.is-busy { animation: none; }
}