/* Umbrella edition · graphite faceted-crystal backdrop (black to grey) behind every view (S20, S24).
   Cards stay light surfaces floating on it; text that sits directly on the crystal uses the
   on-backdrop inks (≥ 4.5:1 on the lightest facet #4a4c53). */
:root[data-skin='studio'] {
  --on-backdrop: #f3f4f6;
  --on-backdrop-muted: #c9cbd1;
  --backdrop-shadow: 0 13px 21px rgb(0 0 0 / 0.45), 0 2px 4px rgb(0 0 0 / 0.3);
}
[data-skin='studio'] .view,
[data-skin='studio'] .view:not(.view-erp) {
  background:
    var(--crystal, #4a0f20) center / cover no-repeat fixed,
    #3a0b18;
  /* On the crystal the white neumorphic glow reads as a halo: lift cards with a soft drop. */
  --raised: var(--backdrop-shadow), inset 0 1px 0 rgb(255 255 255 / 0.85);
  --raised-hover: 0 18px 28px rgb(0 0 0 / 0.5), inset 0 1px 0 #fff;
}
/* Text directly on the crystal. */
[data-skin='studio'] .view > .view-head :is(h1, p),
[data-skin='studio'] .view > .view-head .muted,
[data-skin='studio'] .view > h2,
[data-skin='studio'] .view > p,
[data-skin='studio'] .view > .muted,
[data-skin='studio'] .view .kit-pager > span,
[data-skin='studio'] .view .kit-pager > i,
[data-skin='studio'] .view .tplot > figcaption,
[data-skin='studio'] .view .rate {
  color: var(--on-backdrop);
}
[data-skin='studio'] .view > .view-head :is(p, .muted),
[data-skin='studio'] .view > h2,
[data-skin='studio'] .view .tplot > figcaption span {
  color: var(--on-backdrop-muted);
}
/* Lists that used to sit on the page become cards. */
[data-skin='studio'] .view :is(.log, .bars) {
  padding: 8px 16px;
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--raised);
}