.mosaic-card.application-studio,
.mosaic-card.application-studio:hover {
  isolation: isolate;
  background-color: #15283b;
  background-image: var(--studio-background);
  background-size: cover;
  background-position: center;
  border-color: #ffffff66;
  color: #fff;
  box-shadow: none;
}
.application-studio .studio-scrim {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, #071526bd 0%, #07152672 38%, transparent 78%),
              linear-gradient(0deg, #071526b8 0%, transparent 42%);
  pointer-events: none;
}
.application-studio[data-theme="pocket"] .studio-scrim {
  background: linear-gradient(90deg, #092915d9 0%, #09291593 38%, #09291520 80%),
              linear-gradient(0deg, #092915af 0%, transparent 42%);
}
.application-studio[data-theme="field"] .studio-scrim {
  background: linear-gradient(90deg, #071e1ac9 0%, #071e1a72 38%, transparent 82%),
              linear-gradient(0deg, #071e1ab5 0%, transparent 45%);
}
.application-studio .card-meta,
.application-studio .card-meta .serial,
.application-studio .card-copy p { color: #fffcf2; }
.application-studio .card-meta { font-size: 12px; letter-spacing: .12em; }
.application-studio .card-copy { max-width: none; width: 100%; padding-top: 13px; }
.application-studio .studio-heading-row { display: flex; align-items: center; gap: 20px; }
.application-studio .card-copy h2 { flex: none; font-size: clamp(42px, 4.3vw, 78px); line-height: 1; letter-spacing: -.055em; white-space: nowrap; }
.application-studio .studio-heading-arrows { display: flex; align-items: center; gap: 8px; flex: none; }
.application-studio .card-copy p { max-width: 640px; font-size: clamp(17px, 1.45vw, 25px); line-height: 1.35; font-weight: 550; text-shadow: 0 1px 10px #0008; margin-top: 14px; }
.application-studio .studio-showcase {
  position: relative;
  z-index: 1;
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 15px 12px;
}
.application-studio .studio-dock {
  display: block;
  width: min(94%, 1300px);
  max-height: min(45vh, 360px);
  object-fit: contain;
  filter: drop-shadow(0 22px 24px #000a);
}
.application-studio .studio-theme-meta { position: absolute; z-index: 2; right: 30px; bottom: 24px; display: flex; align-items: center; gap: 14px; color: #fff; font: 700 12px ui-monospace, Menlo, monospace; letter-spacing: .06em; text-shadow: 0 2px 8px #000; }
.application-studio .studio-theme-name { white-space: nowrap; }
.application-studio .studio-count { color: #fff9; white-space: nowrap; }
.application-studio .studio-arrow {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #ffffff85;
  border-radius: 50%;
  background: #ffffff24;
  color: white;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.application-studio .studio-arrow:hover { background: #ffffff55; }
.application-studio .studio-arrow:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media(max-width:680px) {
  .mosaic-card.application-studio { min-height: 690px; }
  .application-studio .studio-heading-row { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  .application-studio .card-copy h2 { font-size: clamp(36px, 9vw, 52px); white-space: normal; }
  .application-studio .card-copy p { font-size: 17px; }
  .application-studio .studio-showcase { padding: 8px 0; }
  .application-studio .studio-dock { width: 100%; max-height: 250px; }
  .application-studio .studio-theme-meta { right: 18px; bottom: 16px; font-size: 10px; }
}

.application-studio[data-theme="botanical"] .studio-scrim{background:linear-gradient(90deg,#203523c7,transparent 80%)}
.application-studio[data-theme="moonlit"] .studio-scrim{background:linear-gradient(90deg,#27203cc7,transparent 80%)}
.application-studio[data-theme="cherry"] .studio-scrim{background:linear-gradient(90deg,#57252ec7,transparent 80%)}
.application-studio:is([data-theme="botanical"],[data-theme="moonlit"],[data-theme="cherry"]) .studio-dock{filter:drop-shadow(0 15px 18px #24152b50)}
