@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap";:root{--site-nav-height: 53px;--background: oklch(98.178% .00528 95.189);--foreground: oklch(.3438 .0269 95.7226);--card: oklch(.9456 .0123 91);--card-foreground: oklch(.1908 .002 106.5859);--popover: oklch(1 0 0);--popover-foreground: oklch(.2671 .0196 98.939);--primary: oklch(.6171 .1375 39.0427);--primary-foreground: oklch(1 0 0);--secondary: oklch(.9245 .0138 92.9892);--secondary-foreground: oklch(.4334 .0177 98.6048);--muted: oklch(.9341 .0153 90.239);--muted-foreground: oklch(.6059 .0075 97.4233);--accent: oklch(.9245 .0138 92.9892);--accent-foreground: oklch(.2671 .0196 98.939);--destructive: oklch(.1908 .002 106.5859);--destructive-foreground: oklch(1 0 0);--border: oklch(.8847 .0069 97.3627);--input: oklch(.7621 .0156 98.3528);--ring: oklch(.6171 .1375 39.0427);--radius: .5rem;--bg-color: var(--background);--text-color: var(--foreground);--text-secondary: var(--muted-foreground);--text-muted: var(--muted-foreground);--bg-muted: var(--muted);--border-color: var(--border);--card-bg: var(--background);--card-hover: var(--accent);--header-bg: var(--background);--modal-bg: var(--card);--input-bg: var(--background);--secondary-btn-bg: var(--background);--secondary-btn-text: var(--foreground);--secondary-btn-border: var(--foreground);--tag-bg: var(--muted);--tab-active-bg: var(--foreground);--grid-bg: var(--border);--primary-color: var(--primary);--primary-hover: oklch(.5583 .1276 42.9956);--primary-text: var(--primary-foreground);--bg-card: var(--card);--bg-card-hover: var(--accent);font-family:IBM Plex Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;line-height:1.5;font-weight:400;color:var(--foreground);background-color:var(--background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.dark{--background: oklch(.2679 .0036 106.6427);--foreground: oklch(.8074 .0142 93.0137);--card: oklch(.2278 .0036 106.6427);--card-foreground: oklch(.9818 .0054 95.0986);--popover: oklch(.3085 .0035 106.6039);--popover-foreground: oklch(.9211 .004 106.4781);--primary: oklch(.6724 .1308 38.7559);--primary-foreground: oklch(1 0 0);--secondary: oklch(.9818 .0054 95.0986);--secondary-foreground: oklch(.3085 .0035 106.6039);--muted: oklch(.2213 .0038 106.707);--muted-foreground: oklch(.7713 .0169 99.0657);--accent: oklch(.213 .0078 95.4245);--accent-foreground: oklch(.9663 .008 98.8792);--destructive: oklch(.6368 .2078 25.3313);--destructive-foreground: oklch(1 0 0);--border: oklch(.3618 .0101 106.8928);--input: oklch(.4336 .0113 100.2195);--ring: oklch(.6724 .1308 38.7559);--primary-hover: oklch(.72 .14 38.7559)}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}button{font-family:inherit}.version-badge{display:inline-block;padding:.15rem .4rem;font-size:.65rem;font-weight:500;color:var(--muted-foreground);background:var(--muted);letter-spacing:.08em;border-radius:4px}html{scroll-behavior:smooth}.app{min-height:100vh;display:flex;flex-direction:column;background-color:var(--background);color:var(--foreground);font-family:inherit;background-image:radial-gradient(circle at 1px 1px,color-mix(in oklch,var(--foreground) 8%,transparent) 1px,transparent 0);background-size:22px 22px}.site-nav{position:sticky;top:0;z-index:50;border-bottom:1px solid var(--border);background:color-mix(in oklch,var(--background) 85%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.site-nav-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:flex-start;gap:1.5rem;padding:.75rem 1.5rem;position:relative}@media(min-width:640px){.site-nav-inner{padding:.75rem 2.5rem}}.site-nav-logo{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;letter-spacing:-.02em;color:var(--foreground);text-decoration:none;white-space:nowrap;background:none;border:none;cursor:pointer;padding:0}.site-nav-logo img{width:1.25rem;height:1.25rem;object-fit:contain;border-radius:6px}.site-nav-links{display:none;align-items:center;gap:.25rem;margin-left:auto}@media(min-width:640px){.site-nav-links{display:flex}}.site-nav-link{padding:.25rem .75rem;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--muted-foreground);text-decoration:none;transition:color .15s}.site-nav-link:hover,.site-nav-link.active{color:var(--foreground)}.site-nav-actions{display:flex;align-items:center;gap:.25rem}.site-nav-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;color:var(--muted-foreground);background:none;border:none;cursor:pointer;text-decoration:none;transition:color .15s;padding:0}.site-nav-icon-btn:hover{color:var(--foreground)}.site-nav-icon-btn svg{width:1rem;height:1rem}.page-wrap{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:1rem 1.5rem}@media(min-width:640px){.page-wrap{padding:1rem 2.5rem}}.hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;padding-bottom:3rem;border-bottom:1px solid var(--border)}.hero-eyebrow{display:flex;width:100%;align-items:center;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted-foreground)}.hero-brand{display:flex;flex-direction:column;align-items:center;gap:1.25rem}@media(min-width:640px){.hero-brand{flex-direction:row;gap:1rem}}.hero-logo{width:3.5rem;height:3.5rem;object-fit:contain;flex-shrink:0}@media(min-width:640px){.hero-logo{width:4rem;height:4rem}}.hero-title{font-size:3rem;font-weight:600;line-height:1;letter-spacing:-.03em;color:var(--foreground);margin:0}@media(min-width:640px){.hero-title{font-size:3.75rem}}.hero-tagline{max-width:42rem;font-size:.875rem;line-height:1.65;color:var(--muted-foreground);margin:0}.hero-tagline code{font-size:.95em;color:var(--foreground)}.hero-contribute{font-size:.8125rem;color:var(--muted-foreground);margin:0;line-height:1.5}.hero-contribute a{color:var(--foreground);text-decoration:underline;text-underline-offset:3px;transition:color .15s}.hero-contribute a:hover{color:var(--primary)}.hero-install{width:100%;max-width:36rem;text-align:left}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.75rem;padding-top:.25rem}.action-button{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;text-decoration:none;cursor:pointer;border:1px solid var(--foreground);background:transparent;color:var(--foreground);transition:background-color .15s,color .15s,border-color .15s}.action-button svg{width:1rem;height:1rem}.action-button.primary{background:var(--foreground);color:var(--background)}.action-button.primary:hover{background:var(--primary);border-color:var(--primary);color:var(--primary-foreground)}.action-button.secondary:hover{background:var(--foreground);color:var(--background)}.gallery-controls{position:sticky;top:var(--site-nav-height);z-index:10;margin:2rem -1.5rem 0;padding:1rem 1.5rem;background:color-mix(in oklch,var(--background) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}@media(min-width:640px){.gallery-controls{margin:2rem -2.5rem 0;padding:1rem 2.5rem}}.gallery-controls-row{--gallery-control-height: 2.25rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.search-wrapper{display:flex;flex:1;min-width:220px;height:var(--gallery-control-height);align-items:center;gap:.5rem;padding:0 .75rem;border:1px solid var(--foreground);background:var(--background);box-sizing:border-box;transition:border-color .15s}.search-wrapper:focus-within{border-color:var(--primary)}.search-prefix{color:var(--muted-foreground);font-size:.875rem;-webkit-user-select:none;user-select:none}.search-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.search-input{flex:1;width:100%;height:100%;border:none;background:transparent;font-size:.875rem;line-height:1;color:var(--foreground);outline:none;font-family:inherit}.search-input::placeholder{color:var(--muted-foreground)}.variant-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:1px}.variant-tab{display:inline-flex;align-items:center;justify-content:center;height:var(--gallery-control-height);padding:0 .75rem;font-size:10px;font-weight:500;line-height:1;text-transform:uppercase;letter-spacing:.12em;color:var(--foreground);background:var(--background);border:1px solid var(--foreground);box-sizing:border-box;cursor:pointer;transition:background-color .15s,color .15s}.variant-tab:hover{background:color-mix(in oklch,var(--foreground) 10%,transparent)}.variant-tab.active{background:var(--foreground);color:var(--background)}.variant-info{display:none}.gallery-meta{margin-top:3rem;margin-bottom:1rem;font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted-foreground)}.icons-grid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--border);border-top:1px solid var(--border);margin-bottom:4rem}@media(min-width:640px){.icons-grid{grid-template-columns:repeat(5,1fr)}}@media(min-width:1024px){.icons-grid{grid-template-columns:repeat(6,1fr)}}.icon-card{position:relative;display:flex;aspect-ratio:1;flex-direction:column;align-items:center;justify-content:space-between;gap:.5rem;padding:1.25rem .75rem;background:transparent;border:none;border-right:1px solid var(--border);border-bottom:1px solid var(--border);cursor:pointer;color:var(--foreground);transition:background-color .3s ease-out,color .3s ease-out}.icon-card:hover{background:var(--accent);color:var(--primary)}.icon-display{display:flex;flex:1;align-items:center;justify-content:center;pointer-events:none}.icon-skeleton{background:color-mix(in srgb,var(--foreground) 6%,transparent);transition:background .1s ease}.dark .icon-skeleton{background:color-mix(in srgb,var(--foreground) 12%,transparent)}.icon-name{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-foreground);text-align:center;word-break:break-word;width:100%;min-width:0;transition:color .2s ease-out}.icon-card:hover .icon-name{color:var(--foreground)}.no-results{border:1px dashed var(--border);padding:3rem 1.5rem;text-align:center;font-size:.875rem;color:var(--muted-foreground)}.pagination{display:flex;justify-content:center;padding-top:.5rem;margin:1.5rem 0 5rem;background:var(--background)}.pagination-button{padding:.5rem 1.25rem;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--foreground);background:transparent;border:1px solid var(--foreground);cursor:pointer;transition:background-color .15s,color .15s;font-family:inherit}.pagination-button:hover:not(:disabled){background:var(--foreground);color:var(--background)}.pagination-button:disabled{opacity:.35;cursor:not-allowed}.pagination-info{display:none}.pagination-group{display:flex;align-items:center;gap:.75rem}.pagination-group .pagination-info{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted-foreground);min-width:auto}.modal-overlay{position:fixed;inset:0;background:color-mix(in oklch,var(--background) 20%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:999;padding:clamp(.75rem,2vw,2rem);overflow-y:auto;animation:fadeIn .2s}.modal-card{position:relative;display:flex;flex-direction:column;gap:1.25rem;width:min(100%,820px);max-height:min(92vh,860px);overflow-y:auto;padding:clamp(1.125rem,2.2vw,1.75rem);background:var(--background);border:1px solid var(--border);border-radius:0;box-shadow:0 24px 48px color-mix(in oklch,var(--foreground) 12%,transparent);animation:modalEnter .18s ease-out;font-family:inherit}.modal-close{position:absolute;top:1rem;right:1rem;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;color:var(--muted-foreground);background:var(--background);border:1px solid var(--border);cursor:pointer;padding:0;transition:color .15s,border-color .15s,background-color .15s}.modal-close:hover{color:var(--foreground);border-color:var(--foreground)}.modal-close-icon{position:relative;width:.75rem;height:.75rem;display:block}.modal-close-icon:before,.modal-close-icon:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:2px;background:currentColor;border-radius:999px}.modal-close-icon:before{transform:translate(-50%,-50%) rotate(45deg)}.modal-close-icon:after{transform:translate(-50%,-50%) rotate(-45deg)}.modal-header{padding-right:2.5rem}.modal-title{font-size:1.5rem;font-weight:600;letter-spacing:-.02em;color:var(--foreground);margin:0;text-align:left;overflow-wrap:anywhere}.modal-customizer{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr);gap:1rem;align-items:stretch}.modal-preview{display:flex;align-items:center;justify-content:center;min-height:240px;padding:clamp(2rem,5vw,3rem);background:color-mix(in oklch,var(--muted) 40%,transparent);border:1px solid var(--border)}.modal-controls{display:flex;flex-direction:column;justify-content:center;gap:1.25rem;padding:clamp(1rem,2vw,1.35rem);border:1px solid var(--border)}.control-group{display:flex;flex-direction:column;gap:.65rem}.control-group label{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--foreground)}.control-group label strong{font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--muted-foreground);text-transform:none;letter-spacing:0}.control-group input[type=range]{width:100%;height:6px;background:var(--border);border-radius:999px;outline:none;appearance:none;-webkit-appearance:none}.control-group input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;background:var(--primary);border:2px solid var(--background);border-radius:50%;cursor:pointer}.control-group input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--primary);border:2px solid var(--background);border-radius:50%;cursor:pointer}.control-group input[type=color]{width:100%;height:40px;border:1px solid var(--border);cursor:pointer;background:var(--background);padding:2px}.control-group input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}.modal-code h3{font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--muted-foreground);margin:0 0 .75rem}.modal-code pre{position:relative;margin:0;padding:3rem 1.25rem 1.25rem;background:var(--card);border:1px solid var(--border);overflow:auto;font-size:.85rem;line-height:1.7}.modal-code pre:before{content:"";position:absolute;top:12px;left:14px;width:10px;height:10px;border-radius:50%;background:#ff5f56;box-shadow:14px 0 #ffbd2e,28px 0 #27c93f}.modal-code code{font-family:inherit;font-size:inherit;color:var(--foreground);white-space:pre-wrap;overflow-wrap:anywhere;display:block}.code-copy-btn{position:absolute;top:12px;right:12px;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:var(--background);border:1px solid var(--border);color:var(--muted-foreground);cursor:pointer;z-index:2;transition:color .15s,border-color .15s}.code-copy-btn:hover{color:var(--foreground);border-color:var(--foreground)}.code-copy-btn.copied{color:var(--primary);border-color:var(--primary)}.keyword{color:var(--primary);font-weight:600}.component-name{color:var(--foreground);font-weight:600}.prop-name{color:var(--muted-foreground)}.prop-value{color:#3e8343}.punctuation{color:var(--muted-foreground)}.dark .prop-value{color:#67bb6b}.footer{border-top:1px solid var(--border);background:var(--background);padding:3rem 1.5rem 5rem;margin-top:auto}@media(min-width:768px){.footer{padding:5rem 2.5rem 7rem}}.footer-content{max-width:640px;margin:0 auto;text-align:center}.footer-brand-link{display:flex;flex-direction:column;align-items:center;gap:.5rem;width:fit-content;margin:0 auto 2rem;text-decoration:none;color:inherit}.footer-brand-icon{width:2.5rem;height:2.5rem;object-fit:contain;border-radius:6px;flex-shrink:0}.footer-brand-name{font-size:.875rem;font-weight:600;letter-spacing:-.02em;color:var(--foreground);line-height:1}.footer-tagline{font-size:.75rem;color:var(--muted-foreground);margin:0 0 2rem;line-height:1.5}.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem;margin-bottom:2rem}.footer-links a{font-size:.875rem;color:var(--muted-foreground);text-decoration:none;transition:color .15s}.footer-links a:hover{color:var(--primary)}.footer-bottom{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.footer-copyright{font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;color:var(--muted-foreground);margin:0}.footer-social{display:flex;align-items:center;gap:1.5rem}.footer-social a{color:var(--muted-foreground);transition:color .15s}.footer-social a:hover{color:var(--foreground)}.footer-social svg{width:1.25rem;height:1.25rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes modalEnter{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:768px){.hero-title{font-size:2.5rem}.modal-customizer{grid-template-columns:1fr}.modal-preview{min-height:200px}.site-nav-links{display:none!important}.site-nav-hamburger{display:inline-flex}.site-nav-mobile-menu{position:absolute;top:100%;right:0;background:var(--background);border:1px solid var(--border);border-radius:6px;padding:.5rem .75rem;display:flex;flex-direction:column;gap:.25rem;min-width:140px;z-index:100;box-shadow:0 4px 12px #0000001a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.site-nav-mobile-menu .site-nav-link{padding:.5rem .75rem;font-size:.875rem;text-transform:none;letter-spacing:normal;display:block}}.site-nav-hamburger{display:none}@media(max-width:480px){.page-wrap{padding:1rem .75rem 0rem}.gallery-controls{margin-left:-.75rem;margin-right:-.75rem;padding-left:.75rem;padding-right:.75rem}.site-nav-inner{padding:.5rem .75rem}.hero-title{font-size:2rem}.icons-grid{grid-template-columns:repeat(3,1fr)}.modal-overlay{align-items:stretch;padding:0}.modal-card{width:100%;max-height:100dvh;min-height:100dvh;border-left:none;border-right:none;border-top:none}}.install-cmd-card{display:flex;flex-direction:column;overflow:hidden;border-radius:.4rem;border:1px solid var(--border);background:var(--muted)}.install-cmd-tabs{display:flex;gap:.875rem;padding:0 1rem;border-bottom:1px solid var(--border);color:var(--secondary-foreground)}.install-cmd-tab{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;padding:.5rem 0;margin-bottom:-1px;font-size:.875rem;font-weight:500;font-family:inherit;color:var(--muted-foreground);background:none;border:none;border-bottom:1px solid transparent;cursor:pointer;transition:color .15s,border-color .15s}.install-cmd-tab:hover{color:var(--accent-foreground)}.install-cmd-tab.active{color:var(--primary);border-bottom-color:var(--primary)}.install-cmd-panel{background:transparent}.install-cmd-figure{position:relative;margin:0 -1px -1px;border:none;border-bottom-left-radius:.75rem;border-bottom-right-radius:.75rem;background:var(--muted);overflow:hidden;font-size:.8125rem}.install-cmd-copy{position:absolute;top:.75rem;right:.5rem;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;color:var(--muted-foreground);background:color-mix(in oklch,var(--background) 70%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:.4rem;cursor:pointer;transition:color .15s}.install-cmd-copy:hover,.install-cmd-copy.copied{color:var(--foreground)}.install-cmd-viewport{padding:.875rem 0;overflow:hidden;font-size:.8125rem}.install-cmd-viewport pre{margin:0;padding:0 2.5rem 0 1rem;overflow:hidden}.install-cmd-viewport code{display:block;font-family:inherit;font-size:inherit;color:var(--foreground);white-space:pre;background:transparent;padding:0;border:none}.install-cmd-viewport .line{display:block}