.show {
  --app: var(--app-color, var(--accent));
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.25fr);
  grid-template-areas: "copy stage";
  align-items: center;
  gap: clamp(40px, 5.6vw, 88px);
  margin-top: clamp(48px, 6vw, 88px);
}
.show + .show { margin-top: clamp(112px, 11vw, 160px); }
.show:nth-of-type(even) { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.8fr); grid-template-areas: "stage copy"; }
.show-copy { grid-area: copy; display: flex; flex-direction: column; min-width: 0; max-width: 520px; }
.show:nth-of-type(even) .show-copy { justify-self: end; }
.show-stage { grid-area: stage; position: relative; min-width: 0; perspective: 1600px; perspective-origin: 50% 30%; }

.show-app { display: flex; align-items: center; gap: 12px; font-family: var(--font-display); font-weight: 700; font-size: 28px; letter-spacing: -0.03em; line-height: 1; }
.show-icon { width: 30px; height: 30px; flex: none; color: var(--app); }
.show-line {
  margin-top: 20px;
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(26px, 2.3vw, 32px); line-height: 1.15; letter-spacing: -0.025em;
  color: var(--text-1); text-wrap: balance;
}
.show-text { margin-top: 16px; font-size: clamp(16px, 1.2vw, 17px); line-height: 1.6; color: var(--text-2); max-width: 46ch; }
.show-meta { margin-top: 18px; font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.02em; color: var(--text-3); }
.show-copy .app-foot { margin-top: 8px; }

.show-frame {
  --u: clamp(2.4px, 0.62cqi, 4.6px);
  --sx: 22%; --sy: 0%;
  border-radius: 14px;
  box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-hair), inset 0 1px 0 var(--glass-lip);
  transform-origin: 50% 60%;
}
.show-frame .veil-side { flex-basis: 21%; }
.show-frame .veil-head i:nth-child(1) { width: 34%; }
.show-frame .veil-head i:nth-child(2) { width: 22%; }
.show-frame .veil-pic { --p1: 50% 52%; --p2: 82% 22%; --p3: 12% 90%; }
.show-frame .veil-mark { width: 50cqh; height: 50cqh; }
.show-frame .veil-mark [stroke-width="1.6"] { stroke-width: 0.62; }
.show-frame .veil-mark [stroke-width="1.2"] { stroke-width: 0.48; }
.show-frame .veil-mark [stroke-width="1"] { stroke-width: 0.4; }

.show-frame .veil-pic::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle, color-mix(in srgb, var(--text-1) 16%, transparent) 0.8px, transparent 1.3px) 50% 50% / calc(var(--u) * 4.4) calc(var(--u) * 4.4);
  -webkit-mask-image: radial-gradient(closest-side, var(--bg-0) 10%, transparent);
  mask-image: radial-gradient(closest-side, var(--bg-0) 10%, transparent);
  pointer-events: none;
}

.show-stage::before {
  content: ""; position: absolute; z-index: -1;
  left: -6%; right: -6%; top: 46%; bottom: -18%;
  border-radius: 50%;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--app) 26%, transparent), color-mix(in srgb, var(--app) 8%, transparent) 60%, transparent);
  filter: blur(44px);
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .show-frame.is-in:not(.is-shone)::after { animation: veil-shimmer 1300ms cubic-bezier(0.45, 0, 0.25, 1) 450ms 1 backwards; }
  .show-frame.is-shone:hover::after { animation: veil-shimmer-again 1100ms cubic-bezier(0.45, 0, 0.25, 1) 1 backwards; }
}

@media (max-width: 979.98px) {
  .show, .show:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "stage"; gap: 36px; }
  .show-copy, .show:nth-of-type(even) .show-copy { justify-self: start; max-width: 620px; }
}
@media (max-width: 599.98px) {
  .show-app { font-size: 26px; }
  .show-frame { border-radius: 10px; }

  .show-frame { --u: 1cqi; }
  .show-frame .veil-tileset { display: none; }
}
