.tkcl-shop {clear:both;display:block;width:100%;max-width:1250px;margin:28px auto 42px;color:#f5f7fa;font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
.tkcl-shop .tkcl-heading {font-size:clamp(1.3rem,2vw,1.8rem);font-weight:750;margin:0 0 8px;color:inherit}
.tkcl-shop .tkcl-desc {margin:0 0 16px;color:inherit;opacity:.8;font-size:14px;line-height:1.5}
.tkcl-frame {display:block;width:100%;height:1240px;box-sizing:border-box;border:1px solid #454a51;border-radius:16px;background:#0d1014}
.tkcl-buybar {margin-top:15px;padding:18px 20px 19px;background:#161b22;color:#f5f7fa;border:1px solid #323b46;border-radius:14px;display:flex;align-items:center;flex-wrap:wrap;gap:14px}
.tkcl-buybar .tkcl-price{font-size:16px;margin-right:auto}.tkcl-price strong{color:#ff912c}
.tkcl-buybar .tkcl-add{border:0;cursor:pointer;background:#ff861c;color:#17130e;font-weight:750;font-size:15px;padding:14px 25px;border-radius:9px;transition:filter .15s}
.tkcl-buybar .tkcl-add:disabled{opacity:.6;cursor:progress}
.tkcl-buybar .tkcl-add:not(:disabled):hover{filter:brightness(1.1)}
.tkcl-buybar .tkcl-feedback{margin:0;flex-basis:100%;font-size:13px;line-height:1.4;color:#bcd2c3}
.tkcl-buybar .tkcl-feedback.tkcl-failed{color:#ffbca9}
.tkcl-buybar .tkcl-feedback a{color:#ffad59;font-weight:700;text-decoration:underline;margin-left:6px}
@media(max-width:700px){.tkcl-frame{border-radius:10px}.tkcl-buybar{padding:14px}.tkcl-buybar .tkcl-add{width:100%}}

/* TK CharmLab 0.1.8: compact mobile designer */
.tkcl-frame{height:900px;max-width:100%;vertical-align:top}
@media(max-width:700px){
 .tkcl-shop{margin:8px auto 15px!important;padding:0!important;max-width:100%!important;width:100%!important}
 .tkcl-shop .tkcl-heading{font-size:1.15rem;margin-bottom:4px;line-height:1.25}
 .tkcl-shop .tkcl-desc{font-size:12px;margin-bottom:7px}
 .tkcl-frame{border-radius:9px;min-height:0}
 .tkcl-buybar{margin-top:8px;padding:12px;border-radius:10px;gap:8px}
}

/* 0.1.8: repositionable live preview. No page backdrop and no scroll lock. */
.tkcl-floating{position:fixed!important;z-index:2147483000!important;width:min(440px,calc(100vw - 12px));height:min(390px,calc(100dvh - 20px));display:flex;flex-direction:column;border:1px solid #5d6672;border-radius:13px;background:#101820;box-shadow:0 15px 45px #0009;overflow:hidden;color:#f8f9fa}
.tkcl-floating[hidden]{display:none!important}
.tkcl-float-header{display:flex;flex:0 0 42px;align-items:center;justify-content:space-between;gap:8px;cursor:move;cursor:grab;user-select:none;touch-action:none;background:#1d252e;border-bottom:1px solid #36404b;padding:0 10px;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:13px;color:#f3f7fc}
.tkcl-float-header.is-dragging{cursor:grabbing}
.tkcl-float-header span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tkcl-float-header small{font-size:10px;color:#a3afba;margin-left:6px;font-weight:400}
.tkcl-float-close{width:32px;height:29px;border:1px solid #52606c;border-radius:7px;background:#2c3944;color:white;cursor:pointer;font-size:15px;flex-shrink:0;padding:0}
.tkcl-float-frame{display:block;width:100%;flex:1;min-height:0;border:0;background:#101820}
@media(max-width:700px){
 .tkcl-floating{width:min(340px,calc(100vw - 12px));height:min(320px,calc(100dvh - 20px));border-radius:11px}
 .tkcl-float-header{flex-basis:39px}
 .tkcl-float-header small{font-size:9px}
}

/* 0.1.11: floating viewer is a mobile-only interaction. */
@media(min-width:851px){.tkcl-floating{display:none!important}}