/* Shared by desktop and mobile Studio. Keep SVG block colours independent. */
:root{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark;--studio-text:#e5edf7;--studio-muted:#b7c7db;--studio-link:#9cc8ff;--studio-panel:#1c2c42;--studio-control:#263951;--studio-border:#60758f}
html[data-theme="dark"] dialog{color:var(--studio-text);background:var(--studio-panel);border-color:var(--studio-border)}
html[data-theme="dark"] dialog::backdrop{background:rgba(5,12,23,.72)}
html[data-theme="dark"] :is(.help,.muted,.code-note,.workspace-tag,.brand small,.mobile-kicker,#mobile-hint,.logo-caption){color:var(--studio-muted)}
html[data-theme="dark"] a{color:var(--studio-link)}
html[data-theme="dark"] a:visited{color:#ccb8ff}
html[data-theme="dark"] a:hover{color:#c6e0ff}
html[data-theme="dark"] dialog :is(a,a:visited){color:var(--studio-link);text-underline-offset:3px}
html[data-theme="dark"] :is(input,textarea,select){color:var(--studio-text);background-color:var(--studio-control);border-color:var(--studio-border);caret-color:#fff}
html[data-theme="dark"] :is(input,textarea)::placeholder{color:#abbad0;opacity:1}
html[data-theme="dark"] :is(select option,select optgroup){color:var(--studio-text);background:var(--studio-control)}
html[data-theme="dark"] button:disabled{opacity:1;color:#aabbd0;background-color:#243449;border-color:#4b607a;cursor:not-allowed}
html[data-theme="dark"] :is(button,input,select,textarea,a,summary):focus-visible{outline:3px solid #9cc8ff;outline-offset:3px}
html[data-theme="dark"] dialog :is(.row,.bridge-install-card){border-color:#4b607a}
html[data-theme="dark"] .badge{color:var(--studio-text);background:#314767}
html[data-theme="dark"] .guide-category-tag{color:var(--studio-text)!important;background:var(--studio-control)!important;border-left:4px solid var(--guide-category-color)}
html[data-theme="dark"] .mobile-card{color:var(--studio-text);background:#203149;border-color:#50647e}
html[data-theme="dark"] .mobile-card p{color:var(--studio-muted)}
html[data-theme="dark"] .mobile-card :is(a,a:visited){color:var(--studio-link)}
html[data-theme="dark"] .mobile-offline{color:#e8ca86}
html[data-theme="dark"] #palette-toggle{box-shadow:5px 0 9px #203148}
html[data-theme="dark"] .workspace-panel:not(.palette-hidden) .workspace-tag{background:#263951;color:var(--studio-text)}
/* Blockly injects its popup styles at runtime; these selectors override both
   its renderer rules and inline dropdown surfaces without recolouring blocks. */
html[data-theme="dark"] :is(.blocklyWidgetDiv .blocklyMenu,.blocklyDropDownDiv,.blocklyTooltip){background-color:var(--studio-control)!important;color:var(--studio-text)!important;border-color:var(--studio-border)!important}
html[data-theme="dark"] .blocklyDropDownArrow{background-color:var(--studio-control)!important;border-color:var(--studio-border)!important}
html[data-theme="dark"] :is(.blocklyMenuItem,.blocklyMenuItemContent){color:var(--studio-text)!important}
html[data-theme="dark"] .blocklyMenuItemHighlight{background-color:#405c80!important}
html[data-theme="dark"] .blocklyMenuItemHighlight .blocklyMenuItemContent{color:#fff!important}
html[data-theme="dark"] .blocklyMenuItemDisabled,html[data-theme="dark"] .blocklyMenuItemDisabled .blocklyMenuItemContent{color:#aabbd0!important}
html[data-theme="dark"] .blocklyMenuSeparator{background:#60758f!important}
html[data-theme="dark"] .blocklyHtmlInput{color:var(--studio-text)!important;background-color:#16263a!important;caret-color:#fff}
