/* GENERATED by tools/light/build.cjs from app.css, upgrade.css, brand.css, bar.css, mobile.css, plan.css, lang.css. Do not edit by hand: change the source and re-run.
   Light mode for the host desk and the phone remote. Every rule is scoped to html[data-mode="light"], so dark mode is untouched. */
:where(html[data-mode="light"]) .disp-btn{color:#ffffff}
:where(html[data-mode="light"]) .c-k{background:radial-gradient(circle at 35% 30%, #999999, #eeeeee)}
:where(html[data-mode="light"]) .ph{background:rgba(0,0,0,0.054)}
:where(html[data-mode="light"]) .clk-bl{color:#333333}
:where(html[data-mode="light"]) .clk-st.on{color:#448044}
:where(html[data-mode="light"]) .btn{color:#333333}
:where(html[data-mode="light"]) .btn.go{color:#ffffff}
:where(html[data-mode="light"]) .btn.sm{border-color:rgba(0,0,0,0.12)}
:where(html[data-mode="light"]) .btn.sm:hover{color:#333333}
:where(html[data-mode="light"]) .rb-cut-inp{background:rgba(0,0,0,0.102);color:#555555}
:where(html[data-mode="light"]) .rake-val{color:#9d6969 !important}
:where(html[data-mode="light"]) .price-inp{background:rgba(0,0,0,0.102);color:#555555}
:where(html[data-mode="light"]) .fv{color:#333333}
:where(html[data-mode="light"]) .prow{color:#757575}
:where(html[data-mode="light"]) .pct-inp{background:rgba(0,0,0,0.102);color:#555555}
:where(html[data-mode="light"]) .pv{color:#555555}
:where(html[data-mode="light"]) .warn{background:#ffede5;border:1px solid #ffd5b5;color:#b15800}
:where(html[data-mode="light"]) tr.out td{color:#5b7d5b}
:where(html[data-mode="light"]) tr.out .pn{color:#5b7d5b}
:where(html[data-mode="light"]) .pn{color:#333333}
:where(html[data-mode="light"]) .si{color:#448044}
:where(html[data-mode="light"]) .so{color:#bb5353}
:where(html[data-mode="light"]) .pos-out{color:#9e6464}
:where(html[data-mode="light"]) .sb2.rb{border-color:#b5d5b5;color:#448044}
:where(html[data-mode="light"]) .sb2.rb:hover{background:#e5f5e5}
:where(html[data-mode="light"]) .sb2.rb-rm{border-color:#ffefd5;color:#9c6d26}
:where(html[data-mode="light"]) .sb2.rb-rm:hover{background:#fff8f0;color:#976829}
:where(html[data-mode="light"]) .sb2.rb:disabled{border-color:#e1e7df;color:#94aa8d}
:where(html[data-mode="light"]) .sb2.ao{border-color:#ffefb5;color:#857400}
:where(html[data-mode="light"]) .sb2.ao:hover{background:#fffef0}
:where(html[data-mode="light"]) .sb2.ao:disabled{border-color:#fffde5;color:#b2a400}
:where(html[data-mode="light"]) .sb2.el{border-color:#e7c5c5;color:#b25656}
:where(html[data-mode="light"]) .sb2.el:hover{background:#f7f0f0}
:where(html[data-mode="light"]) .sb2.rs{border-color:#d5e5d5;color:#527f52}
:where(html[data-mode="light"]) .sb2.rs:hover{background:#edf5ed}
:where(html[data-mode="light"]) .srow{border-bottom:1px solid rgba(0,0,0,0.084);color:#5b7d5b}
:where(html[data-mode="light"]) .srow.brk{color:#488048}
:where(html[data-mode="light"]) .type-btn.to-ins{border-color:#a5b5e5;color:#5575b5}
:where(html[data-mode="light"]) .type-btn.to-ins:hover{color:#225285;border-color:#5575b5}
:where(html[data-mode="light"]) .type-btn.to-del{border-color:#e5b5b5;color:#b95858}
:where(html[data-mode="light"]) .type-btn.to-del:hover{color:#aa3333;border-color:#c57575}
:where(html[data-mode="light"]) .type-btn.to-brk{border-color:#b5d5b5;color:#488348}
:where(html[data-mode="light"]) .type-btn.to-brk:hover{color:#448344;border-color:#95c595}
:where(html[data-mode="light"]) .type-btn.to-rnd{border-color:#e7d7b5;color:#7f702c}
:where(html[data-mode="light"]) .type-btn.to-rnd:hover{color:#807525;border-color:#cfbf75}
:where(html[data-mode="light"]) .sched-lib-row{background:rgba(0,0,0,0.036)}
:where(html[data-mode="light"]) .sched-lib-sel{color:#333333}
:where(html[data-mode="light"]) .sinp{border-bottom:1px solid rgba(0,0,0,0.156);color:#555555}
:where(html[data-mode="light"]) .preset-modified-badge{color:#996600;background:rgba(255,195,75,0.15);border:1px solid rgba(255,195,75,0.3)}
:where(html[data-mode="light"]) .roster-rm{color:rgba(0,0,0,0.36)}
:where(html[data-mode="light"]) .roster-rm:hover{color:#aa0000}
:where(html[data-mode="light"]) .rm-btn{color:#a96262}
:where(html[data-mode="light"]) .rm-btn:hover{color:#ad5c5c}
:where(html[data-mode="light"]) .tsel.active{color:#ffffff}
:where(html[data-mode="light"]) .ft-control-banner{background:#fff9e5}
:where(html[data-mode="light"]) .ft-control-sub{color:#727272}
:where(html[data-mode="light"]) .seat-th{background:rgba(0,0,0,0.066)}
:where(html[data-mode="light"]) .seat-row{border-bottom:1px solid rgba(0,0,0,0.084)}
:where(html[data-mode="light"]) .seat-name{color:#333333}
:where(html[data-mode="light"]) .dealer-badge{background:radial-gradient(circle at 35% 30%, #000000, #333333);color:#747474;border:1px solid #666666}
:where(html[data-mode="light"]) .rebalance-alert{background:#fff9eb;border:1px solid #ffe7b5}
:where(html[data-mode="light"]) .rb-title{color:#996600}
:where(html[data-mode="light"]) .rb-move{color:#757575;border-bottom:1px solid rgba(0,0,0,0.084)}
:where(html[data-mode="light"]) .rb-move strong{color:#444444}
:where(html[data-mode="light"]) .rb-arrow{color:#966600}
:where(html[data-mode="light"]) .rb-balanced{color:#488048}
:where(html[data-mode="light"]) .stat-v{color:#555555}
:where(html[data-mode="light"]) .jmp-sel{color:#333333}
:where(html[data-mode="light"]) kbd{background:rgba(0,0,0,0.138)}
:where(html[data-mode="light"]) .preset-group-hd{background:rgba(0,0,0,0.057)}
:where(html[data-mode="light"]) .cpd{border:1.5px solid rgba(0,0,0,0.105)}
:where(html[data-mode="light"]) .cpd-active{outline:2px solid #000000}
:where(html[data-mode="light"]) .cpd-custom{border:1.5px dashed rgba(0,0,0,0.225)}
:where(html[data-mode="light"]) .modal-overlay{background:rgba(0,0,0,0.216)}
:where(html[data-mode="light"]) .modal-msg{color:#333333}
:where(html[data-mode="light"]) button:focus-visible,:where(html[data-mode="light"]) a:focus-visible,:where(html[data-mode="light"]) input:focus-visible,:where(html[data-mode="light"]) summary:focus-visible{outline:3px solid #004c86}
:where(html[data-mode="light"]) button{background:#bacbdf}
:where(html[data-mode="light"]) button:hover{background:#a4bad4}
:where(html[data-mode="light"]) input{background:#e3ebf6}
:where(html[data-mode="light"]) .beta{border:1px solid #ccb999}
:where(html[data-mode="light"]) .welcome-strip{background:#d6e1ef}
:where(html[data-mode="light"]) .tools-panel{background:#dfe8f4}
:where(html[data-mode="light"]) .file-button{background:#bacbdf}
:where(html[data-mode="light"]) dialog::backdrop{background:rgba(0,0,0,0.22)}
:where(html[data-mode="light"]) .account-page{background:radial-gradient(ellipse at top right,#b6c7de 0,transparent 55%),#e5ebf4}
:where(html[data-mode="light"]) .login-card,:where(html[data-mode="light"]) .remote-card{background:#dae3ef}
:where(html[data-mode="light"]) .login-card [type=submit]{color:#ffffff}
:where(html[data-mode="light"]) .builder-fields select{background:#e3ebf6}
:where(html[data-mode="light"]) .builder-warning{color:#704600}
:where(html[data-mode="light"]) #builder-apply{color:#ffffff}
:where(html[data-mode="light"]) .brand-description{color:#575143}
:where(html[data-mode="light"]) .welcome-strip{background:linear-gradient(110deg,#f0ede6,#e6e9ef);border-bottom:1px solid #e3dbcc}
:where(html[data-mode="light"]) .tools-panel{background:#ecedef}
:where(html[data-mode="light"]) .account-page{background:radial-gradient(ellipse at top right,#e8ddcb 0,transparent 55%),#eff1f4}
:where(html[data-mode="light"]) .login-card,:where(html[data-mode="light"]) .remote-card{background:#e8eaee;border-color:#daccb4}
:where(html[data-mode="light"]) .account-page button:not(.text-button):hover{border-color:#a77e29}
html:where([data-mode="light"])[data-theme=signature] .clk-t{color:#1a160d}
:where(html[data-mode="light"]) .completion-bar{background:var(--surface,#e6e9ed);border:1px solid #a77e29}
:where(html[data-mode="light"]) .device-volume select{background:#e3ebf6;color:#080d12;border:1px solid #aabccf}
:where(html[data-mode="light"]) .display-audio-toggle{background:rgba(0,0,0,0.18);border:1px solid rgba(0,0,0,0.315);color:#000000}
:where(html[data-mode="light"]) .display-audio-controls.phone:not(.collapsed){background:rgba(0,0,0,0.255)}
:where(html[data-mode="light"]) .mode-seg button[aria-pressed=true]{color:#ffffff}
:where(html[data-mode="light"]) .g32-toast{background:#bacbdf;color:#080d12;border:1px solid #a77e29}
@media (max-width:600px){:where(html[data-mode="light"]) .sinp{border:1px solid rgba(0,0,0,0.282);background:rgba(0,0,0,0.102);color:#222222}}
:where(html[data-mode="light"]) #account-plan{border:1px solid var(--line,#aabccf)}

/* ---- hand-written part (see tools/light/light-hand.css) ---- */
/* Fallback palette for pages that never run applyTheme (the phone remote). The desk sets the same variables inline. */
html[data-mode="light"]{color-scheme:light;--bg:#f5f2ea;--hd:#ffffff;--pn:#ffffff;--alt:#eee9dc;--bd:#d8d0bb;--tx:#1e1b14;--dm:#5c5646;--ac:#8a6414;--txd:#6b6555;
  --surface:#ffffff;--text:#1e1b14;--muted:#5c5646;--line:#d8d0bb;--gold:#8a6414}
html[data-mode="light"] body{background:var(--bg);color:var(--tx)}
html[data-mode="light"] .account-page{background:var(--bg);color:var(--text)}

/* The branded top bar stays dark in light mode: the G32 logo artwork has a dark background of its own. */
html[data-mode="light"] .account-bar{--surface:#10151b;--text:#edf2f7;--muted:#9fb0c3;--line:#304255;--gold:#f4ce72;background:#08090b;color:#edf2f7;border-bottom-color:#514126}
html[data-mode="light"] .account-bar a{color:#f4ce72}
html[data-mode="light"] .account-bar button,html[data-mode="light"] .account-bar .bar-btn{background:#203145;color:#edf2f7;border-color:#304255}
html[data-mode="light"] .account-bar #account-logout{background:transparent}
html[data-mode="light"] .account-bar #upgrade-soon{color:#edf2f7}
html[data-mode="light"] .account-bar .lang-sel{background:#09111c;color:#edf2f7;border-color:#304255}
html[data-mode="light"] .account-bar .beta{color:#f4ce72;border-color:#665333;background:transparent}
html[data-mode="light"] .account-bar .bar-who{border-color:#304255}
html[data-mode="light"] .account-bar #account-who{color:#edf2f7}
html[data-mode="light"] .account-bar #account-plan{color:#f4ce72;border-color:#304255;background:rgba(255,255,255,.03)}
html[data-mode="light"] .account-bar #sync-status{color:#9fb0c3}
html[data-mode="light"] .account-bar .brand-description{color:#bcb6a8}
html[data-mode="light"] .account-bar .bar-tools,html[data-mode="light"] .account-bar .bar-acct{border-left-color:#304255}

/* dialogs and the browser's own scrollbars follow the mode */
html[data-mode="light"] dialog::backdrop{background:rgba(30,27,20,.45)}

/* the logo artwork carries its own dark backdrop: sit it on a dark rounded plate instead of a dark blotch on light paper */
html[data-mode="light"] .remote-card .brand,html[data-mode="light"] .login-card .brand{display:inline-block;background:#08090b;border-radius:12px;padding:8px 14px 6px}
html[data-mode="light"] .remote-card .brand-description,html[data-mode="light"] .login-card .brand-description{color:#bcb6a8}