.ckit{--ckit-purple:#c8bcff;--ckit-text:#f0eff9;--ckit-muted:#b0bbd1;box-sizing:border-box;min-width:0;padding:30px;border:1px solid #38435c;border-radius:26px;color:var(--ckit-text);background:radial-gradient(ellipse at 96% 0%,#64509326,transparent 47%),#141d2d}.ckit *{box-sizing:border-box}.ckit h2,.ckit h3,.ckit p{margin:0}.ckit-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:30px}.ckit-eyebrow{display:block;color:#bbb1e3;font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}.ckit-heading h2{font-size:clamp(25px,3vw,33px);line-height:1.2;letter-spacing:-.03em;margin-bottom:10px}.ckit-heading p{color:var(--ckit-muted);font-size:14px;line-height:1.65;max-width:560px}.ckit-tag{flex-shrink:0;white-space:nowrap;padding:8px 11px;border:1px solid #4b4668;border-radius:30px;background:#74639714;color:#d5cbee;font-size:10px}.ckit-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.7fr);gap:34px;align-items:start}.ckit-workflow{min-width:0}.ckit-steps{display:grid;gap:24px;list-style:none;margin:0;padding:0}.ckit-steps li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:13px}.ckit-number{display:grid;place-content:center;width:30px;height:30px;color:#d2c8fb;font-size:11px;font-weight:750;background:#a08bdf16;border:1px solid #67578470;border-radius:10px}.ckit-steps h3{font-size:16px;line-height:1.5;margin:2px 0 6px}.ckit-steps p{font-size:13px;color:var(--ckit-muted);line-height:1.7}.ckit-small-note{display:block;color:#929fb8;font-size:11px;line-height:1.6;margin-top:7px}.ckit-downloads{display:flex;align-items:center;flex-wrap:wrap;gap:13px;margin-top:13px}.ckit-button{display:inline-flex;justify-content:center;align-items:center;gap:13px;padding:12px 16px;min-height:44px;border:1px solid transparent;border-radius:12px;font:inherit;font-size:12px;font-weight:750;text-decoration:none;cursor:pointer;text-align:center;line-height:1.4;max-width:100%}.ckit-button-light{background:#2d304d;color:#e1dbff;border-color:#575471}.ckit-button-light:hover{background:#383956}.ckit-source{color:#c8bdf7;font-size:12px;text-underline-offset:4px;line-height:1.6}.ckit-banner-sample{display:block;width:100%;height:auto;margin-top:13px;border:1px solid #494266;border-radius:11px;background:#0c1020}.ckit-personal{margin-top:24px;padding:19px;border:1px solid #625583;border-radius:17px;background:linear-gradient(125deg,#352b4c,#20263c)}.ckit-personal-label{display:flex;align-items:center;gap:8px;font-size:13px;color:#e8e1ff;margin-bottom:13px}.ckit-personal-label>span{font-size:21px;color:#cbb9ff}.ckit-link-input{display:block;min-width:0;max-width:100%;width:100%;padding:11px 12px;border:1px solid #5b526e;border-radius:9px;background:#131a2c;color:#e0d9f3;font:12px/1.5 monospace;overflow:hidden;text-overflow:ellipsis}.ckit-button-primary{display:flex;width:100%;background:var(--ckit-purple);color:#16152a;margin-top:11px;font-size:13px;min-height:47px}.ckit-button-primary:hover{background:#d7ceff}.ckit-personal p{font-size:12px;line-height:1.6;color:#c2bcd5}.ckit-copy-feedback{margin-top:9px!important;min-height:19px}.ckit-preview{padding:17px;border:1px solid #343e55;border-radius:21px;background:linear-gradient(160deg,#0f1727,#191b32);min-width:0}.ckit-preview-heading{display:flex;align-items:center;justify-content:space-between;gap:9px;font-size:11px;color:#bec5d8;margin-bottom:18px}.ckit-preview-heading button{background:#252c40;border:1px solid #3c455f;border-radius:7px;color:#d4cde8;padding:6px 8px;min-height:32px;font:inherit;font-size:10px;cursor:pointer}.ckit-phone-wrap{width:min(100%,226px);margin:auto}.ckit-phone{position:relative;isolation:isolate;aspect-ratio:9/17.8;width:100%;overflow:hidden;border:5px solid #060a14;outline:1px solid #515368;border-radius:31px;background:#131a2b;box-shadow:0 18px 42px #0005}.ckit-camera{position:absolute;top:7px;left:calc(50% - 28px);width:56px;height:14px;border-radius:20px;background:#04060d;z-index:4}.ckit-video-bg{position:absolute;inset:0;overflow:hidden;background:linear-gradient(150deg,#254055,#242344 47%,#453755)}.ckit-video-bg i{position:absolute;border:1px solid #a69ee43b;border-radius:50%;width:250px;height:250px;right:-130px;top:40px;transform:rotate(-30deg) scaleY(1.7)}.ckit-video-bg i:nth-child(2){right:-100px;top:85px}.ckit-video-bg i:nth-child(3){right:-70px;top:130px}.ckit-video-label{position:absolute;top:31%;left:20px;right:32px;color:#f3edff;z-index:1}.ckit-video-label>span{font-size:6px;letter-spacing:.12em;color:#d6c6ee}.ckit-video-label>strong{display:block;font-size:43px;line-height:.97;letter-spacing:-.06em;font-weight:800;margin:12px 0}.ckit-video-label>small{font-size:8px;color:#d1c6e2}.ckit-zone{position:absolute;left:10px;right:35px;height:43px;border:1px dashed #c8bcffab;border-radius:9px;background:#c8bcff0d}.ckit-zone-top{top:14%;animation:ckit-upper-zone 10s ease-in-out infinite}.ckit-zone-bottom{top:61%;animation:ckit-lower-zone 10s ease-in-out infinite}.ckit-moving-banner{position:absolute;left:15px;right:40px;top:calc(14% + 5px);z-index:2;animation:ckit-move 10s ease-in-out infinite;filter:drop-shadow(0 3px 5px #0005)}.ckit-moving-banner img{display:block;width:100%;height:auto;border-radius:5px}.ckit-subtitles{position:absolute;bottom:21%;left:15px;right:40px;z-index:1;color:white;font-size:8px;font-weight:700;text-align:center;line-height:1.6;background:#101626c9;border-radius:4px;padding:3px}.ckit-subtitles span{font-size:7px;color:#d4d4e2;font-weight:400}.ckit-social{position:absolute;right:10px;bottom:22%;display:grid;gap:17px;color:#f4edff;font-size:22px;text-shadow:0 1px 4px #0008}.ckit-video-bottom{position:absolute;left:16px;right:16px;bottom:11px;display:grid;gap:7px;font-size:8px;color:#eee7fc}.ckit-video-bottom span{font-size:7px;color:#c2bbd4}.ckit-video-bottom i{display:block;height:3px;width:42%;border-radius:3px;background:#eee6fc;margin:10px auto 0}.ckit-position-caption{position:relative;min-height:34px;text-align:center;font-size:10px;color:#c6bedb;margin-top:17px;line-height:1.5}.ckit-position-caption>span{position:absolute;inset:0}.ckit-caption-top{animation:ckit-caption-top 10s infinite}.ckit-caption-bottom{animation:ckit-caption-bottom 10s infinite}.ckit-preview-note{font-size:10px;line-height:1.7;color:#a8b0c7;border-top:1px solid #343c51;padding-top:12px!important}.ckit-final-note{display:flex;gap:10px;align-items:flex-start;margin-top:25px;padding:14px 16px;border:1px solid #3f625b66;border-radius:12px;background:#5ca68d0a;color:#a8d7c8}.ckit-final-note>span{font-size:15px}.ckit-final-note p{font-size:11px;line-height:1.7;color:#b6c8c9}.ckit-locked{display:flex;align-items:flex-start;gap:17px;padding:23px;border:1px dashed #4d536d;border-radius:17px;background:#10192a}.ckit-lock{font-size:28px;color:#c0b5e3;line-height:1}.ckit-locked h3{font-size:17px;margin-bottom:8px}.ckit-locked p{font-size:13px;line-height:1.7;color:#aebad1;max-width:650px}.ckit-locked a{display:inline-block;margin-top:12px;color:#c7bcf9;font-size:12px}.ckit :focus-visible{outline:2px solid #e4dfff;outline-offset:4px}.ckit-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.ckit-paused .ckit-phone *,.ckit-paused .ckit-position-caption *{animation-play-state:paused!important}
@keyframes ckit-move{0%,35%,100%{top:calc(14% + 5px)}45%,85%{top:calc(61% + 5px)}}@keyframes ckit-upper-zone{0%,35%,100%{opacity:1}45%,85%{opacity:.18}}@keyframes ckit-lower-zone{0%,35%,100%{opacity:.18}45%,85%{opacity:1}}@keyframes ckit-caption-top{0%,35%,95%,100%{opacity:1}40%,90%{opacity:0}}@keyframes ckit-caption-bottom{0%,35%,95%,100%{opacity:0}45%,85%{opacity:1}}
@media(max-width:800px){.ckit{padding:23px}.ckit-grid{grid-template-columns:minmax(0,1fr);gap:24px}.ckit-preview{max-width:430px;width:100%;justify-self:center}.ckit-heading{flex-wrap:wrap;gap:12px;margin-bottom:24px}.ckit-tag{padding:6px 10px}.ckit-phone-wrap{width:min(100%,228px)}}
@media(max-width:420px){.ckit{padding:17px;border-radius:19px}.ckit-heading h2{font-size:25px}.ckit-heading p{font-size:12px}.ckit-steps{gap:22px}.ckit-steps li{grid-template-columns:24px minmax(0,1fr);gap:9px}.ckit-number{width:24px;height:26px;font-size:9px;border-radius:8px}.ckit-steps h3{font-size:14px}.ckit-steps p{font-size:12px}.ckit-downloads{gap:11px}.ckit-button{font-size:11px;padding:11px 12px}.ckit-personal{padding:14px}.ckit-personal-label{font-size:12px}.ckit-preview{padding:13px}.ckit-preview-heading{font-size:10px}.ckit-locked{padding:16px;gap:10px}.ckit-locked h3{font-size:15px}.ckit-final-note{padding:12px}.ckit-button-primary{font-size:12px}}
@media(prefers-reduced-motion:reduce){.ckit-phone *,.ckit-position-caption *{animation:none!important}.ckit-zone-bottom,.ckit-caption-bottom{display:none}.ckit [data-creator-motion]{display:none}}
.ckit-controls{display:flex;flex-wrap:wrap;gap:18px 24px;padding-bottom:25px;margin-bottom:26px;border-bottom:1px solid #354058}.ckit-controls>div{min-width:0;max-width:100%}.ckit-control-label{display:block;font-size:10px;font-weight:700;letter-spacing:.03em;color:#b3bdd2;margin-bottom:9px}.ckit-segments{display:flex;gap:4px;padding:4px;background:#0d1525;border:1px solid #354058;border-radius:12px;max-width:100%}.ckit-segments button{padding:9px 12px;min-height:40px;border:1px solid transparent;border-radius:8px;color:#aebbd2;background:transparent;font:inherit;font-size:11px;cursor:pointer}.ckit-segments button small{display:inline-block;margin-left:5px;font-size:9px;opacity:.8}.ckit-segments button[aria-pressed=true]{color:#eae3ff;background:#34304e;border-color:#6e608d}.ckit{--ckit-upper:14%;--ckit-lower:61%}.ckit-moving-banner{top:calc(var(--ckit-upper) + 5px)}.ckit-zone-top{top:var(--ckit-upper)}.ckit-zone-bottom{top:var(--ckit-lower)}
@keyframes ckit-move{0%,35%,100%{top:calc(var(--ckit-upper) + 5px)}45%,85%{top:calc(var(--ckit-lower) + 5px)}}
.ckit[data-creator-style=card]{--ckit-lower:49%}.ckit[data-creator-style=card] .ckit-moving-banner{width:58%;right:auto}.ckit[data-creator-style=card] .ckit-zone{right:auto;width:calc(58% + 10px);height:87px}.ckit[data-creator-style=card] .ckit-banner-sample{max-width:280px}.ckit[data-creator-format=horizontal]{--ckit-upper:7%;--ckit-lower:46%}.ckit[data-creator-format=horizontal] .ckit-phone-wrap{width:100%;max-width:440px}.ckit[data-creator-format=horizontal] .ckit-phone{aspect-ratio:16/9;border-radius:13px;border-width:4px}.ckit[data-creator-format=horizontal] .ckit-camera,.ckit[data-creator-format=horizontal] .ckit-social{display:none}.ckit[data-creator-format=horizontal] .ckit-video-label{left:53%;right:7px;top:19%}.ckit[data-creator-format=horizontal] .ckit-video-label>strong{font-size:clamp(20px,3vw,34px);margin:7px 0}.ckit[data-creator-format=horizontal] .ckit-video-label>small{font-size:6px}.ckit[data-creator-format=horizontal] .ckit-video-label>span{font-size:5px}.ckit[data-creator-format=horizontal] .ckit-moving-banner{width:45%;left:10px;right:auto}.ckit[data-creator-format=horizontal] .ckit-zone{left:5px;right:auto;width:calc(45% + 10px);height:calc(25% - 6px)}.ckit[data-creator-format=horizontal] .ckit-subtitles{left:15px;right:15px;bottom:17%;font-size:6px;line-height:1.3;padding:2px}.ckit[data-creator-format=horizontal] .ckit-subtitles span{font-size:5px}.ckit[data-creator-format=horizontal] .ckit-video-bottom{bottom:5px;font-size:5px;gap:2px;left:12px;right:12px}.ckit[data-creator-format=horizontal] .ckit-video-bottom span{font-size:4px}.ckit[data-creator-format=horizontal] .ckit-video-bottom i{width:100%;height:2px;margin-top:4px}.ckit[data-creator-format=horizontal][data-creator-style=card]{--ckit-lower:34%}.ckit[data-creator-format=horizontal][data-creator-style=card] .ckit-moving-banner{width:32%}.ckit[data-creator-format=horizontal][data-creator-style=card] .ckit-zone{width:calc(32% + 10px);height:36%}.ckit-media{border-top:1px solid #354058;margin-top:28px;padding-top:24px}.ckit-media h3{font-size:17px}.ckit-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:16px}.ckit-media-item{min-width:0;padding:16px;border:1px solid #354058;border-radius:15px;background:#0d1627}.ckit-media-item>strong{display:block;font-size:13px;overflow-wrap:anywhere}.ckit-media-item video{display:block;width:100%;height:230px;object-fit:contain;background:#070d16;border-radius:10px;margin:13px 0}.ckit-media-item .ckit-button{width:100%}
@media(max-width:420px){.ckit-controls{gap:15px;margin-bottom:23px}.ckit-controls>div{width:100%}.ckit-segments button{flex:1;min-width:0;padding:8px;font-size:10px}.ckit-segments button small{display:block;margin:3px 0 0}.ckit-media-grid{grid-template-columns:1fr}.ckit-media-item video{height:250px}.ckit[data-creator-format=horizontal] .ckit-video-label>strong{font-size:22px}.ckit[data-creator-format=horizontal] .ckit-video-label>small{font-size:5px}}
/* Keep both examples clear of captions even in the narrowest 16:9 preview. */
.ckit[data-creator-format=horizontal]{--ckit-lower:40%}
.ckit[data-creator-format=horizontal][data-creator-style=card]{--ckit-lower:25%}
/* Animated originals keep their 1080 × 216 proportions in both frame formats. */
.ckit [hidden]{display:none!important}
.ckit-moving-banner video{display:block;width:100%;height:auto;aspect-ratio:5/1;object-fit:contain;border-radius:5px}
.ckit-animated-sample{aspect-ratio:5/1;object-fit:contain;background:repeating-conic-gradient(#172037 0 25%,#212840 0 50%) 0 / 18px 18px}
@media(max-width:420px){.ckit-segments[aria-label="Вариант баннера"]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.ckit-segments[aria-label="Вариант баннера"] button{font-size:9px;padding:8px 4px;overflow-wrap:anywhere}}