/* The desk, your computer in the cloud, worn through Kaleidoscope's HERE lens. Every value is a Kaleidoscope token,
   from glass.css and lens-here.css: the page sets <html class="ink" data-lens="here">, so the night ground stays.
   The old house sheet and the page's own style are gone; the structure, class names and script are unchanged. */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--ground);
  color: var(--ink);
  font: 400 var(--t-m)/var(--lh-m) var(--f-ui);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-wrap: anywhere;
}
::selection { background: var(--pick); color: var(--on-pick); }
::-moz-selection { background: var(--pick); color: var(--on-pick); }
a { color: var(--ink); }
a:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
a[href^="http"]:not([href*="hereandmore.com"])::after {
  content: " \2197";
  color: var(--ink-2);
  font-size: var(--t-xs);
  text-decoration: none;
}
a[href^="http"]:not([href*="hereandmore.com"]):hover { text-decoration-color: var(--ink); }
[hidden] { display: none !important; }

/* the page */
.wrap {
  width: 100%;
  max-width: 560px;
  min-width: 0;
  margin: 0 auto;
  padding:
    max(var(--s6), env(safe-area-inset-top))
    max(var(--s4), env(safe-area-inset-right))
    max(var(--s8), env(safe-area-inset-bottom))
    max(var(--s4), env(safe-area-inset-left));
}
.cloud { min-width: 0; }
.top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--s3);
  margin-bottom: var(--s4);
}
.top h1 {
  margin: 0;
  min-width: 0;
  font: 400 var(--t-d1)/var(--lh-d1) var(--f-voice);
  letter-spacing: -.01em;
}
.top a {
  font: 400 var(--t-s)/var(--lh-s) var(--f-ui);
  color: var(--ink-2);
  text-decoration: none;
}
.top a:hover { color: var(--ink); }
.lede {
  margin: 0 0 var(--s5);
  max-width: 100%;
  color: var(--ink-2);
  font: 400 var(--t-m)/var(--lh-m) var(--f-ui);
}
.say {
  min-height: var(--lh-s);
  margin: var(--s3) var(--s1) 0;
  color: var(--ink-2);
  font: 400 var(--t-s)/var(--lh-s) var(--f-ui);
}
.note {
  border: 0;
  border-radius: var(--r2);
  padding: var(--s4);
  background: var(--surface);
  box-shadow: var(--ring);
  color: var(--ink-2);
  font: 400 var(--t-s)/var(--lh-s) var(--f-ui);
}
.note a { color: var(--ink); font-weight: 600; text-underline-offset: var(--s1); }

/* the window a desk opens in */
.hwin {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  background: var(--ground);
  padding:
    max(var(--s3), env(safe-area-inset-top))
    var(--s3)
    max(var(--s3), env(safe-area-inset-bottom));
  animation: sheetin var(--d-rise) var(--spring) both;
}
@keyframes sheetin { from { opacity: 0; transform: translateY(4%); } to { opacity: 1; transform: none; } }
.hwin-bar {
  display: flex;
  align-items: center;
  gap: var(--s2);
  min-width: 0;
  padding: var(--s2) var(--s1) var(--s3);
  flex-wrap: nowrap;
  overflow-x: auto;
}
.hwin-tabs { min-width: 0; flex: 1 1 auto; }
.hwin-tab {
  flex: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  min-height: var(--h-s);
  font: 600 var(--t-s)/var(--lh-s) var(--f-ui);
  color: var(--ink);
  background: var(--tint);
  border: 0;
  box-shadow: var(--ring-2);
  border-radius: var(--r-pill);
  padding: var(--s2) var(--s3);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.hwin-tab.live { color: var(--on-ink); background: var(--light); box-shadow: none; }
.hwin-tab .tx { margin-left: var(--s1); color: var(--on-ink); font-weight: 600; padding: 0 var(--s1); }
.hwin-act { flex: none; margin-left: auto; display: flex; gap: var(--s2); }
.hwin-act a, .hwin-act button {
  font: 600 var(--t-s)/var(--lh-s) var(--f-ui);
  color: var(--ink);
  background: var(--tint);
  border: 0;
  box-shadow: var(--ring-2);
  border-radius: var(--r-pill);
  padding: var(--s2) var(--s3);
  min-height: var(--h-s);
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.hwin-frame {
  flex: 1;
  min-height: 0;
  min-width: 0;
  border: 0;
  border-radius: var(--r2);
  overflow: hidden;
  background: var(--sunk);
  box-shadow: var(--ring-2);
}
.hwin-frame iframe { width: 100%; height: 100%; border: 0; display: none; background: var(--sunk); }
.hwin-frame iframe.live { display: block; }
.hwin.away { animation: sheetout var(--d-micro) var(--ease) both; }
@keyframes sheetout { to { opacity: 0; transform: translateY(3%); } }
.hwin-tab:focus-visible, .hwin-act a:focus-visible, .hwin-act button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.hwin-tab.live:focus-visible { outline-color: var(--on-ink); }

/* the card's own voice, once the foundation's names are gone */
.h-scope { color: var(--ink); font: 400 var(--t-m)/var(--lh-m) var(--f-ui); }
.h-scope .cbtn { margin: 0; }

@keyframes h-mat {
  from { opacity: 0; transform: translateY(var(--s1)) scale(.985); }
  to { opacity: 1; transform: none; }
}
@keyframes h-ring {
  0% { transform: scale(.62); opacity: .5; }
  70% { opacity: 0; }
  100% { transform: scale(1.5); opacity: 0; }
}
@keyframes h-hat {
  0%, 100% { transform: perspective(60px) rotateX(58deg) scale(1); opacity: .82; }
  50% { transform: perspective(60px) rotateX(58deg) scale(1.07); opacity: 1; }
}
@keyframes h-orb-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

.h-card {
  position: relative;
  min-width: 0;
  border: 0;
  border-radius: var(--r2);
  overflow: hidden;
  background: var(--surface);
  box-shadow: var(--ring), var(--shadow);
  animation: h-mat var(--d-rise) var(--ease) both;
  container-type: inline-size;
  container-name: hcard;
}

.h-k {
  font: 600 var(--t-xs)/var(--lh-xs) var(--f-mono);
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ink-2);
  white-space: nowrap;
}
.h-meta {
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink-2);
  letter-spacing: .012em;
  font-variant-numeric: tabular-nums;
}
.h-say {
  font: 400 var(--t-xs)/var(--lh-xs) var(--f-ui);
  color: var(--ink-2);
  max-width: 46em;
}
.h-title {
  font: 500 var(--t-m)/var(--lh-m) var(--f-ui);
  color: var(--ink);
}
.h-display {
  font: 500 var(--t-d1)/var(--lh-d1) var(--f-ui);
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}
.h-display.lit { color: var(--ink); }

.h-btn {
  appearance: none;
  -webkit-tap-highlight-color: transparent;
  min-height: var(--h-xs);
  height: auto;
  padding: 0 var(--s2);
  border-radius: var(--r0);
  border: 0;
  background: var(--tint);
  box-shadow: var(--ring);
  color: var(--ink);
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-ui);
  cursor: pointer;
  flex: none;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s1);
  max-width: 100%;
  transition:
    background var(--d-micro) var(--ease),
    transform var(--d-press) var(--spring),
    box-shadow var(--d-micro) var(--ease),
    opacity var(--d-micro) var(--ease);
}
.h-btn.pri {
  background: var(--cta);
  color: var(--cta-ink);
  box-shadow: var(--cta-shadow);
  font-weight: 600;
}
.h-btn[disabled], .h-btn[aria-disabled="true"] {
  opacity: 1;
  color: var(--ink-2);
  cursor: not-allowed;
  pointer-events: none;
}
.h-seg {
  display: inline-flex;
  align-items: stretch;
  flex-wrap: wrap;
  max-width: 100%;
  border: 0;
  border-radius: var(--r0);
  overflow: hidden;
  box-shadow: var(--ring);
  flex: none;
}
.h-seg .h-btn { border-radius: 0; box-shadow: none; background: var(--tint); }
.h-seg .h-btn + .h-btn { box-shadow: inset 1px 0 0 var(--line-2); }
/* open and door sit together in the running section, so neither one is the metal */
.h-seg .h-btn.pri, .h-row .h-btn.pri {
  background: var(--light);
  color: var(--on-ink);
  font-weight: 600;
}
/* a light hairline vanishes on the light fill, so a primary takes a dark seam */
.h-seg .h-btn + .h-btn.pri { box-shadow: inset 1px 0 0 color-mix(in srgb, var(--on-ink) 55%, transparent); }
.h-seg .h-btn:focus-visible { position: relative; z-index: 1; }
.h-btn:focus-visible, .h-sum:focus-visible, .h-menu-item:focus-visible, .h-ws:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}
.h-btn.pri:focus-visible, .h-seg .h-btn.pri:focus-visible { outline-color: var(--on-ink); }

.h-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--s1);
  max-width: 100%;
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink);
  border: 0;
  border-radius: var(--r0);
  padding: var(--s1) var(--s2);
  font-variant-numeric: tabular-nums;
  background: var(--tint);
  box-shadow: var(--ring);
  overflow-wrap: anywhere;
}
.h-chip .lb {
  color: var(--ink-2);
  font-size: var(--t-xs);
  line-height: var(--lh-xs);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.h-chip.ok {
  color: var(--ok);
  background: var(--ok-soft);
  box-shadow: inset 0 0 0 1px var(--ok);
}
kbd.h-key {
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink-2);
  cursor: default;
  border: 0;
  border-radius: var(--r0);
  padding: var(--s1) var(--s2);
  letter-spacing: .012em;
  background: var(--tint);
  box-shadow: var(--ring);
}

.h-pulse { position: relative; width: var(--s2); height: var(--s2); flex: none; display: inline-block; }
.h-pulse .dot {
  position: absolute;
  inset: 0;
  border-radius: var(--r-pill);
  background: var(--ok);
}
.h-pulse .rng {
  position: absolute;
  inset: 0;
  border-radius: var(--r-pill);
  border: 1px solid var(--ok);
  animation: h-ring var(--d-fade) var(--ease) infinite;
}

.h-band {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--s3);
  padding: var(--s5) var(--s4) var(--s2);
}
.h-rows { display: grid; position: relative; min-width: 0; }
.h-rows::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--line-2);
}
.h-row {
  position: relative;
  display: grid;
  grid-template-columns: var(--s4) minmax(0, 1fr) var(--s8) var(--s8) max-content auto;
  align-items: center;
  gap: 0 var(--s3);
  padding: var(--s2) var(--s4);
  min-height: var(--s7);
  min-width: 0;
  animation: h-mat var(--d-rise) var(--ease) both;
  transition: background var(--d-micro) var(--ease);
}
.h-row + .h-row::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--s4);
  right: var(--s4);
  height: 1px;
  background: var(--line);
}
.h-rows .h-row:nth-child(2) { animation-delay: calc(var(--d-step) * 2); }
.h-rows .h-row:nth-child(3) { animation-delay: calc(var(--d-step) * 4); }
.h-row.on { background: var(--ok-soft); }
.h-row.on::after {
  content: "";
  position: absolute;
  left: 0;
  top: var(--s2);
  bottom: var(--s2);
  width: 2px;
  border-radius: var(--r-pill);
  background: var(--ok);
}
.h-g { grid-column: 1; display: flex; align-items: center; }
.h-g .caret {
  font-style: normal;
  color: var(--ink-2);
  font-size: var(--t-xs);
  line-height: var(--lh-xs);
  display: inline-block;
  transition: transform var(--d-dur) var(--ease);
}
.h-who {
  grid-column: 2;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--s2);
  padding: var(--s2) 0;
}
.h-who .nm {
  font: 500 var(--t-s)/var(--lh-s) var(--f-ui);
  color: var(--ink);
  overflow-wrap: anywhere;
}
.h-specs { display: flex; gap: var(--s1); flex-wrap: wrap; min-width: 0; max-width: 100%; }
.h-specs .sp {
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink-2);
  border: 0;
  border-radius: var(--r0);
  padding: var(--s1) var(--s2);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
  max-width: 100%;
  background: var(--tint);
  box-shadow: var(--ring);
}
.h-time { grid-column: 3; text-align: right; }
.h-val { grid-column: 4; text-align: right; }
.h-unit { grid-column: 5; }
.h-time, .h-unit {
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.h-val {
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.h-acts {
  grid-column: 6;
  display: flex;
  align-items: center;
  gap: var(--s2);
  justify-content: flex-end;
  flex: none;
  min-width: 0;
  max-width: 100%;
}

.h-more { position: relative; min-width: 0; }
.h-more::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--line-2);
}
.h-sum {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--s3);
  padding: var(--s3) var(--s4);
  min-height: var(--reach);
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: transparent;
  font: inherit;
  color: inherit;
  transition: background var(--d-micro) var(--ease);
}
.h-sum::-webkit-details-marker { display: none; }
.h-sum::marker { content: none; }
.h-more[open] .h-sum .caret { transform: rotate(90deg); }

.h-bar {
  position: relative;
  height: var(--s1);
  border-radius: var(--r-pill);
  overflow: hidden;
  background: var(--tint);
}
.h-bar .fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: var(--r-pill);
  background: var(--c1);
}

.h-menu {
  min-width: 0;
  width: max-content;
  max-width: 100%;
  padding: var(--s1);
  border: 0;
  border-radius: var(--r1);
  background: var(--raised);
  box-shadow: var(--ring), var(--shadow-pop);
  color: var(--ink);
  animation: h-mat var(--d-micro) var(--ease) both;
}
.h-menu-item {
  display: flex;
  align-items: center;
  gap: var(--s2);
  width: 100%;
  min-height: var(--h-s);
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ink-2);
  cursor: pointer;
  text-align: left;
  font: 400 var(--t-s)/var(--lh-s) var(--f-ui);
  padding: var(--s2) var(--s3);
  border-radius: var(--r0);
  overflow-wrap: anywhere;
  transition: background var(--d-micro) var(--ease), color var(--d-micro) var(--ease);
}
.h-menu-item[aria-checked="true"] { color: var(--ink); }
.h-menu-item[aria-checked="true"]::after {
  content: "\2713";
  margin-left: auto;
  color: var(--ink);
  font-size: var(--t-xs);
}

.h-glyph {
  position: relative;
  display: inline-block;
  width: var(--h-xs);
  height: var(--h-xs);
  flex: none;
  vertical-align: middle;
}
.h-glyph canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.h-glyph::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--r-pill);
  border: 2px solid var(--ink-2);
  opacity: .6;
  box-shadow: var(--glow);
  animation: h-orb-breathe var(--d-turn) var(--ease) infinite;
  transition: opacity var(--d-micro) var(--ease);
}
.h-glyph.mounted::before { opacity: 0; pointer-events: none; }
.h-glyph.\68 alo::after {
  content: "";
  position: absolute;
  left: 6%;
  right: 6%;
  top: -28%;
  height: 36%;
  border-radius: var(--r-pill);
  border: 2px solid var(--light);
  box-shadow: var(--glow);
  transform: perspective(60px) rotateX(58deg);
  transform-origin: 50% 100%;
  animation: h-hat var(--d-turn) var(--ease) infinite;
  pointer-events: none;
}
.h-orb {
  position: relative;
  display: inline-block;
  width: var(--h-xs);
  height: var(--h-xs);
  flex: none;
  border-radius: var(--r-pill);
  border: 0;
  padding: 0;
  vertical-align: middle;
  background: radial-gradient(circle at 35% 32%, var(--core), var(--light) 58%, var(--ink-2));
  box-shadow: var(--glow);
  animation: h-orb-breathe var(--d-turn) var(--ease) infinite;
}
.h-orb.\68 alo::after {
  content: "";
  position: absolute;
  left: 2%;
  right: 2%;
  top: -30%;
  height: 38%;
  border-radius: var(--r-pill);
  border: 2px solid var(--light);
  box-shadow: var(--glow);
  transform: perspective(60px) rotateX(58deg);
  transform-origin: 50% 100%;
  animation: h-hat var(--d-turn) var(--ease) infinite;
  pointer-events: none;
}

.h-head { position: relative; padding: var(--s5) var(--s4) var(--s4); min-width: 0; }
.h-brow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--s3);
  min-height: var(--h-s);
  position: relative;
  min-width: 0;
}
.h-big {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--s2);
  margin-top: var(--s4);
  min-width: 0;
}
.h-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2);
  margin-top: var(--s4);
  max-width: 100%;
}
.h-ws {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  min-height: var(--h-s);
  max-width: 100%;
  padding: 0 var(--s3);
  border-radius: var(--r0);
  border: 0;
  background: var(--tint);
  box-shadow: var(--ring);
  color: var(--ink);
  cursor: pointer;
  flex: none;
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-ui);
  -webkit-tap-highlight-color: transparent;
  transition: background var(--d-micro) var(--ease), transform var(--d-press) var(--spring);
}
.h-ws b { font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.h-ws .cv { color: var(--ink-2); font-size: var(--t-xs); line-height: var(--lh-xs); }
.h-info { position: relative; padding: var(--s4); min-width: 0; }
.h-info::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--s4);
  right: var(--s4);
  height: 1px;
  background: var(--line);
}
.h-spend {
  display: flex;
  align-items: flex-end;
  gap: var(--s1);
  height: var(--h-m);
  margin-top: var(--s3);
  position: relative;
  min-width: 0;
}
.h-spend::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--line);
}
.h-spend .bar {
  flex: 1;
  min-width: 0;
  min-height: var(--s2);
  border-radius: var(--r0) var(--r0) 0 0;
  background: var(--c1);
}
.h-spend .nil {
  flex: 1;
  min-width: 0;
  height: 1px;
  border-radius: var(--r-pill);
  background: var(--line-2);
}
.h-days { display: flex; gap: var(--s1); margin-top: var(--s2); min-width: 0; }
.h-days span {
  flex: 1;
  min-width: 0;
  text-align: center;
  font: 500 var(--t-xs)/var(--lh-xs) var(--f-mono);
  color: var(--ink-2);
  overflow-wrap: anywhere;
}
.h-days span.now { color: var(--ink); }
.h-foot {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--s3);
  flex-wrap: wrap;
  padding: var(--s3) var(--s4) var(--s4);
  min-width: 0;
}
.h-foot::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--s4);
  right: var(--s4);
  height: 1px;
  background: var(--line);
}

@media (hover: hover) and (pointer: fine) {
  .h-btn:hover { background: var(--tint-2); }
  .h-btn.pri:hover { background: var(--cta); }
  .h-seg .h-btn.pri:hover, .h-row .h-btn.pri:hover { background: color-mix(in srgb, var(--light) 85%, var(--core)); }
  .h-ws:hover, .hwin-tab:hover, .hwin-act a:hover, .hwin-act button:hover { background: var(--tint-2); }
  .hwin-tab.live:hover { background: var(--light); }
  .h-row:hover { background: var(--tint); }
  .h-row.on:hover { background: color-mix(in srgb, var(--ok) 18%, var(--surface)); }
  .h-sum:hover { background: var(--tint); }
  .h-menu-item:hover { background: var(--tint-2); color: var(--ink); }
}
.h-btn:active, .h-ws:active, .hwin-act a:active, .hwin-act button:active { transform: scale(.97); }

@media (max-width: 560px) {
  .h-row {
    grid-template-columns: var(--s4) minmax(0, 1fr);
    row-gap: var(--s2);
    padding-bottom: var(--s3);
  }
  .h-who, .h-acts { grid-column: 2; }
  .h-specs .sp.opt { display: none; }
  .h-time, .h-val, .h-unit { display: none; }
  .h-acts { justify-content: flex-start; }
}
@container hcard (max-width: 400px) {
  .h-row {
    grid-template-columns: var(--s4) minmax(0, 1fr) auto auto auto;
    align-items: center;
    row-gap: var(--s2);
    padding-bottom: var(--s3);
  }
  .h-who { grid-column: 2 / -1; grid-row: 1; }
  .h-time { grid-column: 2; grid-row: 2; justify-self: start; display: block; }
  .h-val { grid-column: 3; grid-row: 2; text-align: right; display: block; }
  .h-unit { grid-column: 4; grid-row: 2; display: block; }
  .h-acts { grid-column: 5; grid-row: 2; justify-self: end; }
  .h-specs .sp.opt { display: none; }
  .h-chips .h-chip:nth-child(n + 4) { display: none; }
  .h-big b { font-size: var(--t-l); line-height: var(--lh-l); }
}
@media (max-width: 560px) {
  .h-time, .h-val, .h-unit { display: none; }
}
@media (pointer: coarse) {
  .h-btn, .h-ws, .h-menu-item, .hwin-tab, .hwin-act a, .hwin-act button { min-height: var(--reach); }
}
@media (prefers-contrast: more) {
  .h-card { box-shadow: var(--ring-2), var(--shadow); }
  .note, .h-menu, .h-btn, .h-chip, .h-ws, kbd.h-key, .h-specs .sp, .hwin-frame, .hwin-tab, .hwin-act a, .hwin-act button {
    box-shadow: var(--ring-2);
  }
  .h-btn:focus-visible, .h-sum:focus-visible, .h-menu-item:focus-visible, .h-ws:focus-visible,
  .hwin-tab:focus-visible, .hwin-act a:focus-visible, .hwin-act button:focus-visible, a:focus-visible {
    outline-width: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .h-pulse .rng { opacity: 0; }
}
@media print {
  html { color-scheme: light; }
  body { background: var(--ink); color: var(--ground); }
  body * { color: var(--ground); }
  .h-card, .note, .h-btn, .h-chip, .h-menu, .h-ws, kbd.h-key, .h-specs .sp, .hwin-tab, .hwin-act a, .hwin-act button {
    background: transparent !important;
    box-shadow: none !important;
  }
  .hwin { display: none !important; }
  a { text-decoration: underline; }
  .h-card, .note { break-inside: avoid; }
}