/* /insights/markdown-copies-for-ai/ only: the sticker sheet that peels (hero) and the three
   answers to a .md ask (article). Prefix mdc-. The hero's figures are skaldanalytics.com's own,
   from the 2.35.0 release notes. */

.mdc-peel{border-radius:10px;background:var(--sk-deep);border:1px solid var(--sk-line-2);overflow:hidden}
.mdc-bar{display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap;padding:.6rem .8rem;border-bottom:1px solid var(--sk-line);font:500 .66rem var(--sk-mono);color:var(--sk-text-3)}
.mdc-ctl{padding:.8rem .8rem 0;flex-wrap:wrap}
.mdc-sheet{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:.9rem .8rem .2rem;padding:.6rem;border-radius:6px;background:#e6dfd0;box-shadow:inset 0 0 0 1px #d6ccb9}
.mdc-sheet i{display:block;aspect-ratio:1;border-radius:4px;transition:transform .55s cubic-bezier(.5,-.4,.7,1),opacity .45s;transition-delay:var(--d,0ms);transform-origin:0 0}
.mdc-p,.mdc-sw.mdc-p{background:#2a78d6}
.mdc-m,.mdc-sw.mdc-m{background:#f4a77e}
.mdc-ma,.mdc-sw.mdc-ma{background:#eb6834}
.mdc-o,.mdc-sw.mdc-o{background:#8193a5}
.mdc-sheet .mdc-m,.mdc-sheet .mdc-ma{box-shadow:inset -3px -3px 0 rgba(0,0,0,.12)}
.mdc-peel[data-state="after"] .mdc-sheet .mdc-m,.mdc-peel[data-state="after"] .mdc-sheet .mdc-ma{transform:rotate(-38deg) translate(-12%,-55%) scale(.85);opacity:0}
.mdc-read{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem 1rem;align-items:center;padding:.6rem .8rem .9rem}
.mdc-total{margin:0;display:flex;flex-direction:column}
.mdc-total b{font:800 2rem/1 var(--sk-mono);color:#fff}
.mdc-total span{font:500 .62rem var(--sk-mono);color:var(--sk-text-3)}
.mdc-say{margin:0;font-size:.8rem;line-height:1.45;color:var(--sk-text-2)}
.mdc-key{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin:.3rem 0 0;padding:0;list-style:none;font-size:.72rem;color:var(--sk-text-3)}
.mdc-key li{display:flex;align-items:center;gap:.35rem}
.mdc-sw{display:inline-block;width:.75rem;height:.75rem;border-radius:3px}

/* article: three answers */
.mdc-pick{margin:0 0 1.4rem;padding:1.1rem 1.2rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-ink-3)}
.mdc-pick .seg-wrap{display:flex;flex-wrap:wrap;gap:.3rem}
.mdc-ans p{font-size:1rem}
.mdc-x{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin:0 0 1rem;padding:.7rem .9rem;border-radius:6px;background:#05080b;font:600 .82rem var(--sk-mono)}
.mdc-x span{color:var(--sk-text-2)}
.mdc-x b{padding:.15rem .55rem;border-radius:4px;animation:mdc-in .45s ease-out}
.mdc-ok{background:#1baf7a;color:#05080b}
.mdc-mid{background:#2f4d6b;color:#fff}
.mdc-bad{background:#c84a16;color:#fff}
.mdc-next{padding:.6rem .8rem;border-left:3px solid var(--sk-ai);background:var(--sk-ink-2)}
@keyframes mdc-in{from{transform:translateX(-.8rem);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.mdc-sheet i,.mdc-x b{transition:none;animation:none}}
@media (max-width:480px){.mdc-read{grid-template-columns:1fr}}