/* Mi Ruta B 9: Ruti, rachas y accesorios. CSS aislado para no afectar otras pantallas. */
.ruti-home-card,.ruti-showroom,.ruti-evolution,.ruti-wardrobe-group{min-width:0;box-sizing:border-box}
.ruti-home-card{display:flex;align-items:center;gap:18px;border:1px solid #dce7f4;border-radius:18px;background:linear-gradient(125deg,#eff6ff,#fff 82%);padding:12px 22px;margin:17px 0 12px}
.ruti-home-art{flex:0 0 170px;max-width:170px}.ruti-car{display:block;width:100%;height:auto;max-width:390px;overflow:visible;filter:drop-shadow(0 6px 6px rgba(32,64,107,.08))}.ruti-home-art .ruti-car{width:165px;max-width:100%}
.ruti-overline{font-size:10px;font-weight:830;letter-spacing:1.5px;color:#426eae;display:block;margin-bottom:7px}
.ruti-home-copy{min-width:0;flex:1}.ruti-home-copy h2{font-size:19px;letter-spacing:-.55px;color:#203858;margin:0 0 6px}.ruti-home-copy p{font-size:12px;line-height:1.6;color:#536e8e;margin:0 0 11px}.ruti-home-copy .btn{display:inline-flex!important;width:auto;align-items:center;gap:7px;min-width:0}
.home-view>.ruti-home-card{grid-column:1/-1;grid-row:6}.home-view>.section-head{grid-row:7}.home-view>.tile-grid{grid-row:8}.home-view>.space16{grid-row:9}.home-view>.status-note{grid-row:10}
.ruti-showroom{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:25px;border:1px solid #e0e8f4;background:#fff;border-radius:22px;padding:20px 24px;margin-top:15px;box-shadow:0 8px 27px #18395b09}
.ruti-showcase{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:14px;border-radius:17px;background:radial-gradient(circle at 50% 45%,#e2f0ff 0,#edf5ff 45%,#f5f8ff 100%);min-height:235px}.ruti-scene{width:100%;max-width:390px}.ruti-stage-pill{display:block;border:1px solid #c9daf3;border-radius:99px;padding:6px 11px;background:#fff;color:#3866a0;font-size:11px;font-weight:800}
.ruti-details{min-width:0;padding:13px 3px}.ruti-details h2{font-size:24px;letter-spacing:-.7px;line-height:1.2;color:#193758;margin:0 0 10px}.ruti-details>p:not(.ruti-note){font-size:13px;color:#667d97;line-height:1.6;margin:0 0 16px}
.ruti-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0 19px}.ruti-stats>div{display:flex;flex-direction:column;gap:3px;border:1px solid #e0e9f4;background:#f7faff;border-radius:12px;padding:11px 9px}.ruti-stats strong{font-size:24px;font-weight:830;color:#265c9f}.ruti-stats span{font-size:10px;color:#677f9b;line-height:1.35}
.ruti-progress-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;color:#3b5877;margin:0 0 7px}.ruti-progress-top span{white-space:nowrap;color:#7b8faa}.ruti-progress-track{height:9px;border-radius:99px;background:#e2ebf6;overflow:hidden}.ruti-progress-track span{display:block;background:linear-gradient(90deg,#5e96e8,#2d63ad);border-radius:99px;height:100%;transition:width .25s}
.ruti-note{font-size:11px;color:#7588a0;line-height:1.55;margin:11px 0 15px}.ruti-details .btn{width:auto;max-width:100%}
.ruti-stage-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:23px}
.ruti-evolution{border:1px solid #e0e8f2;background:#fff;border-radius:14px;padding:13px 12px;min-height:125px;display:flex;flex-direction:column;gap:6px}.ruti-evolution.earned{background:linear-gradient(150deg,#eaf4ff,#fff);border-color:#9dc2f1}
.ruti-evolution-index{font-size:10px;font-weight:900;color:#5a80b4;letter-spacing:1.2px}.ruti-evolution strong{font-size:12px;line-height:1.3;color:#234364}.ruti-evolution small{font-size:10px;line-height:1.4;color:#778ba3}.ruti-evolution-status{font-size:9px;font-weight:750;margin-top:auto;color:#7990a9}.ruti-evolution.earned .ruti-evolution-status{color:#32846f}
.ruti-wardrobe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.ruti-wardrobe-group{border:1px solid #e0e8f2;border-radius:18px;background:#fff;padding:16px}.ruti-wardrobe-group h3{font-size:14px;margin:0 0 12px;color:#223f63}.ruti-item-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.ruti-item{min-width:0;min-height:92px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;text-align:left;border:1px solid #dfe7f3;border-radius:12px;background:#f8faff;padding:10px 11px;color:#31506f;cursor:pointer;transition:background .12s,border-color .12s}.ruti-item.equipped{border-color:#4b83c9;background:#edf5ff;box-shadow:0 0 0 1px #5b97d630 inset}.ruti-item:disabled{cursor:not-allowed;opacity:.53;filter:grayscale(.45)}.ruti-item-mark{height:20px;display:flex;align-items:center;font-size:12px;font-weight:850;color:#3165a4}.ruti-item-mark i{display:block;width:19px;height:19px;border-radius:100%;border:2px solid white;box-shadow:0 0 0 1px #9caec5}.ruti-item strong{font-size:11px;line-height:1.3}.ruti-item small{font-size:9px;line-height:1.3;color:#7b8daa}.ruti-footer{border-top:1px solid #e0e8f2;margin-top:20px;padding-top:13px}
@media (min-width:800px) and (max-width:1250px){.ruti-stage-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ruti-showroom{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:17px}}
@media (max-width:799px){.ruti-home-card{gap:12px;padding:14px 13px}.ruti-home-art{flex-basis:107px;max-width:107px}.ruti-home-art .ruti-car{width:107px}.ruti-home-copy h2{font-size:16px}.ruti-home-copy p{font-size:11px}.ruti-home-copy .btn{font-size:11px;padding:10px}.ruti-showroom{grid-template-columns:1fr;gap:8px;padding:12px}.ruti-showcase{min-height:195px}.ruti-scene{max-width:285px}.ruti-details{padding:13px 8px}.ruti-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ruti-wardrobe{grid-template-columns:1fr}.ruti-stats strong{font-size:20px}}
@media (max-width:360px){.ruti-home-art{flex-basis:87px;max-width:87px}.ruti-home-art .ruti-car{width:87px}.ruti-item-grid{gap:7px}.ruti-wardrobe-group{padding:11px}.ruti-evolution{min-height:130px}.ruti-showroom{padding:8px}}
body.dark .ruti-home-card,body.dark .ruti-showcase{background:linear-gradient(130deg,#203954,#243952);border-color:#425b78}body.dark .ruti-showroom,body.dark .ruti-evolution,body.dark .ruti-wardrobe-group{background:#1b2c42;border-color:#3d506e}body.dark .ruti-details h2,body.dark .ruti-home-copy h2,body.dark .ruti-evolution strong,body.dark .ruti-wardrobe-group h3{color:#e2edfb}body.dark .ruti-home-copy p,body.dark .ruti-details>p:not(.ruti-note),body.dark .ruti-note,body.dark .ruti-evolution small{color:#b6c8da}body.dark .ruti-stats>div,body.dark .ruti-item{background:#293e5a;border-color:#455d7b;color:#ecf4ff}body.dark .ruti-stats strong{color:#c0dcff}body.dark .ruti-item.equipped,body.dark .ruti-evolution.earned{background:#294c72;border-color:#76a7e1}body.dark .ruti-stage-pill{background:#253d60;border-color:#6585ac;color:#dbedff}
@media (prefers-reduced-motion:reduce){.ruti-item,.ruti-progress-track span{transition:none}}

@media(max-width:390px){.ruti-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Vista notebook angosta: cada sección mantiene su propia fila; no se montan bloques. */
@media (min-width:800px) and (max-width:940px){
 .home-view>.hero{grid-row:4}
 .home-view>.stat-grid{grid-row:5}
 .home-view>.hero-after{grid-row:6}
 .home-view>.ruti-home-card{grid-row:7}
 .home-view>.section-head{grid-row:8}
 .home-view>.tile-grid{grid-row:9}
 .home-view>.space16{grid-row:10}
 .home-view>.status-note{grid-row:11}
}