/* PANDA DUO — tema claro. Só muda a "moldura" do app (página, topo, abas, painéis, mixer).
   O pedal vermelho, os pedais de efeito, knobs, visores e medidores continuam como objetos reais. */
html.light {
  --bg: #eceef2; --panel: #ffffff; --panel2: #f3f4f7; --line: #cfd3db; --txt: #1d2027; --dim: #5d6370;
  --play: #13a148; --rec: #d92a1f; --dub: #c98a00; --stop: #2f6fe0; --accent: #e0560c;
  color-scheme: light;
}
html.light body { background: var(--bg); color: var(--txt); }
html.light .topbar { background: #fff; border-bottom-color: var(--line); box-shadow: 0 1px 6px #0001; }
html.light .pill { background: var(--panel2); }
html.light .pill.ok { border-color: #8fd3a8; }
html.light .pill.bad { border-color: #f0a7a2; }
html.light .pill.remote { color: #1f6fb5; border-color: #9cc6ea; }
html.light .sq:hover, html.light .btn:hover { border-color: #9aa0ab; }
html.light .sel, html.light select, html.light input[type=number], html.light input:not([type]), html.light input[type=email], html.light input[type=password] { background-color: #fff; color: var(--txt); border-color: var(--line); }
html.light fieldset label { color: #3b404b; }
html.light .toast { background: #fff; color: var(--txt); box-shadow: 0 6px 20px #0002; }
html.light .overlay { background: #e9ebf0e6; }
html.light .card { box-shadow: 0 20px 50px #0002; }
html.light .auth input { background: #fff; }
html.light .gbtn { border-color: var(--line); }
html.light .memitem.cur { color: var(--accent); }

/* rack */
html.light .rack { background: linear-gradient(#fafbfc, #eef0f3); border-color: var(--line); box-shadow: 0 14px 34px #0002, inset 0 1px 0 #fff; }
html.light .rack .tabs { background: #e4e7ec; border-bottom-color: var(--line); }
html.light .rack .tabs button { background: linear-gradient(#ffffff, #eef0f3); border-color: var(--line); color: #3b404b; box-shadow: 0 2px 0 #c3c8d1; }
html.light .rack .tabs button:hover { color: #000; }
html.light .rack .tabs button.on { background: linear-gradient(#e83a2e, #b51d14); border-color: #ff6a5a; color: #fff; box-shadow: 0 2px 0 #8a1a12; }
html.light .rack select, html.light .rack input[type=number], html.light .rack input:not([type]) { background-color: #fff; color: var(--txt); border-color: var(--line); }
html.light .rack .btn { background: linear-gradient(#ffffff, #eceef2); border-color: var(--line); color: var(--txt); box-shadow: 0 2px 0 #c3c8d1; }
html.light .rack .btn.accent { background: linear-gradient(#e83a2e, #b51d14); border-color: #ff6a5a; color: #fff; }
html.light .rack fieldset { background: #fff; border-color: var(--line); }
html.light .racktoggle { background: #e4e7ec; color: #5d6370; border-bottom-color: var(--line); }
html.light .racktoggle:hover { background: #dcdfe5; color: #1d2027; }

/* pedaleira (fundo; os pedais ficam iguais) */
html.light .pb-chs { border-bottom-color: #0000000c; }
html.light .pb-ch { background: none; color: #8a8f99; }
html.light .pb-ch:hover { color: #4a4f59; }
html.light .pb-ch.on { color: #121212; }
html.light .pb-ch i { filter: brightness(.8); }
html.light .pb-bar { background: #fff; border-color: var(--line); }
html.light .pb-btn { background: linear-gradient(#ffffff, #eceef2); border-color: var(--line); color: var(--txt); box-shadow: 0 2px 0 #c3c8d1; }
html.light .pb-btn.on { background: #ffd21a; color: #1a1300; border-color: #e0b800; }
html.light .board { background: repeating-linear-gradient(90deg, #d9dce2 0 2px, #e3e6eb 2px 6px), #e3e6eb; border-color: var(--line); }
html.light .pedal-unit.empty { border-color: #b6bbc5; color: var(--dim); }

/* mixer: console clara, knobs e faders continuam de "metal" */
html.light .mixer { background: #e3e6eb; border-color: var(--line); }
html.light .strip { background: linear-gradient(#fbfbfc, #eceef2); border-color: var(--line); color: var(--txt); }
html.light .strip.master { background: linear-gradient(#fff4f2, #f6e3df); border-color: #e7b9b1; }
html.light .strip.ret { background: linear-gradient(#f2fafb, #e3eef0); }
html.light .slot { background: #fff; border-color: var(--line); color: #3b404b; }
html.light .slot.on { background: #e9f8ee; border-color: #8fd3a8; color: #0f5a2a; }
html.light .byp, html.light .pre, html.light .recon { background: #fff; border-color: var(--line); color: #5d6370; }
html.light .ms button { background: linear-gradient(#ffffff, #eceef2); border-color: var(--line); color: #3b404b; box-shadow: 0 2px 0 #c3c8d1; }
html.light .ms .mute.on { background: #e83a2e; border-color: #ff6a5a; color: #fff; }
html.light .ms .solo.on { background: #ffd21a; border-color: #e0b800; color: #1a1300; }
html.light .fadwrap { background: #d9dce2; border-color: #c3c8d1; }
html.light .grbar { background: #d9dce2; border-color: #c3c8d1; }
html.light .fx-unit { background: linear-gradient(#ffffff, #eef0f3); border-color: var(--line); color: var(--txt); box-shadow: 0 8px 20px #0002; }
html.light .fxon { background: linear-gradient(#ffffff, #eceef2); border-color: var(--line); color: #3b404b; box-shadow: 0 3px 0 #c3c8d1; }
html.light .fx-move button { background: #fff; border-color: var(--line); color: var(--txt); }

/* controle MIDI e memórias */
html.light .swcard { background: linear-gradient(#ffffff, #f1f2f5); border-color: var(--line); }
html.light .sw-learn { background: linear-gradient(#ffffff, #eceef2); border-color: var(--line); color: var(--txt); }
html.light .sw-msg.none { background: #e4e7ec; color: #7a808c; }
html.light .memitem:not(.used) { background: #fff; border-color: var(--line); color: #5d6370; }

html.light .strip .mk-val, html.light .strip .db, html.light .fx-unit .mk-val, html.light .fx-sel { color: #1d2027; }
html.light .rack.min .racktoggle { color: #1d2027; }
html.light .board { box-shadow: inset 0 4px 12px #0002; }

/* botão de tema */
.themebtn { cursor: pointer; font-weight: 700; }
.themebtn:hover { color: var(--txt); }
#themeBtn { position: relative; z-index: 11; }
