:root { color-scheme:dark; --primary:var(--accent); --border-color:var(--border); }
:root[data-theme="light"] {
    color-scheme:light;
    --bg:#e8edf4; --surface:#ffffff; --surface-1:#ffffff;
    --surface-2:#dce4ef; --surface-3:#cbd6e5; --border:#8796ab;
    --text:#101b2d; --text-muted:#3e4d63;
    --accent:#3152d5; --accent-hover:#233fac;
    --danger:#b42332; --success:#16733b; --warning:#885900; --info:#3152d5;
    --shadow:0 4px 24px rgba(23,35,55,.12);
}
.theme-control{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem;color:var(--text-muted);font-size:.85rem}
.theme-control select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font:inherit}
.theme-control select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[data-theme="light"] .env-play,[data-theme="light"] .cmp-check,[data-theme="light"] .cmp-stat-ok{color:#16733b}
[data-theme="light"] .env-live,[data-theme="light"] .cmp-val-diff,[data-theme="light"] .cmp-stat-diff{color:#b42332}
[data-theme="light"] .env-other{color:#225eb4}
[data-theme="light"] .cmp-check-warn,[data-theme="light"] .cmp-stat-warn,[data-theme="light"] .cmp-stat-info{color:#885900}
[data-theme="light"] .btn-success{color:#fff}

/* Stronger visual boundaries and readable secondary text in the light theme. */
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder{color:var(--text-muted);opacity:1}
[data-theme="light"] .sidebar-link.active{background:#cfddf5;color:#173b91;box-shadow:inset 3px 0 0 var(--accent);font-weight:600}
[data-theme="light"] .data-table th{background:var(--surface-2);color:var(--text);border-bottom:2px solid var(--border)}
[data-theme="light"] .data-table td{border-bottom-color:var(--border)}
[data-theme="light"] :is(input,select,textarea,button,a):focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* Joined preference buttons share one outline and a clear selected state. */
.preference-control{display:flex;align-items:center;justify-content:space-between;gap:.4rem;margin-bottom:.5rem;font-size:.75rem;color:var(--text-muted)}
.preference-control>span{flex-shrink:0}
.segmented-control{display:inline-flex;flex-shrink:0;width:auto;border:1px solid var(--border);border-radius:var(--radius);overflow:visible;background:var(--bg)}
.segmented-control button{flex:0 0 auto;min-width:0;min-height:1.5rem;padding:.15rem .35rem;border:0;border-right:1px solid var(--border);background:transparent;color:var(--text);font:inherit;cursor:pointer}
.segmented-control button:first-child{border-radius:calc(var(--radius) - 1px) 0 0 calc(var(--radius) - 1px)}
.segmented-control button:last-child{border-right:0;border-radius:0 calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0}
.segmented-control button:hover{background:var(--surface-2)}
.segmented-control button[aria-pressed="true"]{background:var(--accent);color:#fff;font-weight:700;box-shadow:inset 0 -3px 0 rgba(0,0,0,.25)}
.segmented-control button:focus-visible{position:relative;outline:2px solid var(--accent);outline-offset:2px}