#open-learning {
  width: min(520px, calc(100% - 32px)); max-width: none; padding: 0;
  border: 0; background: transparent; overflow: visible; color: #173b3b;
}
#open-learning::backdrop { background: rgba(13, 39, 43, .48); }
.open-learning-card {
  position: relative; z-index: 2; text-align: center; padding: 38px 30px 32px;
  border-radius: 24px; border: 1px solid #fff; max-height: 88vh; overflow-y: auto;
  background: radial-gradient(ellipse at top left, #d9f6ea, transparent 62%), #fffef9;
  box-shadow: 0 24px 80px #0b282c55;
}
.open-learning-close {
  position: absolute; right: 12px; top: 10px; width: 44px; height: 44px;
  border: 0; background: transparent; color: #446662; font-size: 28px; cursor: pointer;
}
.open-learning-icon { font-size: 44px; line-height: 1.2; margin-bottom: 16px; }
.open-learning-eyebrow { font-size: 12px; color: #50746d; margin: 0 0 14px; letter-spacing: .02em; }
#open-learning-title { font-size: clamp(28px, 6vw, 38px); font-weight: 750; line-height: 1.12; margin: 0 0 20px; color: #164e46; }
#open-learning-copy { font-size: 16px; line-height: 1.7; color: #526963; margin: 0; }
#open-learning-copy strong { color: #205e50; font-weight: 600; }
.open-learning-wish { color: #247c62; margin: 18px 0 22px; font-size: 18px; }
.open-learning-button {
  background: #176d56; color: white; border: 0; border-radius: 100px;
  margin-top: 24px; padding: 12px 28px; min-height: 46px; font-weight: 600; font-size: 16px; cursor: pointer;
}
.open-learning-button:hover { background: #115741; }
.open-learning-share {
  display: block; margin: 12px auto 0; padding: 10px 18px; min-height: 44px;
  border: 1px solid #adcfc2; border-radius: 100px; background: transparent;
  color: #176d56; font-size: 15px; cursor: pointer;
}
.open-learning-share-options { margin-top: 16px; }
.open-learning-share-options a, .open-learning-share-options button {
  display: inline-block; padding: 10px 14px; min-height: 44px; border: 0;
  border-radius: 8px; background: #e6f3ec; color: #176d56; cursor: pointer;
}
.open-learning-share-options p, .open-learning-share-status {
  font-size: 13px; color: #526963; margin: 12px 0 0;
}
.open-learning-share-status:empty { display: none; }
.open-learning-share-options textarea { width: 100%; margin-top: 8px; padding: 8px; }
.open-learning-share:focus-visible, .open-learning-share-options :focus-visible { outline: 3px solid #d6a541; outline-offset: 3px; }
.open-learning-button:focus-visible, .open-learning-close:focus-visible { outline: 3px solid #d6a541; outline-offset: 4px; }
.open-learning-glitter { position: fixed; inset: 0; width: 100vw; height: 100vh; overflow: hidden; pointer-events: none; z-index: 1; }
.open-learning-glitter i {
  position: absolute; top: -24px; width: var(--size); height: var(--size);
  background: var(--color); box-shadow: 0 0 6px var(--color); opacity: 0;
  animation: open-learning-fall var(--duration) var(--delay) linear infinite both;
}
@keyframes open-learning-fall {
  0% { opacity: 0; transform: translate3d(0, -20px, 0) rotate(0); }
  8%, 75% { opacity: .9; }
  100% { opacity: 0; transform: translate3d(var(--drift), 110vh, 0) rotate(540deg); }
}
@media (max-width: 420px) { .open-learning-card { padding: 32px 18px 26px; } }
@media (prefers-reduced-motion: reduce) { .open-learning-glitter { display: none; } }
