/* Shared switch; original styles remain intact when Aero styles are inactive. */
html[data-design="classic"] .ocean-canopy,
html[data-design="classic"] .utility-bar,
html[data-design="classic"] .aero-bubbles { display:none; }
.header-tools { display:flex;align-items:center;gap:25px; }
.theme-toggle { display:inline-flex;align-items:center;gap:9px;flex-shrink:0;min-height:40px;padding:8px 12px;border:1px solid #b8c2b6;border-radius:30px;background:#e8ece2;color:#263c31;font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap; }
.theme-toggle:hover { filter:brightness(1.05); }
.theme-toggle:focus-visible { outline:3px solid #338f70;outline-offset:4px; }
.theme-track { display:block;position:relative;width:29px;height:17px;border-radius:20px;background:#87978c;box-shadow:inset 0 1px 2px #0002; }
.theme-track i { position:absolute;top:3px;left:3px;width:11px;height:11px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #263c3155;transition:transform .16s; }
.theme-state { width:18px;text-align:right;font-size:9px;font-weight:400;opacity:.8; }
.theme-toggle[aria-checked="true"] .theme-track { background:#058aa9; }
.theme-toggle[aria-checked="true"] .theme-track i { transform:translateX(12px); }
/* Each button previews the destination style, opposite the page around it. */
html[data-design="classic"] .theme-toggle { border:1px solid #4b9cbc;border-radius:22px;color:#06486c;background:linear-gradient(#f8ffff,#c4f7ff 46%,#76c9e5 47%,#c4f5fb);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 4px #0879a42b,0 2px 5px #087ca630;text-shadow:0 1px #e8ffff;font-family:'Lucida Grande','Segoe UI',Tahoma,sans-serif; }
html[data-design="classic"] .theme-track { background:linear-gradient(#0b7caa,#30cbe0);border:1px solid #368ea8;box-shadow:inset 0 1px 3px #024b8177,0 1px #fff; }
html[data-design="classic"] .theme-track i { top:2px;left:2px;background:radial-gradient(circle at 35% 25%,#fff,#d6ffff 40%,#77c9e4);box-shadow:0 1px 3px #00578180; }
html[data-design="aero"] .theme-toggle { border:1px solid #34473d;border-radius:4px;color:#f1f0e9;background:#151c1b;box-shadow:none;text-shadow:none;font-family:Arial,Helvetica,sans-serif; }
html[data-design="aero"] .theme-toggle .theme-track { background:#78917e;box-shadow:none; }
html[data-design="aero"] .theme-track i { background:#d7ebd6;box-shadow:none; }
html[data-design="aero"] .theme-state { color:#c6d0c7;opacity:1; }
@media(max-width:1100px) { .header-tools { gap:16px; } .header-tools nav { gap:16px; } .theme-toggle { padding:8px 10px;font-size:10px; } }
@media(max-width:950px) {
  header { height:auto;min-height:92px;flex-wrap:wrap;gap:16px;padding-top:18px;padding-bottom:18px; }
  .header-tools { width:100%;justify-content:space-between; }
  .header-tools nav { gap:24px; }
  html[data-design="aero"] header { height:auto; }
  html[data-design="aero"] .header-tools nav { gap:7px; }
}
@media(max-width:600px) {
  header { gap:15px; }
  .header-tools { flex-wrap:wrap;justify-content:center;gap:12px; }
  .header-tools nav { justify-content:center;flex:1 0 100%;gap:28px;font-size:11px; }
  .theme-toggle { min-height:36px;font-size:11px;padding:8px 12px; }
  html[data-design="aero"] .header-tools nav { width:100%; }
}
@media(prefers-reduced-motion:reduce) { .theme-track i { transition:none; } }