/* Sphere-specific usability rules. The application theme owns its palette and typography. */
#sphere-panel.sph-readable { color:var(--tx); background:var(--pn); }
#sphere-panel.sph-readable button, #sphere-panel.sph-readable input, #sphere-panel.sph-readable select { min-height:26px; }
#sphere-panel.sph-readable :is(button,input,select,textarea,summary):focus-visible { outline:2px solid var(--a2); outline-offset:2px; }
#sphere-panel.sph-readable button.active, #sphere-panel.sph-readable button[aria-pressed="true"] { font-weight:700; }
#sphere-panel.sph-readable input[type="checkbox"] { width:17px; min-width:17px; height:17px; accent-color:var(--ac); }
#sphere-panel.sph-readable input[type="color"] { width:30px; min-width:30px; height:26px; padding:1px; }
#sphere-panel.sph-readable input[type="range"] { accent-color:var(--ac); min-width:70px; }
#sphere-panel.sph-readable #sphere-tab-bar { flex-wrap:wrap; }
#sphere-observer-disclosure { flex-shrink:0; border-bottom:1px solid var(--bd); }
#sphere-observer-disclosure summary { padding:6px 8px; cursor:pointer; }
#sphere-observer-disclosure #sphere-explorer-controls { overflow:auto; max-height:25vh; }
.sph-accessibility-bar { padding:8px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; border-bottom:1px solid var(--bd); }
.sph-accessibility-bar label,.sph-color-row { display:flex; align-items:center; gap:6px; }
.sph-color-row { flex-wrap:wrap; padding:5px 0; }
.sph-color-row label { flex:1; min-width:130px; cursor:pointer; }
.sph-color-row output { min-width:42px; text-align:right; font-variant-numeric:tabular-nums; }
.sph-palette-actions { display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin:8px 0; }
@media (prefers-reduced-motion:reduce) { #sphere-panel *,#sphere-panel *::before,#sphere-panel *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media (forced-colors:active) { #sphere-panel.sph-readable :is(button,input,select,textarea,summary):focus-visible { outline-color:Highlight; } #sphere-panel input[type="color"] { forced-color-adjust:none; } }