.flex-controls-row{display:flex;flex-wrap:wrap;gap:.85rem 1.25rem}.flex-control{display:flex;flex-direction:column;gap:.3rem;min-width:150px}.flex-control label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-sub);margin:0}.flex-control select{background-color:var(--bg-hover);border:1px solid var(--border);color:var(--text);border-radius:.35rem;padding:.35rem .5rem;font-size:.82rem}.flex-control select:focus{outline:none;border-color:var(--accent)}.flex-stage{padding:1.25rem;min-height:280px;overflow-x:auto}.flex-container{display:flex;min-height:230px;width:100%;border:1px dashed var(--border-lit);border-radius:.4rem;padding:12px;box-sizing:border-box;transition:gap .15s ease}.flex-box{display:flex;align-items:center;justify-content:center;width:64px;height:64px;flex-shrink:0;border-radius:.4rem;color:#fff;font-family:var(--mono, Consolas, monospace);font-weight:700;font-size:1.1rem;cursor:default;user-select:none;box-shadow:0 2px 6px #00000059;transition:transform .18s ease,box-shadow .15s ease,outline-color .1s ease;outline:2px solid transparent;outline-offset:2px}.flex-box:nth-child(1){background-color:#6c8aff}.flex-box:nth-child(2){background-color:#4ade80;color:#0a0d14}.flex-box:nth-child(3){background-color:#fbbf24;color:#0a0d14}.flex-box:nth-child(4){background-color:#f87171}.flex-box:nth-child(5){background-color:#c084fc}.flex-box:nth-child(6){background-color:#38bdf8;color:#0a0d14}.flex-output{border:1px solid var(--border);border-radius:.5rem;overflow:hidden}.flex-output .codebar{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem;background-color:var(--bg-hover);border-bottom:1px solid var(--border);font-family:var(--mono, Consolas, monospace);font-size:.72rem;color:var(--text-sub)}.flex-output pre.code-block{margin:0;border-radius:0}@media(max-width:575px){.flex-box{width:52px;height:52px;font-size:1rem}.flex-control{min-width:130px}}