<turbo-stream action="update" target="icon-sheet"><template><div data-controller="ruby-ui--sheet"><div data-action="click->ruby-ui--sheet#open" data-controller="click"></div><template data-ruby-ui--sheet-target="content"><div data-controller="ruby-ui--sheet-content"><div data-state="open" data-action="click->ruby-ui--sheet-content#close" class="fixed pointer-events-auto inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"></div><div data-state="open" class="fixed pointer-events-auto z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500 inset-y-0 right-0 h-full border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right w-[300px] overflow-scroll"><div class="flex flex-col space-y-1.5 sm:text-left text-left"><h3 class="text-lg font-semibold leading-none tracking-tight">Mw</h3><p class="text-sm text-muted-foreground gap-y-2">PhlexIcons::Flag</p><a href="https://github.com/AliOsm/phlex-icons/blob/main/lib/phlex-icons/flag/mw.rb" type="button" class="whitespace-nowrap justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground px-3 py-1.5 h-8 text-xs flex items-center gap-1" target="-blank">Source code<svg class="size-4" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h6v6"></path><path d="M10 14 21 3"></path><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path></svg></a></div><div class="py-4 space-y-4"><div class="space-y-2"><div><p class="text-sm font-normal">Icon (Variant: <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">:rectangle</code>) ↓</p><svg class="size-10" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 640 480"><g fill-rule="evenodd" stroke-width="1pt"><path fill="#f41408" d="M0 0h640v480H0z"></path><path fill="#21873b" d="M0 320h640v160H0z"></path><path fill="#000001" d="M0 0h640v160H0z"></path><path fill="#f31509" d="M220.5 141c22.3-49.2 84.5-72.8 138.8-52.5a98 98 0 0 1 58 52.5zm-26 6.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1m124.6-85.9c-4.2-21-5.2-44-4.8-48C314.7 9.6 317 9 319 9s4.7 1.8 4.7 4.7c0 5.3-.1 27-4.6 48zm11.6.5a249 249 0 0 1-.3-48.2c.8-3.9 3.2-4.4 5.1-4.2 2 .1 4.5 2.1 4.2 5-.5 5.3-2.6 26.9-9 47.4m10.4 1.3c-.2-21.3 3-44.3 4.1-48 1.1-3.9 3.6-4.2 5.5-3.9 2 .3 4.3 2.5 3.8 5.3-1 5.3-5.2 26.6-13.4 46.6m11 2.2c1.8-21.2 7.3-43.8 8.8-47.5s4-3.8 5.8-3.4c2 .5 4 2.8 3.3 5.6-1.6 5.1-7.7 26-17.8 45.3zm10.9 3.2c3.9-21 11.5-43.1 13.3-46.7 1.9-3.5 4.3-3.5 6.2-2.9 1.8.6 3.7 3.2 2.7 5.8A264 264 0 0 1 363 68.7m10.1 3.8c5.8-20.7 15.5-42 17.7-45.5 2.2-3.4 4.6-3.1 6.4-2.3 1.8.7 3.4 3.4 2.1 6-2.5 4.8-12.5 24.4-26.2 41.8m10 4.7a263 263 0 0 1 22-43.9c2.4-3.2 4.9-2.7 6.6-1.8a4.4 4.4 0 0 1 1.5 6.1c-3 4.6-14.9 23.4-30.1 39.6m9.4 5.5c9.7-19.4 23.3-39 26.1-42s5.2-2.3 6.8-1.3a4.4 4.4 0 0 1 1 6.2c-3.5 4.4-17.2 22.1-34 37zm8.8 6.2c11.6-18.6 27-37 30.1-39.7 3-2.8 5.4-2 6.9-.8a4.3 4.3 0 0 1 .3 6.2c-3.8 4.1-19.1 20.7-37.3 34.3m8.3 6.9a284 284 0 0 1 33.8-37.2c3.3-2.5 5.5-1.5 6.9-.3a4.3 4.3 0 0 1-.3 6.3c-4.1 3.8-21 19.1-40.4 31.2m7.6 7.5A278 278 0 0 1 454.4 69c3.6-2.3 5.7-1.1 7 .3 1.2 1.3 1.5 4.4-1 6.2a306 306 0 0 1-43.2 27.8m6.5 7.8A297 297 0 0 1 464 79.6c3.7-2 5.7-.6 6.8.9 1.2 1.4 1.1 4.5-1.4 6.1-4.8 3-24.3 15.6-45.7 24.5m5.9 8.3a307 307 0 0 1 43-28.1c4-1.7 5.9-.2 6.9 1.3 1 1.6.6 4.6-2 6a321 321 0 0 1-48 20.8zm5.4 9.6a313 313 0 0 1 45.8-24.4c4.1-1.4 5.8.3 6.6 1.9.9 1.6.3 4.6-2.6 5.8-5.3 2.2-27 11.4-49.8 16.7m4.2 9.2a320 320 0 0 1 48-20.8c4.2-1 5.7.8 6.4 2.5.6 1.6-.3 4.6-3.2 5.5-5.5 1.9-28 9.3-51.2 12.8m3.4 9.8a325 325 0 0 1 49.8-16.9c4.2-.6 5.6 1.2 6.1 3 .5 1.7-.7 4.5-3.7 5.3-5.7 1.3-28.8 7-52.2 8.6M307.8 62a252 252 0 0 1-9.7-47.4c0-3.9 2.3-4.8 4.2-5 2-.1 5 1.5 5.2 4.3.5 5.3 2.6 26.9.4 48.1zm-11 1.3a251 251 0 0 1-14.3-46.4c-.4-4 1.8-5 3.7-5.3s5 1 5.6 3.8a263 263 0 0 1 5 47.9m-11 2.2A259 259 0 0 1 267 20.3c-.8-3.9 1.3-5.1 3.2-5.6s5 .6 5.9 3.4c1.5 5.1 7.7 26 9.6 47.3zm-10.5 3A264 264 0 0 1 252.5 25c-1.1-3.8.8-5.2 2.6-5.8s5.1.2 6.2 2.8c2 5 10.2 25.4 14 46.4zM265.2 72a270 270 0 0 1-27-41.5c-1.4-3.7.4-5.3 2.2-6s5-.2 6.4 2.4c2.5 4.8 12.5 24.5 18.4 45.1m-10.3 5a276 276 0 0 1-31-39.2c-1.7-3.5-.1-5.2 1.6-6.1s5-.6 6.6 1.9c3 4.6 15 23.3 22.8 43.4m-9.4 5.4A285 285 0 0 1 211 45.7c-2.1-3.4-.7-5.2 1-6.3 1.5-1 5-1 6.7 1.4 3.4 4.3 17.1 22 26.8 41.5zm-8.7 6a292 292 0 0 1-37.9-33.9c-2.4-3.2-1.1-5 .4-6.2a5.5 5.5 0 0 1 6.8.8c3.8 4 19.2 20.7 30.7 39.3m-8.5 7a299 299 0 0 1-41-30.7c-2.8-3-1.7-5-.3-6.3a5.5 5.5 0 0 1 6.9.3c4.2 3.7 21 19 34.4 36.6zm-7.4 7A307 307 0 0 1 177.2 75c-3-2.8-2.1-4.8-.8-6.2 1.2-1.4 4.5-2.1 6.9-.3a292 292 0 0 1 37.6 34zm-7 8.2a313 313 0 0 1-46.2-23.8c-3.3-2.5-2.6-4.7-1.5-6.1 1.1-1.5 4.3-2.5 6.9-.9 4.8 3.1 24.3 15.5 40.8 30.8m-6.3 8.8c-22.2-7-44.9-17.6-48.4-19.9-3.6-2.2-3-4.4-2.1-6s4-2.8 6.8-1.4c5 2.7 25.8 13.5 43.7 27.3m-5.3 9c-22.8-5.3-46.3-14-50.1-16-3.7-2-3.5-4.2-2.6-5.8s3.7-3.1 6.6-2c5.3 2.3 27 11.4 46.1 23.8m-4.2 9a329 329 0 0 1-51.4-12.2c-4-1.6-3.8-3.9-3.2-5.5.7-1.7 3.5-3.4 6.4-2.5 5.6 1.9 28 9.3 48.2 20.2"></path><path fill="#f31509" d="M194.5 147.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1"></path><path d="M129.4 141.5h381.2v12.6H129.4z"></path></g></svg></div><div><p class="text-sm font-normal">With <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="no">Flag</span><span class="o">::</span><span class="no">Mw</span><span class="p">(</span><span class="ss">variant: :rectangle</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Without <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> (e.g. ERB) ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="n">render</span> <span class="no">PhlexIcons</span><span class="o">::</span><span class="no">Flag</span><span class="o">::</span><span class="no">Mw</span><span class="p">.</span><span class="nf">new</span><span class="p">(</span><span class="ss">variant: :rectangle</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain Phlex ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="k">def</span> <span class="nf">view_template</span>
	<span class="n">svg</span><span class="p">(</span>
		<span class="o">**</span><span class="n">attrs</span><span class="p">,</span> <span class="ss">xmlns: </span><span class="s1">'http://www.w3.org/2000/svg'</span><span class="p">,</span> <span class="ss">viewbox: </span><span class="s1">'0 0 640 480'</span>
	<span class="p">)</span> <span class="k">do</span> <span class="o">|</span><span class="n">s</span><span class="o">|</span>
		<span class="n">s</span><span class="p">.</span><span class="nf">g</span><span class="p">(</span><span class="ss">fill_rule: </span><span class="s1">'evenodd'</span><span class="p">,</span> <span class="ss">stroke_width: </span><span class="s1">'1pt'</span><span class="p">)</span> <span class="k">do</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#f41408'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 0h640v480H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#21873b'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 320h640v160H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#000001'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 0h640v160H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span>
				<span class="ss">fill: </span><span class="s1">'#f31509'</span><span class="p">,</span>
				<span class="ss">d:
					</span><span class="s1">'M220.5 141c22.3-49.2 84.5-72.8 138.8-52.5a98 98 0 0 1 58 52.5zm-26 6.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1m124.6-85.9c-4.2-21-5.2-44-4.8-48C314.7 9.6 317 9 319 9s4.7 1.8 4.7 4.7c0 5.3-.1 27-4.6 48zm11.6.5a249 249 0 0 1-.3-48.2c.8-3.9 3.2-4.4 5.1-4.2 2 .1 4.5 2.1 4.2 5-.5 5.3-2.6 26.9-9 47.4m10.4 1.3c-.2-21.3 3-44.3 4.1-48 1.1-3.9 3.6-4.2 5.5-3.9 2 .3 4.3 2.5 3.8 5.3-1 5.3-5.2 26.6-13.4 46.6m11 2.2c1.8-21.2 7.3-43.8 8.8-47.5s4-3.8 5.8-3.4c2 .5 4 2.8 3.3 5.6-1.6 5.1-7.7 26-17.8 45.3zm10.9 3.2c3.9-21 11.5-43.1 13.3-46.7 1.9-3.5 4.3-3.5 6.2-2.9 1.8.6 3.7 3.2 2.7 5.8A264 264 0 0 1 363 68.7m10.1 3.8c5.8-20.7 15.5-42 17.7-45.5 2.2-3.4 4.6-3.1 6.4-2.3 1.8.7 3.4 3.4 2.1 6-2.5 4.8-12.5 24.4-26.2 41.8m10 4.7a263 263 0 0 1 22-43.9c2.4-3.2 4.9-2.7 6.6-1.8a4.4 4.4 0 0 1 1.5 6.1c-3 4.6-14.9 23.4-30.1 39.6m9.4 5.5c9.7-19.4 23.3-39 26.1-42s5.2-2.3 6.8-1.3a4.4 4.4 0 0 1 1 6.2c-3.5 4.4-17.2 22.1-34 37zm8.8 6.2c11.6-18.6 27-37 30.1-39.7 3-2.8 5.4-2 6.9-.8a4.3 4.3 0 0 1 .3 6.2c-3.8 4.1-19.1 20.7-37.3 34.3m8.3 6.9a284 284 0 0 1 33.8-37.2c3.3-2.5 5.5-1.5 6.9-.3a4.3 4.3 0 0 1-.3 6.3c-4.1 3.8-21 19.1-40.4 31.2m7.6 7.5A278 278 0 0 1 454.4 69c3.6-2.3 5.7-1.1 7 .3 1.2 1.3 1.5 4.4-1 6.2a306 306 0 0 1-43.2 27.8m6.5 7.8A297 297 0 0 1 464 79.6c3.7-2 5.7-.6 6.8.9 1.2 1.4 1.1 4.5-1.4 6.1-4.8 3-24.3 15.6-45.7 24.5m5.9 8.3a307 307 0 0 1 43-28.1c4-1.7 5.9-.2 6.9 1.3 1 1.6.6 4.6-2 6a321 321 0 0 1-48 20.8zm5.4 9.6a313 313 0 0 1 45.8-24.4c4.1-1.4 5.8.3 6.6 1.9.9 1.6.3 4.6-2.6 5.8-5.3 2.2-27 11.4-49.8 16.7m4.2 9.2a320 320 0 0 1 48-20.8c4.2-1 5.7.8 6.4 2.5.6 1.6-.3 4.6-3.2 5.5-5.5 1.9-28 9.3-51.2 12.8m3.4 9.8a325 325 0 0 1 49.8-16.9c4.2-.6 5.6 1.2 6.1 3 .5 1.7-.7 4.5-3.7 5.3-5.7 1.3-28.8 7-52.2 8.6M307.8 62a252 252 0 0 1-9.7-47.4c0-3.9 2.3-4.8 4.2-5 2-.1 5 1.5 5.2 4.3.5 5.3 2.6 26.9.4 48.1zm-11 1.3a251 251 0 0 1-14.3-46.4c-.4-4 1.8-5 3.7-5.3s5 1 5.6 3.8a263 263 0 0 1 5 47.9m-11 2.2A259 259 0 0 1 267 20.3c-.8-3.9 1.3-5.1 3.2-5.6s5 .6 5.9 3.4c1.5 5.1 7.7 26 9.6 47.3zm-10.5 3A264 264 0 0 1 252.5 25c-1.1-3.8.8-5.2 2.6-5.8s5.1.2 6.2 2.8c2 5 10.2 25.4 14 46.4zM265.2 72a270 270 0 0 1-27-41.5c-1.4-3.7.4-5.3 2.2-6s5-.2 6.4 2.4c2.5 4.8 12.5 24.5 18.4 45.1m-10.3 5a276 276 0 0 1-31-39.2c-1.7-3.5-.1-5.2 1.6-6.1s5-.6 6.6 1.9c3 4.6 15 23.3 22.8 43.4m-9.4 5.4A285 285 0 0 1 211 45.7c-2.1-3.4-.7-5.2 1-6.3 1.5-1 5-1 6.7 1.4 3.4 4.3 17.1 22 26.8 41.5zm-8.7 6a292 292 0 0 1-37.9-33.9c-2.4-3.2-1.1-5 .4-6.2a5.5 5.5 0 0 1 6.8.8c3.8 4 19.2 20.7 30.7 39.3m-8.5 7a299 299 0 0 1-41-30.7c-2.8-3-1.7-5-.3-6.3a5.5 5.5 0 0 1 6.9.3c4.2 3.7 21 19 34.4 36.6zm-7.4 7A307 307 0 0 1 177.2 75c-3-2.8-2.1-4.8-.8-6.2 1.2-1.4 4.5-2.1 6.9-.3a292 292 0 0 1 37.6 34zm-7 8.2a313 313 0 0 1-46.2-23.8c-3.3-2.5-2.6-4.7-1.5-6.1 1.1-1.5 4.3-2.5 6.9-.9 4.8 3.1 24.3 15.5 40.8 30.8m-6.3 8.8c-22.2-7-44.9-17.6-48.4-19.9-3.6-2.2-3-4.4-2.1-6s4-2.8 6.8-1.4c5 2.7 25.8 13.5 43.7 27.3m-5.3 9c-22.8-5.3-46.3-14-50.1-16-3.7-2-3.5-4.2-2.6-5.8s3.7-3.1 6.6-2c5.3 2.3 27 11.4 46.1 23.8m-4.2 9a329 329 0 0 1-51.4-12.2c-4-1.6-3.8-3.9-3.2-5.5.7-1.7 3.5-3.4 6.4-2.5 5.6 1.9 28 9.3 48.2 20.2'</span>
			<span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span>
				<span class="ss">fill: </span><span class="s1">'#f31509'</span><span class="p">,</span>
				<span class="ss">d:
					</span><span class="s1">'M194.5 147.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1'</span>
			<span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">d: </span><span class="s1">'M129.4 141.5h381.2v12.6H129.4z'</span><span class="p">)</span>
		<span class="k">end</span>
	<span class="k">end</span>
<span class="k">end</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain SVG ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="nt">&lt;svg</span> <span class="na">xmlns=</span><span class="s">"http://www.w3.org/2000/svg"</span> <span class="na">class=</span><span class="s">""</span> <span class="na">viewbox=</span><span class="s">"0 0 640 480"</span><span class="nt">&gt;</span>
	<span class="nt">&lt;g</span> <span class="na">fill-rule=</span><span class="s">"evenodd"</span> <span class="na">stroke-width=</span><span class="s">"1pt"</span><span class="nt">&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f41408"</span> <span class="na">d=</span><span class="s">"M0 0h640v480H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#21873b"</span> <span class="na">d=</span><span class="s">"M0 320h640v160H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#000001"</span> <span class="na">d=</span><span class="s">"M0 0h640v160H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f31509"</span> <span class="na">d=</span><span class="s">"M220.5 141c22.3-49.2 84.5-72.8 138.8-52.5a98 98 0 0 1 58 52.5zm-26 6.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1m124.6-85.9c-4.2-21-5.2-44-4.8-48C314.7 9.6 317 9 319 9s4.7 1.8 4.7 4.7c0 5.3-.1 27-4.6 48zm11.6.5a249 249 0 0 1-.3-48.2c.8-3.9 3.2-4.4 5.1-4.2 2 .1 4.5 2.1 4.2 5-.5 5.3-2.6 26.9-9 47.4m10.4 1.3c-.2-21.3 3-44.3 4.1-48 1.1-3.9 3.6-4.2 5.5-3.9 2 .3 4.3 2.5 3.8 5.3-1 5.3-5.2 26.6-13.4 46.6m11 2.2c1.8-21.2 7.3-43.8 8.8-47.5s4-3.8 5.8-3.4c2 .5 4 2.8 3.3 5.6-1.6 5.1-7.7 26-17.8 45.3zm10.9 3.2c3.9-21 11.5-43.1 13.3-46.7 1.9-3.5 4.3-3.5 6.2-2.9 1.8.6 3.7 3.2 2.7 5.8A264 264 0 0 1 363 68.7m10.1 3.8c5.8-20.7 15.5-42 17.7-45.5 2.2-3.4 4.6-3.1 6.4-2.3 1.8.7 3.4 3.4 2.1 6-2.5 4.8-12.5 24.4-26.2 41.8m10 4.7a263 263 0 0 1 22-43.9c2.4-3.2 4.9-2.7 6.6-1.8a4.4 4.4 0 0 1 1.5 6.1c-3 4.6-14.9 23.4-30.1 39.6m9.4 5.5c9.7-19.4 23.3-39 26.1-42s5.2-2.3 6.8-1.3a4.4 4.4 0 0 1 1 6.2c-3.5 4.4-17.2 22.1-34 37zm8.8 6.2c11.6-18.6 27-37 30.1-39.7 3-2.8 5.4-2 6.9-.8a4.3 4.3 0 0 1 .3 6.2c-3.8 4.1-19.1 20.7-37.3 34.3m8.3 6.9a284 284 0 0 1 33.8-37.2c3.3-2.5 5.5-1.5 6.9-.3a4.3 4.3 0 0 1-.3 6.3c-4.1 3.8-21 19.1-40.4 31.2m7.6 7.5A278 278 0 0 1 454.4 69c3.6-2.3 5.7-1.1 7 .3 1.2 1.3 1.5 4.4-1 6.2a306 306 0 0 1-43.2 27.8m6.5 7.8A297 297 0 0 1 464 79.6c3.7-2 5.7-.6 6.8.9 1.2 1.4 1.1 4.5-1.4 6.1-4.8 3-24.3 15.6-45.7 24.5m5.9 8.3a307 307 0 0 1 43-28.1c4-1.7 5.9-.2 6.9 1.3 1 1.6.6 4.6-2 6a321 321 0 0 1-48 20.8zm5.4 9.6a313 313 0 0 1 45.8-24.4c4.1-1.4 5.8.3 6.6 1.9.9 1.6.3 4.6-2.6 5.8-5.3 2.2-27 11.4-49.8 16.7m4.2 9.2a320 320 0 0 1 48-20.8c4.2-1 5.7.8 6.4 2.5.6 1.6-.3 4.6-3.2 5.5-5.5 1.9-28 9.3-51.2 12.8m3.4 9.8a325 325 0 0 1 49.8-16.9c4.2-.6 5.6 1.2 6.1 3 .5 1.7-.7 4.5-3.7 5.3-5.7 1.3-28.8 7-52.2 8.6M307.8 62a252 252 0 0 1-9.7-47.4c0-3.9 2.3-4.8 4.2-5 2-.1 5 1.5 5.2 4.3.5 5.3 2.6 26.9.4 48.1zm-11 1.3a251 251 0 0 1-14.3-46.4c-.4-4 1.8-5 3.7-5.3s5 1 5.6 3.8a263 263 0 0 1 5 47.9m-11 2.2A259 259 0 0 1 267 20.3c-.8-3.9 1.3-5.1 3.2-5.6s5 .6 5.9 3.4c1.5 5.1 7.7 26 9.6 47.3zm-10.5 3A264 264 0 0 1 252.5 25c-1.1-3.8.8-5.2 2.6-5.8s5.1.2 6.2 2.8c2 5 10.2 25.4 14 46.4zM265.2 72a270 270 0 0 1-27-41.5c-1.4-3.7.4-5.3 2.2-6s5-.2 6.4 2.4c2.5 4.8 12.5 24.5 18.4 45.1m-10.3 5a276 276 0 0 1-31-39.2c-1.7-3.5-.1-5.2 1.6-6.1s5-.6 6.6 1.9c3 4.6 15 23.3 22.8 43.4m-9.4 5.4A285 285 0 0 1 211 45.7c-2.1-3.4-.7-5.2 1-6.3 1.5-1 5-1 6.7 1.4 3.4 4.3 17.1 22 26.8 41.5zm-8.7 6a292 292 0 0 1-37.9-33.9c-2.4-3.2-1.1-5 .4-6.2a5.5 5.5 0 0 1 6.8.8c3.8 4 19.2 20.7 30.7 39.3m-8.5 7a299 299 0 0 1-41-30.7c-2.8-3-1.7-5-.3-6.3a5.5 5.5 0 0 1 6.9.3c4.2 3.7 21 19 34.4 36.6zm-7.4 7A307 307 0 0 1 177.2 75c-3-2.8-2.1-4.8-.8-6.2 1.2-1.4 4.5-2.1 6.9-.3a292 292 0 0 1 37.6 34zm-7 8.2a313 313 0 0 1-46.2-23.8c-3.3-2.5-2.6-4.7-1.5-6.1 1.1-1.5 4.3-2.5 6.9-.9 4.8 3.1 24.3 15.5 40.8 30.8m-6.3 8.8c-22.2-7-44.9-17.6-48.4-19.9-3.6-2.2-3-4.4-2.1-6s4-2.8 6.8-1.4c5 2.7 25.8 13.5 43.7 27.3m-5.3 9c-22.8-5.3-46.3-14-50.1-16-3.7-2-3.5-4.2-2.6-5.8s3.7-3.1 6.6-2c5.3 2.3 27 11.4 46.1 23.8m-4.2 9a329 329 0 0 1-51.4-12.2c-4-1.6-3.8-3.9-3.2-5.5.7-1.7 3.5-3.4 6.4-2.5 5.6 1.9 28 9.3 48.2 20.2"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f31509"</span> <span class="na">d=</span><span class="s">"M194.5 147.4a332 332 0 0 1-52.4-7.8c-4.1-1.3-4.3-3.6-3.8-5.3s3.1-3.6 6.2-3c5.6 1.4 28.8 7 50 16.1"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">d=</span><span class="s">"M129.4 141.5h381.2v12.6H129.4z"</span><span class="nt">&gt;&lt;/path&gt;</span>
	<span class="nt">&lt;/g&gt;</span>
<span class="nt">&lt;/svg&gt;</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div></div><div class="space-y-2"><div><p class="text-sm font-normal">Icon (Variant: <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">:square</code>) ↓</p><svg class="size-10" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512"><defs><clipPath id="mw-a"><path fill-opacity=".7" d="M179.7 0h708.7v708.7H179.7z"></path></clipPath></defs><g fill-rule="evenodd" stroke-width="1pt" clip-path="url(#mw-a)" transform="translate(-129.8)scale(.72249)"><path fill="#f41408" d="M0 0h1063v708.7H0z"></path><path fill="#21873b" d="M0 472.4h1063v236.3H0z"></path><path fill="#000001" d="M0 0h1063v236.2H0z"></path><path fill="#f31509" d="M401.4 214a147.3 147.3 0 0 1 192.2-80.3 142 142 0 0 1 80.2 80.3zm-36 9.8a420 420 0 0 1-72.5-12c-5.6-2-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5zM538 92.6c-5.8-32-7.3-67.3-6.7-73.2s3.8-7 6.5-7a7 7 0 0 1 6.5 7c0 8.2-.2 41.3-6.3 73.2m16 .8a428 428 0 0 1-.5-73.6c1.1-5.9 4.4-6.7 7.1-6.4s6.3 3.3 5.9 7.6c-.7 8-3.7 41-12.5 72.4m14.4 2c-.4-32.6 4-67.6 5.7-73.4 1.5-5.8 4.9-6.3 7.6-5.8a7 7 0 0 1 5.2 8c-1.4 8-7.1 40.6-18.5 71.1zm15.3 3.3c2.5-32.4 10-66.9 12-72.5s5.5-5.8 8.1-5.1a7 7 0 0 1 4.5 8.4c-2.1 7.9-10.6 39.9-24.6 69.2m15 4.8A422 422 0 0 1 617 32.3c2.6-5.4 6-5.3 8.6-4.4a7 7 0 0 1 3.7 8.9c-2.8 7.6-14.2 38.7-30.7 66.7zm14 5.9c8-31.6 21.4-64.2 24.5-69.4 3-5.2 6.4-4.8 8.8-3.6a7 7 0 0 1 3 9c-3.5 7.5-17.4 37.5-36.3 64m13.8 7.2a432 432 0 0 1 30.4-67c3.4-4.9 6.8-4.2 9.2-2.8a7 7 0 0 1 2 9.3c-4 7-20.5 35.7-41.6 60.5m13 8.3a420 420 0 0 1 36.2-64c3.8-4.6 7.1-3.6 9.3-2a7 7 0 0 1 1.3 9.4c-4.7 6.7-23.6 33.8-46.8 56.6m12.2 9.5c16-28.4 37.4-56.4 41.7-60.7 4.2-4.2 7.4-3 9.5-1.2s3.2 6.3.4 9.6c-5.2 6.2-26.4 31.6-51.6 52.3m11.5 10.5a424 424 0 0 1 46.7-56.8c4.6-3.8 7.7-2.3 9.6-.4a7 7 0 0 1-.4 9.6 410 410 0 0 1-56 47.6zm10.4 11.5c20.7-25.1 46.7-49 51.6-52.4 5-3.4 7.8-1.6 9.6.4a7 7 0 0 1-1.2 9.5 422 422 0 0 1-60 42.5m9 11.8a422 422 0 0 1 55.8-48c5.2-3 8-.9 9.5 1.4 1.6 2.2 1.6 6.8-2 9.3a416 416 0 0 1-63.2 37.3zm8.2 12.8a422 422 0 0 1 59.7-43c5.4-2.5 8-.2 9.4 2.1 1.3 2.3 1 7-2.8 9.2-7 4-35.6 20.8-66.3 31.7m7.6 14.6a432 432 0 0 1 63.4-37.3c5.6-2 8 .5 9.1 3a7 7 0 0 1-3.6 8.8 418 418 0 0 1-68.9 25.5m5.8 14.1a413 413 0 0 1 66.3-31.7c5.8-1.5 8 1.2 8.9 3.7s-.3 7-4.4 8.5a413 413 0 0 1-70.8 19.5m4.6 15a421 421 0 0 1 69-25.8c5.8-1 7.7 1.8 8.4 4.5a7 7 0 0 1-5 8c-8 2.2-39.9 10.7-72.4 13.2zM522.4 93.1A421 421 0 0 1 508.9 21c0-6 3.1-7.3 5.8-7.6a7 7 0 0 1 7.1 6.5c.8 8 3.7 41 .6 73.4zm-15.4 2a419 419 0 0 1-19.7-70.8c-.5-6 2.5-7.6 5.1-8.1a7 7 0 0 1 7.7 5.8c1.4 8 7.2 40.6 6.9 73.1m-15.3 3.4a422 422 0 0 1-25.9-68.9c-1-5.9 1.9-7.8 4.5-8.5a7 7 0 0 1 8 5.1c2.2 7.9 10.8 39.8 13.4 72.3m-14.4 4.5a420 420 0 0 1-31.6-66.4c-1.5-5.8 1.2-8 3.7-8.9a7 7 0 0 1 8.5 4.4c2.8 7.7 14.1 38.7 19.4 70.9m-14 5.7A420 420 0 0 1 426 45.4c-2-5.7.4-8 2.9-9.1a7 7 0 0 1 8.9 3.6c3.4 7.4 17.3 37.4 25.4 69zm-14.2 7.4a420 420 0 0 1-42.8-59.9c-2.5-5.4-.3-8 2-9.3a7 7 0 0 1 9.2 2.8c4.1 7 20.7 35.7 31.6 66.4m-13 8.2a422 422 0 0 1-47.8-56c-3-5.2-1-8 1.3-9.5a7 7 0 0 1 9.4 2c4.7 6.7 23.6 33.8 37.1 63.5m-12.1 9a419 419 0 0 1-52.4-51.6c-3.4-4.9-1.6-7.8.5-9.5a7 7 0 0 1 9.5 1.2c5.2 6.2 26.4 31.6 42.4 60zM412.2 144a422 422 0 0 1-56.8-46.8c-3.8-4.6-2.3-7.7-.4-9.6a7 7 0 0 1 9.6.4c5.8 5.8 29.2 29.1 47.6 56M402 154.9a421 421 0 0 1-60.5-41.8c-4.2-4.2-2.9-7.4-1.1-9.5a7 7 0 0 1 9.5-.4c6.3 5.2 31.5 26.5 52.1 51.7m-9.7 12.5a421 421 0 0 1-64-36.3c-4.6-3.9-3.6-7.2-2-9.4a7 7 0 0 1 9.5-1.3 423 423 0 0 1 56.5 47m-8.7 13.4a421 421 0 0 1-67-30.3c-5-3.5-4.3-6.8-2.9-9.2a7 7 0 0 1 9.3-2.1c7.1 4 35.8 20.5 60.6 41.6m-7.3 13.7c-31.5-8-64.2-21.4-69.4-24.4-5.1-3-4.8-6.4-3.6-8.8a7 7 0 0 1 9.1-3c7.4 3.4 37.4 17.4 64 36.2zm-5.8 13.8a415 415 0 0 1-71.2-18.6c-5.4-2.5-5.3-6-4.4-8.5 1-2.5 4.8-5.2 8.9-3.7 7.6 2.8 38.7 14.2 66.7 30.8"></path><path fill="#f31509" d="M365.5 223.8c-32.5-2.5-67-9.9-72.6-12s-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5"></path><path d="M275.3 214.7H803V234H275.3z"></path></g></svg></div><div><p class="text-sm font-normal">With <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="no">Flag</span><span class="o">::</span><span class="no">Mw</span><span class="p">(</span><span class="ss">variant: :square</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Without <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> (e.g. ERB) ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="n">render</span> <span class="no">PhlexIcons</span><span class="o">::</span><span class="no">Flag</span><span class="o">::</span><span class="no">Mw</span><span class="p">.</span><span class="nf">new</span><span class="p">(</span><span class="ss">variant: :square</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain Phlex ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="k">def</span> <span class="nf">view_template</span>
	<span class="n">svg</span><span class="p">(</span>
		<span class="o">**</span><span class="n">attrs</span><span class="p">,</span> <span class="ss">xmlns: </span><span class="s1">'http://www.w3.org/2000/svg'</span><span class="p">,</span> <span class="ss">viewbox: </span><span class="s1">'0 0 512 512'</span>
	<span class="p">)</span> <span class="k">do</span> <span class="o">|</span><span class="n">s</span><span class="o">|</span>
		<span class="n">s</span><span class="p">.</span><span class="nf">defs</span> <span class="k">do</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">clipPath</span><span class="p">(</span><span class="ss">id: </span><span class="s1">'mw-a'</span><span class="p">)</span> <span class="k">do</span>
				<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill_opacity: </span><span class="s1">'.7'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M179.7 0h708.7v708.7H179.7z'</span><span class="p">)</span>
			<span class="k">end</span>
		<span class="k">end</span>
		<span class="n">s</span><span class="p">.</span><span class="nf">g</span><span class="p">(</span>
			<span class="ss">fill_rule: </span><span class="s1">'evenodd'</span><span class="p">,</span>
			<span class="ss">stroke_width: </span><span class="s1">'1pt'</span><span class="p">,</span>
			<span class="ss">clip_path: </span><span class="s1">'url(#mw-a)'</span><span class="p">,</span>
			<span class="ss">transform: </span><span class="s1">'translate(-129.8)scale(.72249)'</span>
		<span class="p">)</span> <span class="k">do</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#f41408'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 0h1063v708.7H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#21873b'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 472.4h1063v236.3H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">fill: </span><span class="s1">'#000001'</span><span class="p">,</span> <span class="ss">d: </span><span class="s1">'M0 0h1063v236.2H0z'</span><span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span>
				<span class="ss">fill: </span><span class="s1">'#f31509'</span><span class="p">,</span>
				<span class="ss">d:
					</span><span class="s1">'M401.4 214a147.3 147.3 0 0 1 192.2-80.3 142 142 0 0 1 80.2 80.3zm-36 9.8a420 420 0 0 1-72.5-12c-5.6-2-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5zM538 92.6c-5.8-32-7.3-67.3-6.7-73.2s3.8-7 6.5-7a7 7 0 0 1 6.5 7c0 8.2-.2 41.3-6.3 73.2m16 .8a428 428 0 0 1-.5-73.6c1.1-5.9 4.4-6.7 7.1-6.4s6.3 3.3 5.9 7.6c-.7 8-3.7 41-12.5 72.4m14.4 2c-.4-32.6 4-67.6 5.7-73.4 1.5-5.8 4.9-6.3 7.6-5.8a7 7 0 0 1 5.2 8c-1.4 8-7.1 40.6-18.5 71.1zm15.3 3.3c2.5-32.4 10-66.9 12-72.5s5.5-5.8 8.1-5.1a7 7 0 0 1 4.5 8.4c-2.1 7.9-10.6 39.9-24.6 69.2m15 4.8A422 422 0 0 1 617 32.3c2.6-5.4 6-5.3 8.6-4.4a7 7 0 0 1 3.7 8.9c-2.8 7.6-14.2 38.7-30.7 66.7zm14 5.9c8-31.6 21.4-64.2 24.5-69.4 3-5.2 6.4-4.8 8.8-3.6a7 7 0 0 1 3 9c-3.5 7.5-17.4 37.5-36.3 64m13.8 7.2a432 432 0 0 1 30.4-67c3.4-4.9 6.8-4.2 9.2-2.8a7 7 0 0 1 2 9.3c-4 7-20.5 35.7-41.6 60.5m13 8.3a420 420 0 0 1 36.2-64c3.8-4.6 7.1-3.6 9.3-2a7 7 0 0 1 1.3 9.4c-4.7 6.7-23.6 33.8-46.8 56.6m12.2 9.5c16-28.4 37.4-56.4 41.7-60.7 4.2-4.2 7.4-3 9.5-1.2s3.2 6.3.4 9.6c-5.2 6.2-26.4 31.6-51.6 52.3m11.5 10.5a424 424 0 0 1 46.7-56.8c4.6-3.8 7.7-2.3 9.6-.4a7 7 0 0 1-.4 9.6 410 410 0 0 1-56 47.6zm10.4 11.5c20.7-25.1 46.7-49 51.6-52.4 5-3.4 7.8-1.6 9.6.4a7 7 0 0 1-1.2 9.5 422 422 0 0 1-60 42.5m9 11.8a422 422 0 0 1 55.8-48c5.2-3 8-.9 9.5 1.4 1.6 2.2 1.6 6.8-2 9.3a416 416 0 0 1-63.2 37.3zm8.2 12.8a422 422 0 0 1 59.7-43c5.4-2.5 8-.2 9.4 2.1 1.3 2.3 1 7-2.8 9.2-7 4-35.6 20.8-66.3 31.7m7.6 14.6a432 432 0 0 1 63.4-37.3c5.6-2 8 .5 9.1 3a7 7 0 0 1-3.6 8.8 418 418 0 0 1-68.9 25.5m5.8 14.1a413 413 0 0 1 66.3-31.7c5.8-1.5 8 1.2 8.9 3.7s-.3 7-4.4 8.5a413 413 0 0 1-70.8 19.5m4.6 15a421 421 0 0 1 69-25.8c5.8-1 7.7 1.8 8.4 4.5a7 7 0 0 1-5 8c-8 2.2-39.9 10.7-72.4 13.2zM522.4 93.1A421 421 0 0 1 508.9 21c0-6 3.1-7.3 5.8-7.6a7 7 0 0 1 7.1 6.5c.8 8 3.7 41 .6 73.4zm-15.4 2a419 419 0 0 1-19.7-70.8c-.5-6 2.5-7.6 5.1-8.1a7 7 0 0 1 7.7 5.8c1.4 8 7.2 40.6 6.9 73.1m-15.3 3.4a422 422 0 0 1-25.9-68.9c-1-5.9 1.9-7.8 4.5-8.5a7 7 0 0 1 8 5.1c2.2 7.9 10.8 39.8 13.4 72.3m-14.4 4.5a420 420 0 0 1-31.6-66.4c-1.5-5.8 1.2-8 3.7-8.9a7 7 0 0 1 8.5 4.4c2.8 7.7 14.1 38.7 19.4 70.9m-14 5.7A420 420 0 0 1 426 45.4c-2-5.7.4-8 2.9-9.1a7 7 0 0 1 8.9 3.6c3.4 7.4 17.3 37.4 25.4 69zm-14.2 7.4a420 420 0 0 1-42.8-59.9c-2.5-5.4-.3-8 2-9.3a7 7 0 0 1 9.2 2.8c4.1 7 20.7 35.7 31.6 66.4m-13 8.2a422 422 0 0 1-47.8-56c-3-5.2-1-8 1.3-9.5a7 7 0 0 1 9.4 2c4.7 6.7 23.6 33.8 37.1 63.5m-12.1 9a419 419 0 0 1-52.4-51.6c-3.4-4.9-1.6-7.8.5-9.5a7 7 0 0 1 9.5 1.2c5.2 6.2 26.4 31.6 42.4 60zM412.2 144a422 422 0 0 1-56.8-46.8c-3.8-4.6-2.3-7.7-.4-9.6a7 7 0 0 1 9.6.4c5.8 5.8 29.2 29.1 47.6 56M402 154.9a421 421 0 0 1-60.5-41.8c-4.2-4.2-2.9-7.4-1.1-9.5a7 7 0 0 1 9.5-.4c6.3 5.2 31.5 26.5 52.1 51.7m-9.7 12.5a421 421 0 0 1-64-36.3c-4.6-3.9-3.6-7.2-2-9.4a7 7 0 0 1 9.5-1.3 423 423 0 0 1 56.5 47m-8.7 13.4a421 421 0 0 1-67-30.3c-5-3.5-4.3-6.8-2.9-9.2a7 7 0 0 1 9.3-2.1c7.1 4 35.8 20.5 60.6 41.6m-7.3 13.7c-31.5-8-64.2-21.4-69.4-24.4-5.1-3-4.8-6.4-3.6-8.8a7 7 0 0 1 9.1-3c7.4 3.4 37.4 17.4 64 36.2zm-5.8 13.8a415 415 0 0 1-71.2-18.6c-5.4-2.5-5.3-6-4.4-8.5 1-2.5 4.8-5.2 8.9-3.7 7.6 2.8 38.7 14.2 66.7 30.8'</span>
			<span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span>
				<span class="ss">fill: </span><span class="s1">'#f31509'</span><span class="p">,</span>
				<span class="ss">d:
					</span><span class="s1">'M365.5 223.8c-32.5-2.5-67-9.9-72.6-12s-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5'</span>
			<span class="p">)</span>
			<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span><span class="ss">d: </span><span class="s1">'M275.3 214.7H803V234H275.3z'</span><span class="p">)</span>
		<span class="k">end</span>
	<span class="k">end</span>
<span class="k">end</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain SVG ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="nt">&lt;svg</span> <span class="na">xmlns=</span><span class="s">"http://www.w3.org/2000/svg"</span> <span class="na">class=</span><span class="s">""</span> <span class="na">viewbox=</span><span class="s">"0 0 512 512"</span><span class="nt">&gt;</span>
	<span class="nt">&lt;defs&gt;</span>
		<span class="nt">&lt;clipPath</span> <span class="na">id=</span><span class="s">"mw-a"</span><span class="nt">&gt;</span>
			<span class="nt">&lt;path</span> <span class="na">fill-opacity=</span><span class="s">".7"</span> <span class="na">d=</span><span class="s">"M179.7 0h708.7v708.7H179.7z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;/clipPath&gt;</span>
	<span class="nt">&lt;/defs&gt;</span>
	<span class="nt">&lt;g</span> <span class="na">fill-rule=</span><span class="s">"evenodd"</span> <span class="na">stroke-width=</span><span class="s">"1pt"</span> <span class="na">clip-path=</span><span class="s">"url(#mw-a)"</span> <span class="na">transform=</span><span class="s">"translate(-129.8)scale(.72249)"</span><span class="nt">&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f41408"</span> <span class="na">d=</span><span class="s">"M0 0h1063v708.7H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#21873b"</span> <span class="na">d=</span><span class="s">"M0 472.4h1063v236.3H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#000001"</span> <span class="na">d=</span><span class="s">"M0 0h1063v236.2H0z"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f31509"</span> <span class="na">d=</span><span class="s">"M401.4 214a147.3 147.3 0 0 1 192.2-80.3 142 142 0 0 1 80.2 80.3zm-36 9.8a420 420 0 0 1-72.5-12c-5.6-2-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5zM538 92.6c-5.8-32-7.3-67.3-6.7-73.2s3.8-7 6.5-7a7 7 0 0 1 6.5 7c0 8.2-.2 41.3-6.3 73.2m16 .8a428 428 0 0 1-.5-73.6c1.1-5.9 4.4-6.7 7.1-6.4s6.3 3.3 5.9 7.6c-.7 8-3.7 41-12.5 72.4m14.4 2c-.4-32.6 4-67.6 5.7-73.4 1.5-5.8 4.9-6.3 7.6-5.8a7 7 0 0 1 5.2 8c-1.4 8-7.1 40.6-18.5 71.1zm15.3 3.3c2.5-32.4 10-66.9 12-72.5s5.5-5.8 8.1-5.1a7 7 0 0 1 4.5 8.4c-2.1 7.9-10.6 39.9-24.6 69.2m15 4.8A422 422 0 0 1 617 32.3c2.6-5.4 6-5.3 8.6-4.4a7 7 0 0 1 3.7 8.9c-2.8 7.6-14.2 38.7-30.7 66.7zm14 5.9c8-31.6 21.4-64.2 24.5-69.4 3-5.2 6.4-4.8 8.8-3.6a7 7 0 0 1 3 9c-3.5 7.5-17.4 37.5-36.3 64m13.8 7.2a432 432 0 0 1 30.4-67c3.4-4.9 6.8-4.2 9.2-2.8a7 7 0 0 1 2 9.3c-4 7-20.5 35.7-41.6 60.5m13 8.3a420 420 0 0 1 36.2-64c3.8-4.6 7.1-3.6 9.3-2a7 7 0 0 1 1.3 9.4c-4.7 6.7-23.6 33.8-46.8 56.6m12.2 9.5c16-28.4 37.4-56.4 41.7-60.7 4.2-4.2 7.4-3 9.5-1.2s3.2 6.3.4 9.6c-5.2 6.2-26.4 31.6-51.6 52.3m11.5 10.5a424 424 0 0 1 46.7-56.8c4.6-3.8 7.7-2.3 9.6-.4a7 7 0 0 1-.4 9.6 410 410 0 0 1-56 47.6zm10.4 11.5c20.7-25.1 46.7-49 51.6-52.4 5-3.4 7.8-1.6 9.6.4a7 7 0 0 1-1.2 9.5 422 422 0 0 1-60 42.5m9 11.8a422 422 0 0 1 55.8-48c5.2-3 8-.9 9.5 1.4 1.6 2.2 1.6 6.8-2 9.3a416 416 0 0 1-63.2 37.3zm8.2 12.8a422 422 0 0 1 59.7-43c5.4-2.5 8-.2 9.4 2.1 1.3 2.3 1 7-2.8 9.2-7 4-35.6 20.8-66.3 31.7m7.6 14.6a432 432 0 0 1 63.4-37.3c5.6-2 8 .5 9.1 3a7 7 0 0 1-3.6 8.8 418 418 0 0 1-68.9 25.5m5.8 14.1a413 413 0 0 1 66.3-31.7c5.8-1.5 8 1.2 8.9 3.7s-.3 7-4.4 8.5a413 413 0 0 1-70.8 19.5m4.6 15a421 421 0 0 1 69-25.8c5.8-1 7.7 1.8 8.4 4.5a7 7 0 0 1-5 8c-8 2.2-39.9 10.7-72.4 13.2zM522.4 93.1A421 421 0 0 1 508.9 21c0-6 3.1-7.3 5.8-7.6a7 7 0 0 1 7.1 6.5c.8 8 3.7 41 .6 73.4zm-15.4 2a419 419 0 0 1-19.7-70.8c-.5-6 2.5-7.6 5.1-8.1a7 7 0 0 1 7.7 5.8c1.4 8 7.2 40.6 6.9 73.1m-15.3 3.4a422 422 0 0 1-25.9-68.9c-1-5.9 1.9-7.8 4.5-8.5a7 7 0 0 1 8 5.1c2.2 7.9 10.8 39.8 13.4 72.3m-14.4 4.5a420 420 0 0 1-31.6-66.4c-1.5-5.8 1.2-8 3.7-8.9a7 7 0 0 1 8.5 4.4c2.8 7.7 14.1 38.7 19.4 70.9m-14 5.7A420 420 0 0 1 426 45.4c-2-5.7.4-8 2.9-9.1a7 7 0 0 1 8.9 3.6c3.4 7.4 17.3 37.4 25.4 69zm-14.2 7.4a420 420 0 0 1-42.8-59.9c-2.5-5.4-.3-8 2-9.3a7 7 0 0 1 9.2 2.8c4.1 7 20.7 35.7 31.6 66.4m-13 8.2a422 422 0 0 1-47.8-56c-3-5.2-1-8 1.3-9.5a7 7 0 0 1 9.4 2c4.7 6.7 23.6 33.8 37.1 63.5m-12.1 9a419 419 0 0 1-52.4-51.6c-3.4-4.9-1.6-7.8.5-9.5a7 7 0 0 1 9.5 1.2c5.2 6.2 26.4 31.6 42.4 60zM412.2 144a422 422 0 0 1-56.8-46.8c-3.8-4.6-2.3-7.7-.4-9.6a7 7 0 0 1 9.6.4c5.8 5.8 29.2 29.1 47.6 56M402 154.9a421 421 0 0 1-60.5-41.8c-4.2-4.2-2.9-7.4-1.1-9.5a7 7 0 0 1 9.5-.4c6.3 5.2 31.5 26.5 52.1 51.7m-9.7 12.5a421 421 0 0 1-64-36.3c-4.6-3.9-3.6-7.2-2-9.4a7 7 0 0 1 9.5-1.3 423 423 0 0 1 56.5 47m-8.7 13.4a421 421 0 0 1-67-30.3c-5-3.5-4.3-6.8-2.9-9.2a7 7 0 0 1 9.3-2.1c7.1 4 35.8 20.5 60.6 41.6m-7.3 13.7c-31.5-8-64.2-21.4-69.4-24.4-5.1-3-4.8-6.4-3.6-8.8a7 7 0 0 1 9.1-3c7.4 3.4 37.4 17.4 64 36.2zm-5.8 13.8a415 415 0 0 1-71.2-18.6c-5.4-2.5-5.3-6-4.4-8.5 1-2.5 4.8-5.2 8.9-3.7 7.6 2.8 38.7 14.2 66.7 30.8"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">fill=</span><span class="s">"#f31509"</span> <span class="na">d=</span><span class="s">"M365.5 223.8c-32.5-2.5-67-9.9-72.6-12s-5.9-5.4-5.2-8a7 7 0 0 1 8.5-4.5c7.9 2 39.9 10.5 69.3 24.5"</span><span class="nt">&gt;&lt;/path&gt;</span>
		<span class="nt">&lt;path</span> <span class="na">d=</span><span class="s">"M275.3 214.7H803V234H275.3z"</span><span class="nt">&gt;&lt;/path&gt;</span>
	<span class="nt">&lt;/g&gt;</span>
<span class="nt">&lt;/svg&gt;</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div></div></div><div class="flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 gap-y-2 sm:gap-y-0"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground px-4 py-2 h-9 text-sm w-full" data-action="click->ruby-ui--sheet-content#close">Close</button></div><button type="button" class="absolute end-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" data-action="click->ruby-ui--sheet-content#close"><svg width="15" height="15" viewbox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-4 w-4"><path d="M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg><span class="sr-only">Close</span></button></div></div></template></div></template></turbo-stream>