#spCouple{box-sizing:border-box;border:0;border-radius:22px;padding:0;margin:auto;width:min(740px,100%);max-width:100%;height:min(960px,96dvh);max-height:100dvh;color:#263c34;background:#f1eee8;overflow:hidden;font-family:Sora,Arial,sans-serif;box-shadow:0 25px 100px #182b3455}
#spCouple *,#spCouple *::before,#spCouple *::after{box-sizing:border-box;min-width:0}
#spCouple::backdrop{background:#162b2ab8}
#spCouple[open]{display:flex;flex-direction:column}
#spCouple [hidden]{display:none!important}
#spCouple button{font:inherit;color:#263c34;background:#fffdf5e8;border:1px solid #c8cfc1;border-radius:14px;min-height:44px;padding:10px 13px;cursor:pointer;touch-action:manipulation;box-shadow:none;line-height:1.2}
#spCouple button:disabled{cursor:wait;opacity:.5}
#spCouple button:focus-visible,#spCouple input:focus-visible,#spCouple select:focus-visible{outline:3px solid #8b743d;outline-offset:3px}
#spCouple .sp-couple-header{display:flex;align-items:center;gap:8px;flex:none;min-height:64px;padding:10px 16px;background:#faf8f3;border-bottom:1px solid #e0e0d5}
#spCouple h2{font:500 27px/1.15 'Cormorant Garamond',Georgia,serif;margin:0;flex:1}
#spCouple [data-close]{font-size:12px;white-space:nowrap;background:#315c4c;color:white;border-color:#315c4c}
#spCouple [data-back]{padding:0;width:44px;flex:none;font-size:23px}
#spCouple .sp-couple-main{display:flex;flex:1;min-height:0;flex-direction:column;position:relative}
#spCouple .sp-couple-stage{flex:1;min-height:0;position:relative;isolation:isolate}
#spCouple .sp-couple-canvas,#spCouple .sp-couple-overlay{position:absolute;inset:0}
#spCouple .sp-couple-canvas canvas{display:block;width:100%;height:100%}
#spCouple .sp-couple-overlay{pointer-events:none;z-index:2}
#spCouple .sp-couple-overlay button{pointer-events:auto}
#spCouple .sp-couple-point{position:absolute;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;transform:translate(-50%,-50%);display:grid;place-items:center}
#spCouple .sp-couple-point span{display:block;width:18px;height:18px;border-radius:50%;background:#315c4c;border:3px solid #fff;box-shadow:0 1px 5px #273c334d}
#spCouple[data-part=full] .sp-couple-stage{touch-action:none;cursor:grab}
#spCouple[data-part=full] .sp-couple-stage[data-dragging=true]{cursor:grabbing}
#spCouple .sp-couple-arrows{position:absolute;left:12px;right:12px;transform:translateY(-50%);display:flex;justify-content:space-between;pointer-events:none;gap:12px}
#spCouple .sp-couple-arrows button{width:48px;height:48px;min-height:48px;border-radius:50%;padding:0;font-size:26px;flex:none;background:#fffdf5ed}
#spCouple .sp-couple-bottom{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:10px 14px max(12px,env(safe-area-inset-bottom));background:#faf8f3;border-top:1px solid #e0e0d5}
#spCouple .sp-couple-color{display:flex;align-items:center;gap:9px;font-size:13px;min-height:44px;cursor:pointer}
#spCouple input[type=color]{appearance:none;-webkit-appearance:none;padding:0;width:30px;height:30px;border:1px solid #a6afa1;border-radius:50%;overflow:hidden;background:none;cursor:pointer}
#spCouple input[type=color]::-webkit-color-swatch-wrapper{padding:0}#spCouple input[type=color]::-webkit-color-swatch{border:0;border-radius:50%}#spCouple input[type=color]::-moz-color-swatch{border:0;border-radius:50%}
#spCouple .sp-couple-details{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:100%}
#spCouple .sp-couple-details button{min-width:44px;padding:10px 12px;font-size:12px}
#spCouple .sp-couple-details button[aria-pressed=true]{background:#315c4c;color:#fff}
#spCouple .sp-couple-loading{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#f1eee8;font-size:15px;pointer-events:none}
#spCouple[data-ready=true] .sp-couple-loading{inset:auto 10px 10px auto;flex-direction:row;gap:8px;background:#fffdf5eb;padding:10px 14px;border-radius:14px;font-size:12px}
#spCouple[data-loading=true] .sp-couple-overlay{visibility:hidden}
#spCouple .sp-couple-spinner{width:24px;height:24px;border:2px solid #d9ddcf;border-top-color:#315c4c;border-radius:50%;animation:coupleSpin .8s linear infinite}
@keyframes coupleSpin{to{transform:rotate(360deg)}}
#spCouple .sp-couple-feedback{flex:none;background:#faf8f3;text-align:center;font-size:12px;color:#98412f}#spCouple .sp-couple-feedback:has(.sp-couple-status[hidden]):has([data-retry][hidden]){display:none}
#spCouple .sp-couple-status{margin:0;padding:12px 16px;line-height:1.5}
#spCouple .sp-couple-plan{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:18px;background:#faf8f3}
#spCouple .sp-couple-plan article{padding:8px 0;border-bottom:1px solid #dce0d5}#spCouple .sp-couple-plan article>button{width:100%;display:flex;justify-content:space-between;gap:12px;text-align:left;font-size:14px}
#spCouple .sp-couple-plan small{display:block;font-size:11px;color:#687c6c;margin-top:6px}#spCouple .sp-couple-plan details{font-size:12px;margin:12px 0}#spCouple .sp-couple-plan select{max-width:100%;width:100%;font-size:16px;margin:10px 0;padding:12px}
#spCouple .sp-couple-credits{display:block;color:#627363;font-size:11px;padding:18px 0}
body:has(#spCouple[open]){overflow:hidden!important}
@media(max-width:700px){#spCouple{width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0;padding-top:env(safe-area-inset-top)}#spCouple .sp-couple-header{padding:8px 12px;gap:6px;min-height:60px}#spCouple h2{font-size:23px}#spCouple [data-close]{padding:10px;font-size:11px}#spCouple .sp-couple-arrows{left:10px;right:10px}}
@media(max-height:450px) and (min-width:600px){#spCouple .sp-couple-main{flex-direction:row}#spCouple .sp-couple-bottom{width:120px;border-top:0;border-left:1px solid #e0e0d5;padding:10px}#spCouple .sp-couple-feedback{position:absolute;bottom:0;left:0;right:120px}#spCouple .sp-couple-details{gap:4px}}
@media(prefers-reduced-motion:reduce){#spCouple .sp-couple-spinner{animation:none}}

#spCouple .sp-couple-tones{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;max-width:420px}
#spCouple [data-skin]{width:44px;height:44px;padding:8px;border:2px solid transparent;border-radius:50%;background:none}
#spCouple [data-skin] span{display:block;width:24px;height:24px;border-radius:50%;background:var(--tone);box-shadow:inset 0 0 0 1px #0002}
#spCouple [data-skin][aria-pressed=true]{border-color:#315c4c}

#spCouple .sp-couple-color-label{font-size:13px}
#spCouple .sp-couple-hair-tones{width:100%;max-width:552px}
#spCouple [data-hair-tone],#spCouple .sp-couple-custom-tone{position:relative;display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:8px;border:2px solid transparent;border-radius:50%;background:none;cursor:pointer}
#spCouple [data-hair-tone] span,#spCouple .sp-couple-custom-tone>span{display:block;width:24px;height:24px;border-radius:50%;background:var(--tone);box-shadow:inset 0 0 0 1px #0002}
#spCouple [data-hair-tone][aria-pressed=true],#spCouple .sp-couple-custom-tone[data-selected=true]{border-color:#315c4c}
#spCouple .sp-couple-custom-tone>span{background:conic-gradient(#ee6565,#edcf5c,#67b67b,#62a9d7,#ab76cb,#ee6565)}
#spCouple .sp-couple-custom-tone input[type=color]{position:absolute;inset:-2px;width:44px;height:44px;opacity:0;z-index:1;border:0}
#spCouple .sp-couple-custom-tone:focus-within{outline:3px solid #8b743d;outline-offset:1px}

#spCouple .sp-couple-face-shapes{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;width:100%}
#spCouple .sp-couple-face-shapes button{min-height:44px;padding:8px 12px;border:1px solid #cbd4cc;border-radius:22px;background:#fffdf6;color:#294e40;font:inherit;font-size:13px}
#spCouple .sp-couple-face-shapes [aria-pressed=true]{background:#315c4c;color:#fff;border-color:#315c4c}
#spCouple .sp-couple-face-shapes button:focus-visible{outline:3px solid #8b743d;outline-offset:2px}

#spCouple[data-part=face] .sp-couple-stage{touch-action:none;cursor:grab}
#spCouple[data-part=face] .sp-couple-stage[data-dragging=true]{cursor:grabbing}

#spCouple [data-face-tabs]{display:grid;grid-template-columns:repeat(var(--face-tabs),minmax(0,1fr));gap:4px;width:100%}
#spCouple [data-face-tabs] button{padding:8px 3px;font-size:11px}
@media(max-height:450px) and (min-width:600px){#spCouple[data-part=face] .sp-couple-bottom{width:220px;overflow-y:auto;overscroll-behavior:contain;justify-content:flex-start}#spCouple [data-face-tabs]{grid-template-columns:repeat(3,minmax(0,1fr))}#spCouple[data-part=face] .sp-couple-feedback{right:220px}}