/* Adrenal Glands lesson. All rules scoped under .adg-* */
.adg-stage { flex: none; width: 100%; max-width: 360px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.adg-gl { display: block; flex: none; width: 100%; aspect-ratio: 320 / 236; height: auto; overflow: visible; touch-action: none; }

.adg-outer { fill: #E8C35A; stroke: #F6DE96; stroke-width: 1.5; transition: fill .6s, filter .6s; }
.adg-core { fill: #8E1F2E; stroke: #C2475A; stroke-width: 1.5; transition: filter .4s; }
.adg-whole { fill: #C98B3A; stroke: #E8B66A; stroke-width: 1.5; }
.adg-face { display: none; }
.adg-gl.adg-s-cut .adg-face { display: inline; }
.adg-lid { transition: translate 1s cubic-bezier(.3,.1,.2,1), opacity 1s; }
.adg-gl.adg-s-cut .adg-lid { translate: 0 -46px; opacity: 0; }

.adg-guide { display: none; stroke: rgba(255,255,255,.55); stroke-width: 2; stroke-dasharray: 6 6; }
.adg-gl.adg-s-knife .adg-guide { display: inline; }
.adg-bladeg { display: none; cursor: grab; }
.adg-gl.adg-s-knife .adg-bladeg { display: inline; }
.adg-handle { fill: #6B4A2E; }
.adg-steel { fill: #D8DEE8; stroke: #FFFFFF; stroke-width: 1; filter: drop-shadow(0 0 4px rgba(255,255,255,.6)); }

/* the labels: plain until the parts can be tapped */
.adg-tag { display: none; }
.adg-gl.adg-s-tags .adg-tag { display: inline; animation: adgIn .4s ease-out backwards; }
@keyframes adgIn { from { opacity: 0; } }
.adg-tag line { stroke: var(--dim); stroke-width: 1.5; }
.adg-tag rect { fill: transparent; stroke: none; transition: fill .3s, stroke .3s; }
.adg-tag text { font: 800 14px var(--sans); fill: var(--text); }
.adg-gl.adg-s-live .adg-tag { cursor: pointer; }
.adg-gl.adg-s-live .adg-tag rect { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.adg-gl .adg-tag.adg-s-right rect { fill: rgba(63,214,154,.18); stroke: var(--mint); }
.adg-gl .adg-tag.adg-s-wrong rect { fill: rgba(255,255,255,.04); stroke: var(--dim); }
.adg-gl .adg-tag.adg-s-wrong text { fill: var(--dim); }

/* states */
.adg-gl.adg-s-zap .adg-core { filter: drop-shadow(0 0 8px rgba(252,192,80,.95)); }
.adg-gl.adg-s-vital .adg-outer { filter: drop-shadow(0 0 9px rgba(246,222,150,.95)); }
.adg-gl.adg-s-fail .adg-outer { fill: #7E7466; filter: none; }

.adg-dn { font: 800 14px var(--sans); }

/* Kennedy */
.adg-photo { flex: none; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.adg-photo img { display: block; height: 220px; width: auto; border-radius: 12px; }
.adg-photo.adg-small img { height: 140px; }
.adg-photo figcaption { font: 700 13px var(--sans); color: var(--dim); }

@media (max-height: 700px) {
  .adg-photo img { height: 170px; }
  .adg-photo.adg-small img { height: 110px; }
}