HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html>
tag. If you want to add classes there that can affect the whole document, this is the place to do it.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. If you need things in the <head>
of the document, put that code here.
The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.
CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.
It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.
To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit-
or -moz-
.
We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).
Any URLs added here will be added as <link>
s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.
You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.
You can also link to another Pen here (use the .css
URL Extension) and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, use the appropriate URL Extension and we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
JavaScript preprocessors can help make authoring JavaScript easier and more convenient.
Babel includes JSX processing.
Any URL's added here will be added as <script>
s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.
You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.
If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.
You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
Search for and use JavaScript packages from npm here. By selecting a package, an import
statement will be added to the top of the JavaScript editor for this package.
Using packages here is powered by esm.sh, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ESM usage.
All packages are different, so refer to their docs for how they work.
If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.
If active, Pens will autosave every 30 seconds after being saved once.
If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.
If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.
Visit your global Editor Settings.
<div id="app">
<canvas id="canvas" role="img" aria-label="Starry background"></canvas>
<svg id="ziggy-main" @mousemove="coordinates"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 2527.9475 1865.4782" height="1865.4781" width="2527.9475" aria-labelledby="ziggyTitle ziggyDesc"
role="img">
<title id="ziggyTitle">Ziggy Stardust and The Spiders from Mars - Interactive Animation </title>
<desc id="ziggyDesc">An animated illustration of Ziggy Stardust in space, flying in a rocket and holding in his hands a slinky which morphs into phrase "We Can Be Heroes".</desc>
<defs><filter id="filter1411" x="-0.21010594" width="1.4202119" y="-0.070522405" height="1.1410449" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="37.277461" id="feGaussianBlur1413" result="fbSourceGraphic"/><feColorMatrix result="fbSourceGraphicAlpha" in="fbSourceGraphic" values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0" id="feColorMatrix1487"/><feTurbulence id="feTurbulence1489" type="fractalNoise" baseFrequency="1.58855 1.61459" numOctaves="2" seed="100" result="turbulence"/><feComposite in2="turbulence" id="feComposite1491" in="fbSourceGraphic" operator="out" result="composite1"/><feColorMatrix id="feColorMatrix1493" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 3.42 -1.04" result="color"/><feFlood id="feFlood1495" flood-opacity="1" flood-color="#6B2100" result="flood"/><feMerge id="feMerge1497" result="merge"><feMergeNode id="feMergeNode1499" in="flood"/><feMergeNode id="feMergeNode1501" in="color"/></feMerge><feComposite in2="fbSourceGraphic" id="feComposite1503" operator="in" result="composite2"/></filter><filter id="filter1183" x="-0.27053818" width="1.5410763" y="-0.2816869" height="1.5633738" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="36.833837" id="feGaussianBlur1185"/></filter><linearGradient id="linearGradient1281"><stop offset="0" id="stop1277" stop-color="#ffc2c2"/><stop offset="1" id="stop1279" stop-color="#ff8d8d" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1029"><stop id="stop1025" offset="0" stop-color="#bd4a4a"/><stop id="stop1027" offset="1" stop-color="#d20000" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1235"><stop id="stop1231" offset="0" stop-color="#f2d5b7"/><stop id="stop1233" offset="1" stop-color="#f2d5b7" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1191"><stop offset="0" id="stop1187" stop-color="#e5b378"/><stop offset="1" id="stop1189" stop-color="#fff5e1" stop-opacity=".88627452"/></linearGradient><linearGradient id="linearGradient1308"><stop id="stop1304" offset="0" stop-color="#ffe7d7"/><stop id="stop1306" offset="1" stop-color="#ffe477"/></linearGradient><linearGradient id="linearGradient1256"><stop id="stop1252" offset="0" stop-color="#ff8d8d"/><stop id="stop1254" offset="1" stop-color="#ff8d8d" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1206"><stop id="stop1202" offset="0" stop-color="#ea512b"/><stop id="stop1204" offset="1" stop-color="#ea512b" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1168"><stop offset="0" id="stop1164" stop-color="#fff8e2" stop-opacity="0"/><stop offset="1" id="stop1166" stop-color="#ea512b"/></linearGradient><linearGradient id="linearGradient1138"><stop offset="0" id="stop1134" stop-color="#fff8e2" stop-opacity="0"/><stop offset="1" id="stop1136" stop-color="#ea2b2b"/></linearGradient><linearGradient id="linearGradient1122"><stop offset="0" id="stop1118" stop-color="#fff8e2" stop-opacity="0"/><stop offset="1" id="stop1120" stop-color="#df9a8f" stop-opacity="0"/></linearGradient><linearGradient id="linearGradient1046"><stop id="stop1042" offset="0" stop-color="#f2f2f2"/><stop id="stop1044" offset="1" stop-color="#405024"/></linearGradient><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1.99087 -1.51164 1.63014 2.14694 -772.29339 155.22121)" r="28.25395" fy="607.37354" fx="492.55255" cy="607.37354" cx="492.55255" id="radialGradient1052" xlink:href="#linearGradient1046"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="572.62488" x2="579.91577" y1="572.62488" x1="446.49457" id="linearGradient1116" xlink:href="#linearGradient1122"/><linearGradient gradientTransform="translate(705.86621 107.28296)" y2="590.58575" x2="573.49652" y1="572.61542" x1="445.98557" gradientUnits="userSpaceOnUse" id="linearGradient1124" xlink:href="#linearGradient1138"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="564.15552" x2="566.62317" y1="516.26001" x1="558.12921" id="linearGradient1162" xlink:href="#linearGradient1168"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="667.79517" x2="476.01227" y1="618.03107" x1="478.34836" id="linearGradient1208" xlink:href="#linearGradient1206"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="728.84607" x2="460.26926" y1="728.84607" x1="368.67276" id="linearGradient1260" xlink:href="#linearGradient1256"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="443.08231" x2="723.20465" y1="411.28857" x1="598.87787" id="linearGradient1310" xlink:href="#linearGradient1308"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="547.28546" x2="467.39014" y1="547.28546" x1="373.16864" id="linearGradient1320" xlink:href="#linearGradient1206"/><linearGradient gradientTransform="translate(626.31196 127.31954)" gradientUnits="userSpaceOnUse" y2="1144.243" x2="670.53705" y1="1014.0609" x1="666.8429" id="linearGradient1193" xlink:href="#linearGradient1191"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="506.79092" x2="434.59256" y1="506.79092" x1="358.48538" id="linearGradient1227" xlink:href="#linearGradient1235"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .23322 705.86621 751.69648)" r="54.904625" fy="837.62299" fx="621.66412" cy="837.62299" cx="621.66412" id="radialGradient1031" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .1531 705.86621 840.68954)" r="55.98584" fy="865.99615" fx="616.88159" cy="865.99615" cx="616.88159" id="radialGradient1041" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .51445 705.86621 521.99586)" r="23.847248" fy="854.1109" fx="548.0943" cy="854.1109" cx="548.0943" id="radialGradient1059" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .27808 705.86621 734.80143)" r="15.778165" fy="869.23242" fx="546.81775" cy="869.23242" cx="546.81775" id="radialGradient1087" xlink:href="#linearGradient1029"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="443.0777" x2="722.7019" y1="443.0777" x1="515.05884" id="linearGradient1236" xlink:href="#linearGradient1138"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .38301 700.00146 657.76296)" r="33.193115" fy="881.59894" fx="621.46021" cy="881.59894" cx="621.46021" id="radialGradient1269" xlink:href="#linearGradient1281"/><linearGradient gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" y2="173.21272" x2="749.0603" y1="177.12256" x1="577.0636" id="linearGradient1321" xlink:href="#linearGradient1206"/><linearGradient y2="316.1955" x2="684.23517" y1="316.1955" x1="483.84232" gradientTransform="rotate(1.035 -4984.3429 39436.489)" gradientUnits="userSpaceOnUse" id="linearGradient2119" xlink:href="#linearGradient1206"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(2.10796 -.08833 .06725 1.60476 -166.04934 -190.19344)" r="25.652845" fy="601.50879" fx="750.44434" cy="601.50879" cx="750.44434" id="radialGradient1068-4" xlink:href="#linearGradient1046"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .23322 705.86621 751.69648)" r="54.904625" fy="837.62299" fx="621.66412" cy="837.62299" cx="621.66412" id="radialGradient1031-0" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .1531 705.86621 840.68954)" r="55.98584" fy="865.99615" fx="616.88159" cy="865.99615" cx="616.88159" id="radialGradient1041-2" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1.2651 .04079 -.00855 .26527 532.80703 714.44215)" r="16.946405" fy="864.15637" fx="680.66846" cy="864.15637" cx="680.66846" id="radialGradient1097-6" xlink:href="#linearGradient1029"/><radialGradient gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 .38301 700.00146 657.76296)" r="33.193115" fy="881.59894" fx="621.46021" cy="881.59894" cx="621.46021" id="radialGradient1269-2" xlink:href="#linearGradient1281"/><linearGradient y2="534.27295" x2="777.56403" y1="556.06958" x1="874.35571" gradientTransform="translate(700.33688 119.72397)" gradientUnits="userSpaceOnUse" id="linearGradient3579" xlink:href="#linearGradient1235"/><linearGradient y2="509.45667" x2="864.45172" y1="623.2572" x1="796.62927" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3581" xlink:href="#linearGradient1206"/><linearGradient y2="755.94476" x2="770.66919" y1="704.99139" x1="935.84155" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3583" xlink:href="#linearGradient1256"/><linearGradient y2="619.38617" x2="648.13763" y1="531.60785" x1="796.13666" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3591" xlink:href="#linearGradient1138"/><linearGradient y2="173.21272" x2="749.0603" y1="177.12256" x1="577.0636" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3593" xlink:href="#linearGradient1206"/><linearGradient y2="443.08231" x2="723.20465" y1="411.28857" x1="598.87787" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3595" xlink:href="#linearGradient1308"/><linearGradient y2="443.0777" x2="722.7019" y1="443.0777" x1="515.05884" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3597" xlink:href="#linearGradient1138"/><linearGradient y2="316.1955" x2="684.23517" y1="316.1955" x1="483.84232" gradientTransform="rotate(1.035 -4984.3429 39436.489)" gradientUnits="userSpaceOnUse" id="linearGradient3599" xlink:href="#linearGradient1206"/><linearGradient y2="380.4357" x2="918.33423" y1="365.7738" x1="697.375" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3601" xlink:href="#linearGradient1206"/><linearGradient y2="558.27704" x2="727.63049" y1="558.27704" x1="667.72839" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3605" xlink:href="#linearGradient1206"/><linearGradient y2="584.9469" x2="712.29346" y1="584.9469" x1="651.49011" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3607" xlink:href="#linearGradient1206"/><linearGradient y2="627.90637" x2="810.90424" y1="625.14172" x1="737.47479" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3609" xlink:href="#linearGradient1206"/><linearGradient y2="851.11871" x2="709.72058" y1="851.11871" x1="674.20807" gradientTransform="translate(705.86621 107.28296)" gradientUnits="userSpaceOnUse" id="linearGradient3615" xlink:href="#linearGradient1029"/><clipPath id="clipPath2186"><path id="path2188" d="m 1345,146.17518 c -465.60364,94.65079 -463.18547,481.21059 -285.9444,791.7528 37.6681,65.99782 -162.53647,326.78462 255.8128,368.34422 7.2277,-1.8069 45.1823,-150.4936 41.9844,-156.8893 -12.3837,-24.7675 -29.1216,-27.54 -17.6776,-61.8718 14.2073,-36.6222 -27.5341,-64.2561 -11.0486,-97.2272 6.2177,-12.43533 -6.9603,-22.04699 -7.7245,-36.64976 -0.5136,-9.81377 -6.9611,-14.11245 -1.8466,-23.14893 27.3178,-48.26564 -7.7729,-112.41403 5.1518,-156.75276 3.5171,-16.13904 16.9851,-32.71004 9.4844,-86.17972 -0.6028,-4.29684 -15.868,-27.51739 -3.0378,-38.67179 28.186,-24.50447 10.5851,-48.82995 -3.9275,-67.37018 -17.9654,-57.41424 31.6938,-98.09495 -16.211,-148.97802 -4.0963,-35.40082 39.8899,-35.96166 33.7555,-89.06644 -25.1783,-11.95517 -1.2744,-14.72773 8.5216,-36.05373 3.1873,-19.90213 -16.5667,-42.51165 -6.7078,-79.18601 7.3197,-27.22883 2.5132,-72.88689 -0.5847,-82.05138 z" fill="none" stroke="#000" stroke-width="1px"/></clipPath><clipPath id="clipPath2190"><path id="path2192" d="m 1340.4887,146.17528 c 392.0924,-52.279931 562.7359,381.71883 396.8556,698.94503 -72.2346,138.14002 206.5368,520.33679 -426.9872,461.15199 7.2277,-1.8069 45.1823,-150.4936 41.9844,-156.8893 -12.3837,-24.7675 -29.1216,-27.54 -17.6776,-61.8718 12.2073,-36.6222 -27.5341,-64.2561 -11.0486,-97.2272 6.2177,-12.43533 -6.9603,-22.04699 -7.7245,-36.64976 -0.5136,-9.81377 -6.9611,-14.11245 -1.8466,-23.14893 27.3178,-48.26564 -7.7729,-112.41403 5.1518,-156.75276 3.5171,-16.13904 16.9851,-32.71004 9.4844,-86.17972 -0.6028,-4.29684 -15.868,-27.51739 -3.0378,-38.67179 28.186,-24.50447 10.5851,-48.82995 -3.9275,-67.37018 -17.9654,-57.41424 31.6938,-98.09495 -16.211,-148.97802 -4.0963,-35.40082 39.8899,-35.96166 33.7555,-89.06644 -25.1783,-11.95517 -1.2744,-14.72773 8.5216,-36.05373 3.1873,-19.90213 -16.5667,-42.51165 -6.7078,-79.18601 7.3197,-27.22883 2.5132,-72.88689 -0.5847,-82.05138 z" fill="none" stroke="#000" stroke-width="1px"/></clipPath><filter id="filter1862" x="-0.21999294" width="1.4399859" y="-0.27288255" height="1.545765" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="44.339697" id="feGaussianBlur1864" result="fbSourceGraphic"/><feColorMatrix result="fbSourceGraphicAlpha" in="fbSourceGraphic" values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0" id="feColorMatrix2010"/><feTurbulence id="feTurbulence2012" type="fractalNoise" baseFrequency="1.58855 1.61459" numOctaves="2" seed="100" result="turbulence"/><feComposite in2="turbulence" id="feComposite2014" in="fbSourceGraphic" operator="out" result="composite1"/><feColorMatrix id="feColorMatrix2016" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 3.42 -1.04" result="color"/><feFlood id="feFlood2018" flood-opacity="1" flood-color="#8F6AED" result="flood"/><feMerge id="feMerge2020" result="merge"><feMergeNode id="feMergeNode2022" in="flood"/><feMergeNode id="feMergeNode2024" in="color"/></feMerge><feComposite in2="fbSourceGraphic" id="feComposite2026" operator="in" result="composite2"/></filter><filter id="filter2052" x="-0.36912739" width="1.7382548" y="-0.10774334" height="1.2154866" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="29.349172" id="feGaussianBlur2054" result="fbSourceGraphic"/><feColorMatrix result="fbSourceGraphicAlpha" in="fbSourceGraphic" values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0" id="feColorMatrix2056"/><feTurbulence id="feTurbulence2058" type="fractalNoise" baseFrequency="1.58855 1.61459" numOctaves="2" seed="100" result="turbulence"/><feComposite in2="turbulence" id="feComposite2060" in="fbSourceGraphic" operator="out" result="composite1"/><feColorMatrix id="feColorMatrix2062" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 3.42 -1.04" result="color"/><feFlood id="feFlood2064" flood-opacity="1" flood-color="#FFF" result="flood"/><feMerge id="feMerge2066" result="merge"><feMergeNode id="feMergeNode2068" in="flood"/><feMergeNode id="feMergeNode2070" in="color"/></feMerge><feComposite in2="fbSourceGraphic" id="feComposite2072" operator="in" result="composite2"/></filter><pattern id="pattern1256" patternTransform="translate(2822.9435 812.71405)" height="463.99115" width="466.64017" patternUnits="userSpaceOnUse"><g transform="translate(-2822.9435 -812.71405)" id="g1247"><g id="g1254"><path id="rect1233" fill="#8a4532" stroke="#8a4532" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" d="M2827.5925 814.71405H3287.58365V1274.7052H2827.5925z"/><path id="path1235" d="m 3017.0007,904.90841 c -20.5692,-2.84317 39.65,-37.01522 27.0583,-49.60689 -32.8765,-32.87654 -130.9839,91.57446 -144.3109,108.23321 -27.021,33.7762 -19.028,43.68897 22.5486,27.0583 16.2768,-6.51071 60.777,-34.89823 45.0971,-27.0583 -23.0745,11.53728 -68.568,79.43187 -76.6651,103.72347 -17.9424,53.8272 63.3383,-27.3111 27.0583,18.0389 -8.6318,10.7897 -98.8632,124.1925 -94.7041,126.2721 64.5383,32.2691 151.4986,-168.8048 175.879,-202.9373 5.8766,-8.2273 134.1622,-167.98884 130.7818,-171.36925 -9.1402,-9.1402 -103.7069,65.38674 -112.743,67.64576 z" fill="#8c59ff" stroke-width="1px"/><path id="path1239" d="m 3206.4089,859.81124 c -41.3814,13.66756 -211.2264,226.21616 -171.3693,266.07326 11.8637,11.8637 182.3342,-222.21358 171.3693,-266.07326 z" fill="#8c59ff" stroke-width="1px"/><path id="path1241" d="m 3251.506,936.47643 c -32.6438,40.56295 -85.0702,68.87457 -63.136,112.74297 9.6965,19.3931 -73.9056,72.3406 -85.6846,81.1749 -19.9065,14.9298 -7.9619,59.777 -31.5681,67.6457 -10.168,3.3894 -96.5719,23.3225 -85.6846,45.0972 21.3853,42.7706 128.2639,-14.1931 153.3304,-22.5486 29.23,-9.7433 15.1514,23.9923 18.0389,22.5486 51.469,-25.7345 109.4866,-247.53036 94.704,-306.66077 z" fill="#8c59ff" stroke-width="1px"/></g></g></pattern></defs><path id="rect-bg" opacity="0" fill="#410800" d="M0 0H2527.9475V1865.4781H0z"/><g id="space-landscape"><path id="space-doodle-15" d="m 2457.0101,1427.011 c -22.8927,-15.5467 -134.1024,29.9529 -121.1763,55.8049 14.2782,28.5566 92.8231,5.1993 113.2042,-1.5944 2.6991,-0.8997 56.1848,-18.7532 49.4272,-25.5108 -17.2368,-17.2367 -144.7843,40.2723 -161.037,60.5882 -25.7871,32.2338 38.2038,31.8885 55.8049,31.8885 11.7045,0 45.5462,-6.8288 35.0773,-1.5944 -30.086,15.043 -69.9304,11.3913 -97.2599,31.8885 -14.7259,11.0444 26.1001,16.3404 30.2941,17.5387 39.087,11.1677 -17.1073,16.8134 6.3777,20.7275 4.8343,0.8057 47.446,3.7398 27.1052,15.9443 -44.9237,26.9542 -107.9881,19.4235 -157.8481,31.8885 -84.0058,21.0014 -176.8528,56.5378 -248.7305,92.4767" fill="none" stroke="#8a4532" stroke-width="4"/><path d="m 291.55478,1465.0159 c 136.00976,-6.6036 140.86454,-29.8744 241.08188,19.5033 58.1901,26.3372 -25.98551,40.3882 -0.6059,68.6248 89.82844,91.63 339.10746,212.8722 55.8018,167.2299 -105.6383,-22.8842 -61.9228,-76.4154 -77.2089,-105.9322 -14.83356,-24.3059 -137.0912,-80.4126 -191.31024,-79.973 -21.93538,0.106 -315.2260563,72.22 -215.09288,-92.1295 307.45597,-491.64186 35.82272,23.7459 187.33424,22.6767 z" id="space-doodle-1" fill="#8a4532" stroke-width="1.49576032px"/><path id="space-doodle-11" d="m 2093.3697,1138.2036 c -5.3255,165.3364 71.0033,-500.88749 -142.1141,-643.95445 -164.0337,122.97862 70.6158,838.54175 142.1141,643.95445 z" transform="rotate(-121.314 2049.5873 898.18928)" fill-opacity=".98492462" stroke="#661d1d" stroke-width="1px" filter="url(#filter2052)"/><path transform="translate(0 139.36121)" id="space-doodle-2" d="m 306.43626,980.76476 c -104.99959,138.43724 25.53026,9.86706 27.485,25.09984 -199.36691,333.3606 -231.24674,393.5904 -199.1643,383.8746 349.88031,-240.1565 302.98173,-65.9098 346.3597,-123.6534 36.13994,-54.8812 99.25749,9.1795 160.4534,-37.1678 47.74683,-36.1615 109.99974,-178.8585 419.83944,-130.0866 170.8304,26.8904 546.3596,-57.2459 668.7641,5.3279 81.4212,40.0633 87.2424,67.9005 118.3264,132.3198 98.9275,168.6176 276.8333,261.7535 365.8404,164.3253 67.9103,-74.3355 14.7437,-119.6817 80.3636,-168.6566 77.603,-57.9184 233.5689,-118.1495 198.9648,-290.79934 -9.6379,-44.43591 -54.9945,144.14274 -77.2285,118.95014 -16.6162,-18.8273 54.0909,-275.68003 39.9597,-272.68008 -16.4799,3.49853 -45.7958,65.7017 -84.5025,156.23296 -52.4435,118.21032 -134.6524,278.35342 -215.7487,300.18872 -214.8162,57.8395 -312.6187,-140.7518 -475.0616,-182.2726 -90.7429,-14.66 -499.4311,48.7117 -742.88613,19.0357 -278.04587,0.9956 -239.77603,56.3215 -356.07184,105.4929 -270.6209,118.9189 62.18924,-587.04749 -283.16159,-232.6457 -13.00414,13.34496 22.45961,10.65698 7.46862,27.11426 z" fill="#8a4532" stroke-width=".75394797px"/><path transform="translate(0 139.36121)" id="space-doodle-6" d="m 2239.9555,98.268114 c -92.4996,23.317666 -306.9966,243.899496 -368.3965,325.766146 -52.98,70.63994 346.9681,-139.24331 301.8631,-64.06838 -51.4609,116.12418 -189.2611,238.19738 -164.1438,262.76109 61.9762,-60.61685 311.8302,-284.15274 272.2725,-356.5978 -39.1128,-39.1128 -223.4531,79.59817 -223.4531,45.0456 0,-61.65026 166.5305,-151.59764 181.8578,-212.906656 z" fill="#22433d" stroke-width="1px"/><path transform="translate(0 139.36121)" id="space-doodle-5" d="m 2273.8982,26.18202 c -47.514,-34.988183 -198.1356,-38.064791 -213.276,37.636935 -5.1999,25.999767 74.9124,46.708055 47.0462,69.001045 -43.7846,35.02764 -104.5825,33.74303 -147.4113,65.86464 -32.5638,24.42282 61.0719,30.25399 34.5005,50.18258 -25.7456,19.30922 -69.7422,32.84647 -84.6831,62.72823 -7.705,15.40989 93.8267,0.39842 81.5467,18.81847 -20.3609,30.54127 -74.0505,35.87969 -84.6831,78.41028 -9.9948,39.97893 50.4383,21.61391 31.3641,47.04617 -5.4867,7.31558 -50.0371,47.19171 -40.7734,56.4554 19.4545,19.45445 275.282,-61.28382 241.5037,6.27282 -42.2858,84.57154 35.4911,80.72077 25.0913,122.32004 -30.9386,117.44559 -190.347,130.24909 -163.0934,232.09444 -62.8007,31.40036 -155.3919,54.49908 -73.9239,135.96693 -264.7631,203.4312 99.517,-7.3278 92.7424,-73.2387 6.9261,-27.70456 -24.1444,-30.12147 -9.4093,-59.59182 11.9688,-23.93749 39.4865,-39.67395 53.319,-62.72822 25.9791,-57.1725 107.8035,-87.38618 116.0473,-128.59287 -11.4869,-64.38115 47.2476,-84.96717 28.2277,-138.00209 -5.0739,-10.14774 -24.2345,-11.26044 -31.3642,-21.95488 5.9521,-49.75149 21.8686,-37.55921 -28.2277,-72.13746 -11.0074,-7.33829 -3.5066,-28.4128 -15.682,-34.50053 -25.6541,-12.82704 -63.58,5.98892 -90.9559,-3.13641 80.6852,-67.85057 -8.8317,-37.87933 -18.8185,-100.36516 19.8403,-99.2014 305.7763,-215.398689 250.9129,-288.54984 z" fill="#8c59ff" stroke-width="1px"/><path transform="translate(0 139.36121)" id="space-doodle-9" d="m 2346.4088,18.45202 c -120.7326,-3.24762 -591.6623,310.35308 -620.9777,408.0711 -24.8935,82.97825 343.5956,68.22146 390.3288,150.80888 46.2263,81.69159 -301.3384,313.76142 -368.1511,412.50665 -138.5828,204.81725 652.0267,-387.15511 652.0267,-164.11551" fill="none" stroke="#8c59ff" stroke-width="80" filter="url(#filter1411)"/><ellipse transform="rotate(-43.56 174.38726 69.680605)" ry="70.968887" rx="215.12444" cy="625.07611" cx="-322.05051" id="space-doodle-12" fill="#8c59ff" stroke-width="6.05582094" stroke-linecap="round" stroke-linejoin="round" filter="url(#filter1183)"/><path d="m 2478.2023,1298.0146 c 57.9482,-40.1409 -30.9507,-90.2335 -53.5413,-86.4228 -5.1774,0.8734 9.0686,31.3888 3.9797,33.6921 -37.5353,16.9887 -84.0867,-47.5436 -122.1891,-30.298 -14.2636,6.4556 9.7416,52.6549 8.6642,54.5382 -19.4029,33.9176 -103.2337,-68.407 -134.5795,-43.4805 -12.0583,9.5886 15.933,59.2526 15.6652,59.7206 -13.6311,23.8281 -48.8116,-15.9994 -61.1439,25.5862 -8.5832,28.9432 51.6496,69.9573 58.3761,77.9711 81.8291,97.4902 -43.2793,-20.4378 1.8652,72.2304 10.6961,21.9557 57.5158,50.1479 16.9245,63.3266 -68.3367,22.1863 -144.2811,-75.0327 -207.7615,-37.5 -71.3093,28.9114 -33.4736,62.9593 -33.0883,98.4898 -329.9289,247.9393 -148.0312,263.8527 21.4071,61.2977 428.9375,0.8318 263.9473,-211.8922 347.9238,-259.7771 62.6999,-33.2334 139.2487,-30.558 137.4978,-89.3743 z" id="space-doodle-3" fill="#8c59ff" stroke-width="1.49576032px"/><path d="M 295.1889,394.62658 C 413.10588,155.14362 988.68857,26.320749 665.74518,272.15459 579.0819,347.94358 309.65376,576.71103 295.1889,394.62658 Z" id="space-doodle-8" transform="matrix(1.5169 -.49344 .26718 1.04357 -512.68607 746.66351)" fill="#fff" stroke-width="1px" filter="url(#filter1862)"/><path transform="translate(0 139.36121)" id="space-doodle-7" d="m 528.41425,416.8733 c -9.46022,-5.08387 -83.39747,125.60308 -72.42087,132.83265 36.04256,23.73888 28.12867,-75.9159 -24.64207,-84.95195 -120.11577,-20.56769 -244.489,275.20743 -214.93893,304.7575 42.46629,42.46629 244.42701,-66.03875 122.32004,90.95592 C 228.4978,1002.1976 12.545645,1139.1836 12.545645,1340.3384" fill="none" stroke="#588170" stroke-width="4"/><path d="m 2347.888,351.11358 c 3.2244,-3.14261 53.7072,-54.34025 48.9133,-60.60527 -20.0032,0.45205 -183.323,125.69234 -171.216,146.46259 5.4608,7.13659 65.4933,-25.13182 64.4065,-23.52913 -17.5932,25.94347 -79.0436,67.75563 -83.3063,99.7988 -0.4978,3.74135 59.0224,-30.08122 62.3021,-29.64492 18.2233,2.42426 -35.6687,50.98921 -30.9474,57.15944 7.2145,9.42856 47.3394,-22.27421 51.7934,-16.45328 14.4451,18.87814 -92.8482,110.88828 -76.0333,132.86349 87.1479,-70.26126 257.4556,-289.48159 178.0686,-241.84246 -4.843,5.31597 -122.7047,111.97245 -96.8925,48.38673 21.0376,-31.02267 107.4443,-118.76935 52.9116,-112.59599 z" id="space-doodle-10" fill="#8a4532" stroke-width="1px"/><path id="space-doodle-4" d="m 570.65173,761.43251 c -19.47177,28.22777 -259.5043,237.51203 -248.82446,276.85629 7.31228,26.9383 158.04642,-80.60091 148.63442,-52.36492 -29.22071,87.66212 -130.34615,116.61932 -170.02337,195.97372 -10.54807,21.0962 80.26738,-21.6198 69.817,-11.1695 -42.5263,45.9663 -78.64586,83.4922 -111.30675,132.9492 -36.31082,54.984 102.3721,-58.542 67.58748,-30.7143 3.76011,11.4482 -89.30726,108.5625 -102.08844,137.6134 46.10358,7.6887 234.04649,-254.7216 217.09426,-219.995 -81.54136,167.0372 -25.82241,94.2275 12.51418,38.6373 231.50855,-335.70028 -120.35825,50.3687 -35.13706,-112.6618 7.26702,-25.5099 193.33167,-215.9254 110.89214,-170.70196 -22.86755,12.54434 33.18345,-45.73251 30.85816,-55.12149 -3.98072,-16.07324 -79.92541,44.0899 -90.2076,51.28067 -60.15016,42.0655 -47.54628,5.70377 -45.4069,14.85989 1.2772,5.46615 216.57617,-233.63109 145.59694,-195.4415 z" fill="#22433d" stroke-width="1px"/><path transform="translate(0 139.36121)" d="M 616.5422,107.13922 C 418.00514,152.36053 312.44833,521.54147 385.89332,666.0192 700.90896,894.80184 141.57369,1136.603 134.75696,1389.7392" id="space-doodle-13" fill="none" stroke="#8c59ff" stroke-width="80" filter="url(#filter1411)"/><g id="space-planet" opacity="0.75"><circle id="path115" cx="249.52228" cy="311.17477" r="177.42221" transform="translate(0 139.36121)" fill="#8a4532"/><circle id="planet-circle" cx="249.52228" cy="311.17477" r="177.42221" transform="translate(0 139.36121)" fill="url(#pattern1256)"/><path id="path2244" d="m 114.53484,564.68962 c 6.03528,11.07908 5.33327,-2.63516 3.44023,6.49373 0,0 -53.048979,69.30031 -42.79653,79.55276 122.60824,-68.84595 500.7154,-552.989667 285.52954,-340.94265 -1.03898,1.02383 -7.74421,-5.03825 -8.28089,-4.50157 0,0 117.48371,-121.74139 128.83406,-116.06621 C 562.26351,201.83405 110.78519,717.79308 34.170461,714.49024 9.0042569,691.39409 115.50816,559.1709 114.53484,564.68962 Z" fill="#8c59ff" stroke-width="1px"/></g>
<g
id="space-planet-overlay" @click="changeTheme" @mouseover="hoverPlanet = true"
@mouseleave="hoverPlanet = false"
opacity="0"
v-bind:class="{active: hoverPlanet && !isGhost}">
<circle
id="circle-overlay"
r="177.42221"
cy="311.17477"
cx="249.52228"
style="fill:#d1ba8c;"
transform="translate(0,139.36121)"
/>
<path
id="text-me-planet"
d="m 133.05232,517.60042 c 9.60696,-17.01457 18.03972,-35.39437 31.81685,-49.1715 53.18848,-53.18849 -17.4644,185.0366 10.12354,83.8808 2.39864,-8.79497 25.47105,-101.79638 40.49419,-86.77324 10.23188,12.90362 5.32062,64.70032 -13.01599,111.359 0,-8.4428 41.39883,-130.70145 57.84883,-114.25145 22.65409,22.65409 -27.39872,91.19138 -11.56976,107.02033 17.49714,17.49715 77.60785,-75.69154 63.63371,-89.66568 -15.19807,-15.19806 -39.52447,50.14122 -23.13953,66.52616 26.90618,26.90618 75.20347,-21.80633 75.20347,-49.17151"
style="fill:none;stroke:#000000;stroke-width:5;"/>
<g
id="text-click-planet"
style="fill:#000000;">
<path
d="m 163.68046,430.09049 c 7.5384,-0.25342 10.79694,4.51653 5.91841,10.69667 -9.6455,18.45009 -39.22667,19.25024 -50.56824,2.13981 -9.03929,-14.71456 -9.11975,-36.19806 2.99707,-49.26745 12.92863,-13.32622 39.69284,-11.80158 47.72531,6.15201 5.64516,6.61566 -10.20942,9.84419 -9.03096,1.80948 -7.67939,-13.9921 -30.94467,-11.28035 -36.13056,3.5249 -4.75715,12.50678 -4.12076,29.61522 7.02186,38.64095 11.96523,8.4258 30.42978,1.48611 32.06711,-13.69637 z" />
<path
d="m 183.3916,453.87341 c 0,-22.61074 0,-45.22149 0,-67.83223 6.72797,-1.92293 10.53062,1.34273 8.97644,7.92948 0,17.29933 0,34.59866 0,51.89799 11.13571,0 22.27143,0 33.40714,0 2.32205,7.27684 -2.43828,9.02408 -8.49571,8.00476 -11.29596,0 -22.59191,0 -33.88787,0 z"/>
<path
d="m 238.03681,453.87341 c 0,-22.61074 0,-45.22149 0,-67.83223 6.72797,-1.92293 10.53061,1.34274 8.97643,7.92948 0,19.96758 0,39.93517 0,59.90275 -2.99214,0 -5.98429,0 -8.97643,0 z"/>
<path
d="m 311.19012,430.09049 c 7.5384,-0.25342 10.79694,4.51653 5.91841,10.69667 -9.6455,18.45009 -39.22667,19.25024 -50.56824,2.13981 -9.03929,-14.71456 -9.11975,-36.19806 2.99707,-49.26745 12.92863,-13.32622 39.69284,-11.80158 47.72531,6.15201 5.64516,6.61566 -10.20942,9.84419 -9.03096,1.80948 -7.67939,-13.9921 -30.94468,-11.28036 -36.13056,3.5249 -4.75715,12.50677 -4.12076,29.61522 7.02185,38.64095 11.96523,8.4258 30.42979,1.48611 32.06712,-13.69637 z"/>
<path
d="m 330.90127,453.87341 c 0,-22.61074 0,-45.22149 0,-67.83223 6.72797,-1.92293 10.53061,1.34274 8.97643,7.92948 0,8.56967 0,17.13934 0,25.70901 11.22826,-11.21283 22.45651,-22.42566 33.68477,-33.63849 4.05636,0 8.11272,0 12.16908,0 -9.48541,9.16151 -18.97081,18.32303 -28.45622,27.48454 9.90184,13.44923 19.80368,26.89846 29.70552,40.34769 -10.24541,2.91801 -15.93793,-3.93665 -20.36162,-12.10573 -5.21222,-7.40894 -10.42444,-14.81788 -15.63666,-22.22682 -3.70162,3.60908 -7.40325,7.21817 -11.10487,10.82725 0,7.8351 0,15.6702 0,23.5053 -2.99214,0 -5.98429,0 -8.97643,0 z"/>
</g>
</g>
<path d="m 2159.7998,331.52942 c 18.755,-23.82657 175.8771,-196.84682 237.2508,-224.97915 63.6931,-29.195507 -169.3195,269.09996 -179.9834,290.42763 -11.6718,23.34367 143.5695,-96.8592 130.8208,-45.86432 -4.5722,18.28875 -113.5713,185.8297 -98.0965,201.30445 367.37,-64.96998 111.9135,-240.4632 34.4186,172.79479" id="space-doodle-16" fill="none" stroke="#588170" stroke-width="4"/></g>
<g transform="matrix(.86935 0 0 .86935 308.3125 24.165032)" id="sticker" @click="handleClickSticker" @mouseover="hoverSticker = true"
@mouseleave="hoverSticker = false">
<ellipse id="sticker-circle" v-bind:class="{active: hoverSticker}" cx="2359.7502" cy="184.95338" rx="148.38158" ry="146.44025" opacity="0.2" fill="#d1ba8c"/><g
id="sticker-click-me" v-bind:class="{active: hoverSticker}" opacity="0"
style="fill:#000">
<path
d="m 2323.3245,165.77299 c 6.6147,-0.30305 1.9308,6.66617 -1.301,8.65815 -6.8349,4.3635 -17.6665,1.14642 -19.3766,-7.29462 -2.5804,-7.59832 0.2791,-18.20037 9.037,-20.01099 6.0756,-1.82506 13.5071,1.39115 14.9413,7.90528 -5.8798,3.42922 -5.8721,-8.03637 -12.97,-4.99878 -9.0076,1.29536 -9.7812,13.79728 -5.526,19.98901 4.5347,5.49795 14.3957,3.18217 15.1953,-4.24805 z"/>
<path
d="m 2331.6448,175.81206 c 0,-9.54427 0,-19.08855 0,-28.63282 3.2543,-0.74224 4.5597,0.46441 3.789,3.7472 0,7.16891 0,14.33781 0,21.50671 4.7005,0 9.4011,0 14.1016,0 1.0278,3.54193 -1.221,3.80729 -4.1636,3.37891 -4.5756,0 -9.1513,0 -13.727,0 z" />
<path
d="m 2354.7112,175.81206 c 0,-9.54427 0,-19.08855 0,-28.63282 3.2543,-0.74224 4.5597,0.46441 3.789,3.7472 0,8.29521 0,16.59041 0,24.88562 -1.263,0 -2.526,0 -3.789,0 z" />
<path
d="m 2385.5901,165.77299 c 6.6148,-0.30306 1.9308,6.66611 -1.301,8.65815 -6.8349,4.36349 -17.6665,1.14646 -19.3765,-7.29462 -2.5804,-7.5983 0.279,-18.20033 9.0369,-20.01099 6.0757,-1.82509 13.507,1.39121 14.9414,7.90528 -5.8799,3.42922 -5.8722,-8.03625 -12.97,-4.99878 -9.0077,1.29527 -9.7813,13.79726 -5.5261,19.98901 4.5347,5.49795 14.3957,3.18217 15.1953,-4.24805 z" />
<path
d="m 2393.9104,175.81206 c 0,-9.54427 0,-19.08855 0,-28.63282 3.2543,-0.7422 4.5599,0.46435 3.7891,3.7472 0,3.48401 0,6.96801 0,10.45202 4.7396,-4.73307 9.4791,-9.46615 14.2187,-14.19922 2.0644,0.19419 7.2324,-0.86574 3.3398,1.73551 -3.4049,3.28868 -6.8099,6.57737 -10.2148,9.86606 4.1797,5.67708 8.3594,11.35417 12.5391,17.03125 -2.3874,-0.21575 -5.5207,1.00532 -6.4374,-2.04318 -2.9193,-4.14967 -5.8386,-8.29934 -8.7579,-12.44901 -1.762,2.27201 -5.5282,3.69898 -4.6875,7.06845 -0.279,2.33437 0.5575,5.78424 -0.4164,7.42374 -1.1242,0 -2.2485,0 -3.3727,0 z" /><path
id="me-sticker"
d="m 2300.3948,212.37395 c 5.4017,-9.56676 10.1431,-19.90115 17.8896,-27.6476 29.9063,-29.90622 -9.8197,104.0403 5.6922,47.16355 1.3487,-4.94513 14.3216,-57.23692 22.7686,-48.78988 5.7531,7.25531 2.9916,36.37897 -7.3185,62.61369 0,-4.74712 23.2772,-73.48934 32.5266,-64.24002 12.7377,12.73769 -15.4055,51.27406 -6.5053,60.17419 9.8381,9.8381 43.6364,-42.55899 35.7792,-50.41621 -8.5454,-8.5454 -22.2234,36.3739 -13.0106,45.58664 15.1285,15.1285 30.2653,-13.20858 30.2653,-28.59517"
style="fill:none;stroke:#000;stroke-width:3;"/>
</g><g id="sticker-letters" fill="#8c59ff"><path d="m 2407.2744,259.07316 c 2.4773,7.58271 -13.6297,3.61912 -7.1057,13.37807 7.2077,3.53685 15.8105,3.21175 23.6599,4.9333 4.0869,0.5738 9.5275,0.1595 6.6642,5.80665 -9.3395,-1.08397 -19.5993,-2.67874 -29.1465,-4.61986 -12.2872,-3.26864 -6.7842,-23.75669 5.9281,-19.49816 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2411.3937,325.86372 c -1.4397,6.14194 -5.2801,2.81705 -8.8786,0.44628 -7.1162,-4.97586 -16.7369,-7.73679 -20.7895,-15.93211 -3.8961,-12.9531 12.5151,-26.81108 23.6472,-16.43836 6.1594,3.6675 12.3189,7.33499 18.4783,11.00249 -1.4398,6.14188 -5.2802,2.81707 -8.8786,0.44626 -6.9521,-3.42377 -13.0983,-9.69387 -21.0746,-10.08088 -12.3491,4.03876 -8.2705,18.82273 2.5076,21.63195 4.9961,2.97479 9.9921,5.94958 14.9882,8.92437 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2378.9708,326.05138 c -5.0612,6.04349 -13.6903,-5.50087 -19.5897,3.79141 -9.3957,10.07642 6.7326,13.85701 13.3911,7.5243 11.5043,-7.20091 22.0267,10.24078 10.3593,17.1498 -3.2388,7.21857 -24.4796,4.28606 -16.1507,-2.66951 6.1507,8.63156 25.4275,-7.13154 11.6943,-11.01307 -8.3296,2.25773 -21.7746,10.28118 -26.2324,-1.82063 -3.8293,-13.17345 18.5313,-25.28647 26.5281,-12.9623 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2331.7653,337.12902 c 2.3797,10.68148 4.7594,21.36297 7.1391,32.04445 3.9901,-0.88894 7.9801,-1.77788 11.9702,-2.66682 3.248,5.54595 -3.1547,4.95782 -6.9247,6.04302 -6.9727,1.55343 -13.9453,3.10685 -20.918,4.66028 -3.248,-5.54595 3.1547,-4.95783 6.9247,-6.04302 6.3639,0.60566 2.8961,-5.03772 2.3843,-8.80225 -1.7945,-8.05484 -3.589,-16.10967 -5.3835,-24.16451 1.6026,-0.35705 3.2053,-0.7141 4.8079,-1.07115 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2314.1769,350.75519 c 1.5927,6.26989 -4.2289,4.23076 -8.3212,4.1297 -4.7597,2.15482 -8.8719,-4.18862 -3.6821,-4.81264 4.0011,0.22764 8.0022,0.45529 12.0033,0.68294 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2294.7245,338.25236 c -4.2761,11.64742 -8.5522,23.29485 -12.8283,34.94227 -7.8576,-2.88475 -15.7153,-5.76949 -23.5729,-8.65424 0.265,-6.42162 5.3339,-2.46598 9.0923,-1.3412 3.7902,1.39146 7.5803,2.78291 11.3705,4.17437 0.7652,-3.52297 4.0391,-8.20731 3.3412,-11.053 -5.2557,-1.92949 -10.5114,-3.85899 -15.7671,-5.78848 0.2651,-6.42159 5.334,-2.46602 9.0924,-1.34119 3.4972,0.39569 9.419,6.02899 9.9793,0.0803 1.5562,-4.23882 3.1123,-8.47764 4.6685,-12.71646 1.5414,0.56587 3.0827,1.13173 4.6241,1.6976 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2253.344,340.28491 c -8.1794,10.49392 -26.1298,8.05643 -30.6602,-4.64474 -6.8378,-16.02057 15.6403,-34.65302 29.5262,-22.79207 9.1227,6.42325 9.1691,20.12767 1.134,27.43681 z m -3.5409,-3.64079 c 12.4512,-9.14843 -1.5177,-30.18301 -14.5459,-20.72343 -12.4216,5.33157 -11.9397,26.49132 3.4208,26.55261 4.4326,0.0363 8.1322,-2.88197 11.1251,-5.82918 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2237.9196,296.0342 c -11.7808,3.89343 -23.5617,7.78687 -35.3425,11.6803 -2.1877,-8.14478 -6.6,-15.98518 -6.4128,-24.52672 2.1933,-9.5553 17.0155,-9.73685 19.6279,-0.13738 1.2679,-7.41585 7.6636,-12.29871 11.8335,-18.16394 2.3895,4.08218 1.8957,7.63089 -1.8872,10.57103 -5.166,5.2768 -9.8818,12.29388 -5.585,19.49491 1.598,3.3475 7.4118,-1.68251 10.7465,-1.78611 4.3529,-1.8114 6.3132,-2.68654 7.0196,2.86791 z m -21.2902,1.84837 c -2.5756,-5.72432 -2.5412,-13.7511 -8.6604,-16.89967 -10.6258,-1.05231 -6.9138,10.70216 -4.4068,16.60428 0.053,6.42429 5.2545,2.61873 9.0401,1.62631 1.3423,-0.44364 2.6847,-0.88728 4.0271,-1.33092 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2217.872,261.97571 c -6.1877,1.88719 -4.4258,-4.02429 -4.5181,-8.11676 -2.3772,-4.6526 3.7649,-9.05996 4.6334,-3.90542 -0.038,4.00739 -0.077,8.01479 -0.1153,12.02218 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2211.1556,237.04917 c -12.9439,-3.07907 -18.1861,-20.41912 -8.516,-29.81778 11.7304,-12.87673 38.0187,-0.17388 33.0005,17.38506 -2.0515,10.96694 -14.4974,16.70391 -24.4845,12.43272 z m 1.8401,-4.7336 c 13.4952,7.52373 26.823,-13.92285 12.805,-21.84203 -10.0111,-9.08292 -29.0574,0.14824 -22.73,14.14526 1.8089,4.04689 6.0006,6.19924 9.925,7.69677 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2244.943,204.74519 c -8.4397,-9.09502 -16.8793,-18.19005 -25.319,-27.28507 2.5944,-4.52673 6.8018,-2.92708 10.9039,-1.72708 9.0033,2.138 18.0065,4.276 27.0098,6.414 -6.6262,-7.14077 -13.2525,-14.28155 -19.8787,-21.42232 3.0657,-5.51942 5.7515,-0.87306 8.4956,2.21227 6.7617,7.28681 13.5235,14.57363 20.2852,21.86044 -2.5946,4.52746 -6.8015,2.92592 -10.9033,1.72418 -9.0092,-2.14323 -18.0184,-4.28647 -27.0276,-6.42971 6.632,7.14698 13.2639,14.29395 19.8959,21.44093 -1.1539,1.07079 -2.3079,2.14157 -3.4618,3.21236 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2274.1257,180.5645 c -3.8395,-11.79852 -7.6791,-23.59705 -11.5186,-35.39557 8.531,-2.77621 17.0619,-5.55243 25.5929,-8.32864 3.7616,5.2113 -2.668,5.2358 -6.3176,6.67523 -4.4106,1.43536 -8.8213,2.87072 -13.232,4.30608 1.8222,3.04307 1.5715,10.15876 4.8073,10.42442 6.1005,-1.98527 12.2011,-3.97055 18.3016,-5.95582 3.7614,5.20453 -2.7009,5.20566 -6.3255,6.65108 -3.968,1.29131 -7.9361,2.58263 -11.9041,3.87394 1.3069,4.01601 2.6138,8.03201 3.9207,12.04802 7.2433,-2.35717 14.4866,-4.71433 21.7299,-7.0715 3.7616,5.2113 -2.668,5.23581 -6.3176,6.67523 -6.2456,2.03251 -12.4913,4.06502 -18.737,6.09753 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2305.2872,161.2296 c -1.9638,-6.16389 3.9691,-4.47514 8.0601,-4.618 4.6227,-2.43446 9.106,3.65268 3.9626,4.58477 -4.0075,0.0111 -8.0151,0.0222 -12.0227,0.0332 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2325.3486,172.02969 c 3.975,-11.75359 7.95,-23.50717 11.925,-35.26076 8.5443,3.70074 20.9524,4.06536 24.0967,14.52187 3.011,11.8942 -6.0133,29.69258 -20.2346,25.91047 -5.3362,-1.47041 -10.5222,-3.4632 -15.7871,-5.17158 z m 6.0734,-2.58299 c 6.8132,2.10942 15.9602,7.21882 21.0795,-0.59041 6.7951,-8.00052 6.3282,-23.34404 -6.4728,-24.48945 -4.9136,-3.27344 -6.8451,-0.51714 -7.6515,4.51423 -2.3184,6.85521 -4.6368,13.71042 -6.9552,20.56563 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2357.1457,183.58048 c 11.8638,-5.99183 23.7277,-11.98367 35.5915,-17.9755 5.0794,2.36325 3.2859,6.43173 1.4081,10.5211 -3.7304,10.28408 -7.4607,20.56817 -11.191,30.85225 -4.8112,-2.34433 -4.0529,-6.00896 -1.7318,-10.0441 3.4937,-4.43017 0.065,-7.21934 -3.5528,-9.96357 -3.0754,-2.23543 -5.7404,-7.73681 -9.6167,-3.59629 -3.7256,1.92433 -7.6708,5.59787 -10.5212,0.55616 z m 18.2234,-4.11041 c 3.1164,2.82525 6.2327,5.65051 9.3491,8.47576 2.3998,-5.92263 4.5435,-11.95604 7.2738,-17.73859 -5.1322,3.76323 -11.0474,6.2492 -16.6229,9.26283 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2386.7994,217.59855 c 4.6948,-2.6826 10.1406,-4.58366 14.3808,-7.73933 4.0949,-7.31007 8.1897,-14.62015 12.2846,-21.93022 3.3044,3.81323 2.3685,7.52023 -0.63,11.17556 -3.1477,6.36293 -11.8634,14.78869 1.1515,12.73539 4.0856,0.85634 9.1857,0.24845 12.6603,1.98683 4.5795,5.61622 -0.5261,4.35667 -5.0356,3.52034 -6.3521,-0.60081 -12.8847,-2.26544 -19.1248,-2.20593 -4.4841,2.28241 -8.9683,4.56481 -13.4524,6.84721 -0.7448,-1.46328 -1.4896,-2.92657 -2.2344,-4.38985 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/><path d="m 2404.305,231.37575 c 5.7035,-3.05261 5.1229,3.08845 6.0081,7.08511 3.2353,4.10253 -1.9342,9.61849 -3.787,4.73066 -0.7403,-3.93859 -1.4807,-7.87718 -2.2211,-11.81577 z" transform="matrix(-.11092 1.05014 -1.05014 -.11092 2885.3987 -2215.4495)"/></g></g><path id="neck" d="m 1083.8686,1282.9525 c 11.0434,-28.2897 -16.7836,-196.9492 2.7646,-199.0565 135.2839,193.9926 428.0824,-48.0949 392.5835,-74.6461 18.4809,18.4809 -2.7647,100.2048 -2.7647,127.175 0,37.0294 30.9515,124.7123 19.3527,147.9099 -37.8875,177.1852 -399.3921,200.8282 -411.9361,-1.3823 z" fill="#fff3e2" stroke="#964e00" stroke-width="1px"/><ellipse ry="488.45145" rx="76.347572" cy="693.6853" cx="1262.8484" id="ellipse-inside-left" fill="#923700" stroke-width="15.03806496" stroke-linecap="round" stroke-linejoin="round"/><ellipse ry="488.13211" rx="73.112518" cy="692.68787" cx="1268.0641" id="ellipse-inside-right" fill="#923700" stroke-width="4.13870049" stroke-linecap="round" stroke-linejoin="round"/><g id="mars-landscape" transform="translate(-12.1189 157.64155)" fill-opacity="1.0"><circle r="113.10667" cy="204.72145" cx="1335.1022" id="mars-sun" transform="translate(12.1189 -18.28034)" fill-opacity=".85" fill="#ff3601"/><path id="mars-cloud-1" d="m 1210.9066,162.58367 c -90.7664,42.99464 13.3067,24.5151 13.3067,26.61333 0,10.85823 -96.1137,52.47743 -88.7111,59.88 21.6373,21.63731 170.732,-59.91683 157.4622,-73.18667 -4.2577,-4.25768 -44.3555,6.2708 -44.3555,4.43556 0,-18.45859 73.3998,-53.57005 61.5638,-55.344 -32.4286,7.58709 -80.9471,28.89276 -99.2661,37.60178 z" transform="translate(12.1189 -18.28034)" fill="#ffd1d4"/><path id="mars-cloud-2" d="m 1128.9139,321.28565 c -4.3575,-0.47031 1.5205,-7.88479 12.2445,-16.67468 46.516,-38.12656 139.8,-80.16072 142.9349,-65.64121 -2.0368,4.07356 -11.0889,19.32185 -11.0889,23.4139 0,18.94213 131.8403,-70.64534 137.7313,-63.94401 -12.3594,24.11621 -96.1996,66.69048 -145.3087,109.51935 -38.3451,21.46972 -23.4668,-17.26952 -22.8327,-22.4159 5.1002,-41.39266 -82.1857,29.19532 -113.6804,35.74255 z" transform="translate(12.1189 -18.28034)" fill="#ffd1d4"/><path id="mars-mountains" d="m 973.12388,698.99452 c -38.02135,-5.01362 -12.04451,-95.13551 -9.14747,-149.67535 -11.80324,-42.47656 -17.29827,-59.39118 -7.42969,-125.90004 -3.53346,-76.9804 -40.16416,-27.1888 57.61188,-234.82327 62.2449,-108.018822 90.0681,-5.82997 123.6714,8.79482 53.6416,29.83458 53.223,83.36138 67.4193,133.9548 54.7468,87.74328 36.7445,174.94109 18.3643,210.71009 -19.7039,38.34503 18.9195,-151.23872 66.7288,-273.58145 15.7373,-40.27132 12.8001,-48.8353 46.8293,-53.59479 12.0698,-1.68814 34.5127,-81.28917 80.2461,-60.1239 43.38,-94.240255 45.6128,98.50235 65.9489,124.24275 54.7242,6.82882 48.5916,37.99546 58.8414,66.33841 41.9894,-18.30457 43.7552,89.79988 37.7074,116.9168 12.5264,76.6363 46.9336,135.78937 -46.2103,169.25601 -23.7135,148.66461 -532.6538,176.50397 -560.58132,67.48512 z" transform="translate(12.1189 -18.28034)" fill="#8c59ff" fill-opacity="1"/><path id="mars-land-1" d="m 1082.7855,990.46974 c -6.5166,-65.13628 -7.5397,-78.95973 -20.1861,-93.44619 -44.671,-51.1705 -62.85513,-39.59117 -94.66315,-153.33529 -18.31976,-65.51068 -22.98896,-102.01171 0.19934,-117.48512 119.49981,-71.15529 222.40361,136.73115 301.74501,161.76091 44.3184,44.31831 286.4895,-168.91579 334.5738,-200.36441 -52.8433,59.09602 49.9174,14.24503 -42.3316,163.17235 -25.7436,41.56058 -14.2113,92.23766 -75.6139,151.52627 2.1462,283.55894 -267.8009,132.36334 -403.7234,88.17148 z" transform="translate(12.1189 -18.28034)" fill="#e5b378" fill-opacity="1.0"/><path id="mars-land-3" d="m 1269.5779,762.70055 c 0.8594,-19.03487 33.403,-46.01686 91.6246,-59.05369 143.2348,-32.39211 -24.9662,-23.16213 82.6338,-102.35572 3.2672,-5.14577 11.5149,-31.94809 18.862,-56.36949 5.7063,-18.96726 21.8731,-39.9175 26.1936,-32.47092 22.4435,11.22175 11.3796,107.57988 25.9948,122.19508 6.5377,-13.42862 10.6085,-45.09187 15.2634,-65.12411 19.956,-74.69402 24.3775,39.36158 28.9475,42.92681 10.3768,10.37678 15.7078,-67.65858 31.0042,-60.01041 27.0131,21.35478 17.7906,122.46426 0.059,116.70823 -7.3562,14.49279 -65.4292,-8.66082 -89.0094,54.81255 -49.8895,84.77242 -172.6447,124.6569 -231.5732,38.74167 z" transform="translate(12.1189 -18.28034)" fill="#af8272"/><path id="mars-land-2" d="m 956.91909,702.23548 c 7.64592,-16.92349 23.24938,-33.3354 58.24841,-67.22499 17.1812,-16.63661 42.0432,-30.69368 102.6644,22.11457 78.4556,68.34414 210.7809,117.58872 193.8473,132.35571 -133.2768,34.00554 -212.3499,-48.30546 -267.7057,-26.07179 -74.1094,29.76608 -69.4524,-4.24956 -87.05441,-61.1735 z" transform="translate(12.1189 -18.28034)" fill="#af8272" fill-opacity="1.0"/><path id="rocket-shade" d="m 1122.1867,830.3348 c 306.4828,-16.84206 41.9469,-36.71014 51.8607,-47.79551 58.9444,-0.25536 88.0118,16.12693 136.848,5.69492 88.6081,-18.92777 167.1125,-27.22942 154.7135,-20.57775 -9.457,25.50828 -155.8228,138.29245 -343.4222,62.67834 z" transform="translate(12.1189 -18.28034)" fill="#000404" fill-opacity="1.0"/>
<path
style="fill:#3f0808"
d="m 1061.2198,852.52716 c 8.3126,0 20.2308,19.55408 25.2232,23.99239 5.2293,7.12321 8.392,15.92054 3.5849,16.14543 -21.4866,-17.11794 -23.4506,-28.6912 -30.746,-33.79354 -7.5647,-4.97469 -4.6794,1.19974 -2.5029,9.12597 0,0 3.4331,23.13724 -8.7561,32.5393 -4.8696,-3.90597 6.7108,-33.05062 -0.5002,-37.86169 -10.0138,-4.26347 -7.6455,3.34391 -14.9378,-5.88294 -10.4502,2.31852 -14.3194,32.1113 -21.1497,38.51676 -13.10096,-2.35418 4.2537,-36.47754 12.6728,-46.43673 -26.63012,-3.86649 -30.63722,-13.09972 -34.63768,-21.57729 -0.766,-4.96792 0,-2.24354 -0.41847,-8.24996 1.27593,-15.75078 5.96853,-20.75534 13.68675,-23.01929 41.6307,-6.93591 46.5916,32.67657 42.7274,41.12546 4.0486,-3.63505 13.5567,-31.68163 28.982,-21.61873 1.1465,2.59366 -13.679,11.38046 -17.1508,20.61589 10.4639,-4.38894 21.3379,-23.2748 34.1225,-9.11207 0.9373,1.03425 1.846,6.56029 -0.038,7.41673 -5.3439,6.60686 -5.2761,-4.52436 -8.6722,-4.38296 -4.6442,0.19339 -11.9337,3.95936 -18.172,11.19754 23.7722,-6.13172 35.3365,4.94923 56.7441,27.05114 4.3443,12.15937 -20.9812,-12.98922 -33.9332,-15.37749 -17.5031,-6.62518 -2.7572,-7.21133 -26.1274,-0.41392 z"
id="spider-1" transform="translate(25,-120)"/><path id="spider-2" d="m 1501.7416,843.87314 c -11.5866,0 -28.1988,26.8847 -35.1574,32.9869 -23.8768,20.9382 -26.0455,30.78248 -29.774,46.96878 7.7524,7.9628 10.6333,-13.65598 24.777,-24.77058 29.9494,-23.5353 35.0695,-53.2661 35.6422,-36.8616 0.387,1.0157 -2.2475,11.0153 0.9044,12.4277 2.9772,1.3342 5.8312,-16.1046 9.7978,-9.4813 3.8637,-10.3156 -8.6373,52.0754 8.3526,65.0022 6.7877,3.7032 -5.7171,-63.3149 1.6984,-71.6169 3.98,-4.4558 13.5076,3.8945 23.6719,-8.7914 14.5661,3.1877 25.6608,39.21742 26.6288,29.74612 10.1927,-2.24271 -12.8797,-31.25589 -14.8132,-40.63522 37.1183,-5.316 42.7036,-18.01068 48.2797,-29.66641 1.0677,-6.83034 0,-3.08462 0.5832,-11.34278 -1.7784,-21.65561 -8.3191,-28.53633 -19.0771,-31.649 -58.0272,-9.53611 -64.9418,44.92669 -59.5559,56.54299 -5.6431,-4.9978 -21.9196,-35.6052 -43.4202,-21.7698 -1.598,3.566 22.0903,7.6933 26.9294,20.391 -14.5851,-6.0343 -29.742,-32.0003 -47.5617,-12.5281 -1.3065,1.422 -2.5731,9.0197 0.054,10.1972 7.4487,9.0837 7.3542,-6.2205 12.0879,-6.0261 6.4733,0.2659 16.6338,5.4437 25.3292,15.3954 -38.7465,-16.7329 -76.6807,2.3198 -106.0566,33.3928 -6.0554,16.7178 35.6646,-21.6583 53.7177,-24.9419 24.3967,-9.1089 24.3869,-2.3157 56.9615,7.03 z" style="transform:translate(-10px,-110px)" fill="#000" fill-opacity="1"/></g>
<g
id="spider-marks" style="fill:#540b00" transform="translate(-10,-110)">
<path
d="m 1531.9035,938.97311 c -1.9183,1.71571 -11.3326,13.21061 -8.1811,16.36212 1.9348,1.9348 4.201,-2.95742 6.1358,-1.02263 1.141,1.14103 -0.3956,8.89019 3.0679,7.15843 3.0358,-1.51788 22.418,-28.20858 19.4513,-31.17524 -1.9283,-1.92829 -17.7469,8.67732 -20.4739,8.67732 z"/>
<path
d="m 1563.6051,936.92785 c -13.0207,-1.21419 -7.8288,9.52169 -11.249,16.36212 -1.0485,2.09709 -10.6121,22.13339 -9.3277,23.41777 4.1217,3.51596 56.1533,-52.7385 20.5767,-39.77989 z" />
<path
d="m 1539.9091,958.84178 c -11.4716,12.68557 -14.6539,31.0426 -5.3519,23.20607 7.6664,-6.45861 10.009,-18.89351 5.3519,-23.20607 z"/>
<path
d="m 1576.8993,950.22207 c 2.7827,6.42149 -8.0762,10.80923 -12.3443,13.41829 -3.8777,5.81655 -6.4889,10.52801 -10.1537,14.19279 -4.8239,8.11838 23.3692,-0.81349 27.2089,-10.72259 5.0462,-5.33612 11.5129,-32.82131 -4.7109,-16.88849 z"/>
<path d="m 1566.673,928.23547 c -0.4982,0.0538 -4.3868,-1.23768 -5.1132,-0.51131 -3.6093,3.6093 7.1209,6.17333 9.2037,4.09053 2.793,-2.79304 -0.968,-4.62006 -4.0905,-3.57922 z"/>
<path
d="m 1522.1885,961.98234 c -4.1414,2.96701 -2.3491,14.98008 4.0905,11.76028 4.9557,-2.47788 -2.3767,-11.189 -4.0905,-11.76028 z"/>
<path
d="m 1553.3788,984.48026 c -2.1516,-1.01521 -3.1685,-1.02263 -5.1132,-1.02263 -28.9895,0 10.1534,11.10311 5.1132,1.02263 z"/>
</g>
<path id="shirt" d="m 542.59817,1947.7309 c 13.4593,-115.8679 -6.8544,-465.5925 104.375,-511.5773 23.223,-11.6115 78.9654,-27.4259 102.5036,-35.272 57.0466,-19.0156 136.60732,-47.0377 184.57592,-76.2562 62.3062,-37.8585 116.55821,-66.2815 153.62501,-62.543 106.5344,249.6118 399.2814,111.4806 404.6681,-35.1886 38.3,30.907 84.4069,76.924 130.9795,101.6558 105.2145,22.6281 186.9984,60.43 252.4764,80.8473 19.8698,6.1958 59.4319,28.8115 73.5739,51.6661 72.6346,185.3131 40.9856,432.305 56.3613,472.7822 9.4596,24.9028 -1189.87413,17.107 -1463.13873,13.8857 z"/><path id="neck-shadow" d="m 1479.2134,1009.2499 c -133.1914,143.2575 -223.4947,81.2515 -392.5835,74.6461 -5.4245,2.1929 -4.9991,45.4646 -3.8444,45.9349 31.8338,161.8018 376.1154,343.968 394.2745,-13.4666 0.8316,-16.3694 10.9551,-88.1767 2.1534,-107.1144 z" fill="url(#linearGradient1193)" stroke-width="1px"/><g id="rocket" transform="translate(-1717.5721 96.075784)"><g id="rocket-inside" transform="translate(-200.8976 381.21401)"><g id="fire" transform="translate(.01411318)" fill-opacity=".75"><path d="m 2990.3692,455.18922 c -25.1175,-25.32348 -15.2673,-36.97822 2.2831,-37.29387 15.2466,0 22.1521,11.96806 -2.2831,37.29387 z" id="fire-big" fill="#ff3c00" stroke-width=".61176026px"/><path d="m 2991.1858,428.15174 c -19.2924,2.04633 -6.7137,12.36479 -0.4592,22.74656 7.4082,-14.26718 17.9705,-21.1814 0.4592,-22.74656 z" id="fire-small" fill="#ffbeaa" stroke-width=".81037462px"/></g><path d="m 2963.1049,436.56295 -5.2665,-17.46369 h 66.0345 l -4.0512,17.46369 z" fill="#181818" stroke="#000" stroke-width="1.04473948px"/><path d="m 2991.0888,128.76542 c -57.4565,60.89905 -82.3182,165.21014 -36.8965,294.69976 23.8495,-0.0347 23.2806,0.82174 36.8965,0 0.6392,-17.49357 2.8855,-169.00113 0,-294.69976 z" fill="#226055" stroke-width="1.04473948px"/><path d="m 2991.0888,128.76542 c 57.4565,60.89905 82.3182,165.21014 36.8965,294.69976 -23.8495,-0.0347 -23.2806,0.82174 -36.8965,0 -0.6392,-17.49357 -2.8855,-169.00113 0,-294.69976 z" fill="#22433d" stroke-width="1.04473948px"/><path d="m 2994.8129,220.95601 -38.9594,139.20636 34.5695,-27.72332 -36.2307,91.02613 95.8035,-135.13157 -37.0751,24.64015 36.0926,-58.10964 c -0.9495,-11.48078 -4.1705,-22.93504 -7.169,-33.90811 z" fill="#408cca" stroke-width=".71363497px"/><path d="m 2939.2029,355.44119 c -13.7826,4.55451 -34.7614,59.89102 -27.9142,93.29026 0.6597,3.2181 2.9274,3.61695 4.2145,1.77853 10.7505,-19.39311 11.1179,-30.92189 34.6379,-45.1024 -0.1866,-2.96159 -11.79,-43.87524 -10.9382,-49.96639 z" fill="#ff3c00" stroke-width="1.04473948px"/><path d="m 3043.0825,355.44118 c 13.7826,4.55451 34.7614,59.89102 27.9142,93.29026 -0.6597,3.2181 -2.9274,3.61695 -4.2145,1.77853 -10.7505,-19.39311 -11.1179,-30.92189 -34.6379,-45.1024 0.1866,-2.9616 11.79,-43.87524 10.9382,-49.96639 z" fill="#bf2d00" stroke-width="1.04473948px"/><path d="m 2988.4352,213.12472 -38.9594,139.20636 34.5695,-27.72331 -31.846,87.98062 91.4188,-132.08607 -37.0751,24.64016 40.8759,-62.46035 c -2.6594,-14.10228 -8.352,-30.02533 -8.7634,-32.16783 z" fill="#ff3c00" stroke-width=".71363497px"/><path d="m 2991.8684,351.12519 c -19.5118,-0.59709 -6.7341,98.0723 -0.8102,99.93277 9.5197,-21.85225 10.5701,-98.00232 0.8102,-99.93277 z" fill="#bf2d00" stroke-width="1.04473948px"/><path d="m 2991.0888,128.76542 c -9.7231,9.07825 -30.7926,38.00668 -35.4786,51.29959 l 71.0887,0.39861 c -9.2641,-21.5626 -27.1986,-43.66153 -35.6101,-51.6982 z" fill="#bf2d00" stroke-width="1.04473948px"/><circle cx="2991.303" cy="238.64397" r="37.180824" fill="#ae8c81" stroke="#000" stroke-width="4.22800112" stroke-linecap="round" stroke-linejoin="round"/><path d="m 2983.4624,268.62653 c 16.7492,-12.61191 35.1126,-9.03383 35.4876,-4.61645 -8.7604,12.96822 -34.8783,17.43595 -51.0543,1.3955 -6.8893,-6.8316 1.4379,-11.70208 6.7359,-5.00003 1.22,1.54338 9.4447,9.5392 8.8308,8.22098 z" stroke-width="1px"/><path d="m 3004.7674,264.49786 c -13.2601,0 -17.6906,-19.37986 -15.7205,-31.21767 11.4369,-19.60223 29.3899,-20.14036 32.6492,-0.65311 1.3872,10.21306 -3.3464,31.87078 -16.9287,31.87078 z" fill="#ffedc9" stroke-width="1.60777175px"/><path id="rocket-eye-left" stroke-width="8.86973572" stroke-linecap="round" stroke-linejoin="round" d="M2994.9387 239.55263H2999.4387V244.05263H2994.9387z"/><path id="rocket-eye-right" stroke-width="8.86973572" stroke-linecap="round" stroke-linejoin="round" d="M3010.6653 239.55263H3015.1653V244.05263H3010.6653z"/><path d="m 3003.2215,241.59436 c 0.4456,0.44558 -3.172,9.97868 1.8067,9.48343 5.0316,-0.50051 1.9474,-5.06079 1.7432,-9.70159 -1.179,-0.62892 -1.9617,-1.54009 -3.5499,0.21816 z" fill="#e0ae9e" stroke-width="1.39651358px"/><path d="m 3011.6926,253.76624 c -2.6907,-0.0313 -7.6723,-1.92052 -13.4632,0.33552 4.4433,6.4959 11.0568,4.03552 13.4632,-0.33552 z" fill="#a02c2c" stroke-width="1.22119164px"/><path d="m 2987.8832,241.29545 c -0.3355,-1.81171 -2.3615,8.94886 -2.6344,7.24205 -1.8372,-11.49377 1.2158,-24.15154 5.5747,-27.61736 0.9153,-0.72783 -2.5641,-7.50689 -1.6029,-7.84553 0.9098,-0.32056 5.797,4.99539 6.0634,3.90703 0.776,-3.17019 -0.4504,-8.25703 0.5588,-7.45083 11.5852,13.6108 2.2329,-2.15554 6.9205,-2.40992 5.4915,4.72501 6.5613,16.39031 4.8458,1.97285 2.1693,-0.96711 3.7994,4.4235 4.7321,7.40841 0.3486,1.11567 0.7388,-4.21297 1.9012,-4.09127 2.1145,0.22138 2.037,6.83941 1.7033,8.34812 2.8405,0.99461 0.519,-6.08636 1.9924,-4.83313 12.7487,14.12294 10.0888,36.81957 -0.6007,45.41408 0,0 0.81,1.08539 0.6952,-6.55987 0.5754,-5.86336 3.1862,-20.65174 -0.05,-25.42692 -12.9046,-3.06253 -16.2652,-1.67449 -26.0197,0.2053 -2.6228,7.43818 -2.3589,17.1467 0.3677,24.20629 1.891,5.54303 3.3453,5.45469 -2.3837,10.6754 -1.9318,1.47685 1.1183,-7.14018 -0.047,-5.11407 -2.9206,5.07659 -3.4989,7.00167 -3.2199,4.97237 l 0.8853,-6.43893 -3.0335,4.95044 c 1.4527,-8.56767 3.4736,-9.57163 3.3506,-21.51451 z" fill="#bf2d00" stroke-width="1.85440207px"/><g id="rocket-arm-ziggy" transform="translate(153.06483 468.76117)" stroke-width="1.0486809px"><path id="rocket-hand-ziggy" d="m 2809.012,-226.85567 c -3.2125,-2.76998 -2.6339,-15.2907 -0.129,-14.48199 1.0969,0.42607 0.4041,4.72362 0.9925,4.95212 0.467,0.18157 1.6145,-4.6699 2.5241,-4.31656 0.9557,0.37136 0.7344,5.42142 1.4482,5.69885 0.7306,0.28378 0.769,-4.85304 1.3011,-4.64632 1.9934,-2.43526 3.5758,11.2451 0.2262,14.11771 -1.0353,0.88796 -3.2767,1.40779 -6.3631,-1.32381 z" fill="#ffedc9"/><path id="path2531-0-4" d="m 2815.9439,-225.5755 c -1.4046,-1.27184 -3.2747,-1.19452 -6.9319,-1.28017 -3.9828,1.01504 0.7411,18.57632 1.0153,21.87937 3.4454,2.11476 17.7983,5.48573 16.0123,1.65713 -1.8189,-4.12275 -8.4459,-18.51686 -10.0957,-22.25633 z"/></g></g></g><path class="letters" id="text-we" d="m 1036.4717,371.3897 c -40.51639,5.04416 -67.16514,47.85005 -77.15856,84.45781 -40.4142,158.89094 147.47116,-50.9767 116.29696,-67.10349 -36.0376,-18.64275 -93.33985,189.54311 -72.5516,194.92006 14.5628,3.76683 63.5649,-46.65912 71.4334,-57.24214 12.7112,-17.09652 17.6528,-47.18793 14.5372,-43.96442 -52.9292,147.30373 20.8287,123.28689 49.2025,-17.35434 0.289,-2.24335 11.9455,-80.9979 4.473,-76.35916 -15.466,9.60086 -29.329,86.9845 -27.956,106.44007 2.0904,29.62229 71.3864,41.53216 69.3309,-21.98215 -12.3146,-44.45615 -60.9096,67.22896 -44.7295,92.55647 25.3052,43.40406 91.6052,-38.45145 111.8239,-84.4578" fill="none" stroke="#fff" stroke-width="10" opacity="0"/><g transform="matrix(.74066 0 0 .88346 306.08739 219.83548)" id="text-can" stroke-width="11"><path id="path965-4" d="m 1389.6528,195.55169 c -16.0413,1.04623 -94.3001,63.3011 -70.4782,95.06359 18.1669,24.22253 167.2624,-48.22886 149.1515,-75.39524 -26.8749,-40.31246 -173.5484,131.49917 -145.8735,186.84914 16.9384,33.87668 89.0601,-33.88581 99.9807,-55.72697" class="letters" opacity="0" fill="none" stroke="#fff"/><path id="path967-6" d="m 1567.4293,290.04358 c -50.2616,-79.9427 -164.0812,61.95713 -123.6035,101.91246 11.0154,8.95134 103.4278,-90.15299 97.3163,-90.15299 -6.4497,0 -30.1571,77.89979 -15.5706,83.82648 6.7077,20.17716 83.4796,-116.31746 72.0141,-107.55094 -8.2078,-4.346 -21.8751,112.91087 -22.2158,100.60221 0,-9.45265 57.1062,-110.20848 68.9275,-100.60221 10.6181,8.62842 -43.8447,95.49643 -18.554,124.515 32.3071,37.06921 61.7172,-45.14521 70.2242,-79.64429" class="letters" fill="none" stroke="#fff" opacity="0"/></g><path d="m 1220.2394,627.44454 c -12.6061,47.1683 -41.4121,146.50038 -61.3612,187.95725 -51.5508,106.29623 -17.5965,-12.97149 1.3439,-51.34065 10.7454,-21.76813 25.1741,-41.88599 41.663,-60.67532 2.9592,-3.3719 64.0159,-71.08472 72.3042,-61.49034 14.9472,17.30287 -55.0034,98.8031 -65.5843,111.66416 -3.0822,3.74636 -24.083,24.85155 -22.8476,22.16982 19.8588,-43.10319 101.7894,-40.3503 72.5743,14.00201 -6.1762,11.49038 -64.1832,83.61289 -86.0139,58.34161 -24.0537,-27.84456 142.4694,-84.44106 158.5882,-93.34662 11.3426,-6.26659 27.7436,-29.24024 4.032,-32.67133 -36.4559,-5.27516 -81.1732,175.70638 9.4078,102.68129 15.3432,-12.36949 45.624,-44.71998 57.7908,-59.50845" class="letters" id="text-be" fill="none" stroke="#fff" stroke-width="10" opacity="0"/><g transform="translate(-79.549515 20.036946)" clip-path="url(#clipPath2186)" id="head-left"><path id="eye-white-left" v-bind:class="{ghost: isGhost}" fill="#fff" style="stroke:none" d="M1142.3615 683.50671H1252.2559999999999V751.425251H1142.3615z"/><g id="hair-bottom-left" transform="translate(984.98803 226.55347)"><path id="path872" d="m 95.79772,705.23571 c 0.47507,8.8627 -24.998373,123.46013 -29.69086,146.10964 12.096983,-11.2564 23.18412,-38.59046 23.37853,-31.31221 -7.00871,50.05638 -8.018158,38.43477 -17.12853,73.32603 12.286573,-3.72483 28.58482,-53.78951 26.22547,-43.42917 -5.833248,25.61484 -13.681366,50.8098 -19.19422,72.16495 13.231441,-8.3344 18.77594,-26.32516 19.081655,-20.52457 0.332923,6.31681 -10.434119,33.18741 -12.836555,39.04563 -3.281928,8.00282 13.137245,-11.9549 17.23622,-16.98919 4.02755,-4.94656 -3.767607,18.80954 -10.446812,40.89022 10.615962,-11.01624 13.138792,-18.27175 24.915362,-30.20643 -5.71968,19.609 2.35071,-3.91599 -10.71882,50.39209 13.51565,-10.23188 16.30895,-19.16673 28.38277,-33.90693 -4.39411,19.8246 -0.30792,28.07519 -8.3436,60.11333 7.77836,-9.0729 20.37154,-40.29009 24.66398,-34.66174 0,0 3.32156,-2.73812 -0.0607,42.49534 -0.54437,7.2813 9.70399,-24.43746 15.20462,-29.2656 6.64911,-5.83621 10.77966,6.03833 15.77294,26.0149 C 185.09709,904.169 169.06626,884.12175 171.58852,792.41872 158.1842,782.4122 138.88865,764.68712 95.79776,705.23571 Z" fill="#a02c2c" stroke="#452500" stroke-width="3"/><g id="hairstrand-bottom-left" fill="none" stroke="#ff3c00" stroke-width="4"><path d="m 107.17087,733.44977 c 3.50535,16.75398 -9.244724,67.91483 -8.838833,66.29127"/><path d="m 123.74369,740.0789 c 2.4137,30.05764 -5.11419,66.45053 -9.94369,90.59806"/><path d="m 138.87028,771.63514 c 1.61077,50.25426 -21.77667,129.12596 -34.5238,138.44776"/><path d="m 154.58856,794.57611 c -1.16419,21.99373 -15.95867,128.50882 -30.59979,151.58786"/><path d="m 163.51844,874.87113 c 1.50257,19.37083 -12.3662,74.9875 -13.98398,81.45862"/></g><path id="path1745" d="m 112.14272,843.93521 c 0.1138,16.24125 -7.16141,30.30292 -10.49612,43.64175" fill="none" stroke="#ff3c00" stroke-width="4"/></g><g id="eye-left"><ellipse id="eye-iris-left" cx="1198.4187" cy="714.65649" rx="27.28195" ry="21.748468" fill="url(#radialGradient1052)" stroke="#304121" stroke-width="1.94400001"/><circle id="pupil-left" cx="1198.2614" cy="712.21283" r="9.5302277" fill="#080b01" stroke="#000" stroke-width="1.94400001"/><circle id="eye-reflection-left" cx="1199.5598" cy="706.28882" r="4.8872962" fill="#fffefd" stroke-width="1.55519998"/></g><path d="m 1250.2154,715.10596 c -0.608,5.05528 -2.4402,7.67519 -0.01,8.6989 1.8397,0.77464 7.4546,-2.41883 7.1586,-4.11655 -0.2338,-1.34103 -2.6858,-2.74885 -7.1496,-4.58235 z" id="eye-pink-left" fill="#fab4ae" stroke-width=".89961571px"/>
<path fill="#fff4e9"
id="face-left"
v-bind:class="{ghost: isGhost}" d="m 1324.5078,398.96875 c -156.2515,1.46719 -300.9825,134.96208 -267.5273,375.98242 -22.9397,8.76272 -51.5729,27.05703 -33.1778,71.88086 10.8503,19.84167 52.5002,81.25718 60.8243,113.42188 2.511,9.70256 24.1669,21.87601 26.2636,14.80078 1.7081,-5.76392 5.565,61.60921 30.7461,89.94921 34.2481,38.5445 76.8635,81.6626 121.834,93.9668 71.15,5.0971 111.0353,6.7014 175.8145,-17.0586 44.4627,-181.855 54.9164,-725.70199 -114.7774,-742.94335 z m -120.6465,298.52344 c 12.0917,-0.20401 24.1299,2.60179 33.5137,9.72461 11.9458,5.97293 9.7964,4.39896 21.4258,11.75 2.6231,5.64034 -79.6507,32.48079 -107.8223,9.67578 -0.5794,-15.68342 26.2811,-30.70159 52.8828,-31.15039 z" stroke="#964e00" stroke-width="1px"/><path d="m 1251.9652,664.15678 c -7.2112,-6.47625 -53.7791,-4.80668 -62.2567,-6.92606 -86.8139,-21.7035 54.8002,36.75211 62.2567,6.92606 z" fill="#c7a077" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1072.6189,755.40211 c -5.397,104.2091 61.7202,194.97721 98.4197,165.30895 21.9987,-17.78399 -6.5132,-67.64846 -45.7076,-108.82298 -20.9121,-21.96871 -35.2007,-60.8638 -52.7121,-56.48597 z" id="cheek-left" fill="url(#linearGradient1260)" stroke-width="1px"/><path d="m 1134.3904,492.95473 c -52.5799,0.79165 -87.8554,246.19068 -63.5874,241.90882 121.5726,13.74291 56.0025,-154.58131 66.3521,-208.73275 1.8546,-9.70381 9.0283,-27.2796 -2.7647,-33.17607 z" fill="url(#linearGradient1227)" stroke-width="4"/><path d="m 1271.9328,712.055 c -18.2756,-52.56405 -119.3369,-51.06298 -119.572,-58.05811 35.477,-24.0358 152.4346,-15.67186 130.7643,53.33857 -3.4612,11.02234 -5.5935,15.01866 -11.1923,4.71954 z" fill="url(#linearGradient1124)" stroke="url(#linearGradient1116)" stroke-width="1px"/><path d="m 1137.8463,722.42253 c 14.9572,-26.12484 48.637,-49.28303 110.5868,-26.26439" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1256.1758,813.6242 c -4.3704,24.71081 -1.8402,44.33062 19.5492,47.8955" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1281.5897,836.10576 c 8.8567,8.65023 6.3517,-6.84221 13.6844,-6.84221 13.1034,-15.7186 -29.3399,-9.70497 -13.6844,6.84221 z" fill="#8c5d2f" fill-opacity=".56078384" stroke="#ac6a23" stroke-width="1px"/><path d="m 1056.7741,802.87215 c 0.2338,6.65088 -3.1429,23.34326 -8.9413,33.57019 -1.9959,3.52015 1.1503,3.86077 7.9638,-5.22387 0.7018,-0.93569 6.5877,-8.56107 6.8422,-8.79714 0.9364,-0.86828 -7.7318,24.37173 -8.7971,30.30124 -0.8526,4.74572 12.8021,-19.54918 13.6844,-19.54918 -4.8709,6.32568 -5.3839,44.43201 -1.5009,33.92478 2.3657,-7.09698 7.0648,-9.68057 7.7102,-8.61735 1.7723,6.60878 -0.2231,35.14674 2.5879,38.22742 5.7781,-18.29491 -2.871,-76.6924 3.888,-58.0066 54.7149,151.2628 -7.5822,-54.6875 -7.9368,-77.38589 -0.031,-36.90387 -0.1706,-61.40898 5.6899,-95.04378 5.202,-29.85572 3.9148,-39.81862 17.0288,-85.57779 32.1684,-62.9666 45.6848,-106.21893 125.9246,-114.8083 26.7893,-15.60538 67.75,-6.19118 95.941,-17.1659 39.0098,-15.18649 59.0895,2.71915 84.3225,11.05869 -18.1721,-133.22935 -8.6412,-273.76186 -55.866,-274.58177 -2.488,-1.24396 -29.9731,-26.63328 -35.3682,-21.23816 -1.4994,1.49942 4.3906,24.17053 4.3147,24.17053 -1.7909,0 -19.1248,-27.72631 -22.2851,-21.40586 -1.7474,3.4949 5.8688,22.44875 3.505,24.81259 -1.3177,1.31766 -18.8417,-20.40353 -20.093,-17.90091 -1.3301,2.66011 3.9717,21.17633 1.9549,23.19308 -5.5557,5.55567 -25.3851,-21.88026 -30.984,-16.2814 -0.7198,0.71981 2.4953,22.21562 1.955,22.21562 -2.7468,0 -16.5916,-17.25537 -19.9253,-13.9216 -3.1357,3.13564 2.7953,19.08489 2.1921,19.68812 -7.4292,7.42917 -31.9575,-9.61089 -40.2555,-1.31287 -0.3113,0.31134 17.8246,14.30457 17.3283,14.80082 -5.8637,5.86371 -25.9959,-7.18011 -31.7937,-1.38234 -3.7424,3.74241 11.3401,15.06499 11.0587,15.2057 -8.5633,4.28166 -36.9753,-1.66065 -44.1653,5.52934 -4.4068,4.40683 23.4848,5.05038 13.7539,8.29402 -16.7933,5.59775 -49.6758,19.26444 -63.5875,33.17607 -0.9798,0.97982 18.6948,1.70787 17.9704,2.76467 -10.7144,15.63167 -34.886,15.07089 -46.4556,28.0516 -4.2747,4.7961 20.3016,-0.97279 14.5201,7.1376 -5.4803,7.68796 -33.9466,13.64777 -31.652,29.7806 0.6989,4.91328 10.3142,-9.03854 13.8234,-5.52935 -3.6864,16.98715 -56.8825,42.95178 -66.35214,85.70484 12.41784,-1.73014 19.28544,-22.69578 17.97034,-13.82336 -1.0282,6.93729 -32.23663,45.17416 -26.66924,50.74156 0.76392,0.76391 15.61054,-13.94249 15.61054,-13.41849 0,7.64302 -24.73127,39.95326 -17.16058,36.44386 13.01361,-6.03246 8.0583,-6.03246 13.01361,-6.03246 4.32637,0 -16.63613,18.89569 -14.08217,43.54341 0.98262,9.48304 13.47737,-10.60031 14.08217,-8.98501 6.09917,16.28954 -5.73347,3.31033 -17.97037,53.91111 -2.06924,8.55652 17.94308,-28.15583 17.97037,-19.35271 0.0495,15.97005 -14.13606,11.00393 -27.64672,56.67578 -5.06358,17.11707 27.82124,-36.87768 19.88056,-16.58386 -6.7903,21.41051 -20.81825,37.89475 -18.49823,63.58329 0.61575,4.31135 12.09237,-18.08327 13.5862,-18.47348 8.3714,-2.18673 -8.7523,53.30764 -5.05501,48.64771 8.84003,-11.14165 10.53273,-27.64526 14.96853,-26.02722 4.49282,1.63884 -10.67142,38.2574 -4.31472,40.35369 2.98755,0.98522 8.71867,-27.19732 11.22636,-22.38332 2.5368,4.86964 -10.54127,62.2257 5.5294,23.49971 0.4385,-1.05679 -3.2217,30.87404 1.3823,33.17607 4.8063,2.40313 7.6239,-19.15497 8.294,-13.82336 0.9175,7.29866 0.1803,12.94828 -6.9116,46.99943 -1.6807,8.06951 9.5925,-13.74323 9.5925,-5.50057 0,14.33817 -14.8286,46.38408 2.8485,11.02991 1.9713,-3.94261 -9.1662,30.51671 -4.7196,34.96328 5.0999,5.09989 11.6313,-25.58757 11.6313,-18.37524 0.1732,9.18483 2.0735,22.11737 2.0735,22.11737 0.36,-1.92428 5.6643,-19.82517 6.2205,-19.3527 5.4836,4.65862 0.1409,15.54384 1.3823,29.02906 0.5667,6.15597 8.294,-22.77003 8.294,-16.58804 0,5.99375 -2.7324,16.83059 -0.7334,16.91331 1.8703,0.0774 11.1029,-19.74937 10.2043,-20.78619 z" id="wig" fill="#a02c2c" stroke="#452500" stroke-width="3"/><path d="m 1425.7001,388.68193 c -54.394,-64.8581 -137.2369,-91.47867 -174.1178,-121.28517 32.1153,-17.43667 97.9752,2.61662 107.2267,14.4896 0,1.13117 -86.1026,-67.42502 -86.0164,-67.44468 45.9337,-10.48234 103.5067,54.20845 115.3402,52.7828 23.3301,-2.81071 -64.7671,-66.49048 -65.4898,-70.37707 -1.5212,-8.18068 63.4702,8.94277 100.6783,61.57993 1.4492,-14.91503 -32.5471,-75.40136 -31.2787,-70.37706 89.7181,27.18007 84.7731,169.61802 33.6575,200.63165 z" id="wig-left-3" fill="url(#linearGradient1321)" stroke-width="1px"/><path d="m 1228.3893,227.54619 c 19.4858,0.74902 44.1794,34.53076 58.0581,41.47009" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1282.5672,750.08935 c -0.2135,9.09022 -2.5029,17.94983 -3.9099,26.3914" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1151.5876,743.24713 c 15.1427,8.64678 34.0726,12.42734 50.8279,6.84222" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1233.6942,970.99514 c 46.7192,-47.63519 171.3001,-29.29635 185.7173,4.88729 -25.8157,0.5189 -173.1871,19.09133 -185.7173,-4.88729 z" fill="#fff" stroke-width="1px"/><path d="m 1263.5067,959.75435 c -0.5565,3.89746 0.325,9.9358 0.9775,11.24078" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1256.7272,963.29459 c 48.1165,-11.32618 100.0775,-11.66648 145.0595,1.87474 -19.981,-39.64076 -113.7371,-47.28109 -145.0595,-1.87474 z" fill="#bda8a8" fill-opacity=".56521738" stroke-width="1px"/><path d="m 1287.4545,950.95721 c -0.4374,5.66964 -1.357,12.65524 0,18.083" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1323.6205,948.51357 c 0,4.942 0.029,13.78714 -0.4888,20.52665" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1226.852,974.90497 c 11.4853,-33.19665 45.3521,-50.85873 60.1137,-55.71517 16.5809,-4.48399 25.2072,4.18957 34.2111,5.86475 10.1159,1.88207 11.6338,-10.11531 35.2016,-5.45981 28.1405,8.77549 62.0187,37.09184 67.4316,54.8215 -29.9158,-10.73862 -52.9745,-25.95607 -72.7049,-25.03814 -28.524,1.32705 -45.8826,0.15864 -59.5061,1.46039 -28.8077,2.75262 -37.3686,23.79089 -64.747,24.06648 z" fill="#ea6859" stroke-width="1px"/><path d="m 1226.852,974.90497 c 8.3762,21.67044 32.4194,16.60257 39.5734,20.88483 33.7737,17.2833 66.327,11.0803 104.588,-0.40349 22.0209,-6.60939 53.4346,-13.23265 52.7966,-20.97007 -66.7296,-16.04296 -68.8776,-6.03209 -100.6783,-5.37602 -53.4854,-5.4961 -55.0254,7.18105 -96.2797,5.86475 z" fill="#ea6859" stroke-width="1px"/><path d="m 1150.9784,728.64304 c 18.1382,-33.42318 58.0751,-26.01965 78.1517,-23.32638 9.862,1.32299 18.4396,8.329 21.0853,9.7893 -32.1466,-33.45658 -96.7384,-18.83607 -99.237,13.53708 z" id="eyelashes-shade-left" fill="#3a3a3a" fill-opacity=".48309183" stroke-width="1px"/><path d="m 1314.7853,642.93819 c 113.672,-1.15127 137.191,-105.92526 92.6165,-150.67464 -84.3065,-73.94616 -156.0929,-11.61483 -177.0577,26.29346 -22.7811,41.19267 -7.7915,115.50052 84.4412,124.38118 z" id="forehead-left" fill="url(#linearGradient1310)" stroke="url(#linearGradient1236)" stroke-width="1px"/><path d="m 1071.436,905.50536 c 3.367,16.01977 11.9989,25.0599 24.4365,31.2787 3.6515,1.82575 2.2132,12.5778 5.8647,10.75205 3.1269,-1.56345 1.2638,-15.18493 0.9775,-16.61681" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1088.0528,885.95617 c 6.91,10.30632 -1.6293,22.80722 5.8647,30.30124" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1086.0979,851.7451 c 0.2831,5.65958 2.2844,10.76326 3.9098,15.63935 1.6804,5.04109 15.5919,48.82546 16.6168,49.85042 2.287,2.28703 1.9549,13.06888 1.9549,16.61681 0,1.03033 1.8159,3.53124 0.9775,2.93238 -2.4444,-1.74599 -4.5615,-3.90984 -6.8422,-5.86476" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1199.7365,451.97279 c 38.2336,-59.12948 83.8038,-48.76526 78.1424,-50.40217 -0.6846,-0.19794 -54.5615,37.31245 -47.9873,58.76786 0.8924,2.91239 32.0272,-26.3216 35.7124,-28.68341 3.3102,-2.12145 -24.2852,37.54429 -22.2244,39.68087 4.6914,-1.33556 44.9591,-32.95125 36.5308,-19.87006 -3.7327,3.60023 -17.3604,23.97294 -15.1185,25.14496 49.5579,-19.58116 178.1456,-67.81093 153.1974,-91.70335 -100.6668,-105.11102 -254.2849,51.68082 -218.2528,67.0653 z" id="wig-left-1" fill="url(#linearGradient2119)" stroke-width="1px"/><path d="m 1380.4462,368.54447 c -52.4916,-38.86945 -149.1257,-8.01926 -172.792,51.14644" id="wig-left-1-hair-1" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1338.9762,374.07381 c -39.9745,1.67253 -94.9085,28.52044 -105.0576,69.11681" id="wig-left-1-hair-2" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1362.4759,386.51484 c -37.431,1.20898 -92.9948,30.54216 -102.2929,67.73447" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1381.8286,401.72054 c -33.7753,5.6284 -85.6218,35.52534 -92.6165,70.49914" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1374.9169,336.75074 c -34.4617,-26.50279 -68.954,-22.11738 -107.8222,-22.11738" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1410.2156,333.81836 c -26.7691,-27.81343 -59.7631,-56.50808 -101.6508,-56.50808" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1243.4688,710.01351 c -8.8941,-10.0896 -19.7912,-18.26971 -29.8682,-18.67148 -48.9061,-1.9499 -59.6691,11.88244 -60.5487,30.38933 6.5743,-16.35881 49.9754,-38.86419 90.4169,-11.71785 z" id="eyeliner-left" fill-opacity=".85990337" stroke-width="1px"/><path d="m 1197.5282,657.2307 c 5.3868,-3.29019 35.4725,3.18591 49.8504,4.8873 40.8786,9.15783 30.8905,34.5447 12.7196,25.41897 -7.051,-3.54117 -36.7793,-13.05011 -62.57,-30.30627 z" fill="url(#linearGradient1162)" stroke-width="1px"/><path d="m 1231.154,732.79004 c -13.5242,1.40526 -56.293,13.53993 -84.3226,-6.22051 -4.1035,-2.89296 -10.4148,5.71825 4.7562,16.6776 38.9395,26.26684 94.0267,-11.81033 79.5664,-10.45709 z" fill="url(#linearGradient1208)" stroke-width="1px"/><path d="m 1174.0692,697.30654 c -31.3866,-7.79504 -43.0149,-27.68709 -52.8031,-37.47537 -19.1635,24.09431 -21.7146,49.41497 -9.7136,68.25095 26.3678,18.14596 53.5944,14.83635 50.3105,13.80292 -21.4319,-6.74473 -7.9624,-35.17421 12.2062,-44.5785 z" fill="url(#linearGradient1320)" stroke-width="1px"/><path d="m 1248.4331,696.15814 c -50.0868,-37.28156 -122.7195,3.52689 -109.2045,4.147 7.9246,3.9623 31.9808,-7.25043 38.7054,-9.67635 9.8047,-3.53707 37.9918,-7.27395 70.4991,5.52935 z" fill="#fec790" fill-opacity=".60386472" stroke-width="1px"/><path d="m 1171.7135,962.94901 c -1.3754,11.58735 2.7647,37.25939 2.7647,48.38179 0,9.9582 21.0509,69.8674 33.176,45.6171 8.6948,-17.3896 -28.3549,-95.89535 -35.9407,-93.99889 z" fill="#ffdfc1" stroke-width="1px"/><path d="m 1278.8445,725.87837 c -6.9989,-1.76627 -7.0419,16.14565 -11.1693,29.1568 -8.3457,26.30871 -0.8551,57.60774 12.4127,49.49742 7.4117,-4.53059 7.6365,-71.99436 -1.2434,-78.65422 z" fill="#f2d5b7" fill-opacity=".56038663" stroke-width="1px"/><path d="m 1275.725,861.5197 c -0.1094,0.35521 11.1788,-9.21013 7.5384,-13.20192 -11.4193,2.94671 -17.575,-5.0431 -15.194,-16.92735 1.1306,-5.64328 -12.8836,-3.98989 -13.4157,-4.60153 -0.4962,20.3037 2.4077,29.96716 21.0713,34.7308 z" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1267.4166,958.0438 c 8.716,-23.83332 28.8851,-17.22117 49.1173,-19.06046 32.1705,2.14398 45.818,-9.32876 59.5028,15.39498 -11.9757,-7.11661 -39.6118,-4.29061 -52.0497,-4.64293 2.6658,2.03226 -36.4849,-2.72648 -56.5704,8.30841 z" fill="url(#radialGradient1031)" stroke-width="1px"/><path d="m 1267.6609,972.70569 c 20.494,-7.27063 35.823,-5.65121 55.4708,-3.66547 13.0216,1.30216 33.268,-6.91221 45.9406,-2.68802 3.1632,16.36925 -27.459,8.55504 -43.9857,7.81968 -5.3178,0.44265 -41.8521,9.20375 -57.4257,-1.46619 z" fill="url(#radialGradient1041)" stroke-width="1px"/><path d="m 1273.3152,949.12565 c -15.6517,4.37568 -32.3112,13.28093 -43.198,24.53647 18.439,0.82686 31.1691,-12.97621 44.9259,-20.04388 0.6314,-0.31568 2.7647,-1.44959 2.7647,-1.72792 0,-1.75837 -3.4376,-1.35797 -4.4926,-2.76467 z" fill="url(#radialGradient1059)" stroke-width="1px"/><path d="m 1237.72,976.0812 c 8.987,6.54605 29.2903,4.45414 34.4335,-4.75785 -3.9631,-0.4655 -31.9195,2.67417 -34.4335,4.75785 z" fill="url(#radialGradient1087)" stroke-width="1px"/><path d="m 1302.3443,826.7889 c 4.1995,2.99744 -8.2408,15.65511 -6.9117,18.66153 14.0436,-2.15163 39.5813,0.0855 44.4372,-1.70335 4.0557,-4.05569 -7.326,-9.34375 -9.8959,-14.48353 0.8705,-5.87453 -17.2543,-8.66533 -27.6296,-2.47465 z" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1331.1047,850.53048 c -9.9395,-1.94615 -22.8963,-4.00416 -26.1793,1.28915 -6.6679,10.75092 -5.4769,46.15702 5.3051,57.73478 11.4171,12.25964 19.1994,4.96501 22.78,-0.20867 7.4865,-10.81735 9.2788,-52.83898 -1.9058,-58.81526 z" fill="#f2d5b7" fill-opacity=".38647341" stroke-width="1px"/><path d="m 1258.8007,718.96669 c 1.4345,23.07664 -49.6292,23.15195 -33.9036,53.60422 8.105,15.69529 55.6369,-36.93422 33.9036,-53.60422 z" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1148.2755,730.05324 c -0.3349,4.69494 -3.0051,5.68605 1.1172,15.90324 1.1418,0.67148 2.3231,-9.47164 4.6165,-8.98833 1.7953,0.37836 -0.8351,8.31433 3.3077,11.55932 -0.044,-0.73634 0.9916,-11.82322 4.1783,-8.11953 1.878,2.18257 2.3946,11.58068 3.851,9.31852 0,0 3.5925,-8.26935 5.1122,-7.14565 1.288,1.94637 -0.2317,8.05978 1.7079,9.57897 0.3534,0.02 2.6549,-11.36598 3.8453,-8.62277 2.2797,5.25321 0.7668,7.9062 1.7909,7.45107 1.9107,-0.84922 4.2029,-7.39689 4.8338,-6.62508 0.9485,1.16014 1.0204,5.25969 1.8855,6.56705 0.8943,1.35145 3.6276,-7.58139 4.0082,-7.28331 1.4409,1.12866 0.7462,8.23483 2.6166,8.10929 0.7893,-0.053 0.7309,-8.81679 2.3356,-7.62376 1.1451,0.85131 4.0858,7.35208 5.8639,7.98648 -1.0119,0.37346 -1.256,-5.37872 0.9257,-8.83332 0,0 7.6216,9.0448 6.4853,6.37512 -0.1331,-0.31285 0.4048,-5.05445 -0.3036,-6.46495 -0.6505,-1.29502 5.477,4.06729 5.9245,3.3927 0.2823,-0.42566 -3.737,-6.61026 -1.7506,-5.03065 -3.0494,-2.12587 2.3199,-2.38818 7.8347,-6.21894 -35.0983,6.58109 -53.4809,3.23101 -70.1866,-5.28547 z" fill-opacity=".68599034" stroke-width="1.56177592px"/><path d="m 1359.7864,988.10067 c -7.3344,-13.90008 -91.6855,0.92127 -89.5908,6.81765 24.4341,28.95798 117.4184,3.19269 89.5908,-6.81765 z" fill="url(#radialGradient1269)" stroke-width="1px"/><path d="m 1162.584,709.76915 c -2.5556,3.02902 -15.0986,-3.25505 -13.8521,-3.85054 1.6432,-0.78496 16.1356,-0.98065 14.5852,-2.74731 -5.4923,-6.25871 -6.1683,-5.35367 -5.4005,-6.1214 6.5983,0.37886 9.891,1.38209 16.1526,0.25664 0.7126,2.49067 -6.2336,-5.54552 -4.7861,-6.46698 0.4052,-0.20259 10.9156,5.25676 13.5294,4.73235 1.1833,-0.23742 -0.4139,-3.41372 -4.3735,-7.67221 8.8099,3.25331 9.5159,3.51074 14.2019,8.67375 -7.2689,1.08994 -16.8379,6.08577 -30.0569,13.1957 z" id="eyelashes-left" fill-opacity=".76328502" stroke-width="1px"/><path d="m 1203.5072,235.84021 c 21.7065,9.33941 58.1648,29.13575 73.2638,44.23476" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1271.8151,327.82695 c 18.4432,-6.23363 49.9134,-3.52922 65.4898,0.97746" id="path1571" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1246.4012,351.28597 c 21.6069,-9.66957 49.5691,-15.39407 92.8586,-7.81967" id="path1573" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1265.0212,226.85503 c 11.8986,5.05303 15.8032,14.4209 23.4997,22.11737" id="path1609" fill="none" stroke="#ff3c00" stroke-width="4"/><g id="hairstrand-left" fill="none" stroke="#ff3c00" stroke-width="4"><path d="m 1168.9488,454.24931 c -38.9441,-1.55359 -74.5874,13.76465 -100.9105,40.08775"/><path d="m 1168.9488,432.13193 c -38.5221,-0.28251 -84.155,-9.84382 -113.3515,19.35271"/><path d="m 1166.1841,408.63222 c -34.839,-10.00793 -70.4126,-14.60104 -99.5282,14.51453"/><path d="m 1200.8788,357.76833 c -27.1294,-1.23525 -60.5091,-3.27221 -85.8411,9.3938"/><path d="m 1249.8155,314.63336 c -55.2096,1.624 -96.6122,-33.36642 -137.2646,-18.01949"/><path d="m 1261.3282,300.78965 c -19.8127,11.31027 -75.2129,-44.74386 -135.5553,-25.60199"/><path d="m 1065.2736,528.89546 c -28.9301,16.67884 -55.5104,84.04898 -63.2861,115.15158"/><path d="m 1058.3619,559.30685 c -19.7332,23.46523 -32.9391,51.58119 -40.0877,80.1755"/><path d="m 1273.3643,292.07041 c -28.8247,-0.65743 -63.8342,-44.27816 -115.2658,-36.73857"/><path d="m 1084.6263,378.22082 c -21.7052,6.9333 -56.0457,23.74434 -61.5139,45.6171"/><path d="m 1166.2495,464.67125 c -37.8317,-2.60813 -65.5916,14.76377 -84.0615,33.23361"/><path d="m 1109.5569,497.90486 c 18.0854,-11.04144 33.8704,-17.75346 52.7828,-22.48156"/><path d="m 1099.7262,383.12204 c 25.2905,2.22803 72.8109,-1.14579 118.2956,-12.50406"/><path d="m 1161.0004,391.00744 c 10.8445,1.00754 49.3411,9.63059 58.1262,-7.13121"/><path d="m 1112.9642,510.23393 c -11.1236,9.36973 -35.1722,31.02524 -39.3966,35.24957"/><path d="m 1121.2582,509.54276 c -5.9278,11.2752 -21.6655,31.6787 -25.3857,34.30269"/><path d="m 1039.7004,470.14618 c -16.2826,6.86884 -42.47404,32.83893 -38.0143,50.67806"/><path d="m 1050.0679,477.74903 c -19.4041,20.2664 -34.6873,45.18371 -46.3083,68.42564"/><path d="m 1036.2445,514.38094 c -11.6014,24.7283 -29.2835,55.54795 -44.92588,71.19031"/><path d="m 1007.2155,577.27723 c -7.81268,15.18294 -20.16179,32.95652 -24.1909,49.07294"/><path d="m 1002.3773,603.54162 c -4.51533,9.91157 -9.9741,19.85256 -12.44102,29.72023"/><path d="m 1046.3822,703.40753 c 2.6635,14.3903 -13.3388,66.12295 -15.0221,74.5394"/><path d="m 1054.9454,712.5023 c 5.6863,11.7517 -10.4324,71.11837 -10.4324,81.14653"/><path d="m 1065.4647,716.3473 c 2.8985,20.99906 -0.2808,60.70505 -5.2695,80.66009"/><path d="m 1074.2588,337.44192 c 4.6946,-4.09202 70.1493,-21.00983 57.3669,-15.89687"/><path d="m 1066.6559,351.95645 c -5.217,0.47201 63.7702,-23.93663 53.22,-18.66154"/><path d="m 1045.9209,380.9855 c 17.7933,-15.79431 46.4196,-24.24655 64.2786,-33.17606"/><path d="m 1130.3796,340.76663 c 36.7354,-15.61225 85.3273,16.26932 111.1419,-9.54523"/><path d="m 1002.0364,486.66408 c 4.31,-19.68819 25.348,-27.23019 37.6321,-30.30124"/><path d="m 1081.5167,560.09973 c -15.6907,20.50194 -30.9359,40.35064 -30.9359,66.29126"/><path d="m 1078.2021,594.35022 c -17.3711,27.23034 -21.3781,84.79372 -24.3068,99.43689"/><path d="m 1036.2177,637.43954 c 2.8241,21.58607 -7.4292,57.14759 -14.3631,64.08155"/><path d="m 1045.0565,665.06089 c 2.6079,14.64454 -17.989,65.87919 -19.335,71.26311"/><path d="m 1020.7497,657.32691 c -0.035,9.58087 -2.8047,22.15386 -7.734,28.72622"/><path d="m 1142.0028,442.07179 c -24.3938,8.28541 -69.6283,5.21819 -75.1991,25.51317"/><path d="m 1068.3662,404.30371 c -11.7,7.99502 -29.3143,18.03863 -32.8125,32.03125"/></g></g><g transform="translate(-79.549515 20.036946)" clip-path="url(#clipPath2190)" id="head-right"><path id="eye-white-right" v-bind:class="{ghost: isGhost}" fill="#fff" style="stroke:none;" d="M1393.9531 675.20941H1516.6944799999999V745.459189H1393.9531z"/><g id="hair-bottom-right" transform="translate(507.32552 158.0322)"><path id="path874-3" d="m 1199.9137,687.3864 c -40.998,15.0921 -83.4692,183.58417 -138.0419,98.46528 -35.9663,175.29082 -9.9373,226.41232 3.5971,275.71092 7.9247,-14.9881 6.253,-52.7555 14.4173,-49.7888 4.8449,1.7605 3.7395,29.7395 7.5666,49.4313 2.6716,13.7465 10.4383,-52.1942 13.1726,-30.6418 1.5281,12.0449 2.4836,32.7829 6.0177,42.156 5.593,14.834 8.9266,-57.2472 11.2044,-53.7963 9.8137,14.8677 2.1135,14.9222 15.8225,66.4722 3.4707,13.0509 4.4964,-71.1087 11.1156,-65.8296 0.6448,0.5143 8.9205,25.4047 17.355,46.7676 5.3659,-28.0131 4.9497,-30.5625 9.0887,-46.505 1.3385,-5.1557 18.2433,30.4355 18.2623,21.1598 -1.2957,-21.5965 -1.6635,-32.1966 -4.7177,-49.5901 -2.2778,-12.97223 18.3811,20.4924 15.9072,9.7491 -5.3572,-23.26451 -24.7538,-75.66233 -26.0707,-89.16492 l 23.0328,40.49973 c -16.5952,-80.03627 -41.7069,-179.94186 2.2705,-265.09541 z" fill="#a02c2c" stroke="#452500" stroke-width="3"/><g id="hairstrand-bottom-right" fill="none" stroke="#ff3c00" stroke-width="4"><path d="m 1078.3378,782.06337 c -4.8795,39.33487 -7.7339,78.59011 -7.7339,118.21941"/><path d="m 1091.5961,809.68472 c -5.4679,49.50473 1.7644,122.41089 8.8388,169.04272"/><path d="m 1109.2738,771.01482 c 3.037,55.19127 0.9214,161.70204 23.7381,237.90378"/><path d="m 1127.5039,746.70803 c -0.4784,52.11553 1.2849,73.24725 4.9718,95.01747"/><path d="m 1131.75,859.97186 c 6.0882,53.2256 24.2056,129.25464 33.9499,151.03194"/><path d="m 1157.8874,738.97405 c -8.4825,48.63834 -3.2251,119.42349 11.7742,155.75194"/></g><path id="path1785-9" d="m 1069.499,918.51288 c 0.7999,17.67011 2.899,57.44708 7.1816,74.57767" fill="none" stroke="#ff3c00" stroke-width="4"/></g><g id="eye-right"><ellipse ry="22.237198" rx="24.680845" cy="708.79175" cx="1456.3105" id="eye-iris-right" fill="url(#radialGradient1068-4)" stroke="#002f07" stroke-width="1.94400001"/><circle r="17.23646" cy="706.83661" cx="1457.2878" id="pupil-right" stroke-width="2.44859862"/><circle r="5.4598784" cy="705.16089" cx="1452.8475" id="eye-reflection-right" fill="#fff" stroke-width="1.55125272"/></g><path d="m 1400.4901,712.05499 c -3.7682,2.07788 -11.1166,9.75751 -7.9293,8.33368 1.1327,-0.50601 7.7142,1.37823 9.4266,0.004 1.5531,-1.24635 1.7932,-3.95165 -1.4973,-8.33768 z" id="eye-pink-right" fill="#fab4ae" stroke-width="1px"/><path id="face-right" fill="#fff4e9" v-bind:class="{ghost: isGhost}" transform="translate(-776.6756 -74.750189)" d="m 2101.1836,473.71875 c -209.9676,17.38675 -148.332,638.91205 -61.0371,760.00195 71.15,5.0971 111.0352,6.7014 175.8144,-17.0586 35.9915,-22.9605 109.2665,-80.2326 129.3184,-130.998 6.4541,-16.3398 2.2545,-22.2515 6.082,-55.2813 37.5958,29.3771 65.5609,2.6041 81.0567,-42.87108 38.2538,-42.68695 57.9398,-128.24995 35.7304,-150.25195 -11.9284,-11.81692 -23.4652,-13.80488 -37.3242,-20.73438 C 2395.2497,580.487 2243.4424,472.38295 2101.1836,473.71875 Z m 124.7773,291.5332 c 21.6048,-0.36108 43.3068,8.73462 56.2618,25.70117 -37.9165,26.74553 -72.8723,9.25821 -114.7325,4.14649 3.8882,-4.66857 8.4189,-7.13347 12.4004,-11.09766 12.5223,-12.46807 29.2667,-18.46915 46.0703,-18.75 z" stroke="#964e00" stroke-width="1px"/><path d="m 1495.1802,501.24873 c 2.4252,21.182 -1.0372,83.30285 13.0158,154.60257 12.354,62.67934 95.7667,109.79063 104.4827,99.74728 77.1313,-54.02344 -65.4431,-235.91443 -117.4985,-254.34985 z" id="path1229-2" fill="url(#linearGradient3579)" stroke-width="1px"/><path d="m 1489.2998,696.32908 c 1.3932,3.07253 -10.8594,-10.51728 19.6515,-36.09497 25.3889,16.63369 37.2555,30.6325 31.869,55.84165 -1.7552,8.21464 -29.1336,19.40094 -39.3023,14.46439 -4.6424,-2.23527 4.2412,-5.02519 4.2089,-12.69999 -0.02,-4.85263 -3.6053,-11.65814 -16.4271,-21.51108 z" id="path1322-8" fill="url(#linearGradient3581)" stroke-width="1px"/><path d="m 1596.0907,752.83391 c -22.3595,-13.46037 -61.2566,43.62215 -72.078,106.53812 -7.9739,23.92162 -25.929,43.37551 -25.929,68.30706 0,16.06634 48.4205,-15.33991 52.3899,-14.49419 65.7034,13.99892 83.7527,-179.80261 45.6171,-160.35099 z" id="path1262-3" fill="url(#linearGradient3583)" stroke-width="1px"/><path d="m 1354.1819,696.84931 c -18.3132,-48.79819 74.3375,-73.28538 123.719,-42.85242 -0.2724,5.84066 -6.8778,1.03959 -12.1208,1.82096 -68.5745,10.21989 -62.4092,16.54166 -98.3161,45.83046 -12.6861,10.34786 -9.5217,17.78687 -13.2821,-4.799 z" id="path833-1" fill="url(#linearGradient3591)" stroke-width="1px"/><path d="m 1381.8286,704.45216 c 35.728,-27.38205 93.0423,-37.30453 128.5572,2.07351" id="path841-2" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1344.1471,818.5115 c -11.1924,2.3805 -13.1594,12.21224 -1.5427,12.27994 2.0777,0.0121 6.8462,-0.20219 7.4857,2.81879 11.875,20.58292 19.1442,-16.8935 -5.943,-15.09873 z" id="path853-2" fill="#8c5d2f" fill-opacity=".56078384" stroke="#964e00" stroke-width="1px"/><path d="m 1349.0344,797.00739 c -6.2216,2.54911 -9.8141,5.89639 -14.6619,9.7746" id="path855-1" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1220.9178,465.88588 c 26.7893,-15.60538 67.75,-6.19118 95.941,-17.1659 39.0098,-15.18649 59.0895,2.71915 84.3225,11.05869 105.5188,27.97999 163.6942,77.80768 174.0493,144.23172 8.0497,51.63657 19.1653,68.33568 27.7717,99.05944 8.6635,57.46321 12.1754,70.22655 12.0388,85.57163 -0.2188,24.55812 -21.5364,92.32324 -22.1179,96.82505 -1.6754,12.96878 36.5485,-98.88154 34.877,-85.50194 -6.6221,53.00549 -19.7865,71.057 -17.2976,71.05477 4.4565,-0.004 27.9329,-55.45323 31.2052,-58.74496 0,28.16866 3.3129,74.09784 6.9116,70.49914 2.3652,-2.36514 5.3236,-51.94049 12.4411,-48.38177 11.6816,5.84082 1.8009,47.47089 6.3882,58.47143 1.0285,2.46645 9.8895,-45.06176 17.1115,-47.41274 6.0089,7.94628 -11.605,50.47335 -10.5084,60.39465 4.0826,-4.90217 23.5881,-38.17839 27.0878,-46.4674 1.7512,-4.14779 -7.2546,43.30546 -2.3836,36.61965 19.6873,-27.02252 11.0737,-84.64942 7.7538,-112.96042 0.8159,-15.18496 1.8488,-33.57095 4.3148,-48.17337 0.4975,0 8.5357,19.94948 10.4166,18.06861 1.5688,-1.5688 -5.9598,-36.03897 -4.8873,-36.03897 3.9098,0 7.3457,12.08711 8.294,8.29401 -9.095,-54.56908 -25.8911,-165.89449 -31.9614,-187.6995 -3.2657,-11.73082 28.4673,11.41579 24.4077,2.02089 -20.3535,-47.10356 -46.1794,-74.82983 -45.1427,-80.06534 1.5338,-7.746 34.992,7.10817 34.992,7.10817 5.1402,-8.93487 -22.3825,-21.27331 -27.4383,-28.16423 -11.1787,-15.23605 34.5627,10.07385 32.2417,4.09193 -6.1563,-15.86681 -139.3314,-79.47866 -124.3839,-75.88956 49.9171,6.67193 68.4276,10.27123 61.2271,5.36821 -17.6976,-12.05075 -73.5553,-25.57822 -77.3815,-28.29534 26.3236,-23.40358 75.8016,-48.55702 96.7636,-76.02848 -15.0869,1.71673 -73.3241,19.42155 -72.859,18.30578 2.5306,-5.0611 38.1678,-29.77553 42.1697,-33.77742 -14.7288,0.64187 -62.9278,17.37672 -55.0156,11.32463 -1.8812,-3.76242 31.6093,-29.04395 28.4158,-28.31754 -42.0917,9.57445 -35.4485,19.85014 -46.3862,13.11184 -2.8966,-1.78449 27.0047,-26.06743 27.0047,-27.71619 0,-3.6194 -32.6139,8.00927 -50.5044,31.8632 -15.4296,-4.92334 22.4893,-45.66843 14.3265,-42.21037 -17.2975,7.32788 -37.5293,22.91943 -33.6792,18.71066 1.6584,-1.81292 15.4717,-31.31939 15.4717,-31.31939 -3.7512,-2.47577 -35.2135,22.0321 -36.2067,23.02537 -1.9211,1.92109 2.1041,-17.86105 1.55,-18.13808 -7.7356,-3.86779 -15.0066,15.37341 -20.9027,15.37341 -6.0606,0 7.0501,-13.68488 2.7646,-17.97037 -4.3469,-4.34697 -14.9664,16.82727 -16.588,15.2057 -5.1079,-5.10789 2.5749,-19.49123 3.3238,-21.37904 1.2463,-3.1417 -5.5151,3.20617 -18.5295,17.23203 -13.7489,14.81742 9.5996,-40.66155 7.9874,-41.13468 -4.5031,-1.32147 -25.8143,17.42199 -26.1255,17.7332 -6.3658,-5.54484 -1.9374,-25.697 -3.9793,-31.8225 -9.5156,8.29792 -7.7415,34.44398 -16.588,26.86574 -3.5814,-3.06798 -7.144,-35.11308 -9.6763,-33.84689 -1.5617,0.78085 -11.3457,28.74208 -12.4411,27.64672 -3.2664,-3.26641 -2.4262,-24.88205 -8.294,-24.88205 -4.9649,0 -10.0386,31.42684 -15.2057,27.98214 -2.6422,-1.76148 -10.9922,-25.2839 -13.8233,-22.45279 -2.1798,2.17979 -6.7844,29.19097 -8.8666,28.14984 -2.488,-1.24396 -29.9731,-26.63328 -35.3682,-21.23816 -1.4994,1.49942 4.3906,24.17053 4.3147,24.17053 -1.7909,0 -19.1248,-27.72631 -22.2851,-21.40586 -1.7474,3.4949 5.8688,22.44875 3.505,24.81259 -1.3177,1.31766 -18.8417,-20.40353 -20.093,-17.90091 -1.3301,2.66011 3.9717,21.17633 1.9549,23.19308 -5.5557,5.55567 -25.3851,-21.88026 -30.984,-16.2814 -0.7198,0.71981 2.4953,22.21562 1.955,22.21562 -2.7468,0 -16.5916,-17.25537 -19.9253,-13.9216 -3.1357,3.13564 2.7953,19.0849 2.1921,19.68812 -7.4292,7.42919 -31.9575,-9.61089 -40.2555,-1.31287 -0.3113,0.31134 17.8246,14.30455 17.3283,14.80082 -5.8637,5.86369 -25.9959,-7.18011 -31.7937,-1.38234 -3.7424,3.74241 11.3401,15.06499 11.0587,15.2057 -15.7088,37.40741 -6.7692,207.04177 33.9986,230.04566 z" id="wig-9" fill="#a02c2c" stroke="#452500" stroke-width="3"/><path d="m 1425.7001,388.68193 c -54.394,-64.8581 -137.2369,-91.47867 -174.1178,-121.28517 32.1153,-17.43667 97.9752,2.61662 107.2267,14.4896 0,1.13117 -86.1026,-67.42502 -86.0164,-67.44468 45.9337,-10.48234 103.5067,54.20845 115.3402,52.7828 23.3301,-2.81071 -64.7671,-66.49048 -65.4898,-70.37707 -1.5212,-8.18068 63.4702,8.94277 100.6783,61.57993 1.4492,-14.91503 -32.5471,-75.40136 -31.2787,-70.37706 89.7181,27.18007 84.7731,169.61802 33.6575,200.63165 z" id="wig-right-3" fill="url(#linearGradient3593)" stroke-width="1px"/><path d="m 1388.1328,831.21847 c 0.553,15.561 -3.2805,27.36886 -18.5718,27.36886" id="path857-7" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1363.6963,773.54837 c 0.8274,5.61477 1.3201,10.80248 2.9324,15.63935" id="path859-1" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1385.2004,739.3373 c 4.7317,14.59953 16.4993,27.49891 23.459,39.09837" id="path863-4" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1441.893,741.29222 c 19.5,5.36815 47.147,0.0124 60.6025,-10.75206" id="path871-9" fill="none" stroke="#964e00" stroke-width="1px"/><path d="m 1233.6942,970.99514 c 46.7192,-47.63519 171.3001,-29.29635 185.7173,4.88729 -25.8157,0.5189 -173.1871,19.09133 -185.7173,-4.88729 z" id="path877-1" fill="#fff" fill-opacity=".9372549" stroke-width="1px"/><path d="m 1256.7272,963.29459 c 48.1165,-11.32618 100.0775,-11.66648 145.0595,1.87474 -19.981,-39.64076 -113.7371,-47.28109 -145.0595,-1.87474 z" id="path1037-4" fill="#bda8a8" fill-opacity=".56521738" stroke-width="1px"/><path d="m 1323.6205,948.51357 c 0,4.942 0.029,13.78714 -0.4888,20.52665" id="path974-9" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1357.8315,947.53611 c 0.4694,6.11337 -0.3471,14.25068 0.9775,19.54918" id="path976-6" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1379.3356,955.84451 c 0.4706,3.83497 0.1734,9.00194 0.9775,12.21824" id="path978-7" fill="none" stroke="#593e20" stroke-width="1px"/><path d="m 1226.852,974.90497 c 11.4853,-33.19665 45.3521,-50.85873 60.1137,-55.71517 16.5809,-4.48399 25.2072,4.18957 34.2111,5.86475 10.1159,1.88207 11.6338,-10.11531 35.2016,-5.45981 28.1405,8.77549 62.0187,37.09184 67.4316,54.8215 -29.9158,-10.73862 -52.9745,-25.95607 -72.7049,-25.03814 -28.524,1.32705 -45.8826,0.15864 -59.5061,1.46039 -28.8077,2.75262 -37.3686,23.79089 -64.747,24.06648 z" id="path873-6" fill="#ea6859" stroke-width="1px"/><path d="m 1226.852,974.90497 c 8.3762,21.67044 32.4194,16.60257 39.5734,20.88483 33.7737,17.2833 66.327,11.0803 104.588,-0.40349 22.0209,-6.60939 53.4346,-13.23265 52.7966,-20.97007 -66.7296,-16.04296 -68.8776,-6.03209 -100.6783,-5.37602 -53.4854,-5.4961 -55.0254,7.18105 -96.2797,5.86475 z" id="path875-7" fill="#ea6859" stroke-width="1px"/><path d="m 1314.7853,642.93819 c 113.672,-1.15127 137.191,-105.92526 92.6165,-150.67464 -84.3065,-73.94616 -156.0929,-11.61483 -177.0577,26.29346 -22.7811,41.19267 -7.7915,115.50052 84.4412,124.38118 z" id="forehead-right" fill="url(#linearGradient3595)" stroke="url(#linearGradient3597)" stroke-width="1px"/><path d="m 1625.6554,846.8578 c -12.1652,2.55231 -0.6394,29.96313 -5.8648,35.18854 -10.0006,10.00063 -24.9681,40.83039 0,28.34632" id="path856-9" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1632.4976,881.06888 c 0,6.84221 0,13.68443 0,20.52664" id="path858-3" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1661.8214,868.36191 c -0.7692,37.06825 -24.8165,51.58782 -36.166,74.2869" id="path860-7" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1610.9935,831.21846 c -3.1878,43.90789 -35.1886,71.30869 -35.1886,108.49797" id="path868-5" fill="none" stroke="#552a00" stroke-width="1px"/><path d="m 1199.7365,451.97279 c 38.2336,-59.12948 83.8038,-48.76526 78.1424,-50.40217 -0.6846,-0.19794 -54.5615,37.31245 -47.9873,58.76786 0.8924,2.91239 32.0272,-26.3216 35.7124,-28.68341 3.3102,-2.12145 -24.2852,37.54429 -22.2244,39.68087 4.6914,-1.33556 44.9591,-32.95125 36.5308,-19.87006 -3.7327,3.60023 -17.3604,23.97294 -15.1185,25.14496 49.5579,-19.58116 178.1456,-67.81093 153.1974,-91.70335 -100.6668,-105.11102 -254.2849,51.68082 -218.2528,67.0653 z" id="wig-right-1" fill="url(#linearGradient3599)" stroke-width="1px"/><path d="m 1338.9762,374.07381 c -39.9745,1.67253 -94.9085,28.52044 -105.0576,69.11681" id="wig-right-1-hair-2" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1362.4759,386.51484 c -37.431,1.20898 -92.9948,30.54216 -102.2929,67.73447" id="wig-left-1-hair-3" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1381.8286,401.72054 c -33.7753,5.6284 -85.6218,35.52534 -92.6165,70.49914" id="wig-left-1-hair-4" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1441.269,386.51484 c 30.0257,-52.00865 -1.1475,-89.61707 -37.323,-125.79259" id="path996-6" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1428.828,430.74959 c 16.2015,-14.245 111.4887,-28.4457 139.616,-8.98518" id="path998-2" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1613.9258,431.43764 c -2.075,2.07501 -46.8585,-9.22415 -36.1659,-5.86476 8.8879,2.79243 52.6987,40.86591 44.9631,57.67009 -3.5133,7.63209 -119.1,-33.60226 -104.5881,-21.99282 1.4142,-3.39052 73.9672,25.9531 78.5691,87.87724 -80.8331,-54.66509 -131.7263,-66.66871 -200.2628,-98.6293 -17.3847,-45.16796 171.358,-89.05689 217.4846,-19.06045 z" id="wig-right-2" fill="url(#linearGradient3601)" stroke-width="1px"/><path d="m 1421.9163,445.95529 c 44.38,-7.52305 114.229,-20.07701 152.057,8.29402" id="path1000-5" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1446.7984,465.308 c 49.4388,2.0597 100.7375,27.47372 132.7042,59.44045" id="path1002-2" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1374.9169,336.75074 c -34.4617,-26.50279 -68.954,-22.11738 -107.8222,-22.11738" id="path1010-6" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1410.2156,333.81836 c -26.7691,-27.81343 -59.7631,-56.50808 -101.6508,-56.50808" id="path1028-8" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1397.0343,437.66128 c 7.363,-15.62459 5.1294,-42.46116 -8.294,-52.52878" id="path1032-4" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1403.7721,707.56986 c 11.4413,-22.89532 63.6989,-30.89449 85.5277,-11.24078 7.0224,3.95451 22.5261,21.61675 16.1281,19.06045 -10.581,-13.05565 -37.2413,-23.49885 -42.0887,-23.80408 -4.0587,-0.25556 -13.8058,-2.46836 -27.8629,1.94349 -9.09,2.85291 -21.7409,7.62031 -31.7042,14.04092 z" id="eyeliner-right" stroke-width="1px"/><path d="m 1364.5494,678.18776 c -21.0609,33.71382 73.0755,-22.6243 79.4843,-31.79373 -14.1895,-10.57424 -77.6586,15.03752 -79.4843,31.79373 z" id="path1170-6" fill="url(#linearGradient3605)" stroke-width="1px"/><path d="m 1367.3141,716.202 c -20.1453,13.91629 54.1533,-39.99501 50.4552,-44.23475 -15.5209,-17.7946 -47.0139,13.83781 -55.9846,22.80854 -5.9089,5.90887 -7.539,27.96039 5.5294,21.42621 z" id="path1180-4" fill="url(#linearGradient3607)" stroke-width="1px"/><path d="m 1505.4279,715.38953 c -28.7923,23.30961 -61.7646,13.99269 -94.9895,8.8202 -5.8889,9.23145 35.5296,13.84485 42.5805,13.77424 21.8291,-0.21859 29.865,0.27227 49.4766,-7.44381 -6.356,2.04124 2.6007,6.48637 2.9324,-15.15063 z" id="path1190-3" fill="url(#linearGradient3609)" stroke-width="1px"/><path d="m 1392.8873,692.70229 c -15.6492,1.25136 52.7893,-35.98308 99.8431,-12.04737 4.3725,4.62883 6.6225,10.47388 0.7164,10.14481 -24.5917,-10.26154 -47.5421,-11.62331 -100.5595,1.90256 z" id="path1342-6" fill="#fec790" fill-opacity=".60386472" stroke-width="1px"/><path d="m 1466.7632,976.69218 c -4.48,-9.71741 -16.5217,57.48252 -10.6335,86.12652 28.563,4.1896 34.1054,-41.6532 27.6791,-66.9652 -4.1551,-16.36604 -11.5801,-27.61639 -17.0456,-19.16132 z" id="path1348-2" fill="#ffdfc1" stroke-width="1px"/><path d="m 1403.7721,707.56986 c 46.7182,-17.64879 66.0965,-15.55444 99.2121,4.39858 -7.9592,-9.00588 -18.1087,-13.61361 -26.8801,-19.54919 -13.6718,-9.42109 -62.8992,-2.6305 -72.332,15.15061 z" id="eyelashes-shade-right" fill="#3a3a3a" fill-opacity=".48309183" stroke-width="1px"/><path d="m 1369.561,858.58733 c 4.5959,3.71599 -3.0027,-2.0071 -7.3017,-7.32322 -4.435,-5.48436 21.452,-11.61994 20.0087,-27.37659 13.5705,8.33046 5.9505,36.48652 -12.707,34.69981 z" id="path1205-0" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1349.0344,797.00739 c -5.9891,2.8904 -30.3685,20.49904 -19.0605,32.25616 3.4175,-5.2998 4.0888,-11.86839 31.7675,-12.70698 10.6535,-9.11407 -6.5616,-21.77908 -12.707,-19.54918 z" id="path1207-8" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1359.4944,715.22454 c -26.6659,26.27652 -0.4721,99.92359 7.1343,73.96318 0.3809,-36.25732 -11.4012,-42.44822 -7.1343,-73.96318 z" id="path1209-2" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1267.4166,958.0438 c 8.716,-23.83332 28.8851,-17.22117 49.1173,-19.06046 32.1705,2.14398 45.818,-9.32876 59.5028,15.39498 -11.9757,-7.11661 -39.6118,-4.29061 -52.0497,-4.64293 2.6658,2.03226 -36.4849,-2.72648 -56.5704,8.30841 z" id="path1023-4" fill="url(#radialGradient1031-0)" stroke-width="1px"/><path d="m 1267.6609,972.70569 c 20.494,-7.27063 35.823,-5.65121 55.4708,-3.66547 13.0216,1.30216 33.268,-6.91221 45.9406,-2.68802 3.1632,16.36925 -27.459,8.55504 -43.9857,7.81968 -5.3178,0.44265 -41.8521,9.20375 -57.4257,-1.46619 z" id="path1033-0" fill="url(#radialGradient1041-2)" stroke-width="1px"/><path d="m 1419.4115,972.08101 c -0.4825,-8.37141 -52.2896,-31.77534 -48.9041,-19.77619 14.7198,6.0127 35.7155,15.13106 48.9041,19.77619 z" id="path1061-5" fill="url(#linearGradient3615)" stroke-width="1px"/><path d="m 1407.4018,970.89744 c -9.9424,-1.93685 -28.988,-5.91708 -38.3295,-4.54524 -7.463,11.42741 39.5893,12.22035 38.3295,4.54524 z" id="path1089-2" fill="url(#radialGradient1097-6)" stroke-width="1px"/><path d="m 1302.3443,826.7889 c 4.1995,2.99744 -8.2408,15.65511 -6.9117,18.66153 14.0436,-2.15163 39.5813,0.0855 44.4372,-1.70335 4.0557,-4.05569 -7.326,-9.34375 -9.8959,-14.48353 0.8705,-5.87453 -17.2543,-8.66533 -27.6296,-2.47465 z" id="path1188-8" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1331.1047,850.53048 c -9.9395,-1.94615 -22.8963,-4.00416 -26.1793,1.28915 -6.6679,10.75092 -5.4769,46.15702 5.3051,57.73478 11.4171,12.25964 19.1994,4.96501 22.78,-0.20867 7.4865,-10.81735 9.2788,-52.83898 -1.9058,-58.81526 z" id="path1191-5" fill="#f2d5b7" fill-opacity=".38647341" stroke-width="1px"/><path d="m 1390.8138,720.34902 c -41.3161,12.80433 19.8007,82.52292 35.4399,66.88378 13.8916,-13.89167 -32.8933,-57.91772 -35.4399,-66.88378 z" id="path1193-5" fill="#f2d5b7" fill-opacity=".56078384" stroke-width="1px"/><path d="m 1445.7253,735.85944 c 3.3699,3.58493 1.0042,7.62261 6.1776,9.93538 -0.2283,-0.73884 -1.8804,-12.26709 2.3979,-9.25933 2.5213,1.77246 5.3924,11.21187 6.3688,8.56238 0,0 1.7429,-9.27191 3.6242,-8.49135 1.8404,1.67297 1.7505,8.25629 4.1725,9.33904 0.3777,-0.064 -0.013,-12.19892 1.9221,-9.69186 3.7051,4.80097 2.7658,7.86163 3.7333,7.15404 1.8055,-1.32027 2.6028,-8.52988 3.4595,-7.8952 1.2877,0.95403 2.3781,5.10824 3.6143,6.23196 1.2779,1.16161 1.9502,-8.58027 2.4255,-8.36782 1.7993,0.80442 2.8254,8.20092 4.7673,7.62665 0.8196,-0.24237 -1.4111,-9.14576 0.5769,-8.31494 1.4186,0.59286 6.1297,6.50543 8.1625,6.72643 -0.975,0.62159 -2.6563,-5.17308 -1.2099,-9.20906 0,0 9.2418,9.28435 7.3824,6.83918 -0.2178,-0.28654 -0.2507,-6.85578 -0.8837,-8.40642 -1.0066,-2.46616 7.9709,1.69195 8.8173,3.07445 1.9535,3.19082 -1.8828,-9.84323 -4.9298,-12.53025 -21.4276,15.62606 -52.6943,17.00719 -69.2025,11.7007 5.8597,5.0154 2.7266,2.87084 8.6238,4.97602 z" id="path1202-9-0" fill-opacity=".69019608" stroke-width="1.66199327px"/><path d="m 1359.7864,988.10067 c -7.3344,-13.90008 -91.6855,0.92127 -89.5908,6.81765 24.4341,28.95798 117.4184,3.19269 89.5908,-6.81765 z" id="path1253-1" fill="url(#radialGradient1269-2)" stroke-width="1px"/><path d="m 1467.5334,687.51854 c 2.8413,1.27159 9.4661,-3.43686 12.5075,-4.45066 1.1505,-0.38349 -0.2553,3.6087 -2.8485,6.76852 2.7739,4.10651 4.5028,1.47102 10.9503,-3.61634 3.0092,0 -4.4142,8.81718 -3.3301,8.55574 6.2218,-1.50035 13.8413,-6.40481 11.345,-4.16438 -0.1974,4.75011 -3.1679,6.05716 -2.9451,6.67928 0.4459,1.24528 5.0888,1.45367 9.5705,0.15575 -0.7933,2.90667 0.2556,5.58473 -6.0947,6.88712 -1.2545,-5.02596 -0.7598,0.3454 -29.1549,-16.81503 z" id="eyelashes-right" fill-opacity=".69019608" stroke-width="1px"/><path d="m 1271.8151,327.82695 c 18.4432,-6.23363 49.9134,-3.52922 65.4898,0.97746" id="path1571-2" fill="none" stroke="#ff3c00" stroke-width="4"/><path d="m 1246.4012,351.28597 c 21.6069,-9.66957 49.5691,-15.39407 92.8586,-7.81967" id="path1573-0" fill="none" stroke="#ff3c00" stroke-width="4"/><g id="hairstrand-right" fill="none" stroke="#ff3c00" stroke-width="4"><path d="m 1466.1511,376.88761 c 15.1633,-21.73961 8.9995,-81.12228 2.0735,-92.66565"/><path d="m 1500.1369,373.59946 c 5.9112,-28.59993 46.1685,-90.58002 70.3806,-93.52451"/><path d="m 1509.4779,373.76717 c 31.3939,-57.70325 81.4738,-84.55793 76.2453,-79.17768"/><path d="m 1618.2081,557.92452 c 23.0211,19.57913 33.0662,50.59753 38.7054,78.79316"/><path d="m 1599.162,519.50539 c 46.3488,29.17137 72.6947,91.8779 73.2638,129.24844"/><path d="m 1612.9159,725.70716 c 19.2485,50.8706 27.7728,30.88603 28.7919,86.56722"/><path d="m 1602.3112,557.23336 c 12.7596,8.2303 24.882,35.55762 24.882,42.16125"/><path d="m 1588.4878,558.6157 c 13.1179,10.81759 19.421,34.18863 26.9556,44.23475"/><path d="m 1573.9733,549.63051 c -3.7832,-8.13426 28.9203,48.96423 22.1174,42.16125"/><path d="m 1594.9433,430.92855 c 18.6902,8.39445 54.1824,34.04136 57.5922,43.51729"/><path d="m 1620.2793,435.34747 c 9.4902,5.29305 32.072,20.79641 39.1188,27.8432"/><path d="m 1623.7004,428.50525 c 11.6912,5.03238 37.4968,15.25438 44.2576,24.26878"/><path d="m 1611.9709,404.5575 c 12.1503,17.8808 60.1712,17.04042 71.6612,23.08888"/><path d="m 1646.5459,649.84988 c 10.9248,9.30067 33.0684,38.0928 48.6071,67.21101"/><path d="m 1666.2832,693.61872 c 33.4131,43.87637 24.4261,55.59867 31.2008,80.02813"/><path d="m 1625.901,490.53918 c 14.0196,5.69127 39.4222,36.51067 34.9429,46.46405"/><path d="m 1649.3803,489.84801 c 14.1008,12.41434 30.532,44.50338 26.1255,53.99744"/><path d="m 1662.6946,489.44314 c 10.143,9.26115 27.3733,34.4855 23.5632,38.76296"/><path d="m 1666.5206,479.09596 c 17.4225,15.19267 31.1994,38.52015 35.9,47.71341"/><path d="m 1599.223,305.48892 c -14.9258,15.9446 -69.7461,52.47828 -71.558,72.04074"/><path d="m 1471.2168,243.76546 c 19.0607,12.84368 27.0959,76.99967 13.1406,130.98303"/><path d="m 1525.2758,239.42944 c -12.5363,22.27291 -23.0907,58.5507 -23.0907,84.8791"/><path d="m 1566.0303,237.9007 c -21.8734,29.18604 -46.1599,73.09039 -51.8256,78.06973"/><path d="m 1667.9722,564.14503 c 18.2255,28.28355 25.2629,103.63319 40.7789,161.73333"/><path d="m 1681.7955,565.52737 c 16.3059,29.09412 24.9701,59.18849 27.6467,114.7339"/><path d="m 1635.43,405.04623 c -23.5556,-12.88365 -46.3726,-23.45902 -76.2419,-23.45902"/><path d="m 1560.6346,392.02077 c 8.4557,-1.5698 28.8485,3.27801 42.7511,13.23741"/><path d="m 1627.1216,506.70199 c 8.7584,1.43612 15.4733,12.37504 18.5717,18.57173"/><path d="m 1608.5322,617.55216 c 5.1814,28.17145 21.2322,55.48264 40.8796,75.13009"/><path d="m 1594.1691,624.18128 c 6.2952,33.05853 28.4641,71.55342 48.6136,91.70291"/><path d="m 1616.2662,704.83565 c 10.0912,20.7145 39.4069,49.90369 44.1942,61.87184"/><path d="m 1662.6701,722.51332 c 18.3403,23.35496 28.7262,70.5535 28.7262,87.28349"/><path d="m 1665.9846,788.80458 c 5.7709,13.95928 8.8389,28.84668 8.8389,44.19417"/></g></g><path d="m 1105.5204,1400.6414 c 204.2016,-367.2588 -39.1403,249.1057 -52.5738,192.744 -21.4416,-89.9603 82.8679,-172.1167 63.6223,-159.5983 15.2242,-7.9005 18.5519,-97.3099 -6.1666,-115.6345 -82.4139,-16.4999 113.0981,283.0513 -4.0912,282.802 -37.7703,-46.679 25.534,-139.0982 64.7677,-165.7233 35.523,-6.866 66.7668,-111.7486 38.9335,-135.5694 -68.2301,-50.5811 -81.2869,316.3632 -47.3333,342.1338 47.6897,36.1962 117.3382,-337.9498 87.8488,-347.9108 -45.8748,-17.0042 -90.6273,368.7981 -45.3479,391.1761 75.6063,13.5353 115.3384,-311.1919 103.3168,-351.4013 -45.975,-153.7746 -91.4077,264.8316 -52.0173,336.2104 76.6002,45.8107 85.1308,-391.5823 74.671,-345.5684 -42.5771,-122.6365 -43.5414,194.4756 -47.638,211.1858 -12.0406,44.6308 37.3278,160.5118 53.59,130.3728 9.3297,-17.291 5.0161,-314.9661 5.0161,-296.3434 0,19.9825 -40.9718,230.5548 24.9441,262.938 70.5725,84.1362 86.1998,-334.3351 -4.7583,-345.0318 -72.0307,70.6827 139.9627,324.4169 59.4612,294.5778 -25.2637,-6.2215 -95.7241,-129.4333 -13.8551,-135.7556 49.4108,66.3152 89.0671,-113.6327 16.5413,-146.0659 -67.106,30.5484 12.4816,133.7703 33.823,156.8721 50.8365,36.7841 10.6015,116.8619 -27.6703,82.4112" id="text-heroes" fill="none" stroke="#8c59ff" stroke-width="12"/><path d="m 887.21846,1730.2281 c -19.01546,-99.8447 10.17929,-130.0997 81.3995,-269.2731 144.52354,-286.4028 -329.59586,60.2932 -52.18438,115.7755 81.03462,16.2069 237.15212,-127.2007 216.79812,-208.6171" id="heroes-doodle-1" class="letters" fill="none" stroke="#fff" stroke-width="6" opacity="0"/><g id="heroes-doodle-2" transform="translate(-20.245461 110.56574)"><path id="path4002" class="letters" d="m 1300.7885,1415.2367 c 169.5685,42.3042 410.203,-102.7727 449.9583,-261.7939" fill="none" stroke="#ececec" stroke-width="6" opacity="0"/><path id="path4004" class="letters-2" d="m 1562.5824,1186.167 c 36.1257,68.4055 99.2171,142.7046 180.0254,143.3262" fill="none" stroke-opacity="0" stroke="#ececec" stroke-width="6"/><path id="path4006" class="letters-2" d="m 1660.7552,1149.3522 c 20.4292,88.4864 0.3457,220.5429 -44.9959,265.8845" fill="none" stroke="#ececec" stroke-width="6" stroke-opacity="0"/></g><path d="m 1258.1654,1727.1926 c 4.4259,-49.3199 -18.9136,-126.8563 -30.0208,-176.0801 -1.0484,-28.1839 -10.4452,-67.4813 -27.0737,-82.7044 -11.3013,-22.6024 1.3823,-66.8734 1.3823,-91.2341 4.5988,-24.5524 49.1155,-164.2583 -17.9704,-160.351 -15.3395,-1.7689 -20.5254,31.1369 -24.4912,56.896 -10.7473,69.8079 -14.5827,79.8239 -26.6552,100.6903 -9.3828,15.2497 -5.3923,55.6069 -8.294,55.2934 -0.099,0 -14.6918,-11.2359 -15.2057,-11.7498 -3.1028,-3.1028 -3.4881,-28.4024 -5.5294,-32.4849 -1.0036,-18.5971 -6.5101,-35.3037 -7.994,-49.0671 -3.0571,-28.3549 45.0457,-197.6869 23.1997,-216.3415 -34.8916,-26.7114 -52.0917,-0.7252 -56.8143,30.6231 -2.6804,17.7924 -18.7389,52.6174 -23.3612,75.8168 -17.8518,74.9656 -14.3682,44.7181 -20.7351,77.4108 4.218,-37.1686 7.4763,-76.3125 5.8922,-107.8357 6.643,-22.8895 5.394,-75.1545 -0.3628,-102.9705 -2.1765,-10.5167 -17.7338,-35.8896 -35.94066,-26.9556 -28.14989,13.8129 -12.53202,55.4496 -27.64678,74.6462 -5.84076,-30.5193 -28.54691,-35.2785 -38.70541,-29.029 -20.45512,10.2604 -1.38547,75.9328 -11.05868,107.8222 2.01365,12.4744 -8.29463,78.3581 -3.45584,92.6165 13.67028,15.6864 20.36924,70.7686 33.86724,91.2341 -1.79984,-0.3552 13.17154,76.1914 24.88205,93.9989 9.88058,15.0248 60.56508,138.206 56.67578,135.4689 6.0198,15.4951 22.0829,55.0875 32.7061,79.4822 4.19,9.6218 4.3018,65.4905 2.9039,73.5019 3.681,72.8416 5.8941,161.696 6.8312,170.6272 48.6925,1.0438 170.339,20.4784 202.0237,-4.349 11.4851,-53.3545 -10.9434,-220.2396 -9.0489,-224.9758 z" id="hand-left" v-bind:class="{ghost: isGhost}" fill="#fff4e9" stroke="#000"/><path d="m 1478.8621,1964.1814 c -13.7184,-17.8243 -6.7145,-254.7842 -1.3547,-269.9713 5.3623,-16.087 20.3259,-36.5349 25.6687,-52.4423 15.9266,-47.419 51.1113,-83.7128 90.9037,-156.3935 19.8731,-67.3402 3.676,-19.892 25.4139,-88.9488 15.3648,-20.7041 15.9206,-38.2257 31.2788,-85.0389 -7.3086,-35.8299 -23.296,-98.5569 -23.1313,-145.8655 0.1346,-38.6732 -8.4174,-55.9805 -12.0573,-56.4686 -43.5885,-5.8442 -49.1779,39.2354 -43.9857,50.8279 -9.0171,-16.1108 -8.4767,-50.2855 -20.2148,-69.0561 -9.8077,-15.6839 -28.1012,-20.9385 -54.1084,5.7577 -14.4487,37.8908 50.3266,182.1889 16.6531,224.5792 -3.4218,-20.5371 -25.2515,-43.0831 -31.2786,-59.625 -19.4463,-64.3238 -26.5059,-59.7626 -49.8505,-122.1824 -2.2421,-22.2615 -56.5864,-27.0149 -55.3905,14.5238 5.0903,37.7816 43.573,130.3525 51.4807,147.7344 3.3137,35.8492 5.5026,33.6263 3.1401,55.6145 -1.742,16.2128 -4.5055,37.5423 -9.0049,70.4777 -1.1865,-34.528 -12.1473,-51.4615 -19.8318,-67.002 -11.5543,-23.3664 -24.6847,-73.9223 -32.951,-103.0759 -3.7598,-27.0149 -44.4235,-39.3199 -55.7151,5.8648 1.1433,11.2966 4.4761,18.5266 7.0835,32.2049 5.001,26.2345 7.4588,36.7076 19.3079,74.3381 2.1077,6.6938 9.2902,40.3732 6.2931,59.6964 -1.6211,10.4521 -5.6927,27.0739 -8.2481,32.1848 -18.5274,21.7521 -38.7304,43.1078 -43.8542,76.8693 -2.5937,13.2148 -35.8174,120.033 -24.0642,199.489 2.1678,69.142 0.2442,232.4037 13.6367,232.5393 75.7039,4.1239 135.9584,-1.7714 194.1809,-6.6315 z" id="hand-right" v-bind:class="{ghost: isGhost}" fill="#fff4e9" fill-opacity="1" stroke="#000"/><path id="rocket-flying-path" d="M 1072.6191,606.05521 C 994.91199,-10.063007 1882.3426,-57.315437 2208.4528,287.98924 2560.6676,660.93502 2347.5402,1102.1486 2121.6813,1229.479 1751.9528,1438.9936 1026.3955,1067.9961 448.4402,1357.4134 58.560216,1552.65 48.572199,1979.718 12.159068,2208.655" fill="none" stroke="#000" stroke-width="1px" stroke-opacity="0"/></svg>
</div>
<div class="credits">
<a href="https://codepen.io/ScavengerFrontend" target="_blank">art & code <br> by Anna Zenn<br/> Scavenger ↗<a/>
</div>
body {
width: 99vw;
height: 100vh;
margin: 0;
padding: 0;
box-sizing: border-box;
overflow: hidden;
background: #410800;
-webkit-overflow-scrolling: touch;
font-family: Arial;
color: #af7f67;
}
#app {
margin: 0 auto;
width: 100vw;
height: 100vh;
position: relative;
-webkit-tap-highlight-color: transparent;
}
.credits {
position: absolute;
bottom: 0;
right: 0;
text-transform: none;
text-decoration: none;
padding: 0.35rem 0.5rem;
margin: 0.75rem 0.75rem;
font-size: 0.75rem;
color: #af7f67;
border: 1px solid #af7f67;
border-radius: 0.2rem;
opacity: 0;
transition: all 0.25s;
animation: fadeIn 5.5s ease-in forwards;
}
a {
transition: all 0.25s;
color: #af7f67;
}
a:link, a:visited {
text-decoration: none;
}
.credits:hover {
color: #d3c4ff;
border: 1px solid #d3c4ff;
}
a:hover {
color: #d3c4ff;
}
@keyframes fadeIn {
0% { opacity: 0.0; }
75% { opacity: 0.0; }
100% { opacity: 1; }
}
svg {
margin: 0 auto;
width: 90vw;
height: auto;
max-height: 100vh;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
canvas {
position: absolute;
width: 100vw;
height: 100vh;
/* background: #410800; */
}
#sticker-circle,
#space-planet-overlay
{
transition: 0.2s ease-in-out;
}
#sticker:hover,
#space-planet-overlay.active:hover {
cursor: pointer;
}
.mobile {
background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/911157/ziggy-background.png');
background-repeat: no-repeat;
background-size: cover;
bacground-position: center;
}
/* Toggled classes */
.ghost {
fill-opacity: 0;
stroke-width: 4px;
stroke: #fff4e9;
}
.active {
opacity: 1;
}
@media only screen and (max-width: 800px) {
svg {
width: 100vw;
}
}
/*
Big thanks to @giana, the rotating starry canvas is her creation:
https://codepen.io/giana/pen/qbWNYy
All SVG designed by me and optimized in SVGOMG:
https://jakearchibald.github.io/svgomg/
art & code by
Anna Zenn Scavenger, May 2019
https://twitter.com/ouchpixels
License: You can remix, adapt, and build upon my code non-commercially.
*/
new Vue ({
el: '#app',
data: function () {
return {
isMobile: false,
mouseX: 0,
maxDistanceX: 0,
startZiggy: 0,
isRocketAnimated: false,
isGhost: false,
hoverSticker: false,
hoverPlanet: false,
colorIndex: 0
}
},
created: function () {
this.checkIfMobile();
},
mounted: function () {
this.loadBackground();
this.allAnimations();
this.loadEvents();
},
methods: {
checkIfMobile: function () {
// the lazy way :P
this.isMobile = window.orientation > -1;
return;
},
loadBackground: function () {
if ( this.isMobile ) {
document.body.classList.add('mobile');
} else {
this.makeStarCanvas( 'canvas' );
}
},
allAnimations: function () {
this.faceAnimation();
this.hairAnimation();
this.marsAnimation();
if ( !this.isMobile ) {
this.stickerAnimation();
}
},
// animation timelines
faceAnimation: function () {
let faceTL = new TimelineMax({repeat: -1, yoyo: true});
faceTL
.add('facestart')
.to(['#eye-left', '#eye-right'], 1.25, {x: -15, ease: Linear.easeOut}, 'facestart')
.add('lookright')
.to(['#eye-left', '#eye-right'], 1.5, {x: 10, ease:Linear.easeOut}, 'lookright')
.add('break')
.to(['#eye-left', '#eye-right'], 0.8, {y: 2, ease: Linear.easeOut}, 'break')
.add('lookcenter')
.to(['#eye-left', '#eye-right'], 1, {x: -5, ease: Linear.easeOut}, 'lookcenter')
.add('lookdown')
.to(['#eye-left', '#eye-right'], 0.8, {y: 5, ease: Linear.easeOut}, 'lookdown')
;
return faceTL;
},
hairAnimation: function () {
let hairTL = new TimelineMax({repeat: -1, repeatDelay: 0.15, yoyo: true});
hairTL
.add('wigstart')
.to(['#wig-left-1', '#wig-right-1'], 1.25, {transformOrigin: 'center center', rotation: -10, ease: Sine.easeIn}, 'wigstart')
.to(['#wig-left-1-hair-1', '#wig-left-1-hair-2', '#wig-right-1-hair-2'], 1.25, {transformOrigin: 'center center', rotation: -5, ease: Sine.easeIn}, 'wigstart')
.to('#wig-right-2', 1.25, {transformOrigin: 'left center', rotation: 10, ease: Sine.easeInOut}, 'wigstart')
.to(['#wig-left-3', '#wig-right-3'], 1.25, {transformOrigin: 'bottom right', rotation: 5, ease: Sine.easeInOut}, 'wigstart')
;
return hairTL;
},
marsAnimation: function () {
let marsTL = new TimelineMax({repeat: -1, yoyo: true});
let ziggyWavingTL = new TimelineMax({repeat: -1, yoyo: true});
ziggyWavingTL
.add('wavingstart')
.to('#rocket-arm-ziggy', 0.75, {transformOrigin: 'center bottom', rotation: 30, ease: Power0.easeInOut}, 'wavingstart')
;
marsTL
.add('startmars')
.to('#mars-cloud-1', 3.5, {x: 50, transformOrigin: 'center center', ease: Linear.easeInOut}, 'startmars')
.to('#mars-cloud-2', 3.5, {x: 55, transformOrigin: 'center center', ease: Linear.easeInOut}, 'startmars')
.to('#mars-sun', 3.5, {x: -20, y: 15, transformOrigin: 'center center', ease: Sine.easeInOut}, 'startmars')
;
return marsTL;
},
stickerAnimation: function () {
let stickerTL = new TimelineMax({repeat: -1, yoyo: true});
let planetTL = new TimelineMax({repeat: -1, yoyo: true});
stickerTL
.set('#sticker-letters', {transformOrigin: 'center center'})
.set('#sticker', {transformOrigin: 'center center', scale: 1.1})
.to('#sticker-letters', 15, {rotation: 360, ease: Linear.easeInOut})
;
planetTL
.add('planetstart')
.to(['#planet-circle', '#planet-circle-overlay'], 15, {transformOrigin: 'center center', rotation: 360, ease: Linear.easeInOut}, 'planetstart')
;
return {
stickerTL,
planetTL
}
},
toggleRocket: function () {
this.isRocketAnimated = !this.isRocketAnimated;
},
rocketAnimation: function () {
if ( !this.isRocketAnimated ) {
this.isRocketAnimated = !this.isRocketAnimated;
let rocketTL = new TimelineMax({onComplete: this.toggleRocket});
let rocketData = MorphSVGPlugin.pathDataToBezier('#rocket-flying-path',{align: '#rocket', offsetX: -100, offsetY: -100});
rocketTL
.add('firestart')
.to(['#fire-big', '#fire-small'], 0.5, {y: 20, transformOrigin: 'center center', scale: 1.75, ease: Elastic.easeOut}, 'firestart')
.add('rocketstart')
.set('#rocket', {transformOrigin: '50% 50%'})
.set('#rocket-inside', {transformOrigin: 'center center'})
.set('#rocket-inside', {rotation: 90})
.to('#rocket', 2.5, {bezier: {values: rocketData,type: 'cubic',autoRotate: true}}, 'rocketstart')
;
return rocketTL;
} else {
console.log('Can\'t animate yet. Wait till the end of rocket animation!');
return;
}
},
ziggyAnimation: function () {
let ziggyTL = new TimelineMax();
const heroesPoints = "m 934.0889,1489.3007 c -8.38828,40.205 -110.2183,97.6924 -126.41995,42.0633 -30.42468,-104.4646 172.43524,-103.8034 256.84735,-147.6075 15.2242,-7.9005 119.0611,-90.5237 94.3426,-108.8483 -85.0401,-12.868 -155.3944,421.0205 -232.47652,350.3876 -40.68674,-45.2207 179.48842,-177.1183 227.01872,-207.8917 9.0065,-4.6563 88.8639,-52.0865 61.0306,-75.9073 -68.2301,-50.5811 -182.3193,243.35 -142.3507,258.165 53.1781,19.7113 176.7431,-129.3628 147.5109,-140.1983 -45.8748,-17.0042 -117.1438,92.5845 -71.8644,114.9625 71.2908,35.2336 147.5109,-72.9944 147.5109,-114.9625 0,-23.5122 -61.723,16.3768 -45.3881,22.4318 30.6835,11.3731 104.9198,-29.2638 94.5584,16.8238 -3.6692,16.3205 -14.6055,31.7062 -18.9118,47.6674 -12.0406,44.6308 32.9083,30.139 49.1705,0 9.3297,-17.291 22.6938,-71.8982 22.6938,-53.2755 0,19.9825 -24.2807,64.4752 -3.7822,72.9031 56.5921,23.268 94.8297,-173.5435 15.1292,-95.3347 -72.0307,70.6827 212.8831,1.7994 132.3816,-28.0397 -25.2637,-6.2215 -104.5629,126.8928 -22.6939,120.5705 50.6909,-3.9145 151.3741,-101.6029 124.817,-126.1784 -35.185,-32.5598 -46.1429,37.6691 -30.2586,72.9031 68.183,143.7556 -33.2094,149.4028 -71.8645,117.7666";
console.log('Ziggy mouse-position dependent timeline start');
ziggyTL
// head and hands animation at the same time
.add('headstart')
.to('#head-right', 4, {x: 380, ease: Sine.easeInOut}, 'headstart')
.to('#ellipse-inside-right', 4, {x: 460, ease: Sine.easeInOut}, 'headstart')
.to('#head-left', 4, {x: -510, ease: Sine.easeInOut}, 'headstart')
.to('#ellipse-inside-left', 4, {x: -430, ease: Sine.easeInOut}, 'headstart')
.to('#hand-left', 14, {x: -380, y: 150, scale: 1.25, ease: Sine.easeInOut}, 'headstart')
.to('#hand-right', 14, {x: 300, y: 150, scale: 1.25, ease: Sine.easeInOut, onComplete: this.rocketAnimation}, 'headstart')
// Mars landscape
.to(['#mars-land-1', '#mars-land-2', '#mars-land-3', '#mars-sun', '#rocket-shade', '#mars-cloud-1', '#mars-cloud-2'], 3, {fillOpacity: 1, ease: Power1.easeInOut}, 'headstart+=2')
.to(['#spider-2'], 7, {x: -3, ease: Power1.easeInOut}, 'headstart+=5')
.to('#space-planet', 5, {opacity: 0.4, ease: Power1.easeInOut}, 'headstart+=2')
// space galaxy doodles
.to(['#space-doodle-1', '#space-doodle-2', '#space-doodle-3', '#space-doodle-4', '#space-doodle-5', '#space-doodle-6', '#space-doodle-8', '#space-doodle-10', '#space-doodle-11', '#space-doodle-12', '#space-doodle-15', '#space-doodle-16'], 4, {fillOpacity: 0.2, ease: Power1.easeInOut}, 'headstart+=3')
.to(['#space-doodle-7', '#space-doodle-15', '#space-doodle-16'], 5, {strokeOpacity: 0.2, ease: Power1.easeInOut}, 'headstart+=5.5')
// 'We Can Be' drawing
.to('.letters', 0, {autoAlpha: 1}, 'headstart+=4')
.to('.letters', 0, {drawSVG: '0% 0%'}, 'headstart+=4')
.staggerTo('.letters', 3.5, {drawSVG: '0 100%'}, 2, 'headstart+=4')
.to('.letters-2', 0.5, {strokeOpacity: 1}, 'headstart+=15')
// 'Heroes' drawing
.to('#text-heroes', 15, {morphSVG: heroesPoints, y: 125, ease: Sine.easeInOut}, 'headstart+=0.5');
return ziggyTL;
},
coordinates: function (e) {
this.getMaxDistanceX('#ziggy-main');
const drawing = document.querySelector('#ziggy-main');
const drawingBox = drawing.getBoundingClientRect();
const drawingXCenter = drawingBox.width / 2 + drawingBox.left;
let pointerEvent = e;
if ( e.targetTouches && e.targetTouches[0] ) {
e.preventDefault();
pointerEvent = e.targetTouches[0];
this.mouseX = pointerEvent.pageX;
} else {
this.mouseX = e.clientX;
}
let distanceX = Math.abs(this.mouseX - drawingXCenter).toFixed(2);
let distNormalized = this.normalize(distanceX, this.maxDistanceX + 0.5, 0);
if (this.startZiggy == 0) {
this.startZiggy = this.ziggyAnimation();
}
if (distNormalized > 0.95) {
distNormalized = 1;
}
this.startZiggy.progress(1 - distNormalized).pause();
}, // end of animations
// Generate starry space canvas
// Thanks to @giana, code below is fully hers
// https://codepen.io/giana/pen/qbWNYy
makeStarCanvas: function ( canvasID ) {
let canvas = document.getElementById( canvasID ),
ctx = canvas.getContext('2d'),
w = canvas.width = window.innerWidth,
h = canvas.height = window.innerHeight,
hue = 7,
stars = [],
count = 0,
maxStars = 200
;
// Thanks @jackrugile for the performance tip! https://codepen.io/jackrugile/pen/BjBGoM
// Cache gradient
let canvas2 = document.createElement('canvas'),
ctx2 = canvas2.getContext('2d')
;
canvas2.width = 100;
canvas2.height = 100;
let half = canvas2.width / 2,
gradient2 = ctx2.createRadialGradient(half, half, 0, half, half, half);
gradient2.addColorStop(0.025, '#fff');
gradient2.addColorStop(0.1, 'hsl(' + hue + ', 61%, 33%)');
gradient2.addColorStop(0.25, 'hsl(' + hue + ', 64%, 6%)');
gradient2.addColorStop(1, 'transparent');
ctx2.fillStyle = gradient2;
ctx2.beginPath();
ctx2.arc(half, half, half, 0, Math.PI * 2);
ctx2.fill();
// End cache
function random(min, max) {
if (arguments.length < 2) {
max = min;
min = 0;
}
if (min > max) {
let hold = max;
max = min;
min = hold;
}
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function maxOrbit(x, y) {
let max = Math.max(x, y),
diameter = Math.round(Math.sqrt(max * max + max * max));
return diameter / 2;
}
let Star = function() {
this.orbitRadius = random(maxOrbit(w, h));
this.radius = random(60, this.orbitRadius) / 12;
this.orbitX = w / 2;
this.orbitY = h / 2;
this.timePassed = random(0, maxStars);
this.speed = random(this.orbitRadius) / 280000;
this.alpha = random(2, 10) / 10;
count++;
stars[count] = this;
};
Star.prototype.draw = function() {
let x = Math.sin(this.timePassed) * this.orbitRadius + this.orbitX,
y = Math.cos(this.timePassed) * this.orbitRadius + this.orbitY,
twinkle = random(10);
if (twinkle === 1 && this.alpha > 0) {
this.alpha -= 0.05;
} else if (twinkle === 2 && this.alpha < 1) {
this.alpha += 0.05;
}
ctx.globalAlpha = this.alpha;
ctx.drawImage(canvas2, x - this.radius / 2, y - this.radius / 2, this.radius, this.radius);
this.timePassed += this.speed;
}
for ( let i = 0; i < maxStars; i++ ) {
new Star();
}
function starAnimation() {
ctx.globalCompositeOperation = 'source-over';
ctx.globalAlpha = 1;
ctx.fillStyle = 'hsla(' + hue + ', 75%, 13%, 1)';
ctx.fillRect(0, 0, w, h)
ctx.globalCompositeOperation = 'lighter';
for (let i = 1, l = stars.length; i < l; i++) {
stars[i].draw();
};
window.requestAnimationFrame(starAnimation);
}
return starAnimation();
}, // end of starry canvas
resizeCanvas: function (e) {
let canvas = document.querySelector('#canvas');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
this.makeStarCanvas( 'canvas' );
},
normalize: function ( val, max, min ) {
if ( max - min === 0 ) return 1;
return ((val - min) / (max - min)).toFixed(2);
},
getMaxDistanceX: function ( elementID ) {
const element = document.querySelector( elementID );
let elementWidth = element.getBoundingClientRect().width;
this.maxDistanceX = elementWidth / 2;
return this.maxDistanceX;
},
handleClickSticker: function () {
this.isGhost = !this.isGhost;
return;
},
handleHover: function (e) {
this.isHovered = !this.isHovered;
return;
},
changeTheme: function () {
if ( !this.isGhost ) {
const colorThemes = {
mountains: ['#8c59ff', '#d4763d', '#8c59ff','#000'],
faceLeft: ['#fff4e9', '#dccfbf', '#4bb8a7', '#e0a0a0'],
faceRight: ['#fff4e9', '#dccfbf', '#4bb8a7', '#e0a0a0'],
hands: ['#fff4e9', '#d6675c', '#6e2626', '#b9b3bb']
};
if ( this.colorIndex < colorThemes.mountains.length - 1 ) {
this.colorIndex ++;
// FIXME later, ugly code :P
console.log('color index: '+ this.colorIndex);
document.querySelector('#mars-mountains').style.fill = colorThemes.mountains[this.colorIndex];
document.querySelector('#face-left').style.fill = colorThemes.faceLeft[this.colorIndex];
document.querySelector('#face-right').style.fill = colorThemes.faceRight[this.colorIndex];
document.querySelector('#hand-left').style.fill = colorThemes.hands[this.colorIndex];
document.querySelector('#hand-right').style.fill = colorThemes.hands[this.colorIndex];
} else {
this.colorIndex = 0;
console.log('color index: '+ this.colorIndex);
document.querySelector('#mars-mountains').style.fill = colorThemes.mountains[this.colorIndex];
document.querySelector('#face-left').style.fill = colorThemes.faceLeft[this.colorIndex];
document.querySelector('#face-right').style.fill = colorThemes.faceRight[this.colorIndex];
document.querySelector('#hand-left').style.fill = colorThemes.hands[this.colorIndex];
document.querySelector('#hand-right').style.fill = colorThemes.hands[this.colorIndex];
}
return;
} else {
console.log('Can\'t change themes when in ghost mode');
return;
}
},
loadEvents: function () {
const ziggy = document.querySelector('#ziggy-main');
const sticker = document.querySelector('#sticker');
const planet = document.querySelector('#space-planet-overlay');
window.addEventListener('resize', this.resizeCanvas, false);
ziggy.addEventListener('touchmove', this.coordinates);
ziggy.addEventListener('touchstart', this.coordinates);
sticker.addEventListener('touchstart', this.handleClickSticker);
planet.addEventListener('touchstart', this.changeTheme);
}
}
});
Also see: Tab Triggers