.lq-motion-preview{color:#0b0b0b;max-width:920px;font-family:var(--font-inter),Inter,sans-serif;margin:0 auto;padding:44px 24px 80px}.lq-motion-heading{text-align:center;margin:0 0 32px}.lq-motion-eyebrow{letter-spacing:.17em;color:#727277;margin:0 0 16px;font-size:10px;font-weight:600}.lq-motion-heading h1{letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(34px,5vw,56px);font-weight:700;line-height:1.2}.lq-motion-description{color:#727277;margin:14px 0 0;font-size:16px;line-height:1.5}.lq-motion-player{color:#fff;background:#0b0b0b;border:1px solid #0b0b0b1f;border-radius:28px;overflow:hidden;box-shadow:0 28px 64px -44px #0b0b0b66}.lq-motion-stage{border-bottom:1px solid #ffffff14;grid-template-columns:minmax(0,1fr);place-items:center;min-height:436px;display:grid;position:relative}.lq-motion-stage-label,.lq-motion-stage-duration{color:#ffffff8f;font-variant-numeric:tabular-nums;font-size:11px;line-height:1.5;position:absolute;top:25px}.lq-motion-stage-label{align-items:center;gap:8px;display:inline-flex;left:28px}.lq-motion-stage-label i{background:#ff1f2d;border-radius:50%;width:5px;height:5px;display:inline-block}.lq-motion-stage-duration{right:28px}.lq-motion-preview .lq-motion-symbol{isolation:isolate;aspect-ratio:1;width:min(360px,76%);min-width:0;position:relative}.lq-motion-preview .lq-q-vector{width:100%;height:100%;display:block;position:absolute;inset:0}.lq-motion-controls{padding:25px 28px 24px}.lq-motion-phases{grid-template-columns:1fr 1fr 1fr;gap:20px;display:grid}.lq-motion-phase{color:#fff6;min-width:0}.lq-motion-phase.is-active{color:#ffffffe0}.lq-motion-phase-track{background:#ffffff1a;border-radius:2px;height:2px;overflow:hidden}.lq-motion-phase-track>span{transform-origin:0;background:#ff1f2d;width:100%;height:100%;display:block}.lq-motion-phase>span{align-items:baseline;gap:8px;margin-top:10px;font-size:12px;line-height:1.5;display:flex}.lq-motion-phase small{font-variant-numeric:tabular-nums;opacity:.55;font-size:9px}.lq-motion-timeline{align-items:center;gap:20px;margin-top:24px;display:flex}.lq-motion-timeline input{appearance:none;cursor:pointer;accent-color:#ff1f2d;background:0 0;width:100%;min-width:0;height:32px;margin:0;display:block}.lq-motion-timeline input::-webkit-slider-runnable-track{background:#ffffff38;border-radius:3px;height:3px}.lq-motion-timeline input::-moz-range-track{background:#ffffff38;border-radius:3px;height:3px}.lq-motion-timeline input::-webkit-slider-thumb{appearance:none;background:#fff;border:0;border-radius:50%;width:13px;height:13px;margin-top:-5px;box-shadow:0 0 0 5px #ffffff12}.lq-motion-timeline input::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:13px;height:13px;box-shadow:0 0 0 5px #ffffff12}.lq-motion-timeline input:focus-visible{outline-offset:3px;border-radius:3px;outline:2px solid #ff1f2d}.lq-motion-time{text-align:right;font-variant-numeric:tabular-nums;flex-shrink:0;min-width:98px;font-size:11px}.lq-motion-time>span{color:#ffffff61}.lq-motion-toolbar,.lq-motion-transport{align-items:center;gap:10px;display:flex}.lq-motion-toolbar{justify-content:space-between;margin-top:15px}.lq-motion-toolbar button{min-height:42px;font:inherit;cursor:pointer;border:1px solid #0000;border-radius:99px;justify-content:center;align-items:center;gap:8px;padding:0 17px;font-size:12px;font-weight:600;transition:background-color .18s,color .18s;display:inline-flex}.lq-motion-toolbar button:focus-visible{outline-offset:4px;outline:2px solid #ff1f2d}.lq-motion-play{color:#0b0b0b;background:#fff;min-width:93px}.lq-motion-play:hover{background:#f2f2f4}.lq-motion-toolbar .lq-motion-replay{color:#ffffffb3;background:0 0}.lq-motion-toolbar .lq-motion-replay:hover{color:#fff;background:#ffffff0f}.lq-motion-speed{border:1px solid #ffffff1a;border-radius:99px;gap:3px;padding:3px;display:flex}.lq-motion-speed button{color:#ffffff7a;font-variant-numeric:tabular-nums;background:0 0;min-width:52px;min-height:32px;padding:0 12px}.lq-motion-speed button[aria-pressed=true]{color:#fff;background:#ffffff1f}.lq-motion-speed button:hover{color:#fff}.lq-motion-preference{text-align:center;color:#727277;max-width:510px;margin:18px auto 0;font-size:12px;line-height:1.6}.lq-motion-sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:600px){.lq-motion-preview{padding:30px 16px 48px}.lq-motion-heading{margin-bottom:25px}.lq-motion-description{font-size:14px}.lq-motion-player{border-radius:22px}.lq-motion-stage{min-height:340px}.lq-motion-stage-label{left:20px}.lq-motion-stage-duration{right:20px}.lq-motion-controls{padding:20px}.lq-motion-phases{gap:12px}.lq-motion-phase>span{gap:5px;font-size:10px}.lq-motion-timeline{gap:12px;margin-top:18px}.lq-motion-toolbar button{padding:0 12px}.lq-motion-transport{gap:3px}.lq-motion-speed button{min-width:42px;padding:0 9px}.lq-motion-time{min-width:90px;font-size:10px}}@media (max-width:380px){.lq-motion-stage{min-height:290px}.lq-motion-controls{padding:18px 14px}.lq-motion-toolbar button{gap:6px;padding:0 10px;font-size:11px}.lq-motion-play{min-width:72px}.lq-motion-speed button{min-width:37px;padding:0 8px}.lq-motion-phase small{display:none}}@media (prefers-reduced-motion:reduce){.lq-motion-toolbar button{transition:none}}