
/* Interfaz visual original · octubre 2026 */
.component-icon{display:inline-block;width:26px;height:26px;flex:none;color:var(--gold);vertical-align:middle}
.component-icon .glass,.strategy-art .glass,.hero-ship .glass,.hero-escort .glass{fill:currentColor;fill-opacity:.65}
.component-icon .detail,.strategy-art .detail{fill:none;stroke-width:2.4}
.component-icon .engine,.hero-ship .engine,.hero-escort .engine{stroke:#79e3dd;stroke-width:3}
.fleet-hero{position:relative;width:180px;height:110px;margin:6px 0 28px}
.hero-ship{position:absolute;width:105px;height:105px;left:25px;top:0;transform:rotate(23deg);filter:drop-shadow(0 0 20px #ddae6a40)}
.hero-escort{position:absolute;width:48px;height:48px;right:0;bottom:3px;transform:rotate(23deg);color:var(--teal)}
.intro>button{margin:5px 5px 0 0}
.galaxy{padding:14px;background:linear-gradient(145deg,#132339,#0b1629)}
.galaxy-head{padding:9px 9px 4px}.galaxy-head h2{margin:4px 0}
.map-hint{font-size:.74rem;color:var(--dim);margin:5px 9px 10px}
.map-tools{display:flex;align-items:center;gap:5px;flex:none}
.map-tools button,.selection-strip button{background:#15283d;border:1px solid #365372;border-radius:8px;color:#d9e7fa;padding:6px 9px;font-size:.76rem}
.map-tools span{font-size:.69rem;color:var(--dim);min-width:35px;text-align:center}
.map-tools button:focus-visible,.hex:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.selection-strip{display:flex;gap:10px;flex-wrap:wrap;padding:9px 10px;border:1px solid #294158;border-radius:9px;margin:5px 4px 11px;font-size:.69rem;color:#a8bed6}
.selection-strip>span{display:flex;align-items:center;gap:5px;flex:1;min-width:180px}
.selection-strip button{padding:2px 7px}
.origin-dot{background:#5ee4da}.destination-dot{background:#ffc878}
.map-scroll{max-height:640px;background:#081226;scrollbar-color:#425c77 #0b1426;scrollbar-width:thin}
.map-canvas{min-width:300px}.galaxy .map{min-height:0;max-height:none;width:100%;height:auto}
.hex polygon.main{fill:#101d33;stroke:#39506a;stroke-width:1.4}
.hex.is-home polygon.main{fill:#17283b}.hex.is-core polygon.main{fill:#242738;stroke:#d7b570}
.hex:hover polygon.main,.hex.inspected polygon.main{fill:#1d3046;stroke:#b0e4df;stroke-width:2.8}
.hex .owner-border{stroke-width:2;opacity:.65}
.hex.selected-from polygon.main{stroke:#5ee4da;stroke-width:4}
.hex.selected-to polygon.main{stroke:#ffc878;stroke-width:4}
.hex .hex-label{font-size:10px;font-weight:700;fill:#e4ecf7}
.hex .hex-meta{font-size:8px;fill:#9aafc8}.map-resource{fill:#e5c083}.map-influence{fill:#bca4e7}
.hex .hex-ships{font-size:8.5px;fill:#b9c9df}
.fleet-count{font-size:9px;fill:#f7ddad;text-anchor:start;font-weight:800;pointer-events:none}
.fleet-more{font-size:8px;fill:#f7ddad;text-anchor:start;pointer-events:none}
.hex-mini-tag{font-size:5px;fill:#94a9c1;text-anchor:middle;letter-spacing:.5px;pointer-events:none}
.system-star{fill:#bdd9eb;opacity:.55}
.planet-art{pointer-events:none}
.map-footer{padding:10px 8px 12px;gap:12px;font-size:.65rem}
.map-legend{padding:13px 8px;border-top-color:#263b50}
.map-legend>b{font-size:.77rem;color:#cfdeed}
.unit-legend-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px}
.unit-legend-items>span{display:flex;gap:7px;align-items:center;font-size:.7rem;line-height:1.35}
.unit-legend-items>span>.component-icon{width:26px;height:26px}
.map-legend p{font-size:.65rem;margin-top:12px}
.player-card{background:linear-gradient(155deg,#19283c,#101c30);border-color:#2c3e56}
.player-card.isturn{box-shadow:inset 0 0 28px #66d5c911,0 0 17px #66d5c90b}
.player-nums{gap:9px;margin-top:11px}.metric{display:grid;grid-template-columns:1fr;justify-items:start;gap:2px;font-size:.62rem}
.metric .component-icon{width:17px;height:17px;color:#9bb3ca}.metric b{font-size:1.02rem}
.tabs{gap:3px;padding:4px}.tabs button{font-size:.71rem;padding:9px 8px;flex:none}
.unit-control{display:grid;justify-items:center;gap:7px;align-content:start;padding:10px 5px 6px;border:1px solid #2b405b;background:linear-gradient(145deg,#18283c,#0e1b30);border-radius:10px}
.unit-control .component-icon{width:34px;height:34px;color:#c9d8e9}
.unit-control span{font-size:.67rem;min-height:25px;line-height:1.2;display:flex;align-items:center}
.unit-control input{background:#0c1728;border-color:#334a64;padding:7px 3px}
.mini-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.strategy-card{position:relative;overflow:hidden;min-height:122px;padding:15px 12px;border-color:#364962;border-top:3px solid var(--strategy-color,#e4b968);background:linear-gradient(145deg,#20324b,#101d32)}
.strategy-card .strategy-art{position:absolute;bottom:8px;right:7px;width:50px;height:50px;color:var(--strategy-color);opacity:.12;pointer-events:none}
.strategy-num{font-size:1.3rem;color:var(--strategy-color);line-height:1.2}
.strategy-desc{display:block;font-size:.71rem;margin-top:5px;padding-bottom:10px}
.strategy-name{display:block;font-size:.84rem}
.system-inspector h2{font-size:1.35rem;line-height:1.2;margin-bottom:6px}
.world-profile{display:flex;align-items:center;gap:3px;margin:14px 0 17px}
.world-profile>div{min-width:0}.world-profile p{margin-bottom:10px}
.world-portrait{width:115px;height:105px;flex:none}
.world-stats{display:flex;flex-wrap:wrap;gap:9px;font-size:.69rem}
.world-stats>span{display:flex;align-items:center;gap:4px}
.world-stats .component-icon{width:17px;height:17px}
.resource-stat{color:#dec18c}.influence-stat{color:#bca4e7}.influence-stat .component-icon{color:#bca4e7}
.planet-state{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.planet-state .pill-label{font-size:.61rem;padding:4px 7px}
.fleet-group{border:1px solid #2f435d;border-left:3px solid var(--faction-color);padding:12px;border-radius:11px;margin:10px 0;background:#0c1a2c}
.fleet-owner{display:flex;align-items:center;gap:6px;font-size:.73rem;margin-bottom:11px;flex-wrap:wrap}
.fleet-owner .dot{background:var(--faction-color);width:7px;height:7px}
.fleet-owner>span{color:var(--dim);font-size:.62rem}
.unit-inventory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px}
.unit-tile{display:flex;align-items:center;gap:8px;min-width:0}
.unit-tile>.component-icon{width:34px;height:34px;color:#aec4dc}
.unit-tile>div{display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:center}
.unit-tile strong{font-size:1.07rem;color:#f1dab0}.unit-tile span{font-size:.69rem;color:#cfdbed}
.unit-tile small{grid-column:2;color:#788eaa;font-size:.57rem}
.structure-row{display:flex;flex-direction:column;gap:7px;margin:14px 0;font-size:.72rem;color:#a9bdd2}
.structure-row>span{display:flex;align-items:center;gap:8px}.structure-row .component-icon{width:21px;height:21px;color:#91abc9}
.inspector-actions{display:flex;gap:8px;margin-top:18px}.inspector-actions .btn{flex:1;font-size:.67rem}
.empty-system{display:flex;align-items:center;gap:12px;padding:20px 12px;border:1px dashed #3c526a;border-radius:12px;font-size:.75rem;color:var(--dim)}
.empty-system .component-icon{color:#93acc9}
.showcase-units{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:20px 0}
.showcase-units article{background:linear-gradient(145deg,#20324b,#0c1729);border:1px solid #36506b;border-radius:12px;padding:14px 6px;text-align:center;display:flex;align-items:center;flex-direction:column;gap:7px}
.showcase-units .component-icon{width:44px;height:44px}
.showcase-units strong{font-size:.65rem;color:#d9e4f2}.showcase-units small{font-size:.6rem;color:var(--dim)}
.strategy-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}
.strategy-showcase article{display:flex;align-items:center;gap:8px;border:1px solid #2f415b;border-left:2px solid var(--strategy-color);padding:9px;border-radius:8px}
.strategy-showcase .strategy-art{width:24px;height:24px;flex:none;color:var(--strategy-color)}
.strategy-showcase span{font-size:.67rem}
@media(min-width:1600px){.wrap{max-width:1710px}.game-grid{grid-template-columns:minmax(0,1.65fr) minmax(400px,.85fr)}.map-scroll{max-height:760px}}
@media(max-width:1050px){.game-grid{grid-template-columns:minmax(0,1fr)}.map-scroll{max-height:600px}.system-inspector .unit-inventory{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.galaxy-head{align-items:flex-start}.galaxy-head h2{font-size:1rem}.map-tools{gap:3px}.map-tools button{padding:5px 7px}.map-tools span{min-width:31px}.galaxy{padding:9px}.world-portrait{width:96px}.system-inspector .unit-inventory{grid-template-columns:repeat(2,minmax(0,1fr))}.unit-legend-items{grid-template-columns:repeat(2,minmax(0,1fr))}.selection-strip>span{min-width:100%;font-size:.63rem}.map-canvas{min-width:0}.map-scroll{max-height:430px}.sidepanel{padding:15px}.fleet-hero{height:75px;width:140px}.hero-ship{height:75px;width:75px}.hero-escort{width:36px;height:36px}.metric{font-size:.58rem}.metric .component-icon{display:none}.player-nums{gap:4px}.player-card{padding:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}


.tech-art{width:24px;height:24px;color:#9bb4cc}.tech-blue .tech-art{color:#60a5fa}.tech-green .tech-art{color:#65cc99}.tech-yellow .tech-art{color:#ecc979}.tech-red .tech-art{color:#ff7b83}

.map-canvas.map-fit{max-width:680px;margin:0 auto}.planet-art .glass{fill-opacity:.7}

@media(max-width:720px){.players-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.player-nums{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.metric{min-width:0;align-content:start}.metric-name{font-size:0}.metric-name::after{content:attr(data-short);font-size:.54rem}.metric b{font-size:.85rem}.player-faction{font-size:.64rem}.player-faction .faction-icon{width:21px;height:21px}}

/* Referencia completa, sin truncar textos de reglas. */
.technology-description{font-size:13px;line-height:1.6;color:#d7e1ef;margin:10px 0 0;font-weight:400;white-space:normal;overflow-wrap:anywhere}
.tech-chip{min-width:0;align-items:flex-start}.tech-chip b{overflow-wrap:anywhere}
.strategy-rules{padding:12px 0 2px;line-height:1.6;font-size:13px;text-align:left;color:#d7e1ef}
.strategy-rules h4{margin:5px 0;color:#f0c56a;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.strategy-rules p{margin:4px 0 14px}.strategy-rule-card{margin:14px 0;padding:16px;border:1px solid #283a52;border-left:3px solid var(--strategy-color);border-radius:12px;background:#111d2d}
.strategy-rule-card header{display:flex;align-items:center;gap:12px}.strategy-rule-card header h3{margin:0 0 4px}.strategy-rule-card header small{color:#8eabc8}
.strategy-choice{min-width:0;border:1px solid #283a52;border-radius:12px;padding:10px}.strategy-choice .strategy-card{width:100%}.strategy-reference>h3{margin-top:16px}
.catalog-tech>label{margin-bottom:20px}.strategy-reference .strategy-art{width:42px;height:42px;flex:none}
@media(max-width:600px){.strategy-grid,.tech-grid{grid-template-columns:1fr}.strategy-rules{font-size:14px}.tabs{flex-wrap:wrap}.strategy-rule-card{padding:12px}}
