/* ChatBase — 🏛️ Hall of Fame + 📖 Yearbook (showcase.js) */
.sc-modal { position: fixed; inset: 0; z-index: 99970; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.6); backdrop-filter: blur(5px); padding: 18px; animation: decreeFade .25s ease; }
.sc-box { position: relative; width: min(620px, 100%); max-height: 86vh; overflow-y: auto; background: var(--neo-surface, #15151f); border: 1px solid rgba(255,255,255,.12); border-radius: 18px; padding: 24px; color: var(--neo-text, #fff); box-shadow: 0 24px 70px rgba(0,0,0,.6); }
.sc-box h2 { margin: 0 0 4px; font-size: 22px; }
.sc-sub { margin: 0 0 16px; color: var(--neo-dim, rgba(235,235,245,.6)); font-size: 13px; }
.sc-h3 { margin: 18px 0 10px; font-size: 14px; }
.sc-x { position: absolute; right: 16px; top: 16px; background: rgba(255,255,255,.1); border: none; color: inherit; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 14px; }
.sc-empty { color: var(--neo-dim, rgba(235,235,245,.55)); }

.sc-hof { display: flex; flex-direction: column; gap: 12px; }
.sc-fame { margin: 0; background: linear-gradient(135deg, rgba(255,209,102,.1), rgba(255,140,67,.08)); border: 1px solid rgba(255,209,102,.3); border-radius: 14px; padding: 14px 16px; }
.sc-fame blockquote { margin: 0 0 6px; font-size: 15px; font-style: italic; }
.sc-fame figcaption { font-size: 12.5px; color: var(--neo-dim, rgba(235,235,245,.7)); text-align: right; }

.sc-sups { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.sc-sup { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; padding: 12px; text-align: center; }
.sc-sup span { font-size: 26px; display: block; }
.sc-sup b { display: block; font-size: 14px; margin: 3px 0; }
.sc-sup small { font-size: 11px; color: var(--neo-dim, rgba(235,235,245,.6)); }

.sc-yb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
.sc-yb-card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 10px; text-align: center; }
.sc-yb-face { font-size: 30px; width: 44px; height: 44px; margin: 0 auto 6px; display: flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; background: rgba(255,255,255,.06); }
.sc-yb-face img { width: 100%; height: 100%; object-fit: cover; }
.sc-yb-card b { display: block; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-yb-card small { font-size: 10px; color: var(--neo-dim, rgba(235,235,245,.6)); }