#sweeple .s-client-story { position:relative; min-height:440px; grid-template-columns:1.25fr 1fr; }
#sweeple .s-client-stage { width:416px; max-width:100%; min-height:385px; display:flex; align-items:center; justify-content:center; }
#sweeple .s-client-stage [hidden] { display:none !important; }
#sweeple .s-client-widget { width:100%; max-width:416px; font-family:Inter,Arial,sans-serif; font-size:14px; text-align:left; }
#sweeple .s-property-widget { background:#fff; border-radius:15px; }
#sweeple .s-property-widget img { width:100%; height:auto; border-radius:15px; }
#sweeple .s-service-widget { background:#fff; padding:16px; border-radius:15px; }
#sweeple .s-widget-service { position:relative; padding:12px 20px 12px 52px; background:var(--paper); border:1px solid transparent; border-radius:13px; margin-top:8px; }
#sweeple .s-widget-service:first-child { margin-top:0; }
#sweeple .s-widget-service strong { font-size:14px; font-weight:400; }
#sweeple .s-widget-service p { margin-top:3px; color:var(--muted); font-size:11px; line-height:1.3; }
#sweeple .s-widget-chosen { display:flex; align-items:center; padding-left:16px; gap:13px; border-color:var(--purple); }
#sweeple .s-widget-radio { display:block; flex:none; width:22px; height:22px; border:1px solid var(--purple); border-radius:50%; padding:3px; background:var(--purple); background-clip:content-box; }
#sweeple .s-widget-label { font-size:11px; color:var(--muted); margin:20px 5px 10px; }
#sweeple .s-widget-extras { display:flex; flex-wrap:wrap; gap:6px; }
#sweeple .s-widget-extras span { padding:7px 9px; border-radius:17px; background:var(--paper); font-size:11px; line-height:1.2; }
#sweeple .s-widget-extras span:first-child { background:var(--purple); color:#fff; }
#sweeple .s-time-widget { padding:15px; border-radius:15px; background:#fff; }
#sweeple .s-widget-segments { display:flex; gap:8px; background:var(--paper); border-radius:12px; }
#sweeple .s-widget-segments span { width:50%; padding:13px 5px; text-align:center; font-size:13px; }
#sweeple .s-widget-segments span:first-child { background:var(--purple); color:#fff; border-radius:12px; }
#sweeple .s-widget-time-body { margin-top:10px; padding:15px; border-radius:12px; background:var(--paper); }
#sweeple .s-widget-time-body .s-widget-label { margin:0 0 8px; }
#sweeple .s-widget-time-body > strong { font-family:Poppins,Arial,sans-serif; font-size:28px; line-height:1.08; }
#sweeple .s-widget-time-body > p:not(.s-widget-label) { margin-top:8px; font-size:13px; line-height:1.3; color:var(--muted); }
#sweeple .s-widget-slots { display:flex; gap:8px; margin-top:22px; }
#sweeple .s-widget-slots span { flex:1; padding:10px; border-radius:12px; font-size:13px; text-align:center; background:#fff; }
#sweeple .s-widget-slots span:first-child { border:1px solid var(--purple); }
#sweeple .s-client-confirm-widget { background:transparent; }
#sweeple .s-client-confirm-widget .s-confirm-banner { margin:0 0 9px; padding:11px; border-radius:10px; gap:10px; }
#sweeple .s-client-confirm-widget .s-confirm-banner strong { font-size:14px; font-weight:400; }
#sweeple .s-client-confirm-widget .s-confirm-banner p { font-size:12px; }
#sweeple .s-widget-confirm-body { padding:22px; background:#fff; border-radius:14px; }
#sweeple .s-widget-profile { display:flex; align-items:center; gap:17px; }
#sweeple .s-widget-profile strong { font-size:14px; font-weight:500; }
#sweeple .s-widget-profile p { margin-top:4px; font-size:12px; color:var(--muted); }
#sweeple .s-widget-avatar { display:grid; place-items:center; width:45px; height:45px; border-radius:50%; background:var(--paper); }
#sweeple .s-widget-avatar .s-mark { filter:brightness(.6); }
#sweeple .s-widget-badges { display:flex; gap:14px; margin-top:20px; color:var(--muted); font-size:11px; }
#sweeple .s-widget-confirm-body dl { display:grid; grid-template-columns:1fr auto; gap:14px 12px; margin:25px 0 0; padding-top:18px; border-top:1px solid #e9e5f2; font-size:12px; }
#sweeple .s-widget-confirm-body dd { margin:0; }
#sweeple .s-client-controls { position:absolute; bottom:-35px; left:50%; transform:translateX(-50%); display:flex; gap:8px; }
#sweeple .s-client-controls button { width:22px; height:22px; border:0; padding:8px; background:transparent; }
#sweeple .s-client-controls button::after { content:''; display:block; width:6px; height:6px; border-radius:50%; background:#ded9ee; }
#sweeple .s-client-controls button[aria-pressed="true"]::after { background:var(--purple); }
#sweeple .s-client-controls button:focus-visible { outline-offset:-2px; }
#sweeple .s-client-story[data-story-step="2"] .s-client-stage,
#sweeple .s-client-story[data-story-step="4"] .s-client-stage { order:-1; }
@media(min-width:992px) {
  #sweeple .s-client-story[data-story-step="2"],
  #sweeple .s-client-story[data-story-step="4"] { grid-template-columns:1fr 1.25fr; }
}
@media(max-width:991px) {
  #sweeple .s-client-story { min-height:0; }
  #sweeple .s-client-stage { width:332px; min-height:345px; margin:32px auto 0; }
  #sweeple .s-client-story[data-story-step] .s-client-stage { order:initial; }
  #sweeple .s-client-controls { bottom:-28px; }
  #sweeple .s-client-widget { font-size:12px; }
  #sweeple .s-widget-service { padding-block:9px; padding-left:45px; }
  #sweeple .s-widget-service strong { font-size:12px; }
  #sweeple .s-widget-service p { font-size:10px; }
  #sweeple .s-widget-chosen { padding-left:12px; gap:10px; }
  #sweeple .s-widget-extras span { font-size:10px; padding:6px 7px; }
  #sweeple .s-widget-time-body > strong { font-size:24px; }
  #sweeple .s-widget-time-body > p:not(.s-widget-label) { font-size:12px; }
}
@media(max-width:991px) and (max-height:680px) {
  #sweeple .s-client-story .s-title { font-size:24px; }
  #sweeple .s-client-story .s-copy { font-size:11px; line-height:1.3; margin-top:18px; }
  #sweeple .s-client-story .s-client-stage { width:260px; min-height:0; margin-top:14px; }
  #sweeple .s-client-story .s-client-stage>[data-client-visual] { width:325px; max-width:none; zoom:.8; }
  #sweeple .s-service-widget { padding:10px; }
  #sweeple .s-widget-service { padding-block:6px; margin-top:5px; }
  #sweeple .s-widget-label { margin-top:12px; }
}