#cream-effects {
  --cream-effect-ready: 1;
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
#cream-material { display: block; width: 100%; height: 100%; filter: blur(.8px); }
.cream-glass {
  display: none;
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: 50%;
  width: min(1344px, calc(100vw - 32px));
  transform: translateX(-50%);
  pointer-events: none;
  background-color: var(--cream-glass-color, var(--cream));
  background-color: color-mix(in srgb, var(--cream-glass-color, var(--cream)) var(--cream-glass-opacity, 30%), transparent);
  overflow: clip;
}
.cream-etching { position: absolute; inset: 0; pointer-events: none; background: var(--cream-etching-image) repeat; background-size: 640px 480px; }
body.has-cream-effects :is(#story, #order) .cream-etching { filter: brightness(.4); }
@supports (backdrop-filter: blur(1px)) {
  .cream-glass { backdrop-filter: blur(clamp(2px, .55vw, 8px)) saturate(1.025); }
}
#cream-cursor { position: fixed; z-index: 70; pointer-events: none; filter: blur(.8px); }
body.has-cream-effects { isolation: isolate; padding-bottom: 0; }
body.has-cream-effects :is(#home, #story, #cakes, #order, .site-footer) { position: relative; isolation: auto; }
body.has-cream-effects :is(#story, #order) { --cream-glass-color: var(--green); --cream-glass-opacity: 84%; }
body.has-cream-effects :is(.story-copy, .order-layout) p,
body.has-cream-effects :is(.hero-description, .section-heading > p) { color: inherit; }
body.has-cream-effects .cream-glass { display: block; }
body.has-cream-effects :is(.hero-copy, .section-heading, .story-copy, .order-layout > div, .order-action)::before { content: none; }
body.has-cream-effects .hero-photo .photo-link::after { background: transparent; }
body.has-cream-effects .category-notebooks { background: transparent; box-shadow: none; border-color: transparent; }
body.has-cream-effects .category-notebooks::before,
body.has-cream-effects .category-notebooks::after { content: none; }
body.has-cream-effects .cake-weight-info { background: transparent; box-shadow: none; }
body.has-cream-effects .hero,
body.has-cream-effects .story-layout,
body.has-cream-effects #cakes > .section-heading,
body.has-cream-effects #cakes > .cake-weight-info,
body.has-cream-effects #cakes > .category-notebooks,
body.has-cream-effects #cakes > .notebook-library,
body.has-cream-effects .order-layout,
body.has-cream-effects .bakery-shelf,
body.has-cream-effects .site-footer > :not(.cream-glass) { position: relative; z-index: 3; }
body.has-cream-effects .site-header,
body.has-cream-effects .site-awning { position: relative; z-index: 4; }
body.has-cream-effects .site-footer { background: transparent; color: var(--green); }
body.has-cream-effects .mobile-enquire { position: relative; inset: auto; width: 100%; border-radius: 16px; }
#cream-motion-control {
  position: relative;
  z-index: 3;
  max-width: 100%;
}
#cream-motion-toggle {
  display: block;
  max-width: 100%;
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid var(--green);
  border-radius: 999px;
  background: var(--paper);
  color: var(--green);
  font: 600 1rem/1.35 var(--sans);
  overflow-wrap: anywhere;
  box-shadow: 0 3px 10px rgb(52 72 58 / 12%);
}
#cream-motion-toggle[aria-pressed="true"] { background: var(--green); color: var(--paper); }
@media (hover: hover) and (pointer: fine) {
  body.cream-cursor-active, body.cream-cursor-active * { cursor: none !important; }
}
@media (prefers-reduced-transparency: reduce) {
  body.has-cream-effects .cream-glass { background-color: var(--cream-glass-color, var(--cream)); backdrop-filter: none; }
  .cream-etching { display: none; }
}
@media (prefers-reduced-motion: reduce), (forced-colors: active), print {
  #cream-effects, #cream-cursor, #cream-motion-control, .cream-glass { display: none !important; }
  body.cream-cursor-active, body.cream-cursor-active * { cursor: auto !important; }
}