:root {
  --bg: #07182f;
  --card: #102844;
  --pink: #f2d64b;
  --accent: #f5cf3b;
  --pale: #173453;
  --beige: #0c213c;
  --ink: #ffe36b;
  --muted: #d8d09a;
  --line: rgba(245, 207, 59, 0.2);
  --shadow: 0 12px 34px rgba(0, 5, 18, 0.32);
}

body { background: var(--bg); color: var(--ink); }
.site-header { background: rgba(7, 24, 47, 0.94); border-color: var(--line); }
.logo > span { background: var(--accent); color: #07182f; }
.logo small, .work-card p, .detail-info p, .pr, .adult, .back, .section-title > a { color: var(--muted); }
.desktop-search, .mobile-search { background: #102844; border-color: var(--line); }
.desktop-search input, .mobile-search input { color: #fff4ad; }
.desktop-search input::placeholder, .mobile-search input::placeholder { color: #a9ad9d; }
.desktop-search button, .mobile-search button, .primary { background: var(--accent); color: #07182f; }
.hero { background: #07182f; }
.hero-shade { background: linear-gradient(90deg, rgba(3, 15, 34, .9), rgba(3, 15, 34, .38) 52%, transparent 78%), linear-gradient(0deg, var(--bg), transparent 25%); }
.hero-copy { color: #fff6bd; }
.hero-copy > span { color: #f1dfa0; }
.quick a, .performer-grid a { background: rgba(16, 40, 68, .96); border-color: var(--line); }
.quick span, .chips a, .kana { background: var(--pale); color: var(--accent); }
.work-art, .detail-image, .sample-strip img { background: var(--beige); }
.work-card h3, .section-title h2, .directory h1, .detail-info h1, .performer-hero h1 { color: #ffe36b; }
.card-action, .rank-badge, .rail-btn { background: rgba(245, 207, 59, .94); color: #07182f; }
.work-card strong, .section-title small { color: #ffd83d; }
.favorite-button { background: rgba(10, 31, 56, .94); border-color: rgba(245, 207, 59, .6); color: #ffe36b; }
.favorite-button.active { background: var(--accent); color: #07182f; }
.bottom-nav { background: rgba(7, 24, 47, .96); border-color: var(--line); }
.bottom-nav a { color: #c7c8ad; }
.bottom-nav a.active { color: #ffe36b; }
.sample-player { width: 100%; margin: 18px 0; aspect-ratio: 3 / 2; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #030d1e; }
.sample-player iframe { display: block; width: 100%; height: 100%; border: 0; }
.detail-cinema { max-width: 1180px; }
.detail-cinema .sample-player-large { width: 100%; margin: 8px auto 0; aspect-ratio: 3 / 2; border-radius: 18px; box-shadow: 0 24px 60px rgba(0, 5, 18, .46); }
.detail-summary { max-width: 980px; margin: 34px auto 0; }
.detail-summary > small { color: var(--accent); font-size: 10px; font-weight: 800; letter-spacing: .24em; }
.detail-summary h1 { margin: 10px 0 12px; color: #ffe36b; font-size: clamp(30px, 4.5vw, 54px); line-height: 1.35; }
.detail-summary .detail-performer { margin: 0 0 20px; color: #fff1a6; font-size: clamp(16px, 2vw, 22px); }
.detail-price { display:flex; align-items:center; flex-wrap:wrap; gap:8px 18px; margin: 22px 0 14px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 15px; background: var(--card); }
.detail-price span { color: var(--muted); font-size: 12px; }
.detail-price strong { color: #ffe36b; font-size: clamp(24px, 3vw, 34px); }
.detail-price small { flex-basis: 100%; color: var(--muted); font-size: 10px; }
.detail-cta { min-width: min(100%, 360px); margin-top: 4px; }
footer { background: #061329; color: var(--muted); border-top: 1px solid var(--line); }
footer b { color: #ffe36b; }

/* Unified brand typography: no Yu Gothic or Mincho/serif faces. */
body,
body * {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Noto Sans JP", Arial, sans-serif !important;
}

@media (max-width: 800px) {
  .hero-shade { background: linear-gradient(0deg, var(--bg) 0, rgba(7, 24, 47, .9) 28%, rgba(7, 24, 47, .14) 72%); }
  .detail-cinema .sample-player-large { margin-left: -14px; width: calc(100% + 28px); border-left: 0; border-right: 0; border-radius: 0; }
  .detail-summary { margin-top: 24px; }
  .detail-summary h1 { font-size: 27px; }
  .detail-price { padding: 15px 16px; }
}