.zs-size-setup { margin:24px auto 80px; padding:32px; color:var(--zs-text-main); }
.zs-size-heading { text-align:center; margin:0 auto 28px; max-width:760px; }
.zs-size-heading h1 { color:var(--zs-purple-700); font-size:32px; margin:0 0 14px; }
.zs-size-heading h1 a { color:var(--zs-purple-600); text-decoration:none; }
.zs-size-heading p { color:var(--zs-text-muted); margin:6px 0; }
.zs-size-heading .zs-size-intro { color:var(--zs-purple-700); font-weight:700; font-size:18px; }
.zs-size-methods { display:flex; align-items:stretch; }
.zs-size-method { flex:1; min-width:0; display:flex; flex-direction:column; align-items:stretch; padding:24px 18px; border:1px solid var(--zs-purple-100); border-radius:8px; text-align:center; }
.zs-size-method h2 { font-size:20px; line-height:1.35; color:var(--zs-purple-700); margin:0 0 22px; }
.zs-size-or { align-self:center; padding:8px 14px; color:var(--zs-purple-500); font-weight:700; }
.zs-size-field { margin-bottom:12px; }
.zs-size-field > label { display:block; color:var(--zs-text-muted); font-size:14px; line-height:1.4; margin:0 0 8px; }
.zs-size-input { display:inline-flex; align-items:center; gap:8px; }
.zs-size-input input { width:140px; height:46px; padding:8px 12px; border:1px solid var(--zs-purple-100); border-radius:8px; background:var(--zs-white); color:var(--zs-text-main); font:700 16px/1.5 var(--zs-font-body); text-align:center; }
.zs-size-input span { color:var(--zs-text-muted); font-size:14px; font-weight:700; }
.zs-size-input input::placeholder { color:var(--zs-text-muted); font-size:13px; font-weight:400; opacity:1; }
.zs-size-input input:focus { outline:2px solid var(--zs-purple-400); outline-offset:2px; }
.zs-size-input input[aria-invalid="true"] { border-color:var(--zs-pink-600); }
.zs-size-range { font-size:13px; color:var(--zs-text-muted); margin:6px 0 0; }
.zs-size-error { font-size:13px; color:var(--zs-pink-700); margin:6px 0 0; }
.zs-size-error:empty { display:none; }
.zs-size-status { font-size:13px; color:var(--zs-text-muted); padding:8px; margin:0 0 16px; min-height:38px; border-radius:8px; }
.zs-size-status.is-valid { color:#236b45; background:#f0faf4; }
.zs-size-method > .btn { margin-top:auto; width:100%; }
.zs-size-table-section { margin-top:36px; }
.zs-size-table-section h2 { font-size:24px; text-align:center; color:var(--zs-purple-700); }
.zs-size-table-section > p { max-width:680px; margin:8px auto 20px; text-align:center; color:var(--zs-text-muted); font-size:14px; }
.zs-size-table-scroll { overflow:auto; width:100%; }
.zs-size-table { border-collapse:collapse; width:100%; font-size:13px; }
.zs-size-table th, .zs-size-table td { border:1px solid var(--zs-purple-100); padding:8px 10px; white-space:nowrap; text-align:center; }
.zs-size-table th { background:var(--zs-purple-50); color:var(--zs-purple-700); font-weight:700; }
.zs-size-table tbody th { text-align:left; }
.zs-size-table tbody th:nth-child(2) { min-width:150px; max-width:200px; white-space:normal; }
.zs-size-table .is-column-highlighted { background:var(--zs-purple-50); }
.zs-size-table thead .is-column-highlighted { background:var(--zs-purple-100); }
.zs-size-table-link { margin-top:14px; }
.zs-body-size-modal .modal-body > p { color:var(--zs-text-muted); font-size:14px; line-height:1.6; }
.zs-body-size-modal h3 { font-size:18px; margin:24px 0 12px; }
.zs-body-size-modal .zs-size-table-scroll { padding-bottom:1px; }
.zs-body-size-table th:first-child { position:sticky; left:0; z-index:1; white-space:normal; min-width:150px; max-width:220px; }
.zs-body-size-modal .zs-size-table-scroll:focus-visible { outline:2px solid var(--zs-purple-500); outline-offset:2px; }
.zs-size-how { margin-top:28px; border:1px solid var(--zs-purple-100); border-radius:8px; }
.zs-size-how summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; list-style:none; cursor:pointer; color:var(--zs-purple-700); font-weight:700; }
.zs-size-how summary::-webkit-details-marker { display:none; }
.zs-size-how[open] summary i { transform:rotate(180deg); }
.zs-size-how iframe { display:block; width:calc(100% - 32px); aspect-ratio:16/9; border:0; margin:0 16px 16px; }
.zs-size-setup .modal-title { font-size:22px; }
.zs-size-setup .modal-body img { display:block; width:100%; height:auto; }
@media(max-width:900px) {
    .zs-size-methods { flex-direction:column; }
    .zs-size-method { flex:auto; }
    .zs-size-or { padding:8px; }
}
@media(max-width:600px) {
    .zs-size-setup { padding:22px 16px; }
    .zs-size-heading h1 { font-size:26px; }
    .zs-size-method h2 { font-size:20px; }
}