.fx-page{box-sizing:border-box;height:calc(100svh - 65px);padding:10px var(--gutter)12px;flex-direction:column;max-width:1200px;margin:0 auto;display:flex}.fx-head{flex-wrap:wrap;align-items:baseline;gap:20px;margin-bottom:12px;display:flex}.fx-back{font-family:var(--font-mono-stack);letter-spacing:.18em;text-transform:uppercase;color:var(--mute);font-size:.75rem}.fx-back:hover{color:var(--accent)}.fx-title{letter-spacing:-.01em;font-size:clamp(1.25rem,1rem + 1.2vw,2rem);font-weight:400}.fx-dither{flex-direction:column;flex:1;gap:12px;min-height:0;display:flex}.fx-stage-wrap{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;container-type:size}.fx-stage{width:min(100cqw,calc(100cqh*var(--ar)));border:1px solid var(--line-strong);background:#050505;position:relative;overflow:hidden}.fx-skeleton{background:repeating-linear-gradient(90deg,#0d0d0d 0 2px,#111 2px 4px);animation:1.6s ease-in-out infinite fx-pulse;position:absolute;inset:0}@keyframes fx-pulse{50%{opacity:.6}}@media (prefers-reduced-motion:reduce){.fx-skeleton{animation:none}}.fx-live{font-family:var(--font-mono-stack);letter-spacing:.18em;text-transform:uppercase;color:var(--fg);pointer-events:none;background:#0a0a0a99;border-radius:999px;padding:4px 10px 4px 22px;font-size:.6875rem;position:absolute;top:12px;right:12px}.fx-live:before{content:"";background:#ff3b3b;border-radius:50%;width:6px;height:6px;margin-top:-3px;position:absolute;top:50%;left:10px}.fx-bar{flex-direction:column;flex:none;gap:12px;display:flex}.fx-label{font-family:var(--font-mono-stack);letter-spacing:.18em;text-transform:uppercase;color:var(--mute);font-size:.6875rem}.fx-groups{flex-direction:column;gap:14px;display:flex}.fx-group{flex-direction:column;gap:8px;display:flex}.fx-sub{flex-direction:column;gap:6px;min-width:0;display:flex}.fx-sub+.fx-sub{margin-top:6px}.fx-sublabel{font-family:var(--font-mono-stack);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);font-size:.625rem}.fx-chips{flex-wrap:wrap;gap:6px;display:flex}.fx-chip,.fx-tabs button,.fx-btn{font-family:var(--font-mono-stack);letter-spacing:.12em;text-transform:uppercase;min-height:44px;color:var(--soft);cursor:pointer;border:1px solid var(--line-strong);white-space:nowrap;background:0 0;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-size:.75rem;display:inline-flex}.fx-chip[aria-pressed=true],.fx-chip[data-pressed=true]{color:#0a0a0a;background:var(--fg);border-color:var(--fg)}.fx-chip:hover,.fx-btn:hover{color:var(--accent)}.fx-chip[aria-pressed=true]:hover{color:#0a0a0a}.fx-chip:focus-visible,.fx-btn:focus-visible,.fx-btn:focus-within,.fx-tabs button:focus-visible{outline:1px solid var(--accent);outline-offset:3px}.fx-map{grid-template-columns:repeat(10,1fr);gap:4px;width:100%;display:grid}.fx-map input{text-align:center;width:100%;min-width:30px;height:40px;font-family:var(--font-mono-stack);color:var(--fg);border:1px solid var(--line-strong);background:#f0f0f00a;font-size:1rem}.fx-map input:focus{outline:1px solid var(--accent);outline-offset:0}.fx-map input::placeholder{color:var(--mute)}.fx-swatch{border:1px solid #f0f0f059;border-radius:50%;flex:none;width:18px;height:18px}.fx-tabs{display:none}.fx-actions{flex-wrap:wrap;gap:8px;display:flex}.fx-btn:disabled{opacity:.6;cursor:progress}.fx-btn-primary{background:var(--accent);color:#0a0a0a;border-color:var(--accent)}.fx-btn-primary:hover{background:var(--fg);color:#0a0a0a}.fx-note{color:var(--mute);font-size:var(--text-micro)}.fx-btn-rec[aria-pressed=true]{color:#fff;background:#d92b2b;border-color:#d92b2b}.fx-btn-rec:before{content:"";background:#ff3b3b;border-radius:50%;width:8px;height:8px}.fx-btn-rec[aria-pressed=true]:before{background:#fff;animation:1s ease-in-out infinite fx-pulse}@media (max-width:999px){.fx-page{padding:6px 14px 10px}.fx-head{flex-wrap:nowrap;align-items:center;gap:12px;margin-bottom:8px}.fx-back{white-space:nowrap;font-size:.6875rem}.fx-title{white-space:nowrap;text-overflow:ellipsis;font-size:1.125rem;overflow:hidden}.fx-dither{gap:10px}.fx-bar{gap:8px}.fx-tabs{border-bottom:1px solid var(--line-strong);grid-auto-columns:1fr;grid-auto-flow:column;display:grid}.fx-tabs button{letter-spacing:.1em;min-height:40px;color:var(--mute);border:0;border-bottom:2px solid #0000;padding:0 2px;font-size:.6875rem}.fx-tabs button[aria-selected=true]{color:var(--fg);border-bottom-color:var(--accent)}.fx-groups{height:128px;overflow:hidden}.fx-group{gap:8px}.fx-group[data-active=false],.fx-group .fx-label{display:none}.fx-sub{flex-direction:row;align-items:center;gap:10px}.fx-sub+.fx-sub{margin-top:0}.fx-sublabel{flex:none;width:50px;font-size:.5625rem;line-height:1.2}.fx-chips{scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;flex:1;gap:6px;min-width:0;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 20px),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 20px),#0000)}.fx-chips::-webkit-scrollbar{display:none}.fx-chip{letter-spacing:.08em;flex:none;gap:6px;min-height:36px;padding:0 11px;font-size:.6875rem}.fx-swatch{width:14px;height:14px}.fx-map{flex:none;gap:3px;width:100%}.fx-map input{min-width:0;height:34px;font-size:.9375rem}.fx-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.fx-actions .fx-btn{letter-spacing:.1em;min-height:44px;padding:0 6px;font-size:.6875rem}.fx-note{white-space:nowrap;text-overflow:ellipsis;font-size:.6875rem;overflow:hidden}}@media (min-width:1000px){.fx-dither{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) 340px;gap:32px;display:grid}.fx-stage-wrap{height:100%}.fx-bar{gap:14px;min-height:0;max-height:100%}.fx-groups{scrollbar-width:thin;flex:1;min-height:0;padding-right:4px;overflow-y:auto}.fx-chip{min-height:38px;padding:0 12px}.fx-actions .fx-btn{flex:calc(50% - 4px)}}
