/* ATM 3D hologram layer. Load last, after theme-auto.css.
   Light = pearl foil, Dark = turquoise light projection, Automatic = Gram hologram.
   Surfaces become translucent glass with foil edges over a projected grid; text keeps
   each appearance's own ink colours, so contrast is unchanged. Photographs,
   merchandise art and swatches are never filtered. */

:root {
  --holo-bg: #e9f1f2;
  --holo-bg-glow-1: #8fe3ec66;
  --holo-bg-glow-2: #f3a9cb55;
  --holo-bg-glow-3: #b9a3e855;
  --holo-glass: #ffffffa8;
  --holo-glass-strong: #ffffffd9;
  --holo-glass-menu: #fffffff5;
  --holo-chrome: #f3f6f5c4;
  --holo-rail: #146676e0;
  --holo-edge-1: #208ea4;
  --holo-edge-2: #e0629a;
  --holo-edge-3: #7b5bb5;
  --holo-edge-mix: 55%;
  --holo-glow: #208ea42e;
  --holo-bracket: #208ea4a6;
  --holo-grid-line: #208ea424;
  --holo-scanline: #14667608;
  --holo-sheen-blend: soft-light;
  --holo-heading-glow: none;
  --holo-beam-1: #6cf3ff;
  --holo-beam-2: #ff8fc4;
  --holo-beam-3: #b59bff;
  --holo-chamber-1: #0b2b35;
  --holo-chamber-2: #02090d;
  --holo-chamber-line: #6cf3ff59;
}
html[data-theme='dark'] {
  --holo-bg: #02090d;
  --holo-bg-glow-1: #1b8fa340;
  --holo-bg-glow-2: #a1306a2e;
  --holo-bg-glow-3: #4b33a033;
  --holo-glass: #0e262e94;
  --holo-glass-strong: #0d232ae6;
  --holo-glass-menu: #0d232af7;
  --holo-chrome: #06141ab8;
  --holo-rail: #0c2a32cc;
  --holo-edge-1: #5ce1e6;
  --holo-edge-2: #ff7eb6;
  --holo-edge-3: #a58bff;
  --holo-edge-mix: 48%;
  --holo-glow: #5ce1e638;
  --holo-bracket: #6cf3ffb3;
  --holo-grid-line: #5ce1e62e;
  --holo-scanline: #ffffff08;
  --holo-sheen-blend: screen;
  --holo-heading-glow: 0 0 24px #5ce1e659, -1px 0 0 #ff7eb633, 1px 0 0 #6cf3ff4d;
}
html[data-theme-mode='auto'] {
  --holo-bg: #eee9f3;
  --holo-bg-glow-1: #f3a9cb59;
  --holo-bg-glow-2: #c7a2ff55;
  --holo-bg-glow-3: #8fe3ec44;
  --holo-glass: #fdfafeb3;
  --holo-glass-strong: #fdfafee0;
  --holo-glass-menu: #fdfafef5;
  --holo-chrome: #09090df0;
  --holo-rail: #09090df0;
  --holo-edge-1: #8a4fb0;
  --holo-edge-2: #e0629a;
  --holo-edge-3: #208ea4;
  --holo-glow: #8a4fb02e;
  --holo-bracket: #8a4fb0a6;
  --holo-grid-line: #8a4fb01f;
  --holo-scanline: #4b2a6008;
  --holo-beam-1: #ff8fc4;
  --holo-beam-2: #c7a2ff;
  --holo-beam-3: #6cf3ff;
  --holo-chamber-1: #2a1033;
  --holo-chamber-2: #07040a;
  --holo-chamber-line: #ff8fc459;
}
html[data-theme-mode='auto'][data-theme='dark'] {
  --holo-bg: #050308;
  --holo-bg-glow-1: #a1306a33;
  --holo-bg-glow-2: #5b34a03d;
  --holo-bg-glow-3: #1b8fa326;
  --holo-glass: #1e122699;
  --holo-glass-strong: #1c1124e6;
  --holo-glass-menu: #1c1124f7;
  --holo-edge-1: #ff7eb6;
  --holo-edge-2: #b78cff;
  --holo-edge-3: #5ce1e6;
  --holo-edge-mix: 48%;
  --holo-glow: #ff7eb633;
  --holo-bracket: #ff8fc4b3;
  --holo-grid-line: #ff7eb629;
  --holo-scanline: #ffffff08;
  --holo-sheen-blend: screen;
  --holo-heading-glow: 0 0 24px #ff7eb64d, -1px 0 0 #6cf3ff33, 1px 0 0 #ff8fc44d;
}

/* ---------- Projected environment ---------- */
html[data-theme][data-theme-mode] body {
  background: var(--holo-bg);
  overflow-x: clip;
}
html[data-theme][data-theme-mode] .app {
  position: relative;
  z-index: 1;
  background: transparent;
}
.holo-env {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(60vmax 45vmax at 12% 8%, var(--holo-bg-glow-1), transparent 70%),
    radial-gradient(55vmax 40vmax at 92% 22%, var(--holo-bg-glow-2), transparent 70%),
    radial-gradient(70vmax 50vmax at 60% 108%, var(--holo-bg-glow-3), transparent 70%);
}
.holo-env::before {
  content: '';
  position: absolute;
  inset: -30%;
  background: conic-gradient(from 0deg at 50% 50%, var(--holo-bg-glow-1), transparent 22%, var(--holo-bg-glow-2), transparent 48%, var(--holo-bg-glow-3), transparent 74%, var(--holo-bg-glow-1));
  filter: blur(60px);
  opacity: .6;
  animation: holo-turn 60s linear infinite;
}
.holo-grid {
  position: absolute;
  left: -50%;
  right: -50%;
  bottom: -8%;
  height: 58%;
  background-image:
    linear-gradient(var(--holo-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--holo-grid-line) 1px, transparent 1px);
  background-size: 64px 64px;
  transform: perspective(520px) rotateX(64deg);
  transform-origin: 50% 100%;
  -webkit-mask-image: linear-gradient(to top, #000 8%, transparent 82%);
  mask-image: linear-gradient(to top, #000 8%, transparent 82%);
  animation: holo-grid 7s linear infinite;
}
.holo-particles {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(1.5px 1.5px at 12% 22%, var(--holo-edge-1), transparent 60%),
    radial-gradient(1.5px 1.5px at 72% 14%, var(--holo-edge-2), transparent 60%),
    radial-gradient(1px 1px at 38% 64%, var(--holo-edge-1), transparent 60%),
    radial-gradient(1.5px 1.5px at 86% 58%, var(--holo-edge-3), transparent 60%),
    radial-gradient(1px 1px at 22% 84%, var(--holo-edge-2), transparent 60%),
    radial-gradient(1px 1px at 58% 36%, var(--holo-edge-3), transparent 60%);
  background-size: 640px 640px;
  opacity: .55;
  animation: holo-drift 40s linear infinite;
}
html[data-theme][data-theme-mode] body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 40;
  pointer-events: none;
  background: repeating-linear-gradient(to bottom, var(--holo-scanline) 0 1px, transparent 1px 4px);
}

/* ---------- Glass chrome ---------- */
html[data-theme][data-theme-mode] :is(header, .bottom) {
  background: var(--holo-chrome);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  backdrop-filter: blur(18px) saturate(1.5);
  border-color: color-mix(in srgb, var(--holo-edge-1) 30%, transparent);
}
html[data-theme][data-theme-mode] header::after,
html[data-theme][data-theme-mode] .bottom::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--holo-edge-1), var(--holo-edge-2), var(--holo-edge-3), transparent) 0 0 / 200% 100%;
  animation: holo-sweep 7s linear infinite;
}
html[data-theme][data-theme-mode] header::after { bottom: -1px; }
html[data-theme][data-theme-mode] .bottom::before { top: -1px; }
html[data-theme][data-theme-mode] .icon-rail {
  background: var(--holo-rail);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 40%, transparent), 0 12px 40px -12px var(--holo-glow);
}
html[data-theme][data-theme-mode] .brand img { filter: drop-shadow(0 0 10px var(--holo-glow)); }
html[data-theme][data-theme-mode] :is(.more-menu, .quick-actions) {
  background: var(--holo-glass-menu);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  backdrop-filter: blur(20px) saturate(1.4);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 35%, transparent), 0 18px 50px -14px var(--holo-glow);
}
html[data-theme][data-theme-mode] .bottom .fab {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 60%, transparent), 0 0 22px var(--holo-glow), 0 4px 12px #0003;
  animation: holo-pulse 3.2s ease-in-out infinite;
}

/* ---------- Glass panels with foil edges and corner brackets ---------- */
html[data-theme][data-theme-mode] :is(.card, .lesson-card, .takeaway, .lab-tools,
  .training-resource, .consultancy-package, .consultancy-section,
  .technology-card, .technology-workflow li,
  .technology-stages > .technology-section, .team-training-topic,
  .merch-card, .merch-home, .learning-stats > div,
  .learning-card, .learning-account, .learning-setup, .learning-question,
  .learning-crossword, .learning-result, .learning-guide) {
  --holo-b: var(--holo-bracket);
  border: 1px solid transparent;
  background:
    linear-gradient(var(--holo-b), var(--holo-b)) left 10px top 10px / 14px 1.5px no-repeat padding-box,
    linear-gradient(var(--holo-b), var(--holo-b)) left 10px top 10px / 1.5px 14px no-repeat padding-box,
    linear-gradient(var(--holo-b), var(--holo-b)) right 10px bottom 10px / 14px 1.5px no-repeat padding-box,
    linear-gradient(var(--holo-b), var(--holo-b)) right 10px bottom 10px / 1.5px 14px no-repeat padding-box,
    linear-gradient(var(--holo-glass), var(--holo-glass)) padding-box,
    linear-gradient(125deg,
      color-mix(in srgb, var(--holo-edge-1) var(--holo-edge-mix), transparent),
      color-mix(in srgb, var(--holo-edge-2) var(--holo-edge-mix), transparent) 40%,
      color-mix(in srgb, var(--holo-edge-3) var(--holo-edge-mix), transparent) 70%,
      color-mix(in srgb, var(--holo-edge-1) var(--holo-edge-mix), transparent)) border-box;
  box-shadow: 0 1px 0 #ffffff14 inset, 0 18px 44px -26px var(--holo-glow);
}
/* Service cards keep their colour-coded accent as a glowing top line. */
html[data-theme][data-theme-mode] .card {
  box-shadow: inset 0 3px 0 -1px var(--accent), 0 18px 44px -26px var(--holo-glow);
}
html[data-theme][data-theme-mode] .card:hover {
  box-shadow: inset 0 3px 0 -1px var(--accent), 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 30%, transparent), 0 24px 60px -24px var(--holo-glow);
}

/* Shortcut tiles read as small projected keys. */
html[data-theme][data-theme-mode] .shortcut-grid a {
  position: relative;
  background: var(--holo-glass);
  border-color: color-mix(in srgb, var(--holo-edge-1) 40%, transparent);
  box-shadow: inset 0 0 18px -6px var(--holo-glow), 0 10px 30px -20px var(--holo-glow);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
html[data-theme][data-theme-mode] .shortcut-grid a span { text-shadow: 0 0 14px var(--holo-glow); }
html[data-theme][data-theme-mode] .shortcut-grid a:hover {
  background: var(--holo-glass-strong);
  box-shadow: inset 0 0 22px -4px var(--holo-glow), 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 55%, transparent), 0 14px 34px -16px var(--holo-glow);
}

/* Pointer-lit sheen on tilted panels (set by hologram.js). */
:is(.card, .shortcut-grid a, .lesson-card, .technology-card, .merch-card, .learning-card,
  .consultancy-package, .training-resource, .lab-tools, .merch-home) {
  position: relative;
  transform-style: preserve-3d;
  transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease;
}
.holo-lit { transition: transform .06s linear, box-shadow .2s ease; }
.holo-lit::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--holo-mx, 50%) var(--holo-my, 50%), color-mix(in srgb, var(--holo-edge-1) 40%, transparent), transparent 46%),
    linear-gradient(115deg, transparent 25%, color-mix(in srgb, var(--holo-edge-2) 22%, transparent) 45%, color-mix(in srgb, var(--holo-edge-3) 22%, transparent) 55%, transparent 75%) var(--holo-mx, 50%) 0 / 220% 100%;
  mix-blend-mode: var(--holo-sheen-blend);
  opacity: .8;
}

/* Brand panels stay dark, now with a projected edge. */
html[data-theme][data-theme-mode] :is(.approach, .consultant-profile) {
  position: relative;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 45%, transparent), 0 0 40px -10px var(--holo-glow), inset 0 0 80px -30px color-mix(in srgb, var(--holo-edge-1) 40%, transparent);
}

/* ---------- Type and controls ---------- */
html[data-theme][data-theme-mode] :is(#home .intro h1, .training-intro h1, .consultancy-intro h1,
  .technology-intro h1, .merch-intro h1, .references-intro h1) {
  text-shadow: var(--holo-heading-glow);
}
html[data-theme='light'][data-theme-mode] :is(#home .intro h1, .training-intro h1, .consultancy-intro h1,
  .technology-intro h1, .merch-intro h1, .references-intro h1) {
  background: linear-gradient(100deg, var(--ink) 0%, var(--deep) 46%, var(--purple) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
html[data-theme='dark'][data-theme-mode] .eyebrow { text-shadow: 0 0 12px var(--holo-glow); }
html[data-theme][data-theme-mode] .primary {
  background-image: linear-gradient(110deg, transparent 35%, #ffffff47 50%, transparent 65%);
  background-size: 260% 100%;
  background-position: 130% 0;
  background-repeat: no-repeat;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 45%, transparent), 0 8px 26px -10px var(--holo-glow);
  transition: background-position .6s ease, box-shadow .2s ease, background-color .2s ease;
}
html[data-theme][data-theme-mode] .primary:hover {
  background-image: linear-gradient(110deg, transparent 35%, #ffffff47 50%, transparent 65%);
  background-position: -30% 0;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 70%, transparent), 0 10px 32px -8px var(--holo-glow);
}
html[data-theme][data-theme-mode] :is(dialog, #side-menu) {
  -webkit-backdrop-filter: blur(22px) saturate(1.4);
  backdrop-filter: blur(22px) saturate(1.4);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 40%, transparent), 0 24px 80px -20px var(--holo-glow), 0 20px 80px #0005;
}
html[data-theme][data-theme-mode] dialog:not(#side-menu) { background: var(--holo-glass-menu); }
html[data-theme][data-theme-mode] .one-health-domains span {
  box-shadow: inset 0 0 12px -4px var(--holo-glow);
}

/* ---------- Home specimen stage ---------- */
.holo-stage {
  display: grid;
  gap: 18px;
  margin: 4px 0 30px;
}
.holo-chamber {
  position: relative;
  height: clamp(300px, 46vw, 400px);
  border-radius: 24px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(ellipse 60% 30% at 50% 88%, color-mix(in srgb, var(--holo-beam-1) 22%, transparent), transparent 70%),
    radial-gradient(ellipse at 50% 38%, var(--holo-chamber-1), var(--holo-chamber-2) 72%);
  box-shadow: 0 0 0 1px var(--holo-chamber-line), inset 0 0 70px #000a, 0 26px 60px -28px var(--holo-glow), 0 0 50px -18px color-mix(in srgb, var(--holo-beam-1) 40%, transparent);
}
.holo-chamber::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: radial-gradient(color-mix(in srgb, var(--holo-beam-1) 22%, transparent) 1px, transparent 1.5px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 75%);
}
.holo-chamber::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 22%;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--holo-beam-1) 7%, transparent) 80%, color-mix(in srgb, var(--holo-beam-1) 45%, transparent) 97%, transparent);
  opacity: .5;
  animation: holo-scan 4.6s cubic-bezier(.45, 0, .55, 1) infinite;
}
.holo-projector {
  position: absolute;
  left: 50%;
  bottom: 5%;
  z-index: 1;
  width: min(58%, 300px);
  aspect-ratio: 5 / 1;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(ellipse, color-mix(in srgb, var(--holo-beam-1) 60%, transparent), transparent 68%);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-beam-1) 50%, transparent), 0 0 30px color-mix(in srgb, var(--holo-beam-1) 40%, transparent);
}
.holo-projector::before {
  content: '';
  position: absolute;
  left: -14%;
  right: -14%;
  bottom: 50%;
  height: 520%;
  background: linear-gradient(to top, color-mix(in srgb, var(--holo-beam-1) 26%, transparent), transparent 92%);
  clip-path: polygon(36% 100%, 64% 100%, 100% 0, 0 0);
  opacity: .5;
  animation: holo-flicker 5s steps(1) infinite;
}
.holo-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  cursor: grab;
  touch-action: pan-y;
}
.holo-stage.is-dragging .holo-canvas { cursor: grabbing; }
.holo-canvas:focus-visible { outline: 2px solid var(--holo-beam-1); outline-offset: -8px; border-radius: 20px; }
.holo-hud { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.holo-hud span {
  position: absolute;
  font-family: ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 1.4px;
  color: color-mix(in srgb, var(--holo-beam-1) 85%, #fff);
  text-shadow: 0 0 10px color-mix(in srgb, var(--holo-beam-1) 60%, transparent);
  white-space: nowrap;
}
.holo-hud b { font-weight: 700; color: #fff; }
.holo-hud-tl { top: 16px; left: 18px; }
.holo-hud-tr { top: 16px; right: 18px; }
.holo-hud-bl { bottom: 16px; left: 18px; }
.holo-hud-br { bottom: 16px; right: 18px; opacity: .7; }
.holo-hud::before, .holo-hud::after {
  content: '';
  position: absolute;
  width: 22px;
  height: 22px;
  border: 1.5px solid color-mix(in srgb, var(--holo-beam-1) 70%, transparent);
}
.holo-hud::before { top: 40px; left: 18px; border-right: 0; border-bottom: 0; }
.holo-hud::after { bottom: 40px; right: 18px; border-left: 0; border-top: 0; }
.holo-readout h2 { font-size: 26px; letter-spacing: -.6px; line-height: 1.2; margin: 0 0 8px; }
.holo-readout .eyebrow { margin-bottom: 8px; }
.holo-readout [data-holo-fact] { margin: 0 0 14px; max-width: 60ch; min-height: 3.2em; }
.holo-specimens { display: flex; flex-wrap: wrap; gap: 8px; }
.holo-specimens button {
  min-height: 44px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--holo-edge-1) 45%, transparent);
  background: var(--holo-glass);
  color: var(--deep);
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
  transition: box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.holo-specimens button:hover { box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 60%, transparent), 0 0 18px -4px var(--holo-glow); }
.holo-specimens button[aria-pressed='true'] {
  background: var(--theme-button, var(--deep));
  color: var(--theme-button-ink, #fff);
  border-color: transparent;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 70%, transparent), 0 0 22px -4px var(--holo-glow);
}
.holo-stage.is-static .holo-canvas { cursor: default; }

/* Home layout: the stage takes the right column beside the introduction. */
@media (min-width: 900px) {
  #home > #holo-stage { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin: 28px 0; }
  #home > .intro { grid-row: 1; }
  #home > .shortcut-grid { grid-column: 1; grid-row: 2; align-self: start; margin: 0 0 30px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .holo-chamber { height: clamp(360px, 34vw, 480px); }
}
@media (max-width: 600px) {
  .holo-chamber { height: 300px; border-radius: 20px; }
  .holo-hud-br { display: none; }
  .holo-readout h2 { font-size: 22px; }
}

/* ---------- Scan-in when a page opens ---------- */
main.holo-materialize { animation: holo-in .85s cubic-bezier(.2, .7, .2, 1) both; }

/* ---------- Motion ---------- */
@keyframes holo-turn { to { transform: rotate(360deg); } }
@keyframes holo-grid { to { background-position: 0 64px, 0 0; } }
@keyframes holo-drift { to { background-position: 640px -640px; } }
@keyframes holo-sweep { to { background-position: -200% 0; } }
@keyframes holo-pulse {
  0%, 100% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--holo-edge-1) 60%, transparent), 0 0 18px var(--holo-glow), 0 4px 12px #0003; }
  50% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--holo-edge-1) 22%, transparent), 0 0 30px var(--holo-glow), 0 4px 12px #0003; }
}
@keyframes holo-scan { 0% { transform: translateY(-110%); } 100% { transform: translateY(420%); } }
@keyframes holo-flicker { 0%, 100% { opacity: .5; } 47% { opacity: .38; } 48% { opacity: .58; } 72% { opacity: .44; } }
@keyframes holo-in {
  0% { clip-path: inset(0 0 100% 0); opacity: .3; filter: brightness(1.7) saturate(1.4); }
  55% { clip-path: inset(0 0 0 0); opacity: 1; filter: brightness(1.15); }
  100% { clip-path: inset(0 0 0 0); opacity: 1; filter: none; }
}

/* Calm: the More options switch, or the device's reduced-motion setting. */
html.holo-calm .holo-env::before, html.holo-calm .holo-grid, html.holo-calm .holo-particles,
html.holo-calm .holo-projector::before, html.holo-calm header::after,
html.holo-calm .bottom::before, html.holo-calm .bottom .fab { animation: none; }
html.holo-calm .holo-chamber::after { display: none; }
html.holo-calm main.holo-materialize { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .holo-env::before, .holo-grid, .holo-particles, .holo-projector::before,
  html[data-theme][data-theme-mode] header::after, html[data-theme][data-theme-mode] .bottom::before,
  html[data-theme][data-theme-mode] .bottom .fab, main.holo-materialize { animation: none; }
  .holo-chamber::after { display: none; }
  :is(.card, .shortcut-grid a, .lesson-card, .technology-card, .merch-card, .learning-card,
    .consultancy-package, .training-resource, .lab-tools, .merch-home) { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  html[data-theme][data-theme-mode] { --holo-glass: var(--paper); --holo-glass-strong: var(--paper); --holo-glass-menu: var(--paper); }
  html[data-theme][data-theme-mode] :is(header, .bottom, .more-menu, .quick-actions, dialog, #side-menu, .icon-rail) {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  html[data-theme][data-theme-mode] body::after { display: none; }
}
@media print {
  .holo-env, .holo-stage { display: none; }
  html[data-theme][data-theme-mode] body::after { display: none; }
}