/* ── v13 FLIGHT DECK ───────────────────────────────────────────────────────── La direccion B del rediseño de septiembre 2026, elegida por el dueno el 12-sep sobre el board de referencias: el aro de Leagues se vuelve la identidad entera, el producto como un chequeo de signos vitales de tus equipos. Roba de WHOOP (aro + numero + lista corta), Wealthsimple (mini-tarjetas de tendencia) y Linear (grano sutil, cero degradado). MECANICA (del inventario de la Fase 0): v13 NO es hermano de v12, es una CAPA encima. : toda la base v11+v12 sigue aplicando y este archivo, cargado EL ULTIMO (despues de home.css), solo redefine los tokens y lo poco estructural que la direccion pide. Revertir es quitar la clase v13. Preview: ?v13 (esmeralda) o ?v13=cyan, ver index.html. El morado muere aqui por decision del dueno (12-sep). Los semanticos green/red/yellow NO cambian: son color-que-significa, no vestido. */ /* La tipografia de la direccion: General Sans (Fontshare, ITF Free Font License), grotesco humanista mas calido que Familjen. Autohospedada como el resto de las fuentes del sitio. Los @font-face viven aqui y no en index.html a proposito: mientras v13 sea preview, nadie mas paga los KB. */ @font-face{font-family:'General Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/general-sans-regular.woff2) format('woff2')} @font-face{font-family:'General Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/general-sans-medium.woff2) format('woff2')} @font-face{font-family:'General Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/general-sans-semibold.woff2) format('woff2')} @font-face{font-family:'General Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/general-sans-bold.woff2) format('woff2')} html.v13{ /* Grafito CALIDO: la familia de grises lleva un sesgo marron deliberado (el "no negro puro" deja de ser cumplimiento tecnico y pasa a ser expresion). Nada de tinte violeta: el acento es el unico color de una pantalla que no es dato. */ --bg:#171614; --surface:#1e1d1a; --surface2:#262420; --surface3:#302e28; --border:rgba(236,231,220,.09); --border2:rgba(236,231,220,.16); --text:#f0ede5; --muted:#98948a; --muted2:#c7c2b6; /* Acento CIAN PROFUNDO, elegido por el dueno el 12-sep sobre la comparativa en vivo (gano a la esmeralda: el cian deja el semaforo verde/ambar/rojo completamente solo, nada que no sea dato lleva su color). Un solo acento, plano, nunca en degradado. Los -rgb alimentan los ~150 tintes rgba(var(--accent-rgb),...) del sitio. */ --accent:#2492ad; --accent-bright:#3db8d4; --accent-btn:#1f8aa5; --accent-dim:rgba(61,184,212,.13); --accent-rgb:61,184,212; --accent-deep-rgb:36,146,173; --accent-btn-rgb:31,138,165; --font-head:"General Sans","Familjen Grotesk",system-ui,sans-serif; --font-body:"General Sans","Familjen Grotesk",system-ui,sans-serif; } /* La variante esmeralda que compitio en el preview murio aqui el 12-sep, cuando el dueno eligio cian. Si algun dia se quiere comparar otro acento, el patron es una clase encima (html.v13.v13-X) con los siete tokens. */ /* El grano de Linear: textura sutil en el fondo en vez de cualquier degradado. Un SVG de turbulencia diminuto, repetido, al 3%: se siente mas de lo que se ve. Sobre el color de fondo, nunca en su lugar. */ html.v13 body{ background-color:var(--bg); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); } /* El casi-blanco puro de v11 (--text #ffffff) muere con el vestido: sobre grafito calido, el marfil de --text ya viene del bloque de tokens. Aqui solo lo estructural minimo que la direccion pide y que un token no puede: los titulares en el peso 600 ya lo pone v11; General Sans es mas ancha que Familjen, asi que el tracking apretado de v11 se relaja UN punto para que los titulares no se toquen. */ html.v13 h1, html.v13 h2, html.v13 h3{letter-spacing:-.018em} /* La firma de 2px del producto (la verdict-card del analizador, la tarjeta de jugador, la recomendacion de Mac en el draft y el separador de tier) venia de un degradado morado -> cian. El morado murio el 12-sep y la direccion prohibe el degradado decorativo: la firma pasa a ser el acento PLANO. Un token, los cinco sitios. */ html.v13{--tm-grad:var(--accent)} /* ═══ FASE 2 · FLIGHT DECK: las listas dejan de ser rejillas de tarjetas ══════ Estas reglas viven aqui y no en styles.css a proposito: pisan a theme.css, que carga despues de styles.css. Lo nuevo de cero (clases .bs-*) va en styles.css como manda el repo; lo que RE-DEFINE algo existente, aqui. Buy/Sell pintaba veinte tarjetas identicas, cada una con su fondo, su borde redondeado y un filo cian de 2px a la izquierda: veinte acentos en una pantalla que solo deberia llevar uno. Y cada fila decia "Rising fast" donde iba un numero. Regla de Sleeper: una lista son filas densas, y el color saturado solo donde significa algo (aqui, el signo del movimiento). */ html.v13 .bs-row{ background:transparent; border:0; border-bottom:1px solid var(--border); border-radius:0; padding:9px 2px; margin-bottom:0; } html.v13 .bs-row::before{display:none} /* el filo cian por fila */ html.v13 .bs-row:hover{background:var(--surface2);border-color:var(--border2)} html.v13 .bs-row:last-child{border-bottom:0} /* El hub: diez tarjetas identicas en una columna de 1.550px, cada una con un numero, un nombre y una cifra, o sea 1.100px de vacio por fila. Es la misma enfermedad de Leagues. Filas densas, y medida de documento para la pantalla entera: un listado a todo lo ancho de un monitor no se lee, se barre. */ html.v13 #screen-hub{max-width:840px} html.v13 .hb-rank{gap:0} html.v13 .hb-row{ border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; box-shadow:none; padding:10px 4px; } html.v13 .hb-row:last-child{border-bottom:0} /* Tu equipo se marca con un filo, no pintando la fila entera del acento: el acento es de interaccion y una fila de lista no es un boton. */ html.v13 .hb-row.is-mine{ background:var(--surface2); border-color:var(--border2); box-shadow:inset 2px 0 0 var(--accent); border-radius:8px; padding-left:12px; } /* ═══ BLOQUEANTE 5 (juez, 12-sep): el footer se despega en paginas cortas ════ Medido: 137px de vacio bajo el footer en /research, 204 en /hub y 306 en /sage a 1280 y 1440. Como el fondo de despues del footer es otro, el hueco se VE, y se lee como que la pagina se acabo antes de tiempo. Patron de footer pegajoso, sin envoltorio nuevo: el pasa a columna flex y el