.sewing-demo-page{background:#f4f7fa;color:#102f50}
.sewing-demo-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1220px;padding-top:28px}
.sewing-demo-intro h1{font-size:clamp(23px,3vw,32px);margin:8px 0}
.sewing-demo-intro p{font-size:14px;color:#536b80}
.sewing-demo-intro>a{flex-shrink:0;color:#102f50;font-size:13px}
main.sewing-demo-main{display:block;max-width:1220px;padding-top:16px}
.sewing-guide{--sg-ink:#102f50;--sg-rust:#a24e36;--sg-fabric:#bc7d6a;--sg-wrong:#f3dfd4;--sg-thread:#126b6e;color:var(--sg-ink);min-width:0;overflow:hidden;background:white;border:1px solid #d4dfe9;border-radius:18px;padding:0}
.sewing-guide *{box-sizing:border-box}
.sewing-guide [hidden]{display:none!important}
.sewing-guide button{min-height:42px;color:#102f50;border:1px solid #c6d3df;background:#fff;font-size:13px;border-radius:9px;padding:9px 14px;line-height:1.65}
.sewing-guide button:hover:not(:disabled){background:#edf3f8}
.sewing-guide button:focus-visible,.sewing-guide input:focus-visible{outline:3px solid #ae603e;outline-offset:3px}
.sewing-guide button:disabled{opacity:.45;cursor:default}
.sg-head{padding:20px 24px 14px;border-bottom:1px solid #e2e9ef}
.sg-head h2{font-size:20px;margin:0 0 6px}
.sg-head p{font-size:12px;line-height:1.9;margin:0;color:#536b80}
.sg-body{display:grid;grid-template-columns:215px minmax(0,1fr);direction:rtl}
.sg-nav{min-width:0;padding:16px 12px;border-inline-end:1px solid #e2e9ef;background:#fafbfd}
.sg-nav ol{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.sg-nav button{display:flex;align-items:center;gap:10px;text-align:right;width:100%;border-color:transparent;background:transparent;font-size:12px}
.sg-step-number{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;border-radius:50%;background:#eaf0f5;font-size:13px}
.sg-nav button[aria-current=step]{border-color:#d9b6a8;background:#f8eee8;color:#843f2e;font-weight:700}
.sg-nav button[aria-current=step] .sg-step-number{background:#a24e36;color:#fff}
.sg-main{min-width:0;padding:20px 24px}
.sg-step-heading{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.sg-counter{font-size:12px;color:#697e8e;flex-shrink:0}
.sg-step-heading h3{font-size:20px;margin:0;line-height:1.8}
.sg-figure{margin:0;border-radius:14px;background:#f8f7f2;border:1px solid #e5e6df;overflow:hidden}
.sg-figure>svg{display:block;width:100%;height:auto;max-height:480px;aspect-ratio:640/440;touch-action:auto}
.sg-figure>svg.sg-split-scene{aspect-ratio:640/400}
.sg-figure>svg.sg-volume-scene{aspect-ratio:640/510;max-height:540px}
.sg-figure>svg.sg-volume-scene[data-volume-narrow=true]{aspect-ratio:490/510;max-height:none}
.sg-dart-phases{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 12px}
.sg-dart-phases[hidden]{display:none}
.sewing-guide .sg-dart-phases button{font-size:12px;min-height:38px;padding:7px 11px;background:#faf7f2}
.sewing-guide .sg-dart-phases button[aria-pressed=true]{background:#f5e5d9;border-color:#b9896d;color:#743f2d;font-weight:700}
.sg-pattern-context{margin-bottom:12px;padding:12px;border-radius:10px;background:#f1f6f5;border:1px solid #d6e3df}
.sg-pattern-context[hidden]{display:none}
.sg-pattern-source{font-size:11px;line-height:1.9;margin:0 0 8px;color:#47646b}
.sg-pattern-choices{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.sewing-guide .sg-pattern-choices button{font-size:12px;min-height:38px;padding:7px 10px}
.sewing-guide .sg-pattern-choices button[aria-pressed=true]{background:#20686d;color:white;border-color:#20686d}
.sewing-guide[data-sewing-step="2"] .sg-swatch.wrong{background:#e5f0ec;border-color:#a5c2b5}
.sg-figure .sg-crop{width:320px;height:400px;display:block;touch-action:auto}
.sg-figure>svg.sg-split-scene[data-stacked=true]{aspect-ratio:320/800;max-height:none}
.sg-figure figcaption{font-size:11px;text-align:center;color:#657481;padding:0 10px 10px;line-height:1.9}
.sg-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:11px;padding:12px 0;color:#425e72}
.sg-legend span{display:flex;align-items:center;gap:6px}
.sg-swatch{width:14px;height:14px;border:1px solid #925f50;background:#bc7d6a;border-radius:3px}
.sg-swatch.wrong{background:#f3dfd4}
.sg-swatch.seam{height:0;border:0;border-top:3px dashed #126b6e;width:20px;background:transparent;border-radius:0}
.sg-transport{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sewing-guide .sg-play{background:#a24e36;border-color:#a24e36;color:white;min-width:140px}
.sewing-guide .sg-play:hover:not(:disabled){background:#8c432f}
.sg-scrub{display:flex;align-items:center;gap:12px;margin:12px 0 0;font-size:11px;color:#536b80}
.sg-scrub input{flex:1;min-width:60px;accent-color:#a24e36;direction:ltr;cursor:pointer;min-height:28px;margin:0}
.sg-scrub output{min-width:34px;font-variant-numeric:tabular-nums}
.sg-description{font-size:13px;line-height:2;margin:14px 0 10px;min-height:52px}
.sg-check{background:#edf4f3;padding:10px 14px;border-radius:9px;font-size:12px;line-height:1.95;margin:0}
.sg-check strong{color:#175958}
.sg-tip{font-size:12px;line-height:1.95;color:#775041;margin:10px 0}
.sg-pagination{display:flex;justify-content:space-between;gap:12px;margin-top:16px}
.sg-bottom{padding:12px 24px;border-top:1px solid #e2e9ef;font-size:11px;color:#5d7183;line-height:1.95;background:#fafbfd}
.sg-motion-hint{font-size:11px;color:#6b5e47;line-height:1.9;margin:8px 0}
.sg-motion-hint:empty{display:none}
.sg-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sg-hidden[hidden],.sewing-guide[hidden]{display:none!important}
.sg-svg .sg-cloth{fill:var(--sg-fabric);stroke:#875d51;stroke-width:1.6;stroke-linejoin:round}
.sg-svg .sg-cloth-back{fill:var(--sg-wrong);stroke:#b58977;stroke-width:1.6;stroke-linejoin:round}
.sg-svg .sg-panel{fill:#fffdf8;stroke:#e4ded1;stroke-width:1}
.sg-svg .sg-mark{fill:none;stroke:#8b6985;stroke-width:1.6;stroke-dasharray:5 4}
.sg-svg .sg-edge{fill:none;stroke:#805549;stroke-width:1.5}
.sg-svg .sg-seam{fill:none;stroke:var(--sg-thread);stroke-width:3;stroke-linecap:round;stroke-dasharray:3 5}
.sg-svg .sg-route{fill:none;stroke:#126b6e;stroke-width:1.5;opacity:.25}
.sg-svg .sg-active-stitch{fill:none;stroke:#126b6e;stroke-width:3.5;stroke-linecap:round}
.sg-svg .sg-arrow{fill:none;stroke:#102f50;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.sg-svg .sg-needle{fill:#fff;stroke:#102f50;stroke-width:1.5}
.sg-svg text{font-family:TaaravaSans,Tahoma,sans-serif;fill:#102f50;font-size:14px;text-anchor:middle;direction:rtl;unicode-bidi:plaintext}
.sg-svg .sg-svg-title{font-size:16px;font-weight:700}
.sg-svg .sg-svg-small{font-size:12px;fill:#63717c}
.sg-svg .sg-callout{fill:#fff;stroke:#a24e36;stroke-width:1.5}
.sg-svg .sg-number{fill:#a24e36;font-size:12px;font-weight:700}
.sg-svg .sg-zip{fill:none;stroke:#d3a04c;stroke-width:5;stroke-dasharray:2 3}
.sg-preview-entry{margin-top:22px;padding:18px;border:1px solid #d9b6a8;border-radius:12px;background:#fcf7f3}
.sg-preview-entry h3{font-size:17px;margin:0 0 8px}
.sg-preview-entry p{font-size:12px;line-height:1.95}
.sg-preview-entry a{display:inline-block;margin-top:8px;border-radius:8px;background:#a24e36;color:#fff;padding:10px 16px;text-decoration:none;font-size:13px}
.sg-preview-entry .sewing-guide{margin-top:16px}
@media(max-width:800px){.sg-body{grid-template-columns:minmax(0,1fr)}.sg-nav{border-inline-end:0;border-bottom:1px solid #e2e9ef;padding:10px}.sg-nav ol{display:flex;overflow-x:auto;gap:6px;padding-bottom:5px;scrollbar-width:thin}.sg-nav li{flex-shrink:0}.sg-nav button{width:auto;white-space:nowrap;padding:7px 9px;gap:6px}.sg-main{padding:16px}.sg-step-heading h3{font-size:18px}.sg-figure>svg{min-height:0}.sg-head{padding:16px}.sg-bottom{padding:12px 16px}.sewing-demo-intro{display:block}.sewing-demo-intro>a{display:inline-block;margin-top:8px}}
@media(max-width:480px){.sg-head h2{font-size:17px}.sg-main{padding:12px}.sg-legend{gap:10px;font-size:10px}.sg-step-heading{gap:8px}.sg-step-heading h3{font-size:16px}.sg-description{font-size:12px}.sg-transport button{padding:8px 10px}.sg-check,.sg-tip{font-size:11px}.sg-preview-entry{padding:10px}}
@media print{.sg-nav,.sg-transport,.sg-scrub,.sg-pagination,.site-navigation,.sewing-demo-intro>a{display:none}.sg-body{display:block}.sg-figure{break-inside:avoid}}
