.kb-charms{--kc-gold:#bb945a;--kc-berry:#a12957;--kc-teal:#195b60;color:#253e40;max-width:1030px;margin:1rem auto 3rem;line-height:1.65}.kb-charms [hidden]{display:none!important}.kc-opening{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;overflow:hidden;position:relative;border:1px solid #ead5cf;border-radius:28px 28px 12px 12px;background:radial-gradient(ellipse at 89% 55%,#ffdee6,transparent 45%),linear-gradient(112deg,#fffefa,#fff8f7)}.kc-intro{padding:clamp(22px,4vw,52px);padding-right:0}.kc-eyebrow{font:700 .69rem/1.4 system-ui,sans-serif;letter-spacing:.13em;color:var(--kc-berry)}.kb-charms h2,.kb-charms h3,.kb-charms h4{font-family:Georgia,serif;font-weight:500;line-height:1.14;color:var(--kc-teal)}.kc-intro h2{font-size:clamp(30px,4.5vw,54px);letter-spacing:-.045em;margin:10px 0}.kc-lead{font:italic clamp(18px,2.1vw,22px)/1.4 Georgia;color:#863c55}.kc-intro p{margin:10px 0}.kc-bag-stage{position:relative;width:100%;aspect-ratio:1.35;display:grid;place-items:center;isolation:isolate}.kc-bag-stage:before{content:'';width:82%;height:82%;position:absolute;z-index:-1;inset:10% 9%;border-radius:50%;background:radial-gradient(closest-side,#fffae3,#fbe3deaa 78%,transparent)}.kc-bag{width:81%;height:87%;object-fit:contain;transform-origin:50% 25%;filter:drop-shadow(0 8px 7px #8957432e)}.kc-loose{position:absolute;width:13%;height:18%;object-fit:contain;filter:drop-shadow(0 3px 2px #8a644133)}.kc-loose-one{left:12%;bottom:15%;transform:rotate(-24deg)}.kc-loose-two{right:12%;bottom:12%;transform:rotate(16deg)}.kc-loose-three{right:12%;top:14%;transform:rotate(-15deg)}.kc-spark{position:absolute;color:#b18b46;font-style:normal}.s1{top:10%;left:16%;font-size:24px}.s2{top:35%;right:9%;font-size:31px}.s3{bottom:16%;right:29%}.s4{top:45%;left:9%}.kc-shaking .kc-bag{animation:kc-shake .91s ease-in-out both}.kc-shaking .kc-spark{animation:kc-glint .55s ease-in-out 3}.kc-form{margin:15px 0 20px;padding:20px clamp(17px,3vw,32px);border:1px solid #e6ded6;border-radius:14px;background:#fff}.kc-form>label{display:block;font-weight:700;color:var(--kc-teal);margin-bottom:5px}.kc-form>label span{font-size:.86em;color:#60706c;font-weight:400}.kc-form>input{box-sizing:border-box;width:100%;font:inherit;font-size:max(16px,1rem);border:1px solid #bdcbc6;border-radius:10px;padding:10px 14px;min-height:48px;color:inherit;background:#fff}.kc-commands{display:flex;align-items:center;flex-wrap:wrap;gap:10px 24px;margin-top:14px}.kc-shake{font:700 1rem system-ui,sans-serif;color:white;background:var(--kc-berry);border:1px solid var(--kc-berry);border-radius:28px;min-height:48px;padding:10px 26px;cursor:pointer}.kc-shake:disabled{opacity:.77;cursor:progress}.kc-sound{display:inline-flex;align-items:center;gap:7px;min-height:44px;font-size:.87em;cursor:pointer}.kc-sound input{accent-color:var(--kc-berry);width:17px;height:17px}.kb-charms :focus-visible{outline:3px solid #2d9997;outline-offset:3px}.kc-table{padding:13px;border-radius:25px;background:radial-gradient(ellipse at 46% 45%,#307578,#154e55 69%,#0d4149);border:3px double #c9aa78;box-shadow:inset 0 2px 9px #0e393c80;color:#fffbe9;position:relative}.kc-table:before{content:'';position:absolute;inset:7px;border:1px dashed #c6a577;border-radius:17px;pointer-events:none}.kc-tablehead{text-align:center;color:#f5dfab;font:italic 17px Georgia,serif;margin:8px 0}.kc-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.kc-slot{display:flex;flex-direction:column;align-items:center;text-align:center;padding:3px 4px 18px;min-width:0}.kc-holder{position:relative;width:clamp(65px,12vw,124px);aspect-ratio:1;display:grid;place-items:center}.kc-holder img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px #032a2f66)}.kc-slot-number{display:grid;place-items:center;width:80%;height:80%;border:1px dashed #d7c89d8c;border-radius:50%;font:italic 22px Georgia,serif;color:#e4d0ae}.kc-slot small{font-size:clamp(10px,1.25vw,13px);color:#f1efdd;line-height:1.4}.kc-slot-name{font:500 clamp(15px,2vw,22px)/1.2 Georgia,serif;margin-top:5px}.kc-landed img{animation:kc-land .55s cubic-bezier(.19,.8,.33,1.1) both}.kc-your-question{overflow-wrap:anywhere;font-style:italic;color:#456469}.kc-synthesis{padding:clamp(20px,4vw,40px);background:linear-gradient(140deg,#fdf3f5,#fffaf4);border:1px solid #ead6d2;border-left:4px solid #a53057;border-radius:20px;margin:24px 0}.kc-synthesis h3,.kc-eachtitle{font-size:clamp(26px,3vw,37px);margin:8px 0 17px}.kc-story p{margin:10px 0;max-width:76ch}.kc-personal{display:grid;gap:12px}.kc-card{display:grid;grid-template-columns:94px 1fr;gap:16px;align-items:start;padding:18px;border-radius:16px;border:1px solid #d9e4df;background:linear-gradient(107deg,#f4f9f5,#fff 68%)}.kc-card>img{width:100%;height:95px;object-fit:contain}.kc-card h4{font-size:25px;margin:6px 0}.kc-card p{margin:5px 0 10px}.kc-key{color:#845233;font:italic 17px/1.5 Georgia,serif}.kc-sr-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes kc-shake{0%,100%{transform:translate(0) rotate(0)}17%{transform:translate(-11px,-6px) rotate(-9deg)}34%{transform:translate(13px,2px) rotate(11deg)}53%{transform:translate(-15px,-7px) rotate(-12deg)}72%{transform:translate(10px,1px) rotate(8deg)}87%{transform:translate(-3px,-3px) rotate(-4deg)}}@keyframes kc-glint{50%{opacity:.35;transform:scale(.77)}}@keyframes kc-land{0%{opacity:0;transform:translateY(-52px) rotate(-18deg) scale(.68)}65%{transform:translateY(3px) rotate(5deg) scale(1.02);opacity:1}86%{transform:translateY(-5px) rotate(-2deg)}100%{transform:none}}@media(max-width:680px){.kc-opening{grid-template-columns:1fr}.kc-intro{padding:22px 20px 0}.kc-bag-stage{height:165px;aspect-ratio:auto}.kc-bag{max-width:245px}.kc-loose-one{left:22%}.kc-loose-two{right:22%}.kc-loose-three{right:20%}.kc-card{grid-template-columns:59px 1fr;gap:10px;padding:13px}.kc-card>img{height:65px}.kc-table{padding:10px 6px}.kc-slot-name{overflow-wrap:anywhere}.kc-slot small{max-width:90px}.kc-holder{width:clamp(62px,19vw,100px)}}@media(prefers-reduced-motion:reduce){.kb-charms *{animation:none!important;transition:none!important}}

/* A fixed mobile stage must not let an intrinsic SVG grow its grid row. */
@media(max-width:680px){
 .kb-charms .kc-bag-stage{display:block;width:min(100%,320px);height:230px;min-height:230px;aspect-ratio:auto;margin:8px auto 14px}
 .kb-charms .kc-bag-stage .kc-bag{position:absolute;inset:8% 15% auto;width:70%;height:78%;min-width:0;min-height:0;max-width:none;max-height:78%;object-fit:contain;object-position:center}
}