From c3b51be992de38ee8b20433f73bb9735b9b349f4 Mon Sep 17 00:00:00 2001 From: SITO Date: Mon, 14 Sep 2026 20:38:40 +0200 Subject: [PATCH] La enredadera serpentea entre filas y los brotes cuelgan de un tallo MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit El dibujo del tallo de ordenador pasa a llevar dos filas: la pasada y su espejo. Entra y sale vertical por las dos esquinas, así que empalma consigo mismo por los dos lados y con repeat-y cada dos filas serpentea sin junta. En colectivos, que tiene doce hojas, se veían dos ramas sueltas: la segunda empezaba otra vez desde el margen izquierdo, debajo de la espiral con la que acababa la primera. El fondo va ahora en dos capas porque la última fila remata y las de arriba siguen: .enredadera::before pinta todas menos la última y ::after pinta la última con la espiral, en espejo si la fila es par (lo decide un :has()). Las reglas por hoja pasan de tandas de seis a tandas de doce: las seis del espejo son las mismas del revés y con el giro cambiado de signo. Los tres brotes de REDES llevan su propio tallo, encadenado del agarre a la primera hoja y de hoja en hoja, en vez de salir flotando. Para eso lo que se coloca es la punta del rabillo -translate(-50%,0)- y no el centro de la hoja, que va en vw y no dejaba que el ángulo fuera constante. En ordenador el brote baja a la izquierda y ya no se sale por abajo de la pantalla (se salía en seis de las siete medidas, hasta 41px a 1920x1080). En móvil sale por la izquierda y trepa por el margen en vez de salir a la derecha, donde asoman Eventos y Campañas: de 48 solapes en las nueve pantallas a cero. Banco: 0 fallos y 0 avisos en 150 mediciones. Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_01FRjJnc4j5P7f5gCjkVmNY9 --- README.md | 68 ++++++++++++++- index.css | 253 ++++++++++++++++++++++++++++++++++++++++-------------- 2 files changed, 251 insertions(+), 70 deletions(-) diff --git a/README.md b/README.md index a709582..54416c9 100644 --- a/README.md +++ b/README.md @@ -139,7 +139,7 @@ amplitud, toca también el `--centrar` de las hojas, que vale `AM/100`. Las reglas por hoja son de la forma: ```css -.enredadera > li:nth-child(6n+4) .hoja{ --giro:154deg; --tam:0.92; } +.enredadera > li:nth-child(12n+4) .hoja{ --giro:154deg; --tam:0.92; } ``` Ese `.hoja` es un **descendiente**, así que alcanza también a las hojas que @@ -155,8 +155,8 @@ necesitas un tamaño propio, escríbelo en la medida, sin `var(--tam)`. ## La raíz (los dibujos de la enredadera) -Los tres dibujos —la bajada desde el título, el tramo de ordenador y el tallo -de móvil— **no están escritos a mano**: los genera un script, porque el +Los dibujos —la bajada desde el título, la franja de ordenador, su remate y el +tallo de móvil— **no están escritos a mano**: los genera un script, porque el trenzado hay que calcularlo (la perpendicular a lo largo del recorrido). ```sh @@ -166,12 +166,40 @@ cd ../prueba && python3 raiz2.py # regenera raiz2.json Después hay que **reinyectar los SVG en el CSS**. Y lo más importante: > Los puntos por donde pasa la raíz y las alturas de las que cuelgan las hojas -> (`--y` en las reglas `nth-child(6n+N)`) **tienen que coincidir**. Si mueves +> (`--y` en las reglas `nth-child(12n+N)`) **tienen que coincidir**. Si mueves > uno sin mover el otro, las hojas quedan flotando sin tocar la raíz. Para eso está `../coherencia.py`: compara el CSS contra el JSON y avisa. **Pásalo siempre después de tocar la raíz.** +### La franja de ordenador: dos filas, no una + +La franja es la única parte que se **repite**, porque una página puede tener +más hojas de las que caben en una fila: colectivos tiene doce, o sea dos. + +El dibujo lleva **dos filas**: la pasada de izquierda a derecha y, debajo, esa +misma pasada en **espejo** —un `` del mismo grupo, así que no pesa el +doble—. Entra y sale **vertical** por las dos esquinas, de modo que empalma +con su espejo por la derecha y con la copia siguiente por la izquierda. Puesto +con `repeat-y` y `background-size:100% calc(var(--fila) * 2)`, la enredadera +serpentea por las filas que haga falta **sin una sola junta**. Antes el dibujo +era de una fila y remataba en espiral: en colectivos se veían dos ramas +sueltas, la segunda empezando otra vez desde el margen izquierdo. + +De ahí salen tres cosas encadenadas: + +- La tanda de las reglas por hoja es de **doce** (`nth-child(12n+N)`), no de + seis: las seis de la pasada y las seis del espejo, que son **las mismas + leídas del revés y con el giro cambiado de signo**. `../coherencia.py` lo + comprueba. +- El tallo va en **dos capas**, no en el fondo del `
    `: `.enredadera::before` + pinta todas las filas menos la última (`top:0; bottom:var(--fila)`) y + `.enredadera::after` pinta la última con el remate en espiral. Las dos con + `z-index:-1`, que es donde estaba el fondo al que sustituyen. +- Si la última fila es **par**, la pasada va de derecha a izquierda y el remate + se pinta en espejo. Lo decide un `:has()` sobre dónde cae el último `
  • ` + dentro de la tanda de doce, así que añadir una hoja sigue sin tocar nada. + ### La bajada del título Es el dibujo más delicado de los tres, porque empalma con dos cosas a la vez: @@ -190,6 +218,38 @@ el título por arriba y la franja por la esquina de abajo a la izquierda. --- +## El brote de REDES + +Al pulsar REDES salen tres hojas pequeñas, una por red. **Cuelgan de un tallo +de verdad**, no flotan: cada `
  • ` del brote lleva un `::before` que es su +trozo de tallo, y los tres se encadenan —el primero va hasta el agarre en la +enredadera, el segundo hasta el primero y el tercero hasta el segundo—, así que +lo que se dibuja es **un solo brote con tres hojas**, no tres hojas sueltas. + +Dos cifras por hoja bastan, y son las mismas que la colocan leídas del revés: + +```css +.brotes > li:nth-child(2){ --largo:0.605; --ang:262.4deg; } +``` + +- `--largo` va en unidades de `--r` y `--ang` es **absoluto**, porque el + `
  • ` no gira (gira la hoja que lleva dentro). +- Por eso lo que se coloca es la **punta del rabillo** —`translate(-50%,0)`, + no `(-50%,-50%)`—: si se colocara el centro de la hoja, el punto donde + empieza el tallo dependería de lo que mida la hoja, que va en `vw`, y el + ángulo no podría ser una constante. +- Si mueves un nudo, recalcula las dos: `--largo` es la distancia al nudo + anterior y `--ang` = `atan2(dx, -dy)`. + +En **ordenador** el brote sale hacia abajo y a la izquierda, al hueco que +dejan Eventos y Campañas. En **móvil** no cabe un abanico: el tallo es +vertical y las hojas ocupan los ~130px del centro, así que lo único libre son +las franjas de los lados —62px a 390, 86 a 360, 110 a 320—. Ahí el brote sale +por la **izquierda**, pasa por debajo de la hoja de REDES y **trepa** por el +margen. Antes salía a la derecha y se comía Eventos y Campañas. + +--- + ## El banco de pruebas ```sh diff --git a/index.css b/index.css index 3c64351..5e6f4ee 100644 --- a/index.css +++ b/index.css @@ -20,11 +20,13 @@ la definición base de .brotes está en (11) y un bloque de móvil puesto antes perdería. - ".brotes > li:nth-child(N) .hoja" empata (0,3,1) con - ".enredadera > li:nth-child(6n+N) .hoja" y gana por orden. Si mueves + ".enredadera > li:nth-child(12n+N) .hoja" y gana por orden. Si mueves uno de los dos, los brotes cogen el giro de la hoja madre. - Comprobado que no sobra nada: los 138 selectores del fichero casan con - algún elemento en alguna de las siete páginas. No hay reglas muertas. + Comprobado que no sobra nada: de los 147 selectores del fichero, los únicos + que hoy no casan con nada son los que ESPERAN hojas que aún no existen —la + tercera fila y cinco de los seis remates de fila par—. No hay reglas + muertas. Y no cambies un valor buscándolo por su número: hazlo por su selector. Un reemplazo global de "--giro" tocó sin querer la regla de móvil y dejó las @@ -303,12 +305,49 @@ img{ max-width:100%; height:auto; display:block; } position:relative; display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:var(--fila); - /*@franja*/background-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%201000%20420%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20fill=%22%2314170f%22%20stroke=%22%2314170f%22%20stroke-width=%22.7%22%20stroke-linejoin=%22round%22%20d=%22M11.5%20-0%20L11.5%200.5%20L11.5%201.1%20L11.4%201.8%20L11.3%202.6%20L11.2%203.6%20L11%204.7%20L10.9%205.8%20L10.7%207.1%20L10.6%208.4%20L10.4%209.8%20L10.4%2011.3%20L10.3%2012.9%20L10.3%2014.5%20L10.4%2016.2%20L10.6%2018%20L10.8%2019.8%20L11.1%2021.7%20L11.6%2023.6%20L12.1%2025.5%20L12.8%2027.5%20L13.5%2029.5%20L14.3%2031.5%20L15.1%2033.6%20L16.1%2035.8%20L17.1%2038%20L18.1%2040.4%20L19.3%2042.8%20L20.5%2045.2%20L21.7%2047.6%20L23%2050.1%20L24.4%2052.7%20L25.8%2055.2%20L27.2%2057.7%20L28.7%2060.2%20L30.2%2062.7%20L31.8%2065.2%20L33.4%2067.7%20L35%2070.1%20L36.7%2072.4%20L38.4%2074.7%20L40%2076.8%20L41.3%2078.6%20L42.6%2080.1%20L43.7%2081.6%20L44.8%2082.9%20L45.9%2084.1%20L47%2085.4%20L48.1%2086.6%20L49.3%2087.8%20L50.7%2089.1%20L52.2%2090.5%20L53.9%2092.1%20L55.9%2094%20L58.2%2096.1%20L60.8%2098.4%20L63.7%20101.2%20L67.1%20104.3%20L71%20107.9%20L75.3%20112%20L80.2%20116.6%20L85.6%20122%20L91.6%20128.6%20L98.1%20136.2%20L105.2%20144.7%20L112.7%20153.9%20L120.6%20163.6%20L128.9%20173.8%20L137.5%20184.1%20L146.4%20194.6%20L155.5%20205.1%20L164.7%20215.3%20L174.1%20225.2%20L183.6%20234.6%20L193.1%20243.3%20L202.6%20251.2%20L212.1%20258.2%20L221.6%20264%20L231%20268.6%20L240.4%20271.8%20L249.8%20273.3%20L259.1%20272.7%20L268.3%20270%20L277.3%20265.4%20L286.1%20259.4%20L294.7%20252.1%20L303.2%20243.8%20L311.7%20234.6%20L320.1%20224.9%20L328.5%20214.8%20L336.8%20204.4%20L345.2%20194.1%20L353.4%20184.1%20L361.7%20174.5%20L369.9%20165.7%20L378%20157.7%20L386.1%20150.9%20L394%20145.5%20L401.7%20141.6%20L409.1%20139.4%20L416.4%20138.9%20L423.7%20140.3%20L431.2%20143.5%20L439%20148.4%20L447%20154.9%20L455.1%20162.8%20L463.3%20171.8%20L471.5%20181.7%20L479.8%20192.3%20L488.1%20203.4%20L496.4%20214.8%20L504.7%20226.1%20L513.1%20237.3%20L521.5%20248.1%20L529.9%20258.3%20L538.4%20267.7%20L547%20276%20L555.7%20283.1%20L564.6%20288.7%20L573.7%20292.5%20L583.1%20294.3%20L592.5%20293.7%20L601.7%20291%20L610.6%20286.4%20L619.4%20280.4%20L628%20273.1%20L636.6%20264.8%20L645%20255.6%20L653.4%20245.9%20L661.8%20235.8%20L670.2%20225.4%20L678.5%20215.1%20L686.8%20205.1%20L695%20195.5%20L703.2%20186.7%20L711.4%20178.7%20L719.4%20171.9%20L727.3%20166.5%20L735%20162.6%20L742.5%20160.4%20L749.8%20159.9%20L757.4%20161.2%20L765.4%20164%20L773.9%20168.2%20L782.6%20173.8%20L791.5%20180.6%20L800.6%20188.4%20L809.8%20197%20L818.9%20206.3%20L828.1%20216.2%20L837.1%20226.5%20L846.1%20236.9%20L854.8%20247.4%20L863.4%20257.8%20L871.7%20267.9%20L879.6%20277.6%20L887.3%20286.7%20L894.6%20295.1%20L901.4%20302.6%20L907.8%20309%20L913.8%20314.3%20L919.3%20318.3%20L924.2%20321.7%20L928.7%20324.5%20L932.9%20326.7%20L936.7%20328.4%20L940.2%20329.7%20L943.3%20330.6%20L946.3%20331.2%20L948.9%20331.5%20L951.4%20331.5%20L953.6%20331.4%20L955.5%20331.2%20L957.2%20331%20L958.7%20330.8%20L960%20330.7%20L961.1%20330.7%20L962.2%20330.8%20L963.3%20331.1%20L964.5%20331.7%20L966%20332.6%20L967.6%20333.9%20L969.3%20335.2%20L970.9%20336.7%20L972.5%20338.2%20L974%20339.8%20L975.4%20341.5%20L976.8%20343.2%20L978.1%20344.9%20L979.4%20346.7%20L980.6%20348.5%20L981.6%20350.3%20L982.7%20352.2%20L983.6%20354%20L984.4%20355.8%20L985.2%20357.6%20L985.8%20359.4%20L986.4%20361.2%20L986.8%20362.9%20L987.2%20364.5%20L987.4%20366.1%20L987.5%20367.6%20L987.6%20369.1%20L987.5%20370.7%20L987.3%20372.4%20L987%20374%20L986.6%20375.7%20L986.1%20377.3%20L985.6%20379%20L984.9%20380.7%20L984.2%20382.3%20L983.4%20383.9%20L982.5%20385.5%20L981.6%20387.1%20L980.6%20388.6%20L979.5%20390%20L978.5%20391.4%20L977.3%20392.8%20L976.2%20394.1%20L975%20395.3%20L973.8%20396.3%20L972.5%20397.4%20L971.1%20398.3%20L969.6%20399.3%20L968%20400.2%20L966.4%20401.1%20L964.6%20401.9%20L962.8%20402.7%20L960.9%20403.4%20L959%20404.1%20L957.1%20404.7%20L955.1%20405.3%20L953.1%20405.8%20L951.1%20406.3%20L949.1%20406.7%20L947.2%20407.1%20L945.2%20407.4%20L943.3%20407.6%20L941.5%20407.8%20L939.7%20407.9%20L938%20407.9%20L936.4%20407.8%20L934.7%20407.6%20L932.9%20407.3%20L931.1%20406.9%20L929.2%20406.4%20L927.4%20405.8%20L925.5%20405.1%20L923.6%20404.4%20L921.8%20403.6%20L920%20402.8%20L918.2%20402%20L916.5%20401.2%20L914.8%20400.4%20L913.2%20399.6%20L911.7%20398.8%20L910.3%20398.1%20L908.9%20397.5%20L907.7%20396.9%20L906.6%20396.4%20L905.7%20396%20L904.3%20399.6%20L905.2%20399.9%20L906.2%20400.3%20L907.3%20400.9%20L908.6%20401.5%20L910%20402.2%20L911.5%20403%20L913.1%20403.8%20L914.8%20404.6%20L916.6%20405.4%20L918.4%20406.3%20L920.3%20407.1%20L922.2%20407.9%20L924.2%20408.7%20L926.2%20409.4%20L928.1%20410%20L930.1%20410.6%20L932.1%20411%20L934.1%20411.4%20L936.1%20411.6%20L938%20411.7%20L939.9%20411.7%20L941.8%20411.6%20L943.7%20411.4%20L945.8%20411.1%20L947.8%20410.8%20L949.9%20410.5%20L951.9%20410%20L954%20409.5%20L956.1%20409%20L958.2%20408.4%20L960.2%20407.7%20L962.3%20407%20L964.2%20406.2%20L966.2%20405.4%20L968%20404.5%20L969.9%20403.5%20L971.6%20402.5%20L973.2%20401.5%20L974.8%20400.4%20L976.2%20399.3%20L977.6%20398%20L978.9%20396.8%20L980.3%20395.5%20L981.5%20394%20L982.8%20392.6%20L984%20391%20L985.1%20389.4%20L986.2%20387.8%20L987.2%20386%20L988.2%20384.3%20L989.1%20382.5%20L989.9%20380.7%20L990.6%20378.8%20L991.2%20377%20L991.7%20375.1%20L992.2%20373.2%20L992.5%20371.3%20L992.6%20369.4%20L992.7%20367.4%20L992.6%20365.5%20L992.4%20363.6%20L992.1%20361.7%20L991.6%20359.7%20L991.1%20357.7%20L990.4%20355.7%20L989.7%20353.7%20L988.8%20351.6%20L987.9%20349.6%20L986.9%20347.5%20L985.7%20345.4%20L984.5%20343.4%20L983.2%20341.4%20L981.9%20339.4%20L980.4%20337.5%20L978.9%20335.6%20L977.3%20333.7%20L975.6%20331.9%20L973.8%20330.2%20L972%20328.6%20L970%20327%20L968%20325.6%20L965.9%20324.6%20L963.8%20323.9%20L961.8%20323.5%20L959.9%20323.4%20L958.1%20323.5%20L956.4%20323.7%20L954.7%20323.8%20L953.1%20324%20L951.4%20324%20L949.6%20323.9%20L947.6%20323.6%20L945.3%20323.1%20L942.8%20322.2%20L939.9%20321.1%20L936.7%20319.4%20L933%20317.3%20L929%20314.6%20L924.5%20311.3%20L919.5%20307.3%20L914%20302.5%20L907.9%20296.4%20L901.3%20289.1%20L894.1%20280.9%20L886.6%20271.9%20L878.6%20262.2%20L870.3%20252.1%20L861.8%20241.7%20L853%20231.1%20L843.9%20220.6%20L834.8%20210.2%20L825.5%20200.1%20L816.1%20190.6%20L806.6%20181.7%20L797.2%20173.6%20L787.8%20166.4%20L778.3%20160.4%20L769%20155.7%20L759.6%20152.4%20L750.2%20150.9%20L740.9%20151.5%20L731.7%20154.2%20L722.7%20158.8%20L713.9%20164.8%20L705.3%20172.1%20L696.8%20180.4%20L688.3%20189.6%20L679.9%20199.3%20L671.5%20209.4%20L663.2%20219.8%20L654.8%20230.1%20L646.6%20240.1%20L638.3%20249.7%20L630.1%20258.5%20L622%20266.5%20L613.9%20273.3%20L606%20278.7%20L598.3%20282.6%20L590.9%20284.8%20L583.6%20285.3%20L576.3%20283.9%20L568.8%20280.7%20L561%20275.8%20L553%20269.3%20L544.9%20261.4%20L536.7%20252.4%20L528.5%20242.5%20L520.2%20231.9%20L511.9%20220.8%20L503.6%20209.4%20L495.3%20198.1%20L486.9%20186.9%20L478.5%20176.1%20L470.1%20165.9%20L461.6%20156.5%20L453%20148.2%20L444.3%20141.1%20L435.4%20135.5%20L426.3%20131.7%20L416.9%20129.9%20L407.5%20130.5%20L398.3%20133.2%20L389.4%20137.8%20L380.6%20143.8%20L372%20151.1%20L363.4%20159.4%20L355%20168.6%20L346.6%20178.3%20L338.2%20188.4%20L329.8%20198.8%20L321.5%20209.1%20L313.2%20219.1%20L305%20228.7%20L296.8%20237.5%20L288.6%20245.5%20L280.6%20252.3%20L272.7%20257.7%20L265%20261.6%20L257.5%20263.8%20L250.2%20264.3%20L242.6%20263.1%20L234.5%20260.3%20L226%20256.2%20L217.2%20250.7%20L208.2%20244.1%20L199%20236.5%20L189.8%20228%20L180.5%20218.9%20L171.3%20209.2%20L162.2%20199.1%20L153.2%20188.8%20L144.4%20178.4%20L135.9%20168%20L127.6%20157.9%20L119.7%20148.2%20L112.1%20139%20L105%20130.4%20L98.3%20122.6%20L92.1%20115.8%20L86.5%20110.2%20L81.5%20105.5%20L77.1%20101.4%20L73.3%2097.8%20L69.8%2094.6%20L66.9%2091.8%20L64.3%2089.4%20L62%2087.4%20L60.1%2085.6%20L58.4%2084%20L56.9%2082.6%20L55.7%2081.4%20L54.6%2080.3%20L53.6%2079.2%20L52.6%2078.2%20L51.7%2077.1%20L50.7%2075.9%20L49.7%2074.6%20L48.5%2073.1%20L47.1%2071.3%20L45.6%2069.3%20L44%2067.1%20L42.4%2064.9%20L40.9%2062.7%20L39.4%2060.3%20L37.9%2058%20L36.4%2055.6%20L35%2053.2%20L33.6%2050.8%20L32.3%2048.3%20L31%2045.9%20L29.7%2043.5%20L28.5%2041.2%20L27.4%2038.9%20L26.3%2036.6%20L25.3%2034.4%20L24.3%2032.2%20L23.4%2030.1%20L22.6%2028.1%20L21.9%2026.2%20L21.2%2024.5%20L20.7%2022.9%20L20.3%2021.4%20L20%2019.9%20L19.7%2018.4%20L19.5%2017%20L19.4%2015.6%20L19.3%2014.3%20L19.3%2013%20L19.4%2011.7%20L19.4%2010.4%20L19.5%209.2%20L19.6%208.1%20L19.8%207%20L19.9%205.9%20L20.1%204.8%20L20.2%203.8%20L20.3%202.8%20L20.4%201.8%20L20.5%200.8%20L20.5%200%20Z%22/%3E%3Cpath%20fill=%22%23ff00aa%22%20stroke=%22%23ff00aa%22%20stroke-width=%22.6%22%20stroke-linejoin=%22round%22%20d=%22M13.3%20-0%20L13.2%200.6%20L13.2%201.2%20L13.1%202%20L13%202.8%20L12.9%203.8%20L12.7%204.8%20L12.5%206%20L12.4%207.2%20L12.2%208.5%20L12.1%209.9%20L12%2011.3%20L11.9%2012.8%20L11.9%2014.4%20L11.9%2016.1%20L12.1%2017.8%20L12.3%2019.5%20L12.5%2021.3%20L12.9%2023.2%20L13.4%2025.1%20L14%2027%20L14.7%2028.9%20L15.4%2031%20L16.2%2033.1%20L17.1%2035.3%20L18%2037.5%20L19%2039.9%20L20.1%2042.3%20L21.2%2044.7%20L22.4%2047.2%20L23.6%2049.7%20L24.9%2052.3%20L26.2%2054.8%20L27.6%2057.4%20L29%2060%20L30.4%2062.5%20L31.9%2065%20L33.4%2067.5%20L35%2070%20L36.6%2072.4%20L38.2%2074.7%20L39.7%2076.8%20L41%2078.7%20L42.2%2080.3%20L43.3%2081.8%20L44.4%2083.2%20L45.4%2084.4%20L46.5%2085.7%20L47.6%2086.9%20L48.8%2088.2%20L50.1%2089.6%20L51.6%2091.1%20L53.2%2092.8%20L55.1%2094.6%20L57.3%2096.8%20L59.9%2099.3%20L62.7%20102.1%20L66%20105.4%20L69.8%20109.1%20L74%20113.3%20L78.7%20118%20L83.9%20123.5%20L89.7%20130.2%20L96.1%20137.8%20L103.1%20146.4%20L110.6%20155.6%20L118.6%20165.3%20L127%20175.4%20L135.9%20185.6%20L145.1%20195.9%20L154.7%20205.9%20L164.5%20215.7%20L174.6%20225%20L184.7%20233.7%20L194.9%20241.6%20L205%20248.6%20L214.9%20254.6%20L224.5%20259.3%20L233.8%20262.8%20L242.5%20264.8%20L250.5%20265.2%20L257.8%20263.9%20L265%20260.9%20L272.2%20256.3%20L279.4%20250.4%20L286.8%20243.1%20L294.2%20234.8%20L301.9%20225.7%20L309.7%20216%20L317.7%20205.9%20L325.9%20195.6%20L334.4%20185.5%20L343.2%20175.6%20L352.1%20166.3%20L361.3%20157.6%20L370.6%20150%20L380%20143.5%20L389.4%20138.4%20L398.7%20134.9%20L407.7%20133.4%20L416.3%20133.9%20L424.4%20136.6%20L432%20141.2%20L439.2%20147.5%20L446.2%20155.2%20L452.9%20164.3%20L459.6%20174.4%20L466.3%20185.4%20L473.1%20197%20L480.1%20209%20L487.3%20221.1%20L494.9%20233.2%20L502.8%20245%20L511.2%20256.4%20L520%20267%20L529.2%20276.7%20L538.9%20285.3%20L549.1%20292.5%20L559.8%20298.2%20L571.1%20301.9%20L582.8%20303.1%20L594.1%20301.2%20L604.4%20296.8%20L613.6%20290.6%20L621.9%20282.9%20L629.5%20274.1%20L636.7%20264.3%20L643.6%20253.8%20L650.4%20242.7%20L657.1%20231.4%20L663.9%20219.9%20L670.9%20208.6%20L678.2%20197.5%20L685.8%20187%20L693.8%20177.3%20L702.1%20168.5%20L710.9%20160.8%20L720.1%20154.4%20L729.8%20149.7%20L740%20147%20L750.3%20146.8%20L760.3%20148.9%20L769.9%20153%20L779.1%20158.6%20L788%20165.6%20L796.6%20173.8%20L805.1%20182.9%20L813.3%20192.9%20L821.4%20203.6%20L829.3%20214.6%20L837.2%20226%20L845.1%20237.4%20L852.9%20248.7%20L860.7%20259.8%20L868.5%20270.4%20L876.1%20280.4%20L883.7%20289.8%20L891%20298.3%20L898.1%20305.8%20L904.9%20312.3%20L911.2%20317.5%20L917%20321.5%20L922.2%20324.8%20L927.1%20327.5%20L931.5%20329.7%20L935.5%20331.3%20L939.3%20332.5%20L942.8%20333.3%20L946%20333.8%20L948.9%20334%20L951.5%20333.9%20L953.8%20333.7%20L955.9%20333.4%20L957.6%20333%20L959%20332.7%20L960.2%20332.6%20L961.2%20332.5%20L962%20332.5%20L962.8%20332.7%20L963.8%20333.1%20L965.2%20333.8%20L966.9%20335%20L968.6%20336.2%20L970.3%20337.5%20L971.9%20339%20L973.5%20340.5%20L975%20342%20L976.4%20343.6%20L977.8%20345.3%20L979.2%20347%20L980.4%20348.7%20L981.6%20350.5%20L982.7%20352.3%20L983.7%20354.1%20L984.6%20355.9%20L985.4%20357.6%20L986.2%20359.4%20L986.8%20361.1%20L987.3%20362.8%20L987.7%20364.5%20L988%20366.1%20L988.2%20367.6%20L988.3%20369.2%20L988.3%20370.9%20L988.1%20372.6%20L987.9%20374.3%20L987.5%20376%20L987.1%20377.7%20L986.5%20379.4%20L985.9%20381.2%20L985.2%20382.9%20L984.4%20384.5%20L983.6%20386.2%20L982.6%20387.8%20L981.6%20389.4%20L980.6%20390.9%20L979.5%20392.4%20L978.4%20393.7%20L977.2%20395.1%20L976%20396.3%20L974.7%20397.5%20L973.4%20398.6%20L972%20399.6%20L970.4%20400.6%20L968.8%20401.6%20L967.1%20402.5%20L965.3%20403.4%20L963.4%20404.2%20L961.5%20404.9%20L959.5%20405.7%20L957.5%20406.3%20L955.5%20406.9%20L953.5%20407.4%20L951.5%20407.9%20L949.5%20408.3%20L947.4%20408.7%20L945.5%20408.9%20L943.5%20409.1%20L941.6%20409.3%20L939.8%20409.4%20L938%20409.4%20L936.3%20409.3%20L934.5%20409.1%20L932.6%20408.7%20L930.8%20408.2%20L928.9%20407.7%20L927%20407%20L925.1%20406.3%20L923.2%20405.5%20L921.3%20404.7%20L919.5%20403.9%20L917.7%20403%20L916%20402.1%20L914.4%20401.3%20L912.8%20400.4%20L911.3%20399.7%20L909.9%20398.9%20L908.6%20398.3%20L907.4%20397.7%20L906.3%20397.2%20L905.4%20396.8%20L904.6%20398.8%20L905.4%20399.2%20L906.5%20399.6%20L907.6%20400.2%20L908.9%20400.9%20L910.3%20401.6%20L911.8%20402.4%20L913.4%20403.2%20L915%20404.1%20L916.8%20405%20L918.6%20405.8%20L920.4%20406.7%20L922.3%20407.5%20L924.3%20408.3%20L926.2%20409.1%20L928.2%20409.8%20L930.2%20410.4%20L932.2%20410.8%20L934.1%20411.2%20L936.1%20411.5%20L938%20411.6%20L939.8%20411.6%20L941.8%20411.5%20L943.7%20411.3%20L945.7%20411.1%20L947.8%20410.8%20L949.9%20410.5%20L951.9%20410%20L954%20409.6%20L956.1%20409%20L958.2%20408.4%20L960.3%20407.7%20L962.3%20407%20L964.3%20406.2%20L966.2%20405.4%20L968.1%20404.5%20L969.9%20403.5%20L971.6%20402.5%20L973.2%20401.4%20L974.8%20400.3%20L976.2%20399.2%20L977.5%20398%20L978.9%20396.7%20L980.1%20395.3%20L981.4%20393.9%20L982.6%20392.4%20L983.7%20390.8%20L984.8%20389.2%20L985.8%20387.5%20L986.8%20385.8%20L987.7%20384%20L988.5%20382.2%20L989.2%20380.4%20L989.8%20378.5%20L990.3%20376.7%20L990.8%20374.8%20L991.1%20372.9%20L991.3%20371.1%20L991.4%20369.2%20L991.3%20367.4%20L991.2%20365.6%20L990.8%20363.8%20L990.4%20362%20L989.9%20360.1%20L989.3%20358.2%20L988.5%20356.3%20L987.7%20354.4%20L986.8%20352.5%20L985.7%20350.5%20L984.6%20348.6%20L983.4%20346.7%20L982.1%20344.8%20L980.7%20343%20L979.3%20341.2%20L977.8%20339.4%20L976.2%20337.7%20L974.6%20336.1%20L972.9%20334.5%20L971.1%20333%20L969.3%20331.6%20L967.4%20330.4%20L965.7%20329.3%20L964%20328.7%20L962.6%20328.4%20L961.2%20328.2%20L959.8%20328.3%20L958.3%20328.5%20L956.8%20328.7%20L955.1%20329%20L953.3%20329.3%20L951.3%20329.5%20L949%20329.5%20L946.5%20329.3%20L943.7%20328.8%20L940.6%20328%20L937.3%20326.8%20L933.5%20325.2%20L929.4%20323.1%20L924.9%20320.4%20L920%20317.2%20L914.5%20313.2%20L908.5%20308.2%20L902%20302%20L895.1%20294.6%20L887.9%20286.2%20L880.5%20277%20L872.9%20267.1%20L865.2%20256.6%20L857.4%20245.6%20L849.6%20234.3%20L841.8%20222.9%20L833.8%20211.5%20L825.8%20200.3%20L817.6%20189.5%20L809.2%20179.3%20L800.6%20169.9%20L791.6%20161.4%20L782.2%20154.1%20L772.4%20148.1%20L762%20143.7%20L750.8%20141.3%20L739.2%20141.6%20L727.8%20144.6%20L717.3%20149.7%20L707.5%20156.4%20L698.3%20164.5%20L689.6%20173.6%20L681.4%20183.7%20L673.7%20194.4%20L666.3%20205.6%20L659.2%20217.1%20L652.4%20228.6%20L645.7%20239.9%20L639%20250.8%20L632.2%20261.2%20L625.2%20270.6%20L617.9%20279.1%20L610.1%20286.3%20L601.8%20292%20L592.6%20295.9%20L582.6%20297.6%20L572.2%20296.5%20L561.9%20293.2%20L552%20287.9%20L542.3%20281%20L533%20272.7%20L524.1%20263.3%20L515.5%20253%20L507.3%20241.9%20L499.5%20230.2%20L492%20218.3%20L484.8%20206.2%20L477.9%20194.2%20L471.1%20182.5%20L464.3%20171.4%20L457.4%20161.1%20L450.4%20151.7%20L443.1%20143.6%20L435.2%20136.8%20L426.7%20131.6%20L417.4%20128.5%20L407.4%20127.9%20L397.2%20129.6%20L387.1%20133.4%20L377.1%20138.8%20L367.3%20145.6%20L357.7%20153.5%20L348.3%20162.3%20L339.1%20171.9%20L330.3%20181.9%20L321.7%20192.1%20L313.4%20202.4%20L305.4%20212.5%20L297.6%20222.2%20L290.1%20231.2%20L282.8%20239.3%20L275.7%20246.3%20L268.9%20251.9%20L262.4%20256%20L256.3%20258.6%20L250.2%20259.7%20L243.3%20259.3%20L235.4%20257.5%20L226.7%20254.3%20L217.5%20249.7%20L208%20244%20L198.1%20237.2%20L188.2%20229.4%20L178.2%20220.9%20L168.3%20211.7%20L158.6%20202.1%20L149.2%20192.1%20L140%20182%20L131.2%20171.8%20L122.8%20161.8%20L114.8%20152.1%20L107.4%20142.9%20L100.4%20134.3%20L93.9%20126.6%20L88%20119.8%20L82.7%20114.2%20L77.9%20109.4%20L73.7%20105.2%20L69.9%20101.5%20L66.6%2098.2%20L63.7%2095.4%20L61.2%2092.9%20L59%2090.7%20L57.1%2088.9%20L55.5%2087.2%20L54%2085.8%20L52.8%2084.5%20L51.7%2083.2%20L50.6%2082.1%20L49.6%2080.9%20L48.7%2079.7%20L47.7%2078.5%20L46.7%2077.1%20L45.5%2075.5%20L44.2%2073.7%20L42.7%2071.6%20L41.2%2069.3%20L39.6%2067%20L38.1%2064.6%20L36.6%2062.2%20L35.2%2059.7%20L33.8%2057.3%20L32.4%2054.8%20L31.1%2052.3%20L29.8%2049.8%20L28.5%2047.3%20L27.4%2044.8%20L26.2%2042.4%20L25.1%2040%20L24.1%2037.7%20L23.1%2035.4%20L22.2%2033.2%20L21.3%2031.1%20L20.6%2029%20L19.9%2027.1%20L19.2%2025.3%20L18.7%2023.6%20L18.3%2021.9%20L18%2020.3%20L17.7%2018.8%20L17.5%2017.3%20L17.4%2015.8%20L17.4%2014.4%20L17.4%2013%20L17.5%2011.6%20L17.6%2010.3%20L17.7%209.1%20L17.8%207.9%20L18%206.8%20L18.1%205.7%20L18.3%204.6%20L18.4%203.6%20L18.6%202.6%20L18.7%201.7%20L18.7%200.8%20L18.7%200%20Z%22/%3E%3Cpath%20fill=%22%2300d18e%22%20d=%22M906.3%20396.4%20L903.4%20393.7%20L900.8%20390.8%20L898.5%20387.8%20L896.5%20384.8%20L894.9%20381.6%20L893.5%20378.4%20L892.4%20375.2%20L891.6%20372%20L891.1%20368.8%20L890.9%20365.7%20L890.9%20362.7%20L891.2%20359.7%20L891.7%20356.8%20L892.4%20354.1%20L893.3%20351.5%20L894.4%20349%20L895.7%20346.8%20L897.1%20344.6%20L898.7%20342.7%20L900.3%20340.9%20L902.1%20339.3%20L903.9%20337.9%20L905.8%20336.7%20L907.7%20335.7%20L909.7%20334.9%20L911.7%20334.2%20L913.6%20333.7%20L915.6%20333.4%20L917.5%20333.3%20L919.4%20333.3%20L921.2%20333.5%20L923%20333.8%20L924.6%20334.2%20L926.2%20334.8%20L927.7%20335.5%20L929.1%20336.2%20L930.4%20337.1%20L931.6%20338.1%20L932.7%20339.1%20L933.7%20340.2%20L934.5%20341.3%20L935.3%20342.4%20L935.9%20343.6%20L936.4%20344.8%20L936.8%20346%20L937.1%20347.2%20L937.3%20348.4%20L937.4%20349.6%20L937.4%20350.8%20L937.3%20351.9%20L937.1%20353%20L936.8%20354%20L936.5%20355%20L936%20355.9%20L935.6%20356.7%20L935%20357.5%20L934.5%20358.3%20L933.8%20358.9%20L933.2%20359.5%20L932.5%20360%20L931.8%20360.5%20L931%20360.9%20L930.3%20361.2%20L929.6%20361.4%20L928.8%20361.6%20L928.1%20361.7%20L927.4%20361.8%20L926.7%20361.8%20L926%20361.7%20L925.4%20361.6%20L924.7%20361.4%20L924.1%20361.2%20L923.6%20361%20L923%20360.7%20L922.6%20360.3%20L922.1%20360%20L921.7%20359.6%20L921.3%20359.2%20L921%20358.8%20L920.7%20358.4%20L920.5%20357.9%20L920.3%20357.5%20L920.2%20357%20L920.1%20356.6%20L920%20356.1%20L920%20355.7%20L920%20355.3%20L920%20354.8%20L920.1%20354.4%20L920.2%20354.1%20L920.3%20353.7%20L920.5%20353.4%20L920.6%20353%20L920.8%20352.7%20L921%20352.5%20L921.3%20352.2%20L921.5%20352%20L921.8%20351.8%20L922%20351.6%20L922.3%20351.5%20L922.6%20351.4%20L922.8%20351.3%20L923.1%20351.2%20L923.4%20351.2%20L923.7%20351.1%20L923.9%20351.1%20L924.2%20351.2%20L924.4%20351.2%20L924.7%20351.2%20L924.9%20351.3%20L925.1%20350.8%20L924.9%20350.6%20L924.6%20350.6%20L924.3%20350.5%20L924%20350.4%20L923.7%20350.4%20L923.3%20350.4%20L923%20350.5%20L922.7%20350.5%20L922.3%20350.6%20L922%20350.8%20L921.6%20350.9%20L921.3%20351.1%20L921%20351.3%20L920.7%20351.6%20L920.4%20351.9%20L920.1%20352.2%20L919.9%20352.5%20L919.6%20352.9%20L919.4%20353.3%20L919.3%20353.8%20L919.1%20354.2%20L919%20354.7%20L919%20355.2%20L918.9%20355.7%20L919%20356.2%20L919%20356.8%20L919.1%20357.3%20L919.3%20357.8%20L919.5%20358.4%20L919.8%20358.9%20L920.1%20359.4%20L920.4%20359.9%20L920.9%20360.4%20L921.3%20360.9%20L921.8%20361.3%20L922.4%20361.7%20L923%20362.1%20L923.6%20362.4%20L924.3%20362.6%20L925.1%20362.9%20L925.8%20363%20L926.6%20363.1%20L927.4%20363.1%20L928.2%20363.1%20L929.1%20363%20L930%20362.8%20L930.8%20362.6%20L931.7%20362.2%20L932.5%20361.8%20L933.3%20361.3%20L934.1%20360.7%20L934.9%20360.1%20L935.6%20359.3%20L936.3%20358.5%20L937%20357.6%20L937.5%20356.6%20L938%20355.6%20L938.4%20354.5%20L938.8%20353.3%20L939%20352.1%20L939.2%20350.9%20L939.2%20349.6%20L939.1%20348.2%20L939%20346.9%20L938.7%20345.5%20L938.2%20344.2%20L937.7%20342.8%20L937%20341.5%20L936.2%20340.1%20L935.3%20338.9%20L934.2%20337.6%20L933%20336.5%20L931.7%20335.4%20L930.3%20334.4%20L928.7%20333.5%20L927.1%20332.7%20L925.3%20332%20L923.5%20331.5%20L921.5%20331.1%20L919.5%20330.9%20L917.4%20330.9%20L915.3%20331%20L913.2%20331.3%20L911%20331.8%20L908.8%20332.4%20L906.6%20333.3%20L904.5%20334.4%20L902.4%20335.7%20L900.3%20337.2%20L898.4%20338.9%20L896.5%20340.8%20L894.8%20342.9%20L893.2%20345.2%20L891.8%20347.7%20L890.6%20350.4%20L889.5%20353.2%20L888.7%20356.2%20L888.1%20359.3%20L887.7%20362.5%20L887.6%20365.8%20L887.8%20369.2%20L888.3%20372.7%20L889.1%20376.1%20L890.2%20379.6%20L891.7%20383.1%20L893.4%20386.6%20L895.5%20389.9%20L897.9%20393.2%20L900.7%20396.3%20L903.7%20399.2%20Z%22/%3E%3C/svg%3E"); - background-repeat:repeat-y; - background-position:left top; - background-size:100% var(--fila); } +/* El tallo va en DOS capas porque la última fila no se dibuja como las demás: + las de arriba tienen que seguir hacia la de abajo y la última remata en + espiral. Las dos van por detrás de las hojas —z-index:-1, que es justo donde + estaba el fondo al que sustituyen— y clavadas a la rejilla, así que siguen + saliendo solas por muchas hojas que se añadan. */ +.enredadera::before, +.enredadera::after{ + content:""; position:absolute; left:0; right:0; z-index:-1; + pointer-events:none; + background-repeat:no-repeat; + background-position:left top; +} +/* Todas las filas menos la última. El dibujo lleva DOS filas —la pasada y su + espejo— y se repite cada dos: empalma consigo mismo por las dos esquinas, + así que la enredadera serpentea sin junta por las filas que haga falta. + Antes el dibujo era de una fila y remataba en espiral, y en colectivos + —doce hojas— se veían dos ramas sueltas, la segunda empezando otra vez + desde el margen izquierdo. */ +.enredadera::before{ + top:0; bottom:var(--fila); + /*@franja*/background-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%201000%20840%22%20preserveAspectRatio=%22none%22%3E%3Cg%20id=%22p%22%3E%3Cpath%20fill=%22%2314170f%22%20stroke=%22%2314170f%22%20stroke-width=%22.7%22%20stroke-linejoin=%22round%22%20d=%22M11.5%20-0%20L11.5%200.5%20L11.5%201.1%20L11.4%201.8%20L11.3%202.6%20L11.2%203.6%20L11%204.7%20L10.9%205.8%20L10.7%207.1%20L10.6%208.4%20L10.4%209.8%20L10.4%2011.3%20L10.3%2012.9%20L10.3%2014.5%20L10.4%2016.2%20L10.6%2018%20L10.8%2019.8%20L11.1%2021.7%20L11.6%2023.6%20L12.1%2025.5%20L12.8%2027.5%20L13.5%2029.5%20L14.3%2031.5%20L15.1%2033.6%20L16.1%2035.8%20L17.1%2038%20L18.1%2040.4%20L19.3%2042.8%20L20.5%2045.2%20L21.7%2047.6%20L23%2050.1%20L24.4%2052.7%20L25.8%2055.2%20L27.2%2057.7%20L28.7%2060.2%20L30.2%2062.7%20L31.8%2065.2%20L33.4%2067.7%20L35%2070.1%20L36.7%2072.4%20L38.4%2074.7%20L40%2076.8%20L41.3%2078.6%20L42.6%2080.1%20L43.7%2081.6%20L44.8%2082.9%20L45.9%2084.1%20L47%2085.4%20L48.1%2086.6%20L49.3%2087.8%20L50.7%2089.1%20L52.2%2090.5%20L53.9%2092.1%20L55.9%2094%20L58.2%2096.1%20L60.8%2098.4%20L63.7%20101.2%20L67.1%20104.3%20L71%20107.9%20L75.3%20112%20L80.2%20116.6%20L85.6%20122%20L91.6%20128.6%20L98.1%20136.2%20L105.2%20144.7%20L112.7%20153.9%20L120.6%20163.6%20L128.9%20173.8%20L137.5%20184.1%20L146.4%20194.6%20L155.5%20205.1%20L164.7%20215.3%20L174.1%20225.2%20L183.6%20234.6%20L193.1%20243.3%20L202.6%20251.2%20L212.1%20258.2%20L221.6%20264%20L231%20268.6%20L240.4%20271.8%20L249.8%20273.3%20L259.1%20272.7%20L268.3%20270%20L277.3%20265.4%20L286.1%20259.4%20L294.7%20252.1%20L303.2%20243.8%20L311.7%20234.6%20L320.1%20224.9%20L328.5%20214.8%20L336.8%20204.4%20L345.2%20194.1%20L353.4%20184.1%20L361.7%20174.5%20L369.9%20165.7%20L378%20157.7%20L386.1%20150.9%20L394%20145.5%20L401.7%20141.6%20L409.1%20139.4%20L416.4%20138.9%20L423.7%20140.3%20L431.2%20143.5%20L439%20148.4%20L447%20154.9%20L455.1%20162.8%20L463.3%20171.8%20L471.5%20181.7%20L479.8%20192.3%20L488.1%20203.4%20L496.4%20214.8%20L504.7%20226.1%20L513.1%20237.3%20L521.5%20248.1%20L529.9%20258.3%20L538.4%20267.7%20L547%20276%20L555.7%20283.1%20L564.6%20288.7%20L573.7%20292.5%20L583.1%20294.3%20L592.5%20293.7%20L601.7%20291%20L610.6%20286.4%20L619.4%20280.4%20L628%20273.1%20L636.6%20264.8%20L645%20255.6%20L653.4%20245.9%20L661.8%20235.8%20L670.2%20225.4%20L678.5%20215.1%20L686.8%20205.1%20L695%20195.5%20L703.2%20186.7%20L711.4%20178.7%20L719.4%20171.9%20L727.3%20166.5%20L735%20162.6%20L742.5%20160.4%20L749.8%20159.9%20L757.4%20161.1%20L765.5%20163.9%20L774%20168.1%20L782.8%20173.5%20L791.8%20180.2%20L801%20187.8%20L810.2%20196.3%20L819.5%20205.5%20L828.7%20215.2%20L837.8%20225.4%20L846.8%20235.7%20L855.6%20246.1%20L864.1%20256.5%20L872.4%20266.6%20L880.3%20276.3%20L887.9%20285.5%20L895%20294%20L901.7%20301.7%20L907.9%20308.5%20L913.6%20314.1%20L918.5%20318.6%20L922.9%20322.6%20L926.8%20326.1%20L930.3%20329.1%20L933.3%20331.6%20L935.9%20333.8%20L938.2%20335.7%20L940.2%20337.3%20L941.9%20338.6%20L943.4%20339.8%20L944.7%20340.8%20L945.8%20341.7%20L946.8%20342.5%20L947.7%20343.3%20L948.6%20344.1%20L949.5%20345%20L950.5%20346.1%20L951.7%20347.4%20L953%20348.9%20L954.5%20350.8%20L956.1%20352.8%20L957.6%20355%20L959.1%20357.2%20L960.7%20359.4%20L962.1%20361.7%20L963.6%20364.1%20L965%20366.5%20L966.4%20368.9%20L967.7%20371.4%20L969%20373.8%20L970.3%20376.2%20L971.5%20378.6%20L972.6%20381%20L973.7%20383.3%20L974.7%20385.5%20L975.7%20387.7%20L976.5%20389.8%20L977.4%20391.8%20L978.1%20393.7%20L978.8%20395.5%20L979.3%20397.1%20L979.7%20398.6%20L980%20400.1%20L980.3%20401.6%20L980.5%20403%20L980.6%20404.4%20L980.7%20405.7%20L980.7%20407%20L980.6%20408.3%20L980.6%20409.6%20L980.5%20410.8%20L980.4%20411.9%20L980.2%20413%20L980.1%20414.1%20L979.9%20415.2%20L979.8%20416.2%20L979.7%20417.2%20L979.6%20418.2%20L979.5%20419.2%20L979.5%20420%20L988.5%20420%20L988.5%20419.5%20L988.5%20418.9%20L988.6%20418.2%20L988.7%20417.4%20L988.8%20416.4%20L989%20415.3%20L989.1%20414.2%20L989.3%20412.9%20L989.4%20411.6%20L989.6%20410.2%20L989.6%20408.7%20L989.7%20407.1%20L989.7%20405.5%20L989.6%20403.8%20L989.4%20402%20L989.2%20400.2%20L988.9%20398.3%20L988.4%20396.4%20L987.9%20394.5%20L987.2%20392.5%20L986.5%20390.5%20L985.7%20388.5%20L984.9%20386.4%20L983.9%20384.2%20L982.9%20381.9%20L981.9%20379.5%20L980.7%20377.1%20L979.6%20374.6%20L978.3%20372.1%20L977%20369.6%20L975.7%20367.1%20L974.3%20364.5%20L972.8%20362%20L971.3%20359.5%20L969.8%20357%20L968.2%20354.5%20L966.6%20352.1%20L964.9%20349.7%20L963.2%20347.4%20L961.5%20345.2%20L959.9%20343.2%20L958.5%20341.5%20L957.2%20340.1%20L956%20338.8%20L954.9%20337.6%20L953.8%20336.6%20L952.6%20335.6%20L951.5%20334.6%20L950.3%20333.7%20L948.9%20332.7%20L947.5%20331.5%20L945.8%20330.2%20L943.9%20328.7%20L941.7%20326.9%20L939.1%20324.8%20L936.2%20322.3%20L932.8%20319.3%20L929%20315.9%20L924.6%20312%20L919.8%20307.5%20L914.4%20302.2%20L908.4%20295.7%20L901.9%20288.2%20L894.8%20279.8%20L887.3%20270.6%20L879.4%20260.9%20L871.1%20250.8%20L862.5%20240.4%20L853.6%20229.9%20L844.5%20219.4%20L835.3%20209.1%20L825.9%20199.2%20L816.4%20189.8%20L806.9%20181.1%20L797.4%20173.1%20L787.9%20166.1%20L778.4%20160.2%20L769%20155.6%20L759.6%20152.4%20L750.2%20150.9%20L740.9%20151.5%20L731.7%20154.2%20L722.7%20158.8%20L713.9%20164.8%20L705.3%20172.1%20L696.8%20180.4%20L688.3%20189.6%20L679.9%20199.3%20L671.5%20209.4%20L663.2%20219.8%20L654.8%20230.1%20L646.6%20240.1%20L638.3%20249.7%20L630.1%20258.5%20L622%20266.5%20L613.9%20273.3%20L606%20278.7%20L598.3%20282.6%20L590.9%20284.8%20L583.6%20285.3%20L576.3%20283.9%20L568.8%20280.7%20L561%20275.8%20L553%20269.3%20L544.9%20261.4%20L536.7%20252.4%20L528.5%20242.5%20L520.2%20231.9%20L511.9%20220.8%20L503.6%20209.4%20L495.3%20198.1%20L486.9%20186.9%20L478.5%20176.1%20L470.1%20165.9%20L461.6%20156.5%20L453%20148.2%20L444.3%20141.1%20L435.4%20135.5%20L426.3%20131.7%20L416.9%20129.9%20L407.5%20130.5%20L398.3%20133.2%20L389.4%20137.8%20L380.6%20143.8%20L372%20151.1%20L363.4%20159.4%20L355%20168.6%20L346.6%20178.3%20L338.2%20188.4%20L329.8%20198.8%20L321.5%20209.1%20L313.2%20219.1%20L305%20228.7%20L296.8%20237.5%20L288.6%20245.5%20L280.6%20252.3%20L272.7%20257.7%20L265%20261.6%20L257.5%20263.8%20L250.2%20264.3%20L242.6%20263.1%20L234.5%20260.3%20L226%20256.2%20L217.2%20250.7%20L208.2%20244.1%20L199%20236.5%20L189.8%20228%20L180.5%20218.9%20L171.3%20209.2%20L162.2%20199.1%20L153.2%20188.8%20L144.4%20178.4%20L135.9%20168%20L127.6%20157.9%20L119.7%20148.2%20L112.1%20139%20L105%20130.4%20L98.3%20122.6%20L92.1%20115.8%20L86.5%20110.2%20L81.5%20105.5%20L77.1%20101.4%20L73.3%2097.8%20L69.8%2094.6%20L66.9%2091.8%20L64.3%2089.4%20L62%2087.4%20L60.1%2085.6%20L58.4%2084%20L56.9%2082.6%20L55.7%2081.4%20L54.6%2080.3%20L53.6%2079.2%20L52.6%2078.2%20L51.7%2077.1%20L50.7%2075.9%20L49.7%2074.6%20L48.5%2073.1%20L47.1%2071.3%20L45.6%2069.3%20L44%2067.1%20L42.4%2064.9%20L40.9%2062.7%20L39.4%2060.3%20L37.9%2058%20L36.4%2055.6%20L35%2053.2%20L33.6%2050.8%20L32.3%2048.3%20L31%2045.9%20L29.7%2043.5%20L28.5%2041.2%20L27.4%2038.9%20L26.3%2036.6%20L25.3%2034.4%20L24.3%2032.2%20L23.4%2030.1%20L22.6%2028.1%20L21.9%2026.2%20L21.2%2024.5%20L20.7%2022.9%20L20.3%2021.4%20L20%2019.9%20L19.7%2018.4%20L19.5%2017%20L19.4%2015.6%20L19.3%2014.3%20L19.3%2013%20L19.4%2011.7%20L19.4%2010.4%20L19.5%209.2%20L19.6%208.1%20L19.8%207%20L19.9%205.9%20L20.1%204.8%20L20.2%203.8%20L20.3%202.8%20L20.4%201.8%20L20.5%200.8%20L20.5%200%20Z%22/%3E%3Cpath%20fill=%22%23ff00aa%22%20stroke=%22%23ff00aa%22%20stroke-width=%22.6%22%20stroke-linejoin=%22round%22%20d=%22M13.3%20-0%20L13.2%200.6%20L13.2%201.2%20L13.1%202%20L13%202.8%20L12.9%203.8%20L12.7%204.8%20L12.5%206%20L12.4%207.2%20L12.2%208.5%20L12.1%209.9%20L12%2011.3%20L11.9%2012.8%20L11.9%2014.4%20L11.9%2016.1%20L12%2017.8%20L12.2%2019.5%20L12.5%2021.3%20L12.9%2023.2%20L13.4%2025.1%20L14%2027%20L14.6%2028.9%20L15.4%2031%20L16.2%2033.1%20L17.1%2035.3%20L18%2037.6%20L19%2039.9%20L20%2042.3%20L21.2%2044.7%20L22.3%2047.2%20L23.5%2049.8%20L24.8%2052.3%20L26.1%2054.9%20L27.5%2057.4%20L28.9%2060%20L30.3%2062.6%20L31.8%2065.1%20L33.3%2067.6%20L34.9%2070%20L36.5%2072.5%20L38.1%2074.8%20L39.6%2076.9%20L40.9%2078.8%20L42.1%2080.4%20L43.2%2081.9%20L44.2%2083.3%20L45.3%2084.5%20L46.3%2085.8%20L47.5%2087.1%20L48.7%2088.4%20L50%2089.7%20L51.4%2091.2%20L53.1%2092.9%20L55%2094.8%20L57.2%2096.9%20L59.7%2099.4%20L62.6%20102.3%20L65.9%20105.5%20L69.6%20109.3%20L73.9%20113.5%20L78.6%20118.1%20L83.8%20123.6%20L89.6%20130.3%20L96.1%20137.9%20L103.1%20146.4%20L110.6%20155.6%20L118.7%20165.3%20L127.2%20175.3%20L136.2%20185.4%20L145.6%20195.5%20L155.3%20205.5%20L165.2%20215.1%20L175.4%20224.2%20L185.6%20232.8%20L195.8%20240.5%20L206%20247.4%20L215.8%20253.2%20L225.4%20257.8%20L234.5%20261.1%20L242.9%20263%20L250.6%20263.4%20L257.5%20262.2%20L264.4%20259.3%20L271.3%20255%20L278.5%20249.2%20L285.9%20242.2%20L293.5%20234.2%20L301.3%20225.3%20L309.4%20215.9%20L317.7%20206.1%20L326.4%20196.1%20L335.3%20186.3%20L344.4%20176.8%20L353.8%20167.9%20L363.3%20159.7%20L372.8%20152.5%20L382.2%20146.5%20L391.4%20142%20L400.2%20139%20L408.4%20137.9%20L415.9%20138.7%20L422.9%20141.3%20L429.6%20145.6%20L436.2%20151.6%20L442.8%20159%20L449.4%20167.7%20L456.1%20177.5%20L463.1%20188.1%20L470.3%20199.3%20L477.8%20210.9%20L485.7%20222.5%20L494.1%20234%20L502.9%20245.2%20L512.2%20255.8%20L521.8%20265.7%20L531.7%20274.6%20L541.8%20282.3%20L552.1%20288.7%20L562.5%20293.4%20L573%20296.1%20L583.3%20296.5%20L593%20294.3%20L601.8%20290%20L609.8%20284%20L617.2%20276.7%20L624.3%20268.3%20L631.2%20259%20L638.1%20249%20L645.2%20238.5%20L652.4%20227.7%20L659.9%20216.9%20L667.8%20206.3%20L676%20196%20L684.6%20186.3%20L693.5%20177.4%20L702.7%20169.5%20L712%20162.7%20L721.5%20157.3%20L731.1%20153.6%20L740.6%20151.8%20L749.9%20152.2%20L758.7%20154.7%20L767.2%20158.8%20L775.6%20164.4%20L784%20171.2%20L792.2%20179.1%20L800.5%20187.9%20L808.9%20197.3%20L817.3%20207.3%20L825.8%20217.7%20L834.5%20228.2%20L843.2%20238.7%20L852%20249.2%20L860.7%20259.4%20L869.3%20269.2%20L877.8%20278.6%20L885.9%20287.4%20L893.6%20295.5%20L900.8%20302.8%20L907.5%20309.1%20L913.5%20314.4%20L918.8%20318.7%20L923.4%20322.4%20L927.5%20325.6%20L931.1%20328.4%20L934.2%20330.8%20L936.9%20332.9%20L939.3%20334.6%20L941.3%20336.1%20L943.1%20337.4%20L944.6%20338.5%20L945.9%20339.4%20L947.1%20340.3%20L948.2%20341.1%20L949.1%20341.8%20L950.1%20342.7%20L951.1%20343.6%20L952.2%20344.7%20L953.4%20346%20L954.7%20347.6%20L956.3%20349.4%20L958%20351.5%20L959.6%20353.6%20L961.2%20355.8%20L962.8%20358.1%20L964.3%20360.4%20L965.8%20362.8%20L967.3%20365.2%20L968.7%20367.7%20L970%20370.1%20L971.3%20372.6%20L972.6%20375%20L973.8%20377.5%20L974.9%20379.8%20L976%20382.2%20L977%20384.5%20L977.9%20386.7%20L978.8%20388.9%20L979.6%20390.9%20L980.3%20392.9%20L980.9%20394.7%20L981.5%20396.4%20L981.9%20398%20L982.2%20399.6%20L982.4%20401.2%20L982.6%20402.7%20L982.7%20404.2%20L982.7%20405.6%20L982.7%20407%20L982.6%20408.3%20L982.5%20409.6%20L982.4%20410.9%20L982.3%20412.1%20L982.1%20413.2%20L981.9%20414.3%20L981.8%20415.4%20L981.6%20416.4%20L981.5%20417.3%20L981.3%20418.3%20L981.3%20419.2%20L981.3%20419.9%20L986.7%20420.1%20L986.8%20419.5%20L986.8%20418.8%20L986.9%20418.1%20L987%20417.2%20L987.2%20416.2%20L987.4%20415.2%20L987.5%20414%20L987.7%20412.8%20L987.9%20411.5%20L988%20410.1%20L988.1%20408.7%20L988.2%20407.2%20L988.2%20405.6%20L988.2%20403.9%20L988.1%20402.2%20L987.9%20400.5%20L987.6%20398.7%20L987.2%20396.8%20L986.7%20394.9%20L986.1%20392.9%20L985.5%20391%20L984.7%20389%20L983.9%20386.8%20L983%20384.6%20L982%20382.3%20L981%20380%20L979.9%20377.5%20L978.7%20375.1%20L977.5%20372.6%20L976.2%20370%20L974.9%20367.5%20L973.5%20365%20L972%20362.4%20L970.5%20359.9%20L968.9%20357.4%20L967.3%20355%20L965.7%20352.6%20L964%20350.3%20L962.3%20348.1%20L960.6%20345.9%20L958.9%20344%20L957.5%20342.3%20L956.2%20340.9%20L955%20339.7%20L953.8%20338.6%20L952.7%20337.6%20L951.6%20336.7%20L950.4%20335.8%20L949.2%20334.9%20L947.8%20334%20L946.3%20332.9%20L944.5%20331.6%20L942.5%20330.2%20L940.2%20328.5%20L937.5%20326.4%20L934.4%20324%20L930.9%20321.3%20L926.8%20318.1%20L922.2%20314.4%20L917%20310.2%20L911.2%20305.1%20L904.7%20298.9%20L897.5%20291.7%20L889.9%20283.6%20L881.8%20274.9%20L873.5%20265.6%20L864.9%20255.8%20L856.2%20245.6%20L847.4%20235.2%20L838.7%20224.7%20L830.1%20214.2%20L821.5%20203.8%20L813%20193.8%20L804.6%20184.2%20L796.1%20175.2%20L787.6%20167.1%20L778.9%20160%20L770%20154.1%20L760.6%20149.5%20L750.7%20146.8%20L740.2%20146.3%20L729.6%20148.3%20L719.2%20152.4%20L709%20158.1%20L699.2%20165.2%20L689.7%20173.4%20L680.6%20182.6%20L671.8%20192.5%20L663.4%20202.9%20L655.4%20213.7%20L647.8%20224.6%20L640.6%20235.4%20L633.6%20245.9%20L626.7%20255.8%20L620%20264.9%20L613.2%20273%20L606.2%20279.9%20L598.9%20285.3%20L591.2%20289.1%20L582.8%20291%20L573.8%20290.7%20L564.4%20288.2%20L554.7%20283.8%20L544.9%20277.8%20L535.2%20270.4%20L525.6%20261.7%20L516.2%20252.1%20L507.2%20241.7%20L498.5%20230.7%20L490.2%20219.3%20L482.4%20207.8%20L474.9%20196.3%20L467.7%20185.1%20L460.7%20174.5%20L453.9%20164.5%20L447%20155.5%20L440.1%20147.7%20L432.9%20141.3%20L425.4%20136.4%20L417.2%20133.3%20L408.3%20132.4%20L399%20133.7%20L389.3%20136.9%20L379.5%20141.7%20L369.6%20148%20L359.8%20155.4%20L350.1%20163.8%20L340.6%20172.9%20L331.3%20182.6%20L322.3%20192.5%20L313.6%20202.5%20L305.2%20212.3%20L297.1%20221.7%20L289.4%20230.5%20L282%20238.4%20L274.9%20245.1%20L268.1%20250.5%20L261.8%20254.5%20L256%20256.9%20L250.3%20257.9%20L243.7%20257.6%20L236%20255.9%20L227.5%20252.8%20L218.4%20248.3%20L208.9%20242.7%20L199.1%20236.1%20L189%20228.5%20L179%20220.1%20L169%20211.1%20L159.2%20201.6%20L149.6%20191.7%20L140.3%20181.7%20L131.4%20171.6%20L122.9%20161.7%20L114.8%20152.1%20L107.3%20142.9%20L100.3%20134.4%20L93.8%20126.7%20L87.9%20119.9%20L82.5%20114.3%20L77.8%20109.6%20L73.5%20105.3%20L69.8%20101.6%20L66.5%2098.4%20L63.6%2095.5%20L61.1%2093%20L58.9%2090.9%20L57%2089%20L55.3%2087.3%20L53.9%2085.9%20L52.7%2084.6%20L51.5%2083.4%20L50.5%2082.2%20L49.5%2081.1%20L48.6%2079.9%20L47.6%2078.6%20L46.5%2077.2%20L45.4%2075.6%20L44.1%2073.7%20L42.6%2071.7%20L41.1%2069.4%20L39.5%2067.1%20L38%2064.7%20L36.5%2062.3%20L35.1%2059.8%20L33.7%2057.3%20L32.3%2054.8%20L31%2052.3%20L29.7%2049.8%20L28.5%2047.3%20L27.3%2044.9%20L26.1%2042.4%20L25.1%2040.1%20L24%2037.7%20L23.1%2035.4%20L22.2%2033.2%20L21.3%2031.1%20L20.5%2029.1%20L19.8%2027.1%20L19.2%2025.3%20L18.7%2023.6%20L18.3%2021.9%20L17.9%2020.3%20L17.7%2018.8%20L17.5%2017.3%20L17.4%2015.8%20L17.4%2014.4%20L17.4%2013%20L17.5%2011.6%20L17.5%2010.3%20L17.7%209.1%20L17.8%207.9%20L18%206.8%20L18.1%205.7%20L18.3%204.6%20L18.4%203.6%20L18.6%202.6%20L18.7%201.7%20L18.7%200.8%20L18.7%200%20Z%22/%3E%3C/g%3E%3Cuse%20href=%22%23p%22%20transform=%22translate(1000,420)%20scale(-1,1)%22/%3E%3C/svg%3E"); + background-repeat:repeat-y; + background-size:100% calc(var(--fila) * 2); +} +/* La última fila: la misma pasada, pero afilada y cerrada en espiral. */ +.enredadera::after{ + bottom:0; height:var(--fila); + /*@cola*/background-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%201000%20420%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20fill=%22%2314170f%22%20stroke=%22%2314170f%22%20stroke-width=%22.7%22%20stroke-linejoin=%22round%22%20d=%22M11.5%20-0%20L11.5%200.5%20L11.5%201.1%20L11.4%201.8%20L11.3%202.6%20L11.2%203.6%20L11%204.7%20L10.9%205.8%20L10.7%207.1%20L10.6%208.4%20L10.4%209.8%20L10.4%2011.3%20L10.3%2012.9%20L10.3%2014.5%20L10.4%2016.2%20L10.6%2018%20L10.8%2019.8%20L11.1%2021.7%20L11.6%2023.6%20L12.1%2025.5%20L12.8%2027.5%20L13.5%2029.5%20L14.3%2031.5%20L15.1%2033.6%20L16.1%2035.8%20L17.1%2038%20L18.1%2040.4%20L19.3%2042.8%20L20.5%2045.2%20L21.7%2047.6%20L23%2050.1%20L24.4%2052.7%20L25.8%2055.2%20L27.2%2057.7%20L28.7%2060.2%20L30.2%2062.7%20L31.8%2065.2%20L33.4%2067.7%20L35%2070.1%20L36.7%2072.4%20L38.4%2074.7%20L40%2076.8%20L41.3%2078.6%20L42.6%2080.1%20L43.7%2081.6%20L44.8%2082.9%20L45.9%2084.1%20L47%2085.4%20L48.1%2086.6%20L49.3%2087.8%20L50.7%2089.1%20L52.2%2090.5%20L53.9%2092.1%20L55.9%2094%20L58.2%2096.1%20L60.8%2098.4%20L63.7%20101.2%20L67.1%20104.3%20L71%20107.9%20L75.3%20112%20L80.2%20116.6%20L85.6%20122%20L91.6%20128.6%20L98.1%20136.2%20L105.2%20144.7%20L112.7%20153.9%20L120.6%20163.6%20L128.9%20173.8%20L137.5%20184.1%20L146.4%20194.6%20L155.5%20205.1%20L164.7%20215.3%20L174.1%20225.2%20L183.6%20234.6%20L193.1%20243.3%20L202.6%20251.2%20L212.1%20258.2%20L221.6%20264%20L231%20268.6%20L240.4%20271.8%20L249.8%20273.3%20L259.1%20272.7%20L268.3%20270%20L277.3%20265.4%20L286.1%20259.4%20L294.7%20252.1%20L303.2%20243.8%20L311.7%20234.6%20L320.1%20224.9%20L328.5%20214.8%20L336.8%20204.4%20L345.2%20194.1%20L353.4%20184.1%20L361.7%20174.5%20L369.9%20165.7%20L378%20157.7%20L386.1%20150.9%20L394%20145.5%20L401.7%20141.6%20L409.1%20139.4%20L416.4%20138.9%20L423.7%20140.3%20L431.2%20143.5%20L439%20148.4%20L447%20154.9%20L455.1%20162.8%20L463.3%20171.8%20L471.5%20181.7%20L479.8%20192.3%20L488.1%20203.4%20L496.4%20214.8%20L504.7%20226.1%20L513.1%20237.3%20L521.5%20248.1%20L529.9%20258.3%20L538.4%20267.7%20L547%20276%20L555.7%20283.1%20L564.6%20288.7%20L573.7%20292.5%20L583.1%20294.3%20L592.5%20293.7%20L601.7%20291%20L610.6%20286.4%20L619.4%20280.4%20L628%20273.1%20L636.6%20264.8%20L645%20255.6%20L653.4%20245.9%20L661.8%20235.8%20L670.2%20225.4%20L678.5%20215.1%20L686.8%20205.1%20L695%20195.5%20L703.2%20186.7%20L711.4%20178.7%20L719.4%20171.9%20L727.3%20166.5%20L735%20162.6%20L742.5%20160.4%20L749.8%20159.9%20L757.4%20161.2%20L765.4%20164%20L773.9%20168.2%20L782.6%20173.8%20L791.5%20180.6%20L800.6%20188.4%20L809.8%20197%20L818.9%20206.3%20L828.1%20216.2%20L837.1%20226.5%20L846.1%20236.9%20L854.8%20247.4%20L863.4%20257.8%20L871.7%20267.9%20L879.6%20277.6%20L887.3%20286.7%20L894.6%20295.1%20L901.4%20302.6%20L907.8%20309%20L913.8%20314.3%20L919.3%20318.3%20L924.2%20321.7%20L928.7%20324.5%20L932.9%20326.7%20L936.7%20328.4%20L940.2%20329.7%20L943.3%20330.6%20L946.3%20331.2%20L948.9%20331.5%20L951.4%20331.5%20L953.6%20331.4%20L955.5%20331.2%20L957.2%20331%20L958.7%20330.8%20L960%20330.7%20L961.1%20330.7%20L962.2%20330.8%20L963.3%20331.1%20L964.5%20331.7%20L966%20332.6%20L967.6%20333.9%20L969.3%20335.2%20L970.9%20336.7%20L972.5%20338.2%20L974%20339.8%20L975.4%20341.5%20L976.8%20343.2%20L978.1%20344.9%20L979.4%20346.7%20L980.6%20348.5%20L981.6%20350.3%20L982.7%20352.2%20L983.6%20354%20L984.4%20355.8%20L985.2%20357.6%20L985.8%20359.4%20L986.4%20361.2%20L986.8%20362.9%20L987.2%20364.5%20L987.4%20366.1%20L987.5%20367.6%20L987.6%20369.1%20L987.5%20370.7%20L987.3%20372.4%20L987%20374%20L986.6%20375.7%20L986.1%20377.3%20L985.6%20379%20L984.9%20380.7%20L984.2%20382.3%20L983.4%20383.9%20L982.5%20385.5%20L981.6%20387.1%20L980.6%20388.6%20L979.5%20390%20L978.5%20391.4%20L977.3%20392.8%20L976.2%20394.1%20L975%20395.3%20L973.8%20396.3%20L972.5%20397.4%20L971.1%20398.3%20L969.6%20399.3%20L968%20400.2%20L966.4%20401.1%20L964.6%20401.9%20L962.8%20402.7%20L960.9%20403.4%20L959%20404.1%20L957.1%20404.7%20L955.1%20405.3%20L953.1%20405.8%20L951.1%20406.3%20L949.1%20406.7%20L947.2%20407.1%20L945.2%20407.4%20L943.3%20407.6%20L941.5%20407.8%20L939.7%20407.9%20L938%20407.9%20L936.4%20407.8%20L934.7%20407.6%20L932.9%20407.3%20L931.1%20406.9%20L929.2%20406.4%20L927.4%20405.8%20L925.5%20405.1%20L923.6%20404.4%20L921.8%20403.6%20L920%20402.8%20L918.2%20402%20L916.5%20401.2%20L914.8%20400.4%20L913.2%20399.6%20L911.7%20398.8%20L910.3%20398.1%20L908.9%20397.5%20L907.7%20396.9%20L906.6%20396.4%20L905.7%20396%20L904.3%20399.6%20L905.2%20399.9%20L906.2%20400.3%20L907.3%20400.9%20L908.6%20401.5%20L910%20402.2%20L911.5%20403%20L913.1%20403.8%20L914.8%20404.6%20L916.6%20405.4%20L918.4%20406.3%20L920.3%20407.1%20L922.2%20407.9%20L924.2%20408.7%20L926.2%20409.4%20L928.1%20410%20L930.1%20410.6%20L932.1%20411%20L934.1%20411.4%20L936.1%20411.6%20L938%20411.7%20L939.9%20411.7%20L941.8%20411.6%20L943.7%20411.4%20L945.8%20411.1%20L947.8%20410.8%20L949.9%20410.5%20L951.9%20410%20L954%20409.5%20L956.1%20409%20L958.2%20408.4%20L960.2%20407.7%20L962.3%20407%20L964.2%20406.2%20L966.2%20405.4%20L968%20404.5%20L969.9%20403.5%20L971.6%20402.5%20L973.2%20401.5%20L974.8%20400.4%20L976.2%20399.3%20L977.6%20398%20L978.9%20396.8%20L980.3%20395.5%20L981.5%20394%20L982.8%20392.6%20L984%20391%20L985.1%20389.4%20L986.2%20387.8%20L987.2%20386%20L988.2%20384.3%20L989.1%20382.5%20L989.9%20380.7%20L990.6%20378.8%20L991.2%20377%20L991.7%20375.1%20L992.2%20373.2%20L992.5%20371.3%20L992.6%20369.4%20L992.7%20367.4%20L992.6%20365.5%20L992.4%20363.6%20L992.1%20361.7%20L991.6%20359.7%20L991.1%20357.7%20L990.4%20355.7%20L989.7%20353.7%20L988.8%20351.6%20L987.9%20349.6%20L986.9%20347.5%20L985.7%20345.4%20L984.5%20343.4%20L983.2%20341.4%20L981.9%20339.4%20L980.4%20337.5%20L978.9%20335.6%20L977.3%20333.7%20L975.6%20331.9%20L973.8%20330.2%20L972%20328.6%20L970%20327%20L968%20325.6%20L965.9%20324.6%20L963.8%20323.9%20L961.8%20323.5%20L959.9%20323.4%20L958.1%20323.5%20L956.4%20323.7%20L954.7%20323.8%20L953.1%20324%20L951.4%20324%20L949.6%20323.9%20L947.6%20323.6%20L945.3%20323.1%20L942.8%20322.2%20L939.9%20321.1%20L936.7%20319.4%20L933%20317.3%20L929%20314.6%20L924.5%20311.3%20L919.5%20307.3%20L914%20302.5%20L907.9%20296.4%20L901.3%20289.1%20L894.1%20280.9%20L886.6%20271.9%20L878.6%20262.2%20L870.3%20252.1%20L861.8%20241.7%20L853%20231.1%20L843.9%20220.6%20L834.8%20210.2%20L825.5%20200.1%20L816.1%20190.6%20L806.6%20181.7%20L797.2%20173.6%20L787.8%20166.4%20L778.3%20160.4%20L769%20155.7%20L759.6%20152.4%20L750.2%20150.9%20L740.9%20151.5%20L731.7%20154.2%20L722.7%20158.8%20L713.9%20164.8%20L705.3%20172.1%20L696.8%20180.4%20L688.3%20189.6%20L679.9%20199.3%20L671.5%20209.4%20L663.2%20219.8%20L654.8%20230.1%20L646.6%20240.1%20L638.3%20249.7%20L630.1%20258.5%20L622%20266.5%20L613.9%20273.3%20L606%20278.7%20L598.3%20282.6%20L590.9%20284.8%20L583.6%20285.3%20L576.3%20283.9%20L568.8%20280.7%20L561%20275.8%20L553%20269.3%20L544.9%20261.4%20L536.7%20252.4%20L528.5%20242.5%20L520.2%20231.9%20L511.9%20220.8%20L503.6%20209.4%20L495.3%20198.1%20L486.9%20186.9%20L478.5%20176.1%20L470.1%20165.9%20L461.6%20156.5%20L453%20148.2%20L444.3%20141.1%20L435.4%20135.5%20L426.3%20131.7%20L416.9%20129.9%20L407.5%20130.5%20L398.3%20133.2%20L389.4%20137.8%20L380.6%20143.8%20L372%20151.1%20L363.4%20159.4%20L355%20168.6%20L346.6%20178.3%20L338.2%20188.4%20L329.8%20198.8%20L321.5%20209.1%20L313.2%20219.1%20L305%20228.7%20L296.8%20237.5%20L288.6%20245.5%20L280.6%20252.3%20L272.7%20257.7%20L265%20261.6%20L257.5%20263.8%20L250.2%20264.3%20L242.6%20263.1%20L234.5%20260.3%20L226%20256.2%20L217.2%20250.7%20L208.2%20244.1%20L199%20236.5%20L189.8%20228%20L180.5%20218.9%20L171.3%20209.2%20L162.2%20199.1%20L153.2%20188.8%20L144.4%20178.4%20L135.9%20168%20L127.6%20157.9%20L119.7%20148.2%20L112.1%20139%20L105%20130.4%20L98.3%20122.6%20L92.1%20115.8%20L86.5%20110.2%20L81.5%20105.5%20L77.1%20101.4%20L73.3%2097.8%20L69.8%2094.6%20L66.9%2091.8%20L64.3%2089.4%20L62%2087.4%20L60.1%2085.6%20L58.4%2084%20L56.9%2082.6%20L55.7%2081.4%20L54.6%2080.3%20L53.6%2079.2%20L52.6%2078.2%20L51.7%2077.1%20L50.7%2075.9%20L49.7%2074.6%20L48.5%2073.1%20L47.1%2071.3%20L45.6%2069.3%20L44%2067.1%20L42.4%2064.9%20L40.9%2062.7%20L39.4%2060.3%20L37.9%2058%20L36.4%2055.6%20L35%2053.2%20L33.6%2050.8%20L32.3%2048.3%20L31%2045.9%20L29.7%2043.5%20L28.5%2041.2%20L27.4%2038.9%20L26.3%2036.6%20L25.3%2034.4%20L24.3%2032.2%20L23.4%2030.1%20L22.6%2028.1%20L21.9%2026.2%20L21.2%2024.5%20L20.7%2022.9%20L20.3%2021.4%20L20%2019.9%20L19.7%2018.4%20L19.5%2017%20L19.4%2015.6%20L19.3%2014.3%20L19.3%2013%20L19.4%2011.7%20L19.4%2010.4%20L19.5%209.2%20L19.6%208.1%20L19.8%207%20L19.9%205.9%20L20.1%204.8%20L20.2%203.8%20L20.3%202.8%20L20.4%201.8%20L20.5%200.8%20L20.5%200%20Z%22/%3E%3Cpath%20fill=%22%23ff00aa%22%20stroke=%22%23ff00aa%22%20stroke-width=%22.6%22%20stroke-linejoin=%22round%22%20d=%22M13.3%20-0%20L13.2%200.6%20L13.2%201.2%20L13.1%202%20L13%202.8%20L12.9%203.8%20L12.7%204.8%20L12.5%206%20L12.4%207.2%20L12.2%208.5%20L12.1%209.9%20L12%2011.3%20L11.9%2012.8%20L11.9%2014.4%20L11.9%2016.1%20L12.1%2017.8%20L12.3%2019.5%20L12.5%2021.3%20L12.9%2023.2%20L13.4%2025.1%20L14%2027%20L14.7%2028.9%20L15.4%2031%20L16.2%2033.1%20L17.1%2035.3%20L18%2037.5%20L19%2039.9%20L20.1%2042.3%20L21.2%2044.7%20L22.4%2047.2%20L23.6%2049.7%20L24.9%2052.3%20L26.2%2054.8%20L27.6%2057.4%20L29%2060%20L30.4%2062.5%20L31.9%2065%20L33.4%2067.5%20L35%2070%20L36.6%2072.4%20L38.2%2074.7%20L39.7%2076.8%20L41%2078.7%20L42.2%2080.3%20L43.3%2081.8%20L44.4%2083.2%20L45.4%2084.4%20L46.5%2085.7%20L47.6%2086.9%20L48.8%2088.2%20L50.1%2089.6%20L51.6%2091.1%20L53.2%2092.8%20L55.1%2094.6%20L57.3%2096.8%20L59.9%2099.3%20L62.7%20102.1%20L66%20105.4%20L69.8%20109.1%20L74%20113.3%20L78.7%20118%20L83.9%20123.5%20L89.7%20130.2%20L96.1%20137.8%20L103.1%20146.4%20L110.6%20155.6%20L118.6%20165.3%20L127%20175.4%20L135.9%20185.6%20L145.1%20195.9%20L154.7%20205.9%20L164.5%20215.7%20L174.6%20225%20L184.7%20233.7%20L194.9%20241.6%20L205%20248.6%20L214.9%20254.6%20L224.5%20259.3%20L233.8%20262.8%20L242.5%20264.8%20L250.5%20265.2%20L257.8%20263.9%20L265%20260.9%20L272.2%20256.3%20L279.4%20250.4%20L286.8%20243.1%20L294.2%20234.8%20L301.9%20225.7%20L309.7%20216%20L317.7%20205.9%20L325.9%20195.6%20L334.4%20185.5%20L343.2%20175.6%20L352.1%20166.3%20L361.3%20157.6%20L370.6%20150%20L380%20143.5%20L389.4%20138.4%20L398.7%20134.9%20L407.7%20133.4%20L416.3%20133.9%20L424.4%20136.6%20L432%20141.2%20L439.2%20147.5%20L446.2%20155.2%20L452.9%20164.3%20L459.6%20174.4%20L466.3%20185.4%20L473.1%20197%20L480.1%20209%20L487.3%20221.1%20L494.9%20233.2%20L502.8%20245%20L511.2%20256.4%20L520%20267%20L529.2%20276.7%20L538.9%20285.3%20L549.1%20292.5%20L559.8%20298.2%20L571.1%20301.9%20L582.8%20303.1%20L594.1%20301.2%20L604.4%20296.8%20L613.6%20290.6%20L621.9%20282.9%20L629.5%20274.1%20L636.7%20264.3%20L643.6%20253.8%20L650.4%20242.7%20L657.1%20231.4%20L663.9%20219.9%20L670.9%20208.6%20L678.2%20197.5%20L685.8%20187%20L693.8%20177.3%20L702.1%20168.5%20L710.9%20160.8%20L720.1%20154.4%20L729.8%20149.7%20L740%20147%20L750.3%20146.8%20L760.3%20148.9%20L769.9%20153%20L779.1%20158.6%20L788%20165.6%20L796.6%20173.8%20L805.1%20182.9%20L813.3%20192.9%20L821.4%20203.6%20L829.3%20214.6%20L837.2%20226%20L845.1%20237.4%20L852.9%20248.7%20L860.7%20259.8%20L868.5%20270.4%20L876.1%20280.4%20L883.7%20289.8%20L891%20298.3%20L898.1%20305.8%20L904.9%20312.3%20L911.2%20317.5%20L917%20321.5%20L922.2%20324.8%20L927.1%20327.5%20L931.5%20329.7%20L935.5%20331.3%20L939.3%20332.5%20L942.8%20333.3%20L946%20333.8%20L948.9%20334%20L951.5%20333.9%20L953.8%20333.7%20L955.9%20333.4%20L957.6%20333%20L959%20332.7%20L960.2%20332.6%20L961.2%20332.5%20L962%20332.5%20L962.8%20332.7%20L963.8%20333.1%20L965.2%20333.8%20L966.9%20335%20L968.6%20336.2%20L970.3%20337.5%20L971.9%20339%20L973.5%20340.5%20L975%20342%20L976.4%20343.6%20L977.8%20345.3%20L979.2%20347%20L980.4%20348.7%20L981.6%20350.5%20L982.7%20352.3%20L983.7%20354.1%20L984.6%20355.9%20L985.4%20357.6%20L986.2%20359.4%20L986.8%20361.1%20L987.3%20362.8%20L987.7%20364.5%20L988%20366.1%20L988.2%20367.6%20L988.3%20369.2%20L988.3%20370.9%20L988.1%20372.6%20L987.9%20374.3%20L987.5%20376%20L987.1%20377.7%20L986.5%20379.4%20L985.9%20381.2%20L985.2%20382.9%20L984.4%20384.5%20L983.6%20386.2%20L982.6%20387.8%20L981.6%20389.4%20L980.6%20390.9%20L979.5%20392.4%20L978.4%20393.7%20L977.2%20395.1%20L976%20396.3%20L974.7%20397.5%20L973.4%20398.6%20L972%20399.6%20L970.4%20400.6%20L968.8%20401.6%20L967.1%20402.5%20L965.3%20403.4%20L963.4%20404.2%20L961.5%20404.9%20L959.5%20405.7%20L957.5%20406.3%20L955.5%20406.9%20L953.5%20407.4%20L951.5%20407.9%20L949.5%20408.3%20L947.4%20408.7%20L945.5%20408.9%20L943.5%20409.1%20L941.6%20409.3%20L939.8%20409.4%20L938%20409.4%20L936.3%20409.3%20L934.5%20409.1%20L932.6%20408.7%20L930.8%20408.2%20L928.9%20407.7%20L927%20407%20L925.1%20406.3%20L923.2%20405.5%20L921.3%20404.7%20L919.5%20403.9%20L917.7%20403%20L916%20402.1%20L914.4%20401.3%20L912.8%20400.4%20L911.3%20399.7%20L909.9%20398.9%20L908.6%20398.3%20L907.4%20397.7%20L906.3%20397.2%20L905.4%20396.8%20L904.6%20398.8%20L905.4%20399.2%20L906.5%20399.6%20L907.6%20400.2%20L908.9%20400.9%20L910.3%20401.6%20L911.8%20402.4%20L913.4%20403.2%20L915%20404.1%20L916.8%20405%20L918.6%20405.8%20L920.4%20406.7%20L922.3%20407.5%20L924.3%20408.3%20L926.2%20409.1%20L928.2%20409.8%20L930.2%20410.4%20L932.2%20410.8%20L934.1%20411.2%20L936.1%20411.5%20L938%20411.6%20L939.8%20411.6%20L941.8%20411.5%20L943.7%20411.3%20L945.7%20411.1%20L947.8%20410.8%20L949.9%20410.5%20L951.9%20410%20L954%20409.6%20L956.1%20409%20L958.2%20408.4%20L960.3%20407.7%20L962.3%20407%20L964.3%20406.2%20L966.2%20405.4%20L968.1%20404.5%20L969.9%20403.5%20L971.6%20402.5%20L973.2%20401.4%20L974.8%20400.3%20L976.2%20399.2%20L977.5%20398%20L978.9%20396.7%20L980.1%20395.3%20L981.4%20393.9%20L982.6%20392.4%20L983.7%20390.8%20L984.8%20389.2%20L985.8%20387.5%20L986.8%20385.8%20L987.7%20384%20L988.5%20382.2%20L989.2%20380.4%20L989.8%20378.5%20L990.3%20376.7%20L990.8%20374.8%20L991.1%20372.9%20L991.3%20371.1%20L991.4%20369.2%20L991.3%20367.4%20L991.2%20365.6%20L990.8%20363.8%20L990.4%20362%20L989.9%20360.1%20L989.3%20358.2%20L988.5%20356.3%20L987.7%20354.4%20L986.8%20352.5%20L985.7%20350.5%20L984.6%20348.6%20L983.4%20346.7%20L982.1%20344.8%20L980.7%20343%20L979.3%20341.2%20L977.8%20339.4%20L976.2%20337.7%20L974.6%20336.1%20L972.9%20334.5%20L971.1%20333%20L969.3%20331.6%20L967.4%20330.4%20L965.7%20329.3%20L964%20328.7%20L962.6%20328.4%20L961.2%20328.2%20L959.8%20328.3%20L958.3%20328.5%20L956.8%20328.7%20L955.1%20329%20L953.3%20329.3%20L951.3%20329.5%20L949%20329.5%20L946.5%20329.3%20L943.7%20328.8%20L940.6%20328%20L937.3%20326.8%20L933.5%20325.2%20L929.4%20323.1%20L924.9%20320.4%20L920%20317.2%20L914.5%20313.2%20L908.5%20308.2%20L902%20302%20L895.1%20294.6%20L887.9%20286.2%20L880.5%20277%20L872.9%20267.1%20L865.2%20256.6%20L857.4%20245.6%20L849.6%20234.3%20L841.8%20222.9%20L833.8%20211.5%20L825.8%20200.3%20L817.6%20189.5%20L809.2%20179.3%20L800.6%20169.9%20L791.6%20161.4%20L782.2%20154.1%20L772.4%20148.1%20L762%20143.7%20L750.8%20141.3%20L739.2%20141.6%20L727.8%20144.6%20L717.3%20149.7%20L707.5%20156.4%20L698.3%20164.5%20L689.6%20173.6%20L681.4%20183.7%20L673.7%20194.4%20L666.3%20205.6%20L659.2%20217.1%20L652.4%20228.6%20L645.7%20239.9%20L639%20250.8%20L632.2%20261.2%20L625.2%20270.6%20L617.9%20279.1%20L610.1%20286.3%20L601.8%20292%20L592.6%20295.9%20L582.6%20297.6%20L572.2%20296.5%20L561.9%20293.2%20L552%20287.9%20L542.3%20281%20L533%20272.7%20L524.1%20263.3%20L515.5%20253%20L507.3%20241.9%20L499.5%20230.2%20L492%20218.3%20L484.8%20206.2%20L477.9%20194.2%20L471.1%20182.5%20L464.3%20171.4%20L457.4%20161.1%20L450.4%20151.7%20L443.1%20143.6%20L435.2%20136.8%20L426.7%20131.6%20L417.4%20128.5%20L407.4%20127.9%20L397.2%20129.6%20L387.1%20133.4%20L377.1%20138.8%20L367.3%20145.6%20L357.7%20153.5%20L348.3%20162.3%20L339.1%20171.9%20L330.3%20181.9%20L321.7%20192.1%20L313.4%20202.4%20L305.4%20212.5%20L297.6%20222.2%20L290.1%20231.2%20L282.8%20239.3%20L275.7%20246.3%20L268.9%20251.9%20L262.4%20256%20L256.3%20258.6%20L250.2%20259.7%20L243.3%20259.3%20L235.4%20257.5%20L226.7%20254.3%20L217.5%20249.7%20L208%20244%20L198.1%20237.2%20L188.2%20229.4%20L178.2%20220.9%20L168.3%20211.7%20L158.6%20202.1%20L149.2%20192.1%20L140%20182%20L131.2%20171.8%20L122.8%20161.8%20L114.8%20152.1%20L107.4%20142.9%20L100.4%20134.3%20L93.9%20126.6%20L88%20119.8%20L82.7%20114.2%20L77.9%20109.4%20L73.7%20105.2%20L69.9%20101.5%20L66.6%2098.2%20L63.7%2095.4%20L61.2%2092.9%20L59%2090.7%20L57.1%2088.9%20L55.5%2087.2%20L54%2085.8%20L52.8%2084.5%20L51.7%2083.2%20L50.6%2082.1%20L49.6%2080.9%20L48.7%2079.7%20L47.7%2078.5%20L46.7%2077.1%20L45.5%2075.5%20L44.2%2073.7%20L42.7%2071.6%20L41.2%2069.3%20L39.6%2067%20L38.1%2064.6%20L36.6%2062.2%20L35.2%2059.7%20L33.8%2057.3%20L32.4%2054.8%20L31.1%2052.3%20L29.8%2049.8%20L28.5%2047.3%20L27.4%2044.8%20L26.2%2042.4%20L25.1%2040%20L24.1%2037.7%20L23.1%2035.4%20L22.2%2033.2%20L21.3%2031.1%20L20.6%2029%20L19.9%2027.1%20L19.2%2025.3%20L18.7%2023.6%20L18.3%2021.9%20L18%2020.3%20L17.7%2018.8%20L17.5%2017.3%20L17.4%2015.8%20L17.4%2014.4%20L17.4%2013%20L17.5%2011.6%20L17.6%2010.3%20L17.7%209.1%20L17.8%207.9%20L18%206.8%20L18.1%205.7%20L18.3%204.6%20L18.4%203.6%20L18.6%202.6%20L18.7%201.7%20L18.7%200.8%20L18.7%200%20Z%22/%3E%3Cpath%20fill=%22%2300d18e%22%20d=%22M906.3%20396.4%20L903.4%20393.7%20L900.8%20390.8%20L898.5%20387.8%20L896.5%20384.8%20L894.9%20381.6%20L893.5%20378.4%20L892.4%20375.2%20L891.6%20372%20L891.1%20368.8%20L890.9%20365.7%20L890.9%20362.7%20L891.2%20359.7%20L891.7%20356.8%20L892.4%20354.1%20L893.3%20351.5%20L894.4%20349%20L895.7%20346.8%20L897.1%20344.6%20L898.7%20342.7%20L900.3%20340.9%20L902.1%20339.3%20L903.9%20337.9%20L905.8%20336.7%20L907.7%20335.7%20L909.7%20334.9%20L911.7%20334.2%20L913.6%20333.7%20L915.6%20333.4%20L917.5%20333.3%20L919.4%20333.3%20L921.2%20333.5%20L923%20333.8%20L924.6%20334.2%20L926.2%20334.8%20L927.7%20335.5%20L929.1%20336.2%20L930.4%20337.1%20L931.6%20338.1%20L932.7%20339.1%20L933.7%20340.2%20L934.5%20341.3%20L935.3%20342.4%20L935.9%20343.6%20L936.4%20344.8%20L936.8%20346%20L937.1%20347.2%20L937.3%20348.4%20L937.4%20349.6%20L937.4%20350.8%20L937.3%20351.9%20L937.1%20353%20L936.8%20354%20L936.5%20355%20L936%20355.9%20L935.6%20356.7%20L935%20357.5%20L934.5%20358.3%20L933.8%20358.9%20L933.2%20359.5%20L932.5%20360%20L931.8%20360.5%20L931%20360.9%20L930.3%20361.2%20L929.6%20361.4%20L928.8%20361.6%20L928.1%20361.7%20L927.4%20361.8%20L926.7%20361.8%20L926%20361.7%20L925.4%20361.6%20L924.7%20361.4%20L924.1%20361.2%20L923.6%20361%20L923%20360.7%20L922.6%20360.3%20L922.1%20360%20L921.7%20359.6%20L921.3%20359.2%20L921%20358.8%20L920.7%20358.4%20L920.5%20357.9%20L920.3%20357.5%20L920.2%20357%20L920.1%20356.6%20L920%20356.1%20L920%20355.7%20L920%20355.3%20L920%20354.8%20L920.1%20354.4%20L920.2%20354.1%20L920.3%20353.7%20L920.5%20353.4%20L920.6%20353%20L920.8%20352.7%20L921%20352.5%20L921.3%20352.2%20L921.5%20352%20L921.8%20351.8%20L922%20351.6%20L922.3%20351.5%20L922.6%20351.4%20L922.8%20351.3%20L923.1%20351.2%20L923.4%20351.2%20L923.7%20351.1%20L923.9%20351.1%20L924.2%20351.2%20L924.4%20351.2%20L924.7%20351.2%20L924.9%20351.3%20L925.1%20350.8%20L924.9%20350.6%20L924.6%20350.6%20L924.3%20350.5%20L924%20350.4%20L923.7%20350.4%20L923.3%20350.4%20L923%20350.5%20L922.7%20350.5%20L922.3%20350.6%20L922%20350.8%20L921.6%20350.9%20L921.3%20351.1%20L921%20351.3%20L920.7%20351.6%20L920.4%20351.9%20L920.1%20352.2%20L919.9%20352.5%20L919.6%20352.9%20L919.4%20353.3%20L919.3%20353.8%20L919.1%20354.2%20L919%20354.7%20L919%20355.2%20L918.9%20355.7%20L919%20356.2%20L919%20356.8%20L919.1%20357.3%20L919.3%20357.8%20L919.5%20358.4%20L919.8%20358.9%20L920.1%20359.4%20L920.4%20359.9%20L920.9%20360.4%20L921.3%20360.9%20L921.8%20361.3%20L922.4%20361.7%20L923%20362.1%20L923.6%20362.4%20L924.3%20362.6%20L925.1%20362.9%20L925.8%20363%20L926.6%20363.1%20L927.4%20363.1%20L928.2%20363.1%20L929.1%20363%20L930%20362.8%20L930.8%20362.6%20L931.7%20362.2%20L932.5%20361.8%20L933.3%20361.3%20L934.1%20360.7%20L934.9%20360.1%20L935.6%20359.3%20L936.3%20358.5%20L937%20357.6%20L937.5%20356.6%20L938%20355.6%20L938.4%20354.5%20L938.8%20353.3%20L939%20352.1%20L939.2%20350.9%20L939.2%20349.6%20L939.1%20348.2%20L939%20346.9%20L938.7%20345.5%20L938.2%20344.2%20L937.7%20342.8%20L937%20341.5%20L936.2%20340.1%20L935.3%20338.9%20L934.2%20337.6%20L933%20336.5%20L931.7%20335.4%20L930.3%20334.4%20L928.7%20333.5%20L927.1%20332.7%20L925.3%20332%20L923.5%20331.5%20L921.5%20331.1%20L919.5%20330.9%20L917.4%20330.9%20L915.3%20331%20L913.2%20331.3%20L911%20331.8%20L908.8%20332.4%20L906.6%20333.3%20L904.5%20334.4%20L902.4%20335.7%20L900.3%20337.2%20L898.4%20338.9%20L896.5%20340.8%20L894.8%20342.9%20L893.2%20345.2%20L891.8%20347.7%20L890.6%20350.4%20L889.5%20353.2%20L888.7%20356.2%20L888.1%20359.3%20L887.7%20362.5%20L887.6%20365.8%20L887.8%20369.2%20L888.3%20372.7%20L889.1%20376.1%20L890.2%20379.6%20L891.7%20383.1%20L893.4%20386.6%20L895.5%20389.9%20L897.9%20393.2%20L900.7%20396.3%20L903.7%20399.2%20Z%22/%3E%3C/svg%3E"); + background-size:100% 100%; + transform:scaleX(var(--remate,1)); +} +/* Si la última fila es PAR, la pasada va de derecha a izquierda y el remate se + pinta en espejo. Se sabe por dónde cae el último
  • dentro de la tanda de + doce, así que sigue sin haber nada que tocar al añadir una hoja. */ +.enredadera:has(> li:last-child:nth-child(12n+7)), +.enredadera:has(> li:last-child:nth-child(12n+8)), +.enredadera:has(> li:last-child:nth-child(12n+9)), +.enredadera:has(> li:last-child:nth-child(12n+10)), +.enredadera:has(> li:last-child:nth-child(12n+11)), +.enredadera:has(> li:last-child:nth-child(12n+12)){ --remate:-1; } + /* Cada celda sostiene una hoja. La hoja se ancla al punto exacto por el que pasa la raíz en esa columna (--y), calculado del mismo dibujo. */ .enredadera > li{ position:relative; } @@ -336,12 +375,20 @@ img{ max-width:100%; height:auto; display:block; } cuando la primera termina, y la 13 seguiría la cuenta sin tocar nada. */ animation-delay:calc(var(--tanda,0s) + var(--fila-tanda,0s)); } -.enredadera > li:nth-child(6n+1){ --tanda:0s; } -.enredadera > li:nth-child(6n+2){ --tanda:.06s; } -.enredadera > li:nth-child(6n+3){ --tanda:.12s; } -.enredadera > li:nth-child(6n+4){ --tanda:.18s; } -.enredadera > li:nth-child(6n+5){ --tanda:.24s; } -.enredadera > li:nth-child(6n+6){ --tanda:.30s; } +.enredadera > li:nth-child(12n+1){ --tanda:0s; } +.enredadera > li:nth-child(12n+2){ --tanda:.06s;} +.enredadera > li:nth-child(12n+3){ --tanda:.12s;} +.enredadera > li:nth-child(12n+4){ --tanda:.18s;} +.enredadera > li:nth-child(12n+5){ --tanda:.24s;} +.enredadera > li:nth-child(12n+6){ --tanda:.30s;} +/* La fila par va al revés: el tallo la recorre de derecha a izquierda, + así que la hoja que brota primero es la de la última columna. */ +.enredadera > li:nth-child(12n+7){ --tanda:.30s;} +.enredadera > li:nth-child(12n+8){ --tanda:.24s;} +.enredadera > li:nth-child(12n+9){ --tanda:.18s;} +.enredadera > li:nth-child(12n+10){ --tanda:.12s;} +.enredadera > li:nth-child(12n+11){ --tanda:.06s;} +.enredadera > li:nth-child(12n+12){ --tanda:0s; } .enredadera > li:nth-child(n+7) { --fila-tanda:.36s; } .enredadera > li:nth-child(n+13) { --fila-tanda:.72s; } @@ -422,26 +469,42 @@ img{ max-width:100%; height:auto; display:block; } .hoja.brota:focus-visible .hoja-svg, .hoja.brota:active .hoja-svg{ opacity:1; } -/* Los seis puntos por los que pasa la raíz. Alternan cresta y valle: de las +/* Los puntos por los que pasa la raíz. Alternan cresta y valle: de las crestas cuelga una hoja hacia abajo y de los valles sale una hacia arriba, así cada hoja ocupa el hueco que la raíz le deja y no se pisan. Vecinas se inclinan a lados opuestos. Todo sale del mismo cálculo que dibujó la raíz. - Añadir una hoja sigue siendo añadir un
  • . */ -.enredadera > li:nth-child(6n+1){ --y:27.0; } -.enredadera > li:nth-child(6n+1) .hoja{ --giro:2deg; --tam:1.04; } -.enredadera > li:nth-child(6n+2){ --y:64.0; } -.enredadera > li:nth-child(6n+2) .hoja{ --giro:151deg; --tam:1.00; } -.enredadera > li:nth-child(6n+3){ --y:32.0; } -.enredadera > li:nth-child(6n+3) .hoja{ --giro:26deg; --tam:1.1; } -.enredadera > li:nth-child(6n+4){ --y:69.0; } -.enredadera > li:nth-child(6n+4) .hoja{ --giro:154deg; --tam:0.92; } -.enredadera > li:nth-child(6n+5){ --y:37.0; } -.enredadera > li:nth-child(6n+5) .hoja{ --giro:31deg; --tam:1.0; } -.enredadera > li:nth-child(6n+6){ --y:74.0; } + La tanda es de DOCE y no de seis porque el dibujo del tallo son dos filas: + la pasada y su espejo. Añadir una hoja sigue siendo añadir un
  • . */ +.enredadera > li:nth-child(12n+1){ --y:27.0; } +.enredadera > li:nth-child(12n+1) .hoja{ --giro:2deg; --tam:1.04; } +.enredadera > li:nth-child(12n+2){ --y:64.0; } +.enredadera > li:nth-child(12n+2) .hoja{ --giro:151deg; --tam:1.00; } +.enredadera > li:nth-child(12n+3){ --y:32.0; } +.enredadera > li:nth-child(12n+3) .hoja{ --giro:26deg; --tam:1.1; } +.enredadera > li:nth-child(12n+4){ --y:69.0; } +.enredadera > li:nth-child(12n+4) .hoja{ --giro:154deg; --tam:0.92; } +.enredadera > li:nth-child(12n+5){ --y:37.0; } +.enredadera > li:nth-child(12n+5) .hoja{ --giro:31deg; --tam:1.0; } +.enredadera > li:nth-child(12n+6){ --y:74.0; } /* La última va más derecha que sus hermanas de valle (151 y 154): a 149 se cruzaba con la raíz por el lóbulo de abajo y la etiqueta caía encima del trazo. Y es la más grande porque cierra la fila. */ -.enredadera > li:nth-child(6n+6) .hoja{ --giro:164deg; --tam:1.16; } +.enredadera > li:nth-child(12n+6) .hoja{ --giro:164deg; --tam:1.16; } +/* La fila par lleva el dibujo en espejo, así que sus seis anclajes son + los mismos leídos del revés y las hojas se inclinan al otro lado: el + giro cambia de signo. Es la misma cuenta, reflejada. */ +.enredadera > li:nth-child(12n+7){ --y:74.0; } +.enredadera > li:nth-child(12n+7) .hoja{ --giro:-164deg; --tam:1.16; } +.enredadera > li:nth-child(12n+8){ --y:37.0; } +.enredadera > li:nth-child(12n+8) .hoja{ --giro:-31deg; --tam:1.0; } +.enredadera > li:nth-child(12n+9){ --y:69.0; } +.enredadera > li:nth-child(12n+9) .hoja{ --giro:-154deg; --tam:0.92; } +.enredadera > li:nth-child(12n+10){ --y:32.0; } +.enredadera > li:nth-child(12n+10) .hoja{ --giro:-26deg; --tam:1.1; } +.enredadera > li:nth-child(12n+11){ --y:64.0; } +.enredadera > li:nth-child(12n+11) .hoja{ --giro:-151deg; --tam:1.00; } +.enredadera > li:nth-child(12n+12){ --y:27.0; } +.enredadera > li:nth-child(12n+12) .hoja{ --giro:-2deg; --tam:1.04; } /* ============================ 6. FICHAS ============================ */ .ficha{ @@ -738,9 +801,12 @@ gancio-calendar{ background-size:var(--celda) 100%; } .enredadera{ - display:block; background-image:none; + display:block; grid-template-columns:none; } + /* Aquí el tallo lo pone cada
  • , así que las dos capas de escritorio + —la serpentina y el remate— sobran. */ + .enredadera::before, .enredadera::after{ display:none; } .enredadera > li{ transform-origin:50% 0; /* aqui la hoja se agarra arriba del li */ display:flex; justify-content:center; @@ -807,6 +873,11 @@ gancio-calendar{ .brotes{ --r:calc(var(--fila) * .27); + /* El ancho de la hoja pequeña. Se mide contra las DOS dimensiones, como las + hojas de móvil: sólo con vw, en una pantalla baja —1280x720— los tres + brotes y sus etiquetas no caben en el hueco que deja la enredadera y se + pisaban entre ellos. */ + --brote:calc(clamp(78px, min(7.6vw, 12vh), 128px) * .80); position:absolute; left:50%; top:calc(var(--y,50) / 100 * var(--fila)); width:0; height:0; margin:0; padding:0; list-style:none; @@ -815,47 +886,87 @@ gancio-calendar{ .brotes > li{ position:absolute; left:0; top:0; opacity:0; - transform:translate(-50%,-50%) scale(.16); + /* Lo que se coloca es la PUNTA DEL RABILLO, o sea el centro de arriba de la + caja: por eso translate(-50%,0) y no (-50%,-50%). Antes se colocaba el + centro de la hoja, y así el punto donde empieza el tallo del brote + dependía de lo que midiera la hoja —que va en vw— y no se podía dibujar + ese tallo con un ángulo fijo. */ + transform:translate(-50%,0) scale(.16); transition:opacity .3s ease, transform .5s cubic-bezier(.22,1.25,.4,1); } +/* EL TALLO DEL BROTE. Antes los tres brotes salían flotando: el rabillo de la + hoja pequeña mide lo que mide y no llegaba ni de lejos al tallo gordo, así + que parecían tres hojas sueltas en el aire debajo de REDES. Ahora cada una + lleva su tallo hasta el punto exacto del que brota. + Va en el
  • , que NO gira, así que --ang es un ángulo absoluto: la + dirección de vuelta al agarre. Las dos cifras salen de las mismas que + colocan el brote —si se mueve uno, se recalculan las dos— y como el
  • + entero se encoge a .16 cuando el brote está cerrado, el tallo se recoge con + él sin una regla más. */ +.brotes > li::before{ + content:""; + position:absolute; left:50%; top:0; + width:calc(var(--brote) * .032); /* el mismo grosor que el rabillo */ + height:calc(var(--r) * var(--largo,0)); + border-radius:99px; + background:var(--negro); + transform-origin:50% 0; + transform:translateX(-50%) rotate(var(--ang,0deg)); +} /* OJO con --tam aqui. El brote es descendiente de su
  • , asi que la regla - ".enredadera > li:nth-child(6n+4) .hoja" (0,3,1) le gana a ".hoja-brote" + ".enredadera > li:nth-child(12n+4) .hoja" (0,3,1) le gana a ".hoja-brote" (0,1,0) y le mete el --tam de la hoja madre. Poner "--tam:.44" aqui no servia de nada: el brote salia con el 0.92 de REDES, al doble de tamano, y por eso se comia a las hojas vecinas. La medida va sin --tam. */ .hoja-brote{ --centrar:0%; position:static; left:auto; top:auto; - width:calc(clamp(90px,8.4vw,140px) * .88); + width:var(--brote); } /* Los nombres de las redes son de una palabra: nunca deben partirse. Sin esto, a 320 y 360 de verdad salia "MASTODO / N". Que el texto sobresalga un poco del limbo no molesta, porque el calado lo separa del dibujo. */ -.hoja-brote .hoja-txt{ white-space:nowrap; } +.hoja-brote .hoja-txt{ + white-space:nowrap; + /* Más pequeña que la de una hoja grande: son tres nombres largos en el + hueco que deja una sola hoja, y con la letra de las demás se tocaban + entre ellos. Sigue en versalitas de palo seco sobre el calado, así que + se lee igual de lejos. */ + font-size:clamp(.68rem,.5rem + .5vw,1.05rem); +} -.brotes > li:nth-child(1) .hoja{ --giro:26deg; } +.brotes > li:nth-child(1) .hoja{ --giro:-26deg; } .brotes > li:nth-child(2) .hoja{ --giro:0deg; } -.brotes > li:nth-child(3) .hoja{ --giro:-26deg; } +.brotes > li:nth-child(3) .hoja{ --giro:26deg; } +/* Largo y ángulo del tallo de cada uno: son el vector de vuelta al agarre, + o sea lo mismo que el desplazamiento de más abajo leído del revés. */ +.brotes > li:nth-child(1){ --largo:0.599; --ang:236.6deg; } +.brotes > li:nth-child(2){ --largo:0.605; --ang:262.4deg; } +.brotes > li:nth-child(3){ --largo:0.603; --ang:264.3deg; } #redes-toggle:checked ~ .brotes{ pointer-events:auto; } #redes-toggle:checked ~ .brotes > li{ opacity:1; } -/* El abanico cuelga abajo y a la izquierda del ancla. En fila horizontal se - metia en las columnas vecinas y el brote de Instagram se comia la hoja - Campanas (hasta 92px de solape a 1280x720). Medido en las 7 pantallas. */ +/* Los tres NUDOS del brote, o sea dónde acaba el rabillo de cada hoja. Van + encadenados —del agarre al primero, del primero al segundo, del segundo al + tercero—, así que lo que se dibuja es un solo brote con tres hojas y no tres + hojas sueltas. Bajan hacia la izquierda, al hueco que dejan Eventos por + arriba y Campañas por la derecha; en fila horizontal Instagram se comía + Campañas (hasta 92px a 1280x720). Medido en las 7 pantallas de + brotes_desk.py. */ #redes-toggle:checked ~ .brotes > li:nth-child(1){ - transform:translate(-50%,-50%) translate(calc(var(--r) * -1.25), calc(var(--r) * .75)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -0.500), calc(var(--r) * 0.330)) scale(1); transition-delay:0s; } #redes-toggle:checked ~ .brotes > li:nth-child(2){ - transform:translate(-50%,-50%) translate(calc(var(--r) * -0.40), calc(var(--r) * .70)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -1.100), calc(var(--r) * 0.410)) scale(1); transition-delay:.07s; } -/* Instagram cuelga casi recto: con el rabillo largo el recuadro de la hoja - pasó de 114 a 132 de alto, el brote llegó más lejos y se comía Campañas - (21px a 1280x720). Subir el radio no vale: entonces Mastodon pisa Eventos. - Medido en las 7 pantallas de brotes_desk.py. */ +/* El último no puede bajar más: a 0.60 de radio el dibujo de Instagram se + salía por abajo de la pantalla en cinco de las siete —hasta 32px a 1600x900— + y a 1280x720 se cortaba la etiqueta. Tampoco puede subir: entonces se mete + en la hoja de Eventos. */ #redes-toggle:checked ~ .brotes > li:nth-child(3){ - transform:translate(-50%,-50%) translate(calc(var(--r) * 0.10), calc(var(--r) * 1.00)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -1.700), calc(var(--r) * 0.470)) scale(1); transition-delay:.14s; } @@ -942,42 +1053,52 @@ gancio-calendar{ /* ============ LOS BROTES EN MÓVIL ============ Va al FINAL a propósito: la definición base de .brotes se declara más arriba, así que un bloque de móvil colocado antes perdería por orden de - aparición. Aquí el tallo es vertical y la hoja de REDES apunta a la - izquierda, así que los brotes se apilan a la DERECHA, que es el lado libre. - Y las medidas son propias: la fórmula de ordenador (--y sobre --fila) sitúa - el ancla 300px por debajo de una hoja que mide 160. */ + aparición. + Aquí no cabe un abanico. El tallo es vertical y las hojas ocupan los ~130px + del centro de la pantalla, así que lo único libre son las dos franjas de los + lados: a 390 miden 62px, a 360 unos 86 y a 320 llegan a 110. Antes los tres + brotes salían a la DERECHA, y ahí no caben: se comían Eventos por arriba y + Campañas por abajo —medido a 390 y a 360, hasta 55px de solape— y se pisaban + entre ellos. + Ahora salen por la IZQUIERDA. El brote nace del agarre, pasa por DEBAJO de + la hoja de REDES —que es la única que hay en ese lado— y TREPA por el margen + con las tres hojas apuntando hacia fuera. Trepar en vez de colgar no es un + capricho: hacia arriba es donde hay 150px seguidos sin nada, y una hiedra + sube. Las medidas son propias porque la fórmula de ordenador (--y sobre + --fila) sitúa el ancla 300px por debajo de una hoja que mide 160. */ @media (max-width:1023px){ - /* El radio y el tamano del brote salen de --ancho-hoja, no de la pantalla: - si las hojas crecen, el abanico crece con ellas y no se descuadra. - El abanico va HACIA ARRIBA (de -1.20r a 0) porque la hoja de abajo, - Campanas, gira 248deg y su dibujo sube por la derecha, justo donde - caian los brotes: se pisaban en todos los anchos, hasta 99px en tablet. */ + /* El radio y el tamaño del brote salen de --ancho-hoja, no de la pantalla: + si las hojas crecen, el brote crece con ellas y no se descuadra. */ .brotes{ --r:calc(var(--ancho-hoja) * .70); + --brote:calc(var(--ancho-hoja) * .48); /* sin --tam: ver arriba */ left:50%; top:50%; } - .hoja-brote{ width:calc(var(--ancho-hoja) * .46); } /* sin --tam: ver arriba */ /* El brote es medio limbo, asi que el 60% de ancho que le vale a una hoja grande deja "MASTODON" partido en dos lineas. Se le da casi todo el ancho: el calado del text-shadow ya separa las letras del dibujo. */ .hoja-brote .hoja-txt{ width:88%; } - .brotes > li:nth-child(1) .hoja{ --giro:-72deg; } - .brotes > li:nth-child(2) .hoja{ --giro:-90deg; } - .brotes > li:nth-child(3) .hoja{ --giro:-108deg; } - /* El abanico va centrado en el hueco entre Eventos y Campañas y lo más - cerrado que se puede. Antes subía 1.20r y ahí cabía porque la celda medía - 169px; ahora mide 92 y ese hueco es de unos 100px para tres brotes. - Buscado en rejilla sobre centro, apertura y tamaño con brotes_movil.py: - centro -0.25r, apertura 0.50r y el brote SIN encoger es lo único que da - cero en las ocho pantallas. Bajarlo más pisa Campañas; subirlo, Eventos. */ + /* Apuntan hacia fuera, casi horizontales; los tres grados de diferencia son + para que no salgan calcadas. */ + .brotes > li:nth-child(1) .hoja{ --giro:96deg; } + .brotes > li:nth-child(2) .hoja{ --giro:90deg; } + .brotes > li:nth-child(3) .hoja{ --giro:84deg; } + /* El primer tramo sale del tallo gordo hasta el margen; los otros dos suben + rectos, de hoja en hoja (--ang:0 es "hacia abajo", o sea de vuelta a la + hoja anterior). */ + .brotes > li:nth-child(1){ --largo:1.649; --ang:256.0deg; } + .brotes > li:nth-child(2){ --largo:0.850; --ang:0.0deg; } + .brotes > li:nth-child(3){ --largo:0.850; --ang:0.0deg; } + /* La columna va a 1.6 radios del tallo: a 390 —el ancho donde menos margen + queda— la hoja entra justo y la etiqueta acaba a 7px del borde. */ #redes-toggle:checked ~ .brotes > li:nth-child(1){ - transform:translate(-50%,-50%) translate(calc(var(--r) * .85), calc(var(--r) * -.75)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -1.60), calc(var(--r) * 0.40)) scale(1); } #redes-toggle:checked ~ .brotes > li:nth-child(2){ - transform:translate(-50%,-50%) translate(calc(var(--r) * 1.20), calc(var(--r) * -.25)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -1.60), calc(var(--r) * -0.45)) scale(1); } #redes-toggle:checked ~ .brotes > li:nth-child(3){ - transform:translate(-50%,-50%) translate(calc(var(--r) * .85), calc(var(--r) * .25)) scale(1); + transform:translate(-50%,0) translate(calc(var(--r) * -1.60), calc(var(--r) * -1.30)) scale(1); } }