*{box-sizing:border-box;margin:0;padding:0}:root{--bg-app:#274c43;--bg-panel:#17332d;--bg-card:#0b1f1b;--text:#e5e7eb;--muted:#9ca3af;--grid:#1f2933;--chalk:#f9fafb;--yellow:#facc15;--pink:#fb7185;--cyan:#22d3ee;--green:#6ee7b7}body{color:var(--text);background:#0b1f1b;height:100vh;font-family:monospace;overflow:hidden}.layout{gap:8px;height:100vh;padding:44px 8px 20px;display:flex;overflow:hidden}.boards{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex;overflow:visible}.panels{background:#0b1f1b;flex:1;align-items:stretch;gap:16px;min-height:0;padding:12px 12px 0;display:flex;overflow:visible}.flow-arrow{flex-shrink:0;justify-content:center;align-items:center;width:36px;display:flex}.seq-panel{flex-direction:column;flex-shrink:0;gap:8px;width:188px;padding:4px 0;display:flex}.panels canvas{background-color:#274c43;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.03 0.05' numOctaves='6' seed='5' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeBlend in='SourceGraphic' mode='screen'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)' opacity='0.03'/%3E%3C/svg%3E"),radial-gradient(at 55% 45%,#2e6b52 0%,#274c43 45%,#1a3530 100%);background-size:cover;flex:1;min-width:0;min-height:200px;display:block;box-shadow:0 0 0 3px #5a3a1a,0 0 0 9px #7a4e28,0 0 0 11px #3d2510,0 6px 24px #0009}.grid-input{gap:8px;display:flex}.grid-input label{color:var(--muted);align-items:center;gap:4px;font-size:.85rem;display:flex}.grid-input input{color:#f9fafb;background:#0000004d;border:1px solid #fff3;border-radius:3px;width:48px;padding:3px 6px;font-family:monospace;font-size:.85rem}.grid-input input:focus{border-color:var(--yellow);color:var(--yellow);outline:none}.seq-label{text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-size:.7rem}.seq-top{justify-content:space-between;align-items:center;display:flex}#seq{color:var(--chalk);resize:none;background:#0000004d;border:1px solid #ffffff26;border-radius:4px;flex:1;min-height:0;padding:8px;font-family:monospace;font-size:.75rem}#btn-copy{color:var(--muted);cursor:pointer;background:#0000004d;border:1px solid #fff3;border-radius:3px;padding:4px 8px;font-family:monospace;font-size:.75rem;transition:color .15s,border-color .15s}#btn-copy:hover{color:var(--yellow);border-color:var(--yellow)}#btn-copy.copied{color:var(--green);border-color:var(--green)}