.prism-scene, .prism-scene * { -webkit-tap-highlight-color: transparent; }
/* PRISM restaurant scene: problem wheel, problem statement, steps and result over the render. */
@font-face { font-family: Fynd; src: url("fynd-ui/PlusJakartaSans-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: Fynd; src: url("fynd-ui/PlusJakartaSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: Fynd; src: url("fynd-ui/PlusJakartaSans-ExtraBold.ttf") format("truetype"); font-weight: 800; font-display: swap; }
.prism-scene {
  --ps-ink: #f4eee3;
  --ps-mute: #c9bcaa;
  --ps-dim: #8f8678;
  --ps-copper: #dfa675;
  --ps-ok: #86cf9c;
  --ps-alert: #ec8a6e;
  --ps-rule: rgba(244, 238, 227, .16);
  --ps-amber: #eac388;
  --ps-glass: rgba(18, 15, 12, .78);
  --ps-glass-hi: rgba(30, 24, 18, .86);
  --ps-edge: rgba(223, 166, 117, .22);
  --ps-glow-soft: 0 12px 34px rgba(0, 0, 0, .5), 0 0 26px rgba(223, 166, 117, .07);
  --ps-ok-glass: rgba(56, 92, 66, .3);
  --ps-ok-edge: rgba(134, 207, 156, .42);
  --ps-alert-glass: rgba(112, 44, 30, .34);
  --ps-alert-edge: rgba(236, 138, 110, .48);
  --ps-alert-ink: #f2b9a6;
  --ps-ease: cubic-bezier(.22, .61, .36, 1);
  --ps-row: 64px;
  position: fixed;
  inset: 0;
  right: var(--route-scrollbar-gutter, 0px);
  width: auto;
  height: 100vh;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: none;
  scroll-snap-type: y mandatory;
  /* No scroll bar: scrolling moves the problems or the steps one step at a time, so a bar would only be a second control. */
  scrollbar-width: none;
  color-scheme: dark;
  border: 0;
  background: transparent;
  color: var(--ps-ink);
  font-family: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.prism-scene::backdrop { background: transparent; }
.prism-scene::-webkit-scrollbar { display: none; }
.prism-scene *, .prism-scene *::before, .prism-scene *::after { box-sizing: border-box; }
.prism-scene button { font: inherit; color: inherit; cursor: pointer; }
.prism-scene [hidden] { display: none !important; }
.prism-scene :focus-visible { outline: 2px solid var(--ps-amber); outline-offset: 3px; }
.ps-track i { display: block; height: 32vh; scroll-snap-align: start; }
.prism-scene.is-turning { scroll-snap-type: none; } /* the wheel turns freely under the finger, then settles on a problem */
.ps-track i:last-child { height: 100vh; height: 100dvh; }
.prism-scene[data-mode="play"] .ps-track i { height: 100vh; height: 100dvh; }
/* Arriving from the dive there is no reveal: the restaurant is already on screen, so it glides into place while the shading and the
   render's slight dimming fade in. */
.ps-art.is-gliding { transition: transform 1.6s cubic-bezier(.3, .1, .2, 1), left 1.1s var(--ps-ease), top 1.1s var(--ps-ease), width 1.1s var(--ps-ease), height 1.1s var(--ps-ease); }
.prism-scene.is-entering .ps-shade { animation: ps-fade-in 1.1s var(--ps-ease) both; }
.prism-scene.is-entering .ps-still { animation: ps-still-settle 1.1s var(--ps-ease) both; }
@keyframes ps-still-settle { from { filter: none; } }
/* The words, header and dark backing fade in over the route's landing (and out again on Close), so nothing swaps at once. */
.prism-scene.is-entering, .prism-scene.is-entering .ps-left { animation: ps-backing-in 1s var(--ps-ease) both; }
.prism-scene.is-entering .ps-head, .prism-scene.is-entering .ps-picker { animation: ps-picker-arrive .8s var(--ps-ease) both, ps-fade-in .8s var(--ps-ease) both; }
@keyframes ps-backing-in { from { background-color: transparent; } }
.prism-scene.is-leaving, .prism-scene.is-leaving .ps-left { background-color: transparent !important; transition: background-color .9s var(--ps-ease); }
.prism-scene.is-leaving .ps-head, .prism-scene.is-leaving .ps-picker, .prism-scene.is-leaving .ps-story, .prism-scene.is-leaving .ps-shade, .prism-scene.is-leaving .ps-overlay, .prism-scene.is-leaving .ps-props { opacity: 0; transition: opacity .6s var(--ps-ease); }
.prism-scene.is-leaving .ps-view { background-color: transparent; }
.prism-scene.is-leaving .ps-still { filter: none; transition: filter .9s var(--ps-ease); }
@keyframes ps-scene-reveal { to { clip-path: circle(150% at 52% 50%); } }
@keyframes ps-picker-arrive { from { transform: translateY(18px); } to { transform: translateY(0); } }

/* Render and code lighting */
.ps-view { position: fixed; inset: 0; right: var(--route-scrollbar-gutter, 0px); overflow: hidden; background: #0b0a08; }
.ps-art { position: absolute; transform-origin: var(--fx, 50%) var(--fy, 50%); transition: transform 1.6s cubic-bezier(.3, .1, .2, 1); }
.prism-scene[data-mode="play"] .ps-art { transform: scale(1.07); }
.ps-still, .ps-clip, .ps-glow, .ps-screens { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ps-still { display: block; object-fit: fill; filter: brightness(.86) saturate(.92); }
.ps-clip { object-fit: fill; opacity: 0; transition: opacity .6s ease; }
.ps-clip.is-on { opacity: 1; }
.ps-art.is-inset { -webkit-mask-image: linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent), linear-gradient(90deg, transparent, #000 5%, #000 96%, transparent); -webkit-mask-composite: source-in; mask-image: linear-gradient(180deg, transparent, #000 9%, #000 91%, transparent), linear-gradient(90deg, transparent, #000 5%, #000 96%, transparent); mask-composite: intersect; }
.ps-glow { opacity: 0; mix-blend-mode: screen; transition: opacity 1.6s ease; background: radial-gradient(ellipse 14% 18% at var(--fx) var(--fy), rgba(255, 196, 128, .5), rgba(255, 170, 96, .16) 55%, rgba(255, 160, 80, .05) 80%, transparent 100%); }
.prism-scene[data-zone="office"] .ps-glow { background: radial-gradient(ellipse 11% 14% at var(--fx) var(--fy), rgba(255, 220, 170, .55), rgba(255, 196, 128, .16) 55%, rgba(255, 180, 110, .04) 80%, transparent 100%); }
.prism-scene.is-lit .ps-glow { opacity: 1; }
.ps-screens { z-index: 2; overflow: visible; }
.ps-terminal-screen { fill: #090b0c; stroke: rgba(4, 5, 6, .95); stroke-width: 2; }
.prism-scene[data-auto="sales"][data-beat="fix"] .ps-terminal-screen--cashier { fill: #d9efff; filter: drop-shadow(0 0 7px rgba(154, 218, 255, .9)); transition: fill .35s ease; }
/* The office screen lights, with the same glow as the cashier screen, the moment the first document reaches it.
   Earlier documents sit on top, so the first one stays visible as it arrives. */
.prism-scene.is-fix-sequence[data-auto="sales"] .ps-terminal-screen--office { animation: ps-office-wake 4.2s linear both; }
.prism-scene.is-report-sequence[data-auto="morning"] .ps-terminal-screen--office { animation: ps-office-report-wake 5.1s linear both; }
@keyframes ps-office-wake {
  0%, 68% { fill: #090b0c; filter: none; }
  70%, 100% { fill: #d9efff; filter: drop-shadow(0 0 7px rgba(154, 218, 255, .9)); }
}
@keyframes ps-office-report-wake {
  0%, 98% { fill: #090b0c; filter: none; }
  100% { fill: #d9efff; filter: drop-shadow(0 0 7px rgba(154, 218, 255, .9)); }
}
.ps-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(8, 7, 6, .9) 0, rgba(8, 7, 6, .62) 26%, rgba(8, 7, 6, 0) 46%); }

/* Props, export documents, and screens are positioned in render units. */
.ps-props { position: absolute; z-index: 3; inset: 0; pointer-events: none; }
.ps-exports { position: absolute; inset: 0; display: none; font-size: 1em; }
.prism-scene[data-auto="sales"][data-beat="fix"] .ps-exports { display: block; }
.ps-export { position: absolute; display: grid; width: 14em; gap: .3em; padding: .55em .65em; border: 1px solid rgba(223, 166, 117, .58); border-radius: .22em; background: linear-gradient(145deg, rgba(33, 27, 21, .96), rgba(15, 13, 11, .91)); box-shadow: 0 .65em 1.5em rgba(0, 0, 0, .52), 0 0 .9em rgba(223, 166, 117, .14); color: var(--ps-ink); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); opacity: 0; }
.prism-scene.is-fix-sequence .ps-export { animation: ps-export-flight 4.2s var(--ps-ease) both; animation-delay: var(--ps-export-delay, 0s); }
/* Morning report: calendar, P&L and the three message sources sit in screen pixels, placed by script (beside the words on a
   computer, inside the picture on a phone). Sizes follow the panel height (font-size = height / 12). */
.ps-overlay { position: absolute; z-index: 3; inset: 0; display: none; pointer-events: none; }
.ps-overlay.is-on { display: block; }
.ps-month { position: absolute; display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
.ps-calendar, .ps-report { display: flex; flex-direction: column; min-height: 0; border: 1px solid var(--ps-edge); border-radius: .5em; background: var(--ps-glass-hi); color: var(--ps-ink); box-shadow: var(--ps-glow-soft); opacity: 0; transform: translateY(.8em); transition: opacity .5s var(--ps-ease), transform .5s var(--ps-ease); }
.ps-month.is-in .ps-calendar, .ps-month.is-report-in .ps-report { opacity: 1; transform: none; }
.ps-calendar { overflow: hidden; text-align: center; }
.ps-calendar b { padding: .6em 0; background: rgba(223, 166, 117, .18); color: var(--ps-amber); font: 600 .85em/1.2 "Inter Tight", sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.ps-days { display: block; height: 1.2em; margin: auto 0; overflow: hidden; font: 600 5em/1.2 "Inter Tight", sans-serif; letter-spacing: -.03em; }
.ps-strip { display: block; transform: translateY(calc(var(--ps-day, 0) * -1.2em)); transition: transform .16s ease-out; }
.ps-strip i { display: flex; align-items: center; justify-content: center; height: 1.2em; font-style: normal; }
.ps-report { position: relative; padding: .8em .9em .7em; }
.ps-report b { font: 600 .75em/1.2 "JetBrains Mono", monospace; letter-spacing: .06em; text-transform: uppercase; }
.ps-legend { display: flex; gap: 1em; margin-top: .45em; color: var(--ps-mute); font-size: .72em; }
.ps-legend span { display: flex; align-items: center; gap: .4em; }
.ps-legend i { display: block; width: .75em; height: .75em; border-radius: .15em; }
.ps-report .is-rev { background: var(--ps-copper); }
.ps-report .is-exp { background: rgba(244, 238, 227, .38); }
.ps-bars { display: flex; flex: 1; align-items: flex-end; gap: .6em; min-height: 0; margin-top: .7em; padding: 0 .2em; border-bottom: 1px solid var(--ps-rule); }
.ps-day-bars { display: flex; flex: 1; align-items: flex-end; gap: .15em; height: 100%; }
.ps-day-bars i { display: block; flex: 1; height: var(--h); border-radius: .15em .15em 0 0; transform: scaleY(0); transform-origin: bottom; transition: transform .45s var(--ps-ease); }
.ps-day-bars.is-up i { transform: scaleY(1); }
.ps-day-bars.is-up i.is-exp { transition-delay: .08s; }
.ps-question { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--ps-alert); font: 600 3.6em/1 "Inter Tight", sans-serif; font-style: normal; opacity: 0; transition: opacity .4s ease; }
.ps-month.is-asking .ps-question { opacity: 1; }
.ps-sources { position: absolute; display: flex; align-items: center; justify-content: center; gap: 1em; }
.ps-source { display: flex; align-items: center; justify-content: center; width: calc((100% - 1em) / 4); height: 50%; border: 1px solid var(--ps-edge); border-radius: .5em; background: var(--ps-glass-hi); color: var(--ps-ink); box-shadow: var(--ps-glow-soft); text-align: center; opacity: 0; transform: translateY(.8em) scale(.94); transition: opacity .35s var(--ps-ease), transform .35s var(--ps-ease); }
.ps-source strong { font: 600 .95em/1.2 "Inter Tight", sans-serif; }
.ps-sources.is-in .ps-source { opacity: 1; transform: none; }
.ps-sources.is-in .ps-source:nth-child(2) { transition-delay: .15s; }
.ps-sources.is-in .ps-source:nth-child(3) { transition-delay: .3s; }
.ps-sources.is-in.is-out .ps-source { opacity: 0; transform: scale(.94); transition-delay: 0s; }
.ps-export.ps-flyer { left: 0; top: 0; z-index: 5; transform-origin: center; }
.ps-export-mark { justify-self: start; padding: .18em .3em; border: 1px solid rgba(223, 166, 117, .45); border-radius: .14em; color: var(--ps-copper); font: 600 max(.62em, 7px)/1 "JetBrains Mono", monospace; letter-spacing: .08em; }
.ps-export strong { font-size: max(.92em, 9px); font-weight: 600; line-height: 1.15; }
.ps-export-detail { color: var(--ps-mute); font: 500 max(.55em, 7px)/1.3 "JetBrains Mono", monospace; letter-spacing: .04em; }
.ps-export-lines { display: grid; gap: .24em; margin-top: .1em; }
.ps-export-lines i { height: .12em; border-radius: 1em; background: rgba(244, 238, 227, .28); }
.ps-export-lines i:nth-child(2) { width: 76%; }
.ps-export-lines i:nth-child(3) { width: 48%; }
.ps-export--pos { left: 61%; top: 32%; --ps-start-x: 21em; --ps-start-y: 14.6em; --ps-flight-x: -12.5em; --ps-flight-y: -9.8em; --ps-export-delay: 0s; z-index: 4; }
.ps-export--cashier { left: 75%; top: 39%; --ps-start-x: 7em; --ps-start-y: 10.7em; --ps-flight-x: -26.5em; --ps-flight-y: -13.5em; --ps-export-delay: .25s; z-index: 3; }
.ps-export--bank { left: 82%; top: 49%; --ps-start-x: 28em; --ps-start-y: -5.1em; --ps-flight-x: -33.6em; --ps-flight-y: -19.5em; --ps-export-delay: .5s; z-index: 2; }
.ps-export--gateway { left: 63%; top: 53%; --ps-start-x: 48em; --ps-start-y: 0; --ps-flight-x: -14.5em; --ps-flight-y: -21.3em; --ps-export-delay: .75s; z-index: 1; }
@keyframes ps-export-flight {
  0% { opacity: 0; transform: translate(var(--ps-start-x), var(--ps-start-y)) scale(.78); }
  12%, 40% { opacity: 1; transform: translate(0, 0) scale(1); }
  71% { opacity: 1; transform: translate(var(--ps-flight-x), var(--ps-flight-y)) scale(.92); }
  80%, 100% { opacity: 0; transform: translate(var(--ps-flight-x), var(--ps-flight-y)) scale(.62); }
}


/* Header */
.ps-head { position: fixed; z-index: 6; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; padding: clamp(16px, 3vh, 30px) clamp(18px, 4vw, 56px); pointer-events: none; }
.ps-brand { margin: 0; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.ps-brand span { color: var(--ps-dim); font-weight: 500; }
.ps-close { pointer-events: auto; padding: 9px 13px; border: 1px solid var(--ps-edge); border-radius: 3px; background: var(--ps-glass); font-size: 12px; transition: border-color .3s ease; }
.ps-close:hover { border-color: var(--ps-amber); }

/* Left column */
.ps-left { position: fixed; z-index: 4; top: 0; bottom: 0; left: clamp(20px, 5vw, 76px); width: min(32vw, 430px); display: flex; flex-direction: column; justify-content: center; padding: 84px 0 28px; }
.ps-kicker { margin: 0; color: var(--ps-copper); font: 500 .68rem/1.4 "JetBrains Mono", monospace; letter-spacing: .14em; text-transform: uppercase; }
.ps-pick-title { margin: .5rem 0 1.4rem; font-size: clamp(2rem, 3.6vw, 3.2rem); font-weight: 400; line-height: 1; letter-spacing: -.035em; }

/* Wheel */
.ps-wheel { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 76px; height: calc(var(--ps-row) * 5); }
.ps-wheel-list { height: 100%; margin: 0; padding: calc(var(--ps-row) * 2) 0; overflow: hidden; list-style: none; -webkit-mask-image: linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent); mask-image: linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent); }
.prism-scene .ps-wheel-list:focus-visible { outline: none; }
.ps-wheel:focus-within .ps-band { border-color: rgba(223, 166, 117, .55); }
.ps-row { display: flex; align-items: center; gap: .9rem; height: var(--ps-row); padding: 0 .9rem; color: var(--ps-mute); cursor: pointer; user-select: none; }
.ps-row-icon { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border: 1px solid var(--ps-rule); border-radius: 50%; background: var(--ps-glass); transition: border-color .4s ease, color .4s ease, box-shadow .4s ease; }
.ps-row-icon svg { width: 18px; height: 18px; }
.ps-row-text { display: grid; gap: .1rem; min-width: 0; }
.ps-row-text strong { overflow: hidden; font-size: 1.12rem; font-weight: 500; letter-spacing: -.01em; white-space: nowrap; text-overflow: ellipsis; }
.ps-row-text small { color: var(--ps-dim); font: 400 .62rem/1.3 "JetBrains Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.ps-row.is-selected { color: var(--ps-ink); }
.ps-row.is-selected .ps-row-icon { border-color: var(--ps-copper); color: var(--ps-amber); background: rgba(223, 166, 117, .12); box-shadow: 0 0 16px rgba(223, 166, 117, .22); }
.ps-row.is-selected .ps-row-text small { color: var(--ps-copper); }
.ps-row.is-soon { font-style: italic; }
.ps-band { position: absolute; top: calc(50% - var(--ps-row) / 2); left: 0; right: 0; height: var(--ps-row); border-top: 1px solid var(--ps-edge); border-bottom: 1px solid var(--ps-edge); border-radius: 4px; background: linear-gradient(90deg, rgba(223, 166, 117, .1), rgba(223, 166, 117, .03) 70%, transparent); box-shadow: 0 0 30px rgba(223, 166, 117, .05); pointer-events: none; }
.ps-dial { width: 100%; height: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); }
.ps-dial line { stroke: rgba(244, 238, 227, .32); stroke-width: 1.2; }
.ps-dial line.is-major { stroke: rgba(244, 238, 227, .7); stroke-width: 1.6; }
.ps-marker { fill: var(--ps-copper); }
.ps-dial-ticks { transition: none; }
.ps-play { align-self: flex-start; display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.4rem; padding: 12px 18px; border: 1px solid rgba(223, 166, 117, .6); border-radius: 3px; background: var(--ps-glass-hi); box-shadow: var(--ps-glow-soft); font-size: .9rem; transition: background .3s ease, border-color .3s ease; }
.ps-play strong { font-weight: 600; }
.ps-play:hover:not(:disabled) { border-color: var(--ps-amber); background: rgba(52, 38, 25, .92); }
.ps-play:disabled { border-color: var(--ps-rule); background: transparent; box-shadow: none; color: var(--ps-dim); cursor: default; }
.ps-hint { margin: .8rem 0 0; color: var(--ps-dim); font-size: .76rem; }

/* Story */
.ps-story { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; max-height: 100%; }
.prism-scene[data-mode="play"] .ps-left { justify-content: flex-start; padding-top: clamp(96px, 22vh, 230px); }
.prism-scene.has-chat[data-mode="play"] .ps-left { padding-top: clamp(72px, 12vh, 128px); }
.ps-controls { display: flex; align-items: center; gap: .45rem; margin-bottom: 1.6rem; }
.ps-back { padding: 7px 11px; border: 1px solid var(--ps-edge); border-radius: 3px; background: var(--ps-glass); color: var(--ps-mute); font-size: .76rem; transition: border-color .3s ease, color .3s ease; }
.ps-back:hover, .ps-ctl:hover:not(:disabled) { border-color: var(--ps-amber); color: var(--ps-ink); }
.ps-progress { display: flex; flex: 1; gap: 3px; margin: 0 .4rem; }
.ps-progress i { flex: 1; height: 2px; border-radius: 2px; background: var(--ps-rule); transition: background .5s ease, box-shadow .5s ease; }
.ps-progress i.is-done { background: rgba(223, 166, 117, .55); }
.ps-progress i.is-now { background: var(--ps-amber); box-shadow: 0 0 8px rgba(234, 195, 136, .55); }
.ps-ctl { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid var(--ps-edge); border-radius: 50%; background: var(--ps-glass); color: var(--ps-mute); font-size: .78rem; transition: border-color .3s ease, color .3s ease; }
.ps-ctl:disabled { opacity: .35; cursor: default; }
.ps-copy { flex: 0 0 auto; }
.ps-title { margin: .55rem 0 0; font-size: clamp(1.9rem, 3.3vw, 3.1rem); font-weight: 400; line-height: 1.04; letter-spacing: -.032em; text-wrap: balance; text-shadow: 0 2px 24px rgba(0, 0, 0, .6); }
.ps-title.is-long { font-size: clamp(1.3rem, 2.05vw, 1.9rem); line-height: 1.16; letter-spacing: -.02em; }
.ps-sub { margin: .8rem 0 0; color: var(--ps-mute); font-size: clamp(.92rem, 1.15vw, 1.05rem); line-height: 1.45; }
.ps-story.is-enter .ps-copy { animation: ps-rise .7s var(--ps-ease); }
.prism-scene[data-beat="result"] .ps-title { color: var(--ps-ink); }
.prism-scene[data-beat="result"] .ps-beat { color: var(--ps-ok); }

.ps-cards { display: grid; gap: .5rem; margin-top: 1.3rem; }
.ps-cards:empty { display: none; }
.ps-reconcile-panel { padding: .8rem .95rem .95rem; border: 1px solid #dfa675; border-radius: 10px; background: #f6f0e6; box-shadow: 0 14px 40px rgba(0, 0, 0, .6); }
.ps-reconcile { width: 100%; table-layout: fixed; border-collapse: collapse; color: #1d1813; }
.ps-reconcile-caption { padding-bottom: .5rem; color: #8a4f22; font: 600 .7rem/1.3 "JetBrains Mono", monospace; letter-spacing: .12em; text-align: left; text-transform: uppercase; }
.ps-reconcile th, .ps-reconcile td { padding: .5rem .18rem; border-bottom: 1px solid rgba(29, 24, 19, .14); }
.ps-reconcile thead th { color: #5b5147; font: 600 .76rem/1.2 "JetBrains Mono", monospace; text-align: center; }
.ps-reconcile thead th:first-child { width: 22%; }
.ps-reconcile tbody th { font-size: .98rem; font-weight: 600; text-align: left; }
.ps-reconcile td { text-align: center; }
.ps-check { display: inline-grid; width: 27px; height: 27px; place-items: center; border: 1.5px solid; border-radius: 50%; vertical-align: middle; }
.ps-check svg { display: block; width: 66%; height: 66%; }
.ps-check.is-match { border-color: #3f8a57; background: #dff3e5; color: #1f6b3a; }
.ps-check.is-mismatch { border-color: #c4553b; background: #fde4dc; color: #a3361f; }
.ps-not-applicable { color: #8a7f72; font: 500 1rem/1 "JetBrains Mono", monospace; }
.ps-reconcile-gap { margin-top: .6rem; overflow: hidden; border: 1px solid #c4553b; border-radius: 6px; background: #fde4dc; color: #8f2f1b; }
.ps-reconcile-gap summary { display: grid; grid-template-columns: auto auto minmax(0, 1fr) 1rem; align-items: center; gap: .45rem .65rem; padding: .55rem .65rem; cursor: pointer; list-style: none; }
.ps-reconcile-gap summary::-webkit-details-marker { display: none; }
.ps-gap-label { color: #1d1813; font-size: .86rem; font-weight: 600; }
.ps-gap-label::after { content: ":"; }
.ps-gap-note { font-size: .8rem; }
.ps-reconcile-gap summary strong { font: 600 .98rem/1.2 "JetBrains Mono", monospace; white-space: nowrap; }
.ps-reconcile-gap summary strong small { color: #8f2f1b; font-size: .68rem; }
.ps-gap-toggle::before { content: "+"; display: grid; width: 1rem; height: 1rem; place-items: center; border: 1px solid currentColor; border-radius: 50%; font: 500 .75rem/1 "Inter Tight", sans-serif; }
.ps-reconcile-gap[open] .ps-gap-toggle::before { content: "−"; }
.ps-gap-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; padding: 0 .65rem .6rem; }
.ps-gap-item { display: grid; gap: .12rem; padding: .5rem; border: 1px solid rgba(29, 24, 19, .15); border-radius: 4px; background: #fff8f2; color: #1d1813; }
.ps-gap-item span { color: #5b5147; font-size: .74rem; }
.ps-gap-item strong { font: 600 .9rem/1.2 "JetBrains Mono", monospace; }
.ps-gap-item small { color: #7a6f63; font-size: .66rem; }
.ps-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: .8rem; padding: .7rem 2.4rem .7rem .9rem; border: 1px solid var(--ps-edge); border-radius: 4px; background: #f6f0e6; color: #1d1813; box-shadow: var(--ps-glow-soft); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: ps-card-in .7s var(--ps-ease) both; transition: border-color .8s ease, background .8s ease, color .8s ease; }
.ps-card-label { font-size: .78rem; font-weight: 500; }
.ps-card-amount { grid-column: 2; grid-row: 1 / span 2; align-self: center; font: 500 .95rem/1.2 "JetBrains Mono", monospace; text-align: right; white-space: nowrap; }
.ps-card-amount small { color: var(--ps-dim); font-size: .62rem; }
.ps-card-note { grid-column: 1; color: #5b5147; font-size: .68rem; }
.ps-card:not(:has(.ps-card-note)) .ps-card-amount { grid-row: 1; }
.ps-card-mark { position: absolute; top: 50%; right: .7rem; display: grid; place-items: center; width: 20px; height: 20px; margin-top: -10px; border: 1px solid currentColor; border-radius: 50%; font-size: .66rem; font-weight: 700; line-height: 1; animation: ps-fade-in .6s ease both .2s; }
.ps-card.is-ok { border-color: var(--ps-ok-edge); background: #f6f0e6; }
.ps-card-mark svg { display: block; width: 70%; height: 70%; }
.ps-card.is-ok .ps-card-mark { color: var(--ps-ok); background: rgba(134, 207, 156, .12); }
.ps-card.is-ok .ps-card-amount { color: #1f6b3a; }
.ps-card.is-alert { border-color: var(--ps-alert-edge); background: #f6f0e6; box-shadow: var(--ps-glow-soft), 0 0 22px rgba(236, 138, 110, .1); }
.ps-card.is-alert .ps-card-amount { color: #a3361f; }
.ps-card.is-alert .ps-card-mark { color: var(--ps-alert); background: rgba(236, 138, 110, .12); }
.ps-card.is-over { z-index: 1; margin: -.85rem 0 0 1.8rem; border-color: var(--ps-rule); background: var(--ps-glass-hi); animation: ps-slide-over .8s var(--ps-ease) both; }

/* Phone */
.ps-phone { display: none; flex: 0 0 auto; margin-top: 1.1rem; overflow: visible; }
.ps-phone.is-up { display: flex; justify-content: center; }
/* The same phone as the Fynd city phone (fynd-city/index.html): same body shape, frame and side buttons, at a fixed shape.
   In a short window the bottom runs off the edge of the screen; the shape never squashes. */
.ps-device { container-type: inline-size; position: relative; width: 78%; height: auto; aspect-ratio: 71.9 / 150; min-height: 0; margin: 0 auto; flex: 0 0 auto; display: flex; padding: 1.8%; border: 1px solid #a8a8aa; border-radius: 15% / 7.2%; background: linear-gradient(105deg, #77777a, #28282a 7%, #171719 15%, #171719 85%, #69696c 94%, #29292b); box-shadow: 0 24px 70px #000b, 0 0 0 2px #080706; animation: ps-phone-up .9s var(--ps-ease) both; }
.ps-device::before, .ps-device::after { content: ""; position: absolute; z-index: 2; width: 2px; border-radius: 2px; background: linear-gradient(90deg, #d0d0d2, #555558); box-shadow: 0 1px 2px #0008; pointer-events: none; }
.ps-device::before { left: -3px; top: 20%; height: 3%; box-shadow: 0 25px 0 #77777a, 0 50px 0 #77777a; }
.ps-device::after { right: -3px; top: 31%; height: 8%; }
.ps-screen { position: relative; display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 0; overflow: hidden; border-radius: 13cqw; background: linear-gradient(180deg, #16120e, #0e0c0a); color: var(--ps-ink); font-size: 12px; }
.ps-status { position: relative; display: flex; justify-content: space-between; padding: 12px 22px 6px; font-size: 11px; font-weight: 600; }
.ps-status .fynd-status-icons { display: block; width: 50px; height: 14px; }
.ps-island { position: absolute; top: 9px; left: 50%; width: 72px; height: 20px; margin-left: -36px; border-radius: 20px; background: #050505; }
.ps-chat-head { display: flex; align-items: center; gap: 9px; padding: 8px 14px 10px; border-bottom: 1px solid var(--ps-rule); background: rgba(30, 24, 18, .9); }
.ps-chat-head strong { display: block; font-size: 13px; }
.ps-chat-head small { color: var(--ps-dim); font-size: 10px; }
.ps-avatar { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid rgba(223, 166, 117, .45); border-radius: 50%; background: rgba(223, 166, 117, .14); color: var(--ps-amber); font-weight: 600; }
.ps-chat { display: flex; flex: 1; min-height: 0; flex-direction: column; gap: 8px; padding: 12px 10px 18px; overflow: hidden; }
.ps-chat > * { flex: 0 0 auto; }
.ps-bubble { max-width: 86%; margin: 0; padding: 8px 10px; border: 1px solid var(--ps-rule); border-radius: 12px 12px 12px 4px; background: rgba(40, 33, 26, .92); font-size: 12px; line-height: 1.35; animation: ps-bubble .7s var(--ps-ease) both; animation-delay: calc(var(--i) * .9s + .3s); }
.ps-bubble small { display: block; margin-bottom: 2px; color: var(--ps-copper); font-size: 9.5px; font-weight: 600; }
.ps-bubble.is-alert { border-color: var(--ps-alert-edge); background: linear-gradient(90deg, var(--ps-alert-glass), rgba(40, 33, 26, .92) 60%); }
.ps-bubble.is-ok { border-color: var(--ps-ok-edge); background: linear-gradient(90deg, var(--ps-ok-glass), rgba(40, 33, 26, .92) 60%); }
.ps-bubble.is-mine { align-self: flex-end; border-color: rgba(223, 166, 117, .3); border-radius: 12px 12px 4px 12px; background: rgba(92, 64, 38, .62); }
.ps-bubble.is-mine small { color: var(--ps-amber); }
.ps-phone.is-fynd .fynd-screen { container-type: inline-size; background: #fff; color: #0f172a; font-family: Fynd, sans-serif; }
.ps-phone.is-fynd .ps-status { flex: 0 0 14cqw; align-items: center; padding: max(2.5cqw, 5px) 7cqw 0; background: #fff; color: #101828; font-size: max(3.2cqw, 8px); font-weight: 800; }
.ps-phone.is-fynd .ps-island { top: 2.5cqw; width: 20cqw; height: 6.2cqw; margin-left: -10cqw; }
.ps-phone.is-fynd .fynd-status-icons { display: block; width: 18cqw; height: 5cqw; }
.ps-phone.is-fynd .ps-chat-head { gap: 2cqw; padding: max(2cqw, 6px) 4cqw; border-bottom: .35cqw solid #e2e8f0; background: #fff; color: #0f172a; }
.ps-phone.is-fynd .ps-chat-heading { display: grid; gap: .3cqw; min-width: 0; }
.ps-phone.is-fynd .ps-chat-head strong { font-size: max(4.8cqw, 12px); font-weight: 800; }
.ps-phone.is-fynd .ps-chat-head small { color: #64748b; font-size: max(3.6cqw, 9px); }
.ps-phone.is-fynd .ps-avatar { width: 8cqw; height: 8cqw; flex: 0 0 8cqw; border-color: #ffb8b8; background: #fff0ee; color: #db4b4b; font-size: 3.3cqw; }
/* Shared phone scroll (attachPhoneScroll): clock bar on top, everything else scrolls beneath it. */
.ps-screen.has-app-scroll { position: relative; }
.ps-screen.has-app-scroll .ps-status { position: absolute; z-index: 2; top: 0; right: 0; left: 0; transition: background .3s ease; }
.ps-screen.has-app-scroll .ps-status.is-clear { background: transparent; }
/* As in the Fynd city phone: the scrolling layer lies over the whole screen (so its content can never stretch the phone; Safari
   otherwise grows the phone to fit the messages) and is moved by script only, so the phone stays still while its content rises. */
.ps-app-scroll { position: absolute; inset: 0; display: flex; flex-direction: column; overflow: hidden; scrollbar-width: none; }
.ps-app-scroll::-webkit-scrollbar { display: none; }
.ps-app-scroll > * { flex: none; }
.ps-phone.is-fynd .ps-status { height: 14cqw; padding-top: 0; }
.ps-phone.is-fynd .ps-app-scroll { background: #f8f9fc; }
.ps-phone.is-fynd .ps-chat-head { flex: none; padding-top: calc(14cqw + max(2cqw, 6px)); }
.ps-phone.is-fynd .ps-chat { flex: none; gap: max(2cqw, 6px); padding: max(4cqw, 9px); overflow: visible; background: #f8f9fc; }
.ps-phone.is-fynd .ps-bubble { max-width: 90%; padding: max(3cqw, 7px) max(3.5cqw, 8px); border: .35cqw solid #e2e8f0; border-radius: 3.5cqw; background: #fff; box-shadow: 0 2cqw 3cqw #0f172a12; color: #0f172a; font-size: max(4.6cqw, 12px); line-height: 1.35; }
.ps-phone.is-fynd .ps-bubble small { color: #64748b; font-size: max(3.6cqw, 9px); }
.ps-phone.is-fynd .ps-bubble.is-alert { border-color: #ffd3cd; background: #fff0ee; color: #7f1d1d; }
.ps-phone.is-fynd .ps-bubble.is-alert small { color: #be3f3f; }
.ps-phone.is-fynd .ps-bubble.is-mine { border-color: #d0defa; background: #eef3ff; color: #253b6c; }
.ps-phone.is-fynd .ps-bubble.is-mine small { color: #506b9f; }
.ps-phone.is-fynd .ps-bubble.is-ok { border-color: #c5efd1; background: #ecfdf3; color: #166534; }
.ps-phone.is-fynd .ps-bubble.is-ok small { color: #14804a; }
/* The dashboard phone screen is light, in a clean finance-dashboard style (the captain asked for light colours on this screen only). */
.ps-screen[data-kind="dashboard"] { background: #f4f5fa; color: #1d2433; }
.ps-screen[data-kind="dashboard"] .ps-status { background: #f4f5fa; color: #1d2433; }
.ps-screen[data-kind="dashboard"] .ps-dash { padding-top: 40px; }
.ps-dash { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 6px 12px 12px; }
.ps-dash-top { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; margin: 2px 0 2px; }
.ps-dash-hello { margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
.ps-dash-hello small { display: block; margin-top: 2px; color: #6b7280; font-size: 10.5px; font-weight: 500; letter-spacing: 0; }
.ps-dash-avatar { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(135deg, #8b7cf6, #5b8def); color: #fff; font-size: 12px; font-weight: 600; }
.ps-tile { display: grid; align-content: start; gap: 4px; padding: 10px; border: 1px solid #e7e9f2; border-radius: 14px; background: #fff; box-shadow: 0 6px 16px rgba(29, 36, 51, .06); animation: ps-bubble .7s var(--ps-ease) both .3s; }
.ps-tile small { color: #6b7280; font-size: 10px; font-weight: 500; }
.ps-tile strong { color: #1d2433; font: 600 11.5px/1.2 "JetBrains Mono", monospace; letter-spacing: -.02em; }
.ps-tile strong small { color: #9aa1b2; font-size: 9.5px; }
.ps-tile.is-wide { grid-column: 1 / -1; }
.ps-tile.is-wide strong { font-size: 15px; }
.ps-tile.is-ok strong { color: #15803d; }
.ps-tile-row { display: flex; align-items: center; justify-content: space-between; }
.ps-pill { justify-self: start; padding: 2px 7px; border-radius: 999px; font-size: 9.5px; font-style: normal; font-weight: 600; }
.ps-pill.is-up { background: #e8f7ee; color: #15803d; }
.ps-meter { display: block; height: 5px; margin-top: 3px; border-radius: 5px; background: #eef0f6; }
.ps-meter i { display: block; width: var(--w); height: 100%; border-radius: 5px; background: linear-gradient(90deg, #f6a96b, #f08a5d); }
.ps-spark { display: flex; align-items: flex-end; gap: 3px; height: 54px; margin-top: 6px; }
.ps-spark i { flex: 1; height: var(--h); border-radius: 3px 3px 1px 1px; background: #d9dcfb; transform: scaleY(0); transform-origin: bottom; animation: ps-grow .7s var(--ps-ease) forwards; animation-delay: calc(var(--i) * .04s + .5s); }
.ps-spark i:last-child { background: linear-gradient(180deg, #8b7cf6, #5b8def); }
.ps-seller { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-top: 1px solid #eef0f6; color: #1d2433; font-size: 10.5px; }
.ps-seller:first-of-type { border-top: 0; }
.ps-seller em { display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 5px; background: #eef0fd; color: #5b5bd6; font-size: 9px; font-style: normal; font-weight: 600; }
.ps-seller b { margin-left: auto; font: 600 10.5px/1 "JetBrains Mono", monospace; }
/* Result: lock screen, PRISM's notification drops in, a tap ring, then the dashboard opens over it. */
.ps-screen[data-kind="wake"] { position: relative; background: linear-gradient(180deg, #2a2119, #0e0c0a); color: var(--ps-ink); }
.ps-screen[data-kind="wake"] .ps-status { position: relative; z-index: 2; color: var(--ps-ink); animation: ps-wake-status .4s ease 2.5s forwards; }
@keyframes ps-wake-status { to { color: #1d2433; } }
.ps-lock { display: flex; flex-direction: column; align-items: center; padding: 18px 12px 0; animation: ps-lock-out .5s var(--ps-ease) 2.4s forwards; }
.ps-lock-date { margin: 0; color: var(--ps-mute); font-size: 11px; font-weight: 500; }
.ps-lock-time { margin: 0 0 18px; font-size: 54px; font-weight: 500; line-height: 1.05; letter-spacing: -.03em; }
.ps-note { position: relative; display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px; border: 1px solid var(--ps-rule); border-radius: 16px; background: rgba(244, 238, 227, .14); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 10.5px; line-height: 1.35; opacity: 0; transform: translateY(-14px); animation: ps-note-in .6s var(--ps-ease) .6s forwards, ps-note-press .3s ease 1.9s; }
.ps-note-app { display: flex; flex: none; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, #8b7cf6, #5b8def); color: #fff; font-size: 12px; font-weight: 600; }
.ps-note-text { display: flex; flex-direction: column; min-width: 0; color: var(--ps-mute); }
.ps-note-text b { display: flex; justify-content: space-between; color: var(--ps-mute); font-size: 9.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.ps-note-text b small { font-weight: 500; text-transform: none; }
.ps-note-text strong { color: var(--ps-ink); font-size: 12px; font-weight: 600; }
.ps-note-tap { position: absolute; top: 50%; left: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px; border: 2px solid rgba(244, 238, 227, .85); border-radius: 50%; opacity: 0; animation: ps-tap .8s ease-out 1.8s; }
@keyframes ps-note-in { to { opacity: 1; transform: none; } }
@keyframes ps-note-press { 50% { transform: scale(.97); } }
@keyframes ps-tap { from { opacity: .95; transform: scale(.5); } to { opacity: 0; transform: scale(1.6); } }
@keyframes ps-lock-out { to { opacity: 0; transform: scale(.94); } }
.ps-wake-dash { position: absolute; inset: 0; z-index: 1; padding-top: 30px; background: #f4f5fa; color: #1d2433; opacity: 0; transform: scale(.92); animation: ps-wake-open .55s var(--ps-ease) 2.4s forwards; }
.ps-wake-dash .ps-tile, .ps-wake-dash .ps-spark i { animation-play-state: paused; }
.prism-scene .ps-wake-dash .ps-tile { animation-delay: 2.7s; animation-play-state: running; }
.prism-scene .ps-wake-dash .ps-spark i { animation-delay: calc(var(--i) * .04s + 2.9s); animation-play-state: running; }
@keyframes ps-wake-open { to { opacity: 1; transform: none; } }
.ps-dash-note { grid-column: 1 / -1; margin: 2px 0 0; color: #9aa1b2; font-size: 9.5px; }
.ps-replay { padding: 6px 11px; border: 1px solid rgba(223, 166, 117, .6); border-radius: 3px; background: var(--ps-glass-hi); color: var(--ps-amber); font-size: .82rem; transition: border-color .3s ease; }
.ps-replay:hover { border-color: var(--ps-amber); }

@keyframes ps-grow { to { transform: scaleY(1); } }
@keyframes ps-rise { from { opacity: 0; transform: translateY(8px); } }
@keyframes ps-card-in { from { opacity: 0; transform: translateY(8px); } }
@keyframes ps-slide-over { from { opacity: 0; transform: translateY(6px); } }
@keyframes ps-fade-in { from { opacity: 0; } }
@keyframes ps-phone-up { from { opacity: 0; transform: translateY(24px); } }
@keyframes ps-bubble { from { opacity: 0; transform: translateY(6px); } }

/* Phone and tall screens: render on top, text and wheel below. */
@media (max-aspect-ratio: 1/1) {
  .prism-scene { --ps-row: 56px; }
  .ps-view { bottom: auto; height: var(--ps-split, 40%); }
  .prism-scene[data-mode="play"] .ps-art { transform: none; }
  .ps-shade { background: linear-gradient(180deg, rgba(8, 7, 6, .55), transparent 22%, transparent 70%, rgba(11, 10, 8, .95)); }
  .ps-head { padding: max(12px, env(safe-area-inset-top)) 16px 0; }
  .ps-brand { font-size: .6rem; letter-spacing: .14em; }
  .prism-scene[data-mode="play"] .ps-left { padding-top: 14px; }
  .ps-left { top: var(--ps-split, 40%); right: 0; left: 0; width: auto; justify-content: flex-start; padding: 14px 16px max(14px, env(safe-area-inset-bottom)); background: #0b0a08; }
  .ps-pick-title { margin: .3rem 0 .6rem; font-size: 1.6rem; }
  .ps-wheel { grid-template-columns: minmax(0, 1fr) 58px; height: calc(var(--ps-row) * 3.6); }
  .ps-wheel-list { padding: calc(var(--ps-row) * 1.3) 0; }
  .ps-row { padding: 0 .4rem; }
  .ps-row-text strong { font-size: 1rem; }
  .ps-play { margin-top: .7rem; padding: 10px 14px; font-size: .84rem; }
  .ps-hint { margin-top: .5rem; font-size: .7rem; }
  .ps-story { height: 100%; }
  .prism-scene.has-chat[data-mode="play"] .ps-left { padding-top: 14px; }
  .ps-controls { margin-bottom: .8rem; }
  .ps-title { font-size: clamp(1.35rem, 6.2vw, 1.75rem); line-height: 1.1; }
  .ps-title.is-long { font-size: clamp(1.02rem, 4.4vw, 1.2rem); line-height: 1.28; }
  .ps-sub { margin-top: .5rem; font-size: .84rem; line-height: 1.38; }
  .ps-cards { gap: .35rem; margin-top: .8rem; }
  .ps-reconcile-caption { font-size: .62rem; }
  .ps-reconcile th, .ps-reconcile td { padding: .4rem .1rem; }
  .ps-reconcile thead th { font-size: .66rem; }
  .ps-reconcile tbody th { font-size: .86rem; }
  .ps-check { width: 23px; height: 23px; font-size: .8rem; }
  .ps-card { padding: .5rem 2.2rem .5rem .7rem; }
  .ps-card-label { font-size: .72rem; }
  .ps-card-amount { font-size: .82rem; }
  .ps-card.is-over { margin-top: -1.2rem; }
  .ps-story.has-phone .ps-sub { display: none; }
  /* The phone keeps one place from step to step: the words above it and the cards always take the same room. */
  /* Room for the step label and a two-line heading (the result headings wrap), so the phone never shifts between steps. */
  .ps-story.has-phone .ps-copy { min-height: calc(1.72rem + 2.2 * clamp(1.35rem, 6.2vw, 1.75rem)); }
  .ps-story.has-phone .ps-cards { min-height: 46px; }
  .ps-phone { margin-top: .7rem; }
  .ps-device { width: 81%; padding: clamp(4px, 1vw, 6px); border-radius: clamp(28px, 9vw, 36px); }
  .ps-screen { border-radius: clamp(24px, 7.5vw, 32px); }
  .ps-chat { justify-content: flex-end; }
  .ps-phone.is-fynd .ps-chat { justify-content: flex-start; }
  /* The Zalo, WhatsApp and Email boxes are half as tall (and a little narrower) on a phone, leaving room for bigger documents. */
  .ps-source { width: calc((100% - 2em) / 5); height: 25%; }
  .ps-source strong { font-size: .8em; }
  .ps-export { width: 14em; padding: .45em .5em; }
  .ps-export.ps-flyer { width: 17em; }
  .ps-export strong { font-size: max(.9em, 8px); }
  .ps-export-detail { font-size: max(.5em, 6.5px); }
  .ps-export--pos { left: 53%; top: 23%; --ps-start-x: 29em; --ps-start-y: 19.7em; --ps-flight-x: -4.5em; --ps-flight-y: -3.9em; }
  .ps-export--cashier { left: 72%; top: 32%; --ps-start-x: 10em; --ps-start-y: 14.6em; --ps-flight-x: -23.5em; --ps-flight-y: -9em; }
  .ps-export--bank { left: 74%; top: 47%; --ps-start-x: 36em; --ps-start-y: -2.8em; --ps-flight-x: -25.5em; --ps-flight-y: -17.4em; }
  .ps-export--gateway { left: 53%; top: 51%; --ps-start-x: 58em; --ps-start-y: 2.8em; --ps-flight-x: -4.5em; --ps-flight-y: -19.7em; }
}

@media (max-aspect-ratio: 1/1) and (max-height: 700px) {
  .ps-story.has-phone .ps-cards { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .prism-scene *, .prism-scene *::before, .prism-scene *::after { animation-duration: .01ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .prism-scene[data-mode="play"] .ps-art { transform: none; }
  .prism-scene[data-auto="sales"][data-beat="fix"] .ps-terminal-screen--office { animation: none; fill: #e2f5ff; filter: drop-shadow(0 0 8px rgba(176, 226, 255, .95)); }
  .ps-exports .ps-export { animation: none; opacity: 1; transform: none; }
}