.gm-group + .gm-group { margin-top: 18px; }
.gm-group { padding: 15px; border: 1px solid var(--line, #e1d9cd); border-radius: 15px; background: rgba(255, 253, 249, .76); }
.gm-group h4 { margin: 0 0 12px; color: var(--wine, #862f48); font: 700 14px/1.5 "Noto Serif Arabic", serif; }
.gm-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.gm-field { display: grid; align-content: start; gap: 6px; min-width: 0; }
.gm-field-label { font-size: 9px; font-weight: 700; }
.gm-field-label b { color: var(--wine, #862f48); }
.gm-input-wrap { position: relative; display: block; }
.gm-input-wrap input { width: 100%; min-height: 50px; padding: 10px 13px; padding-inline-end: 48px; border: 1px solid var(--line, #e1d9cd); border-radius: 12px; color: var(--ink, #17352c); background: #fff; outline: none; }
.gm-input-wrap input:focus { border-color: var(--gold, #c09a5d); box-shadow: 0 0 0 4px rgba(192, 154, 93, .12); }
.gm-input-wrap input[aria-invalid="true"] { border-color: #9d2929; background: #fff8f7; box-shadow: 0 0 0 4px rgba(157, 41, 41, .09); }
.gm-input-wrap input:disabled { color: var(--ink, #17352c); background: #f6f1e9; opacity: 1; }
.gm-input-wrap input[readonly] { color: var(--muted, #746f67); background: #f6f1e9; cursor: default; }
.gm-input-wrap em { position: absolute; top: 50%; inset-inline-end: 13px; color: var(--muted, #746f67); font-size: 8px; font-style: normal; transform: translateY(-50%); pointer-events: none; }
.gm-help { display: flex; gap: 5px; color: var(--muted, #746f67); font-size: 7px; line-height: 1.7; }
.gm-help span { color: var(--gold, #c09a5d); font-weight: 800; }
.gm-field-error { color: #9d2929; font-size: 8px; }
.gm-field-missing { padding: 9px; border: 1px solid rgba(157, 41, 41, .24); border-radius: 12px; background: #fff8f7; }
.gm-field-missing .gm-field-label { color: #862f48; }
.gm-supplement-note { display: grid; grid-column: 1 / -1; gap: 3px; padding: 12px 14px; border: 1px solid rgba(23, 97, 71, .18); border-radius: 13px; color: #176147; background: #eef8f2; }
.gm-supplement-note.missing { color: #862f48; border-color: rgba(134, 47, 72, .2); background: #fff4f6; }
.gm-supplement-note strong { font: 700 11px/1.6 "Noto Serif Arabic", serif; }
.gm-supplement-note small { font-size: 8px; line-height: 1.7; }
.gm-diagram-shell { position: sticky; top: 100px; overflow: hidden; border-radius: 17px; color: #fff; background: radial-gradient(circle at 50% 12%, #335d50, transparent 52%), var(--forest, #15382f); box-shadow: 0 18px 42px rgba(21, 56, 47, .14); }
.gm-diagram-shell > span { display: block; padding: 12px 14px 0; color: var(--gold-light, #e5cfaa); font: 700 10px/1.6 "Noto Serif Arabic", serif; }
.gm-diagram-shell > small { display: block; padding: 0 14px 12px; color: rgba(255, 255, 255, .66); font-size: 7px; line-height: 1.7; text-align: center; }
.gm-diagram-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.gm-diagram-head strong { font: 700 14px "Noto Serif Arabic", serif; }
.gm-diagram-head span { color: var(--gold-light, #e5cfaa); font-size: 7px; }
.gm-diagram { display: block; width: 100%; min-height: 400px; background: linear-gradient(145deg, rgba(255, 255, 255, .04), transparent); }
.gm-garment { fill: rgba(229, 207, 170, .2); stroke: rgba(255, 255, 255, .82); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.gm-garment-secondary { fill: rgba(201, 158, 170, .18); }
.gm-detail { fill: none; stroke: rgba(229, 207, 170, .55); stroke-width: 1; stroke-dasharray: 4 4; }
.gm-anchor { color: var(--gold-light, #e5cfaa); transition: opacity .2s ease; }
.gm-anchor circle { fill: var(--gold-light, #e5cfaa); stroke: rgba(21, 56, 47, .9); stroke-width: 2; transform-box: fill-box; transform-origin: center; transition: transform .2s ease, fill .2s ease; }
.gm-anchor path { fill: none; stroke: currentColor; stroke-width: .8; stroke-dasharray: 2 3; }
.gm-anchor text { fill: #fff; font: 6.5px "Noto Kufi Arabic", sans-serif; }
.gm-diagram:has(.gm-anchor.active) .gm-anchor:not(.active) { opacity: .28; }
.gm-anchor.active circle { fill: #fff; transform: scale(1.8); }
.gm-anchor.active text { fill: var(--gold-light, #e5cfaa); font-weight: 700; }
.gm-diagram-note { margin: 0; padding: 9px 14px; color: rgba(255, 255, 255, .62); font-size: 7px; text-align: center; }
.gm-profile-status { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; padding: 4px 7px; border-radius: 999px; color: #176147; background: #eaf6ef; font-size: 7px; font-weight: 700; }
.gm-profile-status.missing { color: #963143; background: #f9e9ed; }
.gm-profile-status.incompatible { color: #655d51; background: #eee9e1; }
.gm-empty-compatible { padding: 18px; border: 1px dashed var(--line, #e1d9cd); border-radius: 13px; color: var(--muted, #746f67); text-align: center; font-size: 9px; }
.measure-fields > .gm-group,
.bag-edit-measure-grid > .gm-group { grid-column: 1 / -1; }
.bag-measure-workspace { display: grid; grid-template-columns: minmax(230px, 310px) minmax(0, 1fr); align-items: start; gap: 14px; }
.bag-measure-workspace .gm-diagram { min-height: 360px; }
.bag-saved-measure-workspace .bag-edit-profile-summary { margin: 0; padding: 0; color: var(--ink, #17352c); background: transparent; }
.bag-saved-measure-workspace .bag-edit-profile-summary > div { display: block; }
.gm-profile-heading { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.gm-profile-heading strong { font-size: 11px; }
.gm-profile-empty { display: grid; justify-items: start; gap: 7px; margin-top: 10px; padding: 16px; border: 1px dashed var(--line, #e1d9cd); border-radius: 14px; color: var(--muted, #746f67); background: rgba(255, 253, 249, .72); }
.gm-profile-empty strong { color: var(--ink, #17352c); font: 700 13px/1.6 "Noto Serif Arabic", serif; }
.gm-profile-empty small { font-size: 8px; line-height: 1.8; }
.gm-profile-empty a { display: inline-flex; min-height: 40px; align-items: center; padding: 8px 12px; border-radius: 10px; color: #fff; background: var(--forest, #15382f); font-size: 8px; font-weight: 700; text-decoration: none; }

@media (max-width: 900px) {
    .gm-diagram-shell { position: static; }
    .bag-measure-workspace { grid-template-columns: 1fr; }
    .bag-measure-workspace .gm-diagram-shell { width: min(100%, 430px); margin-inline: auto; }
}

@media (max-width: 620px) {
    .gm-group { padding: 12px; }
    .gm-fields { grid-template-columns: 1fr; }
    .gm-field-label { font-size: 10px; }
    .gm-help { font-size: 8px; }
    .gm-input-wrap input { min-height: 52px; font-size: 16px; }
    .gm-diagram { min-height: 350px; }
    .gm-anchor text { font-size: 7.2px; }
    .bag-measure-workspace { gap: 11px; }
    .bag-measure-workspace .gm-diagram { min-height: 330px; }
    .gm-profile-heading { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .gm-anchor, .gm-anchor circle { transition: none; }
}
