.theme-toggle{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid #dce5e0;border-radius:9px;background:#fff;color:#375348;font-size:18px;line-height:1;cursor:pointer}.theme-toggle:hover{border-color:#78aa92;background:#f2f8f5}
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"] body{background:#151917;color:#e7ece9}
html[data-theme="dark"] header,html[data-theme="dark"] .top{background:#1b211eee;border-color:#303a35}
html[data-theme="dark"] #stage{background-color:#151b18;background-image:radial-gradient(#496157 0.8px,transparent 0.8px)}
html[data-theme="dark"] .card,html[data-theme="dark"] .editor-card,html[data-theme="dark"] .node,html[data-theme="dark"] dialog,html[data-theme="dark"] .customer-dialog{background:#202723;border-color:#34413a;color:#e7ece9}
html[data-theme="dark"] .node.video .node-head,html[data-theme="dark"] .node.video .video-body,html[data-theme="dark"] .status{background:#202723;color:#dce5e0;border-color:#34413a}
html[data-theme="dark"] textarea,html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] .node.video .video-body textarea,html[data-theme="dark"] .node.video .options select{background:#29312d;color:#edf2ef;border-color:#415047}
html[data-theme="dark"] .top-nav,html[data-theme="dark"] .mode-switch{background:#111512}
html[data-theme="dark"] .top-nav a.active,html[data-theme="dark"] .mode-switch a.active{background:#313b36;color:#fff}
html[data-theme="dark"] footer,html[data-theme="dark"] .minimap,html[data-theme="dark"] .canvas-context-menu{background:#202723;border-color:#34413a;color:#dce5e0}
html[data-theme="dark"] .theme-toggle{background:#29312d;border-color:#435148;color:#f4d878}
html[data-theme="dark"] .autosave-status,html[data-theme="dark"] .canvas-save-status{background:#26302b;border-color:#3b4a42;color:#b9c7c0}
html[data-theme="dark"] .customer-account button,html[data-theme="dark"] header button,html[data-theme="dark"] header a{background:#242c28;border-color:#3a4740;color:#dbe5df}
/* Dark studio: keep helper copy and empty states readable against the charcoal cards. */
html[data-theme="dark"] .intro p,
html[data-theme="dark"] label.title,
html[data-theme="dark"] .upload p,
html[data-theme="dark"] .upload small,
html[data-theme="dark"] .counter,
html[data-theme="dark"] .status p,
html[data-theme="dark"] .pool,
html[data-theme="dark"] .ref-help{color:#c1cec7}
html[data-theme="dark"] .upload{background:#29332e;border-color:#8da99b;color:#edf4ef}
html[data-theme="dark"] .upload .plus{color:#69d6a6}
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] input::placeholder{color:#b5c2bb;opacity:1}
html[data-theme="dark"] .status{background:#29332e}
html[data-theme="dark"] .status h2{color:#f0f6f2}
html[data-theme="dark"] .status .icon{color:#74dbad}
html[data-theme="dark"] .ratio span{color:#c1cec7;border-color:#82988d}
html[data-theme="dark"] .ratio input:checked+span{color:#75e0b1;border-color:#75e0b1;background:#244738}
/* Language picker keeps strong contrast in dark mode; it is injected after page load. */
html[data-theme="dark"] .language-dialog{background:#202723;border-color:#46584e;color:#f1f6f3;box-shadow:0 24px 80px #0009}
html[data-theme="dark"] .language-dialog>p{color:#c3d0c9}
html[data-theme="dark"] .language-close{color:#f1f6f3}
html[data-theme="dark"] .language-grid button{background:#2c3832;border-color:#63786c;color:#f1f6f3}
html[data-theme="dark"] .language-grid button:hover,html[data-theme="dark"] .language-grid button:focus-visible{background:#24503d;border-color:#76d9aa;color:#fff;outline:2px solid #76d9aa;outline-offset:2px}

/* Customer profile/readability overrides.  Keep the modal surfaces and
   controls readable in dark mode, including the ledger and logout action. */
html[data-theme="dark"] .customer-dialog{background:#202923;color:#edf5f0;border-color:#3d4d43;box-shadow:0 24px 80px rgba(0,0,0,.5)}
html[data-theme="dark"] .customer-dialog::backdrop{background:rgba(3,10,7,.76)}
html[data-theme="dark"] .customer-dialog h2,html[data-theme="dark"] .customer-dialog h3,html[data-theme="dark"] .customer-dialog h4{color:#f3f8f5}
html[data-theme="dark"] .customer-dialog p{color:#bdcbc2}
html[data-theme="dark"] .customer-dialog label{color:#d9e6de}
html[data-theme="dark"] .customer-dialog input{background:#29352e;color:#f1f7f3;border-color:#4b5f52}
html[data-theme="dark"] .customer-dialog input::placeholder{color:#a9bbb0;opacity:1}
html[data-theme="dark"] .customer-dialog input:focus{border-color:#6fe1b0;box-shadow:0 0 0 3px rgba(111,225,176,.18)}
html[data-theme="dark"] .customer-dialog .close-customer{color:#c9d8cf}
html[data-theme="dark"] .customer-tabs button{background:#29352e;color:#c2d0c7;border:1px solid #435449}
html[data-theme="dark"] .customer-tabs button.active{background:#28523f;color:#ecfff5;border-color:#67d9a6}
html[data-theme="dark"] .customer-profile{background:#252f29;border-color:#435449;color:#edf5f0}
html[data-theme="dark"] .customer-profile h3{color:#f3f8f5}
html[data-theme="dark"] .customer-profile-account{color:#c5d2c9!important}
html[data-theme="dark"] .customer-profile-account b{color:#7ce5b4}
html[data-theme="dark"] .customer-profile-hint{color:#e1c982!important}
html[data-theme="dark"] .customer-profile-form{border-color:#435449}
html[data-theme="dark"] .customer-profile-form h4{color:#eef7f1}
html[data-theme="dark"] .customer-profile-form .customer-email-code-row>button,html[data-theme="dark"] .customer-trial-action{background:#28523f;border-color:#5a9a7b;color:#edfff5}
html[data-theme="dark"] .customer-primary{background:#22a873;color:#071b11}
html[data-theme="dark"] .customer-primary:hover{background:#42c88f}
html[data-theme="dark"] .customer-message{color:#7ce5b4}
html[data-theme="dark"] .customer-message.error{color:#ff9fa8}
html[data-theme="dark"] .customer-balances .customer-balance{background:#29372f;border:1px solid #435449}
html[data-theme="dark"] .customer-balance b{color:#83e7b8}
html[data-theme="dark"] .customer-balance small{color:#c4d3ca}
html[data-theme="dark"] .customer-trial{background:#3a3323;border:1px solid #6c5b32;color:#f0d98f}
html[data-theme="dark"] .customer-ledger{border-color:#435449}
html[data-theme="dark"] .customer-ledger>strong{color:#f0f7f2;font-size:15px}
html[data-theme="dark"] .customer-ledger .ledger-row{color:#cbd9d0;border-color:#3d4d43;font-size:14px}
html[data-theme="dark"] .customer-ledger .ledger-row span:last-child{color:#83e7b8;font-weight:650}
html[data-theme="dark"] .customer-ledger>p{color:#bdcbc2}
html[data-theme="dark"] .customer-link{display:block;width:100%;margin-top:18px;border:1px solid #6b8577;border-radius:10px;background:#293a31;color:#e7f3eb;font-size:14px;font-weight:650;padding:11px 14px;text-align:center}
html[data-theme="dark"] .customer-link:hover{background:#355344;border-color:#83e7b8;color:#fff}