:root{--matrix-green:#00ff41;--matrix-green-glow:#00ff4166;--deep-black:#000;--dark-grey:#1a1a1a;--terminal-font:"JetBrains Mono", "Courier New", Courier, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--deep-black);color:var(--matrix-green);font-family:var(--terminal-font);overflow-x:hidden}.crt-container{width:100vw;height:100vh;position:relative;overflow:hidden}.crt-overlay{pointer-events:none;z-index:1000;background:linear-gradient(#12101000 50%,#00000040 50%) 0 0/100% 4px,linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f) 0 0/3px 100%;width:100%;height:100%;position:fixed;top:0;left:0}.crt-vignette{pointer-events:none;z-index:1001;background:radial-gradient(circle,#0000 50%,#000c 100%);width:100%;height:100%;position:fixed;top:0;left:0}@keyframes flicker{0%{opacity:.993}5%{opacity:.985}10%{opacity:.993}15%{opacity:.985}20%{opacity:.993}25%{opacity:.985}30%{opacity:.993}35%{opacity:.985}40%{opacity:.993}45%{opacity:.985}50%{opacity:.993}55%{opacity:.985}60%{opacity:.993}65%{opacity:.985}70%{opacity:.993}75%{opacity:.985}80%{opacity:.993}85%{opacity:.985}90%{opacity:.993}95%{opacity:.985}to{opacity:.993}}.crt-flicker{animation:.1s infinite flicker}.matrix-rain{z-index:-1;opacity:.3;width:100%;height:100%;position:absolute;top:0;left:0}.bento-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1200px;margin:0 auto;padding:4rem;display:grid}.card{border:1px solid var(--matrix-green);box-shadow:0 0 10px var(--matrix-green-glow);background:#00ff410d;border-radius:4px;padding:1.5rem;transition:all .3s;position:relative;overflow:hidden}.card:hover{box-shadow:0 0 20px var(--matrix-green-glow);background:#00ff411a;transform:translateY(-5px)}.card:before{content:"";background:var(--matrix-green);width:100%;height:2px;animation:3s linear infinite scanning;position:absolute;top:0;left:-100%}@keyframes scanning{0%{left:-100%}to{left:100%}}.terminal-header{text-align:center;text-transform:uppercase;letter-spacing:.5rem;text-shadow:0 0 10px var(--matrix-green);padding:2rem}.glitch-text{font-size:3.5rem;display:inline-block;position:relative}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}.glitch-text:hover{animation:.2s infinite glitch}.terminal-nav{justify-content:center;gap:2rem;margin-top:1rem;display:flex}.terminal-nav a,.terminal-nav span{color:var(--matrix-green);cursor:pointer;border:1px solid #0000;padding:.5rem 1rem;font-weight:700;text-decoration:none;transition:all .3s}.terminal-nav a:hover,.terminal-nav a.active,.terminal-nav span:hover{background:var(--matrix-green);color:var(--deep-black);box-shadow:0 0 15px var(--matrix-green)}.file-list,.tutorial-list{list-style:none}.file-item,.tutorial-item{border-bottom:1px solid #00ff4133;margin-bottom:1rem;padding:1rem}.file-name{font-size:1.2rem;font-weight:700}.file-meta{opacity:.7;margin-top:.5rem;font-size:.8rem}h2{border-left:4px solid var(--matrix-green);margin-bottom:1.5rem;padding-left:1rem}.terminal-input{border:1px solid var(--matrix-green);color:var(--matrix-green);background:#000c;outline:none;padding:.8rem;font-family:inherit}.terminal-input:focus{box-shadow:0 0 5px var(--matrix-green)}.terminal-button{background:var(--matrix-green);color:var(--deep-black);cursor:pointer;text-transform:uppercase;border:none;padding:1rem;font-family:inherit;font-weight:700;transition:all .2s}.terminal-button:hover{background:#fff;box-shadow:0 0 10px #fff}.page-content{animation:.5s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#root{max-width:100vw;margin:0 auto}.logo{will-change:filter;height:6em;padding:1.5em;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:20s linear infinite logo-spin}}.read-the-docs{color:#888}