/* ════════════════════════════════════════════════════════════════════════
   PHASE 146 — Specialty Studio Simplify
   Uniform collapse affordance for specialty-studio cards + the small flow
   tweaks (festival nav chips, campaign-forge template capping, series-room
   meta disclosure). Matches the existing card design language: soft radius,
   quiet borders, no new colors.
   ════════════════════════════════════════════════════════════════════════ */

/* ── Collapse caret ──────────────────────────────────────────────────── */
.p146-head { position: relative; }

.p146-caret {
  flex: 0 0 auto;
  margin-left: auto;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(120, 113, 108, 0.35);
  background: transparent;
  color: inherit;
  opacity: 0.55;
  font-size: 0.72rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.15s ease, transform 0.15s ease;
}
.p146-caret:hover { opacity: 1; transform: scale(1.06); }

/* Heads that aren't flex containers still get a sane caret position */
.p146-head:not([class*='row']) .p146-caret { position: absolute; top: 10px; right: 10px; }
.pod113-card-head.p146-head .p146-caret,
.mv118-card-head.p146-head .p146-caret,
.sr55-card-head.p146-head .p146-caret,
.ff111-card-head.p146-head .p146-caret,
.doc101-card-head.p146-head .p146-caret { position: absolute; top: 10px; right: 10px; }

/* Collapsed: hide everything in the card except its head */
.p146-collapsed > *:not(.pod113-card-head):not(.mv118-card-head):not(.sr55-card-head):not(.ff111-card-head):not(.doc101-card-head) {
  display: none !important;
}
.p146-collapsed { padding-bottom: 12px !important; }
.p146-collapsed > .p146-head { margin-bottom: 0 !important; }

/* ── Festival: explainer cards become working section nav ───────────── */
.ff111-flow-card[data-ff111-goto] {
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: transform 0.14s ease, box-shadow 0.14s ease;
}
.ff111-flow-card[data-ff111-goto]:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(60, 42, 8, 0.14);
}
.ff111-flow-card[data-ff111-goto]::after {
  content: '↓ Jump to section';
  display: block;
  margin-top: 6px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.55;
}
.ff111-jump-flash {
  animation: ff111JumpFlash 1.2s ease 1;
}
@keyframes ff111JumpFlash {
  0%   { box-shadow: 0 0 0 3px rgba(217, 155, 44, 0.55); }
  100% { box-shadow: 0 0 0 3px rgba(217, 155, 44, 0); }
}

/* Compact the festival hero: same design, less billboard */
.ff111-hero .ff111-title { font-size: clamp(1.35rem, 2.6vw, 1.9rem) !important; line-height: 1.18 !important; }
.ff111-hero { padding-top: 18px !important; padding-bottom: 18px !important; }
.ff111-hero .ff111-copy { font-size: 0.86rem !important; max-width: 62ch; }

/* ── Campaign Forge: capped template groups ─────────────────────────── */
.cfr-template-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px dashed rgba(37, 99, 235, 0.45);
  background: rgba(37, 99, 235, 0.05);
  color: #1d4ed8;
  font-weight: 700;
  font-size: 0.8rem;
  cursor: pointer;
  transition: background 0.15s ease;
}
.cfr-template-more:hover { background: rgba(37, 99, 235, 0.12); }

/* ── Series Room: nav promoted, meta inputs tucked into a disclosure ── */
.sr55-meta-details { flex: 1 1 260px; min-width: 200px; }
.sr55-meta-details > summary {
  cursor: pointer;
  list-style: none;
  font-size: 0.78rem;
  font-weight: 700;
  opacity: 0.75;
  padding: 8px 10px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 10px;
  display: inline-block;
}
.sr55-meta-details > summary::-webkit-details-marker { display: none; }
.sr55-meta-details[open] > summary { opacity: 1; }
.sr55-meta-details .sr55-meta-fields {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.sr55-meta-details .sr55-meta-fields input { flex: 1 1 220px; }

/* Mobile: carets stay reachable, festival flow nav wraps */
@media (max-width: 640px) {
  .p146-caret { width: 32px; height: 32px; }
  .ff111-flow-card[data-ff111-goto]::after { content: '↓ Jump'; }
}

/* ── Writer on tablets (iPad 761–1180px): the mode pill and the editor
   stats bar both anchor to the bottom edge; at these widths they collided
   and the pill covered the word/page/scene counts. Lift the pill above the
   stats bar. Phones (≤760px) have their own placement in phase0-core. ── */
@media (min-width: 761px) and (max-width: 1180px) {
  /* !important: a JS positioner writes an inline bottom on the pill */
  body[data-active-view="writer-app"] #mode-indicator {
    bottom: 64px !important;
  }
}
