:root{--color-primary:#6a4c93;--color-primary-light:#8b5a96;--color-primary-dark:#5a3d73;--color-secondary:#9d6bb3;--color-secondary-light:#b998cc;--color-secondary-dark:#7a527a;--color-bg-primary:#000;--color-bg-secondary:#1a1a1a;--color-bg-tertiary:#2a2a2a;--color-text-primary:#e0e0e0;--color-text-secondary:#b0b0b0;--color-text-muted:#888;--color-border:#5a3d73;--color-border-light:#9d6bb3;--font-primary:"Roboto",sans-serif;--font-heading:"Space Mono",monospace;--font-code:"Space Mono",monospace;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--shadow-sm:0 2px 4px #0000004d;--shadow-md:0 4px 8px #0006;--shadow-lg:0 8px 16px #00000080;--shadow-purple:0 0 20px #6a4c934d;--transition-fast:0.15s ease;--transition-normal:0.3s ease;--transition-slow:0.5s ease}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#000;background-color:var(--color-bg-primary);color:#e0e0e0;color:var(--color-text-primary);font-family:Roboto,sans-serif;font-family:var(--font-primary);line-height:1.6}.style-guide{display:flex;flex-direction:column;min-height:100vh}.sg-header{background:linear-gradient(135deg,#1a1a1a,#5a3d73);background:linear-gradient(135deg,var(--color-bg-secondary) 0,var(--color-primary-dark) 100%);border-bottom:2px solid #6a4c93;border-bottom:2px solid var(--color-primary);padding:48px 24px;padding:var(--spacing-2xl) var(--spacing-lg);text-align:center}.sg-title{color:#8b5a96;color:var(--color-primary-light);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:3rem;font-weight:700;margin-bottom:16px;margin-bottom:var(--spacing-md);text-shadow:0 0 10px #6a4c9380}.sg-subtitle{color:#b0b0b0;color:var(--color-text-secondary);font-size:1.2rem;font-weight:300}.sg-nav{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border-bottom:1px solid #5a3d73;border-bottom:1px solid var(--color-border);padding:16px 24px;padding:var(--spacing-md) var(--spacing-lg);position:sticky;top:0;z-index:100}.sg-nav ul{display:flex;flex-wrap:wrap;gap:24px;gap:var(--spacing-lg);justify-content:center;list-style:none}.sg-nav a{border-radius:4px;border-radius:var(--radius-sm);color:#b0b0b0;color:var(--color-text-secondary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-weight:400;padding:8px 16px;padding:var(--spacing-sm) var(--spacing-md);text-decoration:none;transition:all .3s ease;transition:all var(--transition-normal)}.sg-nav a:hover{background-color:#6a4c931a;color:#8b5a96;color:var(--color-primary-light);transform:translateY(-2px)}.sg-main{flex:1 1;margin:0 auto;max-width:1200px;padding:48px 24px;padding:var(--spacing-2xl) var(--spacing-lg);width:100%}.sg-section{border-bottom:1px solid #5a3d73;border-bottom:1px solid var(--color-border);margin-bottom:48px;margin-bottom:var(--spacing-2xl);padding-bottom:48px;padding-bottom:var(--spacing-2xl)}.sg-section:last-child{border-bottom:none}.sg-section h2{color:#6a4c93;color:var(--color-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:2.5rem;margin-bottom:32px;margin-bottom:var(--spacing-xl);text-align:center}.sg-footer{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border-top:1px solid #5a3d73;border-top:1px solid var(--color-border);color:#888;color:var(--color-text-muted);padding:24px;padding:var(--spacing-lg);text-align:center}.color-grid{grid-gap:32px;grid-gap:var(--spacing-xl);display:grid;gap:32px;gap:var(--spacing-xl)}.color-category h3{color:#e0e0e0;color:var(--color-text-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.5rem;margin-bottom:24px;margin-bottom:var(--spacing-lg)}.color-row{grid-gap:16px;grid-gap:var(--spacing-md);display:grid;gap:16px;gap:var(--spacing-md);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.color-swatch{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);padding:16px;padding:var(--spacing-md);transition:transform .3s ease;transition:transform var(--transition-normal)}.color-swatch:hover{box-shadow:0 0 20px #6a4c934d;box-shadow:var(--shadow-purple);transform:translateY(-4px)}.color-preview{border:2px solid #5a3d73;border:2px solid var(--color-border);border-radius:4px;border-radius:var(--radius-sm);height:80px;margin-bottom:16px;margin-bottom:var(--spacing-md);width:100%}.color-info{display:flex;flex-direction:column;gap:4px;gap:var(--spacing-xs)}.color-name{color:#e0e0e0;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.color-hex{color:#8b5a96;color:var(--color-primary-light);font-family:Space Mono,monospace;font-family:var(--font-code);font-weight:500}.color-usage{color:#b0b0b0;color:var(--color-text-secondary);font-size:.9rem;font-style:italic}.typography-examples{grid-gap:32px;grid-gap:var(--spacing-xl);display:grid;gap:32px;gap:var(--spacing-xl)}.typography-category h3{color:#e0e0e0;color:var(--color-text-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.5rem;margin-bottom:24px;margin-bottom:var(--spacing-lg)}.typography-samples{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);padding:24px;padding:var(--spacing-lg)}.sample-h1{color:#6a4c93;color:var(--color-primary);font-size:3rem}.sample-h1,.sample-h2{font-family:Space Mono,monospace;font-family:var(--font-heading);font-weight:700;margin-bottom:16px;margin-bottom:var(--spacing-md)}.sample-h2{color:#8b5a96;color:var(--color-primary-light);font-size:2.5rem}.sample-h3{font-size:2rem}.sample-h3,.sample-h4{color:#e0e0e0;color:var(--color-text-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-weight:400;margin-bottom:16px;margin-bottom:var(--spacing-md)}.sample-h4{font-size:1.5rem}.sample-body-large{font-size:1.2rem}.sample-body,.sample-body-large{color:#e0e0e0;color:var(--color-text-primary);margin-bottom:16px;margin-bottom:var(--spacing-md)}.sample-body{font-size:1rem}.sample-body-small{color:#b0b0b0;color:var(--color-text-secondary);font-size:.9rem;margin-bottom:16px;margin-bottom:var(--spacing-md)}.sample-code{padding:4px 8px;padding:var(--spacing-xs) var(--spacing-sm)}.sample-code,.sample-pre{background-color:#2a2a2a;background-color:var(--color-bg-tertiary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:4px;border-radius:var(--radius-sm);color:#8b5a96;color:var(--color-primary-light);font-family:Space Mono,monospace;font-family:var(--font-code)}.sample-pre{margin-top:16px;margin-top:var(--spacing-md);overflow-x:auto;padding:16px;padding:var(--spacing-md)}.component-category{margin-bottom:32px;margin-bottom:var(--spacing-xl)}.component-category h3{align-items:center;color:#e0e0e0;color:var(--color-text-primary);display:flex;font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.5rem;gap:16px;gap:var(--spacing-md);margin-bottom:24px;margin-bottom:var(--spacing-lg)}.mixed-indicator{background-color:#6a4c931a;border:1px solid #6a4c93;border:1px solid var(--color-primary);border-radius:4px;border-radius:var(--radius-sm);color:#9d6bb3;color:var(--color-secondary);font-size:.8rem;font-weight:400;padding:4px 8px;padding:var(--spacing-xs) var(--spacing-sm)}.component-grid{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);display:flex;flex-wrap:wrap;gap:16px;gap:var(--spacing-md);padding:24px;padding:var(--spacing-lg)}.btn{align-items:center;border:2px solid #0000;border-radius:8px;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;font-family:Roboto,sans-serif;font-family:var(--font-primary);font-size:1rem;font-weight:500;gap:8px;gap:var(--spacing-sm);justify-content:center;padding:8px 24px;padding:var(--spacing-sm) var(--spacing-lg);text-decoration:none;transition:all .3s ease;transition:all var(--transition-normal)}.btn:hover{box-shadow:0 4px 8px #0006;box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg,#6a4c93,#8b5a96);background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-light) 100%);border-color:#8b5a96;border-color:var(--color-primary-light);color:#fff}.btn-primary:hover{border-color:#9d6bb3;border-color:var(--color-secondary);box-shadow:0 4px 16px #6a4c9366}.btn-secondary{background-color:#2a2a2a;background-color:var(--color-bg-tertiary);border-color:#5a3d73;border-color:var(--color-border);color:#e0e0e0;color:var(--color-text-primary)}.btn-secondary:hover{background-color:#5a3d73;background-color:var(--color-primary-dark);color:#fff}.btn-outline,.btn-secondary:hover{border-color:#6a4c93;border-color:var(--color-primary)}.btn-outline{background-color:initial;color:#8b5a96;color:var(--color-primary-light)}.btn-outline:hover{background-color:#6a4c93;background-color:var(--color-primary);box-shadow:0 0 16px #6a4c934d;color:#fff}.btn-ghost{background-color:initial;border-color:#0000;color:#b0b0b0;color:var(--color-text-secondary)}.btn-ghost:hover{background-color:#6a4c931a;color:#8b5a96;color:var(--color-primary-light)}.btn:disabled{box-shadow:none;cursor:not-allowed;opacity:.5;transform:none}.form-examples{grid-gap:24px;grid-gap:var(--spacing-lg);background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);display:grid;gap:24px;gap:var(--spacing-lg);padding:24px;padding:var(--spacing-lg)}.form-group{display:flex;flex-direction:column;gap:8px;gap:var(--spacing-sm)}.form-group label{color:#e0e0e0;color:var(--color-text-primary);font-size:.95rem;font-weight:500}.form-group input,.form-group select,.form-group textarea{background-color:#2a2a2a;background-color:var(--color-bg-tertiary);border:2px solid #5a3d73;border:2px solid var(--color-border);border-radius:4px;border-radius:var(--radius-sm);color:#e0e0e0;color:var(--color-text-primary);font-family:Roboto,sans-serif;font-family:var(--font-primary);font-size:1rem;padding:16px;padding:var(--spacing-md);transition:all .3s ease;transition:all var(--transition-normal)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border-color:#6a4c93;border-color:var(--color-primary);box-shadow:0 0 0 3px #6a4c9333;outline:none}.form-group textarea{min-height:100px;resize:vertical}.card-examples{grid-gap:24px;grid-gap:var(--spacing-lg);display:grid;gap:24px;gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.card{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:12px;border-radius:var(--radius-lg);overflow:hidden;transition:all .3s ease;transition:all var(--transition-normal)}.card-interactive:hover{border-color:#6a4c93;border-color:var(--color-primary);box-shadow:0 0 20px #6a4c934d;box-shadow:var(--shadow-purple);transform:translateY(-4px)}.card-header{background:linear-gradient(135deg,#1a1a1a,#2a2a2a);background:linear-gradient(135deg,var(--color-bg-secondary) 0,var(--color-bg-tertiary) 100%);border-bottom:1px solid #5a3d73;border-bottom:1px solid var(--color-border);padding:24px;padding:var(--spacing-lg)}.card-header h4{color:#e0e0e0;color:var(--color-text-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.3rem}.card-body{padding:24px;padding:var(--spacing-lg)}.card-body p{color:#b0b0b0;color:var(--color-text-secondary);margin-bottom:16px;margin-bottom:var(--spacing-md)}.sample-nav{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);padding:16px;padding:var(--spacing-md)}.sample-nav ul{display:flex;flex-wrap:wrap;gap:16px;gap:var(--spacing-md);list-style:none}.sample-nav a{border-radius:4px;border-radius:var(--radius-sm);color:#b0b0b0;color:var(--color-text-secondary);display:block;font-weight:500;padding:16px 24px;padding:var(--spacing-md) var(--spacing-lg);text-decoration:none;transition:all .3s ease;transition:all var(--transition-normal)}.sample-nav a:hover{background-color:#6a4c931a;color:#8b5a96;color:var(--color-primary-light);transform:translateY(-2px)}.sample-nav a.active{background:linear-gradient(135deg,#6a4c93,#8b5a96);background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-light) 100%);box-shadow:0 0 10px #6a4c934d;color:#fff}.layout-examples{grid-gap:32px;grid-gap:var(--spacing-xl);display:grid;gap:32px;gap:var(--spacing-xl)}.layout-sample h4{color:#e0e0e0;color:var(--color-text-primary);font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.3rem;margin-bottom:16px;margin-bottom:var(--spacing-md)}.layout-demo{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:2px solid #5a3d73;border:2px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);overflow:hidden}.chat-layout{display:grid;grid-template-rows:60px 1fr 80px;height:300px}.chat-header,.chat-input{align-items:center;background-color:#2a2a2a;background-color:var(--color-bg-tertiary);border-bottom:1px solid #5a3d73;border-bottom:1px solid var(--color-border);color:#b0b0b0;color:var(--color-text-secondary);display:flex;padding:16px;padding:var(--spacing-md)}.chat-input{border-bottom:none;border-top:1px solid #5a3d73;border-top:1px solid var(--color-border)}.chat-messages{align-items:center;color:#888;color:var(--color-text-muted);display:flex;justify-content:center;padding:16px;padding:var(--spacing-md)}.dashboard-layout{display:grid;grid-template-columns:200px 1fr;height:250px}.dashboard-sidebar{background-color:#2a2a2a;background-color:var(--color-bg-tertiary);border-right:1px solid #5a3d73;border-right:1px solid var(--color-border);color:#b0b0b0;color:var(--color-text-secondary)}.dashboard-main,.dashboard-sidebar{padding:16px;padding:var(--spacing-md)}.dashboard-main{align-items:center;color:#888;color:var(--color-text-muted);display:flex;justify-content:center}.code-example{background-color:#1a1a1a;background-color:var(--color-bg-secondary);border:1px solid #5a3d73;border:1px solid var(--color-border);border-radius:8px;border-radius:var(--radius-md);overflow:hidden}.code-example pre{background-color:#2a2a2a;background-color:var(--color-bg-tertiary);font-family:Space Mono,monospace;font-family:var(--font-code);font-size:.9rem;line-height:1.5;margin:0;overflow-x:auto;padding:24px;padding:var(--spacing-lg)}.code-example code{color:#e0e0e0;color:var(--color-text-primary)}.mui-examples{margin-bottom:32px;margin-bottom:var(--spacing-xl)}.mui-examples h3{align-items:center;color:#e0e0e0;color:var(--color-text-primary);display:flex;font-family:Space Mono,monospace;font-family:var(--font-heading);font-size:1.5rem;gap:16px;gap:var(--spacing-md)}.mui-container,.mui-examples h3{margin-bottom:24px;margin-bottom:var(--spacing-lg)}.mui-container{background-color:#000;background-color:var(--color-bg-primary);border-radius:8px;border-radius:var(--radius-md);overflow:hidden}.mui-container .MuiCssBaseline-root{background-color:#000!important;background-color:var(--color-bg-primary)!important}@media (max-width:768px){.sg-title{font-size:2rem}.sg-nav ul{align-items:center;flex-direction:column}.color-row{grid-template-columns:1fr}.component-grid{flex-direction:column}.card-examples{grid-template-columns:1fr}.sample-nav ul{flex-direction:column}.dashboard-layout{grid-template-columns:1fr;grid-template-rows:60px 1fr}.sg-main{padding:24px 16px;padding:var(--spacing-lg) var(--spacing-md)}}@media (max-width:480px){.sg-title{font-size:1.5rem}.sample-h1,.sg-section h2{font-size:2rem}.sample-h2{font-size:1.8rem}}
/*# sourceMappingURL=main.f83b2a70.css.map*/