/* Fichier généré par scripts/build-landing-desktop-css.mjs depuis public/landing/desktop/*.css : ne pas modifier à la main. */
@keyframes lv-d-rise { from { opacity: 0; transform: translateY(32px); } to { opacity: 1; transform: none; } }
@keyframes lv-d-in { from { opacity: 0; transform: translateY(14px); } }
@keyframes lv-d-pop { from { opacity: 0; transform: translateY(10px) scale(0.94); } }
@keyframes lv-d-photo { to { transform: translateY(8%); } }
@keyframes lv-d-chip-a { to { transform: translateY(-120px); } }
@keyframes lv-d-chip-b { to { transform: translateY(-56px); } }
@keyframes lv-d-phone { from { translate: 0 40px; rotate: -2deg; } to { translate: 0 -40px; rotate: 2deg; } }
@keyframes lv-d-float { from { translate: 0 0; rotate: 0deg; } to { translate: 0 -12px; rotate: 1.2deg; } }
@keyframes lv-d-ground { from { scale: 1; opacity: 1; } to { scale: 0.86; opacity: 0.7; } }
@keyframes lv-d-bob { from { translate: 0 0; } to { translate: 0 -9px; } }
@keyframes lv-d-pop-par { from { transform: translate(-8px, 36px); } to { transform: translate(4px, -30px); } }
@keyframes lv-d-score-par { from { transform: translateY(24px); } to { transform: translateY(-60px); } }
@keyframes lv-d-draw-in { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes lv-d-draw { to { stroke-dashoffset: 0; } }
@media (min-width: 1024px) {
.lv {
--lv-dw: 1360px;
--lv-dg: 48px;
--lv-shadow-card: 0 10px 40px rgb(15 23 42 / 0.06);
--lv-shadow-report: 0 25px 80px color-mix(in oklab, var(--primary) 14%, transparent), 0 2px 8px rgb(15 23 42 / 0.05);
}
.dark .lv { --lv-shadow-card: 0 10px 40px rgb(0 0 0 / 0.35); --lv-shadow-report: 0 25px 80px rgb(0 0 0 / 0.45), 0 0 0 1px rgb(255 255 255 / 0.04); }
.lv { --lv-top: 68px; --lv-dock: 96px; --lv-dw-wide: 1600px; }
.lv:has(.lv-hero-banner) { --lv-top: 108px; }
.lv-wrap { max-width: var(--lv-dw); padding: 0 var(--lv-dg); }
.lv-blk { padding: 120px 0; }
.lv-blk-tight { padding-top: 0; }
.lv-h2 { font-size: clamp(44px, 2.4vw + 16px, 56px); line-height: 1.05; letter-spacing: -0.032em; }
.lv-blk-head:not(.lv-blk-head-center) { max-width: none; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: 64px; align-items: end; margin-bottom: 56px; }
.lv-blk-head:not(.lv-blk-head-center) > .lv-eyebrow { grid-column: 1 / -1; margin-bottom: 16px; }
.lv-blk-head:not(.lv-blk-head-center) > .lv-h2 { grid-column: 1; max-width: 20ch; }
.lv-blk-head:not(.lv-blk-head-center) > .lv-lead { grid-column: 2; margin-top: 0; padding-bottom: 8px; font-size: 18px; max-width: 44ch; }
.lv-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 13px; letter-spacing: 0.1em; color: var(--primary-strong, var(--primary)); }
.lv-eyebrow::before { content: ""; flex: none; width: 24px; height: 3px; border-radius: 2px; background: var(--lane); }
.lv-blk-head-center .lv-eyebrow { justify-content: center; }
header.landing-rise { background: var(--background); box-shadow: 0 1px 0 var(--border); }
header.landing-rise > div.container { padding-top: 0; padding-bottom: 0; }
header.landing-rise nav :is(a, button) { white-space: nowrap; }
header.landing-rise nav { padding-top: 12px; padding-bottom: 12px; border-color: transparent; border-radius: 0; background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (max-width: 1199px) {
header.landing-rise nav > a:first-child { flex-shrink: 0; }
header.landing-rise nav > a:first-child > * { zoom: 0.85; }
header.landing-rise nav > div:nth-of-type(1) :is(a, button) { padding-inline: 5px; }
}
.lv-hero { --lv-hdr: 68px; --lv-hd-ink: #fff; --lv-hd-soft: rgb(255 255 255 / 0.78); --lv-hd-accent: var(--lv-tab-start); background: #0a1120; }
.lv-hero-banner { --lv-hdr: 108px; }
.lv-hero::after { content: ""; position: absolute; z-index: 3; left: 0; right: 0; bottom: -1px; height: clamp(56px, 6.6vw, 112px); pointer-events: none; background: var(--background);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120V96C480 104 960 84 1440 14V120Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120V96C480 104 960 84 1440 14V120Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.lv-hero-in, .lv-hero-banner .lv-hero-in { display: flex; flex-direction: column; justify-content: center; min-height: clamp(700px, 90svh, 880px); padding-top: calc(var(--lv-hdr) + 40px); padding-bottom: clamp(88px, 8vw, 132px); }
.lv-hero-copy { width: min(620px, 50%); --u: 0.41px; color: var(--lv-hd-ink); }
.lv-hero-media, .lv-hero-banner .lv-hero-media, .lv-hero-media.lv-is-moto { top: var(--lv-hdr); bottom: 0; left: 0; right: 0; width: auto; height: auto; overflow: hidden; background: #0a1120; }
.lv-hero-media picture { inset: -8% 0 0 var(--lv-hpx, 8%); -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 30%); mask-image: linear-gradient(90deg, transparent 0, #000 30%); }
.lv-hero-media .lv-pic-moto { --lv-hpx: 13%; }
.lv-hero-media .lv-pic-car img { object-position: 70% 58%; }
.lv-hero-media .lv-pic-moto img { object-position: 52% 50%; }
.lv-hero-media::after, .dark .lv-hero-media::after { background:
linear-gradient(90deg, rgb(7 12 24 / 0.94) 0, rgb(7 12 24 / 0.82) 26%, rgb(7 12 24 / 0.42) 46%, rgb(7 12 24 / 0) 62%),
linear-gradient(180deg, rgb(7 12 24 / 0.38) 0, rgb(7 12 24 / 0) 24%, rgb(7 12 24 / 0) 72%, rgb(7 12 24 / 0.3) 100%); }
[data-vehicle] .lv-hero .lv-stats.lv-hm { display: inline-flex; align-self: flex-start; position: relative; align-items: center; gap: 12px; margin-bottom: 22px; padding: 6px 16px 6px 6px; overflow: hidden;
border-radius: 999px; background: rgb(255 255 255 / 0.07); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
[data-vehicle] .lv-hero .lv-stat { display: inline-flex; align-items: center; gap: 8px; }
[data-vehicle] .lv-hero .lv-stat-ic { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 999px; background: color-mix(in oklab, var(--lv-hd-accent) 30%, transparent); color: #fff; }
[data-vehicle] .lv-hero .lv-stat-ic svg { width: 14px; height: 14px; stroke-width: 2.25; }
[data-vehicle] .lv-hero .lv-stat-save .lv-stat-ic { background: rgb(34 197 94 / 0.32); }
[data-vehicle] .lv-hero .lv-stat-tx { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; }
[data-vehicle] .lv-hero .lv-stat-tx b, [data-vehicle] .lv-hero .lv-stat-save .lv-stat-tx b { font-size: 14px; font-weight: 700; color: var(--lv-hd-ink); }
[data-vehicle] .lv-hero .lv-stat-tx small { font-size: 13.5px; font-weight: 500; color: var(--lv-hd-soft); }
[data-vehicle] .lv-hero .lv-stat-sep { width: 1px; height: 16px; background: rgb(255 255 255 / 0.22); }
.lv-hero .lv-h1 { margin-top: 0; max-width: none; font-size: clamp(44px, 3.7vw, 64px); line-height: 1.06; letter-spacing: -0.035em; color: var(--lv-hd-ink); }
.lv-hero .lv-h1 .lv-accent, .theme-moto .lv-hero .lv-h1 .lv-accent { color: var(--lv-hd-accent); }
.lv-hero .lv-lane-u, .lv-why .lv-lane-u { left: 0; right: 3%; bottom: -0.2em; height: 0.2em; min-height: 6px; border-radius: 0; background: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M3 15C52 7 128 3 197 8' fill='none' stroke='%23000' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M3 15C52 7 128 3 197 8' fill='none' stroke='%23000' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.lv-hero .lv-lead, .theme-moto .lv-hero .lv-lead { margin-top: 22px; max-width: 40ch; font-size: 18px; line-height: 1.5; color: var(--lv-hd-ink); opacity: 0.88; }
.lv-hd-note { display: block; position: absolute; left: 92%; top: clamp(132px, 12.2vw, 178px); width: 190px; font-family: var(--font-handwriting), cursive; font-size: clamp(22px, 1.75vw, 27px); line-height: 1.05; text-align: center; color: var(--lv-hd-ink); transform: rotate(-10deg); pointer-events: none; }
.lv-hd-note svg { display: block; width: 86px; margin: 4px 0 0 2px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transform: rotate(10deg); }
.lv-hero .lv-search { max-width: 100%; margin-top: 46px; }
.lv-hero .lv-search-tabs { left: 64px; transform: none; }
.lv-hero .lv-search-help { padding-left: 24px; font-size: 13px; color: var(--lv-hd-soft); }
.lv-hero .lv-hero-demo { display: none; }
.lv-hero .lv-reas { max-width: 600px; margin-top: 32px; grid-template-columns: repeat(3, auto); justify-content: start; column-gap: 56px; }
.lv-hero .lv-reas > div { gap: 12px; }
.lv-hero .lv-reas .lv-ci { width: 42px; height: 42px; border-radius: 999px; background: transparent; color: var(--lv-hd-ink); box-shadow: inset 0 0 0 1.5px rgb(255 255 255 / 0.3); }
.lv-hero .lv-reas b { font-size: 15px; color: var(--lv-hd-ink); }
.lv-hero .lv-reas span { font-size: 14px; color: var(--lv-hd-soft); }
.lv-hd-chip { position: absolute; z-index: 1; display: flex; align-items: center; gap: 10px; max-width: 280px; padding: 9px 12px; border-radius: 12px;
background: var(--card); box-shadow: 0 18px 40px -16px rgb(2 6 23 / 0.55); font-size: 14px; font-weight: 650; line-height: 1.3; color: var(--foreground); }
.lv-hd-chip span { display: grid; gap: 1px; }
.lv-hd-chip small { font-size: 11.5px; font-weight: 500; color: var(--muted-foreground); }
.lv-hd-chip > svg { flex: none; width: 15px; height: 15px; margin-left: 4px; color: var(--muted-foreground); }
.lv-hd-chip i { flex: none; width: 9px; height: 9px; border-radius: 99px; background: var(--primary); box-shadow: 0 0 0 4px color-mix(in oklab, var(--primary) 18%, transparent); }
.lv-hd-chip.lv-tone-go i { background: var(--success); box-shadow: 0 0 0 4px var(--success-tint); }
.lv-hd-chip.lv-tone-nego i { background: var(--warning); box-shadow: 0 0 0 4px var(--warning-tint); }
.lv-hd-chip.lv-tone-stop i { background: var(--destructive); box-shadow: 0 0 0 4px var(--destructive-tint); }
.lv-hd-chip-price { top: calc(var(--lv-hdr) + 36px); left: 59%; }
.lv-hd-chip-cost { top: calc(var(--lv-hdr) + 92px); right: 2.8%; }
.lv-why { display: block; position: relative; z-index: 4; margin-top: -2px; padding: 10px 0 24px; background: var(--background); }
.lv-why-in { display: grid; grid-template-columns: minmax(0, 22fr) minmax(0, 34fr) minmax(0, 18fr) minmax(0, 11fr); column-gap: 3%; align-items: start; }
.lv-why-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 650; color: var(--primary-strong, var(--primary));
text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; text-decoration-color: color-mix(in oklab, var(--primary) 40%, transparent); }
.lv-why-eyebrow::before { content: ""; width: 3px; height: 10px; border-radius: 2px; background: var(--primary); }
.lv-why-h2 { margin-top: 18px; font-size: clamp(28px, 2.3vw, 38px); font-weight: 700; line-height: 1.12; letter-spacing: -0.03em; color: var(--foreground); }
.lv-why-h2 .lv-accent { position: relative; display: inline-block; color: var(--primary); }
.lv-why-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding-top: 58px; }
.lv-why-figs dt { font-size: clamp(22px, 1.8vw, 30px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; color: var(--foreground); white-space: nowrap; }
.lv-why-figs dd { margin-top: 8px; font-size: 13.5px; line-height: 1.45; color: var(--muted-foreground); }
.lv-why-phone { --ph-tone: var(--warning); position: relative; justify-self: center; width: 100%; max-width: 236px; margin-top: clamp(-120px, -7.4vw, -72px); perspective: 1400px; }
.lv-why-spark { position: absolute; z-index: 1; top: -26px; width: 36px; height: 36px; fill: none; stroke: var(--primary); stroke-width: 2.6; stroke-linecap: round; }
.lv-why-spark-l { left: -34px; rotate: -8deg; }
.lv-why-spark-r { right: -38px; top: -14px; rotate: 10deg; }
.lv-ph-float { transform-style: preserve-3d; transform: rotateX(9deg) rotateY(-20deg) rotateZ(-6deg); }
.lv-ph { position: relative; aspect-ratio: 236 / 470; padding: 9px; border-radius: 40px; background: linear-gradient(160deg, #1d2740, #0b1220 40%);
box-shadow: inset 0 0 0 1.5px #34405c, inset 0 0 0 3px #0b1220, 7px 9px 0 -2px #151d2f, 34px 52px 70px -24px rgb(15 23 42 / 0.5); }
.dark .lv-ph { background: linear-gradient(160deg, #3a4663, #1c2539 40%); box-shadow: inset 0 0 0 1.5px #56627f, inset 0 0 0 3px #1c2539, 7px 9px 0 -2px #10172a, 34px 52px 70px -24px rgb(0 0 0 / 0.7); }
.lv-ph::before { content: ""; position: absolute; z-index: 2; top: 17px; left: 50%; width: 62px; height: 18px; margin-left: -31px; border-radius: 99px; background: #0b1220; }
.lv-ph::after { content: ""; position: absolute; z-index: 2; inset: 9px; border-radius: 32px; pointer-events: none; background: linear-gradient(118deg, rgb(255 255 255 / 0.2) 0, rgb(255 255 255 / 0.05) 30%, transparent 31%); }
.lv-ph-scr { display: flex; flex-direction: column; gap: 9px; height: 100%; padding: 44px 11px 12px; overflow: hidden; border-radius: 32px; background: var(--background); }
.lv-ph-ground { position: absolute; left: 4%; right: 14%; bottom: -46px; height: 34px; border-radius: 50%; background: radial-gradient(closest-side, rgb(15 23 42 / 0.3), transparent); filter: blur(4px); }
.lv-ph-pop { position: absolute; z-index: 3; left: -72px; top: 78%; display: grid; gap: 2px; padding: 10px 16px 11px 14px; border-radius: 14px; rotate: -6deg;
background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 22px 40px -18px rgb(15 23 42 / 0.45); }
.lv-ph-pop small { font-size: 11px; font-weight: 600; color: var(--muted-foreground); }
.lv-ph-pop b { font-size: 20px; font-weight: 750; letter-spacing: -0.02em; color: var(--success-strong); }
.lv-ph-score { position: absolute; z-index: 3; right: -22px; top: 7%; display: grid; place-content: center; justify-items: center; width: 70px; height: 70px; border-radius: 50%; rotate: 9deg;
background: conic-gradient(var(--ph-tone) calc(var(--s, 0) * 1%), var(--muted) 0); box-shadow: 0 18px 34px -16px rgb(15 23 42 / 0.5); }
.lv-ph-score::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--card); }
.lv-ph-score > * { position: relative; line-height: 1; }
.lv-ph-score b { font-size: 20px; font-weight: 750; letter-spacing: -0.03em; color: var(--foreground); }
.lv-ph-score small { margin-top: 2px; font-size: 9.5px; font-weight: 600; color: var(--muted-foreground); }
.lv-ph-score.lv-tone-go { --ph-tone: var(--success); }
.lv-ph-score.lv-tone-stop { --ph-tone: var(--destructive); }
.lv-ph-bar { display: flex; align-items: center; justify-content: space-between; padding: 0 2px 2px; color: var(--foreground); }
.lv-ph-bar > svg { width: 18px; height: 18px; }
.lv-ph-alert, .lv-ph-car, .lv-ph-pts li { border-radius: 14px; background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 6px 16px -10px rgb(15 23 42 / 0.25); }
.lv-ph-alert { display: flex; align-items: center; gap: 9px; padding: 10px; }
.lv-ph-alert i { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 99px; background: var(--success-tint); color: var(--success-strong); }
.lv-ph-alert.lv-tone-nego i { background: var(--warning-tint); color: var(--warning-strong, var(--warning)); }
.lv-ph-alert.lv-tone-stop i { background: var(--destructive-tint); color: var(--destructive-strong); }
.lv-ph-alert i svg { width: 14px; height: 14px; stroke-width: 2.6; }
.lv-ph-alert span { display: grid; gap: 1px; min-width: 0; }
.lv-ph-alert b { font-size: 13px; line-height: 1.25; color: var(--foreground); }
.lv-ph-alert small { font-size: 10.5px; line-height: 1.3; color: var(--muted-foreground); }
.lv-ph-car { display: flex; gap: 9px; padding: 8px; }
.lv-ph-car picture { flex: none; width: 74px; height: 58px; overflow: hidden; border-radius: 10px; background: var(--muted); }
.lv-ph-car img { width: 100%; height: 100%; object-fit: cover; }
.lv-ph-car > div { display: grid; align-content: start; gap: 1px; min-width: 0; }
.lv-ph-car b { overflow: hidden; font-size: 12px; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; color: var(--foreground); }
.lv-ph-car .lv-num { font-size: 15px; font-weight: 700; color: var(--foreground); }
.lv-ph-car ul { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.lv-ph-car li { padding: 1px 6px; border-radius: 99px; background: var(--muted); font-size: 9.5px; line-height: 1.5; color: var(--muted-foreground); }
.lv-ph-cta.lv-ph-cta { width: 100%; height: 36px; margin-top: auto; gap: 6px; border-radius: 999px; font-size: 12.5px; }
.lv-ph-cta svg { width: 14px; height: 14px; }
.lv-ph-pts { display: grid; gap: 6px; }
.lv-ph-pts li { display: flex; align-items: center; gap: 7px; padding: 8px 9px; font-size: 11px; font-weight: 600; line-height: 1.2; color: var(--foreground); }
.lv-ph-pts span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.lv-ph-pts b { flex: none; font-size: 10.5px; font-weight: 700; color: var(--muted-foreground); }
.lv-ph-pts i { flex: none; width: 7px; height: 7px; border-radius: 99px; background: var(--primary); }
.lv-ph-pts .lv-tone-go i { background: var(--success); }
.lv-ph-pts .lv-tone-nego i { background: var(--warning); }
.lv-ph-pts .lv-tone-stop i { background: var(--destructive); }
.lv-why-note { display: block; padding: 132px 0 0 18px; font-family: var(--font-handwriting), cursive; font-size: clamp(19px, 1.55vw, 25px); line-height: 1.05; color: var(--foreground); transform: rotate(-9deg); }
.lv-why-note svg { display: block; width: 76px; margin-top: 6px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transform: rotate(9deg); }
@media (max-width: 1279px) {
.lv-hero-copy { width: min(560px, 52%); }
.lv-hd-note { left: 96%; top: clamp(150px, 15.6vw, 196px); width: 160px; }
.lv-hd-chip-price { left: 60%; }
.lv-why-in { grid-template-columns: minmax(0, 24fr) minmax(0, 36fr) minmax(0, 22fr); column-gap: 4%; }
.lv-why-note { display: none; }
.lv-why-figs { gap: 16px; }
.lv-why-figs dd { font-size: 13px; }
.lv-ph-pop { left: auto; right: -30px; rotate: 5deg; }
.lv-ph-score { top: 6%; right: -26px; }
}
@media (max-height: 820px) {
.lv-hero-in, .lv-hero-banner .lv-hero-in { min-height: 0; padding-top: calc(var(--lv-hdr) + 28px); }
[data-vehicle] .lv-hero .lv-stats.lv-hm { margin-bottom: 16px; }
.lv-hero .lv-lead, .theme-moto .lv-hero .lv-lead { margin-top: 14px; }
.lv-hero .lv-search { margin-top: 40px; }
.lv-hero .lv-reas { margin-top: 22px; }
}
.lv-sites-arc { position: relative; z-index: 2; margin: 4px 0 -56px; }
.lv-sites-arc + .lv-sites-in { display: none; }
.lv-arc { display: block; overflow: visible; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); }
.lv-arc-names { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; fill: var(--muted-foreground); fill-opacity: 0.78; }
.lv-arc-measure { visibility: hidden; }
.lv-arc-lbl { font-size: 14px; fill: var(--muted-foreground); }
.lv-arc-n { font-weight: 700; fill: var(--foreground); }
.lv > #comparatif { display: none; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-hd-chip-price { animation: lv-d-pop 520ms var(--ease-out) 700ms both; }
.lv-hd-chip-cost { animation: lv-d-pop 520ms var(--ease-out) 850ms both; }
.lv-hd-note { animation: lv-d-in var(--dur-4) var(--ease-out) 650ms both; }
.lv-hd-note svg path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: lv-d-draw 900ms var(--ease-out) 900ms forwards; }
.lv-hd-note svg path + path { animation-delay: 1700ms; animation-duration: 260ms; }
.lv-ph-float { animation: lv-d-float 5.6s var(--ease-in-out) infinite alternate; }
.lv-ph-ground { animation: lv-d-ground 5.6s var(--ease-in-out) infinite alternate; }
}
@supports (animation-timeline: scroll()) {
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-hero-media picture { animation: lv-d-photo linear both; animation-timeline: scroll(root); animation-range: 0 100vh; }
.lv-hd-chip-price { animation: lv-d-pop 520ms var(--ease-out) 700ms both, lv-d-chip-a linear both; animation-timeline: auto, scroll(root); animation-range: normal, 0 100vh; }
.lv-hd-chip-cost { animation: lv-d-pop 520ms var(--ease-out) 850ms both, lv-d-chip-b linear both; animation-timeline: auto, scroll(root); animation-range: normal, 0 100vh; }
}
}
@supports (animation-timeline: view()) {
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-io .lv-blk-head.lv-reveal { transition: none; animation: lv-d-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
.lv-why-phone { animation: lv-d-phone linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
.lv-ph-pop { animation: lv-d-bob 4.6s var(--ease-in-out) -1.4s infinite alternate, lv-d-pop-par linear both; animation-timeline: auto, view(); animation-range: normal, cover 0% cover 100%; }
.lv-ph-score { animation: lv-d-bob 5.2s var(--ease-in-out) -3s infinite alternate, lv-d-score-par linear both; animation-timeline: auto, view(); animation-range: normal, cover 0% cover 100%; }
.lv-why-spark path, .lv-why-note path { stroke-dasharray: 1; animation: lv-d-draw-in linear both; animation-timeline: view(); animation-range: entry 20% entry 90%; }
.lv-why-figs > div { animation: lv-d-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 80%; }
}
}
@keyframes lv-fl-beam { from { transform: translateY(-100%); } to { transform: translateY(300%); } }
@keyframes lv-fl-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@keyframes lv-fl-rise { from { transform: translateY(48px) rotateX(8deg) scale(0.97); } to { transform: none; } }
@keyframes lv-fl-travel { from { transform: translateX(0); } to { transform: translateX(100%); } }
@keyframes lv-fl-dot { 0%, 100% { opacity: 0; } 18%, 82% { opacity: 1; } }
@keyframes lv-fl-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes lv-fl-pop { from { opacity: 0; transform: scale(1.2); } }
@media (min-width: 1024px) {
.lv > #comment-ca-marche .lv-wrap { max-width: 1760px; padding: 0 clamp(32px, 3.4vw, 64px); }
.lv-how-legacy { display: none; }
.lv-fl-slot { display: block; min-height: 798px; }
[data-vehicle="moto"] .lv-fl-slot { min-height: 790px; }
@media (min-width: 1366px) { .lv-fl-slot { min-height: min(calc(518px + 19vw), 803px); } }
@media (min-width: 1484px) { .lv-fl-slot { min-height: 781px; } }
@media (min-width: 1496px) { .lv-fl-slot { min-height: min(calc(532px + 15.4vw), 805px); } }
@media (min-width: 1440px) { [data-vehicle="moto"] .lv-fl-slot { min-height: min(calc(520px + 18.4vw), 846px); } }
.lv-blk-head-boxed:not(.lv-blk-head-center) { align-items: stretch; }
.lv-blk-head-boxed:not(.lv-blk-head-center) > .lv-eyebrow { grid-column: 1; grid-row: 2; align-self: end; margin-bottom: 18px; }
.lv-blk-head-boxed:not(.lv-blk-head-center) > .lv-h2 { grid-row: 3; align-self: start; }
.lv-blk-head-boxed::after { content: ""; grid-column: 2; grid-row: 2 / 4; border-radius: 22px; background: var(--card); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-card); }
.lv-blk-head-boxed:not(.lv-blk-head-center) > .lv-lead { position: relative; z-index: 1; grid-row: 2; max-width: none; margin: 0; padding: 24px 26px 18px; font-size: 18px; line-height: 1.5; color: var(--foreground); }
.lv-blk-head-boxed > .lv-head-aside { position: relative; z-index: 1; display: block; grid-column: 2; grid-row: 3; padding: 0 26px 24px; }
.lv-head-facets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding-top: 18px; border-top: 1px solid var(--border); }
.lv-head-facets li { display: grid; align-content: start; gap: 4px; }
.lv-head-facets .lv-ci { width: 36px; height: 36px; margin-bottom: 6px; border-radius: 12px; }
.lv-head-facets .lv-ci svg { width: 18px; height: 18px; }
.lv-head-facets b { font-size: 15px; color: var(--foreground); }
.lv-head-facets span { font-size: 13.5px; line-height: 1.4; color: var(--muted-foreground); }
.lv > #comment-ca-marche .lv-blk-head-boxed:not(.lv-blk-head-center) { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr); column-gap: 40px; max-width: 1180px; margin-inline: auto; }
.lv-fl { --fl-ease: cubic-bezier(0.22, 1, 0.36, 1); --fl-spring: cubic-bezier(0.34, 1.56, 0.64, 1); --fl-line: color-mix(in oklab, var(--primary) 42%, var(--border));
--fl-card: 0 0 0 1px var(--border), 0 26px 60px -34px rgb(15 23 42 / 0.42);
position: relative; display: grid; grid-template-columns: minmax(0, 4fr) minmax(52px, 0.5fr) minmax(0, 7.2fr); align-items: start; row-gap: 12px; }
.lv-fl-lbl { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 650; color: var(--muted-foreground); transition: color 0.4s; }
.lv-fl-lbl i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 99px; font-size: 13px; font-style: normal; font-weight: 700; color: var(--foreground); background: var(--card); box-shadow: 0 0 0 1px var(--border); transition: background 0.4s, color 0.4s, box-shadow 0.4s; }
.lv-fl-lbl small { margin-left: 6px; padding: 2px 9px; border-radius: 99px; font-size: 11.5px; font-weight: 600; color: var(--muted-foreground); background: var(--card); box-shadow: 0 0 0 1px var(--border); }
.lv-fl-lbl-1 { grid-column: 1; grid-row: 1; justify-self: start; }
.lv-fl-lbl-2 { grid-column: 3; grid-row: 1; justify-self: start; }
.lv-fl-lbl-1, .lv-fl.is-drop .lv-fl-lbl-2, .lv-fl.is-toc .lv-fl-lbl-3, .lv-fl.is-shown .lv-fl-lbl-3 { color: var(--foreground); }
.lv-fl-lbl-1 i, .lv-fl.is-drop .lv-fl-lbl-2 i, .lv-fl.is-toc .lv-fl-lbl-3 i, .lv-fl.is-shown .lv-fl-lbl-3 i { color: #fff; background: var(--primary); box-shadow: 0 6px 14px -6px var(--primary); }
.lv-fl-ad, .lv-fl-app { position: relative; z-index: 1; grid-row: 2; overflow: hidden; border-radius: 22px; background: var(--card); box-shadow: var(--fl-card); }
.lv-fl-ad { grid-column: 1; align-self: stretch; display: flex; flex-direction: column; rotate: -1.4deg; transform-origin: 50% 70%;
transition: transform 0.45s var(--fl-ease), rotate 0.6s var(--fl-spring), box-shadow 0.45s var(--fl-ease); }
.lv-fl.is-hover:not(.is-grab) .lv-fl-ad { transform: translateY(-5px); rotate: -0.5deg; box-shadow: 0 0 0 1px var(--border), 0 36px 70px -30px rgb(15 23 42 / 0.5); }
.lv-fl-chrome { display: flex; align-items: center; gap: 12px; height: 36px; padding: 0 12px; border-bottom: 1px solid var(--border); background: color-mix(in oklab, var(--muted) 70%, var(--card)); }
.lv-fl-dots { display: flex; gap: 6px; }
.lv-fl-dots i { width: 10px; height: 10px; border-radius: 99px; background: color-mix(in oklab, var(--muted-foreground) 30%, transparent); }
.lv-fl-url { display: flex; flex: 1; align-items: center; gap: 6px; min-width: 0; height: 26px; padding: 0 10px; overflow: hidden; border-radius: 8px; font-size: 12px; white-space: nowrap; color: var(--muted-foreground); background: var(--card); }
.lv-fl-url svg { flex: none; width: 12px; height: 12px; }
.lv-fl-url span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.lv-fl-ad-in { display: grid; flex: 1; grid-template-rows: minmax(0, 1fr) auto; gap: 10px; padding: 12px; }
.lv-fl-photo { position: relative; display: block; align-self: stretch; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 14px; background: var(--muted); transition: opacity 0.3s; }
.lv-fl-photo img { width: 100%; height: 100%; object-fit: cover; }
.lv-fl.is-grab:not(.is-drop) .lv-fl-photo { opacity: 0.3; }
.lv-fl-info { display: grid; gap: 6px; padding: 0 4px 2px; }
.lv-fl-title { display: -webkit-box; overflow: hidden; font-size: 16px; line-height: 1.3; color: var(--foreground); -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.lv-fl-price { font-size: 24px; font-weight: 750; letter-spacing: -0.02em; color: var(--foreground); }
.lv-fl-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lv-fl-chips li { padding: 3px 10px; border-radius: 99px; font-size: 12.5px; color: var(--muted-foreground); background: var(--muted); }
.lv-fl-desc { display: -webkit-box; overflow: hidden; font-size: 13.5px; line-height: 1.55; color: var(--muted-foreground); -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.lv-fl-ad-foot { margin-top: auto; padding: 8px 16px 9px; border-top: 1px solid var(--border); font-size: 12px; font-weight: 550; color: var(--muted-foreground); }
.lv-fl-link { position: relative; grid-column: 2; grid-row: 2; align-self: center; height: 20px; margin: 0 8px; }
.lv-fl-link svg { display: block; width: 100%; height: 100%; overflow: visible; fill: none; stroke: var(--fl-line); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lv-fl-link path { vector-effect: non-scaling-stroke; }
.lv-fl-link path:first-child { stroke-dasharray: 4 6; }
.lv-fl-link i { position: absolute; inset: 0; pointer-events: none; }
.lv-fl-link i::before { content: ""; position: absolute; left: -5px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 99px; opacity: 0; background: var(--primary); box-shadow: 0 0 0 4px color-mix(in oklab, var(--primary) 20%, transparent); }
.lv-fl-app { grid-column: 3; display: flex; flex-direction: column; min-height: 100%; }
.lv-fl-appbar { display: flex; align-items: center; justify-content: space-between; height: 50px; padding: 0 18px; border-bottom: 1px solid var(--border); }
.lv-fl-live { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 650; color: var(--muted-foreground); background: var(--card); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-live i { width: 8px; height: 8px; border-radius: 99px; background: var(--muted-foreground); opacity: 0.5; }
.lv-fl.is-run .lv-fl-live i { background: var(--success); opacity: 1; }
.lv-fl-live b { min-width: 34px; font-weight: 700; color: var(--foreground); }
.lv-fl-zone { position: relative; display: flex; align-items: center; height: 56px; margin: 14px 18px 0; padding: 0 7px 0 8px; border-radius: 999px; background: var(--lv-search-bg);
box-shadow: 0 0 0 1px var(--lv-search-ring), 0 12px 30px -16px color-mix(in oklab, var(--primary) 45%, transparent); transition: box-shadow 0.35s var(--fl-ease), transform 0.4s var(--fl-spring); }
.lv-fl.is-over:not(.is-drop) .lv-fl-zone { transform: scale(1.03); box-shadow: 0 0 0 2px var(--primary), 0 0 0 9px color-mix(in oklab, var(--primary) 13%, transparent), 0 18px 40px -16px color-mix(in oklab, var(--primary) 55%, transparent); }
.lv-fl-zone-ic { display: grid; flex: none; place-items: center; width: 42px; height: 42px; border-radius: 99px; color: var(--lv-search-chip-fg); background: var(--lv-search-chip); }
.lv-fl-zone-ic svg { width: 18px; height: 18px; }
.lv-fl-zone-ph, .lv-fl-zone-url { position: absolute; left: 62px; right: 140px; top: 50%; overflow: hidden; translate: 0 -50%; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
.lv-fl-zone-ph { color: var(--lv-search-placeholder); transition: opacity 0.2s; }
.lv-fl-zone-url { padding: 2px 4px; border-radius: 6px; font-weight: 550; color: var(--foreground); clip-path: inset(0 100% 0 0); transition: clip-path 0.45s var(--fl-ease) 0.1s, background-color 0.8s ease 0.6s; }
.lv-fl.is-drop .lv-fl-zone-ph { opacity: 0; }
.lv-fl.is-drop .lv-fl-zone-url { clip-path: inset(0 0 0 0); background-color: color-mix(in oklab, var(--primary) 14%, transparent); }
.lv-fl.is-run .lv-fl-zone-url { background-color: transparent; }
.lv-fl-go { display: inline-flex; align-items: center; gap: 8px; height: 44px; margin-left: auto; padding: 0 18px 0 22px; border-radius: 999px; font-size: 15px; font-weight: 700; color: var(--lv-cta-fg); background-image: var(--lv-cta-image); box-shadow: var(--lv-cta-shadow); transition: opacity 0.3s; }
.lv-fl-go svg { width: 16px; height: 16px; }
.lv-fl.is-run:not(.is-done) .lv-fl-go { opacity: 0.82; }
.lv-fl-body { position: relative; display: grid; flex: 1; margin: 14px 18px 16px; }
.lv-fl-body > div { grid-area: 1 / 1; transition: opacity 0.45s var(--fl-ease), transform 0.55s var(--fl-ease), visibility 0s 0.55s; }
.lv-fl-idle { display: grid; place-content: center; justify-items: center; gap: 8px; min-height: 300px; border: 1.5px dashed var(--border); border-radius: 18px; text-align: center; color: var(--muted-foreground); }
.lv-fl-idle svg { width: 30px; height: 30px; margin-bottom: 4px; color: var(--primary); }
.lv-fl-idle b { font-size: 16px; color: var(--foreground); }
.lv-fl-idle span { font-size: 13.5px; }
.lv-fl.is-over .lv-fl-idle { border-color: var(--primary); background: color-mix(in oklab, var(--primary) 5%, transparent); }
.lv-fl.is-drop .lv-fl-idle { visibility: hidden; opacity: 0; transform: scale(0.97); }
.lv-fl-run { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 18px; visibility: hidden; opacity: 0; transform: translateY(12px); }
.lv-fl.is-run .lv-fl-run { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.lv-fl.is-done .lv-fl-run { visibility: hidden; opacity: 0; transform: translateY(-12px); transition-delay: 0s, 0s, 0s, 0.55s; }
.lv-fl-dossier { overflow: hidden; border-radius: 18px; background: var(--card); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-viewer { position: relative; aspect-ratio: 2 / 1; overflow: hidden; background: var(--muted); }
.lv-fl-viewer picture, .lv-fl-viewer img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lv-fl-viewer img { transform: scale(1.06); transition: transform 4.5s linear; }
.lv-fl.is-run .lv-fl-viewer img { transform: none; }
.lv-fl-grid { position: absolute; inset: 0; opacity: 0.55; background-image: linear-gradient(to right, color-mix(in oklab, var(--primary) 18%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in oklab, var(--primary) 18%, transparent) 1px, transparent 1px);
background-size: 28px 28px; -webkit-mask-image: radial-gradient(80% 80% at 50% 50%, #000 30%, transparent 85%); mask-image: radial-gradient(80% 80% at 50% 50%, #000 30%, transparent 85%); }
.lv-fl-beam { position: absolute; left: 0; right: 0; top: 0; height: 34%; opacity: 0; transform: translateY(-100%);
background: linear-gradient(180deg, transparent, color-mix(in oklab, var(--primary) 22%, transparent) 82%, color-mix(in oklab, var(--primary) 85%, white) 99%, transparent); }
.lv-fl-corner { position: absolute; width: 20px; height: 20px; border: 2.5px solid color-mix(in oklab, var(--primary) 85%, white); filter: drop-shadow(0 1px 2px rgb(15 23 42 / 0.35)); }
.lv-fl-c1 { top: 10px; left: 10px; border-right: 0; border-bottom: 0; border-top-left-radius: 7px; }
.lv-fl-c2 { top: 10px; right: 10px; border-left: 0; border-bottom: 0; border-top-right-radius: 7px; }
.lv-fl-c3 { bottom: 10px; left: 10px; border-right: 0; border-top: 0; border-bottom-left-radius: 7px; }
.lv-fl-c4 { bottom: 10px; right: 10px; border-left: 0; border-top: 0; border-bottom-right-radius: 7px; }
.lv-fl-site { position: absolute; top: 14px; left: 50%; translate: -50% 0; padding: 4px 11px; white-space: nowrap; border-radius: 99px; font-size: 11.5px; font-weight: 650; color: #fff; background: rgb(15 23 42 / 0.6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lv-fl-id { display: grid; gap: 8px; padding: 12px 14px 14px; }
.lv-fl-id b { display: -webkit-box; min-height: 1.3em; overflow: hidden; font-size: 15px; line-height: 1.3; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: var(--foreground); opacity: 0; transform: translateY(6px); transition: opacity 0.35s, transform 0.4s var(--fl-ease); }
.lv-fl-id b.is-on { opacity: 1; transform: none; }
.lv-fl-id ul { display: flex; flex-wrap: wrap; gap: 6px; }
.lv-fl-id li { padding: 3px 10px; border-radius: 99px; font-size: 12px; font-weight: 600; color: var(--foreground); background: var(--muted); opacity: 0; transform: translateY(6px) scale(0.96); transition: opacity 0.3s, transform 0.4s var(--fl-spring); }
.lv-fl-id li.is-on { opacity: 1; transform: none; }
.lv-fl-side { display: grid; align-content: start; gap: 14px; }
.lv-fl-status { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 16px; background: var(--card); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-ring { position: relative; display: grid; flex: none; place-items: center; width: 54px; height: 54px; }
.lv-fl-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; rotate: -90deg; fill: none; stroke-width: 6; }
.lv-fl-ring circle:first-child { stroke: var(--muted); }
.lv-fl-ring circle:last-child { stroke: var(--primary); stroke-linecap: round; transition: stroke-dashoffset 0.12s linear; }
.lv-fl-ring b { position: relative; font-size: 13px; font-weight: 750; color: var(--foreground); }
.lv-fl-status > span:last-child { display: grid; gap: 2px; min-width: 0; }
.lv-fl-status > span:last-child b { font-size: 14.5px; color: var(--foreground); }
.lv-fl-status > span:last-child small { font-size: 12.5px; color: var(--muted-foreground); }
.lv-fl-rail { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 0 4px; }
.lv-fl-rail::before, .lv-fl-rail::after { content: ""; position: absolute; top: 12px; left: 10%; right: 10%; height: 2px; border-radius: 2px; background: var(--muted); }
.lv-fl-rail::after { background: var(--primary); transform: scaleX(var(--fill, 0)); transform-origin: left; transition: transform 0.2s linear; }
.lv-fl-rail li { position: relative; z-index: 1; display: grid; justify-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--muted-foreground); }
.lv-fl-rail span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 99px; font-size: 11.5px; font-weight: 700; color: var(--muted-foreground); background: var(--card); box-shadow: inset 0 0 0 1.5px var(--border); transition: background 0.3s, color 0.3s, box-shadow 0.3s; }
.lv-fl-rail span svg { width: 13px; height: 13px; stroke-width: 3; }
.lv-fl-rail li[data-state="active"] { color: var(--foreground); }
.lv-fl-rail li[data-state="active"] span { color: var(--primary-strong, var(--primary)); box-shadow: inset 0 0 0 2px var(--primary), 0 0 0 5px color-mix(in oklab, var(--primary) 15%, transparent); }
.lv-fl-rail li[data-state="done"] span { color: #fff; background: var(--primary); box-shadow: none; }
.lv-fl-feed { padding: 12px 14px; border-radius: 16px; background: var(--card); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-feed p { margin-bottom: 8px; font-size: 12px; font-weight: 650; color: var(--muted-foreground); }
.lv-fl-feed ul { display: grid; gap: 7px; min-height: 114px; align-content: start; }
.lv-fl-feed li { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: start; gap: 8px; font-size: 12px; line-height: 1.35; color: var(--muted-foreground); }
.lv-fl-feed time { padding-top: 1px; font-size: 11px; color: var(--muted-foreground); }
.lv-fl-feed i { display: grid; place-items: center; width: 16px; height: 16px; margin-top: 1px; border-radius: 99px; background: var(--muted); }
.lv-fl-feed li[data-kind="data"] i { color: var(--success-strong); background: var(--success-tint); }
.lv-fl-feed i svg { width: 10px; height: 10px; stroke-width: 3.2; }
.lv-fl-feed span { display: grid; min-width: 0; }
.lv-fl-feed span b { font-size: 12.5px; color: var(--foreground); }
.lv-fl-feed span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.lv-fl-res { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 18px; visibility: hidden; opacity: 0; transform: translateY(14px) scale(0.985); }
.lv-fl.is-done .lv-fl-res { visibility: visible; opacity: 1; transform: none; transition-delay: 0.15s, 0.15s, 0s; }
.lv-fl-res-main { display: grid; grid-template-rows: auto 1fr; gap: 12px; padding: 12px; border-radius: 18px; background: color-mix(in oklab, var(--primary) 5%, var(--card)); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-car { display: flex; align-items: center; gap: 12px; }
.lv-fl-car picture { flex: none; width: 72px; height: 54px; overflow: hidden; border-radius: 10px; }
.lv-fl-car img { width: 100%; height: 100%; object-fit: cover; }
.lv-fl-car span { display: grid; gap: 2px; min-width: 0; }
.lv-fl-car b { overflow: hidden; font-size: 15px; white-space: nowrap; text-overflow: ellipsis; color: var(--foreground); }
.lv-fl-car small { font-size: 13px; color: var(--muted-foreground); }
.lv-fl-verdict { display: grid; justify-items: center; align-content: center; gap: 8px; padding: 12px 12px 14px; border-radius: 16px; text-align: center; background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 14px 30px -22px rgb(15 23 42 / 0.4); }
.lv-fl-verdict .lv-gauge { width: 158px; }
.lv-fl-verdict > div { display: grid; justify-items: center; gap: 6px; }
.lv-fl-verdict b { max-width: 26ch; font-size: 16px; line-height: 1.3; color: var(--foreground); }
.lv-fl-res-side { display: grid; align-content: center; gap: 8px; }
.lv-fl-res-side > p { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-foreground); }
.lv-fl-res-side > p + ul + p { margin-top: 4px; }
.lv-fl-checks { display: grid; gap: 5px; }
.lv-fl-checks li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--foreground); }
.lv-fl-checks svg { flex: none; width: 18px; height: 18px; padding: 3px; border-radius: 99px; stroke-width: 3; color: var(--success-strong); background: var(--success-tint); }
.lv-fl-keys { display: grid; gap: 6px; }
.lv-fl-keys li { display: flex; gap: 10px; padding: 8px 11px; border-radius: 14px; font-size: 12.5px; line-height: 1.4; color: var(--muted-foreground); background: var(--card); box-shadow: inset 0 0 0 1px var(--border); }
.lv-fl-keys i { flex: none; width: 8px; height: 8px; margin-top: 5px; border-radius: 99px; background: var(--warning); box-shadow: 0 0 0 4px var(--warning-tint); }
.lv-fl-keys .lv-tone-go i { background: var(--success); box-shadow: 0 0 0 4px var(--success-tint); }
.lv-fl-keys .lv-tone-stop i { background: var(--destructive); box-shadow: 0 0 0 4px var(--destructive-tint); }
.lv-fl-keys span { display: grid; gap: 1px; min-width: 0; }
.lv-fl-keys b { font-size: 13.5px; color: var(--foreground); }
.lv-fl-checks li, .lv-fl-keys li { opacity: 0; transform: translateX(10px); transition: opacity 0.35s var(--fl-ease), transform 0.45s var(--fl-ease); transition-delay: calc(0.35s + var(--i) * 0.12s); }
.lv-fl-keys li { transition-delay: calc(0.9s + var(--i) * 0.16s); }
.lv-fl.is-done .lv-fl-checks li, .lv-fl.is-done .lv-fl-keys li { opacity: 1; transform: none; }
.lv-fl-cursor { position: absolute; z-index: 10; left: 0; top: 0; width: 26px; height: 26px; pointer-events: none; opacity: 0; }
.lv-fl-ptr { display: block; width: 26px; height: 26px; overflow: visible; transform-origin: 4px 3px; filter: drop-shadow(0 3px 5px rgb(15 23 42 / 0.35)); }
.lv-fl-ptr path { fill: #fff; stroke: #0f172a; stroke-width: 1.5; stroke-linejoin: round; }
.lv-fl-ripple { position: absolute; left: -16px; top: -17px; width: 40px; height: 40px; border-radius: 50%; opacity: 0; background: color-mix(in oklab, var(--primary) 45%, transparent); }
.lv-fl-plus { position: absolute; left: 17px; top: 19px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 99px; font-size: 14px; font-weight: 800; line-height: 1; color: #fff; background: var(--success); opacity: 0; transform: scale(0.4); transition: opacity 0.2s, transform 0.3s var(--fl-spring); }
.lv-fl.is-over:not(.is-drop) .lv-fl-plus { opacity: 1; transform: none; }
.lv-fl-ghost { position: absolute; z-index: 9; left: 0; top: 0; display: flex; align-items: center; gap: 10px; width: 232px; padding: 8px; border-radius: 14px; pointer-events: none; opacity: 0; background: var(--card);
box-shadow: 0 0 0 1px var(--border), 0 28px 50px -18px rgb(15 23 42 / 0.55); transform-origin: 34px 26px; transition: opacity 0.2s, scale 0.35s var(--fl-ease); }
.lv-fl.is-grab .lv-fl-ghost { opacity: 1; }
.lv-fl.is-drop .lv-fl-ghost { opacity: 0; scale: 0.4; transition: opacity 0.3s 0.05s, scale 0.35s var(--fl-ease); }
.lv-fl-ghost picture { flex: none; width: 64px; height: 46px; overflow: hidden; border-radius: 9px; background: var(--muted); }
.lv-fl-ghost img { width: 100%; height: 100%; object-fit: cover; }
.lv-fl-ghost span { display: grid; gap: 1px; min-width: 0; }
.lv-fl-ghost b { overflow: hidden; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; color: var(--foreground); }
.lv-fl-ghost small { font-size: 13px; font-weight: 700; color: var(--foreground); }
.lv-fl-toc { position: relative; grid-column: 1 / -1; grid-row: 3; margin-top: 6px; }
.lv-fl-brief { position: relative; z-index: 1; padding: 16px; border-radius: 24px; background: var(--card); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report);
transform: translateY(8px) rotate(-0.9deg); transform-origin: 30% 50%; transition: transform 0.8s var(--fl-spring); }
.lv-fl.is-toc .lv-fl-brief, .lv-fl.is-shown .lv-fl-brief { transform: rotate(-0.4deg); }
.lv-fl-brief .lv-ci { position: relative; width: 28px; height: 28px; border-radius: 9px; }
.lv-fl-brief .lv-ci svg { position: relative; width: 15px; height: 15px; }
.lv-fl-end { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: clamp(18px, 1.6vw, 30px); margin-bottom: 14px; padding: 2px 6px 14px 10px; border-bottom: 1px solid var(--border); }
.lv-fl-brief-score { display: flex; align-items: center; gap: 10px; }
.lv-fl-brief-score small { font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); }
.lv-fl .lv-fl-brief .lv-ring-fg { animation: none; transition: stroke-dashoffset 0.9s var(--fl-ease) 0.1s; }
.lv-fl:not(.is-toc):not(.is-shown) .lv-fl-brief .lv-ring-fg { stroke-dashoffset: 138.2; }
.lv-fl-brief .lv-ring b { font-weight: 750; color: var(--foreground); opacity: 0; transition: opacity 0.3s 0.25s; }
.lv-fl.is-toc .lv-fl-brief .lv-ring b, .lv-fl.is-shown .lv-fl-brief .lv-ring b { opacity: 1; }
.lv-fl-end-txt { display: grid; gap: 6px; min-width: 0; }
.lv-fl-lbl-3 { font-size: 13px; }
.lv-fl-lbl-3 i { width: 24px; height: 24px; font-size: 12px; }
.lv-fl-say { display: grid; min-width: 0; }
.lv-fl-say > p { grid-area: 1 / 1; align-self: center; font-size: clamp(24px, 1.95vw, 34px); font-weight: 650; line-height: 1.22; letter-spacing: -0.012em; color: var(--foreground); text-wrap: balance; }
.lv-fl-say-q { transition: opacity 0.3s var(--fl-ease), transform 0.4s var(--fl-ease); }
.lv-fl-say-a { clip-path: inset(-6px 100% -6px -6px); transition: clip-path 0.8s var(--fl-ease) 0.15s; }
.lv-fl.is-end .lv-fl-say-q, .lv-fl.is-shown .lv-fl-say-q { opacity: 0; transform: translateY(-8px); }
.lv-fl.is-end .lv-fl-say-a, .lv-fl.is-shown .lv-fl-say-a { clip-path: inset(-6px -10px -6px -6px); }
.lv-fl-end p b { font-weight: 750; }
.lv-fl-end p s { font-weight: 700; color: var(--muted-foreground); text-decoration-color: var(--destructive); text-decoration-thickness: 2px; }
.lv-fl-end p .lv-fl-hi { color: var(--primary-strong, var(--primary)); }
.lv-fl-say .lv-verdict { vertical-align: 0.14em; }
.lv-fl-say .lv-fl-nw { white-space: nowrap; }
.lv-fl-end-cta { display: flex; align-items: center; gap: 10px; }
.lv-fl-brief ol { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, 0.92fr) minmax(0, 1.2fr) minmax(0, 1.1fr) minmax(0, 1.08fr); grid-auto-rows: 1fr; gap: 10px; }
.lv-fl-brief li { display: grid; min-width: 0; }
.lv-fl-tile { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 9px; min-height: 64px; padding: 10px 10px 10px 11px; border-radius: 14px; text-decoration: none; color: var(--foreground);
background: color-mix(in oklab, var(--muted) 35%, var(--card)); box-shadow: inset 0 0 0 1px var(--border); transition: transform 0.35s var(--fl-ease), box-shadow 0.35s var(--fl-ease); }
.lv-fl-tile .lv-ci::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: var(--muted); transition: opacity 0.4s var(--fl-ease); transition-delay: calc(var(--i) * 90ms); }
.lv-fl-tile .lv-ci svg { opacity: 0.45; transition: opacity 0.4s var(--fl-ease); transition-delay: calc(var(--i) * 90ms); }
.lv-fl-tile .lv-pi-l { stroke-dasharray: 1; }
.lv-fl.is-toc .lv-fl-tile .lv-ci::before, .lv-fl.is-shown .lv-fl-tile .lv-ci::before { opacity: 0; }
.lv-fl.is-toc .lv-fl-tile .lv-ci svg, .lv-fl.is-shown .lv-fl-tile .lv-ci svg { opacity: 1; }
.lv-fl-toc-txt { position: relative; display: grid; gap: 3px; min-width: 0; }
.lv-fl-toc-txt::after { content: ""; position: absolute; left: 0; top: 24px; width: 100%; height: 24px; border-radius: 5px; pointer-events: none;
background: linear-gradient(var(--muted), var(--muted)) 0 0 / 74% 9px no-repeat, linear-gradient(var(--muted), var(--muted)) 0 15px / 46% 9px no-repeat; transition: opacity 0.3s var(--fl-ease); transition-delay: calc(0.12s + var(--i) * 90ms); }
.lv-fl.is-toc .lv-fl-toc-txt::after, .lv-fl.is-shown .lv-fl-toc-txt::after, .lv-fl-toc-link:focus-visible .lv-fl-toc-txt::after { opacity: 0; }
.lv-fl-toc-txt small { font-size: 12px; font-weight: 550; line-height: 1.3; color: var(--muted-foreground); }
.lv-fl-toc-txt b { font-size: 14.5px; font-weight: 700; line-height: 1.3; letter-spacing: -0.005em; text-wrap: balance;
clip-path: inset(-3px 100% -3px -3px); transition: clip-path 0.55s var(--fl-ease); transition-delay: calc(0.12s + var(--i) * 90ms); }
.lv-fl.is-toc .lv-fl-toc-txt b, .lv-fl.is-shown .lv-fl-toc-txt b, .lv-fl-toc-link:focus-visible .lv-fl-toc-txt b { clip-path: inset(-3px -6px -3px -3px); }
.lv-fl-toc-txt b .lv-fl-nw { white-space: nowrap; }
.lv-fl-toc-txt .lv-fl-hi { color: var(--primary-strong, var(--primary)); }
.lv-fl-toc-go { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-left: 6px; vertical-align: -4px; border-radius: 99px; color: var(--primary-strong, var(--primary)); background: color-mix(in oklab, var(--primary) 12%, transparent); }
.lv-fl-toc-go svg { width: 13px; height: 13px; stroke-width: 2.4; }
.lv-fl-toc-link { background: color-mix(in oklab, var(--primary) 7%, var(--card)); box-shadow: inset 0 0 0 1.5px color-mix(in oklab, var(--primary) 40%, var(--border)); }
.lv-fl.is-toc:not(.is-end) .lv-fl-toc-link { transform: translateY(-3px); box-shadow: inset 0 0 0 1.5px var(--primary), 0 14px 26px -16px color-mix(in oklab, var(--primary) 60%, transparent); }
.lv-fl-toc-link:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.lv-fl-pause { position: absolute; z-index: 2; top: -5px; right: 0; }
@media (max-width: 1279px) {
.lv-fl-slot, [data-vehicle="moto"] .lv-fl-slot { min-height: 861px; }
.lv-fl { grid-template-columns: minmax(0, 3.6fr) minmax(40px, 0.4fr) minmax(0, 7.4fr); }
.lv-fl-run { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.lv-fl-rail li { font-size: 10.5px; }
.lv-fl-zone-ph, .lv-fl-zone-url { right: 128px; font-size: 13px; }
.lv-fl-brief ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lv-fl-desc { -webkit-line-clamp: 5; }
.lv-fl-end-cta { flex-direction: column; align-items: stretch; gap: 8px; }
.lv-fl-car b { display: -webkit-box; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; line-height: 1.3; }
.lv-fl-verdict .lv-gauge { width: 140px; }
.lv-fl-say > p { font-size: clamp(20px, 1.95vw, 24px); }
.lv-head-facets span { font-size: 12.5px; }
}
@media (max-width: 1109px) {
.lv-fl-slot { min-height: 878px; }
[data-vehicle="moto"] .lv-fl-slot { min-height: 897px; }
}
@media (prefers-reduced-motion: reduce) {
.lv-fl *, .lv-fl *::before, .lv-fl *::after { transition: none !important; animation: none !important; }
.lv-fl-pause { display: none; }
}
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-fl.is-drop:not(.is-done) .lv-fl-link i { animation: lv-fl-travel 0.95s var(--ease-in-out) infinite; }
.lv-fl.is-drop:not(.is-done) .lv-fl-link i::before { animation: lv-fl-dot 0.95s linear infinite; }
.lv-fl.is-run:not(.is-done) .lv-fl-beam { opacity: 1; animation: lv-fl-beam 1.7s var(--ease-in-out) infinite; }
.lv-fl.is-run:not(.is-done) .lv-fl-live i { animation: lv-fl-blink 1s ease-in-out infinite; }
.lv-fl-feed li:first-child { animation: lv-d-in 360ms var(--ease-out) both; }
.lv-fl-status > span:last-child > * { animation: lv-d-in 320ms var(--ease-out) both; }
.lv-fl.is-done .lv-fl-verdict .lv-verdict { animation: lv-d-pop 420ms var(--ease-spring) 700ms both; }
.lv-fl.is-toc .lv-fl-tile .lv-pi-l { animation: lv-fl-draw 0.75s var(--fl-ease) both; animation-delay: calc(var(--i) * 90ms); }
.lv-fl.is-end:not(.is-shown) .lv-fl-say-a .lv-verdict { animation: lv-fl-pop 0.5s var(--fl-spring) 0.6s both; }
@supports (animation-timeline: view()) {
.lv-fl-wrap { perspective: 1600px; }
.lv-fl { transform-origin: 50% 100%; animation: lv-fl-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 30%; }
}
}
@keyframes lv-tr-straighten { from { transform: rotateY(8deg) rotateZ(-2deg); } to { transform: rotateY(3deg) rotateZ(-2deg); } }
@keyframes lv-tr-swing { from { rotate: -6deg; } to { rotate: 4deg; } }
@keyframes lv-tr-sway { from { transform: rotate(-2deg); } to { transform: rotate(2.4deg); } }
@media (min-width: 1024px) {
.lv > #ce-que-revele { contain-intrinsic-size: auto 3850px; --tr-stage: clamp(600px, calc(100svh - var(--lv-top) - 24px), 900px); --tr-run: 60svh; }
@media (min-width: 1180px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
.lv > #ce-que-revele { contain-intrinsic-size: auto calc(2920px + var(--tr-stage) + var(--tr-run)); }
}
@media (min-width: 1280px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
.lv > #ce-que-revele { contain-intrinsic-size: auto calc(2450px + var(--tr-stage) + var(--tr-run)); }
}
@media (min-width: 1440px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
.lv > #ce-que-revele { contain-intrinsic-size: auto calc(2540px + var(--tr-stage) + var(--tr-run)); }
}
@media (min-width: 1680px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
.lv > #ce-que-revele { contain-intrinsic-size: auto calc(2610px + var(--tr-stage) + var(--tr-run)); }
}
.lv > #ce-que-revele :is(.lv-bento2, .lv-bento-more) { display: none; }
.lv > #ce-que-revele .lv-wrap > .lv-blk-head { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.lv > #ce-que-revele .lv-wrap > .lv-blk-head > .lv-eyebrow { justify-content: center; }
.lv > #ce-que-revele .lv-wrap > .lv-blk-head > .lv-h2 { max-width: 24ch; }
.lv > #ce-que-revele { --tr-deal: 1085px; --tr-flat: 779px; }
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-tr-root)) > .lv-blk-head { margin-bottom: 0; padding-bottom: calc(56px + var(--tr-flat) + 112px + var(--tr-deal)); }
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-rb-root))::after { content: ""; display: block; height: var(--lv-rb-res, 0px); }
.lv-tr-root { position: relative; }
.lv-tr-root .lv-tr-note { font-family: var(--font-handwriting), cursive; font-weight: 500; line-height: 1.05; color: var(--primary-strong, var(--primary)); }
.lv-tr-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
.lv-tr-beats { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.lv-tr-beat { display: grid; gap: 6px; }
.lv-tr-beat-l { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--primary-strong, var(--primary)); }
.lv-tr-beat-t { font-size: 17px; line-height: 1.32; font-weight: 600; letter-spacing: -0.01em; color: var(--foreground); text-wrap: pretty; }
.lv-tr-bar { display: block; height: 4px; margin-top: 6px; border-radius: 2px; background: var(--lane-soft); overflow: hidden; position: relative; }
.lv-tr-bar::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, var(--lane) 0 14px, transparent 14px 22px); transform-origin: left center; transform: scaleX(var(--k, 1)); }
.lv-tr-side { display: grid; gap: 14px; }
.lv-tr-count { display: grid; gap: 2px; }
.lv-tr-count-n { font-size: 64px; line-height: 1; font-weight: 750; letter-spacing: -0.04em; color: var(--foreground); }
.lv-tr-count-l { font-size: 13.5px; font-weight: 600; color: var(--muted-foreground); }
.lv-tr-links { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.lv-tr-links > a:first-child { margin-left: -10px; }
.lv-tr-ad { position: relative; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 0; padding-top: 28px; perspective: 1400px; }
.lv-tr-pose { position: relative; display: flex; flex-direction: column; flex: 0 1 auto; min-height: 0; transform: rotateY(8deg) rotateZ(-2deg); transform-style: preserve-3d; transform-origin: 50% 60%; }
.lv-tr-pose::after { content: ""; position: absolute; left: 8%; right: 8%; bottom: -30px; height: 26px; border-radius: 50%; background: radial-gradient(closest-side, rgb(15 23 42 / 0.16), transparent); pointer-events: none; }
.dark .lv-tr-pose::after { background: radial-gradient(closest-side, rgb(0 0 0 / 0.5), transparent); }
.lv-tr-win { display: flex; flex-direction: column; flex: 0 1 auto; min-height: 0; overflow: hidden; border-radius: 20px; background: var(--card); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report); }
.lv-tr-chrome { display: flex; flex: none; align-items: center; gap: 12px; height: 40px; padding: 0 14px; border-bottom: 1px solid var(--border); background: color-mix(in oklab, var(--muted) 70%, var(--card)); }
.lv-tr-dots { display: flex; gap: 6px; }
.lv-tr-dots i { width: 10px; height: 10px; border-radius: 99px; background: color-mix(in oklab, var(--muted-foreground) 30%, transparent); }
.lv-tr-url { display: flex; flex: 1; align-items: center; gap: 6px; min-width: 0; height: 24px; padding: 0 9px; overflow: hidden; border-radius: 8px; font-size: 11.5px; white-space: nowrap; text-overflow: ellipsis; color: var(--muted-foreground); background: var(--card); }
.lv-tr-url svg { flex: none; width: 12px; height: 12px; }
.lv-tr-photo { position: relative; display: block; flex: 0 1 auto; min-height: 96px; aspect-ratio: 4 / 3; margin: 12px 12px 0; overflow: hidden; border-radius: 12px; background: var(--muted); }
.lv-tr-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lv-tr-info { display: grid; flex: none; gap: 8px; padding: 12px 14px 14px; }
.lv-tr-title { font-size: 15px; line-height: 1.42; font-weight: 700; color: var(--foreground); }
.lv-tr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lv-tr-chips li { display: inline-flex; align-items: center; height: 26px; padding: 0 9px; border-radius: 8px; font-size: 12.5px; font-weight: 600; white-space: nowrap; color: var(--muted-foreground); background: color-mix(in oklab, var(--muted) 80%, var(--card)); }
.lv-tr-buy { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 40px; }
.lv-tr-price { font-size: 32px; line-height: 1.15; font-weight: 750; letter-spacing: -0.03em; color: var(--foreground); white-space: nowrap; }
.lv-tr-vd { display: inline-flex; flex: none; rotate: -6deg; }
.lv-tr-vd .lv-verdict { height: 30px; padding: 0 11px; font-size: 13px; }
.lv-tr-anc { --tr-tone: var(--warning); --tr-ink: var(--warning-strong); position: relative; display: inline-block; white-space: nowrap; }
.lv-tr-anc[data-inline] { display: inline-flex; align-items: center; gap: 7px; }
.lv-tr-anc[data-tone="go"] { --tr-tone: var(--success); --tr-ink: var(--success-strong); }
.lv-tr-anc[data-tone="stop"] { --tr-tone: var(--destructive); --tr-ink: var(--destructive-strong); }
.lv-tr-anc-tx { position: relative; display: inline-block; }
.lv-tr-anc-w { position: relative; }
.lv-tr-hl { position: absolute; inset: -2px -5px; border-radius: 6px; background: color-mix(in oklab, var(--tr-tone) 26%, transparent); clip-path: inset(0 100% 0 0); }
.lv-tr-ul { position: absolute; left: -4px; right: -4px; bottom: -4px; height: 2.5px; border-radius: 2px; background: var(--tr-ink); clip-path: inset(0 100% 0 0); }
.lv-tr-anc[data-on] :is(.lv-tr-hl, .lv-tr-ul) { clip-path: inset(0); }
.lv-tr-nums { display: inline-flex; gap: 3px; }
.lv-tr-anc:not([data-inline]) .lv-tr-nums { position: absolute; bottom: calc(100% - 3px); right: -11px; pointer-events: none; }
.lv-tr-num { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 99px; font-size: 10.5px; font-style: normal; font-weight: 800; line-height: 1; letter-spacing: 0; color: var(--card); background: var(--tr-ink); box-shadow: 0 0 0 2px var(--card); opacity: 0; scale: 0.6; }
.lv-tr-num[data-on] { opacity: 1; scale: 1; }
.lv-tr-price .lv-tr-ul { height: 3px; bottom: -3px; }
.lv-tr-pose { --tr-tag-w: clamp(112px, 8.6vw, 156px); }
.lv-tr-tag { --tr-tag-edge: color-mix(in oklab, var(--foreground) 22%, transparent); position: absolute; z-index: 2; top: -8px; right: 14px; width: var(--tr-tag-w); transform-origin: 50% 5px; rotate: 4deg; filter: drop-shadow(0 0 0.6px var(--tr-tag-edge)) drop-shadow(0 12px 12px rgb(15 23 42 / 0.2)); pointer-events: none; }
.dark .lv-tr-tag { --tr-tag-edge: color-mix(in oklab, white 30%, transparent); filter: drop-shadow(0 0 0.6px var(--tr-tag-edge)) drop-shadow(0 12px 14px rgb(0 0 0 / 0.5)); }
.lv-tr-string { position: relative; z-index: 1; display: block; width: 24px; height: 64px; margin: 0 auto -18px; overflow: visible; }
.lv-tr-string path { stroke: var(--primary); stroke-width: 1.7; stroke-linecap: round; }
.lv-tr-string circle { fill: none; stroke: var(--primary); stroke-width: 1.7; }
.lv-tr-tag-in { position: relative; display: grid; justify-items: center; gap: 2px; padding: 30px 8px 15px; text-align: center; background: var(--card); clip-path: polygon(26% 0, 74% 0, 100% 17%, 100% 100%, 0 100%, 0 17%); }
.dark .lv-tr-tag-in { background: color-mix(in oklab, var(--card) 84%, white); }
.lv-tr-eyelet { position: absolute; left: 50%; top: 10px; width: 13px; height: 13px; margin-left: -6.5px; border-radius: 99px; background: var(--background); box-shadow: 0 0 0 3.5px color-mix(in oklab, var(--primary) 22%, var(--card)), inset 0 1px 2px rgb(15 23 42 / 0.25); }
.lv-tr-tag small { font-size: clamp(9.5px, 0.7vw, 12px); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted-foreground); }
.lv-tr-tag b { font-size: clamp(19px, 1.45vw, 26px); line-height: 1.12; font-weight: 750; letter-spacing: -0.02em; color: var(--foreground); white-space: nowrap; }
.lv-tr-strike { position: absolute; left: 9%; right: 9%; bottom: 12px; height: 30px; overflow: visible; pointer-events: none; }
.lv-tr-strike path { stroke: var(--destructive); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.lv-tr-tag[data-on] .lv-tr-strike path { stroke-dashoffset: 0; }
.lv-tr-tag:not([data-on]) .lv-tr-strike { opacity: 0; }
.lv-tr-ad > .lv-tr-note { display: flex; flex: none; align-items: center; justify-content: flex-end; gap: 6px; height: 72px; margin: 14px 0 0; padding: 10px 0 0; font-size: 25px; white-space: nowrap; clip-path: inset(-8px 100% -8px -8px); }
.lv-tr-ad > .lv-tr-note[data-on] { clip-path: inset(-8px -8px -8px -8px); }
.lv-tr-note svg { flex: none; width: 56px; height: 26px; overflow: visible; }
.lv-tr-note svg path { stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lv-tr-list { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 10px; min-width: 0; min-height: 0; }
.lv-tr-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lv-tr-list-head h3 { font-size: 15px; font-weight: 750; letter-spacing: -0.01em; color: var(--foreground); }
.lv-tr-rows { display: grid; grid-template-rows: repeat(var(--rows, 6), minmax(auto, 1fr)); gap: 6px; }
.lv-tr-slot { position: relative; display: grid; border-radius: 16px; }
.lv-tr-slot > * { grid-area: 1 / 1; }
.lv-tr-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; column-gap: 12px; padding: 7px 14px 7px 12px; border-radius: 16px; background: var(--card); box-shadow: 0 0 0 1px color-mix(in oklab, var(--border) 80%, transparent), var(--lv-shadow-card); }
.lv-tr-ic { position: relative; display: grid; }
.lv-tr-ic .lv-ci, .lv-tr-ghost .lv-ci { width: 28px; height: 28px; border-radius: 9px; }
.lv-tr-ic .lv-ci svg, .lv-tr-ghost .lv-ci svg { width: 15px; height: 15px; }
.lv-tr-n { position: absolute; top: -7px; left: -7px; display: grid; place-items: center; width: 17px; height: 17px; border-radius: 99px; font-size: 10px; font-style: normal; font-weight: 800; color: var(--card); background: var(--warning-strong); box-shadow: 0 0 0 2px var(--card); }
.lv-tr-row[data-tone="go"] .lv-tr-n { background: var(--success-strong); }
.lv-tr-row[data-tone="stop"] .lv-tr-n { background: var(--destructive-strong); }
.lv-tr-main { display: grid; gap: 1px; min-width: 0; }
.lv-tr-lbl { font-size: 15px; line-height: 18px; font-weight: 700; letter-spacing: -0.01em; color: var(--foreground); text-wrap: pretty; }
.lv-tr-det { font-size: 13px; line-height: 16.5px; color: var(--muted-foreground); text-wrap: pretty; }
.lv-tr-tail { display: grid; justify-items: end; gap: 1px; text-align: right; }
.lv-tr-rub { font-size: 11.5px; line-height: 14px; font-weight: 600; white-space: nowrap; color: var(--muted-foreground); }
.lv-tr-amt { font-size: 18px; line-height: 22px; font-weight: 750; letter-spacing: -0.02em; white-space: nowrap; color: var(--foreground); }
.lv-tr-row:not([data-costed]) .lv-tr-amt { font-size: 14px; font-weight: 700; color: var(--warning-strong); }
.lv-tr-list-foot { display: flex; justify-content: flex-end; }
.lv-tr-list-foot > a { margin-right: -10px; }
.lv-tr-ghost { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 0 16px 0 12px; border-radius: 16px; background: color-mix(in oklab, var(--muted) 60%, var(--card)); box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--border) 75%, transparent); }
.lv-tr-ghost .lv-ci { opacity: 0.6; }
.lv-tr-ghost-l { flex: none; font-size: 13.5px; font-weight: 650; color: var(--muted-foreground); }
.lv-tr-lead { flex: 1; min-width: 24px; height: 3px; background: radial-gradient(circle, color-mix(in oklab, var(--muted-foreground) 45%, transparent) 1.1px, transparent 1.5px) 0 50% / 8px 3px repeat-x; }
.lv-tr-track { position: relative; height: calc(var(--tr-stage) + var(--tr-run)); }
.lv-tr-marks { position: absolute; inset: 0; pointer-events: none; }
.lv-tr-marks i { position: absolute; left: 0; width: 1px; top: calc(50svh - var(--lv-top) - 12px + var(--i) * var(--tr-run) / var(--n)); height: calc(var(--tr-run) / var(--n)); }
.lv-tr-stage { position: sticky; top: calc(var(--lv-top) + 12px); height: var(--tr-stage); padding-bottom: var(--lv-dock); }
.lv-tr-track .lv-tr-grid { height: 100%; }
.lv-tr-track .lv-tr-beats { grid-column: 1 / 4; justify-content: center; gap: clamp(14px, calc(6.4svh - 24px), 40px); }
.lv-tr-track .lv-tr-side { margin-top: 6px; }
.lv-tr-track .lv-tr-ad { grid-column: 4 / 8; }
.lv-tr-track .lv-tr-list { grid-column: 8 / 13; }
.lv-tr-track .lv-tr-beat[data-state="next"] .lv-tr-beat-t { opacity: 0; translate: 0 10px; }
.lv-tr-track .lv-tr-beat[data-state="past"] .lv-tr-beat-t { opacity: 0.6; }
.lv-tr-track .lv-tr-slot:not([data-on]) .lv-tr-row { opacity: 0; transform: translate(28px, 12px) rotate(1.5deg); }
.lv-tr-track .lv-tr-slot[data-on] .lv-tr-ghost { opacity: 0; }
.lv-tr-track .lv-tr-vd:not([data-on]) { opacity: 0; scale: 1.2; }
.lv-tr-prog { display: grid; gap: 8px; }
.lv-tr-prog-row { display: flex; align-items: center; gap: 10px; }
.lv-tr-prog-n { flex: none; min-width: 3ch; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; color: var(--muted-foreground); }
.lv-tr-prog-seg { display: flex; flex: 1; gap: 4px; }
.lv-tr-prog-seg i { flex: 1; height: 4px; border-radius: 2px; background: var(--lane-soft); }
.lv-tr-prog-seg i[data-on] { background: var(--lane); }
.lv-tr-prog-hint { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--primary-strong, var(--primary)); }
.lv-tr-prog-hint svg { width: 14px; height: 14px; }
.lv-tr-prog-hint[data-off] { opacity: 0; translate: 0 -4px; }
.lv-tr-flat .lv-tr-grid { row-gap: 44px; }
.lv-tr-flat .lv-tr-beats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 24px; align-items: start; }
.lv-tr-flat .lv-tr-side { display: contents; }
.lv-tr-flat .lv-tr-count { grid-column: 4; grid-row: 1; }
.lv-tr-flat .lv-tr-links { grid-column: 1 / -1; grid-row: 2; flex-direction: row; align-items: center; gap: 14px; }
.lv-tr-flat .lv-tr-ad { grid-column: 1 / 6; }
.lv-tr-flat .lv-tr-list { grid-column: 6 / 13; }
.lv-tr-flat .lv-tr-rows { grid-template-rows: repeat(var(--rows, 6), minmax(64px, 1fr)); }
.lv-tr-deal { margin-top: 120px; }
.lv-tr-track + .lv-tr-deal { margin-top: 24px; }
.lv-tr-flat + .lv-tr-deal { margin-top: 112px; }
.lv-tr-deal .lv-tr-deal-head.lv-blk-head { margin-bottom: 32px; }
#tr-negociation { scroll-margin-top: calc(var(--lv-top) - 68px); }
.lv-tr-deal-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "price price" "args args"; gap: 32px 24px; }
.lv-tr-args { grid-area: args; justify-content: flex-start; }
.lv-tr-prices { grid-area: price; }
.lv-tr-card.lv-tr-card { gap: 14px; padding: 22px 22px 20px; border-radius: 22px; }
.lv-tr-card-head { display: flex; align-items: flex-start; gap: 12px; }
.lv-tr-card-head > div { flex: 1; min-width: 0; }
.lv-tr-card-head h4 { font-size: 15.5px; line-height: 1.3; font-weight: 750; letter-spacing: -0.01em; color: var(--foreground); }
.lv-tr-card-head p { margin-top: 3px; font-size: 13px; line-height: 1.45; color: var(--muted-foreground); }
.lv-tr-card-head .lv-tag { flex: none; height: 24px; font-size: 12px; }
.lv-tr-arg-list { display: grid; gap: 10px; }
.lv-tr-arg-list li { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 12px; border-radius: 14px; background: color-mix(in oklab, var(--muted) 45%, transparent); box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--border) 70%, transparent); }
.lv-tr-arg-list li > svg { width: 16px; height: 16px; margin-top: 2px; color: var(--warning-strong); }
.lv-tr-arg-list li > span { font-size: 13.5px; line-height: 1.42; color: var(--foreground); }
.lv-tr-cut { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 7px; font-size: 12.5px; font-weight: 750; white-space: nowrap; color: var(--success-strong); background: var(--success-tint); }
.lv-tr-tip { display: flex; gap: 10px; margin-top: auto; padding: 12px; border-radius: 14px; font-size: 12.5px; line-height: 1.5; color: var(--muted-foreground); background: var(--ds-tint, color-mix(in oklab, var(--primary) 8%, transparent)); }
.lv-tr-tip svg { flex: none; width: 16px; height: 16px; margin-top: 1px; color: var(--primary-strong, var(--primary)); }
.lv-tr-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: center; justify-items: center; column-gap: 24px; row-gap: 6px; text-align: center; }
.lv-tr-was, .lv-tr-now { display: grid; justify-items: center; gap: 4px; }
.lv-tr-plabel { font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted-foreground); }
.lv-tr-now .lv-tr-plabel { color: var(--primary-strong, var(--primary)); }
.lv-tr-big { position: relative; display: inline-block; font-size: clamp(84px, 8.4vw, 168px); line-height: 1; font-weight: 750; letter-spacing: -0.045em; white-space: nowrap; text-align: center; color: var(--foreground); }
.lv-tr-now .lv-tr-big { color: var(--primary-strong, var(--primary)); }
.lv-tr-strikebox { position: relative; display: inline-block; }
.lv-tr-big-tx { display: inline-block; }
.lv-tr-pstrike { position: absolute; left: -3%; top: 30%; width: 106%; height: 42%; overflow: visible; pointer-events: none; }
.lv-tr-pstrike path { stroke: var(--primary); stroke-width: 5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.lv-tr-was .lv-tr-big-tx { opacity: 0.35; }
.lv-tr-gain { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 16px; margin-top: 10px; }
.lv-tr-margin { font-size: 18px; font-weight: 650; color: var(--success-strong); }
.lv-tr-margin b { font-weight: 800; }
.lv-tr-gain > .lv-tr-note-deal { font-size: 27px; rotate: -3deg; }
.lv-tr-msgline { grid-column: 1 / -1; display: grid; justify-items: center; gap: 3px; max-width: 64ch; margin: 2px auto 0; text-align: center; }
.lv-tr-msgline-l { font-size: 13px; font-weight: 650; color: var(--muted-foreground); }
.lv-tr-msgline-q { font-size: 14px; line-height: 1.5; font-style: italic; color: var(--foreground); text-wrap: balance; }
.lv-tr-ladder { position: relative; height: 120px; margin-top: 56px; }
.lv-tr-lane { position: absolute; left: 0; right: 0; top: 62px; height: 4px; border-radius: 2px; background: repeating-linear-gradient(90deg, var(--lane) 0 18px, transparent 18px 30px); opacity: 0.32; }
.lv-tr-lane-on { opacity: 1; clip-path: inset(0 calc(100% - var(--from)) 0 var(--from)); }
.lv-tr-ladder[data-roll] .lv-tr-lane-on { clip-path: inset(0 calc(100% - var(--from)) 0 var(--to)); }
.lv-tr-car { position: absolute; left: 0; top: 0; width: 100%; height: 56px; pointer-events: none; transform: translateX(var(--from)); }
.lv-tr-ladder[data-roll] .lv-tr-car { transform: translateX(var(--to)); }
.lv-tr-car svg { position: absolute; left: 0; bottom: 0; width: auto; height: 56px; translate: -50% 0; }
.lv-tr-steps { position: absolute; inset: 0; }
.lv-tr-step { position: absolute; left: var(--x); top: 56px; display: grid; justify-items: center; gap: 2px; translate: -50% 0; white-space: nowrap; }
.lv-tr-step::before { content: ""; width: 16px; height: 16px; margin-bottom: 4px; border-radius: 99px; background: var(--card); box-shadow: inset 0 0 0 3px var(--lane); }
.lv-tr-step-l { font-size: 12.5px; font-weight: 650; color: var(--muted-foreground); }
.lv-tr-step b { font-size: 18px; font-weight: 750; letter-spacing: -0.02em; color: var(--foreground); }
.lv-tr-step-target::before { background: var(--lane); box-shadow: 0 0 0 4px var(--lane-soft); }
.lv-tr-step-target b, .lv-tr-step-target .lv-tr-step-l { color: var(--primary-strong, var(--primary)); }
.lv-tr-step[data-struck] b { color: var(--muted-foreground); }
.lv-tr-step[data-struck] s { text-decoration-thickness: 2px; }
.lv-tr-end { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); align-items: center; column-gap: 40px; row-gap: 18px; margin-top: 48px; }
.lv-tr-end.lv-tr-card { padding: 30px 32px; }
.lv-tr-end-tx { font-size: 22px; line-height: 1.35; font-weight: 650; letter-spacing: -0.015em; color: var(--foreground); text-wrap: balance; }
.lv-tr-end-tx b { color: var(--primary-strong, var(--primary)); }
.lv-tr-end-search { --u: 0.3836px; min-width: 0; }
.lv-tr-end-search .lv-search { margin-top: 0; max-width: 560px; }
.lv-tr-end-foot { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px solid var(--border); font-size: 14px; color: var(--muted-foreground); }
@media (prefers-reduced-motion: no-preference) {
.lv-tr-track .lv-tr-win { transition: transform 600ms var(--ease-out), opacity 420ms var(--ease-out); }
.lv-tr-track .lv-tr-stage:not([data-seen]) .lv-tr-win { opacity: 0; transform: translateY(60px) rotateY(10deg) rotateZ(-2deg); }
.lv-tr-track .lv-tr-tag { transition: scale 420ms var(--ease-spring) 260ms, opacity 240ms var(--ease-out) 260ms; }
.lv-tr-track .lv-tr-stage:not([data-seen]) .lv-tr-tag { opacity: 0; scale: 0.7; }
.lv-tr-track .lv-tr-row { transition: opacity 520ms var(--ease-out), transform 520ms var(--ease-out); }
.lv-tr-track .lv-tr-ghost { transition: opacity 260ms var(--ease-out) 260ms; }
.lv-tr-track :is(.lv-tr-hl, .lv-tr-ul) { transition: clip-path 360ms var(--ease-out) 160ms; }
.lv-tr-track .lv-tr-ul { transition-delay: 360ms; }
.lv-tr-track .lv-tr-num { transition: scale 460ms var(--ease-spring) 300ms, opacity 160ms var(--ease-out) 300ms; }
.lv-tr-track .lv-tr-bar::after { transition: transform 520ms var(--ease-out); }
.lv-tr-track .lv-tr-beat-t { transition: opacity 360ms var(--ease-out), translate 420ms var(--ease-out); }
.lv-tr-track .lv-tr-strike path { transition: stroke-dashoffset 420ms var(--ease-out); }
.lv-tr-track .lv-tr-strike path + path { transition-delay: 220ms; }
.lv-tr-track .lv-tr-vd { transition: opacity 200ms var(--ease-out) 260ms, scale 420ms var(--ease-spring) 260ms; }
.lv-tr-track .lv-tr-ad > .lv-tr-note { transition: clip-path 700ms var(--ease-out) 420ms; }
.lv-tr-prog-seg i { transition: background-color 320ms var(--ease-out); }
.lv-tr-prog-hint { transition: opacity 320ms var(--ease-out), translate 320ms var(--ease-out); }
.lv-tr-stage[data-live] .lv-tr-tag { animation: lv-tr-sway 5.6s var(--ease-in-out) infinite alternate; }
@supports (animation-timeline: view()) {
.lv-tr-track { view-timeline: --lv-tr-x block; }
.lv-tr-track .lv-tr-pose { animation: lv-tr-straighten linear both; animation-timeline: --lv-tr-x; animation-range: contain; }
.lv-tr-track .lv-tr-tag { animation: lv-tr-swing linear both; animation-timeline: --lv-tr-x; animation-range: contain; }
.lv-tr-stage[data-live] .lv-tr-tag { animation: lv-tr-swing linear both, lv-tr-sway 5.6s var(--ease-in-out) infinite alternate; animation-timeline: --lv-tr-x, auto; animation-range: contain, normal; }
}
.lv-tr-was { transition: opacity 520ms var(--ease-out), scale 520ms var(--ease-out); }
.lv-tr-deal-row:not([data-in]) .lv-tr-was { opacity: 0; scale: 0.94; }
.lv-tr-arg-list li { transition: opacity 420ms var(--ease-out), translate 520ms var(--ease-out); transition-delay: calc(400ms + var(--j, 0) * 70ms); }
.lv-tr-deal-row:not([data-in]) .lv-tr-arg-list li { opacity: 0; translate: -24px 0; }
.lv-tr-cut { transition: scale 420ms var(--ease-spring); transition-delay: calc(560ms + var(--j, 0) * 70ms); }
.lv-tr-deal-row:not([data-in]) .lv-tr-cut { scale: 0.4; }
.lv-tr-pstrike path { transition: stroke-dashoffset 520ms var(--ease-out) 500ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-pstrike path { stroke-dashoffset: 1; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-pstrike { opacity: 0; }
.lv-tr-pstrike { transition: opacity 1ms linear 500ms; }
.lv-tr-was .lv-tr-big-tx { transition: opacity 420ms var(--ease-out) 650ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-was .lv-tr-big-tx { opacity: 1; }
.lv-tr-now { transition: opacity 420ms var(--ease-out) 380ms, translate 600ms var(--ease-out) 380ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-now { opacity: 0; translate: 0 16px; }
.lv-tr-margin { transition: opacity 420ms var(--ease-out) 1450ms, translate 520ms var(--ease-out) 1450ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-margin { opacity: 0; translate: 0 8px; }
.lv-tr-msgline { transition: opacity 420ms var(--ease-out) 1900ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-msgline { opacity: 0; }
.lv-tr-gain > .lv-tr-note-deal { clip-path: inset(-14px -14px -14px -14px); transition: clip-path 700ms var(--ease-out) 1700ms; }
.lv-tr-deal-row:not([data-climax]) .lv-tr-gain > .lv-tr-note-deal { clip-path: inset(-14px 100% -14px -14px); }
.lv-tr-car { transition: transform 900ms var(--ease-in-out) 200ms; }
.lv-tr-lane-on { transition: clip-path 900ms var(--ease-in-out) 200ms; }
}
}
@media (min-width: 1024px) and (max-width: 1279px) {
.lv-tr-beat-t { font-size: 16px; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
.lv-tr-arg-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lv-tr-end { grid-template-columns: minmax(0, 1fr); }
.lv-tr-end-search .lv-search { max-width: 560px; }
}
@media (min-width: 1280px) {
.lv-tr-deal-row { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); grid-template-areas: "args price"; column-gap: 40px; }
.lv-tr-prices { grid-template-columns: minmax(0, 1fr); row-gap: 12px; }
.lv-tr-gain { margin-top: 2px; }
}
@media (min-width: 1440px) {
.lv-tr-grid { column-gap: 32px; }
}
@media (min-width: 1280px) and (max-height: 759px) {
.lv-tr-tip { display: none; }
}
@media (min-width: 1680px) {
.lv > #ce-que-revele .lv-wrap { max-width: var(--lv-dw-wide); }
}
@media (min-width: 1280px) {
.lv > #ce-que-revele { --tr-deal: 958px; --tr-flat: 820px; }
}
@media (min-width: 1366px) {
.lv > #ce-que-revele { --tr-deal: 977px; }
}
@media (min-width: 1440px) {
.lv > #ce-que-revele { --tr-deal: 993px; }
}
@media (min-width: 1680px) {
.lv > #ce-que-revele { --tr-deal: 1085px; --tr-flat: 939px; }
}
@media (min-width: 1180px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-tr-root)) > .lv-blk-head { padding-bottom: calc(56px + var(--tr-stage) + var(--tr-run) + 24px + var(--tr-deal)); }
}
@media (min-width: 1440px) and (min-height: 900px) {
.lv-tr-beat-t { font-size: 19.5px; }
.lv-tr-count-n { font-size: 76px; }
.lv-tr-rub { font-size: 12px; line-height: 15px; }
.lv-tr-lbl { font-size: 16.5px; line-height: 21px; }
.lv-tr-det { font-size: 13.5px; line-height: 18px; }
.lv-tr-amt { font-size: 20px; line-height: 24px; }
.lv-tr-row { grid-template-columns: 32px minmax(0, 1fr) auto; column-gap: 14px; padding: 10px 18px 10px 14px; }
.lv-tr-ic .lv-ci, .lv-tr-ghost .lv-ci { width: 32px; height: 32px; border-radius: 10px; }
.lv-tr-price { font-size: 38px; }
.lv-tr-title { font-size: 16px; }
.lv-tr-track .lv-tr-list { grid-template-rows: auto auto auto; align-content: center; gap: 14px; }
.lv-tr-track .lv-tr-rows { grid-template-rows: repeat(var(--rows, 6), minmax(auto, 88px)); gap: 8px; }
}
@keyframes lv-rb-pulse { 0% { transform: scale(1); opacity: 0.9; } 70%, 100% { transform: scale(2.3); opacity: 0; } }
@media (min-width: 1024px) {
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-rb-root)) { --lv-rb-res: 1157px; }
.lv-rb-root { --lv-rb-gap: 16px; --rb-pad: 20px; --rb-in: 10px; --rb-accent: var(--primary-strong, var(--primary)); --rb-paper: var(--card); --rb-board: color-mix(in oklab, var(--muted-foreground) 16%, var(--muted)); --rb-surface: color-mix(in oklab, var(--muted) 55%, var(--card)); padding-top: 96px; }
.dark .lv-rb-root { --rb-paper: color-mix(in oklab, var(--card) 90%, white); --rb-board: color-mix(in oklab, var(--muted-foreground) 30%, var(--card)); --rb-surface: color-mix(in oklab, var(--background) 45%, var(--card)); }
.lv-rb-head.lv-blk-head { margin-bottom: 32px; }
.lv-rb-tag { display: flex; align-items: center; width: fit-content; height: 26px; margin-bottom: 12px; padding: 0 10px; border-radius: 999px; background: var(--ds-tint, var(--info-tint)); color: var(--rb-accent); font-size: 12px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; }
.lv-rb-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: minmax(280px, auto) minmax(300px, auto); grid-auto-rows: minmax(280px, auto); gap: var(--lv-rb-gap); }
.lv-rb-tile.lv-rb-tile { position: relative; overflow: hidden; min-width: 0; gap: var(--rb-in); padding: var(--rb-pad); border: 0; border-radius: 24px; background: var(--card); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-card); -webkit-backdrop-filter: none; backdrop-filter: none; }
.lv-rb-top { position: relative; min-width: 0; padding-bottom: 12px; }
.lv-rb-top::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; border-radius: 2px; background: repeating-linear-gradient(90deg, var(--lane-soft) 0 16px, transparent 16px 28px); transform-origin: left center; }
.lv-rb-top h4 { font-size: 16px; font-weight: 650; line-height: 1.25; letter-spacing: -0.01em; }
.lv-rb-big { font-size: 34px; font-weight: 750; line-height: 1; letter-spacing: -0.03em; color: var(--foreground); }
.lv-rb-big small { font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--muted-foreground); }
.lv-rb-sub { font-size: 13.5px; line-height: 1.45; color: var(--muted-foreground); }
.lv-rb-link.lv-rb-link { align-self: flex-start; margin: auto 0 -6px -10px; }
.lv-rb-meter { display: grid; gap: 12px; }
.lv-rb-count { display: inline-grid; white-space: nowrap; }
.lv-rb-count > * { grid-area: 1 / 1; justify-self: end; }
.lv-rb-ghost { visibility: hidden; }
.lv-rb-a-head { position: relative; z-index: 1; display: grid; justify-items: start; gap: 8px; max-width: min(62%, 390px); }
.lv-rb-a-head .lv-rb-top { justify-self: stretch; }
.lv-rb-a-head .lv-rb-sub { max-width: 34ch; }
.lv-rb-hero { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin-top: 8px; font-size: 60px; font-weight: 750; line-height: 1; letter-spacing: -0.045em; color: var(--foreground); }
.lv-rb-hero small { font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--muted-foreground); }
.lv-rb-a .lv-rb-link.lv-rb-link { position: absolute; z-index: 1; right: 14px; bottom: 30px; margin: 0; }
.lv-rb-curve { position: absolute; inset: 0; pointer-events: none; }
.lv-rb-curve svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.lv-rb-curve-line { fill: none; stroke: var(--primary); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.lv-rb-curve-s0 { stop-color: var(--primary); stop-opacity: 0.2; }
.lv-rb-curve-s1 { stop-color: var(--primary); stop-opacity: 0.03; }
.lv-rb-base { position: absolute; right: 0; height: 2px; margin-top: -1px; border-radius: 1px; background: repeating-linear-gradient(90deg, var(--muted-foreground) 0 8px, transparent 8px 15px); opacity: 0.55; transform-origin: left center; }
.lv-rb-road { position: absolute; left: 0; right: 0; bottom: 18px; height: 4px; background: repeating-linear-gradient(90deg, var(--lane) 0 22px, transparent 22px 40px); opacity: 0.5; transform-origin: left center; }
.lv-rb-pts { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }
.lv-rb-pt { position: absolute; width: 0; height: 0; }
.lv-rb-dot { position: absolute; left: -7px; top: -7px; width: 14px; height: 14px; border-radius: 99px; background: var(--card); box-shadow: 0 0 0 3.5px var(--primary), 0 4px 10px -2px rgb(15 23 42 / 0.35); }
.lv-rb-pt-start .lv-rb-dot { left: -6px; top: -6px; width: 12px; height: 12px; box-shadow: 0 0 0 3px var(--muted-foreground); }
.lv-rb-pt-end .lv-rb-dot::after { content: ""; position: absolute; inset: -5px; border-radius: inherit; border: 2px solid var(--primary); opacity: 0; }
.lv-rb-pt-lbl { position: absolute; right: 12px; bottom: 8px; display: grid; justify-items: end; gap: 1px; white-space: nowrap; }
.lv-rb-pt-lbl span { font-size: 12px; font-weight: 600; color: var(--muted-foreground); }
.lv-rb-pt-lbl b { font-size: 16px; font-weight: 700; letter-spacing: -0.01em; color: var(--foreground); }
.lv-rb-pt-start .lv-rb-pt-lbl { top: 12px; right: auto; bottom: auto; left: -6px; justify-items: start; }
.lv-rb-paper { --rb-hole: 18px; --rb-drop: 120px; --rb-tilt: -5deg; position: absolute; top: var(--rb-drop); right: calc(-1 * var(--rb-hole)); display: grid; justify-items: start; gap: 3px; padding: 20px 16px 11px; border-radius: 8px 8px 14px 14px; rotate: var(--rb-tilt); transform-origin: calc(100% - var(--rb-hole)) calc(-1 * var(--rb-drop)); white-space: nowrap; background: var(--rb-paper); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report); }
.lv-rb-paper::before { content: ""; position: absolute; top: 7px; right: var(--rb-hole); width: 8px; height: 8px; margin-right: -4px; border-radius: 50%; background: var(--muted); box-shadow: inset 0 0 0 1.5px var(--border); }
.lv-rb-paper::after { content: ""; position: absolute; bottom: calc(100% - 11px); right: var(--rb-hole); width: 1.5px; height: calc(var(--rb-drop) + 4px); margin-right: -0.75px; border-radius: 1px; background: var(--muted-foreground); opacity: 0.6; }
.lv-rb-paper-k { font-size: 11.5px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-foreground); }
.lv-rb-paper-v { font-size: 18px; font-weight: 750; line-height: 1.1; letter-spacing: -0.02em; color: var(--rb-accent); }
.lv-rb-b { --c-maintenance: repeating-linear-gradient(-45deg, color-mix(in oklab, var(--primary) 75%, transparent) 0 3px, color-mix(in oklab, var(--primary) 25%, transparent) 3px 6px); --c-repairs: var(--primary); }
.lv-rb-b .lv-rb-meter { margin-top: 6px; }
.lv-rb-split { display: flex; gap: 4px; height: 14px; }
.lv-rb-split i { flex: var(--s, 1) 1 0%; min-width: 10px; border-radius: 99px; background: var(--c-maintenance); transform-origin: left center; }
.lv-rb-split i[data-kind="repairs"], .lv-rb-fees li[data-kind="repairs"] i { background: var(--c-repairs); }
.lv-rb-fees { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lv-rb-fees li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: 13.5px; line-height: 1.3; color: var(--muted-foreground); }
.lv-rb-fees li i { width: 10px; height: 10px; border-radius: 3px; background: var(--c-maintenance); }
.lv-rb-fees b { font-weight: 700; white-space: nowrap; color: var(--foreground); }
.lv-rb-c.lv-rb-tile { overflow: visible; }
.lv-rb-cert { position: relative; z-index: 1; display: flex; margin: 4px calc(-1 * var(--rb-pad) - 26px) 2px -2px; overflow: hidden; border-radius: 12px; rotate: -3deg; background: var(--rb-paper); box-shadow: 0 0 0 1px color-mix(in oklab, var(--primary) 16%, var(--border)), var(--lv-shadow-report); }
.lv-rb-cert-eu { flex: none; display: grid; align-items: end; justify-items: center; width: 24px; padding-bottom: 10px; background: var(--rb-accent); color: #fff; font-size: 13px; font-weight: 800; }
.dark .lv-rb-cert-eu { color: var(--background); }
.lv-rb-cert-paper { flex: 1 1 auto; min-width: 0; padding: 10px 16px 8px 12px; background: repeating-linear-gradient(-45deg, color-mix(in oklab, var(--primary) 6%, transparent) 0 1px, transparent 1px 7px); }
.lv-rb-cert-title { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; line-height: 1.3; text-transform: uppercase; color: var(--muted-foreground); }
.lv-rb-cert-rows { display: grid; margin: 6px 0 0; }
.lv-rb-cert-rows > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; min-width: 0; padding: 3px 0; border-top: 1px solid var(--border); }
.lv-rb-cert-rows dt { min-width: 0; font-size: 11.5px; font-weight: 550; line-height: 1.3; color: var(--muted-foreground); }
.lv-rb-cert-rows dd { margin: 0; font-size: 13.5px; font-weight: 700; line-height: 1.3; white-space: nowrap; color: var(--foreground); }
.lv-rb-code { display: inline-block; margin-right: 5px; font-weight: 750; color: var(--foreground); }
.lv-rb-cert-rows > .lv-rb-cert-total { align-items: center; padding: 5px 0 2px; }
.lv-rb-root .lv-stamp { animation: none; padding: 1px 9px; border: 2px solid currentColor; border-radius: 10px; rotate: -7deg; background: var(--rb-paper); color: var(--rb-accent); font-size: 20px; font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; }
.lv-rb-gauge { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-top: 4px; font-size: 12px; font-weight: 600; white-space: nowrap; color: var(--muted-foreground); }
.lv-rb-range { position: relative; height: 12px; margin: 0 9px; }
.lv-rb-range::before { content: ""; position: absolute; inset: 4px 0; border-radius: 2px; background: repeating-linear-gradient(90deg, var(--lane-soft) 0 10px, transparent 10px 17px); }
.lv-rb-range-fill { position: absolute; inset: 3px 0; border-radius: 99px; background: color-mix(in oklab, var(--primary) 32%, transparent); transform-origin: left center; transform: scaleX(var(--p, 0.5)); }
.lv-rb-knob { position: absolute; inset: 0; transform: translateX(calc(var(--p, 0.5) * 100%)); }
.lv-rb-knob i { position: absolute; top: 50%; left: 0; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--card); box-shadow: 0 0 0 4px var(--primary), 0 3px 8px -2px rgb(15 23 42 / 0.3); }
.lv-rb-covers { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.lv-rb-covers li { display: grid; place-items: center; min-height: 30px; padding: 4px 8px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--border); font-size: 12.5px; font-weight: 600; line-height: 1.2; text-align: center; color: var(--muted-foreground); }
.lv-rb-covers li[aria-current] { background: var(--ds-tint, color-mix(in oklab, var(--primary) 10%, transparent)); box-shadow: inset 0 0 0 1.5px var(--primary); color: var(--rb-accent); }
.lv-rb-board { position: relative; margin-top: 2px; padding: 5px; border-radius: 14px; rotate: 1.5deg; background: var(--rb-board); box-shadow: var(--lv-shadow-card); }
.lv-rb-clip { position: absolute; z-index: 1; top: -6px; left: 50%; width: 64px; height: 18px; margin-left: -32px; border-radius: 6px 6px 4px 4px; background: color-mix(in oklab, var(--foreground) 62%, var(--card)); box-shadow: 0 2px 4px -1px rgb(15 23 42 / 0.35); }
.lv-rb-clip::before { content: ""; position: absolute; top: 5px; left: 50%; width: 22px; height: 5px; margin-left: -11px; border-radius: 3px; background: var(--rb-board); }
.lv-rb-sheet { padding: 14px 11px 2px; border-radius: 8px; background: var(--rb-paper); box-shadow: 0 1px 2px rgb(15 23 42 / 0.12); }
.lv-rb-sheet-head { display: flex; align-items: flex-end; gap: 10px; }
.lv-rb-sheet .lv-rb-big { flex: none; font-size: 26px; }
.lv-rb-sheet .lv-rb-big small { font-size: 13px; }
.lv-rb-sheet .lv-rb-sub { min-width: 0; font-size: 12px; line-height: 1.3; }
.lv-rb-checks { list-style: none; margin: 6px 0 0; padding: 0; display: grid; }
.lv-rb-checks li { display: flex; align-items: flex-start; gap: 8px; min-width: 0; padding: 3px 0; border-top: 1px dashed var(--border); font-size: 12px; line-height: 16px; }
.lv-rb-hbox { flex: none; display: block; width: 16px; height: 16px; overflow: visible; }
.lv-rb-hbox-f { fill: none; stroke: var(--muted-foreground); stroke-width: 1.4; stroke-linejoin: round; }
.lv-rb-hbox-c { fill: none; stroke: var(--rb-accent); stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.lv-rb-f.lv-rb-tile { background: var(--rb-surface); }
.lv-rb-calls { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 10px; }
.lv-rb-calls li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 6px 18px -10px rgb(15 23 42 / 0.25); }
.lv-rb-calls li:nth-child(1) { rotate: -0.6deg; margin-right: 18px; }
.lv-rb-calls li:nth-child(2) { rotate: 0.5deg; margin-left: 18px; }
.lv-rb-n { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 99px; background: var(--muted); color: color-mix(in oklab, var(--foreground) 70%, transparent); font-size: 12.5px; font-weight: 700; }
.lv-rb-q { min-width: 0; }
.lv-rb-q b { display: block; font-size: 14px; font-weight: 650; line-height: 1.4; color: var(--foreground); }
.lv-rb-q small { display: flex; align-items: flex-start; gap: 6px; margin-top: 5px; font-size: 12.5px; line-height: 1.45; color: var(--muted-foreground); }
.lv-rb-q small svg { flex: none; width: 13px; height: 13px; margin-top: 2px; color: var(--warning); }
.lv-rb-ask { margin-top: 4px; padding: 2px 8px; border: 1px dashed var(--border); border-radius: 6px; font-size: 11px; font-weight: 500; line-height: 1.4; white-space: nowrap; color: var(--muted-foreground); }
.lv-rb-g-head { display: flex; align-items: flex-start; gap: 16px; }
.lv-rb-g-head .lv-rb-top { flex: 1 1 auto; }
.lv-rb-cta.lv-rb-cta { flex: none; margin-top: -6px; }
.lv-rb-toc { list-style: none; margin: 2px 0 0; padding: 0; columns: 2; column-gap: 24px; }
.lv-rb-toc li { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding-bottom: 6px; break-inside: avoid; font-size: 13px; font-weight: 550; line-height: 17px; }
.lv-rb-toc small { font-size: 11.5px; font-weight: 500; white-space: nowrap; color: var(--muted-foreground); }
.lv-rb-ic { display: grid; place-items: center; flex: none; width: 24px; height: 24px; margin-top: -3px; border-radius: 8px; background: var(--ds-tint, color-mix(in oklab, var(--primary) 10%, transparent)); color: var(--rb-accent); }
.lv-rb-ic svg { width: 15px; height: 15px; }
}
@media (min-width: 1280px) {
.lv-rb-a { grid-column: 1 / 7; grid-row: 1 / 3; }
.lv-rb-b { grid-column: 7 / 10; grid-row: 1; }
.lv-rb-c { grid-column: 10 / 13; grid-row: 1; }
.lv-rb-d { grid-column: 7 / 10; grid-row: 2; }
.lv-rb-e { grid-column: 10 / 13; grid-row: 2; }
.lv-rb-f { grid-column: 1 / 7; grid-row: 3; }
.lv-rb-g { grid-column: 7 / 13; grid-row: 3; }
.lv-rb-grid:not(:has(.lv-rb-a)) :is(.lv-rb-b, .lv-rb-d) { grid-column: 1 / 7; }
.lv-rb-grid:not(:has(.lv-rb-a)) :is(.lv-rb-c, .lv-rb-e) { grid-column: 7 / 13; }
.lv-rb-grid:not(:has(.lv-rb-b)) .lv-rb-c, .lv-rb-grid:not(:has(.lv-rb-c)) .lv-rb-b, .lv-rb-grid:not(:has(.lv-rb-d)) .lv-rb-e { grid-column: 7 / 13; }
.lv-rb-grid:not(:has(.lv-rb-b)):not(:has(.lv-rb-c)) .lv-rb-d { grid-column: 7 / 13; grid-row: 1; }
.lv-rb-grid:not(:has(.lv-rb-b)):not(:has(.lv-rb-c)) .lv-rb-e { grid-column: 7 / 13; grid-row: 2; }
.lv-rb-grid:not(:has(.lv-rb-a)):not(:has(.lv-rb-c)) .lv-rb-b, .lv-rb-grid:not(:has(.lv-rb-a)):not(:has(.lv-rb-d)) .lv-rb-e { grid-column: 1 / 13; }
.lv-rb-grid:not(:has(.lv-rb-f)) .lv-rb-g { grid-column: 1 / 13; }
.lv-rb-grid:not(:has(.lv-rb-f)) .lv-rb-toc { columns: 4; }
}
@media (min-width: 1440px) {
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-rb-root)) { --lv-rb-res: 1204px; }
.lv-rb-root { --lv-rb-gap: 20px; --rb-pad: 28px; --rb-in: 12px; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
.lv > #ce-que-revele .lv-wrap:not(:has(.lv-rb-root)) { --lv-rb-res: 1550px; }
.lv-rb-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: minmax(260px, auto); }
.lv-rb-tile.lv-rb-tile { grid-column: span 3; }
.lv-rb-a.lv-rb-tile { grid-column: 1 / -1; min-height: 360px; }
.lv-rb-grid:not(:has(.lv-rb-c)) .lv-rb-b.lv-rb-tile, .lv-rb-grid:not(:has(.lv-rb-b)) .lv-rb-c.lv-rb-tile, .lv-rb-grid:not(:has(.lv-rb-d)) .lv-rb-e.lv-rb-tile, .lv-rb-grid:not(:has(.lv-rb-f)) .lv-rb-g.lv-rb-tile { grid-column: 1 / -1; }
.lv-rb-grid:not(:has(.lv-rb-f)) .lv-rb-toc { columns: 3; }
.lv-rb-a-head { max-width: 42%; }
.lv-rb-cert { width: min(420px, calc(100% + var(--rb-pad) + 28px)); margin-left: auto; }
.lv-rb-paper { --rb-drop: 96px; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-io .lv-rb-root .lv-reveal { opacity: 0; transform: translateY(16px); transition: opacity 420ms var(--ease-out), transform 420ms var(--ease-out); transition-delay: calc(var(--d, 0) * 70ms); }
.lv-io .lv-rb-root .lv-reveal.lv-in { opacity: 1; transform: none; }
.lv-io .lv-rb-tile .lv-rb-top::after { transform: scaleX(0); transition: transform 700ms var(--ease-out); transition-delay: calc(200ms + var(--d, 0) * 70ms); }
.lv-io .lv-rb-tile.lv-in .lv-rb-top::after { transform: none; }
.lv-io .lv-rb-a .lv-rb-base { transform: scaleX(0); transition: transform 900ms var(--ease-out) 150ms; }
.lv-io .lv-rb-a.lv-in .lv-rb-base { transform: none; }
.lv-io .lv-rb-a .lv-rb-curve svg { clip-path: inset(-8px 100% -8px -8px); transition: clip-path 1500ms var(--ease-in-out) 350ms; }
.lv-io .lv-rb-a.lv-in .lv-rb-curve svg { clip-path: inset(-8px); }
.lv-io .lv-rb-a .lv-rb-road { transform: scaleX(0); transition: transform 1100ms var(--ease-out) 150ms; }
.lv-io .lv-rb-a.lv-in .lv-rb-road { transform: none; }
.lv-io .lv-rb-a .lv-rb-pt:not(.lv-rb-pt-start) .lv-rb-dot { opacity: 0; scale: 0.3; transition: opacity 260ms var(--ease-out), scale 420ms var(--ease-spring); transition-delay: calc(350ms + var(--t, 0) * 1500ms); }
.lv-io .lv-rb-a .lv-rb-pt:not(.lv-rb-pt-start) .lv-rb-pt-lbl { opacity: 0; transform: translateY(6px); transition: opacity 360ms var(--ease-out), transform 360ms var(--ease-out); transition-delay: calc(430ms + var(--t, 0) * 1500ms); }
.lv-io .lv-rb-a.lv-in .lv-rb-pt .lv-rb-dot { opacity: 1; scale: 1; }
.lv-io .lv-rb-a.lv-in .lv-rb-pt .lv-rb-pt-lbl { opacity: 1; transform: none; }
.lv-io .lv-rb-a .lv-rb-paper { opacity: 0; rotate: calc(var(--rb-tilt) - 22deg); transition: opacity 240ms var(--ease-out) 1750ms, rotate 1100ms var(--ease-spring) 1750ms; }
.lv-io .lv-rb-a.lv-in .lv-rb-paper { opacity: 1; rotate: var(--rb-tilt); }
.lv-rb-root[data-live] .lv-rb-a.lv-in .lv-rb-pt-end .lv-rb-dot::after { animation: lv-rb-pulse 2.6s var(--ease-out) 2.6s infinite; }
.lv-io .lv-rb-b .lv-rb-split i { transform: scaleX(0); transition: transform 900ms var(--ease-out); transition-delay: calc(300ms + var(--j, 0) * 160ms); }
.lv-io .lv-rb-b.lv-in .lv-rb-split i { transform: none; }
.lv-io .lv-rb-b .lv-rb-fees li { opacity: 0; transform: translateX(-8px); transition: opacity 420ms var(--ease-out), transform 420ms var(--ease-out); transition-delay: calc(600ms + var(--j, 0) * 90ms); }
.lv-io .lv-rb-b.lv-in .lv-rb-fees li { opacity: 1; transform: none; }
.lv-io .lv-rb-c .lv-rb-cert { translate: 22px 0; rotate: -6deg; transition: translate 800ms var(--ease-out) 250ms, rotate 900ms var(--ease-spring) 250ms; }
.lv-io .lv-rb-c.lv-in .lv-rb-cert { translate: none; rotate: -3deg; }
.lv-io .lv-rb-c .lv-stamp { opacity: 0; scale: 1.15; transition: opacity 200ms var(--ease-out) 800ms, scale 560ms var(--ease-spring) 800ms; }
.lv-io .lv-rb-c.lv-in .lv-stamp { opacity: 1; scale: 1; }
.lv-io .lv-rb-d .lv-rb-knob { transform: translateX(0); transition: transform 900ms var(--ease-out) 350ms; }
.lv-io .lv-rb-d.lv-in .lv-rb-knob { transform: translateX(calc(var(--p, 0.5) * 100%)); }
.lv-io .lv-rb-d .lv-rb-range-fill { transform: scaleX(0); transition: transform 900ms var(--ease-out) 350ms; }
.lv-io .lv-rb-d.lv-in .lv-rb-range-fill { transform: scaleX(var(--p, 0.5)); }
.lv-io .lv-rb-e .lv-rb-board { rotate: -2deg; transition: rotate 700ms var(--ease-spring) 200ms; }
.lv-io .lv-rb-e.lv-in .lv-rb-board { rotate: 1.5deg; }
.lv-io .lv-rb-e .lv-rb-hbox-c { stroke-dashoffset: 1; transition: stroke-dashoffset 380ms var(--ease-out); transition-delay: calc(560ms + var(--j, 0) * 120ms); }
.lv-io .lv-rb-e.lv-in .lv-rb-hbox-c { stroke-dashoffset: 0; }
.lv-io .lv-rb-f .lv-rb-calls li { opacity: 0; transform: translateY(10px); transition: opacity 420ms var(--ease-out), transform 520ms var(--ease-spring); transition-delay: calc(300ms + var(--j, 0) * 140ms); }
.lv-io .lv-rb-f.lv-in .lv-rb-calls li { opacity: 1; transform: none; }
.lv-io .lv-rb-g .lv-rb-ic .lv-pi-l { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 420ms var(--ease-out); transition-delay: calc(350ms + var(--k, 0) * 60ms); }
.lv-io .lv-rb-g.lv-in .lv-rb-ic .lv-pi-l { stroke-dashoffset: 0; }
}
@keyframes lv-pf-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes lv-pf-row { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes lv-pf-mark { from { opacity: 0.35; } to { opacity: 1; } }
@keyframes lv-pf-pop { from { transform: scale(0.4); } to { transform: none; } }
@keyframes lv-pf-tick { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes lv-pf-wire { from { transform: scaleX(0); } to { transform: none; } }
@keyframes lv-pf-score { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: none; } }
@media (min-width: 1024px) {
.lv > #comparatif { contain-intrinsic-size: auto 1215px; }
.lv > #comparatif .lv-blk-head { max-width: 960px; }
.lv > #comparatif .lv-vs {
--pf-gap: 48px;
--pf-pad: 24px;
max-width: none;
margin: 40px 0 0;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows: auto auto repeat(7, auto) auto;
column-gap: var(--pf-gap);
row-gap: 0;
}
.lv > #comparatif .lv-vs-card { grid-row: 1 / -1; display: grid; grid-template-rows: subgrid; row-gap: 0; padding: 24px var(--pf-pad) 22px; border-radius: 24px; }
.lv > #comparatif .lv-vs-head { margin: 0; padding-bottom: 18px; }
.lv > #comparatif .lv-vs-preview { margin: 0 0 10px; height: auto; }
.lv > #comparatif .lv-vs-list { grid-row: 3 / span 7; display: grid; grid-template-rows: subgrid; row-gap: 0; margin: 0; }
.lv > #comparatif .lv-vs-list li { min-height: 52px; padding: 10px 0; }
.lv > #comparatif .lv-vs-score { align-items: center; margin: 0; padding-top: 14px; }
.lv > #comparatif .lv-vs-score b { font-size: 44px; font-weight: 750; line-height: 1; letter-spacing: -0.03em; }
.lv > #comparatif .lv-vs-gpt { margin-block: 14px; background: color-mix(in oklab, var(--muted) 70%, var(--card)); box-shadow: none; }
.lv > #comparatif .lv-vs-gpt .lv-vs-preview { display: flex; flex-direction: column; justify-content: center; padding: 18px; background: var(--card); }
.lv > #comparatif .lv-vs-gpt .lv-vs-preview::after { content: none; }
.lv > #comparatif .lv-vs-lmc { padding-block: 37px 35px; border: 2px solid var(--primary); box-shadow: var(--lv-shadow-report); }
.lv > #comparatif .lv-vs-lmc .lv-vs-score b { color: var(--primary-strong, var(--primary)); }
.lv > #comparatif .lv-vs-preview-lmc { overflow: visible; padding-block: 18px; }
.lv > #comparatif .lv-vs-preview-lmc::after { content: none; }
.lv > #comparatif .lv-vs-report { margin: 0 -26px; rotate: -1.5deg; translate: 0 -4px; box-shadow: var(--lv-shadow-report); }
.lv > #comparatif .lv-vs-lmc .lv-vs-list li { position: relative; }
.lv > #comparatif .lv-vs-lmc .lv-vs-list li::before {
content: "";
position: absolute;
right: calc(100% + 10px);
top: calc(50% - 1px);
width: calc(var(--pf-gap) + 2 * var(--pf-pad) + 3px - 20px);
height: 2px;
background: repeating-linear-gradient(90deg, var(--lane) 0 6px, transparent 6px 12px);
opacity: 0.6;
transform-origin: right center;
pointer-events: none;
}
.lv > #sources { contain-intrinsic-size: auto 855px; }
.lv > #sources .lv-wrap {
display: grid;
grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
grid-template-areas: "head fiche" "kpi fiche" "cards fiche" "note note";
grid-template-rows: auto auto 1fr auto;
column-gap: 64px;
align-items: start;
}
.lv > #sources .lv-wrap:not(:has(.lv-pf-fiche))::after { content: ""; grid-area: fiche; min-height: 520px; }
.lv > #sources .lv-blk-head { grid-area: head; display: block; max-width: none; margin-bottom: 28px; }
.lv > #sources .lv-blk-head > .lv-h2 { max-width: 14ch; }
.lv > #sources .lv-blk-head > .lv-lead { margin-top: 20px; padding-bottom: 0; max-width: 40ch; font-size: 17px; }
.lv > #sources .lv-src-kpi { grid-area: kpi; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 20px; margin: 0 0 40px; font-size: 14px; line-height: 1.35; }
.lv > #sources .lv-src-kpi > span[aria-hidden] { display: none; }
.lv > #sources .lv-src-kpi > span { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lv > #sources .lv-src-kpi b { margin: 0; font-size: 40px; line-height: 1; font-variant-numeric: tabular-nums; }
.lv > #sources .lv-center-note { grid-area: note; margin-top: 40px; }
.lv > #sources .lv-src { display: none; }
.lv > #sources .lv-src-fam { grid-area: cards; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
.lv > #sources .lv-src-fam-card.lv-src-fam-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto 1fr auto; column-gap: 16px; row-gap: 2px; align-items: start; padding: 20px 22px 6px; border-radius: 20px; }
.lv > #sources .lv-src-fam-card .lv-src-ic { grid-row: 1 / span 2; align-self: start; width: 40px; height: 40px; border-radius: 12px; }
.lv > #sources .lv-src-fam-card .lv-src-ic svg { width: 20px; height: 20px; }
.lv > #sources .lv-src-fam-card h3 { font-size: 17px; font-weight: 650; line-height: 1.3; letter-spacing: -0.01em; color: var(--foreground); }
.lv > #sources .lv-src-fam-text { min-height: 2lh; font-size: 14.5px; line-height: 1.45; color: var(--muted-foreground); }
.lv > #sources .lv-src-fam-more { grid-column: 1 / -1; align-self: end; margin-top: 14px; border-top: 1px solid var(--border); }
.lv > #sources .lv-src-fam-more summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; list-style: none; cursor: pointer; font-size: 14px; font-weight: 650; color: var(--primary-strong, var(--primary)); }
.lv > #sources .lv-src-fam-more summary::-webkit-details-marker { display: none; }
.lv > #sources .lv-src-fam-more summary:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; border-radius: 6px; }
.lv > #sources .lv-src-fam-more summary svg { width: 16px; height: 16px; flex: none; transition: rotate 200ms var(--ease-out); }
.lv > #sources .lv-src-fam-more[open] summary svg { rotate: 180deg; }
.lv > #sources .lv-src-fam-more ul { display: grid; gap: 0; margin: 0 0 12px; padding: 0; list-style: none; }
.lv > #sources .lv-src-fam-more li { display: grid; gap: 3px; padding: 12px 0; border-top: 1px solid var(--border); }
.lv > #sources .lv-src-fam-more li b { font-size: 14.5px; font-weight: 650; color: var(--foreground); }
.lv > #sources .lv-src-fam-more li span { font-size: 13.5px; line-height: 1.5; color: var(--muted-foreground); }
.lv > #sources .lv-src-fam-more li small { font-size: 12.5px; font-weight: 600; color: var(--primary-strong, var(--primary)); }
.lv > #sources .lv-pf-fiche { grid-area: fiche; align-self: stretch; min-width: 0; }
.lv > #sources .lv-pf-sheet {
position: sticky;
top: calc(var(--lv-top) + 24px);
padding: 20px 24px 16px;
}
.lv > #sources .lv-pf-sheet::before,
.lv > #sources .lv-pf-sheet::after { content: ""; position: absolute; inset: 0; border-radius: 24px; pointer-events: none; }
.lv > #sources .lv-pf-sheet::before { z-index: -1; background: var(--card); box-shadow: var(--lv-shadow-report); }
.lv > #sources .lv-pf-sheet::after {
z-index: -2;
background: color-mix(in oklab, var(--primary) 7%, var(--card));
box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--primary) 16%, transparent), var(--lv-shadow-card);
rotate: -3deg;
translate: -6px 6px;
}
.lv > #sources .lv-pf-head { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; row-gap: 4px; align-items: center; }
.lv > #sources .lv-pf-logo { grid-row: 1 / span 2; width: 28px; height: 28px; border-radius: 8px; background: url(/logos/lookmycar-app-icon.png) center / 28px 28px no-repeat; }
.theme-moto .lv > #sources .lv-pf-logo { background: #fff url(/logos/logo-lookmybike-typo.png) 4px 50% / auto 20px no-repeat; box-shadow: inset 0 0 0 1px var(--border); }
.lv > #sources .lv-pf-head h3 { font-size: 18px; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; color: var(--foreground); }
.lv > #sources .lv-pf-tag { justify-self: start; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-foreground); }
.lv > #sources .lv-pf-rows { list-style: none; margin: 12px 0 0; padding: 0; }
.lv > #sources .lv-pf-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; row-gap: 3px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--border); }
.lv > #sources .lv-pf-row:first-child { border-top: 0; }
.lv > #sources .lv-pf-k { font-size: 13.5px; line-height: 1.35; color: var(--muted-foreground); }
.lv > #sources .lv-pf-v { font-size: 15px; line-height: 1.35; text-align: right; font-variant-numeric: tabular-nums; color: var(--foreground); }
.lv > #sources .lv-pf-v b { font-weight: 700; }
.lv > #sources .lv-pf-v small { font-size: 12.5px; font-weight: 500; color: var(--muted-foreground); }
.lv > #sources .lv-pf-src { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 600; line-height: 18px; color: var(--primary-strong, var(--primary)); }
.lv > #sources .lv-pf-ic { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 7px; background: var(--ds-tint, color-mix(in oklab, var(--primary) 10%, transparent)); }
.lv > #sources .lv-pf-ic svg { width: 14px; height: 14px; }
.lv > #sources .lv-pf-more { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; margin-top: 8px; font-size: 14px; font-weight: 650; }
.lv > #sources .lv-pf-more svg { width: 15px; height: 15px; flex: none; }
.lv > #avis .lv-reviews { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.lv > #avis .lv-rev.lv-rev { grid-column: span 4; grid-row: span 4; grid-template-rows: subgrid; gap: 12px; padding: 24px; }
.lv > #avis .lv-reviews:has(> :nth-child(2):last-child) .lv-rev { grid-column: span 6; }
.lv > #avis .lv-rev > p:not([class]) { align-self: start; font-size: 20px; line-height: 1.45; letter-spacing: -0.01em; color: var(--foreground); }
.lv > #avis .lv-rev-save { justify-self: start; align-self: end; padding: 6px 12px; border-radius: 12px; background: var(--success-tint); color: var(--success-strong); line-height: 1.4; }
.lv > #avis .lv-reviews:has(> :only-child) .lv-rev.lv-rev { grid-column: 1 / -1; grid-row: auto; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: auto auto 1fr; column-gap: 48px; align-content: center; padding: 32px 36px; }
.lv > #avis .lv-reviews:has(> :only-child) .lv-rev > p:not([class]) { grid-column: 1; grid-row: 1 / span 3; align-self: center; font-size: 22px; }
.lv > #avis .lv-reviews:has(> :only-child) .lv-rev > :is(.lv-who, .lv-stars, .lv-rev-save) { grid-column: 2; }
.lv > #avis .lv-reviews:has(> :only-child) .lv-rev-save { align-self: start; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
.lv > #sources { contain-intrinsic-size: auto 872px; }
}
@media (min-width: 1024px) and (max-width: 1151px) {
.lv > #sources { contain-intrinsic-size: auto 903px; }
.lv > #comparatif { contain-intrinsic-size: auto 1245px; }
}
@media (min-width: 1280px) {
.lv > #comparatif .lv-vs { --pf-gap: 72px; }
.lv > #comparatif .lv-vs-chat { gap: 14px; font-size: 14px; }
}
@media (min-width: 1440px) {
.lv > #comparatif .lv-vs-chat { gap: 16px; font-size: 14.5px; }
.lv > #comparatif .lv-vs-ask { padding: 10px 15px; }
}
@media (min-width: 1680px) {
.lv > #sources .lv-wrap { max-width: var(--lv-dw-wide); }
.lv > #sources { contain-intrinsic-size: auto 864px; }
}
@media (min-width: 1024px) and (max-width: 1279px) and (max-height: 815px) {
.lv > #sources .lv-pf-sheet { top: calc(var(--lv-top) + 12px); padding: 14px 20px 10px; }
.lv > #sources .lv-pf-rows { margin-top: 8px; }
.lv > #sources .lv-pf-row { padding: clamp(2px, (100vh - var(--lv-top) - 562px) / 14, 10px) 0; row-gap: 1px; }
.lv > #sources .lv-pf-src { line-height: 16px; }
.lv > #sources .lv-pf-ic { width: 18px; height: 18px; border-radius: 6px; }
.lv > #sources .lv-pf-ic svg { width: 12px; height: 12px; }
.lv > #sources .lv-pf-more { min-height: 28px; margin-top: 4px; }
}
@media (min-width: 1280px) and (max-height: 783px) {
.lv > #sources .lv-pf-sheet { top: calc(var(--lv-top) + 12px); padding: 14px 20px 10px; }
.lv > #sources .lv-pf-rows { margin-top: 8px; }
.lv > #sources .lv-pf-row { padding: clamp(2px, (100vh - var(--lv-top) - 530px) / 14, 10px) 0; row-gap: 1px; }
.lv > #sources .lv-pf-src { line-height: 16px; }
.lv > #sources .lv-pf-ic { width: 18px; height: 18px; border-radius: 6px; }
.lv > #sources .lv-pf-ic svg { width: 12px; height: 12px; }
.lv > #sources .lv-pf-more { min-height: 28px; margin-top: 4px; }
}
@media (min-width: 1024px) and (min-height: 861px) {
.lv > #sources .lv-pf-sheet { padding: 28px 28px 22px; }
.lv > #sources .lv-pf-rows { margin-top: 16px; }
.lv > #sources .lv-pf-row { padding: 10px 0; }
.lv > #sources .lv-pf-more { margin-top: 14px; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv > #sources .lv-pf-sheet { transition: opacity 520ms var(--ease-out), translate 600ms var(--ease-out), rotate 600ms var(--ease-out); }
.lv > #sources .lv-pf-sheet:not([data-in]) { opacity: 0; translate: 0 24px; rotate: -4deg; }
.lv > #sources .lv-pf-row { transition: opacity 420ms var(--ease-out), transform 420ms var(--ease-out); transition-delay: calc(200ms + var(--i, 0) * 90ms); }
.lv > #sources .lv-pf-sheet:not([data-in]) .lv-pf-row { opacity: 0; transform: translateX(8px); }
.lv > #sources .lv-src-ic { position: relative; }
.lv > #sources .lv-src-ic::after { content: ""; position: absolute; inset: -5px; border-radius: 15px; box-shadow: inset 0 0 0 2px var(--primary); opacity: 0; pointer-events: none; }
}
@supports (animation-timeline: view()) {
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv.lv-io > #comparatif .lv-vs-list li { view-timeline: --lv-pf-li block; view-timeline-inset: 0px calc(var(--lv-dock) - 12px); transition: none; animation: lv-pf-row linear both; animation-timeline: --lv-pf-li; animation-range: entry 0% entry 100%; }
.lv.lv-io > #comparatif .lv-vs-gpt .lv-vs-mark { animation: lv-pf-mark linear both; animation-timeline: --lv-pf-li; animation-range: entry 0% entry 100%; }
.lv.lv-io > #comparatif .lv-vs-lmc .lv-vs-mark { transition: none; animation: lv-pf-pop linear both; animation-timeline: --lv-pf-li; animation-range: entry 0% entry 100%; }
.lv.lv-io > #comparatif .lv-vs-lmc .lv-vs-tick { stroke-dasharray: 1; transition: none; animation: lv-pf-tick linear both; animation-timeline: --lv-pf-li; animation-range: entry 40% entry 100%; }
.lv.lv-io > #comparatif .lv-vs-lmc .lv-vs-list li::before { animation: lv-pf-wire linear both; animation-timeline: --lv-pf-li; animation-range: entry 40% entry 100%; }
.lv.lv-io > #comparatif .lv-vs-score { view-timeline: --lv-pf-score block; view-timeline-inset: 0px calc(var(--lv-dock) - 12px); }
.lv.lv-io > #comparatif .lv-vs-score b { animation: lv-pf-score linear both; animation-timeline: --lv-pf-score; animation-range: entry 0% entry 100%; }
.lv.lv-io > #sources .lv-src-card.lv-reveal { transition: none; animation: lv-pf-rise linear both; animation-timeline: view(block 0px calc(var(--lv-dock) - 12px)); animation-range: entry 0% entry 40%; }
}
}
@keyframes lv-cl-par { from { transform: translateY(-4%) scale(1.08); } to { transform: translateY(4%) scale(1.08); } }
@keyframes lv-cl-teaser-in { from { opacity: 0; translate: 0 40px; rotate: 10deg; } 40% { opacity: 1; } to { opacity: 1; translate: 0 0; rotate: var(--cl-tilt, 4deg); } }
@keyframes lv-cl-bob { from { translate: 0 0; } to { translate: 0 5px; } }
@keyframes lv-cl-recap-in { from { rotate: var(--cl-r0); translate: 0 24px; } to { rotate: var(--cl-r1); translate: 0 0; } }
@keyframes lv-cl-flank-l { from { opacity: 0; transform: translateX(-24px) perspective(1000px) rotateY(24deg) rotateZ(-7deg); } 45% { opacity: 1; } to { opacity: 1; transform: translateX(0) perspective(1000px) rotateY(14deg) rotateZ(-4deg); } }
@keyframes lv-cl-flank-r { from { opacity: 0; transform: translateX(24px) rotateZ(8deg); } 45% { opacity: 1; } to { opacity: 1; transform: translateX(0) rotateZ(4deg); } }
@keyframes lv-cl-road { from { translate: 0 0; } to { translate: 0 512px; } }
@keyframes lv-cl-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@media (min-width: 1024px) {
.lv > :is(#moto, #pricing, #faq, #cta) .lv-cl-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: var(--ds-tint); color: var(--primary-strong); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; line-height: 1; text-transform: uppercase; white-space: nowrap; }
.lv > :is(#moto, #pricing, #faq, #cta) .lv-cl-link { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; font-size: 13.5px; font-weight: 650; color: var(--primary-strong); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; text-decoration-color: color-mix(in oklab, var(--primary-strong) 35%, transparent); border-radius: 6px; }
.lv > :is(#moto, #pricing, #faq, #cta) .lv-cl-link svg { width: 14px; height: 14px; flex: none; }
.lv > :is(#moto, #pricing, #faq, #cta) .lv-cl-link:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.lv > :is(#pricing, #cta) .lv-cl-stats { display: flex; flex-wrap: wrap; gap: 2px 8px; font-size: 13px; line-height: 1.4; color: var(--muted-foreground); }
.lv > :is(#pricing, #cta) .lv-cl-stats > span { display: inline-flex; align-items: baseline; gap: 4px; }
.lv > :is(#pricing, #cta) .lv-cl-stats i { font-style: normal; }
.lv > :is(#pricing, #cta) .lv-cl-stats b { font-weight: 700; color: var(--foreground); }
.lv > :is(#moto, #faq, #cta) :is(.lv-cl-teaser-ph, .lv-cl-frag-ph, .lv-cl-flank-ph) { display: block; overflow: hidden; background: var(--muted); }
.lv > :is(#moto, #faq, #cta) :is(.lv-cl-teaser-ph, .lv-cl-frag-ph, .lv-cl-flank-ph) img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lv > #moto { contain-intrinsic-size: auto calc(64px + 0.58 * min(100vw - 111px, 1264px)); }
.lv > #moto .lv-moto-wrap { --cl-float-right: -16px; position: relative; max-width: var(--lv-dw); padding-top: 64px; }
.lv > #moto .lv-moto { min-height: clamp(520px, 38vw, 680px); view-timeline: --lv-cl-moto block; }
.lv > #moto .lv-cl-teaser { position: absolute; z-index: 2; top: 24px; right: calc(var(--lv-dg) + var(--cl-float-right)); width: clamp(304px, 13vw + 120px, 372px); rotate: var(--cl-tilt, 4deg); transform: perspective(1200px) rotateY(-12deg); transform-origin: 60% 50%; }
.lv > #moto .lv-cl-teaser.theme-moto { --lane: #ff6900; }
.lv > #moto .lv-cl-teaser.lv-cl-car { --primary: #3b82f6; --primary-strong: #2563eb; --ring: #3b82f6; --lane: #2563eb; --ds-tint: rgb(59 130 246 / 0.1); }
.dark .lv > #moto .lv-cl-teaser.lv-cl-car { --primary-strong: #60a5fa; --lane: #60a5fa; --ds-tint: rgb(96 165 250 / 0.14); }
.lv > #moto .lv-cl-teaser-in { position: relative; display: grid; gap: 7px; padding: 14px 14px 10px 12px; border-radius: 20px; background: var(--card); color: var(--foreground); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report), 0 28px 50px -30px rgb(2 6 23 / 0.55); }
.lv > #moto .lv-cl-teaser-top { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; column-gap: 12px; padding-right: 30px; }
.lv > #moto .lv-cl-teaser-tab { position: absolute; top: -8px; left: 14px; background: color-mix(in oklab, var(--primary) 12%, var(--card)); box-shadow: 0 0 0 1px color-mix(in oklab, var(--primary) 28%, var(--border)); }
.lv > #moto .lv-cl-teaser-ring { position: absolute; top: -16px; right: -14px; display: grid; padding: 4px; border-radius: 50%; background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 12px 24px -12px rgb(2 6 23 / 0.45); }
.lv > #moto .lv-cl-teaser-ph { width: 76px; aspect-ratio: 4 / 3; border-radius: 10px; }
.lv > #moto .lv-cl-teaser-id { display: grid; justify-items: start; gap: 6px; min-width: 0; }
.lv > #moto .lv-cl-teaser-name { font-size: 14.5px; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; white-space: nowrap; }
.lv > #moto .lv-cl-teaser-sub { display: flex; align-items: center; gap: 8px; }
.lv > #moto .lv-cl-teaser-sub small { font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); white-space: nowrap; }
.lv > #moto .lv-cl-teaser-price { display: flex; align-items: baseline; gap: 6px; padding-top: 7px; border-top: 1px solid color-mix(in oklab, var(--lane) 30%, var(--border)); white-space: nowrap; }
.lv > #moto .lv-cl-teaser-price small { font-size: 12px; font-weight: 600; color: var(--muted-foreground); }
.lv > #moto .lv-cl-teaser-price b { font-size: 20px; font-weight: 750; line-height: 1.1; letter-spacing: -0.02em; color: var(--success-strong); }
.lv > #moto .lv-cl-teaser-price span { font-size: 12px; color: var(--muted-foreground); }
.lv > #moto .lv-cl-teaser-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lv > #moto .lv-cl-teaser-foot .lv-cl-link { min-height: 24px; font-size: 13px; }
.lv > #moto .lv-cl-teaser-risk { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--muted-foreground); white-space: nowrap; }
.lv > #moto .lv-cl-teaser-risk svg { width: 14px; height: 14px; color: var(--warning); }
.lv > #moto .lv-moto-cta { --u: 0.4px; max-width: 520px; }
.lv > #moto .lv-moto-cta .lv-search-bar input { font-size: 16px; }
.lv > #moto .lv-moto-cta .lv-search-go.lv-search-go { height: 48px; padding: 0 18px 0 22px; gap: 8px; font-size: 16px; }
.lv > #moto .lv-moto-cta .lv-search-go svg { width: 18px; height: 18px; }
@media (max-width: 1279px) {
.lv > #moto .lv-cl-teaser.lv-cl-car { --cl-tilt: 3deg; top: 18px; }
}
@media (min-width: 1680px) {
.lv > #moto { contain-intrinsic-size: auto calc(64px + 0.58 * min(100vw - 111px, 1504px)); }
.lv > #moto .lv-moto-wrap { max-width: var(--lv-dw-wide); }
.lv > #moto .lv-cl-teaser-top { grid-template-columns: 96px minmax(0, 1fr); }
.lv > #moto .lv-cl-teaser-ph { width: 96px; }
}
.lv > #pricing { contain-intrinsic-size: auto 780px; }
.lv > #pricing .lv-plans-zone { --cl-r0: -2.5deg; --cl-r1: -1deg; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "recap" "plans" "feat"; }
.lv > #pricing .lv-plans { grid-area: plans; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lv > #pricing .lv-plans-zone > .lv-feat { grid-area: feat; align-self: start; }
.lv > #pricing .lv-plans-zone:not(:has(.lv-cl-recap))::before { content: ""; grid-area: recap; height: 120px; margin-bottom: 28px; }
.lv > #pricing .lv-cl-recap { grid-area: recap; display: flex; min-width: 0; margin-bottom: 28px; rotate: var(--cl-r1); }
.lv > #pricing .lv-cl-recap-in { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto minmax(0, 1fr); column-gap: 24px; row-gap: 8px; height: 120px; padding: 14px 22px; border-radius: 24px; background: var(--card); color: var(--foreground); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report); }
.lv > #pricing .lv-cl-recap-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lv > #pricing .lv-cl-recap-top { display: contents; }
.lv > #pricing .lv-cl-recap-top .lv-cl-link { order: 2; flex: none; margin-left: auto; }
.lv > #pricing .lv-cl-recap-title { order: 1; }
.lv > #pricing .lv-cl-recap-title { min-width: 0; overflow: hidden; font-size: 15px; font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; white-space: nowrap; text-overflow: ellipsis; }
.lv > #pricing .lv-cl-recap-rows { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: 14px; align-items: end; margin: 0; }
.lv > #pricing .lv-cl-row { display: grid; align-content: end; gap: 2px; min-width: 0; }
.lv > #pricing .lv-cl-row dt { font-size: 11.5px; font-weight: 600; line-height: 1.25; color: var(--muted-foreground); }
.lv > #pricing .lv-cl-row dd { margin: 0; font-size: 19px; font-weight: 750; line-height: 1.15; letter-spacing: -0.02em; white-space: nowrap; }
.lv > #pricing .lv-cl-recap-foot { grid-column: 2; grid-row: 1 / -1; display: grid; align-content: center; justify-items: start; gap: 3px; width: 272px; padding-left: 20px; border-left: 2px dashed color-mix(in oklab, var(--lane) 35%, transparent); }
.lv > #pricing .lv-cl-recap-unit { font-size: 12.5px; font-weight: 600; line-height: 1.35; }
.lv > #pricing .lv-cl-recap-foot .lv-cl-stats { font-size: 12px; gap: 0 6px; }
.lv > #pricing .lv-cl-row-price dd { color: var(--muted-foreground); }
.lv > #pricing .lv-cl-struck { position: relative; display: inline-block; }
.lv > #pricing .lv-cl-struck svg { position: absolute; left: -5%; top: 30%; width: 110%; height: 44%; overflow: visible; pointer-events: none; }
.lv > #pricing .lv-cl-struck path { stroke: var(--primary); stroke-width: 3; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 0; }
@media (min-width: 1280px) {
.lv > #pricing .lv-plans-zone { --cl-r0: -5deg; --cl-r1: -2deg; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); grid-template-rows: auto 1fr; grid-template-areas: "recap plans" "recap feat"; align-content: start; column-gap: 48px; }
.lv > #pricing .lv-plans-zone:not(:has(.lv-cl-recap))::before { height: auto; margin: 0; }
.lv > #pricing .lv-cl-recap { align-self: stretch; margin: 0; }
.lv > #pricing .lv-plans-zone:has(> .lv-feat.lv-open) > .lv-cl-recap { align-self: start; }
.lv > #pricing .lv-plans-zone:has(> .lv-feat.lv-open) > .lv-cl-recap { position: sticky; top: calc(var(--lv-top) + 24px); }
.lv > #pricing .lv-plans-zone > .lv-feat .lv-feat-panel > ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; row-gap: 8px; }
.lv > #pricing .lv-plans-zone > .lv-feat .lv-feat-panel li { display: block; position: relative; min-height: 24px; padding: 3px 0 0 32px; }
.lv > #pricing .lv-plans-zone > .lv-feat .lv-feat-panel li > .lv-feat-ic { position: absolute; left: 0; top: 0; }
.lv > #pricing .lv-plans-zone > .lv-feat .lv-feat-panel li small { white-space: nowrap; }
.lv > #pricing .lv-cl-recap-in { display: flex; flex-direction: column; justify-content: flex-start; gap: 10px; height: auto; padding: 18px 24px; border-radius: 28px; }
.lv > #pricing .lv-cl-recap-head { flex-direction: column; align-items: stretch; gap: 6px; }
.lv > #pricing .lv-cl-recap-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lv > #pricing .lv-cl-recap-top .lv-cl-link { min-height: 24px; margin: 0; }
.lv > #pricing .lv-cl-recap-title { overflow: visible; font-size: 17px; line-height: 1.25; white-space: normal; text-wrap: balance; }
.lv > #pricing .lv-cl-recap-rows { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "price target" "margin margin" "fees fees" "risks risks"; column-gap: 36px; row-gap: 0; align-items: stretch; }
.lv > #pricing .lv-cl-row { display: grid; gap: 2px; }
.lv > #pricing .lv-cl-row dt { font-size: 12.5px; font-weight: 600; line-height: 1.25; }
.lv > #pricing :is(.lv-cl-row-price, .lv-cl-row-target) { display: flex; flex-direction: column; justify-content: space-between; }
.lv > #pricing .lv-cl-row-price { grid-area: price; position: relative; padding-bottom: 5px; }
.lv > #pricing .lv-cl-row-price dd { font-size: 22px; font-weight: 700; line-height: 1.1; }
.lv > #pricing .lv-cl-row-price::after { content: "\2192" / ""; position: absolute; right: -27px; bottom: 9px; font-size: 18px; font-weight: 600; line-height: 1; color: var(--muted-foreground); }
.lv > #pricing .lv-cl-row-target { grid-area: target; padding-bottom: 2px; }
.lv > #pricing .lv-cl-row-target dd { font-size: 38px; font-weight: 800; line-height: 1.05; letter-spacing: -0.03em; }
.lv > #pricing .lv-cl-row-margin { grid-area: margin; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 8px 0 6px; padding: 6px 6px 6px 14px; border-radius: 14px; background: color-mix(in oklab, var(--success-strong) 10%, transparent); }
.lv > #pricing .lv-cl-row-margin dt { font-size: 14px; color: var(--foreground); }
.lv > #pricing .lv-cl-row-margin dd { padding: 0 10px; border-radius: 10px; background: var(--card); font-size: 22px; box-shadow: 0 0 0 1px color-mix(in oklab, var(--success-strong) 25%, transparent); }
.lv > #pricing :is(.lv-cl-row-fees, .lv-cl-row-risks) { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 2px 2px 3px; }
.lv > #pricing .lv-cl-row-fees { grid-area: fees; }
.lv > #pricing .lv-cl-row-risks { grid-area: risks; }
.lv > #pricing :is(.lv-cl-row-fees, .lv-cl-row-risks) dt { font-size: 13.5px; font-weight: 500; }
.lv > #pricing :is(.lv-cl-row-fees, .lv-cl-row-risks) dd { font-size: 15px; font-weight: 700; line-height: 1.25; }
.lv > #pricing .lv-cl-recap-foot { display: grid; gap: 2px; width: auto; padding: 8px 2px 0; border: 0; border-top: 1px dashed color-mix(in oklab, var(--muted-foreground) 30%, transparent); }
.lv > #pricing .lv-cl-recap-unit { font-size: 13.5px; line-height: 1.35; }
.lv > #pricing .lv-cl-recap-foot .lv-cl-stats { font-size: 12.5px; line-height: 1.35; }
}
@media (min-width: 1440px) {
.lv > #pricing .lv-plan { padding: 30px 28px; }
.lv > #pricing .lv-plan-pick { gap: 12px; }
.lv > #pricing .lv-plan .lv-price { font-size: 38px; }
.lv > #pricing .lv-cl-recap-in { padding: 18px 28px; }
}
@media (min-width: 1680px) {
.lv > #pricing .lv-wrap { max-width: var(--lv-dw-wide); }
.lv > #pricing .lv-plans-zone > .lv-feat .lv-feat-panel > ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lv > #pricing .lv-plan { padding: 36px 32px; }
.lv > #pricing .lv-plan-pick { gap: 14px; }
}
.lv > #faq { contain-intrinsic-size: auto 680px; }
.lv > #faq .lv-wrap.lv-narrow { --cl-faq-left: calc((100% - 64px) * 5 / 12); --cl-faq-min: 534px; max-width: var(--lv-dw); display: flow-root; }
.lv > #faq .lv-narrow > :is(.lv-blk-head, .lv-cl-faq-aside) { float: left; clear: left; width: var(--cl-faq-left); }
.lv > #faq .lv-narrow > .lv-blk-head { display: block; margin-bottom: 28px; }
.lv > #faq .lv-narrow > .lv-blk-head > .lv-h2 { max-width: none; }
.lv > #faq .lv-narrow > :is(.lv-acc, .lv-center-note) { margin-left: calc(var(--cl-faq-left) + 64px); }
.lv > #faq .lv-wrap.lv-narrow { min-height: var(--cl-faq-min); }
.lv > #faq .lv-acc { border-radius: 16px; padding: 0 22px; border-color: color-mix(in oklab, var(--border) 80%, transparent); }
.lv > #faq .lv-acc + .lv-acc { margin-top: 10px; }
.lv > #faq .lv-acc summary { min-height: 70px; font-size: 18px; line-height: 1.35; }
.lv > #faq .lv-acc p { font-size: 16px; }
.lv > #faq .lv-cl-faq-aside { display: grid; align-content: start; gap: 14px; }
.lv > #faq .lv-cl-faq-title { font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; text-wrap: balance; }
.lv > #faq .lv-cl-frag { position: relative; border-radius: 22px; background: var(--card); color: var(--foreground); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-card); rotate: -1.5deg; }
.lv > #faq .lv-cl-frag-head { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; column-gap: 14px; padding: 12px 24px 12px 12px; border-bottom: 1px dashed color-mix(in oklab, var(--muted-foreground) 28%, transparent); }
.lv > #faq .lv-cl-frag-ph { width: 72px; aspect-ratio: 4 / 3; border-radius: 10px; }
.lv > #faq .lv-cl-frag-id { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 10px; min-width: 0; }
.lv > #faq .lv-cl-frag-id > .lv-cl-frag-name { flex-basis: 100%; }
.lv > #faq .lv-cl-frag > .lv-cl-frag-head > .lv-ring { position: absolute; top: -14px; right: -12px; box-sizing: content-box; padding: 4px; border-radius: 50%; background: var(--card); box-shadow: 0 0 0 1px var(--border), 0 12px 24px -12px rgb(2 6 23 / 0.4); }
.lv > #faq .lv-cl-frag-name { font-size: 15px; font-weight: 700; line-height: 1.25; }
.lv > #faq .lv-cl-frag-price { font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--muted-foreground); }
.lv > #faq .lv-cl-frag-body { display: grid; gap: 8px; padding: 12px 18px 14px; border-radius: 0 0 22px 22px; background: color-mix(in oklab, var(--primary) 4%, var(--card)); }
.lv > #faq .lv-cl-frag-kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--primary-strong); }
.lv > #faq .lv-cl-frag-kicker svg { width: 14px; height: 14px; flex: none; }
.lv > #faq .lv-cl-frag-list { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.lv > #faq .lv-cl-frag-list li { display: grid; grid-template-columns: 20px minmax(0, 1fr); column-gap: 10px; align-items: start; font-size: 14px; font-weight: 600; line-height: 1.4; }
.lv > #faq .lv-cl-frag-n { display: grid; place-items: center; width: 20px; height: 20px; margin-top: 0; border-radius: 50%; background: var(--ds-tint); color: var(--primary-strong); font-size: 11.5px; font-weight: 750; }
.lv > #faq .lv-cl-faq-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.lv > #faq .lv-cl-note { font-size: 13px; color: var(--muted-foreground); }
@media (max-width: 1279px) {
.lv > #faq .lv-wrap.lv-narrow { --cl-faq-min: 560px; }
.lv > #faq .lv-acc summary { min-height: 76px; }
.lv > #faq .lv-cl-frag-head { grid-template-columns: 64px minmax(0, 1fr); }
.lv > #faq .lv-cl-frag-list li:nth-child(n + 2) { display: none; }
.lv > #faq .lv-cl-frag-ph { width: 64px; }
}
.lv > #cta .lv-final { view-timeline: --lv-cl-cta block; }
.lv > #cta .lv-cl-flanks { display: contents; }
.lv > #cta .lv-road { background-size: 0 0, auto, auto; animation: none; }
.lv > #cta .lv-road::before { content: ""; position: absolute; left: calc(50% - 2.5px); top: -512px; bottom: 0; width: 5px; background: repeating-linear-gradient(180deg, var(--lane) 0 16px, transparent 16px 32px); }
.lv > #cta :is(.lv-cl-flank-l, .lv-cl-flank-r) { display: none; }
.lv > #cta .lv-cl-reas { display: grid; justify-items: center; align-content: start; gap: 6px; min-height: 84px; margin-top: 2px; font-size: 14px; line-height: 1.45; color: var(--muted-foreground); }
.lv > #cta .lv-final:not(:has(.lv-cl-flanks))::after { content: ""; height: 84px; margin-top: 2px; }
.lv > #cta .lv-cl-reas-line { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 10px; font-weight: 600; color: var(--foreground); }
.lv > #cta .lv-cl-reas-line > span { display: inline-flex; gap: 10px; }
.lv > #cta .lv-cl-reas-line i { font-style: normal; color: var(--muted-foreground); }
.lv > #cta .lv-cl-reas .lv-cl-stats { justify-content: center; }
.lv > #cta .lv-cl-reas-demo .lv-link { font-weight: 600; }
@media (min-width: 1280px) {
.lv > #cta .lv-final.lv-final { grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) minmax(0, 3fr); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: 24px; row-gap: 12px; min-height: 640px; padding: 56px 40px 120px; }
.lv > #cta .lv-final > .lv-h2 { grid-column: 2; grid-row: 2; }
.lv > #cta .lv-final > .lv-lead { grid-column: 2; grid-row: 3; }
.lv > #cta .lv-final > .lv-search { grid-column: 2; grid-row: 4; }
.lv > #cta .lv-cl-reas, .lv > #cta .lv-final:not(:has(.lv-cl-flanks))::after { grid-column: 2; grid-row: 5; }
.lv > #cta .lv-road { width: 100%; left: 0; margin-left: 0; }
.lv > #cta :is(.lv-cl-flank-l, .lv-cl-flank-r) { display: block; position: relative; z-index: 1; grid-row: 1 / -1; align-self: center; width: clamp(240px, 12.5vw + 80px, 320px); text-align: left; }
.lv > #cta .lv-cl-flank-l { grid-column: 1; justify-self: start; transform: perspective(1000px) rotateY(14deg) rotateZ(-4deg); transform-origin: 30% 50%; }
.lv > #cta .lv-cl-flank-r { grid-column: 3; justify-self: end; transform: rotateZ(4deg); }
.lv > #cta .lv-cl-flank-in { display: grid; gap: 10px; padding: 16px; border-radius: 24px; }
.lv > #cta .lv-cl-flank-l .lv-cl-flank-in { justify-items: start; background: var(--card); color: var(--foreground); box-shadow: 0 0 0 1px var(--border), var(--lv-shadow-report); }
.lv > #cta .lv-cl-flank-ph { width: 100%; height: 96px; border-radius: 14px; }
.lv > #cta .lv-cl-flank-name { font-size: 15px; font-weight: 700; line-height: 1.25; }
.lv > #cta .lv-cl-gauge.lv-gauge { justify-self: center; width: 140px; margin: 0 0 14px; }
.lv > #cta .lv-cl-flank-l .lv-verdict { justify-self: center; }
.lv > #cta .lv-cl-flank-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 13px; color: var(--muted-foreground); }
.lv > #cta .lv-cl-flank-price b { font-size: 17px; font-weight: 750; color: var(--success-strong); }
.lv > #cta .lv-cl-flank-price s { text-decoration-thickness: 1.5px; }
.lv > #cta .lv-cl-flank-risk { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted-foreground); }
.lv > #cta .lv-cl-flank-risk svg { width: 14px; height: 14px; color: var(--warning); }
.lv > #cta .lv-cl-flank-r .lv-cl-flank-in { gap: 12px; border: 2px dashed color-mix(in oklab, var(--primary) 42%, var(--border)); background: color-mix(in oklab, var(--card) 72%, transparent); }
.lv > #cta .lv-cl-flank-r .lv-cl-tag { justify-self: start; }
.lv > #cta .lv-cl-flank-r .lv-cl-flank-in { justify-items: start; }
.lv > #cta .lv-cl-sk-ph { display: grid; place-items: center; width: 100%; height: 96px; border-radius: 14px; border: 1.5px dashed color-mix(in oklab, var(--muted-foreground) 35%, transparent); background: color-mix(in oklab, var(--muted-foreground) 7%, transparent); color: color-mix(in oklab, var(--muted-foreground) 70%, transparent); }
.lv > #cta .lv-cl-sk-ph svg { width: 26px; height: 26px; }
.lv > #cta .lv-cl-sk-site { display: grid; justify-items: center; gap: 2px; max-width: 100%; padding: 0 12px; text-align: center; }
.lv > #cta .lv-cl-sk-site svg { width: 18px; height: 18px; margin-bottom: 2px; }
.lv > #cta .lv-cl-sk-site b { font-size: 16px; font-weight: 750; line-height: 1.2; letter-spacing: -0.01em; color: var(--foreground); }
.lv > #cta .lv-cl-sk-site small { max-width: 100%; font-size: 12px; font-weight: 600; line-height: 1.3; color: var(--muted-foreground); overflow-wrap: anywhere; }
.lv > #cta .lv-cl-flank-r[data-site] .lv-cl-flank-in { rotate: -4deg; border-style: solid; border-color: color-mix(in oklab, var(--primary) 55%, var(--border)); background: var(--card); box-shadow: var(--lv-shadow-report); }
.lv > #cta .lv-cl-flank-r[data-ready] .lv-cl-sk-ph { border-style: solid; border-color: color-mix(in oklab, var(--primary) 45%, transparent); color: var(--primary); }
.lv > #cta .lv-cl-sk-bar { position: relative; display: block; height: 10px; overflow: hidden; border-radius: 99px; background: color-mix(in oklab, var(--muted-foreground) 18%, transparent); }
.lv > #cta .lv-cl-sk-bar i { position: absolute; inset: 0; border-radius: inherit; background: color-mix(in oklab, var(--primary) 55%, transparent); transform: scaleX(0); transform-origin: left; }
.lv > #cta .lv-cl-flank-r[data-site] .lv-cl-sk-bar i { transform: none; }
.lv > #cta .lv-cl-sk-name { width: 78%; height: 12px; margin: 3px 0; }
.lv > #cta .lv-cl-sk-pill { justify-self: center; display: inline-flex; align-items: center; height: 24px; padding: 0 12px; border-radius: 999px; border: 1.5px dashed color-mix(in oklab, var(--muted-foreground) 40%, transparent); font-size: 12px; font-weight: 600; color: var(--muted-foreground); }
.lv > #cta .lv-cl-sk-price { display: flex; align-items: center; gap: 8px; width: 100%; font-size: 13px; color: var(--muted-foreground); }
.lv > #cta .lv-cl-sk-price .lv-cl-sk-bar { flex: 1; max-width: 88px; height: 14px; }
.lv > #cta .lv-cl-q { display: grid; place-content: center; justify-items: center; width: 64px; height: 64px; justify-self: center; border-radius: 50%; border: 3px dashed color-mix(in oklab, var(--primary) 45%, var(--border)); line-height: 1; }
.lv > #cta .lv-cl-q b { font-size: 22px; font-weight: 750; color: var(--foreground); }
.lv > #cta .lv-cl-q small { margin-top: 2px; font-size: 10px; font-weight: 600; color: var(--muted-foreground); }
.lv > #cta .lv-cl-flank-r[data-site] .lv-cl-q { border-style: solid; border-color: var(--primary); }
.lv > #cta .lv-cl-ready { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 22px; font-size: 13px; font-weight: 600; color: var(--muted-foreground); }
.lv > #cta .lv-cl-ready-ic { display: grid; place-items: center; width: 20px; height: 20px; flex: none; border-radius: 50%; background: var(--success-fill); color: #fff; opacity: 0; transform: scale(0.6); }
.lv > #cta .lv-cl-ready-ic svg { width: 12px; height: 12px; stroke-width: 3; }
.lv > #cta .lv-cl-flank-r[data-ready] .lv-cl-ready { color: var(--warning-strong); }
.lv > #cta .lv-cl-flank-r[data-ready]:not([data-site]) .lv-cl-ready-ic { background: var(--warning-fill); }
.lv > #cta .lv-cl-flank-r[data-site] .lv-cl-ready { color: var(--success-strong); }
.lv > #cta .lv-cl-ready { text-align: center; text-wrap: balance; }
.lv > #cta .lv-cl-flank-r[data-ready] .lv-cl-ready-ic { opacity: 1; transform: none; }
.lv > #cta .lv-cl-hand { position: absolute; z-index: 1; top: -42px; left: -2px; font-family: var(--font-handwriting), cursive; font-size: 25px; line-height: 1; color: var(--primary-strong); rotate: -7deg; white-space: nowrap; pointer-events: none; }
.lv > #cta .lv-cl-arrow { position: absolute; z-index: 1; top: calc(50% - 199px); left: -42px; width: 44px; height: 210px; fill: none; stroke: var(--primary-strong); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
}
@media (min-width: 1680px) {
.lv > #cta .lv-wrap { max-width: var(--lv-dw-wide); }
.lv > #cta .lv-final.lv-final { min-height: 680px; }
}
.lv > #newsletter .lv-news { max-width: none; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; column-gap: 48px; text-align: left; padding: 32px 40px; border-radius: 28px; }
.lv > #newsletter .lv-news > div:first-child, .lv > #newsletter .lv-news .lv-blk-head-center { max-width: none; margin: 0; text-align: left; }
.lv > #newsletter .lv-news .lv-eyebrow { justify-content: flex-start; }
.lv > #newsletter .lv-news .lv-h2 { margin-top: 8px; font-size: clamp(22px, 1.4vw + 8px, 28px); line-height: 1.2; letter-spacing: -0.02em; }
.lv > #newsletter .lv-news .lv-lead { margin-top: 6px; font-size: 15px; }
.lv > #newsletter .lv-news-form { max-width: none; margin: 0; gap: 10px; }
.lv > #newsletter .lv-news-done { grid-column: 1 / -1; flex-direction: row; justify-content: center; text-align: left; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv > #moto .lv-cl-teaser[data-live] .lv-cl-teaser-in { animation: lv-cl-bob 5.6s var(--ease-in-out) infinite alternate; }
.lv > #cta :is(.lv-cl-flank-l, .lv-cl-flank-r)[data-live] .lv-cl-flank-in { animation: lv-cl-bob 6s var(--ease-in-out) infinite alternate; }
.lv > #cta .lv-cl-flank-r[data-live] .lv-cl-flank-in { animation-delay: -2.4s; }
.lv > #pricing .lv-cl-recap:not([data-in]) :is(.lv-cl-row, .lv-cl-recap-foot) { opacity: 0; translate: 0 8px; }
.lv > #pricing .lv-cl-recap :is(.lv-cl-row, .lv-cl-recap-foot) { transition: opacity 360ms var(--ease-out), translate 420ms var(--ease-out); transition-delay: calc(120ms + var(--i, 5) * 60ms); }
.lv > #pricing .lv-cl-recap:not([data-in]) .lv-cl-struck path { stroke-dashoffset: 1; }
.lv > #pricing .lv-cl-struck path { transition: stroke-dashoffset 520ms var(--ease-out) 520ms; }
.lv > #cta .lv-cl-sk-bar i { transition: transform 520ms var(--ease-out); transition-delay: calc(var(--k, 0) * 120ms); }
.lv > #cta .lv-cl-ready-ic { transition: opacity var(--dur-2) var(--ease-out), transform 400ms var(--ease-spring); }
.lv > #cta .lv-cl-flank-r .lv-cl-flank-in { transition: rotate 560ms var(--ease-spring); }
.lv-io > #faq .lv-cl-faq-aside.lv-reveal:not(.lv-in) { transform: translateY(16px); }
@supports not (animation-timeline: view()) {
.lv > #pricing .lv-cl-recap { transition: rotate 700ms var(--ease-out), translate 700ms var(--ease-out); }
.lv > #pricing .lv-cl-recap:not([data-in]) { rotate: var(--cl-r0); translate: 0 24px; }
}
}
@supports (animation-timeline: view()) {
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv > #moto .lv-moto-bg img { animation: lv-cl-par linear both; animation-timeline: --lv-cl-moto; animation-range: cover 0% cover 100%; }
.lv > #moto .lv-cl-teaser { animation: lv-cl-teaser-in linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
.lv > #pricing .lv-cl-recap { animation: lv-cl-recap-in linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
.lv > #cta .lv-road::before { animation: lv-cl-road linear both; animation-timeline: --lv-cl-cta; animation-range: cover; }
}
@media (min-width: 1280px) and (prefers-reduced-motion: no-preference) {
.lv > #cta .lv-cl-flank-l { animation: lv-cl-flank-l linear both; animation-timeline: --lv-cl-cta; animation-range: entry 0% entry 70%; }
.lv > #cta .lv-cl-flank-r { animation: lv-cl-flank-r linear both; animation-timeline: --lv-cl-cta; animation-range: entry 0% entry 70%; }
.lv > #cta .lv-cl-arrow path { stroke-dasharray: 1; animation: lv-cl-draw linear both; animation-timeline: --lv-cl-cta; animation-range: entry 55% cover 50%; }
.lv > #cta .lv-cl-arrow path + path { animation-range: cover 45% cover 55%; }
}
}
@keyframes lv-dk-pulse { 50% { transform: scale(1.02); } }
@keyframes lv-dk-swap { from { opacity: 0; transform: translateY(5px); } }
@keyframes lv-dk-pitch { 0% { transform: none; } 28% { transform: rotate(-1.5deg); } 72% { transform: rotate(1.5deg); } 100% { transform: none; } }
@keyframes lv-dk-pitch-back { 0% { transform: none; } 28% { transform: rotate(1.5deg); } 72% { transform: rotate(-1.5deg); } 100% { transform: none; } }
@media (min-width: 1024px) {
.lv-dk { position: fixed; left: 24px; bottom: 24px; z-index: 200; box-sizing: border-box; display: flex; align-items: center; gap: 18px; width: min(720px, calc(100vw - 464px)); height: 60px; padding: 5px 5px 5px 24px; overflow: visible; border: 1px solid var(--border); border-radius: 999px; background: var(--card); color: var(--foreground); box-shadow: var(--lv-shadow-report);
--dk-idle: color-mix(in oklab, var(--muted-foreground) 64%, var(--card));
--dk-paint: var(--primary-strong, var(--lane));
transform: translateY(calc(100% + 40px)); opacity: 0; pointer-events: none;
transition: transform 220ms var(--ease-out), opacity 160ms var(--ease-out), translate 220ms var(--ease-out); }
.lv-dk.lv-on { transform: none; opacity: 1; pointer-events: auto; }
.lv-dk[data-consent] { translate: 420px 0; width: min(720px, calc(100vw - 492px)); }
html:has(.lv-dk.lv-on) { scroll-padding-bottom: 104px; }
.lv-dk-chapters { display: grid; flex: none; row-gap: 2px; align-content: center; }
.lv-dk-now { display: block; width: 0; min-width: 100%; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: -0.006em; white-space: nowrap; text-overflow: ellipsis; color: var(--foreground); }
.lv-dk-num { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--dk-paint); }
.lv-dk-now[data-preview] { color: var(--muted-foreground); }
.lv-dk-road { position: relative; display: flex; align-items: flex-end; height: 30px; }
.lv-dk-ticks { display: flex; margin: 0; padding: 0; list-style: none; }
.lv-dk-tick { position: relative; display: block; width: 24px; height: 24px; margin: 0; padding: 0; border: 0; border-radius: 6px; background: none; cursor: pointer; }
.lv-dk-tick::before, .lv-dk-tick::after { content: ""; position: absolute; left: 3px; top: 16px; width: 18px; height: 4px; border-radius: 2px; }
.lv-dk-tick::before { background: var(--dk-idle); }
.lv-dk-tick::after { background: var(--lane); transform: scaleX(0); transform-origin: left center; transition: transform 320ms var(--ease-out); }
.lv-dk-tick[data-state="past"]::after { transform: none; }
.lv-dk-tick[data-state="on"]::before { opacity: 0; }
.lv-dk-tick[data-state="on"]::after { background: var(--dk-paint); transform: translateX(-2px) scale(1.22, 1.5); }
.lv-dk-tick:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
.lv-dk-car { position: absolute; left: 12px; top: 1px; display: block; height: 21px; color: var(--lane); pointer-events: none; transform: translateX(calc(var(--dk-i, 0) * 24px - 50%)); transition: transform 560ms cubic-bezier(0.34, 1.4, 0.64, 1); }
.lv-dk-ride { display: block; height: 100%; transform-origin: 50% 100%; }
.lv-dk-car svg { display: block; width: auto; height: 21px; overflow: visible; transform: scaleX(-1); transition: transform 240ms var(--ease-out); }
.lv-dk-car[data-back] svg { transform: none; }
.dark .lv-dk .lv-dk-tyre { fill: #475569; }
.dark .lv-dk .lv-dk-seat { stroke: #64748b; }
.lv-dk-search { flex: 1; min-width: 0; }
.lv-dk .lv-search { margin: 0; max-width: none; }
.lv-dk .lv-search-bar.lv-compact { height: 48px; padding: 4px 4px 4px 18px; background: var(--lv-search-field); box-shadow: 0 0 0 1px var(--lv-search-ring); }
.lv-dk .lv-search-bar.lv-compact:focus-within { box-shadow: 0 0 0 3px var(--lv-cta-focus); }
.lv-dk .lv-search-bar.lv-compact.lv-is-error { box-shadow: 0 0 0 2px var(--destructive-strong); }
.lv-dk .lv-search-bar input { font-size: 15px; }
.lv-dk .lv-search-bar.lv-compact .lv-search-go.lv-search-go { height: 40px; padding: 0 16px 0 18px; gap: 6px; font-size: 15px; }
.lv-dk .lv-search-bar.lv-compact .lv-search-go svg { width: 16px; height: 16px; }
.lv-dk .lv-search-err { position: absolute; left: 0; right: 0; bottom: calc(100% + 14px); margin: 0; padding: 10px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--card); box-shadow: var(--lv-shadow-card); font-size: 13.5px; line-height: 1.35; }
.lv { counter-reset: lv-ch; }
.lv > section:not(#hero, #newsletter):has(.lv-blk-head > .lv-eyebrow, .lv-moto-eyebrow), .lv [data-chapter] { counter-increment: lv-ch; }
.lv > section:not(#hero, #newsletter) .lv-blk-head > .lv-eyebrow::before, .lv [data-chapter] > .lv-eyebrow::before { content: var(--lv-num, counter(lv-ch, decimal-leading-zero)); width: auto; height: auto; padding-right: 36px; border-radius: 0; color: var(--lv-num-ink, transparent); background: linear-gradient(var(--lane), var(--lane)) right center / 24px 3px no-repeat; font-variant-numeric: tabular-nums; }
.lv > section:not(#hero, #newsletter) .lv-moto-eyebrow { --lv-dash: #ff9838; display: flex; align-items: center; gap: 12px; }
.lv > section:not(#hero, #newsletter) .lv-moto-car .lv-moto-eyebrow { --lv-dash: #7cb6ff; }
.lv > section:not(#hero, #newsletter) .lv-moto-eyebrow::before { content: var(--lv-num, counter(lv-ch, decimal-leading-zero)); flex: none; padding-right: 36px; color: var(--lv-num-ink, transparent); background: linear-gradient(var(--lv-dash), var(--lv-dash)) right center / 24px 3px no-repeat; font-variant-numeric: tabular-nums; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
.lv-dk { padding-left: 16px; gap: 12px; }
.lv-dk-now { display: none; }
.lv-dk .lv-search-bar.lv-compact { padding-left: 16px; }
.lv-dk .lv-search-bar.lv-compact .lv-search-go.lv-search-go { padding: 0 15px; }
.lv-dk .lv-search-bar.lv-compact .lv-search-go svg { display: none; }
.lv-dk[data-consent] { padding-left: 5px; }
.lv-dk[data-consent] .lv-dk-chapters { display: none; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
.lv-dk.lv-dk-pulse .lv-search-bar { animation: lv-dk-pulse 240ms var(--ease-out); }
.lv-dk-now { animation: lv-dk-swap 220ms var(--ease-out); }
.lv-dk-ride[data-pitch] { animation: lv-dk-pitch 560ms var(--ease-out); }
.lv-dk-car[data-back] .lv-dk-ride[data-pitch] { animation-name: lv-dk-pitch-back; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) {
.lv-dk, .lv-dk.lv-on, .lv-dk-tick::after, .lv-dk-car, .lv-dk-car svg { transition: none; }
}