.tl-demo .ss-stage{--ss-font:var(--font-geist-sans), Inter, system-ui, sans-serif;--mark-bg:color-mix(in srgb, var(--ss-accent) 14%, transparent);--mark-ink:#1f4fd6;--ss-canvas:#fafafa;background:0 0;overflow:hidden;-webkit-mask-image:linear-gradient(#000 calc(100% - 72px),#0000 100%);mask-image:linear-gradient(#000 calc(100% - 72px),#0000 100%)}.tl-demo .tl-demo-window{width:800px;height:900px;box-shadow:var(--ss-shadow-hero);position:absolute;top:24px;left:48px}.tl-demo .ss-window__body{padding:20px 24px 18px 22px;overflow:hidden}.tl-demo .tl-demo-meta{align-items:center;gap:12px;margin-bottom:20px;display:flex}.tl-demo .tl-demo-meta-text{color:var(--ss-text-faint);font-size:12.5px}.tl-demo .tl-demo-rec{background:var(--ss-raised,var(--ss-surface));height:24px;color:var(--ss-text-strong);box-shadow:0 0 0 1px var(--ss-line);border-radius:999px;align-items:center;gap:7px;padding:0 10px 0 8px;transition:background .3s;display:inline-flex}.tl-demo .tl-demo-rec i{background:#e5484d;border-radius:50%;width:7px;height:7px;animation:1.6s ease-in-out infinite tl-demo-pulse;box-shadow:0 0 0 3px #e5484d2e}.tl-demo .tl-demo-rec[data-stopped] i{background:var(--ss-text-faint);box-shadow:none;animation:none}.tl-demo .tl-demo-rec-text{font-variant-numeric:tabular-nums;color:inherit;font-size:12px;font-weight:500}@keyframes tl-demo-pulse{0%,to{opacity:1}50%{opacity:.55}}.tl-demo .tl-demo-line{align-items:flex-start;gap:12px;margin-bottom:18px;display:flex}.tl-demo .tl-demo-who{color:var(--ss-text-faint);margin-bottom:2px;font-size:12px;line-height:1.3;display:block}.tl-demo .tl-demo-say{max-width:520px;color:var(--ss-text-strong);white-space:normal;font-size:15px;line-height:1.45;display:block}.tl-demo .tl-demo-stream .ss-stream{line-height:inherit}.tl-demo .tl-demo-phrase{border-radius:2px;transition:background-color .35s,box-shadow .35s,color .35s,opacity .2s}.tl-demo .tl-demo-phrase[data-on]{background:var(--mark-bg);box-shadow:0 0 0 2px var(--mark-bg);color:var(--mark-ink)}.tl-demo .tl-demo-phrase .ss-stream__w[data-mark]{background:0 0}.tl-demo .tl-demo-card{background:var(--ss-raised,#f5f5f7);width:420px;box-shadow:0 0 0 1px var(--ss-line);border-radius:10px;flex-direction:column;gap:2px;margin:6px 0 20px;padding:16px 8px;display:flex}.tl-demo .tl-demo-card-head{letter-spacing:.02em;color:var(--ss-text-faint);align-self:flex-start;margin:0 0 6px 8px;font-size:11px;font-weight:500}.tl-demo .tl-demo-item{border-radius:7px;align-items:flex-start;gap:9px;padding:7px 8px;display:flex}.tl-demo .tl-demo-check{border:1.5px solid var(--ss-line-strong,var(--ss-line));border-radius:4px;flex:none;width:13px;height:13px;margin-top:2px}.tl-demo .tl-demo-item-copy{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.tl-demo .tl-demo-item-text{white-space:nowrap;color:var(--ss-text-strong);font-size:13px;line-height:1.35}.tl-demo .tl-demo-item-meta{color:var(--ss-text-faint);font-size:11px}.tl-demo .tl-demo-item--new{background:0 0;transition:background-color .3s 50ms}.tl-demo .tl-demo-item--new .tl-demo-check,.tl-demo .tl-demo-item--new .tl-demo-item-meta{opacity:0;transition:opacity .3s 50ms}.tl-demo .tl-demo-item--new .tl-demo-item-text{opacity:0}.tl-demo .tl-demo-item--new[data-landed]{background:var(--mark-bg)}.tl-demo .tl-demo-item--new[data-landed] .tl-demo-check{border-color:var(--ss-accent);opacity:1}.tl-demo .tl-demo-item--new[data-landed] .tl-demo-item-meta,.tl-demo .tl-demo-item--new[data-landed] .tl-demo-item-text{opacity:1}.tl-demo .tl-demo-flyer{white-space:nowrap;font-family:var(--ss-font);background:var(--mark-bg);box-shadow:0 0 0 2px var(--mark-bg);color:var(--mark-ink);border-radius:2px;font-size:15px;line-height:1.5;transition:background-color .3s .45s,box-shadow .3s .45s,color .3s .45s,font-size .3s .3s;display:inline-block}.tl-demo .ss-fly[data-go] .tl-demo-flyer{color:var(--ss-text-strong);background:0 0;font-size:13px;box-shadow:0 0 0 2px #0000}.tl-demo .tl-demo-turn{z-index:2;perspective:1600px;perspective-origin:50% 40%;cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none;width:320px;height:673px;position:absolute;top:96px;left:635px}.tl-demo .tl-demo-turn[data-dragging]{cursor:grabbing}.tl-demo .tl-demo-obj{transform-style:preserve-3d;transform:rotateY(var(--tl-angle,0deg));transition:transform 1.4s cubic-bezier(.3,.7,.2,1);position:absolute;inset:0}.tl-demo .tl-demo-turn[data-dragging] .tl-demo-obj{transition:none}@media (prefers-reduced-motion:reduce){.tl-demo .tl-demo-obj{transition:none}}.tl-demo .tl-demo-face{backface-visibility:hidden;position:absolute;inset:0}.tl-demo .tl-demo-face--front{transform:translateZ(18px)}.tl-demo .tl-demo-face--back{transform:rotateY(180deg)translateZ(18px)}.tl-demo .tl-demo-edge{background:linear-gradient(#3a3a3e,#232326);border:.5px solid #ffffff1f;border-radius:57.6px;position:absolute;inset:0}.tl-demo .tl-demo-phone{box-shadow:var(--ss-shadow-satellite), 0 30px 50px -20px #32325d59;position:static}.tl-demo .tl-demo-phone img{pointer-events:none}.tl-demo .tl-demo-back .ss-phone__content{padding:0;position:absolute;inset:0}.tl-demo .tl-demo-back .ss-phone__home{display:none}.tl-demo .tl-demo-back-photo{object-fit:cover;object-position:50% 0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.tl-demo .tl-demo-back-light{mix-blend-mode:screen;background:#ff3b309e;border-radius:19px;width:66px;height:37px;transition:opacity .6s;position:absolute;top:300px;left:79px;box-shadow:0 0 12px 4px #ff3b3080}.tl-demo .tl-demo-back[data-stopped] .tl-demo-back-light{opacity:0}.tl-demo .tl-demo-live{-webkit-backdrop-filter:blur(30px)saturate(1.25);color:#fff;font-family:var(--ss-font);background:#1c1c1ea8;border-radius:23px;flex-direction:column;gap:10px;margin:0 18px;padding:14px;display:flex;box-shadow:inset 0 0 0 .5px #ffffff24,0 4px 24px #0003}.tl-demo .tl-demo-live-row{align-items:center;gap:12px;display:flex}.tl-demo .tl-demo-live-lead{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.tl-demo .tl-demo-live-name{letter-spacing:-.02em;white-space:nowrap;align-items:center;gap:7px;font-size:17px;font-weight:600;line-height:1.15;display:inline-flex}.tl-demo .tl-demo-live-state{color:#ffffffa8;align-items:center;gap:6px;font-size:14px;font-weight:500;line-height:1.2;display:inline-flex}.tl-demo .tl-demo-live-state i{background:#ff453a;border-radius:50%;width:8px;height:8px;animation:1.6s ease-in-out infinite tl-demo-pulse}.tl-demo .tl-demo-live[data-stopped] .tl-demo-live-state i{background:#fff6;animation:none}.tl-demo .tl-demo-live-time{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:34px;font-weight:600;line-height:1}.tl-demo .tl-demo-live-stop{background:#ff453a;border-radius:50%;flex:none;place-items:center;width:36px;height:36px;transition:background-color .4s;display:grid;position:relative}.tl-demo .tl-demo-live-stop i{background:#fff;border-radius:3px;width:13px;height:13px;transition:opacity .3s;position:absolute}.tl-demo .tl-demo-live-stop svg{opacity:0;transition:opacity .3s .15s;position:relative}.tl-demo .tl-demo-live[data-stopped] .tl-demo-live-stop{background:#ffffff38}.tl-demo .tl-demo-live[data-stopped] .tl-demo-live-stop i{opacity:0}.tl-demo .tl-demo-live[data-stopped] .tl-demo-live-stop svg{opacity:1}.tl-demo .tl-demo-live-wave{background:#ffffff14;border-radius:9px;justify-content:space-between;align-items:center;height:30px;padding:0 5px;display:flex}.tl-demo .tl-demo-live-wave b{transform-origin:50%;background:#ffffffb8;border-radius:2px;flex:none;width:3px;animation:1.1s ease-in-out infinite alternate tl-demo-wave;display:block}.tl-demo .tl-demo-live[data-stopped] .tl-demo-live-wave b{background:#ffffff57;transition:transform .4s,background-color .4s;animation:none;transform:scaleY(.5)}@keyframes tl-demo-wave{0%{transform:scaleY(.5)}to{transform:scaleY(1)}}.tl-demo .ss-stage[data-layout=compact]{-webkit-mask-image:linear-gradient(#000 calc(100% - 36px),#0000 100%);mask-image:linear-gradient(#000 calc(100% - 36px),#0000 100%)}.tl-demo .ss-stage[data-layout=compact] .tl-demo-window{width:326px;height:440px;top:16px;left:16px}.tl-demo .ss-stage[data-layout=compact] .ss-window__body{padding:14px 16px 12px}.tl-demo .ss-stage[data-layout=compact] .tl-demo-card{width:294px;margin:2px 0 0;padding:8px 6px}.tl-demo .ss-stage[data-layout=compact] .tl-demo-card-head,.tl-demo .ss-stage[data-layout=compact] .tl-demo-tail{display:none}.tl-demo .ss-stage[data-layout=compact] .tl-demo-say{max-width:262px;font-size:14px}.tl-demo .ss-stage[data-layout=compact] .tl-demo-line:nth-of-type(2),.tl-demo .ss-stage[data-layout=compact] .tl-demo-meta-text{display:none}.tl-demo .ss-stage[data-layout=compact] .tl-demo-meta,.tl-demo .ss-stage[data-layout=compact] .tl-demo-line{margin-bottom:10px}.tl-demo .ss-stage[data-layout=compact] .tl-demo-item:not(.tl-demo-item--new),.tl-demo .ss-stage[data-layout=compact] .tl-demo-turn{display:none}
.tl-rec .ss-stage{--ss-font:var(--font-geist-sans), Inter, system-ui, sans-serif;--ss-canvas:transparent;--ss-surface:#27292d;--ss-raised:#313337;--ss-chrome:#2d2f33;--ss-fill:#3a3c41;--ss-well:#1f2023;--ss-line:#ffffff1a;--ss-line-faint:#ffffff0f;--ss-text-strong:#f2f2f1;--ss-text:#ffffffa3;--ss-text-faint:#ffffff7a;--ss-icon:#ffffffa3;--ss-icon-faint:#6f7074;--ss-shadow-hero:none;--ss-shadow-card:none;--ss-shadow-satellite:none;background:var(--background,#1f2023);overflow:hidden}.tl-rec .tl-band-card{background:linear-gradient(#ffffff0b 0%,#fff0 60%),#2a2b2f;border-radius:20px;width:440px;height:420px;position:absolute;top:88px;left:20px;overflow:hidden;box-shadow:0 0 0 .5px #ffffff29,inset 0 0 11px #ffffff14,0 7px 8px -4px #00000038,0 11px 28px -4px #00000038}.tl-rec .tl-band-card:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(#2a2b2f00 0%,#2a2b2ffa 60%,#2a2b2f 100%);height:96px;position:absolute;bottom:0;left:0;right:0}.tl-rec .tl-band-label{isolation:isolate;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;top:52px;left:0;right:0}.tl-rec .tl-band-name{color:#f7f7f8;font-size:12px;font-weight:500}.tl-rec .tl-band-dot{color:#ffffff80;font-size:12px}.tl-rec .tl-band-role{color:#ffffff80;font-size:12px;font-weight:400}.tl-rec .tl-band-bubble{background:linear-gradient(#ffffff14,#0000),#3b3c3f;border:1px solid #ffffff1f;border-radius:14px;box-shadow:inset 0 .5px #ffffff4d}.tl-rec .tl-rec-card{padding:22px 22px 0}.tl-rec .tl-rec-head{justify-content:space-between;align-items:flex-start;margin-bottom:18px;display:flex}.tl-rec .tl-rec-title{letter-spacing:-.02em;color:var(--ss-text-strong);font-size:20px;font-weight:600;line-height:1.1;display:block}.tl-rec .tl-rec-date{color:var(--ss-text-faint);margin-top:4px;font-size:12px;display:block}.tl-rec .tl-rec-badge{opacity:0;will-change:transform;margin-top:2px;transition:opacity .35s,transform .45s cubic-bezier(.22,1,.36,1);transform:translateY(-8px)}.tl-rec .tl-rec-badge[data-show]{opacity:1;transform:none}.tl-rec .tl-rec-badge .ss-badge{height:24px;padding:0 10px 0 8px;font-size:12px}.tl-rec .tl-rec-pill{color:var(--ss-text-strong);will-change:transform;align-items:center;gap:10px;padding:12px 15px;transition:transform .15s;display:flex}.tl-rec .tl-rec-pill[data-pressed]{transform:scale(.99)}.tl-rec .tl-rec-dot{background:#e5484d;border-radius:50%;width:9px;height:9px;transition:background .4s,box-shadow .4s;animation:1.6s ease-in-out infinite tl-rec-pulse;box-shadow:0 0 0 4px #e5484d38}.tl-rec .tl-rec-pill[data-saved] .tl-rec-dot{background:var(--ss-text-faint);box-shadow:none;animation:none}@keyframes tl-rec-pulse{0%,to{opacity:1}50%{opacity:.55}}.tl-rec .tl-rec-label{font-size:14px;font-weight:600}.tl-rec .tl-rec-time{font-variant-numeric:tabular-nums;color:var(--ss-text);margin-left:auto;font-size:13px}.tl-rec .tl-rec-list{margin:14px -10px 0}.tl-rec .tl-rec-list .ss-row{--ss-row-title:13px;--ss-row-subtitle:12px;--ss-row-meta:11.5px;--ss-row-line:18px;--ss-row-line-2:18px;--ss-row-pad:14px;padding-left:10px;padding-right:10px}.tl-rec .tl-rec-list .ss-row+.ss-row,.tl-rec .tl-rec-list .ss-collapse+.ss-row{box-shadow:inset 0 1px 0 var(--ss-line-faint)}.tl-rec .tl-rec-new{margin:0 0 2px}.tl-rec .tl-rec-badge .ss-badge,.tl-rec .tl-rec-badge .ss-badge[data-tone]{background:linear-gradient(#ffffff14,#0000),#3b3c3f;border:1px solid #ffffff1f;box-shadow:inset 0 .5px #ffffff4d}.tl-rec .ss-stage[data-layout=compact] .tl-band-card{width:326px;height:420px;top:72px;left:16px}.tl-rec .ss-stage[data-layout=compact] .tl-band-card:after{height:48px}.tl-rec .ss-stage[data-layout=compact] .tl-band-label{top:36px}.tl-rec .ss-stage[data-layout=compact] .tl-rec-card{padding:18px 16px 0}.tl-rec .ss-stage[data-layout=compact] .tl-rec-list .ss-row{--ss-row-pad:12px}.tl-rec .ss-stage[data-layout=compact] .tl-rec-fifth{display:none}.tl-rec .ss-stage{background:0 0}.tl-rec .ss-stage:not([data-layout=compact]) .tl-rec-fifth{display:none}.tl-rec .ss-stage:not([data-layout=compact]) .tl-band-card:after{height:48px}.tl-rec .tl-rec-badge .ss-check__fill{fill:var(--ss-accent)}
.tl-fol .ss-stage{--ss-font:var(--font-geist-sans), Inter, system-ui, sans-serif;--ss-canvas:transparent;--ss-surface:#27292d;--ss-raised:#313337;--ss-chrome:#2d2f33;--ss-fill:#3a3c41;--ss-well:#1f2023;--ss-line:#ffffff1a;--ss-line-faint:#ffffff0f;--ss-text-strong:#f2f2f1;--ss-text:#ffffffa3;--ss-text-faint:#ffffff7a;--ss-icon:#ffffffa3;--ss-icon-faint:#6f7074;--ss-shadow-hero:none;--ss-shadow-card:none;--ss-shadow-satellite:none;background:var(--background,#1f2023);overflow:hidden}.tl-fol .tl-band-card{background:linear-gradient(#ffffff0b 0%,#fff0 60%),#2a2b2f;border-radius:20px;width:440px;height:420px;position:absolute;top:88px;left:20px;overflow:hidden;box-shadow:0 0 0 .5px #ffffff29,inset 0 0 11px #ffffff14,0 7px 8px -4px #00000038,0 11px 28px -4px #00000038}.tl-fol .tl-band-card:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(#2a2b2f00 0%,#2a2b2ffa 60%,#2a2b2f 100%);height:48px;position:absolute;bottom:0;left:0;right:0}.tl-fol .tl-band-label{isolation:isolate;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;top:52px;left:0;right:0}.tl-fol .tl-band-name{color:#f7f7f8;font-size:12px;font-weight:500}.tl-fol .tl-band-dot{color:#ffffff80;font-size:12px}.tl-fol .tl-band-role{color:#ffffff80;font-size:12px;font-weight:400}.tl-fol .tl-band-bubble{background:linear-gradient(#ffffff14,#0000),#3b3c3f;border:1px solid #ffffff1f;border-radius:14px;box-shadow:inset 0 .5px #ffffff4d}.tl-fol .tl-fol-card{padding:22px 24px 0}.tl-fol .tl-fol-head{align-items:baseline;gap:10px;margin-bottom:16px;display:flex}.tl-fol .tl-fol-title{letter-spacing:-.01em;color:var(--ss-text-strong);font-size:14px;font-weight:600}.tl-fol .tl-fol-meta{color:var(--ss-text-faint);font-size:13px}.tl-fol .tl-fol-steps{margin:0;padding:0 0 0 2px;list-style:none;position:relative}.tl-fol .tl-fol-steps:before{content:"";background:var(--ss-line);width:1px;position:absolute;top:12px;bottom:12px;left:10px}.tl-fol .tl-fol-step{opacity:.42;align-items:flex-start;gap:16px;padding:0 0 20px;transition:opacity .45s;display:flex;position:relative}.tl-fol .tl-fol-step[data-on],.tl-fol .tl-fol-step[data-next]{opacity:1}.tl-fol .tl-fol-step:last-child{padding-bottom:0}.tl-fol .tl-fol-check{background:var(--ss-surface);border-radius:50%;flex:none;margin-top:1px}.tl-fol .tl-fol-copy{flex-direction:column;gap:2px;min-width:0;display:flex}.tl-fol .tl-fol-step-head{color:var(--ss-text-strong);font-size:13px;font-weight:500;line-height:17px}.tl-fol .tl-fol-step-detail{color:var(--ss-text);align-items:center;gap:8px;font-size:12.5px;line-height:17px;display:flex}.tl-fol .tl-fol-step-detail q{quotes:"“" "”";color:var(--ss-text)}.tl-fol .tl-fol-step-detail .ss-brand{flex:none}.tl-fol .tl-fol-foot{box-shadow:inset 0 1px 0 var(--ss-line-faint);justify-content:center;align-items:center;gap:9px;margin-top:14px;padding:14px 12px 0;display:flex}.tl-fol .tl-fol-foot i{background:var(--ss-icon-faint);border-radius:50%;flex:none;width:7px;height:7px;transition:background .4s,box-shadow .4s;display:block}.tl-fol .tl-fol-foot[data-on] i{background:var(--ss-accent);box-shadow:0 0 0 3px var(--ss-accent-soft)}.tl-fol .tl-fol-step:not([data-on]) .ss-brand{filter:grayscale()}.tl-fol .tl-fol-foot .ss-text{color:var(--ss-text);font-size:12.5px}.tl-fol .ss-stage[data-layout=compact] .tl-band-card{width:326px;height:420px;top:72px;left:16px}.tl-fol .ss-stage[data-layout=compact] .tl-band-card:after{height:40px}.tl-fol .ss-stage[data-layout=compact] .tl-band-label{top:36px}.tl-fol .ss-stage[data-layout=compact] .tl-fol-card{padding:18px 18px 0}.tl-fol .ss-stage[data-layout=compact] .tl-fol-step:nth-child(5){display:none}.tl-fol .ss-stage[data-layout=compact] .tl-fol-step:nth-child(4){padding-bottom:0}.tl-fol .tl-fol-check .ss-check__fill{fill:var(--ss-text-strong)}.tl-fol .tl-fol-check .ss-check__tick{stroke:var(--ss-surface)}.tl-fol .ss-stage{background:0 0}.tl-fol .ss-stage[data-layout=compact] .tl-fol-foot{display:none}
