/* Tarjetas de piloto y nave (hangar del piloto en /rateo/piloto.php y actores del plató en /flota/plato.php).
   Tokens y componentes base en /tools/theme.css. */
.rs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .8rem; margin: .8rem 0 0; }
.rs-grid--mini { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .55rem; }
.rs-card { position: relative; display: grid; grid-template-rows: auto 1fr auto; gap: .5rem; padding: .8rem .85rem .75rem; min-width: 0;
  background: var(--c-bg-2); border: 1px solid var(--c-line-2); border-radius: var(--r); text-align: left; color: var(--c-text); cursor: pointer; }
.rs-card:hover { border-color: var(--c-red); }
.rs-card:focus-visible { outline: 2px solid var(--c-red); outline-offset: 2px; }
.rs-card.is-on { border-color: #FFC400; box-shadow: 0 0 0 1px #FFC400 inset; }
.rs-card.is-on::after { content: "ELEGIDA"; position: absolute; right: .6rem; top: .55rem; font: 700 .58rem/1 var(--f-mono); letter-spacing: .14em; color: #FFC400; }
.rs-card.is-muted { opacity: .55; cursor: default; }
.rs-card--static { cursor: default; }
.rs-card--static:hover { border-color: var(--c-line-2); }
.rs-head { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.rs-port { width: 44px; height: 44px; border-radius: var(--r-sm); flex: 0 0 auto; background: var(--c-bg); }
.rs-ship { width: 72px; height: 72px; flex: 0 0 auto; border-radius: 50%; background: radial-gradient(circle at 50% 40%, rgba(163,77,240,.22), rgba(5,6,10,.9) 70%); object-fit: contain; }
.rs-grid--mini .rs-ship { width: 52px; height: 52px; }
.rs-name { font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.rs-sub { font: 400 .78rem/1.3 var(--f-sans); color: var(--c-muted); overflow-wrap: anywhere; }
.rs-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.rs-chip { display: inline-block; font: 700 .58rem/1 var(--f-mono); letter-spacing: .12em; padding: .22rem .4rem; border-radius: 3px; border: 1px solid var(--c-line-2); color: var(--c-muted); text-transform: uppercase; }
.rs-chip--doctrina { border-color: var(--c-red-txt); color: var(--c-red-txt); }
.rs-chip--eve { border-color: #74D4F0; color: #74D4F0; }
.rs-chip--logi { border-color: #3DE0B0; color: #3DE0B0; }
.rs-chip--dps { border-color: #A34DF0; color: #C78BFF; }
.rs-chip--oficial { border-color: var(--c-warn); color: var(--c-warn); }
.rs-chip--staff { border-color: var(--c-red-txt); color: var(--c-red-txt); }
.rs-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .3rem; font: 600 .72rem/1.2 var(--f-mono); color: var(--c-muted); }
.rs-stats span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-stats b { display: block; font-size: .95rem; color: var(--c-text); font-variant-numeric: tabular-nums; }
.rs-grid--mini .rs-stats { font-size: .64rem; gap: .2rem; }
.rs-grid--mini .rs-stats b { font-size: .8rem; }
.rs-stats .is-ok { color: var(--c-ok); } .rs-stats .is-bad { color: var(--c-bad); }
.rs-bar { height: 8px; border-radius: 4px; background: var(--c-bg); border: 1px solid var(--c-line-2); overflow: hidden; }
.rs-bar i { display: block; height: 100%; background: var(--c-ok); }
.rs-actions { display: flex; gap: .4rem; align-items: center; justify-content: space-between; }
.rs-n { display: inline-flex; align-items: center; gap: .2rem; font: 700 .9rem/1 var(--f-mono); }
.rs-n button { width: 32px; height: 32px; border: 1px solid var(--c-line-2); border-radius: var(--r-sm); background: var(--c-card-2); color: var(--c-text); font: 700 1rem/1 var(--f-mono); cursor: pointer; }
.rs-n button:hover { background: var(--c-red); color: #fff; }
.rs-empty { padding: .8rem; border: 1px dashed var(--c-line-2); border-radius: var(--r-sm); color: var(--c-muted); }
.rs-big { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; padding: 1rem; border: 1px solid #FFC400; border-radius: var(--r); background: var(--c-bg-2); }
.rs-big .rs-ship { width: 110px; height: 110px; }
.rs-big .rs-name { font-size: 1.15rem; }
.rs-big .rs-stats { grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); margin-top: .5rem; }
@media (max-width: 560px) { .rs-big { grid-template-columns: 1fr; } .rs-big .rs-ship { width: 80px; height: 80px; } }
