.kb{isolation:isolate;background:#0b0b0c;border:1px solid #ffffff14;border-radius:20px;grid-template-columns:1fr;min-height:240px;margin-bottom:28px;display:grid;position:relative;overflow:hidden}.kb:before{content:"";z-index:0;background:radial-gradient(60% 120% at 50% 110%,#ff8a0038,#0000 70%),linear-gradient(#111113,#0b0b0c);position:absolute;inset:0}.kb-video{z-index:1;position:relative}.kb-stage{aspect-ratio:8/3;--bl:66%;--bt:42%;--bw:6%;--bh:44%;--draw:0;--boxa:0;width:100%;position:relative}.kb-vid{opacity:.92;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 55%,#0000 100%);mask-image:linear-gradient(#000 55%,#0000 100%)}.kb-video-el{object-fit:cover;width:100%;height:100%;display:block}.kb-box{left:var(--bl);top:var(--bt);width:var(--bw);height:var(--bh);border:1.5px dashed var(--accent);pointer-events:none;opacity:var(--boxa);-webkit-mask-image:conic-gradient(from 0deg, #000 calc(var(--draw) * 1deg), transparent calc(var(--draw) * 1deg));-webkit-mask-image:conic-gradient(from 0deg, #000 calc(var(--draw) * 1deg), transparent calc(var(--draw) * 1deg));mask-image:conic-gradient(from 0deg, #000 calc(var(--draw) * 1deg), transparent calc(var(--draw) * 1deg));border-radius:4px;position:absolute;box-shadow:0 0 12px #ff8a0040}.kb-prompt{z-index:3;white-space:nowrap;color:#ffffffeb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;background:#141416b8;border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:2px;max-width:70%;padding:7px 12px;font-size:12px;transition:opacity .35s,transform .35s;display:flex;position:absolute;bottom:11%;left:50%;transform:translate(-50%,8px)}.kb-prompt.on{opacity:1;transform:translate(-50%)}.kb-stage[data-empty="0"] .kb-ph{display:none}.kb-stage[data-empty="1"] .kb-ph{color:#fff9}.kb-caret{background:var(--accent);width:1.5px;height:13px;margin-left:1px;animation:.9s step-end infinite kb-blink}@keyframes kb-blink{50%{opacity:0}}.kb-sweep{z-index:2;pointer-events:none;opacity:0;position:absolute;inset:0;overflow:hidden}.kb-sweep:before{content:"";background:linear-gradient(90deg,#0000,#ffbe6e8c,#0000);width:30%;position:absolute;top:0;bottom:0;left:-30%;transform:skew(-18deg)}.kb-sweep.on{opacity:1}.kb-sweep.on:before{animation:.75s ease-in-out forwards kb-sweep}@keyframes kb-sweep{to{left:110%}}.kb-credit{z-index:3;letter-spacing:.02em;color:#ffffffb8;text-shadow:0 1px 6px #000000b3;opacity:0;pointer-events:none;font-size:9.5px;transition:opacity .3s;position:absolute;bottom:3%;right:3%}.kb-credit.on{opacity:1}.kb-ten{z-index:2;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 18px #0000008c;opacity:0;font-size:clamp(30px,5vw,54px);font-weight:800;line-height:1;transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1);position:absolute;top:8%;right:6%;transform:translateY(8px)scale(.94)}.kb-ten.on{opacity:1;transform:none}.kb-refs{display:none}.kb-copy{z-index:2;text-align:center;flex-direction:column;align-items:center;gap:8px;padding:4px 20px 22px;display:flex;position:relative}.kb-kicker{letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin:0;font-size:11px;font-weight:600}.kb-mark{aspect-ratio:1154/246;width:min(82%,380px);margin:0;position:relative}.kb-mark-logo,.kb-mark-logo:after{position:absolute;inset:0;-webkit-mask:url(/showcase/news/kling4-logo.webp) 50%/100% 100% no-repeat;mask:url(/showcase/news/kling4-logo.webp) 50%/100% 100% no-repeat}.kb-mark-logo{clip-path:inset(0 100% 0 0);background:linear-gradient(#fff 0%,#cfd3da 38%,#7d828c 52%,#e9ebef 70%,#fff 100%);animation:.9s cubic-bezier(.2,.8,.2,1) .15s forwards kb-logo-in}.kb-mark-logo:after{content:"";background:linear-gradient(100deg,#0000 38%,#ffd29a 47%,#ff8a00 50%,#ffd29a 53%,#0000 62%) 130% 0/300% 100%;animation:6s ease-in-out 1.4s infinite kb-logo-sheen}@keyframes kb-logo-in{to{clip-path:inset(0)}}@keyframes kb-logo-sheen{0%,55%{background-position:130% 0}85%,to{background-position:-30% 0}}.sr-only-kb{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.kb-sub{color:#ffffffb8;max-width:46ch;margin:0;font-size:13px;line-height:1.45}.kb-price{color:#ffffffe6;margin:0;font-size:13px}.kb-price b{color:var(--accent);font-size:15px}.kb-cta{margin-top:4px}@media (max-width:899px){.kb-prompt{max-width:94%;padding:5px 10px;font-size:11px;bottom:12%;overflow:hidden}}@media (min-width:900px){.kb{grid-template-columns:220px minmax(0,1fr) minmax(0,1.1fr);align-items:center;min-height:260px;padding:0}.kb-video{grid-area:1/3;align-self:stretch;min-height:260px}.kb-stage{width:auto;height:100%;position:absolute;top:0;right:0}.kb-vid{-webkit-mask-composite:source-in;-webkit-mask-image:linear-gradient(90deg,#0000 0,#00000059 14%,#000 42%),linear-gradient(#000 82%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#00000059 14%,#000 42%),linear-gradient(#000 82%,#0000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}.kb-refs{z-index:2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0f;border:1px solid #ffffff14;border-radius:14px;grid-area:1/1;grid-template-columns:repeat(2,1fr);gap:6px;margin:0 0 0 24px;padding:8px;display:grid;position:relative}.kb-ref{aspect-ratio:1;opacity:0;background:#1b1b1e;border-radius:8px;transition:opacity .4s,transform .45s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;transform:scale(.88)}.kb-ref.on{opacity:1;transform:none}.kb-ref-add{color:#fff9;opacity:1;justify-content:center;align-items:center;display:flex;transform:none}.kb-ref-add .kb-plus{transition:opacity .3s}.kb-ref-add.on .kb-plus{opacity:0}.kb-swap{opacity:0;transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1);position:absolute;inset:0;transform:translate(100%)}.kb-swap.on,.kb-ref-add.on .kb-swap{opacity:1;transform:none}.kb-bar{border:1.5px solid var(--accent);color:#fff;border-radius:8px;grid-column:1/-1;align-items:center;gap:6px;height:26px;margin-top:2px;padding:0 8px;font-size:12px;display:flex;box-shadow:0 0 14px #ff8a0059}.kb-of{color:#ffffff80}.kb-bar i{--p:0;height:8px;-webkit-mask-image:linear-gradient(90deg, #000 calc(var(--p) * 100%), #00000038 calc(var(--p) * 100%));-webkit-mask-image:linear-gradient(90deg, #000 calc(var(--p) * 100%), #00000038 calc(var(--p) * 100%));mask-image:linear-gradient(90deg, #000 calc(var(--p) * 100%), #00000038 calc(var(--p) * 100%));background:repeating-linear-gradient(90deg,#ff8a00d9 0 6px,#0000 6px 9px);border-radius:4px;flex:1}.kb-copy{grid-area:1/2;padding:24px 12px}}@media (prefers-reduced-motion:reduce){.kb-caret,.kb-sweep.on:before,.kb-mark-logo,.kb-mark-logo:after{animation:none}.kb-mark-logo{clip-path:none}.kb-ref,.kb-ten,.kb-prompt,.kb-swap,.kb-credit{transition:none}}
