/* Cast Profile — pink palette tuned to maria's editorial vocabulary.
   Hue carried over from source screen, refined into a softer system. */
:root {
  /* Surfaces */
  --cp-bg:        #FAF3F0;      /* warm cream page bg */
  --cp-surface:   #FFFFFF;      /* card / sheet */
  --cp-surface-2: #FBE9EF;      /* tinted card */
  --cp-tint:      #FFEFF3;      /* faintest pink wash */

  /* Pink scale */
  --pink-50:  #FFF4F7;
  --pink-100: #FCE2EC;
  --pink-200: #F8C2D5;
  --pink-300: #F299B7;
  --pink-400: #ED6C95;
  --pink-500: #E54A7C;          /* primary */
  --pink-600: #C8366A;
  --pink-700: #962349;
  --pink-800: #5E1530;

  /* Coral / call-to-action */
  --coral-500: #F26B7E;
  --coral-600: #DB4F66;

  /* Type */
  --cp-ink:        #2A1A24;
  --cp-ink-soft:   #6B5560;
  --cp-ink-mute:   #9B8590;
  --cp-on-pink:    #FFFFFF;

  /* Support */
  --cp-gold:    #C9A052;       /* verified mark */
  --cp-online:  #4FB477;
  --cp-line:    rgba(42,26,36,0.08);
  --cp-line-2:  rgba(42,26,36,0.14);

  /* Shadow */
  --cp-shadow-sm: 0 1px 0 rgba(42,26,36,0.04), 0 4px 12px rgba(149,42,77,0.06);
  --cp-shadow:    0 2px 0 rgba(42,26,36,0.04), 0 12px 30px rgba(149,42,77,0.10);
  --cp-shadow-lg: 0 24px 60px rgba(149,42,77,0.18);

  /* Radii */
  --cp-r-sm: 10px;
  --cp-r:    16px;
  --cp-r-lg: 22px;
  --cp-r-xl: 28px;
  --cp-r-pill: 999px;
}

.cp-root {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", system-ui, sans-serif;
  color: var(--cp-ink);
  -webkit-font-smoothing: antialiased;
}

.cp-serif {
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

/* Buttons */
.cp-btn-primary {
  background: linear-gradient(180deg, var(--pink-400) 0%, var(--pink-600) 100%);
  color: var(--cp-on-pink);
  border: none;
  border-radius: var(--cp-r-pill);
  padding: 16px 22px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.04em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.30),
    0 2px 0 rgba(0,0,0,0.05),
    0 10px 24px rgba(229,74,124,0.40);
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  cursor: pointer;
}
.cp-btn-primary:active { transform: translateY(1px); }

.cp-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  border-radius: var(--cp-r-pill);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.cp-chip-pink {
  background: var(--pink-100); color: var(--pink-700);
  border: 1px solid rgba(229,74,124,0.20);
}
.cp-chip-online {
  background: rgba(79,180,119,0.12); color: var(--cp-online);
  border: 1px solid rgba(79,180,119,0.30);
}
.cp-chip-verified {
  background: rgba(201,160,82,0.12); color: #8E6A2C;
  border: 1px solid rgba(201,160,82,0.30);
}

.cp-divider {
  height: 1px;
  background: var(--cp-line);
}

/* Pulse dot for "live / online now" */
.cp-pulse {
  position: relative; width: 8px; height: 8px;
  border-radius: 50%; background: var(--cp-online);
}
.cp-pulse::after {
  content: ''; position: absolute; inset: -4px;
  border-radius: 50%; border: 2px solid var(--cp-online);
  opacity: 0.5;
  animation: cp-pulse 1.6s ease-out infinite;
}
@keyframes cp-pulse {
  0%   { transform: scale(0.6); opacity: 0.6; }
  100% { transform: scale(1.4); opacity: 0; }
}

.cp-stars { display: inline-flex; gap: 1px; color: var(--cp-gold); font-size: 13px; line-height: 1; }
.cp-stars .empty { color: rgba(201,160,82,0.25); }

.cp-bg-page { background: var(--cp-bg); }