@keyframes tlFill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes tlLive{0%,to{opacity:1}50%{opacity:.3}}@keyframes tlExPop{0%{transform:scale(.78)}55%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes tlLineA{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes tlLineB{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.tl-live{animation:1.8s ease-in-out infinite tlLive}.tl-fill,.tl-exfill{background:var(--primary);transform-origin:0;height:100%;animation-name:tlFill;animation-timing-function:linear;animation-fill-mode:both;display:block}.tl-exfill{border-radius:2px}.tl-demo{--tl-rule:color-mix(in oklab, var(--primary) 50%, var(--background));--tl-rule-soft:color-mix(in oklab, var(--primary) 24%, var(--background));--tl-warp:color-mix(in oklch, var(--muted) 80%, transparent);--tl-ease:cubic-bezier(.22, 1, .36, 1);--tl-ease-io:cubic-bezier(.65, 0, .35, 1);--tl-good-ink:color-mix(in oklab, var(--success) 58%, var(--foreground));--tl-bad-ink:color-mix(in oklab, var(--warning) 65%, var(--foreground));--tl-accent-ink:color-mix(in oklab, var(--accent) 60%, var(--foreground));--tl-shade:oklch(22% .01 75);width:100%;max-width:1280px;font-family:var(--font-sans);flex-direction:column;gap:14px;scroll-margin-top:4rem;display:flex}:root.theme-modernisme:not(.dark) .tl-demo{--tl-good-ink:color-mix(in oklab, var(--success) 40%, var(--foreground))}.tl-demo :is(a,button,input):focus-visible{outline:2px solid color-mix(in oklab, var(--primary) 70%, var(--foreground));outline-offset:2px;border-radius:6px}.tl-exrail{border:1px solid var(--border);background:color-mix(in oklab, var(--card) 90%, transparent);box-shadow:0 1px 2px color-mix(in oklab, var(--tl-shade) 4%, transparent), 0 22px 44px -34px color-mix(in oklab, var(--tl-shade) 40%, transparent);border-radius:18px;align-items:center;gap:6px;padding:6px;display:flex}.tl-ex-grid{flex:1;grid-template-columns:repeat(5,minmax(0,1fr));min-width:0;display:grid;position:relative}.tl-ex-thumb{background:linear-gradient(180deg, color-mix(in oklab, var(--primary) 14%, var(--card)), color-mix(in oklab, var(--primary) 7%, var(--card)));width:20%;box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--primary) 42%, transparent), 0 12px 26px -18px color-mix(in oklab, var(--primary) 90%, transparent);transform:translateX(calc(var(--i,0) * 100%));pointer-events:none;border-radius:13px;transition:transform .6s cubic-bezier(.2,.85,.2,1.04);position:absolute;top:0;bottom:0;left:0}.tl-ex-cell{z-index:1;min-width:0;position:relative}.tl-ex{width:100%;height:56px;color:var(--foreground);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:13px;align-items:center;gap:10px;padding:0 12px;transition:background-color .2s;display:flex;position:relative}.tl-ex.tl-ex-on,.tl-ex.tl-ex-on:hover{background:0 0}.tl-ex-ic{background:color-mix(in oklab, var(--foreground) 4%, var(--card));width:34px;height:34px;color:var(--muted-foreground);box-shadow:inset 0 0 0 1px var(--border);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:background-color .3s,color .3s,transform .3s cubic-bezier(.2,.9,.3,1.3),box-shadow .3s;display:flex}.tl-ex-on .tl-ex-ic,.tl-ex-on:hover .tl-ex-ic{background:var(--primary);color:var(--primary-foreground);box-shadow:0 8px 18px -10px color-mix(in oklab, var(--primary) 95%, transparent);animation:.55s cubic-bezier(.2,.9,.3,1.35) tlExPop;transform:none}.tl-ex-tx{flex-direction:column;gap:1px;min-width:0;display:flex}.tl-ex-lb{color:color-mix(in oklab, var(--foreground) 80%, transparent);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;line-height:1.25;transition:color .2s;overflow:hidden}.tl-ex:hover .tl-ex-lb,.tl-ex-on .tl-ex-lb{color:var(--foreground)}.tl-ex-bar{background:0 0;border-radius:2px;height:2px;transition:background-color .3s;position:absolute;bottom:6px;left:14px;right:14px;overflow:hidden}.tl-ex-on .tl-ex-bar{background:color-mix(in oklab, var(--primary) 20%, transparent)}.tl-ex-pop{z-index:90;box-sizing:border-box;border:1px solid var(--border);background:var(--popover,var(--card));width:300px;color:var(--foreground);box-shadow:0 26px 54px -26px color-mix(in oklab, var(--tl-shade) 50%, transparent), 0 2px 6px color-mix(in oklab, var(--tl-shade) 5%, transparent);opacity:0;visibility:hidden;pointer-events:none;text-align:left;border-radius:14px;flex-direction:column;gap:9px;padding:14px;transition:opacity .18s,transform .18s,visibility 0s linear .18s;display:flex;position:absolute;top:calc(100% + 14px);left:50%;transform:translate(-50%,6px)}.tl-ex-pop:before{content:"";background:inherit;border-left:1px solid var(--border);border-top:1px solid var(--border);width:10px;height:10px;position:absolute;top:-6px;left:50%;transform:translate(-50%)rotate(45deg)}.tl-ex:focus-visible+.tl-ex-pop{opacity:1;visibility:visible;transition-delay:0s;transform:translate(-50%)}.tl-ex-pop-h{align-items:center;gap:10px;display:flex}.tl-ex-av{background:color-mix(in oklab, var(--primary) 18%, var(--card));width:34px;height:34px;color:var(--primary-ink);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.tl-ex-pop-who{min-width:0;color:var(--muted-foreground);flex-direction:column;gap:1px;font-size:12px;line-height:1.35;display:flex}.tl-ex-pop-who b{color:var(--foreground);font-size:13.5px;font-weight:600}.tl-ex-pop-k{font-family:var(--font-data);letter-spacing:.12em;text-transform:uppercase;color:var(--primary-ink);margin-top:2px;font-size:10px;font-weight:600}.tl-ex-pop-q{font-family:var(--font-display);color:var(--foreground);font-size:15.5px;line-height:1.35}.tl-ex-pop-src{flex-wrap:wrap;gap:6px;display:flex}.tl-ex-pop-src>span{border:1px solid var(--border);background:var(--background);max-width:100%;color:var(--muted-foreground);white-space:nowrap;text-overflow:ellipsis;border-radius:999px;align-items:center;gap:5px;padding:3px 8px;font-size:11px;display:inline-flex;overflow:hidden}.tl-ex-pop-cta{border-top:1px solid var(--border);color:var(--primary-ink);justify-content:space-between;align-items:center;gap:8px;padding-top:9px;font-size:12px;font-weight:600;display:flex}.tl-ex-own{box-sizing:border-box;border:1px dashed color-mix(in oklab, var(--primary) 50%, var(--border));height:56px;color:var(--foreground);border-radius:13px;flex-shrink:0;align-items:center;gap:10px;padding:0 14px 0 11px;text-decoration:none;transition:background-color .2s,border-color .2s;display:flex}.tl-ex-own .tl-ex-ic{color:var(--primary-ink);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--primary) 38%, transparent);background:0 0}.tl-ex-own .tl-ex-lb{color:var(--foreground)}.tl-exrail-pause{border:0;border-left:1px solid var(--border);height:56px;color:var(--foreground);font:inherit;white-space:nowrap;cursor:pointer;background:0 0;border-radius:0 13px 13px 0;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:13px;font-weight:500;transition:background-color .2s;display:inline-flex}@media (hover:hover) and (pointer:fine){.tl-ex:hover{background:color-mix(in oklab, var(--foreground) 4%, transparent)}.tl-ex-own:hover{background:color-mix(in oklab, var(--primary) 8%, transparent);color:var(--foreground);border-style:solid}.tl-ex-own:hover .tl-ex-ic{background:var(--primary);color:var(--primary-foreground);transform:rotate(90deg)}.tl-exrail-pause:hover{background:color-mix(in oklab, var(--foreground) 4%, transparent)}.tl-ex:hover .tl-ex-ic{color:var(--primary-ink);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--primary) 45%, transparent), 0 8px 16px -10px color-mix(in oklab, var(--primary) 80%, transparent);transform:translateY(-2px)rotate(-6deg)}.tl-ex-on:hover .tl-ex-ic{color:var(--primary-foreground);box-shadow:0 8px 18px -10px color-mix(in oklab, var(--primary) 95%, transparent);transform:none}.tl-ex-cell:hover .tl-ex-pop{opacity:1;visibility:visible;transition-delay:.15s,.15s,0s;transform:translate(-50%)}}.tl-dev{position:relative}.tl-dev-badge{z-index:3;border:1px solid var(--border);background:var(--background);color:var(--muted-foreground);pointer-events:none;border-radius:999px;padding:2px 10px;font-size:12px;line-height:1.4;position:absolute;top:-10px;right:24px}.tl-showing{color:var(--muted-foreground);flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0;padding:0 6px;font-size:13px;line-height:1.45;display:flex}.tl-showing-k{font-family:var(--font-data);letter-spacing:.12em;text-transform:uppercase;color:var(--primary-ink);align-items:center;gap:7px;font-size:10.5px;font-weight:600;display:inline-flex}.tl-showing-k .tl-live{background:var(--primary);border-radius:999px;width:7px;height:7px;display:inline-block}.tl-showing-v{color:var(--foreground);display:inline-block}.tl-showing-v b{font-weight:600}.tl-showing-r{align-items:center;gap:6px;margin-left:auto;display:inline-flex}.tl-lnA .tl-showing-v{animation:.7s cubic-bezier(.2,.8,.2,1) both tlLineA}.tl-lnB .tl-showing-v{animation:.7s cubic-bezier(.2,.8,.2,1) both tlLineB}.tl-demo-win{background:var(--background);border:1px solid color-mix(in oklab, var(--border) 90%, transparent);height:700px;color:var(--foreground);box-shadow:0 1px 0 oklab(100% 0 5.96046e-8/.65) inset, 0 2px 4px color-mix(in oklab, var(--tl-shade) 4%, transparent), 0 28px 64px -30px color-mix(in oklab, var(--tl-shade) 30%, transparent), 0 70px 130px -70px color-mix(in oklab, var(--primary) 55%, transparent);border-radius:16px;font-size:16px;line-height:1.5;display:flex;position:relative;overflow:hidden}@media (height<=860px){.tl-demo-win{height:620px}}@media (height<=760px){.tl-demo-win{height:560px}}.tl-stages{border-top:1px solid var(--border);grid-template-columns:repeat(4,minmax(0,1fr));gap:0;display:grid}.tl-stage{text-align:left;color:var(--foreground);font:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;gap:3px;padding:12px 16px 10px;display:flex;position:relative}.tl-stage-trk{height:2px;position:absolute;top:-1px;left:0;right:0;overflow:hidden}.tl-stage-h{align-items:baseline;gap:10px;display:flex}.tl-stage-n{font-family:var(--font-data);color:var(--muted-foreground);font-size:11.5px;font-weight:600}.tl-stage-lb{color:color-mix(in oklab, var(--foreground) 70%, transparent);font-size:15px;font-weight:600}.tl-stage[aria-pressed=true] .tl-stage-n{color:var(--primary-ink)}.tl-stage[aria-pressed=true] .tl-stage-lb{color:var(--foreground)}.tl-stage-cap{color:var(--muted-foreground);font-size:13px;line-height:1.4}@media (width<=1060px){.tl-ex,.tl-ex-own,.tl-exrail-pause{height:48px}.tl-ex-ic{width:30px;height:30px}}@media (width<=899px){.tl-exrail{flex-wrap:wrap}.tl-ex-grid{scroll-snap-type:x mandatory;scrollbar-width:none;flex:100%;gap:4px;display:flex;overflow-x:auto}.tl-ex-grid::-webkit-scrollbar{display:none}.tl-ex-cell{scroll-snap-align:start;flex:none}.tl-ex{width:auto}.tl-ex-thumb,.tl-ex-pop{display:none}.tl-ex.tl-ex-on,.tl-ex.tl-ex-on:hover{background:color-mix(in oklab, var(--primary) 12%, var(--card));box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--primary) 42%, transparent)}.tl-ex-own{flex:1}.tl-exrail-pause{border:1px solid var(--border);border-radius:13px}.tl-showing-r{margin-left:0}}@media (width<=767px){.tl-demo-win{border-radius:28px;width:100%;max-width:420px;height:660px;margin:0 auto}.tl-stage-cap{display:none!important}.tl-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){.tl-exfill,.tl-fill,.tl-live,.tl-ex-on .tl-ex-ic,.tl-lnA .tl-showing-v,.tl-lnB .tl-showing-v{animation:none!important}.tl-ex-thumb{transition:none}.tl-exfill{display:none}}@keyframes tlPickA{0%{opacity:.001;transform:translate(16px)}to{opacity:1;transform:none}}@keyframes tlPickB{0%{opacity:.001;transform:translate(16px)}to{opacity:1;transform:none}}.tl-pick,.tl-pick-dots,.tl-dev-strip,.tl-dev-cap,.tl-trust-m{display:none}@media (width<=767px){.tl-hero-in{gap:28px}.tl-demo{gap:12px}.tl-exrail,.tl-showing,.tl-stages,.tl-trust-d{display:none!important}.tl-pick{touch-action:pan-y;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;display:flex}.tl-pick-nav{border:1px solid var(--border);background:var(--card);width:44px;height:44px;color:var(--foreground);cursor:pointer;box-shadow:0 1px 2px color-mix(in oklab, var(--tl-shade) 5%, transparent);transition:transform .2s var(--tl-ease), background-color .2s ease, border-color .2s ease;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.tl-pick-nav:active{transform:scale(.9)}.tl-pick-next{border-color:color-mix(in oklab, var(--primary) 50%, var(--border));background:color-mix(in oklab, var(--primary) 14%, var(--card));color:var(--primary-ink)}.tl-pick-cur{flex:1;align-items:center;gap:11px;min-width:0;display:flex}.tl-pick-ic{background:var(--primary);width:42px;height:42px;color:var(--primary-foreground);box-shadow:0 10px 22px -12px color-mix(in oklab, var(--primary) 95%, transparent);border-radius:13px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.tl-pick-tx{flex-direction:column;gap:2px;min-width:0;display:flex}.tl-pick-tx.tl-lnA{animation:tlPickA .5s var(--tl-ease) both}.tl-pick-tx.tl-lnB{animation:tlPickB .5s var(--tl-ease) both}.tl-pick-lb{color:var(--foreground);align-items:baseline;gap:8px;font-size:17px;font-weight:600;line-height:1.2;display:flex}.tl-pick-who{color:var(--muted-foreground);white-space:nowrap;text-overflow:ellipsis;font-size:13px;line-height:1.35;overflow:hidden}.tl-pick-dots{gap:6px;margin-top:-4px;display:flex}.tl-pick-dot{cursor:pointer;background:0 0;border:0;flex:1;height:24px;padding:0;position:relative}.tl-pick-trk{background:color-mix(in oklab, var(--foreground) 12%, transparent);border-radius:4px;height:4px;transition:background-color .3s;position:absolute;top:10px;left:0;right:0;overflow:hidden}.tl-pick-dot.tl-pick-done .tl-pick-trk{background:color-mix(in oklab, var(--primary) 60%, transparent)}.tl-pick-dot.tl-ex-on .tl-pick-trk{background:color-mix(in oklab, var(--primary) 24%, transparent)}.tl-dev{box-sizing:border-box;background:linear-gradient(180deg, color-mix(in oklab, var(--foreground) 8%, var(--card)), color-mix(in oklab, var(--foreground) 4%, var(--card)));width:100%;max-width:400px;box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--foreground) 12%, transparent), 0 2px 4px color-mix(in oklab, var(--tl-shade) 5%, transparent), 0 34px 64px -30px color-mix(in oklab, var(--tl-shade) 45%, transparent), 0 70px 120px -60px color-mix(in oklab, var(--primary) 60%, transparent);border-radius:34px;margin:2px auto 0;padding:0 6px 6px;position:relative}.tl-dev-strip{align-items:center;gap:8px;height:44px;padding:0 4px 0 14px;display:flex}.tl-dev-s{color:var(--muted-foreground);font-size:12.5px}.tl-dev-badge{display:none}.tl-dev-b{min-width:44px;height:44px;color:var(--foreground);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;gap:6px;margin-left:auto;padding:0 12px;font-size:13px;font-weight:600;transition:transform .15s,background-color .2s;display:inline-flex}.tl-dev-b:active{background:color-mix(in oklab, var(--foreground) 6%, transparent);transform:scale(.95)}.tl-dev .tl-demo-win{max-width:none;height:clamp(480px,100svh - 220px,600px);box-shadow:0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);border:0;border-radius:26px;margin:0}.tl-dev-cap{text-align:center;max-width:360px;color:var(--muted-foreground);margin:4px auto 0;font-size:13px;line-height:1.45;display:block}.tl-dev-cap b{color:var(--foreground);font-weight:600}.tl-trust-m{border:1px solid var(--border);background:color-mix(in oklab, var(--card) 72%, transparent);color:var(--foreground);border-radius:18px;flex-direction:column;gap:12px;margin:12px 0 0;padding:16px 18px;font-size:14.5px;list-style:none;display:flex}.tl-trust-m li{align-items:center;gap:10px;display:flex}}@media (width<=767px) and (prefers-reduced-motion:reduce){.tl-pick-tx.tl-lnA,.tl-pick-tx.tl-lnB{animation:none!important}.tl-pick-nav,.tl-dev-b{transition:none!important}}
