*{box-sizing:border-box;margin:0;padding:0}body{background:#000;justify-content:center;align-items:center;min-height:100vh;padding:20px;font-family:Fira Code,Courier New,monospace;display:flex;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#4ade8014 1px,#0000 1px),linear-gradient(90deg,#4ade8014 1px,#0000 1px);background-size:50px 50px;position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(#4ade801f 0%,#0000 70%);width:80%;height:80%;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#root{z-index:1;width:100%;position:relative}.app{width:100%;max-width:1200px;margin:0 auto}.terminal-container{border-radius:12px;width:100%;max-width:900px;margin:2rem auto;font-family:Fira Code,Courier New,monospace;transition:all .3s;overflow:hidden;box-shadow:0 20px 60px #00000080}.terminal-container:hover{transform:translateY(-4px);box-shadow:0 25px 70px #0009}.terminal-header{background:linear-gradient(#3a3a3a 0%,#2a2a2a 100%);border-bottom:1px solid #1a1a1a;align-items:center;gap:12px;padding:12px 16px;display:flex}.terminal-dots{gap:8px;display:flex}.dot{border-radius:50%;width:12px;height:12px;transition:opacity .2s}.dot:hover{opacity:.8}.dot.red{background:#ff5f56}.dot.yellow{background:#ffbd2e}.dot.green{background:#27c93f}.terminal-title{color:#999;text-align:center;flex:1;font-size:13px;font-weight:500}.terminal-body{cursor:text;min-height:400px;max-height:600px;padding:20px;position:relative;overflow-y:auto}.terminal-line{margin-bottom:8px;font-size:14px;line-height:1.6;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.terminal-line .prompt{color:#4ade80;font-weight:600}.terminal-line.output .content{color:#e4e4e7;white-space:pre-wrap}.terminal-line.input .content{color:#fbbf24}.terminal-line.error .content{color:#f87171}.input-line{align-items:center;display:flex}.input-text{color:#fbbf24}.cursor{color:#4ade80;margin-left:2px;animation:1s infinite blink}.cursor.visible{opacity:1}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.terminal-input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.terminal-body::-webkit-scrollbar{width:8px}.terminal-body::-webkit-scrollbar-track{background:0 0}.terminal-body::-webkit-scrollbar-thumb{background:#4ade80;border-radius:4px}.terminal-body::-webkit-scrollbar-thumb:hover{background:#22c55e}.terminal-container.light .terminal-header{background:linear-gradient(#e5e5e5 0%,#d4d4d4 100%);border-bottom:1px solid #a3a3a3}.terminal-container.light .terminal-title{color:#525252}.terminal-container.light .terminal-body{background:#fafafa}.terminal-container.light .terminal-line .prompt{color:#16a34a}.terminal-container.light .terminal-line.output .content{color:#262626}.terminal-container.light .terminal-line.input .content,.terminal-container.light .input-text{color:#ca8a04}.terminal-container.light .terminal-line.error .content{color:#dc2626}.terminal-container.light .cursor{color:#16a34a}.terminal-container.dark .terminal-body{background:linear-gradient(135deg,#1a1a1a 0%,#0f0f0f 100%)}.terminal-container.dark .terminal-body:before{content:"";pointer-events:none;background:radial-gradient(circle at 20% 30%,#4ade8008 0%,#0000 50%),radial-gradient(circle at 80% 70%,#4ade8005 0%,#0000 50%);animation:15s ease-in-out infinite glow;position:absolute;inset:0}@keyframes glow{0%,to{opacity:.5}50%{opacity:1}}@media (width<=768px){.terminal-container{border-radius:8px;margin:1rem}.terminal-body{min-height:300px;max-height:500px;padding:16px;font-size:13px}.terminal-line{font-size:13px}}@media (prefers-reduced-motion:reduce){.terminal-container,.terminal-line,.cursor,.terminal-body:before{transition:none;animation:none}}.terminal-container:focus-within{outline-offset:4px;outline:2px solid #4ade80}