/* workspace/starcode/css/cosmos-credits.css */
/* SC-CREDITS: the Credits screen, opened from Options > About > Credits
   (js/credits-screen.js, #creditsOverlay in index.html). A dimmed backdrop
   over everything, a scrolling column of sections in the middle, a close
   control at the top right. Sits above the Options sheet (z-index 210). */
.credits-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 300; background: rgba(2, 4, 10, 0.92); overflow-y: auto;
  -webkit-overflow-scrolling: touch; padding: 56px 16px 48px; }
.credits-overlay[hidden] { display: none; }
.credits-close { position: fixed; top: 14px; right: 14px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(226, 232, 240, 0.28);
  background: rgba(8, 12, 24, 0.7); color: rgba(226, 232, 240, 0.86); font: 22px/1 var(--font-body); cursor: pointer; }
.credits-close:hover, .credits-close:focus-visible { border-color: rgba(245, 158, 11, 0.7); color: #fff; outline: none; }
.credits-body { max-width: 560px; margin: 0 auto; color: var(--text-primary); text-align: center; }
.credits-title { font: 700 30px/1.2 var(--font-body); letter-spacing: 0.3em; text-transform: uppercase; margin: 0 0 8px; }
.credits-tagline { font: 14px/1.5 var(--font-body); color: rgba(148, 163, 184, 0.9); margin: 0 0 32px; }
.credits-section { margin: 0 0 30px; }
.credits-heading { font: 600 12px/1 var(--font-body); letter-spacing: 0.28em; text-transform: uppercase; color: rgba(245, 158, 11, 0.85); margin: 0 0 12px; }
.credits-row { display: flex; justify-content: center; gap: 14px; padding: 4px 0; font: 15px/1.4 var(--font-body); }
.credits-role { flex: 1 1 0; text-align: right; color: rgba(148, 163, 184, 0.9); }
.credits-name { flex: 1 1 0; text-align: left; color: #fff; }
.credits-row .credits-role:empty + .credits-name { text-align: center; flex: 0 0 auto; }
.credits-footer { font: 12px/1.5 var(--font-data); color: rgba(148, 163, 184, 0.7); margin: 24px 0 0; }