:root{--px: 4px;--radius: 8px;--border: 4px;--bg: #1b1e2b;--panel: #24283b;--fg: #e1e3ed;--muted: #a6accd;--accent: #8be9fd;--danger: #ff5555;--success: #50fa7b;--primary: #6272a4;--shadow: drop-shadow(0 var(--px) 0 #000);--white-text: #fff;--black: #000}.pix-btn{position:relative;display:inline-flex;align-items:center;color:#fff;padding:10px;height:32px;border:none;background:none;image-rendering:pixelated;overflow:visible;cursor:pointer}.pix-btn:hover{filter:brightness(1.1)}.pix-btn:active>.pix-btn__bg{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAAEBJREFUCJljbL8W+J+BgYGB5fGL+wwMDAwMLC8v/mRgYGBgYGKAAnoyWMT12SEMWQlFBgYGBgZGBgaGIgYGBgYAI88JTBisu3YAAAAASUVORK5CYII=) repeat-x center;background-size:auto 100%;image-rendering:pixelated}.pix-btn:active:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADBJREFUCJljYICC9muB/xlhjMcv7jMwwhgvL/5kYGJAAoOZg+IFGChqvxb4H1lVEQDSHxkUaX2K2wAAAABJRU5ErkJggg==)}.pix-btn:active:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADpJREFUCJljaL8W+J8BCpgev7jPABNgeXnxJwMDA0SAiQEJDGqOuD47g6yEIkOl1vpiJhgDJlsExQwAIjMTz4K8ZWEAAAAASUVORK5CYII=)}.pix-btn__bg{position:absolute;inset:0 5px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAAD9JREFUCJm9xrEVQDAUAMCL998zAo0iEzBXSgPawQQKjYyQioIZXHWpbMsNMY0ZxHkdoPP5M1H39maYe5CwwgOshgj2aozg7wAAAABJRU5ErkJggg==) repeat-x center;background-size:auto 100%;image-rendering:pixelated;z-index:0;pointer-events:none}.pix-btn__content{position:relative;z-index:1;margin:0 6px;color:#fff;display:inline-block}.pix-btn:before,.pix-btn:after{content:"";position:absolute;top:0;width:6px;height:100%;background-size:contain;background-repeat:no-repeat;image-rendering:pixelated;pointer-events:none;z-index:2}.pix-btn:before{left:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADlJREFUCJljYICCrH0G/xlhDFkJRQZGGOPxi/sMTAxIYFBzpjldYGRgYGB4efEnXLAoa5/Bf2RVRQDJDRIR61gBQwAAAABJRU5ErkJggg==)}.pix-btn:after{right:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADlJREFUCJljyNpn8J8BCphkJRQZYAKMWfsM/r+8+JNBXJ+dgYkBCQxqDszF05wuFDPBGDDZIihmAAARxxLkdnHCuQAAAABJRU5ErkJggg==)}.pix-btn--primary .pix-btn__bg{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAADxJREFUCJljlDOt+M/AwMDAIq9mzsDAwMDA8vDWSQYGBgYGJgYooCeDkUvSEeIeERmIexgZGBiKGBgYGAAuWgcwoCJRFwAAAABJRU5ErkJggg==) repeat-x center;background-size:auto 100%;image-rendering:pixelated}.pix-btn--primary:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADlJREFUCJljYIACOdOK/4wwhryaOQMjjPHw1kkGJgYkMKg5j053MDIwMDC8eXISLlgkZ1rxH1lVEQB5HBB23qRvZQAAAABJRU5ErkJggg==)}.pix-btn--primary:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAAEFJREFUCJljkDOt+M8ABUzyauYMMAFGOdOK/2+enGQQkTFnYGJAAoOZw8Al6fgf6oUiJhEZc4ZHpzuKYZJFUMwAAI5bEIxmdqCvAAAAAElFTkSuQmCC)}.pix-btn--primary:active>.pix-btn__bg{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAADxJREFUCJljtI1e/5+BgYGB5eGtkwwMDAwMjFySjv8ZGBgYmBiggJ4MFhEZcwhDXg3CYGRgYChiYGBgAAAB8AesGuBqPQAAAABJRU5ErkJggg==) repeat-x center;background-size:auto 100%;image-rendering:pixelated}.pix-btn--primary:active:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADBJREFUCJljYIAC2+j1/xlhjIe3TjIwwhhvnpxkYGJAAoOZg+IFGCiyjV7/H1lVEQBNZhaFR9q6MgAAAABJRU5ErkJggg==)}.pix-btn--primary:active:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADhJREFUCJljsI1e/58BCpge3jrJABNg5JJ0/C8iY84gr2bOwMSABAYzh0HOtOI/1AtFDHAGBCMYAE6ZEgSbUbplAAAAAElFTkSuQmCC)}.pix-btn--danger .pix-btn__bg{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAADpJREFUCJm9xkEVgCAUALDh+xkoIAm40IswdrIDFqCEHiQDOy1dtb4QrRQQ9xjgsOxMPHP+OXMGCR0+cAEImLLMTV8AAAAASUVORK5CYII=) repeat-x center;background-size:auto 100%;image-rendering:pixelated}.pix-btn--danger:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADlJREFUCJljYICCaUZG/xlhDHMVFQZGGOPknTsMTAxIYFBzss6dY2RgYGC4++oVXLBompHRf2RVRQD6bhEej/v11wAAAABJRU5ErkJggg==)}.pix-btn--danger:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADlJREFUCJljmGZk9J8BCpjMVVQYYAKM04yM/t999YpBWUyMgYkBCQxqDszFWefOFTPBGDDZIihmAABLJBKx9TJUVQAAAABJRU5ErkJggg==)}.pix-btn--danger:active>.pix-btn__bg{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAATCAYAAAC6PNwaAAAAAXNSR0IArs4c6QAAADpJREFUCJm9xkEVgCAUALDh+xkoAB1sQhBbeqABFqCEHiCDOy311l6IewwQz5zgsP2ZKDmvnLWChAs+6PgJFw1oyIoAAAAASUVORK5CYII=) repeat-x center;background-size:auto 100%;image-rendering:pixelated}.pix-btn--danger:active:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAADBJREFUCJljYICCs2Fh/xlhjJN37jAwwhh3X71iYGJAAoOZg+IFGCg6Gxb2H1lVEQDuuBeOkt7oTQAAAABJRU5ErkJggg==)}.pix-btn--danger:active:after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAATCAYAAABV/rckAAAAAXNSR0IArs4c6QAAAD1JREFUCJljOBsW9p8BCphO3rnDABNgufvqFQMDAwPD2bCw/0wMSGBQc5TFxBjMVVQYjFetKob5pQiKEQwA3LgTxbDFmAwAAAAASUVORK5CYII=)}.pix-bc{display:flex;align-items:center}.pix-bc__list{display:flex;align-items:center;flex-wrap:wrap;gap:calc(2*var(--px))}.pix-bc__item{display:inline-flex;align-items:center}.pix-bc__link{text-decoration:none;color:var(--fg);border:var(--border) solid transparent}.pix-bc__link:hover{outline-offset:0;color:var(--success);transition:all .5s}.pix-bc__separator{opacity:.75;-webkit-user-select:none;user-select:none;padding:0 calc(1*var(--px))}.pix-bc__current{color:var(--muted);pointer-events:none}.pix-nav{display:flex;align-items:center;justify-content:space-between;margin:0;padding:10px 0}.pix-nav__list{display:flex;align-items:center;margin:0;padding:0}.pix-nav__item{position:relative;display:inline-block;list-style:none;margin:0;padding:0}.pix-nav__link,.pix-nav__trigger{text-decoration:none;color:inherit;font-weight:500;padding:.25rem .5rem;border-radius:4px;margin:0;height:100%}.pix-nav__trigger{all:unset;font-family:inherit;background-color:transparent;border-radius:4px;cursor:pointer;color:inherit;font-weight:500;display:flex;align-items:center;gap:4px;font-family:PixelifySans;margin:0 8px}.pix-nav__content{background-color:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-top:10px}.pix-nav__content_region{display:none;position:absolute;top:10px;z-index:1000;margin-top:8px;min-width:160px}.pix-nav__item:hover .pix-nav__content_region,.pix-nav__item:active .pix-nav__content_region{display:inline-block}.pix-sidebar-provider{position:relative;display:flex}.pix-sidebar-provider .pix-sidebar{overflow:hidden;width:0px}.pix-sidebar-provider>:not(.pix-sidebar){flex:1}.pix-sidebar.open{width:250px;transition:width .3s ease}.pix-sidebar.closed{width:0;transition:width .3s ease}.pix-sidebar-trigger-wrapper{padding:5px;display:inline-block;text-align:center;margin:0;cursor:pointer}.pix-sidebar-trigger-wrapper img{object-fit:contain;width:30px;height:30px;margin:0}.pix-sidebar-content{background:#000;padding:20px;height:100%}.pix-sidebar-group{list-style:none}.pix-sidebar-group-label{font-weight:700;margin-bottom:10px}.pix-sidebar-menu-item{margin:5px 0;color:#fff}.pix-sidebar-menu-item a{color:inherit;text-decoration:none}.pix-tabs-content{padding:20px;background-color:#000}.pix-tabs-list{display:flex;border-bottom:1px solid var(--pix-border-color)}.pix-tabs-trigger{padding:10px;cursor:pointer}.pix-tabs-trigger.active{color:var(--white-text);background-color:var(--black)}.pix-accordion{border:1px solid var(--border);border-radius:6px;overflow:hidden}.pix-accordion-item{border-bottom:1px solid var(--border)}.pix-accordion-item:last-child{border-bottom:none}.pix-accordion-trigger{padding:12px 16px;cursor:pointer;background-color:var(--primary)}.pix-accordion-content{background:var(--panel);height:0px;overflow:hidden}.pix-accordion-content.active{height:auto;padding:12px 16px}.pix-code-view{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:8px;padding:16px;overflow-x:auto;font-size:14px;line-height:1.5;color:var(--color-text)}.pix-card{background:var(--panel);border:var(--border) solid var(--fg);border-radius:var(--radius);padding:calc(var(--px) * 6);color:var(--fg);image-rendering:pixelated;box-shadow:var(--shadow);transition:all .2s ease}.pix-card:hover{transform:translateY(-2px);box-shadow:drop-shadow(0 calc(var(--px) * 2) 0 #000)}.pix-card__header{display:flex;flex-direction:column;gap:calc(var(--px) * 2);margin-bottom:calc(var(--px) * 4)}.pix-card__title{font-size:1.5rem;font-weight:600;line-height:1.2;color:var(--fg);margin:0;letter-spacing:1px}.pix-card__description{font-size:.875rem;color:var(--muted);margin:0;line-height:1.5}.pix-card__content{padding-top:calc(var(--px) * 2);padding-bottom:calc(var(--px) * 2)}.pix-card__footer{display:flex;align-items:center;gap:calc(var(--px) * 2);margin-top:calc(var(--px) * 4);padding-top:calc(var(--px) * 4);border-top:var(--border) solid var(--muted)}.pix-card--interactive{cursor:pointer}.pix-card--interactive:active{transform:translateY(2px);box-shadow:none}.pix-card--compact{padding:calc(var(--px) * 4)}.pix-card--compact .pix-card__header{margin-bottom:calc(var(--px) * 2)}.pix-card--compact .pix-card__footer{margin-top:calc(var(--px) * 2);padding-top:calc(var(--px) * 2)}.pix-badge{display:inline-block;padding:calc(var(--px) * 1) calc(var(--px) * 2);border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);color:var(--white-text);font-size:12px;line-height:1}.pix-badge--default{background:var(--panel)}.pix-badge--secondary{background:var(--primary)}.pix-badge--destructive{background:var(--danger)}.pix-badge--outline{background:transparent;color:var(--white-text)}.pix-input{display:inline-block;width:100%;padding:calc(var(--px) * 2);border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);color:var(--white-text)}.pix-input--sm{padding:calc(var(--px) * 1.5)}.pix-input--md{padding:calc(var(--px) * 2)}.pix-input--lg{padding:calc(var(--px) * 3)}.pix-input:focus{outline:none;filter:brightness(1.1)}.pix-textarea{display:inline-block;width:100%;min-height:80px;padding:calc(var(--px) * 2);border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);color:var(--white-text);resize:vertical}.pix-textarea--sm{min-height:60px}.pix-textarea--md{min-height:80px}.pix-textarea--lg{min-height:120px}.pix-textarea:focus{outline:none;filter:brightness(1.1)}.pix-checkbox{display:inline-flex;align-items:center;gap:calc(var(--px) * 2);cursor:pointer}.pix-checkbox__input{display:none}.pix-checkbox__box{width:18px;height:18px;border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);position:relative}.pix-checkbox__input:checked+.pix-checkbox__box:after{content:"";position:absolute;inset:2px;background:var(--success)}.pix-checkbox__label{color:var(--white-text)}.pix-switch{display:inline-flex;align-items:center;gap:calc(var(--px) * 2);cursor:pointer}.pix-switch__input{display:none}.pix-switch__track{width:36px;height:20px;border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);position:relative}.pix-switch__thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;background:var(--muted)}.pix-switch__input:checked+.pix-switch__track .pix-switch__thumb{left:18px;background:var(--success)}.pix-switch__label{color:var(--white-text)}.pix-separator{background:var(--accent);filter:brightness(1.1)}.pix-separator--horizontal{height:var(--border);width:100%}.pix-separator--vertical{width:var(--border);height:100%;align-self:stretch}.pix-avatar{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:var(--border) solid var(--black);border-radius:50%;background:var(--panel);overflow:hidden;color:var(--white-text)}.pix-avatar__image{width:100%;height:100%;object-fit:cover}.pix-avatar__fallback{font-size:12px}.pix-dialog__overlay{position:fixed;inset:0;background:#0009}.pix-dialog__content{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);min-width:320px;border:var(--border) solid var(--black);border-radius:var(--radius);background:var(--panel);color:var(--white-text);padding:calc(var(--px) * 4)}.pix-dialog__header{margin-bottom:calc(var(--px) * 2)}.pix-dialog__title{font-size:16px;margin:0 0 calc(var(--px) * 1) 0}.pix-dialog__description{color:var(--muted);margin:0}.pix-dialog__footer{margin-top:calc(var(--px) * 3);display:flex;gap:calc(var(--px) * 2);justify-content:flex-end}*{image-rendering:pixelated}@font-face{font-family:PixelifySans;src:url(/pixkit/assets/PixelifySans-VariableFont_wght-BOgNfX6E.ttf) format("truetype")}@font-face{font-family:PressStart2P;src:url(/pixkit/assets/PressStart2P-Regular-CGiUnqOA.ttf) format("truetype")}p,h1,h2,h3,h4,h5,h6,button,span,pre,a{font-family:var(--pixkit-font-family, PressStart2P)}html,body{background:var(--bg);color:var(--fg);margin:0;font-family:var(--pixkit-font-family, PressStart2P),sans-serif}.pix-panel{background:var(--panel);color:var(--fg);padding:16px;border-radius:6px}a:hover{color:var(--primary)}a{transition:color .3s ease;cursor:pointer}input,textarea,select,button,label{font-family:var(--pixkit-font-family, PressStart2P),sans-serif}.hero{text-align:center}.hero-title{max-width:800px;margin:0 auto}.hero-title img{padding:0;margin:0}.hero-actions{display:flex;justify-content:center;gap:12px;padding-top:16px}.components-layout{padding:20px;background-color:#0a0e1b}
