:root{--midnight-obsidian:#0b0d11;--cyber-emerald:#00f294;--lunar-quartz:#f3f4f6;--steel-ore:#4a5568;--crimson-alizarin:#ff3b30;--font-technical:"Fira Code", monospace;--font-narrative:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-narrative);background-color:var(--midnight-obsidian);color:var(--lunar-quartz);-webkit-font-smoothing:antialiased;line-height:1.6}.grid-container{grid-template-columns:repeat(12,1fr);gap:20px;max-width:1400px;margin:0 auto;padding:40px 20px;display:grid}.control-panel{border:1px solid var(--steel-ore);background:#0b0d11e6;border-radius:4px;padding:24px;position:relative;overflow:hidden}.control-panel:before{content:"";background:var(--steel-ore);width:100%;height:2px;position:absolute;top:0;left:0}.control-panel.active:before,.control-panel:hover:before{background:var(--cyber-emerald);box-shadow:0 0 10px var(--cyber-emerald);transition:all .3s}h1,h2,h3,h4{font-family:var(--font-narrative);color:var(--lunar-quartz);margin-bottom:1rem;font-weight:800}.technical-text{font-family:var(--font-technical);color:var(--cyber-emerald);font-size:.9rem}.secondary-text{color:var(--steel-ore);font-size:.9rem}a{color:var(--lunar-quartz);text-decoration:none;transition:color .3s}a:hover{color:var(--cyber-emerald);text-shadow:0 0 8px #00f29480}.primary-btn{color:var(--cyber-emerald);border:1px solid var(--cyber-emerald);font-family:var(--font-technical);text-transform:uppercase;letter-spacing:1px;cursor:pointer;background-color:#0000;padding:10px 24px;font-size:.85rem;transition:all .3s;display:inline-block}.primary-btn:hover{background-color:#00f2941a;box-shadow:0 0 15px #00f29466}table{border-collapse:collapse;width:100%;font-family:var(--font-technical);margin:20px 0;font-size:.9rem}th,td{border:1px solid var(--steel-ore);text-align:left;padding:12px 16px}th{color:var(--lunar-quartz);background-color:#4a556833}pre{border:1px solid var(--steel-ore);font-family:var(--font-technical);color:var(--cyber-emerald);background-color:#00000080;padding:16px;overflow-x:auto}.col-span-12{grid-column:span 12}.col-span-8{grid-column:span 8}.col-span-6{grid-column:span 6}.col-span-4{grid-column:span 4}.col-span-3{grid-column:span 3}@media (width<=768px){.grid-container{grid-template-columns:1fr}.col-span-12,.col-span-8,.col-span-6,.col-span-4,.col-span-3{grid-column:span 1}}