/* mech-split-flap — CSS 3D half-cards. Motion is JS-driven transform (rotateX) + opacity on the leaves only. */
.mc-flap {
  /* palette-exception: card stock is a physical material (Solari black, scoreboard amber); override per site */
  --mc-flap-card: #1b1c1f; /* palette-exception: Solari card stock */
  --mc-flap-card-hi: #26272b; /* palette-exception: card top sheen */
  --mc-flap-ink: #f3f1ea; /* palette-exception: Solari card print */
  --mc-flap-shadow: #000; /* palette-exception: falling-card shade */
  --mc-flap-size: 40px;
  --mc-flap-w: 0.7em;
  --mc-flap-h: 1.16em;
  --mc-flap-gap: 0.07em;
  --mc-flap-hinge: 0.022em;
  --mc-flap-radius: 0.07em;
  --mc-flap-col-gap: 0.42em;
  --mc-flap-line: 1px;
  display: inline-flex;
  flex-direction: column;
  max-width: 100%;
  font-family: var(--mc-flap-font, var(--mc-font));
  font-size: var(--mc-flap-size);
  font-weight: 600;
  font-stretch: condensed;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.mc-flap[data-look=amber] {
  --mc-flap-card: #17130d; /* palette-exception: scoreboard stock */
  --mc-flap-card-hi: #1f1a12; /* palette-exception: scoreboard sheen */
  --mc-flap-ink: #ffb21a; /* palette-exception: amber print */
}
.mc-flap[data-look=clock] {
  --mc-flap-card: #202124; /* palette-exception: flip-clock stock */
  --mc-flap-card-hi: #2b2c30; /* palette-exception: flip-clock sheen */
  --mc-flap-w: 0.66em;
  --mc-flap-h: 1.22em;
  --mc-flap-gap: 0.05em;
  --mc-flap-radius: 0.09em;
  --mc-flap-hinge: 0.012em;
  font-weight: 700;
}
.mc-flap[data-look=theme] {
  --mc-flap-card: var(--mc-surface-2);
  --mc-flap-card-hi: var(--mc-surface);
  --mc-flap-ink: var(--mc-fg);
  --mc-flap-shadow: var(--mc-fg);
}
.mc-flap__sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.mc-flap__sr > span { display: block; }
.mc-flap__board { display: flex; flex-direction: column; gap: calc(var(--mc-flap-gap) * 2); }
.mc-flap__row { display: flex; gap: var(--mc-flap-gap); }
.mc-flap__gap { flex: none; width: var(--mc-flap-col-gap); }
.mc-flap__cell {
  position: relative; flex: none;
  width: var(--mc-flap-w); height: var(--mc-flap-h);
  perspective: 3.2em;
  color: var(--mc-flap-ink);
}
.mc-flap__cell.is-sep { width: 0.34em; color: var(--mc-flap-sep-ink, var(--mc-fg)); }
.mc-flap__h {
  position: absolute; left: 0; right: 0;
  height: calc(50% - var(--mc-flap-hinge));
  overflow: hidden;
  background: var(--mc-flap-card);
}
.mc-flap__h.is-top {
  top: 0; border-radius: var(--mc-flap-radius) var(--mc-flap-radius) 0 0;
  background-image: linear-gradient(var(--mc-flap-card-hi), var(--mc-flap-card));
  transform-origin: 50% calc(100% + var(--mc-flap-hinge));
}
.mc-flap__h.is-bot {
  bottom: 0; border-radius: 0 0 var(--mc-flap-radius) var(--mc-flap-radius);
  transform-origin: 50% calc(0% - var(--mc-flap-hinge));
}
.mc-flap__cell.is-sep .mc-flap__h { background: none; }
.mc-flap__h.is-leaf { backface-visibility: hidden; will-change: transform; z-index: 1; }
.mc-flap__h[hidden] { display: none; }
.mc-flap__g {
  position: absolute; left: 0; right: 0;
  height: var(--mc-flap-h);
  display: grid; place-items: center;
  transform: scaleX(var(--mc-flap-squeeze, 0.86)); /* static: emulates Solari condensed type without loading a font */
}
.mc-flap__h.is-top .mc-flap__g { top: 0; }
.mc-flap__h.is-bot .mc-flap__g { bottom: 0; }
.mc-flap__s {
  position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: var(--mc-flap-shadow);
}
@media (prefers-contrast: more) {
  .mc-flap { --mc-flap-hinge: 0.04em; --mc-flap-line: 2px; }
  .mc-flap__h { box-shadow: inset 0 0 0 var(--mc-flap-line) var(--mc-flap-ink); }
}
/* Reduced motion: the leaves never render; new glyphs crossfade in (opacity, ≤ 200 ms, driven from component.js). */
@media (prefers-reduced-motion: reduce) {
  .mc-flap__h.is-leaf { display: none; }
}
.mc-flap.is-reduced .mc-flap__h.is-leaf { display: none; }
/* Forced colours: system colours, a visible card edge, no shading layers. */
@media (forced-colors: active) {
  .mc-flap__h { background: Canvas; background-image: none; color: CanvasText; border: 1px solid CanvasText; forced-color-adjust: none; }
  .mc-flap__cell { color: CanvasText; }
  .mc-flap__cell.is-sep .mc-flap__h { border-color: transparent; }
  .mc-flap__s { display: none; }
}
:root[data-mc-forced=active] .mc-flap__h { background: Canvas; background-image: none; color: CanvasText; outline: 1px solid CanvasText; }
:root[data-mc-forced=active] .mc-flap__s { display: none; }