#marcel-display-panel[hidden] { display: none !important; }
.marcel-display-trigger, .marcel-display-panel { box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; }
.marcel-display-trigger {
  position: fixed; z-index: 2147482100; right: .75rem; bottom: .75rem;
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 48px; min-width: 48px; padding: .65rem .85rem;
  border: 2px solid #fff; border-radius: .55rem; background: #21161b; color: #fff;
  font: 700 .82rem/1.2 Arial, Helvetica, sans-serif; cursor: pointer;
  box-shadow: 0 3px 16px #0009;
}
.marcel-display-trigger:hover { background: #4b1729; }
.marcel-display-trigger:focus-visible, .marcel-display-panel :focus-visible {
  outline: 3px solid #ffda70 !important; outline-offset: 3px !important;
}
.marcel-display-panel {
  position: fixed; z-index: 2147482101; right: .75rem; bottom: 4.6rem;
  width: min(24rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 5.5rem);
  padding: 1rem; overflow-y: auto; overscroll-behavior: contain;
  border: 2px solid #fff; border-radius: .75rem; background: #21161b; color: #fff;
  box-shadow: 0 12px 42px #000b; font: 400 .94rem/1.45 Arial, Helvetica, sans-serif;
}
.marcel-display-panel__header { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; }
.marcel-display-panel h2 { margin: 0; color: #fff; font: 700 1.2rem/1.25 Arial, Helvetica, sans-serif; letter-spacing: 0; }
.marcel-display-panel__header button { min-width: 44px; min-height: 44px; margin: -.4rem -.4rem 0 0; padding: 0; border: 0; background: transparent; color: #fff; font: 400 2rem/1 Arial, Helvetica, sans-serif; cursor: pointer; }
.marcel-display-panel__intro { margin: .3rem 0 1rem; color: #fff; font: 400 .86rem/1.5 Arial, Helvetica, sans-serif; }
.marcel-display-panel__font { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .65rem 0; border-block: 1px solid #ffffff69; font-weight: 700; }
.marcel-display-panel__font > div { display: flex; align-items: center; gap: .5rem; }
.marcel-display-panel__font button { min-width: 44px; min-height: 44px; border: 1px solid #fff; border-radius: .3rem; background: #fff; color: #21161b; font: 700 1rem/1 Arial, Helvetica, sans-serif; cursor: pointer; }
.marcel-display-panel__font output { min-width: 3.6rem; text-align: center; font-size: .82rem; }
.marcel-display-panel__options { display: grid; grid-template-columns: 1fr; gap: .25rem; margin: .75rem 0 0; padding: 0; border: 0; }
.marcel-display-panel__options legend { padding: 0 0 .3rem; font-weight: 700; }
.marcel-display-panel__options label { display: flex; align-items: center; gap: .65rem; min-height: 44px; margin: 0; padding: .3rem .45rem; border: 1px solid #ffffff4d; border-radius: .3rem; color: #fff; cursor: pointer; }
.marcel-display-panel__options label:hover { background: #ffffff18; }
.marcel-display-panel__options input { flex: 0 0 auto; width: 1.25rem; height: 1.25rem; margin: 0; accent-color: #ffda70; }
.marcel-display-panel__reset { min-height: 44px; width: 100%; margin-top: .85rem; padding: .55rem; border: 1px solid #fff; border-radius: .3rem; background: transparent; color: #fff; font: 700 .85rem/1.3 Arial, Helvetica, sans-serif; cursor: pointer; }
.marcel-display-panel__reset:hover { background: #ffffff24; }

html[data-marcel-font="1"] { font-size: 112%; }
html[data-marcel-font="2"] { font-size: 125%; }
html[data-marcel-readable="on"] body :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,blockquote,a,button,label) { font-family: Arial, Helvetica, sans-serif !important; font-style: normal !important; letter-spacing: normal !important; }
html[data-marcel-spacing="on"] body :is(p,li,dt,dd,blockquote) { line-height: 1.8 !important; }
html { --marcel-display-gray: 0; --marcel-display-contrast: 1; }
html[data-marcel-grayscale="on"] { --marcel-display-gray: 1; }
html[data-marcel-contrast="on"] { --marcel-display-contrast: 1.35; }
html[data-marcel-grayscale="on"], html[data-marcel-contrast="on"] { filter: grayscale(var(--marcel-display-gray)) contrast(var(--marcel-display-contrast)); }
html[data-marcel-links="on"] body a { text-decoration: underline !important; text-decoration-thickness: .14em !important; text-underline-offset: .2em !important; }
html[data-marcel-motion="on"], html[data-marcel-motion="on"] * { scroll-behavior: auto !important; }
html[data-marcel-motion="on"] *, html[data-marcel-motion="on"] *::before, html[data-marcel-motion="on"] *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
html[data-marcel-motion="on"] :is([data-reveal], .scroll-image, .polaroid, .case-card__visual, .case-card__body, .hero-photo, .hero__copy) { opacity: 1 !important; visibility: visible !important; transform: none !important; clip-path: none !important; }
@media (max-width: 480px) {
  .marcel-display-trigger { right: .5rem; bottom: .5rem; padding: .55rem; }
  .marcel-display-trigger span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  .marcel-display-panel { right: .5rem; bottom: 4.2rem; width: calc(100vw - 1rem); max-height: calc(100dvh - 5rem); }
}
