fn-burst[data-astro-cid-oldshday]{position:absolute;top:0;bottom:0;width:100%;height:100%;z-index:999}fn-carousel[data-astro-cid-oabcxoh2]{width:100%;height:10rem}#rocket-outer[data-astro-cid-x7hpk23t]{position:absolute;top:0;bottom:0;height:100%;display:flex;flex-direction:column;z-index:9;background-color:#adadeb;overflow:hidden;background:linear-gradient(0deg,#adadeb 0% 30%,#0e0f14 70%);background-position:0 100%;background-size:200% 200%}.fadeBg[data-astro-cid-x7hpk23t]{animation:bgFade 6s linear .3s forwards}.showMoon[data-astro-cid-x7hpk23t]{animation:moonSlideIn 6s ease-out forwards}.animation-container[data-astro-cid-x7hpk23t]{position:relative;flex:1;display:flex;justify-content:center;.cloud{position:absolute;background-image:url(/components/rocket/cloud.svg);background-repeat:no-repeat;background-size:100%;&.s{width:3.313rem;height:1rem;top:5vh;left:33vw}&.m{width:4.25rem;height:1.375rem;top:34vh;left:13vw}&.l{width:5.75rem;height:2rem;top:37vh;right:5vw}}#rocket-container{position:absolute;z-index:9;bottom:20%;display:flex;justify-content:center;#ship{width:6.438rem;height:11.125rem;background-image:url(/components/rocket/ship.svg);background-repeat:no-repeat;background-size:100%;position:relative;z-index:9}#flame{position:absolute;bottom:-10%;z-index:8;&.orbit{animation:orbitFlame 2s linear}}#plume{bottom:-89%;left:-14%;width:130%;z-index:7;animation:.6s infinite linear shakeL}&.shake-flame{animation:.2s infinite linear shake;z-index:0;#flame{width:38%;height:261%;bottom:-173%}#plume{display:none}}}img{position:absolute}#exhust1,#exhust2{animation:12s infinite alternate linear sideToSide;width:150vw;max-height:30vh;bottom:0;margin-bottom:-.5rem}#exhust1{z-index:99}#exhust2{animation-name:sideToSide2}}#exhusts[data-astro-cid-x7hpk23t]{transform-style:flat;width:100%}#text-container[data-astro-cid-x7hpk23t]{padding:.75rem 1.5rem;background-color:#fff;display:flex;flex-direction:column;align-items:center;position:relative;z-index:9;h1{color:#232361;font-weight:600;size:1.125rem}p{color:#232361}a{color:#007acc}button{margin-top:1.5rem;margin-bottom:1.5rem;background-color:#ff008c;color:#fff;border-radius:2rem;height:2rem;border:0;width:100%;font-weight:700}}.cloud[data-astro-cid-x7hpk23t]:not(.initial){transform:translateY(-47vh)}.drop[data-astro-cid-x7hpk23t]{animation:1s ease-in forwards drop}.slow-drop[data-astro-cid-x7hpk23t]{animation:6s linear forwards slow-drop}.initial-drop[data-astro-cid-x7hpk23t]{animation:3s linear forwards initial-drop}.star-outer[data-astro-cid-x7hpk23t]{width:1rem;position:relative;display:flex;justify-content:center;align-items:center;&.s{width:.5rem}&.m{width:.7rem}&.l{width:.9rem}&.pos1{top:3vh;left:3vw;.star{animation-delay:0ms}}&.pos2{top:10vh;left:22vw;.star{animation-delay:.2s}}&.pos3{top:6vh;left:46vw;.star{animation-delay:.4s}}&.pos4{top:12vh;left:90vw;.star{animation-delay:.6s}}&.pos5{top:11vh;left:63vw;.star{animation-delay:.8s}}&.pos6{top:17vh;left:36vw;.star{animation-delay:1s}}&.pos7{top:10vh;left:53vw;.star{animation-delay:1.2s}}&.pos8{top:2vh;left:81vw;.star{animation-delay:1.4s}}&.pos9{top:9vh;left:32vw;.star{animation-delay:1.6s}}&.pos10{top:3vh;left:15vw;.star{animation-delay:1.8s}}&.pos11{top:5vh;left:66vw;.star{animation-delay:2s}}&.pos12{top:15vh;left:9vw;.star{animation-delay:2.2s}}}#stars[data-astro-cid-x7hpk23t]{display:none;&.showStars{display:block;animation:fadeInStars 6s linear}}.star[data-astro-cid-x7hpk23t]{position:absolute;aspect-ratio:1;background:#dcf1ff;clip-path:polygon(50% 0,79% 90%,2% 35%,98% 35%,21% 90%);animation:sparkle 3s linear infinite both}#moon[data-astro-cid-x7hpk23t]{position:absolute;width:1rem;top:-20vh;right:-20vw}@keyframes moonSlideIn{0%{z-index:9;width:1rem;top:-20vh;right:-20vw}to{z-index:9;width:9rem;top:14vh;right:12vw}}@keyframes sparkle{0%,60%{background-color:#fff;width:100%}80%{background:#7df9ff;width:150%}to{width:100%;background-color:#fff}}@keyframes sideToSide{0%{left:-50%}to{left:0%}}@keyframes sideToSide2{0%{left:0%}to{left:-50%}}@keyframes shake{0%{margin-left:0%}25%{margin-left:.3%}50%{margin-left:0%}75%{margin-left:-.7%}to{margin-left:0%}}@keyframes shakeL{0%{margin-left:0%}25%{margin-left:1%}50%{margin-left:-.4%}75%{margin-left:.8%}to{margin-left:0%}}@keyframes drop{0%{transform:translateY(0);z-index:1}to{transform:translateY(100vh)}}@keyframes slow-drop{0%{transform:translateY(-47vh)}to{transform:translateY(100vh)}}@keyframes initial-drop{0%{transform:translateY(0)}to{transform:translateY(100vh)}}@keyframes bgFade{0%{background-position:0% 100%}to{background-position:0% 0%}}@keyframes fadeInStars{0%{opacity:0}to{opacity:1}}@keyframes orbitFlame{0%{width:38%;height:261%;bottom:-173%}to{height:30%;bottom:-10%;width:33%}}fn-supercar[data-astro-cid-qwq4pjjs]{width:100%;max-width:60rem}fn-textwave[data-astro-cid-oq7n4zas]{width:100%}:root{color-scheme:light dark;--fn-font: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;--accent: light-dark(#09c, #0099cc);--accent2: light-dark(deeppink, deeppink);--primary: light-dark(rgb(82, 33, 41), #09c);--mainText: light-dark(rgb(82, 33, 41), rgb(239, 239, 239));--mainBG: light-dark(white, black);--contentBG: light-dark(#eeeeee, #2a2a2a);--navBG: light-dark(#dddddd, #222222);--insertBG: light-dark(#dfdfdf,#2c2c2c);--heading: light-dark(#333, #eee);--labelText: #4d4d4d;--codeBG: #4d4d4d;--inputText: light-dark(#000,#fff);--inputBorder: #4d4d4d;--input-border-hover: #333333;--error: #df0101;--borderRadius: .5rem;--accentLight: #c7e6ff;--section1: light-dark(#f5f5f5,#3d3c3c);--detailsBG:#292929;--highlightHeading:light-dark(rgb(70, 70, 70),deepskyblue);--detailsHeading:light-dark(rgb(224, 224, 224),rgb(224, 224, 224));--detailsText:#d7d7d7d7;--detailsLink:light-dark(#e61484,#ff67b9) ;--alert:light-dark(#ff9d2e,#ff9d2e) ;--dropDownBG:light-dark(#d7d7d7,#444) ;--menuHover:#FFE8E8;overflow:hidden}*{box-sizing:border-box}html{height:100dvh;width:100dvw;font-family:var(--fn-font);font-size:16px;background-color:var(--mainBG);color:var(--mainText);overflow:hidden}a{color:var(--detailsLink)}h1,h2,h3,h4{margin-bottom:.5em}h1{font-size:1.5rem}h2{font-size:1.35rem}h3{font-size:1.1rem}h4{font-size:1rem}.noBotMargin{margin-bottom:0}.noTopMargin{margin-top:0}hr{border:0;height:1px;background-color:var(--accent);margin:1rem 2rem}code{font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace;font-size:.75rem;border-radius:var(--borderRadius)}pre{margin:0}h4 small,h3 small{opacity:.7;font-weight:400}em.alert{display:block;background-image:url(/components/danger.svg);background-repeat:no-repeat;background-position:1rem center;font-size:.9rem;background-size:1rem;margin:1rem;padding:1rem 1rem 1rem 2.5rem;border:1px dashed var(--alert);border-radius:var(--borderRadius)}body{margin:0;padding:0;display:grid;grid-template-columns:40px 1fr;width:100dvw;height:100dvh;transition:all .3s;&:has(nav.open){grid-template-columns:13.125rem 1fr;nav .open{transform:rotate(0)}}}nav ul{list-style-type:none;margin:0;padding:1rem 0;min-width:max-content}nav{display:flex;flex-direction:row-reverse;position:relative;padding:0;background:var(--navBG);text-transform:uppercase;font-size:.8rem;transition:all .3s}nav [data-selected=true]{color:var(--accent)}nav li{color:var(--mainText);user-select:none;cursor:pointer;padding:.3rem 1rem;transition:all .3s}nav .gfx{*{user-select:none}display:flex;flex-direction:row;align-items:end;padding:1rem .4rem 1rem 0rem;background-color:var(--section1);font-weight:700;font-size:2rem;line-height:2.1rem;color:var(--navBG);writing-mode:vertical-lr;&:hover{cursor:pointer}.open{writing-mode:initial;font-size:1rem;transition:all .3s;transform:rotate(180deg);color:var(--accent)}.text{flex:1;text-align:center}}main{display:flex;flex-direction:column;height:100dvh;overflow-x:hidden;overflow-y:scroll;padding:0;background-color:var(--contentBG);padding:1rem}.props-table input,.props-table select{padding:.3rem .6rem;border-radius:calc(var(--borderRadius) / 2);border:1px solid var(--inputBorder);width:100%;color:var(--accent)}.example-wrap code{display:block;padding:.3rem .6rem;margin-bottom:.5rem;color:var(--accentLight);background-color:var(--codeBG);border-radius:calc(var(--borderRadius) / 2)}.props-table{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-evenly;padding-bottom:2rem;.prop{width:calc(25% - 1rem);min-width:10rem}}.example-wrap .prop .name{padding-left:.5rem;padding-bottom:.1rem;font-size:.85rem}.example-wrap .prop-output h3{margin-top:0}.example-wrap .prop-output{padding:1rem;background-color:var(--insertBG);border-radius:var(--borderRadius)}.demo-wrap{position:relative;display:flex;justify-content:center;align-items:center;padding:2rem;background-color:var(--section1);border-radius:var(--borderRadius)}.demo-wrap:after{content:"DEMO";position:absolute;top:.3rem;left:.6rem;font-weight:700;opacity:.2}#outputbox legend{grid-column:1/3;position:absolute;top:-.8rem;left:.5rem;background-color:var(--insertBG)}#outputbox .top,#outputbox .bot{display:flex;gap:.3rem}#outputbox .name{padding:.2rem .4rem;background-color:var(--mainBG);color:var(--accent);border-radius:calc(var(--borderRadius) / 2)}#outputbox .value{padding:.2rem .4rem}#outputbox{margin-top:1.5rem;position:relative;grid-template-columns:auto 1fr;border:1px dashed var(--accent);border-radius:var(--borderRadius);padding:.8rem .6rem .6rem;min-height:2.625rem;display:grid;gap:.5rem}.example-wrap{padding:1rem;background-color:var(--section1);border-radius:var(--borderRadius)}section.data div.title{grid-column:1/3;padding:0}@media screen and (max-width:900px){.data .value{grid-column:1/3}section.data .name{justify-content:center!important}}section.data div{padding:.2rem .6rem}section.data .name{background-color:var(--accent);border-radius:calc(var(--borderRadius) / 2);color:#fff;display:flex;align-items:center;justify-content:right}section.data{display:grid;grid-template-columns:auto 1fr;gap:.1rem}section.highlight h3{padding-left:0;color:var(--highlightHeading)}section.highlight h4{color:var(--accent)}section.highlight .sub{padding:0 1rem}section.highlight .details{background-color:var(--detailsBG);color:var(--detailsText);padding:1rem;border-radius:var(--borderRadius)}section.details h3{color:var(--detailsHeading)}section.highlight{background-color:var(--section1);padding:1rem;border-radius:var(--borderRadius)}::backdrop{background-color:#000;opacity:.8}.icon-btn{background-color:transparent;border:0;margin:0;padding:0;img svg{stroke:pink}}em{color:var(--accent)}.settings-wrap[data-astro-cid-tkkm7nk2]{display:flex;align-self:flex-end;padding:0 1rem;gap:1rem;align-items:center}svg[data-astro-cid-t7gkph3t]{fill:var(--accent);cursor:pointer}dialog[data-astro-cid-oxs357fb][open]{border-radius:1rem;border:0;max-width:90vw;padding:0;background-color:var(--dropDownBG);&::-webkit-scrollbar{width:.5em}&::-webkit-scrollbar-track{box-shadow:none}&::-webkit-scrollbar-thumb{background-color:var(--accent);outline:0px solid slategrey;border-radius:1rem}button{position:absolute;top:1rem;right:.5rem;background-color:transparent;border:0;outline:none;cursor:pointer;font-size:1.2rem;font-weight:700}code.body{pre{margin:3rem 2rem;white-space:pre-wrap;word-wrap:break-word}position:relative}}.hljs{padding-top:0;background-color:#000;font-size:.8rem}.component-wrap{display:flex;flex-direction:column;max-width:100%;padding:0 1rem;content-visibility:hidden;>:last-child{margin-bottom:2rem}&[data-selected=true]{content-visibility:visible;animation:slidein .6s forwards}}.output{border:1px dashed var(--accent);padding:.3rem 1rem;border-radius:var(--borderRadius);min-height:1.6rem;word-break:break-word}.actions-wrap{cursor:pointer;position:static;top:1rem;display:flex;justify-content:center;align-items:center;align-self:baseline;margin-top:-2rem;background-color:var(--section1);border-radius:var(--borderRadius);font-size:.8rem;font-weight:700;div{display:flex;justify-content:center;align-items:center;gap:.5rem;height:100%;&.icon{background-color:var(--detailsBG);padding:0 .5rem}span{display:block;padding-left:.5rem;&:hover{color:var(--accent)}}}.download .icon{border-top-right-radius:var(--borderRadius);border-bottom-right-radius:var(--borderRadius)}svg{fill:var(--accent);cursor:pointer;vertical-align:middle}a{text-decoration:none;color:inherit;display:flex;height:100%;justify-content:center;align-items:center;gap:.5rem}}@keyframes slidein{0%{opacity:0}to{opacity:1}}