
/* Approval cards — ported from /new lab + 5 new */
.item .stage.card-stage{
  padding:14px;
  min-height:0;
  display:block;
  background:#080b12;
}
.item .stage.card-stage.flip-stage{perspective:1200px; overflow:visible}
.item.flip-item{overflow:visible}
.item .stage.card-stage > .card,
.item .stage.card-stage > .cw > .card,
.item .stage.card-stage .card{
  width:100%;
  aspect-ratio:1;
  min-height:320px;
  max-height:none;
}
/* Keep cw helpers used by k22/k28 JS */
.cw{display:flex;flex-direction:column;gap:10px;position:relative;width:100%}
.cw > .fx{display:none} /* label moved to .lab */
.w28{width:100%}
.w22{width:100%}
.k4w{perspective:1200px}

/* Readable text overlays on vivid cards */
.card .in{color:inherit}
.card h3 .tt{text-shadow:0 1px 2px rgba(0,0,0,.55)}
.k8 .in,.k1 .in,.k12 .in,.k20 .in,.k25 .in,.k30 .in{background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.72))}
.k8 h3,.k8 p,.k8 .meta,.k8 .st{position:relative;z-index:5}
.k8 .glare{z-index:4}
.k8 .in{z-index:5}

@media (prefers-reduced-motion:reduce){
  .card, .card *{animation-duration:.01ms!important;animation-iteration-count:1!important}
}

.cg{display:contents}
.cw{display:flex;flex-direction:column;gap:10px}
.cw>.fx{font:600 10px/1 ui-monospace,monospace;letter-spacing:.3em;color:#666;text-transform:uppercase;padding-left:4px}
.cw>.fx b{color:#aaa;margin-right:8px}
.card{position:relative;aspect-ratio:1;min-height:360px;border-radius:20px;overflow:hidden;isolation:isolate;color:#e9e6df;font:14px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
.card .in{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;gap:9px;padding:22px}
.card h3{font-size:17px;line-height:1.3;font-weight:700;margin:0}
.card .pri{display:inline-block;font:700 10px/1 ui-monospace,monospace;letter-spacing:.12em;padding:5px 9px;border-radius:99px;border:1.5px solid #d9a441;color:#e7b24d;vertical-align:3px;margin-left:6px}
.card .pri.HIGH{border-color:#ef5350;color:#ff6b68}.card .pri.LOW{border-color:#5fa8d3;color:#7cc0e8}
.card .st{align-self:flex-start;font:12px ui-monospace,monospace;padding:5px 12px;border-radius:99px;background:#111;border:1px solid #333;color:#ddd;transition:.3s}
.card .st.done{background:#123;border-color:#4a9}
.card p{margin:0;color:#b9b4aa;font-size:13.5px}
.card .meta{font-size:12px;color:#8a857c}
.card .acts{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.card .acts.one{grid-template-columns:1fr}
.card .b{position:relative;overflow:hidden;cursor:pointer;font:600 14px system-ui,sans-serif;padding:13px 8px;border-radius:12px;border:1px solid;transition:transform .15s,box-shadow .2s,background .2s,filter .2s;-webkit-tap-highlight-color:transparent}
.card .b:focus-visible,.card a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.card .b:active{transform:scale(.95)}
.card .go{background:#16291f;color:#86d39a;border-color:#2f5e40}.card .wt{background:#2a2213;color:#e9b24a;border-color:#5c4820}
.card .no{background:#2c1716;color:#ef7d6c;border-color:#5f2b27}.card .tk{background:#1b1c38;color:#a3a8ff;border-color:#4a4fb0}
.card a{color:inherit;text-decoration:none;position:relative}
.card .rep{font-size:12.5px;font-weight:600;align-self:flex-start}
.wave{position:absolute;border-radius:50%;background:currentColor;opacity:.35;transform:scale(0);animation:wv .6s ease-out forwards;pointer-events:none}@keyframes wv{to{transform:scale(3.5);opacity:0}}
.card .bg,.card canvas.bg{position:absolute;inset:0;width:100%;height:100%;z-index:0}

/* 1 WebGL */
.k1{background:#05030c;border:1px solid #2a1f4a}
.k1 .in{background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.7))}
.k1 .b{backdrop-filter:blur(6px);background:rgba(0,0,0,.45)}
.k1 .b:hover{box-shadow:0 0 24px -4px currentColor}
.k1 a{background:linear-gradient(90deg,#f0f,#0ff,#ff0,#f0f);background-size:300%;-webkit-background-clip:text;background-clip:text;color:transparent;transition:background-position .8s}
.k1 a:hover,.k1 a:focus-visible{background-position:100%}
.k1 a::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;background:linear-gradient(90deg,#f0f,#0ff);transform:scaleX(0);transform-origin:left;transition:.4s}.k1 a:hover::after{transform:none}

/* 2 SVG turbulence */
.k2{background:#0b0a09;border:1px solid #3a2f25}
.k2 .bg{filter:url(#smoke);background:radial-gradient(circle at 30% 20%,#c2410c 0,transparent 40%),radial-gradient(circle at 80% 90%,#7c2d12 0,transparent 45%);opacity:.75}
.k2 h3{color:#ffd8b8}
.k2 .b{background:rgba(20,12,8,.7);border-radius:6px}
.k2 .b:hover{filter:url(#wobble)}
.k2 a{color:#fdba74;border-bottom:1px solid #fdba7466}.k2 a:hover{filter:url(#wobble);color:#fff}

/* 3 @property conic */
@property --ca{syntax:'<angle>';initial-value:0deg;inherits:true}
.k3{--ca:0deg;background:conic-gradient(from var(--ca),#22d3ee,#a855f7,#f43f5e,#facc15,#22d3ee);padding:2px;animation:cspin 5s linear infinite}
.k3 .in{background:#070709;border-radius:18px}
.k3::after{content:'';position:absolute;inset:-10px;background:inherit;filter:blur(30px);opacity:.35;z-index:-1}
@keyframes cspin{to{--ca:360deg}}
.k3 .b{background:#070709;border:0;box-shadow:inset 0 0 0 1px #333}
.k3 .b::before{content:'';position:absolute;inset:0;padding:1.5px;border-radius:inherit;background:conic-gradient(from calc(var(--ca)*2),transparent 60%,currentColor);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.k3 a{background:linear-gradient(90deg,#22d3ee,#a855f7) left bottom/0 2px no-repeat;transition:background-size .4s;color:#c4b5fd}.k3 a:hover,.k3 a:focus-visible{background-size:100% 2px}

/* 4 3D flip */
.cw.k4w{perspective:1200px}
.k4{overflow:visible;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,1.4,.4,1);background:none}
.k4.flip{transform:rotateY(180deg)}
.k4 .face{position:absolute;inset:0;border-radius:20px;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:linear-gradient(160deg,#1e293b,#0f172a);border:1px solid #334155}
.k4 .back{transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:30px;text-align:center}
.k4 .back .big{font:800 64px/1 system-ui;background:linear-gradient(#fbbf24,#f97316);-webkit-background-clip:text;color:transparent}
.k4 .b{transform-style:preserve-3d;box-shadow:0 6px 0 -1px rgba(0,0,0,.6)}.k4 .b:active{transform:translateY(5px);box-shadow:0 1px 0 rgba(0,0,0,.6)}
.k4 a{color:#93c5fd;padding-right:18px}.k4 a::after{content:'→';position:absolute;right:0;transition:transform .3s}.k4 a:hover::after,.k4 a:focus-visible::after{transform:translateX(6px)}

/* 5 aurora glass */
.k5{background:#000}
.k5 .bg{background:radial-gradient(40% 50% at 20% 30%,#10b981,transparent),radial-gradient(40% 50% at 80% 20%,#6366f1,transparent),radial-gradient(50% 50% at 60% 90%,#ec4899,transparent);filter:blur(30px);animation:aur 12s ease-in-out infinite alternate}
@keyframes aur{50%{transform:scale(1.3) rotate(20deg) translate(5%,-5%)}100%{transform:rotate(-15deg) scale(1.1)}}
.k5 .in{margin:14px;height:calc(100% - 28px);background:rgba(255,255,255,.07);backdrop-filter:blur(22px) saturate(160%);border:1px solid rgba(255,255,255,.18);border-radius:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.k5 p,.k5 .meta{color:#e5e7eb}
.k5 .b{background:rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.25);border-color:rgba(255,255,255,.25)}
.k5 .go{color:#6ee7b7}.k5 .wt{color:#fcd34d}.k5 .no{color:#fca5a5}.k5 .tk{color:#c7d2fe}
.k5 .b:hover{background:rgba(255,255,255,.18)}
.k5 a{padding:1px 6px;margin:-1px -6px;border-radius:6px;transition:background .3s}.k5 a:hover,.k5 a:focus-visible{background:rgba(255,255,255,.2);outline:none}

/* 6 brutalist */
.k6{background:#f4f1ea;color:#000;border-radius:0;border:3px solid #000;box-shadow:10px 10px 0 #ff3e00;font-family:ui-monospace,Menlo,monospace}
.k6 h3{font:900 20px/1.1 ui-monospace,monospace;text-transform:uppercase}
.k6 p{color:#222}.k6 .meta{color:#444}
.k6 .pri{border-radius:0;background:#000;color:#ff3e00;border-color:#000}
.k6 .st{border-radius:0;background:#ff3e00;color:#000;border:2px solid #000}
.k6 .b{border-radius:0;border:3px solid #000;color:#000;box-shadow:5px 5px 0 #000;font:800 13px ui-monospace,monospace;text-transform:uppercase}
.k6 .go{background:#00e676}.k6 .wt{background:#ffd600}.k6 .no{background:#ff5252}.k6 .tk{background:#8c9eff}
.k6 .b:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #000}.k6 .b:active{transform:translate(5px,5px);box-shadow:0 0 0 #000}
.k6 a{font-weight:800;text-decoration:underline 3px;text-underline-offset:3px}.k6 a:hover,.k6 a:focus-visible{background:#000;color:#f4f1ea;text-decoration:none;outline:none}

/* 7 CRT */
.k7{background:radial-gradient(ellipse,#031a08,#000 80%);border:1px solid #0a3;color:#3f6;font-family:ui-monospace,"Courier New",monospace;text-shadow:0 0 6px #3f6a;border-radius:26px/22px}
.k7::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.35) 0 1px,transparent 1px 3px)}
.k7::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(transparent,rgba(51,255,102,.08),transparent);height:30%;animation:roll 4s linear infinite}
@keyframes roll{from{top:-30%}to{top:100%}}
.k7 .in{animation:crtf 5s infinite}@keyframes crtf{97%{opacity:1}98%{opacity:.8}}
.k7 h3{font:700 15px ui-monospace,monospace}.k7 h3::before{content:'> '}
.k7 p,.k7 .meta{color:#2c4}.k7 .pri,.k7 .st{border-radius:0;border-color:#3f6;color:#3f6;background:none}
.k7 .st::after{content:'█';animation:blink 1s steps(1) infinite;margin-left:4px}@keyframes blink{50%{opacity:0}}
.k7 .b{background:none;border:1px solid #3f6;color:#3f6;border-radius:0;font:600 13px ui-monospace,monospace}
.k7 .b::before{content:'[ '}.k7 .b::after{content:' ]'}
.k7 .b:hover,.k7 .b:focus-visible{background:#3f6;color:#000;text-shadow:none}
.k7 .no{border-color:#f55;color:#f55}.k7 .no:hover{background:#f55}
.k7 a:hover::before,.k7 a:focus-visible::before{content:'>';position:absolute;left:-12px;animation:blink .6s steps(1) infinite}.k7 a{text-decoration:underline}

/* 8 holo */
.k8{transition:transform .15s;background:linear-gradient(115deg,#1a1a2e,#16213e);border:1px solid #444;transform-style:preserve-3d}
.k8 .bg{background:linear-gradient(115deg,transparent 20%,rgba(255,0,150,.35) 35%,rgba(0,255,255,.35) 45%,rgba(255,255,0,.35) 55%,transparent 70%),repeating-linear-gradient(60deg,rgba(255,255,255,.04) 0 2px,transparent 2px 6px);background-size:300% 300%,auto;background-position:var(--hx,50%) var(--hy,50%);mix-blend-mode:color-dodge}
.k8 .glare{position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.35),transparent 45%);mix-blend-mode:overlay}
.k8 .b{background:linear-gradient(115deg,#ffffff10,#ffffff25);border-color:#ffffff40}
.k8 .b:hover{background:linear-gradient(115deg,#f0f4,#0ff4,#ff04)}
.k8 a{background:linear-gradient(90deg,#ff9a9e,#a1c4fd,#d4fc79,#ff9a9e);background-size:200%;-webkit-background-clip:text;color:transparent;animation:au8 3s linear infinite;font-weight:700}
@keyframes au8{to{background-position:200%}}

/* 9 neumorphic */
.k9{background:#1c1d21;border-radius:28px;box-shadow:12px 12px 26px #0c0c0e,-8px -8px 22px #2e3036}
.k9 .st{background:#1c1d21;border:0;box-shadow:inset 3px 3px 6px #0e0e10,inset -3px -3px 6px #2b2c31}
.k9 .b{background:#1c1d21;border:0;border-radius:16px;box-shadow:6px 6px 12px #0d0d0f,-5px -5px 12px #2c2d32}
.k9 .b:active,.k9 .b.pressed{transform:none;box-shadow:inset 5px 5px 10px #0d0d0f,inset -5px -5px 10px #2c2d32}
.k9 a{color:#c9c6bd;padding:2px 8px;border-radius:8px;box-shadow:3px 3px 6px #0d0d0f,-3px -3px 6px #2c2d32;transition:.2s}
.k9 a:hover,.k9 a:focus-visible{box-shadow:inset 3px 3px 6px #0d0d0f,inset -3px -3px 6px #2c2d32;outline:none;color:#fff}

/* 10 paper ink */
.k10{background:#f3ead8;background-image:radial-gradient(#0000 60%,#c8b48a55),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");color:#2b2118;font-family:Georgia,"Times New Roman",serif;border-radius:4px;transform:rotate(-.6deg)}
.k10 h3{font:italic 700 19px/1.25 Georgia,serif}
.k10 p{color:#4a3c2e;font-size:14px}.k10 .meta{color:#7a6650;font-style:italic}
.k10 .pri{border-color:#a3261b;color:#a3261b;border-radius:3px;transform:rotate(-6deg);border-width:2px}
.k10 .st{background:none;border:1px dashed #7a6650;color:#5a4a3a;font-family:Georgia,serif}
.k10 .b{background:none;border:2px solid;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;font:italic 700 15px Georgia,serif}
.k10 .go{color:#2e6b3a}.k10 .wt{color:#9a6a00}.k10 .no{color:#a3261b}.k10 .tk{color:#3a3f9a}
.k10 .b:hover{background:currentColor}.k10 .b:hover span{color:#f3ead8}
.k10 a{background:linear-gradient(104deg,#ffe86a00 2%,#ffe86a 6%,#ffd23aaa 94%,#ffe86a00 98%) left 60%/0 70% no-repeat;transition:background-size .5s;color:#2b2118;font-weight:700}
.k10 a:hover,.k10 a:focus-visible{background-size:100% 70%;outline:none}

/* 11 gooey */
.k11{background:#0d0618;border:1px solid #3b1d5e}
.k11 .goo{position:absolute;inset:0;filter:url(#goo2);z-index:0}
.k11 .goo i{position:absolute;border-radius:50%;background:#a21caf;width:110px;height:110px;opacity:.5}
.k11 .goo i:nth-child(1){left:72%;top:38%;animation:g1 7s ease-in-out infinite}
.k11 .goo i:nth-child(2){left:80%;top:52%;width:80px;height:80px;background:#7c3aed;animation:g2 6s ease-in-out infinite}
.k11 .goo i:nth-child(3){left:62%;top:50%;width:70px;height:70px;background:#db2777;animation:g1 5s ease-in-out infinite reverse}
@keyframes g1{50%{transform:translate(-50px,20px)}}@keyframes g2{50%{transform:translate(-30px,-40px)}}
.k11 .acts{filter:url(#goo2);padding:4px}
.k11 .b{border:0;border-radius:30px;color:#fff}
.k11 .go{background:#15803d}.k11 .wt{background:#b45309}.k11 .no{background:#b91c1c}.k11 .tk{background:#4338ca}
.k11 .b:hover{transform:scale(1.06)}
.k11 .drop{position:absolute;width:22px;height:22px;border-radius:50%;pointer-events:none}
.k11 a{text-decoration:underline wavy #e879f9 1.5px;text-underline-offset:4px;color:#f5d0fe}.k11 a:hover{text-decoration-color:#22d3ee}

/* 12 particles */
.k12{background:#020617;border:1px solid #1e3a5f}
.k12 .b{background:rgba(2,6,23,.75)}
.k12 .b:hover{transform:translateY(-2px)}
.k12 a{color:#7dd3fc;background:radial-gradient(circle,#7dd3fc 1px,transparent 1.5px) left bottom/5px 3px repeat-x;padding-bottom:3px;transition:letter-spacing .3s}
.k12 a:hover,.k12 a:focus-visible{background-image:linear-gradient(#7dd3fc,#7dd3fc);background-size:100% 1px;outline:none}

/* 13 magnetic */
.k13{background:radial-gradient(circle at 50% 120%,#3f2a00,#0a0700 60%);border:1px solid #4a3a10}
.k13 .b{transition:transform .25s cubic-bezier(.2,.8,.2,1.4),box-shadow .2s;border-radius:40px}
.k13 .b span{display:inline-block;transition:transform .25s}
.k13 .b:hover{box-shadow:0 10px 30px -10px currentColor}
.k13 a{color:#fde68a;transition:letter-spacing .35s,color .3s}.k13 a:hover,.k13 a:focus-visible{letter-spacing:.12em;color:#fff;outline:none;text-shadow:0 0 12px #fbbf24}

/* 14 scramble */
.k14{background:#0a0a0a;border:1px solid #262626;font-family:ui-monospace,monospace}
.k14 h3{font:700 16px ui-monospace,monospace;letter-spacing:-.02em}
.k14 .b{font:600 13px ui-monospace,monospace;background:#0a0a0a;border-radius:4px}
.k14 .b:hover{background:currentColor}.k14 .b:hover span{color:#000}
.k14 a{color:#a3e635;border-bottom:1px dotted}

/* 15 spotlight */
.k15{background:#050505;border:1px solid #1a1a1a}
.k15 .bg{background-image:linear-gradient(#fff1 1px,transparent 1px),linear-gradient(90deg,#fff1 1px,transparent 1px),radial-gradient(circle at var(--sx,50%) var(--sy,40%),#f59e0b55,transparent 40%);background-size:24px 24px,24px 24px,auto;-webkit-mask:radial-gradient(circle 160px at var(--sx,50%) var(--sy,40%),#000,transparent);mask:radial-gradient(circle 160px at var(--sx,50%) var(--sy,40%),#000,transparent)}
.k15::after{content:'';position:absolute;inset:0;border-radius:20px;padding:1px;background:radial-gradient(circle 120px at var(--sx,50%) var(--sy,40%),#fbbf24,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:3;pointer-events:none}
.k15 .b{background:#0c0c0c;border-color:#222}
.k15 .b:hover{border-color:currentColor;box-shadow:inset 0 0 20px -6px currentColor}
.k15 a{color:#777;transition:color .3s,text-shadow .3s}.k15 a:hover,.k15 a:focus-visible{color:#fde68a;text-shadow:0 0 14px #f59e0b;outline:none}

/* 16 cyber glitch */
.k16{background:#0b0b12;border-radius:0;clip-path:polygon(0 0,calc(100% - 34px) 0,100% 34px,100% 100%,34px 100%,0 calc(100% - 34px));font-family:"Arial Narrow",system-ui,sans-serif}
.k16::before{content:'';position:absolute;inset:0;border:1px solid #f0e130;clip-path:inherit;pointer-events:none}
.k16 .bg{background:linear-gradient(90deg,#f0e13008 1px,transparent 1px) 0 0/16px 16px}
.k16 h3{color:#f0e130;text-transform:uppercase;letter-spacing:.04em;position:relative}
.k16 h3.gl{animation:glt .35s steps(2) 2}
@keyframes glt{0%{text-shadow:3px 0 #0ff,-3px 0 #f0f;transform:translate(2px)}50%{text-shadow:-3px 0 #0ff,3px 0 #f0f;transform:translate(-2px) skewX(8deg)}100%{text-shadow:none}}
.k16 .pri{border-radius:0;background:#f0e130;color:#000;border:0}
.k16 .st{border-radius:0;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);background:#1f1f30;border:0;padding:5px 16px}
.k16 .b{border-radius:0;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));text-transform:uppercase;letter-spacing:.1em;font-size:12px;border:0}
.k16 .go{background:#00ff9f;color:#000}.k16 .wt{background:#f0e130;color:#000}.k16 .no{background:#ff003c;color:#fff}.k16 .tk{background:#5d3fd3;color:#fff}
.k16 .b:hover{animation:glt .3s steps(2) 1}
.k16 a{color:#0ff;text-transform:uppercase;font-size:.95em}.k16 a:hover,.k16 a:focus-visible{animation:glt .3s steps(2) infinite;outline:1px solid #0ff}

/* 17 blueprint */
.k17{background:#0b3d91;background-image:linear-gradient(#ffffff1a 1px,transparent 1px),linear-gradient(90deg,#ffffff1a 1px,transparent 1px),linear-gradient(#ffffff0c 1px,transparent 1px),linear-gradient(90deg,#ffffff0c 1px,transparent 1px);background-size:60px 60px,60px 60px,12px 12px,12px 12px;color:#e8f0ff;border-radius:2px;font-family:"Courier New",monospace}
.k17 .in{border:1px dashed #ffffff70;margin:10px;height:calc(100% - 20px);border-radius:0}
.k17 .in::before{content:'SHEET 17 / REV B';position:absolute;right:8px;bottom:-1px;transform:translateY(100%);font-size:9px;letter-spacing:.2em;color:#ffffffaa}
.k17 h3{font:700 15px "Courier New",monospace}
.k17 p,.k17 .meta{color:#cfe0ff}
.k17 .pri,.k17 .st{background:none;border-radius:0;border:1px solid #fff;color:#fff}
.k17 .b{background:transparent;border:1px solid #fff;color:#fff;border-radius:0;font:700 12px "Courier New",monospace;text-transform:uppercase}
.k17 .b::after{content:'';position:absolute;inset:3px;border:1px dashed #ffffff55}
.k17 .go::before{content:'A';position:absolute;left:5px;top:2px;font-size:8px}.k17 .wt::before{content:'B';position:absolute;left:5px;top:2px;font-size:8px}.k17 .no::before{content:'C';position:absolute;left:5px;top:2px;font-size:8px}.k17 .tk::before{content:'D';position:absolute;left:5px;top:2px;font-size:8px}
.k17 .b:hover{background:#ffffff22}
.k17 a{color:#fff;padding:0 4px}.k17 a::before,.k17 a::after{position:absolute;top:0;opacity:0;transition:.25s}
.k17 a::before{content:'[';left:-6px}.k17 a::after{content:']';right:-6px}.k17 a:hover::before,.k17 a:focus-visible::before{opacity:1;left:-2px}.k17 a:hover::after,.k17 a:focus-visible::after{opacity:1;right:-2px}

/* 18 neon */
.k18{background:#06040a;border:2px solid #ff2fd0;box-shadow:0 0 12px #ff2fd0,inset 0 0 18px #ff2fd066,0 0 50px -10px #ff2fd0}
.k18 h3{color:#fff;text-shadow:0 0 4px #fff,0 0 12px #ff2fd0,0 0 26px #ff2fd0}
.k18 .b{background:transparent;border-width:2px;border-radius:30px;text-shadow:0 0 8px currentColor;box-shadow:0 0 8px currentColor,inset 0 0 8px currentColor}
.k18 .go{color:#39ff14;border-color:#39ff14}.k18 .wt{color:#ffe600;border-color:#ffe600}.k18 .no{color:#ff3131;border-color:#ff3131}.k18 .tk{color:#7d7dff;border-color:#7d7dff}
.k18 .b:hover{background:currentColor}.k18 .b:hover span{color:#000;text-shadow:none}
.k18 .b:active{box-shadow:0 0 30px currentColor,inset 0 0 20px currentColor}
.k18 a{color:#0ff;text-shadow:0 0 6px #0ff}.k18 a:hover,.k18 a:focus-visible{animation:np 1s ease-in-out infinite alternate;outline:none}
@keyframes np{to{text-shadow:0 0 4px #fff,0 0 14px #0ff,0 0 30px #0ff}}

/* 19 isometric */
.k19{background:linear-gradient(135deg,#1f2937,#111827);border:1px solid #374151}
.k19 .b{border:0;border-radius:10px;color:#fff;transform:translateY(-6px);transition:transform .1s,box-shadow .1s}
.k19 .go{background:#22c55e;box-shadow:0 6px 0 #15803d,0 6px 14px #0008}.k19 .wt{background:#f59e0b;box-shadow:0 6px 0 #b45309,0 6px 14px #0008}
.k19 .no{background:#ef4444;box-shadow:0 6px 0 #991b1b,0 6px 14px #0008}.k19 .tk{background:#6366f1;box-shadow:0 6px 0 #3730a3,0 6px 14px #0008}
.k19 .b:hover{transform:translateY(-8px)}.k19 .b:active{transform:translateY(0);box-shadow:0 0 0 transparent}
.k19 .acts{gap:16px 12px;padding-top:6px}
.k19 a{color:#fbbf24;transition:transform .2s,text-shadow .2s;display:inline-block}
.k19 a:hover,.k19 a:focus-visible{transform:translate(-2px,-3px);text-shadow:1px 1px 0 #b45309,2px 2px 0 #92400e,3px 3px 0 #78350f;outline:none}

/* 20 starfield */
.k20{background:#000;border:1px solid #1c1c3a}
.k20 .b{background:rgba(0,0,10,.6);backdrop-filter:blur(2px)}
.k20 .b:hover{box-shadow:0 0 0 1px currentColor,0 0 30px -6px currentColor}
.k20 a{color:#c4b5fd}.k20 a::after{content:'✦';position:absolute;right:-14px;top:-6px;font-size:10px;opacity:0;transform:scale(0) rotate(0);transition:.4s}
.k20 a:hover::after,.k20 a:focus-visible::after{opacity:1;transform:scale(1.3) rotate(180deg);color:#fff}

/* cards 21-30 */
@media (max-width:420px){.cg{grid-template-columns:minmax(0,1fr)}}
/* 21 Anchor-Positioned Tooltips */
.k21{background:#eef5ef;color:#14281c;border:1px solid #b7d3bf}
.k21 .bg{background:linear-gradient(#0000 23px,#7fb08f40 24px) 0 0/100% 24px,linear-gradient(90deg,#0000 23px,#7fb08f40 24px) 0 0/24px 100%}
.k21 .bg::after{content:'';position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;border:2px dashed #2f8f5780}
.k21 p{color:#35503f}.k21 .meta{color:#5d7a68}.k21 .meta a{text-decoration:underline}
.k21 .st{background:#fff;border-color:#9cc3a8;color:#1d3a29}.k21 .st.done{background:#cfeedb;border-color:#2f8f57}
.k21 .pri,.k21 .pri.HIGH,.k21 .pri.LOW{color:#14281c;border-color:#2f8f57;background:#d8efe0}
.k21 .b{box-shadow:0 2px 0 currentColor;transition:transform .15s,box-shadow .15s}
.k21 .go{background:#d3f2dc;color:#135c32;border-color:#74c08f}.k21 .wt{background:#fff1cc;color:#7a5200;border-color:#e3bc5c}
.k21 .no{background:#fde0dc;color:#8f2418;border-color:#e69b92}.k21 .tk{background:#e3e5ff;color:#2c33a0;border-color:#9aa0e8}
.k21 .b:hover{transform:translateY(-2px)}
.k21 .rep{color:#1b6b3c;text-decoration:underline wavy;text-underline-offset:4px}
.k21 .tip{position:absolute;z-index:6;pointer-events:none;opacity:0;scale:.9;transition:opacity .15s,scale .15s;background:#14281c;color:#eaffef;font:600 11.5px/1.3 ui-monospace,monospace;padding:6px 10px;border-radius:8px;white-space:nowrap;box-shadow:0 6px 16px -6px #0006}
.k21 .tip.on{opacity:1;scale:1}
.k21.fb .tip{translate:-50% 0}
@supports (anchor-name:--a){
.k21 .go{anchor-name:--k21go}.k21 .wt{anchor-name:--k21wt}.k21 .no{anchor-name:--k21no}.k21 .tk{anchor-name:--k21tk}
.k21:not(.fb) .tip{bottom:anchor(top);left:anchor(center);translate:-50% 0;margin-block:8px;position-try-fallbacks:flip-block,flip-inline;max-width:90%}
.k21 .t-go{position-anchor:--k21go}.k21 .t-wt{position-anchor:--k21wt}.k21 .t-no{position-anchor:--k21no}.k21 .t-tk{position-anchor:--k21tk}
.k21:not(.fb) .acts:has(.go:is(:hover,:focus-visible))~.t-go,.k21:not(.fb) .acts:has(.wt:is(:hover,:focus-visible))~.t-wt,.k21:not(.fb) .acts:has(.no:is(:hover,:focus-visible))~.t-no,.k21:not(.fb) .acts:has(.tk:is(:hover,:focus-visible))~.t-tk{opacity:1;scale:1}
}
/* 22 @starting-style Pop */
.k22{background:linear-gradient(160deg,#101a38,#0b0f22);border:1px solid #2f4486;transition:opacity .6s,transform .7s cubic-bezier(.2,.9,.2,1),display .7s allow-discrete}
.cw.w22.js{min-height:400px}
.k22.pre{display:none;opacity:0;transform:translateY(46px) scale(.9) rotate(-2deg)}
.k22 .bg{background:radial-gradient(circle at 90% 0,#5b7bd855,#0000 50%),radial-gradient(circle at 0 100%,#2de0b333,#0000 50%)}
.k22 .st{transition:opacity .5s .25s,transform .5s .25s cubic-bezier(.2,1.4,.4,1),display .5s .25s allow-discrete,background .3s}
.k22 .st.hid{display:none;opacity:0;transform:scale(.4)}
.k22 .rep{color:#8fb0ff;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
@starting-style{.k22{opacity:0;transform:translateY(46px) scale(.9) rotate(-2deg)}.k22 .st{opacity:0;transform:translateX(-24px) scale(.5)}}
.pop22{width:min(88vw,330px);padding:18px;border-radius:16px;border:1px solid #5b7bd8;background:#0b1022;color:#dfe7ff;box-shadow:0 30px 80px -20px #000;opacity:0;transform:translateY(26px) scale(.92);transition:opacity .35s,transform .45s cubic-bezier(.2,.9,.2,1),overlay .45s allow-discrete,display .45s allow-discrete}
.pop22:popover-open{opacity:1;transform:none}
.pop22 h4{font:700 15px system-ui;margin:0 0 6px}.pop22 p{color:#b8c6f0;margin:0 0 8px}.pop22 .cur{font:12px ui-monospace,monospace;color:#7ee0c0}
.pop22 button{margin-top:10px;font:600 13px system-ui;padding:8px 14px;border-radius:10px;border:1px solid #4a63b8;background:#16214a;color:#cfdcff;cursor:pointer}
.pop22::backdrop{background:#000a;opacity:0;transition:opacity .35s,overlay .45s allow-discrete,display .45s allow-discrete}
.pop22:popover-open::backdrop{opacity:1}
@starting-style{.pop22:popover-open{opacity:0;transform:translateY(26px) scale(.92)}.pop22:popover-open::backdrop{opacity:0}}
@supports not selector(:popover-open){.pop22{display:none}}
/* 23 Scroll-Driven Reveal */
.k23{background:#120a1e;border:1px solid #3b2262;view-timeline:--k23t block}
.k23 .bg{background:linear-gradient(160deg,#2b0f5c,#0d3b66 45%,#0a7d6c) 0 0/100% 300%}
.k23 .bg::after{content:'';position:absolute;inset:auto -20% -30% auto;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#ffffff30,#0000 65%)}
.k23 .in{background:linear-gradient(180deg,#0000,#0007)}
.k23 .prog{position:absolute;left:0;top:0;height:5px;width:100%;background:linear-gradient(90deg,#7cf,#f7c);transform-origin:0 50%;transform:scaleX(var(--p,.5));z-index:3}
.k23 .rep{color:#9fe8ff;text-decoration:underline;text-underline-offset:4px}
@supports (animation-timeline:view()){
.k23 .prog{transform:scaleX(0)}
@media (prefers-reduced-motion:no-preference){
.k23 .bg{animation:k23bg linear both;animation-timeline:--k23t;animation-range:cover 0% cover 100%}
.k23 .prog{animation:k23p linear both;animation-timeline:--k23t;animation-range:cover 0% cover 100%}
.k23 .in>*{animation:k23r linear both;animation-timeline:view();animation-range:entry 0% entry 90%}
}
@media (prefers-reduced-motion:reduce){.k23 .prog{transform:scaleX(.5)}}
}
@keyframes k23bg{from{background-position:0 0;filter:hue-rotate(0)}to{background-position:0 100%;filter:hue-rotate(150deg)}}
@keyframes k23p{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes k23r{from{opacity:0;transform:translateY(38px) scale(.94)}to{opacity:1;transform:none}}
/* 24 View Transition Morph */
.k24{background:#0c1722;border:1px solid #1f4057}
.k24 .bg{background:radial-gradient(circle at 20% 110%,#1f6f8b44,#0000 55%)}
.k24 .stamp{position:absolute;right:-26px;top:-26px;width:140px;height:140px;background:#7c8cff;border-radius:50%;opacity:.85;view-transition-name:k24stamp;transition:none}
.k24[data-a=go] .stamp{background:#3ddc84;border-radius:50%}.k24[data-a=wt] .stamp{background:#ffb02e;border-radius:28%}
.k24[data-a=no] .stamp{background:#ff5a52;border-radius:10%;transform:rotate(45deg)}.k24[data-a=tk] .stamp{background:#a78bfa;border-radius:50% 50% 50% 6%}
.k24 .st{view-transition-name:k24pill}
.k24 .st[data-a=go]{background:#103a24;border-color:#3ddc84;color:#b8f5d1}.k24 .st[data-a=wt]{background:#3b2a0b;border-color:#ffb02e;color:#ffe0a1}
.k24 .st[data-a=no]{background:#3d1412;border-color:#ff5a52;color:#ffc2bd}.k24 .st[data-a=tk]{background:#251b4d;border-color:#a78bfa;color:#d9ccff}
.k24 .rep{color:#8fd9f5;text-decoration:underline dotted;text-underline-offset:4px}
::view-transition-group(k24stamp){animation-duration:.7s;animation-timing-function:cubic-bezier(.2,.9,.2,1)}
::view-transition-group(k24pill){animation-duration:.5s;animation-timing-function:cubic-bezier(.3,1.3,.5,1)}
@media (prefers-reduced-motion:reduce){::view-transition-group(k24stamp),::view-transition-group(k24pill),::view-transition-old(k24stamp),::view-transition-new(k24stamp),::view-transition-old(k24pill),::view-transition-new(k24pill){animation:none!important}}
/* 25 Mesh Gradient @property */
@property --m1x{syntax:'<percentage>';inherits:false;initial-value:15%}@property --m1y{syntax:'<percentage>';inherits:false;initial-value:20%}
@property --m2x{syntax:'<percentage>';inherits:false;initial-value:85%}@property --m2y{syntax:'<percentage>';inherits:false;initial-value:15%}
@property --m3x{syntax:'<percentage>';inherits:false;initial-value:20%}@property --m3y{syntax:'<percentage>';inherits:false;initial-value:85%}
@property --m4x{syntax:'<percentage>';inherits:false;initial-value:80%}@property --m4y{syntax:'<percentage>';inherits:false;initial-value:80%}
@property --mc1{syntax:'<color>';inherits:false;initial-value:#ff3cac}@property --mc2{syntax:'<color>';inherits:false;initial-value:#2b86c5}
@property --mc3{syntax:'<color>';inherits:false;initial-value:#ffb347}@property --mc4{syntax:'<color>';inherits:false;initial-value:#7f5af0}
.k25{background:#0b0618;border:1px solid #ffffff22}
.k25 .bg{--m1x:15%;--m1y:20%;--m2x:85%;--m2y:15%;--m3x:20%;--m3y:85%;--m4x:80%;--m4y:80%;--mc1:#ff3cac;--mc2:#2b86c5;--mc3:#ffb347;--mc4:#7f5af0;
background:radial-gradient(circle at var(--m1x) var(--m1y),var(--mc1),#0000 55%),radial-gradient(circle at var(--m2x) var(--m2y),var(--mc2),#0000 55%),radial-gradient(circle at var(--m3x) var(--m3y),var(--mc3),#0000 55%),radial-gradient(circle at var(--m4x) var(--m4y),var(--mc4),#0000 60%),#0b0618}
@media (prefers-reduced-motion:no-preference){.k25 .bg{animation:k25a 15s ease-in-out infinite alternate,k25c 22s linear infinite alternate}}
@keyframes k25a{25%{--m1x:60%;--m1y:35%;--m2x:40%;--m2y:60%}50%{--m1x:80%;--m1y:75%;--m2x:15%;--m2y:30%;--m3x:65%;--m3y:25%}75%{--m3x:30%;--m3y:55%;--m4x:25%;--m4y:20%}100%{--m1x:30%;--m1y:80%;--m2x:75%;--m2y:70%;--m3x:85%;--m3y:30%;--m4x:15%;--m4y:55%}}
@keyframes k25c{0%{--mc1:#ff3cac;--mc2:#2b86c5;--mc3:#ffb347;--mc4:#7f5af0}50%{--mc1:#ffd23c;--mc2:#ff4d6d;--mc3:#3ce6c8;--mc4:#2b86c5}100%{--mc1:#7f5af0;--mc2:#3ce6c8;--mc3:#ff3cac;--mc4:#ffb347}}
.k25 .in{background:linear-gradient(180deg,#0000 20%,#0009)}.k25 h3,.k25 p{text-shadow:0 1px 8px #0008}.k25 p,.k25 .meta{color:#f0e9ff}
.k25 .b{backdrop-filter:blur(8px);background:#0006}.k25 .rep{color:#fff;text-decoration:underline;text-underline-offset:4px}
/* 26 Liquid Glass */
.k26{background:#10143a;border:1px solid #ffffff22}
.k26 .bg i{position:absolute;border-radius:50%;animation:k26f 12s ease-in-out infinite alternate}
.k26 .bg i:nth-of-type(1){width:62%;aspect-ratio:1;left:-12%;top:-8%;background:radial-gradient(circle at 35% 35%,#ff4d8d,#ff9a3c)}
.k26 .bg i:nth-of-type(2){width:56%;aspect-ratio:1;right:-14%;top:24%;background:radial-gradient(circle at 40% 40%,#2ee6c9,#2f7bff);animation-duration:15s;animation-direction:alternate-reverse}
.k26 .bg i:nth-of-type(3){width:50%;aspect-ratio:1;left:22%;bottom:-20%;background:radial-gradient(circle at 40% 40%,#a259ff,#ffd23c);animation-duration:18s}
@keyframes k26f{to{transform:translate(22%,14%) scale(1.18) rotate(50deg)}}
.k26 .in{margin:12px;height:calc(100% - 24px);padding:18px;border-radius:24px;background:linear-gradient(135deg,#ffffff3d,#ffffff0a 45%,#ffffff22);border:1px solid #ffffff66;backdrop-filter:blur(14px) saturate(1.7);-webkit-backdrop-filter:blur(14px) saturate(1.7);box-shadow:inset 0 1px 0 #fffc,inset 0 -1px 0 #fff5,inset 0 0 22px #ffffff22,0 24px 40px -24px #000a;text-shadow:0 1px 6px #0006}
.k26.rf .in{backdrop-filter:url(#lg26) blur(3px) saturate(1.8) brightness(1.08)}
.k26 p,.k26 .meta{color:#f2f4ff}.k26 .meta a{text-decoration:underline}
.k26 .st{background:#ffffff30;border-color:#fff8;color:#fff}.k26 .st.done{background:#ffffff55}
.k26 .b{background:#ffffff26;border-color:#ffffff77;color:#fff;backdrop-filter:blur(6px);box-shadow:inset 0 1px 0 #fffa}
.k26 .rep{color:#fff;text-decoration:underline;text-underline-offset:4px}
/* 27 Variable Font Kinetic */
.k27{background:#0b0b0b;border:1px solid #2c3310;--vf:'Roboto Flex','Inter',system-ui,sans-serif}
.k27 .bg b{position:absolute;right:-4%;bottom:6%;font:400 190px/1 var(--vf);color:#d7ff3a14;font-variation-settings:'wght' 300,'wdth' 100;pointer-events:none;user-select:none}
.k27 h3{font:600 24px/1.08 var(--vf);min-height:3.3em;color:#f3ffd0;font-optical-sizing:auto;font-variation-settings:'wght' 520,'wdth' 100}
.k27 .tt{font-variation-settings:'wght' 520,'wdth' 100;cursor:default}
.k27 .n{color:#d7ff3a;font-variation-settings:'wght' 900,'wdth' 70}
.k27 .pri{font-family:ui-monospace,monospace}
.k27 .rep{color:#d7ff3a;text-decoration:underline;text-underline-offset:4px}
@media (prefers-reduced-motion:no-preference){
.k27 .tt{animation:k27b 6s ease-in-out infinite}.k27 .bg b{animation:k27g 9s ease-in-out infinite}
.k27 h3:hover .tt,.k27 h3:focus-within .tt{animation:k27h 1.1s ease-in-out infinite alternate}}
@keyframes k27b{0%,100%{font-variation-settings:'wght' 380,'wdth' 88;letter-spacing:-.01em}50%{font-variation-settings:'wght' 720,'wdth' 116;letter-spacing:.012em}}
@keyframes k27h{from{font-variation-settings:'wght' 100,'wdth' 40}to{font-variation-settings:'wght' 1000,'wdth' 151}}
@keyframes k27g{0%,100%{font-variation-settings:'wght' 200,'wdth' 60}50%{font-variation-settings:'wght' 1000,'wdth' 151}}
/* 28 Container Query Adaptive */
.cw.w28{resize:horizontal;overflow:hidden;min-width:250px;max-width:100%;width:100%;padding-bottom:22px;position:relative;color-scheme:dark}
.cw.w28::after{content:'drag corner \2198';position:absolute;right:26px;bottom:3px;font:600 9px/1 ui-monospace,monospace;letter-spacing:.2em;color:#ff7a59;text-transform:uppercase;pointer-events:none}
.w28 .rz{position:absolute;right:0;top:-3px;font:600 9px/1 ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#ff7a59;background:none;border:1px solid #ff7a5966;border-radius:99px;padding:4px 8px;cursor:pointer}
.k28{background:#2a0f1c;border:1px solid #6b2a43;container:k28/inline-size;min-height:420px}
.k28 .bg{background:repeating-linear-gradient(90deg,#ff7a5920 0 1px,#0000 1px 10cqw),repeating-linear-gradient(0deg,#ff7a5920 0 1px,#0000 1px 10cqw),radial-gradient(circle at 100% 0,#ff7a5944,#0000 55%)}
.k28 .tier{position:absolute;left:50%;bottom:0;translate:-50% 0;font:700 9.5px/1 ui-monospace,monospace;letter-spacing:.14em;padding:5px 10px;border-radius:8px 8px 0 0;background:#ff7a59;color:#2a0f1c}
.k28 .tier::after{content:'MEDIUM \b7  2\d7 2'}
.k28 p{color:#e9c9cf}.k28 .meta{color:#b98a95}.k28 .rep{color:#ff9d84;text-decoration:underline;text-underline-offset:4px}
@container k28 (min-width:420px){.k28 .tier::after{content:'WIDE \b7  4 across'}.k28 .acts{grid-template-columns:repeat(4,1fr)}.k28 .b{font-size:12.5px;padding:12px 4px}.k28 h3{font-size:20px}}
@container k28 (max-width:339px){.k28 .tier::after{content:'NARROW \b7  stacked'}.k28 .acts{grid-template-columns:1fr;gap:6px}.k28 .meta{display:none}.k28 .b{padding:8px}.k28 p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}
@container k28 (max-width:279px){.k28 .tier::after{content:'TINY \b7  bare'}.k28 p{display:none}.k28 h3{font-size:14px}.k28 .in{padding:14px 14px 20px}}
/* 29 color-mix + light-dark */
.k29{color-scheme:light dark;--bg:oklch(24% .035 265);--fg:oklch(94% .02 95);--ac:oklch(76% .16 295);--ac2:oklch(78% .14 190);background:var(--bg);color:var(--fg);border:1px solid color-mix(in oklch,var(--ac) 40%,var(--bg))}
@supports (color:light-dark(red,blue)){.k29{--bg:light-dark(oklch(97% .02 95),oklch(24% .035 265));--fg:light-dark(oklch(25% .04 265),oklch(94% .02 95));--ac:light-dark(oklch(55% .2 295),oklch(76% .16 295));--ac2:light-dark(oklch(60% .14 190),oklch(78% .14 190))}}
.k29[data-cs=light]{color-scheme:light}.k29[data-cs=dark]{color-scheme:dark}
.k29 .bg{background:radial-gradient(circle at 88% 8%,color-mix(in oklch,var(--ac) 45%,transparent),transparent 55%),radial-gradient(circle at 8% 100%,color-mix(in oklch,var(--ac2) 40%,transparent),transparent 50%)}
.k29 p{color:color-mix(in oklch,var(--fg) 78%,var(--bg))}.k29 .meta{color:color-mix(in oklch,var(--fg) 55%,var(--bg))}
.k29 .st{background:color-mix(in oklch,var(--fg) 8%,var(--bg));color:var(--fg);border-color:color-mix(in oklch,var(--fg) 25%,var(--bg))}
.k29 .st.done{background:color-mix(in oklch,var(--ac2) 30%,var(--bg));border-color:var(--ac2)}
.k29 .pri,.k29 .pri.HIGH,.k29 .pri.LOW{color:var(--fg);border-color:var(--ac);background:color-mix(in oklch,var(--ac) 16%,transparent)}
.k29 h3{padding-right:46px}
.k29 .b{background:color-mix(in oklch,var(--c) 20%,var(--bg));color:color-mix(in oklch,var(--c) 62%,var(--fg));border-color:color-mix(in oklch,var(--c) 50%,var(--bg))}
.k29 .b:hover{background:color-mix(in oklch,var(--c) 34%,var(--bg))}
.k29 .go{--c:oklch(65% .18 150)}.k29 .wt{--c:oklch(78% .16 80)}.k29 .no{--c:oklch(60% .21 25)}.k29 .tk{--c:oklch(60% .18 270)}
.k29 .rep{color:var(--ac);text-decoration:underline;text-underline-offset:4px}
.k29 .cs{position:absolute;right:16px;top:16px;z-index:3;width:38px;height:22px;border-radius:99px;border:1px solid color-mix(in oklch,var(--fg) 35%,var(--bg));background:color-mix(in oklch,var(--fg) 10%,var(--bg));color:var(--fg);cursor:pointer;padding:0;font-size:12px;line-height:1}
.k29 .cs::before{content:'\25D0';display:block;transition:transform .35s}.k29[data-cs=light] .cs::before{content:'\2600'}.k29[data-cs=dark] .cs::before{content:'\263E'}
/* 30 WebGPU Compute Particles */
.k30{background:#02030a;border:1px solid #1a2a55}
.k30::after{content:attr(data-mode);position:absolute;right:14px;top:12px;z-index:3;font:700 9.5px/1 ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#7ee0ff;opacity:.85;pointer-events:none}
.k30 .in{background:linear-gradient(180deg,#0000 30%,#0008)}.k30 .st{background:#0a1226cc}.k30 .rep{color:#7ee0ff;text-decoration:underline;text-underline-offset:4px}
.k30 .b{backdrop-filter:blur(5px);background:#050a1acc}.k30 .b:hover{box-shadow:0 0 22px -4px currentColor}

/* ===== NEW 31–35 ===== */
.k31{background:#04110c;border:1px solid #1a4a38;font-family:ui-monospace,Menlo,monospace;color:#9fffd0}
.k31 .rain{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:.55;mix-blend-mode:screen}
.k31 .rain span{position:absolute;top:-120%;font:700 11px/1.15 ui-monospace,monospace;color:#3dff9a;white-space:pre;animation:rainFall linear infinite;text-shadow:0 0 8px #1aff8a}
@keyframes rainFall{to{transform:translateY(140vh)}}
.k31 .in{background:linear-gradient(180deg,#0000 10%,#04110cee);z-index:2}
.k31 .b{background:#062218cc;border-color:#2f8f6a;color:#9fffd0}
.k31 .b:hover{box-shadow:0 0 18px -4px #3dff9a}
.k31 a{color:#7dffa8;text-decoration:underline;text-underline-offset:3px}

.k32{background:#0a0c12;border:1px solid #2a3348;overflow:hidden}
.k32 .depth{position:absolute;inset:-8%;z-index:0;background:
  radial-gradient(ellipse 70% 55% at 50% 42%,#3a4a6a 0%,#1a2233 45%,#0a0c12 75%),
  linear-gradient(160deg,#1e293b,#0f172a);
  transform:translate3d(calc(var(--px,0)*12px),calc(var(--py,0)*10px),0) scale(1.08);
  transition:transform .12s linear;will-change:transform}
.k32 .depth::before{content:'';position:absolute;inset:18% 22% 28%;border-radius:40% 42% 38% 45%;background:radial-gradient(circle at 40% 35%,#94a3b8,#334155 60%,#1e293b);box-shadow:0 30px 60px #0008;transform:translate3d(calc(var(--px,0)*-18px),calc(var(--py,0)*-14px),0);transition:transform .12s linear}
.k32 .depth::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 80%,#0000,#0009 70%);pointer-events:none}
.k32 .in{background:linear-gradient(180deg,#0000 25%,#000a);z-index:2}
.k32 .b{background:#121826cc;backdrop-filter:blur(4px)}
.k32 a{color:#93c5fd}

.k33{background:#0c0a12;border:1px solid #3a2a55;--rx:0px;--ry:0px;--rz:0px}
.k33 .chrom{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .25s;
  background:
    linear-gradient(115deg,#ff004080,#00e5ff40 50%,#7c5cff60);
  mix-blend-mode:screen}
.k33:hover .chrom,.k33:focus-within .chrom{opacity:1}
.k33 .in{z-index:2;transition:transform .2s}
.k33:hover .in{transform:translate(var(--rx),var(--ry))}
.k33 h3{position:relative}
.k33:hover h3::before,.k33:hover h3::after{
  content:attr(data-t);position:absolute;left:0;top:0;width:100%;pointer-events:none;opacity:.7
}
.k33:hover h3::before{color:#ff2a6d;transform:translate(calc(var(--rz)*-1),0);clip-path:inset(0 0 55% 0);mix-blend-mode:screen}
.k33:hover h3::after{color:#00e5ff;transform:translate(var(--rz),0);clip-path:inset(45% 0 0 0);mix-blend-mode:screen}
.k33 .b{background:#160f24cc;border-color:#5b3f8a}
.k33 .b:hover{box-shadow:0 0 20px -6px #c084fc}
.k33 a{color:#e9d5ff}

.k34{background:#0a0908;border:1px solid #3a3228;color:#f3ead8;isolation:isolate}
.k34 .grain{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.28;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  animation:grainShift 1.2s steps(4) infinite}
@keyframes grainShift{0%{transform:translate(0,0)}25%{transform:translate(-2%,3%)}50%{transform:translate(3%,-1%)}75%{transform:translate(-1%,-3%)}100%{transform:translate(0,0)}}
.k34::after{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(ellipse at center,transparent 42%,#000c 100%)}
.k34 .bg{background:linear-gradient(160deg,#2a2218,#0e0c0a 60%),radial-gradient(circle at 70% 20%,#5c403088,transparent 50%)}
.k34 .in{z-index:2}
.k34 p,.k34 .meta{color:#cbbba0}
.k34 .b{background:#1a1510cc;border-color:#5c4a36;color:#f3ead8}
.k34 a{color:#e7c27a;text-decoration:underline;text-underline-offset:3px}

.k35{background:#1a120c;border:2px solid #5c3a1e;color:#f6e7d0;font-family:Georgia,"Times New Roman",serif}
.k35 .stamp-layer{position:absolute;right:10%;top:12%;z-index:3;pointer-events:none;width:110px;height:110px}
.k35 .stamp{
  position:absolute;inset:0;border:4px double #c0392b;border-radius:50%;
  color:#c0392b;font:900 13px/1.1 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;
  display:grid;place-items:center;text-align:center;padding:12px;
  transform:rotate(-18deg) scale(.2);opacity:0;
  box-shadow:inset 0 0 0 2px #c0392b55,0 8px 20px #0006;
  filter:url(#stampRough);
}
.k35.hit .stamp{animation:stampHit .55s cubic-bezier(.2,1.4,.3,1) forwards}
@keyframes stampHit{
  0%{opacity:0;transform:rotate(-28deg) scale(1.6) translate(10px,-20px)}
  55%{opacity:1;transform:rotate(-14deg) scale(1.05)}
  100%{opacity:.92;transform:rotate(-18deg) scale(1)}
}
.k35 .in{z-index:2}
.k35 .b{border-radius:4px;font:700 13px Georgia,serif;background:#2a1a12;border-color:#7a4a28;color:#f6e7d0}
.k35 .b:hover{background:#3a2418}
.k35 a{color:#e07a5f;font-weight:700}
@media (prefers-reduced-motion:reduce){
  .k31 .rain span{animation:none;top:10%}
  .k34 .grain{animation:none}
  .k35.hit .stamp{animation:none;opacity:.92;transform:rotate(-18deg) scale(1)}
}


/* ===== NEW 36–40 ===== */
/* 36 Blueprint Grid */
.k36{background:#0a2744;border:1px solid #1e4a73;color:#cfe9ff;font-family:ui-monospace,Menlo,monospace}
.k36 .sheet{position:absolute;inset:0;z-index:0;pointer-events:none;
  background-color:#0a2744;
  background-image:
    linear-gradient(#1e5a8a55 1px,transparent 1px),
    linear-gradient(90deg,#1e5a8a55 1px,transparent 1px),
    linear-gradient(#2a7ab833 1px,transparent 1px),
    linear-gradient(90deg,#2a7ab833 1px,transparent 1px);
  background-size:80px 80px,80px 80px,16px 16px,16px 16px;
  background-position:var(--bx,0) var(--by,0);
  transition:background-position .08s linear}
.k36 .sheet::before{content:'';position:absolute;left:12px;right:12px;top:12px;bottom:12px;border:1px solid #3b82f655}
.k36 .sheet::after{content:'A1';position:absolute;left:18px;top:16px;font:700 10px ui-monospace,monospace;letter-spacing:.2em;color:#60a5fa88}
.k36 .in{background:linear-gradient(180deg,#0a274400 10%,#0a2744ee);z-index:2}
.k36 .b{background:#0c3054cc;border-color:#3b82f6;color:#bfdbfe}
.k36 .b:hover{box-shadow:0 0 18px -4px #60a5fa}
.k36 a{color:#93c5fd;text-decoration:underline;text-underline-offset:3px}
.k36 .pri{border-color:#60a5fa;color:#93c5fd}

/* 37 Polaroid Tilt Stack */
.k37{background:#1a1512;border:1px solid #4a3a2e;color:#f5e6d3;overflow:visible}
.k37 .stack{position:absolute;inset:10% 12% 42%;z-index:1;pointer-events:none}
.k37 .p{position:absolute;inset:0;background:#f4efe6;border-radius:4px;box-shadow:0 10px 24px #0007;
  transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.k37 .p::after{content:'';position:absolute;left:8%;right:8%;top:8%;height:62%;background:
  linear-gradient(145deg,#94a3b8,#334155 40%,#1e293b);border-radius:2px}
.k37 .p1{transform:rotate(-6deg) translate(-6px,4px);z-index:1}
.k37 .p2{transform:rotate(3deg) translate(4px,-2px);z-index:2}
.k37 .p3{transform:rotate(-1deg);z-index:3;background:#faf6ef}
.k37:hover .p1{transform:rotate(-14deg) translate(-18px,10px)}
.k37:hover .p2{transform:rotate(12deg) translate(16px,-6px)}
.k37:hover .p3{transform:rotate(-2deg) translate(0,-8px) scale(1.02)}
.k37.is-snap .p3{animation:polaroidSnap .55s cubic-bezier(.2,1.2,.3,1) forwards}
@keyframes polaroidSnap{0%{transform:rotate(-2deg)}40%{transform:rotate(4deg) translateY(-20px) scale(1.05)}100%{transform:rotate(-8deg) translate(30px,40px) scale(.9);opacity:.3}}
.k37 .in{z-index:4;background:linear-gradient(180deg,#0000 20%,#1a1512f0)}
.k37 .b{background:#2a2018;border-color:#6b5344;color:#f5e6d3;border-radius:6px}
.k37 a{color:#e7c27a}

/* 38 Terminal Boot Card */
.k38{background:#020805;border:1px solid #1a3d2a;color:#9affc5;font-family:ui-monospace,Menlo,Consolas,monospace}
.k38 .boot{position:absolute;inset:12px 12px auto;z-index:1;margin:0;padding:10px 12px;max-height:38%;overflow:hidden;
  font:700 10px/1.45 ui-monospace,monospace;color:#3dff9a99;white-space:pre-wrap;pointer-events:none;
  border:1px solid #1a3d2a;border-radius:8px;background:#04140ccc}
.k38 .boot .cur{display:inline-block;width:7px;height:12px;background:#3dff9a;vertical-align:-2px;animation:blink .8s step-end infinite}
@keyframes blink{50%{opacity:0}}
.k38 .in{z-index:2;background:linear-gradient(180deg,#0000 8%,#020805f2)}
.k38 .b{background:#062218;border-color:#2f8f6a;color:#9affc5;border-radius:4px;font-family:inherit}
.k38 .b:hover{box-shadow:0 0 16px -4px #3dff9a}
.k38 a{color:#7dffa8;text-decoration:underline;text-underline-offset:3px}
.k38 .st{background:#04140c;border-color:#1a3d2a;color:#9affc5}

/* 39 Watercolor Bleed */
.k39{background:#f3ebe1;border:1px solid #d4c4b0;color:#3b2f28}
.k39 .wash{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.9;mix-blend-mode:multiply}
.k39 .in{z-index:2}
.k39 p,.k39 .meta{color:#6b5a4e}
.k39 .st{background:#ebe0d4;border-color:#c4b09a;color:#5c4a3c}
.k39 .b{background:#e8dccf;border-color:#b89f86;color:#3b2f28}
.k39 .b:hover{background:#ddd0c0}
.k39 .go{color:#2f6b4f;border-color:#6a9a7e}.k39 .wt{color:#9a6b20}.k39 .no{color:#a14a3c}.k39 .tk{color:#4a4f8a}
.k39 a{color:#7a4e2d;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.k39 .pri{border-color:#a67c52;color:#8a6240}
.k39 h3{color:#2a211c}

/* 40 Comic Halftone */
.k40{background:#ffef5a;border:3px solid #111;color:#111;box-shadow:6px 6px 0 #111;font-family:"Comic Sans MS",system-ui,sans-serif}
.k40 .tone{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.35;
  background-image:radial-gradient(circle,#111 1.1px,#0000 1.2px);background-size:8px 8px;
  transition:background-size .35s,opacity .35s}
.k40:hover .tone,.k40:focus-within .tone{background-size:5px 5px;opacity:.5}
.k40 .burst{position:absolute;right:8%;top:10%;z-index:1;width:72px;height:72px;border-radius:50%;
  background:#ff3b5c;border:3px solid #111;color:#fff;font:900 16px/72px system-ui;text-align:center;
  transform:rotate(12deg) scale(0);box-shadow:3px 3px 0 #111;pointer-events:none}
.k40.is-pow .burst{animation:powIn .45s cubic-bezier(.2,1.4,.3,1) forwards}
@keyframes powIn{0%{transform:rotate(12deg) scale(0)}60%{transform:rotate(-8deg) scale(1.15)}100%{transform:rotate(12deg) scale(1)}}
.k40 .in{z-index:2}
.k40 p,.k40 .meta{color:#333}
.k40 .st{background:#fff;border:2px solid #111;color:#111;border-radius:0;font-weight:800}
.k40 .b{background:#fff;border:2px solid #111;color:#111;border-radius:0;box-shadow:3px 3px 0 #111;font-weight:800}
.k40 .b:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 #111}
.k40 .b:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #111}
.k40 .go{background:#7dffb3}.k40 .wt{background:#ffd36b}.k40 .no{background:#ff8a7a}.k40 .tk{background:#9ad0ff}
.k40 a{color:#111;font-weight:900;text-decoration:underline;text-underline-offset:3px}
.k40 .pri{border:2px solid #111;border-radius:0;color:#111;background:#fff}
.k40 h3{font-weight:900}

.item:has(.k8),.item:has(.k4){overflow:visible}
.item:has(.k8) .stage,.item:has(.k4) .stage{overflow:visible}

@media (prefers-reduced-motion:reduce){
  .k37 .p,.k36 .sheet{transition:none!important}
  .k37.is-snap .p3,.k40.is-pow .burst{animation:none!important;opacity:.95;transform:none}
  .k38 .boot .cur{animation:none}
}

/* ===== 41-50 (2026-10-22) ===== */
/* 41 Split-Flap Board */
.k41{background:#101113;border:1px solid #2b2c31;background-image:linear-gradient(#ffffff05 1px,transparent 1px);background-size:100% 4px}
.k41::after{content:'DECISIONS \00B7  BAY 3';position:absolute;left:22px;top:12px;z-index:3;font:700 9.5px/1 ui-monospace,Menlo,monospace;letter-spacing:.22em;color:#f2b632;pointer-events:none}
.k41 .in{padding-top:32px}
.k41 h3{perspective:500px;line-height:1.75}
.k41 .tt .wd{display:inline-flex;gap:2px;white-space:nowrap;margin:0 6px 3px 0;vertical-align:top}
.k41 .fl{display:inline-block;min-width:.92em;text-align:center;font:700 14px/1.6 ui-monospace,Menlo,Consolas,monospace;color:#f5f1e6;
  background:linear-gradient(#2a2b30 0 48%,#050506 48% 52%,#1e1f23 52%);border-radius:3px;box-shadow:0 1px 0 #000,inset 0 1px 0 #ffffff12;padding:0 1px;backface-visibility:hidden}
.k41 .fl.go{animation:k41f .06s linear}
@keyframes k41f{50%{transform:rotateX(-85deg);filter:brightness(.6)}}
.k41 .st{display:inline-flex;flex-wrap:wrap;gap:2px;background:none;border:0;padding:0;font:700 12px ui-monospace,Menlo,monospace;color:#f2b632}
.k41 .st:not(:has(.fl)){background:#1e1f23;padding:4px 8px;border-radius:3px}
.k41 .st .fl{color:#f2b632;font-size:12px}
.k41 .pri{border-radius:3px;border-color:#f2b632;color:#f2b632}
.k41 p{color:#a9a69d}.k41 .meta{color:#77746c}.k41 a{color:#f2b632}
.k41 .b{background:#1a1b1e;border-color:#34353b;border-radius:4px;font:700 11.5px ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;box-shadow:inset 0 -3px 0 currentColor}
.k41 .b:hover{background:#232429;box-shadow:inset 0 -3px 0 currentColor,0 0 18px -6px currentColor}

/* 42 Thermal Drone Cam */
.k42{background:#05030a;border:1px solid #3a1a3a}
.k42 canvas.bg{image-rendering:auto}
.k42 .hud{position:absolute;inset:14px;z-index:1;pointer-events:none;font:700 10px/1 ui-monospace,Menlo,monospace;color:#fff;letter-spacing:.12em}
.k42 .hud i{position:absolute;width:18px;height:18px;border:2px solid #ffffffb0}
.k42 .hud i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.k42 .hud i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.k42 .hud i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.k42 .hud i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.k42 .hud .rec{position:absolute;right:26px;top:4px;color:#ff4d4d;animation:k42b 1s steps(2) infinite}
.k42 .hud .tmp{position:absolute;right:26px;top:18px;color:#fff;font-size:12px}
.k42 .hud .xh{position:absolute;left:var(--x,50%);top:var(--y,50%);width:26px;height:26px;margin:-13px 0 0 -13px;border:1.5px solid #fff;border-radius:50%;transition:left .08s,top .08s}
.k42 .hud .xh::before,.k42 .hud .xh::after{content:'';position:absolute;background:#fff;left:50%;top:-8px;width:1.5px;height:40px;margin-left:-.75px}
.k42 .hud .xh::after{transform:rotate(90deg)}
@keyframes k42b{50%{opacity:0}}
.k42 .in{background:linear-gradient(180deg,#0006 0,#0000 30%,#0000 45%,#000c 78%)}
.k42 h3,.k42 p,.k42 .meta{text-shadow:0 1px 3px #000,0 0 12px #000}
.k42 p{color:#efe6f2}.k42 .meta{color:#cbbfd0}
.k42 .st{background:#000a;border-color:#fff4;color:#fff}
.k42 .b{background:#0b0610d9;backdrop-filter:blur(4px)}
.k42 .b:hover{box-shadow:0 0 20px -4px #ff7a1a;border-color:#ff9a3c}
.k42 a{color:#ffd166}

/* 43 Water Ripple */
.k43{background:#032a3d;border:1px solid #0d5675}
.k43 .in{background:linear-gradient(180deg,#00141f99,#0000 40%,#00141fcc 80%)}
.k43 h3,.k43 p{text-shadow:0 1px 2px #001a26}
.k43 p{color:#cfeffa}.k43 .meta{color:#8cc6d8}
.k43 .st{background:#00283acc;border-color:#2c87a8;color:#bfefff}
.k43 .b{background:#00324aa6;backdrop-filter:blur(6px) saturate(140%);border-color:#ffffff30;border-radius:999px}
.k43 .b:hover{background:#00405ec0;box-shadow:inset 0 0 14px #9be7ff40}
.k43 a{color:#9be7ff}

/* 44 Topographic Contours */
.k44{background:#efe5cf;border:1px solid #b89c6d;color:#2b1d0e}
.k44 .in{background:radial-gradient(120% 80% at 50% 45%,#efe5cf00 30%,#efe5cfcc 75%)}
.k44 h3{color:#2b1d0e;text-shadow:0 0 6px #efe5cf,0 0 2px #efe5cf}
.k44 p{color:#4a3720;text-shadow:0 0 6px #efe5cf}.k44 .meta{color:#6b5638}
.k44 .pri{background:#efe5cf}
.k44 .st{background:#f7f0e0;border-color:#a48455;color:#4a3720}
.k44 .st.done{background:#e3efd9;border-color:#5f8a4b}
.k44 .b{background:#f7f0e0e6;border-color:#a48455;border-radius:4px}
.k44 .b:hover{background:#fffaf0}
.k44 .go{color:#2f6b3a}.k44 .wt{color:#8a5a00}.k44 .no{color:#9a2f22}.k44 .tk{color:#3d3f99}
.k44 a{color:#7a3e10;text-decoration:underline;text-underline-offset:3px}
.k44 .elev{position:absolute;right:16px;top:14px;z-index:3;font:600 10px ui-monospace,monospace;color:#7a5a30;letter-spacing:.1em;pointer-events:none}

/* 45 Thermal Receipt */
.k45{background:#1c1d21;border:1px solid #2e2f35}
.k45 .slot{position:absolute;left:14px;right:14px;top:8px;height:10px;border-radius:5px;background:#050506;box-shadow:inset 0 2px 3px #000,0 1px 0 #ffffff14;z-index:3}
.k45 .in{margin:13px 24px 0;height:calc(100% - 13px);padding:16px 16px 22px;background:#fbf8f1;color:#1d1c1a;font:12.5px/1.45 ui-monospace,Menlo,Consolas,monospace;gap:7px;
  -webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/12px 100%;
  box-shadow:0 10px 30px #000;transform-origin:top}
.k45.js .in{transform:translateY(-104%)}
.k45.js.printed .in{transform:none;transition:transform 1.4s steps(18)}
.k45 h3{font:700 13px/1.4 ui-monospace,Menlo,monospace;text-transform:uppercase;border-bottom:1px dashed #9a968c;padding-bottom:7px}
.k45 .pri{border-radius:0;border-color:#1d1c1a;color:#1d1c1a}
.k45 .st{background:none;border:1px dashed #1d1c1a;border-radius:0;color:#1d1c1a;font-size:11.5px}
.k45 .st::before{content:'STATUS: '}
.k45 p{color:#3a3834;font-size:12px}.k45 .meta{color:#6b685f;font-size:11px}
.k45 .log{font-size:11.5px;white-space:pre;overflow:hidden;color:#1d1c1a}
.k45 .log:empty{display:none}
.k45 .log .ln{display:block;animation:k45p .35s steps(6)}
@keyframes k45p{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
.k45 .bar{height:20px;background:repeating-linear-gradient(90deg,#1d1c1a 0 2px,#0000 2px 3px,#1d1c1a 3px 4px,#0000 4px 7px,#1d1c1a 7px 10px,#0000 10px 11px);opacity:.85;display:none}
.k45 .bar.on{display:block}
.k45 .acts{gap:6px}
.k45 .b{background:#fbf8f1;border:1px dashed #1d1c1a;border-radius:0;color:#1d1c1a;font:700 11.5px ui-monospace,Menlo,monospace;text-transform:uppercase;padding:9px 4px}
.k45 .b:hover{background:#1d1c1a;color:#fbf8f1}
.k45 a{color:#1d1c1a;text-decoration:underline}

/* 46 Laser-Etched Maple */
@property --burn{syntax:'<percentage>';inherits:false;initial-value:0%}
.k46{border:1px solid #9c7346;color:#2a1607;
  background:
    radial-gradient(ellipse 18% 6% at 72% 64%,#8a5a2e66,#0000 70%),
    radial-gradient(ellipse 10% 3.5% at 72% 64%,#5b361866,#0000 80%),
    repeating-linear-gradient(176deg,#0000 0 7px,#a8743f14 7px 8px,#0000 8px 19px,#7d4e2410 19px 21px),
    repeating-linear-gradient(181deg,#0000 0 3px,#c08a5214 3px 4px),
    linear-gradient(100deg,#e2bd8c,#d5a873 40%,#e6c497 70%,#d1a26b)}
.k46::before{content:'';position:absolute;inset:0;z-index:0;opacity:.45;mix-blend-mode:multiply;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.006 .14' numOctaves='3' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .33 0 0 0 0 .15 0 0 0 1.1 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E") center/cover}
.k46 h3 .tt{--burn:0%;background:linear-gradient(90deg,#2a1607 var(--burn),#ff9d3c calc(var(--burn) + .5%),#fff1c4 calc(var(--burn) + 1.5%),#9c734600 calc(var(--burn) + 3%));
  -webkit-background-clip:text;background-clip:text;color:#a77a4c40;-webkit-text-stroke:.4px #8b603a50}
.k46.lit h3 .tt{animation:k46b 2.2s cubic-bezier(.4,0,.3,1) forwards}
@keyframes k46b{to{--burn:100%}}
.k46 h3{text-shadow:none}
.k46 p,.k46 .meta{color:#3d230d;text-shadow:0 1px 0 #f3d9b060}
.k46 .meta{color:#5a3a1c}
.k46 .pri{border-color:#5b3618;color:#5b3618;background:#f0d3a666}
.k46 .st{background:#3a2210;border-color:#22120a;color:#ffd9a0;box-shadow:inset 0 1px 2px #000}
.k46 .b{background:#e9c798;border:1px solid #9c7346;border-radius:6px;color:#3b210c;box-shadow:inset 0 1px 0 #fff3dd,inset 0 -2px 0 #a8774480;font-weight:700}
.k46 .b span{transition:color .3s,text-shadow .3s}
.k46 .b:hover span,.k46 .b:focus-visible span{color:#1f0f04;text-shadow:0 0 6px #ff8a2a,0 0 1px #ff8a2a}
.k46 .b.hot{animation:k46h .9s ease-out}
@keyframes k46h{0%{box-shadow:inset 0 0 0 2px #ff8a2a,0 0 26px #ff8a2a}100%{}}
.k46 a{color:#7a3a0c;font-weight:700;text-decoration:underline;text-decoration-color:#7a3a0c80;text-underline-offset:3px}

/* 47 Falling Sand */
.k47{background:#0f0d14;border:1px solid #2c2638}
.k47 canvas.bg{image-rendering:pixelated;cursor:crosshair}
.k47 .in{pointer-events:none;background:linear-gradient(180deg,#0f0d14e6 0,#0f0d1400 48%)}
.k47 .in a,.k47 .in .b{pointer-events:auto}
.k47 p{color:#c9c2d6}.k47 .meta{color:#8f879e}
.k47 .hint{font:600 10px ui-monospace,monospace;letter-spacing:.12em;color:#8f879e;text-transform:uppercase}
.k47 .b{background:#18151f;border-width:1.5px}
.k47 .b:hover{transform:translateY(-1px);box-shadow:0 6px 18px -8px currentColor}
.k47 a{color:#f5c26b}

/* 48 Radar Sweep */
.k48{background:#010a05;border:1px solid #0f3b1f}
.k48 .grid{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(#0000 calc(50% - .5px),#1f6b3a80 calc(50% - .5px) calc(50% + .5px),#0000 0),
    linear-gradient(90deg,#0000 calc(50% - .5px),#1f6b3a80 calc(50% - .5px) calc(50% + .5px),#0000 0),
    repeating-radial-gradient(circle at 50% 50%,#0000 0 calc(16.6% - 1px),#1f6b3a80 calc(16.6% - 1px) 16.6%)}
.k48 canvas.bg{mix-blend-mode:screen}
.k48 .in{background:radial-gradient(circle at 50% 50%,#0000 20%,#010a05b0 72%)}
.k48 h3,.k48 p{text-shadow:0 0 8px #010a05,0 0 2px #010a05}
.k48 h3{color:#c6ffd6}.k48 p{color:#8fe0a8}.k48 .meta{color:#4fa36b}
.k48 .brg{font:700 10px ui-monospace,monospace;letter-spacing:.14em;color:#4bff8a;position:absolute;right:16px;bottom:118px;z-index:3;pointer-events:none;text-shadow:0 0 6px #4bff8a}
.k48 .st{background:#021a0c;border-color:#1f6b3a;color:#7dffa8}
.k48 .pri{background:#021a0c}
.k48 .b{background:#021a0ccc;border-color:#1f6b3a;color:#7dffa8;border-radius:4px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
.k48 .b::before,.k48 .b::after{content:'';position:absolute;width:10px;height:10px;border:2px solid #4bff8a;opacity:0;transition:.25s;pointer-events:none}
.k48 .b::before{left:10px;top:10px;border-right:0;border-bottom:0}.k48 .b::after{right:10px;bottom:10px;border-left:0;border-top:0}
.k48 .b:hover::before,.k48 .b:focus-visible::before{left:3px;top:3px;opacity:1}.k48 .b:hover::after,.k48 .b:focus-visible::after{right:3px;bottom:3px;opacity:1}
.k48 .no{color:#ff8f7a;border-color:#6b2a1f}.k48 .wt{color:#ffd36b;border-color:#6b5a1f}.k48 .tk{color:#9fd4ff;border-color:#1f4f6b}
.k48 a{color:#7dffa8}

/* 49 CNC Toolpath */
.k49{background:#16191d;border:1px solid #2c3138;
  background-image:radial-gradient(circle,#0a0b0d 2.2px,#0000 2.6px),linear-gradient(#ffffff06 1px,#0000 1px);background-size:28px 28px,100% 28px}
.k49 svg.tp{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
.k49 .plan{fill:none;stroke:#3fd0ff;stroke-width:1;stroke-dasharray:4 5;opacity:.55}
.k49 .cut{fill:none;stroke:#050607;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.k49 .cutEdge{fill:none;stroke:#3a4048;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;opacity:.6}
.k49 .bit circle{fill:#c9d1d9;stroke:#5c6672;stroke-width:1}
.k49 .bit path{fill:#5c6672}
.k49 .bit .fl{transform-box:fill-box;transform-origin:center;animation:k49s .25s linear infinite}
@keyframes k49s{to{transform:rotate(360deg)}}
.k49 .gc{position:absolute;left:22px;bottom:8px;z-index:3;font:600 10px ui-monospace,Menlo,monospace;color:#3fd0ff;letter-spacing:.06em;pointer-events:none;white-space:nowrap}
.k49 .in{padding-bottom:26px}
.k49 h3{color:#eef3f7}.k49 p{color:#a5b0bb}.k49 .meta{color:#6f7b87}
.k49 .st{background:#0d0f12;border-color:#2c3138;color:#9fdcf5}
.k49 .b{background:#1d2126;border-color:#343a42;border-radius:6px}
.k49 .b:hover,.k49 .b:focus-visible{background:#121418;box-shadow:inset 0 2px 6px #000,inset 0 0 0 1px #3fd0ff55}
.k49 .b.pocket{background:#0c0d10;box-shadow:inset 0 3px 8px #000,inset 0 0 0 1px currentColor}
.k49 a{color:#3fd0ff}

/* 50 Cut-Sheet Nest */
.k50{background:#0b1220;border:1px solid #1f2d47}
.k50 svg.nest{position:absolute;left:6%;right:6%;top:31%;width:88%;height:auto;z-index:0;overflow:visible}
.k50 .sheet{fill:#e8dcc6;stroke:#a89676;stroke-width:.4}
.k50 .part rect{fill:#2f6fd0;stroke:#0b1220;stroke-width:.5;transition:fill .2s}
.k50 .part:nth-child(3n) rect{fill:#3c86e6}.k50 .part:nth-child(4n) rect{fill:#245bb0}
.k50 .part text{font:700 3.1px ui-monospace,monospace;fill:#e8f1ff;text-anchor:middle;dominant-baseline:middle;pointer-events:none}
.k50 .part{transform-box:view-box;transition:transform .9s cubic-bezier(.2,1.1,.3,1),opacity .5s;cursor:default}
.k50 .part:hover rect{fill:#f2b632}
.k50 .kerf{fill:none;stroke:#0b1220;stroke-width:.35;stroke-dasharray:1.2 1.2;opacity:.6}
.k50 .yld{position:absolute;right:16px;top:14px;z-index:3;font:800 11px ui-monospace,monospace;color:#f2b632;letter-spacing:.08em;pointer-events:none;background:#0b1220cc;padding:4px 7px;border-radius:5px;border:1px solid #f2b63266}
.k50 .in{background:linear-gradient(180deg,#0b1220 0 26%,#0b122000 36% 66%,#0b1220ee 80%)}
.k50 p{color:#c9d6ea;text-shadow:0 1px 3px #0b1220,0 0 10px #0b1220}.k50 .meta{color:#8597b3;text-shadow:0 1px 3px #0b1220}
.k50 .st{background:#0f1a2e;border-color:#2b4069;color:#cfe0ff}
.k50 .b{background:#0f1a2ee6;border-color:#2b4069}
.k50 .b:hover{border-color:currentColor;box-shadow:0 0 0 1px currentColor}
.k50 a{color:#f2b632}

@media (prefers-reduced-motion:reduce){
  .k41 .fl.go,.k42 .hud .rec,.k49 .bit .fl{animation:none!important}
  .k45 .in{transform:none!important;transition:none!important}
  .k46 h3 .tt{animation:none!important;--burn:100%}
  .k50 .part{transition:none!important}
}

/* 41-50 compact fit: whole card (incl. all four buttons) fits the 320px stage */
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .in{padding:14px 14px 12px;gap:6px}
:is(.k41,.k42,.k43,.k44,.k46,.k47,.k48,.k49,.k50) h3{font-size:14.5px;line-height:1.3}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) p{font-size:12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .meta{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .st{font-size:11px;padding:3px 9px}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .rep{font-size:11.5px}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .acts{gap:6px}
:is(.k41,.k42,.k43,.k44,.k45,.k46,.k47,.k48,.k49,.k50) .b{font-size:12px;padding:8px 4px;min-height:36px}
.k41 .in{padding-top:28px}.k41::after{left:14px;top:11px}
.k41 h3{line-height:1.55}
.k41 .tt .wd{gap:1px;margin:0 4px 2px 0}
.k41 .fl{font-size:11px;min-width:.82em;line-height:1.55}
.k41 .st .fl{font-size:10.5px}
.k45 .in{margin:13px 16px 0;padding:12px 12px 18px;font-size:11.5px}
.k45 h3{font-size:11.5px;padding-bottom:5px}
.k45 .log{font-size:10.5px}
.k47 .hint{display:none}
.k48 .brg{bottom:auto;top:14px;right:14px}
.k49 .gc{left:14px;bottom:4px;font-size:9px}.k49 .in{padding-bottom:18px}
.k42 .in,.k44 .in,.k48 .in{padding-top:30px}
.k42 .hud .tmp{right:auto;left:26px;top:4px;font-size:10px}
.k44 .elev{top:11px;right:14px}
.k45 .st.done{background:#1d1c1a;color:#fbf8f1;border-style:solid}
.k45 .in:has(.log:not(:empty)) :is(p,.meta){display:none}
.k47 .b{background:#18151fb3;backdrop-filter:blur(2px)}
.k47 .in{background:linear-gradient(180deg,#0f0d14e6 0,#0f0d1400 40%)}
.k50 :is(p,.meta){display:none}
.k50 .in{background:none}
.k50 svg.nest{top:auto;bottom:100px;left:10%;right:auto;width:80%}
.k50 .yld{top:auto;bottom:206px;right:10%}
.k47 .b{background:#18151f4d;backdrop-filter:none;text-shadow:0 1px 2px #000,0 0 6px #000}

/* Consistency pass 2026-10-22: every card grows to fit its content (buttons were clipped on 38 of 40 at desktop width),
   cards in a row share one height, and long names no longer wrap the label bar. */
.item .stage.card-stage{display:flex;flex-direction:column}
.item .stage.card-stage .card,.item .stage.card-stage > .cw > .card{aspect-ratio:auto;height:auto;min-height:320px}
.item .stage.card-stage>.card,.item .stage.card-stage>.cw,.item .stage.card-stage>.cw>.card{flex:1 0 auto}
.item .stage.card-stage .card>.in,.item .stage.card-stage .k4 .face:not(.back)>.in{height:auto;min-height:318px}
.item .stage.card-stage .k4 .face:not(.back){position:relative;inset:auto}
.item .lab-main{min-width:0}
.item .lab-main>span:not(.tag-new){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}

/* ===== 51-55 Flooring (2026-10-23) ===== */
/* 51 Sample Board Quote — the quote IS a store sample board: real grain swatch, tap a colorway and the total rolls; any answer hangs a swinging tag on the hook */
.k51{background:radial-gradient(120% 70% at 50% 0,#2a2118,#14100c 70%);border:1px solid #3a2e22}
.k51 .in{padding:14px 14px 12px;gap:7px}
.k51 h3{font-size:14px;line-height:1.3;color:#f3e9da}
.k51 .st{font-size:11px;padding:3px 9px;background:#1d1711;border-color:#4a3a29;color:#e8d5b8}
.k51-board{position:relative;margin:10px 0 2px;padding:20px 10px 10px;border-radius:10px 10px 6px 6px;background:#e9e2d3;color:#2b2218;
  display:grid;grid-template-columns:86px 1fr;grid-template-rows:auto auto auto;gap:6px 10px;
  box-shadow:inset 0 1px 0 #fff,inset 0 -3px 0 #cfc5b1,0 1px 0 #b8ad97,0 14px 22px -12px #000}
.k51-hook{position:absolute;left:50%;top:5px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#14100c;box-shadow:inset 0 2px 2px #000,0 0 0 2px #c9bfa9,0 1px 0 3px #fff8}
.k51-hook::before{content:"";position:absolute;left:4px;bottom:6px;width:4px;height:26px;border-radius:2px;background:linear-gradient(90deg,#6d6d6d,#d9d9d9,#6d6d6d)}
.k51-brand{position:absolute;left:10px;right:10px;top:6px;display:flex;justify-content:space-between;font:800 7.5px/1 ui-monospace,monospace;letter-spacing:.16em;color:#7a6a52}
.k51-sw{grid-row:1/3;display:grid;grid-template-rows:repeat(3,1fr);gap:0;border-radius:3px;overflow:hidden;min-height:86px;box-shadow:0 0 0 1px #0003,0 3px 6px -2px #0006;position:relative}
.k51-sw i{background:var(--g) var(--o,0) 0/auto 100%;box-shadow:inset 0 1px 0 #ffffff40,inset 0 -1px 0 #00000059;transition:filter .3s}
.k51-sw::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#fff0 30%,#ffffff40 45%,#fff0 60%);background-size:250% 100%;background-position:var(--sh,120%) 0;transition:background-position .9s}
.k51-sw:hover::after{--sh:-30%}
.k51-spec{margin:0;display:grid;gap:2px;font:11px/1.2 system-ui,sans-serif}
.k51-spec div{display:flex;justify-content:space-between;gap:6px;border-bottom:1px dotted #b9ad96;padding-bottom:2px}
.k51-spec dt{color:#7a6a52;font-size:10px}.k51-spec dd{margin:0;font-weight:700;text-align:right}.k51-spec small{font-weight:600;color:#8a7a62;font-size:9px}
.k51-chips{display:flex;gap:6px;align-items:center}
.k51-chips button{width:24px;height:16px;border-radius:3px;border:0;padding:0;cursor:pointer;background:var(--g) center/cover;box-shadow:0 0 0 1px #0004;transition:transform .2s cubic-bezier(.3,1.7,.5,1),box-shadow .2s}
.k51-chips button[aria-checked=true]{transform:translateY(-2px) scale(1.12);box-shadow:0 0 0 2px #e9e2d3,0 0 0 3.5px #2b2218}
.k51-chips button:focus-visible{outline:2px solid #2b2218;outline-offset:3px}
.k51-tot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;line-height:1.1;margin:2px -4px 0;padding:6px 8px;border-radius:5px;background:#d9d0bd;box-shadow:inset 0 1px 2px #0002}
.k51-tot span{font:700 8.5px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#7a6a52}
.k51-tot b{font:800 18px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;color:#1f170f;transition:color .3s}
.k51-tot b.up{color:#2f7a3b}.k51-tot b.dn{color:#a3382b}
.k51-tag{position:absolute;left:50%;top:10px;width:78px;margin-left:-39px;transform-origin:39px -4px;pointer-events:none;opacity:0;z-index:3}
.k51-tag i{position:absolute;left:38px;top:-6px;width:1.5px;height:14px;background:#5b4a35}
.k51-tag b{display:block;margin-top:8px;padding:7px 0 6px;border-radius:4px 4px 10px 10px;text-align:center;font:900 11px/1 ui-monospace,monospace;letter-spacing:.14em;color:#fff;background:var(--tc,#2f7a3b);
  box-shadow:0 6px 10px -4px #000a,inset 0 0 0 1.5px #ffffff4d;position:relative}
.k51-tag b::before{content:"";position:absolute;left:50%;top:3px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#e9e2d3;box-shadow:inset 0 1px 1px #0006}
.k51 p,.k51 .meta{font-size:10.5px;color:#9c8c76;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k51 .rep{font-size:11.5px;color:#e3b877}
.k51 .acts{gap:6px}.k51 .b{font-size:12px;padding:8px 4px;min-height:36px}
.k51 a{color:#e3b877}

/* 52 Install Date Calendar — toggle rooms and the tear-off calendar rips to the new finish date while planks lay themselves into the progress strip */
.k52{background:linear-gradient(170deg,#101a24,#0b1118);border:1px solid #22344a}
.k52 .in{padding:14px 14px 12px;gap:7px}
.k52 h3{font-size:14px;line-height:1.3;color:#e8f0f8}
.k52 .st{font-size:11px;padding:3px 9px;background:#0f1c2a;border-color:#2b4460;color:#cfe2f5}
.k52-row{display:grid;grid-template-columns:76px 1fr;gap:10px;align-items:stretch;margin-top:4px}
.k52-cal{position:relative;border-radius:8px;background:#f4f1ea;box-shadow:0 8px 16px -8px #000,0 0 0 1px #0003;perspective:400px;min-height:84px}
.k52-cal::before,.k52-cal::after{content:"";position:absolute;top:-5px;left:18px;width:6px;height:12px;border-radius:3px;background:linear-gradient(#9aa4ad,#5c656e);z-index:3}
.k52-cal::after{left:auto;right:18px}
.k52-m{display:block;height:22px;border-radius:8px 8px 0 0;background:#c8412f;color:#fff;font:800 11px/22px ui-monospace,monospace;letter-spacing:.2em;text-align:center}
.k52-pg{position:absolute;left:0;right:0;top:22px;bottom:0;display:grid;place-items:center;align-content:center;background:#f4f1ea;border-radius:0 0 8px 8px;transform-origin:50% 0;backface-visibility:hidden}
.k52-d{font:800 32px/1 Georgia,"Times New Roman",serif;color:#1e2327;font-variant-numeric:tabular-nums}
.k52-w{font:700 9px/1.4 ui-monospace,monospace;letter-spacing:.2em;color:#8a8f94;font-style:normal}
.k52-pg.tear{z-index:2;box-shadow:0 4px 8px #0004;background:linear-gradient(#f4f1ea 85%,#e2ddd2)}
.k52-ring{position:absolute;left:8px;right:8px;top:24px;width:calc(100% - 16px);height:auto;z-index:3;pointer-events:none;overflow:visible}
.k52-ring path{fill:none;stroke:#c8412f;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .7s cubic-bezier(.5,0,.3,1),opacity 0s .7s}
.k52.booked .k52-ring path{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset .7s cubic-bezier(.5,0,.3,1),opacity 0s}
.k52-hold{position:absolute;left:50%;top:58%;transform:translate(-50%,-50%) rotate(-14deg) scale(1.6);z-index:4;font:900 13px/1 ui-monospace,monospace;letter-spacing:.14em;color:#b7832a;border:2px solid #b7832a;border-radius:4px;padding:3px 5px;opacity:0;transition:.35s cubic-bezier(.3,1.6,.5,1);background:#f4f1eae6}
.k52.hold .k52-hold{opacity:1;transform:translate(-50%,-50%) rotate(-14deg)}
.k52-rooms{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.k52-rooms button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;padding:5px 8px;border-radius:8px;border:1px solid #2b4460;background:#0f1c2a;color:#8fa5bb;font:700 11.5px system-ui,sans-serif;cursor:pointer;text-align:left;transition:.2s}
.k52-rooms small{font:600 9.5px ui-monospace,monospace;color:#5f7790}
.k52-rooms small::after{content:" sf"}
.k52-rooms button[aria-pressed=true]{background:#17324a;border-color:#4f8fc9;color:#e8f3ff;box-shadow:inset 0 0 0 1px #4f8fc955}
.k52-rooms button[aria-pressed=true] small{color:#9cc8ef}
.k52-rooms button:focus-visible{outline:2px solid #7dd3fc;outline-offset:2px}
.k52-strip{position:relative;height:22px;border-radius:5px;background:#0a121a repeating-linear-gradient(90deg,#0000 0 11px,#ffffff08 11px 12px);box-shadow:inset 0 1px 3px #000;overflow:hidden;display:grid;grid-template-rows:1fr 1fr;grid-auto-flow:column;grid-auto-columns:calc((100% - 2px) / 12);gap:1px;padding:1px}
.k52-strip i{background:var(--g) var(--o) 0/220px 100%;border-radius:1px;box-shadow:inset 0 1px 0 #ffffff33,inset -1px 0 0 #0006;transform-origin:0 50%;transform:scaleX(0);opacity:0;transition:transform .35s cubic-bezier(.3,1.5,.5,1) var(--dl),opacity .2s var(--dl)}
.k52-strip i:nth-child(2n){translate:calc(50% + .5px) 0}
.k52-strip i.on{transform:none;opacity:1}
.k52-strip i.fall{transition:transform .5s cubic-bezier(.5,0,.8,.5) var(--dl),opacity .5s var(--dl);transform:translateY(30px) rotate(25deg);opacity:0}
.k52-sum{font:600 10.5px/1.3 ui-monospace,monospace;color:#8fa5bb}.k52-sum b{color:#e8f3ff}
.k52 .meta{font-size:10.5px;color:#5f7790;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k52 .rep{font-size:11.5px;color:#7dd3fc}.k52 a{color:#7dd3fc}
.k52 .acts{gap:6px}.k52 .b{font-size:12px;padding:8px 4px;min-height:36px}
@media (prefers-reduced-motion:reduce){.k52-strip i,.k52-ring path,.k52-hold{transition:none!important}}

/* 53 Sample Request Flip — three real sample chips: tap to bring one forward, tap again to flip it and read the printed back label; tilt + wear-layer sheen follow the pointer; Fire away mails them */
.k53{background:radial-gradient(90% 60% at 50% 30%,#1d2420,#0c100e 75%);border:1px solid #2b3a31}
.k53 .in{padding:14px 14px 12px;gap:7px}
.k53 h3{font-size:14px;line-height:1.3;color:#eaf3ec}
.k53 .st{font-size:11px;padding:3px 9px;background:#121a15;border-color:#2f4a39;color:#cfe8d6}
.k53-stage{position:relative;height:168px;margin:2px -6px 0;perspective:700px;overflow:hidden;border-radius:10px}
.k53-chip{position:absolute;left:50%;top:12px;width:100px;height:142px;margin-left:-50px;padding:0;border:0;background:none;cursor:pointer;transform-style:preserve-3d;
  transition:transform .6s cubic-bezier(.3,1.35,.5,1),filter .3s;transform:translateX(var(--x,0)) translateY(var(--y,0)) rotate(var(--r,0)) scale(var(--s,1)) rotateX(var(--tx,0deg)) rotateY(calc(var(--ty,0deg) + var(--fl,0deg)));z-index:var(--z,1);-webkit-tap-highlight-color:transparent}
.k53-chip:focus-visible{outline:2px solid #86efac;outline-offset:4px;border-radius:9px}
.k53-chip>span{position:absolute;inset:0;border-radius:9px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.k53-f{background:var(--g) center/cover;box-shadow:inset 0 0 0 1px #ffffff26,inset 0 -3px 0 #0000004d,0 10px 18px -8px #000}
.k53-f::before{content:"";position:absolute;inset:0;background:linear-gradient(calc(110deg + var(--ty,0deg)*3),#fff0 30%,#ffffff47 calc(48% + var(--tx,0deg)*2),#fff0 66%);mix-blend-mode:overlay}
.k53-f i{position:absolute;left:50%;top:9px;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:#0c100e;box-shadow:0 0 0 2.5px #c6ccd1,0 0 0 3.5px #555c62,inset 0 2px 2px #000}
.k53-f b{position:absolute;left:6px;right:6px;bottom:7px;padding:4px 2px;border-radius:3px;background:#f7f5ef;color:#1d2420;font:800 8px/1.15 ui-monospace,monospace;letter-spacing:.06em;text-align:center;box-shadow:0 1px 2px #0006}
.k53-k{transform:rotateY(180deg);background:#d9d4c8;padding:7px 7px 6px;display:flex;flex-direction:column;gap:3px;text-align:left;box-shadow:inset 0 0 0 1px #0002,0 10px 18px -8px #000}
.k53-k em{font:900 7px/1 ui-monospace,monospace;letter-spacing:.14em;color:#2f6b45;font-style:normal;border-bottom:1.5px solid #2f6b45;padding-bottom:3px}
.k53-k dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:1.5px 5px;font:600 7.5px/1.25 ui-monospace,monospace;color:#3d3a33}
.k53-k dt{color:#7b766a}.k53-k dd{margin:0;font-weight:800;color:#1b1914}
.k53-bc{margin-top:auto;height:18px;background:var(--bc);border-radius:1px}
.k53-k small{font:700 6.5px/1 ui-monospace,monospace;letter-spacing:.2em;color:#5d594f;text-align:center}
.k53-env{position:absolute;left:8%;right:8%;bottom:-200px;height:104px;border-radius:6px;background:linear-gradient(#e8d9b8,#d8c69f);box-shadow:0 -6px 16px -6px #000;z-index:20;transition:bottom .55s cubic-bezier(.3,1.3,.5,1);display:grid;place-items:end center;padding-bottom:12px}
.k53-env b{font:900 9px/1 ui-monospace,monospace;letter-spacing:.16em;color:#6b5634}
.k53-env::before{content:"";position:absolute;inset:0;border-radius:6px;background:linear-gradient(160deg,#0000 49%,#0000001a 50%) left/50% 100% no-repeat,linear-gradient(200deg,#0000 49%,#0000001a 50%) right/50% 100% no-repeat}
.k53-flap{position:absolute;left:0;right:0;top:0;height:56px;transform-origin:50% 0;transform:rotateX(180deg);transition:transform .45s .45s;clip-path:polygon(0 0,100% 0,50% 100%);background:#cdb98f}
.k53.sent .k53-env{bottom:18px}.k53.sent .k53-flap{transform:none}
.k53.sent .k53-chip{--y:22px!important;--x:0px!important;--s:.5!important;--r:0deg!important;transition-duration:.7s}
.k53.nope .k53-chip{filter:grayscale(1) brightness(.6)}
.k53-hint{font-size:10.5px!important;color:#7d9486!important;margin:0}
.k53 .meta{font-size:10.5px;color:#5f7468;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k53 .rep{font-size:11.5px;color:#86efac}.k53 a{color:#86efac}
.k53 .acts{gap:6px}.k53 .b{font-size:12px;padding:8px 4px;min-height:36px}
@media (prefers-reduced-motion:reduce){.k53-chip,.k53-env,.k53-flap{transition:none!important}}

/* 54 Change-Order Slider — a little room in perspective; drag the T-molding to wipe from the old floor to the new one. Fire away sweeps to the new floor, Don't do it sweeps back */
.k54{background:linear-gradient(170deg,#1b1714,#0f0d0b);border:1px solid #3a3029}
.k54 .in{padding:14px 14px 12px;gap:7px}
.k54 h3{font-size:14px;line-height:1.3;color:#f5ece2}
.k54 .st{font-size:11px;padding:3px 9px;background:#1d1814;border-color:#4a3c31;color:#ecdccb}
.k54-room{--s:46%;position:relative;height:150px;margin-top:4px;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px #0007,0 10px 20px -10px #000;touch-action:pan-y}
.k54-l{position:absolute;inset:0;overflow:hidden}
.k54-new{clip-path:inset(0 0 0 var(--s))}
.k54-wall{position:absolute;left:0;right:0;top:0;height:46%;background:linear-gradient(#cfc7bb,#bdb4a6)}
.k54-new .k54-wall{background:linear-gradient(#e5dccd,#d6cab6)}
.k54-wall::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;background:linear-gradient(#fbfaf7,#e4e0d8);box-shadow:0 -1px 0 #0002,inset 0 -2px 0 #0000001f}
.k54-flr{position:absolute;left:-60%;right:-60%;top:46%;height:180%;transform-origin:50% 0;transform:perspective(170px) rotateX(62deg);background:var(--f) 0 0/180px auto;box-shadow:inset 0 30px 30px -20px #0006}
.k54-light{position:absolute;inset:0;background:radial-gradient(70% 60% at 70% 20%,#fff3dd38,#0000 70%),linear-gradient(#0000 46%,#0000 46%,#00000040);pointer-events:none}
.k54-h{position:absolute;top:0;bottom:0;left:var(--s);width:0;pointer-events:none;z-index:3}
.k54-h::before{content:"";position:absolute;top:46%;bottom:0;left:-2px;width:4px;background:linear-gradient(90deg,#8a6a45,#e9cc9c,#8a6a45);box-shadow:0 0 6px #000a}
.k54-tm{position:absolute;left:-17px;top:calc(46% + 22px);width:34px;height:26px;border-radius:7px;background:#f3ede4;box-shadow:0 4px 10px #000a,0 0 0 1px #0003;display:grid;place-items:center}
.k54-tm::before{content:"";width:20px;height:12px;background:linear-gradient(#6d5235,#6d5235) 0 0/100% 4px no-repeat,linear-gradient(#6d5235,#6d5235) 50% 0/4px 100% no-repeat}
.k54-tm::after{content:"‹ ›";position:absolute;bottom:-14px;font:800 10px/1 system-ui;color:#fff;text-shadow:0 1px 2px #000;letter-spacing:.3em}
.k54-lb{position:absolute;top:7px;padding:3px 7px;border-radius:99px;background:#0009;color:#fff;font:800 8.5px/1.2 ui-monospace,monospace;letter-spacing:.08em;pointer-events:none;z-index:4;transition:opacity .25s;backdrop-filter:blur(3px)}
.k54-lb{border-radius:7px}.k54-lb.wa{left:7px;opacity:calc(var(--sv,46) / 50)}.k54-lb.nw{right:7px;text-align:right;opacity:calc((100 - var(--sv,46)) / 50)}
.k54-r{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:5}
.k54-r:focus-visible + *,.k54-room:has(.k54-r:focus-visible){outline:2px solid #fcd34d;outline-offset:2px}
.k54-delta{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#b3a291}
.k54-delta s{color:#7d6f62}.k54-delta b{color:#f5ece2}
.k54-amt{font-size:15px;color:#fcd34d!important;font-variant-numeric:tabular-nums}
.k54 .meta{font-size:10.5px;color:#7d6f62;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k54 .rep{font-size:11.5px;color:#fcd34d}.k54 a{color:#fcd34d}
.k54 .acts{gap:6px}.k54 .b{font-size:12px;padding:8px 4px;min-height:36px}

/* 55 Pallet Delivery — isometric pallet stacks itself box by box; flip Liftgate / Terminal and the truck's liftgate lowers it or the scene swaps to a loading dock; Fire away stretch-wraps the load */
.k55{background:linear-gradient(170deg,#121722,#0b0e15);border:1px solid #273046}
.k55 .in{padding:14px 14px 12px;gap:7px}
.k55 h3{font-size:14px;line-height:1.3;color:#e9eef8}
.k55 .st{font-size:11px;padding:3px 9px;background:#121929;border-color:#2c3a58;color:#d4def2}
.k55-scene{position:relative;height:150px;margin:2px -4px 0;border-radius:10px;overflow:hidden;background:radial-gradient(120% 90% at 70% 0,#1d2638,#0f141e)}
.k55-svg{width:100%;height:100%;display:block}
.k55-svg .tr,.k55-svg .dk,.k55-svg .gate,.k55-svg .load{transition:transform .8s cubic-bezier(.45,0,.2,1)}
.k55-svg .gate,.k55-svg .load{transition-duration:.9s;transition-timing-function:cubic-bezier(.3,0,.3,1)}
.k55-svg .bx{transition:transform .5s cubic-bezier(.3,1.5,.5,1),opacity .3s}
.k55-svg .bx.off{transform:translateY(-40px);opacity:0}
.k55-svg .wrap{opacity:0;transition:opacity .6s}
.k55.wrapped .k55-svg .wrap{opacity:1}
.k55.wrapped .k55-svg .wrap{animation:k55w 1.6s ease-in-out infinite alternate}
.k55-fee{position:absolute;right:8px;top:8px;padding:3px 8px;border-radius:99px;background:#0b0e15cc;border:1px solid #3a4a6c;color:#fbbf24;font:800 9.5px/1.2 ui-monospace,monospace;letter-spacing:.06em}
.k55-tg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:10px;background:#0b0f18;border:1px solid #273046}
.k55-tg button{position:relative;z-index:1;border:0;background:none;color:#8a98b5;font:700 11px system-ui,sans-serif;padding:7px 4px;border-radius:7px;cursor:pointer;transition:color .3s}
.k55-tg button[aria-checked=true]{color:#0b0e15}
.k55-tg button:focus-visible{outline:2px solid #fbbf24;outline-offset:1px}
.k55-pill{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:7px;background:linear-gradient(#fcd34d,#f59e0b);box-shadow:0 2px 8px -2px #f59e0b88;transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.k55-tg.term .k55-pill{transform:translateX(100%)}
.k55-ct{font:600 10.5px ui-monospace,monospace;color:#8a98b5}.k55-ct b{color:#fbbf24;font-size:13px;font-variant-numeric:tabular-nums}
.k55 .meta{font-size:10.5px;color:#5c6a87;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k55 .rep{font-size:11.5px;color:#fbbf24}.k55 a{color:#fbbf24}
.k55 .acts{gap:6px}.k55 .b{font-size:12px;padding:8px 4px;min-height:36px}
@keyframes k55w{from{opacity:.65}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.k55-svg *,.k55-pill{transition:none!important;animation:none!important}}

/* ===== 56-70 Cabinets, Closets, Selling (2026-10-26) ===== */
/* 56 Shop Drawing Redraw — a live blueprint: drag width/height and the door elevation, cup bores and dimension strings redraw; Fire away slams an APPROVED FOR CNC stamp and locks the sliders */
.kc56{background:linear-gradient(165deg,#0d2b57,#081a36);border:1px solid #24508f}
.kc56 .in{padding:14px 14px 12px;gap:7px}
.kc56 h3{font-size:14px;line-height:1.3;color:#eaf3ff}
.kc56 .st{font-size:11px;padding:3px 9px;background:#0b2347;border-color:#2f5f9e;color:#d4e6ff}
.kc56 .meta{font-size:10.5px;color:#7f9cc6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc56 .rep{font-size:11.5px;color:#8fd3ff}.kc56 a{color:#8fd3ff}
.kc56 .acts{gap:6px}.kc56 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc56-sheet{position:relative;margin-top:2px;border-radius:8px;overflow:hidden;background:#0f3a78;
  background-image:linear-gradient(#ffffff0d 1px,#0000 1px),linear-gradient(90deg,#ffffff0d 1px,#0000 1px),linear-gradient(#ffffff1a 1px,#0000 1px),linear-gradient(90deg,#ffffff1a 1px,#0000 1px),radial-gradient(120% 90% at 30% 10%,#1d4f96,#0b2c5e);
  background-size:8px 8px,8px 8px,40px 40px,40px 40px,100% 100%;box-shadow:inset 0 0 0 1px #ffffff26,inset 0 0 0 4px #0f3a78,inset 0 0 0 5px #ffffff40,0 10px 22px -12px #000}
.kc56-svg{display:block;width:100%;height:auto;overflow:visible}
.kc56-svg .kc56-ink{fill:none;stroke:#e9f3ff;stroke-width:.9;stroke-linejoin:round;transition:stroke .4s}
.kc56-svg .kc56-thin{stroke-width:.45;stroke:#bcd8ff}
.kc56-svg .kc56-ctr{stroke:#8fc0ff;stroke-width:.35;stroke-dasharray:4 1.5 1 1.5}
.kc56-svg .kc56-dim{stroke:#ffe7a3;stroke-width:.45;fill:none}
.kc56-svg text{font:800 8.5px ui-monospace,SFMono-Regular,Menlo,monospace;fill:#ffe7a3;stroke:none}
.kc56-svg text.kc56-note{font-size:6.6px;fill:#cfe3ff;font-weight:700;letter-spacing:.04em}
.kc56-svg text.kc56-note.kc56-nh{fill:#fff;font-weight:800}
.kc56-svg [pathLength]{stroke-dasharray:1;stroke-dashoffset:0}
.kc56-svg .kc56-cup{fill:#ffffff14;stroke:#fff;stroke-width:.6}
.kc56-svg .kc56-red{stroke:#ff6b5a;stroke-width:2.2;stroke-linecap:round;fill:none;opacity:0}
.kc56-svg .kc56-cloud{stroke:#c9a7ff;stroke-width:1.1;fill:none;opacity:0}
.kc56.kc56-ok .kc56-svg .kc56-ink{stroke:#fff}
.kc56-tb{position:absolute;left:6px;right:6px;bottom:5px;display:flex;justify-content:space-between;font:800 6.5px/1 ui-monospace,monospace;letter-spacing:.14em;color:#a9c9f5;pointer-events:none}
.kc56-tb b{color:#fff;display:inline-block}
.kc56-stamp{position:absolute;right:5%;bottom:20%;display:grid;justify-items:center;gap:2px;padding:5px 9px 4px;border:2.5px solid var(--kc56-c,#ff5d4d);border-radius:6px;color:var(--kc56-c,#ff5d4d);
  box-shadow:inset 0 0 0 1.5px #0f3a78,inset 0 0 0 3px var(--kc56-c,#ff5d4d);transform:rotate(-13deg) scale(2.2);opacity:0;pointer-events:none;background:repeating-linear-gradient(37deg,#0000 0 5px,#0f3a7833 5px 6px)}
.kc56-stamp b{font:900 15px/1 ui-monospace,monospace;letter-spacing:.12em}
.kc56-stamp small{font:800 6px/1 ui-monospace,monospace;letter-spacing:.16em}
.kc56-ctl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kc56-ctl label{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 6px;font:700 9.5px ui-monospace,monospace;letter-spacing:.08em;color:#9fbde6;text-transform:uppercase}
.kc56-ctl output{grid-row:1;grid-column:2;justify-self:end;font:800 12px ui-monospace,monospace;color:#ffe7a3;letter-spacing:0;text-transform:none}
.kc56-ctl input{grid-column:1/-1;width:100%;margin:0;accent-color:#ffe7a3;height:18px;cursor:ew-resize}
.kc56-ctl input:disabled{cursor:not-allowed;opacity:.45}
.kc56-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#9fbde6}
.kc56-p{font-size:15px;color:#ffe7a3;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.kc56-svg .kc56-ink{transition:none}}

/* 57 Laminate Film Peel — a real TFL swatch under blue protective film: drag the corner to peel it (true fold geometry), the colour shows through; Fire away peels it off and sticks a SELECTED label */
.kc57{background:radial-gradient(120% 80% at 50% 0,#1f2a33,#0d1216 70%);border:1px solid #33424e}
.kc57 .in{padding:14px 14px 12px;gap:7px}
.kc57 h3{font-size:14px;line-height:1.3;color:#eef4f8}
.kc57 .st{font-size:11px;padding:3px 9px;background:#141c22;border-color:#3a4b58;color:#d6e4ee}
.kc57 .meta{font-size:10.5px;color:#7a8c99;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc57 .rep{font-size:11.5px;color:#7cc7ff}.kc57 a{color:#7cc7ff}
.kc57 .acts{gap:6px}.kc57 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc57-sw{--kc57-mx:50%;position:relative;aspect-ratio:16/10;margin-top:2px;border-radius:8px;overflow:hidden;touch-action:none;cursor:grab;background:#222;box-shadow:0 0 0 1px #0008,0 14px 24px -14px #000,inset 0 0 0 1px #ffffff1a}
.kc57-sw:active{cursor:grabbing}
.kc57-sw canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc57-sw::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,#fff0 calc(var(--kc57-mx) - 22%),#ffffff2e var(--kc57-mx),#fff0 calc(var(--kc57-mx) + 22%));mix-blend-mode:soft-light;opacity:0;transition:opacity .4s}
.kc57.kc57-bare .kc57-sw::after{opacity:1}
.kc57-lbl{position:absolute;left:8px;bottom:8px;display:grid;gap:2px;padding:5px 8px;border-radius:4px;background:#f6f3ecf0;color:#1d1a16;box-shadow:0 2px 6px #0006;pointer-events:none;z-index:0}
.kc57-lbl b{font:900 9px/1 ui-monospace,monospace;letter-spacing:.14em}
.kc57-lbl small{font:700 6.5px/1 ui-monospace,monospace;letter-spacing:.16em;color:#6c655a}
.kc57-film{z-index:1}
.kc57-sel{position:absolute;right:10px;top:10px;z-index:3;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--kc57-c,#2fa35a);color:#fff;
  box-shadow:0 6px 14px -4px #000c,inset 0 0 0 3px #ffffff59,inset 0 0 0 5px var(--kc57-c,#2fa35a),inset 0 0 0 6px #ffffff40;transform:scale(0) rotate(-40deg);opacity:0;pointer-events:none}
.kc57-sel b{font:900 9.5px/1 ui-monospace,monospace;letter-spacing:.08em;transform:rotate(-12deg)}
.kc57-hint{position:absolute;right:30px;bottom:30px;z-index:2;font:800 9px/1 ui-monospace,monospace;letter-spacing:.06em;color:#fff;text-shadow:0 1px 3px #000;pointer-events:none;animation:kc57-bob 1.6s ease-in-out infinite;transition:opacity .3s}
.kc57-hint::after{content:" ↘"}
.kc57.kc57-touched .kc57-hint{opacity:0}
@keyframes kc57-bob{50%{transform:translate(-4px,-3px)}}
.kc57-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.kc57-picks{display:flex;gap:7px}
.kc57-picks button{width:30px;height:22px;border-radius:4px;border:0;padding:0;cursor:pointer;background:var(--kc57-g) center/cover;box-shadow:0 0 0 1px #0007,inset 0 1px 0 #ffffff33;transition:transform .25s cubic-bezier(.3,1.7,.5,1),box-shadow .2s}
.kc57-picks button[aria-checked=true]{transform:translateY(-2px);box-shadow:0 0 0 2px #0d1216,0 0 0 3.5px #7cc7ff}
.kc57-picks button:focus-visible,.kc57-peel:focus-visible{outline:2px solid #7cc7ff;outline-offset:3px}
.kc57-peel{font:700 11px system-ui,sans-serif;color:#cfe8ff;background:#132433;border:1px solid #2d4a63;border-radius:99px;padding:6px 11px;cursor:pointer}
.kc57-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#90a4b3}
.kc57-sum b{color:#eef4f8}.kc57-p{font-size:13.5px;color:#7cc7ff!important;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.kc57-hint{animation:none}.kc57-sw::after{transition:none}}

/* 58 Cut List Check-Off — the cut list and its nested 4x8 sheet are linked: check a part and the router traces its kerf on the sheet while the row strikes through; Fire away cuts the rest */
.kc58{background:linear-gradient(170deg,#1a1712,#0f0d0a);border:1px solid #3b3326}
.kc58 .in{padding:14px 14px 12px;gap:7px}
.kc58 h3{font-size:14px;line-height:1.3;color:#f4ecdf}
.kc58 .st{font-size:11px;padding:3px 9px;background:#1d1913;border-color:#4b402f;color:#eadcc4}
.kc58 .meta{font-size:10.5px;color:#857760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc58 .rep{font-size:11.5px;color:#f2b45a}.kc58 a{color:#f2b45a}
.kc58 .acts{gap:6px}.kc58 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc58-sheet{position:relative;margin-top:2px;padding:6px;border-radius:8px;background:#0b0a08;box-shadow:inset 0 0 0 1px #3b3326,0 10px 20px -12px #000}
.kc58-svg{display:block;width:100%;height:auto;overflow:visible}
.kc58-svg .kc58-base{fill:url(#kc58-oak);stroke:#6a5a40;stroke-width:.25}
.kc58-svg .kc58-off{fill:url(#kc58-hatch)}
.kc58-svg .kc58-pt rect.kc58-r{fill:#fff0;stroke:#5a4a32;stroke-width:.3;stroke-dasharray:1.2 .8;transition:fill .3s,stroke .3s}
.kc58-svg .kc58-pt{cursor:pointer;transition:transform .35s cubic-bezier(.3,1.5,.5,1),filter .35s}
.kc58-svg .kc58-pt text{font:800 2.6px ui-monospace,monospace;fill:#4a3c27;letter-spacing:.05em;pointer-events:none;transition:fill .3s}
.kc58-svg .kc58-pt text.kc58-d{font-weight:600;font-size:2.1px;fill:#6c5a3c}
.kc58-svg .kc58-pt.kc58-hl rect.kc58-r{fill:#f2b45a40;stroke:#f2b45a;stroke-dasharray:none}
.kc58-svg .kc58-kerf{fill:none;stroke:#1a140c;stroke-width:.55;stroke-dasharray:1;stroke-dashoffset:1}
.kc58-svg .kc58-pt.kc58-cut{transform:translate(-.5px,-.7px);filter:url(#kc58-sh)}
.kc58-svg .kc58-pt.kc58-cut rect.kc58-r{fill:#fff3;stroke:none}
.kc58-svg .kc58-pt.kc58-cut .kc58-kerf{stroke-dashoffset:0}
.kc58-svg .kc58-pt.kc58-cut text{fill:#2a1f10}
.kc58-svg .kc58-eb{stroke:#f6efe2;stroke-width:.7;opacity:0;transition:opacity .3s .5s}
.kc58-svg .kc58-pt.kc58-cut .kc58-eb{opacity:1}
.kc58-svg .kc58-bit{fill:url(#kc58-glow);opacity:0}
.kc58-ban{position:absolute;left:50%;top:50%;padding:5px 12px;border-radius:5px;background:#1a140ce6;border:1.5px solid var(--kc58-c,#f2b45a);color:var(--kc58-c,#f2b45a);font:900 11px/1 ui-monospace,monospace;letter-spacing:.14em;white-space:nowrap;
  transform:translate(-50%,-50%) rotate(-6deg) scale(.4);opacity:0;pointer-events:none;transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .25s;box-shadow:0 8px 20px #000a}
.kc58.kc58-ban-on .kc58-ban{opacity:1;transform:translate(-50%,-50%) rotate(-6deg)}
.kc58-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:4px 8px}
.kc58-list button{width:100%;display:grid;grid-template-columns:13px 1fr auto;align-items:center;gap:5px;padding:4px 6px;border-radius:6px;border:1px solid #3b3326;background:#16130e;color:#e9dcc6;font:700 10.5px system-ui,sans-serif;cursor:pointer;text-align:left;position:relative;transition:background .2s,border-color .2s}
.kc58-list button small{font:600 9px ui-monospace,monospace;color:#9c8a6c;white-space:nowrap}
.kc58-list button .kc58-nm{position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc58-list button .kc58-nm::after{content:"";position:absolute;left:0;right:0;top:52%;height:1.5px;background:#f2b45a;transform:scaleX(0);transform-origin:0 50%;transition:transform .35s cubic-bezier(.6,0,.3,1) .45s}
.kc58-list button[aria-pressed=true]{background:#221a10;border-color:#6a5130;color:#a89470}
.kc58-list button[aria-pressed=true] .kc58-nm::after{transform:none}
.kc58-list button.kc58-hl{border-color:#f2b45a}
.kc58-list button:focus-visible{outline:2px solid #f2b45a;outline-offset:1px}
.kc58-list svg{width:13px;height:13px;display:block}
.kc58-list svg rect{fill:none;stroke:#7a6648;stroke-width:1.5}
.kc58-list svg path{fill:none;stroke:#f2b45a;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .3s ease-out}
.kc58-list button[aria-pressed=true] svg path{stroke-dashoffset:0}
.kc58-foot{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10px ui-monospace,monospace;color:#9c8a6c}
.kc58-ct{font-size:12.5px;color:#f2b45a;font-variant-numeric:tabular-nums;white-space:nowrap}
.kc58-bar{display:block;height:4px;border-radius:2px;background:#2a2216;overflow:hidden;margin-top:-3px}
.kc58-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#c9802c,#f2b45a);transition:width .5s cubic-bezier(.3,1.2,.5,1);box-shadow:0 0 8px #f2b45a}
@media (prefers-reduced-motion:reduce){.kc58-svg *,.kc58-list *,.kc58-ban,.kc58-bar i{transition:none!important}}

/* 59 Hinge Side Swing — a 3D cabinet door you can pull open; flip Left/Right and it re-hangs and swings from the new side, closing with a real soft-close glide; Fire away padlocks the choice */
.kc59{background:linear-gradient(170deg,#18161c,#0e0d11);border:1px solid #36303f}
.kc59 .in{padding:14px 14px 12px;gap:7px}
.kc59 h3{font-size:14px;line-height:1.3;color:#f1edf6}
.kc59 .st{font-size:11px;padding:3px 9px;background:#19161e;border-color:#433b4f;color:#e2dbec}
.kc59 .meta{font-size:10.5px;color:#837a90;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc59 .rep{font-size:11.5px;color:#c4a6ff}.kc59 a{color:#c4a6ff}
.kc59 .acts{gap:6px}.kc59 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc59-scene{position:relative;height:178px;margin-top:2px;border-radius:10px;perspective:620px;perspective-origin:50% 40%;background:linear-gradient(#2a2622 0 78%,#1a1714 78%);box-shadow:inset 0 0 0 1px #ffffff12;overflow:hidden;touch-action:pan-y}
.kc59-scene::before{content:"";position:absolute;left:0;right:0;top:78%;height:1px;background:#4a423a}
.kc59-cab{--kc59-o:0;position:absolute;left:50%;top:12px;width:78px;height:154px;margin-left:-39px;transform-style:preserve-3d;box-shadow:0 0 0 3px #e8e2d6,0 0 0 4px #b9b0a0,0 16px 22px -10px #000}
.kc59-int{position:absolute;inset:0;background:linear-gradient(90deg,#00000059,#0000 18%,#0000 82%,#00000059),linear-gradient(#d9d3c7,#c9c2b4);overflow:hidden;filter:brightness(calc(.35 + var(--kc59-o) * .75))}
.kc59-int::after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 50% 0,#fff6dd55,#0000);opacity:var(--kc59-o)}
.kc59-shelf{position:absolute;left:0;right:0;top:48%;height:5px;background:linear-gradient(#fbf8f2,#d6cfc1);box-shadow:0 3px 4px #0005}
.kc59-mug{position:absolute;bottom:52%;width:13px;height:14px;border-radius:2px 2px 4px 4px;background:linear-gradient(90deg,#6f8fa8,#a9c2d6 40%,#5d7a92)}
.kc59-mug:nth-child(2){left:9px}.kc59-mug:nth-child(3){left:30px;background:linear-gradient(90deg,#b0574a,#e38b7b 40%,#94463b)}.kc59-mug:nth-child(4){left:51px;height:17px}
.kc59-mug::after{content:"";position:absolute;right:-4px;top:3px;width:4px;height:6px;border:2px solid #00000040;border-left:0;border-radius:0 4px 4px 0}
.kc59-plates{position:absolute;left:8px;right:8px;bottom:4px;height:30px;background:repeating-linear-gradient(90deg,#f6f3ee 0 3px,#cfc8bb 3px 4px);border-radius:3px 3px 0 0;box-shadow:0 -2px 0 #fff inset}
.kc59-door{position:absolute;inset:-2px;transform-style:preserve-3d;transform-origin:0 50%;cursor:grab}
.kc59.kc59-R .kc59-door{transform-origin:100% 50%}
.kc59-door>div{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:2px}
.kc59-front{background:var(--kc59-g,#8a6542) center/cover;box-shadow:inset 0 0 0 1px #0004,inset 0 0 0 12px #ffffff0a,inset 0 0 0 13px #00000047,inset 0 0 0 14px #ffffff26,0 2px 3px #0006}
.kc59-front::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,#ffffff1f,#fff0 40%,#0000002e);border-radius:2px}
.kc59-pull{position:absolute;right:6px;top:40%;width:5px;height:38px;border-radius:3px;background:linear-gradient(90deg,#3d3d40,#cfd0d4 45%,#6a6b70);box-shadow:2px 3px 4px #0008}
.kc59.kc59-R .kc59-pull{right:auto;left:6px}
.kc59-back{transform:rotateY(180deg);background:linear-gradient(90deg,#f1ede5,#e2dcd0);box-shadow:inset 0 0 0 1px #0002}
.kc59-cup{position:absolute;right:5px;width:14px;height:14px;border-radius:50%;background:radial-gradient(#7d7d82 0 30%,#a8a8ad 31% 55%,#5c5c61 56% 60%,#d9d9dc 61%);box-shadow:0 0 0 1px #0005}
.kc59-cup::after{content:"";position:absolute;right:13px;top:5px;width:22px;height:4px;border-radius:2px;background:linear-gradient(#b9babe,#6d6e72)}
.kc59-cup:nth-child(1){top:16px}.kc59-cup:nth-child(2){bottom:16px}
.kc59.kc59-R .kc59-cup{right:auto;left:5px}.kc59.kc59-R .kc59-cup::after{right:auto;left:13px}
.kc59-sc{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:3px 7px;border-radius:99px;background:#0d0c10d9;color:#c4a6ff;font:900 8.5px/1 ui-monospace,monospace;letter-spacing:.18em;opacity:0;pointer-events:none;border:1px solid #c4a6ff66}
.kc59-eng{position:absolute;right:8px;bottom:8px;font:800 8.5px/1 ui-monospace,monospace;letter-spacing:.16em;color:#c4a6ff;opacity:0;transform:translateY(6px);transition:.4s cubic-bezier(.3,1.5,.5,1);text-shadow:0 1px 0 #000}
.kc59.kc59-locked .kc59-eng{opacity:1;transform:none}
.kc59-row{display:flex;align-items:center;gap:10px}
.kc59-tg{position:relative;flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:10px;background:#0d0c10;border:1px solid #36303f;min-width:118px}
.kc59-tg button{position:relative;z-index:1;border:0;background:none;color:#9d93ab;font:700 11px system-ui,sans-serif;padding:6px 8px;border-radius:7px;cursor:pointer;transition:color .3s}
.kc59-tg button[aria-checked=true]{color:#120f17}
.kc59-tg button:focus-visible,.kc59-ang:focus-visible{outline:2px solid #c4a6ff;outline-offset:2px}
.kc59-pill{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:7px;background:linear-gradient(#dccaff,#a98bf0);transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.kc59.kc59-R .kc59-pill{transform:translateX(100%)}
.kc59.kc59-locked .kc59-tg{border-color:#c4a6ff}
.kc59.kc59-locked .kc59-tg::after{content:"";position:absolute;right:-7px;top:-7px;width:12px;height:10px;border-radius:2px;background:#c4a6ff;box-shadow:0 0 0 2px #120f17}
.kc59.kc59-locked .kc59-tg::before{content:"";position:absolute;right:-5px;top:-14px;width:8px;height:9px;border:2px solid #c4a6ff;border-bottom:0;border-radius:5px 5px 0 0;box-sizing:border-box}
.kc59-ol{flex:1;display:flex;align-items:center;gap:6px;font:700 9.5px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#9d93ab;min-width:0}
.kc59-ang{flex:1;min-width:0;margin:0;accent-color:#c4a6ff}
.kc59-sum{font:600 10.5px/1.35 ui-monospace,monospace;color:#9d93ab}.kc59-sum b{color:#f1edf6}
@media (prefers-reduced-motion:reduce){.kc59-pill,.kc59-tg button,.kc59-eng{transition:none}}

/* 60 Wall Run Elevation — drag upper cabinets from the tray onto a kitchen elevation; they grow to true scale as you lift, snap into the opening that fits and refuse the ones that don't */
.kc60{background:linear-gradient(170deg,#161b17,#0c0f0d);border:1px solid #2c3a2f}
.kc60 .in{padding:14px 14px 12px;gap:7px}
.kc60 h3{font-size:14px;line-height:1.3;color:#eef5ef}
.kc60 .st{font-size:11px;padding:3px 9px;background:#121914;border-color:#34503b;color:#d3e8d8}
.kc60 .meta{font-size:10.5px;color:#71877a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc60 .rep{font-size:11.5px;color:#9be3b0}.kc60 a{color:#9be3b0}
.kc60 .acts{gap:6px}.kc60 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc60-wall{position:relative;margin-top:2px;border-radius:8px;overflow:hidden;box-shadow:0 0 0 1px #0008,0 12px 22px -14px #000;touch-action:none}
.kc60-elev{display:block;width:100%;height:auto}
.kc60-elev text{font:800 5px ui-monospace,monospace;fill:#6d7a70}
.kc60-elev .kc60-led{opacity:0;transition:opacity .9s}
.kc60.kc60-lit .kc60-elev .kc60-led{opacity:1}
.kc60-slot{position:absolute;border:1px dashed #6f8f78;border-radius:1px;background:repeating-linear-gradient(135deg,#9be3b014 0 3px,#0000 3px 6px);display:grid;place-items:center;font:800 7.5px/1 ui-monospace,monospace;color:#5b7363;transition:background .2s,border-color .2s,box-shadow .2s}
.kc60-slot.kc60-hot{border-color:#2f9e5a;background:#9be3b040;box-shadow:0 0 0 2px #9be3b088}
.kc60-slot.kc60-bad{border-color:#e0533f;background:#e0533f33}
.kc60-slot.kc60-full{border:0;background:none}
.kc60-cabx{position:absolute;inset:0;display:flex;gap:1px;padding:1px;background:#e6e1d6;box-shadow:0 3px 4px -1px #0007}
.kc60-cabx i,.kc60-g i,.kc60-mini i{flex:1;position:relative;background:linear-gradient(160deg,#a7bba9,#86a08a);box-shadow:inset 0 0 0 1.5px #77917b,inset 0 0 0 2.5px #b9cbbb}
.kc60-cabx i::after,.kc60-g i::after{content:"";position:absolute;bottom:3px;width:1.5px;height:5px;border-radius:1px;background:#2b2f2c;right:2px}
.kc60-cabx i:first-child:not(:last-child)::after,.kc60-g i:first-child:not(:last-child)::after{right:auto;left:auto;right:2px}
.kc60-cabx i:last-child:not(:first-child)::after,.kc60-g i:last-child:not(:first-child)::after{right:auto;left:2px}
.kc60-g{position:absolute;z-index:9;display:flex;gap:1px;padding:1px;background:#e6e1d6;border-radius:1px;pointer-events:none;box-shadow:0 14px 18px -6px #000c;transition:left .28s cubic-bezier(.3,1.3,.5,1),top .28s cubic-bezier(.3,1.3,.5,1),width .2s,height .2s,opacity .25s}
.kc60-g.kc60-free{transition:width .2s,height .2s}
.kc60-tip{position:absolute;z-index:10;padding:3px 7px;border-radius:5px;background:#e0533f;color:#fff;font:800 9px/1.2 ui-monospace,monospace;white-space:nowrap;pointer-events:none;transform:translate(-50%,-110%)}
.kc60-tray{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.kc60-it{display:grid;justify-items:center;gap:2px;padding:6px 2px 5px;border-radius:8px;border:1px solid #2c3a2f;background:#121914;color:#d3e8d8;font:800 10px ui-monospace,monospace;cursor:grab;touch-action:none;transition:opacity .3s,transform .2s,border-color .2s}
.kc60-it:hover{border-color:#4f7a5c}.kc60-it:focus-visible{outline:2px solid #9be3b0;outline-offset:2px}
.kc60-it small{font:600 9px ui-monospace,monospace;color:#86a38f}
.kc60-mini{display:flex;gap:1px;padding:1px;width:var(--kc60-mw);height:24px;background:#e6e1d6;border-radius:1px}
.kc60-it[data-w="30"] .kc60-mini{--kc60-mw:26px}.kc60-it[data-w="24"] .kc60-mini{--kc60-mw:21px}.kc60-it[data-w="15"] .kc60-mini{--kc60-mw:13px}
.kc60-it.kc60-used{opacity:.32;cursor:default;transform:scale(.94)}
.kc60-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#86a38f}
.kc60-p{font-size:14px;color:#9be3b0;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.kc60-g,.kc60-elev .kc60-led,.kc60-slot{transition:none!important}}

/* 61 Closet Section Stack — build a 24 x 84 closet tower: add rods, shelves, drawers and shoe shelves and they drop in and settle; tap a part to pull it out; Fire away switches on the LED strip */
.kc61{background:linear-gradient(170deg,#1b1813,#0f0d0a);border:1px solid #3a3226}
.kc61 .in{padding:14px 14px 12px;gap:7px}
.kc61 h3{font-size:14px;line-height:1.3;color:#f6efe4}
.kc61 .st{font-size:11px;padding:3px 9px;background:#1e1a14;border-color:#4d4231;color:#ecdfca}
.kc61 .meta{font-size:10.5px;color:#8a7c66;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc61 .rep{font-size:11.5px;color:#ffd38a}.kc61 a{color:#ffd38a}
.kc61 .acts{gap:6px}.kc61 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc61-bay{position:relative;height:214px;margin-top:2px;border-radius:10px;background:radial-gradient(90% 70% at 50% 20%,#4a4237,#2a251f);box-shadow:inset 0 0 0 1px #ffffff14,inset 0 -30px 40px -20px #0008;display:flex;justify-content:center;align-items:flex-end;gap:6px;padding:10px 10px 0;overflow:hidden}
.kc61-bay::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:linear-gradient(#6b5236,#4a3825)}
.kc61-rule{position:relative;height:188px;margin-bottom:8px;display:flex;flex-direction:column;justify-content:space-between;font:700 7px/1 ui-monospace,monospace;color:#a4967f;border-right:1px solid #a4967f80;padding-right:3px;z-index:1}
.kc61-rule i{font-style:normal;transform:translateY(0)}
.kc61-tw{position:relative;width:min(150px,58%);height:188px;margin-bottom:8px;padding:5px 5px 0;background:linear-gradient(90deg,#d8d3ca,#f4f1ec 12%,#f4f1ec 88%,#d8d3ca);border-radius:2px 2px 0 0;box-shadow:0 0 0 1px #0006,8px 0 14px -6px #000a;z-index:1}
.kc61-tower{position:relative;height:100%;display:flex;flex-direction:column-reverse;background:linear-gradient(#e2ddd3,#ece8e1);box-shadow:inset 0 2px 6px #0003,inset 3px 0 4px -2px #0003,inset -3px 0 4px -2px #0003;transition:filter .6s}
.kc61-led{position:absolute;left:5px;right:5px;top:5px;height:3px;background:#3a352d;border-radius:0 0 2px 2px;transition:.6s}
.kc61.kc61-lit .kc61-led{background:#fff7d6;box-shadow:0 0 6px #ffe7a0,0 0 18px 4px #ffd36a66}
.kc61.kc61-lit .kc61-tower{background:linear-gradient(#fff4d6,#ece8e1 60%)}
.kc61-pt{position:relative;flex:0 0 auto;transform-origin:50% 100%;height:calc(var(--kc61-h) * 100% / 84);width:100%;padding:0;border:0;background:none;cursor:pointer;display:block;-webkit-tap-highlight-color:transparent}
.kc61-pt:focus-visible{outline:2px solid #ffd38a;outline-offset:-2px}
.kc61-pt:hover::after{content:"✕";position:absolute;right:3px;top:3px;width:13px;height:13px;border-radius:50%;background:#1e1a14d9;color:#ffd38a;font:800 8px/13px system-ui;text-align:center;z-index:3}
.kc61-shelf::before{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(#fbf9f5,#ddd7cc);box-shadow:0 2px 3px #0004;border-top:1px solid #fff}
.kc61-shelf i{position:absolute;bottom:5px;height:var(--kc61-sh,9px);border-radius:2px;background:var(--kc61-c);box-shadow:inset 0 -2px 0 #0002,inset 0 1px 0 #fff4}
.kc61-shelf i:nth-child(1){left:10%;width:30%;--kc61-c:#5b7aa6}.kc61-shelf i:nth-child(2){left:10%;width:30%;bottom:14px;--kc61-c:#c7b9a0}
.kc61-shelf i:nth-child(3){left:52%;width:34%;--kc61-c:#a35a4a;--kc61-sh:12px}
.kc61-rod::before{content:"";position:absolute;left:0;right:0;top:7%;height:4px;border-radius:2px;background:linear-gradient(#f5f6f7,#8b9097 60%,#5d6268);box-shadow:0 2px 2px #0004;z-index:2}
.kc61-rod i{position:absolute;top:calc(7% + 1px);width:15%;height:72%;transform-origin:50% 0;z-index:1}
.kc61-rod i::before{content:"";position:absolute;left:50%;top:-1px;width:4px;height:5px;margin-left:-2px;border:1.2px solid #6b6b6b;border-bottom:0;border-radius:3px 3px 0 0;box-sizing:border-box}
.kc61-rod i::after{content:"";position:absolute;left:0;right:0;top:4px;bottom:0;background:var(--kc61-c);clip-path:polygon(28% 0,72% 0,100% 12%,100% 34%,84% 34%,84% 100%,16% 100%,16% 34%,0 34%,0 12%);box-shadow:inset 0 0 0 1px #0002}
.kc61-drawer::before{content:"";position:absolute;inset:1px 0;border-radius:1px;background:linear-gradient(#f7f5f1,#e5e0d6);box-shadow:inset 0 0 0 1px #0000001f,0 1px 2px #0003}
.kc61-drawer::after{content:"";position:absolute;left:38%;right:38%;top:44%;height:3px;border-radius:2px;background:linear-gradient(#c9cdd2,#6d7279)}
.kc61-shoe::before{content:"";position:absolute;left:0;right:0;bottom:2px;height:4px;background:linear-gradient(#fbf9f5,#d9d3c8);transform:skewY(-6deg);transform-origin:0 100%;box-shadow:0 2px 2px #0003}
.kc61-shoe::after{content:"";position:absolute;left:2px;right:2px;bottom:5px;height:3px;border-top:1.5px solid #9aa0a6;transform:skewY(-6deg)}
.kc61-shoe i{position:absolute;bottom:6px;width:22%;height:46%;border-radius:60% 40% 10% 10%/80% 80% 10% 10%;background:var(--kc61-c);transform:skewY(-6deg)}
.kc61-shoe i:nth-child(1){left:8%;--kc61-c:#3b2a20}.kc61-shoe i:nth-child(2){left:39%;--kc61-c:#e9e4dc;box-shadow:inset 0 -2px 0 #b8b2a8}.kc61-shoe i:nth-child(3){left:70%;--kc61-c:#9c3d33}
.kc61-tag{position:absolute;right:8px;top:8px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.14em;color:#c9b998;z-index:2}
.kc61-add{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.kc61-add button{display:grid;justify-items:center;gap:1px;padding:6px 2px;border-radius:8px;border:1px solid #4d4231;background:#1e1a14;color:#f6efe4;font:800 10px system-ui,sans-serif;white-space:nowrap;cursor:pointer;transition:transform .15s,border-color .2s}
.kc61-add button small{font:600 8.5px ui-monospace,monospace;color:#a4967f}
.kc61-add button:hover{border-color:#ffd38a}.kc61-add button:active{transform:scale(.94)}
.kc61-add button:focus-visible{outline:2px solid #ffd38a;outline-offset:2px}
.kc61-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#a4967f}
.kc61-left{color:#f6efe4;transition:color .2s}.kc61-left.kc61-no{color:#ff7a66}
.kc61-p{font-size:14px;color:#ffd38a;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.kc61-led,.kc61-tower{transition:none}}

/* 62 Hanging Space Split — drag the divider along an 8-foot rod: dresses and coats fill the long hang, shirts and pants fill the double hang, every hanger swings and you can brush them with your finger */
.kc62{background:linear-gradient(170deg,#1c1619,#0f0c0e);border:1px solid #3d2f36}
.kc62 .in{padding:14px 14px 12px;gap:7px}
.kc62 h3{font-size:14px;line-height:1.3;color:#f8eef3}
.kc62 .st{font-size:11px;padding:3px 9px;background:#1f171b;border-color:#523e48;color:#f0dbe5}
.kc62 .meta{font-size:10.5px;color:#8f7883;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc62 .rep{font-size:11.5px;color:#ff9fc8}.kc62 a{color:#ff9fc8}
.kc62 .acts{gap:6px}.kc62 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc62-cl{position:relative;height:178px;margin-top:2px;border-radius:10px;overflow:hidden;background:#2a2226;box-shadow:inset 0 0 0 1px #ffffff14,0 12px 22px -14px #000;touch-action:pan-y;cursor:ew-resize}
.kc62-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc62-lb{position:absolute;top:3px;transform:translateX(-50%);padding:2px 6px;border-radius:99px;background:#1f171bcc;color:#f0dbe5;font:800 7px/1.2 ui-monospace,monospace;letter-spacing:.12em;white-space:nowrap;pointer-events:none;transition:left .25s}
.kc62-rl{display:flex;align-items:center;gap:8px;font:700 9.5px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#bfa3b0}
.kc62-r{flex:1;min-width:0;margin:0;accent-color:#ff9fc8}
.kc62-r:focus-visible{outline:2px solid #ff9fc8;outline-offset:3px}
.kc62-sum{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 10px;font:600 10px ui-monospace,monospace;color:#bfa3b0}
.kc62-sum b{color:#f8eef3}.kc62-l,.kc62-d{color:#ff9fc8!important}
@media (prefers-reduced-motion:reduce){.kc62-lb{transition:none}}

/* 63 Mirror Door Reveal — a sliding mirror door on a track is a window into the future: fling it along the cramped reach-in and the finished walk-in shows through the glass */
.kc63{background:linear-gradient(170deg,#141920,#0b0e13);border:1px solid #2a3442}
.kc63 .in{padding:14px 14px 12px;gap:7px}
.kc63 h3{font-size:14px;line-height:1.3;color:#edf3fa}
.kc63 .st{font-size:11px;padding:3px 9px;background:#121821;border-color:#33445a;color:#d2e1f2}
.kc63 .meta{font-size:10.5px;color:#6f8299;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc63 .rep{font-size:11.5px;color:#9ccaff}.kc63 a{color:#9ccaff}
.kc63 .acts{gap:6px}.kc63 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc63-scene{position:relative;aspect-ratio:240/150;margin-top:2px;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px #0008,0 12px 22px -14px #000;touch-action:pan-y}
.kc63-scene:has(.kc63-r:focus-visible){outline:2px solid #9ccaff;outline-offset:2px}
.kc63-a{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc63-lens{position:absolute;top:7%;bottom:0;left:0;width:36%;box-sizing:border-box;cursor:grab;z-index:2;border:3px solid #c9ced6;border-bottom:0;border-radius:2px 2px 0 0;box-shadow:0 0 0 1px #6b7380,inset 0 0 0 1px #6b7380,10px 0 18px -6px #000a,-10px 0 18px -6px #000a;background:#0b0e13}
.kc63-lens:active{cursor:grabbing}
.kc63-in{position:absolute;inset:0;overflow:hidden}
.kc63-b{position:absolute;left:0;top:0;display:block}
.kc63-sheen{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#fff0 20%,#ffffff2b calc(32% + var(--kc63-p,0) * 30%),#fff0 calc(46% + var(--kc63-p,0) * 30%),#ffffff14 70%,#fff0 76%);transition:opacity .3s}
.kc63-roll{position:absolute;left:14%;right:14%;top:-9px;height:6px;pointer-events:none}
.kc63-roll::before,.kc63-roll::after{content:"";position:absolute;top:0;left:0;width:6px;height:6px;border-radius:50%;background:#e8ecf1;box-shadow:0 0 0 1px #6b7380}
.kc63-roll::after{left:auto;right:0}
.kc63-track{position:absolute;left:0;right:0;top:calc(7% - 9px);height:5px;background:linear-gradient(#e6e9ee,#8a929e);box-shadow:0 2px 3px #0008;z-index:1}
.kc63-tg{position:absolute;top:7px;padding:2px 6px;border-radius:4px;font:800 7px/1.3 ui-monospace,monospace;letter-spacing:.1em;color:#fff;background:#0009;z-index:3;pointer-events:none;transition:opacity .3s}
.kc63-t1{left:7px}.kc63-t2{right:7px;top:auto;bottom:7px;background:#2563ebcc}
.kc63-r{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;bottom:0;left:0}
.kc63.kc63-open .kc63-lens{border-color:#0000;box-shadow:none}
.kc63.kc63-open .kc63-sheen,.kc63.kc63-open .kc63-roll,.kc63.kc63-open .kc63-t1{opacity:0}
.kc63-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10.5px ui-monospace,monospace;color:#8ea1b8}
.kc63-sum b{color:#edf3fa}.kc63-p{font-size:14px;color:#9ccaff!important}
@media (prefers-reduced-motion:reduce){.kc63-tg{transition:none}}

/* 64 Install Crew Sign-Off — the crew checklist ticks itself in pencil, the homeowner signs with a finger (ink thins as you move faster); Fire away tears off the yellow carbon copy */
.kc64{background:linear-gradient(170deg,#191a16,#0e0f0c);border:1px solid #36382c}
.kc64 .in{padding:14px 14px 12px;gap:7px}
.kc64 h3{font-size:14px;line-height:1.3;color:#f3f3ea}
.kc64 .st{font-size:11px;padding:3px 9px;background:#1a1b15;border-color:#45483a;color:#e4e5d6}
.kc64 .meta{font-size:10.5px;color:#83856f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc64 .rep{font-size:11.5px;color:#e9d36a}.kc64 a{color:#e9d36a}
.kc64 .acts{gap:6px}.kc64 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc64-form{position:relative;margin-top:2px;padding:10px 10px 12px;border-radius:4px;background:#fbf9f1;color:#2a2a24;box-shadow:0 1px 0 #d8d4c4,0 3px 0 -1px #f4e7a8,0 4px 0 -1px #d9c97c,0 14px 22px -12px #000;
  background-image:repeating-linear-gradient(#0000 0 17px,#9fc3e01f 17px 18px)}
.kc64-hd{display:flex;justify-content:space-between;gap:6px;flex-wrap:wrap;border-bottom:2px solid #2a2a24;padding-bottom:4px;margin-bottom:5px}
.kc64-hd b{font:900 9px/1.2 ui-monospace,monospace;letter-spacing:.1em}.kc64-hd span{font:600 8.5px/1.2 ui-monospace,monospace;color:#6b6a5c}
.kc64-ck{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:1px}
.kc64-ck button{display:flex;align-items:center;gap:6px;width:100%;padding:2px 0;border:0;background:none;color:#3a392f;font:600 11px/1.3 "Segoe Print","Bradley Hand","Comic Sans MS",cursive;text-align:left;cursor:pointer}
.kc64-ck button:focus-visible,.kc64-clr:focus-visible{outline:2px solid #e9d36a;outline-offset:1px}
.kc64-ck svg{flex:0 0 15px;width:15px;height:15px;overflow:visible}
.kc64-ck rect{fill:#fff;stroke:#6b6a5c;stroke-width:1}
.kc64-ck path{fill:none;stroke:#46464a;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .35s cubic-bezier(.6,0,.3,1)}
.kc64-ck button[aria-pressed=true] path{stroke-dashoffset:0}
.kc64-ck button.kc64-punch{color:#b03a2e}.kc64-ck button.kc64-punch rect{stroke:#b03a2e}
.kc64-pad{position:relative;height:74px;border-radius:3px;background:#fffefa;box-shadow:inset 0 0 0 1px #d6d2c2;touch-action:none;cursor:crosshair}
.kc64-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc64-x{position:absolute;left:8px;bottom:17px;font:800 12px/1 system-ui;color:#8c8a78;pointer-events:none}
.kc64-pad::after{content:"";position:absolute;left:22px;right:10px;bottom:18px;height:1px;background:#8c8a78;pointer-events:none}
.kc64-ln{position:absolute;left:22px;bottom:4px;font:700 7.5px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#8c8a78;pointer-events:none}
.kc64-clr{position:absolute;right:5px;top:5px;font:700 9px system-ui;color:#6b6a5c;background:#f1eee2;border:1px solid #d6d2c2;border-radius:99px;padding:2px 7px;cursor:pointer}
.kc64-crew{margin-top:6px;font:600 8.5px ui-monospace,monospace;color:#6b6a5c}
.kc64-perf{position:absolute;left:0;right:0;bottom:-5px;height:4px;background:radial-gradient(circle,#0000 1.2px,#f4e7a8 1.5px) 0 0/6px 4px;opacity:0}
.kc64-copy{position:absolute;inset:0;z-index:4;border-radius:4px;background:#f6e9a6;background-image:repeating-linear-gradient(#0000 0 17px,#c9b55a33 17px 18px);box-shadow:0 10px 24px -6px #000c;pointer-events:none;overflow:hidden}
.kc64-copy b{position:absolute;left:10px;top:9px;font:900 9px/1 ui-monospace,monospace;letter-spacing:.14em;color:#7a6a20}
.kc64-copy canvas{position:absolute;left:10px;right:10px;bottom:22px;width:calc(100% - 20px);opacity:.75;filter:sepia(1) hue-rotate(180deg) saturate(2)}
.kc64-chip{position:absolute;right:10px;top:-8px;padding:3px 8px;border-radius:99px;background:#e9d36a;color:#1a1b15;font:900 8.5px/1.2 ui-monospace,monospace;letter-spacing:.08em;box-shadow:0 4px 10px #0007;z-index:5}
@media (prefers-reduced-motion:reduce){.kc64-ck path{transition:none}}

/* 65 Receipt Drawer — pull the wardrobe drawer by its handle and it slides out on full-extension runners with the order receipt inside; let go early and it soft-closes */
.kc65{background:linear-gradient(170deg,#1b1714,#0f0c0a);border:1px solid #3c322a}
.kc65 .in{padding:14px 14px 12px;gap:7px}
.kc65 h3{font-size:14px;line-height:1.3;color:#f7efe7}
.kc65 .st{font-size:11px;padding:3px 9px;background:#1e1915;border-color:#4e4136;color:#eddccd}
.kc65 .meta{font-size:10.5px;color:#8d7c6d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc65 .rep{font-size:11.5px;color:#f0b989}.kc65 a{color:#f0b989}
.kc65 .acts{gap:6px}.kc65 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc65-unit{--kc65-d:0px;position:relative;height:232px;margin-top:2px;border-radius:8px;overflow:hidden;background:linear-gradient(#3a3029,#241d18);box-shadow:inset 0 0 0 1px #ffffff12;touch-action:pan-x}
.kc65-unit:has(.kc65-r:focus-visible){outline:2px solid #f0b989;outline-offset:2px}
.kc65-crown{position:absolute;left:8%;right:8%;top:8px;height:10px;border-radius:2px;background:linear-gradient(#fbf8f3,#ddd6ca);box-shadow:0 2px 3px #0006}
.kc65-cav{position:absolute;z-index:2;left:10%;right:10%;top:18px;height:48px;background:#0f0b08;box-shadow:inset 0 0 0 2px #e9e3d8}
.kc65-box{position:absolute;left:0;right:0;top:0;height:calc(var(--kc65-d) + 4px);clip-path:polygon(4% 0,96% 0,100% 100%,0 100%);background:linear-gradient(90deg,#c9a77c,#e8d2ad 9%,#e8d2ad 91%,#c9a77c);overflow:hidden}
.kc65-bot{position:absolute;left:9%;right:9%;top:0;bottom:0;background:linear-gradient(#0000004d,#0000 40%),#2f4a3c;box-shadow:inset 0 6px 10px #0008;overflow:hidden}
.kc65-rc{position:absolute;left:12%;right:12%;bottom:6px;height:166px;padding:8px 8px 6px;background:#fffdf8;color:#2a241e;transform:rotate(-2.5deg);transform-origin:50% 100%;box-shadow:0 4px 8px #0007;display:flex;flex-direction:column;gap:3px;font:600 8px/1.25 ui-monospace,monospace;
  -webkit-mask:linear-gradient(#000,#000) 0 0/100% calc(100% - 4px) no-repeat,radial-gradient(circle at 3px 4px,#000 2.6px,#0000 3px) 0 100%/6px 4px repeat-x;mask:linear-gradient(#000,#000) 0 0/100% calc(100% - 4px) no-repeat,radial-gradient(circle at 3px 4px,#000 2.6px,#0000 3px) 0 100%/6px 4px repeat-x}
.kc65-rc b{font:900 10px/1 ui-monospace,monospace;letter-spacing:.2em;text-align:center}
.kc65-rc small{font:600 7px/1 ui-monospace,monospace;text-align:center;color:#7a6f63;border-bottom:1px dashed #b9ad9c;padding-bottom:4px}
.kc65-rc dl{margin:0;display:grid;grid-template-columns:1fr auto;gap:2px 6px}.kc65-rc dd{margin:0}
.kc65-rc p{margin:0;display:flex;justify-content:space-between;border-top:1px dashed #b9ad9c;padding-top:3px;font:900 9.5px ui-monospace,monospace;color:#2a241e}
.kc65-bc{display:block;height:16px;margin-top:2px;background:repeating-linear-gradient(90deg,#2a241e 0 1px,#0000 1px 3px,#2a241e 3px 5px,#0000 5px 6px,#2a241e 6px 7px,#0000 7px 10px)}
.kc65-rc em{font:italic 600 8px/1 Georgia,serif;text-align:center;color:#7a6f63}
.kc65-stamp{position:absolute;left:50%;top:44%;padding:4px 7px;border:2px solid #c2362b;border-radius:4px;color:#c2362b;font:900 13px/1 ui-monospace,monospace;letter-spacing:.14em;transform:translate(-50%,-50%) rotate(-16deg) scale(2);opacity:0;mix-blend-mode:multiply}
.kc65-front{position:absolute;left:calc(10% - 3px);right:calc(10% - 3px);top:16px;height:52px;transform:translateY(var(--kc65-d)) scale(calc(1 + var(--kc65-k,0) * .05));transform-origin:50% 0;z-index:3;cursor:grab;border-radius:2px;
  background:linear-gradient(#fbf8f3,#e7e1d6);box-shadow:inset 0 0 0 1px #0000001a,inset 0 2px 0 #fff,0 calc(2px + var(--kc65-k,0) * 10px) calc(4px + var(--kc65-k,0) * 14px) #000a}
.kc65-front:active{cursor:grabbing}
.kc65-pull{position:absolute;left:50%;top:50%;width:46%;height:6px;margin:-3px 0 0 -23%;border-radius:3px;background:linear-gradient(#e9eaec,#8c9097 60%,#5b5f66);box-shadow:0 3px 3px #0006}
.kc65-pull::before,.kc65-pull::after{content:"";position:absolute;top:2px;width:4px;height:7px;border-radius:2px;background:#6d7178;left:6%}.kc65-pull::after{left:auto;right:6%}
.kc65-note{position:absolute;right:6px;top:-10px;padding:5px 6px 7px;width:60px;background:#ffe479;color:#3a3010;font:700 8px/1.15 "Segoe Print","Comic Sans MS",cursive;transform:rotate(6deg) scale(0);transform-origin:50% 0;box-shadow:0 4px 6px #0006;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.kc65.kc65-talk .kc65-note{transform:rotate(6deg)}
.kc65-low{position:absolute;left:10%;right:10%;top:72px;bottom:10px;display:grid;gap:4px;z-index:1}
.kc65-low i{border-radius:2px;background:linear-gradient(#f4f0e9,#ddd6c9);box-shadow:inset 0 0 0 1px #0000001a,inset 0 2px 0 #fff}
.kc65-low i::after{content:"";display:block;margin:20px auto 0;width:46%;height:5px;border-radius:3px;background:linear-gradient(#e9eaec,#8c9097)}
.kc65-r{position:absolute;width:1px;height:1px;opacity:0;left:0;bottom:0;pointer-events:none}
.kc65-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10px ui-monospace,monospace;color:#a89584}
.kc65-p{font-size:14px;color:#f0b989}
@media (prefers-reduced-motion:reduce){.kc65-note{transition:none}}

/* 66 Savings Coin Jar — slide the door count: custom solid wood and TFL Door roll on odometers and every $100 you keep drops into a glass jar as a real coin */
.kc66{background:radial-gradient(110% 70% at 50% 0,#1d2219,#0d0f0b 70%);border:1px solid #33402b}
.kc66 .in{padding:14px 14px 12px;gap:7px}
.kc66 h3{font-size:14px;line-height:1.3;color:#f1f6ea}
.kc66 .st{font-size:11px;padding:3px 9px;background:#151a11;border-color:#3e5032;color:#dbe9cd}
.kc66 .meta{font-size:10.5px;color:#7d8c70;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc66 .rep{font-size:11.5px;color:#f5c84b}.kc66 a{color:#f5c84b}
.kc66 .acts{gap:6px}.kc66 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc66-vs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:2px}
.kc66-col{display:grid;gap:3px;padding:7px 8px;border-radius:9px;background:#151a11;border:1px solid #33402b;min-width:0}
.kc66-them{background:#1f1512;border-color:#4a2e26}
.kc66-col small{font:800 8px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#a3b494}.kc66-them small{color:#c79a8c}
.kc66-col i{font:600 8.5px/1.2 ui-monospace,monospace;font-style:normal;color:#7d8c70}.kc66-them i{color:#9c7a70}
.kc66-od{display:flex;height:22px;overflow:hidden;font:900 18px/22px ui-monospace,SFMono-Regular,Menlo,monospace;color:#f1f6ea;font-variant-numeric:tabular-nums}
.kc66-them .kc66-od{color:#ff9d8a;text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:#ff9d8a80}
.kc66-od span{display:block}
.kc66-od .kc66-dg{display:flex;flex-direction:column;transition:transform .9s cubic-bezier(.2,1.25,.4,1)}
.kc66-jar{position:relative;height:150px;border-radius:10px;overflow:hidden;background:radial-gradient(80% 70% at 50% 100%,#2a3320,#12160e)}
.kc66-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc66-lid{position:absolute;left:50%;top:-30px;width:96px;height:14px;margin-left:-48px;border-radius:4px 4px 2px 2px;background:linear-gradient(#e7c463,#9c7a25);box-shadow:inset 0 2px 0 #fff6,0 4px 6px #0008;opacity:0;background-image:repeating-linear-gradient(90deg,#0000 0 3px,#0000002e 3px 4px),linear-gradient(#e7c463,#9c7a25)}
.kc66.kc66-lidon .kc66-lid{top:15px;opacity:1;transition:top .5s cubic-bezier(.3,1.5,.5,1),opacity .2s}
.kc66-lbl{position:absolute;left:10px;top:10px;display:grid;gap:1px;padding:5px 8px;border-radius:6px;background:#0d0f0bcc;border:1px solid #f5c84b55}
.kc66-lbl small{font:800 7.5px/1 ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;color:#cdb15b}
.kc66-lbl b{font:900 17px/1.1 ui-monospace,monospace;color:#f5c84b;font-variant-numeric:tabular-nums}
.kc66-rl{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;font:700 9.5px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#a3b494}
.kc66-r{width:100%;margin:0;accent-color:#f5c84b}.kc66-r:focus-visible{outline:2px solid #f5c84b;outline-offset:3px}
.kc66-n{font:900 13px ui-monospace,monospace;color:#f1f6ea;min-width:2ch;text-align:right}
@media (prefers-reduced-motion:reduce){.kc66-od .kc66-dg,.kc66.kc66-lidon .kc66-lid{transition:none}}

/* 67 Green-Light Contract — a real traffic signal guards the contract: confirm price, ship date and deposit to step it red, amber, green; Fire away on green runs a drag-strip launch */
.kc67{background:linear-gradient(170deg,#121417,#0a0b0d);border:1px solid #2a2e35}
.kc67 .in{padding:14px 14px 12px;gap:7px}
.kc67 h3{font-size:14px;line-height:1.3;color:#eef1f5}
.kc67 .st{font-size:11px;padding:3px 9px;background:#14171b;border-color:#363c46;color:#dbe1ea}
.kc67 .meta{font-size:10.5px;color:#737b88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc67 .rep{font-size:11.5px;color:#5cf08a}.kc67 a{color:#5cf08a}
.kc67 .acts{gap:6px}.kc67 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc67{--kc67-glow:#ff3b30;transition:box-shadow .4s}
.kc67::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(70% 45% at 22% 38%,color-mix(in srgb,var(--kc67-glow) 22%,transparent),transparent 70%);transition:background .4s}
.kc67-wrap{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;margin-top:2px}
.kc67-pole{position:relative;padding-bottom:16px}
.kc67-pole::after{content:"";position:absolute;left:50%;bottom:0;width:8px;height:18px;margin-left:-4px;background:linear-gradient(90deg,#2a2d31,#4c5158,#2a2d31)}
.kc67-light{position:relative;display:grid;gap:7px;padding:9px 8px;border-radius:12px;background:linear-gradient(90deg,#1c1f23,#34383e 50%,#1c1f23);box-shadow:0 0 0 2px #0b0c0e,inset 0 1px 0 #ffffff1f,0 10px 18px -8px #000}
.kc67-l{position:relative;display:block;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#0000 0 60%,#00000080 61%),repeating-radial-gradient(circle at 50% 50%,#ffffff12 0 2px,#0000 2px 4px),radial-gradient(circle at 40% 35%,var(--kc67-c2) 0,var(--kc67-c) 55%,#000 100%);
  box-shadow:inset 0 0 0 2px #0b0c0e,inset 0 3px 6px #000c;filter:brightness(.28) saturate(.6);transition:filter .25s,box-shadow .25s}
.kc67-l::before{content:"";position:absolute;left:-5px;right:-5px;top:-6px;height:22px;border-radius:24px 24px 0 0;background:linear-gradient(#202328,#121417);clip-path:polygon(0 0,100% 0,100% 100%,92% 30%,8% 30%,0 100%);z-index:1}
.kc67-l::after{content:"";position:absolute;left:22%;top:16%;width:30%;height:18%;border-radius:50%;background:#ffffff59;filter:blur(1px)}
.kc67-r{--kc67-c:#d12b20;--kc67-c2:#ff8a7a}.kc67-y{--kc67-c:#d99a0b;--kc67-c2:#ffe08a}.kc67-g{--kc67-c:#14b84a;--kc67-c2:#a8ffc8}
.kc67-l.kc67-on{filter:none;box-shadow:inset 0 0 0 2px #0b0c0e,0 0 14px 3px var(--kc67-c),0 0 34px 8px color-mix(in srgb,var(--kc67-c) 50%,transparent)}
.kc67-terms{list-style:none;margin:0;padding:0;display:grid;gap:6px;min-width:0}
.kc67-terms button{width:100%;display:grid;gap:1px;text-align:left;padding:6px 8px 6px 26px;border-radius:8px;border:1px solid #363c46;background:#14171b;color:#dbe1ea;cursor:pointer;position:relative;transition:border-color .25s,background .25s}
.kc67-terms button::before{content:"";position:absolute;left:8px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;border:2px solid #5a626f;box-sizing:border-box;transition:.25s}
.kc67-terms button[aria-pressed=true]{border-color:#2f8f52;background:#11201a}
.kc67-terms button[aria-pressed=true]::before{border-color:#5cf08a;background:#5cf08a;box-shadow:0 0 8px #5cf08a}
.kc67-terms button.kc67-need{border-color:#ff5a4d;animation:kc67-shake .35s}
.kc67-terms button:focus-visible{outline:2px solid #5cf08a;outline-offset:2px}
.kc67-terms b{font:800 11px system-ui,sans-serif}.kc67-terms span{font:600 9.5px/1.3 ui-monospace,monospace;color:#8c95a3}
@keyframes kc67-shake{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
.kc67-strip{position:relative;height:24px;border-radius:6px;overflow:hidden;background:#0d0f12;background-image:repeating-linear-gradient(90deg,#0000 0 16px,#f5d76e55 16px 26px);background-size:42px 2px;background-position:0 50%;background-repeat:repeat-x;box-shadow:inset 0 0 0 1px #2a2e35}
.kc67-doc{position:absolute;left:6px;top:4px;width:14px;height:16px;border-radius:2px;background:linear-gradient(#fff,#d9dee6);box-shadow:inset 0 -3px 0 #c0c7d2}
.kc67-doc::before{content:"";position:absolute;left:3px;right:3px;top:4px;height:6px;background:repeating-linear-gradient(#8a93a3 0 1px,#0000 1px 3px)}
.kc67-go{position:absolute;left:12px;top:50%;transform:translateY(-50%);font:900 8.5px/1 ui-monospace,monospace;letter-spacing:.12em;color:#5cf08a;opacity:0}
@media (prefers-reduced-motion:reduce){.kc67-terms button.kc67-need{animation:none}.kc67-l{transition:none}}

/* 68 Friend Pass Plane — type a friend's name onto the pass; Fire away runs it through a copier, folds the copy into a paper plane and flies it to your friend list */
.kc68{background:linear-gradient(170deg,#17141f,#0d0b12);border:1px solid #352e48}
.kc68 .in{padding:14px 14px 12px;gap:7px}
.kc68 h3{font-size:14px;line-height:1.3;color:#f2eefb}
.kc68 .st{font-size:11px;padding:3px 9px;background:#18141f;border-color:#463c5e;color:#e0d8f2}
.kc68 .meta{font-size:10.5px;color:#857c9c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc68 .rep{font-size:11.5px;color:#ffcf5c}.kc68 a{color:#ffcf5c}
.kc68 .acts{gap:6px}.kc68 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc68-desk{position:relative;padding:10px 4px 6px;margin-top:2px}
.kc68-pass{position:relative;display:grid;grid-template-columns:1fr auto;border-radius:10px;overflow:hidden;color:#1b1626;background:linear-gradient(120deg,#ffe08a,#ffcf5c 45%,#ffb347);box-shadow:0 12px 22px -12px #000,inset 0 1px 0 #fff8;
  -webkit-mask:radial-gradient(circle 8px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 8px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 8px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 8px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat}
.kc68-l{display:grid;gap:2px;padding:10px 10px 10px 14px;min-width:0}
.kc68-l small{font:900 7.5px/1 ui-monospace,monospace;letter-spacing:.16em;color:#7a4e10}
.kc68-l b{font:900 26px/1 system-ui,sans-serif;letter-spacing:-.02em}
.kc68-l span{font:600 10px/1.3 system-ui,sans-serif;color:#4a3410}
.kc68-fn{font-style:normal;font-weight:900;color:#1b1626;background:#fff6;padding:0 3px;border-radius:3px}
.kc68-r{display:grid;justify-items:center;align-content:center;gap:5px;padding:8px 12px 8px 10px;border-left:2px dashed #7a4e1066}
.kc68-r code{font:900 8.5px/1 ui-monospace,monospace;letter-spacing:.06em;writing-mode:vertical-rl;transform:rotate(180deg);color:#4a3410}
.kc68-qr{display:none}
.kc68-scan{position:absolute;left:0;right:0;top:0;height:30%;background:linear-gradient(#7cf3ff00,#7cf3ff99 70%,#fff);mix-blend-mode:screen;opacity:0;pointer-events:none}
.kc68-clone{position:absolute;z-index:8;pointer-events:none;margin:0}
.kc68-trail{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:visible}
.kc68-trail path{fill:none;stroke:#ffcf5c;stroke-width:1.5;stroke-dasharray:3 4;opacity:.8}
.kc68-row{display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.kc68-lb{display:grid;gap:3px;font:700 9px ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#a49bbb;min-width:0;flex:1}
.kc68-in{width:100%;max-width:150px;box-sizing:border-box;padding:6px 8px;border-radius:7px;border:1px solid #463c5e;background:#120f18;color:#f2eefb;font:700 13px system-ui,sans-serif}
.kc68-in:focus-visible{outline:2px solid #ffcf5c;outline-offset:1px}
.kc68-fr{display:flex;flex-direction:row-reverse;justify-content:flex-end}
.kc68-av{width:26px;height:26px;margin-left:-7px;border-radius:50%;display:grid;place-items:center;font:900 11px system-ui;color:#1b1626;background:var(--kc68-c,#c4b5fd);box-shadow:0 0 0 2px #17141f}
.kc68-av:nth-child(3n+1){--kc68-c:#a7f3d0}.kc68-av:nth-child(3n+2){--kc68-c:#fbcfe8}
.kc68-sum{display:flex;justify-content:space-between;gap:6px;font:600 10.5px ui-monospace,monospace;color:#a49bbb}.kc68-sum b{color:#ffcf5c}
.kc68.kc68-void .kc68-pass{filter:grayscale(1) brightness(.6)}
@media (prefers-reduced-motion:reduce){.kc68-fn{transition:none}.kc68-scan{display:none}}

/* 69 Price Lock Clock — a live deal clock counts down to Friday 5 PM CT; press and hold to fill the ring and the padlock snaps shut on $38 a door */
.kc69{background:linear-gradient(170deg,#1a1410,#0e0b09);border:1px solid #3e3024}
.kc69 .in{padding:14px 14px 12px;gap:7px}
.kc69 h3{font-size:14px;line-height:1.3;color:#fbf1e6}
.kc69 .st{font-size:11px;padding:3px 9px;background:#1f1812;border-color:#523f2e;color:#f1dfca}
.kc69 .meta{font-size:10.5px;color:#917c66;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc69 .rep{font-size:11.5px;color:#ff9b54}.kc69 a{color:#ff9b54}
.kc69 .acts{gap:6px}.kc69 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc69-face{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:10px;align-items:center;margin-top:2px}
.kc69-clk{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 10px 12px #000a)}
.kc69-clk .kc69-arc{fill:none;stroke:#ff9b54;stroke-width:5;stroke-linecap:round;transition:stroke .5s}
.kc69.kc69-locked .kc69-clk .kc69-arc{stroke:#4ade80}
.kc69-clk text{font:800 9px ui-monospace,monospace;fill:#fbf1e6;text-anchor:middle}
.kc69-clk text.kc69-s{font-size:5.5px;fill:#b89a7e;letter-spacing:.14em}
.kc69-tagw{position:relative;padding-top:18px;transform-origin:50% 0;animation:kc69-sw 3.2s ease-in-out infinite}
.kc69-str{position:absolute;left:50%;top:0;width:1.5px;height:22px;background:#8a6a4b}
.kc69-str::before{content:"";position:absolute;left:-4px;top:-4px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d9d9d9,#6b6b6b)}
.kc69-tag{position:relative;display:grid;gap:2px;padding:14px 10px 10px;border-radius:6px 6px 12px 12px;background:linear-gradient(160deg,#fff7ea,#f1dfc4);color:#2a1d12;box-shadow:0 10px 18px -8px #000c,inset 0 0 0 1.5px #ffffff80;transition:transform .6s cubic-bezier(.3,1.4,.5,1)}
.kc69-tag::before{content:"";position:absolute;left:50%;top:5px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:#1a1410;box-shadow:inset 0 1px 1px #000,0 0 0 2px #d4bb98}
.kc69-tag small{font:800 7.5px/1.2 ui-monospace,monospace;letter-spacing:.06em;color:#8a6a4b}
.kc69-tag b{font:900 30px/1 system-ui,sans-serif;letter-spacing:-.03em;color:#c2410c}
.kc69-tag span{font:700 9.5px ui-monospace,monospace;color:#6b5240}.kc69-tag s{color:#a08770}
.kc69-lock{position:absolute;right:-8px;bottom:-8px;width:26px;height:20px;border-radius:4px;background:linear-gradient(#ffd27a,#c98a1e);box-shadow:0 4px 8px #0008,inset 0 1px 0 #fff8;opacity:0;transform:scale(.4);transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.kc69-lock::after{content:"";position:absolute;left:50%;top:7px;width:4px;height:6px;margin-left:-2px;border-radius:2px;background:#5a3a0a}
.kc69-sh{position:absolute;left:5px;right:5px;bottom:14px;height:16px;border:3.5px solid #c9ced6;border-bottom:0;border-radius:9px 9px 0 0;transform:translateY(-8px);transition:transform .25s cubic-bezier(.6,0,.4,1.6) .35s}
.kc69.kc69-locked .kc69-lock{opacity:1;transform:rotate(-8deg)}
.kc69.kc69-locked .kc69-sh{transform:none}
.kc69.kc69-locked .kc69-tagw{animation:none}
.kc69.kc69-gone .kc69-tag{transform:rotateX(360deg);filter:grayscale(.7)}
.kc69-hold{position:relative;overflow:hidden;width:100%;padding:10px 8px;border-radius:12px;border:1px solid #ff9b5466;background:#1f1812;color:#fbf1e6;font:800 12.5px system-ui,sans-serif;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}
.kc69-hold:focus-visible{outline:2px solid #ff9b54;outline-offset:2px}
.kc69-fill{position:absolute;inset:0;background:linear-gradient(90deg,#ff7a2f,#ffb36b);transform-origin:0 50%;transform:scaleX(var(--kc69-p,0))}
.kc69-bt{position:relative;text-shadow:0 1px 2px #0008}
.kc69.kc69-locked .kc69-hold{border-color:#4ade80;cursor:default}.kc69.kc69-locked .kc69-fill{background:linear-gradient(90deg,#16a34a,#4ade80)}
.kc69-sum{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font:600 10px ui-monospace,monospace;color:#b89a7e}
.kc69-sum b{color:#fbf1e6}.kc69-left{font-size:13px;color:#ff9b54!important;font-variant-numeric:tabular-nums}
@keyframes kc69-sw{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@media (prefers-reduced-motion:reduce){.kc69-tagw{animation:none}.kc69-tag,.kc69-sh,.kc69-lock{transition:none}}

/* 70 Offcut Confetti Close — sign the agreement with your finger; Fire away erupts confetti made of real door offcuts: laminate scraps, edge-band strips and hinge-bore plugs tumbling in 3D */
.kc70{background:linear-gradient(170deg,#15171c,#0b0c0f);border:1px solid #2d3240}
.kc70 .in{padding:14px 14px 12px;gap:7px}
.kc70 h3{font-size:14px;line-height:1.3;color:#f0f2f7}
.kc70 .st{font-size:11px;padding:3px 9px;background:#151820;border-color:#3a4256;color:#dbe0ec}
.kc70 .meta{font-size:10.5px;color:#7a8296;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc70 .rep{font-size:11.5px;color:#ffd76a}.kc70 a{color:#ffd76a}
.kc70 .acts{gap:6px}.kc70 .b{font-size:12px;padding:8px 4px;min-height:36px}
.kc70-doc{position:relative;margin-top:2px;padding:12px 12px 10px;border-radius:6px;background:linear-gradient(170deg,#fffdf7,#f3eee2);color:#22201b;box-shadow:0 14px 26px -14px #000,inset 0 0 0 1px #00000014}
.kc70-doc::before{content:"";position:absolute;left:12px;right:12px;top:8px;height:3px;background:linear-gradient(90deg,#c9a24a,#f2d68a,#c9a24a);border-radius:2px}
.kc70-hd{display:grid;gap:2px;margin-top:4px}
.kc70-hd b{font:900 11px/1.2 Georgia,"Times New Roman",serif;letter-spacing:.18em}
.kc70-hd span{font:600 10px/1.3 ui-monospace,monospace;color:#5d574a}.kc70-hd strong{color:#22201b}
.kc70-fine{margin:6px 0 4px!important;font:italic 500 10.5px/1.4 Georgia,serif!important;color:#5d574a!important}
.kc70-sig{position:relative;height:78px;touch-action:none;cursor:crosshair}
.kc70-pen{position:absolute;inset:0;width:100%;height:100%;display:block}
.kc70-sig::after{content:"";position:absolute;left:18px;right:4px;bottom:20px;height:1.5px;background:linear-gradient(90deg,#c9a24a,#8a7a55)}
.kc70-x{position:absolute;left:2px;bottom:20px;font:900 14px/1 Georgia,serif;color:#8a7a55;pointer-events:none}
.kc70-who{position:absolute;left:18px;bottom:4px;font:700 8px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#8a7a55;pointer-events:none}
.kc70-seal{position:absolute;right:4px;top:4px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:900 8px/1 ui-monospace,monospace;letter-spacing:.1em;font-style:normal;color:#fff7dd;
  background:radial-gradient(circle at 35% 30%,#e0574a,#9e1f17 70%);box-shadow:0 3px 6px #0006,inset 0 0 0 3px #ffffff33,inset 0 0 0 5px #9e1f17,inset 0 0 0 6px #ffffff40;transform:scale(0) rotate(-30deg);pointer-events:none}
.kc70-fx{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none}@media (prefers-reduced-motion:reduce){.kc70-fx{display:none}}
