/* Scoped guide styles; native dialog owns focus containment and Escape behavior. */
.arxis-size-open { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 12px; border: 1px solid #ff6b0080; border-radius: 2px; background: transparent; color: #ff6b00; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color .2s,background .2s; }
.arxis-size-open:hover { border-color: #ff6b00; background: #ff6b0010; }
.arxis-product-page .variations th.arxis-size-choice-label { display: flex !important; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.arxis-size-applied { margin: 0 0 20px; color: #b8bbc2; font-size: 13px; line-height: 1.6; }
body.arxis-size-modal-open { overflow: hidden; }
.arxis-size-dialog { box-sizing: border-box; width: min(940px,calc(100% - 32px)); max-width: 940px; max-height: calc(100dvh - 32px); padding: clamp(24px,4vw,40px); border: 1px solid #ffffff24; border-radius: 6px; color: #fff; background: #101114; font-family: Arial,Helvetica,sans-serif; color-scheme: dark; overflow-y: auto; overscroll-behavior: contain; }
.arxis-size-dialog *, .arxis-size-dialog *::before, .arxis-size-dialog *::after { box-sizing: border-box; }
.arxis-size-dialog[open] { animation: arxis-size-appear .2s ease-out; }
.arxis-size-dialog::backdrop { background: #000b; backdrop-filter: blur(5px); }
.arxis-size-dialog button, .arxis-size-dialog input { font: inherit; }
.arxis-size-dialog [hidden], .arxis-size-applied[hidden], .arxis-size-open[hidden] { display: none !important; }
.arxis-size-dialog button { cursor: pointer; }
.arxis-size-dialog button:disabled { opacity: .4; cursor: default; }
.arxis-size-dialog :is(button,input):focus-visible, .arxis-size-open:focus-visible { outline: 2px solid #ff6b00; outline-offset: 4px; }
.arxis-size-close { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border: 0; background: transparent; color: #aeb1b8; font-size: 30px !important; }
.arxis-size-close:hover { color: #ff6b00; }
.arxis-size-heading { padding-right: 32px; margin-bottom: 28px; }
.arxis-size-heading > p:first-child { margin: 0 0 14px; font-size: 10px; letter-spacing: .18em; font-weight: 700; color: #ff6b00; }
.arxis-size-heading h2 { margin: 0 0 14px; font-size: clamp(26px,4vw,38px); letter-spacing: -.035em; line-height: 1.1; }
.arxis-size-heading > p:last-child { margin: 0; font-size: 14px; line-height: 1.6; color: #aeb1b8; }
.arxis-size-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(24px,4vw,48px); }
.arxis-size-visual { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; padding: 12px 20px 20px; border-right: 1px solid #ffffff14; background: radial-gradient(ellipse at center,#ffffff05,transparent 70%); }
.arxis-size-art { width: 100%; max-width: 280px; }
.arxis-size-art svg { display: block; width: 100%; height: 300px; overflow: visible; }
.arxis-size-art [data-person] { transform-origin: 160px 340px; transform: scaleY(var(--body-height,1)); transition: transform .18s ease-out; }
.arxis-size-art :is([data-chest],[data-hips],[data-head],[data-belt]) { transform-box: view-box; transform-origin: 160px 160px; transition: transform .18s ease-out; }
.arxis-size-art[data-mode$="_top"] [data-chest], .arxis-size-art[data-mode$="_bottom"] [data-hips], .arxis-size-art[data-mode="head"] [data-head], .arxis-size-art[data-mode="belt"] [data-belt] { transform: scaleX(var(--body-width,1)); }
.arxis-size-measure-label { color: #fff; font-size: 13px; margin: 16px 0 8px; }
.arxis-size-hint { margin: 0; max-width: 280px; text-align: center; color: #aeb1b8; font-size: 12px; line-height: 1.65; }
.arxis-size-controls { min-width: 0; }
.arxis-size-gender { display: flex; gap: 8px; margin-bottom: 28px; }
.arxis-size-gender button { flex: 1; min-height: 44px; border: 1px solid #ffffff24; border-radius: 2px; background: #181a1e; color: #b8bbc2; font-size: 13px; }
.arxis-size-gender button[aria-pressed="true"] { border-color: #ff6b00; color: #ff6b00; background: #ff6b000a; }
.arxis-size-field { margin-bottom: 24px; }
.arxis-size-field > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.arxis-size-field label { font-size: 13px; color: #d1d3d8; }
.arxis-size-field input[type="number"] { min-height: 44px; width: 84px; max-width: 100%; padding: 8px 10px; border: 1px solid #ffffff24; border-radius: 2px; color: #fff; background: #181a1e; font-size: 16px; }
.arxis-size-field input[type="range"] { appearance: none; -webkit-appearance: none; width: 100%; height: 24px; margin: 0; background: transparent; accent-color: #ff6b00; cursor: pointer; }
.arxis-size-field input[type="range"]::-webkit-slider-runnable-track { height: 3px; background: linear-gradient(to right,#ff6b00 var(--range-progress,50%),#373a40 var(--range-progress,50%)); }
.arxis-size-field input[type="range"]::-moz-range-track { height: 3px; background: #373a40; }
.arxis-size-field input[type="range"]::-moz-range-progress { height: 3px; background: #ff6b00; }
.arxis-size-field input[type="range"]::-webkit-slider-thumb { appearance: none; width: 18px; height: 18px; margin-top: -7.5px; background: #ff6b00; border: 3px solid #101114; border-radius: 50%; box-shadow: 0 0 0 1px #ff6b00; }
.arxis-size-field input[type="range"]::-moz-range-thumb { width: 14px; height: 14px; background: #ff6b00; border: 2px solid #101114; border-radius: 50%; }
.arxis-size-range-labels { display: flex; justify-content: space-between; margin-top: 4px; font-size: 10px; color: #8b909b; }
.arxis-size-result { padding-block: 20px; border-top: 1px solid #ffffff14; }
.arxis-size-result > span { display: block; color: #aeb1b8; font-size: 12px; margin-bottom: 8px; }
.arxis-size-result-value { display: block; color: #fff; font-size: clamp(26px,4vw,34px); font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; }
.arxis-size-result-note { margin: 12px 0 0; font-size: 12px; line-height: 1.6; color: #aeb1b8; }
.arxis-size-retry { margin-top: 12px; border: 0; border-bottom: 1px solid #ff6b00; padding: 4px 0; background: transparent; color: #ff6b00; font-size: 12px !important; }
.arxis-size-apply { display: flex; justify-content: space-between; align-items: center; gap: 16px; width: 100%; min-height: 52px; padding: 12px 18px; border: 0; border-radius: 2px; background: #ff6b00; color: #101114; font-size: 14px !important; font-weight: 700 !important; }
.arxis-size-apply:hover:not(:disabled) { background: #ff8126; }
.arxis-size-footnote { margin: 14px 0 0; font-size: 10px; line-height: 1.6; color: #8b909b; }
@keyframes arxis-size-appear { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media(max-width:650px) {
 .arxis-size-dialog { width: calc(100% - 20px); max-height: calc(100dvh - 20px); padding: 24px 20px; }
 .arxis-size-heading { margin-bottom: 20px; }
 .arxis-size-layout { grid-template-columns: minmax(0,1fr); gap: 20px; }
 .arxis-size-visual { border-right: 0; border-bottom: 1px solid #ffffff14; padding: 0 0 20px; }
 .arxis-size-art svg { height: 190px; }
 .arxis-size-measure-label { margin-top: 6px; }
 .arxis-size-hint { max-width: 100%; font-size: 11px; }
 .arxis-size-gender { margin-bottom: 20px; }
}
@media(prefers-reduced-motion:reduce) { .arxis-size-dialog, .arxis-size-dialog *, .arxis-size-open { animation: none !important; transition: none !important; } }
