/* RunPass example. All controls are local to this explanation. */
.rpd{--rpd-ink:var(--syd-ink,var(--text));--rpd-line:var(--syd-stroke,var(--line));--rpd-soft:#eee2ee;--rpd-soft-ink:#51395e;--rpd-ready:#694779;color:var(--rpd-ink);max-width:1420px;margin:38px auto 0;min-width:0}
:root[data-theme=dark] .rpd{--rpd-soft:#382842;--rpd-soft-ink:#ead8f2;--rpd-ready:#dabce8}
.rpd button{font-family:Manrope,Arial,sans-serif}
.rpd button:focus-visible,.rpd-viewport:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.rpd-topline{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px}
.rpd-topline p{font-size:11px;font-weight:700;line-height:1.5;color:var(--accent)}
.rpd-topline>span{font-size:12px;font-weight:700;letter-spacing:-.3px}
.rpd-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--rpd-line)}
.rpd-steps>button{display:flex;align-items:center;justify-content:flex-start;gap:11px;padding:17px 12px;min-height:62px;min-width:0;text-align:left;background:transparent;color:var(--muted);font-size:12px;line-height:1.5;font-weight:700;transition:color .25s,background .25s}
.rpd-steps>button[aria-pressed=true]{color:var(--rpd-ink);background:#aa7cb011}
.rpd-step-number{display:grid;place-items:center;flex-shrink:0;width:25px;height:25px;border:1px solid var(--rpd-line);border-radius:50%;font-size:10px;font-weight:400}
.rpd-steps>button[aria-pressed=true] .rpd-step-number{background:var(--rpd-ink);border-color:var(--rpd-ink);color:var(--bg)}
.rpd-viewport{display:flex;align-items:flex-start;width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-inline:contain;transition:height .4s ease;outline-offset:-3px;touch-action:pan-x pan-y pinch-zoom}
.rpd-viewport::-webkit-scrollbar{display:none}
.rpd-slide{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);align-items:center;gap:clamp(28px,5vw,78px);flex:0 0 100%;width:100%;min-width:0;min-height:460px;padding:40px 12px;scroll-snap-align:start;scroll-snap-stop:always}
.rpd-copy,.rpd-visual{min-width:0}
.rpd-kicker{font-size:9px;line-height:1.55;letter-spacing:1.4px;font-weight:700;color:var(--accent);margin-bottom:14px}
.rpd-copy h3{font-family:Barlow,'Arial Narrow',Impact,sans-serif;font-size:clamp(41px,4.3vw,66px);font-weight:800;line-height:1.03;letter-spacing:-.5px;max-width:490px;text-wrap:balance}
.rpd-description{max-width:420px;font-size:13px;line-height:1.9;margin-top:20px;color:var(--muted)}
.rpd-leaving-note{font-size:11px;line-height:1.8;margin-top:18px;max-width:350px;color:var(--muted)}
.rpd-continue{display:inline-flex;align-items:center;justify-content:center;min-height:46px;max-width:100%;padding:11px 0;border-bottom:1px solid currentColor;margin-top:28px;background:transparent;color:var(--rpd-ink);font-size:11px;line-height:1.55;font-weight:700;text-align:left}
.rpd-visual{width:100%;max-width:610px;justify-self:center}
.rpd-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;align-items:start}
.rpd-setting{min-width:0;border:0;margin:0;padding:0}
.rpd-setting legend{display:flex;align-items:center;gap:9px;width:100%;padding:0;font-size:11px;line-height:1.5;font-weight:700}
.rpd-setting legend>svg{width:25px;height:25px;flex-shrink:0;fill:none;stroke:var(--accent);stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
.rpd-setting-value{display:flex;align-items:baseline;gap:7px;margin-top:16px;font-size:clamp(42px,5.4vw,76px);line-height:1.15;font-weight:400;letter-spacing:-3px;font-variant-numeric:tabular-nums}
.rpd-setting-value small{font-size:13px;font-weight:400;letter-spacing:0}
.rpd-options{display:flex;gap:7px;margin-top:17px}
.rpd-options>button{flex:1;min-width:0;min-height:42px;padding:9px 10px;border:1px solid var(--rpd-line);border-radius:25px;background:transparent;color:var(--rpd-ink);font-size:11px;line-height:1.5;white-space:nowrap}
.rpd-options>button[aria-pressed=true]{background:var(--rpd-soft);border-color:var(--rpd-soft);color:var(--rpd-soft-ink);font-weight:700}
.rpd-setting-help{font-size:10px;line-height:1.75;color:var(--muted);margin-top:13px;max-width:200px}
.rpd-values-note{grid-column:1/-1;border-top:1px solid var(--rpd-line);padding-top:19px;font-size:11px;line-height:1.8;color:var(--muted);max-width:470px}
.rpd-arrival{max-width:520px;margin:auto}
.rpd-event-scene{position:relative;width:100%;max-width:470px;height:210px;margin:0 auto 13px;isolation:isolate}
.rpd-venue-label{position:absolute;top:12px;right:3%;font-size:9px;font-weight:700;line-height:1.5;letter-spacing:1.6px;color:var(--muted)}
.rpd-event-door{position:absolute;inset:5px 12% 27px 36%;border:1px solid var(--rpd-line);border-radius:70px 70px 4px 4px;opacity:.75}
.rpd-event-door i{position:absolute;top:0;bottom:0;left:50%;border-left:1px solid var(--rpd-line)}
.rpd-event-door i:nth-child(2){top:42%;left:0;right:0;bottom:auto;border-left:0;border-top:1px solid var(--rpd-line)}
.rpd-event-door i:nth-child(3){top:64%;left:55%;width:4px;height:10px;border:1px solid var(--rpd-line);border-radius:4px}
.rpd .rpd-figure{position:relative;width:125px;filter:drop-shadow(2px 5px 6px #39244313);transform-origin:50% 90%}
.rpd .emotion-sculpture{display:block;width:100%;height:auto;overflow:visible}
.rpd .emotion-face path{fill:none}
.rpd .rpd-figure-arriving{position:absolute;bottom:9px;left:16%;width:134px;transform:translateX(-18px) rotate(-4deg);transition:transform 1.3s ease}
.rpd[data-rpd-step="1"] .rpd-figure-arriving{transform:translateX(0) rotate(0deg)}
.rpd .rpd-figure-nearby{position:absolute;bottom:12px;right:16%;width:111px;opacity:.85;transform:rotate(5deg)}
.rpd-you-label{position:absolute;left:14%;bottom:0;font-size:10px;color:var(--rpd-ink);line-height:1.5}
.rpd-clockline{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;line-height:1.5;color:var(--muted);font-variant-numeric:tabular-nums}
.rpd-clockline strong{font-size:16px;color:var(--rpd-ink);font-weight:700;letter-spacing:-.3px}
.rpd-timebar{height:3px;overflow:hidden;border-radius:3px;background:var(--rpd-line);margin-top:11px}
.rpd-timebar>i{display:block;width:100%;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--rpd-elapsed,0))}
.rpd-time-status{font-size:11px;line-height:1.7;color:var(--rpd-ink);font-weight:700;min-height:38px;margin-top:13px}
.rpd-time-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:4px}
.rpd-time-controls>p{max-width:260px;font-size:9px;line-height:1.65;color:var(--muted)}
.rpd-time-controls>button{flex-shrink:0;max-width:46%;min-height:44px;background:transparent;color:var(--accent);font-size:10px;font-weight:700;line-height:1.5;text-align:right;padding:5px 0}
.rpd-filter-note{display:flex;align-items:flex-start;gap:10px;border-top:1px solid var(--rpd-line);padding-top:15px;margin-top:15px}
.rpd-filter-note>svg{width:20px;height:20px;padding:2px;flex-shrink:0;border-radius:50%;background:var(--rpd-soft);color:var(--rpd-soft-ink);fill:none;stroke:currentColor;stroke-width:1.5;opacity:.3;transform:scale(.9);transition:opacity .5s,transform .5s}
.rpd[data-rpd-time-ready=true] .rpd-filter-note>svg{opacity:1;transform:scale(1)}
.rpd-filter-note strong{display:block;font-size:11px;line-height:1.55}
.rpd-filter-note p>span{display:block;font-size:10px;line-height:1.75;color:var(--muted);margin-top:5px}
.rpd-radius-note{font-size:9px;line-height:1.7;margin:11px 0 0 30px;color:var(--muted)}
.rpd-radius-note strong{color:var(--rpd-ink);font-weight:700}
.rpd-interest{max-width:490px;margin:auto}
.rpd-pair{display:grid;grid-template-columns:minmax(0,1fr) 43px minmax(0,1fr);align-items:center;max-width:365px;margin:0 auto 15px;gap:4px}
.rpd-person{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0}
.rpd-person .rpd-figure{width:123px;max-width:100%;transform:rotate(-5deg);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.rpd-person:last-child .rpd-figure{transform:rotate(5deg)}
.rpd-interest[data-rpd-interest-state=accepted] .rpd-person .rpd-figure{transform:rotate(1deg)}
.rpd-interest[data-rpd-interest-state=accepted] .rpd-person:last-child .rpd-figure{transform:rotate(-2deg)}
.rpd-person-label{font-size:10px;line-height:1.5;text-align:center;color:var(--muted);max-width:120px}
.rpd-person-check{position:absolute;top:49%;right:3%;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--rpd-soft);color:var(--rpd-soft-ink);border:1px solid var(--rpd-line);opacity:0;transform:scale(.7);transition:opacity .5s,transform .5s}
.rpd-person-check>svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
.rpd-interest[data-rpd-interest-state=pending] .rpd-person:first-child .rpd-person-check,.rpd-interest[data-rpd-interest-state=accepted] .rpd-person-check{opacity:1;transform:scale(1)}
.rpd-link{display:flex;justify-content:center;gap:6px;margin-top:-8px}
.rpd-link>i{width:4px;height:4px;border-radius:50%;background:var(--rpd-line);transition:background .4s,transform .4s}
.rpd-interest[data-rpd-interest-state=pending] .rpd-link>i:first-child,.rpd-interest[data-rpd-interest-state=accepted] .rpd-link>i{background:var(--accent);transform:scale(1.25)}
.rpd-interest-status{font-size:12px;line-height:1.75;text-align:center;min-height:43px;max-width:390px;margin:0 auto 16px;color:var(--rpd-ink)}
.rpd-request{display:flex;align-items:center;justify-content:center;min-height:45px;margin:auto;padding:11px 20px;border-radius:28px;background:var(--rpd-ink);color:var(--bg);font-size:11px;font-weight:700;line-height:1.55;text-align:center;max-width:100%}
.rpd-responses{border:0;padding:0;margin:21px 0 0;min-width:0}
.rpd-responses legend{display:block;text-align:center;width:100%;padding:0;font-size:10px;line-height:1.5;color:var(--muted)}
.rpd-responses>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.rpd-responses button{min-width:0;min-height:45px;padding:10px 11px;background:transparent;color:var(--rpd-ink);border:1px solid var(--rpd-line);border-radius:24px;font-size:10px;line-height:1.5}
.rpd-responses button[aria-pressed=true]{background:var(--rpd-soft);border-color:var(--rpd-soft);color:var(--rpd-soft-ink);font-weight:700}
.rpd-consent-note{font-size:10px;line-height:1.85;color:var(--muted);max-width:425px;text-align:center;margin:17px auto 0}
.rpd-bottomline{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;border-top:1px solid var(--rpd-line);padding-top:17px;font-size:10px;line-height:1.8;color:var(--muted)}
.rpd-bottomline>p:first-child{max-width:260px}.rpd-bottomline>p:last-child{max-width:460px;text-align:right}
@media(max-width:1050px){.rpd-slide{gap:28px;padding-inline:8px;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)}.rpd-copy h3{font-size:45px}.rpd-settings{gap:25px 15px}.rpd-setting-value{font-size:56px}.rpd-setting legend{font-size:10px}.rpd-setting legend>svg{width:21px;height:21px}.rpd-options>button{font-size:10px;padding-inline:7px}.rpd-time-controls{align-items:flex-start;gap:13px}.rpd .rpd-figure-arriving{left:11%}.rpd .rpd-figure-nearby{right:10%}.rpd-time-status{min-height:38px}}
@media(max-width:760px){
  .rpd{margin-top:28px}.rpd-topline{padding-bottom:14px}.rpd-topline p{font-size:10px}
  .rpd-steps>button{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;font-size:10px;line-height:1.5;padding:14px 9px;min-height:88px}.rpd-step-number{width:23px;height:23px;font-size:9px}
  .rpd-slide{grid-template-columns:minmax(0,1fr);gap:0;min-height:0;padding:28px 7px 32px;align-items:start}
  .rpd-copy{display:contents}.rpd-kicker{grid-row:1;margin-bottom:10px;font-size:8px}.rpd-copy h3{grid-row:2;font-size:clamp(39px,9vw,55px);max-width:590px;line-height:1.03}.rpd-description{grid-row:3;font-size:12px;line-height:1.85;max-width:520px;margin-top:15px}.rpd-visual{grid-row:4;margin-top:27px;max-width:540px}.rpd-leaving-note{grid-row:5;max-width:430px;margin-top:23px;font-size:10px}.rpd-continue{grid-row:6;justify-self:start;margin-top:23px;font-size:11px}
  .rpd-settings{gap:23px 20px}.rpd-setting-value{font-size:clamp(51px,12vw,72px)}.rpd-setting legend{font-size:10px;gap:7px}.rpd-setting legend>svg{width:21px;height:21px}.rpd-setting-help{font-size:10px}.rpd-values-note{font-size:10px;padding-top:16px}.rpd-options>button{font-size:11px;min-height:43px}
  .rpd-event-scene{height:205px;max-width:390px}.rpd-clockline{font-size:10px}.rpd-time-status{font-size:11px;min-height:0}.rpd-time-controls>p{font-size:9px}.rpd-filter-note{margin-top:13px;padding-top:14px}.rpd-interest{max-width:420px}.rpd-pair{max-width:340px}.rpd-person .rpd-figure{width:123px}.rpd-consent-note{font-size:10px}
  .rpd-bottomline{flex-direction:column;gap:7px;padding-top:14px;font-size:9px}.rpd-bottomline>p:last-child{max-width:490px;text-align:left}
}
@media(max-width:380px){
  .rpd-steps>button{font-size:9px;padding:12px 6px;min-height:88px}.rpd-topline{gap:12px}.rpd-topline p{max-width:190px}.rpd-topline>span{font-size:11px}
  .rpd-slide{padding-inline:4px}.rpd-copy h3{font-size:39px}.rpd-settings{column-gap:12px}.rpd-setting legend{display:block;min-height:36px;font-size:10px;line-height:1.5}.rpd-setting legend>svg{display:none}.rpd-setting-value{font-size:51px;gap:5px;margin-top:5px}.rpd-setting-value small{font-size:11px}.rpd-options{gap:5px}.rpd-options>button{font-size:10px;padding-inline:6px}.rpd-setting-help{font-size:9px}
  .rpd-event-scene{height:180px}.rpd .rpd-figure-arriving{width:115px;left:8%;bottom:9px}.rpd .rpd-figure-nearby{width:99px;right:5%;bottom:9px}.rpd-venue-label{right:1%;font-size:8px;letter-spacing:1px}.rpd-you-label{left:8%;font-size:9px}.rpd-event-door{right:11%;bottom:27px}.rpd-time-controls{gap:12px}.rpd-time-controls>button{font-size:9px;max-width:42%}.rpd-time-controls>p{font-size:8px}.rpd-clockline strong{font-size:15px}
  .rpd-pair{grid-template-columns:minmax(0,1fr) 27px minmax(0,1fr);gap:2px}.rpd-person .rpd-figure{width:113px}.rpd-link{gap:4px}.rpd-person-label{font-size:9px}.rpd-person-check{right:0;width:24px;height:24px}.rpd-interest-status{font-size:11px}.rpd-request{font-size:10px;padding-inline:15px}.rpd-responses button{font-size:9px;padding-inline:8px}.rpd-consent-note{font-size:9px}
}
:root[data-motion=paused] .rpd-viewport,:root[data-motion=paused] .rpd-figure,:root[data-motion=paused] .rpd-person-check,:root[data-motion=paused] .rpd-link>i,:root[data-motion=paused] .rpd-filter-note>svg{transition:none}
@media(prefers-reduced-motion:reduce){.rpd-viewport{scroll-behavior:auto}.rpd *{transition:none!important;animation:none!important}}
