/* Only production account controls; the approved prototype CSS stays intact. */
.shell { overflow: clip; }
.account .panel-link { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 21px; border-radius: 10px; font-size: 13px; white-space: nowrap; }
.account [hidden] { display: none; }
.account .login { white-space: nowrap; }
.auth-view [aria-busy="true"] { cursor: wait; }
@media (max-width:1200px) { .account .panel-link { padding-inline:16px; } }
@media (max-width:600px) { .account .panel-link { min-height:40px; padding:9px 12px; font-size:11px; border-radius:8px; } }
@media (max-width:380px) { .account .panel-link { padding-inline:9px; } }

/* OAuth article content and reusable compact screenshots. */
.article-screenshot { width: min(100%, 420px); margin: 26px auto; }
.article-paper figure.article-screenshot { margin-inline: auto; }
.article-screenshot .screenshot-button { display: block; width: 100%; }
.article-screenshot img { display: block; width: 100%; height: auto; }
.oauth-article h3 { margin: 28px 0 12px; font-size: 20px; line-height: 1.4; }
.oauth-article li { margin-block: 9px; }
.oauth-article ul, .oauth-article ol { padding-left: 24px; }
.oauth-article a:not(.article-next) { color: #216759; text-decoration: underline; text-underline-offset: 3px; }
.oauth-article code { overflow-wrap: anywhere; font-size: .9em; }
.oauth-article .screenshot-hint { font-size: 13px; color: #526b77; }
@media (max-width:600px) {
  .oauth-article h3 { font-size: 18px; }
  .oauth-article li { font-size: 13px; }
}
.image-dialog p a { color: var(--mint); text-underline-offset: 3px; }