.terminal-container{height:600px;padding:16px;background:#1e1e1e;position:relative;overflow:hidden}.terminal-container canvas{display:block}@media(max-width:1024px){.terminal-container{height:500px}}@media(max-width:768px){.terminal-container{height:400px}}@media(max-height:800px){.terminal-container{height:calc(100vh - 200px);min-height:300px}}.logo{display:flex;height:1.5rem;width:auto;color:var(--fg, #B8D9FF);transition:opacity .2s ease}.logo:hover{opacity:.8}.github-badge{text-shadow:0 0 1px var(--bg, #0A1029);display:flex;align-items:center;gap:.35rem;padding:.25rem 0;cursor:pointer;text-decoration:none;font-size:.625rem;font-family:var(--font-mono);font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--fg-secondary, rgba(184, 217, 255, .72));transition:color .2s ease}.github-badge:hover{color:var(--fg, #B8D9FF)}.github-badge:hover .github-icon{color:var(--fg-secondary, rgba(184, 217, 255, .72))}.github-icon{color:var(--fg-tertiary, rgba(184, 217, 255, .32));display:flex;width:.85rem;aspect-ratio:98 / 96;filter:drop-shadow(0 0 2px var(--bg, #0A1029));transition:color .2s ease}.github-badge-text{color:var(--fg-secondary, rgba(184, 217, 255, .72));display:inline-grid}.github-badge-text:before{grid-area:1 / 1;content:attr(data-stars);opacity:1;transition:opacity .3s ease}.github-badge-text:after{grid-area:1 / 1;content:"github";opacity:0;transition:opacity .3s ease}.github-badge:hover .github-badge-text:before{opacity:0}.github-badge:hover .github-badge-text:after{opacity:1}.hatchet-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font-size:.75rem;font-family:var(--font-judge-extended);font-weight:400;text-transform:uppercase;letter-spacing:.07em;position:relative;display:inline-flex;gap:.75rem;align-items:center;padding:0 .75rem;min-height:2rem;color:var(--fg);white-space:nowrap;cursor:pointer;background-color:var(--fg-border);border-radius:.25rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:all .2s ease}.hatchet-button:hover{box-shadow:0 0 0 1px var(--fg) inset;background-color:var(--fg);color:var(--bg)}.button-icon{width:2rem;height:2rem;background-color:var(--fg);border-radius:.25rem;transition:all .2s ease;display:flex;align-items:center;justify-content:center;position:relative}.button-icon:after{content:"";width:0;height:0;border-style:solid;border-width:4px 0 4px 6px;border-color:transparent transparent transparent var(--bg);position:absolute}.hatchet-button.external-icon .button-icon:after{width:10px;height:10px;border:none;border-top:2px solid var(--bg);border-right:2px solid var(--bg);transform:rotate(45deg);margin-bottom:-2px}.hatchet-button:hover .button-icon{border-radius:0}.hatchet-button:hover .button-icon:after{border-left-color:var(--fg)}.hatchet-button.external-icon:hover .button-icon:after{border-top-color:var(--fg);border-right-color:var(--fg);border-left-color:transparent}.button-content{flex:1}.hatchet-button.secondary{background-color:transparent}.hatchet-button.secondary .button-icon{background-color:var(--fg-tertiary)}.hatchet-button.secondary:hover{background-color:var(--fg-border);color:var(--fg);box-shadow:none}.hatchet-button.secondary:hover .button-icon{background-color:var(--fg-secondary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0a1029e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-container{background:var(--bg);border:1px solid var(--fg-border);border-radius:.5rem;max-width:800px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 2rem;border-bottom:1px solid var(--fg-border);background:var(--bg-dark)}.modal-title{font-family:var(--font-judge-extended);font-size:1.125rem;font-weight:400;text-transform:uppercase;letter-spacing:.07em;color:var(--fg);margin:0}.modal-close{background:none;border:none;color:var(--fg-secondary);font-size:2rem;line-height:1;cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;transition:color .2s ease;border-radius:.25rem}.modal-close:hover{color:var(--fg);background:var(--fg-border)}.modal-content{padding:2rem;overflow-y:auto;flex:1}.modal-content h1,.modal-content h2,.modal-content h3{color:var(--fg);margin:1.5rem 0 1rem;font-family:var(--font-judge-extended)}.modal-content h1{font-size:1.75rem;font-weight:500}.modal-content h2{font-size:1.5rem;font-weight:500}.modal-content h3{font-size:1.25rem;font-weight:500}.modal-content h1:first-child,.modal-content h2:first-child,.modal-content h3:first-child{margin-top:0}.modal-content p{color:var(--fg-secondary);line-height:1.8;margin:0 0 1rem}.modal-content pre{background:var(--bg-dark);border:1px solid var(--fg-border);border-radius:.25rem;padding:1rem;overflow-x:auto;margin:1rem 0}.modal-content code{font-family:var(--font-mono);font-size:.875rem;color:var(--fg-dark)}.modal-content p code{background:var(--bg-dark);border:1px solid var(--fg-border);border-radius:.25rem;padding:.125rem .375rem;font-size:.875rem}.modal-content ul,.modal-content ol{color:var(--fg-secondary);line-height:1.8;margin:0 0 1rem;padding-left:1.5rem}.modal-content li{margin-bottom:.5rem}.modal-content a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent);transition:color .2s ease}.modal-content a:hover{color:var(--accent-1);border-bottom-color:var(--accent-1)}@media(max-width:768px){.modal-overlay{padding:10px}.modal-header{padding:1rem 1.5rem}.modal-content{padding:1.5rem}}.page-header{width:100%;position:relative;z-index:2}.header-content{padding:16px 0;display:flex;align-items:center;justify-content:space-between}.logo-wrapper{display:flex;align-items:center;gap:1.5rem}.logo-link{display:flex;align-items:center;text-decoration:none;transition:opacity .2s ease}.logo-link:hover{opacity:.8}.header-buttons{display:flex;align-items:center;gap:.75rem}.button-link{text-decoration:none;display:flex;align-items:center}@media(max-width:768px){.header-content{padding:12px 0;flex-wrap:wrap;gap:1rem}.logo-wrapper{gap:1rem}.header-buttons{flex-direction:column;width:100%;gap:.5rem}}.mobile-warning{position:relative;z-index:3;width:100%;animation:slideDown .3s ease}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.mobile-warning-content{background:linear-gradient(135deg,var(--accent-2) 0%,var(--accent) 100%);color:var(--bg);padding:1rem 1.5rem;display:flex;align-items:flex-start;gap:1rem;border-radius:.5rem;border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #0000004d;margin-bottom:1rem}.mobile-warning-icon{font-size:1.5rem;flex-shrink:0}.mobile-warning-text{flex:1}.mobile-warning-text strong{display:block;font-family:var(--font-judge-extended);font-size:.875rem;text-transform:uppercase;letter-spacing:.07em;margin-bottom:.25rem;font-weight:400}.mobile-warning-text p{margin:0;font-family:var(--font-martina);font-size:.875rem;line-height:1.5;opacity:.95}.mobile-warning-close{background:none;border:none;color:var(--bg);font-size:1.75rem;line-height:1;cursor:pointer;padding:0;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;transition:opacity .2s ease;flex-shrink:0;border-radius:.25rem;opacity:.8}.mobile-warning-close:hover{opacity:1;background:#0000001a}@media(max-width:768px){.mobile-warning-content{padding:.875rem 1rem;gap:.75rem}.mobile-warning-icon{font-size:1.25rem}.mobile-warning-text strong{font-size:.75rem}.mobile-warning-text p{font-size:.8125rem}}.terminal-window{width:100%;background:var(--bg-dark);border-radius:12px;box-shadow:0 20px 60px #00000080;overflow:hidden;border:1px solid var(--fg-border)}.title-bar{background:var(--bg);padding:12px 16px;display:flex;align-items:center;gap:12px;border-bottom:1.5px solid var(--fg-border)}.traffic-lights{display:flex;gap:8px}.light{width:12px;height:12px;border-radius:50%}.light.red{background:#ff5f56}.light.yellow{background:#ffbd2e}.light.green{background:#27c93f}.title{color:var(--fg);font-size:13px;font-weight:500;letter-spacing:.3px}.connection-status{margin-left:auto;font-size:.625rem;font-family:var(--font-judge-extended);text-transform:uppercase;letter-spacing:.07em;color:var(--fg-tertiary);display:flex;align-items:center;gap:6px}.connection-dot{width:6px;height:6px;border-radius:50%;background:var(--fg-border)}.connection-dot.connected{background:var(--accent-2);box-shadow:0 0 4px var(--accent-2)}@media(max-width:768px){.title-bar{padding:10px 12px}.title{font-size:12px}}@font-face{font-family:martina;font-weight:400;font-display:swap;src:url(/assets/martina-plantijn-regular-PIaiYXRe.woff2) format("woff2")}@font-face{font-family:martina;font-weight:400;font-style:italic;font-display:swap;src:url(/assets/martina-plantijn-italic-B3zz0-Em.woff2) format("woff2")}@font-face{font-family:judge-extended;font-weight:400;font-display:swap;src:url(/assets/F37Judge-MediumExtended-CstOIriy.woff2) format("woff2");ascent-override:105%;descent-override:35%}@font-face{font-family:judge;font-weight:400;font-display:swap;src:url(/assets/F37Judge-Regular-CJZCMfdq.woff2) format("woff2")}@font-face{font-family:dm-mono;font-weight:400;font-display:swap;src:url(/assets/dm-mono-regular-4GdczIuU.woff2) format("woff2")}@font-face{font-family:dm-mono;font-weight:400;font-style:italic;font-display:swap;src:url(/assets/dm-mono-regular-italic-BtO4nDW5.woff2) format("woff2")}@font-face{font-family:dm-mono;font-weight:500;font-display:swap;src:url(/assets/dm-mono-medium-DRMDZjhP.woff2) format("woff2")}@font-face{font-family:dm-mono;font-weight:500;font-style:italic;font-display:swap;src:url(/assets/dm-mono-medium-italic-vWA_G4sR.woff2) format("woff2")}:root{--font-martina: "martina", serif;--font-judge-extended: "judge-extended", sans-serif;--font-judge: "judge", sans-serif;--font-mono: "dm-mono", monospace;--navy: 228 61% 10%;--cyan: 212 100% 86%;--navy-dark: 227 88% 6%;--cyan-dark: 212 60% 78%;--blue: 212 100% 60%;--magenta: 287 69% 57%;--yellow: 69 77% 47%;--bg: hsl(var(--navy));--fg: hsl(var(--cyan));--bg-dark: hsl(var(--navy-dark));--fg-dark: hsl(var(--cyan-dark));--accent: hsl(var(--blue));--accent-1: hsl(var(--magenta));--accent-2: hsl(var(--yellow));--opacity-1: .04;--opacity-2: .08;--opacity-3: .14;--opacity-4: .18;--opacity-5: .32;--opacity-6: .56;--opacity-7: .64;--opacity-8: .72;--opacity-9: .88;--fg-secondary: hsl(var(--cyan) / var(--opacity-8));--fg-tertiary: hsl(var(--cyan) / var(--opacity-5));--fg-border: hsl(var(--cyan) / var(--opacity-2));--bg-secondary: hsl(var(--navy) / var(--opacity-8));--bg-tertiary: hsl(var(--navy) / var(--opacity-5));--bg-border: hsl(var(--navy) / var(--opacity-2))}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-martina);background:var(--bg);color:var(--fg);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;pointer-events:none;top:0;left:0;width:100%;height:100%;z-index:0;background-color:var(--fg-border);--gridSize: 1rem;--n: 4;--t: 1.5px;--g: 2px;--c: #fff7 25%, #0000 0;-webkit-mask-image:linear-gradient(to bottom,white 0%,white 70%,transparent 100%),conic-gradient(at var(--g) var(--t),var(--c)),conic-gradient(from 180deg at var(--t) var(--g),var(--c));mask-image:linear-gradient(to bottom,white 0%,white 70%,transparent 100%),conic-gradient(at var(--g) var(--t),var(--c)),conic-gradient(from 180deg at var(--t) var(--g),var(--c));-webkit-mask-position:0 0,calc((var(--gridSize) / var(--n) - var(--g) + var(--t)) / 2) 0,calc((var(--gridSize) / var(--n) - var(--g) + var(--t)) / 2);mask-position:0 0,calc((var(--gridSize) / var(--n) - var(--g) + var(--t)) / 2) 0,calc((var(--gridSize) / var(--n) - var(--g) + var(--t)) / 2);-webkit-mask-size:100% 100%,calc(var(--gridSize) / var(--n)) var(--gridSize),var(--gridSize) calc(var(--gridSize) / var(--n));mask-size:100% 100%,calc(var(--gridSize) / var(--n)) var(--gridSize),var(--gridSize) calc(var(--gridSize) / var(--n));-webkit-mask-composite:source-in,source-over,source-out;mask-composite:intersect,add,subtract}#root{width:100%;max-width:1000px;position:relative;z-index:1;display:flex;flex-direction:column;gap:20px}@media(max-width:1200px){#root{max-width:90vw}}@media(max-width:768px){#root{max-width:95vw}}@media(max-width:768px){body{padding:20px 10px}}