/* Socket Health data pages. Loaded after site.css; re-skins the shared data-page
   layout with the socket.health wayfinding palette (wall, board, the two lines)
   and the Barlow type family used on the socket.health homepage. */
:root{
  --surface:#ffffff;--surface-alt:#F1EFF7;--surface-raised:#ffffff;--line:#e0dbec;--line-strong:#8d84ab;
  --ink:#2B2150;--ink-muted:#655C82;--plum:#372059;--plum-soft:#e9e4f4;--plum-mark:#372059;--mark-disc:#372059;
  --on-plum:#ffffff;--on-plum-muted:#d6cdea;--blue:#00b5e6;--link:#0a6ea8;--signal:#00daba;--pulse:#00daba;
  --tech:#00b5e6;--sys:#00c46f;--here:#00daba;--grad:linear-gradient(90deg,#00fd90,#00b5e6);
  --on-accent:#1c1440;--focus-ring:#0a6ea8;--bar:#8d84ab;--bar-tn:#372059;--track:#F1EFF7;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;--sans:"Barlow",Arial,sans-serif;--mono:"Spline Sans Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root{
  --surface:#130d24;--surface-alt:#1b1430;--surface-raised:#231a3d;--line:#382d57;--line-strong:#6d6290;
  --ink:#f3f0fa;--ink-muted:#b9b0d2;--plum:#372059;--plum-soft:#2e2350;--plum-mark:#b9a6ec;--mark-disc:#ffffff;
  --link:#5fd0ff;--focus-ring:#5fd0ff;--bar:#6d6290;--bar-tn:#b9a6ec;--track:#1b1430;color-scheme:dark}}
body{font-weight:450}
h1,h2,h3{font-weight:700;letter-spacing:0}
h1{font-size:58px;line-height:58px}
h2{font-size:40px;line-height:42px}
h3{font-size:23px;line-height:27px;font-weight:650}
.hero h1{font-size:84px;line-height:78px;font-weight:700;text-transform:uppercase;letter-spacing:.01em;max-width:10em}
.label,.band .crumb,.stat .k,caption,.hub .row.h,footer h4{text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.big,.stat .v{font-weight:700}
.nav{border-bottom:0}
.nav::after{content:"";display:block;height:4px;background:var(--grad)}
.nav .brand span{font-family:var(--display);font-size:22px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.navlinks a{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:16px;font-weight:600}
.navlinks a[aria-current]{border-bottom-color:var(--here)}
.btn{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:16px;font-weight:700;border-radius:2px}
.btn-signal{background:var(--here);box-shadow:0 2px 0 #1c1440}
.btn-signal:hover{background:#5cf0d8}
.band{border-bottom:0;position:relative}
.band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:linear-gradient(90deg,var(--tech) 0 50%,var(--sys) 50% 100%)}
.cta{background:var(--plum);position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:linear-gradient(180deg,var(--tech),var(--sys))}
.chip.on{background:var(--plum)}
.hmark .ring,.hmark .sq{fill:none;stroke:url(#hg);stroke-width:5}
.points li::before{background:var(--here);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
footer .tag{max-width:26em}
.line-key{display:flex;gap:20px;flex-wrap:wrap;font-size:15px;line-height:22px;font-weight:600;color:inherit;opacity:.85}
.line-key span{display:inline-flex;align-items:center;gap:8px}
.line-key i{display:inline-block;width:28px;height:6px;border-radius:3px}
/* topic chips used on the news feed and hub */
.tchip{display:inline-flex;align-items:center;font:600 12px/18px var(--sans);letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:2px;background:var(--plum-soft);color:var(--ink);white-space:nowrap}
.tchip.tn{background:var(--here);color:var(--on-accent)}
@media (max-width:720px){
  h1{font-size:42px;line-height:44px}.hero h1{font-size:54px;line-height:52px}h2{font-size:32px;line-height:34px}
}
.brand .hmark{flex:none;width:36px;height:36px}footer .brand .hmark{width:32px;height:32px}
/* Terrazzo floor, as on the socket.health homepage: an eggshell wall with speckles
   painted on a fixed canvas behind the page. Bands of plain colour become see-through
   so the floor shows; cards, tables and the plum bands stay solid. */
:root{--wall:#F1EFF7}
@media (prefers-color-scheme:dark){:root{--wall:#130d24}}
body{background:var(--wall)}
#terrazzo{position:fixed;inset:0;z-index:0;pointer-events:none}
body>header,body>section,body>div,body>footer,body>main{position:relative;z-index:1}
section.sec,section.alt,section.hl-health{background:transparent}
section.alt,section.hl-health{background:rgba(255,255,255,.35)}
footer{background:rgba(255,255,255,.55)}
.tbl{background:var(--surface-raised)}
@media (prefers-color-scheme:dark){section.alt,section.hl-health{background:rgba(255,255,255,.03)}footer{background:rgba(0,0,0,.25)}}
.band{background:transparent}
