/* Três folhas de um mesmo dossiê. A perspectiva pertence ao objeto. */
.zx-deck {
  --deck-width: min(340px, calc(100% - 128px));
  --deck-height: 400px;
  --deck-front: translateX(calc(-50% - 28px)) translateY(0) rotateY(-10deg) rotateX(5deg) rotateZ(-4deg);
  --deck-middle: translateX(calc(-50% + 8px)) translateY(9px) rotateY(-10deg) rotateX(5deg) rotateZ(5deg);
  --deck-back: translateX(calc(-50% + 30px)) translateY(14px) rotateY(-10deg) rotateX(5deg) rotateZ(10deg);
  --deck-lift: translateX(calc(-50% + 55px)) translateY(-18px) rotateY(-4deg) rotateX(4deg) rotateZ(1deg);
  --deck-motion: 580ms;
  --deck-ease: cubic-bezier(.22, .75, .15, 1);
  width: 100%;
  max-width: 565px;
  min-width: 0;
  margin: 0 auto;
  color: var(--color-ink-primary);
  font-family: var(--font-body);
  position: relative;
}
.zx-deck *, .zx-deck *::before, .zx-deck *::after { box-sizing: border-box; }
.zx-deck svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.zx-deck-stage { height: 450px; position: relative; perspective: 1400px; isolation: isolate; }
.zx-deck-wash { position: absolute; width: 100%; height: 100%; inset: 0; background: radial-gradient(ellipse at 54% 46%, var(--white-a045), transparent 66%); pointer-events: none; }
.zx-deck-ground { position: absolute; inset: auto 6% 14px; height: 30px; border-radius: 50%; background: var(--black-a300); filter: blur(17px); pointer-events: none; }
.zx-deck-slot { position: absolute; width: var(--deck-width); height: var(--deck-height); top: 8px; left: 50%; transform-style: preserve-3d; transform-origin: 50% 56%; transition: transform var(--deck-motion) var(--deck-ease); }
.zx-deck-slot[data-deck-depth="front"] { z-index: 3; transform: var(--deck-front); }
.zx-deck-slot[data-deck-depth="middle"] { z-index: 2; transform: var(--deck-middle); }
.zx-deck-slot[data-deck-depth="back"] { z-index: 1; transform: var(--deck-back); }
.zx-deck-card { position: relative; width: 100%; height: 100%; margin: 0; padding: 20px 22px; overflow: hidden; border-radius: 22px; border: 1px solid var(--stroke-inner-hover); background-color: var(--color-obsidian); background-image: radial-gradient(ellipse at 5% 0, var(--white-a060), transparent 66%), linear-gradient(165deg, var(--fill-faint), transparent 52%, var(--black-a160)); box-shadow: var(--elev-2); transition: background-color var(--deck-motion) var(--deck-ease), box-shadow var(--deck-motion) var(--deck-ease); }
.zx-deck-card::after { content: ''; position: absolute; inset: 2px; border-radius: 20px; border: 1px solid var(--white-a020); pointer-events: none; }
.zx-deck-slot[data-deck-depth="middle"] .zx-deck-card { background-color: var(--color-graphite); }
.zx-deck-slot[data-deck-depth="back"] .zx-deck-card { background-color: var(--color-onyx); }
.zx-deck-slot[data-deck-depth="front"] .zx-deck-card { box-shadow: var(--elev-overlay); }
.zx-deck-head { display: flex; justify-content: space-between; align-items: center; min-height: 29px; padding-bottom: 12px; border-bottom: 1px solid var(--white-a090); }
.zx-deck-head > span { display: flex; align-items: center; gap: 8px; font-size: 12px; line-height: 21px; font-weight: 600; letter-spacing: -.02em; }
.zx-deck-head img { width: 21px; height: 21px; object-fit: contain; filter: grayscale(1) brightness(1.8); }
.zx-deck-head > svg { width: 15px; height: 15px; color: var(--color-ink-secondary); }
.zx-deck-title { margin: 17px 0 18px; color: var(--color-ink-primary); font-size: 43px; font-weight: 650; line-height: 1.06; letter-spacing: -.055em; }
.zx-deck-title > span { color: var(--color-voltage); }
.zx-deck-evidence { min-height: 114px; position: relative; padding: 14px; overflow: hidden; color: var(--color-ink-secondary); background: var(--black-a400); border: 1px solid var(--white-a040); border-radius: 13px; font-size: 12px; line-height: 1.35; }
.zx-deck-category { display: flex; align-items: center; gap: 10px; }
.zx-deck-profile-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 37px; border-radius: 7px; background: var(--white-a025); border: 1px solid var(--stroke-inner); color: var(--color-ink-secondary); }
.zx-deck-profile-icon svg { width: 21px; height: 21px; }
.zx-deck-category small, .zx-deck-category strong { display: block; font-size: 12px; }
.zx-deck-category strong { margin-top: 3px; color: var(--color-ink-primary); font-weight: 500; }
.zx-deck-service { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--white-a070); }
.zx-deck-missing { font-size: 12px; color: var(--color-ink-primary); border-bottom: 1px dashed var(--color-ink-tertiary); padding-bottom: 2px; }
.zx-deck-evidence-corner { position: absolute; width: 10px; height: 10px; right: 9px; top: 9px; border-top: 1px solid var(--color-voltage); border-right: 1px solid var(--color-voltage); opacity: .72; }
.zx-deck-evidence-heading { display: flex; align-items: center; gap: 7px; font-size: 12px; }
.zx-deck-evidence-heading svg { width: 16px; height: 16px; }
.zx-deck-review > p { margin: 11px 0 10px; color: var(--color-ink-primary); font-size: 14px; line-height: 1.35; }
.zx-deck-reply { display: flex; align-items: center; gap: 7px; font-size: 12px; }
.zx-deck-reply svg { width: 14px; height: 14px; color: var(--color-ink-tertiary); }
.zx-deck-hour-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 11px; font-size: 12px; }
.zx-deck-hour-row + .zx-deck-hour-row { margin-top: 8px; }
.zx-deck-hour-row > span:first-child { color: var(--color-ink-primary); }
.zx-deck-finding { max-width: 22ch; min-height: 46px; margin: 17px 0 0; color: var(--color-ink-primary); font-size: 18px; line-height: 1.28; font-weight: 550; letter-spacing: -.025em; }
.zx-deck-direction { display: flex; align-items: flex-start; gap: 8px; margin: 11px 0 0; color: var(--color-ink-secondary); font-size: 13px; line-height: 1.45; }
.zx-deck-direction > svg { width: 15px; height: 15px; margin-top: 2px; color: var(--color-ink-secondary); }
.zx-deck-spine { position: absolute; right: 11px; top: 26px; writing-mode: vertical-rl; font-size: 12px; font-weight: 500; letter-spacing: .03em; color: var(--color-ink-secondary); opacity: 0; transition: opacity 240ms ease; }
.zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-spine { opacity: 1; }
.zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-head, .zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-title, .zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-evidence, .zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-finding, .zx-deck-slot:not([data-deck-depth="front"]) .zx-deck-direction { opacity: .25; }
.zx-deck-peek { display: block; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; border: 0; padding: 0; background: transparent; border-radius: 22px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.zx-deck-peek[hidden] { display: none; }
.zx-deck-slot:not([data-deck-depth="front"]):has(.zx-deck-peek:hover) .zx-deck-card { border-color: var(--white-a180); }
.zx-deck-example { margin: 0; text-align: center; color: var(--color-ink-secondary); font-size: 12px; line-height: 18px; }
.zx-deck-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 390px; margin: 10px auto 0; border-bottom: 1px solid var(--stroke-inner-hover); }
.zx-deck-control { position: relative; min-height: 44px; padding: 0 4px 10px; border: 0; background: transparent; color: var(--color-ink-secondary); font: inherit; font-size: 13px; font-weight: 500; line-height: 1.3; cursor: pointer; }
.zx-deck-control:hover { color: var(--color-ink-primary); }
.zx-deck-control[aria-pressed="true"] { color: var(--color-ink-primary); }
.zx-deck-control[aria-pressed="true"]::after { content: ''; position: absolute; bottom: -1px; left: 14px; right: 14px; height: 1px; background: var(--color-voltage); }
.zx-deck-control:focus-visible, .zx-deck-card:focus-visible, .zx-deck-peek:focus-visible { outline: 2px solid var(--color-voltage); outline-offset: 5px; border-radius: 5px; }
.zx-deck-card:focus-visible, .zx-deck-peek:focus-visible { border-radius: 22px; }
.zx-deck-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.zx-deck-slot[data-deck-from="front"] { --deck-from: var(--deck-front); --deck-from-z: 3; }
.zx-deck-slot[data-deck-from="middle"] { --deck-from: var(--deck-middle); --deck-from-z: 2; }
.zx-deck-slot[data-deck-from="back"] { --deck-from: var(--deck-back); --deck-from-z: 1; }
.zx-deck-slot.is-deck-lifting { animation: zx-deck-draw var(--deck-motion) var(--deck-ease) both; }
@keyframes zx-deck-draw {
  0% { transform: var(--deck-from); z-index: var(--deck-from-z); }
  32% { transform: var(--deck-lift); z-index: 4; }
  100% { transform: var(--deck-front); z-index: 4; }
}
@media (max-width: 900px) {
  .zx-deck { --deck-width: min(320px, calc(100% - 60px)); --deck-height: 430px; --deck-front: translateX(calc(-50% - 13px)) translateY(0) rotateY(-5deg) rotateX(3deg) rotateZ(-3deg); --deck-middle: translateX(calc(-50% - 1px)) translateY(7px) rotateY(-5deg) rotateX(3deg) rotateZ(2deg); --deck-back: translateX(calc(-50% + 8px)) translateY(10px) rotateY(-5deg) rotateX(3deg) rotateZ(5deg); --deck-lift: translateX(calc(-50% + 7px)) translateY(-21px) rotateY(-2deg) rotateX(2deg) rotateZ(0); }
  .zx-deck-stage { height: 473px; }
  .zx-deck-card { padding: 20px; }
  .zx-deck-title { font-size: 40px; }
  .zx-deck-finding { font-size: 18px; }
}
@media (max-width: 430px) {
  .zx-deck { --deck-width: calc(100% - 40px); }
  .zx-deck-card { padding: 18px; }
  .zx-deck-title { font-size: clamp(29px, 9.5vw, 39px); margin-top: 17px; margin-bottom: 18px; }
  .zx-deck-evidence { padding: 12px; min-height: 115px; }
  .zx-deck-category { gap: 7px; }
  .zx-deck-profile-icon { width: 27px; flex-shrink: 0; }
  .zx-deck-service, .zx-deck-hour-row { gap: 5px; }
  .zx-deck-finding { font-size: 16px; min-height: 42px; margin-top: 18px; }
  .zx-deck-direction { font-size: 13px; }
  .zx-deck-spine { right: 8px; }
  .zx-deck-control { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .zx-deck *, .zx-deck *::before, .zx-deck *::after { animation: none !important; transition: none !important; }
}