.pallet_nav{--pallet-node-size:64px;--pallet-sprite-size:36px;--pallet-gap:1.75rem;--pallet-duration:.16s;--pallet-ring-thickness:3px;--pallet-ring-thickness-active:4px;--pallet-wave-amplitude:12px;--pallet-pokeball-red:#ee1c25;--pallet-pokeball-white:#f8f8f8;--pallet-pokeball-thickness:6px;--pallet-pokeball-button:6px;font-family:var(--pallet-font)}.pallet_nav[data-ring-style=pokeball]{--pallet-ring-thickness:var(--pallet-pokeball-thickness);--pallet-ring-thickness-active:var(--pallet-pokeball-thickness)}.pallet_trailWrap{position:relative}.pallet_trail{gap:var(--pallet-gap);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.pallet_nav[data-position=right] .pallet_trail{align-items:flex-end}.pallet_node{position:relative}.pallet_node:not(:last-child):after{content:"";top:var(--pallet-node-size);left:calc(var(--pallet-node-size) / 2 - 1px);height:var(--pallet-gap);border-left:2px var(--pallet-dot-style) color-mix(in srgb, var(--pallet-accent) 45%, transparent);position:absolute}.pallet_nav[data-position=right] .pallet_node:not(:last-child):after{left:auto;right:calc(var(--pallet-node-size) / 2 - 1px)}.pallet_nav[data-trail-path=wavy][data-trail-measured] .pallet_node:not(:last-child):after{content:none}.pallet_trailSvg{pointer-events:none;position:absolute;inset:0;overflow:visible}.pallet_trailBase{stroke:color-mix(in srgb, var(--pallet-accent) 45%, transparent)}.pallet_trailFill{stroke:var(--pallet-accent)}.pallet_trailMask{transition:stroke-dashoffset var(--pallet-duration) linear}.pallet_nav[data-scroll-fill] .pallet_node:not(:last-child):before{content:"";top:var(--pallet-node-size);left:calc(var(--pallet-node-size) / 2 - 1px);height:calc(var(--pallet-gap) * var(--pallet-segment-fill,0));border-left:2px var(--pallet-dot-style) var(--pallet-accent);transition:height var(--pallet-duration) linear;position:absolute}.pallet_nav[data-scroll-fill][data-position=right] .pallet_node:not(:last-child):before{left:auto;right:calc(var(--pallet-node-size) / 2 - 1px)}.pallet_nav[data-scroll-fill][data-trail-path=wavy][data-trail-measured] .pallet_node:not(:last-child):before{content:none}.pallet_link{color:inherit;align-items:center;gap:.85rem;text-decoration:none;display:inline-flex}.pallet_nav[data-position=right] .pallet_link{flex-direction:row-reverse}.pallet_ring{width:var(--pallet-node-size);height:var(--pallet-node-size);transition:transform var(--pallet-duration) ease, box-shadow var(--pallet-duration) ease;border-radius:50%;flex:none;place-items:center;display:grid;position:relative}.pallet_ring:before{content:"";box-sizing:border-box;pointer-events:none;transition:border-color var(--pallet-duration) ease, border-width var(--pallet-duration) ease, opacity var(--pallet-duration) ease;border-radius:50%;position:absolute;inset:0}.pallet_nav[data-ring-style=solid] .pallet_ring:before{border:var(--pallet-ring-thickness) solid color-mix(in srgb, var(--pallet-accent) 14%, transparent)}.pallet_nav[data-ring-style=solid] .pallet_link:hover .pallet_ring:before{border-color:color-mix(in srgb, var(--pallet-accent) 55%, transparent)}.pallet_nav[data-ring-style=solid] .pallet_node[data-active] .pallet_ring:before{border-width:var(--pallet-ring-thickness-active);border-color:var(--pallet-accent)}.pallet_nav[data-ring-style=pokeball] .pallet_ring:before{background:linear-gradient(to bottom, var(--pallet-pokeball-red) 0 50%, var(--pallet-pokeball-white) 50% 100%);-webkit-mask:radial-gradient(circle closest-side, transparent 0 calc(100% - var(--pallet-ring-thickness)), #000 calc(100% - var(--pallet-ring-thickness)) 100%);-webkit-mask:radial-gradient(circle closest-side, transparent 0 calc(100% - var(--pallet-ring-thickness)), #000 calc(100% - var(--pallet-ring-thickness)) 100%);mask:radial-gradient(circle closest-side, transparent 0 calc(100% - var(--pallet-ring-thickness)), #000 calc(100% - var(--pallet-ring-thickness)) 100%);opacity:.4}.pallet_nav[data-ring-style=pokeball] .pallet_link:hover .pallet_ring:before{opacity:.72}.pallet_nav[data-ring-style=pokeball] .pallet_node[data-active] .pallet_ring:before{opacity:1}.pallet_nav[data-ring-style=pokeball] .pallet_ring:after{content:"";top:50%;left:calc(var(--pallet-ring-thickness) / 2);width:var(--pallet-pokeball-button);height:var(--pallet-pokeball-button);box-sizing:border-box;background:var(--pallet-pokeball-white);border:1.5px solid color-mix(in srgb, var(--pallet-pokeball-red) 70%, #000);pointer-events:none;opacity:.4;transition:opacity var(--pallet-duration) ease;border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.pallet_nav[data-position=right][data-ring-style=pokeball] .pallet_ring:after{left:auto;right:calc(var(--pallet-ring-thickness) / 2);transform:translate(50%,-50%)}.pallet_nav[data-ring-style=pokeball] .pallet_link:hover .pallet_ring:after{opacity:.72}.pallet_nav[data-ring-style=pokeball] .pallet_node[data-active] .pallet_ring:after{opacity:1}.pallet_node[data-active] .pallet_ring{box-shadow:0 0 0 4px color-mix(in srgb, var(--pallet-accent) 18%, transparent);transform:scale(1.08)}.pallet_nav[data-scroll-fill] .pallet_node[data-active] .pallet_ring{box-shadow:none;transform:none}.pallet_nav[data-scroll-fill][data-ring-style=solid] .pallet_node[data-active] .pallet_ring:before{border-width:var(--pallet-ring-thickness);border-color:color-mix(in srgb, var(--pallet-accent) 14%, transparent)}.pallet_nav[data-scroll-fill][data-ring-style=pokeball] .pallet_node[data-active] .pallet_ring:before,.pallet_nav[data-scroll-fill][data-ring-style=pokeball] .pallet_node[data-active] .pallet_ring:after{opacity:.4}.pallet_nav[data-scroll-fill] .pallet_node[data-active] .pallet_label{color:color-mix(in srgb, currentColor 60%, transparent);font-weight:500}.pallet_nav[data-scroll-fill] .pallet_node[data-reached] .pallet_ring{box-shadow:0 0 0 4px color-mix(in srgb, var(--pallet-accent) 18%, transparent);transform:scale(1.08)}.pallet_nav[data-scroll-fill][data-ring-style=solid] .pallet_node[data-reached] .pallet_ring:before{border-width:var(--pallet-ring-thickness-active);border-color:var(--pallet-accent)}.pallet_nav[data-scroll-fill][data-ring-style=pokeball] .pallet_node[data-reached] .pallet_ring:before,.pallet_nav[data-scroll-fill][data-ring-style=pokeball] .pallet_node[data-reached] .pallet_ring:after{opacity:1}.pallet_nav[data-scroll-fill] .pallet_node[data-reached] .pallet_label{color:currentColor;font-weight:700}.pallet_sprite{width:var(--pallet-sprite-size);height:var(--pallet-sprite-size);object-fit:contain;image-rendering:pixelated;z-index:1;display:block;position:relative}.pallet_link:hover .pallet_sprite{animation:.48s pallet_bounce}.pallet_label{color:color-mix(in srgb, currentColor 60%, transparent);transition:color var(--pallet-duration) ease;font-weight:500}.pallet_node[data-active] .pallet_label{color:currentColor;font-weight:700}.pallet_nav[data-orientation=horizontal] .pallet_trail,.pallet_nav[data-orientation=horizontal][data-position=right] .pallet_trail{flex-direction:row;align-items:flex-start}.pallet_nav[data-orientation=horizontal][data-position=right] .pallet_trail{justify-content:flex-end}.pallet_nav[data-orientation=horizontal] .pallet_link,.pallet_nav[data-orientation=horizontal][data-position=right] .pallet_link{flex-direction:column;align-items:center;gap:.55rem}.pallet_nav[data-orientation=horizontal] .pallet_node{width:var(--pallet-node-size);justify-content:center;display:flex}.pallet_nav[data-orientation=horizontal] .pallet_label{max-width:calc(var(--pallet-node-size) + var(--pallet-gap));text-align:center}.pallet_nav[data-orientation=horizontal] .pallet_node:not(:last-child):after,.pallet_nav[data-orientation=horizontal][data-position=right] .pallet_node:not(:last-child):after{top:calc(var(--pallet-node-size) / 2 - 1px);right:auto;left:var(--pallet-node-size);width:var(--pallet-gap);border-left:none;border-top:2px var(--pallet-dot-style) color-mix(in srgb, var(--pallet-accent) 45%, transparent);height:0}.pallet_nav[data-scroll-fill][data-orientation=horizontal] .pallet_node:not(:last-child):before,.pallet_nav[data-scroll-fill][data-orientation=horizontal][data-position=right] .pallet_node:not(:last-child):before{top:calc(var(--pallet-node-size) / 2 - 1px);right:auto;left:var(--pallet-node-size);width:calc(var(--pallet-gap) * var(--pallet-segment-fill,0));border-left:none;border-top:2px var(--pallet-dot-style) var(--pallet-accent);height:0;transition:width var(--pallet-duration) linear}.pallet_link:focus-visible{outline:none}.pallet_link:focus-visible .pallet_ring{outline:3px solid var(--pallet-accent);outline-offset:3px}@keyframes pallet_bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-4px)}70%{transform:translateY(-1px)}}.pallet_nav[data-reduced-motion] .pallet_ring,.pallet_nav[data-reduced-motion] .pallet_ring:before,.pallet_nav[data-reduced-motion] .pallet_ring:after,.pallet_nav[data-reduced-motion] .pallet_sprite,.pallet_nav[data-reduced-motion] .pallet_label,.pallet_nav[data-reduced-motion] .pallet_node:before,.pallet_nav[data-reduced-motion] .pallet_trailMask{transition:none;animation:none}@media (prefers-reduced-motion:reduce){.pallet_ring,.pallet_ring:before,.pallet_ring:after,.pallet_sprite,.pallet_label,.pallet_node:before,.pallet_trailMask{transition:none;animation:none}}
:root{--bg:#0b0f14;--fg:#e6edf3;--muted:#8b98a5;--border:#1e2936;--panel:#10171f;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root{--bg:#fff;--fg:#10161d;--muted:#5b6774;--border:#e3e8ee;--panel:#f7f9fb;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;padding:3rem 1.5rem 5rem;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.6}main{max-width:56rem;margin:0 auto}h1{letter-spacing:-.02em;margin:0 0 .5rem;font-size:2.25rem}h2{letter-spacing:.01em;font-size:1rem;font-weight:600}.lede{max-width:42rem;color:var(--muted);margin:0 0 2rem}.hint{color:var(--muted);max-width:42rem;font-size:.9rem}code{background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:.1em .35em;font-family:ui-monospace,SFMono-Regular,Cascadia Code,Menlo,monospace;font-size:.88em}.controls{align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.controlsLabel{color:var(--muted);margin-right:.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem}.swatch{outline-offset:2px;cursor:pointer;border:2px solid #0000;border-radius:50%;width:22px;height:22px;padding:0}.swatch[data-selected]{border-color:var(--fg)}.section{margin:2.5rem 0 0;font-size:1.1rem;font-weight:700}.demos{flex-wrap:wrap;gap:1rem;margin:1.5rem 0 2.5rem;display:flex}.demosStacked{flex-direction:column;gap:1rem;margin:1.5rem 0 2.5rem;display:flex}.scrollRoom{height:90vh}.demo{border:1px solid var(--border);background:var(--panel);border-radius:12px;flex-direction:column;flex:15rem;gap:1.25rem;padding:1.75rem 1.5rem;display:flex}.demo h3{color:var(--muted);margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;font-weight:500}.picker{border:1px solid var(--border);background:var(--panel);border-radius:14px;margin:2rem 0 3.5rem;padding:1.5rem}.pickerHeading{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:1.75rem 0 .75rem;font-size:.82rem;font-weight:600}.pickerHeading:first-child{margin-top:0}.pickerHeading em{color:var(--fg);font-style:normal}.pickerMain{flex-wrap:wrap;align-items:flex-start;gap:2rem;display:flex}.pickerLeft{flex:22rem;min-width:0}.pickerPreview{flex:18rem;min-width:0}.previewStage{border:1px dashed var(--border);border-radius:12px;justify-content:center;min-height:20rem;padding:1.75rem 1rem;display:flex}.previewStage[data-orientation=horizontal]{align-items:center;min-height:12rem}.slots{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.slots li{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.slot{border:1px solid var(--border);color:inherit;cursor:pointer;text-align:left;font:inherit;background:0 0;border-radius:9px;flex:10rem;align-items:center;gap:.6rem;padding:.4rem .6rem;display:flex}.slot[data-selected]{border-color:var(--fg);background:color-mix(in srgb, var(--fg) 7%, transparent)}.slotSprite{flex:none;place-items:center;width:34px;height:34px;display:grid}.slotText{flex-direction:column;min-width:0;display:flex}.slotLabel{font-size:.9rem;font-weight:600}.slotMeta{color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem}.slotEdit{align-items:center;gap:.35rem;display:flex}.slotInput{border:1px solid var(--border);background:var(--bg);width:6.5rem;color:inherit;font:inherit;border-radius:7px;padding:.35rem .5rem;font-size:.8rem}.slotRemove,.addItem{border:1px solid var(--border);color:var(--muted);cursor:pointer;font:inherit;background:0 0;border-radius:7px}.slotRemove{width:1.9rem;height:1.9rem;font-size:1.1rem;line-height:1}.slotRemove:disabled{opacity:.35;cursor:not-allowed}.addItem{margin-top:.6rem;padding:.4rem .75rem;font-size:.85rem}.styleControls{flex-direction:column;gap:.6rem;display:flex}.controlRow{align-items:center;gap:.5rem;display:flex}.controlRow .controlsLabel{flex:none;width:3.5rem}.toggle{border:1px solid var(--border);border-radius:8px;display:inline-flex;overflow:hidden}.toggleOption{color:var(--muted);cursor:pointer;font:inherit;background:0 0;border:0;padding:.3rem .7rem;font-size:.8rem}.toggleOption[data-selected]{background:color-mix(in srgb, var(--fg) 12%, transparent);color:var(--fg)}.gridControls{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.search{border:1px solid var(--border);background:var(--bg);color:inherit;font:inherit;border-radius:9px;flex:18rem;padding:.55rem .8rem}.genTabs{flex-wrap:wrap;gap:.3rem;display:flex}.genTab{border:1px solid var(--border);color:var(--muted);cursor:pointer;font:inherit;background:0 0;border-radius:7px;padding:.35rem .6rem;font-size:.78rem}.genTab[data-selected]{border-color:var(--fg);color:var(--fg);background:color-mix(in srgb, var(--fg) 8%, transparent)}.resultCount{color:var(--muted);margin:0 0 .6rem;font-size:.78rem}.grid{border:1px solid var(--border);background:var(--bg);border-radius:10px;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:.4rem;max-height:26rem;padding:.5rem;display:grid;overflow-y:auto}.gridItem{cursor:pointer;font:inherit;background:0 0;border:1px solid #0000;border-radius:8px;padding:.4rem .2rem}.gridItem:hover{border-color:var(--border);background:var(--panel)}.gridItem[data-chosen]{border-color:var(--fg);background:color-mix(in srgb, var(--fg) 10%, transparent)}.thumb{flex-direction:column;align-items:center;gap:.25rem;display:flex}.thumbImg,.thumbSkeleton{object-fit:contain;width:32px;height:32px;image-rendering:pixelated}.thumbSkeleton{background:color-mix(in srgb, var(--muted) 15%, transparent);border-radius:6px}.thumbName{color:var(--muted);text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.62rem;overflow:hidden}.empty{color:var(--muted);text-align:center;grid-column:1/-1;padding:2rem 0}.output{position:relative}.json{border:1px solid var(--border);background:var(--bg);border-radius:10px;max-height:18rem;margin:0;padding:1rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;line-height:1.5;overflow:auto}.copy{border:1px solid var(--border);background:var(--panel);color:var(--fg);cursor:pointer;font:inherit;border-radius:7px;padding:.35rem .8rem;font-size:.78rem;position:absolute;top:.6rem;right:.6rem}