.ss{--pad:clamp(16px,4vw,48px);--grid:linear-gradient(rgba(55,98,227,.06) 1px,transparent 0),linear-gradient(90deg,rgba(55,98,227,.06) 1px,transparent 0);background:#f6f8fa;background-image:var(--grid);background-size:24px 24px;border-block:1px solid var(--srk-line);color:var(--srk-ink);font-family:var(--srk-font-body)}.ss__stage{align-items:center;display:grid;gap:32px 64px;grid-template-columns:minmax(300px,.8fr) 1.45fr;margin:0 auto;max-width:1344px;padding:clamp(64px,8vw,112px) var(--pad)}.ss--left .ss__stage{grid-template-columns:1.45fr minmax(300px,.8fr)}.ss--left .ss__board{order:-1}.ss__k{color:var(--srk-ink-3);font-size:15px;font-weight:600;margin:0 0 14px}.ss__h{font-family:var(--srk-font-display);font-size:clamp(30px,3.333cqw,48px);font-stretch:var(--srk-display-stretch);font-weight:var(--srk-display-weight);letter-spacing:var(--srk-display-tracking);line-height:1;margin:0;text-wrap:balance}.ss__lead{color:var(--srk-ink-2);font-size:17px;line-height:1.55;margin:16px 0 0;max-width:42ch}.ss__steps{border-top:1.5px solid var(--srk-ink);list-style:none;margin:24px 0 0;padding:0}.ss__steps li{border-bottom:1px solid var(--srk-line);display:grid;gap:8px;grid-template-columns:30px 1fr;padding:12px 0;transition:opacity .3s var(--srk-ease)}.ss__num{color:var(--srk-ink-3);font-family:var(--srk-font-mono);font-size:12px;padding-top:3px;transition:color .3s var(--srk-ease)}.ss__st{display:grid;gap:2px}.ss__st b{font-size:15.5px;font-weight:650;line-height:1.35}.ss__ref{font-family:var(--srk-font-mono);font-size:12px}.ss__ref,.ss__sp{color:var(--srk-ink-2)}.ss__sp{font-size:14px;line-height:1.45}.ss__figs{border-top:1.5px solid var(--srk-ink);display:flex;margin:24px 0 0}.ss__figs div{padding:12px 20px 0 0}.ss__figs div+div{border-left:1px solid var(--srk-line);padding-left:20px}.ss__figs dt{font-family:var(--srk-font-display);font-size:clamp(28px,2.5cqw,36px);font-stretch:var(--srk-display-stretch);font-weight:var(--srk-display-weight);letter-spacing:-.04em;line-height:1}.ss__figs dd{color:var(--srk-ink-3);font-size:13.5px;font-weight:600;margin:6px 0 0}.ss__board{min-width:0}.ss__frame{aspect-ratio:16/10;background:#fff;border:1px solid var(--srk-ink);box-shadow:0 24px 48px -28px #0a101c59;overflow:hidden;position:relative}.ss--open .ss__frame{aspect-ratio:auto;background:none;border:0;box-shadow:none;overflow:visible}.ss__tag{background:#fff;border:1px solid var(--srk-line);color:var(--srk-ink-2);font-family:var(--srk-font-mono);font-size:12px;left:12px;max-width:calc(100% - 24px);overflow:hidden;padding:4px 8px;position:absolute;text-overflow:ellipsis;top:12px;white-space:nowrap;z-index:3}.ss--open .ss__stage{gap:40px;grid-template-columns:1fr}.ss--open .ss__head{align-items:end;-moz-column-gap:64px;column-gap:64px;display:grid;grid-template-columns:1fr 1fr}.ss--open .ss__h,.ss--open .ss__k{grid-column:1}.ss--open .ss__lead{grid-column:2;grid-row:1/span 2;margin:0}.ss--open .ss__figs{grid-column:2}@container site (max-width: 900px){.ss--left .ss__stage,.ss__stage{grid-template-columns:1fr}.ss--open .ss__head{display:block}.ss--open .ss__lead{margin-top:16px}.ss--left .ss__board{order:0}}@container site (max-width: 760px){.ss__h{font-size:32px}.ss__lead{font-size:16px}}@media(min-height:521px){html[data-motion] .ss{background:none;border-block:0;height:calc(100svh + (var(--n) + 1)*34svh)}html[data-motion] .ss__stick{align-items:center;background:#f6f8fa;background-image:var(--grid);background-size:24px 24px;border-block:1px solid var(--srk-line);display:grid;height:calc(100svh - var(--hdr, 64px));overflow:clip;position:sticky;top:var(--hdr,64px)}html[data-motion] .ss__stage{padding-block:24px;width:100%}html[data-motion] .ss__frame{margin-inline:auto;max-height:calc(100svh - var(--hdr, 64px) - 64px)}html[data-motion] .ss--frame .ss__frame{width:min(100%,calc(160svh - var(--hdr, 64px)*1.6 - 102.4px))}html[data-motion] .ss.is-pinned .ss__steps li:not(.on){opacity:.38}html[data-motion] .ss.is-pinned .ss__steps li.done{opacity:.7}html[data-motion] .ss.is-pinned .ss__steps li.on .ss__num{color:var(--srk-blue)}@media(max-width:900px){html[data-motion] .ss{height:calc(100svh + (var(--n) + 1)*26svh)}html[data-motion] .ss__stage{align-content:center;gap:16px;padding-block:12px}html[data-motion] .ss__board{order:-1!important}html[data-motion] .ss--frame .ss__frame{max-height:42svh;width:100%}html[data-motion] .ss__lead{display:none}html[data-motion] .ss__h{font-size:28px}html[data-motion] .ss__steps{display:grid;margin-top:14px}html[data-motion] .ss__steps li{border-bottom:0;grid-area:1/1}html[data-motion] .ss.is-pinned .ss__steps li.done,html[data-motion] .ss.is-pinned .ss__steps li:not(.on){opacity:0}html[data-motion] .ss__figs{margin-top:10px}html[data-motion] .ss__figs dt{font-size:26px}}}@media(min-height:521px){html[data-motion] .ss.is-pinned .ks__bnd{animation:ss-draw 1.1s var(--srk-build) both;stroke-dasharray:6000}html[data-motion] .ss.is-pinned :is(.ks__tree,.ks__ease,.ks__bng){animation:ss-fade .6s var(--srk-ease) both}}@keyframes ss-draw{0%{fill-opacity:0;stroke-dashoffset:6000}60%{fill-opacity:0}to{fill-opacity:1;stroke-dashoffset:0}}@keyframes ss-fade{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.ss__steps li{transition:none}}