From fe325ca25a5d42a2378f03973509db4b1921ce21 Mon Sep 17 00:00:00 2001 From: Avinal Kumar Date: Fri, 16 Sep 2022 02:35:40 +0530 Subject: [PATCH] add favicon and html page handling Signed-off-by: Avinal Kumar --- public/404.html | 108 +- public/android-chrome-192x192.png | Bin 0 -> 1582 bytes public/android-chrome-512x512.png | Bin 0 -> 4341 bytes public/apple-touch-icon.png | Bin 0 -> 494 bytes public/browserconfig.xml | 9 + public/favicon-16x16.png | Bin 0 -> 410 bytes public/favicon-32x32.png | Bin 0 -> 433 bytes public/favicon.ico | Bin 0 -> 6254 bytes public/images/info.svg | 1 + public/index.html | 15 +- public/mdn-style.min.css | 2 +- public/mstile-150x150.png | Bin 0 -> 536 bytes public/post-style.css | 2021 ---------------- public/safari-pinned-tab.svg | 80 + public/site.webmanifest | 19 + public/trymerge.css | 3760 ----------------------------- src/Blog.elm | 116 +- src/Splash.elm | 14 +- 18 files changed, 282 insertions(+), 5863 deletions(-) create mode 100644 public/android-chrome-192x192.png create mode 100644 public/android-chrome-512x512.png create mode 100644 public/apple-touch-icon.png create mode 100644 public/browserconfig.xml create mode 100644 public/favicon-16x16.png create mode 100644 public/favicon-32x32.png create mode 100644 public/favicon.ico create mode 100644 public/images/info.svg create mode 100644 public/mstile-150x150.png delete mode 100644 public/post-style.css create mode 100644 public/safari-pinned-tab.svg create mode 100644 public/site.webmanifest delete mode 100644 public/trymerge.css diff --git a/public/404.html b/public/404.html index 03840d5..aeb0910 100644 --- a/public/404.html +++ b/public/404.html @@ -1,51 +1,65 @@ - - - Single Page Apps for GitHub Pages - - - - + + + + + + + + + + + Single Page Apps for GitHub Pages + + + + + + \ No newline at end of file diff --git a/public/android-chrome-192x192.png b/public/android-chrome-192x192.png new file mode 100644 index 0000000000000000000000000000000000000000..2115b77ba8ca43627c0552fa42e5fe2c3c4bc404 GIT binary patch literal 1582 zcmeAS@N?(olHy`uVBq!ia0vp^2SAvE8Azrw%`pX1Ea{HEjtmSN`?>!lvI6-E$sR$z z3=CCj3=9n|3=F@3LJcn%7)lKo7+xhXFj&oCU=S~uvn$Ysfq_vZz$e5Ns32`*gLmmm zjzn}Q%PW{3*k!tJ$N&HT*$?bx0ftLhNswPK10xeN3o9Et2PYRd55J(Wh^Ux=q^yFH zvWkSfj+&XBfs3(+ske{0ub+jgIIq7YU!b+7bcnrPlv`4OQwXGC4E2}7?Zr+U7}0&Of>;=*h@TpUD=;;@{6eP3x3(k$iToHzwf9txV5%_-nNaIB_fuVru@k>(|=Uq^9V#?*k7P{amDRvdHS-$xT~AT)3ybo}Qw* zIBVC$8zsJHH8zQ83a|tQg(zn~)46?4-RSnVqO@xPqMkhhI`#j$;x=?GEm|7oopIG` zXUG<=T|!?a*IdiLw%>3?-a6LV41r$k*#g*>v$(J|qxboDp z1gS;m>;my`>!cY!yssE(>h0HERals1sTw@>FoSM*Uik`f@#TKI=UhJ2uq7{am+h;g zM^|278&PHTC47$Ao2+_=y*n&;e}&%eV7YQf5onJ|N%qBtnp~4*aWQj_Esl}{h9F5G zL4e^3qk}9mv5`IJKO@H*MyBuslb2iXe!X6V-Hqh~qs?rS*VV6no&NeykgQ7~h^RHhpJ!`Ji!2h7+n!Senwa?PZOg|W&rJw(;&VKelM?(wqzW*P- zf1Yli@4}GW090srKw9vC#DiXr1fCCWECy^9%1jc>djuJK81Hp39Af}0`(DF_RUH{QKpb zEk|eXOqehCY`Od8w;vZ=&)mt^UB39BoZbAhec#oUx8E+C#VeM-yxH)MJjb!R_O`!r zlD}iUzWqM(ru@~<`BNX%MYaB|RAgAe++anR*!5rhz`rQ>cjDPa`)^J8`*hQr_20kh zMa;WChmmZIRi)Uc(nwgt(tmmJ2 z(;Hl*cyOAEwq)q#-XqJhSG}JS)8Zha8tJFL185~j;|8l%H8l{^ou^a3ReXPASgue|l%JNFld4csS&*ubSx}P9z)&&g@h2XR z!Y~buQ~syVcs>ncU{>bVOXe0<7WSSj!Yr)d(qM8pg;{xXh{EX`S56!`b42C{`{@Rc b1zvg#ufzpQJ~^3A1*H&AS3j3^P6P_kqk$w(eR$qdYp2aqH%uCgE*7fA{NvmhBn zVI_m8AQA^w1<64`lyC#=T5i?d*4-ahwO6&Ty88XPU-$2Q@2fXG{lyvTYtm7lqy_-c zX=|w&0{|sMD4>Lqr+YK0Qf?7;b#Ew zLjW*q3xIqo0Bl~Fbw)@s(E~$WlsY*8{l6d2(RZ5Agu{KR&^Hf389L_sogbp3zM1*x z$Zwboa?#=6oA=Q8@6Bv<*!O1E?`G!j;BYk)9ZCin2m1T?Z=Upnr9({)NJEE^b?Sk> ziw-8^7_SJc0IWq&pm}JpDL%|3GW<$ZBr4{{<=E)UanZ(cF~&E^5^EeEYZM=6lz7vS z5U>A3qF&MuI(L&4^6!%cnScLq>u-Q;lKof=-Xb{2JmgS<$^3tm5cALwGqQvo2tL#_ zJj^5lf8|C5D*6U_(|9!YkoLdQ325AZ5>NQkupiI?WRg4Rz(cBJbWqB{yZUqHMd!Q; z`}7gpyDKgQdZG$^JiMp5xMiAZbVU_(MCDKO@SNh}T5`_ox4zwJk=SXGu(!8oGJaKv zd|6*&jP)-A2owfCa+HFSikg;=o`I3(7|U@s_7kkkOdQ<2r}+3!bE@f_JYy^%ZZ6Do zR?ZF~sqB32AF>+mNHGN+Zxsn813xusL1XO2%K=(Ks#gNFgSezjE}ajS7YWe~)mOwD zMXE9i1TgDVmnVh9mHNoQ*G)wB%70LP++w6)G0ntF|Y_SFnxLq0f3g0{6Hw& z@WR*@7PWq&&AYv1v$s1-Kq^UFP)d6^Ph0gRtw7u<2?&hohME>H-stt zEY^~xc);Wr3-xQFRfAPx*7HrfXBv})@*%f;e^qquZOqx66UX%ijIT9zZF`wM+AlTV z4SZQi^mOCQf^2ieRb5!$q7pC&Iv1Hd|DT&p4#ofNhVzvu1e{Ae-39<+xU3sw&$fY#{FI|jKIbgj|B6_ z`6Uueyu<84Q3$J-p^7TPt@Tx{eWPX!$JOC9Vz(B8#0$OxErE((N&|1v%Qlq!DBen^ zsj0&2$S=t?rnt_{<$()WN_UfF_4Z+7q|NBCdQkRc{C*2v8T*WfaO-?Mpn#~^e@t2I z96reR8M7q{6LEA!GI&GjY~c-hx;H_Xn#qRS>-i;4(OGa?{*#tpHQHtsZ*{ma}imiTlKCx*o%$X;&L)FpMgtNQBarrT)oinwU3!kMp<`kD_>>oy?Y1 zgZrep?y4gS)Dne|$}0uV2aGF(-K*1(cT~;d{=<;&QeJ%RN9+9~4AlljL3EGd#ToH6 zS@qLYDkmVZe83ydO8~7*csVGeCYYjB;r!eA_Y3*%GE~6W`GH+L#L>RruvzS06`Zo! zU?ZW2;keYwH823prht4N%qBK|9h4SG@OmLe8cmT^0iiw}&s=P-J4mw9#Y9Xq7FpcH zgW!)ZyEZl}r(aRMiq%M=5vP9Z1n#BF{xKoH<^ZAdl;0^+*>x4HdSW*o=jf z&Y1Q#Tq`O=W?b)NdFkxx;h}F4hwH2qXWSFn&l@lmEg7pUt4C!nxSY3ic2*imb=@xt zm@j$|2(D#m&oKT?!-ij3SPRF*rw`Q)>$AmWp(8$?VQmT%>x-KWn;{#D7xMy-GUBnw zwKnAeQs2^^j;K#mK9sUqA$#k(9whi)0kBw$nk|Mxml;iAL*wb!OPj<5!IGB@KCY)? zpgIapIwf;-`Dr>dRry7>PQmF5&}Dj47<i{_CG2_~20VfHR9!1C~8TOiM{FdULCNzCV5Q2*>hIH$i4zI#V!f@W+ z0pPFK$AoXI;b`WE;OPD;ztoihgm=3SIbcr4j?)*e3i91g*CNQHe3qT5}WOoz%1DVw?7)TC-w-Q6k+dqYy@*_vrn z+Kn>^oqd%<4B6NVSzNREJaxBeJGm@$VQxYW`DVZPexz7 zxSt_7xLNh6!?^^-&%z7#wzl}{{cmmdt$$kJ;GDPi__|Tr=(DWb1dzV55o;W>uPab?Ko&iuRXGs4*8$AtM#CT8l$asK?q z(`GMcWPeG3=01f*MF*;~ZrYa`emrcaaMJ)Z{p{?v)Fd-d9Xw#OwPqIb;R{u>&2Kee zR(1SkZlCKw8o4a^FJ|*(T2qsb$Ql5pN_Le~$ItKlxc7{_G7kc&RM`J2_x1nk&#u}R zyVnU#6$CbBt|0ki+J1vEKT5my` zXa**i>q=8Fop#`@abI-eej89@>+|YEZ$7v-`h-g*m-yHdQ?lQ2Oy4r7e4o)%o&<7N zbctA(ngeHIiMW%f6lakl-j+Yb<6~)wqTeb};np~2N4zX#+jKd#t!!uA(<6AQl>XCNpZ*rkx2Bu#xKzddUMrI1hlBh1V6K{lE>P4BC*${VDg-1%T*qETkj zEJa(~URRo%sM;}@&G{^(jPGiAAwk)H{wl7U=+Kr^x76CANxzsgXPu-cA4qA&N~vMo z;YKVj3|m+pdj8;%lvF)QLP{#8fN+)**-$NM*2y*%Z;DTcxll$Y;^a-|7mH~VJ=iBC z6%`e!42Y&x@0W*f@7Atc=l3Q!X++SMg5s0&e9gLf6R)z0zpkS}X4Hq%J3p4C)?}?t~i= zbOfl`SzdMmJNj&Pc?mzVQO<|I`&PuN|4WXJ?E@(8b;UmJa|7H}s|))d{lAUv zcTfHyp7E1tL0u-9S$e<(<@=|j05;7tPgggTA zsrF;W9}?U>9bM4@|2`q=ozWR`f@vVi3}bAE<@NIMM7z2<@nQnJoOoTmFb)9VGJjpA zrSvut66!SQ>eha53}AdTVh%LSe9SsYEHGwXHN13-BaE*C#oIOXy1li#m9v$i3$JzW ak{Fm}W5TRnlu6z{mbSXSTIogGh<^g~O5QX8 literal 0 HcmV?d00001 diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..41d8fe1acecdfc88f498532e15832031e7328c73 GIT binary patch literal 494 zcmeAS@N?(olHy`uVBq!ia0vp^TR@nF8AzUgEX@d{SkfJR9T^xl_H+M9WCijSl0AZa z85pY67#JE_7#My5g&JNkFq9fFFuY1&V6d9Oz#v{QXIG#NP(mWWC&U#NY6!0ii6{w5ELSKf%1_J8NmVGREJ#(zEGS6^x@FGePdprjVHz5z z{7;|pd>X{Stjw*K%q^@e>^)h8Sy;iP!Q^lXv-0K;h0`~#oH%mkh|Cf8(+wUAy!04e Wi3^r|ax$F?@`b0XpUXO@geCxnD5E|A literal 0 HcmV?d00001 diff --git a/public/browserconfig.xml b/public/browserconfig.xml new file mode 100644 index 0000000..a47e5a5 --- /dev/null +++ b/public/browserconfig.xml @@ -0,0 +1,9 @@ + + + + + + #2d89ef + + + diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png new file mode 100644 index 0000000000000000000000000000000000000000..cedf3a65d8481329f0501eb1274122b72381f27a GIT binary patch literal 410 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!73?$#)eFPF6i|qFdh=jFVqPjbHG~Rz{$Z zgr|#R2*>s0ga$@O4uJ(d3wvfahFkLh9kY&o&JMG(`9L+QC9V-ADTyViR>?)FK#IZ0 zz{p6~z*5)HG{nfj%Gkon&{W&Nz{ zT%n*SKP@vSRiUJ^AXOo=pd^`rp<>SCPdprjVHz5z{7;|pd>X{Stjw*K%q^@e>^)h8 zSy;iP!Q^lXv-0K;h0`~#oH%mkh|Cf8(+wUAy!04ei3^r|ax$F?w1UCY)z4*}Q$iB} DcbIr~ literal 0 HcmV?d00001 diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png new file mode 100644 index 0000000000000000000000000000000000000000..a2197603b7836c53575ce61721685c581a1635e9 GIT binary patch literal 433 zcmeAS@N?(olHy`uVBq!ia0vp^3LwnF3?v&v(vJfvmUKs7M+SzC{oH>NSwWJ?9znhg z3{`3j3=J&|48MRv4KElNN(~qoUL`OvSj}Ky5HFasE6@fgAsyfo;tHfq_w9I>zQj~j z$3$66SzbX&Rt_lg|NnpSzt@6+(o7{me!&bcZa6J30`eG>yxm_(Jbhi+ zpKKdAc7#Ua@TUZ&IY8x0>85n%o`EoXj zhTQy=%(P0}8d{$OsslBISA|5B1SOU$6cpvBW#*(RlvEa^Dr6RvBr`Bn%z6BYhodk| zL*tbH=`)^BgBX~Vx%HB{g_VW9CyOu(E4Vb698O_Y-W;NE`o@(LN6s9PIl_Lr!DE4! a9>Xhf!IDo-rc;4dFnGH9xvX4YoP(NxD4u{j&k^HUegJPephq@Hm!@ zC)cK7PR!%f@z=*McHgU@ZBIo4@U zlfpUygx$_{ANH?U+%DF8-<)zjVIY6p+cMu+28r zzW0FoU-Lgj4&37Uqi+h!co>(Kz9}4H`d;m)_5b2&Wf}A7Gspgi5i|aETerCWbpD64 zPUEldKkR|}nuyuf{L}pFL;gt~redxaknOA`njW+5*pvI%HrFY*EMW+L^>Av7NXg<- m_3%*Go1Eb+^dIxNaVPy!H*;R5{{U!`2goFu>-wWMkKF?-QAL{o literal 0 HcmV?d00001 diff --git a/public/images/info.svg b/public/images/info.svg new file mode 100644 index 0000000..aafd23f --- /dev/null +++ b/public/images/info.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/index.html b/public/index.html index 04a481f..aa0cf06 100644 --- a/public/index.html +++ b/public/index.html @@ -4,6 +4,17 @@ + + + + + + + + + + + @@ -26,7 +37,7 @@ app.ports.sendString.subscribe(function (markdowndata) { var numberOfHeadings = 0; - let toc = ''; + // let toc = ''; const renderer = new marked.Renderer(); const sections = []; renderer.heading = (text, level) => { @@ -43,7 +54,7 @@
`; - toc += `
  • ${text}
    • `; + // toc += `
  • ${text}
    • `; if (numberOfHeadings === 0) { numberOfHeadings++; return sectionContent; diff --git a/public/mdn-style.min.css b/public/mdn-style.min.css index 24c9434..84be08f 100644 --- a/public/mdn-style.min.css +++ b/public/mdn-style.min.css @@ -1 +1 @@ -@import "https://rsms.me/inter/inter.css";html{font-family:'Inter',sans-serif}*,:after,:before{box-sizing:border-box}blockquote,body,dd,dl,figure,h1,h2,h3,h4,ol,p,ul{margin:0}html{scroll-behavior:smooth}body{text-rendering:optimizeSpeed;font-family:Inter,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-family:var(--font-body);font-size:100%;font-size:var(--base-font-size);line-height:1.75;line-height:var(--font-content-line-height)}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}a{text-decoration:none}img,picture{max-width:100%}button,input,select,textarea{font:inherit}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:after,:before{-webkit-animation-duration:.01ms!important;animation-duration:.01ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:var(--code-token-comment)}.token.punctuation{color:var(--code-token-punctuation)}.token.attr-name,.token.builtin,.token.class-name,.token.function,.token.inserted,.token.property,.token.selector{color:var(--code-token-attribute-name)}.token.atrule,.token.attr-value{color:var(--code-token-attribute-value)}.token.keyword{color:var(--code-token-tag)}.token.boolean,.token.char,.token.constant,.token.deleted,.token.number,.token.string,.token.symbol,.token.tag{color:var(--code-token-attribute-value)}.token.builtin,.token.inserted,.token.selector,.token.template-string>.token.string{color:var(--code-token-selector)}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.notecard{--note-background:var(--background-information);--note-theme:var(--icon-information);background-color:var(--note-background);border:1px solid var(--border-secondary);border-left:4px solid var(--note-theme);border-radius:.25rem;border-radius:var(--elem-radius);box-shadow:var(--shadow-01);margin:1rem 0;padding:1rem 1rem 1rem 3rem;position:relative}.notecard,.notecard li,.notecard p{color:var(--text-secondary)}.notecard p{line-height:2;margin:0!important}.notecard:before{background-color:var(--note-theme);content:"";display:block;height:1rem;left:1rem;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;position:absolute;top:1.5rem;width:1rem}.notecard.inline{font:var(--type-body-s);margin:.5rem;padding:.125rem .375rem .125rem 1.5rem}.notecard.inline:before{display:block;height:.8rem;left:.2rem;top:.1875rem;width:.8rem}.notecard.warning{--note-background:var(--background-warning);--note-theme:var(--icon-warning)}.notecard.warning:before{-webkit-mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg)}.notecard.nonstandard{--note-background:var(--background-warning);--note-theme:var(--icon-warning)}.notecard.nonstandard:before{-webkit-mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg)}.notecard.error,.notecard.negative{--note-background:var(--background-critical);--note-theme:var(--icon-critical)}.notecard.error:before,.notecard.negative:before{-webkit-mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg);mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg)}.notecard.deprecated{--note-background:var(--background-critical);--note-theme:var(--icon-critical)}.notecard.deprecated:before{-webkit-mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg);mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg)}.notecard.experimental:before{-webkit-mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg);mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg)}.notecard.success{--note-background:var(--background-success);--note-theme:var(--icon-success)}.notecard.success:before{-webkit-mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg);mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg)}.notecard ol,.notecard ul{padding-left:2rem}.notecard p,.notecard ul{padding-bottom:.5rem}.notecard p:last-child,.notecard ul:last-child{padding-bottom:0}.notecard:last-of-type{margin-bottom:2rem}.notecard:first-of-type{margin-top:2rem}.notecard>:first-child{margin-top:0}.notecard h1,.notecard h2,.notecard h3,.notecard h4,.notecard h5,.notecard h6{color:var(--text-primary);font:1rem;font:var(--type-base-font-size-rem);margin-bottom:.5rem}.main-content .notecard a:not(.button),.main-content .notecard code{color:var(--notecard-link-color)}.main-content .notecard a:not(.button):hover,.main-content .notecard code:hover{text-decoration:none}.pagination{align-items:center;display:flex;gap:1rem;justify-content:center;padding:1rem 0}.mdn-form,.pagination-label{font-size:.833rem;font-size:var(--type-smaller-font-size)}.mdn-form{font-family:Inter,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-family:var(--font-body);font-weight:600;font-weight:var(--font-body-strong-weight)}.mdn-form-item{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;padding-top:1rem}.mdn-form-item:first-child{padding-top:0}.mdn-form-item.is-button-row{display:flex;justify-content:flex-end}.mdn-form-item.is-button-row .button{width:auto}.mdn-form-item [type=text]{background:var(--background-primary);border:1px solid var(--border-primary);color:var(--text-primary);flex:1 1 100%;font-size:.833rem;font-size:var(--type-smaller-font-size);min-width:0;padding:.5rem}.mdn-form-item [type=text]:focus{border:1px solid var(--button-secondary-border-focus);box-shadow:0 0 0 3px var(--accent-primary-engage);box-shadow:var(--focus-effect);outline:0 none}.mdn-form-item label{width:100%}:root{--font-fallback:BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;--font-body:Inter,var(--font-fallback);--font-heading:Inter,var(--font-fallback);--font-code:Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;--base-font-size:100%;--base-line-height:1.2;--intermediate-line-height:1.5;--heading-line-height:var(--base-line-height);--heading-letter-spacing:-.031rem;--font-content-line-height:1.75;--font-body-strong-weight:600;--type-heading-h1-font-size:2.488rem;--type-heading-h2-font-size:2.074rem;--type-heading-h3-font-size:1.728rem;--type-heading-h4-font-size:1.44rem;--type-heading-h5-font-size:1.2rem;--type-base-font-size-rem:1rem;--type-smaller-font-size:.833rem;--type-tiny-font-size:.694rem;--type-heading-h1-font-size-mobile:1.802rem;--type-heading-h2-font-size-mobile:1.602rem;--type-heading-h3-font-size-mobile:1.424rem;--type-heading-h4-font-size-mobile:1.266rem;--type-emphasis-m:var(--font-body-strong-weight) var(--type-smaller-font-size) /1.23 var(--font-body);--type-label-s:600 var(--type-tiny-font-size) /1.2 var(--font-heading);--type-heading-h1:600 var(--type-heading-h1-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h2:500 var(--type-heading-h2-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h3:300 var(--type-heading-h3-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h4:400 var(--type-heading-h4-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h5:400 var(--type-heading-h5-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h6:400 var(--type-base-font-size-rem) /var(--heading-line-height) var(--font-heading);--type-article-p:400 var(--type-base-font-size-rem) /var(--font-content-line-height) var(--font-body);--max-width:1440px;--gutter:1rem;--top-navigation-height:4rem;--top-navigation-offset:-4rem;--z-index-back:-1;--z-index-top:9999;--z-index-a11y:10000;--z-index-mid:500;--z-index-nav-menu:200;--z-index-search-results:101;--z-index-low:100;--z-index-search-results-home:99;--elem-radius:.25rem;--focus-effect:0 0 0 3px var(--accent-primary-engage);--form-elem-height:2rem;--sticky-header-height:0;--top-nav-height:4rem;--main-document-header-height:6rem;--icon-size:1rem}@media screen and (min-width:769px){:root{--type-heading-h1:600 var(--type-heading-h1-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h2:500 var(--type-heading-h2-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h3:300 var(--type-heading-h3-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h4:400 var(--type-heading-h4-font-size) /var(--heading-line-height) var(--font-heading)}}:target{scroll-margin-top:0;scroll-margin-top:var(--sticky-header-height)}body{accent-color:var(--accent-primary);background-color:var(--background-primary);color:var(--text-primary);scrollbar-color:var(--scrollbar-color) var(--scrollbar-bg)}body.full-screen-overlay{overflow:hidden}:focus-visible{outline-color:var(--accent-primary);outline-offset:1px;outline-style:auto}main{min-height:80vh}.about-container a:link,.about-container a:visited,.main-page-content a:link,.main-page-content a:visited{text-decoration:underline}.about-container a:focus,.about-container a:hover,.main-page-content a:focus,.main-page-content a:hover{text-decoration:none}.visually-hidden{clip:rect(1px,1px,1px,1px)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.hidden{display:none}pre{word-wrap:break-word;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap}a{color:var(--text-link)}a.external:after{background-color:var(--icon-primary);content:"";display:inline-flex;height:10px;margin-left:4px;-webkit-mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);-webkit-mask-size:cover;mask-size:cover;width:10px}.expand-this-link:after{bottom:0;content:"";left:0;position:absolute;right:0;top:0}[type=search]::-ms-clear{display:none;height:0;width:0}[type=search]::-ms-reveal{display:none;height:0;width:0}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration,[type=search]::-webkit-search-results-button,[type=search]::-webkit-search-results-decoration{display:none}u{-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.plus,.plus .dark{--background-toc-active:var(--plus-accent-background-color);--text-link:var(--plus-accent-color);--category-color:var(--plus-accent-color);--category-color-background:var(--plus-accent-background-color);--code-color:var(--plus-code-color);--mark-color:var(--plus-mark-color)}.category-html{--background-toc-active:var(--html-accent-background-color);--category-color:var(--html-accent-color);--category-color-background:var(--html-accent-background-color);--mark-color:var(--html-mark-color)}.category-css{--background-toc-active:var(--css-accent-background-color);--category-color:var(--css-accent-color);--category-color-background:var(--css-accent-background-color);--mark-color:var(--css-mark-color)}.category-javascript{--background-toc-active:var(--js-accent-background-color);--category-color:var(--js-accent-color);--category-color-background:var(--js-accent-background-color);--mark-color:var(--js-mark-color)}.category-http{--background-toc-active:var(--http-accent-background-color);--category-color:var(--http-accent-color);--category-color-background:var(--http-accent-background-color);--mark-color:var(--http-mark-color)}.category-api{--background-toc-active:var(--apis-accent-background-color);--category-color:var(--apis-accent-color);--category-color-background:var(--apis-accent-background-color);--mark-color:var(--apis-mark-color)}.category-learn{--background-toc-active:var(--learn-accent-background-color);--category-color:var(--learn-accent-color);--category-color-background:var(--learn-accent-background-color);--mark-color:var(--api-mark-color)}.mify{margin-left:.5rem}.mify:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.1em;text-underline-offset:.1em}.mify:before{background-color:var(--text-link);content:"";display:inline-block;height:1.2em;-webkit-mask-size:cover;mask-size:cover;-webkit-transform:translate(-.2em,.2em);transform:translate(-.2em,.2em);width:1.2em}._ify:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.1em;text-underline-offset:.1em}@media(forced-colors:active){.icon{background-color:CanvasText!important}}.homepage{align-items:center;display:flex;flex-direction:column;gap:2rem;overflow-x:clip;overflow-y:visible;position:relative;width:100%}.homepage-hero{color:var(--text-primary);display:grid;grid-template-rows:fit-content(24rem);width:100%}.homepage-hero section{display:flex;flex-direction:column;gap:2rem;grid-column:1;grid-row:1;height:100%;justify-content:center;margin:0 auto;max-width:52rem;padding:0 1rem;width:100%}.homepage-hero section h1{font-size:2.2rem;font-weight:200;letter-spacing:-.5px;line-height:120%;margin:0}@media screen and (min-width:426px){.homepage-hero section h1{font-size:2.5rem}}@media screen and (min-width:769px){.homepage-hero section h1{font-size:3rem}}.homepage-hero section h1:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1rem}.homepage-hero section p{font-weight:300}.homepage-hero .homepage-hero-bg{--mandala-primary:var(--border-primary);background-color:rgba(1,1,1,.9);grid-column:1;grid-row:1;overflow:hidden;top:0;width:100%;z-index:-1}.homepage-hero .homepage-hero-bg .mandala-translate{-webkit-transform:translate(10rem,-8rem) scale(1.2);transform:translate(10rem,-8rem) scale(1.2)}@media screen and (min-width:426px){.homepage-hero .homepage-hero-bg .mandala-translate{-webkit-transform:translate(12rem,-8rem);transform:translate(12rem,-8rem)}}.homepage-hero .homepage-hero-search{align-self:center;display:flex;margin-bottom:1rem;max-height:4rem;max-width:40rem;width:100%}.homepage-hero .homepage-hero-search .search-input-field{background-color:rgba(1,1,1,.5);border-radius:10rem;padding:2rem}.homepage-hero .homepage-hero-search .search-input-field:focus{border-color:var(--field-focus-border);box-shadow:var(--focus-01)}.homepage-hero .homepage-hero-search .search-input-field::-webkit-input-placeholder{font-size:1.5rem}.homepage-hero .homepage-hero-search .search-input-field::placeholder{font-size:1.5rem}.homepage-hero .homepage-hero-search .search-widget{display:flex;gap:0}.homepage-hero .homepage-hero-search .search-results{box-shadow:var(--shadow-02);margin:0 1.5rem;text-align:left;top:4.2rem;width:calc(100% - 3rem);z-index:var(--z-index-search-results-home)}.homepage-hero .homepage-hero-search .search-results .result-item a{padding:.5rem 1.5rem}.homepage-hero .homepage-hero-search .search-results .result-item mark{background:none;color:var(--text-primary)}.homepage-hero .homepage-hero-search .search-results .result-item span{color:var(--text-secondary);font-weight:400}.homepage-hero .homepage-hero-search .search-results .result-item small{color:var(--text-secondary)}.homepage-hero .search-button.button{height:100%;left:auto;position:absolute;right:1.5rem;top:0}.homepage-hero .search-button.button:hover{background:none;border-color:transparent}.homepage-hero .search-button.button .button-wrap{background:none}.homepage-hero .search-button.button .button-wrap:hover{background:none;border:1px solid transparent}.homepage-hero .search-button.button .button-wrap:hover .icon{background-color:var(--text-link)}.homepage-hero .search-button.button .button-wrap .icon{background-color:var(--icon-primary);border:none}.icon{--size:var(--icon-size,1rem);background-color:var(--icon-primary);display:inline-block;flex-shrink:0;height:var(--size);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:middle;width:var(--size)}svg.icon{background:transparent;color:var(--icon-primary)}.icon.icon-add-filled{-webkit-mask-image:url(/static/media/add-filled.a8e6793efe0c45d06016.svg);mask-image:url(/static/media/add-filled.a8e6793efe0c45d06016.svg)}.icon.icon-add{-webkit-mask-image:url(/static/media/add.9f0957aa3417844441a2.svg);mask-image:url(/static/media/add.9f0957aa3417844441a2.svg)}.icon.icon-altname{-webkit-mask-image:url(/static/media/altname.fa41e3cb6859d720b231.svg);mask-image:url(/static/media/altname.fa41e3cb6859d720b231.svg)}.icon.icon-bell-filled{-webkit-mask-image:url(/static/media/bell-filled.92b1b0fec0b6ed04f771.svg);mask-image:url(/static/media/bell-filled.92b1b0fec0b6ed04f771.svg)}.icon.icon-bell{-webkit-mask-image:url(/static/media/bell.034a87122ec06307f900.svg);mask-image:url(/static/media/bell.034a87122ec06307f900.svg)}.icon.icon-bookmark-filled{-webkit-mask-image:url(/static/media/bookmark-filled.22802275efddc0dd3f04.svg);mask-image:url(/static/media/bookmark-filled.22802275efddc0dd3f04.svg)}.icon.icon-bookmark{-webkit-mask-image:url(/static/media/bookmark.e9ba9d27f97589ba62cc.svg);mask-image:url(/static/media/bookmark.e9ba9d27f97589ba62cc.svg)}.icon.icon-cancel{-webkit-mask-image:url(/static/media/cancel.ff1ee2551e18f9c9c8d3.svg);mask-image:url(/static/media/cancel.ff1ee2551e18f9c9c8d3.svg)}.icon.icon-checkmark{-webkit-mask-image:url(/static/media/checkmark.d05ce91f65dfc321cadd.svg);mask-image:url(/static/media/checkmark.d05ce91f65dfc321cadd.svg)}.icon.icon-chevron{-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg)}.icon.icon-chrome{-webkit-mask-image:url(/static/media/chrome.4c57086589fd964c05f5.svg);mask-image:url(/static/media/chrome.4c57086589fd964c05f5.svg)}.icon.icon-critical{-webkit-mask-image:url(/static/media/critical.046b659f661afa9ab11f.svg);mask-image:url(/static/media/critical.046b659f661afa9ab11f.svg)}.icon.icon-deno{-webkit-mask-image:url(/static/media/deno.a791d0899729b3089500.svg);mask-image:url(/static/media/deno.a791d0899729b3089500.svg)}.icon.icon-deprecated{-webkit-mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg);mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg)}.icon.icon-desktop{-webkit-mask-image:url(/static/media/desktop.ae5e91df1e60ced79a5e.svg);mask-image:url(/static/media/desktop.ae5e91df1e60ced79a5e.svg)}.icon.icon-disabled{-webkit-mask-image:url(/static/media/disabled.f52f4d023359dbf8a727.svg);mask-image:url(/static/media/disabled.f52f4d023359dbf8a727.svg)}.icon.icon-edge{-webkit-mask-image:url(/static/media/edge.40018f6a959bc3e5c537.svg);mask-image:url(/static/media/edge.40018f6a959bc3e5c537.svg)}.icon.icon-edit{-webkit-mask-image:url(/static/media/edit.2e4f3bd111b39f9ebbc2.svg);mask-image:url(/static/media/edit.2e4f3bd111b39f9ebbc2.svg)}.icon.icon-ellipses{-webkit-mask-image:url(/static/media/ellipses.c6dd1c04b7ef3cba126a.svg);mask-image:url(/static/media/ellipses.c6dd1c04b7ef3cba126a.svg)}.icon.icon-experimental{-webkit-mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg);mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg)}.icon.icon-external{-webkit-mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);mask-image:url(/static/media/external.ad7e40a95bc765963433.svg)}.icon.icon-eye-filled{-webkit-mask-image:url(/static/media/eye-filled.dd0405b418fcfecf0f77.svg);mask-image:url(/static/media/eye-filled.dd0405b418fcfecf0f77.svg)}.icon.icon-eye{-webkit-mask-image:url(/static/media/eye.b451ad8ced0662500e82.svg);mask-image:url(/static/media/eye.b451ad8ced0662500e82.svg)}.icon.icon-footnote{-webkit-mask-image:url(/static/media/footnote.adb3f56121e4f9c95ba7.svg);mask-image:url(/static/media/footnote.adb3f56121e4f9c95ba7.svg)}.icon.icon-github-mark-small{-webkit-mask-image:url(/static/media/github-mark-small.348586b8904b950b8ea8.svg);mask-image:url(/static/media/github-mark-small.348586b8904b950b8ea8.svg)}.icon.icon-ie{-webkit-mask-image:url(/static/media/ie.cf17782c766db346d9b1.svg);mask-image:url(/static/media/ie.cf17782c766db346d9b1.svg)}.icon.icon-information{-webkit-mask-image:url(/static/media/information.81a9c7bfba75e9c4e993.svg);mask-image:url(/static/media/information.81a9c7bfba75e9c4e993.svg)}.icon.icon-language{-webkit-mask-image:url(/static/media/language.e4289910782fa8d1c882.svg);mask-image:url(/static/media/language.e4289910782fa8d1c882.svg)}.icon.icon-menu-filled{-webkit-mask-image:url(/static/media/menu-filled.48a621119c4448c94d79.svg);mask-image:url(/static/media/menu-filled.48a621119c4448c94d79.svg)}.icon.icon-menu{-webkit-mask-image:url(/static/media/menu.1ed93cf1ba8c04627c11.svg);mask-image:url(/static/media/menu.1ed93cf1ba8c04627c11.svg)}.icon.icon-mobile{-webkit-mask-image:url(/static/media/mobile.7f0bdae2a317caf911ee.svg);mask-image:url(/static/media/mobile.7f0bdae2a317caf911ee.svg)}.icon.icon-more{-webkit-mask-image:url(/static/media/more.ce2ad00a1fca149a22ce.svg);mask-image:url(/static/media/more.ce2ad00a1fca149a22ce.svg)}.icon.icon-theme-dark{-webkit-mask-image:url(/static/media/theme-dark.2204a73b9b7fbc5e0219.svg);mask-image:url(/static/media/theme-dark.2204a73b9b7fbc5e0219.svg)}.icon.icon-next{-webkit-mask-image:url(/static/media/next.1ecddf89481891f59480.svg);mask-image:url(/static/media/next.1ecddf89481891f59480.svg)}.icon.icon-no{-webkit-mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg);mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg)}.icon.icon-nodejs{-webkit-mask-image:url(/static/media/nodejs.bb93afa7923c2473034b.svg);mask-image:url(/static/media/nodejs.bb93afa7923c2473034b.svg)}.icon.icon-nonstandard{-webkit-mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg)}.icon.icon-note-info{-webkit-mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg);mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg)}.icon.icon-note-warning{-webkit-mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg)}.icon.icon-note-deprecated{-webkit-mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg);mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg)}.icon.icon-opera{-webkit-mask-image:url(/static/media/opera.a0ab0c5004c00e618a00.svg);mask-image:url(/static/media/opera.a0ab0c5004c00e618a00.svg)}.icon.icon-padlock{-webkit-mask-image:url(/static/media/padlock.6210113487ca12ff25f3.svg);mask-image:url(/static/media/padlock.6210113487ca12ff25f3.svg)}.icon.icon-partial{-webkit-mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg);mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg)}.icon.icon-prefix{-webkit-mask-image:url(/static/media/prefix.db94a69f5867547725e5.svg);mask-image:url(/static/media/prefix.db94a69f5867547725e5.svg)}.icon.icon-preview{-webkit-mask-image:url(/static/media/preview.77ee12031f5f5ecb2962.svg);mask-image:url(/static/media/preview.77ee12031f5f5ecb2962.svg)}.icon.icon-previous{-webkit-mask-image:url(/static/media/previous.585a0363cab37d75a90d.svg);mask-image:url(/static/media/previous.585a0363cab37d75a90d.svg)}.icon.icon-quote{-webkit-mask-image:url(/static/media/quote.d88c218cc7eaf9168178.svg);mask-image:url(/static/media/quote.d88c218cc7eaf9168178.svg)}.icon.icon-safari{-webkit-mask-image:url(/static/media/safari.3679eb31121b46323304.svg);mask-image:url(/static/media/safari.3679eb31121b46323304.svg)}.icon.icon-samsunginternet{-webkit-mask-image:url(/static/media/samsunginternet.55e41ddfc05627ecc331.svg);mask-image:url(/static/media/samsunginternet.55e41ddfc05627ecc331.svg)}.icon.icon-search{-webkit-mask-image:url(/static/media/search.cebfd63a204ba9fefa74.svg);mask-image:url(/static/media/search.cebfd63a204ba9fefa74.svg)}.icon.icon-server{-webkit-mask-image:url(/static/media/server.fdad5f2f9f48879ac6c2.svg);mask-image:url(/static/media/server.fdad5f2f9f48879ac6c2.svg)}.icon.icon-sidebar{-webkit-mask-image:url(/static/media/sidebar.18421c220ec0a5e690f1.svg);mask-image:url(/static/media/sidebar.18421c220ec0a5e690f1.svg)}.icon.icon-simple-firefox{-webkit-mask-image:url(/static/media/simple-firefox.9b9181d8c30c3de88edf.svg);mask-image:url(/static/media/simple-firefox.9b9181d8c30c3de88edf.svg)}.icon.icon-small-arrow{-webkit-mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg)}.icon.icon-theme-light{-webkit-mask-image:url(/static/media/theme-light.af1aa3887c0deadaaf2e.svg);mask-image:url(/static/media/theme-light.af1aa3887c0deadaaf2e.svg)}.icon.icon-star-filled{-webkit-mask-image:url(/static/media/star-filled.358ee4566f4a4c7d438d.svg);mask-image:url(/static/media/star-filled.358ee4566f4a4c7d438d.svg)}.icon.icon-star{-webkit-mask-image:url(/static/media/star.00aab2ac065852fd407a.svg);mask-image:url(/static/media/star.00aab2ac065852fd407a.svg)}.icon.icon-theme-os-default{-webkit-mask-image:url(/static/media/theme-os-default.b14255eadab403fa2e8a.svg);mask-image:url(/static/media/theme-os-default.b14255eadab403fa2e8a.svg)}.icon.icon-thumbs-down{-webkit-mask-image:url(/static/media/thumbs-down.7ca516d7f04791a3910c.svg);mask-image:url(/static/media/thumbs-down.7ca516d7f04791a3910c.svg)}.icon.icon-thumbs-up{-webkit-mask-image:url(/static/media/thumbs-up.10a6075a46940d218431.svg);mask-image:url(/static/media/thumbs-up.10a6075a46940d218431.svg)}.icon.icon-trash{-webkit-mask-image:url(/static/media/trash.edee2ea86f1b505315f7.svg);mask-image:url(/static/media/trash.edee2ea86f1b505315f7.svg)}.icon.icon-twitter{-webkit-mask-image:url(/static/media/twitter.cc5b37feab537ddbf701.svg);mask-image:url(/static/media/twitter.cc5b37feab537ddbf701.svg)}.icon.icon-unknown{-webkit-mask-image:url(/static/media/unknown.7fd13a7673ebf93f625c.svg);mask-image:url(/static/media/unknown.7fd13a7673ebf93f625c.svg)}.icon.icon-warning{-webkit-mask-image:url(/static/media/warning.334964ef472eac4cfb78.svg);mask-image:url(/static/media/warning.334964ef472eac4cfb78.svg)}.icon.icon-webview{-webkit-mask-image:url(/static/media/webview.7d9bf32041e0c57240b5.svg);mask-image:url(/static/media/webview.7d9bf32041e0c57240b5.svg)}.icon.icon-yes{-webkit-mask-image:url(/static/media/yes.70caad81ca5e3d9f7576.svg);mask-image:url(/static/media/yes.70caad81ca5e3d9f7576.svg)}.icon.icon-yes-circle{-webkit-mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg);mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg)}.button,button{-webkit-appearance:none;appearance:none;background:none;border:none}.button{--button-bg:var(--button-primary-default);--button-border-color:var(--button-primary-default);--button-focus-effect:var(--focus-effect);--button-height:var(--form-elem-height,2rem);--button-color:var(--background-primary);--button-font:var(--type-emphasis-m);--button-padding:.5rem;--button-radius:var(--elem-radius,0.25rem);border-radius:var(--button-radius);cursor:pointer;display:inline-block;padding:0;text-decoration:none}.button-wrap{align-items:center;background-color:var(--button-bg);border:1px solid var(--button-border-color);border-radius:var(--button-radius);color:var(--button-color);display:flex;font:var(--button-font);gap:.25rem;height:var(--button-height);justify-content:center;padding-left:var(--button-padding);padding-right:var(--button-padding);position:relative}.button .icon{background-color:var(--button-color);margin:0 -1px}.button.hover,.button:hover{--button-bg:var(--button-primary-hover);--button-border-color:var(--button-bg)}.button.active,.button:active{--button-bg:var(--button-primary-active)}.button.focus,.button:focus{outline:none}.button.focus .button-wrap,.button:focus .button-wrap{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--button-focus-effect)}.button.button.inactive,.button.button[disabled]{cursor:default;opacity:.65}.button.button.inactive:hover,.button.button[disabled]:hover{--button-bg:inherit;--button-border-color:transparent}.button.small,.button.small .button-wrap{--button-height:1.75rem;--button-padding:.25rem}.button.secondary{--button-bg:var(--button-secondary-default);--button-border-color:var(--border-primary);--button-color:var(--text-secondary)}.button.secondary:hover{--button-bg:var(--button-secondary-hover)}.button.secondary:active{--button-bg:var(--button-secondary-active)}.button.secondary:focus{--button-border-color:var(--button-secondary-border-focus)}.button.action{--button-bg:transparent;--button-border-color:var(--button-bg);--button-color:var(--text-secondary);--button-font:var(--type-label-s)}.button.action.has-icon{--button-font:var(--type-emphasis-m);text-transform:none}.button.action:hover{--button-bg:var(--button-secondary-hover)}.button.action:active{--button-bg:var(--button-secondary-active)}.button.action:focus{--button-border-color:var(--button-secondary-border-focus)}.button.action .button-wrap{text-transform:uppercase}.button.action.highlight{--button-color:var(--button-primary-default)}.button.select{--button-bg:var(--background-primary);--button-border-color:var(--border-primary);--button-color:var(--text-secondary);-webkit-appearance:none;appearance:none;background:none;border:none;padding:0;text-decoration:none}.button.select .button-wrap{box-shadow:var(--shadow-01);padding-right:26px;position:relative}.button.select .button-wrap:after{background-color:var(--icon-primary);content:"";display:block;height:16px;-webkit-mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);-webkit-mask-size:cover;mask-size:cover;position:absolute;right:.5rem;top:calc(50% - .5rem);width:16px}.header-search{max-width:100%}.header-search .search-widget{margin:0 auto;max-width:20rem;position:relative;width:100%}@media screen and (min-width:769px){.header-search .search-widget{align-items:center;display:flex;gap:.5rem}}.header-search .search-input-field{-webkit-appearance:none;background-color:var(--background-primary);border:1px solid var(--border-primary);border-radius:100px;caret-color:var(--text-link);color:var(--text-primary);height:var(--form-elem-height);min-width:5rem;padding-left:1rem;padding-right:2rem;width:100%}@-webkit-keyframes blink{0%,to{-webkit-text-decoration-line:none;text-decoration-line:none}50%{-webkit-text-decoration-line:underline;text-decoration-line:underline}}@keyframes blink{0%,to{-webkit-text-decoration-line:none;text-decoration-line:none}50%{-webkit-text-decoration-line:underline;text-decoration-line:underline}}@media screen and (min-width:992px){.header-search .search-input-field:invalid{width:1rem}}.header-search .search-input-field:focus,.header-search .search-input-field:valid{width:inherit}.header-search .search-input-field:invalid::-webkit-input-placeholder{-webkit-animation:blink 2s step-end infinite;animation:blink 2s step-end infinite;caret-color:transparent}.header-search .search-input-field:invalid,.header-search .search-input-field:invalid::placeholder{-webkit-animation:blink 2s step-end infinite;animation:blink 2s step-end infinite;caret-color:transparent}@media(prefers-reduced-motion:reduce){.header-search .search-input-field:invalid::-webkit-input-placeholder{caret-color:auto}.header-search .search-input-field:invalid,.header-search .search-input-field:invalid::placeholder{caret-color:auto}}.header-search .search-input-field:valid::-webkit-input-placeholder{-webkit-animation:none;animation:none}.header-search .search-input-field:valid,.header-search .search-input-field:valid::placeholder{-webkit-animation:none;animation:none}.header-search .search-input-field:not(:focus):valid::-webkit-input-placeholder{-webkit-text-decoration-line:none;text-decoration-line:none}.header-search .search-input-field:not(:focus):valid,.header-search .search-input-field:not(:focus):valid::placeholder{-webkit-text-decoration-line:none;text-decoration-line:none}.header-search .search-input-field:not(:focus),.header-search .search-input-field:not(:focus)::placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:not(:focus)::-webkit-input-placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:not(:focus)::placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:focus{border-color:var(--category-color);box-shadow:0 0 0 3px var(--blend-color),0 0 0 3px var(--category-color);outline:0 none}.header-search .search-input-field::-webkit-input-placeholder{font:var(--type-body-l);opacity:1;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.header-search .search-input-field,.header-search .search-input-field::placeholder{font:var(--type-body-l);opacity:1;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.header-search .server-error{color:var(--icon-critical);margin:0}.header-search .search-results,.homepage-hero-search .search-results{border:1px solid var(--border-secondary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);left:0;position:absolute;top:42px;width:100%;z-index:var(--z-index-search-results)}.header-search .search-results,.header-search .search-results a[href],.header-search .search-results mark,.homepage-hero-search .search-results,.homepage-hero-search .search-results a[href],.homepage-hero-search .search-results mark{color:var(--text-primary)}.header-search .search-results .indexing-warning,.homepage-hero-search .search-results .indexing-warning{color:var(--icon-warning)}.header-search .search-results .nothing-found,.homepage-hero-search .search-results .nothing-found{font-style:italic}.header-search .search-results .result-item,.homepage-hero-search .search-results .result-item{background:var(--background-secondary);border-bottom:1px solid var(--border-secondary);font-size:var(--type-smaller-font-size);word-break:break-word}.header-search .search-results .result-item:first-child,.homepage-hero-search .search-results .result-item:first-child{border-radius:var(--elem-radius) var(--elem-radius) 0 0}.header-search .search-results .result-item:last-child,.homepage-hero-search .search-results .result-item:last-child{border-radius:0 0 var(--elem-radius) var(--elem-radius)}.header-search .search-results .result-item.nothing-found code,.homepage-hero-search .search-results .result-item.nothing-found code{font-size:.8125rem}.header-search .search-results .result-item a,.homepage-hero-search .search-results .result-item a{display:block;padding:.5rem}.header-search .search-results .result-item.highlight,.header-search .search-results .result-item:hover,.homepage-hero-search .search-results .result-item.highlight,.homepage-hero-search .search-results .result-item:hover{background-color:var(--border-secondary)}.header-search .search-results .result-item.qs-collection b:after,.homepage-hero-search .search-results .result-item.qs-collection b:after{border:1px solid var(--text-primary-red);border-radius:.5rem;content:"collection";font-size:.5rem;line-height:.5rem;margin-bottom:.5rem;margin-left:.5rem;padding:.125rem;vertical-align:super}.header-search .search-results .result-item:focus,.header-search .search-results .result-item:hover,.homepage-hero-search .search-results .result-item:focus,.homepage-hero-search .search-results .result-item:hover{cursor:pointer}.header-search .search-results div:last-child,.homepage-hero-search .search-results div:last-child{border-bottom:0}.header-search .search-results mark,.homepage-hero-search .search-results mark{background-color:var(--mark-color)}.header-search .search-results small,.homepage-hero-search .search-results small{overflow-wrap:break-word}.header-search .search-results a,.homepage-hero-search .search-results a{text-overflow:ellipsis}.header-search .search-results div.searchindex-error,.homepage-hero-search .search-results div.searchindex-error{color:var(--icon-critical)}.search-form{display:flex;position:relative}.button.clear-search-button,.button.search-button{--button-color:var(--icon-secondary);--button-height:1.5rem;--button-padding:0;position:absolute;right:.75rem;top:.25rem;width:1.5rem}.button.clear-search-button:hover,.button.search-button:hover{background:transparent}@media screen and (min-width:769px){.button.clear-search-button,.button.search-button{right:1.2rem;width:1.5rem}}.button.clear-search-button{display:none}.header-search .search-input-field:focus~.button.clear-search-button,.header-search .search-input-field:valid~.button.clear-search-button{display:block;right:2.8rem}.mandala-container{--mandala-primary:#4e4e4e;--mandala-accent-1:var(--html-accent-color);--mandala-accent-2:var(--http-accent-color);--mandala-accent-3:var(--js-accent-color);--mandala-accent-4:#b3b3b3;display:flex;justify-content:center}.mandala-container .mandala-rotate>svg{-webkit-animation:rotation 500s linear infinite;animation:rotation 500s linear infinite}.mandala-container svg{font-size:1.5rem;font-weight:300;-webkit-user-select:none;user-select:none}.mandala-container svg>text{fill:var(--mandala-primary)}.mandala-container .mandala-accent-1{font-size:1.5rem}.mandala-container .mandala-accent-2{font-size:1.3rem}.mandala-container .mandala-accent-3{font-size:1.2rem}.mandala-container .mandala-accent-4{font-size:1.1rem}.mandala-container .mandala-accent-5{font-size:1rem}.mandala-container.animate-colors svg>text>textPath>tspan{-webkit-animation:mandala-color-change 50s infinite;animation:mandala-color-change 50s infinite;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;fill:var(--mandala-primary)}.mandala-container.animate-colors .mandala-accent-1>textPath>tspan{fill:var(--mandala-accent-1);-webkit-animation-delay:-15s;animation-delay:-15s}.mandala-container.animate-colors .mandala-accent-2>textPath>tspan{fill:var(--mandala-accent-2);-webkit-animation-delay:-20s;animation-delay:-20s}.mandala-container.animate-colors .mandala-accent-3>textPath>tspan{fill:var(--mandala-accent-3);-webkit-animation-delay:-30s;animation-delay:-30s}.mandala-container.animate-colors .mandala-accent-5>textPath>tspan{fill:var(--mandala-accent-4);-webkit-animation-delay:-40s;animation-delay:-40s}@-webkit-keyframes rotation{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotation{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes mandala-color-change{0%{fill:var(--mandala-primary)}10%{fill:var(--mandala-primary)}15%{fill:var(--mandala-accent-1)}20%{fill:var(--mandala-primary)}25%{fill:var(--mandala-primary)}30%{fill:var(--mandala-accent-2)}35%{fill:var(--mandala-primary)}40%{fill:var(--mandala-primary)}50%{fill:var(--mandala-accent-3)}55%{fill:var(--mandala-primary)}60%{fill:var(--mandala-primary)}65%{fill:var(--mandala-accent-4)}70%{fill:var(--mandala-primary)}to{fill:var(--mandala-primary)}}@keyframes mandala-color-change{0%{fill:var(--mandala-primary)}10%{fill:var(--mandala-primary)}15%{fill:var(--mandala-accent-1)}20%{fill:var(--mandala-primary)}25%{fill:var(--mandala-primary)}30%{fill:var(--mandala-accent-2)}35%{fill:var(--mandala-primary)}40%{fill:var(--mandala-primary)}50%{fill:var(--mandala-accent-3)}55%{fill:var(--mandala-primary)}60%{fill:var(--mandala-primary)}65%{fill:var(--mandala-accent-4)}70%{fill:var(--mandala-primary)}to{fill:var(--mandala-primary)}}.featured-articles{align-items:flex-start;display:flex;flex-direction:column;gap:1rem;padding:0 1rem}.featured-articles h2{font:var(--type-heading-h4);margin-top:0}.featured-articles .tile-container{grid-gap:1rem;display:grid;gap:1rem;grid-auto-flow:row;max-width:52rem}@media screen and (min-width:769px){.featured-articles .tile-container{grid-template-columns:repeat(2,1fr)}}.featured-articles .article-tile{border:1px solid var(--border-primary);border-radius:.5rem;display:flex;flex-direction:column;padding:1rem}.featured-articles .article-tile:hover{box-shadow:var(--shadow-02)}.featured-articles .article-tile .tile-tag{color:var(--text-primary);font-weight:500}.featured-articles .article-tile .tile-tag:hover{text-decoration:underline}.featured-articles .article-tile .tile-title{align-items:flex-end;display:flex;flex-grow:1;font:var(--type-heading-h5);font-weight:500;line-height:var(--intermediate-line-height);margin:0 0 1rem}.featured-articles .article-tile .tile-title a{color:var(--text-primary)}.featured-articles .article-tile .tile-title a:focus,.featured-articles .article-tile .tile-title a:hover{text-decoration:underline}.featured-articles .article-tile p{font:var(--type-smaller-font-size);line-height:var(--base-line-height);margin:0;max-height:calc(3em*var(--base-line-height));overflow:hidden;position:relative}.featured-articles .article-tile p:after{background:linear-gradient(to right,transparent,var(--background-primary) 75%);content:"";display:block;height:calc(1em*var(--base-line-height));pointer-events:none;position:absolute;right:0;top:calc(2em*var(--base-line-height));width:20ch}.featured-articles .article-tile p:dir(rtl):after{background:linear-gradient(to left,transparent,var(--background-primary) 75%);left:0;right:auto}@media screen and (min-width:769px){.featured-articles .article-tile p{min-height:calc(3em*var(--base-line-height))}}.latest-news{display:flex;flex-direction:column;gap:1rem;max-width:52rem;padding:0 1rem;width:100%}@media screen and (min-width:1200px){.latest-news{padding:0}}.latest-news h2{font:var(--type-heading-h4);margin-top:1rem}.latest-news h5{margin:0}.latest-news .news-item{display:flex;flex-direction:column;justify-content:space-between;padding:.7rem}@media screen and (min-width:769px){.latest-news .news-item{flex-direction:revert}}.latest-news .news-item:nth-child(odd){background:var(--background-secondary);border-radius:var(--elem-radius)}.latest-news .news-item .news-date{align-items:center;display:flex;font-size:12px;line-height:175%}.latest-news .news-title{display:flex;flex-direction:column;gap:.125rem;line-height:var(--base-line-height);margin:0}.latest-news .news-title a{color:var(--text-primary)}.latest-news .news-title a:hover{color:var(--text-primary);text-decoration:underline}.latest-news .news-title .news-source{color:var(--text-secondary);font-size:var(--type-tiny-font-size)}.recent-contributions{display:flex;flex-direction:column;gap:1rem;max-width:52rem;padding:0 1rem;width:100%}@media screen and (min-width:1200px){.recent-contributions{padding:0}}.recent-contributions h2{font:var(--type-heading-h4);margin-top:1rem}.recent-contributions h5{margin:0}.recent-contributions .request-item{display:flex;flex-direction:column;justify-content:space-between;padding:.7rem}@media screen and (min-width:769px){.recent-contributions .request-item{flex-direction:revert}}.recent-contributions .request-item:nth-child(odd){background:var(--background-secondary);border-radius:var(--elem-radius)}.recent-contributions .request-item .request-date{align-items:center;display:flex;font-size:12px;line-height:175%}.recent-contributions .request-title{display:flex;flex-direction:column;gap:.125rem;line-height:var(--base-line-height);margin:0}.recent-contributions .request-title a{color:var(--text-primary)}.recent-contributions .request-title a:hover{color:var(--text-primary);text-decoration:underline}.recent-contributions .request-title .request-repo{color:var(--text-secondary);font-size:var(--type-tiny-font-size)}.contributor-spotlight{align-items:center;color:var(--text-primary);display:flex;flex-direction:column;padding:2rem 1rem;position:relative;width:100%}.contributor-spotlight blockquote{border:0;display:flex;font-style:italic;margin:0;padding:0}.contributor-spotlight blockquote .icon{margin-right:.5rem;margin-top:.25rem}.contributor-spotlight h4{font-family:var(--font-body);font-size:var(--type-smaller-font-size)}.contributor-spotlight .text-col{align-items:center;border-radius:.3rem;display:flex;flex-direction:column;gap:1rem;max-width:52rem;width:100%}.contributor-spotlight .text-col h3{font-size:var(--type-heading-h5-font-size)}.contributor-spotlight .spotlight-cta{--button-bg:var(--text-link);--button-border-color:#1b1b1b;--button-color:var(--mdn-color-black);--button-radius:10rem;--button-padding:1rem;--button-primary-hover:#696969;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.contributor-spotlight .wrapper{align-items:center;display:flex;flex-direction:column;gap:2rem;max-width:52rem;padding:2rem 1rem;width:100%}.contributor-spotlight .contributor-graphic{align-items:center;display:flex;justify-content:center;width:50%;word-break:break-word}.contributor-spotlight .contributor-graphic img{height:-webkit-max-content;height:max-content;max-width:90%}.contributor-spotlight .contributor-name{background-color:var(--mdn-color-white);color:var(--mdn-color-black);font-size:1.5rem;font-weight:650;line-height:1.4;text-transform:uppercase;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.contributor-spotlight .contributor-name:after,.contributor-spotlight .contributor-name:before{content:" "}.contributor-spotlight .contributor-name:link,.contributor-spotlight .contributor-name:visited{color:var(--mdn-color-black);text-decoration:none}.contributor-spotlight .contributor-name:focus,.contributor-spotlight .contributor-name:hover{text-decoration:underline}@media screen and (min-width:769px){.contributor-spotlight .wrapper{align-items:normal;flex-direction:row}.contributor-spotlight .text-col{align-items:normal;text-align:left}}.contributor-spotlight .mandala-container{--mandala-primary:var(--border-primary);background:rgba(1,1,1,.9);height:100%;overflow:hidden;position:absolute;top:0;width:100%;z-index:-1}.contributor-spotlight .mandala-container .mandala-translate{-webkit-transform:translate(-5rem);transform:translate(-5rem)}@-webkit-keyframes slow-pulse{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes slow-pulse{0%{opacity:0}50%{opacity:1}to{opacity:0}}.generic-loading{align-items:center;-webkit-animation:slow-pulse 2s infinite normal;animation:slow-pulse 2s infinite normal;-webkit-animation-delay:1s;animation-delay:1s;display:flex;justify-content:center;width:100%}.bc-table{border:1px solid var(--border-primary);border-collapse:separate;border-radius:var(--elem-radius);border-spacing:0;margin:1rem 0;width:100%}.bc-table td,.bc-table th{border-width:1px;border-bottom:1px solid var(--border-secondary);border-left:1px solid var(--border-secondary);border-right:0 solid var(--border-secondary);border-top:0 solid var(--border-secondary);font-weight:500;padding:0}@media screen and (min-width:769px){.bc-table td,.bc-table th{padding:.4rem}.bc-table td,.bc-table td code,.bc-table th,.bc-table th code{font-size:var(--type-smaller-font-size)}}.bc-table th{padding:.4rem}.bc-table tbody tr{height:3rem}@media screen and (min-width:769px){.bc-table tbody tr:last-child td,.bc-table tbody tr:last-child th{border-bottom-width:0}}.bc-table tbody tr th{border-left-width:0;vertical-align:middle}.bc-table tbody .bc-support{vertical-align:top}.bc-table tbody .bc-support button{cursor:pointer;width:100%}.bc-table tbody .bc-support.bc-supports-no>button>span{color:var(--text-primary-red)}.bc-table tbody .bc-support.bc-supports-partial>button>span{color:var(--text-primary-yellow)}.bc-table tbody .bc-support.bc-supports-preview>button>span{color:var(--text-primary-blue)}.bc-table tbody .bc-support.bc-supports-yes>button>span{color:var(--text-primary-green)}.bc-table tbody .bc-history td{border-left-width:0}.bc-table tbody .bc-history .icon.icon-removed-partial{-webkit-mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg);mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg)}.bc-table th{background:var(--background-tertiary);vertical-align:bottom}.bc-table .bc-supports{margin-bottom:1rem}.bc-table .bc-supports .icon-wrap{background:var(--background-primary)}.bc-table .bc-supports.bc-supports-removed-partial .bcd-cell-text-copy{color:var(--text-primary-yellow)}.bc-table .icon-wrap .bc-support-level{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px}.bc-table .bc-support>button>.icon-wrap{display:block}.bc-table .bc-support .icon.icon-removed-partial{background-color:var(--icon-critical);-webkit-mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg);mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg)}.bc-table .bc-support.bc-supports-removed-partial .bcd-cell-text-copy{color:var(--text-primary-red)}.bc-table .bc-feature-depth-2{border-left-width:8px}.bc-head-txt-label{left:calc(50% - .5rem);line-height:1;padding-top:.5rem;position:relative;-webkit-transform:rotate(180deg);transform:rotate(180deg);white-space:nowrap;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl}.bc-head-icon-symbol{margin-bottom:.3rem}.bc-support{text-align:center;vertical-align:middle}.bc-level-no{background-color:var(--icon-critical)}.bc-level-preview{background-color:var(--icon-information)}.bc-legend-items-container{display:flex;flex-wrap:wrap;font-size:var(--type-smaller-font-size);gap:1.5rem;margin-bottom:2rem}.bc-legend-tip{font-size:var(--type-smaller-font-size);font-style:italic;margin-bottom:1rem;margin-top:0}.bc-legend-item{align-items:center;display:flex;gap:.5rem}.bc-legend-item-dt{display:flex}.bc-legend-item-dt .icon{background-color:var(--icon-primary)}.bc-platforms{height:2rem}.bc-platforms th{text-align:center}.bc-platforms td{border:none}.bc-browsers th{text-align:center}.bc-browsers td{border-width:0 0 1px}.bc-notes-list{margin:.5rem 0;position:relative;text-align:left;width:100%}.bc-notes-list:before{background:var(--border-primary);content:"";height:calc(100% - .25rem);left:7px;margin-top:.25rem;position:absolute;width:2px;z-index:-1}.bc-notes-list .bc-notes-wrapper:last-child dd:last-child{position:relative}.bc-notes-list .bc-notes-wrapper:last-child dd:last-child:before{background:var(--background-primary);bottom:0;content:"";height:calc(100% - 6px);left:7px;position:absolute;width:2px;z-index:-1}.bc-notes-list .bc-level-yes.icon.icon-yes{background-color:var(--icon-success);-webkit-mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg);mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg)}.bc-notes-list .bc-supports-dd .icon{background:var(--border-primary);border:3px solid var(--background-primary);border-radius:50%;-webkit-mask-image:none;mask-image:none}.bc-notes-list .bc-version-label{display:inline}.bc-notes-list abbr{margin-right:4px}.bc-notes-list dd{margin-bottom:1rem;padding-left:1.5rem;text-indent:-1.5rem}.bc-notes-list dd:last-child{margin-bottom:2rem}.bc-notes-wrapper{color:var(--text-primary);margin-bottom:1rem}.bc-notes-wrapper:last-child{margin-bottom:0}dl.bc-notes-list dt.bc-supports{margin-top:1rem}dl.bc-notes-list dt.bc-supports:first-child{margin-top:0}dl.bc-notes-list dd.bc-supports-dd{margin-bottom:1rem}dl.bc-notes-list dd.bc-supports-dd:last-child{margin-bottom:0}.offscreen,.only-icon span{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px}.bc-table-row-header{align-items:baseline;display:inline-flex;width:100%}.bc-table-row-header code{overflow:hidden}.bc-table-row-header .left-side,.bc-table-row-header .right-side{overflow:hidden;white-space:pre}.bc-table-row-header .left-side{flex:0 1 auto;text-overflow:ellipsis}.bc-table-row-header .right-side{flex:1 0 auto}.bc-table-row-header .bc-icons{display:flex;gap:.5rem;margin-top:.25rem}.bc-table-row-header .bc-icons .icon{background-color:var(--icon-secondary)}.bc-table-row-header .bc-icons .icon:hover{background-color:var(--icon-primary)}.bc-github-link{font:var(--type-smaller-font-size)}.main-page-content .bc-legend dd,.main-page-content .bc-legend dt{margin-bottom:0;margin-left:0;margin-top:0}.main-page-content .bc-supports-dd{margin:0}@media screen and (max-width:425px){thead{display:none}td.bc-support{border-left-width:0;display:block}.bc-feature,.bc-history>td,.bc-support>button{align-content:center;display:flex;flex-wrap:wrap;gap:.5rem}.bc-history-desktop{display:none}.table-scroll{overflow-x:auto}}@media screen and (min-width:426px){.bc-table thead{display:table-header-group}.bc-table thead .bc-platforms th{vertical-align:revert}.bc-table td,.bc-table th{background:inherit;padding:.25rem;width:2rem}.bc-table td.bc-support{padding:0}.bc-table td.bc-support>button{padding:.25rem}.bc-table tr.bc-history-desktop{display:table-row}.table-scroll{margin:0 -3rem;overflow:auto;width:100vw}.table-scroll-inner{min-width:-webkit-max-content;min-width:max-content;padding:0 3rem;position:relative}.table-scroll-inner:after{bottom:0;content:"";height:10px;position:absolute;right:0;width:10px}.bc-browser-name,.bc-support-level{display:none}.bc-notes-list{margin-left:20%;width:auto}.bc-support .bc-support-level{display:none}.bc-support[aria-expanded=true]{position:relative}.bc-support[aria-expanded=true]:after{background:var(--text-primary);bottom:-1px;content:"";height:2px;left:0;position:absolute;width:100%}.bc-support[aria-expanded=true] .bc-history-mobile{display:none}.bc-has-history{cursor:pointer}.bc-has-history:hover{background:var(--background-secondary)}}@media screen and (min-width:769px){.table-scroll{width:calc(100% + 6rem)}.bc-table tbody th{width:20%}}@media screen and (min-width:1200px){.table-scroll{margin:0;width:100%}.table-scroll-inner{padding:0}}.bcd-cell-text-wrapper{display:flex;gap:.5rem}@media screen and (min-width:769px){.bcd-cell-text-wrapper{align-items:center;flex-direction:column}}.bcd-cell-text-copy{color:var(--text-primary);display:flex;gap:.5rem}.bc-supports-yes .bcd-cell-text-copy{color:var(--text-primary-green)}.bc-supports-no .bcd-cell-text-copy{color:var(--text-primary-red)}.bc-supports-partial .bcd-cell-text-copy{color:var(--text-primary-yellow)}.bcd-cell-icons{display:flex;gap:.5rem}@media screen and (min-width:769px){.bcd-cell-icons{display:block}}.bc-notes-wrapper .bcd-cell-text-wrapper{flex-direction:row}@media screen and (min-width:769px){.bc-table td{height:2rem}.bc-table td.bc-support>button{padding:.5rem .25rem}}.container{margin-left:auto;margin-right:auto;max-width:var(--max-width);padding-left:var(--gutter);padding-right:var(--gutter);width:100%}.logo{align-items:center;display:flex}.logo svg{height:1.5rem;margin-top:.3rem}.dark .logo-text,.high-contrast-black .logo-text{fill:#fff}.auth-container .signin-link{align-items:center;display:inline-flex;font-weight:var(--font-body-strong-weight);height:2rem;text-align:center}.auth-container .signin-link:link,.auth-container .signin-link:visited{color:var(--text-secondary)}.mdn-plus-subscribe-link{--button-padding:1rem;margin:0 auto;max-width:150px;text-align:center;white-space:nowrap}.auth-container{display:flex;flex-flow:column-reverse;font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);gap:.5rem;list-style:none;margin-bottom:.5rem;padding:0;text-align:center}@media screen and (min-width:992px){.auth-container{align-items:center;flex-flow:row;gap:1rem;justify-content:flex-end;margin:0;text-align:left;text-align:initial;width:-webkit-min-content;width:min-content}}@media screen and (min-width:820px){.auth-container{width:auto}}.submenu{background-color:var(--background-primary);list-style:none;margin:0;padding:0}.submenu li{width:100%}.submenu .submenu-item,.submenu a{align-items:center;border:1px solid transparent;color:var(--text-primary);display:flex;height:100%;padding:.5rem;width:100%}li:last-child .submenu .submenu-item:not(:focus),li:last-child .submenu a:not(:focus){border-bottom-color:transparent}.submenu .submenu-item:hover,.submenu a:hover{background-color:var(--border-secondary);text-decoration:none}.main-menu .submenu .submenu-item:hover,.main-menu .submenu a:hover{background-color:var(--background-secondary)}.submenu .submenu-item:focus,.submenu a:focus{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--button-focus-effect)}.submenu .submenu-item .icon,.submenu a .icon{margin-right:.5rem}@media screen and (min-width:992px){.submenu.inline-submenu-lg{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-02);max-width:25rem;padding:.5rem;position:absolute;top:calc(100% + 4px);width:-webkit-max-content;width:max-content;z-index:var(--z-index-mid)}.main-menu .submenu.inline-submenu-lg{background-color:var(--background-primary)}.submenu.inline-submenu-lg .submenu-item{border-radius:var(--elem-radius);padding:.75rem}.submenu.inline-submenu-lg:before{content:"";display:block;height:8px;left:0;position:absolute;top:-8px;width:100%}}@media screen and (min-width:769px){.submenu:not(.inline-submenu-lg){background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-02);max-width:25rem;padding:.5rem;position:absolute;top:calc(100% + 4px);width:-webkit-max-content;width:max-content;z-index:var(--z-index-mid)}.main-menu .submenu:not(.inline-submenu-lg){background-color:var(--background-primary)}.submenu:not(.inline-submenu-lg) .submenu-item{border-radius:var(--elem-radius);padding:.75rem}.submenu:not(.inline-submenu-lg):before{content:"";display:block;height:8px;left:0;position:absolute;top:-8px;width:100%}}.submenu-header{display:block;padding:1rem}.submenu-header .submenu-item{padding:0}.submenu-header .submenu-item:hover{background:none}@media screen and (min-width:769px){.submenu-header{border-bottom:1px solid var(--border-primary)}}.submenu-icon{background-color:var(--icon-primary);height:2rem;margin-right:.75rem;position:relative;width:.2rem}.submenu-item,.submenu-item-heading{font-size:var(--type-smaller-font-size)}@media screen and (min-width:769px){.submenu-item-heading:not(:only-child),.submenu-item:not(:only-child){font-weight:var(--font-body-strong-weight)}}.submenu-item-description{display:none}@media screen and (min-width:769px){.submenu-item-description{display:block;font-size:var(--type-tiny-font-size);margin:.25rem 0 0}}.submenu-item-subtext{font-weight:var(--font-body-strong-weight)}.submenu-item-dot~.submenu-content-container>.submenu-item-heading:after{background:var(--text-primary-blue);border:1px solid var(--background-primary);border-radius:2rem;content:"";display:inline-block;height:.5rem;margin-left:.5rem;width:.5rem}.active-menu-item{background-color:var(--background-primary);border-color:var(--border-secondary)}.guides .submenu .submenu-item-heading{font-size:var(--type-smaller-font-size);font-weight:400}.guides .desktop-only{display:none}@media screen and (min-width:992px){.guides .desktop-only{display:inherit}.guides .mobile-only{display:none}}.references .desktop-only{display:none}@media screen and (min-width:992px){.references .desktop-only{display:inherit}.references .mobile-only{display:none}}.html-link-container a:focus .submenu-icon.html,.html-link-container a:hover .submenu-icon.html{background:var(--html-accent-color)!important}.css-link-container a:focus .submenu-icon.css,.css-link-container a:hover .submenu-icon.css{background-color:var(--css-accent-color)!important}.javascript-link-container a:focus .submenu-icon.javascript,.javascript-link-container a:hover .submenu-icon.javascript{background-color:var(--js-accent-color)!important}.http-link-container a:focus .submenu-icon.http,.http-link-container a:hover .submenu-icon.http{background-color:var(--http-accent-color)!important}.apis-link-container a:focus .submenu-icon.apis,.apis-link-container a:hover .submenu-icon.apis{background-color:var(--apis-accent-color)!important}.learn-link-container a:focus .submenu-icon.learn,.learn-link-container a:hover .submenu-icon.learn{background-color:var(--learn-accent-color)!important}.submenu-icon.html{background-color:var(--html-accent-engage)}.submenu-icon.css{background-color:var(--css-accent-engage)}.submenu-icon.javascript{background-color:var(--js-accent-engage)}.submenu-icon.http{background-color:var(--http-accent-engage)}.submenu-icon.apis{background-color:var(--apis-accent-engage)}.submenu-icon.learn{background-color:var(--learn-accent-engage)}.mdn-plus .submenu-icon{background-color:var(--plus-accent-color)}.mdn-plus .note{background-color:var(--background-information)}.mdn-plus .note .submenu-item-description{display:block;margin:.125rem}@media screen and (min-width:992px){.mdn-plus .mobile-only{display:none}}ul.main-menu{grid-gap:1rem;box-sizing:border-box;list-style:none;margin-top:1rem;padding:0;width:100%}ul.main-menu.show{display:block}@media screen and (min-width:992px){ul.main-menu.show{display:flex}ul.main-menu{align-items:center;display:flex;justify-content:space-around;margin:0 auto 0 0;max-width:310px}}@media screen and (min-width:992px){ul.main-menu li:last-child{flex-basis:inherit}ul.main-menu .menu-toggle,ul.main-menu .submenu,ul.main-menu .submenu.show{display:none}}@media screen and (min-width:992px){ul.main-menu .top-level-entry-container:focus-within .submenu,ul.main-menu .top-level-entry-container:hover .submenu{display:block}.open-on-focus-within:focus-within .watch-submenu{display:flex}.open-on-focus-within:focus-within .submenu{display:block}.open-on-focus-within .submenu,.open-on-focus-within .watch-submenu{display:none}}.avatar,.avatar-wrap{border-radius:50%}.avatar-wrap{height:32px;margin-left:-7px;margin-right:.1rem;position:relative;width:32px}@media screen and (min-width:769px){.avatar{margin:initial}}.signout-form{padding:.5rem}@media screen and (min-width:769px){.signout-form{border-top:1px solid var(--border-primary)}}button.signout-button{width:100%}button.signout-button:focus,button.signout-button:hover{background-color:var(--background-secondary)}.user-menu{position:relative}.user-menu .submenu-header{display:none}.user-menu .button.user-menu-toggle .notification-dot~.avatar-wrap:after{background:var(--text-primary-blue);border:1px solid var(--background-primary);border-radius:2rem;bottom:0;content:"";height:.5rem;position:absolute;right:0;width:.5rem}@media screen and (max-width:992px){.user-menu .user-menu-toggle:hover{--button-bg:transparent}}@media screen and (min-width:992px){.user-menu .button.user-menu-toggle:focus,.user-menu .button.user-menu-toggle:focus .button-wrap,.user-menu .button.user-menu-toggle:hover,.user-menu .button.user-menu-toggle:hover .button-wrap{background:transparent;border-color:transparent;box-shadow:none}.user-menu .button.user-menu-toggle:focus .avatar{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--focus-effect)}.user-menu .button.user-menu-toggle:after{display:none}.user-menu .submenu-header{display:block;margin-bottom:.5rem;padding:0 0 .5rem}.user-menu .submenu-item{padding:.5rem}.user-menu .signout-container{margin-top:.5rem}.user-menu .user-menu-id{display:none}.user-menu .submenu{left:auto;max-width:-webkit-max-content;max-width:max-content;right:0}}.dropdown{position:relative}.dropdown-list{background:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);left:0;padding:.5rem;position:absolute;top:calc(100% + 2px);z-index:var(--z-index-low)}.dropdown.is-flush-right .dropdown-list{left:auto;right:0}.dropdown-item .button.action{width:100%}.dropdown-item .button.action .button-wrap{--button-font:var(--type-smaller-font-size);--button-bg:transparent;justify-content:flex-start;text-align:left;text-transform:none}.dropdown-item .button.action .button-wrap:hover{--button-bg:var(--button-secondary-hover)}.dropdown-item .button.action.active-menu-item{--button-bg:var(--background-primary);--button-border-color:var(--border-secondary)}.top-navigation-main{display:none;justify-content:space-between;padding:0;width:100%}.show-nav .top-navigation-main{display:flex;flex-direction:column}.top-navigation-main .auth-container{order:0}.top-navigation-main .header-search{order:1}.top-navigation-main .main-nav{order:2}.top-navigation-main .notifications-menu{order:3}.top-navigation-main .user-menu{order:4}.top-navigation-main .top-level-entry-container{position:relative}.top-navigation-main .top-level-entry-container .submenu{z-index:var(--z-index-nav-menu)}.top-navigation-main .theme-toggle{align-self:end;margin-bottom:1.5rem}@media screen and (min-width:992px){.top-navigation-main .theme-toggle{align-self:auto;margin-bottom:0}}.top-navigation-main .button.action:hover{--button-bg:var(--border-secondary)}.is-transparent .top-navigation-main .button.action:not(:focus):hover{--button-border-color:transparent}.is-transparent .top-navigation-main .button.action:hover{--button-bg:var(--accent-primary-engage)}.top-navigation-main .button.action.search-button:hover{--button-bg:transparent}.top-navigation-main .top-level-entry{background:none;border-top:1px solid var(--border-secondary);color:var(--text-secondary);cursor:pointer;display:block;padding:1rem .5rem;text-align:left;width:100%}.top-navigation-main .top-level-entry:link,.top-navigation-main .top-level-entry:visited{color:var(--text-secondary)}.top-navigation-main .top-level-entry.menu-toggle{min-height:53px;padding:.5rem}@media screen and (max-width:992px){.top-navigation-main .top-level-entry.button{--button-color:var(--text-secondary);--button-padding:0;--button-radius:0}.top-navigation-main .top-level-entry.button .button-wrap{background:none;border:none;gap:.5rem;justify-content:flex-start;padding:0;text-transform:none}.top-navigation-main .top-level-entry.button:focus{--button-focus-effect:none}}@media screen and (min-width:992px){.top-navigation-main .top-level-entry{border-radius:var(--elem-radius);border-top:none;padding:.5rem}.top-navigation-main .top-level-entry:focus,.top-navigation-main .top-level-entry:hover{background-color:var(--category-color-background);color:var(--category-color);text-decoration:none}.top-navigation-main .top-level-entry.button{padding:0}}.top-navigation-main .menu-toggle{align-items:center;display:flex;justify-content:space-between;position:relative}.top-navigation-main .menu-toggle:after{background-color:var(--icon-primary);content:"";height:var(--icon-size);margin-left:.2em;margin-top:.2em;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);width:var(--icon-size)}.top-navigation-main .menu-toggle[aria-expanded=true]:after{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.top-navigation-main .menu-toggle+.top-level-entry{display:none}@media screen and (min-width:992px){.top-navigation-main{align-items:center;display:flex;flex:1 1;flex-direction:row;gap:.5rem;left:inherit;padding:0;position:static;top:inherit;z-index:inherit}.show-nav .top-navigation-main{flex-direction:row}.top-navigation-main .main-nav{order:0}.top-navigation-main .header-search{order:1}.top-navigation-main .notifications-menu{order:2}.top-navigation-main .auth-container{order:3}.top-navigation-main .user-menu{order:4}.top-navigation-main .main-nav{margin-right:auto;width:-webkit-max-content;width:max-content}.top-navigation-main .menu-toggle+.top-level-entry{display:inline-flex}}.theme-switcher-menu{margin-bottom:.5rem}.theme-switcher-menu .button.action>.button-wrap{text-transform:none}.theme-switcher-menu .themes-menu .button.button{--button-bg:transparent;--button-border-color:var(--button-bg);--button-color:var(--text-primary);border-bottom-width:0;font-size:var(--type-smaller-font-size);width:100%}.theme-switcher-menu .themes-menu .button.button .button-wrap{border-width:1px;font-weight:400;justify-content:flex-start;padding:1rem}.theme-switcher-menu .themes-menu .button.button:focus{--button-border-color:var(--button-secondary-border-focus)}.theme-switcher-menu .themes-menu .button.button:hover{--button-bg:var(--border-secondary)}.theme-switcher-menu .active-menu-item .button-wrap,.theme-switcher-menu .active-menu-item:hover .button-wrap{--button-bg:var(--background-primary);--button-border-color:var(--border-secondary)}.theme-switcher-menu .active-menu-item:focus .button-wrap{--button-border-color:var(--button-secondary-border-focus)}@media screen and (min-width:769px){.theme-switcher-menu{border-bottom:0;margin-bottom:0}.theme-switcher-menu .themes-menu{top:calc(100% - 1rem)}.theme-switcher-menu .themes-menu.show{display:flex;flex-direction:column;gap:.5rem;max-width:-webkit-max-content;max-width:max-content;min-width:130px}.theme-switcher-menu .themes-menu .submenu-item{padding:.5rem 1rem}}.languages-switcher-menu>.button .button-wrap:after,.theme-switcher-menu>.button .button-wrap:after{background-color:var(--icon-secondary);content:"";display:block;height:16px;margin-left:auto;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);-webkit-mask-size:16px;mask-size:16px;width:16px}.languages-switcher-menu>.button[aria-expanded=true] .button-wrap:after,.theme-switcher-menu>.button[aria-expanded=true] .button-wrap:after{-webkit-transform:rotate(180deg);transform:rotate(180deg)}@media screen and (min-width:992px){.languages-switcher-menu>.button .button-wrap:after,.theme-switcher-menu>.button .button-wrap:after{content:normal}}.maintenance{color:var(--text-primary);cursor:help;flex-flow:column}.maintenance .maintenance-info-container{cursor:default;display:block;margin:0 1rem;top:2rem}@media screen and (min-width:992px){.maintenance .maintenance-info-container{padding-top:1rem;position:absolute}}.maintenance .maintenance-info-container .maintenance-info{background-color:var(--background-primary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);font-weight:400;padding:1rem}@media screen and (min-width:992px){.maintenance:not(:focus-within):not(:hover) .maintenance-info-container{clip:rect(1px,1px,1px,1px)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}}.top-navigation{background-color:var(--background-primary);border-bottom:1px solid var(--border-primary);position:relative;width:100%;z-index:100}.top-navigation .container{align-items:center;background-color:var(--background-primary);display:flex;flex-flow:row wrap;gap:var(--gutter)}@media screen and (min-width:769px){.top-navigation .container{background-color:transparent}}.top-navigation.is-transparent{background-color:transparent}.top-navigation .top-navigation-wrap{align-items:center;display:flex;flex:1 1;height:var(--top-nav-height);justify-content:space-between}.top-navigation.show-nav{box-shadow:0 0 10px 0 rgba(0,0,0,.2);z-index:var(--z-index-top)}.top-navigation.show-nav .container{height:auto}@media screen and (min-width:992px){.main-menu-toggle{display:none}.top-navigation .top-navigation-wrap{flex:0 1}}.breadcrumbs-container{align-items:center;display:flex;margin-right:auto}.breadcrumbs-container ol{line-height:1.2}.breadcrumbs-container li{display:none;-webkit-hyphens:auto;hyphens:auto}.breadcrumbs-container li:first-child,.breadcrumbs-container li:last-child{display:inline-flex}.breadcrumbs-container li .breadcrumb:after{background-color:var(--icon-secondary);content:"";display:block;flex-shrink:0;height:12px;margin-right:.5rem;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);-webkit-mask-size:12px;mask-size:12px;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);width:12px}.breadcrumbs-container li a{align-items:center;display:flex}.breadcrumbs-container li a:link,.breadcrumbs-container li a:visited{color:var(--text-secondary)}.breadcrumbs-container li a:hover{text-decoration:underline}.breadcrumbs-container li a:focus-visible{outline:0}.breadcrumbs-container li a:focus-visible [property=name]{outline-color:var(--accent-primary);outline-offset:1px;outline-style:auto}.breadcrumbs-container li [property=name]{display:inline-block;margin-right:.5rem}@media screen and (min-width:1200px){.breadcrumbs-container li{display:inline-flex}}.watch-menu-item{background-color:transparent;border-bottom:1px solid var(--border-primary);color:var(--text-primary);cursor:pointer;padding:0}.watch-menu-item:first-of-type{border-top-width:0}.watch-menu-item-inner{grid-gap:.5rem;display:grid;gap:.5rem;grid-template-areas:"status label""status text";grid-template-columns:16px 1fr;padding:.8125rem var(--gutter-padding);text-align:left}.watch-menu-item:focus .watch-menu-item-inner{box-shadow:var(--focus-effect);outline:1px solid var(--button-secondary-border-focus)}.watch-menu-item:hover .watch-menu-item-inner{background-color:var(--border-secondary)}.watch-menu-item-status{grid-area:status}.watch-menu-item-label{font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);grid-area:label}.watch-menu-item-text{font-size:var(--type-smaller-font-size);grid-area:text}.toast{--toast-bg:var(--text-primary);--toast-color:var(--background-primary);background:var(--toast-bg);border-radius:var(--elem-radius);bottom:1rem;box-shadow:var(--shadow-02);display:flex;gap:.5rem;left:50%;max-width:680px;padding:1rem 1rem 1rem 2rem;position:fixed;-webkit-transform:translate(-50%);transform:translate(-50%);width:90vw}.toast-content{color:var(--toast-color);margin-right:auto}.toast .button.action{--button-color:var(--toast-color);white-space:nowrap}.toast .button.action:hover{--button-bg:rgba(58,57,68,.3);--button-border-color:transparent}.toast.is-important{--toast-bg:var(--accent-secondary);--toast-color:#fff}.toast-verbose-text{display:none}@media screen and (min-width:769px){.toast-verbose-text{display:inline}.toast-short-text{display:none}}.languages-switcher-menu.open-on-focus-within .submenu{display:block}.language-menu .submenu-item{padding:.5rem}@media(min-width:769px){.language-menu{right:0}}.article-actions{margin-left:auto}.article-actions .article-actions-dialog-heading{display:none}.article-actions .button.action .button-wrap{text-transform:none}@media screen and (min-width:769px){.article-actions{display:block}}.article-actions .article-actions-submenu{--gutter-padding:1rem;display:none;overflow:scroll}.article-actions .article-actions-submenu.show{background:var(--background-primary);bottom:0;display:flex;flex-direction:column;left:0;position:fixed;right:0;top:var(--top-navigation-height);z-index:var(--z-index-mid)}.article-actions .article-actions-submenu .header{border-bottom:1px solid var(--border-primary);color:var(--text-primary);display:block;font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);margin:0;padding:1rem;text-align:left;width:100%}.article-actions .article-actions-submenu .header .header-inner{align-items:center;display:flex;gap:.5rem;position:relative}.article-actions .article-actions-submenu .header .icon{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.article-actions .article-actions-submenu .header.desktop-only{display:none}.article-actions .article-actions-submenu .mdn-form-item,.article-actions .article-actions-submenu p{margin:0;padding:1rem 1rem 0}.article-actions .article-actions-submenu .mdn-form-item:last-child,.article-actions .article-actions-submenu p:last-child{padding-bottom:1rem}@media screen and (min-width:769px){.article-actions .article-actions-submenu.show{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);bottom:auto;box-shadow:var(--shadow-02);left:auto;padding:0;position:absolute;right:0;top:calc(100% + 6px);width:316px;z-index:var(--z-index-mid)}.article-actions .article-actions-submenu .header{display:block;padding:1rem var(--gutter-padding);text-align:center}.article-actions .article-actions-submenu .header-inner{justify-content:center}.article-actions .article-actions-submenu .header.desktop-only{display:block}.article-actions .article-actions-submenu .header.mobile-only{display:none}.article-actions .article-actions-submenu .header .icon{left:0;position:absolute}}.article-actions-entries{display:none;list-style:none;margin:0;padding:0}@media screen and (min-width:769px){.article-actions-entries{display:flex;gap:.5rem}.article-actions-entries .sidebar-toggle{display:none}}.article-actions-entry{align-items:center;display:flex;position:relative}@media screen and (max-width:769px){.article-actions.show-actions{-webkit-overflow-scrolling:touch;background-color:var(--background-primary);color:var(--text-primary);display:block;height:100vh;left:0;overflow:auto;position:fixed;top:var(--top-navigation-height);width:100vw;z-index:var(--z-index-low)}.article-actions.show-actions .article-actions-entries>li>.button,.article-actions.show-actions .article-actions-entries>li>div>.button,.article-actions.show-actions>.button{--button-radius:0;border-bottom:1px solid var(--border-secondary);width:100%}.article-actions.show-actions .article-actions-entries>li>.button .button-wrap,.article-actions.show-actions .article-actions-entries>li>div>.button .button-wrap,.article-actions.show-actions>.button .button-wrap{justify-content:flex-start;margin-top:1px;padding:1.5rem 1rem}.article-actions.show-actions .article-actions-dialog-heading{display:block}.article-actions.show-actions .article-actions-entries{display:block;padding:1rem}.article-actions.show-actions .article-action-entry,.article-actions.show-actions .article-actions-toggle{border-bottom:1px solid var(--border-secondary)}.article-actions.show-actions .article-actions-entry{display:block}}.article-actions-container{align-items:center;background-color:var(--background-secondary);border-bottom:1px solid var(--border-primary);margin:0;min-height:2rem;padding:0;position:-webkit-sticky;position:sticky;top:0;z-index:var(--z-index-low)}.article-actions-container .container{align-items:center;display:flex;gap:.5rem;justify-content:space-between}.article-actions-container .sidebar-button{display:none}@media screen and (max-width:769px){.article-actions-container .sidebar-button{align-items:center;align-self:stretch;display:flex;margin:0 0 0 -1rem}.article-actions-container .sidebar-button .button-wrap{border-radius:0;border-right:1px solid var(--border-primary)}}@media screen and (min-width:769px){.article-actions-container{position:static}.article-actions-container .article-actions-toggle{display:none}.article-actions-container .bookmark-button-container{flex:0 0 40px}}@media screen and (min-width:1441px){.article-actions-container .container{padding-left:1rem;padding-right:1rem}}@media screen and (max-width:769px){:root{--sticky-header-height:2rem}}.offline-status-bar{background-color:var(--accent-primary-engage);color:var(--text-primary);display:none}.offline-status-bar.is-offline,.offline-status-bar.is-online{display:block;padding:1rem;text-align:center}.offline-status-bar.is-online{-webkit-animation:fade-out 3s ease-out .5s;animation:fade-out 3s ease-out .5s}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.document-toc{margin-bottom:2rem;padding:0;position:relative}@media screen and (max-width:426px){.document-toc{padding:0 1rem}}.document-toc-heading.document-toc-heading{font:var(--type-heading-h5);letter-spacing:1.5px;margin:0 0 1rem}.document-toc-list.document-toc-list{font-size:var(--type-smaller-font-size);list-style:none;padding-left:0}.document-toc-list.document-toc-list li{margin:0}.document-toc-link.document-toc-link:not(.button){border-left:2px solid var(--border-secondary);color:var(--text-secondary);display:block;padding:.5rem 1rem;text-decoration:none}.document-toc-link.document-toc-link:not(.button):hover{color:var(--text-link)}.document-toc-link.document-toc-link:not(.button)[aria-current]:not([aria-current=""]):not([aria-current=false]){background-color:var(--background-toc-active);border-left:2px solid var(--category-color);color:var(--text-primary);font-weight:600}.document-toc-item-sub>.document-toc-link:not(.button){padding-left:2rem}.document-toc .show-toc{display:block}.sidebar{--offset:var(--main-document-header-height);--max-height:calc(100vh - var(--offset));color:var(--text-secondary)}.sidebar .backdrop{display:none}@media screen and (max-width:768px){.sidebar{height:100vh;left:0;max-height:100vh;position:fixed;right:0}.sidebar,.sidebar .sidebar-inner{-webkit-transform:translateX(-100%);transform:translateX(-100%);z-index:var(--z-index-top)}.sidebar .sidebar-inner{background:var(--background-primary);border-right:1px solid var(--border-primary);height:var(--max-height);max-height:var(--max-height);max-width:20rem;overflow:hidden;overflow:auto;padding:1rem;position:relative;transition:transform .2s linear;width:80vw;will-change:transform}.sidebar .backdrop{background:rgba(0,0,0,.3);border-radius:0;bottom:0;cursor:default;display:flex;left:0;opacity:0;position:fixed;right:0;top:0;transition:opacity .2s linear;width:100%;will-change:opacity;z-index:var(--z-index-mid)}.sidebar.is-animating,.sidebar.is-expanded,.sidebar.is-expanded .sidebar-inner{-webkit-transform:translateX(0);transform:translateX(0)}.sidebar.is-expanded .backdrop{opacity:1}}@media screen and (min-width:769px){.sidebar{display:flex;max-height:var(--max-height);overflow:auto;position:-webkit-sticky;position:sticky;top:var(--offset)}}.sidebar-heading{color:var(--text-primary);font:var(--type-heading-h5);letter-spacing:1.5px;margin:0}.sidebar em{background-color:var(--background-toc-active);border-left:2px solid var(--category-color);display:inline-block;font-style:normal;font-weight:600;padding:.25rem .25rem .25rem .5rem;width:100%}.sidebar a,.sidebar em{-webkit-hyphens:auto;hyphens:auto}.sidebar a{color:var(--text-secondary);display:inline-flex;padding:.25rem}.sidebar a:focus,.sidebar a:hover{text-decoration:underline}.sidebar .no-link{display:inline-flex;padding:.25rem}.sidebar strong{display:flex;font-size:var(--type-base-font-size-rem);margin-top:1rem}.sidebar ol{font-size:var(--type-smaller-font-size)}.sidebar ol ol,.sidebar ol ul{padding-left:.5rem}.sidebar ol ol li .icon{margin-right:.01em}.sidebar ol ol li.no-bullet{display:block;font-weight:var(--font-body-strong-weight);list-style-type:none}.sidebar .sidebar-heading~div>ol,.sidebar .sidebar-heading~ol{margin-top:1rem}.sidebar li,.sidebar summary{margin-bottom:.5rem}.sidebar code,.sidebar summary{font-size:var(--type-smaller-font-size)}.sidebar code{word-wrap:break-word;background-color:transparent;background-color:initial;border-radius:var(--elem-radius);font-family:var(--font-code);line-height:1.2;padding:.125rem;white-space:normal}.sidebar summary{cursor:pointer}.sidebar details{margin:.75rem 0}.sidebar details ol{padding-left:.75rem}.sidebar .icon{align-self:center;background-size:14px;height:14px;margin-right:-.25rem;-webkit-mask-size:14px;mask-size:14px;width:14px}.sidebar .icon-experimental,.sidebar .icon-nonstandard{background-color:var(--icon-information)}.sidebar .icon-deprecated{background-color:var(--icon-critical)}.main-content.standalone{margin:0 auto;max-width:var(--max-width);width:100%}.main-page-content .metadata{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);margin:2rem 0;padding:1rem}.main-page-content .metadata h3{font:var(--type-heading-h4);margin-top:.5rem;padding:0}.metadata-content-container{margin:0 auto;max-width:1440px;width:100%}.metadata-content-container .last-modified-date{margin-bottom:0}:root,body{--mdn-color-white:#fff;--mdn-color-black:#000;--mdn-color-dark-grey:#4e4e4e;--mdn-background-dark:#1b1b1b;--mdn-background-light:#fff;--mdn-background-light-grey:#e2e2e2;--color-announcement-banner-accent:#ff6d91}.light{--text-primary:#1b1b1b;--text-secondary:#4e4e4e;--text-inactive:#9e9e9ea6;--text-link:#0069c2;--text-invert:#fff;--background-primary:#fff;--background-secondary:#f9f9fb;--background-tertiary:#fff;--background-toc-active:#ebeaea;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#cdcdcd;--border-secondary:#cdcdcd;--button-primary-default:#1b1b1b;--button-primary-hover:#696969;--button-primary-active:#9e9e9e;--button-primary-inactive:#1b1b1b;--button-secondary-default:#fff;--button-secondary-hover:#cdcdcd;--button-secondary-active:#cdcdcd;--button-secondary-inactive:#f9f9fb;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#696969;--icon-secondary:#b3b3b3;--icon-information:#0085f2;--icon-warning:#ff2a51;--icon-critical:#d30038;--icon-success:#007936;--accent-primary:#0085f2;--accent-primary-engage:rgba(0,133,242,.1);--accent-secondary:#0085f2;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(43,42,51,.05);--shadow-02:0 1px 6px rgba(43,42,51,.1);--focus-01:0 0 0 3px rgba(0,144,237,.4);--field-focus-border:#0085f2;--code-token-tag:#0069c2;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#d30038;--code-token-attribute-value:#007936;--code-token-comment:#9e9e9e;--code-token-default:#1b1b1b;--code-token-selector:#872bff;--code-background-inline:#f2f1f1;--code-background-block:#f2f1f1;--notecard-link-color:#343434;--scrollbar-bg:transparent;--scrollbar-color:rgba(0,0,0,.25);--category-color:#0085f2;--category-color-background:#0085f210;--code-color:#5e9eff;--mark-color:#dce2f2;--plus-accent-color:#d30038;--html-accent-color:#d30038;--css-accent-color:#0069c2;--js-accent-color:#afa100;--http-accent-color:#007936;--apis-accent-color:#872bff;--learn-accent-color:#d00058;--plus-code-color:#0069c2;--html-code-color:#9e0027;--css-code-color:#0069c2;--js-code-color:#746a00;--http-code-color:#007936;--apis-code-color:#872bff;--learn-code-color:#d00058;--plus-mark-color:#ffd9dc;--html-mark-color:#ffd9dc;--css-mark-color:#dce2f2;--js-mark-color:#f0e498;--http-mark-color:#a9f3ba;--apis-mark-color:#e6deff;--learn-mark-color:#ffd9df;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,42,81,.7);--html-accent-engage:rgba(255,42,81,.7);--css-accent-engage:rgba(0,133,242,.7);--js-accent-engage:rgba(147,135,0,.7);--http-accent-engage:rgba(0,154,70,.7);--apis-accent-engage:rgba(155,101,255,.7);--learn-accent-engage:rgba(255,31,114,.7);--modal-backdrop-color:rgba(27,27,27,.1);--blend-color:#fff80;--text-primary-red:#d30038;--text-primary-green:#007936;--text-primary-blue:#0069c2;--text-primary-yellow:#746a00;color-scheme:light}.dark{--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#35bdb8;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}@media(prefers-color-scheme:light){:root:not(.light):not(.dark){--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#8cb4ff;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}}@media(prefers-color-scheme:dark){:root:not(.light):not(.dark){--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#8cb4ff;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}}.document-page .article-actions-container,.document-page .document-toc-container,.document-page .generic-loading,.document-page .main-content,.document-page .metadata,.document-page .page-header,.document-page .sidebar{display:flex}.document-page .main-content,.document-page .sidebar{flex-direction:column;width:100%}.main-wrapper{display:flex;margin:0 auto;max-width:var(--max-width)}.main-wrapper .toc{display:none}@media screen and (min-width:769px){.main-wrapper{grid-gap:3rem;display:grid;gap:3rem;padding-left:1.5rem;padding-right:3rem}.main-wrapper .main-content,.main-wrapper .sidebar,.main-wrapper .toc{padding-bottom:3rem;padding-top:3rem}.main-wrapper .sidebar{align-self:start;grid-area:sidebar}.main-wrapper .main-content{grid-area:main}}@media screen and (min-width:1200px){.main-wrapper{grid-gap:3rem;display:grid;gap:3rem;padding-left:1rem;padding-right:1rem}.main-wrapper .toc{--offset:var(--main-document-header-height);--max-height:calc(100vh - var(--offset));display:block;grid-area:toc;max-height:var(--max-height);overflow:auto;position:-webkit-sticky;position:sticky;top:var(--offset)}.main-wrapper .in-nav-toc{display:none}}.page-wrapper{grid-template-columns:100%}.standard-page{max-width:inherit}@font-face{font-display:swap;font-family:Inter;font-stretch:75% 100%;font-style:oblique 0 20deg;font-weight:1 999;src:url(/website/fonts/Inter.var.woff2) format("woff2 supports variations"),url(/website/fonts/Inter.var.woff2) format("woff2-variations")}:root{--sticky-header-height:var(--main-document-header-height)}.main-document-header-container{position:-webkit-sticky;position:sticky;top:0;z-index:var(--z-index-top)}.main-page-content{overflow-wrap:break-word;padding:3rem 1rem 1rem}.main-page-content h1 a:link,.main-page-content h1 a:visited,.main-page-content h2 a:link,.main-page-content h2 a:visited,.main-page-content h3 a:link,.main-page-content h3 a:visited,.main-page-content h4 a:link,.main-page-content h4 a:visited,.main-page-content h5 a:link,.main-page-content h5 a:visited,.main-page-content h6 a:link,.main-page-content h6 a:visited{color:var(--text-primary);text-decoration:none}.main-page-content h1 a:focus,.main-page-content h1 a:hover,.main-page-content h2 a:focus,.main-page-content h2 a:hover,.main-page-content h3 a:focus,.main-page-content h3 a:hover,.main-page-content h4 a:focus,.main-page-content h4 a:hover,.main-page-content h5 a:focus,.main-page-content h5 a:hover,.main-page-content h6 a:focus,.main-page-content h6 a:hover{text-decoration:underline}.main-page-content h1 a:active,.main-page-content h2 a:active,.main-page-content h3 a:active,.main-page-content h4 a:active,.main-page-content h5 a:active,.main-page-content h6 a:active{background-color:transparent}.main-page-content h1 a[href^="#"]:hover:after,.main-page-content h2 a[href^="#"]:hover:after,.main-page-content h3 a[href^="#"]:hover:after,.main-page-content h4 a[href^="#"]:hover:after,.main-page-content h5 a[href^="#"]:hover:after,.main-page-content h6 a[href^="#"]:hover:after{color:var(--text-inactive);content:"#";display:inline-flex;font-size:.7em;line-height:1;margin-left:4px;text-decoration:none}.main-page-content h1:after{-webkit-text-decoration-color:var(--category-color);text-decoration-color:var(--category-color)}.main-page-content h2:first-of-type{margin-top:2rem}.main-page-content a:not(.button){color:var(--text-link);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.main-page-content a:not(.button):active{background-color:var(--text-link);color:#fff}.main-page-content a:not(.button):active code{background-color:transparent;color:#fff}.main-page-content a:not(.button)[id^=attr-]:link,.main-page-content a:not(.button)[id^=attr-]:visited{color:var(--text-link);text-decoration:none}.main-page-content a:not(.button)[id^=attr-]:focus,.main-page-content a:not(.button)[id^=attr-]:hover{text-decoration:underline}.main-page-content a:not(.button)[id^=attr-]:active{color:#fff}.main-page-content a:not(.button)[aria-current]{color:var(--text-link);font-weight:var(--font-body-strong-weight);text-decoration:none}.main-page-content img{background:#fff;border:1px solid var(--border-primary)!important;border-radius:var(--elem-radius);display:inline-block;display:flex;height:auto;margin:2rem auto}.main-page-content ol,.main-page-content ul{margin:1rem 0 2rem;padding-left:2rem}.main-page-content ol li,.main-page-content ul li{margin:.5rem 0}.main-page-content ul{list-style:disc}.main-page-content ul ul{list-style-type:circle;margin:0;padding-left:1rem}.main-page-content ol{list-style:decimal}.main-page-content ol ol{list-style:lower-roman;margin:0}.main-page-content dd ol,.main-page-content dd ul{margin-bottom:1rem;padding-left:3rem}.main-page-content td ol,.main-page-content td ul{padding-left:1rem}.main-page-content dd li{margin-bottom:1rem}.main-page-content td li{margin-bottom:.5rem}.main-page-content dl dt{margin-bottom:.5rem;margin-top:2rem}.main-page-content dl dd{margin-bottom:1rem;margin-left:1rem}.main-page-content dl dd .notecard p{padding-left:0}.main-page-content dl p{margin:0 0 1rem}.main-page-content .section-content p{font:var(--type-article-p)}.main-page-content .section-content p:last-child{margin-bottom:2rem}.main-page-content .section-content figure{margin-bottom:1rem}.main-page-content .section-content .prev-next{display:flex;gap:.5rem;justify-content:space-between;list-style:none;margin:1rem 0;padding:0;text-align:center}.main-page-content .section-content .prev-next li{display:flex;margin:0}.main-page-content .section-content .prev-next .button{margin:0;max-width:inherit}.main-page-content .section-content .prev-next .button-wrap{color:inherit}@media screen and (min-width:426px){.main-page-content{padding:3rem}}@media screen and (min-width:769px){.main-page-content{margin-bottom:.5rem;padding:0}}b,strong{font-weight:var(--font-body-strong-weight);letter-spacing:.02rem}table{border:1px solid var(--border-primary);border-collapse:collapse;width:100%}table th{background:var(--background-tertiary);font-weight:var(--font-body-strong-weight);line-height:1.5;text-align:left}table td,table th{border:1px solid var(--border-primary);padding:.5rem .75rem;vertical-align:middle}table td .code-example pre,table td ul{margin:0}table caption{font-weight:var(--font-body-strong-weight);margin:1rem 0 .5rem}table.properties{border:none;font-size:var(--type-base-font-size)}table.properties td,table.properties th{border:none}table.properties th{background:none}table.properties tr{border-bottom:1px solid var(--border-secondary)}table.properties tr:first-child{border-top:1px solid var(--border-primary)}table.properties tr:last-child{border-bottom:1px solid var(--border-primary)}table.properties tr:nth-child(odd) td,table.properties tr:nth-child(odd) th,table.standard-table tr:nth-child(odd) td,table.standard-table tr:nth-child(odd) th{background-color:var(--background-secondary)}iframe{border:1px solid var(--border-primary);max-width:100%;width:100%}iframe.nobutton,iframe.sample-code-frame,iframe[src*="https://jsfiddle.net"],iframe[src*="https://mdn.github.io"],iframe[src*="https://test262.report"],iframe[src*="https://www.youtube-nocookie.com"]{background:#fff;border:1px solid var(--border-primary);border-radius:var(--elem-radius);width:100%}h1,h2,h3{letter-spacing:var(--heading-letter-spacing)}h1{font:var(--type-heading-h1);margin-bottom:2rem;word-break:break-word}@media screen and (min-width:769px){h1{font:var(--type-heading-h1)}}h2{font:var(--type-heading-h2);margin:4rem 0 .5rem}h3{font:var(--type-heading-h3);margin:2rem 0 .5rem}h2~div~h3,h2~h3{margin-top:1rem}h4{font:var(--type-heading-h4);letter-spacing:.5px;margin:2rem 0 1rem}h5{font:var(--type-heading-h5)}h5,h6{letter-spacing:1.5px;margin:2rem 0 1rem;text-transform:uppercase}h6{font:var(--type-heading-h6)}h1 code,h2 code,h3 code,h4 code,h5 code,h6 code{font-size:inherit}p{margin:1rem 0 2rem}blockquote{border-left:4px solid var(--border-secondary);color:var(--text-secondary);margin-bottom:2rem;padding:1rem 2rem}blockquote p{margin:0}.code-example,code,pre{border-radius:var(--elem-radius);font-size:var(--type-base-font-size-rem)}code{background:var(--code-background-inline);padding:.125rem .25rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}pre{background-color:var(--code-background-block);border:1px solid transparent;margin:1rem 0 2rem;padding:1rem 2.5rem 1rem 1rem}pre code{background:none;color:var(--text-primary);padding:0}.badge{border:1px solid var(--border-primary);border-radius:4rem;font-size:var(--type-tiny-font-size);padding:.125rem .375rem;white-space:nowrap}.badge,kbd{color:var(--text-secondary)}kbd{border:2px solid var(--border-secondary);border-radius:var(--elem-radius);box-shadow:var(--border-secondary);box-shadow:inset 0 -1px 0 0 var(--border-secondary);font-size:.825rem;padding:.25rem} \ No newline at end of file +@import "https://rsms.me/inter/inter.css";html{font-family:'Inter',sans-serif}*,:after,:before{box-sizing:border-box}blockquote,body,dd,dl,figure,h1,h2,h3,h4,ol,p,ul{margin:0}html{scroll-behavior:smooth}body{text-rendering:optimizeSpeed;font-family:Inter,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-family:var(--font-body);font-size:100%;font-size:var(--base-font-size);line-height:1.75;line-height:var(--font-content-line-height)}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}a{text-decoration:none}img,picture{max-width:100%}button,input,select,textarea{font:inherit}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:after,:before{-webkit-animation-duration:.01ms!important;animation-duration:.01ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:var(--code-token-comment)}.token.punctuation{color:var(--code-token-punctuation)}.token.attr-name,.token.builtin,.token.class-name,.token.function,.token.inserted,.token.property,.token.selector{color:var(--code-token-attribute-name)}.token.atrule,.token.attr-value{color:var(--code-token-attribute-value)}.token.keyword{color:var(--code-token-tag)}.token.boolean,.token.char,.token.constant,.token.deleted,.token.number,.token.string,.token.symbol,.token.tag{color:var(--code-token-attribute-value)}.token.builtin,.token.inserted,.token.selector,.token.template-string>.token.string{color:var(--code-token-selector)}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.notecard{--note-background:var(--background-information);--note-theme:var(--icon-information);background-color:var(--note-background);border:1px solid var(--border-secondary);border-left:4px solid var(--note-theme);border-radius:.25rem;border-radius:var(--elem-radius);box-shadow:var(--shadow-01);margin:1rem 0;padding:1rem 1rem 1rem 3rem;position:relative}.notecard,.notecard li,.notecard p{color:var(--text-secondary)}.notecard p{line-height:2;margin:0!important}.notecard:before{background-color:var(--note-theme);content:"";display:block;height:1rem;left:1rem;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;position:absolute;top:1.5rem;width:1rem}.notecard.inline{font:var(--type-body-s);margin:.5rem;padding:.125rem .375rem .125rem 1.5rem}.notecard.inline:before{display:block;height:.8rem;left:.2rem;top:.1875rem;width:.8rem}.notecard.warning{--note-background:var(--background-warning);--note-theme:var(--icon-warning)}.notecard.warning:before{-webkit-mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg)}.notecard.nonstandard{--note-background:var(--background-warning);--note-theme:var(--icon-warning)}.notecard.nonstandard:before{-webkit-mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg)}.notecard.error,.notecard.negative{--note-background:var(--background-critical);--note-theme:var(--icon-critical)}.notecard.error:before,.notecard.negative:before{-webkit-mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg);mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg)}.notecard.deprecated{--note-background:var(--background-critical);--note-theme:var(--icon-critical)}.notecard.deprecated:before{-webkit-mask-image:url(/images/info.svg);mask-image:url(/images/info.svg)}.notecard.experimental:before{-webkit-mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg);mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg)}.notecard.success{--note-background:var(--background-success);--note-theme:var(--icon-success)}.notecard.success:before{-webkit-mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg);mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg)}.notecard ol,.notecard ul{padding-left:2rem}.notecard p,.notecard ul{padding-bottom:.5rem}.notecard p:last-child,.notecard ul:last-child{padding-bottom:0}.notecard:last-of-type{margin-bottom:2rem}.notecard:first-of-type{margin-top:2rem}.notecard>:first-child{margin-top:0}.notecard h1,.notecard h2,.notecard h3,.notecard h4,.notecard h5,.notecard h6{color:var(--text-primary);font:1rem;font:var(--type-base-font-size-rem);margin-bottom:.5rem}.main-content .notecard a:not(.button),.main-content .notecard code{color:var(--notecard-link-color)}.main-content .notecard a:not(.button):hover,.main-content .notecard code:hover{text-decoration:none}.pagination{align-items:center;display:flex;gap:1rem;justify-content:center;padding:1rem 0}.mdn-form,.pagination-label{font-size:.833rem;font-size:var(--type-smaller-font-size)}.mdn-form{font-family:Inter,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-family:var(--font-body);font-weight:600;font-weight:var(--font-body-strong-weight)}.mdn-form-item{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;padding-top:1rem}.mdn-form-item:first-child{padding-top:0}.mdn-form-item.is-button-row{display:flex;justify-content:flex-end}.mdn-form-item.is-button-row .button{width:auto}.mdn-form-item [type=text]{background:var(--background-primary);border:1px solid var(--border-primary);color:var(--text-primary);flex:1 1 100%;font-size:.833rem;font-size:var(--type-smaller-font-size);min-width:0;padding:.5rem}.mdn-form-item [type=text]:focus{border:1px solid var(--button-secondary-border-focus);box-shadow:0 0 0 3px var(--accent-primary-engage);box-shadow:var(--focus-effect);outline:0 none}.mdn-form-item label{width:100%}:root{--font-fallback:BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;--font-body:Inter,var(--font-fallback);--font-heading:Inter,var(--font-fallback);--font-code:Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;--base-font-size:100%;--base-line-height:1.2;--intermediate-line-height:1.5;--heading-line-height:var(--base-line-height);--heading-letter-spacing:-.031rem;--font-content-line-height:1.75;--font-body-strong-weight:600;--type-heading-h1-font-size:2.488rem;--type-heading-h2-font-size:2.074rem;--type-heading-h3-font-size:1.728rem;--type-heading-h4-font-size:1.44rem;--type-heading-h5-font-size:1.2rem;--type-base-font-size-rem:1rem;--type-smaller-font-size:.833rem;--type-tiny-font-size:.694rem;--type-heading-h1-font-size-mobile:1.802rem;--type-heading-h2-font-size-mobile:1.602rem;--type-heading-h3-font-size-mobile:1.424rem;--type-heading-h4-font-size-mobile:1.266rem;--type-emphasis-m:var(--font-body-strong-weight) var(--type-smaller-font-size) /1.23 var(--font-body);--type-label-s:600 var(--type-tiny-font-size) /1.2 var(--font-heading);--type-heading-h1:600 var(--type-heading-h1-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h2:500 var(--type-heading-h2-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h3:300 var(--type-heading-h3-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h4:400 var(--type-heading-h4-font-size-mobile) /var(--heading-line-height) var(--font-heading);--type-heading-h5:400 var(--type-heading-h5-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h6:400 var(--type-base-font-size-rem) /var(--heading-line-height) var(--font-heading);--type-article-p:400 var(--type-base-font-size-rem) /var(--font-content-line-height) var(--font-body);--max-width:1440px;--gutter:1rem;--top-navigation-height:4rem;--top-navigation-offset:-4rem;--z-index-back:-1;--z-index-top:9999;--z-index-a11y:10000;--z-index-mid:500;--z-index-nav-menu:200;--z-index-search-results:101;--z-index-low:100;--z-index-search-results-home:99;--elem-radius:.25rem;--focus-effect:0 0 0 3px var(--accent-primary-engage);--form-elem-height:2rem;--sticky-header-height:0;--top-nav-height:4rem;--main-document-header-height:6rem;--icon-size:1rem}@media screen and (min-width:769px){:root{--type-heading-h1:600 var(--type-heading-h1-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h2:500 var(--type-heading-h2-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h3:300 var(--type-heading-h3-font-size) /var(--heading-line-height) var(--font-heading);--type-heading-h4:400 var(--type-heading-h4-font-size) /var(--heading-line-height) var(--font-heading)}}:target{scroll-margin-top:0;scroll-margin-top:var(--sticky-header-height)}body{accent-color:var(--accent-primary);background-color:var(--background-primary);color:var(--text-primary);scrollbar-color:var(--scrollbar-color) var(--scrollbar-bg)}body.full-screen-overlay{overflow:hidden}:focus-visible{outline-color:var(--accent-primary);outline-offset:1px;outline-style:auto}main{min-height:80vh}.about-container a:link,.about-container a:visited,.main-page-content a:link,.main-page-content a:visited{text-decoration:underline}.about-container a:focus,.about-container a:hover,.main-page-content a:focus,.main-page-content a:hover{text-decoration:none}.visually-hidden{clip:rect(1px,1px,1px,1px)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.hidden{display:none}pre{word-wrap:break-word;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap}a{color:var(--text-link)}a.external:after{background-color:var(--icon-primary);content:"";display:inline-flex;height:10px;margin-left:4px;-webkit-mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);-webkit-mask-size:cover;mask-size:cover;width:10px}.expand-this-link:after{bottom:0;content:"";left:0;position:absolute;right:0;top:0}[type=search]::-ms-clear{display:none;height:0;width:0}[type=search]::-ms-reveal{display:none;height:0;width:0}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration,[type=search]::-webkit-search-results-button,[type=search]::-webkit-search-results-decoration{display:none}u{-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.plus,.plus .dark{--background-toc-active:var(--plus-accent-background-color);--text-link:var(--plus-accent-color);--category-color:var(--plus-accent-color);--category-color-background:var(--plus-accent-background-color);--code-color:var(--plus-code-color);--mark-color:var(--plus-mark-color)}.category-html{--background-toc-active:var(--html-accent-background-color);--category-color:var(--html-accent-color);--category-color-background:var(--html-accent-background-color);--mark-color:var(--html-mark-color)}.category-css{--background-toc-active:var(--css-accent-background-color);--category-color:var(--css-accent-color);--category-color-background:var(--css-accent-background-color);--mark-color:var(--css-mark-color)}.category-javascript{--background-toc-active:var(--js-accent-background-color);--category-color:var(--js-accent-color);--category-color-background:var(--js-accent-background-color);--mark-color:var(--js-mark-color)}.category-http{--background-toc-active:var(--http-accent-background-color);--category-color:var(--http-accent-color);--category-color-background:var(--http-accent-background-color);--mark-color:var(--http-mark-color)}.category-api{--background-toc-active:var(--apis-accent-background-color);--category-color:var(--apis-accent-color);--category-color-background:var(--apis-accent-background-color);--mark-color:var(--apis-mark-color)}.category-learn{--background-toc-active:var(--learn-accent-background-color);--category-color:var(--learn-accent-color);--category-color-background:var(--learn-accent-background-color);--mark-color:var(--api-mark-color)}.mify{margin-left:.5rem}.mify:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.1em;text-underline-offset:.1em}.mify:before{background-color:var(--text-link);content:"";display:inline-block;height:1.2em;-webkit-mask-size:cover;mask-size:cover;-webkit-transform:translate(-.2em,.2em);transform:translate(-.2em,.2em);width:1.2em}._ify:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.1em;text-underline-offset:.1em}@media(forced-colors:active){.icon{background-color:CanvasText!important}}.homepage{align-items:center;display:flex;flex-direction:column;gap:2rem;overflow-x:clip;overflow-y:visible;position:relative;width:100%}.homepage-hero{color:var(--text-primary);display:grid;grid-template-rows:fit-content(24rem);width:100%}.homepage-hero section{display:flex;flex-direction:column;gap:2rem;grid-column:1;grid-row:1;height:100%;justify-content:center;margin:0 auto;max-width:52rem;padding:0 1rem;width:100%}.homepage-hero section h1{font-size:2.2rem;font-weight:200;letter-spacing:-.5px;line-height:120%;margin:0}@media screen and (min-width:426px){.homepage-hero section h1{font-size:2.5rem}}@media screen and (min-width:769px){.homepage-hero section h1{font-size:3rem}}.homepage-hero section h1:after{content:" ";text-decoration:underline;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1rem}.homepage-hero section p{font-weight:300}.homepage-hero .homepage-hero-bg{--mandala-primary:var(--border-primary);background-color:rgba(1,1,1,.9);grid-column:1;grid-row:1;overflow:hidden;top:0;width:100%;z-index:-1}.homepage-hero .homepage-hero-bg .mandala-translate{-webkit-transform:translate(10rem,-8rem) scale(1.2);transform:translate(10rem,-8rem) scale(1.2)}@media screen and (min-width:426px){.homepage-hero .homepage-hero-bg .mandala-translate{-webkit-transform:translate(12rem,-8rem);transform:translate(12rem,-8rem)}}.homepage-hero .homepage-hero-search{align-self:center;display:flex;margin-bottom:1rem;max-height:4rem;max-width:40rem;width:100%}.homepage-hero .homepage-hero-search .search-input-field{background-color:rgba(1,1,1,.5);border-radius:10rem;padding:2rem}.homepage-hero .homepage-hero-search .search-input-field:focus{border-color:var(--field-focus-border);box-shadow:var(--focus-01)}.homepage-hero .homepage-hero-search .search-input-field::-webkit-input-placeholder{font-size:1.5rem}.homepage-hero .homepage-hero-search .search-input-field::placeholder{font-size:1.5rem}.homepage-hero .homepage-hero-search .search-widget{display:flex;gap:0}.homepage-hero .homepage-hero-search .search-results{box-shadow:var(--shadow-02);margin:0 1.5rem;text-align:left;top:4.2rem;width:calc(100% - 3rem);z-index:var(--z-index-search-results-home)}.homepage-hero .homepage-hero-search .search-results .result-item a{padding:.5rem 1.5rem}.homepage-hero .homepage-hero-search .search-results .result-item mark{background:none;color:var(--text-primary)}.homepage-hero .homepage-hero-search .search-results .result-item span{color:var(--text-secondary);font-weight:400}.homepage-hero .homepage-hero-search .search-results .result-item small{color:var(--text-secondary)}.homepage-hero .search-button.button{height:100%;left:auto;position:absolute;right:1.5rem;top:0}.homepage-hero .search-button.button:hover{background:none;border-color:transparent}.homepage-hero .search-button.button .button-wrap{background:none}.homepage-hero .search-button.button .button-wrap:hover{background:none;border:1px solid transparent}.homepage-hero .search-button.button .button-wrap:hover .icon{background-color:var(--text-link)}.homepage-hero .search-button.button .button-wrap .icon{background-color:var(--icon-primary);border:none}.icon{--size:var(--icon-size,1rem);background-color:var(--icon-primary);display:inline-block;flex-shrink:0;height:var(--size);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:middle;width:var(--size)}svg.icon{background:transparent;color:var(--icon-primary)}.icon.icon-add-filled{-webkit-mask-image:url(/static/media/add-filled.a8e6793efe0c45d06016.svg);mask-image:url(/static/media/add-filled.a8e6793efe0c45d06016.svg)}.icon.icon-add{-webkit-mask-image:url(/static/media/add.9f0957aa3417844441a2.svg);mask-image:url(/static/media/add.9f0957aa3417844441a2.svg)}.icon.icon-altname{-webkit-mask-image:url(/static/media/altname.fa41e3cb6859d720b231.svg);mask-image:url(/static/media/altname.fa41e3cb6859d720b231.svg)}.icon.icon-bell-filled{-webkit-mask-image:url(/static/media/bell-filled.92b1b0fec0b6ed04f771.svg);mask-image:url(/static/media/bell-filled.92b1b0fec0b6ed04f771.svg)}.icon.icon-bell{-webkit-mask-image:url(/static/media/bell.034a87122ec06307f900.svg);mask-image:url(/static/media/bell.034a87122ec06307f900.svg)}.icon.icon-bookmark-filled{-webkit-mask-image:url(/static/media/bookmark-filled.22802275efddc0dd3f04.svg);mask-image:url(/static/media/bookmark-filled.22802275efddc0dd3f04.svg)}.icon.icon-bookmark{-webkit-mask-image:url(/static/media/bookmark.e9ba9d27f97589ba62cc.svg);mask-image:url(/static/media/bookmark.e9ba9d27f97589ba62cc.svg)}.icon.icon-cancel{-webkit-mask-image:url(/static/media/cancel.ff1ee2551e18f9c9c8d3.svg);mask-image:url(/static/media/cancel.ff1ee2551e18f9c9c8d3.svg)}.icon.icon-checkmark{-webkit-mask-image:url(/static/media/checkmark.d05ce91f65dfc321cadd.svg);mask-image:url(/static/media/checkmark.d05ce91f65dfc321cadd.svg)}.icon.icon-chevron{-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg)}.icon.icon-chrome{-webkit-mask-image:url(/static/media/chrome.4c57086589fd964c05f5.svg);mask-image:url(/static/media/chrome.4c57086589fd964c05f5.svg)}.icon.icon-critical{-webkit-mask-image:url(/static/media/critical.046b659f661afa9ab11f.svg);mask-image:url(/static/media/critical.046b659f661afa9ab11f.svg)}.icon.icon-deno{-webkit-mask-image:url(/static/media/deno.a791d0899729b3089500.svg);mask-image:url(/static/media/deno.a791d0899729b3089500.svg)}.icon.icon-deprecated{-webkit-mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg);mask-image:url(/static/media/deprecated.eda3b39bb2bd366d4b2b.svg)}.icon.icon-desktop{-webkit-mask-image:url(/static/media/desktop.ae5e91df1e60ced79a5e.svg);mask-image:url(/static/media/desktop.ae5e91df1e60ced79a5e.svg)}.icon.icon-disabled{-webkit-mask-image:url(/static/media/disabled.f52f4d023359dbf8a727.svg);mask-image:url(/static/media/disabled.f52f4d023359dbf8a727.svg)}.icon.icon-edge{-webkit-mask-image:url(/static/media/edge.40018f6a959bc3e5c537.svg);mask-image:url(/static/media/edge.40018f6a959bc3e5c537.svg)}.icon.icon-edit{-webkit-mask-image:url(/static/media/edit.2e4f3bd111b39f9ebbc2.svg);mask-image:url(/static/media/edit.2e4f3bd111b39f9ebbc2.svg)}.icon.icon-ellipses{-webkit-mask-image:url(/static/media/ellipses.c6dd1c04b7ef3cba126a.svg);mask-image:url(/static/media/ellipses.c6dd1c04b7ef3cba126a.svg)}.icon.icon-experimental{-webkit-mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg);mask-image:url(/static/media/experimental.2f9e05f53c6dbee7791c.svg)}.icon.icon-external{-webkit-mask-image:url(/static/media/external.ad7e40a95bc765963433.svg);mask-image:url(/static/media/external.ad7e40a95bc765963433.svg)}.icon.icon-eye-filled{-webkit-mask-image:url(/static/media/eye-filled.dd0405b418fcfecf0f77.svg);mask-image:url(/static/media/eye-filled.dd0405b418fcfecf0f77.svg)}.icon.icon-eye{-webkit-mask-image:url(/static/media/eye.b451ad8ced0662500e82.svg);mask-image:url(/static/media/eye.b451ad8ced0662500e82.svg)}.icon.icon-footnote{-webkit-mask-image:url(/static/media/footnote.adb3f56121e4f9c95ba7.svg);mask-image:url(/static/media/footnote.adb3f56121e4f9c95ba7.svg)}.icon.icon-github-mark-small{-webkit-mask-image:url(/static/media/github-mark-small.348586b8904b950b8ea8.svg);mask-image:url(/static/media/github-mark-small.348586b8904b950b8ea8.svg)}.icon.icon-ie{-webkit-mask-image:url(/static/media/ie.cf17782c766db346d9b1.svg);mask-image:url(/static/media/ie.cf17782c766db346d9b1.svg)}.icon.icon-information{-webkit-mask-image:url(/static/media/information.81a9c7bfba75e9c4e993.svg);mask-image:url(/static/media/information.81a9c7bfba75e9c4e993.svg)}.icon.icon-language{-webkit-mask-image:url(/static/media/language.e4289910782fa8d1c882.svg);mask-image:url(/static/media/language.e4289910782fa8d1c882.svg)}.icon.icon-menu-filled{-webkit-mask-image:url(/static/media/menu-filled.48a621119c4448c94d79.svg);mask-image:url(/static/media/menu-filled.48a621119c4448c94d79.svg)}.icon.icon-menu{-webkit-mask-image:url(/static/media/menu.1ed93cf1ba8c04627c11.svg);mask-image:url(/static/media/menu.1ed93cf1ba8c04627c11.svg)}.icon.icon-mobile{-webkit-mask-image:url(/static/media/mobile.7f0bdae2a317caf911ee.svg);mask-image:url(/static/media/mobile.7f0bdae2a317caf911ee.svg)}.icon.icon-more{-webkit-mask-image:url(/static/media/more.ce2ad00a1fca149a22ce.svg);mask-image:url(/static/media/more.ce2ad00a1fca149a22ce.svg)}.icon.icon-theme-dark{-webkit-mask-image:url(/static/media/theme-dark.2204a73b9b7fbc5e0219.svg);mask-image:url(/static/media/theme-dark.2204a73b9b7fbc5e0219.svg)}.icon.icon-next{-webkit-mask-image:url(/static/media/next.1ecddf89481891f59480.svg);mask-image:url(/static/media/next.1ecddf89481891f59480.svg)}.icon.icon-no{-webkit-mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg);mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg)}.icon.icon-nodejs{-webkit-mask-image:url(/static/media/nodejs.bb93afa7923c2473034b.svg);mask-image:url(/static/media/nodejs.bb93afa7923c2473034b.svg)}.icon.icon-nonstandard{-webkit-mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/nonstandard.d6e4c7b35b5ed187e936.svg)}.icon.icon-note-info{-webkit-mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg);mask-image:url(/static/media/note-info.0eafb6e7738509bce66e.svg)}.icon.icon-note-warning{-webkit-mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg);mask-image:url(/static/media/note-warning.d6e4c7b35b5ed187e936.svg)}.icon.icon-note-deprecated{-webkit-mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg);mask-image:url(/static/media/note-deprecated.0d2643f0c417b3670c49.svg)}.icon.icon-opera{-webkit-mask-image:url(/static/media/opera.a0ab0c5004c00e618a00.svg);mask-image:url(/static/media/opera.a0ab0c5004c00e618a00.svg)}.icon.icon-padlock{-webkit-mask-image:url(/static/media/padlock.6210113487ca12ff25f3.svg);mask-image:url(/static/media/padlock.6210113487ca12ff25f3.svg)}.icon.icon-partial{-webkit-mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg);mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg)}.icon.icon-prefix{-webkit-mask-image:url(/static/media/prefix.db94a69f5867547725e5.svg);mask-image:url(/static/media/prefix.db94a69f5867547725e5.svg)}.icon.icon-preview{-webkit-mask-image:url(/static/media/preview.77ee12031f5f5ecb2962.svg);mask-image:url(/static/media/preview.77ee12031f5f5ecb2962.svg)}.icon.icon-previous{-webkit-mask-image:url(/static/media/previous.585a0363cab37d75a90d.svg);mask-image:url(/static/media/previous.585a0363cab37d75a90d.svg)}.icon.icon-quote{-webkit-mask-image:url(/static/media/quote.d88c218cc7eaf9168178.svg);mask-image:url(/static/media/quote.d88c218cc7eaf9168178.svg)}.icon.icon-safari{-webkit-mask-image:url(/static/media/safari.3679eb31121b46323304.svg);mask-image:url(/static/media/safari.3679eb31121b46323304.svg)}.icon.icon-samsunginternet{-webkit-mask-image:url(/static/media/samsunginternet.55e41ddfc05627ecc331.svg);mask-image:url(/static/media/samsunginternet.55e41ddfc05627ecc331.svg)}.icon.icon-search{-webkit-mask-image:url(/static/media/search.cebfd63a204ba9fefa74.svg);mask-image:url(/static/media/search.cebfd63a204ba9fefa74.svg)}.icon.icon-server{-webkit-mask-image:url(/static/media/server.fdad5f2f9f48879ac6c2.svg);mask-image:url(/static/media/server.fdad5f2f9f48879ac6c2.svg)}.icon.icon-sidebar{-webkit-mask-image:url(/static/media/sidebar.18421c220ec0a5e690f1.svg);mask-image:url(/static/media/sidebar.18421c220ec0a5e690f1.svg)}.icon.icon-simple-firefox{-webkit-mask-image:url(/static/media/simple-firefox.9b9181d8c30c3de88edf.svg);mask-image:url(/static/media/simple-firefox.9b9181d8c30c3de88edf.svg)}.icon.icon-small-arrow{-webkit-mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg)}.icon.icon-theme-light{-webkit-mask-image:url(/static/media/theme-light.af1aa3887c0deadaaf2e.svg);mask-image:url(/static/media/theme-light.af1aa3887c0deadaaf2e.svg)}.icon.icon-star-filled{-webkit-mask-image:url(/static/media/star-filled.358ee4566f4a4c7d438d.svg);mask-image:url(/static/media/star-filled.358ee4566f4a4c7d438d.svg)}.icon.icon-star{-webkit-mask-image:url(/static/media/star.00aab2ac065852fd407a.svg);mask-image:url(/static/media/star.00aab2ac065852fd407a.svg)}.icon.icon-theme-os-default{-webkit-mask-image:url(/static/media/theme-os-default.b14255eadab403fa2e8a.svg);mask-image:url(/static/media/theme-os-default.b14255eadab403fa2e8a.svg)}.icon.icon-thumbs-down{-webkit-mask-image:url(/static/media/thumbs-down.7ca516d7f04791a3910c.svg);mask-image:url(/static/media/thumbs-down.7ca516d7f04791a3910c.svg)}.icon.icon-thumbs-up{-webkit-mask-image:url(/static/media/thumbs-up.10a6075a46940d218431.svg);mask-image:url(/static/media/thumbs-up.10a6075a46940d218431.svg)}.icon.icon-trash{-webkit-mask-image:url(/static/media/trash.edee2ea86f1b505315f7.svg);mask-image:url(/static/media/trash.edee2ea86f1b505315f7.svg)}.icon.icon-twitter{-webkit-mask-image:url(/static/media/twitter.cc5b37feab537ddbf701.svg);mask-image:url(/static/media/twitter.cc5b37feab537ddbf701.svg)}.icon.icon-unknown{-webkit-mask-image:url(/static/media/unknown.7fd13a7673ebf93f625c.svg);mask-image:url(/static/media/unknown.7fd13a7673ebf93f625c.svg)}.icon.icon-warning{-webkit-mask-image:url(/static/media/warning.334964ef472eac4cfb78.svg);mask-image:url(/static/media/warning.334964ef472eac4cfb78.svg)}.icon.icon-webview{-webkit-mask-image:url(/static/media/webview.7d9bf32041e0c57240b5.svg);mask-image:url(/static/media/webview.7d9bf32041e0c57240b5.svg)}.icon.icon-yes{-webkit-mask-image:url(/static/media/yes.70caad81ca5e3d9f7576.svg);mask-image:url(/static/media/yes.70caad81ca5e3d9f7576.svg)}.icon.icon-yes-circle{-webkit-mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg);mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg)}.button,button{-webkit-appearance:none;appearance:none;background:none;border:none}.button{--button-bg:var(--button-primary-default);--button-border-color:var(--button-primary-default);--button-focus-effect:var(--focus-effect);--button-height:var(--form-elem-height,2rem);--button-color:var(--background-primary);--button-font:var(--type-emphasis-m);--button-padding:.5rem;--button-radius:var(--elem-radius,0.25rem);border-radius:var(--button-radius);cursor:pointer;display:inline-block;padding:0;text-decoration:none}.button-wrap{align-items:center;background-color:var(--button-bg);border:1px solid var(--button-border-color);border-radius:var(--button-radius);color:var(--button-color);display:flex;font:var(--button-font);gap:.25rem;height:var(--button-height);justify-content:center;padding-left:var(--button-padding);padding-right:var(--button-padding);position:relative}.button .icon{background-color:var(--button-color);margin:0 -1px}.button.hover,.button:hover{--button-bg:var(--button-primary-hover);--button-border-color:var(--button-bg)}.button.active,.button:active{--button-bg:var(--button-primary-active)}.button.focus,.button:focus{outline:none}.button.focus .button-wrap,.button:focus .button-wrap{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--button-focus-effect)}.button.button.inactive,.button.button[disabled]{cursor:default;opacity:.65}.button.button.inactive:hover,.button.button[disabled]:hover{--button-bg:inherit;--button-border-color:transparent}.button.small,.button.small .button-wrap{--button-height:1.75rem;--button-padding:.25rem}.button.secondary{--button-bg:var(--button-secondary-default);--button-border-color:var(--border-primary);--button-color:var(--text-secondary)}.button.secondary:hover{--button-bg:var(--button-secondary-hover)}.button.secondary:active{--button-bg:var(--button-secondary-active)}.button.secondary:focus{--button-border-color:var(--button-secondary-border-focus)}.button.action{--button-bg:transparent;--button-border-color:var(--button-bg);--button-color:var(--text-secondary);--button-font:var(--type-label-s)}.button.action.has-icon{--button-font:var(--type-emphasis-m);text-transform:none}.button.action:hover{--button-bg:var(--button-secondary-hover)}.button.action:active{--button-bg:var(--button-secondary-active)}.button.action:focus{--button-border-color:var(--button-secondary-border-focus)}.button.action .button-wrap{text-transform:uppercase}.button.action.highlight{--button-color:var(--button-primary-default)}.button.select{--button-bg:var(--background-primary);--button-border-color:var(--border-primary);--button-color:var(--text-secondary);-webkit-appearance:none;appearance:none;background:none;border:none;padding:0;text-decoration:none}.button.select .button-wrap{box-shadow:var(--shadow-01);padding-right:26px;position:relative}.button.select .button-wrap:after{background-color:var(--icon-primary);content:"";display:block;height:16px;-webkit-mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);mask-image:url(/static/media/small-arrow.a22801b3d18b7d1ea795.svg);-webkit-mask-size:cover;mask-size:cover;position:absolute;right:.5rem;top:calc(50% - .5rem);width:16px}.header-search{max-width:100%}.header-search .search-widget{margin:0 auto;max-width:20rem;position:relative;width:100%}@media screen and (min-width:769px){.header-search .search-widget{align-items:center;display:flex;gap:.5rem}}.header-search .search-input-field{-webkit-appearance:none;background-color:var(--background-primary);border:1px solid var(--border-primary);border-radius:100px;caret-color:var(--text-link);color:var(--text-primary);height:var(--form-elem-height);min-width:5rem;padding-left:1rem;padding-right:2rem;width:100%}@-webkit-keyframes blink{0%,to{-webkit-text-decoration-line:none;text-decoration-line:none}50%{-webkit-text-decoration-line:underline;text-decoration-line:underline}}@keyframes blink{0%,to{-webkit-text-decoration-line:none;text-decoration-line:none}50%{-webkit-text-decoration-line:underline;text-decoration-line:underline}}@media screen and (min-width:992px){.header-search .search-input-field:invalid{width:1rem}}.header-search .search-input-field:focus,.header-search .search-input-field:valid{width:inherit}.header-search .search-input-field:invalid::-webkit-input-placeholder{-webkit-animation:blink 2s step-end infinite;animation:blink 2s step-end infinite;caret-color:transparent}.header-search .search-input-field:invalid,.header-search .search-input-field:invalid::placeholder{-webkit-animation:blink 2s step-end infinite;animation:blink 2s step-end infinite;caret-color:transparent}@media(prefers-reduced-motion:reduce){.header-search .search-input-field:invalid::-webkit-input-placeholder{caret-color:auto}.header-search .search-input-field:invalid,.header-search .search-input-field:invalid::placeholder{caret-color:auto}}.header-search .search-input-field:valid::-webkit-input-placeholder{-webkit-animation:none;animation:none}.header-search .search-input-field:valid,.header-search .search-input-field:valid::placeholder{-webkit-animation:none;animation:none}.header-search .search-input-field:not(:focus):valid::-webkit-input-placeholder{-webkit-text-decoration-line:none;text-decoration-line:none}.header-search .search-input-field:not(:focus):valid,.header-search .search-input-field:not(:focus):valid::placeholder{-webkit-text-decoration-line:none;text-decoration-line:none}.header-search .search-input-field:not(:focus),.header-search .search-input-field:not(:focus)::placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:not(:focus)::-webkit-input-placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:not(:focus)::placeholder{-webkit-animation:none;animation:none;-webkit-text-decoration-line:underline;text-decoration-line:underline}.header-search .search-input-field:focus{border-color:var(--category-color);box-shadow:0 0 0 3px var(--blend-color),0 0 0 3px var(--category-color);outline:0 none}.header-search .search-input-field::-webkit-input-placeholder{font:var(--type-body-l);opacity:1;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.header-search .search-input-field,.header-search .search-input-field::placeholder{font:var(--type-body-l);opacity:1;-webkit-text-decoration-color:var(--text-link);text-decoration-color:var(--text-link);text-decoration-thickness:.15rem;text-underline-offset:.1em}.header-search .server-error{color:var(--icon-critical);margin:0}.header-search .search-results,.homepage-hero-search .search-results{border:1px solid var(--border-secondary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);left:0;position:absolute;top:42px;width:100%;z-index:var(--z-index-search-results)}.header-search .search-results,.header-search .search-results a[href],.header-search .search-results mark,.homepage-hero-search .search-results,.homepage-hero-search .search-results a[href],.homepage-hero-search .search-results mark{color:var(--text-primary)}.header-search .search-results .indexing-warning,.homepage-hero-search .search-results .indexing-warning{color:var(--icon-warning)}.header-search .search-results .nothing-found,.homepage-hero-search .search-results .nothing-found{font-style:italic}.header-search .search-results .result-item,.homepage-hero-search .search-results .result-item{background:var(--background-secondary);border-bottom:1px solid var(--border-secondary);font-size:var(--type-smaller-font-size);word-break:break-word}.header-search .search-results .result-item:first-child,.homepage-hero-search .search-results .result-item:first-child{border-radius:var(--elem-radius) var(--elem-radius) 0 0}.header-search .search-results .result-item:last-child,.homepage-hero-search .search-results .result-item:last-child{border-radius:0 0 var(--elem-radius) var(--elem-radius)}.header-search .search-results .result-item.nothing-found code,.homepage-hero-search .search-results .result-item.nothing-found code{font-size:.8125rem}.header-search .search-results .result-item a,.homepage-hero-search .search-results .result-item a{display:block;padding:.5rem}.header-search .search-results .result-item.highlight,.header-search .search-results .result-item:hover,.homepage-hero-search .search-results .result-item.highlight,.homepage-hero-search .search-results .result-item:hover{background-color:var(--border-secondary)}.header-search .search-results .result-item.qs-collection b:after,.homepage-hero-search .search-results .result-item.qs-collection b:after{border:1px solid var(--text-primary-red);border-radius:.5rem;content:"collection";font-size:.5rem;line-height:.5rem;margin-bottom:.5rem;margin-left:.5rem;padding:.125rem;vertical-align:super}.header-search .search-results .result-item:focus,.header-search .search-results .result-item:hover,.homepage-hero-search .search-results .result-item:focus,.homepage-hero-search .search-results .result-item:hover{cursor:pointer}.header-search .search-results div:last-child,.homepage-hero-search .search-results div:last-child{border-bottom:0}.header-search .search-results mark,.homepage-hero-search .search-results mark{background-color:var(--mark-color)}.header-search .search-results small,.homepage-hero-search .search-results small{overflow-wrap:break-word}.header-search .search-results a,.homepage-hero-search .search-results a{text-overflow:ellipsis}.header-search .search-results div.searchindex-error,.homepage-hero-search .search-results div.searchindex-error{color:var(--icon-critical)}.search-form{display:flex;position:relative}.button.clear-search-button,.button.search-button{--button-color:var(--icon-secondary);--button-height:1.5rem;--button-padding:0;position:absolute;right:.75rem;top:.25rem;width:1.5rem}.button.clear-search-button:hover,.button.search-button:hover{background:transparent}@media screen and (min-width:769px){.button.clear-search-button,.button.search-button{right:1.2rem;width:1.5rem}}.button.clear-search-button{display:none}.header-search .search-input-field:focus~.button.clear-search-button,.header-search .search-input-field:valid~.button.clear-search-button{display:block;right:2.8rem}.mandala-container{--mandala-primary:#4e4e4e;--mandala-accent-1:var(--html-accent-color);--mandala-accent-2:var(--http-accent-color);--mandala-accent-3:var(--js-accent-color);--mandala-accent-4:#b3b3b3;display:flex;justify-content:center}.mandala-container .mandala-rotate>svg{-webkit-animation:rotation 500s linear infinite;animation:rotation 500s linear infinite}.mandala-container svg{font-size:1.5rem;font-weight:300;-webkit-user-select:none;user-select:none}.mandala-container svg>text{fill:var(--mandala-primary)}.mandala-container .mandala-accent-1{font-size:1.5rem}.mandala-container .mandala-accent-2{font-size:1.3rem}.mandala-container .mandala-accent-3{font-size:1.2rem}.mandala-container .mandala-accent-4{font-size:1.1rem}.mandala-container .mandala-accent-5{font-size:1rem}.mandala-container.animate-colors svg>text>textPath>tspan{-webkit-animation:mandala-color-change 50s infinite;animation:mandala-color-change 50s infinite;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;fill:var(--mandala-primary)}.mandala-container.animate-colors .mandala-accent-1>textPath>tspan{fill:var(--mandala-accent-1);-webkit-animation-delay:-15s;animation-delay:-15s}.mandala-container.animate-colors .mandala-accent-2>textPath>tspan{fill:var(--mandala-accent-2);-webkit-animation-delay:-20s;animation-delay:-20s}.mandala-container.animate-colors .mandala-accent-3>textPath>tspan{fill:var(--mandala-accent-3);-webkit-animation-delay:-30s;animation-delay:-30s}.mandala-container.animate-colors .mandala-accent-5>textPath>tspan{fill:var(--mandala-accent-4);-webkit-animation-delay:-40s;animation-delay:-40s}@-webkit-keyframes rotation{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotation{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes mandala-color-change{0%{fill:var(--mandala-primary)}10%{fill:var(--mandala-primary)}15%{fill:var(--mandala-accent-1)}20%{fill:var(--mandala-primary)}25%{fill:var(--mandala-primary)}30%{fill:var(--mandala-accent-2)}35%{fill:var(--mandala-primary)}40%{fill:var(--mandala-primary)}50%{fill:var(--mandala-accent-3)}55%{fill:var(--mandala-primary)}60%{fill:var(--mandala-primary)}65%{fill:var(--mandala-accent-4)}70%{fill:var(--mandala-primary)}to{fill:var(--mandala-primary)}}@keyframes mandala-color-change{0%{fill:var(--mandala-primary)}10%{fill:var(--mandala-primary)}15%{fill:var(--mandala-accent-1)}20%{fill:var(--mandala-primary)}25%{fill:var(--mandala-primary)}30%{fill:var(--mandala-accent-2)}35%{fill:var(--mandala-primary)}40%{fill:var(--mandala-primary)}50%{fill:var(--mandala-accent-3)}55%{fill:var(--mandala-primary)}60%{fill:var(--mandala-primary)}65%{fill:var(--mandala-accent-4)}70%{fill:var(--mandala-primary)}to{fill:var(--mandala-primary)}}.featured-articles{align-items:flex-start;display:flex;flex-direction:column;gap:1rem;padding:0 1rem}.featured-articles h2{font:var(--type-heading-h4);margin-top:0}.featured-articles .tile-container{grid-gap:1rem;display:grid;gap:1rem;grid-auto-flow:row;max-width:52rem}@media screen and (min-width:769px){.featured-articles .tile-container{grid-template-columns:repeat(2,1fr)}}.featured-articles .article-tile{border:1px solid var(--border-primary);border-radius:.5rem;display:flex;flex-direction:column;padding:1rem}.featured-articles .article-tile:hover{box-shadow:var(--shadow-02)}.featured-articles .article-tile .tile-tag{color:var(--text-primary);font-weight:500}.featured-articles .article-tile .tile-tag:hover{text-decoration:underline}.featured-articles .article-tile .tile-title{align-items:flex-end;display:flex;flex-grow:1;font:var(--type-heading-h5);font-weight:500;line-height:var(--intermediate-line-height);margin:0 0 1rem}.featured-articles .article-tile .tile-title a{color:var(--text-primary)}.featured-articles .article-tile .tile-title a:focus,.featured-articles .article-tile .tile-title a:hover{text-decoration:underline}.featured-articles .article-tile p{font:var(--type-smaller-font-size);line-height:var(--base-line-height);margin:0;max-height:calc(3em*var(--base-line-height));overflow:hidden;position:relative}.featured-articles .article-tile p:after{background:linear-gradient(to right,transparent,var(--background-primary) 75%);content:"";display:block;height:calc(1em*var(--base-line-height));pointer-events:none;position:absolute;right:0;top:calc(2em*var(--base-line-height));width:20ch}.featured-articles .article-tile p:dir(rtl):after{background:linear-gradient(to left,transparent,var(--background-primary) 75%);left:0;right:auto}@media screen and (min-width:769px){.featured-articles .article-tile p{min-height:calc(3em*var(--base-line-height))}}.latest-news{display:flex;flex-direction:column;gap:1rem;max-width:52rem;padding:0 1rem;width:100%}@media screen and (min-width:1200px){.latest-news{padding:0}}.latest-news h2{font:var(--type-heading-h4);margin-top:1rem}.latest-news h5{margin:0}.latest-news .news-item{display:flex;flex-direction:column;justify-content:space-between;padding:.7rem}@media screen and (min-width:769px){.latest-news .news-item{flex-direction:revert}}.latest-news .news-item:nth-child(odd){background:var(--background-secondary);border-radius:var(--elem-radius)}.latest-news .news-item .news-date{align-items:center;display:flex;font-size:12px;line-height:175%}.latest-news .news-title{display:flex;flex-direction:column;gap:.125rem;line-height:var(--base-line-height);margin:0}.latest-news .news-title a{color:var(--text-primary)}.latest-news .news-title a:hover{color:var(--text-primary);text-decoration:underline}.latest-news .news-title .news-source{color:var(--text-secondary);font-size:var(--type-tiny-font-size)}.recent-contributions{display:flex;flex-direction:column;gap:1rem;max-width:52rem;padding:0 1rem;width:100%}@media screen and (min-width:1200px){.recent-contributions{padding:0}}.recent-contributions h2{font:var(--type-heading-h4);margin-top:1rem}.recent-contributions h5{margin:0}.recent-contributions .request-item{display:flex;flex-direction:column;justify-content:space-between;padding:.7rem}@media screen and (min-width:769px){.recent-contributions .request-item{flex-direction:revert}}.recent-contributions .request-item:nth-child(odd){background:var(--background-secondary);border-radius:var(--elem-radius)}.recent-contributions .request-item .request-date{align-items:center;display:flex;font-size:12px;line-height:175%}.recent-contributions .request-title{display:flex;flex-direction:column;gap:.125rem;line-height:var(--base-line-height);margin:0}.recent-contributions .request-title a{color:var(--text-primary)}.recent-contributions .request-title a:hover{color:var(--text-primary);text-decoration:underline}.recent-contributions .request-title .request-repo{color:var(--text-secondary);font-size:var(--type-tiny-font-size)}.contributor-spotlight{align-items:center;color:var(--text-primary);display:flex;flex-direction:column;padding:2rem 1rem;position:relative;width:100%}.contributor-spotlight blockquote{border:0;display:flex;font-style:italic;margin:0;padding:0}.contributor-spotlight blockquote .icon{margin-right:.5rem;margin-top:.25rem}.contributor-spotlight h4{font-family:var(--font-body);font-size:var(--type-smaller-font-size)}.contributor-spotlight .text-col{align-items:center;border-radius:.3rem;display:flex;flex-direction:column;gap:1rem;max-width:52rem;width:100%}.contributor-spotlight .text-col h3{font-size:var(--type-heading-h5-font-size)}.contributor-spotlight .spotlight-cta{--button-bg:var(--text-link);--button-border-color:#1b1b1b;--button-color:var(--mdn-color-black);--button-radius:10rem;--button-padding:1rem;--button-primary-hover:#696969;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.contributor-spotlight .wrapper{align-items:center;display:flex;flex-direction:column;gap:2rem;max-width:52rem;padding:2rem 1rem;width:100%}.contributor-spotlight .contributor-graphic{align-items:center;display:flex;justify-content:center;width:50%;word-break:break-word}.contributor-spotlight .contributor-graphic img{height:-webkit-max-content;height:max-content;max-width:90%}.contributor-spotlight .contributor-name{background-color:var(--mdn-color-white);color:var(--mdn-color-black);font-size:1.5rem;font-weight:650;line-height:1.4;text-transform:uppercase;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.contributor-spotlight .contributor-name:after,.contributor-spotlight .contributor-name:before{content:" "}.contributor-spotlight .contributor-name:link,.contributor-spotlight .contributor-name:visited{color:var(--mdn-color-black);text-decoration:none}.contributor-spotlight .contributor-name:focus,.contributor-spotlight .contributor-name:hover{text-decoration:underline}@media screen and (min-width:769px){.contributor-spotlight .wrapper{align-items:normal;flex-direction:row}.contributor-spotlight .text-col{align-items:normal;text-align:left}}.contributor-spotlight .mandala-container{--mandala-primary:var(--border-primary);background:rgba(1,1,1,.9);height:100%;overflow:hidden;position:absolute;top:0;width:100%;z-index:-1}.contributor-spotlight .mandala-container .mandala-translate{-webkit-transform:translate(-5rem);transform:translate(-5rem)}@-webkit-keyframes slow-pulse{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes slow-pulse{0%{opacity:0}50%{opacity:1}to{opacity:0}}.generic-loading{align-items:center;-webkit-animation:slow-pulse 2s infinite normal;animation:slow-pulse 2s infinite normal;-webkit-animation-delay:1s;animation-delay:1s;display:flex;justify-content:center;width:100%}.bc-table{border:1px solid var(--border-primary);border-collapse:separate;border-radius:var(--elem-radius);border-spacing:0;margin:1rem 0;width:100%}.bc-table td,.bc-table th{border-width:1px;border-bottom:1px solid var(--border-secondary);border-left:1px solid var(--border-secondary);border-right:0 solid var(--border-secondary);border-top:0 solid var(--border-secondary);font-weight:500;padding:0}@media screen and (min-width:769px){.bc-table td,.bc-table th{padding:.4rem}.bc-table td,.bc-table td code,.bc-table th,.bc-table th code{font-size:var(--type-smaller-font-size)}}.bc-table th{padding:.4rem}.bc-table tbody tr{height:3rem}@media screen and (min-width:769px){.bc-table tbody tr:last-child td,.bc-table tbody tr:last-child th{border-bottom-width:0}}.bc-table tbody tr th{border-left-width:0;vertical-align:middle}.bc-table tbody .bc-support{vertical-align:top}.bc-table tbody .bc-support button{cursor:pointer;width:100%}.bc-table tbody .bc-support.bc-supports-no>button>span{color:var(--text-primary-red)}.bc-table tbody .bc-support.bc-supports-partial>button>span{color:var(--text-primary-yellow)}.bc-table tbody .bc-support.bc-supports-preview>button>span{color:var(--text-primary-blue)}.bc-table tbody .bc-support.bc-supports-yes>button>span{color:var(--text-primary-green)}.bc-table tbody .bc-history td{border-left-width:0}.bc-table tbody .bc-history .icon.icon-removed-partial{-webkit-mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg);mask-image:url(/static/media/partial.2d8806d709221f07c72c.svg)}.bc-table th{background:var(--background-tertiary);vertical-align:bottom}.bc-table .bc-supports{margin-bottom:1rem}.bc-table .bc-supports .icon-wrap{background:var(--background-primary)}.bc-table .bc-supports.bc-supports-removed-partial .bcd-cell-text-copy{color:var(--text-primary-yellow)}.bc-table .icon-wrap .bc-support-level{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px}.bc-table .bc-support>button>.icon-wrap{display:block}.bc-table .bc-support .icon.icon-removed-partial{background-color:var(--icon-critical);-webkit-mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg);mask-image:url(/static/media/no.d2e0aa3e7440f80dccd6.svg)}.bc-table .bc-support.bc-supports-removed-partial .bcd-cell-text-copy{color:var(--text-primary-red)}.bc-table .bc-feature-depth-2{border-left-width:8px}.bc-head-txt-label{left:calc(50% - .5rem);line-height:1;padding-top:.5rem;position:relative;-webkit-transform:rotate(180deg);transform:rotate(180deg);white-space:nowrap;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl}.bc-head-icon-symbol{margin-bottom:.3rem}.bc-support{text-align:center;vertical-align:middle}.bc-level-no{background-color:var(--icon-critical)}.bc-level-preview{background-color:var(--icon-information)}.bc-legend-items-container{display:flex;flex-wrap:wrap;font-size:var(--type-smaller-font-size);gap:1.5rem;margin-bottom:2rem}.bc-legend-tip{font-size:var(--type-smaller-font-size);font-style:italic;margin-bottom:1rem;margin-top:0}.bc-legend-item{align-items:center;display:flex;gap:.5rem}.bc-legend-item-dt{display:flex}.bc-legend-item-dt .icon{background-color:var(--icon-primary)}.bc-platforms{height:2rem}.bc-platforms th{text-align:center}.bc-platforms td{border:none}.bc-browsers th{text-align:center}.bc-browsers td{border-width:0 0 1px}.bc-notes-list{margin:.5rem 0;position:relative;text-align:left;width:100%}.bc-notes-list:before{background:var(--border-primary);content:"";height:calc(100% - .25rem);left:7px;margin-top:.25rem;position:absolute;width:2px;z-index:-1}.bc-notes-list .bc-notes-wrapper:last-child dd:last-child{position:relative}.bc-notes-list .bc-notes-wrapper:last-child dd:last-child:before{background:var(--background-primary);bottom:0;content:"";height:calc(100% - 6px);left:7px;position:absolute;width:2px;z-index:-1}.bc-notes-list .bc-level-yes.icon.icon-yes{background-color:var(--icon-success);-webkit-mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg);mask-image:url(/static/media/yes-circle.1c4f7a083d20df35ca93.svg)}.bc-notes-list .bc-supports-dd .icon{background:var(--border-primary);border:3px solid var(--background-primary);border-radius:50%;-webkit-mask-image:none;mask-image:none}.bc-notes-list .bc-version-label{display:inline}.bc-notes-list abbr{margin-right:4px}.bc-notes-list dd{margin-bottom:1rem;padding-left:1.5rem;text-indent:-1.5rem}.bc-notes-list dd:last-child{margin-bottom:2rem}.bc-notes-wrapper{color:var(--text-primary);margin-bottom:1rem}.bc-notes-wrapper:last-child{margin-bottom:0}dl.bc-notes-list dt.bc-supports{margin-top:1rem}dl.bc-notes-list dt.bc-supports:first-child{margin-top:0}dl.bc-notes-list dd.bc-supports-dd{margin-bottom:1rem}dl.bc-notes-list dd.bc-supports-dd:last-child{margin-bottom:0}.offscreen,.only-icon span{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px}.bc-table-row-header{align-items:baseline;display:inline-flex;width:100%}.bc-table-row-header code{overflow:hidden}.bc-table-row-header .left-side,.bc-table-row-header .right-side{overflow:hidden;white-space:pre}.bc-table-row-header .left-side{flex:0 1 auto;text-overflow:ellipsis}.bc-table-row-header .right-side{flex:1 0 auto}.bc-table-row-header .bc-icons{display:flex;gap:.5rem;margin-top:.25rem}.bc-table-row-header .bc-icons .icon{background-color:var(--icon-secondary)}.bc-table-row-header .bc-icons .icon:hover{background-color:var(--icon-primary)}.bc-github-link{font:var(--type-smaller-font-size)}.main-page-content .bc-legend dd,.main-page-content .bc-legend dt{margin-bottom:0;margin-left:0;margin-top:0}.main-page-content .bc-supports-dd{margin:0}@media screen and (max-width:425px){thead{display:none}td.bc-support{border-left-width:0;display:block}.bc-feature,.bc-history>td,.bc-support>button{align-content:center;display:flex;flex-wrap:wrap;gap:.5rem}.bc-history-desktop{display:none}.table-scroll{overflow-x:auto}}@media screen and (min-width:426px){.bc-table thead{display:table-header-group}.bc-table thead .bc-platforms th{vertical-align:revert}.bc-table td,.bc-table th{background:inherit;padding:.25rem;width:2rem}.bc-table td.bc-support{padding:0}.bc-table td.bc-support>button{padding:.25rem}.bc-table tr.bc-history-desktop{display:table-row}.table-scroll{margin:0 -3rem;overflow:auto;width:100vw}.table-scroll-inner{min-width:-webkit-max-content;min-width:max-content;padding:0 3rem;position:relative}.table-scroll-inner:after{bottom:0;content:"";height:10px;position:absolute;right:0;width:10px}.bc-browser-name,.bc-support-level{display:none}.bc-notes-list{margin-left:20%;width:auto}.bc-support .bc-support-level{display:none}.bc-support[aria-expanded=true]{position:relative}.bc-support[aria-expanded=true]:after{background:var(--text-primary);bottom:-1px;content:"";height:2px;left:0;position:absolute;width:100%}.bc-support[aria-expanded=true] .bc-history-mobile{display:none}.bc-has-history{cursor:pointer}.bc-has-history:hover{background:var(--background-secondary)}}@media screen and (min-width:769px){.table-scroll{width:calc(100% + 6rem)}.bc-table tbody th{width:20%}}@media screen and (min-width:1200px){.table-scroll{margin:0;width:100%}.table-scroll-inner{padding:0}}.bcd-cell-text-wrapper{display:flex;gap:.5rem}@media screen and (min-width:769px){.bcd-cell-text-wrapper{align-items:center;flex-direction:column}}.bcd-cell-text-copy{color:var(--text-primary);display:flex;gap:.5rem}.bc-supports-yes .bcd-cell-text-copy{color:var(--text-primary-green)}.bc-supports-no .bcd-cell-text-copy{color:var(--text-primary-red)}.bc-supports-partial .bcd-cell-text-copy{color:var(--text-primary-yellow)}.bcd-cell-icons{display:flex;gap:.5rem}@media screen and (min-width:769px){.bcd-cell-icons{display:block}}.bc-notes-wrapper .bcd-cell-text-wrapper{flex-direction:row}@media screen and (min-width:769px){.bc-table td{height:2rem}.bc-table td.bc-support>button{padding:.5rem .25rem}}.container{margin-left:auto;margin-right:auto;max-width:var(--max-width);padding-left:var(--gutter);padding-right:var(--gutter);width:100%}.logo{align-items:center;display:flex}.logo svg{height:1.5rem;margin-top:.3rem}.dark .logo-text,.high-contrast-black .logo-text{fill:#fff}.auth-container .signin-link{align-items:center;display:inline-flex;font-weight:var(--font-body-strong-weight);height:2rem;text-align:center}.auth-container .signin-link:link,.auth-container .signin-link:visited{color:var(--text-secondary)}.mdn-plus-subscribe-link{--button-padding:1rem;margin:0 auto;max-width:150px;text-align:center;white-space:nowrap}.auth-container{display:flex;flex-flow:column-reverse;font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);gap:.5rem;list-style:none;margin-bottom:.5rem;padding:0;text-align:center}@media screen and (min-width:992px){.auth-container{align-items:center;flex-flow:row;gap:1rem;justify-content:flex-end;margin:0;text-align:left;text-align:initial;width:-webkit-min-content;width:min-content}}@media screen and (min-width:820px){.auth-container{width:auto}}.submenu{background-color:var(--background-primary);list-style:none;margin:0;padding:0}.submenu li{width:100%}.submenu .submenu-item,.submenu a{align-items:center;border:1px solid transparent;color:var(--text-primary);display:flex;height:100%;padding:.5rem;width:100%}li:last-child .submenu .submenu-item:not(:focus),li:last-child .submenu a:not(:focus){border-bottom-color:transparent}.submenu .submenu-item:hover,.submenu a:hover{background-color:var(--border-secondary);text-decoration:none}.main-menu .submenu .submenu-item:hover,.main-menu .submenu a:hover{background-color:var(--background-secondary)}.submenu .submenu-item:focus,.submenu a:focus{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--button-focus-effect)}.submenu .submenu-item .icon,.submenu a .icon{margin-right:.5rem}@media screen and (min-width:992px){.submenu.inline-submenu-lg{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-02);max-width:25rem;padding:.5rem;position:absolute;top:calc(100% + 4px);width:-webkit-max-content;width:max-content;z-index:var(--z-index-mid)}.main-menu .submenu.inline-submenu-lg{background-color:var(--background-primary)}.submenu.inline-submenu-lg .submenu-item{border-radius:var(--elem-radius);padding:.75rem}.submenu.inline-submenu-lg:before{content:"";display:block;height:8px;left:0;position:absolute;top:-8px;width:100%}}@media screen and (min-width:769px){.submenu:not(.inline-submenu-lg){background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-02);max-width:25rem;padding:.5rem;position:absolute;top:calc(100% + 4px);width:-webkit-max-content;width:max-content;z-index:var(--z-index-mid)}.main-menu .submenu:not(.inline-submenu-lg){background-color:var(--background-primary)}.submenu:not(.inline-submenu-lg) .submenu-item{border-radius:var(--elem-radius);padding:.75rem}.submenu:not(.inline-submenu-lg):before{content:"";display:block;height:8px;left:0;position:absolute;top:-8px;width:100%}}.submenu-header{display:block;padding:1rem}.submenu-header .submenu-item{padding:0}.submenu-header .submenu-item:hover{background:none}@media screen and (min-width:769px){.submenu-header{border-bottom:1px solid var(--border-primary)}}.submenu-icon{background-color:var(--icon-primary);height:2rem;margin-right:.75rem;position:relative;width:.2rem}.submenu-item,.submenu-item-heading{font-size:var(--type-smaller-font-size)}@media screen and (min-width:769px){.submenu-item-heading:not(:only-child),.submenu-item:not(:only-child){font-weight:var(--font-body-strong-weight)}}.submenu-item-description{display:none}@media screen and (min-width:769px){.submenu-item-description{display:block;font-size:var(--type-tiny-font-size);margin:.25rem 0 0}}.submenu-item-subtext{font-weight:var(--font-body-strong-weight)}.submenu-item-dot~.submenu-content-container>.submenu-item-heading:after{background:var(--text-primary-blue);border:1px solid var(--background-primary);border-radius:2rem;content:"";display:inline-block;height:.5rem;margin-left:.5rem;width:.5rem}.active-menu-item{background-color:var(--background-primary);border-color:var(--border-secondary)}.guides .submenu .submenu-item-heading{font-size:var(--type-smaller-font-size);font-weight:400}.guides .desktop-only{display:none}@media screen and (min-width:992px){.guides .desktop-only{display:inherit}.guides .mobile-only{display:none}}.references .desktop-only{display:none}@media screen and (min-width:992px){.references .desktop-only{display:inherit}.references .mobile-only{display:none}}.html-link-container a:focus .submenu-icon.html,.html-link-container a:hover .submenu-icon.html{background:var(--html-accent-color)!important}.css-link-container a:focus .submenu-icon.css,.css-link-container a:hover .submenu-icon.css{background-color:var(--css-accent-color)!important}.javascript-link-container a:focus .submenu-icon.javascript,.javascript-link-container a:hover .submenu-icon.javascript{background-color:var(--js-accent-color)!important}.http-link-container a:focus .submenu-icon.http,.http-link-container a:hover .submenu-icon.http{background-color:var(--http-accent-color)!important}.apis-link-container a:focus .submenu-icon.apis,.apis-link-container a:hover .submenu-icon.apis{background-color:var(--apis-accent-color)!important}.learn-link-container a:focus .submenu-icon.learn,.learn-link-container a:hover .submenu-icon.learn{background-color:var(--learn-accent-color)!important}.submenu-icon.html{background-color:var(--html-accent-engage)}.submenu-icon.css{background-color:var(--css-accent-engage)}.submenu-icon.javascript{background-color:var(--js-accent-engage)}.submenu-icon.http{background-color:var(--http-accent-engage)}.submenu-icon.apis{background-color:var(--apis-accent-engage)}.submenu-icon.learn{background-color:var(--learn-accent-engage)}.mdn-plus .submenu-icon{background-color:var(--plus-accent-color)}.mdn-plus .note{background-color:var(--background-information)}.mdn-plus .note .submenu-item-description{display:block;margin:.125rem}@media screen and (min-width:992px){.mdn-plus .mobile-only{display:none}}ul.main-menu{grid-gap:1rem;box-sizing:border-box;list-style:none;margin-top:1rem;padding:0;width:100%}ul.main-menu.show{display:block}@media screen and (min-width:992px){ul.main-menu.show{display:flex}ul.main-menu{align-items:center;display:flex;justify-content:space-around;margin:0 auto 0 0;max-width:310px}}@media screen and (min-width:992px){ul.main-menu li:last-child{flex-basis:inherit}ul.main-menu .menu-toggle,ul.main-menu .submenu,ul.main-menu .submenu.show{display:none}}@media screen and (min-width:992px){ul.main-menu .top-level-entry-container:focus-within .submenu,ul.main-menu .top-level-entry-container:hover .submenu{display:block}.open-on-focus-within:focus-within .watch-submenu{display:flex}.open-on-focus-within:focus-within .submenu{display:block}.open-on-focus-within .submenu,.open-on-focus-within .watch-submenu{display:none}}.avatar,.avatar-wrap{border-radius:50%}.avatar-wrap{height:32px;margin-left:-7px;margin-right:.1rem;position:relative;width:32px}@media screen and (min-width:769px){.avatar{margin:initial}}.signout-form{padding:.5rem}@media screen and (min-width:769px){.signout-form{border-top:1px solid var(--border-primary)}}button.signout-button{width:100%}button.signout-button:focus,button.signout-button:hover{background-color:var(--background-secondary)}.user-menu{position:relative}.user-menu .submenu-header{display:none}.user-menu .button.user-menu-toggle .notification-dot~.avatar-wrap:after{background:var(--text-primary-blue);border:1px solid var(--background-primary);border-radius:2rem;bottom:0;content:"";height:.5rem;position:absolute;right:0;width:.5rem}@media screen and (max-width:992px){.user-menu .user-menu-toggle:hover{--button-bg:transparent}}@media screen and (min-width:992px){.user-menu .button.user-menu-toggle:focus,.user-menu .button.user-menu-toggle:focus .button-wrap,.user-menu .button.user-menu-toggle:hover,.user-menu .button.user-menu-toggle:hover .button-wrap{background:transparent;border-color:transparent;box-shadow:none}.user-menu .button.user-menu-toggle:focus .avatar{border:1px solid var(--button-secondary-border-focus);box-shadow:var(--focus-effect)}.user-menu .button.user-menu-toggle:after{display:none}.user-menu .submenu-header{display:block;margin-bottom:.5rem;padding:0 0 .5rem}.user-menu .submenu-item{padding:.5rem}.user-menu .signout-container{margin-top:.5rem}.user-menu .user-menu-id{display:none}.user-menu .submenu{left:auto;max-width:-webkit-max-content;max-width:max-content;right:0}}.dropdown{position:relative}.dropdown-list{background:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);left:0;padding:.5rem;position:absolute;top:calc(100% + 2px);z-index:var(--z-index-low)}.dropdown.is-flush-right .dropdown-list{left:auto;right:0}.dropdown-item .button.action{width:100%}.dropdown-item .button.action .button-wrap{--button-font:var(--type-smaller-font-size);--button-bg:transparent;justify-content:flex-start;text-align:left;text-transform:none}.dropdown-item .button.action .button-wrap:hover{--button-bg:var(--button-secondary-hover)}.dropdown-item .button.action.active-menu-item{--button-bg:var(--background-primary);--button-border-color:var(--border-secondary)}.top-navigation-main{display:none;justify-content:space-between;padding:0;width:100%}.show-nav .top-navigation-main{display:flex;flex-direction:column}.top-navigation-main .auth-container{order:0}.top-navigation-main .header-search{order:1}.top-navigation-main .main-nav{order:2}.top-navigation-main .notifications-menu{order:3}.top-navigation-main .user-menu{order:4}.top-navigation-main .top-level-entry-container{position:relative}.top-navigation-main .top-level-entry-container .submenu{z-index:var(--z-index-nav-menu)}.top-navigation-main .theme-toggle{align-self:end;margin-bottom:1.5rem}@media screen and (min-width:992px){.top-navigation-main .theme-toggle{align-self:auto;margin-bottom:0}}.top-navigation-main .button.action:hover{--button-bg:var(--border-secondary)}.is-transparent .top-navigation-main .button.action:not(:focus):hover{--button-border-color:transparent}.is-transparent .top-navigation-main .button.action:hover{--button-bg:var(--accent-primary-engage)}.top-navigation-main .button.action.search-button:hover{--button-bg:transparent}.top-navigation-main .top-level-entry{background:none;border-top:1px solid var(--border-secondary);color:var(--text-secondary);cursor:pointer;display:block;padding:1rem .5rem;text-align:left;width:100%}.top-navigation-main .top-level-entry:link,.top-navigation-main .top-level-entry:visited{color:var(--text-secondary)}.top-navigation-main .top-level-entry.menu-toggle{min-height:53px;padding:.5rem}@media screen and (max-width:992px){.top-navigation-main .top-level-entry.button{--button-color:var(--text-secondary);--button-padding:0;--button-radius:0}.top-navigation-main .top-level-entry.button .button-wrap{background:none;border:none;gap:.5rem;justify-content:flex-start;padding:0;text-transform:none}.top-navigation-main .top-level-entry.button:focus{--button-focus-effect:none}}@media screen and (min-width:992px){.top-navigation-main .top-level-entry{border-radius:var(--elem-radius);border-top:none;padding:.5rem}.top-navigation-main .top-level-entry:focus,.top-navigation-main .top-level-entry:hover{background-color:var(--category-color-background);color:var(--category-color);text-decoration:none}.top-navigation-main .top-level-entry.button{padding:0}}.top-navigation-main .menu-toggle{align-items:center;display:flex;justify-content:space-between;position:relative}.top-navigation-main .menu-toggle:after{background-color:var(--icon-primary);content:"";height:var(--icon-size);margin-left:.2em;margin-top:.2em;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);width:var(--icon-size)}.top-navigation-main .menu-toggle[aria-expanded=true]:after{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.top-navigation-main .menu-toggle+.top-level-entry{display:none}@media screen and (min-width:992px){.top-navigation-main{align-items:center;display:flex;flex:1 1;flex-direction:row;gap:.5rem;left:inherit;padding:0;position:static;top:inherit;z-index:inherit}.show-nav .top-navigation-main{flex-direction:row}.top-navigation-main .main-nav{order:0}.top-navigation-main .header-search{order:1}.top-navigation-main .notifications-menu{order:2}.top-navigation-main .auth-container{order:3}.top-navigation-main .user-menu{order:4}.top-navigation-main .main-nav{margin-right:auto;width:-webkit-max-content;width:max-content}.top-navigation-main .menu-toggle+.top-level-entry{display:inline-flex}}.theme-switcher-menu{margin-bottom:.5rem}.theme-switcher-menu .button.action>.button-wrap{text-transform:none}.theme-switcher-menu .themes-menu .button.button{--button-bg:transparent;--button-border-color:var(--button-bg);--button-color:var(--text-primary);border-bottom-width:0;font-size:var(--type-smaller-font-size);width:100%}.theme-switcher-menu .themes-menu .button.button .button-wrap{border-width:1px;font-weight:400;justify-content:flex-start;padding:1rem}.theme-switcher-menu .themes-menu .button.button:focus{--button-border-color:var(--button-secondary-border-focus)}.theme-switcher-menu .themes-menu .button.button:hover{--button-bg:var(--border-secondary)}.theme-switcher-menu .active-menu-item .button-wrap,.theme-switcher-menu .active-menu-item:hover .button-wrap{--button-bg:var(--background-primary);--button-border-color:var(--border-secondary)}.theme-switcher-menu .active-menu-item:focus .button-wrap{--button-border-color:var(--button-secondary-border-focus)}@media screen and (min-width:769px){.theme-switcher-menu{border-bottom:0;margin-bottom:0}.theme-switcher-menu .themes-menu{top:calc(100% - 1rem)}.theme-switcher-menu .themes-menu.show{display:flex;flex-direction:column;gap:.5rem;max-width:-webkit-max-content;max-width:max-content;min-width:130px}.theme-switcher-menu .themes-menu .submenu-item{padding:.5rem 1rem}}.languages-switcher-menu>.button .button-wrap:after,.theme-switcher-menu>.button .button-wrap:after{background-color:var(--icon-secondary);content:"";display:block;height:16px;margin-left:auto;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);-webkit-mask-size:16px;mask-size:16px;width:16px}.languages-switcher-menu>.button[aria-expanded=true] .button-wrap:after,.theme-switcher-menu>.button[aria-expanded=true] .button-wrap:after{-webkit-transform:rotate(180deg);transform:rotate(180deg)}@media screen and (min-width:992px){.languages-switcher-menu>.button .button-wrap:after,.theme-switcher-menu>.button .button-wrap:after{content:normal}}.maintenance{color:var(--text-primary);cursor:help;flex-flow:column}.maintenance .maintenance-info-container{cursor:default;display:block;margin:0 1rem;top:2rem}@media screen and (min-width:992px){.maintenance .maintenance-info-container{padding-top:1rem;position:absolute}}.maintenance .maintenance-info-container .maintenance-info{background-color:var(--background-primary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);font-weight:400;padding:1rem}@media screen and (min-width:992px){.maintenance:not(:focus-within):not(:hover) .maintenance-info-container{clip:rect(1px,1px,1px,1px)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}}.top-navigation{background-color:var(--background-primary);border-bottom:1px solid var(--border-primary);position:relative;width:100%;z-index:100}.top-navigation .container{align-items:center;background-color:var(--background-primary);display:flex;flex-flow:row wrap;gap:var(--gutter)}@media screen and (min-width:769px){.top-navigation .container{background-color:transparent}}.top-navigation.is-transparent{background-color:transparent}.top-navigation .top-navigation-wrap{align-items:center;display:flex;flex:1 1;height:var(--top-nav-height);justify-content:space-between}.top-navigation.show-nav{box-shadow:0 0 10px 0 rgba(0,0,0,.2);z-index:var(--z-index-top)}.top-navigation.show-nav .container{height:auto}@media screen and (min-width:992px){.main-menu-toggle{display:none}.top-navigation .top-navigation-wrap{flex:0 1}}.breadcrumbs-container{align-items:center;display:flex;margin-right:auto}.breadcrumbs-container ol{line-height:1.2}.breadcrumbs-container li{display:none;-webkit-hyphens:auto;hyphens:auto}.breadcrumbs-container li:first-child,.breadcrumbs-container li:last-child{display:inline-flex}.breadcrumbs-container li .breadcrumb:after{background-color:var(--icon-secondary);content:"";display:block;flex-shrink:0;height:12px;margin-right:.5rem;-webkit-mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);mask-image:url(/static/media/chevron.05a124d379047e16d746.svg);-webkit-mask-size:12px;mask-size:12px;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);width:12px}.breadcrumbs-container li a{align-items:center;display:flex}.breadcrumbs-container li a:link,.breadcrumbs-container li a:visited{color:var(--text-secondary)}.breadcrumbs-container li a:hover{text-decoration:underline}.breadcrumbs-container li a:focus-visible{outline:0}.breadcrumbs-container li a:focus-visible [property=name]{outline-color:var(--accent-primary);outline-offset:1px;outline-style:auto}.breadcrumbs-container li [property=name]{display:inline-block;margin-right:.5rem}@media screen and (min-width:1200px){.breadcrumbs-container li{display:inline-flex}}.watch-menu-item{background-color:transparent;border-bottom:1px solid var(--border-primary);color:var(--text-primary);cursor:pointer;padding:0}.watch-menu-item:first-of-type{border-top-width:0}.watch-menu-item-inner{grid-gap:.5rem;display:grid;gap:.5rem;grid-template-areas:"status label""status text";grid-template-columns:16px 1fr;padding:.8125rem var(--gutter-padding);text-align:left}.watch-menu-item:focus .watch-menu-item-inner{box-shadow:var(--focus-effect);outline:1px solid var(--button-secondary-border-focus)}.watch-menu-item:hover .watch-menu-item-inner{background-color:var(--border-secondary)}.watch-menu-item-status{grid-area:status}.watch-menu-item-label{font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);grid-area:label}.watch-menu-item-text{font-size:var(--type-smaller-font-size);grid-area:text}.toast{--toast-bg:var(--text-primary);--toast-color:var(--background-primary);background:var(--toast-bg);border-radius:var(--elem-radius);bottom:1rem;box-shadow:var(--shadow-02);display:flex;gap:.5rem;left:50%;max-width:680px;padding:1rem 1rem 1rem 2rem;position:fixed;-webkit-transform:translate(-50%);transform:translate(-50%);width:90vw}.toast-content{color:var(--toast-color);margin-right:auto}.toast .button.action{--button-color:var(--toast-color);white-space:nowrap}.toast .button.action:hover{--button-bg:rgba(58,57,68,.3);--button-border-color:transparent}.toast.is-important{--toast-bg:var(--accent-secondary);--toast-color:#fff}.toast-verbose-text{display:none}@media screen and (min-width:769px){.toast-verbose-text{display:inline}.toast-short-text{display:none}}.languages-switcher-menu.open-on-focus-within .submenu{display:block}.language-menu .submenu-item{padding:.5rem}@media(min-width:769px){.language-menu{right:0}}.article-actions{margin-left:auto}.article-actions .article-actions-dialog-heading{display:none}.article-actions .button.action .button-wrap{text-transform:none}@media screen and (min-width:769px){.article-actions{display:block}}.article-actions .article-actions-submenu{--gutter-padding:1rem;display:none;overflow:scroll}.article-actions .article-actions-submenu.show{background:var(--background-primary);bottom:0;display:flex;flex-direction:column;left:0;position:fixed;right:0;top:var(--top-navigation-height);z-index:var(--z-index-mid)}.article-actions .article-actions-submenu .header{border-bottom:1px solid var(--border-primary);color:var(--text-primary);display:block;font-family:var(--font-body);font-size:var(--type-smaller-font-size);font-weight:var(--font-body-strong-weight);margin:0;padding:1rem;text-align:left;width:100%}.article-actions .article-actions-submenu .header .header-inner{align-items:center;display:flex;gap:.5rem;position:relative}.article-actions .article-actions-submenu .header .icon{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.article-actions .article-actions-submenu .header.desktop-only{display:none}.article-actions .article-actions-submenu .mdn-form-item,.article-actions .article-actions-submenu p{margin:0;padding:1rem 1rem 0}.article-actions .article-actions-submenu .mdn-form-item:last-child,.article-actions .article-actions-submenu p:last-child{padding-bottom:1rem}@media screen and (min-width:769px){.article-actions .article-actions-submenu.show{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);bottom:auto;box-shadow:var(--shadow-02);left:auto;padding:0;position:absolute;right:0;top:calc(100% + 6px);width:316px;z-index:var(--z-index-mid)}.article-actions .article-actions-submenu .header{display:block;padding:1rem var(--gutter-padding);text-align:center}.article-actions .article-actions-submenu .header-inner{justify-content:center}.article-actions .article-actions-submenu .header.desktop-only{display:block}.article-actions .article-actions-submenu .header.mobile-only{display:none}.article-actions .article-actions-submenu .header .icon{left:0;position:absolute}}.article-actions-entries{display:none;list-style:none;margin:0;padding:0}@media screen and (min-width:769px){.article-actions-entries{display:flex;gap:.5rem}.article-actions-entries .sidebar-toggle{display:none}}.article-actions-entry{align-items:center;display:flex;position:relative}@media screen and (max-width:769px){.article-actions.show-actions{-webkit-overflow-scrolling:touch;background-color:var(--background-primary);color:var(--text-primary);display:block;height:100vh;left:0;overflow:auto;position:fixed;top:var(--top-navigation-height);width:100vw;z-index:var(--z-index-low)}.article-actions.show-actions .article-actions-entries>li>.button,.article-actions.show-actions .article-actions-entries>li>div>.button,.article-actions.show-actions>.button{--button-radius:0;border-bottom:1px solid var(--border-secondary);width:100%}.article-actions.show-actions .article-actions-entries>li>.button .button-wrap,.article-actions.show-actions .article-actions-entries>li>div>.button .button-wrap,.article-actions.show-actions>.button .button-wrap{justify-content:flex-start;margin-top:1px;padding:1.5rem 1rem}.article-actions.show-actions .article-actions-dialog-heading{display:block}.article-actions.show-actions .article-actions-entries{display:block;padding:1rem}.article-actions.show-actions .article-action-entry,.article-actions.show-actions .article-actions-toggle{border-bottom:1px solid var(--border-secondary)}.article-actions.show-actions .article-actions-entry{display:block}}.article-actions-container{align-items:center;background-color:var(--background-secondary);border-bottom:1px solid var(--border-primary);margin:0;min-height:2rem;padding:0;position:-webkit-sticky;position:sticky;top:0;z-index:var(--z-index-low)}.article-actions-container .container{align-items:center;display:flex;gap:.5rem;justify-content:space-between}.article-actions-container .sidebar-button{display:none}@media screen and (max-width:769px){.article-actions-container .sidebar-button{align-items:center;align-self:stretch;display:flex;margin:0 0 0 -1rem}.article-actions-container .sidebar-button .button-wrap{border-radius:0;border-right:1px solid var(--border-primary)}}@media screen and (min-width:769px){.article-actions-container{position:static}.article-actions-container .article-actions-toggle{display:none}.article-actions-container .bookmark-button-container{flex:0 0 40px}}@media screen and (min-width:1441px){.article-actions-container .container{padding-left:1rem;padding-right:1rem}}@media screen and (max-width:769px){:root{--sticky-header-height:2rem}}.offline-status-bar{background-color:var(--accent-primary-engage);color:var(--text-primary);display:none}.offline-status-bar.is-offline,.offline-status-bar.is-online{display:block;padding:1rem;text-align:center}.offline-status-bar.is-online{-webkit-animation:fade-out 3s ease-out .5s;animation:fade-out 3s ease-out .5s}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.document-toc{margin-bottom:2rem;padding:0;position:relative}@media screen and (max-width:426px){.document-toc{padding:0 1rem}}.document-toc-heading.document-toc-heading{font:var(--type-heading-h5);letter-spacing:1.5px;margin:0 0 1rem}.document-toc-list.document-toc-list{font-size:var(--type-smaller-font-size);list-style:none;padding-left:0}.document-toc-list.document-toc-list li{margin:0}.document-toc-link.document-toc-link:not(.button){border-left:2px solid var(--border-secondary);color:var(--text-secondary);display:block;padding:.5rem 1rem;text-decoration:none}.document-toc-link.document-toc-link:not(.button):hover{color:var(--text-link)}.document-toc-link.document-toc-link:not(.button)[aria-current]:not([aria-current=""]):not([aria-current=false]){background-color:var(--background-toc-active);border-left:2px solid var(--category-color);color:var(--text-primary);font-weight:600}.document-toc-item-sub>.document-toc-link:not(.button){padding-left:2rem}.document-toc .show-toc{display:block}.sidebar{--offset:var(--main-document-header-height);--max-height:calc(100vh - var(--offset));color:var(--text-secondary)}.sidebar .backdrop{display:none}@media screen and (max-width:768px){.sidebar{height:100vh;left:0;max-height:100vh;position:fixed;right:0}.sidebar,.sidebar .sidebar-inner{-webkit-transform:translateX(-100%);transform:translateX(-100%);z-index:var(--z-index-top)}.sidebar .sidebar-inner{background:var(--background-primary);border-right:1px solid var(--border-primary);height:var(--max-height);max-height:var(--max-height);max-width:20rem;overflow:hidden;overflow:auto;padding:1rem;position:relative;transition:transform .2s linear;width:80vw;will-change:transform}.sidebar .backdrop{background:rgba(0,0,0,.3);border-radius:0;bottom:0;cursor:default;display:flex;left:0;opacity:0;position:fixed;right:0;top:0;transition:opacity .2s linear;width:100%;will-change:opacity;z-index:var(--z-index-mid)}.sidebar.is-animating,.sidebar.is-expanded,.sidebar.is-expanded .sidebar-inner{-webkit-transform:translateX(0);transform:translateX(0)}.sidebar.is-expanded .backdrop{opacity:1}}@media screen and (min-width:769px){.sidebar{display:flex;max-height:var(--max-height);overflow:auto;position:-webkit-sticky;position:sticky;top:var(--offset)}}.sidebar-heading{color:var(--text-primary);font:var(--type-heading-h5);letter-spacing:1.5px;margin:0}.sidebar em{background-color:var(--background-toc-active);border-left:2px solid var(--category-color);display:inline-block;font-style:normal;font-weight:600;padding:.25rem .25rem .25rem .5rem;width:100%}.sidebar a,.sidebar em{-webkit-hyphens:auto;hyphens:auto}.sidebar a{color:var(--text-secondary);display:inline-flex;padding:.25rem}.sidebar a:focus,.sidebar a:hover{text-decoration:underline}.sidebar .no-link{display:inline-flex;padding:.25rem}.sidebar strong{display:flex;font-size:var(--type-base-font-size-rem);margin-top:1rem}.sidebar ol{font-size:var(--type-smaller-font-size)}.sidebar ol ol,.sidebar ol ul{padding-left:.5rem}.sidebar ol ol li .icon{margin-right:.01em}.sidebar ol ol li.no-bullet{display:block;font-weight:var(--font-body-strong-weight);list-style-type:none}.sidebar .sidebar-heading~div>ol,.sidebar .sidebar-heading~ol{margin-top:1rem}.sidebar li,.sidebar summary{margin-bottom:.5rem}.sidebar code,.sidebar summary{font-size:var(--type-smaller-font-size)}.sidebar code{word-wrap:break-word;background-color:transparent;background-color:initial;border-radius:var(--elem-radius);font-family:var(--font-code);line-height:1.2;padding:.125rem;white-space:normal}.sidebar summary{cursor:pointer}.sidebar details{margin:.75rem 0}.sidebar details ol{padding-left:.75rem}.sidebar .icon{align-self:center;background-size:14px;height:14px;margin-right:-.25rem;-webkit-mask-size:14px;mask-size:14px;width:14px}.sidebar .icon-experimental,.sidebar .icon-nonstandard{background-color:var(--icon-information)}.sidebar .icon-deprecated{background-color:var(--icon-critical)}.main-content.standalone{margin:0 auto;max-width:var(--max-width);width:100%}.main-page-content .metadata{background-color:var(--background-secondary);border:1px solid var(--border-primary);border-radius:var(--elem-radius);box-shadow:var(--shadow-01);margin:2rem 0;padding:1rem}.main-page-content .metadata h3{font:var(--type-heading-h4);margin-top:.5rem;padding:0}.metadata-content-container{margin:0 auto;max-width:1440px;width:100%}.metadata-content-container .last-modified-date{margin-bottom:0}:root,body{--mdn-color-white:#fff;--mdn-color-black:#000;--mdn-color-dark-grey:#4e4e4e;--mdn-background-dark:#1b1b1b;--mdn-background-light:#fff;--mdn-background-light-grey:#e2e2e2;--color-announcement-banner-accent:#ff6d91}.light{--text-primary:#1b1b1b;--text-secondary:#4e4e4e;--text-inactive:#9e9e9ea6;--text-link:#0069c2;--text-invert:#fff;--background-primary:#fff;--background-secondary:#f9f9fb;--background-tertiary:#fff;--background-toc-active:#ebeaea;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#cdcdcd;--border-secondary:#cdcdcd;--button-primary-default:#1b1b1b;--button-primary-hover:#696969;--button-primary-active:#9e9e9e;--button-primary-inactive:#1b1b1b;--button-secondary-default:#fff;--button-secondary-hover:#cdcdcd;--button-secondary-active:#cdcdcd;--button-secondary-inactive:#f9f9fb;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#696969;--icon-secondary:#b3b3b3;--icon-information:#0085f2;--icon-warning:#ff2a51;--icon-critical:#d30038;--icon-success:#007936;--accent-primary:#0085f2;--accent-primary-engage:rgba(0,133,242,.1);--accent-secondary:#0085f2;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(43,42,51,.05);--shadow-02:0 1px 6px rgba(43,42,51,.1);--focus-01:0 0 0 3px rgba(0,144,237,.4);--field-focus-border:#0085f2;--code-token-tag:#0069c2;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#d30038;--code-token-attribute-value:#007936;--code-token-comment:#9e9e9e;--code-token-default:#1b1b1b;--code-token-selector:#872bff;--code-background-inline:#f2f1f1;--code-background-block:#f2f1f1;--notecard-link-color:#343434;--scrollbar-bg:transparent;--scrollbar-color:rgba(0,0,0,.25);--category-color:#0085f2;--category-color-background:#0085f210;--code-color:#5e9eff;--mark-color:#dce2f2;--plus-accent-color:#d30038;--html-accent-color:#d30038;--css-accent-color:#0069c2;--js-accent-color:#afa100;--http-accent-color:#007936;--apis-accent-color:#872bff;--learn-accent-color:#d00058;--plus-code-color:#0069c2;--html-code-color:#9e0027;--css-code-color:#0069c2;--js-code-color:#746a00;--http-code-color:#007936;--apis-code-color:#872bff;--learn-code-color:#d00058;--plus-mark-color:#ffd9dc;--html-mark-color:#ffd9dc;--css-mark-color:#dce2f2;--js-mark-color:#f0e498;--http-mark-color:#a9f3ba;--apis-mark-color:#e6deff;--learn-mark-color:#ffd9df;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,42,81,.7);--html-accent-engage:rgba(255,42,81,.7);--css-accent-engage:rgba(0,133,242,.7);--js-accent-engage:rgba(147,135,0,.7);--http-accent-engage:rgba(0,154,70,.7);--apis-accent-engage:rgba(155,101,255,.7);--learn-accent-engage:rgba(255,31,114,.7);--modal-backdrop-color:rgba(27,27,27,.1);--blend-color:#fff80;--text-primary-red:#d30038;--text-primary-green:#007936;--text-primary-blue:#0069c2;--text-primary-yellow:#746a00;color-scheme:light}.dark{--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#35bdb8;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}@media(prefers-color-scheme:light){:root:not(.light):not(.dark){--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#8cb4ff;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}}@media(prefers-color-scheme:dark){:root:not(.light):not(.dark){--text-primary:#fff;--text-secondary:#cdcdcd;--text-inactive:#cdcdcda6;--text-link:#8cb4ff;--text-invert:#1b1b1b;--background-primary:#1b1b1b;--background-secondary:#343434;--background-tertiary:#4e4e4e;--background-toc-active:#343434;--background-mark-yellow:rgba(199,183,0,.4);--background-mark-green:rgba(0,208,97,.4);--background-information:rgba(0,133,242,.1);--background-warning:rgba(255,42,81,.1);--background-critical:rgba(211,0,56,.1);--background-success:rgba(0,121,54,.1);--border-primary:#858585;--border-secondary:#696969;--button-primary-default:#fff;--button-primary-hover:#cdcdcd;--button-primary-active:#9e9e9e;--button-primary-inactive:#fff;--button-secondary-default:#4e4e4e;--button-secondary-hover:#858585;--button-secondary-active:#9e9e9e;--button-secondary-inactive:#4e4e4e;--button-secondary-border-focus:#0085f2;--button-secondary-border-red:#ff97a0;--button-secondary-border-red-focus:#ffd9dc;--icon-primary:#fff;--icon-secondary:#b3b3b3;--icon-information:#5e9eff;--icon-warning:#afa100;--icon-critical:#ff707f;--icon-success:#00b755;--accent-primary:#5e9eff;--accent-primary-engage:rgba(94,158,255,.1);--accent-secondary:#5e9eff;--accent-tertiary:rgba(0,133,242,.1);--shadow-01:0 1px 2px rgba(251,251,254,.2);--shadow-02:0 1px 6px rgba(251,251,254,.2);--focus-01:0 0 0 3px rgba(251,251,254,.5);--field-focus-border:#fff;--code-token-tag:#c1cff1;--code-token-punctuation:#9e9e9e;--code-token-attribute-name:#ff97a0;--code-token-attribute-value:#00d061;--code-token-comment:#9e9e9e;--code-token-default:#fff;--code-token-selector:#bea5ff;--code-background-inline:#343434;--code-background-block:#343434;--notecard-link-color:#e2e2e2;--scrollbar-bg:transparent;--scrollbar-color:hsla(0,0%,100%,.25);--category-color:#8cb4ff;--category-color-background:#8cb4ff70;--code-color:#c1cff1;--mark-color:#004d92;--plus-accent-color:#ff97a0;--html-accent-color:#ff707f;--css-accent-color:#8cb4ff;--js-accent-color:#afa100;--http-accent-color:#00b755;--apis-accent-color:#ae8aff;--learn-accent-color:#ff6d91;--plus-code-color:#c1cff1;--html-code-color:#f9f9fb;--css-code-color:#c1cff1;--js-code-color:#c7b700;--http-code-color:#00d061;--apis-code-color:#bea5ff;--learn-code-color:#ff93aa;--plus-mark-color:#9e0027;--html-mark-color:#9e0027;--css-mark-color:#004d92;--js-mark-color:#564e00;--http-mark-color:#005a26;--apis-mark-color:#6800cf;--learn-mark-color:#9e0041;--plus-accent-background-color:#ff2a5130;--html-accent-background-color:#ff2a5130;--css-accent-background-color:#0085f230;--js-accent-background-color:#93870030;--http-accent-background-color:#009a4630;--apis-accent-background-color:#9b65ff30;--learn-accent-background-color:#ff1f7230;--plus-accent-engage:rgba(255,112,127,.7);--html-accent-engage:rgba(255,112,127,.7);--css-accent-engage:rgba(140,180,255,.7);--js-accent-engage:rgba(175,161,0,.7);--http-accent-engage:rgba(0,183,85,.7);--apis-accent-engage:rgba(174,138,255,.7);--learn-accent-engage:rgba(255,109,145,.7);--modal-backdrop-color:rgba(27,27,27,.7);--blend-color:#00080;--text-primary-red:#ff97a0;--text-primary-green:#00d061;--text-primary-blue:#8cb4ff;--text-primary-yellow:#c7b700;color-scheme:dark}}.document-page .article-actions-container,.document-page .document-toc-container,.document-page .generic-loading,.document-page .main-content,.document-page .metadata,.document-page .page-header,.document-page .sidebar{display:flex}.document-page .main-content,.document-page .sidebar{flex-direction:column;width:100%}.main-wrapper{display:flex;margin:0 auto;max-width:var(--max-width)}.main-wrapper .toc{display:none}@media screen and (min-width:769px){.main-wrapper{grid-gap:3rem;display:grid;gap:3rem;padding-left:1.5rem;padding-right:3rem}.main-wrapper .main-content,.main-wrapper .sidebar,.main-wrapper .toc{padding-bottom:3rem;padding-top:3rem}.main-wrapper .sidebar{align-self:start;grid-area:sidebar}.main-wrapper .main-content{grid-area:main}}@media screen and (min-width:1200px){.main-wrapper{grid-gap:3rem;display:grid;gap:3rem;padding-left:1rem;padding-right:1rem}.main-wrapper .toc{--offset:var(--main-document-header-height);--max-height:calc(100vh - var(--offset));display:block;grid-area:toc;max-height:var(--max-height);overflow:auto;position:-webkit-sticky;position:sticky;top:var(--offset)}.main-wrapper .in-nav-toc{display:none}}.page-wrapper{grid-template-columns:100%}.standard-page{max-width:inherit}@font-face{font-display:swap;font-family:Inter;font-stretch:75% 100%;font-style:oblique 0 20deg;font-weight:1 999;src:url(/website/fonts/Inter.var.woff2) format("woff2 supports variations"),url(/website/fonts/Inter.var.woff2) format("woff2-variations")}:root{--sticky-header-height:var(--main-document-header-height)}.main-document-header-container{position:-webkit-sticky;position:sticky;top:0;z-index:var(--z-index-top)}.main-page-content{overflow-wrap:break-word;padding:3rem 1rem 1rem}.main-page-content h1 a:link,.main-page-content h1 a:visited,.main-page-content h2 a:link,.main-page-content h2 a:visited,.main-page-content h3 a:link,.main-page-content h3 a:visited,.main-page-content h4 a:link,.main-page-content h4 a:visited,.main-page-content h5 a:link,.main-page-content h5 a:visited,.main-page-content h6 a:link,.main-page-content h6 a:visited{color:var(--text-primary);text-decoration:none}.main-page-content h1 a:focus,.main-page-content h1 a:hover,.main-page-content h2 a:focus,.main-page-content h2 a:hover,.main-page-content h3 a:focus,.main-page-content h3 a:hover,.main-page-content h4 a:focus,.main-page-content h4 a:hover,.main-page-content h5 a:focus,.main-page-content h5 a:hover,.main-page-content h6 a:focus,.main-page-content h6 a:hover{text-decoration:underline}.main-page-content h1 a:active,.main-page-content h2 a:active,.main-page-content h3 a:active,.main-page-content h4 a:active,.main-page-content h5 a:active,.main-page-content h6 a:active{background-color:transparent}.main-page-content h1 a[href^="#"]:hover:after,.main-page-content h2 a[href^="#"]:hover:after,.main-page-content h3 a[href^="#"]:hover:after,.main-page-content h4 a[href^="#"]:hover:after,.main-page-content h5 a[href^="#"]:hover:after,.main-page-content h6 a[href^="#"]:hover:after{color:var(--text-inactive);content:"#";display:inline-flex;font-size:.7em;line-height:1;margin-left:4px;text-decoration:none}.main-page-content h1:after{-webkit-text-decoration-color:var(--category-color);text-decoration-color:var(--category-color)}.main-page-content h2:first-of-type{margin-top:2rem}.main-page-content a:not(.button){color:var(--text-link);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.main-page-content a:not(.button):active{background-color:var(--text-link);color:#fff}.main-page-content a:not(.button):active code{background-color:transparent;color:#fff}.main-page-content a:not(.button)[id^=attr-]:link,.main-page-content a:not(.button)[id^=attr-]:visited{color:var(--text-link);text-decoration:none}.main-page-content a:not(.button)[id^=attr-]:focus,.main-page-content a:not(.button)[id^=attr-]:hover{text-decoration:underline}.main-page-content a:not(.button)[id^=attr-]:active{color:#fff}.main-page-content a:not(.button)[aria-current]{color:var(--text-link);font-weight:var(--font-body-strong-weight);text-decoration:none}.main-page-content img{background:#fff;border:1px solid var(--border-primary)!important;border-radius:var(--elem-radius);display:inline-block;display:flex;height:auto;margin:2rem auto}.main-page-content ol,.main-page-content ul{margin:1rem 0 2rem;padding-left:2rem}.main-page-content ol li,.main-page-content ul li{margin:.5rem 0}.main-page-content ul{list-style:disc}.main-page-content ul ul{list-style-type:circle;margin:0;padding-left:1rem}.main-page-content ol{list-style:decimal}.main-page-content ol ol{list-style:lower-roman;margin:0}.main-page-content dd ol,.main-page-content dd ul{margin-bottom:1rem;padding-left:3rem}.main-page-content td ol,.main-page-content td ul{padding-left:1rem}.main-page-content dd li{margin-bottom:1rem}.main-page-content td li{margin-bottom:.5rem}.main-page-content dl dt{margin-bottom:.5rem;margin-top:2rem}.main-page-content dl dd{margin-bottom:1rem;margin-left:1rem}.main-page-content dl dd .notecard p{padding-left:0}.main-page-content dl p{margin:0 0 1rem}.main-page-content .section-content p{font:var(--type-article-p)}.main-page-content .section-content p:last-child{margin-bottom:2rem}.main-page-content .section-content figure{margin-bottom:1rem}.main-page-content .section-content .prev-next{display:flex;gap:.5rem;justify-content:space-between;list-style:none;margin:1rem 0;padding:0;text-align:center}.main-page-content .section-content .prev-next li{display:flex;margin:0}.main-page-content .section-content .prev-next .button{margin:0;max-width:inherit}.main-page-content .section-content .prev-next .button-wrap{color:inherit}@media screen and (min-width:426px){.main-page-content{padding:3rem}}@media screen and (min-width:769px){.main-page-content{margin-bottom:.5rem;padding:0}}b,strong{font-weight:var(--font-body-strong-weight);letter-spacing:.02rem}table{border:1px solid var(--border-primary);border-collapse:collapse;width:100%}table th{background:var(--background-tertiary);font-weight:var(--font-body-strong-weight);line-height:1.5;text-align:left}table td,table th{border:1px solid var(--border-primary);padding:.5rem .75rem;vertical-align:middle}table td .code-example pre,table td ul{margin:0}table caption{font-weight:var(--font-body-strong-weight);margin:1rem 0 .5rem}table.properties{border:none;font-size:var(--type-base-font-size)}table.properties td,table.properties th{border:none}table.properties th{background:none}table.properties tr{border-bottom:1px solid var(--border-secondary)}table.properties tr:first-child{border-top:1px solid var(--border-primary)}table.properties tr:last-child{border-bottom:1px solid var(--border-primary)}table.properties tr:nth-child(odd) td,table.properties tr:nth-child(odd) th,table.standard-table tr:nth-child(odd) td,table.standard-table tr:nth-child(odd) th{background-color:var(--background-secondary)}iframe{border:1px solid var(--border-primary);max-width:100%;width:100%}iframe.nobutton,iframe.sample-code-frame,iframe[src*="https://jsfiddle.net"],iframe[src*="https://mdn.github.io"],iframe[src*="https://test262.report"],iframe[src*="https://www.youtube-nocookie.com"]{background:#fff;border:1px solid var(--border-primary);border-radius:var(--elem-radius);width:100%}h1,h2,h3{letter-spacing:var(--heading-letter-spacing)}h1{font:var(--type-heading-h1);margin-bottom:2rem;word-break:break-word}@media screen and (min-width:769px){h1{font:var(--type-heading-h1)}}h2{font:var(--type-heading-h2);margin:4rem 0 .5rem}h3{font:var(--type-heading-h3);margin:2rem 0 .5rem}h2~div~h3,h2~h3{margin-top:1rem}h4{font:var(--type-heading-h4);letter-spacing:.5px;margin:2rem 0 1rem}h5{font:var(--type-heading-h5)}h5,h6{letter-spacing:1.5px;margin:2rem 0 1rem;text-transform:uppercase}h6{font:var(--type-heading-h6)}h1 code,h2 code,h3 code,h4 code,h5 code,h6 code{font-size:inherit}p{margin:1rem 0 2rem}blockquote{border-left:4px solid var(--border-secondary);color:var(--text-secondary);margin-bottom:2rem;padding:1rem 2rem}blockquote p{margin:0}.code-example,code,pre{border-radius:var(--elem-radius);font-size:var(--type-base-font-size-rem)}code{background:var(--code-background-inline);padding:.125rem .25rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}pre{background-color:var(--code-background-block);border:1px solid transparent;margin:1rem 0 2rem;padding:1rem 2.5rem 1rem 1rem}pre code{background:none;color:var(--text-primary);padding:0}.badge{border:1px solid var(--border-primary);border-radius:4rem;font-size:var(--type-tiny-font-size);padding:.125rem .375rem;white-space:nowrap}.badge,kbd{color:var(--text-secondary)}kbd{border:2px solid var(--border-secondary);border-radius:var(--elem-radius);box-shadow:var(--border-secondary);box-shadow:inset 0 -1px 0 0 var(--border-secondary);font-size:.825rem;padding:.25rem} \ No newline at end of file diff --git a/public/mstile-150x150.png b/public/mstile-150x150.png new file mode 100644 index 0000000000000000000000000000000000000000..7615e12a249bf2ccc563c516c6f9dccd1b6de6e5 GIT binary patch literal 536 zcmeAS@N?(olHy`uVBq!ia0y~yVB`Z~7G|JG*Ze2bfD}u*qpu?a!^VE@KZ&eBzCyA` zkS_y6l^O#>Lkk1LFQ8Dv3kHT#0|tgy2@DKYGZ+}e3+C(!v;j&;2l#}z0_k_@OO8Zz zD9bCD9@u5NZ^!%eB_A@D{r~@8c;4&RKxxL3AirP+hi5m^K%69RcNdPfdsC}`9QG1V zUsv{Loctnc{DNP$G6IFVJY5_^DsH_!=g50NL4d(P$LFw$53|s+M4=7)x!3>o(6foi z5ZxjIR0#rYeJ1>PLH|K zKmpYf*NBpo#FA92CkWnl1S=gZkB8glbf zGSez?YiNBEs1DQ+UKJ8i5|mi3P*9YgmYI{PP*Pcts*qVwlFYzRG3W6o9*)8=4UJR& zr_Xpk4Pszc=GIH*7FHJao-D#Ftl-jMayW%qd2@)u=^Iy09657D<_P=g29E_^dJM0` V1xr3TnN9`y%G1@)Wt~$(69BL}o?!q0 literal 0 HcmV?d00001 diff --git a/public/post-style.css b/public/post-style.css deleted file mode 100644 index 63a2811..0000000 --- a/public/post-style.css +++ /dev/null @@ -1,2021 +0,0 @@ -.inline { - display: inline; -} - -.block { - display: block; -} - -.inline-block { - display: inline-block; -} - -.table { - display: table; -} - -.table-cell { - display: table-cell; -} - -.overflow-hidden { - overflow: hidden; -} - -.overflow-scroll { - overflow: scroll; -} - -.overflow-auto { - overflow: auto; -} - -.clearfix:before, -.clearfix:after { - display: table; - content: " "; -} - -.clearfix:after { - clear: both; -} - -.left { - float: left; -} - -.right { - float: right; -} - -.fit { - max-width: 100%; -} - -.truncate { - display: inline-block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.max-width-1 { - max-width: 24rem; -} - -.max-width-2 { - max-width: 32rem; -} - -.max-width-3 { - max-width: 48rem; -} - -.max-width-4 { - max-width: 64rem; -} - -.border-box { - box-sizing: border-box; -} - -.m0 { - margin: 0; -} - -.mt0 { - margin-top: 0; -} - -.mr0 { - margin-right: 0; -} - -.mb0 { - margin-bottom: 0; -} - -.ml0 { - margin-left: 0; -} - -.mx0 { - margin-right: 0; - margin-left: 0; -} - -.my0 { - margin-top: 0; - margin-bottom: 0; -} - -.m1 { - margin: 0.5rem; -} - -.mt1 { - margin-top: 0.5rem; -} - -.mr1 { - margin-right: 0.5rem; -} - -.mb1 { - margin-bottom: 0.5rem; -} - -.ml1 { - margin-left: 0.5rem; -} - -.mx1 { - margin-right: 0.5rem; - margin-left: 0.5rem; -} - -.my1 { - margin-top: 0.5rem; - margin-bottom: 0.5rem; -} - -.m2 { - margin: 1rem; -} - -.mt2 { - margin-top: 1rem; -} - -.mr2 { - margin-right: 1rem; -} - -.mb2 { - margin-bottom: 1rem; -} - -.ml2 { - margin-left: 1rem; -} - -.mx2 { - margin-right: 1rem; - margin-left: 1rem; -} - -.my2 { - margin-top: 1rem; - margin-bottom: 1rem; -} - -.m3 { - margin: 2rem; -} - -.mt3 { - margin-top: 2rem; -} - -.mr3 { - margin-right: 2rem; -} - -.mb3 { - margin-bottom: 2rem; -} - -.ml3 { - margin-left: 2rem; -} - -.mx3 { - margin-right: 2rem; - margin-left: 2rem; -} - -.my3 { - margin-top: 2rem; - margin-bottom: 2rem; -} - -.m4 { - margin: 4rem; -} - -.mt4 { - margin-top: 4rem; -} - -.mr4 { - margin-right: 4rem; -} - -.mb4 { - margin-bottom: 4rem; -} - -.ml4 { - margin-left: 4rem; -} - -.mx4 { - margin-right: 4rem; - margin-left: 4rem; -} - -.my4 { - margin-top: 4rem; - margin-bottom: 4rem; -} - -.mxn1 { - margin-right: -0.5rem; - margin-left: -0.5rem; -} - -.mxn2 { - margin-right: -1rem; - margin-left: -1rem; -} - -.mxn3 { - margin-right: -2rem; - margin-left: -2rem; -} - -.mxn4 { - margin-right: -4rem; - margin-left: -4rem; -} - -.ml-auto { - margin-left: auto; -} - -.mr-auto { - margin-right: auto; -} - -.mx-auto { - margin-right: auto; - margin-left: auto; -} - -.p0 { - padding: 0; -} - -.pt0 { - padding-top: 0; -} - -.pr0 { - padding-right: 0; -} - -.pb0 { - padding-bottom: 0; -} - -.pl0 { - padding-left: 0; -} - -.px0 { - padding-right: 0; - padding-left: 0; -} - -.py0 { - padding-top: 0; - padding-bottom: 0; -} - -.p1 { - padding: 0.5rem; -} - -.pt1 { - padding-top: 0.5rem; -} - -.pr1 { - padding-right: 0.5rem; -} - -.pb1 { - padding-bottom: 0.5rem; -} - -.pl1 { - padding-left: 0.5rem; -} - -.py1 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; -} - -.px1 { - padding-right: 0.5rem; - padding-left: 0.5rem; -} - -.p2 { - padding: 1rem; -} - -.pt2 { - padding-top: 1rem; -} - -.pr2 { - padding-right: 1rem; -} - -.pb2 { - padding-bottom: 1rem; -} - -.pl2 { - padding-left: 1rem; -} - -.py2 { - padding-top: 1rem; - padding-bottom: 1rem; -} - -.px2 { - padding-right: 1rem; - padding-left: 1rem; -} - -.p3 { - padding: 2rem; -} - -.pt3 { - padding-top: 2rem; -} - -.pr3 { - padding-right: 2rem; -} - -.pb3 { - padding-bottom: 2rem; -} - -.pl3 { - padding-left: 2rem; -} - -.py3 { - padding-top: 2rem; - padding-bottom: 2rem; -} - -.px3 { - padding-right: 2rem; - padding-left: 2rem; -} - -.p4 { - padding: 4rem; -} - -.pt4 { - padding-top: 4rem; -} - -.pr4 { - padding-right: 4rem; -} - -.pb4 { - padding-bottom: 4rem; -} - -.pl4 { - padding-left: 4rem; -} - -.py4 { - padding-top: 4rem; - padding-bottom: 4rem; -} - -.px4 { - padding-right: 4rem; - padding-left: 4rem; -} - -h1, -.h1 { - display: block; - margin-top: 3rem; - margin-bottom: 1rem; - color: #2bbc8a; - letter-spacing: 0.01em; - font-weight: 700; - font-style: normal; - font-size: 1.5em; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; -} - -h2, -.h2 { - position: relative; - display: block; - margin-top: 2rem; - margin-bottom: 0.5rem; - color: #eee; - text-transform: none; - letter-spacing: normal; - font-weight: bold; - font-size: 1rem; -} - -h3 { - color: #eee; - text-decoration: underline; - font-weight: bold; - font-size: 0.9rem; -} - -h4, -h5, -h6 { - display: inline; - text-decoration: none; - color: #ccc; - font-weight: bold; - font-size: 0.9rem; -} - -h3, -h4, -h5, -h6 { - margin-top: 0.9rem; - margin-bottom: 0.5rem; -} - -hr { - border: 0.5px dashed #ccc; - opacity: 0.5; - margin: 0; - margin-top: 20px; - margin-bottom: 20px; -} - -strong { - font-weight: bold; -} - -em, -cite { - font-style: italic; -} - -sup, -sub { - position: relative; - vertical-align: baseline; - font-size: 0.75em; - line-height: 0; -} - -sup { - top: -0.5em; -} - -sub { - bottom: -0.2em; -} - -small { - font-size: 0.85em; -} - -acronym, -abbr { - border-bottom: 1px dotted; -} - -ul, -ol, -dl { - line-height: 1.725; -} - -ul ul, -ol ul, -ul ol, -ol ol { - margin-top: 0; - margin-bottom: 0; -} - -ol { - list-style: decimal; -} - -dt { - font-weight: bold; -} - -table { - width: 100%; - border-collapse: collapse; - text-align: left; - font-size: 12px; - overflow: auto; - display: block; -} - -th { - padding: 8px; - border-bottom: 1px dashed #908d8d; - color: #eee; - font-weight: bold; - font-size: 13px; -} - -td { - padding: 0 8px; - border-bottom: none; -} - -@font-face { - font-style: normal; - font-family: "Meslo LG"; - src: local("Meslo LG S"), url("../lib/meslo-LG/MesloLGS-Regular.ttf") format("truetype"); -} - -*, -*:before, -*:after { - box-sizing: border-box; -} - -/* Scroll bar */ -/* For Firefox */ -* { - scrollbar-color: #999 transparent; -} - -/* For Chrome, Edge, and Safari */ -*::-webkit-scrollbar { - width: 8px; - height: 6px; -} - -*::-webkit-scrollbar-track { - background: transparent; -} - -*::-webkit-scrollbar-thumb { - background-color: #999; - border-radius: 6px; -} - -*::-webkit-scrollbar-thumb:hover { - background-color: #7a7a7a; -} - -*::-webkit-scrollbar-thumb:active { - background-color: #6b6b6b; -} - -html { - margin: 0; - padding: 0; - height: 100%; - border-top: 2px solid #c9cacc; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; -} - -/* { - margin: 0; - height: 100%; - background-color: #1d1f21; - color: #c9cacc; - font-display: swap; - font-weight: 400; - font-size: 14px; - font-family: "Menlo", "Meslo LG", monospace; - line-height: 1.725; - text-rendering: geometricPrecision; - flex: 1; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; -} */ - -.content { - position: relative; - display: flex; - flex-direction: column; - min-height: 100%; - overflow-wrap: break-word; -} - -.content p { - hyphens: auto; - -moz-hyphens: auto; - -ms-hyphens: auto; - -webkit-hyphens: auto; -} - -.content code { - hyphens: manual; - -moz-hyphens: manual; - -ms-hyphens: manual; - -webkit-hyphens: manual; -} - -.content a { - color: #c9cacc; - text-decoration: none; - background-image: linear-gradient(transparent, transparent 5px, #c9cacc 5px, #c9cacc); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -.content a:hover { - background-image: linear-gradient(transparent, transparent 4px, #d480aa 4px, #d480aa); -} - -.content a.icon { - background: none; -} - -.content a.icon:hover { - color: #d480aa; -} - -.content h1 a, -.content .h1 a, -.content h2 a, -.content h3 a, -.content h4 a, -.content h5 a, -.content h6 a { - background: none; - color: inherit; - text-decoration: none; -} - -.content h1 a:hover, -.content .h1 a:hover, -.content h2 a:hover, -.content h3 a:hover, -.content h4 a:hover, -.content h5 a:hover, -.content h6 a:hover { - background-image: linear-gradient(transparent, transparent 6px, #d480aa 6px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -.content h6 a { - background: none; - color: inherit; - text-decoration: none; -} - -.content h6 a:hover { - background-image: linear-gradient(transparent, transparent 6px, #d480aa 6px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -@media (min-width: 540px) { - .image-wrap { - flex-direction: row; - margin-bottom: 2rem; - } - - .image-wrap .image-block { - flex: 1 0 35%; - margin-right: 2rem; - } - - .image-wrap p { - flex: 1 0 65%; - } -} - -.max-width { - max-width: 48rem; -} - -@media (max-width: 480px) { - .px3 { - padding-right: 1rem; - padding-left: 1rem; - } - - .my4 { - margin-top: 2rem; - margin-bottom: 2rem; - } -} - -@media (min-width: 480px) { - p { - text-align: justify; - } -} - -#header { - margin: 0 auto 2rem; - width: 100%; -} - -#header h1, -#header .h1 { - margin-top: 0; - margin-bottom: 0; - color: #c9cacc; - letter-spacing: 0.01em; - font-weight: 700; - font-style: normal; - font-size: 1.5rem; - line-height: 2rem; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; -} - -#header a { - background: none; - color: inherit; - text-decoration: none; -} - -#header #logo { - display: inline-block; - float: left; - margin-right: 20px; - width: 50px; - height: 50px; - border-radius: 5px; - background-size: 50px 50px; - background-repeat: no-repeat; - filter: grayscale(100%); - -webkit-filter: grayscale(100%); -} - -#header #nav { - color: #2bbc8a; - letter-spacing: 0.01em; - font-weight: 200; - font-style: normal; - font-size: 0.8rem; -} - -#header #nav ul { - margin: 0; - padding: 0; - list-style-type: none; - line-height: 15px; -} - -#header #nav ul a { - margin-right: 15px; - color: #2bbc8a; -} - -#header #nav ul a:hover { - background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -#header #nav ul li { - display: inline-block; - margin-right: 15px; - border-right: 1px dotted; - border-color: #2bbc8a; - vertical-align: middle; -} - -#header #nav ul .icon { - display: none; -} - -#header #nav ul li:last-child { - margin-right: 0; - border-right: 0; -} - -#header #nav ul li:last-child a { - margin-right: 0; -} - -#header:hover #logo { - filter: none; - -webkit-filter: none; -} - -@media screen and (max-width: 480px) { - #header #title { - display: table; - margin-right: 5rem; - min-height: 50px; - } - - #header #title h1 { - display: table-cell; - vertical-align: middle; - } - - #header #nav ul a:hover { - background: none; - } - - #header #nav ul li { - display: none; - border-right: 0; - } - - #header #nav ul li.icon { - position: absolute; - top: 77px; - right: 1rem; - display: inline-block; - } - - #header #nav ul.responsive li { - display: block; - } - - #header #nav li:not(:first-child) { - padding-top: 1rem; - padding-left: 70px; - font-size: 1rem; - } -} - -#header-post { - position: fixed; - top: 2rem; - right: 0; - display: inline-block; - float: right; - z-index: 100; -} - -#header-post a { - background: none; - color: inherit; - text-decoration: none; -} - -#header-post a.icon { - background: none; -} - -#header-post a.icon:hover { - color: #d480aa; -} - -#header-post ol { - list-style-type: none; -} - -#header-post ul { - display: inline-block; - margin: 0; - padding: 0; - list-style-type: none; -} - -#header-post ul li { - display: inline-block; - margin-right: 15px; - vertical-align: middle; -} - -#header-post ul li:last-child { - margin-right: 0; -} - -#header-post #menu-icon { - float: right; - margin-right: 2rem; - margin-left: 15px; -} - -#header-post #menu-icon:hover { - color: #2bbc8a; -} - -#header-post #menu-icon-tablet { - float: right; - margin-right: 2rem; - margin-left: 15px; -} - -#header-post #menu-icon-tablet:hover { - color: #2bbc8a; -} - -#header-post #top-icon-tablet { - position: fixed; - right: 2rem; - bottom: 2rem; - margin-right: 2rem; - margin-left: 15px; -} - -#header-post #top-icon-tablet:hover { - color: #2bbc8a; -} - -#header-post .active { - color: #2bbc8a; -} - -#header-post #menu { - display: none; - margin-right: 2rem; -} - -#header-post #nav { - color: #2bbc8a; - letter-spacing: 0.01em; - font-weight: 200; - font-style: normal; - font-size: 0.8rem; -} - -#header-post #nav ul { - line-height: 15px; -} - -#header-post #nav ul a { - margin-right: 15px; - color: #2bbc8a; -} - -#header-post #nav ul a:hover { - background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -#header-post #nav ul li { - border-right: 1px dotted #2bbc8a; -} - -#header-post #nav ul li:last-child { - margin-right: 0; - border-right: 0; -} - -#header-post #nav ul li:last-child a { - margin-right: 0; -} - -#header-post #actions { - float: right; - margin-top: 2rem; - margin-right: 2rem; - width: 100%; - text-align: right; -} - -#header-post #actions ul { - display: block; -} - -#header-post #actions .info { - display: block; - font-style: italic; -} - -#header-post #share { - clear: both; - padding-top: 1rem; - padding-right: 2rem; - text-align: right; -} - -#header-post #share li { - display: block; - margin: 0; -} - -#header-post #toc { - float: right; - clear: both; - overflow: auto; - margin-top: 1rem; - padding-right: 2rem; - max-width: 20em; - max-height: calc(95vh - 7rem); - text-align: right; -} - -#header-post #toc a:hover { - color: #d480aa; -} - -#header-post #toc .toc-level-1>.toc-link { - display: none; -} - -#header-post #toc .toc-level-2 { - color: #c9cacc; - font-size: 0.8rem; -} - -#header-post #toc .toc-level-2:before { - color: #2bbc8a; - content: "#"; -} - -#header-post #toc .toc-level-3 { - color: #908d8d; - font-size: 0.7rem; -} - -#header-post #toc .toc-level-4 { - color: #747070; - font-size: 0.4rem; -} - -#header-post #toc .toc-level-5 { - display: none; -} - -#header-post #toc .toc-level-6 { - display: none; -} - -#header-post #toc .toc-number { - display: none; -} - -@media screen and (max-width: 500px) { - #header-post { - display: none; - } -} - -@media screen and (max-width: 900px) { - #header-post #menu-icon { - display: none; - } - - #header-post #actions { - display: none; - } -} - -@media screen and (max-width: 1199px) { - #header-post #toc { - display: none; - } -} - -@media screen and (min-width: 900px) { - #header-post #menu-icon-tablet { - display: none !important; - } - - #header-post #top-icon-tablet { - display: none !important; - } -} - -@media screen and (min-width: 1199px) { - #header-post #actions { - width: auto; - } - - #header-post #actions ul { - display: inline-block; - float: right; - } - - #header-post #actions .info { - display: inline; - float: left; - margin-right: 2rem; - font-style: italic; - } -} - -@media print { - #header-post { - display: none; - } - - #footer-post-container { - display: none; - } -} - -#footer-post { - position: fixed; - right: 0; - bottom: 0; - left: 0; - z-index: 5000000; - width: 100%; - border-top: 1px solid #908d8d; - background: #212326; - transition: opacity 0.2s; -} - -#footer-post a { - background: none; - color: inherit; - text-decoration: none; -} - -#footer-post a.icon { - background: none; -} - -#footer-post a.icon:hover { - color: #d480aa; -} - -#footer-post #nav-footer { - padding-right: 1rem; - padding-left: 1rem; - background: #323539; - text-align: center; -} - -#footer-post #nav-footer a { - color: #2bbc8a; - font-size: 1em; -} - -#footer-post #nav-footer a:hover { - background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -#footer-post #nav-footer ul { - display: table; - margin: 0; - padding: 0; - width: 100%; - list-style-type: none; -} - -#footer-post #nav-footer ul li { - display: inline-table; - padding: 10px; - width: 20%; - vertical-align: middle; -} - -#footer-post #actions-footer { - overflow: auto; - margin-top: 1rem; - margin-bottom: 1rem; - padding-right: 1rem; - padding-left: 1rem; - width: 100%; - text-align: center; - white-space: nowrap; -} - -#footer-post #actions-footer a { - display: inline-block; - padding-left: 1rem; - color: #2bbc8a; -} - -#footer-post #share-footer { - padding-right: 1rem; - padding-left: 1rem; - background: #323539; - text-align: center; -} - -#footer-post #share-footer ul { - display: table; - margin: 0; - padding: 0; - width: 100%; - list-style-type: none; -} - -#footer-post #share-footer ul li { - display: inline-table; - padding: 10px; - width: 20%; - vertical-align: middle; -} - -#footer-post #toc-footer { - clear: both; - padding-top: 1rem; - padding-bottom: 1rem; - background: #323539; - text-align: left; -} - -#footer-post #toc-footer ol { - margin: 0; - padding-left: 20px; - list-style-type: none; -} - -#footer-post #toc-footer ol li { - line-height: 30px; -} - -#footer-post #toc-footer a:hover { - color: #d480aa; -} - -#footer-post #toc-footer .toc-level-1>.toc-link { - display: none; -} - -#footer-post #toc-footer .toc-level-2 { - color: #c9cacc; - font-size: 0.8rem; -} - -#footer-post #toc-footer .toc-level-2:before { - color: #2bbc8a; - content: "#"; -} - -#footer-post #toc-footer .toc-level-3 { - color: #908d8d; - font-size: 0.7rem; - line-height: 15px; -} - -#footer-post #toc-footer .toc-level-4 { - display: none; -} - -#footer-post #toc-footer .toc-level-5 { - display: none; -} - -#footer-post #toc-footer .toc-level-6 { - display: none; -} - -#footer-post #toc-footer .toc-number { - display: none; -} - -@media screen and (min-width: 500px) { - #footer-post-container { - display: none; - } -} - -.post-list { - padding: 0; -} - -.post-list .post-item { - margin-bottom: 1rem; - margin-left: 0; - list-style-type: none; -} - -.post-list .post-item .meta { - display: block; - margin-right: 16px; - min-width: 100px; - color: #908d8d; - font-size: 14px; -} - -@media (min-width: 480px) { - .post-list .post-item { - display: flex; - margin-bottom: 5px; - } - - .post-list .post-item .meta { - text-align: left; - } -} - -.project-list { - padding: 0; - list-style: none; -} - -.project-list .project-item { - margin-bottom: 5px; -} - -.project-list .project-item p { - display: inline; -} - -article header .posttitle { - margin-top: 0; - margin-bottom: 0; - text-transform: none; - font-size: 1.5em; - line-height: 1.25; -} - -article header .meta { - margin-top: 0; - margin-bottom: 1rem; -} - -article header .meta * { - color: #ccc; - font-size: 0.85rem; -} - -article header .author { - text-transform: uppercase; - letter-spacing: 0.01em; - font-weight: 700; -} - -article header .postdate { - display: inline; -} - -article .content h2:before { - position: absolute; - top: -4px; - left: -1rem; - color: #2bbc8a; - content: "#"; - font-weight: bold; - font-size: 1.2rem; -} - -article .content img, -article .content video { - display: block; - margin: auto; - max-width: 100%; - height: auto; -} - -article .content .video-container { - position: relative; - overflow: hidden; - padding-top: 56.25%; - height: 0; -} - -article .content .video-container iframe, -article .content .video-container object, -article .content .video-container embed { - position: absolute; - top: 0; - left: 0; - margin-top: 0; - width: 100%; - height: 100%; -} - -article .content blockquote { - margin: 1rem 10px; - padding: 0.5em 10px; - background: inherit; - color: #ccffb6; - quotes: "\201C""\201D""\2018""\2019"; - font-weight: bold; -} - -article .content blockquote p { - margin: 0; -} - -article .content blockquote:before { - margin-right: 0.25em; - color: #ccffb6; - content: "\201C"; - vertical-align: -0.4em; - font-size: 2em; - line-height: 0.1em; -} - -article .content blockquote footer { - margin: line-height 0; - color: #908d8d; - font-size: 12px; -} - -article .content blockquote footer a { - background-image: linear-gradient(transparent, transparent 5px, #908d8d 5px, #908d8d); - color: #908d8d; -} - -article .content blockquote footer a:hover { - background-image: linear-gradient(transparent, transparent 4px, #a6a4a4 4px, #a6a4a4); - color: #a6a4a4; -} - -article .content blockquote footer cite:before { - padding: 0 0.5em; - content: "—"; -} - -article .content .pullquote { - margin: 0; - width: 45%; - text-align: left; -} - -article .content .pullquote.left { - margin-right: 1em; - margin-left: 0.5em; -} - -article .content .pullquote.right { - margin-right: 0.5em; - margin-left: 1em; -} - -article .content .caption { - position: relative; - display: block; - margin-top: 0.5em; - color: #908d8d; - text-align: center; - font-size: 0.9em; -} - -.posttitle { - text-transform: none; - font-size: 1.5em; - line-height: 1.25; -} - -.article-tag .tag-link { - background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -.article-tag .tag-link:before { - content: "#"; -} - -.article-category .category-link { - background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -@media (min-width: 480px) { - - .article-tag, - .article-category { - display: inline; - } - - .article-tag:before, - .article-category:before { - content: "|"; - } -} - -#archive .post-year { - list-style-type: none; -} - -#archive .post-list { - padding: 0; -} - -#archive .post-list .post-item { - margin-bottom: 1rem; - margin-left: 0; - list-style-type: none; -} - -#archive .post-list .post-item .meta { - display: block; - margin-right: 16px; - min-width: 100px; - color: #908d8d; - font-size: 14px; -} - -@media (min-width: 480px) { - #archive .post-list .post-item { - display: flex; - margin-bottom: 5px; - margin-left: 1rem; - } - - #archive .post-list .post-item .meta { - text-align: left; - } -} - -.blog-post-comments { - margin-top: 4rem; -} - -#footer { - position: absolute; - bottom: 0; - margin-bottom: 10px; - width: 100%; - color: #908d8d; - vertical-align: top; - text-align: center; - font-size: 12px; -} - -#footer ul { - margin: 0; - padding: 0; - list-style: none; -} - -#footer li { - display: inline-block; - margin-right: 15px; - border-right: 1px solid; - border-color: #908d8d; - vertical-align: middle; -} - -#footer li a { - margin-right: 15px; -} - -#footer li:last-child { - margin-right: 0; - border-right: 0; -} - -#footer li:last-child a { - margin-right: 0; -} - -#footer a { - color: #908d8d; - text-decoration: underline; - background-image: none; -} - -#footer a:hover { - color: #a6a4a4; -} - -#footer .footer-left { - height: 20px; - vertical-align: middle; - line-height: 20px; -} - -@media (min-width: 39rem) { - #footer { - display: flex; - flex-flow: row wrap; - justify-content: space-between; - align-items: center; - align-content: center; - margin-bottom: 20px; - } - - #footer .footer-left { - align-self: flex-start; - margin-right: 20px; - } - - #footer .footer-right { - align-self: flex-end; - } -} - -.pagination { - display: inline-block; - margin-top: 2rem; - width: 100%; - text-align: center; -} - -.pagination .page-number { - color: #c9cacc; - font-size: 0.8rem; -} - -.pagination a { - padding: 4px 6px; - border-radius: 5px; - background-image: none; - color: #c9cacc; - text-decoration: none; -} - -.pagination a:hover { - background-image: none; -} - -.pagination a:hover:not(.active) { - color: #eee; -} - -.search-input { - padding: 4px 7px; - width: 100%; - outline: none; - border: solid 1px #ccc; - border-radius: 5px; - background-color: #1d1f21; - color: #c9cacc; - font-size: 1.2rem; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; -} - -.search-input:focus { - border: solid 1px #2bbc8a; -} - -#search-result ul.search-result-list { - padding: 0; - list-style-type: none; -} - -#search-result li { - margin: 2em auto; -} - -#search-result a.search-result-title { - background-image: none; - color: #c9cacc; - text-transform: capitalize; - font-weight: bold; - line-height: 1.2; -} - -#search-result p.search-result { - overflow: hidden; - margin: 0.4em auto; - max-height: 13em; - text-align: justify; - font-size: 0.8em; -} - -#search-result em.search-keyword { - border-bottom: 1px dashed #d480aa; - color: #d480aa; - font-weight: bold; -} - -.search-no-result { - display: none; - padding-bottom: 0.5em; - color: #c9cacc; -} - -#tag-cloud .tag-cloud-title { - color: #908d8d; -} - -#tag-cloud .tag-cloud-tags { - clear: both; - text-align: center; -} - -#tag-cloud .tag-cloud-tags a { - display: inline-block; - margin: 10px; -} - -.tooltipped { - position: relative; -} - -.tooltipped::after { - position: absolute; - z-index: 1000000; - display: none; - padding: 0.2em 0.5em; - -webkit-font-smoothing: subpixel-antialiased; - color: #1d1f21; - font-display: swap; - font-weight: 400; - font-size: 11.200000000000001px; - font-family: "Menlo", "Meslo LG", monospace; - line-height: 1.725; - text-rendering: geometricPrecision; - text-align: center; - word-wrap: break-word; - white-space: pre; - content: attr(aria-label); - background: #c9cacc; - border-radius: 3px; - opacity: 0; -} - -.tooltipped::before { - position: absolute; - z-index: 1000001; - display: none; - width: 0; - height: 0; - color: #c9cacc; - pointer-events: none; - content: ''; - border: 6px solid transparent; - opacity: 0; -} - -.tooltipped:hover::before, -.tooltipped:active::before, -.tooltipped:focus::before, -.tooltipped:hover::after, -.tooltipped:active::after, -.tooltipped:focus::after { - display: inline-block; - text-decoration: none; - animation-name: tooltip-appear; - animation-duration: 0.1s; - animation-fill-mode: forwards; - animation-timing-function: ease-in; -} - -.tooltipped-s::after, -.tooltipped-sw::after { - top: 100%; - right: 50%; - margin-top: 6px; -} - -.tooltipped-s::before, -.tooltipped-sw::before { - top: auto; - right: 50%; - bottom: -7px; - margin-right: -6px; - border-bottom-color: #c9cacc; -} - -.tooltipped-sw::after { - margin-right: -16px; -} - -.tooltipped-s::after { - transform: translateX(50%); -} - -@-moz-keyframes tooltip-appear { - from { - opacity: 0; - } - - to { - opacity: 1; - } -} - -@-webkit-keyframes tooltip-appear { - from { - opacity: 0; - } - - to { - opacity: 1; - } -} - -@-o-keyframes tooltip-appear { - from { - opacity: 0; - } - - to { - opacity: 1; - } -} - -@keyframes tooltip-appear { - from { - opacity: 0; - } - - to { - opacity: 1; - } -} - -#categories .category-list-title { - color: #908d8d; -} - -#categories .category-list .category-list-item .category-list-count { - color: #908d8d; -} - -#categories .category-list .category-list-item .category-list-count:before { - content: " ("; -} - -#categories .category-list .category-list-item .category-list-count:after { - content: ")"; -} - -.highlight { - background: #474949; - color: #d1d9e1; -} - -.highlight .code .comment, -.highlight .code .quote { - color: #969896; - font-style: italic; -} - -.highlight .code .keyword, -.highlight .code .selector-tag, -.highlight .code .literal, -.highlight .code .type, -.highlight .code .addition { - color: #c9c; -} - -.highlight .code .number, -.highlight .code .selector-attr, -.highlight .code .selector-pseudo { - color: #f99157; -} - -.highlight .code .string, -.highlight .code .doctag, -.highlight .code .regexp { - color: #8abeb7; -} - -.highlight .code .title, -.highlight .code .name, -.highlight .code .section, -.highlight .code .built_in { - color: #b5bd68; -} - -.highlight .code .variable, -.highlight .code .template-variable, -.highlight .code .selector-id, -.highlight .code .class .title { - color: #fc6; -} - -.highlight .code .section, -.highlight .code .name, -.highlight .code .strong { - font-weight: bold; -} - -.highlight .code .symbol, -.highlight .code .bullet, -.highlight .code .subst, -.highlight .code .meta, -.highlight .code .link { - color: #f99157; -} - -.highlight .code .deletion { - color: #dc322f; -} - -.highlight .code .formula { - background: #eee8d5; -} - -.highlight .code .attr, -.highlight .code .attribute { - color: #81a2be; -} - -.highlight .code .emphasis { - font-style: italic; -} - -pre { - overflow-x: auto; - padding: 10px 15px; - padding-bottom: 0; - border: 1px dotted #908d8d; - border-radius: 4px; - font-size: 13px; - font-family: "Menlo", "Meslo LG", monospace; - line-height: 22px; - -webkit-border-radius: 4px; -} - -pre code { - display: block; - padding: 0; - border: none; -} - -code { - padding: 0 5px; - border: 1px dotted #908d8d; - border-radius: 2px; - -webkit-border-radius: 2px; -} - -.highlight { - overflow-x: auto; - margin: 1rem 0; - padding: 10px 15px; - border-radius: 4px; - background: #212326; - font-family: "Menlo", "Meslo LG", monospace; - -webkit-border-radius: 4px; -} - -.highlight figcaption { - margin: -5px 0 5px; - color: #908d8d; - font-size: 0.9em; - transform: scale(1); -} - -.highlight figcaption a { - float: right; - color: #908d8d; - font-style: italic; - font-size: 0.8em; - background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x; -} - -.highlight figcaption a:hover { - color: #a6a4a4; -} - -.highlight figcaption:before, -.highlight figcaption content { - display: table; -} - -.highlight figcaption:after { - clear: both; -} - -.highlight:hover .btn-copy { - opacity: 1; -} - -.highlight .btn-copy { - font-size: 1.2rem; - position: absolute; - right: 20px; - opacity: 0; - transition: opacity 0.2s ease-in; -} - -.highlight .btn-copy:hover { - color: #2bbc8a; -} - -.highlight pre { - margin: 0; - padding: 0; - border: none; - background: none; -} - -.highlight table { - width: auto; -} - -.highlight td.gutter { - text-align: right; - opacity: 0.2; -} - -.highlight .line { - height: 22px; -} \ No newline at end of file diff --git a/public/safari-pinned-tab.svg b/public/safari-pinned-tab.svg new file mode 100644 index 0000000..6fb1745 --- /dev/null +++ b/public/safari-pinned-tab.svg @@ -0,0 +1,80 @@ + + + + +Created by potrace 1.14, written by Peter Selinger 2001-2017 + + + + + diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 0000000..f3d7f58 --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1,19 @@ +{ + "name": "Be My SpaceTime", + "short_name": "SpaceTime", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/public/trymerge.css b/public/trymerge.css deleted file mode 100644 index 2c33572..0000000 --- a/public/trymerge.css +++ /dev/null @@ -1,3760 +0,0 @@ -@-moz-keyframes tooltip-appear { - 0% { - opacity: 0 - } - - to { - opacity: 1 - } -} - -@-webkit-keyframes tooltip-appear { - 0% { - opacity: 0 - } - - to { - opacity: 1 - } -} - -@-o-keyframes tooltip-appear { - 0% { - opacity: 0 - } - - to { - opacity: 1 - } -} - -@keyframes tooltip-appear { - 0% { - opacity: 0 - } - - to { - opacity: 1 - } -} - -@-webkit-keyframes blink { - - 0%, - to { - background-color: #111; - color: #f48020 - } - - 50% { - background-color: #f48020; - color: #111 - } -} - -@keyframes blink { - - 0%, - to { - background-color: transparent - } - - 50% { - background-color: #f48020 - } -} - -@-webkit-keyframes fadeInUp { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) - } - - to { - opacity: 1; - -webkit-transform: none; - transform: none - } -} - -@keyframes fadeInUp { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) - } - - to { - opacity: 1; - -webkit-transform: none; - transform: none - } -} - -@-webkit-keyframes fadeOutDown { - 0% { - opacity: 1 - } - - to { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) - } -} - -@keyframes fadeOutDown { - 0% { - opacity: 1 - } - - to { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) - } -} - -@-webkit-keyframes flash { - - 0%, - 50%, - to { - opacity: 1 - } - - 25%, - 75% { - opacity: 0 - } -} - -@keyframes flash { - - 0%, - 50%, - to { - opacity: 1 - } - - 25%, - 75% { - opacity: 0 - } -} - -.inline, -.project-list .project-item p { - display: inline -} - -.block { - display: block -} - -.inline-block { - display: inline-block -} - -.highlight figcaption content, -.highlight figcaption:before, -.table { - display: table -} - -.table-cell { - display: table-cell -} - -.overflow-hidden { - overflow: hidden -} - -.overflow-scroll { - overflow: scroll -} - -.overflow-auto, -body table { - overflow: auto -} - -.clearfix:after, -.clearfix:before { - display: table; - content: " " -} - -.clearfix:after, -.highlight figcaption:after { - clear: both -} - -.left { - float: left -} - -.right { - float: right -} - -.fit { - max-width: 100% -} - -.truncate { - display: inline-block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap -} - -.max-width-1 { - max-width: 24rem -} - -.max-width-2 { - max-width: 32rem -} - -.max-width-3 { - max-width: 48rem -} - -.max-width-4 { - max-width: 64rem -} - -.border-box { - box-sizing: border-box -} - -.m0, -article .content blockquote p { - margin: 0 -} - -.mt0 { - margin-top: 0 -} - -.mr0 { - margin-right: 0 -} - -.mb0 { - margin-bottom: 0 -} - -.ml0, -.mx0 { - margin-left: 0 -} - -.mx0 { - margin-right: 0 -} - -.my0, -body ol ol, -body ol ul, -body ul ol, -body ul ul { - margin-top: 0; - margin-bottom: 0 -} - -.m1 { - margin: .5rem -} - -.mt1 { - margin-top: .5rem -} - -.mr1 { - margin-right: .5rem -} - -.mb1 { - margin-bottom: .5rem -} - -.ml1, -.mx1 { - margin-left: .5rem -} - -.mx1 { - margin-right: .5rem -} - -.my1 { - margin-top: .5rem; - margin-bottom: .5rem -} - -.m2 { - margin: 1rem -} - -.mt2 { - margin-top: 1rem -} - -.mr2 { - margin-right: 1rem -} - -.mb2 { - margin-bottom: 1rem -} - -.ml2, -.mx2 { - margin-left: 1rem -} - -.mx2 { - margin-right: 1rem -} - -.my2, -body .h1, -body h1 { - margin-top: 1rem; - margin-bottom: 1rem -} - -.m3 { - margin: 2rem -} - -.mt3 { - margin-top: 2rem -} - -.mr3 { - margin-right: 2rem -} - -.mb3 { - margin-bottom: 2rem -} - -.ml3, -.mx3 { - margin-left: 2rem -} - -.mx3 { - margin-right: 2rem -} - -.my3 { - margin-top: 2rem; - margin-bottom: 2rem -} - -.m4 { - margin: 4rem -} - -.mt4 { - margin-top: 4rem -} - -.mr4 { - margin-right: 4rem -} - -.mb4 { - margin-bottom: 4rem -} - -.ml4, -.mx4 { - margin-left: 4rem -} - -.mx4 { - margin-right: 4rem -} - -.my4 { - margin-top: 4rem; - margin-bottom: 4rem -} - -.mxn1 { - margin-right: -.5rem; - margin-left: -.5rem -} - -.mxn2 { - margin-right: -1rem; - margin-left: -1rem -} - -.mxn3 { - margin-right: -2rem; - margin-left: -2rem -} - -.mxn4 { - margin-right: -4rem; - margin-left: -4rem -} - -.ml-auto { - margin-left: auto -} - -.mr-auto, -.mx-auto { - margin-right: auto -} - -.mx-auto { - margin-left: auto -} - -.p0 { - padding: 0 -} - -.pt0 { - padding-top: 0 -} - -.pr0 { - padding-right: 0 -} - -.pb0 { - padding-bottom: 0 -} - -.pl0, -.px0 { - padding-left: 0 -} - -.px0 { - padding-right: 0 -} - -.py0 { - padding-top: 0; - padding-bottom: 0 -} - -.p1 { - padding: .5rem -} - -.pt1 { - padding-top: .5rem -} - -.pr1 { - padding-right: .5rem -} - -.pb1 { - padding-bottom: .5rem -} - -.pl1 { - padding-left: .5rem -} - -.py1 { - padding-top: .5rem; - padding-bottom: .5rem -} - -.px1 { - padding-right: .5rem; - padding-left: .5rem -} - -.p2 { - padding: 1rem -} - -.pt2 { - padding-top: 1rem -} - -.pr2 { - padding-right: 1rem -} - -.pb2 { - padding-bottom: 1rem -} - -.pl2 { - padding-left: 1rem -} - -.py2 { - padding-top: 1rem; - padding-bottom: 1rem -} - -.px2 { - padding-right: 1rem; - padding-left: 1rem -} - -.p3 { - padding: 2rem -} - -.pt3 { - padding-top: 2rem -} - -.pr3 { - padding-right: 2rem -} - -.pb3 { - padding-bottom: 2rem -} - -.pl3 { - padding-left: 2rem -} - -.py3 { - padding-top: 2rem; - padding-bottom: 2rem -} - -.px3 { - padding-right: 2rem; - padding-left: 2rem -} - -.p4 { - padding: 4rem -} - -.pt4 { - padding-top: 4rem -} - -.pr4 { - padding-right: 4rem -} - -.pb4 { - padding-bottom: 4rem -} - -.pl4 { - padding-left: 4rem -} - -.py4 { - padding-top: 4rem; - padding-bottom: 4rem -} - -.px4 { - padding-right: 4rem; - padding-left: 4rem -} - -body .h1, -body h1 { - display: block; - margin-top: 3rem; - color: #2bbc8a; - letter-spacing: .01em; - font-weight: 700; - font-style: normal; - font-size: 1.5em; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased -} - -body .h2, -body h2 { - position: relative; - display: block; - margin-top: 2rem; - margin-bottom: .5rem; - color: #eee; - text-transform: none; - letter-spacing: normal; - font-weight: 700; - font-size: 1rem -} - -body h3, -body h4, -body h5, -body h6 { - color: #eee; - text-decoration: underline; - font-size: .9rem; - margin-top: .9rem; - margin-bottom: .5rem -} - -body h4, -body h5, -body h6 { - display: inline; - text-decoration: none; - color: #ccc; - font-weight: 700 -} - -body hr { - border: .5px dashed #ccc; - opacity: .5; - margin: 20px 0 -} - -body dt, -body h3, -body strong, -body th { - font-weight: 700 -} - -body cite, -body em { - font-style: italic -} - -body sub, -body sup { - position: relative; - vertical-align: baseline; - font-size: .75em; - line-height: 0 -} - -body sup { - top: -.5em -} - -body sub { - bottom: -.2em -} - -body small { - font-size: .85em -} - -body abbr, -body acronym { - border-bottom: 1px dotted -} - -body dl, -body ol, -body ul { - line-height: 1.725 -} - -body ol { - list-style: decimal -} - -body table { - width: 100%; - border-collapse: collapse; - text-align: left; - font-size: 12px; - display: block -} - -body th { - padding: 8px; - border-bottom: 1px dashed #908d8d; - color: #eee; - font-size: 13px -} - -body td { - padding: 0 8px; - border-bottom: none -} - -@font-face { - font-style: normal; - font-family: "Meslo LG"; - src: local("Meslo LG S"), url(../lib/meslo-LG/MesloLGS-Regular.ttf)format("truetype") -} - -* { - scrollbar-color: #999 transparent -} - -::-webkit-scrollbar { - width: 8px; - height: 6px -} - -::-webkit-scrollbar-track { - background: 0 0 -} - -::-webkit-scrollbar-thumb { - background-color: #999; - border-radius: 6px -} - -::-webkit-scrollbar-thumb:hover { - background-color: #7a7a7a -} - -::-webkit-scrollbar-thumb:active { - background-color: #6b6b6b -} - -html { - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100% -} - -#header .h1, -#header h1, -body { - -moz-osx-font-smoothing: grayscale -} - -body { - font-display: swap; - text-rendering: geometricPrecision; - flex: 1; - margin: 0; - padding: 0; - border: 0; - vertical-align: baseline; - line-height: 1 -} - -.content { - position: relative; - display: flex; - flex-direction: column; - min-height: 100%; - overflow-wrap: break-word -} - -.content p { - hyphens: auto; - -moz-hyphens: auto; - -ms-hyphens: auto; - -webkit-hyphens: auto -} - -.content code { - hyphens: manual; - -moz-hyphens: manual; - -ms-hyphens: manual; - -webkit-hyphens: manual -} - -.content a { - color: #c9cacc; - text-decoration: none; - background-image: linear-gradient(transparent, transparent 5px, #c9cacc 5px, #c9cacc); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x -} - -.content a:hover { - background-image: linear-gradient(transparent, transparent 4px, #d480aa 4px, #d480aa) -} - -#footer-post a.icon, -#header-post a.icon, -.content a.icon { - background: 0 0 -} - -#footer-post a.icon:hover, -#header-post #toc a:hover, -#header-post a.icon:hover, -.content a.icon:hover { - color: #d480aa -} - -#footer-post a, -#header a, -#header-post a, -.content .h1 a, -.content h1 a, -.content h2 a, -.content h3 a, -.content h4 a, -.content h5 a, -.content h6 a { - background: 0 0; - color: inherit; - text-decoration: none -} - -#header #nav ul a:hover, -.content .h1 a:hover, -.content h1 a:hover, -.content h2 a:hover, -.content h3 a:hover, -.content h4 a:hover, -.content h5 a:hover, -.content h6 a:hover { - background-image: linear-gradient(transparent, transparent 6px, #d480aa 6px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x -} - -@media (min-width:540px) { - .image-wrap { - flex-direction: row; - margin-bottom: 2rem - } - - .image-wrap .image-block { - flex: 1 0 35%; - margin-right: 2rem - } - - .image-wrap p { - flex: 1 0 65% - } -} - -.max-width { - max-width: 48rem -} - -@media (max-width:480px) { - .px3 { - padding-right: 1rem; - padding-left: 1rem - } - - .my4 { - margin-top: 2rem; - margin-bottom: 2rem - } -} - -@media (min-width:480px) { - p { - text-align: justify - } -} - -#header { - margin: 0 auto 2rem; - width: 100% -} - -#header .h1, -#header h1 { - margin-top: 0; - margin-bottom: 0; - color: #c9cacc; - font-weight: 700; - font-size: 1.5rem; - line-height: 2rem; - -webkit-font-smoothing: antialiased -} - -#header #logo { - display: inline-block; - float: left; - margin-right: 20px; - width: 50px; - height: 50px; - border-radius: 5px; - background-size: 50px 50px; - background-repeat: no-repeat; - filter: grayscale(100%); - -webkit-filter: grayscale(100%) -} - -#header #nav, -#header .h1, -#header h1 { - letter-spacing: .01em; - font-style: normal -} - -#header #nav { - color: #2bbc8a; - font-weight: 200; - font-size: .8rem -} - -#header #nav ul { - margin: 0; - padding: 0; - list-style-type: none; - line-height: 15px -} - -#header #nav ul a, -#header-post #nav ul a { - margin-right: 15px; - color: #2bbc8a -} - -#header #nav ul a:hover { - background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a) -} - -#header #nav ul li { - display: inline-block; - margin-right: 15px; - border-right: 1px dotted; - border-color: #2bbc8a; - vertical-align: middle -} - -#header #nav ul .icon, -#header-post #toc .toc-level-1>.toc-link { - display: none -} - -#header #nav ul li:last-child { - margin-right: 0; - border-right: 0 -} - -#footer li:last-child a, -#header #nav ul li:last-child a, -#header-post #nav ul li:last-child a, -#header-post ul li:last-child, -.foo-footer li:last-child, -.foo-shortcuts__legend li:last-child { - margin-right: 0 -} - -#header:hover #logo { - filter: none; - -webkit-filter: none -} - -@media screen and (max-width:480px) { - #header #title { - display: table; - margin-right: 5rem; - min-height: 50px - } - - #header #title h1 { - display: table-cell; - vertical-align: middle - } - - #header #nav ul a:hover { - background: 0 0 - } - - #header #nav ul li { - display: none; - border-right: 0 - } - - #header #nav ul li.icon { - position: absolute; - top: 77px; - right: 1rem; - display: inline-block - } - - #header #nav ul.responsive li { - display: block - } - - #header #nav li:not(:first-child) { - padding-top: 1rem; - padding-left: 70px; - font-size: 1rem - } -} - -#header-post { - position: fixed; - top: 2rem; - right: 0; - display: inline-block; - float: right; - z-index: 100 -} - -#header-post ol, -#header-post ul { - list-style-type: none -} - -#header-post ul { - display: inline-block; - margin: 0; - padding: 0 -} - -#header-post ul li { - display: inline-block; - margin-right: 15px; - vertical-align: middle -} - -#header-post #menu-icon, -#header-post #menu-icon-tablet { - float: right; - margin-right: 2rem; - margin-left: 15px -} - -#header-post #menu-icon-tablet:hover, -#header-post #menu-icon:hover, -#header-post #top-icon-tablet:hover, -#header-post .active { - color: #2bbc8a -} - -#header-post #top-icon-tablet { - position: fixed; - right: 2rem; - bottom: 2rem; - margin-right: 2rem; - margin-left: 15px -} - -#header-post #menu { - display: none; - margin-right: 2rem -} - -#header-post #nav { - color: #2bbc8a; - letter-spacing: .01em; - font-weight: 200; - font-style: normal; - font-size: .8rem -} - -#header-post #nav ul { - line-height: 15px -} - -#footer-post #nav-footer a:hover, -#header-post #nav ul a:hover { - background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x -} - -#header-post #nav ul li { - border-right: 1px dotted #2bbc8a -} - -#footer li:last-child, -#header-post #nav ul li:last-child { - margin-right: 0; - border-right: 0 -} - -#header-post #actions { - float: right; - margin-top: 2rem; - margin-right: 2rem; - width: 100%; - text-align: right -} - -#header-post #actions ul { - display: block -} - -#header-post #actions .info { - display: block; - font-style: italic -} - -#header-post #share, -#header-post #toc { - clear: both; - padding-right: 2rem; - text-align: right -} - -#header-post #share { - padding-top: 1rem -} - -#header-post #share li { - display: block; - margin: 0 -} - -#header-post #toc { - float: right; - overflow: auto; - margin-top: 1rem; - max-width: 20em; - max-height: calc(95vh - 7rem) -} - -#header-post #toc .toc-level-2 { - color: #c9cacc; - font-size: .8rem -} - -#footer-post #toc-footer .toc-level-2:before, -#header-post #toc .toc-level-2:before { - color: #2bbc8a; - content: "#" -} - -#header-post #toc .toc-level-3 { - color: #908d8d; - font-size: .7rem -} - -#header-post #toc .toc-level-4 { - color: #747070; - font-size: .4rem -} - -#footer-post #toc-footer .toc-level-1>.toc-link, -#header-post #toc .toc-level-5, -#header-post #toc .toc-level-6, -#header-post #toc .toc-number { - display: none -} - -@media screen and (max-width:500px) { - #header-post { - display: none - } -} - -@media screen and (max-width:900px) { - - #header-post #actions, - #header-post #menu-icon { - display: none - } -} - -@media screen and (max-width:1199px) { - #header-post #toc { - display: none - } -} - -@media screen and (min-width:900px) { - - #header-post #menu-icon-tablet, - #header-post #top-icon-tablet { - display: none !important - } -} - -@media screen and (min-width:1199px) { - #header-post #actions { - width: auto - } - - #header-post #actions ul { - display: inline-block; - float: right - } - - #header-post #actions .info { - display: inline; - float: left; - margin-right: 2rem; - font-style: italic - } -} - -@media print { - - #footer-post-container, - #header-post { - display: none - } -} - -#footer-post { - position: fixed; - right: 0; - bottom: 0; - left: 0; - z-index: 5000000; - width: 100%; - border-top: 1px solid #908d8d; - background: #212326; - transition: opacity .2s -} - -#footer-post #nav-footer { - padding-right: 1rem; - padding-left: 1rem; - background: #323539; - text-align: center -} - -#footer-post #nav-footer a { - color: #2bbc8a; - font-size: 1em -} - -#footer-post #nav-footer ul, -#footer-post #share-footer ul { - display: table; - margin: 0; - padding: 0; - width: 100%; - list-style-type: none -} - -#footer-post #nav-footer ul li, -#footer-post #share-footer ul li { - display: inline-table; - padding: 10px; - width: 20%; - vertical-align: middle -} - -#footer-post #actions-footer { - overflow: auto; - margin-top: 1rem; - margin-bottom: 1rem; - padding-right: 1rem; - padding-left: 1rem; - width: 100%; - text-align: center; - white-space: nowrap -} - -#footer-post #actions-footer a { - display: inline-block; - padding-left: 1rem; - color: #2bbc8a -} - -#footer-post #share-footer { - padding-right: 1rem; - padding-left: 1rem; - background: #323539; - text-align: center -} - -#footer-post #toc-footer { - clear: both; - padding-top: 1rem; - padding-bottom: 1rem; - background: #323539; - text-align: left -} - -#footer-post #toc-footer ol { - margin: 0; - padding-left: 20px; - list-style-type: none -} - -#footer-post #toc-footer ol li { - line-height: 30px -} - -#footer-post #toc-footer a:hover { - color: #d480aa -} - -#footer-post #toc-footer .toc-level-2 { - color: #c9cacc; - font-size: .8rem -} - -#footer-post #toc-footer .toc-level-3 { - color: #908d8d; - font-size: .7rem; - line-height: 15px -} - -#footer-post #toc-footer .toc-level-4, -#footer-post #toc-footer .toc-level-5, -#footer-post #toc-footer .toc-level-6, -#footer-post #toc-footer .toc-number { - display: none -} - -@media screen and (min-width:500px) { - #footer-post-container { - display: none - } -} - -.post-list { - padding: 0 -} - -#archive .post-list .post-item, -.post-list .post-item { - margin-bottom: 1rem; - margin-left: 0; - list-style-type: none -} - -#archive .post-list .post-item .meta, -.post-list .post-item .meta { - display: block; - margin-right: 16px; - min-width: 100px; - color: #908d8d; - font-size: 14px -} - -@media (min-width:480px) { - .post-list .post-item { - display: flex; - margin-bottom: 5px - } - - .post-list .post-item .meta { - text-align: left - } -} - -#footer ul, -.project-list { - padding: 0; - list-style: none -} - -.project-list .project-item { - margin-bottom: 5px -} - -article header .posttitle { - margin-top: 0; - margin-bottom: 0; - text-transform: none; - font-size: 1.5em; - line-height: 1.25 -} - -article header .meta { - margin-top: 0; - margin-bottom: 1rem -} - -article header .meta * { - color: #ccc; - font-size: .85rem -} - -article header .author { - text-transform: uppercase; - letter-spacing: .01em; - font-weight: 700 -} - -article header .postdate { - display: inline -} - -article .content h2:before { - position: absolute; - top: -4px; - left: -1rem; - color: #2bbc8a; - content: "#"; - font-weight: 700; - font-size: 1.2rem -} - -article .content img, -article .content video { - display: block; - margin: auto; - max-width: 100%; - height: auto -} - -article .content .video-container { - position: relative; - overflow: hidden; - padding-top: 56.25%; - height: 0 -} - -article .content .video-container embed, -article .content .video-container iframe, -article .content .video-container object { - position: absolute; - top: 0; - left: 0; - margin-top: 0; - width: 100%; - height: 100% -} - -article .content blockquote { - margin: 1rem 10px; - padding: .5em 10px; - background: inherit; - color: #ccffb6; - quotes: "“""”""‘""’"; - font-weight: 700 -} - -article .content blockquote:before { - margin-right: .25em; - color: #ccffb6; - content: "“"; - vertical-align: -.4em; - font-size: 2em; - line-height: .1em -} - -article .content blockquote footer { - margin: line-height 0; - color: #908d8d; - font-size: 12px -} - -article .content blockquote footer a { - background-image: linear-gradient(transparent, transparent 5px, #908d8d 5px, #908d8d); - color: #908d8d -} - -article .content blockquote footer a:hover { - background-image: linear-gradient(transparent, transparent 4px, #a6a4a4 4px, #a6a4a4); - color: #a6a4a4 -} - -article .content blockquote footer cite:before { - padding: 0 .5em; - content: "—" -} - -article .content .pullquote { - margin: 0; - width: 45%; - text-align: left -} - -article .content .pullquote.left { - margin-right: 1em; - margin-left: .5em -} - -article .content .pullquote.right { - margin-right: .5em; - margin-left: 1em -} - -article .content .caption { - position: relative; - display: block; - margin-top: .5em; - color: #908d8d; - text-align: center; - font-size: .9em -} - -.posttitle { - text-transform: none; - font-size: 1.5em; - line-height: 1.25 -} - -.article-category .category-link, -.article-tag .tag-link { - background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x -} - -.article-tag .tag-link:before { - content: "#" -} - -@media (min-width:480px) { - - .article-category, - .article-tag { - display: inline - } - - .article-category:before, - .article-tag:before { - content: "|" - } -} - -#archive .post-year { - list-style-type: none -} - -#archive .post-list { - padding: 0 -} - -@media (min-width:480px) { - #archive .post-list .post-item { - display: flex; - margin-bottom: 5px; - margin-left: 1rem - } - - #archive .post-list .post-item .meta { - text-align: left - } -} - -.blog-post-comments { - margin-top: 4rem -} - -#footer, -.pagination { - width: 100%; - text-align: center -} - -#footer { - position: absolute; - bottom: 0; - margin-bottom: 10px; - color: #908d8d; - vertical-align: top; - font-size: 12px -} - -#footer ul { - margin: 0 -} - -#footer li { - display: inline-block; - border-right: 1px solid; - border-color: #908d8d; - vertical-align: middle -} - -#footer li, -#footer li a { - margin-right: 15px -} - -#footer a { - color: #908d8d; - text-decoration: underline; - background-image: none -} - -#footer a:hover, -.highlight figcaption a:hover { - color: #a6a4a4 -} - -#footer .footer-left { - height: 20px; - vertical-align: middle; - line-height: 20px -} - -@media (min-width:39rem) { - #footer { - display: flex; - flex-flow: row wrap; - justify-content: space-between; - align-items: center; - align-content: center; - margin-bottom: 20px - } - - #footer .footer-left { - align-self: flex-start; - margin-right: 20px - } - - #footer .footer-right { - align-self: flex-end - } -} - -.pagination { - display: inline-block; - margin-top: 2rem -} - -.pagination .page-number { - color: #c9cacc; - font-size: .8rem -} - -.pagination a { - padding: 4px 6px; - border-radius: 5px; - color: #c9cacc; - text-decoration: none -} - -.pagination a, -.pagination a:hover { - background-image: none -} - -.pagination a:hover:not(.active) { - color: #eee -} - -.search-input { - padding: 4px 7px; - width: 100%; - outline: 0; - border: solid 1px #ccc; - border-radius: 5px; - background-color: #1d1f21; - color: #c9cacc; - font-size: 1.2rem; - -webkit-border-radius: 5px; - -moz-border-radius: 5px -} - -.search-input:focus { - border: solid 1px #2bbc8a -} - -#search-result ul.search-result-list { - padding: 0; - list-style-type: none -} - -#search-result li { - margin: 2em auto -} - -#search-result a.search-result-title { - background-image: none; - color: #c9cacc; - text-transform: capitalize; - font-weight: 700; - line-height: 1.2 -} - -#search-result p.search-result { - overflow: hidden; - margin: .4em auto; - max-height: 13em; - text-align: justify; - font-size: .8em -} - -#search-result em.search-keyword { - border-bottom: 1px dashed #d480aa; - color: #d480aa; - font-weight: 700 -} - -.search-no-result { - display: none; - padding-bottom: .5em; - color: #c9cacc -} - -#tag-cloud .tag-cloud-title { - color: #908d8d -} - -#tag-cloud .tag-cloud-tags { - clear: both; - text-align: center -} - -#tag-cloud .tag-cloud-tags a { - display: inline-block; - margin: 10px -} - -.tooltipped { - position: relative -} - -.tooltipped::after, -.tooltipped::before { - position: absolute; - display: none; - opacity: 0 -} - -.tooltipped::after { - z-index: 1000000; - padding: .2em .5em; - -webkit-font-smoothing: subpixel-antialiased; - color: #1d1f21; - font-display: swap; - font-weight: 400; - font-size: 11.200000000000001px; - font-family: "Menlo", "Meslo LG", monospace; - line-height: 1.725; - text-rendering: geometricPrecision; - text-align: center; - word-wrap: break-word; - white-space: pre; - content: attr(aria-label); - background: #c9cacc; - border-radius: 3px -} - -.tooltipped::before { - z-index: 1000001; - width: 0; - height: 0; - color: #c9cacc; - pointer-events: none; - content: ""; - border: 6px solid transparent -} - -.tooltipped:active::after, -.tooltipped:active::before, -.tooltipped:focus::after, -.tooltipped:focus::before, -.tooltipped:hover::after, -.tooltipped:hover::before { - display: inline-block; - text-decoration: none; - animation-name: tooltip-appear; - animation-duration: .1s; - animation-fill-mode: forwards; - animation-timing-function: ease-in -} - -.tooltipped-s::after, -.tooltipped-sw::after { - top: 100%; - right: 50%; - margin-top: 6px -} - -.tooltipped-s::before, -.tooltipped-sw::before { - top: auto; - right: 50%; - bottom: -7px; - margin-right: -6px; - border-bottom-color: #c9cacc -} - -.tooltipped-sw::after { - margin-right: -16px -} - -.tooltipped-s::after { - transform: translateX(50%) -} - -#categories .category-list .category-list-item .category-list-count, -#categories .category-list-title { - color: #908d8d -} - -#categories .category-list .category-list-item .category-list-count:before { - content: " (" -} - -#categories .category-list .category-list-item .category-list-count:after { - content: ")" -} - -.highlight, -pre { - overflow-x: auto; - border-radius: 4px; - -webkit-border-radius: 4px -} - -.highlight { - background: #474949; - color: #d1d9e1; - margin: 1rem 0; - padding: 10px 15px; - background: #212326; - font-family: "Menlo", "Meslo LG", monospace -} - -.highlight .code .comment, -.highlight .code .quote { - color: #969896; - font-style: italic -} - -.highlight .code .addition, -.highlight .code .keyword, -.highlight .code .literal, -.highlight .code .selector-tag, -.highlight .code .type { - color: #c9c -} - -.highlight .code .number, -.highlight .code .selector-attr, -.highlight .code .selector-pseudo { - color: #f99157 -} - -.highlight .code .doctag, -.highlight .code .regexp, -.highlight .code .string { - color: #8abeb7 -} - -.highlight .code .built_in, -.highlight .code .name, -.highlight .code .section, -.highlight .code .title { - color: #b5bd68 -} - -.highlight .code .class .title, -.highlight .code .selector-id, -.highlight .code .template-variable, -.highlight .code .variable { - color: #fc6 -} - -.highlight .code .name, -.highlight .code .section, -.highlight .code .strong { - font-weight: 700 -} - -.highlight .code .bullet, -.highlight .code .link, -.highlight .code .meta, -.highlight .code .subst, -.highlight .code .symbol { - color: #f99157 -} - -.highlight .code .deletion { - color: #dc322f -} - -.highlight .code .formula { - background: #eee8d5 -} - -.highlight .code .attr, -.highlight .code .attribute { - color: #81a2be -} - -.highlight .code .emphasis { - font-style: italic -} - -pre { - line-height: 22px -} - -pre code { - display: block; - padding: 0; - border: 0 -} - -code { - border-radius: 2px; - -webkit-border-radius: 2px -} - -.highlight figcaption { - margin: -5px 0 5px; - color: #908d8d; - font-size: .9em; - transform: scale(1) -} - -.highlight figcaption a { - float: right; - color: #908d8d; - font-style: italic; - font-size: .8em; - background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); - background-position: bottom; - background-size: 100% 6px; - background-repeat: repeat-x -} - -.highlight:hover .btn-copy { - opacity: 1 -} - -.highlight .btn-copy { - font-size: 1.2rem; - position: absolute; - right: 20px; - opacity: 0; - transition: opacity .2s ease-in -} - -.highlight .btn-copy:hover { - color: #2bbc8a -} - -.highlight pre { - margin: 0; - padding: 0; - border: 0; - background: 0 0 -} - -.highlight table { - width: auto -} - -.highlight td.gutter { - text-align: right; - opacity: .2 -} - -.highlight .line { - height: 22px -} - -a, -abbr, -acronym, -address, -applet, -article, -aside, -audio, -b, -big, -blockquote, -canvas, -caption, -center, -cite, -code, -dd, -del, -details, -dfn, -div, -dl, -dt, -em, -embed, -fieldset, -figcaption, -figure, -footer, -form, -h1, -h2, -h3, -h4, -h5, -h6, -header, -hgroup, -html, -i, -iframe, -img, -ins, -kbd, -label, -legend, -li, -mark, -menu, -nav, -object, -ol, -output, -p, -pre, -q, -ruby, -s, -samp, -section, -small, -span, -strike, -strong, -sub, -summary, -sup, -table, -tbody, -td, -tfoot, -th, -thead, -time, -tr, -tt, -u, -ul, -var, -video { - margin: 0; - padding: 0; - border: 0; - font: inherit; - vertical-align: baseline -} - -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -menu, -nav, -section { - display: block -} - -.foo-footer ul, -.foo-grid, -ol, -ul { - list-style: none -} - -blockquote, -q { - quotes: none -} - -blockquote:after, -blockquote:before, -q:after, -q:before { - content: none -} - -table { - border-collapse: collapse; - border-spacing: 0 -} - -.foo-footer ul { - margin: 0; - padding: 0 0 0 16px; - white-space: nowrap; - text-overflow: ellipsis -} - -.foo-grid { - padding: 0; - margin: 0 0 0-24px -} - -.foo-grid__item { - display: inline-block; - vertical-align: top; - width: 100%; - box-sizing: border-box -} - -.foo-console, -.foo-console .foo-terminal-output .foo-output--column, -.foo-grid__item { - padding-left: 24px -} - -.foo-console, -.foo-console .foo-terminal-output .foo-output--column, -.foo-editor { - display: inline-block; - vertical-align: top; - box-sizing: border-box -} - -.foo-grid--rev { - direction: rtl; - text-align: left -} - -.foo-console .foo-terminal-output .foo-grid--rev>.foo-output--column, -.foo-grid--rev>.foo-console, -.foo-grid--rev>.foo-editor, -.foo-grid--rev>.foo-grid__item { - direction: ltr; - text-align: left -} - -.foo-grid--full { - margin-left: 0 -} - -.foo-console .foo-terminal-output .foo-grid--full>.foo-output--column, -.foo-grid--full>.foo-console, -.foo-grid--full>.foo-editor, -.foo-grid--full>.foo-grid__item { - padding-left: 0 -} - -.foo-grid--right { - text-align: right -} - -.foo-console .foo-terminal-output .foo-grid--center>.foo-output--column, -.foo-console .foo-terminal-output .foo-grid--right>.foo-output--column, -.foo-grid--center>.foo-console, -.foo-grid--center>.foo-editor, -.foo-grid--center>.foo-grid__item, -.foo-grid--right>.foo-console, -.foo-grid--right>.foo-editor, -.foo-grid--right>.foo-grid__item { - text-align: left -} - -.foo-grid--center { - text-align: center -} - -.foo-console .foo-terminal-output .foo-grid--middle>.foo-output--column, -.foo-grid--middle>.foo-console, -.foo-grid--middle>.foo-editor, -.foo-grid--middle>.foo-grid__item { - vertical-align: middle -} - -.foo-console .foo-terminal-output .foo-grid--bottom>.foo-output--column, -.foo-grid--bottom>.foo-console, -.foo-grid--bottom>.foo-editor, -.foo-grid--bottom>.foo-grid__item { - vertical-align: bottom -} - -.foo-grid--narrow { - margin-left: -12px -} - -.foo-console .foo-terminal-output .foo-grid--narrow>.foo-output--column, -.foo-grid--narrow>.foo-console, -.foo-grid--narrow>.foo-editor, -.foo-grid--narrow>.foo-grid__item { - padding-left: 12px -} - -.foo-grid--wide { - margin-left: -48px -} - -.foo-console .foo-terminal-output .foo-grid--wide>.foo-output--column, -.foo-grid--wide>.foo-console, -.foo-grid--wide>.foo-editor, -.foo-grid--wide>.foo-grid__item { - padding-left: 48px -} - -.foo-one-whole { - width: 100% -} - -.foo-five-tenths, -.foo-four-eighths, -.foo-one-half, -.foo-six-twelfths, -.foo-three-sixths, -.foo-two-quarters { - width: 50% -} - -.foo-console .foo-terminal-output .foo-output--column, -.foo-four-twelfths, -.foo-one-third, -.foo-two-sixths { - width: 33.333% -} - -.foo-eight-twelfths, -.foo-four-sixths, -.foo-two-thirds { - width: 66.666% -} - -.foo-one-quarter, -.foo-three-twelfths, -.foo-two-eighths { - width: 25% -} - -.foo-nine-twelfths, -.foo-six-eighths, -.foo-three-quarters { - width: 75% -} - -.foo-one-fifth, -.foo-two-tenths { - width: 20% -} - -.foo-four-tenths, -.foo-two-fifths { - width: 40% -} - -.foo-six-tenths, -.foo-three-fifths { - width: 60% -} - -.foo-eight-tenths, -.foo-four-fifths { - width: 80% -} - -.foo-one-sixth, -.foo-two-twelfths { - width: 16.666% -} - -.foo-five-sixths, -.foo-ten-twelfths { - width: 83.333% -} - -.foo-one-eighth { - width: 12.5% -} - -.foo-three-eighths { - width: 37.5% -} - -.foo-five-eighths { - width: 62.5% -} - -.foo-seven-eighths { - width: 87.5% -} - -.foo-one-tenth { - width: 10% -} - -.foo-three-tenths { - width: 30% -} - -.foo-seven-tenths { - width: 70% -} - -.foo-nine-tenths { - width: 90% -} - -.foo-one-twelfth { - width: 8.333% -} - -.foo-five-twelfths { - width: 41.666% -} - -.foo-seven-twelfths { - width: 58.333% -} - -.foo-eleven-twelfths { - width: 91.666% -} - -@media only screen and (max-width:480px) { - .foo-palm--one-whole { - width: 100% - } - - .foo-palm--five-tenths, - .foo-palm--four-eighths, - .foo-palm--one-half, - .foo-palm--six-twelfths, - .foo-palm--three-sixths, - .foo-palm--two-quarters { - width: 50% - } - - .foo-palm--four-twelfths, - .foo-palm--one-third, - .foo-palm--two-sixths { - width: 33.333% - } - - .foo-palm--eight-twelfths, - .foo-palm--four-sixths, - .foo-palm--two-thirds { - width: 66.666% - } - - .foo-palm--one-quarter, - .foo-palm--three-twelfths, - .foo-palm--two-eighths { - width: 25% - } - - .foo-palm--nine-twelfths, - .foo-palm--six-eighths, - .foo-palm--three-quarters { - width: 75% - } - - .foo-palm--one-fifth, - .foo-palm--two-tenths { - width: 20% - } - - .foo-palm--four-tenths, - .foo-palm--two-fifths { - width: 40% - } - - .foo-palm--six-tenths, - .foo-palm--three-fifths { - width: 60% - } - - .foo-palm--eight-tenths, - .foo-palm--four-fifths { - width: 80% - } - - .foo-palm--one-sixth, - .foo-palm--two-twelfths { - width: 16.666% - } - - .foo-palm--five-sixths, - .foo-palm--ten-twelfths { - width: 83.333% - } - - .foo-palm--one-eighth { - width: 12.5% - } - - .foo-palm--three-eighths { - width: 37.5% - } - - .foo-palm--five-eighths { - width: 62.5% - } - - .foo-palm--seven-eighths { - width: 87.5% - } - - .foo-palm--one-tenth { - width: 10% - } - - .foo-palm--three-tenths { - width: 30% - } - - .foo-palm--seven-tenths { - width: 70% - } - - .foo-palm--nine-tenths { - width: 90% - } - - .foo-palm--one-twelfth { - width: 8.333% - } - - .foo-palm--five-twelfths { - width: 41.666% - } - - .foo-palm--seven-twelfths { - width: 58.333% - } - - .foo-palm--eleven-twelfths { - width: 91.666% - } -} - -@media only screen and (min-width:481px) and (max-width:1023px) { - .foo-lap--one-whole { - width: 100% - } - - .foo-lap--five-tenths, - .foo-lap--four-eighths, - .foo-lap--one-half, - .foo-lap--six-twelfths, - .foo-lap--three-sixths, - .foo-lap--two-quarters { - width: 50% - } - - .foo-lap--four-twelfths, - .foo-lap--one-third, - .foo-lap--two-sixths { - width: 33.333% - } - - .foo-lap--eight-twelfths, - .foo-lap--four-sixths, - .foo-lap--two-thirds { - width: 66.666% - } - - .foo-lap--one-quarter, - .foo-lap--three-twelfths, - .foo-lap--two-eighths { - width: 25% - } - - .foo-lap--nine-twelfths, - .foo-lap--six-eighths, - .foo-lap--three-quarters { - width: 75% - } - - .foo-lap--one-fifth, - .foo-lap--two-tenths { - width: 20% - } - - .foo-lap--four-tenths, - .foo-lap--two-fifths { - width: 40% - } - - .foo-lap--six-tenths, - .foo-lap--three-fifths { - width: 60% - } - - .foo-lap--eight-tenths, - .foo-lap--four-fifths { - width: 80% - } - - .foo-lap--one-sixth, - .foo-lap--two-twelfths { - width: 16.666% - } - - .foo-lap--five-sixths, - .foo-lap--ten-twelfths { - width: 83.333% - } - - .foo-lap--one-eighth { - width: 12.5% - } - - .foo-lap--three-eighths { - width: 37.5% - } - - .foo-lap--five-eighths { - width: 62.5% - } - - .foo-lap--seven-eighths { - width: 87.5% - } - - .foo-lap--one-tenth { - width: 10% - } - - .foo-lap--three-tenths { - width: 30% - } - - .foo-lap--seven-tenths { - width: 70% - } - - .foo-lap--nine-tenths { - width: 90% - } - - .foo-lap--one-twelfth { - width: 8.333% - } - - .foo-lap--five-twelfths { - width: 41.666% - } - - .foo-lap--seven-twelfths { - width: 58.333% - } - - .foo-lap--eleven-twelfths { - width: 91.666% - } -} - -@media only screen and (max-width:1023px) { - - .foo-console, - .foo-editor, - .foo-portable--one-whole { - width: 100% - } - - .foo-portable--five-tenths, - .foo-portable--four-eighths, - .foo-portable--one-half, - .foo-portable--six-twelfths, - .foo-portable--three-sixths, - .foo-portable--two-quarters { - width: 50% - } - - .foo-portable--four-twelfths, - .foo-portable--one-third, - .foo-portable--two-sixths { - width: 33.333% - } - - .foo-portable--eight-twelfths, - .foo-portable--four-sixths, - .foo-portable--two-thirds { - width: 66.666% - } - - .foo-portable--one-quarter, - .foo-portable--three-twelfths, - .foo-portable--two-eighths { - width: 25% - } - - .foo-portable--nine-twelfths, - .foo-portable--six-eighths, - .foo-portable--three-quarters { - width: 75% - } - - .foo-portable--one-fifth, - .foo-portable--two-tenths { - width: 20% - } - - .foo-portable--four-tenths, - .foo-portable--two-fifths { - width: 40% - } - - .foo-portable--six-tenths, - .foo-portable--three-fifths { - width: 60% - } - - .foo-portable--eight-tenths, - .foo-portable--four-fifths { - width: 80% - } - - .foo-portable--one-sixth, - .foo-portable--two-twelfths { - width: 16.666% - } - - .foo-portable--five-sixths, - .foo-portable--ten-twelfths { - width: 83.333% - } - - .foo-portable--one-eighth { - width: 12.5% - } - - .foo-portable--three-eighths { - width: 37.5% - } - - .foo-portable--five-eighths { - width: 62.5% - } - - .foo-portable--seven-eighths { - width: 87.5% - } - - .foo-portable--one-tenth { - width: 10% - } - - .foo-portable--three-tenths { - width: 30% - } - - .foo-portable--seven-tenths { - width: 70% - } - - .foo-portable--nine-tenths { - width: 90% - } - - .foo-portable--one-twelfth { - width: 8.333% - } - - .foo-portable--five-twelfths { - width: 41.666% - } - - .foo-portable--seven-twelfths { - width: 58.333% - } - - .foo-portable--eleven-twelfths { - width: 91.666% - } -} - -@media only screen and (min-width:1024px) { - .foo-desk--one-whole { - width: 100% - } - - .foo-desk--five-tenths, - .foo-desk--four-eighths, - .foo-desk--one-half, - .foo-desk--six-twelfths, - .foo-desk--three-sixths, - .foo-desk--two-quarters { - width: 50% - } - - .foo-desk--four-twelfths, - .foo-desk--one-third, - .foo-desk--two-sixths { - width: 33.333% - } - - .foo-desk--eight-twelfths, - .foo-desk--four-sixths, - .foo-desk--two-thirds { - width: 66.666% - } - - .foo-desk--one-quarter, - .foo-desk--three-twelfths, - .foo-desk--two-eighths { - width: 25% - } - - .foo-desk--nine-twelfths, - .foo-desk--six-eighths, - .foo-desk--three-quarters { - width: 75% - } - - .foo-desk--one-fifth, - .foo-desk--two-tenths { - width: 20% - } - - .foo-desk--four-tenths, - .foo-desk--two-fifths { - width: 40% - } - - .foo-desk--six-tenths, - .foo-desk--three-fifths { - width: 60% - } - - .foo-desk--eight-tenths, - .foo-desk--four-fifths { - width: 80% - } - - .foo-desk--one-sixth, - .foo-desk--two-twelfths { - width: 16.666% - } - - .foo-desk--five-sixths, - .foo-desk--ten-twelfths { - width: 83.333% - } - - .foo-desk--one-eighth { - width: 12.5% - } - - .foo-desk--three-eighths { - width: 37.5% - } - - .foo-desk--five-eighths { - width: 62.5% - } - - .foo-desk--seven-eighths { - width: 87.5% - } - - .foo-desk--one-tenth { - width: 10% - } - - .foo-desk--three-tenths { - width: 30% - } - - .foo-desk--seven-tenths { - width: 70% - } - - .foo-desk--nine-tenths { - width: 90% - } - - .foo-desk--one-twelfth { - width: 8.333% - } - - .foo-desk--five-twelfths { - width: 41.666% - } - - .foo-desk--seven-twelfths { - width: 58.333% - } - - .foo-desk--eleven-twelfths { - width: 91.666% - } -} - -.foo-cmd .foo-format, -.foo-cmd .foo-prompt div, -.foo-footer li, -.foo-terminal .foo-terminal-output .foo-format, -.foo-terminal .foo-terminal-output div span { - display: inline-block -} - -.foo-cmd .foo-clipboard { - position: absolute; - top: 0; - left: 0; - opacity: .01; - width: 2px -} - -.foo-terminal { - padding: 10px; - position: relative; - overflow: hidden -} - -.foo-cmd { - padding: 0; - margin: 0; - height: 1.3em -} - -.foo-cmd .foo-cursor.foo-blink { - -webkit-animation: blink 1s infinite steps(1, start); - animation: blink 1s infinite steps(1, start) -} - -.foo-cmd .foo-prompt, -.foo-terminal .foo-terminal-output div div { - display: block; - line-height: 14px; - height: auto -} - -.foo-cmd .foo-prompt, -.foo-cmd span { - float: left -} - -.foo-cmd, -.foo-terminal { - font-family: FreeMono, monospace; - color: #aaa; - background-color: #000; - font-size: 12px; - line-height: 14px -} - -.foo-terminal-output>div { - min-height: 14px; - -ms-word-break: break-all; - word-break: break-word; - word-wrap: break-word -} - -.foo-cmd .foo-cursor.foo-blink, -.foo-cmd .foo-inverted, -.foo-terminal .foo-inverted { - background-color: #f48020; - color: #111 -} - -.foo-terminal .foo-terminal-output div.foo-error, -.foo-terminal .foo-terminal-output div.foo-error div { - color: red -} - -.foo-tilda { - position: fixed; - top: 0; - left: 0; - width: 100%; - z-index: 1100 -} - -.foo-clear { - clear: both -} - -@font-face { - font-family: "Share Tech Mono"; - font-style: normal; - font-weight: 400; - src: url(/website/fonts/share-tech-mono-v15-latin-regular.eot); - src: local(""), url(/website/fonts/share-tech-mono-v15-latin-regular.eot?#iefix)format("embedded-opentype"), url(/website/fonts/share-tech-mono-v15-latin-regular.woff2)format("woff2"), url(/website/fonts/share-tech-mono-v15-latin-regular.woff)format("woff"), url(/website/fonts/share-tech-mono-v15-latin-regular.ttf)format("truetype"), url(/website/fonts/share-tech-mono-v15-latin-regular.svg#ShareTechMono)format("svg") -} - -.foo-fadeInUp, -.foo-fadeOutDown { - -webkit-animation-duration: .3s; - animation-duration: .3s; - -webkit-animation-fill-mode: both; - animation-fill-mode: both -} - -.foo-fadeOutDown { - -webkit-animation-name: fadeOutDown; - animation-name: fadeOutDown -} - -.foo-fadeInUp { - -webkit-animation-name: fadeInUp; - animation-name: fadeInUp -} - -.foo-close, -.foo-grab-bg, -.foo-grab-bg-h, -.foo-resizer i.foo-horizontal, -.foo-resizer i.foo-vertical { - background-image: url(../img/sprite.png); - background-repeat: no-repeat -} - -.foo-grab-bg, -.foo-resizer i.foo-vertical { - background-position: 0 0; - width: 9px; - height: 32px -} - -.foo-grab-bg-h, -.foo-resizer i.foo-horizontal { - background-position: -9px 0; - width: 32px; - height: 9px -} - -.foo-close { - background-position: -9px -9px; - width: 18px; - height: 18px -} - -@media screen and (-webkit-min-device-pixel-ratio:1), -screen and (min--moz-device-pixel-ratio:1), -screen and (-o-min-device-pixel-ratio:100/100), -screen and (min-device-pixel-ratio:1), -screen and (min-resolution:1dppx) { - - .foo-close, - .foo-grab-bg, - .foo-grab-bg-h, - .foo-resizer i.foo-horizontal, - .foo-resizer i.foo-vertical { - background-image: url(../img/sprite.png); - background-size: 41px 32px - } -} - -@media screen and (-webkit-min-device-pixel-ratio:2), -screen and (min--moz-device-pixel-ratio:2), -screen and (-o-min-device-pixel-ratio:200/100), -screen and (min-device-pixel-ratio:2), -screen and (min-resolution:2dppx) { - - .foo-close, - .foo-grab-bg, - .foo-grab-bg-h, - .foo-resizer i.foo-horizontal, - .foo-resizer i.foo-vertical { - background-image: url(../img/sprite@2x.png); - background-size: 41px 32px - } -} - -*, -:after, -:before { - box-sizing: border-box -} - -body, -html { - height: 100% -} - -body { - color: #fff; - font: 16px/1.2"Share Tech Mono", monospace; - -webkit-font-smoothing: antialiased -} - -.foo-contact, -.foo-content { - position: relative -} - -.foo-content { - height: 100% -} - -.foo-content:after, -.foo-content:before { - content: " "; - display: table -} - -.foo-content:after { - clear: both -} - -.foo-contact { - height: 10% -} - -.foo-contact:after, -.foo-contact:before { - content: " "; - display: table -} - -.foo-contact:after { - clear: both -} - -@media only screen and (min-width:1024px) { - .foo-logo { - border-right: 1px solid #35bdb8; - float: left; - height: 100%; - position: relative; - text-align: center; - width: 140px - } - - .foo-logo img { - margin-top: 25%; - width: 55% - } -} - -@media only screen and (max-width:1023px) { - .foo-logo { - float: top; - border-bottom: 1px solid #35bdb8; - position: relative; - text-align: left - } - - .foo-logo img { - margin-left: 3%; - margin-top: 3%; - margin-bottom: 3%; - height: 3%; - width: 7% - } -} - -.foo-footer { - position: absolute; - bottom: 0; - color: #999; - left: 0; - right: 0; - height: 50px; - z-index: 3; - padding: 17px 0 15px; - background-color: #3d3d3d; - font-size: 16px -} - -.foo-footer li { - margin-right: 16px -} - -.foo-btn { - text-decoration: none; - background-color: #ef67a5; - color: #111; - padding: 0 .1em; - border: 0; - outline: 0; - font-family: inherit; - font-size: inherit; - cursor: pointer -} - -.foo-footer a { - color: #d7d7d7; - text-decoration: none -} - -.foo-footer a:hover { - color: #35bdb8 -} - -.foo-console.foo-terminal .foo-animation, -.foo-footer ul { - overflow: hidden -} - -.foo-console.foo-terminal .foo-animation__frame { - font-size: 12px !important; - line-height: 14px !important; - width: 999em; - white-space: pre; - display: none -} - -.foo-console.foo-terminal .foo-animation__frame--visible { - display: block -} - -.foo-interface { - z-index: 1; - overflow: hidden; - background-color: #111; - transition: background-color .15s ease; - position: absolute; - bottom: 50px; - right: 0 -} - -@media only screen and (max-width:1023px) { - .foo-interface { - top: 140px; - left: 0 - } -} - -@media only screen and (min-width:1024px) { - .foo-interface { - top: 0; - left: 140px - } -} - -.foo-interface.foo-editor--opened, -body { - background-color: #2b2d2d -} - -.foo-interface.foo-is-resizing { - cursor: col-resize -} - -.foo-interface .foo-console { - border: 2px solid transparent -} - -.foo-interface .foo-console:focus { - border-color: #f4b400 -} - -.foo-interface .foo-editor .foo-editor__head { - border: 2px solid transparent; - border-bottom: 1px solid #35bdb8 -} - -.foo-interface .foo-editor .foo-editor__foot { - border: 2px solid transparent; - border-bottom: 2px solid transparent; - border-top: 1px solid #35bdb8 -} - -.foo-interface .foo-editor .foo-editor__content { - border-left: 2px solid transparent; - border-right: 2px solid transparent -} - -.foo-interface .foo-editor:focus .foo-editor__content, -.foo-interface .foo-editor:focus .foo-editor__head { - border-left-color: #f4b400; - border-right-color: #f4b400 -} - -.foo-interface .foo-editor:focus .foo-editor__head { - border-top-color: #f4b400 -} - -.foo-interface .foo-editor:focus .foo-editor__foot { - border-left-color: #f4b400; - border-right-color: #f4b400; - border-bottom-color: #f4b400; - border-top: 1px solid #35bdb8 -} - -.foo-console { - width: 100%; - height: 100%; - overflow-y: auto; - padding-right: 32px; - z-index: 2 -} - -.foo-console::-webkit-scrollbar-track { - background-color: #262828 -} - -.foo-console::-webkit-scrollbar { - width: 10px; - background-color: #5b5b5b; - padding: 3px -} - -.foo-console::-webkit-scrollbar-thumb { - background-color: #5b5b5b -} - -@media only screen and (max-width:1023px) { - .foo-console { - padding-right: 10px; - padding-bottom: 32px; - bottom: 0 - } -} - -.foo-editor--opened .foo-console { - width: 49% -} - -@media only screen and (max-width:1023px) { - .foo-editor--opened .foo-console { - width: 100% !important; - height: 49% - } -} - -@media only screen and (min-width:1024px) { - .foo-editor--opened .foo-console { - height: 100% !important - } -} - -.foo-console, -.foo-console .foo-cmd { - background-color: #2b2d2d; - transition: background-color .15s ease -} - -.foo-console.foo-active, -.foo-console.foo-active .foo-cmd { - background-color: #111 -} - -.foo-question__options li { - padding-left: 36px; - position: relative -} - -.foo-question__options li:before { - content: "⬡"; - position: absolute; - left: 6px; - top: -1px -} - -.foo-question__options li.foo-option--selected:before { - content: "⬢"; - color: #00e575 -} - -.foo-question__options li.foo-option--selected:after { - content: "❯"; - position: absolute; - left: -5px; - top: 0 -} - -.foo-console, -.foo-console .foo-cmd { - font-family: "Share Tech Mono", monospace; - color: #fff -} - -.foo-console, -.foo-console .foo-cmd, -.foo-console .foo-cmd .foo-prompt, -.foo-console.foo-terminal .foo-terminal-output div div { - font-size: 16px; - line-height: 1.4 -} - -.foo-console.foo-terminal .foo-terminal-output div div { - margin-bottom: 8px -} - -.foo-console .foo-terminal-output .foo-output--prompt, -.foo-console .foo-terminal-output .foo-preformatted { - white-space: pre-wrap -} - -.foo-console .foo-terminal-output .foo-output--column:nth-child(3n+1) { - padding-left: 0 -} - -.foo-console .foo-terminal-output .foo-terminal-list { - display: table-row; - margin: 20px 0 -} - -.foo-console .foo-terminal-output .foo-list--padded { - display: table-cell -} - -.foo-console .foo-terminal-output .foo-list--padded:not(.foo-preformatted) { - width: 12ex -} - -.foo-console .foo-terminal-output .foo-list--definition { - display: table-cell; - position: relative; - text-transform: lowercase -} - -.foo-console .foo-terminal-output .foo-list--definition:before { - content: "- "; - position: absolute; - left: -2ex -} - -.foo-output--prompt { - word-break: break-all -} - -.foo-console .foo-prompt, -.foo-terminal-output .foo-output--prompt span { - color: #f48020 -} - -.foo-console .foo-prompt.foo-is-disabled { - pointer-events: none; - display: none -} - -.foo-console .foo-cmd .foo-cursor { - background-color: #f48020; - color: #fff -} - -.foo-term-pink { - color: #ef67a5 -} - -.foo-console .foo-terminal-output .foo-list--folder, -.foo-term-blue { - color: #35bdb8 -} - -.foo-term-green { - color: #00e575 -} - -.foo-term-orange { - color: #f48020 -} - -.foo-term-red { - color: #ec1b52 -} - -.foo-term-yellow { - color: #f4b400 -} - -.foo-console .foo-prompt+span, -.foo-term-white { - color: #fff -} - -.foo-term-grey { - color: #656565 -} - -.foo-term-story { - border-left: 8px solid #ef67a5; - color: #35bdb8; - padding: 5px 10px; - margin: 12px 0 -} - -.foo-editor { - height: 100%; - opacity: 0; - overflow: hidden; - padding: 0; - position: relative; - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in-out; - transition: transform .2s ease-in-out, opacity .2s ease-in-out; - width: 49%; - z-index: 4 -} - -@media only screen and (max-width:1023px) { - .foo-editor { - height: 49%; - width: 100% !important; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) - } -} - -@media only screen and (min-width:1024px) { - .foo-editor { - height: 100% !important - } -} - -.foo-editor.foo-editor--opened { - opacity: 1; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0) -} - -.foo-editor.foo-editor--dirty .foo-editor__filename:after { - content: "*" -} - -.foo-editor.foo-editor--dirty .foo-editor__save:not(.foo-editor__save--disabled) { - cursor: pointer; - background-color: #ef67a5; - color: #2b2d2d -} - -.foo-editor.foo-active .foo-editor__resizer { - background-color: #2b2d2d -} - -.foo-editor.foo-active .foo-editor__resizer:hover { - background-color: #373a3a -} - -.foo-ace_editor { - font-family: "Share Tech Mono", monospace !important; - line-height: 1.4 !important; - font-size: 16px !important -} - -.foo-ace_scrollbar::-webkit-scrollbar-track { - background-color: #262828 -} - -.foo-ace_scrollbar::-webkit-scrollbar { - width: 10px; - background-color: #5b5b5b; - padding: 3px -} - -.foo-ace_scrollbar::-webkit-scrollbar-thumb { - background-color: #5b5b5b -} - -.foo-editor__content { - position: absolute !important; - top: 34px; - bottom: 38px; - left: 0; - right: 0 -} - -.foo-editor__content.foo-ace-monokai, -.foo-editor__content.foo-ace-monokai .foo-ace_gutter, -.foo-editor__content.foo-ace-monokai .foo-ace_gutter-active-line { - background-color: #2b2d2d; - transition: background-color .15s ease -} - -.foo-editor__content.foo-ace_editor.foo-ace-monokai .foo-ace_marker-layer .foo-ace_selection { - background: #444 -} - -.foo-editor__content.foo-active, -.foo-editor__content.foo-active .foo-ace-content { - background-color: #111 -} - -.foo-editor__content.foo-active .foo-ace-content .foo-ace_gutter, -.foo-editor__content.foo-active .foo-ace_gutter { - background-color: #000 !important -} - -.foo-editor__content.foo-ace-monokai.foo-active .foo-ace_gutter-active-line { - background-color: #272727 -} - -.foo-editor__content.foo-ace-monokai .foo-ace_comment { - color: #86816b -} - -.foo-editor.foo-editor-prompter--active .foo-editor__content { - pointer-events: none !important -} - -.foo-editor.foo-editor-prompter--active .foo-editor__content .foo-ace_cursor { - display: none -} - -.foo-editor__head { - height: 34px; - top: 0; - border-bottom: 1px solid #35bdb8 -} - -.foo-editor__foot, -.foo-editor__head { - position: absolute; - width: 100%; - background-color: #666; - padding: 8px 10px -} - -.foo-editor__head__meta-data { - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis -} - -.foo-editor__close { - float: right; - cursor: pointer; - border: 0; - outline: 0; - background-color: transparent; - margin: 0 -} - -.foo-editor__save { - cursor: default; - background-color: transparent; - color: #f0f0f0; - transition: background-color .2s ease-in-out, color .2s ease-in-out -} - -.foo-editor__save[disabled] { - cursor: not-allowed -} - -.foo-editor__foot { - top: auto; - bottom: 0; - border-bottom: none; - border-top: 1px solid #35bdb8; - z-index: 10; - height: 38px; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - transition: -webkit-transform .2s ease-out, opacity .2s ease-out; - transition: transform .2s ease-out, opacity .2s ease-out -} - -.foo-editor.foo-editor-prompter--active .foo-editor__foot { - opacity: 0; - -webkit-transform: translate3d(0, 40px, 0); - transform: translate3d(0, 40px, 0) -} - -.foo-error { - position: absolute; - top: 40%; - left: 20%; - width: 60%; - height: 40%; - text-align: center -} - -.foo-error__logo { - width: 130px; - height: 120px -} - -.foo-error__message { - margin-top: 60px; - line-height: 1.6 -} - -.foo-error__message a { - color: #fff; - background-color: #35bdb8; - text-decoration: none -} - -.foo-countdown-timer__holder { - position: absolute; - bottom: 50px; - left: 0; - z-index: 20 -} - -.foo-countdown-timer .foo-countdown-timer__time { - background-color: #666; - transition: background-color .15s ease -} - -.foo-countdown-timer__text { - background-color: #666 -} - -.foo-countdown-timer--low .foo-countdown-timer__text, -.foo-countdown-timer--low .foo-countdown-timer__time { - background-color: #ec1b52 -} - -.foo-countdown-timer--low { - -webkit-animation: flash 1s .75s 2 normal both; - animation: flash 1s .75s 2 normal both -} - -.foo-countdown-timer__time { - padding: 9px 8px -} - -.foo-countdown-timer { - display: none; - width: 139px; - text-align: center; - position: relative; - border-top: 1px solid #2b2d2d; - cursor: default -} - -.foo-countdown-timer:first-child { - border-top: 0 -} - -.foo-countdown-timer__text { - position: absolute; - bottom: 0; - white-space: nowrap; - padding: 9px 10px; - z-index: -1; - -webkit-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0); - transition: -webkit-transform .2s ease-out; - transition: transform .2s ease-out -} - -.foo-ie9 .foo-countdown-timer__text { - left: -300px -} - -.foo-countdown-timer__time, -.foo-prompter { - width: 100%; - display: block; - position: relative; - z-index: 2 -} - -.foo-prompter { - position: absolute; - bottom: 0; - opacity: 1; - z-index: 20; - padding: 20px; - border-top: 1px solid #35bdb8; - background-color: #666; - color: #fff; - transition: all .3s ease-out -} - -.foo-countdown-timer__time:hover+.foo-countdown-timer__text { - -webkit-transform: translate3d(130px, 0, 0); - transform: translate3d(130px, 0, 0) -} - -.foo-ie9 .foo-countdown-timer__time:hover+.foo-countdown-timer__text { - left: 139px -} - -.foo-prompter.foo-is-hidden { - bottom: -30px; - opacity: 0; - z-index: -1 -} - -.foo-prompter__text input { - font-family: "Share Tech Mono", monospace; - font-size: 16px; - line-height: 1.2; - -webkit-font-smoothing: antialiased; - border: 0; - color: inherit; - margin: 0; - padding: 0; - background-color: transparent; - outline-style: none; - box-shadow: none -} - -.foo-resizer { - display: none; - position: relative; - height: 100%; - width: 2%; - background-color: #111; - transition: background-color .15s ease; - cursor: col-resize; - z-index: 10 -} - -.foo-editor--opened .foo-resizer { - display: inline-block -} - -.foo-editor--is-active .foo-resizer { - background-color: #2b2d2d -} - -.foo-resizer:hover { - background-color: #1e1e1e -} - -.foo-resizer i { - position: absolute; - top: 50%; - left: 50% -} - -.foo-resizer i.foo-vertical { - margin: -16px 0 0-5px; - cursor: col-resize -} - -.foo-resizer i.foo-horizontal { - margin: -5px 0 0-16px; - cursor: row-resize; - display: none -} - -@media only screen and (max-width:1023px) { - .foo-resizer { - width: 100%; - height: 2%; - cursor: row-resize - } - - .foo-resizer i.foo-vertical { - display: none - } - - .foo-editor--opened .foo-resizer, - .foo-resizer i.foo-horizontal { - display: block - } -} - -.foo-shortcuts { - position: absolute; - bottom: 9px; - right: 10px; - z-index: 12; - font-size: 14px; - color: #f0f0f0 -} - -.foo-shortcuts__legend li { - display: inline-block; - margin-right: 10px -} - -.foo-shortcut.foo-shortcut--control-command:before, -.foo-shortcut.foo-shortcut--control:before { - content: "^" -} - -.foo-shortcuts--mac .foo-shortcut--control-command:before { - content: "⌘" -} - -.foo-support { - position: absolute; - top: 0; - left: 20%; - width: 60%; - height: 40%; - text-align: center -} - -.foo-support__message { - margin-top: 60px; - line-height: 1.6 -} - -.foo-support__message a { - color: #fff; - text-decoration: underline -} - -.foo-cf:after, -.foo-cf:before { - content: " "; - display: table -} - -.foo-cf:after { - clear: both -} \ No newline at end of file diff --git a/src/Blog.elm b/src/Blog.elm index 359ba33..19453a0 100644 --- a/src/Blog.elm +++ b/src/Blog.elm @@ -56,20 +56,22 @@ view : Model -> Html Msg view model = div [ class "foo-interface" ] [ div [ class "foo-console foo-terminal foo-active" ] - [ div [ class "main-wrapper" ] - [ main_ [ class "main-content", id "content" ] - [ case model.blog of - Just blog -> - case blog.meta.image of - Just image -> - img [ src image ] [] + [ div [ class "page-wrapper category-html document-page" ] + [ div [ class "main-wrapper" ] + [ main_ [ class "main-content", id "content" ] + [ case model.blog of + Just blog -> + case blog.meta.image of + Just image -> + img [ src image ] [] - Nothing -> - text "" + Nothing -> + text "" - Nothing -> - text "" - , viewArticle model.success + Nothing -> + text "" + , viewArticle model + ] ] ] ] @@ -102,21 +104,21 @@ viewToc show = div [] [] -viewArticle : Bool -> Html Msg -viewArticle show = +viewArticle : Model -> Html Msg +viewArticle model = article [ class "main-page-content" ] [ div [ id "insert-here" ] [] - , viewMetadata show + , viewMetadata model ] -viewMetadata : Bool -> Html Msg -viewMetadata show = +viewMetadata : Model -> Html Msg +viewMetadata model = aside [ class "metadata" , style "display" - (if show then + (if model.success then "block" else @@ -128,12 +130,23 @@ viewMetadata show = [ h3 [] [ text "Found a problem" ] , ul [] [ li [] - [ a [ href "https://github.com/avinal" ] - [ text "open an issue" ] + [ a + [ href + ("https://github.com/avinal/avinal.github.io/issues/new?title=blog:" + ++ (case model.blog of + Just blog -> + blog.meta.title + + Nothing -> + model.markdownUrl + ) + ) + ] + [ text "Open an issue on ", i [ class "fa-brands fa-github" ] [] ] ] , li [] - [ a [ href "https://avinal.space" ] - [ text "Website" ] + [ a [ href "mailto:ripple+blog@avinal.space" ] + [ text "Contact me via email" ] ] ] ] @@ -147,24 +160,70 @@ type Msg | NoSuchPage +{-| To maintain compatibility with old links + + Old links: + New links: + +-} +removeHtmlSuffix : String -> String +removeHtmlSuffix slug = + if String.right 5 slug == ".html" then + String.dropRight 5 slug + + else + slug + + init : List String -> ( Model, Cmd Msg ) init pathList = case pathList of [ category, slug, fragment ] -> + let + requestUrl = + Base.contentUrlPrefix + ++ "posts/" + ++ category + ++ "/" + ++ removeHtmlSuffix slug + ++ ".md" + in ( { initialModel - | markdownUrl = Base.contentUrlPrefix ++ "posts/" ++ category ++ "/" ++ slug ++ ".md" + | markdownUrl = requestUrl , fragment = fragment } - , getMarkdown (Base.contentUrlPrefix ++ "posts/" ++ category ++ "/" ++ slug ++ ".md") + , getMarkdown requestUrl ) [ category, slug ] -> + let + requestUrl = + Base.contentUrlPrefix + ++ "posts/" + ++ category + ++ "/" + ++ removeHtmlSuffix slug + ++ ".md" + in ( { initialModel - | markdownUrl = Base.contentUrlPrefix ++ "posts/" ++ category ++ "/" ++ slug ++ ".md" + | markdownUrl = requestUrl } - , getMarkdown (Base.contentUrlPrefix ++ "posts/" ++ category ++ "/" ++ slug ++ ".md") + , getMarkdown requestUrl ) + -- [ category ] -> + -- let + -- requestUrl = + -- Base.contentUrlPrefix + -- ++ "posts/" + -- ++ category + -- ++ ".md" + -- in + -- ( { initialModel + -- | markdownUrl = requestUrl + -- } + -- , getMarkdown requestUrl + -- ) -- [ "categories" ] -> -- ( { blog = Nothing -- , markdownUrl = urlPrefix ++ "/categories" ++ ".md" @@ -182,6 +241,11 @@ init pathList = _ -> ( initialModel, Cmd.none ) +-- badPageError: String -> Cmd Msg +-- badPageError url = + + + getMarkdown : String -> Cmd Msg getMarkdown url = diff --git a/src/Splash.elm b/src/Splash.elm index 79785b9..682d77f 100644 --- a/src/Splash.elm +++ b/src/Splash.elm @@ -1,6 +1,6 @@ module Splash exposing (..) -import Html exposing (Html, a, div, i, img, span, text) +import Html exposing (Html, a, b, div, i, img, span, text) import Html.Attributes exposing (alt, class, height, href, src, width) @@ -25,10 +25,10 @@ view model = , div [ class "foo-support__message" ] [ model.support_message ] , div [ class "foo-error__message" ] [ model.error_message ] , withSpacing (div [ class "foo-support__message" ]) - [ a [ href "https://avinal.space/pages/about-me" ] [ text "About me" ] - , a [ href "https://avinal.space/posts" ] [ text "Blog" ] - , a [ href "https://avinal.space/pages/projects" ] [ text "Projects" ] - , a [ href "https://gsoc.avinal.space" ] [ text "GSoC" ] + [ a [ href "https://avinal.space/pages/about-me" ] [ b [ class "foo-term-blue" ] [ text "A" ], text "bout" ] + , a [ href "https://avinal.space/posts" ] [ b [ class "foo-term-blue" ] [ text "B" ], text "log" ] + , a [ href "https://avinal.space/pages/projects" ] [ b [ class "foo-term-blue" ] [ text "P" ], text "rojects" ] + , a [ href "https://gsoc.avinal.space" ] [ b [ class "foo-term-blue" ] [ text "G" ], text "SoC" ] ] ] ] @@ -76,7 +76,9 @@ default = ] , error_message = withSpacing (span []) - [ text "I'm Avinal, and I work at Red Hat" + [ text "I'm" + , b [ class "foo-term-pink" ] [ text "Avinal" ] + , text "and I work at Red Hat" , i [ class "fa-brands fa-redhat foo-term-red" ] [] , text "as an Associate Software Engineer for Hybrid Cloud Engineering." ]