button,select,input{font-family:inherit}
.head{padding:44px 0 30px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.head h1{font-size:clamp(44px,5.4vw,72px);line-height:1;font-weight:500;margin-top:12px}
.tabs{display:inline-flex;gap:6px;padding:6px;border-radius:999px;background:var(--paper);border:1px solid var(--line)}
.tabs a{display:inline-flex;align-items:center;min-height:44px;padding:0 24px;border-radius:999px;font-weight:600;font-size:14px;color:var(--muted)}
.tabs a.on{background:var(--maroon);color:var(--paper)}
.studio{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:start;padding-bottom:96px}
.stage{position:relative;border-radius:32px;min-height:720px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.stage .arc{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:70%;height:84%;border-radius:999px 999px 0 0;background:rgba(255,255,255,.5)}
.stage svg{position:relative;width:min(440px,80%);height:auto;margin-bottom:30px}
.stage .chips{position:absolute;left:22px;top:22px;display:flex;gap:8px;flex-wrap:wrap}
.stage .chips span{background:var(--paper);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:28px;padding:34px}
.panel h2{font-size:34px;line-height:1.05;font-weight:500}
.panel .sub{color:var(--muted);margin-top:6px}
.ctl{margin-top:28px}
.ctl-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}
.ctl-h span{letter-spacing:0;text-transform:none;font-size:14px;font-weight:600;color:var(--ink)}
.swatches{display:flex;gap:12px;flex-wrap:wrap}
.sw{width:44px;height:44px;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.sw.on{box-shadow:0 0 0 2px var(--maroon)}
.chipr{display:flex;gap:8px;flex-wrap:wrap}
.chipb{min-height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-weight:600;font-size:14px;cursor:pointer;color:var(--ink)}
.chipb.on{background:var(--maroon);border-color:var(--maroon);color:var(--paper)}
.bgdot{width:46px;height:46px;border-radius:14px;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.bgdot.on{box-shadow:0 0 0 2px var(--maroon)}
.sumbox{margin-top:30px;padding:20px 22px;border-radius:18px;background:var(--cream);border:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px}
.sumbox b{font-size:26px;color:var(--maroon);font-weight:700}
.sumbox span{font-size:13px;color:var(--muted)}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.acts .full{grid-column:1/-1}
.disc{margin-top:18px;font-size:13px;color:var(--muted)}
.stage{position:relative;border-radius:32px;min-height:780px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.stage .arc{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:62%;height:90%;border-radius:999px 999px 0 0;background:rgba(255,255,255,.5)}
.stage svg{position:relative;width:min(380px,74%);height:auto;margin-bottom:26px}
.ctl{margin-top:26px}
.stage svg{position:relative;height:auto;margin-bottom:30px}
@media (max-width:900px){
 .studio{grid-template-columns:minmax(0,1fr);gap:28px}
 .stage{min-height:560px}
 .panel{padding:24px}
}
.stage[data-kind="kerudung"]{min-height:720px}
.stage[data-kind="kerudung"] .arc{width:70%;height:84%}
.stage[data-kind="sorban"]{min-height:720px}
.stage[data-kind="sorban"] .arc{width:70%;height:84%}
.stage[data-kind="abaya"]{min-height:780px}
.stage .art{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%}
.stage .art svg{margin-bottom:30px}
.prodrow{display:flex;gap:8px;flex-wrap:wrap}
.sw.dim{opacity:.38}
.sw.dim.on{opacity:1}
.chipb.dim{opacity:.45;text-decoration:line-through}
.chipb.dim.on{opacity:1;text-decoration:none}
.chipb:focus-visible,.sw:focus-visible,.bgdot:focus-visible{outline:2px solid var(--maroon);outline-offset:2px}
.nomock{margin-top:20px;padding:16px 18px;border-radius:16px;background:var(--blush);color:var(--maroon-deep);font-size:14px}
.stockmsg{margin-top:10px;font-size:13px;font-weight:600;color:#8F2A2A}
.acts .btn{width:100%}
.acts a.btn{text-decoration:none}
@media (max-width:900px){
 .stage[data-kind]{min-height:520px}
 .acts{grid-template-columns:minmax(0,1fr)}
}

.stage{position:sticky;top:20px}
.prodsel{width:100%;min-height:50px;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:0 20px;font-weight:600;font-size:14px;color:var(--ink)}
.prodsel:focus-visible{outline:2px solid var(--maroon);outline-offset:2px}
@media (max-width:900px){.stage{position:relative;top:0}}
