/* The stage's amber light and warm wood continue around the portrait. */
.experience.portrait-edition.portrait-stage {
  --portrait-paper: #f0e7d7;
  --portrait-text: #d6c9b7;
  --portrait-gold: #dbb183;
  color: var(--portrait-paper);
  background:
    radial-gradient(ellipse at 16% 30%, #99501e57 0, #99501e0d 43%, transparent 63%),
    radial-gradient(ellipse at 53% 0%, #9b6b3030, transparent 58%),
    linear-gradient(115deg, #2b1d15 0%, #211a14 40%, #161714 79%, #111512 100%);
}
.portrait-stage .section-index {
  color: #c7b393;
  border-color: #dcc29c40;
}
.portrait-stage .portrait-frame {
  background: #271c14;
  box-shadow: 0 28px 75px -38px #0009;
}
.portrait-stage .portrait-frame > img {
  filter: saturate(1.22) contrast(1.035);
}
.portrait-stage .portrait-frame::after {
  inset: 60% 0 0;
  background: linear-gradient(transparent, #1c160ed9);
}
.portrait-stage .portrait-caption {
  color: #cdb99b;
  border-color: #dcc29c40;
}
.portrait-stage .experience-lead h2 { color: var(--portrait-paper); }
.portrait-stage .experience-lead h2 em { color: var(--portrait-gold); }
.portrait-stage .biography > p { color: var(--portrait-text); }
.portrait-stage .biography > p.bio-lead { color: var(--portrait-paper); }
.portrait-stage .certification {
  color: var(--portrait-paper);
  border-color: #dcc29c40;
}
.portrait-stage .dolby-mark i { background: var(--portrait-paper); }
.portrait-stage .certification > div > span { color: #cdb99b; }
.portrait-stage .dolby-verification,
.portrait-stage .direcoes-context summary { color: var(--portrait-paper); }
.portrait-stage .direcoes-context p { color: var(--portrait-text); }
.portrait-stage .direcoes-context a {
  color: var(--portrait-gold);
  border-color: #dbb18370;
}
.portrait-stage .experience-lead .pill {
  background: #d4b186;
  color: #201910;
  border: 1px solid #e0c49e;
}
.portrait-stage .experience-lead .pill:hover {
  background: #e4c9a5;
  color: #17140f;
}
.portrait-stage :is(a, summary):focus-visible {
  outline: 2px solid #f1d4a6;
  outline-offset: 6px;
}
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .portrait-stage .experience-lead h2 {
    background: linear-gradient(112deg, #f0e7d7 15%, #e1c9a5 60%, #c8955d);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
@media (max-width: 700px) {
  .experience.portrait-edition.portrait-stage {
    background:
      radial-gradient(ellipse at 22% 13%, #a45b2557, transparent 42%),
      linear-gradient(165deg, #2b1d15, #1e1913 46%, #111512);
  }
}
@media (prefers-contrast: more), (forced-colors: active) {
  .portrait-stage .experience-lead h2 {
    background: none;
    -webkit-text-fill-color: currentColor;
  }
}
@media (forced-colors: active) {
  .experience.portrait-edition.portrait-stage { background: Canvas; color: CanvasText; }
  .portrait-stage :is(.section-index, .portrait-caption, .experience-lead h2,
    .experience-lead h2 em, .biography > p, .certification, .certification > div > span,
    .dolby-verification, .direcoes-context summary, .direcoes-context p, .direcoes-context a) { color: CanvasText; }
  .portrait-stage .dolby-mark i { background: CanvasText; }
}
@media print {
  .experience.portrait-edition.portrait-stage { background: #fff; color: #222; }
  .portrait-stage :is(.section-index, .portrait-caption, .experience-lead h2,
    .experience-lead h2 em, .biography > p, .certification, .certification > div > span,
    .dolby-verification, .direcoes-context summary, .direcoes-context p, .direcoes-context a) {
    color: #222;
    background: none;
    -webkit-text-fill-color: currentColor;
  }
  .portrait-stage .dolby-mark i { background: #222; }
}
