/* MKUltra lesson. All rules scoped under .mku-* */
.mku-sc { position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.mku-hero img { width: 280px; max-width: 100%; max-height: 32vh; object-fit: contain; display: block; filter: drop-shadow(0 16px 28px rgba(123,92,253,.3)); }

.mku-react { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 320px; margin: 0 auto; }
.mku-chip { padding: 8px 12px; border-radius: 12px; background: rgba(169,155,255,.14); border: 1px solid rgba(169,155,255,.4); color: var(--ink); font: 600 14px var(--sans); }

.mku-shelf { display: block; width: 100%; max-width: 340px; height: auto; overflow: visible; }
.mku-room { fill: rgba(169,155,255,.07); stroke: rgba(169,155,255,.45); stroke-width: 1.5; }
.mku-box rect { fill: #C9A66B; stroke: #8A6A3A; stroke-width: 1.5; }
.mku-box line { stroke: #8A6A3A; stroke-width: 2; stroke-linecap: round; }
.mku-strips line { stroke: #C9A66B; stroke-width: 2; }
.mku-strips { opacity: 0; }
.mku-lbl { fill: var(--dim); font: 600 13px var(--sans); text-anchor: middle; }
.mku-lbl.mku-fin { fill: var(--gold); font-weight: 700; }
.mku-shelf.mku-shown .mku-keep rect { stroke: var(--gold); stroke-width: 2.5; }

@media (max-height: 700px) {
  .mku-shelf { max-width: 300px; }
  .mku-hero img { max-height: 26vh; }
}