/* HILMA — independent Concept-A dashboard architecture. */

html[data-skin="hilma"] {
  --h-ivory:#f7f1e6;
  --h-paper:#fbf7ee;
  --h-ink:#242521;
  --h-charcoal:#252925;
  --h-coral:#d77b66;
  --h-rose:#d7a1a3;
  --h-ochre:#dfa94d;
  --h-lavender:#b8abc8;
  --h-sage:#a8b296;
  --h-green:#718967;
  --h-line:#cdbda8;
  --h-soft-line:rgba(88,70,53,.18);
  --ice:var(--h-ivory);
  --card:var(--h-paper);
  --line:var(--h-line);
  --line-soft:var(--h-soft-line);
  --ink:var(--h-ink);
  --ink-2:#5e584f;
  --ink-3:#8b8174;
  --blue:#8b7ca0;
  --blue-soft:#e7dfeb;
  --blue-deep:#574b69;
  --good:var(--h-green);
  --good-soft:#e2e6d9;
  --good-ink:#44523e;
  --warn:var(--h-ochre);
  --warn-soft:#f3e1ba;
  --warn-ink:#6f4e12;
  --bad-soft:#eee2dc;
  --bad-ink:#76564e;
  --crit:var(--h-coral);
  --crit-soft:#efd8d1;
  --crit-ink:#7d3a2d;
  --display:'Rajdhani',sans-serif;
  --body:'Inter',sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --radius:3px;
  --radius-lg:5px;
  --shadow:none;
  color-scheme:light;
}

html[data-skin="hilma"] body {
  color:var(--h-ink);
  background:var(--h-ivory);
}

html[data-skin="hilma"] body::before {
  content:"";
  position:fixed;
  inset:0;
  z-index:999;
  pointer-events:none;
  opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='115' height='115'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

html[data-skin="hilma"] .wrap {
  width:min(1600px,100%);
  max-width:none;
  padding:0 0 60px;
}

html[data-skin="hilma"] .site-header,
html[data-skin="hilma"] .action-bar,
html[data-skin="hilma"] .klint-stage,
html[data-skin="hilma"] .cartoon-stage,
html[data-skin="hilma"] .retro-cluster,
html[data-skin="hilma"] .cs-mobile-actions,
html[data-skin="hilma"] .global-report-trigger {
  display:none;
}

html[data-skin="hilma"] .skin-toggle {
  position:absolute;
  top:24px;
  right:25px;
  z-index:90;
  gap:0;
  border:0;
  border-radius:0;
  overflow:visible;
  background:transparent;
  box-shadow:none;
  font-family:var(--mono);
  font-size:7px;
}

html[data-skin="hilma"] .skin-toggle::before {
  content:"SKIN";
  position:absolute;
  top:-14px;
  left:50%;
  color:#8a7160;
  font-size:6px;
  letter-spacing:.3em;
  transform:translateX(-50%);
}

html[data-skin="hilma"] .skin-toggle button {
  width:32px;
  min-height:32px;
  margin-left:6px;
  padding:0;
  overflow:hidden;
  color:transparent;
  border:1px solid #bda992;
  border-radius:50%;
  background:var(--h-paper);
  font-size:0;
}

html[data-skin="hilma"] .skin-toggle button::after {
  content:"";
  display:block;
  width:11px;
  height:11px;
  margin:auto;
  border:1px solid var(--h-ink);
  border-radius:50%;
}

html[data-skin="hilma"] .skin-toggle button:nth-child(2)::after { border-radius:0;transform:rotate(45deg);background:var(--h-ochre); }
html[data-skin="hilma"] .skin-toggle button:nth-child(3)::after { box-shadow:inset 5px 0 var(--h-rose); }
html[data-skin="hilma"] .skin-toggle button:nth-child(4)::after { border-radius:0;clip-path:polygon(50% 0,100% 100%,0 100%);background:var(--h-ink); }
html[data-skin="hilma"] .skin-toggle button:nth-child(5)::after { background:var(--h-lavender); }
html[data-skin="hilma"] .skin-toggle button:nth-child(6)::after { border:0;background:var(--h-coral);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
html[data-skin="hilma"] .skin-toggle button:nth-child(7)::after { background:var(--h-sage); }

html[data-skin="hilma"] .skin-toggle button.active {
  color:transparent;
  border-color:var(--h-ink);
  background:var(--h-paper);
  box-shadow:0 3px 0 var(--h-ink);
}

html[data-skin="hilma"] .skin-toggle button:focus-visible,
html[data-skin="hilma"] .wind-report-trigger:focus-visible,
html[data-skin="hilma"] .h-sidebar a:focus-visible,
html[data-skin="hilma"] select:focus-visible,
html[data-skin="hilma"] details.tech > summary:focus-visible {
  outline:3px solid var(--h-coral);
  outline-offset:3px;
}

/* ======================================================== stage geometry */

html[data-skin="hilma"] .hilma-stage {
  display:grid;
  grid-template-columns:128px minmax(0,6fr) minmax(420px,4fr);
  grid-template-rows:84px 278px 176px 194px 248px;
  min-height:980px;
  border-top:1px solid var(--h-line);
  border-right:1px solid var(--h-line);
  border-bottom:1px solid var(--h-line);
  background:var(--h-paper);
}

html[data-skin="hilma"] .hilma-stage > * { min-width:0; }

/* ============================================================ side rail */

html[data-skin="hilma"] .h-sidebar {
  position:relative;
  z-index:10;
  grid-column:1;
  grid-row:1/-1;
  display:flex;
  flex-direction:column;
  color:var(--h-paper);
  border-right:1px solid var(--h-ink);
  background:var(--h-charcoal);
}

html[data-skin="hilma"] .h-orbit-mark {
  position:relative;
  width:82px;
  height:82px;
  margin:20px auto 10px;
  border:1px solid #deb46f;
  border-radius:50%;
  background:repeating-radial-gradient(circle,transparent 0 10px,#deb46f 11px 12px,transparent 13px 21px);
}

html[data-skin="hilma"] .h-orbit-mark::before,
html[data-skin="hilma"] .h-orbit-mark::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  border-radius:50%;
  transform:translate(-50%,-50%);
}

html[data-skin="hilma"] .h-orbit-mark::before { width:8px;height:8px;background:#deb46f; }
html[data-skin="hilma"] .h-orbit-mark::after { width:25px;height:25px;border:1px solid #deb46f; }

html[data-skin="hilma"] .h-orbit-mark i {
  position:absolute;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--h-coral);
}

html[data-skin="hilma"] .h-orbit-mark i:nth-child(1) { top:-3px;left:22px;background:var(--h-ochre); }
html[data-skin="hilma"] .h-orbit-mark i:nth-child(2) { right:3px;bottom:9px; }
html[data-skin="hilma"] .h-orbit-mark i:nth-child(3) { left:5px;bottom:18px;background:var(--h-lavender); }

html[data-skin="hilma"] .h-sidebar nav { margin-top:10px; }

html[data-skin="hilma"] .h-sidebar a {
  display:flex;
  min-height:84px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:#eee3d2;
  border-top:1px solid rgba(255,255,255,.08);
  font-family:var(--mono);
  font-size:7px;
  letter-spacing:.09em;
  text-decoration:none;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-sidebar a.active { color:#e78b70; }
html[data-skin="hilma"] .h-sidebar a:hover { background:rgba(255,255,255,.05); }
html[data-skin="hilma"] .h-sidebar a i { font-family:var(--display);font-size:25px;font-style:normal;line-height:1; }

html[data-skin="hilma"] .h-place {
  display:flex;
  margin-top:auto;
  flex-direction:column;
  gap:4px;
  padding:18px 24px;
  border-top:1px solid rgba(255,255,255,.08);
  font-family:var(--mono);
  font-size:8px;
  letter-spacing:.09em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-place span { color:#bbb2a4; }

html[data-skin="hilma"] .h-updated {
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:16px 24px 24px;
  font-family:var(--mono);
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-updated > span { color:#bbb2a4;font-size:6px;letter-spacing:.14em; }
html[data-skin="hilma"] .h-updated time { color:#e7cf93;font-size:22px;letter-spacing:.1em; }
html[data-skin="hilma"] .h-updated small { font-size:7px;letter-spacing:.07em; }

html[data-skin="hilma"] .h-side-botanical {
  width:78px;
  height:150px;
  margin:0 auto 14px;
  fill:none;
  stroke:#aeb78f;
  stroke-width:1;
}

/* ============================================================= top bar */

html[data-skin="hilma"] .h-topbar {
  grid-column:2/-1;
  grid-row:1;
  display:flex;
  align-items:center;
  gap:18px;
  padding:0 330px 0 32px;
  border-bottom:1px solid var(--h-line);
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-report-title {
  display:flex;
  align-items:baseline;
  gap:8px;
  padding-right:22px;
  border-right:1px solid var(--h-line);
  font-family:var(--display);
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-report-title strong { font-size:24px;letter-spacing:.04em; }
html[data-skin="hilma"] .h-report-title span { color:var(--h-coral);font:8px var(--mono);letter-spacing:.18em; }

html[data-skin="hilma"] .h-location-label {
  padding-right:22px;
  border-right:1px solid var(--h-line);
  font-family:var(--display);
  font-size:20px;
  letter-spacing:.15em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-symbol-key { display:flex;gap:16px;margin-left:12px; }

html[data-skin="hilma"] .h-symbol-key i {
  position:relative;
  width:34px;
  height:34px;
  border:1px solid #bca991;
  border-radius:50%;
}

html[data-skin="hilma"] .h-symbol-key i::after {
  content:"";
  position:absolute;
  inset:9px;
  border:1px solid var(--h-ink);
  border-radius:50%;
}

html[data-skin="hilma"] .h-symbol-key i:nth-child(2)::after { border-radius:0;background:linear-gradient(135deg,transparent 50%,var(--h-ochre) 50%); }
html[data-skin="hilma"] .h-symbol-key i:nth-child(3)::after { box-shadow:0 0 0 5px var(--h-rose); }
html[data-skin="hilma"] .h-symbol-key i:nth-child(4)::after { border-radius:0;background:var(--h-ink);clip-path:polygon(50% 0,100% 100%,0 100%); }
html[data-skin="hilma"] .h-symbol-key i:nth-child(5)::after { border-radius:50% 0 50% 50%;background:var(--h-sage); }

/* ================================================================ hero */

html[data-skin="hilma"] .h-hero {
  position:relative;
  grid-column:2;
  grid-row:2;
  overflow:hidden;
  border-right:1px solid var(--h-line);
  background:var(--h-ivory);
}

html[data-skin="hilma"] .h-question {
  position:relative;
  z-index:4;
  padding:27px 0 0 34px;
}

html[data-skin="hilma"] .h-question > span {
  display:block;
  margin-bottom:9px;
  color:#8a7160;
  font:7px var(--mono);
  letter-spacing:.19em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-question h1 {
  max-width:510px;
  font-family:var(--display);
  font-size:clamp(46px,4.5vw,72px);
  font-weight:700;
  line-height:.82;
  letter-spacing:-.035em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-question h1 em { color:var(--h-coral);font-style:normal;font-weight:600; }

html[data-skin="hilma"] .h-sacred-geometry {
  position:absolute;
  top:48px;
  right:14%;
  width:185px;
  height:185px;
  border:1px dotted #c9a57f;
  border-radius:50%;
}

html[data-skin="hilma"] .h-sacred-geometry::before {
  content:"";
  position:absolute;
  inset:0;
  border-left:1px solid #c99471;
  border-bottom:1px solid #c99471;
  clip-path:polygon(50% 0,100% 100%,0 100%);
}

html[data-skin="hilma"] .h-sacred-geometry i {
  position:absolute;
  width:19px;
  height:19px;
  border:1px solid #a17d67;
  border-radius:50%;
}

html[data-skin="hilma"] .h-sacred-geometry i:nth-child(1) { left:-10px;bottom:-10px;background:var(--h-rose); }
html[data-skin="hilma"] .h-sacred-geometry i:nth-child(2) { right:-10px;bottom:-10px;background:var(--h-sage); }
html[data-skin="hilma"] .h-sacred-geometry i:nth-child(3) { left:calc(50% - 10px);top:-10px;background:var(--h-ochre); }

html[data-skin="hilma"] .h-botanical {
  position:absolute;
  right:2%;
  bottom:-12px;
  z-index:2;
  width:250px;
  height:180px;
  fill:none;
  stroke:#8c9c7d;
  stroke-width:1.5;
}

/* ============================================================= compass */

html[data-skin="hilma"] .h-compass {
  position:relative;
  grid-column:3;
  grid-row:2/4;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-bottom:1px solid var(--h-line);
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-compass::before,
html[data-skin="hilma"] .h-compass::after {
  content:"";
  position:absolute;
  width:min(84%,420px);
  aspect-ratio:1;
  border:1px dotted #b79e8f;
  border-radius:50%;
}

html[data-skin="hilma"] .h-compass::after { width:min(70%,350px);border-style:solid;border-color:#c07c63;box-shadow:0 0 0 8px var(--h-paper),0 0 0 10px var(--h-ochre); }

html[data-skin="hilma"] .h-compass-rings {
  position:absolute;
  width:min(96%,480px);
  aspect-ratio:1;
  border:1px dotted #b79e8f;
  border-radius:50%;
}

html[data-skin="hilma"] .h-compass-rings::before,
html[data-skin="hilma"] .h-compass-rings::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:112%;
  height:1px;
  background:linear-gradient(90deg,transparent,#c5aa91 15% 85%,transparent);
  transform:translate(-50%,-50%);
}

html[data-skin="hilma"] .h-compass-rings::after { transform:translate(-50%,-50%) rotate(90deg); }

html[data-skin="hilma"] .h-compass-rings i {
  position:absolute;
  width:15px;
  height:15px;
  border:1px solid #9f745c;
  border-radius:50%;
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-compass-rings i:nth-child(1) { top:7%;left:17%;background:var(--h-coral); }
html[data-skin="hilma"] .h-compass-rings i:nth-child(2) { top:8%;right:15%;border-color:var(--h-ochre); }
html[data-skin="hilma"] .h-compass-rings i:nth-child(3) { right:2%;bottom:21%;background:var(--h-lavender); }
html[data-skin="hilma"] .h-compass-rings i:nth-child(4) { left:4%;bottom:14%;background:var(--h-sage); }

html[data-skin="hilma"] .h-cardinal {
  position:absolute;
  z-index:4;
  font:10px var(--mono);
}

html[data-skin="hilma"] .h-n { top:18px;left:50%;transform:translateX(-50%); }
html[data-skin="hilma"] .h-e { right:18px;top:50%;transform:translateY(-50%); }
html[data-skin="hilma"] .h-s { bottom:16px;left:50%;transform:translateX(-50%); }
html[data-skin="hilma"] .h-w { left:18px;top:50%;transform:translateY(-50%); }

html[data-skin="hilma"] .h-compass-core {
  position:relative;
  z-index:5;
  display:flex;
  width:min(62%,310px);
  min-height:270px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px 16px;
  text-align:center;
}

html[data-skin="hilma"] .h-compass-core > span,
html[data-skin="hilma"] .h-compass-core > small { font:9px var(--mono);letter-spacing:.12em;text-transform:uppercase; }
html[data-skin="hilma"] .h-compass-core > strong { margin:7px 0 2px;font-family:var(--display);font-size:clamp(30px,3.2vw,49px);line-height:1; }

html[data-skin="hilma"] .h-compass-metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  width:115%;
  margin-top:15px;
  padding-top:12px;
  border-top:1px solid var(--h-line);
}

html[data-skin="hilma"] .h-compass-metrics > div { display:flex;min-width:0;flex-direction:column;padding:0 8px;border-right:1px solid var(--h-soft-line); }
html[data-skin="hilma"] .h-compass-metrics > div:last-child { border-right:0; }
html[data-skin="hilma"] .h-compass-metrics span { font:6px var(--mono);letter-spacing:.07em;text-transform:uppercase; }
html[data-skin="hilma"] .h-compass-metrics b { margin-top:3px;font-family:var(--display);font-size:22px;white-space:nowrap; }
html[data-skin="hilma"] .h-compass-metrics small { font:6px var(--mono); }

html[data-skin="hilma"] .h-compass-core > em {
  margin-top:13px;
  padding:4px 9px;
  border-radius:99px;
  background:var(--h-sage);
  font:8px var(--mono);
  font-style:normal;
  letter-spacing:.1em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-compass-core > p { margin-top:7px;font:7px var(--mono);letter-spacing:.08em;text-transform:uppercase; }
html[data-skin="hilma"] .hilma-stage[data-tier="marginal"] .h-compass-core > em { background:var(--h-ochre); }
html[data-skin="hilma"] .hilma-stage[data-tier="unlikely"] .h-compass-core > em { background:var(--h-rose); }

/* ======================================================== live readings */

html[data-skin="hilma"] .h-live {
  grid-column:2;
  grid-row:3;
  border-top:1px solid var(--h-line);
  border-right:1px solid var(--h-line);
  border-bottom:1px solid var(--h-line);
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-section-title {
  display:flex;
  min-height:36px;
  align-items:center;
  gap:8px;
  padding:8px 28px;
  border-bottom:1px solid var(--h-line);
  font-family:var(--display);
  font-size:15px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}

html[data-skin="hilma"] .h-section-title::after { content:"";height:1px;flex:1;background:var(--h-line); }
html[data-skin="hilma"] .h-section-title span { order:2;font:7px var(--mono); }

html[data-skin="hilma"] .h-live-grid { display:grid;grid-template-columns:repeat(4,1fr); }

html[data-skin="hilma"] .h-live-grid > div {
  display:grid;
  grid-template-columns:45px 1fr auto;
  grid-template-rows:auto 1fr;
  min-height:112px;
  align-items:center;
  padding:12px 14px;
  border-right:1px solid var(--h-line);
}

html[data-skin="hilma"] .h-live-grid > div:last-child { border-right:0; }

html[data-skin="hilma"] .h-live-grid i {
  grid-row:1/3;
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:50%;
  background:var(--h-sage);
  font-family:var(--display);
  font-size:18px;
  font-style:normal;
}

html[data-skin="hilma"] .h-live-grid i.rose { background:var(--h-rose); }
html[data-skin="hilma"] .h-live-grid i.coral { background:#e5b0ad; }
html[data-skin="hilma"] .h-live-grid i.lavender { background:var(--h-lavender); }
html[data-skin="hilma"] .h-live-grid i.ochre { background:var(--h-ochre); }
html[data-skin="hilma"] .h-live-grid span { grid-column:2/4;align-self:start;font:8px var(--mono);letter-spacing:.07em;text-transform:uppercase; }
html[data-skin="hilma"] .h-live-grid strong { align-self:end;font-family:var(--display);font-size:clamp(30px,3vw,45px);font-weight:500;line-height:.8; }
html[data-skin="hilma"] .h-live-grid small { align-self:end;padding-bottom:2px;font:7px var(--mono); }
html[data-skin="hilma"] .h-live > p { padding:6px 16px;border-top:1px solid var(--h-soft-line);font:6px var(--mono);letter-spacing:.07em;text-transform:uppercase; }

/* ====================================================== hourly forecast */

html[data-skin="hilma"] .h-hours-panel {
  grid-column:2/-1;
  grid-row:4;
  overflow:hidden;
  border-bottom:1px solid var(--h-line);
  background:var(--h-ivory);
}

html[data-skin="hilma"] .h-hours { display:grid;grid-template-columns:repeat(10,minmax(112px,1fr));overflow-x:auto; }

html[data-skin="hilma"] .h-hour {
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:auto 38px auto auto;
  min-height:157px;
  align-content:start;
  padding:10px 8px 8px;
  border-right:1px solid var(--h-line);
  font-family:var(--mono);
  font-size:7px;
  text-align:center;
}

html[data-skin="hilma"] .h-hour:last-child { border-right:0; }
html[data-skin="hilma"] .h-hour time { grid-column:1/-1;font-family:var(--display);font-size:16px;font-weight:600; }

html[data-skin="hilma"] .h-hour > i {
  grid-column:1/-1;
  align-self:center;
  justify-self:center;
  display:grid;
  width:30px;
  height:30px;
  place-items:center;
  border-radius:50%;
  background:var(--h-lavender);
  font-size:10px;
  font-style:normal;
  transform:rotate(45deg);
}

html[data-skin="hilma"] .h-hour strong { align-self:end;font-family:var(--display);font-size:18px; }
html[data-skin="hilma"] .h-hour strong small { margin-left:2px;font:6px var(--mono); }
html[data-skin="hilma"] .h-hour > span { align-self:end;font-size:6px;text-transform:uppercase; }
html[data-skin="hilma"] .h-hour > b,
html[data-skin="hilma"] .h-hour > em { padding-top:5px;border-top:1px solid var(--h-soft-line);font-size:8px;font-style:normal; }
html[data-skin="hilma"] .h-hour.good > i { background:var(--h-coral); }
html[data-skin="hilma"] .h-hour.marginal > i { background:var(--h-ochre); }
html[data-skin="hilma"] .h-hour.unlikely > i { background:var(--h-lavender); }

html[data-skin="hilma"] .h-hour.selected::before {
  content:"✦";
  position:absolute;
  inset:-1px 3px 3px;
  padding-top:0;
  border:1px solid var(--h-ink);
  border-radius:13px;
  color:var(--h-ink);
  pointer-events:none;
}

html[data-skin="hilma"] .h-empty { grid-column:1/-1;padding:36px;font:8px var(--mono);text-transform:uppercase; }

/* ===================================================== history + system */

html[data-skin="hilma"] .h-history {
  grid-column:2;
  grid-row:5;
  position:relative;
  border-right:1px solid var(--h-line);
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-history-control { position:absolute;top:4px;right:18px;z-index:3;display:flex;align-items:center;gap:7px; }
html[data-skin="hilma"] .h-history-control label { font:6px var(--mono);text-transform:uppercase; }
html[data-skin="hilma"] .h-history-control select { min-height:27px;padding:3px 7px;border:1px solid var(--h-line);background:transparent;color:inherit;font:7px var(--mono); }
html[data-skin="hilma"] .h-history-chart { height:176px;padding:8px 18px 0; }
html[data-skin="hilma"] .h-history > p { padding:5px 22px;font:6px var(--mono);letter-spacing:.05em;text-transform:uppercase; }

html[data-skin="hilma"] .h-system {
  position:relative;
  grid-column:3;
  grid-row:5;
  overflow:hidden;
  background:var(--h-paper);
}

html[data-skin="hilma"] .h-system-rows { width:70%;padding:4px 20px 0; }

html[data-skin="hilma"] .h-system-rows > div {
  display:grid;
  grid-template-columns:38px 1fr auto;
  grid-template-rows:auto auto;
  min-height:58px;
  align-items:center;
  border-bottom:1px solid var(--h-soft-line);
}

html[data-skin="hilma"] .h-system-rows i { grid-row:1/3;display:grid;width:29px;height:29px;place-items:center;border-radius:50%;background:var(--h-sage);font-style:normal; }
html[data-skin="hilma"] .h-system-rows span { font:8px var(--mono);letter-spacing:.05em;text-transform:uppercase; }
html[data-skin="hilma"] .h-system-rows strong { color:var(--h-green);font:9px var(--mono);text-transform:uppercase; }
html[data-skin="hilma"] .h-system-rows small { grid-column:2/4;color:#8a8176;font:6px var(--mono);text-transform:uppercase; }

html[data-skin="hilma"] .h-system-art {
  position:absolute;
  right:20px;
  bottom:18px;
  width:116px;
  height:150px;
  border:1px dotted #c39a81;
  border-radius:50% 50% 12px 12px;
}

html[data-skin="hilma"] .h-system-art::before,
html[data-skin="hilma"] .h-system-art::after {
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
}

html[data-skin="hilma"] .h-system-art::before { top:14px;width:1px;height:120px;background:#c39a81; }
html[data-skin="hilma"] .h-system-art::after { bottom:18px;width:62px;height:62px;border:1px solid var(--h-line);border-radius:50%; }

html[data-skin="hilma"] .h-system-art i { position:absolute;width:11px;height:11px;border-radius:50%;background:var(--h-rose); }
html[data-skin="hilma"] .h-system-art i:nth-child(1) { top:-5px;left:calc(50% - 5px); }
html[data-skin="hilma"] .h-system-art i:nth-child(2) { left:-5px;bottom:14px;background:var(--h-coral); }
html[data-skin="hilma"] .h-system-art i:nth-child(3) { right:-5px;bottom:14px;background:var(--h-lavender); }

/* ======================================================== shared detail */

html[data-skin="hilma"] .dashboard-console {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:0;
  padding-left:128px;
  background:var(--h-ivory);
}

html[data-skin="hilma"] .dashboard-console > * { min-width:0;margin-top:0; }
html[data-skin="hilma"] .panel-forecast,
html[data-skin="hilma"] .panel-day-wind,
html[data-skin="hilma"] .panel-history,
html[data-skin="hilma"] .panel-meteoswiss,
html[data-skin="hilma"] .panel-health,
html[data-skin="hilma"] .panel-reference,
html[data-skin="hilma"] .panel-viz,
html[data-skin="hilma"] .panel-tech { grid-column:span 12; }
html[data-skin="hilma"] .panel-summary { grid-column:span 7; }
html[data-skin="hilma"] .panel-outlook { grid-column:span 5; }
html[data-skin="hilma"] .panel-water { grid-column:span 4; }
html[data-skin="hilma"] .panel-live { grid-column:span 8; }
html[data-skin="hilma"] .panel-eval { grid-column:span 7; }
html[data-skin="hilma"] .panel-ablation { grid-column:span 5; }

html[data-skin="hilma"] .card,
html[data-skin="hilma"] details.tech {
  padding:22px;
  border:0;
  border-right:1px solid var(--h-line);
  border-bottom:1px solid var(--h-line);
  border-radius:0;
  background:var(--h-paper);
  box-shadow:none;
}

html[data-skin="hilma"] .card:nth-of-type(4n+1) { background:#f0e8dc; }
html[data-skin="hilma"] .card:nth-of-type(4n+2) { background:#e9e9df; }
html[data-skin="hilma"] .section-head { margin:-22px -22px 17px;padding:11px 18px;border-bottom:1px solid var(--h-line); }
html[data-skin="hilma"] .section-head h2 { font-family:var(--display);font-size:19px;text-transform:uppercase; }
html[data-skin="hilma"] .hint,
html[data-skin="hilma"] .section-head .hint { color:#776e63;font:7px var(--mono);letter-spacing:.08em;text-transform:uppercase; }
html[data-skin="hilma"] .forecast-grid { grid-template-columns:repeat(5,minmax(110px,1fr));gap:8px; }
html[data-skin="hilma"] .fc-card { border:1px solid var(--h-line);border-radius:12px;background:var(--h-ivory); }
html[data-skin="hilma"] .fc-card.recommended { color:var(--h-ink);border-color:var(--h-ink);background:#f0dfcf;box-shadow:inset 0 5px var(--h-coral); }
html[data-skin="hilma"] .fc-card.recommended .fc-time,
html[data-skin="hilma"] .fc-card.recommended .fc-pct-label,
html[data-skin="hilma"] .fc-card.recommended .fc-wind { color:var(--h-ink); }
html[data-skin="hilma"] .chart-box,
html[data-skin="hilma"] .viz-box,
html[data-skin="hilma"] .day-wind-chart,
html[data-skin="hilma"] .history-chart { border:1px solid var(--h-soft-line);background:rgba(251,247,238,.6); }
html[data-skin="hilma"] details.tech { padding:0; }
html[data-skin="hilma"] details.tech > summary { background:var(--h-charcoal);color:var(--h-paper); }
html[data-skin="hilma"] .tech-body { background:var(--h-paper); }
html[data-skin="hilma"] footer { margin:0 0 0 128px;padding:22px;border-right:1px solid var(--h-line);border-bottom:1px solid var(--h-line);background:var(--h-rose);font:8px var(--mono); }

html[data-skin="hilma"] .location-dialog { border-radius:0;background:var(--h-paper); }
html[data-skin="hilma"] .location-option { border-radius:0;background:var(--h-ivory); }

/* ============================================================ responsive */

@media (max-width:1180px) {
  html[data-skin="hilma"] .hilma-stage { grid-template-columns:98px minmax(0,1fr) 410px; }
  html[data-skin="hilma"] .h-topbar { padding-left:22px;padding-right:310px; }
  html[data-skin="hilma"] .h-location-label { font-size:16px; }
  html[data-skin="hilma"] .h-symbol-key { display:none; }
  html[data-skin="hilma"] .h-question { padding-left:24px; }
  html[data-skin="hilma"] .h-question h1 { font-size:52px; }
  html[data-skin="hilma"] .h-sacred-geometry { right:5%; }
  html[data-skin="hilma"] .h-live-grid > div { grid-template-columns:37px 1fr auto;padding:10px 8px; }
  html[data-skin="hilma"] .h-live-grid i { width:29px;height:29px; }
  html[data-skin="hilma"] .h-system-rows { width:66%;padding-left:12px; }
  html[data-skin="hilma"] .h-system-art { right:10px;width:105px; }
  html[data-skin="hilma"] .dashboard-console { padding-left:98px; }
  html[data-skin="hilma"] footer { margin-left:98px; }
}

@media (max-width:900px) {
  html[data-skin="hilma"] .wrap { padding-top:48px; }

  html[data-skin="hilma"] .skin-toggle {
    position:absolute;
    top:7px;
    right:7px;
    left:7px;
    display:flex;
    overflow-x:auto;
    border:1px solid var(--h-line);
    background:var(--h-paper);
  }

  html[data-skin="hilma"] .skin-toggle::before { display:none; }
  html[data-skin="hilma"] .skin-toggle button {
    width:auto;
    min-width:54px;
    min-height:34px;
    flex:1 0 auto;
    margin:0;
    color:var(--h-ink);
    border:0;
    border-right:1px solid var(--h-line);
    border-radius:0;
    font-size:7px;
  }

  html[data-skin="hilma"] .skin-toggle button::after { display:none; }
  html[data-skin="hilma"] .skin-toggle button.active { color:var(--h-paper);background:var(--h-charcoal);box-shadow:inset 0 -3px var(--h-coral); }

  html[data-skin="hilma"] .hilma-stage {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto;
    min-height:0;
  }

  html[data-skin="hilma"] .h-sidebar {
    position:sticky;
    top:0;
    z-index:60;
    grid-column:1;
    grid-row:auto;
    display:grid;
    grid-template-columns:52px 1fr;
    border-right:0;
    border-bottom:1px solid var(--h-ink);
  }

  html[data-skin="hilma"] .h-orbit-mark { width:34px;height:34px;margin:10px 9px;background:none; }
  html[data-skin="hilma"] .h-orbit-mark::after { width:15px;height:15px; }
  html[data-skin="hilma"] .h-orbit-mark i,
  html[data-skin="hilma"] .h-place,
  html[data-skin="hilma"] .h-updated,
  html[data-skin="hilma"] .h-side-botanical { display:none; }
  html[data-skin="hilma"] .h-sidebar nav { display:grid;grid-template-columns:repeat(4,1fr);margin:0; }
  html[data-skin="hilma"] .h-sidebar a { min-height:54px;flex-direction:row;gap:4px;border-top:0;border-left:1px solid rgba(255,255,255,.08);font-size:6px; }
  html[data-skin="hilma"] .h-sidebar a i { font-size:15px; }

  html[data-skin="hilma"] .h-topbar,
  html[data-skin="hilma"] .h-hero,
  html[data-skin="hilma"] .h-compass,
  html[data-skin="hilma"] .h-live,
  html[data-skin="hilma"] .h-hours-panel,
  html[data-skin="hilma"] .h-history,
  html[data-skin="hilma"] .h-system {
    grid-column:1;
    grid-row:auto;
    border-right:0;
  }

  html[data-skin="hilma"] .h-topbar { min-height:70px;padding:0 18px;gap:12px; }
  html[data-skin="hilma"] .h-report-title strong { font-size:20px; }
  html[data-skin="hilma"] .h-location-label { margin-left:auto;padding-right:0;border-right:0;font-size:11px;letter-spacing:.08em; }
  html[data-skin="hilma"] .h-hero { min-height:420px; }
  html[data-skin="hilma"] .h-question { padding:52px 20px 0; }
  html[data-skin="hilma"] .h-question h1 { font-size:clamp(48px,14vw,67px); }
  html[data-skin="hilma"] .h-sacred-geometry { top:185px;right:16%;width:210px;height:210px; }
  html[data-skin="hilma"] .h-botanical { right:-25px;bottom:-8px; }
  html[data-skin="hilma"] .h-compass { min-height:500px; }
  html[data-skin="hilma"] .h-compass::before { width:88%; }
  html[data-skin="hilma"] .h-compass::after { width:73%; }
  html[data-skin="hilma"] .h-compass-rings { width:98%; }
  html[data-skin="hilma"] .h-compass-core { width:62%;min-height:230px;padding:14px 5px; }
  html[data-skin="hilma"] .h-compass-metrics { width:126%; }
  html[data-skin="hilma"] .h-live-grid { grid-template-columns:1fr 1fr; }
  html[data-skin="hilma"] .h-live-grid > div { min-height:110px;border-bottom:1px solid var(--h-line); }
  html[data-skin="hilma"] .h-live-grid > div:nth-child(2) { border-right:0; }
  html[data-skin="hilma"] .h-hours { grid-template-columns:repeat(10,118px); }
  html[data-skin="hilma"] .h-hour { min-height:160px; }
  html[data-skin="hilma"] .h-history { min-height:275px; }
  html[data-skin="hilma"] .h-history-chart { height:210px; }
  html[data-skin="hilma"] .h-system { min-height:245px; }
  html[data-skin="hilma"] .h-system-rows { width:70%; }
  html[data-skin="hilma"] .dashboard-console { padding-left:0; }
  html[data-skin="hilma"] .panel-summary,
  html[data-skin="hilma"] .panel-outlook,
  html[data-skin="hilma"] .panel-water,
  html[data-skin="hilma"] .panel-live,
  html[data-skin="hilma"] .panel-eval,
  html[data-skin="hilma"] .panel-ablation { grid-column:span 12; }
  html[data-skin="hilma"] .forecast-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-skin="hilma"] footer { margin-left:0; }

  html[data-skin="hilma"] #hHero,
  html[data-skin="hilma"] #h-hours-h,
  html[data-skin="hilma"] #h-history-h,
  html[data-skin="hilma"] #h-system-h { scroll-margin-top:54px; }
}

@media (max-width:480px) {
  html[data-skin="hilma"] .h-sidebar a span { display:none; }
  html[data-skin="hilma"] .h-live-grid strong { font-size:32px; }
  html[data-skin="hilma"] .h-system-rows { width:68%;padding-right:4px; }
  html[data-skin="hilma"] .h-system-art { right:4px;width:92px; }
}

@media (prefers-reduced-motion:reduce) {
  html[data-skin="hilma"] *,
  html[data-skin="hilma"] *::before,
  html[data-skin="hilma"] *::after {
    animation:none;
    transition:none;
    scroll-behavior:auto;
  }
}

@media (forced-colors:active) {
  html[data-skin="hilma"] .hilma-stage,
  html[data-skin="hilma"] .hilma-stage > *,
  html[data-skin="hilma"] .card,
  html[data-skin="hilma"] details.tech,
  html[data-skin="hilma"] .h-hour,
  html[data-skin="hilma"] .h-live-grid > div {
    border-color:CanvasText;
    background:Canvas;
    color:CanvasText;
  }
}