/* Fire Emblem Awakening character roster. Builds on planner.css (windows, faces, pills, chips) and classes.css
   (two-column layout, sticky detail, stat table, face links). */
.fech { width: min(1180px, 100% - 32px); margin: 22px auto 0; color: var(--fe-text); --fs: 44px; }
.fech-controls { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.fech-controls .fep-pill { padding: 4px 12px; font-size: .84rem; }

.fech-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 6px; }
.fech-card { display: flex; align-items: center; gap: 8px; padding: 5px 8px 5px 5px; border: 1px solid #3c3330; border-radius: 5px; background: linear-gradient(90deg, #2b2529, #1b181c); color: var(--fe-text); font: inherit; text-align: left; cursor: pointer; }
.fech-card.is-m { border-left: 3px solid rgba(90, 168, 240, .7); }
.fech-card.is-f { border-left: 3px solid rgba(232, 90, 76, .7); }
.fech-card:hover { border-color: var(--fe-gold); }
.fech-card.is-enemy { border-left: 3px solid #7a1f2a; background: linear-gradient(90deg, #3a1d22, #1b181c); }
.fech-card[aria-current] { border-color: var(--fe-blue-hi); box-shadow: 0 0 0 1px var(--fe-blue-hi), 0 0 12px rgba(90, 168, 240, .45); }
.fech-card-text { display: grid; min-width: 0; }
.fech-card-text strong { overflow: hidden; font-family: var(--fe-serif); font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.fech-card-text small { overflow: hidden; color: var(--fe-text-2); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }

.fech-head { display: flex; gap: 14px; align-items: flex-end; margin-bottom: 6px; }
.fech-bust { flex: none; width: 128px; height: 170px; object-fit: contain; object-position: bottom; border-bottom: 1px solid var(--fe-gold-dark); background: radial-gradient(circle at 50% 75%, rgba(90, 168, 240, .28), transparent 65%); }
.fech-detail.is-enemy .fech-bust { background: radial-gradient(circle at 50% 75%, rgba(232, 90, 76, .3), transparent 65%); }
.fech-appears { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.fech-appears li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 6px 10px; border: 1px solid #3c3330; border-left: 3px solid #a3261d; border-radius: 4px; background: #1b181c; font-size: .86rem; }
.fech-appears b { min-width: 86px; color: var(--fe-gold-light); font-family: var(--fe-serif); }
.fech-appears span { flex: 1; }
.fech-appears a.fep-chip { text-decoration: none; }
.fech-detail .fec-link { display: inline-block; margin-top: 4px; text-decoration: none; }
.fech-mods td.is-up { color: #1d5fb0; }
.fech-mods td.is-down { color: #a3261d; }
.fech-note { margin: 6px 0 0; color: var(--fe-text-2); font-size: .82rem; font-style: italic; }
.fep-chips a.fep-chip { text-decoration: none; cursor: pointer; }
.fep-chips a.fep-chip:hover { border-color: var(--fe-gold-light); }
.fech-go { display: inline-block; margin-top: 14px; text-decoration: none; }
.fech-go:hover { border-color: var(--fe-gold); color: var(--fe-gold-light); }

@media (max-width: 560px) {
  .fech-head { align-items: flex-start; }
  .fech-bust { width: 96px; height: 128px; }
}