.kale-works-media{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:80px;overflow:hidden;transition:opacity .2s ease}
.kale-works-media__content{width:100%;height:100%;max-height:inherit;object-fit:contain;animation:kale-works-reveal .2s ease both}
.kale-works-media__placeholder{display:flex;width:100%;height:100%;min-height:120px;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--app-text,#a0a8b8)}
.kale-works-media__hint{font-size:11px;opacity:.65;text-align:center;padding:0 12px}
.kale-works-media__skeleton{height:100%;width:100%;min-height:120px;background:linear-gradient(110deg,transparent 30%,#8882 50%,transparent 70%);background-size:220% 100%;animation:kale-works-shimmer 1.5s ease infinite}
.kale-works-media__play{display:grid;place-items:center;width:48px;height:48px;border:1px solid #8885;border-radius:50%;background:#8881;color:inherit;cursor:pointer;transition:transform .2s ease,background .2s ease}
.kale-works-media__play:hover{transform:scale(1.03);background:#8883}.kale-works-media__play:active{transform:scale(.97)}.kale-works-media__play:focus-visible{outline:2px solid var(--accent,#3986ff);outline-offset:4px}.kale-works-media__play:disabled{cursor:wait;opacity:.55}
.kale-works-record-skeletons{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;padding:20px}
.kale-works-record-skeleton{height:230px;border:1px solid #8883;border-radius:12px;background:#8881;animation:kale-works-reveal .2s ease both}
@keyframes kale-works-reveal{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes kale-works-shimmer{to{background-position:-220% 0}}
@media(prefers-reduced-motion:reduce){.kale-works-media,.kale-works-media__content,.kale-works-media__play,.kale-works-media__skeleton,.kale-works-record-skeleton{animation:none;transition:none}}
