/* APEX LINK Summer Glass theme — shared by introduction, installation and device/group web. */
:root, :root[data-theme=light] {
  color-scheme: light;
  --bg:#F2F8FA; --paper:#FFFFFF; --card:#FFFFFF; --soft:#E6F3F8;
  --dark:#023047; --ink:#023047; --mut:#466371; --muted:#466371;
  --line:#D5E6ED; --green:#826000; --mint:#FFB703; --amber:#FFB703;
  --accent:#023047; --accentink:#FFFFFF; --blue:#023047; --bluebg:#E6F3F8;
  --ok:#246044; --okbg:#E8F2EC; --warn:#755600; --warnbg:#FFF4D4;
  --shadow:0 5px 22px #0230470A;
}
:root[data-theme=dark] {
  color-scheme:dark;
  --bg:#082936; --paper:#103D4E; --card:#103D4E; --soft:#15546A;
  --ink:#FFFFFF; --mut:#DDE6F7; --muted:#DDE6F7; --line:#447183;
  --green:#F0C75E; --mint:#F0C75E; --amber:#FFD36A;
  --accent:#F0C75E; --accentink:#023047; --blue:#8ECAE6; --bluebg:#15546A;
  --ok:#A4E0BA; --okbg:#163D41; --warn:#FFD36A; --warnbg:#493D25;
}
* { box-sizing:border-box; }
html { background:var(--bg); }
body { background:var(--bg) !important; color:var(--ink) !important; font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif; line-height:1.7; }
a { color:var(--blue); text-underline-offset:4px; }
h1,h2,h3,h4 { overflow-wrap:anywhere; text-wrap:balance; }
h1 { font-size:clamp(32px,5.6vw,68px); line-height:1.2; }
h2 { line-height:1.35; }
p,li,dd { overflow-wrap:anywhere; word-break:keep-all; }
img,svg,video,audio { max-width:100%; }
img { height:auto; }
main,header,section,article,aside,.layout,.grid,.feature-grid,.health-grid,.resource-actions,.header-actions { min-width:0; }
.eyebrow,.tag { color:var(--green) !important; font-weight:700; letter-spacing:.1em; }
.note,.hint,.subtitle,.muted,small,.lead { color:var(--mut); }
button,input,select,textarea { font-family:inherit; font-size:inherit; max-width:100%; }
button,a.button,a.primary,.btn { min-height:44px; border-radius:7px; }
button { color:var(--ink); background:var(--card); border:1px solid var(--line); }
button:hover:not(:disabled),a.button:hover,a.primary:hover { filter:brightness(.97); }
button:disabled { cursor:default; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible { outline:3px solid #826000; outline-offset:3px; }
input,select,textarea { background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:7px; }
.button.light,.btn.primary,button.primary,a.primary,#group-open,#ota-install,esp-web-install-button button {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 20px; border:1px solid #FFB703; background:var(--mint);
  color:#023047; font-weight:750; text-decoration:none; line-height:1.5;
}
.button.light:hover,.btn.primary:hover,button.primary:hover,a.primary:hover { background:var(--amber); }
.card,.resource-card,.feature,.health-card,.car,.login-card,.control-group,.admin-tools,
.panel,.doc-card,.roadmap article,.diagram,.activity-panel,.map-concept,.stats>div {
  background:var(--card); color:var(--ink); border:1px solid var(--line);
  border-radius:14px; box-shadow:var(--shadow);
}
.resource-card { background:var(--card);color:var(--ink);border-color:var(--line);border-radius:16px; }
.resource-card p:not(.eyebrow) { color:var(--ink); }
.resource-actions,.button-row { display:flex; flex-wrap:wrap; gap:12px; }
.resource-card+.resource-card { margin-top:32px; }
.hero,.evidence,footer.blue-panel {
  background:#023047 !important; color:#FFFFFF !important; border-radius:20px;
}
.hero .eyebrow { color:#FFB703 !important; }
.hero-lead,.hero-note,.scene-caption,.hero small,.evidence p { color:#C9E7F2 !important; }
.hero a:not(.button),.evidence a { color:#FFB703; }
.nav { background:#FFFFFFF5; border-color:var(--line); }
.nav a,.nav a:hover { color:#023047; }
.snapshot { background:#FFFFFF; border-color:var(--line); }
.radio { background:linear-gradient(140deg,#0B536B,#023047); border-color:#FFB703; }
.radio-screen { background:#062A3B; border-color:#42788F; }
.radio-top,.radio .tiny,.scene-caption span { color:#C9E7F2; }
.radio-dot,.signal b { background:#FFB703; }
.radio-screen strong { color:#FFB703; }
.ptt { background:linear-gradient(145deg,#FFB703,#FFB703);color:#023047;border-color:#023047;box-shadow:0 5px 0 #12193F; }
.ptt span { color:inherit; }
.orbit { border-color:#42788F; max-width:100%; }
.orbit-two { max-width:115%; }
.speaker { background:repeating-linear-gradient(0deg,#FFB703 0 2px,transparent 2px 6px);opacity:.65; }
.manifesto,.map-sketch,.vertical-flow div,.doc-body pre { background:#E6F3F8; border-color:var(--line); color:#023047; }
.manifesto p,.mini-tags span { color:#354567; }
.mini-tags span,.steps article>span { background:#FFFFFF; border-color:var(--line); }
.verified { background:#E8F2EC;color:#246044; }
.pending,.planned,.model-notice { background:#FFF4D4;color:#755600 !important;border-color:#DCC677; }
.code { background:#E6F3F8;color:#023047; }
.doc-card:hover { background:#E6F3F8;border-color:#023047; }
.doc-card .doc-no,.doc-body td { color:#466371; }
table { max-width:100%; }
th,td { border-color:var(--line); }
thead th,.model-table thead th { background:#023047;color:#FFFFFF; }
.model-table td { color:var(--ink); }
.model-table tbody th,.doc-body th { background:var(--soft);color:var(--ink); }
.model-table caption { color:var(--mut); }
.table-scroll,.table-wrap,.model-table-wrap,.scroll,.raw-table { overflow-x:auto; max-width:100%; }
.doc-body table { display:block;overflow-x:auto; }
footer { background:#023047;color:#FFFFFF; }
footer p,footer small { color:#C9E7F2; }
footer>a { color:#FFB703; }
footer .brand,footer strong { color:#FFFFFF; }
/* Reports keep all text, measurements, media and tables. Only their presentation changes. */
html[data-surface=report] body { max-width:1160px;margin:auto;padding:clamp(18px,4vw,34px);font-size:16px; }
html[data-surface=report] main { padding-inline:0;max-width:100%; }
html[data-surface=report] :is(article,section,.panel,.card) {
  background:var(--card) !important;color:var(--ink) !important;border:1px solid var(--line);
  border-radius:14px;padding:clamp(18px,3vw,28px);margin-block:24px;
}
html[data-surface=report] :is(p,li,span,.note,.tag,.lead,caption,legend) { color:inherit; }
html[data-surface=report] a { color:var(--blue) !important; }
html[data-surface=report] button { color:var(--ink);border-color:var(--line); }
html[data-surface=report] .choice.active { background:#023047;color:#FFFFFF;border-color:#023047; }
html[data-surface=report] .replay,html[data-surface=report] .choice { background:var(--soft);color:var(--ink); }
html[data-surface=report] .stats>div { background:var(--card);border:1px solid var(--line);color:var(--ink); }
html[data-surface=report] .warn { background:#FFF4D4;color:#755600; }
html[data-surface=report] header { flex-wrap:wrap;gap:12px; }
html[data-surface=report] table { display:block;overflow-x:auto; }
html[data-surface=report] td,html[data-surface=report] th { white-space:normal;min-width:110px; }
html[data-surface=report] pre { max-width:100%;overflow-x:auto; }
/* Group, operator and device screens share the same blue/gold vocabulary. */
.brand-icon,.logo { background:#023047;color:#FFB703; }
.header-actions { flex-wrap:wrap; }
.map { background:#E6F3F8;color:#023047;border-color:var(--line); }
.map-caption { color:#466371; }
.health-card p,.metric>span,.control-group label,.summary-grid small,.login-card p { color:var(--mut); }
.health-title { display:flex;flex-wrap:wrap;gap:8px; }
.health-title h3 { overflow-wrap:anywhere; }
.chip { white-space:nowrap;flex-shrink:0;background:var(--soft); }
.chip.tx { background:#FFB703;color:#023047; }
.danger { color:#9B2B24; }
#group-list label { border-color:var(--line);background:var(--card); }
#group-list label:has(input:checked) { border-color:#023047;background:#E6F3F8; }
.assembly-guide { gap:32px !important; }
.assembly-guide>.health-card { padding:clamp(24px,4vw,40px); }
#admin-login { display:grid;gap:16px;padding:28px;max-width:640px; }
:root[data-theme=dark] .map { background:#103D4E;color:#FFFFFF; }
:root[data-theme=dark] .map-caption { color:#DDE6F7; }
:root[data-theme=dark] #group-list label:has(input:checked) { background:#15546A;border-color:#F0C75E; }
@media(max-width:640px) {
  main { width:100%;padding-left:18px;padding-right:18px; }
  header { flex-wrap:wrap;padding-inline:18px;gap:14px; }
  .hero { padding:30px 22px;grid-template-columns:1fr;gap:24px; }
  .hero h1 { font-size:clamp(38px,11vw,58px); }
  .radio-scene { width:100%;min-height:340px; }
  .scene-caption { margin-inline:0; }
  .resource-actions { flex-direction:column;align-items:stretch; }
  .resource-actions .button { width:100%; }
  .resource-card { padding:24px 20px; }
  .section-heading { flex-wrap:wrap;gap:10px; }
  .summary-grid,.stats { grid-template-columns:1fr 1fr; }
  .layout,.health-grid,.toolbar,.feature-grid { grid-template-columns:1fr; }
  .login-card { padding:26px 20px; }
  .header-actions { width:100%;gap:12px; }
  .nav { position:static;flex-wrap:nowrap;white-space:nowrap;gap:18px;padding:10px 18px;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain; }
  .nav a { flex:0 0 auto;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center; }
  .snapshot { grid-template-columns:1fr 1fr; }
  footer { padding:28px 20px; }
  footer>a { position:static;display:block;margin-top:16px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important;transition-duration:.01ms !important; }
}

.feature p,.steps p,.roadmap p,.activity-panel p,.activity-panel li,.map-copy p,.map-copy li {
  font-size:15px;line-height:1.75;color:var(--mut);
}
.resource-card h2 { font-size:clamp(25px,3.2vw,38px); }
.resource-card .eyebrow { font-size:12px; }
.health-card h3 { line-height:1.4; }
.car h3 { color:var(--ink) !important; }
/* Legacy report badges must use a complete foreground/background pair. */
html[data-surface=report] .tags span,
html[data-surface=report] .badge,
html[data-surface=report] .pill {
  background:#E6F3F8 !important;color:#023047 !important;
  border:1px solid #D5E6ED;border-radius:999px;
}
html[data-surface=report] :is(.intro,.small,.phone figcaption) { color:#466371 !important; }
html[data-surface=report] code { background:#E6F3F8;color:#023047; }
/* Comfortable card proportions, shared across desktop and phone. */
.feature-grid>.card { padding:clamp(24px,3vw,36px); }
.feature-grid>.card h3 { margin:0 0 18px;font-size:clamp(20px,2vw,25px);line-height:1.45; }
.feature-grid>.card p { margin:0 0 22px;font-size:16px;line-height:1.85;color:var(--mut); }
.feature-grid>.card a { display:inline-block;margin-top:8px; }
.feature-grid { gap:24px; }
.button.light,.btn.primary,button.primary,a.primary,#group-open,#ota-install,esp-web-install-button button {
 background:#023047;color:#FFB703;border-color:#023047;
}
.button.light:hover,.btn.primary:hover,button.primary:hover,a.primary:hover { background:#0B536B;color:#FFD36A; }
@media(max-width:640px){.feature-grid>.card{padding:26px 24px}.feature-grid>.card h3{font-size:22px}.feature-grid>.card p{font-size:16px}}
.feature-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); }
/* One title treatment: navy, white copy and gold emphasis. */
body>header { background:#023047 !important;color:#FFFFFF !important;border-color:#296276; }
body>header :is(h1,h2,strong,.brand,.brand-name) { color:#FFFFFF !important; }
body>header :is(.sub,.subtitle,.eyebrow,small) { color:#C9E7F2 !important; }
body>header a { color:#FFB703; }
html[data-surface=report] h1 { background:#023047;color:#FFFFFF !important;padding:28px;border-radius:14px; }
html[data-surface=report] main>section:first-child:has(h1) { background:#023047 !important;color:#FFFFFF !important; }
html[data-surface=report] main>section:first-child:has(h1) h1 { padding:0; }
html[data-surface=report] main>section:first-child:has(h1) :is(.lead,p) { color:#DDE6F7 !important; }
html[data-surface=report] h1 :is(em,span),html[data-surface=report] main>section:first-child:has(h1) :is(.tag,.tag a) { color:#FFB703 !important; }
html[data-surface=report] header a { color:#FFB703 !important; }
body>header .brand-icon { border:1px solid #FFB703; }
.map-label { background:#FFFFFF !important;color:#023047 !important;border-color:#D5E6ED !important; }
.map-sketch svg rect:first-of-type { fill:#E6F3F8; }
.map-sketch svg path[stroke='#d5dfce'] { stroke:#D5E6ED; }
.map-sketch svg path[stroke='#d9e4ce'] { stroke:#D1EAF3; }
.map-sketch svg path[stroke='#91b775'] { stroke:#219EBC; }
.map-sketch svg path[stroke='#557a43'] { stroke:#023047; }
.map-sketch svg [fill='#b8f277'] { fill:#FFB703; }
.map-sketch svg [stroke='#244b37'] { stroke:#023047; }
.map-sketch svg [fill='#244b37'] { fill:#023047; }
.map-sketch svg [fill='#7f9275'] { fill:#219EBC; }
.map-sketch svg [fill='#66745c'] { fill:#466371; }
body>header .connection { color:#DDE6F7 !important; }
/* Device tab panels are layout containers, not another enclosing card. */
.shell>.panel { background:transparent;border:0;box-shadow:none;padding:0; }
.shell .layout { gap:24px; }
.shell .card+.card { margin-top:24px; }
.shell input[type=range] { accent-color:#023047 !important; }
body>header .revision { color:#C9E7F2 !important; }
/* Report credits are flowing text, with the same readable inset as a card. */
html[data-surface=report] footer { display:block;position:static;padding:clamp(24px,4vw,36px);border-radius:14px;line-height:1.85; }
html[data-surface=report] footer :is(p,span,small,strong) { color:#DDE6F7 !important; }
html[data-surface=report] footer a { position:static;display:inline;color:#FFB703 !important;overflow-wrap:anywhere; }
html[data-surface=report] footer p { margin:0 0 20px;max-width:78ch; }
html[data-surface=report] footer p:last-child { margin-bottom:0; }
.doc-card,.doc-card b,.doc-card small { text-align:left; }
.shell :is(input,select,textarea) { font-size:16px; }
.shell :is(button,label,p) { word-break:keep-all; }
body:has(.shell)>header h1 { font-size:20px;line-height:1.3;letter-spacing:1px; }
body:has(.shell)>header .header-actions { justify-content:flex-end; }
:is(#ap-exit-dialog,#portal-confirm-dialog) { max-width:min(440px,calc(100vw - 32px));padding:28px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink); }
:is(#ap-exit-dialog,#portal-confirm-dialog)::backdrop { background:#10183DAA; }
:is(#ap-exit-dialog,#portal-confirm-dialog) h2 { font-size:24px;margin-top:0; }
:is(#ap-exit-dialog,#portal-confirm-dialog) .button-row { justify-content:flex-end; }

.shell footer { padding:16px;border-radius:12px;align-items:flex-start; }
:root[data-theme=dark] .danger { color:#FFB9AE !important; }
:root[data-theme=dark] button.danger { background:#4C283A;border-color:#96566B; }

.connection-editor { margin-top:24px;border-top:1px solid var(--line);padding-top:20px; }
.connection-editor summary { cursor:pointer;font-weight:700;color:var(--blue);padding:12px 0;min-height:44px; }

.shell output.readout { display:block;min-height:51px;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font-size:16px;font-weight:400; }

/* Summer palette: strong content surfaces, glass reserved for navigation. */
:root,:root[data-theme=light]{--sky:#8ECAE6;--teal:#219EBC;--orange:#FB8500;--green:#24667D;--shadow:0 8px 28px #02304708;}
:root:not([data-theme=dark]) :is(.button.light,.btn.primary,button.primary,a.primary,#group-open,#ota-install,esp-web-install-button button){background:#FFB703;color:#023047;border-color:#FFB703;box-shadow:inset 0 1px 0 #ffffff99;}
:root:not([data-theme=dark]) :is(.button.light,.btn.primary,button.primary,a.primary,#group-open):hover{background:#FFD36A;color:#023047;}
button,a.button,a.primary,.btn{border-radius:999px;}
.card,.resource-card,.feature,.health-card,.car,.login-card,.control-group,.admin-tools,.panel,.doc-card,.roadmap article,.diagram,.activity-panel,.map-concept,.stats>div{border-radius:24px;}
.nav{background:rgba(255,255,255,.85);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border-color:#D5E6ED;}
.hero{background:radial-gradient(ellipse at 100% 0%,#219EBC55,transparent 60%),#023047!important;}
.hero .eyebrow{color:#8ECAE6!important;}
.hero .button.light{background:#FFB703;color:#023047;border-color:#FFB703;}
.hero .scene-caption{background:rgba(255,255,255,.1);border:1px solid #ffffff40;border-radius:18px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);}
:root:not([data-theme=dark]) #group-list label:has(input:checked){background:#E6F3F8;border-color:#219EBC;}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.nav,.hero .scene-caption{backdrop-filter:none;-webkit-backdrop-filter:none}.nav{background:#fff}.hero .scene-caption{background:#023047}}

/* Activity selectors: readable spacing, independent of device portal tabs. */
.activity-tabs{display:flex!important;flex-wrap:nowrap!important;gap:38px!important;overflow-x:auto;padding:8px 0 20px!important;margin-bottom:24px!important;border:0!important;scroll-padding-inline:16px}
.activity-tabs [role="tab"]{flex:0 0 auto;min-height:48px;padding:12px 22px!important;border:1px solid var(--line,#D5E6ED)!important;border-radius:999px!important;white-space:nowrap;color:#023047!important;background:#E6F3F8!important;line-height:1.4!important;box-sizing:border-box}
.activity-tabs [role="tab"][aria-selected="true"]{background:#023047!important;color:#FFB703!important;border-color:#023047!important}
/* OZSYSTEM ownership strip: always centered, including flex-based page footers. */
footer.oz-copyright{display:block!important;position:static!important;box-sizing:border-box;width:100%;padding:24px 16px!important;margin:0!important;border-radius:0!important;text-align:center!important;justify-content:center!important;align-items:center!important;line-height:1.6;overflow-wrap:anywhere}
footer.oz-copyright :is(p,span,small){text-align:center!important;margin-inline:auto!important}
/* Device settings cards follow the same inset and control rhythm. */
.device-settings-page :is(main.assembly-guide>.health-card,main.assembly-guide>#outing){padding:clamp(24px,4vw,42px)!important;box-sizing:border-box}
.device-settings-page #outing{margin-top:0}
.device-settings-page #outing>label:not(.check-row){display:block;margin:24px 0 8px}
.device-settings-page #outing>input,.device-settings-page #outing>select{display:block;width:100%;margin:0 0 20px;box-sizing:border-box}
.device-settings-page .check-row{display:flex!important;align-items:center;gap:12px;min-height:44px;margin:20px 0!important;line-height:1.6}
.device-settings-page input[type=checkbox]{display:inline-block!important;flex:0 0 22px!important;width:22px!important;height:22px!important;min-height:22px!important;padding:0!important;margin:0!important;align-self:center;accent-color:var(--accent,#219EBC)}
.device-settings-page #outing .button-row{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px}
.device-settings-page #outing button{margin:0;min-height:48px}
.device-settings-page #outing-create{margin:8px 0 24px}
.device-settings-page #outing-list article{padding:24px;margin:24px 0}
.device-settings-page #outing-list article {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
.device-settings-page #outing-list article > :is(h3, p, select) {
  flex: 0 0 100%;
  min-width: 0;
  margin: 0;
}
.device-settings-page #outing-list article > button { margin: 0; }
.device-settings-page #settings label:has(> select) {
  display: grid;
  gap: 8px;
  margin-block: 16px 20px;
}
.device-settings-page #settings label > select { width: 100%; }
.device-settings-page #settings .check-row { column-gap: 12px; }
.device-settings-page #location > h2 { margin-top: 24px; }
@media(max-width:640px){.device-settings-page #outing .button-row{display:grid;grid-template-columns:1fr}.device-settings-page #outing .button-row button{width:100%}}

/* Server night palette matches the device portal; layout remains unchanged. */
:root[data-theme=dark]{color-scheme:dark;--bg:#0F0D0B;--surface:#191613;--surface2:#241F1A;--line:#332C24;--line-strong:#443A2E;--text:#E2D8C7;--text2:#B5A993;--accent:#E0A33E;--on-accent:#1A1208;--disabled:#928672;--notice-bg:#2A2114;--notice-text:#E3C48A;--paper:var(--surface);--card:var(--surface);--soft:var(--surface2);--ink:var(--text);--mut:var(--text2);--muted:var(--text2);--green:var(--accent);--mint:var(--accent);--amber:var(--accent);--accentink:var(--on-accent);--blue:var(--accent);--bluebg:var(--surface2);--ok:var(--text);--okbg:var(--surface2);--warn:#D9704F;--warnbg:var(--notice-bg);--shadow:none}
:root[data-theme=dark] *,:root[data-theme=dark] *::before,:root[data-theme=dark] *::after{box-shadow:none!important;text-shadow:none!important;background-image:none!important;filter:none!important;backdrop-filter:none!important}
:root[data-theme=dark] body>header{background:var(--bg)!important;color:var(--text)!important;border-color:var(--line)}
:root[data-theme=dark] body>header :is(h1,h2,strong,.brand,.brand-name){color:var(--accent)!important}
:root[data-theme=dark] body>header :is(small,.connection,.sub,.subtitle){color:var(--text2)!important}
:root[data-theme=dark] body>header a{color:var(--accent)}
:root[data-theme=dark] .brand-icon{background:var(--surface2);color:var(--accent);border-color:var(--line-strong)}
:root[data-theme=dark] :is(button,input,select,textarea){border-color:var(--line-strong);color:var(--text);background:var(--surface2)}
:root[data-theme=dark] button{background:transparent}
:root[data-theme=dark] :is(button.primary,a.primary,#group-open){background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)}
:root[data-theme=dark] button:disabled{opacity:1;color:var(--disabled)!important;background:var(--surface2)!important;border-color:var(--line)}
:root[data-theme=dark] input::placeholder{color:var(--disabled);opacity:1}
:root[data-theme=dark] input{accent-color:var(--accent)}
:root[data-theme=dark] :is(.danger,.error){color:#D9704F!important}
:root[data-theme=dark] button.danger{background:transparent;border-color:var(--line-strong)}
:root[data-theme=dark] :is(.chip,.badge,.chip.tx){background:var(--notice-bg);color:var(--notice-text)}
:root[data-theme=dark] :is(.map,footer){background:var(--surface2);color:var(--text);border-color:var(--line)}
:root[data-theme=dark] .map-caption{color:var(--text2)}
:root[data-theme=dark] :focus-visible{outline-color:var(--accent)}
:root[data-theme=dark] #group-list label:has(input:checked){background:var(--surface2);border-color:var(--accent)}

.device-settings-page #public-groups .button-row { margin-block: 16px; }
.device-settings-page #public-groups label[for="public-select"] { display: block; margin-bottom: 8px; }
.device-settings-page #public-groups #public-select { display: block; width: 100%; box-sizing: border-box; }

/* Shared spacing for server screens. */
.assembly-guide { gap: clamp(24px, 4vw, 40px) !important; }
#dashboard > section + section,
#admin-live > section + section { margin-block-start: 32px; }
#dashboard :is(.health-grid, .summary-grid),
#admin-live .health-grid { gap: clamp(16px, 2vw, 24px); }
#dashboard .toolbar { gap: 16px; }
#dashboard .control-group label { display: block; margin-block-end: 8px; }
#admin-live .health-card { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  #dashboard .button-row > button,
  .device-settings-page #outing-list article > button { flex: 1 1 auto; }
}


.device-settings-page #settings input[type=range] {
  --thumb: 20px;
  --position: 0%;
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 100%;
  height: 44px;
  margin-inline: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: linear-gradient(to right, #168db0 var(--position), #879ca9 var(--position))
    center / calc(100% - var(--thumb)) 4px no-repeat;
}
.device-settings-page #settings input[type=range]::-webkit-slider-runnable-track {
  height: 4px;
  background: transparent;
}
.device-settings-page #settings input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: var(--thumb);
  height: var(--thumb);
  margin-top: -8px;
  border: 2px solid #168db0;
  border-radius: 50%;
  background: #fff;
}
.device-settings-page #settings input[type=range]::-moz-range-track {
  height: 4px;
  background: transparent;
}
.device-settings-page #settings input[type=range]::-moz-range-thumb {
  box-sizing: border-box;
  width: var(--thumb);
  height: var(--thumb);
  border: 2px solid #168db0;
  border-radius: 50%;
  background: #fff;
}