/* 1.6 partner stars and species mastery. */
.st-stars { display: inline-flex; gap: 2px; vertical-align: middle; }
.st-stars svg { image-rendering: pixelated; }
.ms-rib { vertical-align: middle; image-rendering: pixelated; }
.tile-ms { position: absolute; bottom: 3px; left: 4px; display: inline-flex; gap: 2px; align-items: center; }

.st-block { margin-top: 8px; padding: 8px 10px; border: 2px solid rgba(255,214,64,.3); border-radius: 8px; background: rgba(10,16,40,.45); display: flex; flex-direction: column; gap: 6px; }
.st-row { display: flex; align-items: center; gap: 8px; }
.st-bonus, .st-line { margin: 0; font-size: 12px; }
.st-why { color: var(--muted); font-size: 12px; }
.st-confirm { border: 2px solid #FFD640; border-radius: 8px; padding: 8px; background: rgba(255,214,64,.08); }
.st-confirm p { margin: 0 0 6px; }
.st-confirm .st-warn { color: #ffb38a; font-size: 13px; }
.ms-detail { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 13px; }
.ms-detail .bar { flex-basis: 100%; height: 6px; background: rgba(0,0,0,.4); border-radius: 4px; overflow: hidden; }
.ms-detail .bar i { display: block; height: 100%; background: #FFD640; }

/* Four stars: gold name and portrait stage outline; gold mastery: gold portrait frame everywhere. */
#dex-detail h3.name-gold { color: #FFD640; }
#dex-big.star-gold { outline: 3px solid #FFD640; outline-offset: -3px; }
.pt-portrait.pt-gold { border-color: #FFD640 !important; box-shadow: 0 0 0 1px #141028, 0 0 6px rgba(255,214,64,.6); }

/* Collection → Mastery. */
.mastery { margin-top: 8px; }
.ms-sum { margin: 0 0 4px; }
.ms-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 6px; max-height: calc(100dvh - 260px); overflow: auto; }
.ms-item { display: flex; gap: 8px; align-items: center; background: rgba(10,16,40,.55); border: 2px solid rgba(64,214,255,.2); border-radius: 8px; padding: 6px 8px; }
.ms-item .pt-portrait { width: 32px; height: 32px; }
.ms-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ms-top .sub { margin-left: auto; font-size: 12px; }
.ms-item .bar { height: 6px; background: rgba(0,0,0,.4); border-radius: 4px; overflow: hidden; margin: 3px 0; }
.ms-item .bar i { display: block; height: 100%; background: #FFD640; }
.ms-item small { color: var(--muted); font-size: 11px; }

/* Run summary. */
.oe-mastery, .oe-mastery-new { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 14px; }
.oe-mastery .pt-portrait { width: 24px; height: 24px; }
.oe-mastery-new { color: #FFD640; margin-top: 4px; }
@media (max-width: 480px) { .ms-list { grid-template-columns: 1fr; max-height: none; } }
/* Three collection tabs (Collection, Research, Mastery) wrap on narrow phones instead of widening the window. */
#dex-mode { flex-wrap: wrap; }