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