:root{--background:#000;--element:#0d0d0d;--dark-button:#262626;--text:#fff;--text-secondary:#707070}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;width:100%;max-width:100vw;height:calc(100% - 92px);margin-top:92px;overflow-x:hidden}@media (max-width:768px){html{height:calc(100% - 72px);margin-top:72px}}body{background-color:var(--background);color:var(--text);font-family:var(--font-kode-mono),monospace;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100%;max-width:100vw;padding:0 24px 24px;font-size:15px;overflow-x:hidden}@media (max-width:768px){body{padding:0 16px 16px;font-size:14px}}body::-webkit-scrollbar{width:4px}body::-webkit-scrollbar-track{background:var(--background)}body::-webkit-scrollbar-thumb{background:var(--dark-button)}a,button,img{-webkit-user-select:none;user-select:none;color:var(--text);text-decoration:none}.page-enter-active,.page-leave-active{transition:all .15s ease-out}.page-enter-from,.page-leave-to{opacity:.2;filter:blur(1px)}main{flex-direction:column;gap:96px;max-width:1400px;margin:0 auto;display:flex}@media (max-width:768px){main{gap:64px}}.hero{text-align:center;max-width:900px;margin:0 auto;padding:96px 24px}@media (max-width:768px){.hero{padding:64px 16px}}.hero h1{font-family:var(--font-space-grotesk),sans-serif;margin-bottom:24px;font-size:64px;font-weight:700;line-height:1.1}@media (max-width:768px){.hero h1{margin-bottom:16px;font-size:40px}}.hero p{color:var(--text-secondary);margin-bottom:40px;font-size:20px;line-height:1.6}@media (max-width:768px){.hero p{margin-bottom:32px;font-size:16px}}.hero .buttons{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}@media (max-width:768px){.hero .buttons{gap:12px}}.features .cards{grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:24px;display:grid}@media (max-width:768px){.features .cards{grid-template-columns:1fr;gap:16px}}.pricing .grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}@media (max-width:768px){.pricing .grid{grid-template-columns:1fr;gap:16px}}.about .stats{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;display:grid}@media (max-width:768px){.about .stats{grid-template-columns:repeat(2,1fr);gap:16px}}.button{font-family:var(--font-kode-mono),monospace;background-color:var(--text);color:var(--background);cursor:pointer;justify-content:center;align-items:center;gap:8px;height:36px;padding:8px 24px;font-weight:600;display:flex;box-shadow:inset 0 -3px #0003}@media (max-width:768px){.button{width:100%}}.button:hover{box-shadow:none;background-color:#ffffffd9}.button.darken{background-color:var(--dark-button);color:var(--text)}.button.darken:hover{background-color:#262626d9}.top-wrapper{background-color:var(--background);z-index:9999;-webkit-user-select:none;user-select:none;width:100vw;height:68px;padding:24px;position:fixed;top:0;left:0}.top-wrapper .top{justify-content:space-between;width:100%;display:flex}.top-wrapper .top .branding{gap:24px;display:flex}.top-wrapper .top .branding .back{color:var(--text);align-items:center;gap:8px;display:flex}.top-wrapper .top .branding .name{color:var(--text);align-items:center;gap:1px;display:flex}.top-wrapper .top .branding .name p{line-height:11px}.top-wrapper .top .branding .name img{height:10.5px}.top-wrapper .top .branding .time{color:var(--text-secondary)}.top-wrapper .top .links{gap:24px;display:flex}.top-wrapper .top .links .link{color:var(--text)}.top-wrapper .top .links .link:hover{color:var(--text-secondary)}@media (max-width:768px){.hide-mobile{display:none}.top-wrapper{padding:16px}}.footer{color:var(--text-secondary);flex-direction:column;align-items:center;gap:4px;font-weight:500;display:flex}.footer .footnote{align-items:center;display:flex}.footer .footnote a{color:var(--text-secondary);-webkit-user-select:all;user-select:all}.footer .link{color:var(--text)}.features .card{background-color:var(--element);font-family:var(--font-space-grotesk),sans-serif;flex-direction:column;flex:400px;gap:8px;padding:24px;display:flex}@media (max-width:768px){.features .card{flex:100%}}.features .card .text{flex-direction:column;gap:4px;display:flex}.features .card .text h3{font-size:15px}.features .card .text p{color:var(--text-secondary)}.text{flex-direction:column;gap:8px;display:flex}.text .title{font-size:42px;font-weight:500;font-family:var(--font-space-grotesk),sans-serif}@media (max-width:768px){.text .title{font-size:32px}}.text .description{font-family:var(--font-space-grotesk),sans-serif;color:var(--text-secondary)}.text .description a{color:var(--text-secondary);text-decoration:underline}.pricing .card{border:1px solid var(--dark-button);flex-direction:column;gap:24px;min-height:500px;padding:24px;display:flex}.pricing .card.featured{border:1px solid var(--text);position:relative;overflow:hidden}.pricing .card.featured:before{content:"Popular";background-color:var(--text);color:var(--background);padding:.25rem 2rem;font-size:.75rem;font-weight:600;position:absolute;top:1rem;right:-2rem;transform:rotate(45deg)}.pricing .card h3{font-family:var(--font-space-grotesk),sans-serif;flex-direction:column;justify-content:center;align-items:center;font-size:24px;font-weight:600;display:flex}.pricing .card h3 span{color:var(--text-secondary);font-size:15px;font-weight:500}.pricing .card .price{font-family:var(--font-space-grotesk),sans-serif;text-align:center;font-size:24px;font-weight:500}.pricing .card .price span{color:var(--text-secondary);font-size:15px;font-family:var(--font-kode-mono),monospace}.pricing .card .list{text-align:left;flex-direction:column;flex-grow:1;gap:8px;display:flex}.pricing .card .list li{color:var(--text-secondary);align-items:center;gap:8px;list-style:none;display:flex}.pricing .card .list li:before{content:"✓";font-size:18px;font-weight:700}.pricing .card.enterprise{min-height:unset;grid-column:1/-1;display:flex}.pricing .card.enterprise .horizontal{flex-direction:column;gap:24px;display:flex}@media (min-width:768px){.pricing .card.enterprise .text,.pricing .card.enterprise .text .price{text-align:left}.pricing .card.enterprise .horizontal{flex-direction:row}}.about .item{background-color:var(--element);text-align:center;flex-direction:column;flex:200px;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.about .item .number{color:var(--text);font-size:24px;font-weight:700}.about .item .label{color:var(--text-secondary)}.showcase{flex-direction:column;gap:24px;display:flex}.component-preview{background-color:var(--background);border:1px solid var(--dark-button);padding:32px}.component-preview .preview-row{flex-wrap:wrap;gap:16px;display:flex}.input-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;display:grid}.input-group{flex-direction:column;gap:8px;display:flex}.input-label{font-family:var(--font-space-grotesk),sans-serif;font-size:14px;font-weight:500}.input,.textarea,.select{background-color:var(--background);border:1px solid var(--dark-button);color:var(--text);font-family:var(--font-kode-mono),monospace;outline:none;padding:10px 14px;font-size:14px;transition:border-color .2s}.input:focus,.textarea:focus,.select:focus{border-color:var(--text-secondary)}.input:disabled{opacity:.5;cursor:not-allowed}.input::placeholder,.textarea::placeholder{color:var(--text-secondary)}.textarea{resize:vertical;min-height:100px}.select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23707070' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:40px}.checkbox-group{flex-direction:column;gap:12px;display:flex}.checkbox-label{cursor:pointer;color:var(--text-secondary);align-items:center;gap:12px;display:flex}.checkbox-label:hover{color:var(--text)}.checkbox,.radio{appearance:none;background-color:var(--background);border:1px solid var(--dark-button);cursor:pointer;flex-shrink:0;place-content:center;width:18px;height:18px;display:grid}.checkbox:before{content:"";background-color:var(--text);width:10px;height:10px;transition:transform .15s;transform:scale(0)}.checkbox:checked:before{transform:scale(1)}.checkbox:checked{border-color:var(--text)}.radio{border-radius:50%}.radio:before{content:"";background-color:var(--text);border-radius:50%;width:8px;height:8px;transition:transform .15s;transform:scale(0)}.radio:checked:before{transform:scale(1)}.radio:checked{border-color:var(--text)}.toggle-list{flex-direction:column;gap:16px;max-width:400px;display:flex}.toggle-item{border-bottom:1px solid var(--dark-button);justify-content:space-between;align-items:center;padding:12px 0;display:flex}.toggle-item:last-child{border-bottom:none}.toggle-info{flex-direction:column;gap:2px;display:flex}.toggle-title{font-family:var(--font-space-grotesk),sans-serif;font-weight:500}.toggle-description{color:var(--text-secondary);font-size:13px}.toggle{cursor:pointer;width:44px;height:24px;display:inline-block;position:relative}.toggle input{opacity:0;width:0;height:0}.toggle-slider{background-color:var(--dark-button);transition:all .2s;position:absolute;inset:0}.toggle-slider:before{content:"";background-color:var(--text-secondary);width:18px;height:18px;transition:all .2s;position:absolute;bottom:3px;left:3px}.toggle input:checked+.toggle-slider{background-color:var(--text)}.toggle input:checked+.toggle-slider:before{background-color:var(--background);transform:translate(20px)}.badge{font-size:12px;font-weight:500;font-family:var(--font-kode-mono),monospace;background-color:var(--dark-button);color:var(--text);align-items:center;padding:4px 10px;display:inline-flex}.badge-success{color:#4ade80;background-color:#0d2818}.badge-warning{color:#fbbf24;background-color:#2d2005}.badge-error{color:#f87171;background-color:#2d0a0a}.badge-info{color:#60a5fa;background-color:#0a1a2d}.alert-stack{flex-direction:column;gap:16px;display:flex}.alert{background-color:var(--element);border-left:3px solid var(--dark-button);flex-direction:column;gap:4px;padding:16px;display:flex}.alert-title{font-family:var(--font-space-grotesk),sans-serif;font-weight:500}.alert-message{color:var(--text-secondary);font-size:14px}.alert-success{background-color:#052e16;border-left-color:#4ade80}.alert-success .alert-title{color:#4ade80}.alert-warning{background-color:#1c1305;border-left-color:#fbbf24}.alert-warning .alert-title{color:#fbbf24}.alert-error{background-color:#1f0505;border-left-color:#f87171}.alert-error .alert-title{color:#f87171}.avatar{background-color:var(--dark-button);width:40px;height:40px;font-family:var(--font-space-grotesk),sans-serif;border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:600;display:flex}.avatar-sm{width:32px;height:32px;font-size:12px}.avatar-lg{width:56px;height:56px;font-size:18px}.avatar-xl{width:72px;height:72px;font-size:24px}.progress-stack{flex-direction:column;gap:24px;max-width:400px;display:flex}.progress-item{flex-direction:column;gap:8px;display:flex}.progress-header{justify-content:space-between;font-size:14px;display:flex}.progress-header span:first-child{font-family:var(--font-space-grotesk),sans-serif;font-weight:500}.progress-header span:last-child{color:var(--text-secondary)}.progress-bar{background-color:var(--dark-button);height:8px;overflow:hidden}.progress-fill{background-color:var(--text);height:100%;transition:width .3s}.progress-fill.progress-success{background-color:#4ade80}.tabs{border-bottom:1px solid var(--dark-button);gap:0;display:flex}.tab{font-family:var(--font-kode-mono),monospace;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:12px 20px;font-size:14px;transition:color .2s,border-color .2s}.tab:hover{color:var(--text)}.tab.active{color:var(--text);border-bottom-color:var(--text)}.card-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}.showcase .card{background-color:var(--background);border:1px solid var(--dark-button);flex-direction:column;gap:16px;padding:24px;display:flex}.showcase .card .card-header{justify-content:space-between;align-items:center;display:flex}.showcase .card .card-header h3{font-family:var(--font-space-grotesk),sans-serif;font-size:18px;font-weight:600}.showcase .card .card-description{color:var(--text-secondary);font-size:14px;line-height:1.5}.showcase .card .card-footer{border-top:1px solid var(--dark-button);justify-content:space-between;align-items:center;margin-top:auto;padding-top:16px;display:flex}.showcase .card .card-meta{color:var(--text-secondary);font-size:13px}.table-wrapper{overflow-x:auto}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border:1px solid var(--dark-button);padding:12px 16px}.table th{background-color:var(--background);font-family:var(--font-space-grotesk),sans-serif;font-size:14px;font-weight:600}.table td{color:var(--text-secondary);font-size:14px}.table tbody tr:hover{background-color:#ffffff05}.skeleton-card{gap:16px;max-width:400px;display:flex}.skeleton{background:linear-gradient(90deg,var(--dark-button)25%,#ffffff1a 50%,var(--dark-button)75%);background-size:200% 100%;animation:1.5s infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-avatar{border-radius:50%;flex-shrink:0;width:48px;height:48px}.skeleton-content{flex-direction:column;flex:1;gap:12px;display:flex}.skeleton-title{width:60%;height:20px}.skeleton-text{width:100%;height:14px}.tooltip-wrapper{display:inline-block;position:relative}.tooltip{background-color:var(--text);color:var(--background);font-size:13px;font-family:var(--font-kode-mono),monospace;white-space:nowrap;opacity:0;visibility:hidden;z-index:100;padding:8px 12px;transition:opacity .2s,visibility .2s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip:after{content:"";border:6px solid #0000;border-top-color:var(--text);position:absolute;top:100%;left:50%;transform:translate(-50%)}.tooltip-wrapper:hover .tooltip{opacity:1;visibility:visible}.color-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px;display:grid}.color-swatch{flex-direction:column;gap:12px;display:flex}.color-swatch .swatch{border:1px solid var(--dark-button);width:100%;height:80px}.color-swatch .color-info{flex-direction:column;gap:4px;display:flex}.color-swatch .color-name{font-family:var(--font-space-grotesk),sans-serif;font-weight:500}.color-swatch code{color:var(--text-secondary);font-size:13px}.typography-showcase{flex-direction:column;gap:32px;display:flex}.type-sample{flex-direction:column;gap:4px;display:flex}.type-sample .type-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;font-size:12px}.type-sample h1{font-size:48px;font-weight:600}@media (max-width:768px){.type-sample h1{font-size:32px}.component-preview{padding:24px 16px}.input-grid,.card-grid{grid-template-columns:1fr}.preview-row{flex-direction:column}}
@font-face{font-family:kodeMono;src:url(../media/KodeMono-s.p.e4e07fcb.woff2)format("woff2");font-display:swap}@font-face{font-family:kodeMono Fallback;src:local(Arial);ascent-override:74.53%;descent-override:22.82%;line-gap-override:0.0%;size-adjust:131.49%}.kodemono_d998c404-module__105_RW__className{font-family:kodeMono,kodeMono Fallback}.kodemono_d998c404-module__105_RW__variable{--font-kode-mono:"kodeMono","kodeMono Fallback"}
@font-face{font-family:spaceGrotesk;src:url(../media/SpaceGrotesk-s.p.e0728079.woff2)format("woff2");font-display:swap}@font-face{font-family:spaceGrotesk Fallback;src:local(Arial);ascent-override:88.78%;descent-override:26.34%;line-gap-override:0.0%;size-adjust:110.84%}.spacegrotesk_ebb5b960-module___byPtq__className{font-family:spaceGrotesk,spaceGrotesk Fallback}.spacegrotesk_ebb5b960-module___byPtq__variable{--font-space-grotesk:"spaceGrotesk","spaceGrotesk Fallback"}
