/* KlipTok v64 · Dado de tu Crush (assets/kt-v64-dado.css). Todo acotado a .kd / .kd-*; usa --k18-* (claro/oscuro). */
.kd{--g1:#7c3aed;--g2:#ec4899;--s:clamp(230px,38vmin + 60px,360px);display:grid;grid-template-columns:0 1fr;position:relative;border:1px solid var(--k18-line);border-radius:1.1rem;background:var(--k18-card);color:var(--k18-ink);overflow:hidden;min-height:0}
.kd *{box-sizing:border-box}.kd button{font:inherit;color:inherit;cursor:pointer}
.kd.kd-wide{grid-template-columns:290px 1fr}
/* panel lateral */
.kd-side{overflow:auto;border-right:1px solid var(--k18-line);background:var(--k18-card);width:290px;margin-left:-290px;transition:margin .3s ease;z-index:6}
.kd.kd-wide .kd-side{margin-left:0}
.kd-sh{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-bottom:1px solid var(--k18-line);position:sticky;top:0;background:var(--k18-card);z-index:1}
.kd-x{border:0;background:transparent;font-size:1.1rem;padding:.2rem .45rem;border-radius:.5rem}.kd-x:hover{background:var(--k18-soft)}
.kd-sc{padding:.2rem 1rem 1.2rem}.kd-sc h4,.kd-mc h4{margin:1rem 0 .4rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--k18-mute)}.kd-sc h4 small,.kd-mc h4 small{text-transform:none;letter-spacing:0}
.kd-chips{display:flex;flex-wrap:wrap;gap:.35rem}
.kd-chip{border:1px solid var(--k18-line);background:var(--k18-bg);border-radius:999px;padding:.3rem .7rem;font-size:.8rem;font-weight:600}
.kd-chip.on{background:linear-gradient(90deg,var(--g1),var(--g2));color:#fff!important;border-color:transparent}
.kd-rng{display:grid;gap:.2rem}.kd-rng input{width:100%;accent-color:#7c3aed}
.kd-in{width:100%;padding:.55rem .7rem;border-radius:.6rem;border:1px solid var(--k18-line);background:var(--k18-bg);color:var(--k18-ink);font:inherit;margin:.15rem 0}
.kd-sws{margin:.8rem 0}.kd-sw{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.5rem 0;border-top:1px solid var(--k18-line);cursor:pointer;font-size:.9rem}
.kd-sw input{position:absolute;opacity:0}.kd-sw i{width:2.5rem;height:1.45rem;border-radius:999px;background:#94a3b8;position:relative;flex:none;transition:.2s}.kd-sw i::after{content:"";position:absolute;top:.17rem;left:.17rem;width:1.1rem;height:1.1rem;border-radius:50%;background:#fff;transition:.2s}
.kd-sw input:checked+i{background:#16a34a}.kd-sw input:checked+i::after{left:1.23rem}
.kd-btn{border:1px solid var(--k18-line);background:var(--k18-bg);border-radius:.7rem;padding:.4rem .8rem;font-weight:700;font-size:.85rem}.kd-btn.full{width:100%;margin-top:.6rem}
.kd-btn.big{width:100%;padding:.7rem;background:linear-gradient(90deg,var(--g1),var(--g2));color:#fff!important;border:0;margin-top:.6rem}.kd-btn.ghost{background:transparent}
.kd-btn i{font-style:normal;color:#7c3aed}.kd-sp{flex:1}
/* zona principal */
.kd-main{display:flex;flex-direction:column;min-width:0;background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,#7c3aed 14%,transparent),transparent 60%),var(--k18-bg)}
.kd-bar{display:flex;gap:.5rem;align-items:center;padding:.7rem .9rem;flex-wrap:wrap}.kd-stats{font-weight:800;font-size:.85rem}
.kd-note{margin:0 .9rem;padding:.6rem .8rem;border-radius:.8rem;background:var(--k18-soft);font-size:.85rem}.kd-link{border:0;background:transparent;color:#7c3aed!important;font-weight:800;text-decoration:underline;padding:0}
.kd-stage{position:relative;flex:none;display:grid;place-items:start center;min-height:calc(var(--s)*1.3 + 6rem);padding:3.6rem 0 1rem;perspective:1600px}
.kd-scene{display:grid;place-items:center;width:100%;transition:opacity .35s,filter .35s,transform .35s;cursor:pointer}
.kd-stage.kd-has .kd-scene{opacity:.28;filter:blur(2px);transform:scale(.9)}
.kd-tilt{width:var(--s);height:var(--s);transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(24deg);transition:transform .5s ease}
.kd-tilt.kd-idle{animation:kd-float 3.4s ease-in-out infinite}
@keyframes kd-float{0%,100%{translate:0 0}50%{translate:0 -12px}}
.kd-cube{position:relative;width:100%;height:100%;transform-style:preserve-3d}
.kd-face{position:absolute;inset:0;border-radius:22px;overflow:hidden;backface-visibility:hidden;background:#1e1b4b;border:3px solid rgba(255,255,255,.7);box-shadow:inset 0 0 40px rgba(255,255,255,.18),0 0 0 1px rgba(0,0,0,.15)}
.kd-face.f0{transform:translateZ(calc(var(--s)/2))}.kd-face.f1{transform:rotateY(90deg) translateZ(calc(var(--s)/2))}.kd-face.f2{transform:rotateY(180deg) translateZ(calc(var(--s)/2))}
.kd-face.f3{transform:rotateY(-90deg) translateZ(calc(var(--s)/2))}.kd-face.f4{transform:rotateX(90deg) translateZ(calc(var(--s)/2))}.kd-face.f5{transform:rotateX(-90deg) translateZ(calc(var(--s)/2))}
.kd-face img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}
.kd-fl{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .8rem .6rem;background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff;display:flex;flex-direction:column}.kd-fl b{font-size:1.05rem}.kd-fl small{opacity:.85}
.kd-ex{position:absolute;top:.5rem;left:.5rem;font-style:normal;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;background:rgba(0,0,0,.55);color:#fff;border-radius:999px;padding:.15rem .5rem}
.kd-ex.big{font-size:.7rem;top:.7rem;left:.7rem;z-index:2}
.kd-empty{display:grid;place-items:center;align-content:center;background:linear-gradient(135deg,#6366f1,#ec4899);color:#fff;text-align:center}.kd-empty span{font-size:4rem}.kd-empty small{font-weight:800;letter-spacing:.1em}
.kd-ck{display:none;position:absolute;inset:0;place-items:center;font-size:4rem;color:#fff;background:rgba(15,23,42,.62)}.kd-used .kd-ck{display:grid}
.kd-shadow{width:calc(var(--s)*.9);height:1.1rem;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.38),transparent);margin-top:calc(var(--s)*.12)}
.kd-go{border:0;border-radius:999px;padding:.5rem 1.4rem;font-weight:900;font-size:.95rem;background:linear-gradient(90deg,var(--g1),var(--g2));color:#fff!important;box-shadow:0 8px 22px rgba(124,58,237,.4)}
.kd-go[disabled]{opacity:.55;cursor:wait}.kd-hint{margin:0;padding:0 .9rem .3rem;color:var(--k18-mute);font-size:.84rem;min-height:1.2rem}
/* tarjeta sobre el dado */
.kd-cardhost{position:absolute;inset:0;display:grid;place-items:start center;pointer-events:none;padding:.3rem .6rem}
.kd-stage.kd-has{min-height:640px}
.kd-card{pointer-events:auto;width:min(370px,94%);background:var(--k18-card);border:1px solid var(--k18-line);border-radius:1.4rem;box-shadow:0 24px 60px rgba(0,0,0,.35);overflow:hidden;outline:0;animation:kd-pop .45s cubic-bezier(.2,1.3,.4,1);touch-action:pan-y;transition:transform .25s}
@keyframes kd-pop{from{transform:translateY(40px) scale(.6);opacity:0}to{transform:none;opacity:1}}
.kd-ph{position:relative;aspect-ratio:4/4.3;background:#111;cursor:grab;touch-action:none}.kd-ph img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none;pointer-events:none}
.kd-ov{position:absolute;left:0;right:0;bottom:0;padding:2.5rem 1rem .8rem;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff;pointer-events:none}
.kd-ov h3{margin:0;font-size:1.5rem}.kd-ov h3 span{font-weight:400}.kd-ov p{margin:.1rem 0 0;opacity:.9;font-size:.9rem}.kd-sl{color:#fde047}
.kd-st{position:absolute;top:1.4rem;font-weight:900;font-size:1.5rem;border:4px solid;border-radius:.6rem;padding:.1rem .6rem;opacity:0;pointer-events:none;z-index:3;letter-spacing:.05em}
.kd-st.like{left:1rem;color:#22c55e;transform:rotate(-14deg)}.kd-st.no{right:1rem;color:#ef4444;transform:rotate(14deg)}.kd-st.sup{left:50%;top:38%;color:#38bdf8;transform:translateX(-50%) rotate(-6deg)}
.kd-info{padding:.7rem 1rem .2rem}.kd-compat{position:relative;font-size:.85rem;padding-bottom:.45rem}.kd-compat b{color:#7c3aed;font-size:1rem}.kd-compat i{position:absolute;left:0;bottom:0;height:.28rem;border-radius:99px;background:linear-gradient(90deg,var(--g1),var(--g2))}
.kd-compat::before{content:"";position:absolute;left:0;right:0;bottom:0;height:.28rem;border-radius:99px;background:var(--k18-soft)}
.kd-bio{margin:.45rem 0;font-size:.92rem;line-height:1.4}.kd-hobs{display:flex;flex-wrap:wrap;gap:.3rem;margin:.4rem 0}.kd-hobs span{background:var(--k18-soft);border-radius:999px;padding:.18rem .6rem;font-size:.75rem}.kd-hobs span.on{background:#ede9fe;color:#5b21b6;font-weight:800}
.kd-acts{display:flex;justify-content:center;align-items:center;gap:.9rem;padding:.6rem 1rem 1rem}
.kd-rnd{width:3.6rem;height:3.6rem;border-radius:50%;border:2px solid;background:var(--k18-card);font-size:1.5rem;display:grid;place-items:center;position:relative;transition:transform .15s}.kd-rnd:hover{transform:scale(1.1)}.kd-rnd:disabled{opacity:.35;cursor:not-allowed;transform:none}
.kd-rnd.no{border-color:#ef4444;color:#ef4444!important}.kd-rnd.yes{border-color:#22c55e}.kd-rnd.sup{border-color:#38bdf8;width:3rem;height:3rem;font-size:1.2rem}.kd-rnd.sm{width:2.6rem;height:2.6rem;font-size:1.1rem;border-color:#eab308;color:#ca8a04!important}
.kd-rnd i{position:absolute;top:-.3rem;right:-.3rem;background:#0ea5e9;color:#fff;border-radius:99px;font-size:.62rem;font-style:normal;font-weight:800;padding:.05rem .35rem}
/* ventanas */
.kd-modal{position:fixed;inset:0;z-index:9999;background:rgba(2,6,23,.62);display:grid;place-items:center;padding:1rem;overflow:auto}
.kd-mc{position:relative;width:min(34rem,100%);max-height:92vh;overflow:auto;background:var(--k18-card,#fff);color:var(--k18-ink,#111);border-radius:1.3rem;padding:1.3rem;box-shadow:0 24px 70px rgba(0,0,0,.45)}.kd-mc.sm{width:min(24rem,100%);text-align:center}
.kd-mc *{box-sizing:border-box}.kd-mc .kd-x{position:absolute;top:.6rem;right:.7rem}.kd-mc h3{margin:0 0 .5rem}.kd-mc button{font:inherit;cursor:pointer;color:inherit}.kd-mut{color:var(--k18-mute,#64748b);font-size:.85rem}
.kd-mc .kd-chip{background:var(--k18-bg,#fff);border:1px solid var(--k18-line,#ddd)}.kd-mc .kd-chip.on{background:linear-gradient(90deg,#7c3aed,#ec4899);color:#fff;border-color:transparent}
.kd-mc .kd-in{width:100%;padding:.55rem .7rem;border-radius:.6rem;border:1px solid var(--k18-line,#ddd);background:var(--k18-bg,#fff);color:inherit;font:inherit;margin:.15rem 0}
.kd-pf{display:flex;gap:.8rem;align-items:center}.kd-pf .kd-sp{display:flex;flex-direction:column;gap:.3rem}.kd-pick{width:6rem;height:6rem;border-radius:1rem;overflow:hidden;background:#64748b;display:grid;place-items:center;font-size:2rem;color:#fff;cursor:pointer;flex:none}.kd-pick img{width:100%;height:100%;object-fit:cover}
.kd-chk{display:flex;gap:.5rem;align-items:center;margin:.5rem 0;font-size:.88rem}.kd-err{color:#dc2626;min-height:1.1rem;font-size:.85rem;margin:.4rem 0 0}
.kd-match{position:relative;padding:.5rem 0}.kd-match h2{font-size:1.9rem;margin:.3rem 0;background:linear-gradient(90deg,#7c3aed,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent}
.kd-pair{display:flex;justify-content:center;margin:1rem 0}.kd-pair img{width:7.5rem;height:7.5rem;border-radius:50%;object-fit:cover;border:4px solid var(--k18-card,#fff);box-shadow:0 8px 22px rgba(0,0,0,.3)}.kd-pair img+img{margin-left:-1.4rem}
.kd-hearts{position:absolute;inset:0;pointer-events:none;overflow:hidden}.kd-hearts s{position:absolute;bottom:-1rem;text-decoration:none;font-size:1.4rem;animation:kd-up 2.4s ease-out forwards}
@keyframes kd-up{to{transform:translateY(-22rem) rotate(20deg);opacity:0}}
.kd-ml{display:grid;gap:.5rem}.kd-mi{display:flex;gap:.7rem;align-items:center}.kd-mi img{width:2.8rem;height:2.8rem;border-radius:50%;object-fit:cover}
@media (max-width:959px){
  .kd,.kd.kd-wide{grid-template-columns:1fr}
  .kd-side,.kd.kd-wide .kd-side{position:absolute;inset:0 auto 0 0;margin-left:-300px;width:min(290px,86vw);box-shadow:8px 0 30px rgba(0,0,0,.3)}.kd.kd-wide .kd-side{margin-left:0}
  .kd-backdrop{display:none}.kd.kd-wide .kd-backdrop{display:block;position:absolute;inset:0;background:rgba(2,6,23,.45);z-index:5}
}
@media (max-width:520px){.kd{--s:min(62vw,250px)}.kd-bar .kd-go{order:3;flex:1 0 100%}.kd-rnd{width:3.2rem;height:3.2rem}}
@media (prefers-reduced-motion:reduce){.kd-tilt.kd-idle{animation:none}.kd-card{animation:none}.kd-side,.kd-sw i,.kd-sw i::after{transition:none}}
.kd-backdrop{display:none}
.k54.wide{max-width:1180px}
