@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.icon-tool{gap:calc(var(--spacing,.25rem) * 6);flex-direction:column;display:flex}.icon-tool-layout{align-items:flex-start;gap:calc(var(--spacing,.25rem) * 8);grid-template-columns:repeat(1,minmax(0,1fr));display:grid}@media (min-width:64rem){.icon-tool-layout{grid-template-columns:1fr 380px}}@media (min-width:90rem){.icon-tool-layout{grid-template-columns:1fr 420px}}.icon-tool-canvas-container{aspect-ratio:1;border-radius:var(--radius-3xl,1.5rem);border-style:var(--tw-border-style);border-width:1px;border-color:#ffffff1a;justify-content:center;align-items:center;width:100%;max-width:440px;margin-inline:auto;display:flex;position:relative;overflow:hidden}@supports (color:color-mix(in lab, red, red)){.icon-tool-canvas-container{border-color:color-mix(in oklab, var(--color-white,#fff) 10%, transparent)}}.icon-tool-canvas-container{-webkit-user-select:none;user-select:none;background-color:#111;background-image:linear-gradient(45deg,#181818 25%,#0000 25%),linear-gradient(-45deg,#181818 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#181818 75%),linear-gradient(-45deg,#0000 75%,#181818 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.icon-tool-canvas{cursor:grab;touch-action:none;width:100%;height:100%}.icon-tool-canvas:active{cursor:grabbing}.icon-tool-controls{gap:calc(var(--spacing,.25rem) * 4);border-radius:var(--radius-2xl,1rem);border-style:var(--tw-border-style);border-width:1px;border-color:#ffffff0d;flex-direction:column;display:flex}@supports (color:color-mix(in lab, red, red)){.icon-tool-controls{border-color:color-mix(in oklab, var(--color-white,#fff) 5%, transparent)}}.icon-tool-controls{background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.icon-tool-controls{background-color:color-mix(in oklab, var(--color-white,#fff) 3%, transparent)}}.icon-tool-controls{padding:calc(var(--spacing,.25rem) * 5)}.icon-tool-preview-box{border-radius:var(--radius-4xl,2.5rem);border-style:var(--tw-border-style);border-width:1px;border-color:#ffffff1a;position:relative}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-box{border-color:color-mix(in oklab, var(--color-white,#fff) 10%, transparent)}}.icon-tool-preview-box{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-box{background-color:color-mix(in oklab, var(--color-white,#fff) 5%, transparent)}}.icon-tool-preview-box{--tw-backdrop-blur:blur(1.75rem);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);align-items:center;gap:calc(var(--spacing,.25rem) * 6);padding:calc(var(--spacing,.25rem) * 6);text-align:center;flex-direction:column;display:flex}.icon-tool-preview-64{height:calc(var(--spacing,.25rem) * 16);width:calc(var(--spacing,.25rem) * 16);border-style:var(--tw-border-style);border-width:1px;border-color:#fff3;border-radius:.25rem}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-64{border-color:color-mix(in oklab, var(--color-white,#fff) 20%, transparent)}}.icon-tool-preview-64{background-color:#000c}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-64{background-color:color-mix(in oklab, var(--color-black,#000) 80%, transparent)}}.icon-tool-preview-64{object-fit:cover;--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.icon-tool-preview-zoom{height:calc(var(--spacing,.25rem) * 32);width:calc(var(--spacing,.25rem) * 32);border-radius:var(--radius-xl,.75rem);border-style:var(--tw-border-style);border-width:1px;border-color:#c8f8084d}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-zoom{border-color:color-mix(in oklab, var(--color-primary,#c8f808) 30%, transparent)}}.icon-tool-preview-zoom{background-color:#000c}@supports (color:color-mix(in lab, red, red)){.icon-tool-preview-zoom{background-color:color-mix(in oklab, var(--color-black,#000) 80%, transparent)}}.icon-tool-preview-zoom{object-fit:cover;--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
