#dk{position:fixed;inset:0;z-index:20;background:#07080c;display:none;flex-direction:column;align-items:center;justify-content:center;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
#dk.on{display:flex}
.dk-stage{position:relative;container-type:size;width:min(100vw,calc(100vh * 16 / 9));aspect-ratio:16/9;overflow:hidden;background:radial-gradient(120% 90% at 50% 110%,#3a1405 0,#12090a 45%,#0a0b10 100%);color:#f3eee9;user-select:none}
#dk canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dk-stage:fullscreen{width:100vw;height:100vh;aspect-ratio:auto}
.s{position:absolute;inset:0;padding:6cqw 7cqw 7cqw;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .7s,transform .7s,visibility 0s .7s;transform:scale(1.04)}
.s.act{opacity:1;visibility:visible;transform:none;transition:opacity .7s,transform .8s}
.s.out{opacity:0;visibility:visible;transform:scale(.96)}
.s:not(.act):not(.out) .a{opacity:0}
.act .a{animation:rise .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
.act .a.l{animation-name:fromL}.act .a.r{animation-name:fromR}.act .a.z{animation-name:zoom}.act .a.p{animation-name:pop}
@keyframes rise{from{opacity:0;transform:translateY(3cqw)}to{opacity:1;transform:none}}
@keyframes fromL{from{opacity:0;transform:translateX(-6cqw)}to{opacity:1;transform:none}}
@keyframes fromR{from{opacity:0;transform:translateX(6cqw)}to{opacity:1;transform:none}}
@keyframes zoom{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes pop{0%{opacity:0;transform:scale(.3) rotate(-8deg)}70%{transform:scale(1.08)}100%{opacity:1;transform:none}}
.kick{font-size:1.25cqw;letter-spacing:.35em;color:#ffb347;font-weight:700;text-transform:uppercase}
.h{font-size:4.6cqw;font-weight:900;line-height:1.05;margin:.8cqw 0 3cqw;background:linear-gradient(95deg,#fff 20%,#ffb347 60%,#ff6a1a);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.01em}
.h small{display:block;font-size:1.7cqw;font-weight:500;color:#c9b8aa;-webkit-text-fill-color:#c9b8aa;margin-top:.6cqw;letter-spacing:0}
.glass{background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,200,150,.18);border-radius:1.6cqw;backdrop-filter:blur(6px);box-shadow:0 1.5cqw 4cqw rgba(0,0,0,.4)}
.row{display:flex;gap:2cqw}.col{display:flex;flex-direction:column;gap:1.5cqw}.grow{flex:1;min-width:0}.mid{align-items:center}
.t{font-size:2cqw;line-height:1.4;color:#e9dfd6}.t b{color:#ffb347}
.chip{display:inline-block;padding:.5cqw 1.3cqw;border-radius:99px;font-size:1.5cqw;font-weight:700;background:rgba(255,106,26,.16);border:1px solid rgba(255,140,60,.5);color:#ffd2a8}
.chip.g{background:rgba(25,195,177,.14);border-color:rgba(25,195,177,.5);color:#8ff0e3}
/* title */
.title{justify-content:center;align-items:center;text-align:center}
.ring{position:absolute;width:62cqw;height:62cqw;border-radius:50%;border:.25cqw dashed rgba(255,140,60,.35);animation:spin 40s linear infinite;left:50%;top:50%;margin:-31cqw 0 0 -31cqw}
.ring.b{width:48cqw;height:48cqw;margin:-24cqw 0 0 -24cqw;animation-duration:26s;animation-direction:reverse;border-color:rgba(25,195,177,.3)}
@keyframes spin{to{transform:rotate(360deg)}}
.big{font-size:6.6cqw;font-weight:900;line-height:1.02;letter-spacing:-.01em;text-shadow:0 0 3cqw rgba(255,106,26,.6)}
.big span{display:inline-block;background:linear-gradient(180deg,#fff,#ffb347 55%,#ff5a0a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 1.2cqw rgba(255,106,26,.7))}
.sub{font-size:2.2cqw;color:#c9b8aa;margin:2cqw 0 3cqw;letter-spacing:.1em}
.def{padding:2cqw 3cqw;max-width:62cqw;font-size:2cqw;line-height:1.4}
.def em{font-style:normal;color:#ffb347;font-weight:800;font-size:3cqw}
/* cards grid */
.grid{display:grid;gap:1.6cqw}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{padding:1.8cqw 2cqw;position:relative;overflow:hidden}
.card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:.4cqw;background:linear-gradient(#ffb347,#ff3d00)}
.card .ic{font-size:3cqw;line-height:1;margin-bottom:.8cqw}
.card h4{font-size:2cqw;margin:0 0 .5cqw;color:#fff}.card p{margin:0;font-size:1.55cqw;line-height:1.4;color:#d4c6bb}
.card .n{position:absolute;right:1.2cqw;top:.4cqw;font-size:4cqw;font-weight:900;color:rgba(255,255,255,.07)}
/* micro svg */
.micro{width:100%;height:100%;border-radius:1.6cqw;background:#2a2d36;overflow:hidden}
.fl{fill:none;stroke:#0c0d11;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.act .fl{animation:draw 1.6s ease-out forwards;animation-delay:var(--d)}
@keyframes draw{to{stroke-dashoffset:0}}
.sph{fill:#0c0d11;transform-box:fill-box;transform-origin:center;transform:scale(0)}
.act .sph{animation:grow .8s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:var(--d)}
@keyframes grow{to{transform:scale(1)}}
.cap{font-size:1.4cqw;color:#c9b8aa;margin-top:.8cqw;text-align:center}
/* bars */
.meter{display:flex;align-items:center;gap:1.2cqw;font-size:1.5cqw;color:#e9dfd6;margin:.8cqw 0}.meter span{width:15cqw}
.bar{flex:1;height:1.3cqw;border-radius:9cqw;background:rgba(255,255,255,.1);overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ff3d00,#ffb347)}
.act .bar i{width:var(--w);transition:width 1.4s cubic-bezier(.2,.8,.2,1) var(--d)}
/* steps */
.steps{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:1.2cqw;margin-top:2cqw}
.steps:before{content:"";position:absolute;left:4%;right:4%;top:2.6cqw;height:.5cqw;background:rgba(255,255,255,.1);border-radius:9cqw}
.steps:after{content:"";position:absolute;left:4%;top:2.6cqw;height:.5cqw;width:0;border-radius:9cqw;background:linear-gradient(90deg,#19c3b1,#ffb347,#ff3d00);box-shadow:0 0 1.5cqw #ff6a1a}
.act .steps:after{width:92%;transition:width 5.2s linear .5s}
.st{text-align:center;position:relative}
.st b{display:grid;place-items:center;width:5.4cqw;height:5.4cqw;margin:0 auto 1.2cqw;border-radius:50%;background:#1a1210;border:.3cqw solid #ff8a3c;font-size:2.2cqw;color:#ffb347;position:relative;z-index:1;box-shadow:0 0 2cqw rgba(255,106,26,.5)}
.st p{margin:0;font-size:1.45cqw;line-height:1.35;color:#e9dfd6}.st i{display:block;font-size:2.6cqw;font-style:normal;margin-bottom:.6cqw}
/* table */
.tbl{display:grid;grid-template-columns:1.25fr 2.4fr 1fr 1fr 1fr;gap:.8cqw;align-items:center;font-size:1.45cqw}
.tbl>div{padding:.9cqw 1.2cqw;border-radius:1cqw;background:rgba(255,255,255,.05)}
.tbl .hd{background:none;color:#ffb347;font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:1.15cqw;padding:0 1.2cqw}
.tbl .nm{font-weight:800;color:#fff;font-size:1.7cqw;border-left:.4cqw solid var(--c)}
.dots{display:flex;gap:.35cqw}.dots u{width:1.3cqw;height:1.3cqw;border-radius:50%;background:rgba(255,255,255,.14)}
.dots u.f{background:var(--c);box-shadow:0 0 1cqw var(--c)}
.act .dots u.f{animation:pop .5s both;animation-delay:calc(var(--d) + var(--k)*.08s)}
/* arrow flow */
.flow{display:flex;align-items:center;gap:1.5cqw}.flow .box{padding:1.5cqw 2cqw;text-align:center;font-size:1.7cqw;font-weight:700;border-radius:1.4cqw;flex:1}
.arr{font-size:3cqw;color:#ff8a3c}.act .arr{animation:nudge 1.2s ease-in-out infinite}
@keyframes nudge{50%{transform:translateX(.8cqw)}}
.float{position:absolute;display:grid;place-items:center;width:7cqw;height:7cqw;border-radius:1.4cqw;font-weight:900;font-size:2.8cqw}
.act .float{animation:bob 4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-1.2cqw) rotate(3deg)}}
.thanks{justify-content:center;align-items:center;text-align:center}
.glow{animation:pulse 2.5s ease-in-out infinite}
@keyframes pulse{50%{text-shadow:0 0 5cqw rgba(255,140,60,.95)}}
/* chrome */
.dk-top{position:absolute;left:0;right:0;top:0;height:.5cqw;background:rgba(255,255,255,.08);z-index:5}
.dk-top i{display:block;height:100%;width:0;background:linear-gradient(90deg,#19c3b1,#ffb347,#ff3d00);transition:width .6s}
.dk-ui{position:absolute;left:0;right:0;bottom:1.4cqw;display:flex;align-items:center;justify-content:center;gap:1.2cqw;z-index:5}
.dk-ui button,.dk-x{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:50%;width:3.6cqw;height:3.6cqw;font-size:1.8cqw;cursor:pointer;backdrop-filter:blur(6px);transition:.2s;line-height:1}
.dk-ui button:hover:not(:disabled),.dk-x:hover{background:#ff6a1a;border-color:#ff6a1a}
.dk-ui button:disabled{opacity:.25;cursor:default}
.dots2{display:flex;gap:.7cqw}.dots2 b{width:.9cqw;height:.9cqw;border-radius:50%;background:rgba(255,255,255,.25);cursor:pointer;transition:.3s}.dots2 b.on{background:#ff8a3c;width:2.6cqw;border-radius:9cqw}
.dk-x{position:absolute;right:1.6cqw;top:1.6cqw;z-index:6}
.dk-fs{position:absolute;right:6cqw;top:1.6cqw;z-index:6;width:3.6cqw;height:3.6cqw;font-size:1.6cqw;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:50%;cursor:pointer}
.pgn{position:absolute;left:2cqw;bottom:2cqw;font-size:1.3cqw;color:#a99888;z-index:5;letter-spacing:.15em}
@media(max-width:700px){.dk-stage{width:100vw}.dk-ui button,.dk-x,.dk-fs{width:30px;height:30px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.act .a,.ring,.float{animation:none!important}.s:not(.act):not(.out) .a{opacity:1}}