/* K-BLACK Thiệp mời online v2 — khung chung + 9 kiểu trình bày (skin); hero riêng nằm trong designs.js */
.kbi{position:relative;background:var(--bg);color:var(--ink);font-family:var(--fb),system-ui,sans-serif;font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100%;overflow-x:hidden}
.kbi *{box-sizing:border-box}.kbi p{margin:0 0 .5em}
.kbi .paper{max-width:560px;margin:0 auto;background:var(--pp);position:relative;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.04),0 30px 80px -30px rgba(0,0,0,.3)}
.kbi .s{position:relative;padding:54px 28px;text-align:center}
.kbi .hero{min-height:min(100svh,880px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 26px;overflow:hidden}
.kbi.thumb .hero{min-height:0;height:760px}.kbi.thumb .rv{opacity:1;transform:none}
.kbi .kk{font:500 12px var(--fb);letter-spacing:.32em;text-transform:uppercase;color:var(--mu);margin:0 0 10px}
.kbi .nm{font:400 58px/1.05 var(--fd);color:var(--ac);margin:6px 0;display:flex;flex-direction:column;align-items:center}
.kbi .nm .amp{font-size:.5em;margin:4px 0;opacity:.85}.kbi .nm.sc{font-family:var(--fs);font-size:62px}
.kbi .hd{font:500 15px var(--fb);letter-spacing:.22em;margin:12px 0 0}.kbi .lun{font-size:13px;color:var(--mu);font-style:italic;margin:6px 0 0}
.kbi .ph{background:var(--a2) center/cover no-repeat;position:relative}
.kbi .ph0{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.55),transparent 55%),linear-gradient(140deg,var(--a2),var(--ac))}
.kbi .ph0 span{font:400 34px var(--fd);color:#fff;opacity:.92;text-shadow:0 2px 10px rgba(0,0,0,.18)}
.kbi .st{font:400 38px/1.15 var(--fs),var(--fd);color:var(--ac);margin:0 0 22px}
.kbi .sub{color:var(--mu);font-size:14px;margin:-10px 0 20px}
.kbi .dv{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto 18px}.kbi .dv i{width:56px;height:1px;background:var(--ac);opacity:.7}.kbi .dv b{width:7px;height:7px;transform:rotate(45deg);border:1px solid var(--ac)}
.kbi .gst{font-size:15px;margin:0 0 16px}.kbi .gst b{display:inline-block;margin-top:4px;font:400 30px/1.2 var(--fs),var(--fd);color:var(--ac)}
.kbi .tx{max-width:420px;margin:0 auto;font-size:15.5px}
.kbi .fg{display:grid;grid-template-columns:1fr 1fr;gap:18px}.kbi .fc h3{font:600 12px var(--fb);letter-spacing:.24em;text-transform:uppercase;color:var(--ac);margin:0 0 8px}.kbi .fc p{margin:2px 0;font-size:14.5px}.kbi .fc small{color:var(--mu);font-size:12.5px}
.kbi .bd{display:flex;align-items:center;justify-content:center;gap:16px}.kbi .bd span{font:500 13px var(--fb);letter-spacing:.14em;text-transform:uppercase;border-top:1px solid var(--ac);border-bottom:1px solid var(--ac);padding:6px 4px;min-width:96px}.kbi .bd strong{font:400 64px/1 var(--fd);color:var(--ac)}
.kbi .tm{margin:16px 0 0}
.kbi .cal{max-width:300px;margin:24px auto 0;border:1px solid var(--a2);border-radius:14px;padding:14px}.kbi .ch{font:600 12px var(--fb);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.kbi .cg{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;font-size:12.5px}.kbi .cg b{font-weight:500;color:var(--mu);font-size:11px}.kbi .cg i{font-style:normal;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.kbi .cg i.on{background:var(--ac);color:var(--pp);font-weight:700;position:relative}.kbi .cg i.on::after{content:'♥';position:absolute;top:-9px;right:-3px;font-size:11px;color:var(--ac)}
.kbi .cd{display:flex;justify-content:center;gap:10px;margin-top:24px}.kbi .cd div{min-width:64px;padding:12px 6px;border-radius:12px;background:var(--a2)}.kbi .cd b{display:block;font:600 24px var(--fd);color:var(--ink)}.kbi .cd small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mu)}
.kbi.dk .cd div{background:rgba(255,255,255,.07)}.kbi.dk .cg i.on{color:var(--bg)}
.kbi .eg{display:grid;gap:14px}.kbi .ec{border:1px solid var(--a2);border-radius:16px;padding:22px 18px}.kbi .ec h3{font:400 28px/1.2 var(--fs),var(--fd);color:var(--ac);margin:0 0 6px}
.kbi .et{font-weight:600;margin:0;letter-spacing:.04em}.kbi .ep{margin:6px 0 0;font-weight:500}.kbi .ec small{color:var(--mu)}
.kbi .eb{display:flex;gap:8px;justify-content:center;margin-top:14px;flex-wrap:wrap}.kbi .eb a{font-size:13px;padding:8px 14px;border-radius:99px;border:1px solid var(--ac);color:var(--ac);text-decoration:none}.kbi .eb a:first-child{background:var(--ac);color:var(--pp)}
.kbi .tl{display:grid;gap:18px;text-align:left;max-width:420px;margin:0 auto}.kbi .ti{display:flex;gap:16px;align-items:center}.kbi .td{font-size:12px;letter-spacing:.18em;color:var(--ac);font-weight:700}.kbi .ti h3{margin:2px 0;font:600 17px var(--fd)}.kbi .ti p{margin:0;color:var(--mu);font-size:14px}
.kbi .sq{width:64px;aspect-ratio:1;border-radius:50%;flex:none;box-shadow:0 0 0 3px var(--pp),0 0 0 4px var(--ac)}
.kbi .ag{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.kbi .ai{aspect-ratio:1;background:center/cover;border-radius:8px;display:block}.kbi .ai:nth-child(5n+1){grid-column:span 2;grid-row:span 2}
.kbi .vw{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden}.kbi .vw iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.kbi .fm{display:grid;gap:10px;max-width:400px;margin:0 auto;text-align:left}
.kbi .fm input,.kbi .fm textarea,.kbi .fm select{width:100%;font:400 15px var(--fb);color:var(--ink);background:transparent;border:1px solid var(--a2);border-radius:12px;padding:12px 14px;outline:none}
.kbi.dk .fm input,.kbi.dk .fm textarea,.kbi.dk .fm select{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}.kbi .fm select option{color:#222}
.kbi .fm input:focus,.kbi .fm textarea:focus{border-color:var(--ac)}
.kbi .fm button[type=submit]{font:600 15px var(--fb);padding:13px;border-radius:12px;border:0;background:var(--ac);color:var(--pp);cursor:pointer}.kbi .fm button[disabled]{opacity:.6}
.kbi .msg{margin:0;font-size:13.5px;color:var(--ac);text-align:center;min-height:1em}
.kbi .seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}.kbi .seg label{position:relative}.kbi .seg input{position:absolute;opacity:0}.kbi .seg span{display:block;text-align:center;padding:11px 6px;border:1px solid var(--a2);border-radius:12px;font-size:13.5px;cursor:pointer}.kbi .seg input:checked+span{border-color:var(--ac);background:var(--a2);font-weight:600}
.kbi.dk .seg input:checked+span{background:rgba(255,255,255,.1)}
.kbi .qw{display:flex;flex-wrap:wrap;gap:6px}.kbi .qw button{font:400 12.5px var(--fb);padding:6px 10px;border-radius:99px;border:1px dashed var(--ac);background:transparent;color:var(--ink);cursor:pointer}
.kbi .wl{max-width:420px;margin:22px auto 0;display:grid;gap:10px;max-height:360px;overflow:auto;text-align:left}.kbi .wi{background:var(--a2);border-radius:14px;padding:12px 14px}.kbi .wi p{margin:0 0 4px;font-size:14px}.kbi .wi b{font-weight:600;font-size:13px;color:var(--ac)}.kbi.dk .wi{background:rgba(255,255,255,.06)}
.kbi .gg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.kbi .gc{border:1px solid var(--a2);border-radius:16px;padding:18px}.kbi .gc h3{margin:0 0 10px;font:600 14px var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--ac)}.kbi .gc img{width:170px;max-width:100%;border-radius:10px;background:#fff;padding:6px}.kbi .gc p{font-size:13.5px;margin:10px 0}.kbi .gc button{font:400 13px var(--fb);padding:8px 14px;border-radius:99px;border:1px solid var(--ac);background:transparent;color:var(--ac);cursor:pointer}
.kbi .ty{font:400 52px/1 var(--fs),var(--fd);color:var(--ac);margin:10px 0 16px}
.kbi .mono{width:84px;height:84px;margin:26px auto 18px;border-radius:50%;border:1px solid var(--ac);display:flex;align-items:center;justify-content:center;font:400 24px var(--fd);color:var(--ac)}
.kbi .by{display:inline-block;font-size:12px;color:var(--mu);text-decoration:none;padding:6px 12px;border-radius:99px;border:1px solid var(--a2)}
/* ---------- 9 kiểu trình bày ---------- */
/* editorial: căn trái, số thứ tự từng phần */
.kbi.sk-editorial .paper{counter-reset:sec}.kbi.sk-editorial .s:not(.hero):not(.thanks){text-align:left}
.kbi.sk-editorial .st{font:400 34px/1.1 var(--fd);color:var(--ink);letter-spacing:-.01em;border-top:1px solid var(--ink);padding-top:14px}
.kbi.sk-editorial .st::before{counter-increment:sec;content:counter(sec,decimal-leading-zero) " —";display:block;font:600 11px var(--fb);letter-spacing:.24em;color:var(--ac);margin-bottom:8px}
.kbi.sk-editorial .tx,.kbi.sk-editorial .fm,.kbi.sk-editorial .tl,.kbi.sk-editorial .wl,.kbi.sk-editorial .cal{margin-left:0}.kbi.sk-editorial .bd,.kbi.sk-editorial .cd,.kbi.sk-editorial .eb,.kbi.sk-editorial .dv{justify-content:flex-start}.kbi.sk-editorial .dv{margin-left:0}
.kbi.sk-editorial .ec{border:0;border-left:2px solid var(--ac);border-radius:0;padding:4px 0 4px 16px}.kbi.sk-editorial .ec h3{font:600 20px var(--fd)}
/* cards: từng phần là một thẻ nổi trên nền */
.kbi.sk-cards .paper{background:transparent;box-shadow:none;padding:12px 12px 30px}.kbi.sk-cards .s{background:var(--pp);border-radius:26px;margin:12px 0;box-shadow:0 14px 40px -24px rgba(0,0,0,.4)}.kbi.sk-cards .hero{margin-top:0}
/* news: tờ báo – cột, đường kẻ đôi, chữ có chân */
.kbi.sk-news .s:not(.hero){border-top:3px double var(--ink);text-align:left}.kbi.sk-news .st{font:700 26px/1.1 var(--fd);color:var(--ink);text-transform:uppercase;letter-spacing:.02em;border-bottom:1px solid var(--ink);padding-bottom:8px}
.kbi.sk-news .tx{font-family:var(--fd);text-align:justify;column-count:2;column-gap:20px;column-rule:1px solid var(--a2);margin:0}.kbi.sk-news .ec{border-radius:0;border:1px solid var(--ink)}.kbi.sk-news .ec h3{font:700 20px var(--fd);color:var(--ink)}.kbi.sk-news .bd,.kbi.sk-news .cd,.kbi.sk-news .eb{justify-content:flex-start}.kbi.sk-news .cal{margin-left:0}
/* ticket: cuống vé có răng cưa */
.kbi.sk-ticket .paper{background:transparent;box-shadow:none;padding:10px 14px 30px}.kbi.sk-ticket .s:not(.hero){background:var(--pp);margin:14px 0;border-radius:14px;-webkit-mask:radial-gradient(circle at 0 50%,transparent 12px,#000 12.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,transparent 12px,#000 12.5px) right/51% 100% no-repeat;border-top:4px solid var(--ac)}
.kbi.sk-ticket .st{font:700 22px var(--fd);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}.kbi.sk-ticket .ec{border-style:dashed}
/* scrap: giấy ghi chú xếp nghiêng, băng dính */
.kbi.sk-scrap .paper{background:transparent;box-shadow:none;padding:10px 16px 30px}.kbi.sk-scrap .s:not(.hero){background:var(--pp);margin:26px 0;box-shadow:0 10px 24px -14px rgba(0,0,0,.45)}
.kbi.sk-scrap .s:not(.hero):nth-of-type(odd){transform:rotate(-1.2deg)}.kbi.sk-scrap .s:not(.hero):nth-of-type(even){transform:rotate(1deg)}
.kbi.sk-scrap .s:not(.hero)::before{content:'';position:absolute;top:-12px;left:50%;width:96px;height:26px;margin-left:-48px;background:var(--a2);opacity:.85;transform:rotate(-3deg)}
.kbi.sk-scrap .st{font:400 34px var(--fd);color:var(--ac)}.kbi.sk-scrap .rv{transition:opacity .9s}.kbi.sk-scrap .rv:not(.in){transform:none}
/* chat: mỗi phần là một bong bóng tin nhắn */
.kbi.sk-chat .paper{background:var(--pp)}.kbi.sk-chat .s:not(.hero){margin:10px 14px;padding:22px 18px;border-radius:24px;background:var(--a2);text-align:left;border-bottom-left-radius:6px;max-width:92%}
.kbi.sk-chat .s:not(.hero):nth-of-type(even){margin-left:auto;background:var(--ac);color:#fff;border-bottom-left-radius:24px;border-bottom-right-radius:6px}.kbi.sk-chat .s:nth-of-type(even) .st,.kbi.sk-chat .s:nth-of-type(even) .sub,.kbi.sk-chat .s:nth-of-type(even) small,.kbi.sk-chat .s:nth-of-type(even) .lun{color:#fff}
.kbi.sk-chat .s:nth-of-type(even) .ec,.kbi.sk-chat .s:nth-of-type(even) .cal{border-color:rgba(255,255,255,.4)}.kbi.sk-chat .s:nth-of-type(even) .eb a{border-color:#fff;color:#fff}.kbi.sk-chat .s:nth-of-type(even) .eb a:first-child{background:#fff;color:var(--ac)}.kbi.sk-chat .s:nth-of-type(even) .fm input,.kbi.sk-chat .s:nth-of-type(even) .fm textarea,.kbi.sk-chat .s:nth-of-type(even) .fm select{border-color:rgba(255,255,255,.5);color:#fff}.kbi.sk-chat .s:nth-of-type(even) .fm button[type=submit]{background:#fff;color:var(--ac)}.kbi.sk-chat .s:nth-of-type(even) .cd div{background:rgba(255,255,255,.18)}.kbi.sk-chat .s:nth-of-type(even) .cd b{color:#fff}
.kbi.sk-chat .st{font:700 20px var(--fb);color:var(--ink)}.kbi.sk-chat .bd,.kbi.sk-chat .cd,.kbi.sk-chat .eb,.kbi.sk-chat .dv{justify-content:flex-start}.kbi.sk-chat .dv{display:none}.kbi.sk-chat .cal{margin-left:0;background:rgba(255,255,255,.4)}.kbi.sk-chat .thanks{text-align:center!important}
/* bento: ô bo tròn kiểu app */
.kbi.sk-bento .paper{background:var(--bg);box-shadow:none;padding:10px 14px 30px}.kbi.sk-bento .s:not(.hero){background:var(--pp);border-radius:24px;margin:10px 0;padding:28px 20px}
.kbi.sk-bento .st{font:600 26px/1.1 var(--fd);letter-spacing:-.02em;color:var(--ink)}.kbi.sk-bento .dv{display:none}.kbi.sk-bento .ec{background:var(--bg);border:0}
/* mono: biên lai, chữ máy đánh */
.kbi.sk-mono,.kbi.sk-mono .fm input,.kbi.sk-mono .fm textarea,.kbi.sk-mono .fm button,.kbi.sk-mono select{font-family:var(--fd)!important}.kbi.sk-mono .paper{background:transparent;box-shadow:none;padding:0 16px 30px}
.kbi.sk-mono .s:not(.hero){background:var(--pp);margin:0;border-top:2px dashed var(--ink);text-align:left;font-size:13.5px}.kbi.sk-mono .st{font:700 16px var(--fd);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}.kbi.sk-mono .st::before{content:'>> '}.kbi.sk-mono .dv{display:none}
.kbi.sk-mono .ec,.kbi.sk-mono .cal,.kbi.sk-mono .fm input,.kbi.sk-mono .fm textarea,.kbi.sk-mono .fm select,.kbi.sk-mono .seg span{border-radius:0;border-style:dashed}.kbi.sk-mono .bd strong{font-weight:700}.kbi.sk-mono .ty{font:700 28px var(--fd)}.kbi.sk-mono .bd,.kbi.sk-mono .cd,.kbi.sk-mono .eb{justify-content:flex-start}.kbi.sk-mono .cal{margin-left:0}.kbi.sk-mono .ec h3{font:700 16px var(--fd);color:var(--ink)}
/* ---------- bìa / mở thiệp ---------- */
.kbi .cover{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--bg);transition:opacity 1s ease,visibility 1s;text-align:center}
.kbi .cover.go{opacity:0;visibility:hidden}.kbi .ckick{font:500 12px var(--fb);letter-spacing:.32em;text-transform:uppercase;color:var(--mu);margin:0}.kbi .cg2{margin:0;font-size:15px}
.kbi .open{font:600 14px var(--fb);letter-spacing:.06em;padding:13px 30px;border-radius:99px;border:1px solid var(--ac);background:var(--ac);color:var(--pp);cursor:pointer;box-shadow:0 10px 30px -10px var(--ac);animation:kbpulse 2.2s ease-in-out infinite}
.kbi .env{position:relative;width:min(320px,82vw);aspect-ratio:1.45;perspective:900px}.kbi .eback,.kbi .efront,.kbi .eflap{position:absolute;inset:0;border-radius:6px}.kbi .eback{background:var(--a2)}
.kbi .ecard{position:absolute;left:6%;right:6%;top:6%;height:88%;padding-bottom:30%;background:var(--pp);border-radius:4px;box-shadow:0 4px 20px rgba(0,0,0,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform 1s cubic-bezier(.2,.8,.2,1) .45s;z-index:1}
.kbi .ecard p{margin:0;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--mu)}.kbi .ecard h2{margin:6px 0 0;font:400 24px/1.05 var(--fd);color:var(--ac);display:flex;flex-direction:column;align-items:center}.kbi .ecard .amp{font-size:.6em}
.kbi .efront{z-index:2;background:var(--a2);filter:brightness(.93);clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%)}
.kbi .eflap{z-index:3;background:var(--ac);clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:top;transition:transform .8s ease}
.kbi .seal{position:absolute;z-index:4;left:50%;top:50%;width:62px;height:62px;margin:-36px 0 0 -31px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#d55454,#8d1f1f 70%);color:#ffe9c9;font:600 14px var(--fd);box-shadow:0 4px 12px rgba(0,0,0,.35),inset 0 0 0 4px rgba(255,255,255,.12);cursor:pointer;transition:opacity .4s}
.kbi.dk .seal{background:radial-gradient(circle at 35% 30%,#f2d48a,#a77d2c 70%);color:#4b2e05}
.kbi .cover.go .eflap{transform:rotateX(180deg)}.kbi .cover.go .seal{opacity:0}.kbi .cover.go .ecard{transform:translateY(-55%);z-index:5}
.kbi .cv-tap .cin{padding:30px}.kbi .cv-tap h2{font:400 50px/1.1 var(--fd);color:var(--ac);margin:10px 0}.kbi .cv-tap h2 span{display:block}.kbi .cv-tap .amp{font-size:.6em}.kbi .cd2{color:var(--mu);letter-spacing:.12em;margin:0 0 22px}
.kbi .cv-ph{background-size:cover;background-position:center}.kbi .cv-ph h2,.kbi .cv-ph .ckick,.kbi .cv-ph .cd2,.kbi .cv-ph .cg2{color:#fff}
/* ---------- hiệu ứng ---------- */
.kbi .rv{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease}.kbi .rv.in{opacity:1;transform:none}
.kbi .fx{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden;transition:opacity 2s}.kbi .fx.off{opacity:0}
.kbi .fx i{position:absolute;top:-30px;animation:kbfall linear infinite}.kbi .fx .pt{width:12px;height:14px;background:var(--a2);border:1px solid var(--ac);border-radius:80% 0 80% 0;opacity:.8}.kbi .fx .cf{width:7px;height:12px;background:var(--ac);opacity:.85}.kbi .fx .cf:nth-child(3n){background:var(--a2)}.kbi .fx .cf:nth-child(4n){border-radius:50%;width:8px;height:8px}
.kbi .mus{position:fixed;right:16px;bottom:18px;z-index:45;width:46px;height:46px;border-radius:50%;border:1px solid var(--ac);background:var(--pp);color:var(--ac);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 24px -8px rgba(0,0,0,.35)}.kbi .mus svg{width:20px;height:20px}.kbi .mus.on{animation:kbspin 4s linear infinite}
.kbi .lb2{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:16px}.kbi .lb2[hidden]{display:none}.kbi .lb2 img{max-width:100%;max-height:100%;border-radius:8px}.kbi .lx{position:absolute;top:12px;right:14px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.15);color:#fff;font-size:24px;cursor:pointer}
.kbi .wm{position:fixed;inset:0;z-index:44;pointer-events:none;overflow:hidden;display:flex;align-items:center;justify-content:center}.kbi .wm span{transform:rotate(-28deg);font:700 40px var(--fb);letter-spacing:.2em;color:var(--ink);opacity:.07;white-space:nowrap;text-shadow:0 160px 0 var(--ink),0 -160px 0 var(--ink),0 320px 0 var(--ink),0 -320px 0 var(--ink)}
.kbi .wmb{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:46;background:rgba(0,0,0,.72);color:#fff;font:500 12px var(--fb);padding:7px 14px;border-radius:99px;text-decoration:none;white-space:nowrap;max-width:94vw;overflow:hidden;text-overflow:ellipsis}
@keyframes kbpulse{50%{transform:scale(1.04)}}@keyframes kbfall{to{transform:translate3d(60px,110vh,0) rotate(540deg)}}@keyframes kbspin{to{transform:rotate(360deg)}}
@keyframes kbpop{from{opacity:0;transform:translateY(10px) scale(.96)}}@keyframes kbdot{50%{opacity:.3;transform:translateY(-3px)}}@keyframes kbfloat{50%{transform:translateY(-10px)}}
@keyframes kbflick{0%,19%,22%,62%,64%,100%{opacity:1}20%,63%{opacity:.6}}@keyframes kbdrift{to{transform:translate(6%,4%) rotate(8deg)}}@keyframes kbdraw{to{stroke-dashoffset:0}}
@keyframes kbswing{50%{transform:rotate(4deg)}}@keyframes kbwave{to{transform:translateX(-30px)}}
@media (max-width:420px){.kbi .s{padding:46px 22px}.kbi .nm{font-size:50px}.kbi .nm.sc{font-size:54px}.kbi .st{font-size:34px}.kbi .bd strong{font-size:54px}.kbi .bd span{min-width:78px;font-size:12px}.kbi .cd div{min-width:56px}.kbi.sk-news .tx{column-count:1}}
@media (prefers-reduced-motion:reduce){.kbi .rv{opacity:1;transform:none;transition:none}.kbi .fx{display:none}.kbi *{animation:none!important}}
/* ---------- v3: nền giấy thật ---------- */
.kbi.tx,.kbi.tx .paper{background-image:var(--tex);background-size:var(--texs,512px);background-blend-mode:multiply}
.kbi.tx.dk,.kbi.tx.dk .paper{background-blend-mode:soft-light}
.kbi.tx.tx-kraft,.kbi.tx.tx-kraft .paper,.kbi.tx.tx-at-kraft,.kbi.tx.tx-at-kraft .paper{background-blend-mode:multiply,normal;background-size:420px}
.kbi.tx .cover{background-image:var(--tex);background-size:var(--texs,512px);background-blend-mode:multiply}
/* ---------- v3: phong bì ảnh thật ---------- */
.kbi .cv-env3{background:#111;overflow:hidden;gap:0;justify-content:space-between;padding:max(28px,env(safe-area-inset-top)) 18px max(26px,env(safe-area-inset-bottom))}
.kbi .cv-env3::before{content:'';position:absolute;inset:-40px;background:var(--envimg) center/cover;filter:blur(28px) brightness(.8);transform:scale(1.1)}
.kbi .eb3{position:absolute;left:50%;top:50%;width:max(100vw,75vh);aspect-ratio:3/4;transform:translate(-50%,-50%)}
@media (min-aspect-ratio:3/4){.kbi .eb3{width:75vh}}
.kbi .eimg{position:absolute;inset:0;background:var(--envimg) center/cover;transition:transform 1.3s cubic-bezier(.6,0,.2,1),opacity 1.1s ease .2s,filter 1.1s}
.kbi .seal3{position:absolute;width:15%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:0;background:transparent;cursor:pointer;padding:0;z-index:2;transition:transform .5s,opacity .5s}
.kbi .seal3 i{position:absolute;inset:-12%;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);box-shadow:0 0 0 1px rgba(0,0,0,.08);animation:kbring 2.2s ease-out infinite}
.kbi .etop,.kbi .ebot{position:relative;z-index:3;width:min(340px,100%);margin:0 auto;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.86);background:color-mix(in srgb,var(--pp) 86%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 18px 40px -22px rgba(0,0,0,.6);transition:opacity .6s,transform .8s}
.kbi .etop h2{margin:6px 0 2px;font:400 38px/1.12 var(--fs),var(--fd);color:var(--ac);display:flex;flex-direction:column;align-items:center}.kbi .etop .amp{font-size:.55em;line-height:1}
.kbi .etop .cd2{margin:4px 0 0;font-size:13px;letter-spacing:.2em;color:var(--ink)}
.kbi .ebot{display:flex;flex-direction:column;align-items:center;gap:8px}.kbi .ebot .cg2{color:var(--ink)}.kbi .ehint{margin:0;font-size:12.5px;color:var(--mu)}.kbi .ebot .open{padding:11px 26px}
.kbi .cv-env3.go{opacity:0;visibility:hidden;transition:opacity .7s ease .75s,visibility 0s 1.5s}
.kbi .cv-env3.go .eimg{transform:scale(1.7);opacity:0;filter:blur(6px)}.kbi .cv-env3.go .seal3{transform:translate(-50%,-50%) scale(1.25) rotate(-12deg);opacity:0}
.kbi .cv-env3.go .etop{opacity:0;transform:translateY(-30px)}.kbi .cv-env3.go .ebot{opacity:0;transform:translateY(30px)}
@keyframes kbring{0%{transform:scale(.9);opacity:.95}100%{transform:scale(1.5);opacity:0}}
/* ---------- v3: chữ tiếng Việt thoáng dấu ---------- */
.kbi .nm{line-height:1.12}.kbi .st{line-height:1.25}.kbi .cv-tap h2{line-height:1.15}.kbi .gst b{line-height:1.3}
/* ---------- v3: chế độ sửa trực quan ---------- */
.kbi.edit .s,.kbi.edit .cover{cursor:pointer}
.kbi.edit .eflash{outline:2px dashed var(--ac);outline-offset:4px;border-radius:4px;animation:kbflash .9s ease}
@keyframes kbflash{0%{outline-color:transparent}30%{outline-color:var(--ac)}}
/* ---------- v3: thả tim + lời chúc bay ---------- */
.kbi .kbh{position:fixed;right:16px;bottom:74px;z-index:45;width:46px;height:56px;border-radius:24px;border:1px solid var(--ac);background:var(--pp);color:#e2445c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;cursor:pointer;box-shadow:0 8px 24px -8px rgba(0,0,0,.35);padding:0}
.kbi .kbh svg{width:20px;height:20px}.kbi .kbh b{font:600 10.5px var(--fb);color:var(--ink);line-height:1.2}.kbi .kbh.pop svg{animation:kbhp .4s}
.kbi .kbh .hf{position:absolute;bottom:40px;width:14px;height:14px;pointer-events:none;background:#e2445c;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.7-9.4-9.6C1.3 8 3.4 4.5 7 4.5c2 0 3.5 1.1 5 2.9 1.5-1.8 3-2.9 5-2.9 3.6 0 5.7 3.5 4.4 6.9C19.5 16.3 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.7-9.4-9.6C1.3 8 3.4 4.5 7 4.5c2 0 3.5 1.1 5 2.9 1.5-1.8 3-2.9 5-2.9 3.6 0 5.7 3.5 4.4 6.9C19.5 16.3 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;animation:kbhf 1.5s ease-out forwards}
@keyframes kbhp{50%{transform:scale(1.35)}}@keyframes kbhf{0%{opacity:1;transform:translate(0,0) scale(.6)}100%{opacity:0;transform:translate(var(--dx),-130px) scale(1.2)}}
.kbi .fw{position:fixed;left:12px;bottom:18px;z-index:44;width:min(70vw,300px);display:flex;flex-direction:column;gap:6px;pointer-events:none}
.kbi .fwi{font:400 13px/1.4 var(--fb);color:#fff;background:rgba(20,20,24,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:7px 12px;border-radius:14px;animation:kbpop .5s ease;transition:opacity .5s,transform .5s;align-self:flex-start;max-width:100%}
.kbi .fwi b{font-weight:600;color:#ffd7a8}.kbi .fwi.out{opacity:0;transform:translateY(-8px)}
.kbi:not(:has(.mus)) .kbh{bottom:18px}
.kbi .cv-env3::before{transition:opacity .5s}.kbi .cv-env3.go{background:transparent}.kbi .cv-env3.go::before{opacity:0}
/* v6: ô ảnh riêng + credit nhạc */
.kbi .ph0 .phh{display:none}
.edit .ph0 .phh{display:block;position:absolute;left:50%;bottom:12%;max-width:92%;overflow:hidden;transform:translateX(-50%);white-space:nowrap;font:600 11px/1 'Be Vietnam Pro',sans-serif;font-style:normal;letter-spacing:.02em;padding:7px 12px;border-radius:99px;background:rgba(0,0,0,.55);color:#fff;pointer-events:none}
.edit .ph0{outline:2px dashed rgba(255,255,255,.55);outline-offset:-6px;cursor:pointer}
.edit .ph{cursor:pointer}
.kbi .ph0{position:relative}
.kbi .mcr{text-align:center;font:400 10px/1.4 'Be Vietnam Pro',sans-serif;opacity:.45;margin:18px 12px 6px;letter-spacing:.02em}
.kbi .ph0{container-type:inline-size}
.kbi .ph0>span{font-size:min(1em,26cqi);white-space:nowrap}
.kbi .ti>.ph0{display:none}.edit .ti>.ph0{display:flex}
/* ---------- v8: cào lộ ngày + hiệu ứng mở thiệp ---------- */
.kbi .scr{position:relative;margin:6px auto 0;max-width:420px;border-radius:18px;overflow:hidden}
.kbi .scr-in{position:relative;z-index:1}
.kbi .scr-c{position:absolute;inset:0;width:100%;height:100%;z-index:2;cursor:grab;border-radius:18px;transition:opacity .8s ease}
.kbi .scr.rvd .scr-c{opacity:0;pointer-events:none}
.kbi .scr.rvd .scr-in{animation:kbpop .7s ease}
.kbi .scr-h{font-size:13px;letter-spacing:.06em;opacity:.75;margin:10px 0 0;text-align:center}
.kbi .when.locked .cal,.kbi .when.locked .cd,.kbi .when.locked .tm,.kbi .when.locked .lun{filter:blur(7px);opacity:.55;transition:filter .8s,opacity .8s}
.kbi .when .cal,.kbi .when .cd{transition:filter .8s,opacity .8s}
.kbi .fx .hz{width:16px;height:16px;background:var(--ac);opacity:.8;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.7-9.4-9.6C1.3 8 3.4 4.5 7 4.5c2 0 3.5 1.1 5 2.9 1.5-1.8 3-2.9 5-2.9 3.6 0 5.7 3.5 4.4 6.9C19.5 16.3 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.7-9.4-9.6C1.3 8 3.4 4.5 7 4.5c2 0 3.5 1.1 5 2.9 1.5-1.8 3-2.9 5-2.9 3.6 0 5.7 3.5 4.4 6.9C19.5 16.3 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat}
.kbi .fx .hz:nth-child(3n){background:var(--a2);width:11px;height:11px}
.kbi .fx .sk2{width:6px;height:6px;border-radius:50%;background:#fff6d8;box-shadow:0 0 8px 2px var(--ac);animation-name:kbtwinkle!important;top:auto}
.kbi .fx .sk2:nth-child(2n){width:4px;height:4px}
.kbi .fx .ln{width:18px;height:24px;border-radius:40% 40% 46% 46%;background:radial-gradient(circle at 50% 60%,#ffd27a,#e0642a 70%);box-shadow:0 0 18px 4px rgba(255,170,60,.45);top:auto;bottom:-40px;animation-name:kbrise!important}
.kbi .fx .gd{width:4px;height:9px;border-radius:2px;background:linear-gradient(#fff3c4,var(--ac));opacity:.9}
.kbi .fx .sn{width:7px;height:7px;border-radius:50%;background:#fff;opacity:.85;box-shadow:0 0 4px rgba(255,255,255,.8)}
@keyframes kbtwinkle{0%{transform:translate3d(0,0,0) scale(.2);opacity:0}30%{opacity:1}60%{transform:translate3d(0,-30px,0) scale(1)}100%{transform:translate3d(10px,-70px,0) scale(.2);opacity:0}}
@keyframes kbrise{0%{transform:translate3d(0,0,0) rotate(-4deg);opacity:0}10%{opacity:1}100%{transform:translate3d(30px,-115vh,0) rotate(6deg);opacity:.85}}
.kbi .when.locked,.kbi .scr{-webkit-user-select:none;user-select:none}
.kbi .thanks .by2{display:table;margin:10px auto 0;padding:9px 16px;border-radius:999px;border:1px solid var(--ac);color:var(--ac);font-size:12.5px;letter-spacing:.04em;text-decoration:none}
.kbi .dress .dsw{display:flex;justify-content:center;gap:12px;margin:8px 0 14px}.kbi .dress .dsw i{width:44px;height:44px;border-radius:50%;box-shadow:0 0 0 3px var(--pp),0 0 0 4px var(--a2)}
.kbi .seat .sres{margin-top:10px}.kbi .seat .sr1{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:12px;background:var(--a2);margin:6px 0}.kbi .seat .sr1 b{color:var(--ac);white-space:nowrap}.kbi .seat .sr0{opacity:.75;font-size:14px}
.kbi .seat .sfm{max-width:420px;margin:12px auto 0;padding:0;border:0;background:none;box-shadow:none;min-height:0;display:block}.kbi .seat .sfm::before,.kbi .seat .sfm::after{display:none}.kbi .seat .kbsq{width:100%;box-sizing:border-box;display:block}

/* v9 keyframes cho bộ Thêu · Ren · Save the date */
@keyframes ld9b{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-52%)}}
@keyframes ld9o{to{opacity:0;visibility:hidden}}
@keyframes rn9o{to{opacity:0;visibility:hidden}}
@keyframes sd9k{from{transform:scale(1.12)}to{transform:scale(1)}}
@keyframes sd9h{50%{transform:translate(-50%,-52%) scale(1.15)}}

/* v9.2 hiệu ứng chữ xuất hiện */
.kbi .tx-w{display:inline-block;white-space:nowrap}.kbi .tx-l{display:inline-block}.kbi.txon .tx-a{display:inline-block}
.kbi.txon[data-txh="rise"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="rise"] .hero.tx-go .tx-s .tx-l{animation:kbt-rise .8s cubic-bezier(.2,.7,.2,1) calc(var(--i)*38ms) both}
.kbi.txon[data-txh="rise"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="rise"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="rise"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="rise"] .s.in .tx-s .tx-l{animation:kbt-rise .8s cubic-bezier(.2,.7,.2,1) calc(var(--i)*38ms) both}
.kbi.txon[data-txs="rise"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="rise"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="blur"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="blur"] .hero.tx-go .tx-s .tx-l{animation:kbt-blur 1s ease calc(var(--i)*45ms) both}
.kbi.txon[data-txh="blur"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="blur"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="blur"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="blur"] .s.in .tx-s .tx-l{animation:kbt-blur 1s ease calc(var(--i)*45ms) both}
.kbi.txon[data-txs="blur"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="blur"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="spread"] .hero:not(.tx-go) .tx-s>.tx-in{opacity:0}.kbi.txon[data-txh="spread"] .hero.tx-go .tx-s>.tx-in{animation:kbt-spread 1.6s cubic-bezier(.2,.7,.2,1) both}
.kbi.txon[data-txh="spread"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="spread"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="spread"] .s:not(.hero):not(.in) .tx-s>.tx-in{opacity:0}.kbi.txon[data-txs="spread"] .s.in .tx-s>.tx-in{animation:kbt-spread 1.6s cubic-bezier(.2,.7,.2,1) both}
.kbi.txon[data-txs="spread"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="spread"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="mask"] .hero .tx-s .tx-w{overflow:hidden;padding:0 .02em .14em;margin-bottom:-.14em;vertical-align:top}.kbi.txon[data-txh="mask"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="mask"] .hero.tx-go .tx-s .tx-l{animation:kbt-mask .8s cubic-bezier(.2,.8,.2,1) calc(var(--w)*110ms + var(--i)*12ms) both}
.kbi.txon[data-txh="mask"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="mask"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="mask"] .s .tx-s .tx-w{overflow:hidden;padding:0 .02em .14em;margin-bottom:-.14em;vertical-align:top}.kbi.txon[data-txs="mask"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="mask"] .s.in .tx-s .tx-l{animation:kbt-mask .8s cubic-bezier(.2,.8,.2,1) calc(var(--w)*110ms + var(--i)*12ms) both}
.kbi.txon[data-txs="mask"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="mask"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="fadeup"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="fadeup"] .hero.tx-go .tx-s .tx-l{animation:kbt-rise 1s ease calc(var(--w)*160ms) both}
.kbi.txon[data-txh="fadeup"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="fadeup"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="fadeup"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="fadeup"] .s.in .tx-s .tx-l{animation:kbt-rise 1s ease calc(var(--w)*160ms) both}
.kbi.txon[data-txs="fadeup"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="fadeup"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="focus"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="focus"] .hero.tx-go .tx-s .tx-l{animation:kbt-focus 1.1s cubic-bezier(.2,.7,.2,1) calc(var(--i)*30ms) both}
.kbi.txon[data-txh="focus"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="focus"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="focus"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="focus"] .s.in .tx-s .tx-l{animation:kbt-focus 1.1s cubic-bezier(.2,.7,.2,1) calc(var(--i)*30ms) both}
.kbi.txon[data-txs="focus"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="focus"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="ink"] .hero:not(.tx-go) .tx-s>.tx-in{clip-path:inset(0 100% 0 0)}.kbi.txon[data-txh="ink"] .hero.tx-go .tx-s>.tx-in{animation:kbt-ink 1.8s cubic-bezier(.5,0,.3,1) both}
.kbi.txon[data-txh="ink"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="ink"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="ink"] .s:not(.hero):not(.in) .tx-s>.tx-in{clip-path:inset(0 100% 0 0)}.kbi.txon[data-txs="ink"] .s.in .tx-s>.tx-in{animation:kbt-ink 1.8s cubic-bezier(.5,0,.3,1) both}
.kbi.txon[data-txs="ink"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="ink"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="gold"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="gold"] .hero.tx-go .tx-s .tx-l{animation:kbt-rise .8s cubic-bezier(.2,.7,.2,1) calc(var(--i)*38ms) both,kbt-glow 1.6s ease calc(.9s + var(--i)*45ms) both}
.kbi.txon[data-txh="gold"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="gold"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="gold"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="gold"] .s.in .tx-s .tx-l{animation:kbt-rise .8s cubic-bezier(.2,.7,.2,1) calc(var(--i)*38ms) both,kbt-glow 1.6s ease calc(.9s + var(--i)*45ms) both}
.kbi.txon[data-txs="gold"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="gold"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="emboss"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="emboss"] .hero.tx-go .tx-s .tx-l{animation:kbt-emb 1.4s ease calc(var(--i)*35ms) both}
.kbi.txon[data-txh="emboss"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="emboss"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="emboss"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="emboss"] .s.in .tx-s .tx-l{animation:kbt-emb 1.4s ease calc(var(--i)*35ms) both}
.kbi.txon[data-txs="emboss"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="emboss"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="stamp"] .hero:not(.tx-go) .tx-s .tx-w{opacity:0}.kbi.txon[data-txh="stamp"] .hero.tx-go .tx-s .tx-w{animation:kbt-stamp .55s cubic-bezier(.3,1.6,.5,1) calc(var(--w)*180ms) both}
.kbi.txon[data-txh="stamp"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="stamp"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="stamp"] .s:not(.hero):not(.in) .tx-s .tx-w{opacity:0}.kbi.txon[data-txs="stamp"] .s.in .tx-s .tx-w{animation:kbt-stamp .55s cubic-bezier(.3,1.6,.5,1) calc(var(--w)*180ms) both}
.kbi.txon[data-txs="stamp"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="stamp"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="zoom"] .hero:not(.tx-go) .tx-s>.tx-in{opacity:0}.kbi.txon[data-txh="zoom"] .hero.tx-go .tx-s>.tx-in{animation:kbt-zoom 1.4s cubic-bezier(.2,.7,.2,1) both}
.kbi.txon[data-txh="zoom"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="zoom"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="zoom"] .s:not(.hero):not(.in) .tx-s>.tx-in{opacity:0}.kbi.txon[data-txs="zoom"] .s.in .tx-s>.tx-in{animation:kbt-zoom 1.4s cubic-bezier(.2,.7,.2,1) both}
.kbi.txon[data-txs="zoom"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="zoom"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="split"] .hero:not(.tx-go) .tx-s .tx-w{opacity:0}.kbi.txon[data-txh="split"] .hero.tx-go .tx-s .tx-w:nth-child(odd){animation:kbt-sl .9s cubic-bezier(.2,.8,.2,1) calc(var(--w)*90ms) both}.kbi.txon[data-txh="split"] .hero.tx-go .tx-s .tx-w:nth-child(even){animation:kbt-sr .9s cubic-bezier(.2,.8,.2,1) calc(var(--w)*90ms) both}
.kbi.txon[data-txh="split"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="split"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="split"] .s:not(.hero):not(.in) .tx-s .tx-w{opacity:0}.kbi.txon[data-txs="split"] .s.in .tx-s .tx-w:nth-child(odd){animation:kbt-sl .9s cubic-bezier(.2,.8,.2,1) calc(var(--w)*90ms) both}.kbi.txon[data-txs="split"] .s.in .tx-s .tx-w:nth-child(even){animation:kbt-sr .9s cubic-bezier(.2,.8,.2,1) calc(var(--w)*90ms) both}
.kbi.txon[data-txs="split"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="split"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="wave"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="wave"] .hero.tx-go .tx-s .tx-l{animation:kbt-wave .9s cubic-bezier(.3,1.5,.5,1) calc(var(--i)*28ms) both}
.kbi.txon[data-txh="wave"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="wave"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="wave"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="wave"] .s.in .tx-s .tx-l{animation:kbt-wave .9s cubic-bezier(.3,1.5,.5,1) calc(var(--i)*28ms) both}
.kbi.txon[data-txs="wave"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="wave"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="type"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="type"] .hero.tx-go .tx-s .tx-l{animation:kbt-type .01s linear calc(var(--i)*65ms) both}.kbi.txon[data-txh="type"] .hero.tx-go .tx-s::after{content:"";display:inline-block;width:2px;height:.9em;margin-left:4px;vertical-align:-.1em;background:currentColor;animation:kbt-caret .7s steps(1) 6 both}
.kbi.txon[data-txh="type"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="type"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="type"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="type"] .s.in .tx-s .tx-l{animation:kbt-type .01s linear calc(var(--i)*65ms) both}.kbi.txon[data-txs="type"] .s.in .tx-s::after{content:"";display:inline-block;width:2px;height:.9em;margin-left:4px;vertical-align:-.1em;background:currentColor;animation:kbt-caret .7s steps(1) 6 both}
.kbi.txon[data-txs="type"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="type"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="flip"] .hero .tx-s .tx-w{perspective:600px}.kbi.txon[data-txh="flip"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="flip"] .hero.tx-go .tx-s .tx-l{animation:kbt-flip .8s cubic-bezier(.2,.8,.2,1) calc(var(--i)*40ms) both}
.kbi.txon[data-txh="flip"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="flip"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="flip"] .s .tx-s .tx-w{perspective:600px}.kbi.txon[data-txs="flip"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="flip"] .s.in .tx-s .tx-l{animation:kbt-flip .8s cubic-bezier(.2,.8,.2,1) calc(var(--i)*40ms) both}
.kbi.txon[data-txs="flip"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="flip"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="drop"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="drop"] .hero.tx-go .tx-s .tx-l{animation:kbt-drop .7s cubic-bezier(.3,1.5,.5,1) calc(var(--i)*45ms) both}
.kbi.txon[data-txh="drop"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="drop"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="drop"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="drop"] .s.in .tx-s .tx-l{animation:kbt-drop .7s cubic-bezier(.3,1.5,.5,1) calc(var(--i)*45ms) both}
.kbi.txon[data-txs="drop"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="drop"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txh="glitch"] .hero:not(.tx-go) .tx-s .tx-l{opacity:0}.kbi.txon[data-txh="glitch"] .hero.tx-go .tx-s .tx-l{animation:kbt-glitch .6s steps(2) calc(var(--i)*30ms) both}
.kbi.txon[data-txh="glitch"] .hero:not(.tx-go) .tx-s .tx-a{opacity:0}.kbi.txon[data-txh="glitch"] .hero.tx-go .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
.kbi.txon[data-txs="glitch"] .s:not(.hero):not(.in) .tx-s .tx-l{opacity:0}.kbi.txon[data-txs="glitch"] .s.in .tx-s .tx-l{animation:kbt-glitch .6s steps(2) calc(var(--i)*30ms) both}
.kbi.txon[data-txs="glitch"] .s:not(.hero):not(.in) .tx-s .tx-a{opacity:0}.kbi.txon[data-txs="glitch"] .s.in .tx-s .tx-a{animation:kbt-blur 1s ease calc(var(--i)*38ms) both}
@keyframes kbt-rise{from{opacity:0;transform:translateY(.45em)}to{opacity:1;transform:none}}
@keyframes kbt-blur{from{opacity:0;filter:blur(10px)}to{opacity:1;filter:none}}
@keyframes kbt-spread{from{opacity:0;letter-spacing:.6em;filter:blur(4px)}to{opacity:1;filter:none}}
@keyframes kbt-mask{from{transform:translateY(110%)}to{transform:none}}
@keyframes kbt-focus{from{opacity:0;transform:scale(1.6);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes kbt-ink{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -10% 0 0)}}
@keyframes kbt-emb{from{opacity:0;text-shadow:0 0 0 transparent}60%{opacity:1}to{opacity:1;text-shadow:0 1px 0 rgba(255,255,255,.6),0 -1px 0 rgba(0,0,0,.12)}}
@keyframes kbt-stamp{from{opacity:0;transform:scale(2.2) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes kbt-zoom{from{opacity:0;transform:scale(.82);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes kbt-sl{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
@keyframes kbt-sr{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
@keyframes kbt-wave{from{opacity:0;transform:translateY(.7em) scale(.8)}to{opacity:1;transform:none}}
@keyframes kbt-type{from{opacity:0}to{opacity:1}}
@keyframes kbt-caret{0%{opacity:1}50%{opacity:0}100%{opacity:0}}
@keyframes kbt-flip{from{opacity:0;transform:rotateX(90deg);transform-origin:50% 100%}to{opacity:1;transform:none}}
@keyframes kbt-drop{from{opacity:0;transform:translateY(-1.2em)}to{opacity:1;transform:none}}
@keyframes kbt-glitch{0%{opacity:0;transform:translateX(-6px);text-shadow:3px 0 #ff2bd6,-3px 0 #00e5ff}50%{opacity:1;transform:translateX(4px)}100%{opacity:1;transform:none;text-shadow:none}}
@keyframes kbt-shine{from{background-position:120% 0}to{background-position:-30% 0}}
@media (prefers-reduced-motion:reduce){.kbi .tx-l,.kbi .tx-w,.kbi .tx-s{animation:none!important;opacity:1!important;clip-path:none!important}}

@keyframes kbt-glow{0%{text-shadow:0 0 0 transparent}40%{text-shadow:0 0 14px rgba(255,214,120,.95),0 0 2px #fff3c4}100%{text-shadow:0 0 0 transparent}}

.kbi .tx-in{display:inline-block;max-width:100%}
.kbi.txon .hero:not(.tx-go) .tx-whole{opacity:0}.kbi.txon .hero.tx-go .tx-whole{animation:kbt-zoom 1.4s cubic-bezier(.2,.7,.2,1) both}.kbi.txon .s:not(.hero):not(.in) .tx-whole{opacity:0}.kbi.txon .s.in .tx-whole{animation:kbt-blur 1s ease both}
