/** Shopify CDN: Minification failed

Line 729:0 Unexpected "}"
Line 731:2 Unexpected "0%"
Line 732:2 Unexpected "50%"

**/
/* ニャンガチャ ガチャ画面のスタイル
 * - すべて .nyangacha-root 配下にスコープ（既存のクラス・グローバルなスタイルを上書きしない）
 * - 演出用の @keyframes もこのファイルに閉じ込める（名前は nyangacha- で始める）
 * - 配色は既存「ニノニャン星」セクションに合わせた宇宙の藍色と、桃色（#f2a4a0）
 */
.nyangacha-root {
  max-width: 640px;
  margin: 0 auto;
  padding: 32px 16px 64px;
  text-align: center;
  color: #333;
  box-sizing: border-box;
}
.nyangacha-root *,
.nyangacha-root *::before,
.nyangacha-root *::after {
  box-sizing: border-box;
}
.nyangacha-root [hidden] {
  display: none !important;
}
.nyangacha-root .nyangacha-title {
  margin: 0 0 16px;
  font-size: 24px;
  letter-spacing: 0.2em;
}
.nyangacha-root .nyangacha-sub {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.8;
}
.nyangacha-root .nyangacha-message {
  margin: 24px 0;
  padding: 16px;
  border-radius: 16px;
  background: #fdf2f1;
  font-size: 14px;
  line-height: 1.8;
}

/* ===== 舞台（宇宙）：ヘッダーとフッターの間に、横幅いっぱいに広げる ===== */
.nyangacha-root {
  max-width: none;
  padding: 0;
}
.nyangacha-root .nyangacha-stage {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: calc(100vh - 120px);
  color: #f8f6ff;
  background: #050a1f;
}
.nyangacha-root .nyangacha-stage-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 120px);
  max-width: 560px;
  margin: 0 auto;
  padding: 72px 16px 48px;
}
.nyangacha-root .nyangacha-stage-inner > * {
  width: 100%;
}
.nyangacha-root .nyangacha-stage .nyangacha-title {
  color: #fff;
  text-shadow: 0 0 18px rgba(207, 214, 255, 0.55);
}
.nyangacha-root .nyangacha-exit {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 5;
  padding: 8px 16px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 999px;
  background: rgba(8, 12, 40, 0.45);
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-decoration: none;
}
.nyangacha-root .nyangacha-exit:hover {
  background: rgba(255, 255, 255, 0.16);
}
.nyangacha-root .nyangacha-exit:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

/* 背景：星雲と天の川の画像（assets/nyangacha-space.webp）を、画面いっぱいに */
.nyangacha-root .nyangacha-sky {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background-color: #050a1f;
  background-size: cover;
  background-position: center;
}
/* 文字が載る中央に、暗いやわらかいベールを掛ける（WCAG AA：背景の最も明るい星雲の上でも、白い文字は 4.5:1 以上）。
   端は透明に戻るので、星雲・月・惑星は端で鮮やかなまま。濃さ 0.45 は、背景画像から実測して決めた（flow/nyangacha-space.test.mjs で確認） */
.nyangacha-root .nyangacha-sky::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, rgba(10, 8, 32, 0) 0%, rgba(10, 8, 32, 0.45) 22%, rgba(10, 8, 32, 0.45) 78%, rgba(10, 8, 32, 0) 100%);
}
@media (max-width: 600px) {
  /* スマホでは、文字が画面いっぱいに載るので、全面に同じ濃さで掛ける */
  .nyangacha-root .nyangacha-sky::after {
    background: rgba(10, 8, 32, 0.45);
  }
}

/* 瞬く星：大きさ 3 種類。やわらかい明滅（点滅の速さは 1 秒に 3 回を超えない） */
.nyangacha-root .nyangacha-star {
  position: absolute;
  border-radius: 50%;
  background: #fff;
  opacity: 0.5;
  animation: nyangacha-twinkle 5s ease-in-out infinite;
  animation-delay: var(--d, 0s);
}
.nyangacha-root .nyangacha-star--0 { width: 2px; height: 2px; box-shadow: 0 0 5px 1px rgba(255, 255, 255, 0.7); }
.nyangacha-root .nyangacha-star--1 { width: 3px; height: 3px; box-shadow: 0 0 8px 2px rgba(214, 228, 255, 0.75); animation-duration: 6.5s; }
.nyangacha-root .nyangacha-star--2 { width: 4px; height: 4px; box-shadow: 0 0 12px 3px rgba(255, 224, 200, 0.7); animation-duration: 7.5s; }

/* オーロラ：やわらかい光のカーテンがゆっくり揺れる */
.nyangacha-root .nyangacha-aurora {
  position: absolute;
  left: -20%;
  width: 140%;
  height: 46%;
  opacity: 0.55;
  will-change: transform;
}
.nyangacha-root .nyangacha-aurora--a {
  top: -6%;
  background: radial-gradient(ellipse at 30% 40%, rgba(80, 220, 190, 0.5) 0%, rgba(80, 220, 190, 0) 60%),
    radial-gradient(ellipse at 70% 30%, rgba(150, 110, 255, 0.45) 0%, rgba(150, 110, 255, 0) 60%);
  animation: nyangacha-aurora 18s ease-in-out infinite alternate;
}
.nyangacha-root .nyangacha-aurora--b {
  bottom: -8%;
  height: 40%;
  opacity: 0.42;
  background: radial-gradient(ellipse at 60% 60%, rgba(255, 140, 190, 0.5) 0%, rgba(255, 140, 190, 0) 60%),
    radial-gradient(ellipse at 20% 50%, rgba(120, 160, 255, 0.4) 0%, rgba(120, 160, 255, 0) 60%);
  animation: nyangacha-aurora 24s ease-in-out infinite alternate-reverse;
}

/* 星のちり：金と桃色の光の粒がゆっくり昇っていく */
.nyangacha-root .nyangacha-dust {
  position: absolute;
  bottom: -20px;
  width: var(--s, 4px);
  height: var(--s, 4px);
  border-radius: 50%;
  background: radial-gradient(circle, #fff6d8 0%, #ffd2cf 45%, rgba(255, 210, 207, 0) 72%);
  opacity: 0;
  animation: nyangacha-rise var(--t, 16s) linear infinite;
  animation-delay: var(--d, 0s);
}

/* 猫の星座・月・輪のある惑星（飾り） */
.nyangacha-root .nyangacha-constellation {
  position: absolute;
  top: 64px;
  right: 5%;
  width: min(24vw, 150px);
  opacity: 0.8;
  animation: nyangacha-glow 8s ease-in-out infinite;
}
.nyangacha-root .nyangacha-moon {
  position: absolute;
  top: 5%;
  left: 5%;
  width: min(20vw, 96px);
  filter: drop-shadow(0 0 14px rgba(255, 233, 168, 0.55));
  animation: nyangacha-orbit 28s ease-in-out infinite alternate;
}
.nyangacha-root .nyangacha-planet-ring {
  position: absolute;
  right: -6%;
  bottom: 4%;
  width: min(34vw, 210px);
  filter: drop-shadow(0 0 22px rgba(233, 201, 160, 0.4));
  animation: nyangacha-orbit 34s ease-in-out infinite alternate-reverse;
}
.nyangacha-root .nyangacha-shooting {
  position: absolute;
  left: -20%;
  top: 14%;
  width: 120px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff);
  box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.6);
  opacity: 0;
  transform: rotate(18deg);
}
.nyangacha-root .nyangacha-shooting.is-active {
  animation: nyangacha-shoot 1.4s ease-out 1;
}

@keyframes nyangacha-twinkle {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.95; }
}
@keyframes nyangacha-glow {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 0.9; }
}
@keyframes nyangacha-aurora {
  from { transform: translateX(-4%) skewX(-4deg); }
  to { transform: translateX(4%) skewX(4deg); }
}
@keyframes nyangacha-rise {
  0% { transform: translateY(0) translateX(0); opacity: 0; }
  10% { opacity: 0.9; }
  90% { opacity: 0.7; }
  100% { transform: translateY(-900px) translateX(18px); opacity: 0; }
}
@keyframes nyangacha-orbit {
  from { transform: translate(0, 0); }
  to { transform: translate(-12px, -16px); }
}
@keyframes nyangacha-shoot {
  0% { opacity: 0; transform: translate(0, 0) rotate(18deg); }
  15% { opacity: 1; }
  100% { opacity: 0; transform: translate(130vw, 42vw) rotate(18deg); }
}
@keyframes nyangacha-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes nyangacha-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* ===== 文字・ボタン ===== */
.nyangacha-root .nyangacha-stage .nyangacha-message {
  background: rgba(8, 12, 40, 0.55);
  color: #f8f6ff;
}
.nyangacha-root .nyangacha-order {
  margin: 0 0 12px;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: #c9cfee;
}
.nyangacha-root .nyangacha-remaining {
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: #ffd9d6;
}
.nyangacha-root .nyangacha-pager {
  margin: 12px 0 20px;
  font-size: 12px;
  color: #c9cfee;
}
.nyangacha-root .nyangacha-bubble {
  position: relative;
  max-width: 420px;
  margin: 8px auto 20px;
  padding: 16px 20px;
  border-radius: 20px;
  background: #fff;
  color: #3b2a30;
  font-size: 15px;
  line-height: 1.9;
  box-shadow: 0 0 24px rgba(242, 164, 160, 0.35);
}
.nyangacha-root .nyangacha-bubble--talk {
  margin-bottom: 12px;
}
.nyangacha-root .nyangacha-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
}
.nyangacha-root .nyangacha-btn {
  height: auto; /* テーマの共通ボタンの固定の高さ・行の高さを打ち消す */
  line-height: 1.4;
  margin-bottom: 0;
  min-width: 220px;
  min-height: 48px;
  padding: 12px 28px;
  border: 0;
  border-radius: 999px;
  background: #f8c4c0;
  color: #3b1f24;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
  box-shadow: 0 0 20px rgba(242, 164, 160, 0.45);
}
.nyangacha-root .nyangacha-btn:hover {
  background: #fbd3d0;
}
.nyangacha-root .nyangacha-btn:focus-visible,
.nyangacha-root .nyangacha-help:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}
.nyangacha-root .nyangacha-btn--ghost {
  background: transparent;
  color: #e8eaff;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: none;
  font-weight: 500;
}
.nyangacha-root .nyangacha-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.1);
}
.nyangacha-root .nyangacha-btn--main {
  min-width: 260px;
  min-height: 56px;
  font-size: 18px;
}
.nyangacha-root .nyangacha-help {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 5;
  width: 40px;
  height: 40px;
  padding: 0;
  margin: 0;
  line-height: 1;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font: inherit;
  font-size: 18px;
  cursor: pointer;
}

/* ===== ガチャ機（SVG） ===== */
.nyangacha-root .nyangacha-machine {
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
  filter: drop-shadow(0 0 22px rgba(242, 164, 160, 0.4));
  animation: nyangacha-float 6s ease-in-out infinite;
}
.nyangacha-root .nyangacha-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.nyangacha-root .nyangacha-handle {
  transform-box: fill-box;
  transform-origin: center;
}

/* ===== 演出（data-stage：idle → spin → fall → drop → burst → reveal） ===== */
.nyangacha-root .nyangacha-machine {
  position: relative;
}
/* ケースの中：回転軸は見せない。ハンドルを 1 回転まわすたびに、底に積んだカプセルがごろごろ転がって、ぶつかり合って入れ替わる。
   3 回まわすと、1 個が右手前の穴にすとんと落ちる。カプセルの色は結果と無関係（並べてあるだけ）。 */
.nyangacha-root .nyangacha-cap {
  transform-box: fill-box;
  transform-origin: center;
}
.nyangacha-root .nyangacha-machine.is-turning .nyangacha-cap {
  animation: nyangacha-tumble 0.9s ease-in-out 1;
  animation-delay: calc(var(--i) * 0.05s);
}
.nyangacha-root .nyangacha-stage[data-turn="1"] .nyangacha-machine.is-turning .nyangacha-cap {
  animation-name: nyangacha-tumble-b;
}
/* ハンドル：1 回転ごとに、ぐっと力を入れる（最初はゆっくり、途中から速く、最後にすっと止まる） */
.nyangacha-root .nyangacha-handle.is-turning {
  animation: nyangacha-handle-turn 0.9s cubic-bezier(0.55, 0.05, 0.3, 1) 1;
}
/* 機械：まわすたび、ぐっとわずかに沈み、ガタガタと揺れる */
.nyangacha-root .nyangacha-machine.is-turning .nyangacha-svg {
  animation: nyangacha-rattle 0.9s ease-in-out 1;
  transform-origin: 50% 100%;
}
/* 穴に落ちる 1 個 */
.nyangacha-root .nyangacha-dropper {
  transform-box: fill-box;
  transform-origin: center;
}
.nyangacha-root .nyangacha-stage[data-stage="fall"] .nyangacha-dropper {
  animation: nyangacha-fall 0.7s cubic-bezier(0.5, 0, 0.9, 0.6) 1 forwards;
}
.nyangacha-root .nyangacha-stage[data-stage="fall"] .nyangacha-cap:nth-child(4) {
  animation: nyangacha-cap-gone 0.5s ease-out 1 forwards;
}

/* コイン（猫のイラスト。4 色）：機械の下に並ぶ。選んで投入口へドラッグ（またはタップ）で入る */
.nyangacha-root .nyangacha-coins {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 12px 0 4px;
  min-height: 64px;
}
.nyangacha-root .nyangacha-coin {
  position: relative;
  display: block;
  width: 64px;
  height: 64px;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  line-height: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  cursor: grab;
  touch-action: none; /* 指で動かしている間は、ページのスクロール・拡大にしない */
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none; /* 長押しのメニューを出さない（iOS） */
  -webkit-tap-highlight-color: transparent;
  z-index: 4;
  transform: translate3d(var(--cx, 0px), var(--cy, 0px), 0);
  /* 影は 1 つだけ（複数の drop-shadow は、動かすたびに再計算されて、スマホでは重くなる） */
  filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.35));
  will-change: transform;
  animation: nyangacha-coin-float 3.2s ease-in-out infinite;
  animation-delay: calc(var(--k, 0) * 0.4s);
}
/* 指で掴みやすいよう、見た目より広い当たり判定（透明）を足す。見た目は変えない */
.nyangacha-root .nyangacha-coin::before {
  content: '';
  position: absolute;
  inset: -12px;
  border-radius: 50%;
}
/* 金属のやわらかい光は、動かない別の層で出す（影の再計算を避ける） */
.nyangacha-root .nyangacha-coin::after {
  content: '';
  position: absolute;
  inset: 2px;
  border-radius: 50%;
  box-shadow: 0 0 10px 2px rgba(255, 233, 160, 0.5);
  pointer-events: none;
}
.nyangacha-root .nyangacha-coin:nth-child(2) { --k: 1; }
.nyangacha-root .nyangacha-coin:nth-child(3) { --k: 2; }
.nyangacha-root .nyangacha-coin:nth-child(4) { --k: 3; }
.nyangacha-root .nyangacha-coin svg {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.nyangacha-root .nyangacha-coin.is-dragging {
  cursor: grabbing;
  animation: none !important;
  transition: none !important;
  z-index: 6;
  filter: none;
  will-change: transform;
}
.nyangacha-root .nyangacha-coin.is-dragging::after {
  box-shadow: 0 0 14px 4px rgba(255, 233, 160, 0.75);
}
/* 離したあと、元の位置へすっと戻る（ドラッグ中は上の指定で、遅れなく追従する） */
.nyangacha-root .nyangacha-coin.is-returning {
  animation: none;
  transition: transform 0.22s cubic-bezier(0.2, 0.8, 0.3, 1);
}
.nyangacha-root .nyangacha-coin:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
}
/* 入ったあと：投入口へ吸い込まれて消える。ほかのコインは、すっと薄くなる */
.nyangacha-root .nyangacha-coin.is-inserted {
  animation: nyangacha-coin-in 0.55s ease-in 1 forwards;
  pointer-events: none;
}
.nyangacha-root .nyangacha-coin.is-left {
  animation: nyangacha-coin-left 0.4s ease-out 1 forwards;
  pointer-events: none;
}
/* 投入口が、コインを待っている間はぼんやり光る */
.nyangacha-root .nyangacha-machine:not([data-coin="in"]) [data-nyangacha-part="coin-slot"] {
  animation: nyangacha-slot-glow 2.4s ease-in-out infinite;
}
.nyangacha-root .nyangacha-whisper {
  margin: 0 0 8px;
  font-size: 13px;
  color: #c9cfee;
  line-height: 1.8;
}

/* 取り出し口（機械の左下）から、真珠色のカプセルがころんと出る。機械の絵（SVG）の上に重ねた丸い要素 */
.nyangacha-root .nyangacha-capsule {
  position: absolute;
  left: 7.5%;
  top: 83%;
  width: 11%;
  height: auto; /* テーマの共通ボタンの固定の高さを打ち消す */
  min-height: 0;
  aspect-ratio: 1 / 1;
  margin: 0;
  padding: 0;
  line-height: 0;
  box-sizing: border-box;
  border: 1.5px solid #a894cf;
  border-radius: 50%;
  /* ガチャのカプセル：上は濃いめ、下はうすい 2 色。真ん中に継ぎ目の線。色はまわすたびにランダム（見た目だけ。出てくる子の結果とは無関係） */
  background:
    linear-gradient(to bottom, rgba(0, 0, 0, 0) 47%, #b9a8dd 47%, #b9a8dd 53%, rgba(0, 0, 0, 0) 53%),
    linear-gradient(to bottom, var(--cap-a, #fff6d8) 0%, var(--cap-a, #fff6d8) 50%, var(--cap-b, #e9defa) 50%, var(--cap-b, #e9defa) 100%);
  box-shadow: 0 0 10px rgba(255, 233, 255, 0.95), inset 0 -3px 5px rgba(120, 90, 170, 0.25);
  opacity: 0;
  cursor: pointer;
  pointer-events: none;
}
.nyangacha-root .nyangacha-capsule::after {
  content: '';
  position: absolute;
  left: 18%;
  top: 12%;
  width: 30%;
  height: 18%;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  transform: rotate(-28deg);
}
.nyangacha-root .nyangacha-stage[data-stage="drop"] .nyangacha-capsule,
.nyangacha-root .nyangacha-stage[data-stage="burst"] .nyangacha-capsule {
  pointer-events: auto;
}
.nyangacha-root .nyangacha-stage[data-stage="drop"] .nyangacha-capsule {
  animation: nyangacha-capsule-drop 1.3s cubic-bezier(0.3, 0.8, 0.3, 1) 1 both;
}
.nyangacha-root .nyangacha-stage[data-stage="burst"] .nyangacha-capsule {
  animation: nyangacha-capsule-open 0.9s ease-out 1 forwards;
}

/* 演出中は、ハンドルのボタンを隠す（二重操作の防止。キーボードの操作は、カプセルを開けるボタンに移る） */
.nyangacha-root .nyangacha-stage[data-stage="fall"] [data-nyangacha-handle],
.nyangacha-root .nyangacha-stage[data-stage="drop"] [data-nyangacha-handle],
.nyangacha-root .nyangacha-stage[data-stage="burst"] [data-nyangacha-handle] {
  display: none;
}
.nyangacha-root .nyangacha-actions {
  min-height: 56px;
}

/* 演出の飾り：肉球・光・星のかけら（舞台の上に重ねる。操作の対象外） */
.nyangacha-root .nyangacha-fx {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  overflow: hidden;
}
.nyangacha-root .nyangacha-flash {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 52%, rgba(255, 244, 232, 0.95) 0%, rgba(255, 220, 230, 0.6) 22%, rgba(255, 220, 230, 0) 58%);
  opacity: 0;
}
.nyangacha-root .nyangacha-shards {
  position: absolute;
  left: 50%;
  top: 52%;
  width: 0;
  height: 0;
}
.nyangacha-root .nyangacha-shard {
  position: absolute;
  left: 0;
  top: 0;
  width: 9px;
  height: 9px;
  margin: -4px 0 0 -4px;
  background: #fff6d8;
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
  opacity: 0;
  filter: drop-shadow(0 0 5px rgba(255, 224, 160, 0.9));
}
.nyangacha-root .nyangacha-paws {
  position: absolute;
  inset: 0;
}
.nyangacha-root .nyangacha-paw {
  position: absolute;
  width: 34px;
  height: 34px;
  opacity: 0;
}
.nyangacha-root .nyangacha-paw:nth-child(1) { left: 22%; top: 80%; transform: rotate(-12deg); }
.nyangacha-root .nyangacha-paw:nth-child(2) { left: 30%; top: 68%; transform: rotate(8deg); }
.nyangacha-root .nyangacha-paw:nth-child(3) { left: 40%; top: 77%; transform: rotate(-6deg); }
.nyangacha-root .nyangacha-paw:nth-child(4) { left: 55%; top: 70%; transform: rotate(14deg); }
.nyangacha-root .nyangacha-paw:nth-child(5) { left: 66%; top: 80%; transform: rotate(-10deg); }
.nyangacha-root .nyangacha-paw:nth-child(6) { left: 76%; top: 68%; transform: rotate(10deg); }
.nyangacha-root .nyangacha-stage[data-stage="drop"] .nyangacha-paw {
  animation: nyangacha-paw 0.9s ease-out 1 both;
  animation-delay: calc(var(--i) * 0.14s);
}
.nyangacha-root .nyangacha-stage[data-stage="burst"] .nyangacha-flash {
  animation: nyangacha-flash 0.9s ease-out 1 both;
}
.nyangacha-root .nyangacha-stage[data-stage="burst"] .nyangacha-shard {
  animation: nyangacha-shard 0.9s ease-out 1 both;
  transform: rotate(calc(var(--a) * 1deg));
}
.nyangacha-root .nyangacha-stage[data-stage="reveal"] .nyangacha-shard {
  animation: nyangacha-shard-drift 2.4s ease-out 1 both;
}

/* 結果：キャラが光の輪の中に登場し、背景がキャラの色に染まる（色ごとの演出の違いは「色合い」だけ。派手さは同じ） */
.nyangacha-root .nyangacha-stage[data-stage="reveal"] .nyangacha-card {
  animation: nyangacha-card-in 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 1 both;
}
.nyangacha-root .nyangacha-halo {
  position: relative;
  z-index: 0;
  width: 190px;
  height: 190px;
  margin: -6px auto -178px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--tint, #f4a6b8) 0%, rgba(255, 255, 255, 0) 68%);
  opacity: 0.85;
  animation: nyangacha-halo 5s ease-in-out infinite;
}
.nyangacha-root .nyangacha-card-image {
  position: relative;
  z-index: 1;
  display: block;
  width: 150px;
  height: 150px;
  margin: 0 auto 8px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.85), 0 0 26px 6px var(--tint, #f4a6b8);
}
.nyangacha-root .nyangacha-stage[data-color="momo"] { --tint: #f4a6b8; }
.nyangacha-root .nyangacha-stage[data-color="kinako"] { --tint: #e6cfa8; }
.nyangacha-root .nyangacha-stage[data-color="goma"] { --tint: #b3b3b8; }
.nyangacha-root .nyangacha-stage[data-color="milk"] { --tint: #f5f5fa; }
.nyangacha-root .nyangacha-stage[data-color="choco"] { --tint: #a07a6a; }
.nyangacha-root .nyangacha-stage[data-color="macaron"] { --tint: #b79be0; }
.nyangacha-root .nyangacha-stage[data-stage="reveal"] .nyangacha-sky::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 45%, var(--tint, #f4a6b8) 0%, rgba(0, 0, 0, 0) 62%);
  opacity: 0.32;
  animation: nyangacha-tint 1.2s ease-out 1 both;
}

@keyframes nyangacha-handle-turn {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(40deg); }
  80% { transform: rotate(350deg); }
  100% { transform: rotate(360deg); }
}
@keyframes nyangacha-rattle {
  0%, 100% { transform: translate(0, 0); }
  8% { transform: translate(0, 2px) rotate(-0.3deg); }
  20% { transform: translate(-2px, 0) rotate(0.5deg); }
  34% { transform: translate(2px, 1px) rotate(-0.5deg); }
  48% { transform: translate(-2px, 0) rotate(0.4deg); }
  62% { transform: translate(2px, 1px) rotate(-0.4deg); }
  78% { transform: translate(-1px, 0) rotate(0.3deg); }
}
@keyframes nyangacha-tumble {
  0% { transform: translate(0, 0) rotate(0deg); }
  20% { transform: translate(calc(var(--dx) * 0.9px), calc(var(--dy) * 1.4px)) rotate(calc(var(--rot) * 0.3deg)); }
  45% { transform: translate(calc(var(--dx) * -0.5px), calc(var(--dy) * -0.2px)) rotate(calc(var(--rot) * 0.6deg)); }
  70% { transform: translate(calc(var(--dx) * 0.6px), calc(var(--dy) * 0.9px)) rotate(calc(var(--rot) * 0.85deg)); }
  100% { transform: translate(calc(var(--dx) * 0.15px), 0) rotate(calc(var(--rot) * 1deg)); }
}
@keyframes nyangacha-tumble-b {
  0% { transform: translate(calc(var(--dx) * 0.15px), 0) rotate(calc(var(--rot) * 1deg)); }
  25% { transform: translate(calc(var(--dx) * -0.8px), calc(var(--dy) * 1.2px)) rotate(calc(var(--rot) * 1.3deg)); }
  50% { transform: translate(calc(var(--dx) * 0.5px), calc(var(--dy) * -0.3px)) rotate(calc(var(--rot) * 1.6deg)); }
  75% { transform: translate(calc(var(--dx) * -0.4px), calc(var(--dy) * 0.8px)) rotate(calc(var(--rot) * 1.85deg)); }
  100% { transform: translate(calc(var(--dx) * -0.1px), 0) rotate(calc(var(--rot) * 2deg)); }
}
@keyframes nyangacha-fall {
  0% { opacity: 1; transform: translate(0, 0) scale(1); }
  35% { opacity: 1; transform: translate(0, 6px) scale(1); }
  100% { opacity: 0; transform: translate(0, 40px) scale(0.85); }
}
@keyframes nyangacha-cap-gone {
  to { opacity: 0; transform: translate(40px, 18px) scale(0.8); }
}
@keyframes nyangacha-coin-float {
  0%, 100% { transform: translate(var(--cx, 0px), var(--cy, 0px)) rotate(-4deg); }
  50% { transform: translate(var(--cx, 0px), calc(var(--cy, 0px) - 6px)) rotate(4deg); }
}
@keyframes nyangacha-coin-left {
  from { opacity: 1; }
  to { opacity: 0; transform: translate(var(--cx, 0px), calc(var(--cy, 0px) + 10px)) scale(0.8); }
}
@keyframes nyangacha-coin-in {
  0% { opacity: 1; transform: translate(var(--cx, 0px), var(--cy, 0px)) scale(1); }
  70% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--cx, 0px), calc(var(--cy, 0px) - 40px)) scale(0.3); }
}
}
@keyframes nyangacha-slot-glow {
  0%, 100% { filter: none; }
  50% { filter: drop-shadow(0 0 6px rgba(255, 224, 120, 0.95)); }
}
@keyframes nyangacha-capsule-drop {
  0% { transform: translate(40%, -520%) scale(0.5); opacity: 0; }
  12% { opacity: 1; }
  55% { transform: translate(8%, 24%) scale(1.5); }
  70% { transform: translate(-6%, -14%) scale(1.45); }
  85% { transform: translate(-10%, 8%) scale(1.5); }
  100% { transform: translate(-10%, 0) scale(1.5); opacity: 1; }
}
@keyframes nyangacha-capsule-open {
  0% { transform: translate(-10%, 0) scale(1.5) rotate(0); opacity: 1; }
  60% { transform: translate(-10%, 0) scale(2.6) rotate(14deg); opacity: 1; }
  100% { transform: translate(-10%, 0) scale(3.6) rotate(24deg); opacity: 0; }
}
@keyframes nyangacha-paw {
  0% { opacity: 0; transform: scale(0.4); }
  40% { opacity: 0.9; transform: scale(1.1); }
  100% { opacity: 0.35; transform: scale(1); }
}
@keyframes nyangacha-flash {
  0% { opacity: 0; }
  35% { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes nyangacha-shard {
  0% { opacity: 0; transform: rotate(calc(var(--a) * 1deg)) translateX(0) scale(0.4); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: rotate(calc(var(--a) * 1deg)) translateX(150px) scale(1); }
}
@keyframes nyangacha-shard-drift {
  0% { opacity: 0.9; transform: rotate(calc(var(--a) * 1deg)) translateX(150px) scale(1); }
  100% { opacity: 0; transform: rotate(calc(var(--a) * 1deg)) translateX(210px) scale(0.6); }
}
@keyframes nyangacha-card-in {
  0% { opacity: 0; transform: translateY(18px) scale(0.92); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes nyangacha-halo {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 0.95; transform: scale(1.08); }
}
@keyframes nyangacha-tint {
  0% { opacity: 0; }
  100% { opacity: 0.32; }
}

/* ===== 結果 ===== */
.nyangacha-root .nyangacha-card {
  max-width: 420px;
  margin: 0 auto;
  padding: 24px 20px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.95);
  color: #3b2a30;
  box-shadow: 0 0 36px rgba(242, 164, 160, 0.5);
}
.nyangacha-root .nyangacha-card:focus {
  outline: none;
}
.nyangacha-root .nyangacha-card-head {
  margin: 0 0 4px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
}
.nyangacha-root .nyangacha-card-label {
  margin: 0 0 12px;
  font-size: 13px;
  color: #8a6a70;
}
.nyangacha-root .nyangacha-card-outro {
  margin: 0;
  font-size: 13px;
  line-height: 1.8;
  color: #6b5a60;
}

/* ===== 最後のページ：お迎えする子たち（GIF とプロフィール） ===== */
.nyangacha-root .nyangacha-done-head {
  margin: 0 0 12px;
  font-size: 20px;
  letter-spacing: 0.12em;
  text-shadow: 0 0 14px rgba(207, 214, 255, 0.5);
}
.nyangacha-root .nyangacha-friends {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 16px auto;
  padding: 0;
  list-style: none;
  max-width: 420px;
}
.nyangacha-root .nyangacha-friend {
  position: relative;
  padding: 22px 18px 18px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.96);
  color: #3b2a30;
  text-align: center;
  box-shadow: 0 0 28px var(--tint, rgba(242, 164, 160, 0.5));
  animation: nyangacha-card-in 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) 1 both;
}
.nyangacha-root .nyangacha-friend[data-color="momo"] { --tint: #f4a6b8; }
.nyangacha-root .nyangacha-friend[data-color="kinako"] { --tint: #e6cfa8; }
.nyangacha-root .nyangacha-friend[data-color="goma"] { --tint: #b3b3b8; }
.nyangacha-root .nyangacha-friend[data-color="milk"] { --tint: #dcdcf0; }
.nyangacha-root .nyangacha-friend[data-color="choco"] { --tint: #a07a6a; }
.nyangacha-root .nyangacha-friend[data-color="macaron"] { --tint: #b79be0; }
.nyangacha-root .nyangacha-friend-image {
  display: block;
  width: 96px;
  height: 96px;
  margin: 12px auto 16px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--tint, #f4a6b8), 0 0 22px 3px var(--tint, #f4a6b8);
}
.nyangacha-root .nyangacha-friend-label {
  margin: 0 0 4px;
  font-size: 12px;
  color: #6b7280;
}
.nyangacha-root .nyangacha-friend-name {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  color: #111827;
}
.nyangacha-root .nyangacha-friend-count {
  font-size: 14px;
  color: #6b7280;
}
/* 説明文：既存のキャラ紹介（モーダル）と同じ。小さめ・グレー・中央 */
.nyangacha-root .nyangacha-friend-desc {
  margin: 0 0 14px;
  font-size: 12px;
  line-height: 1.9;
  color: #4b5563;
}
.nyangacha-root .nyangacha-friend-btn {
  min-width: 0;
  min-height: 40px;
  padding: 8px 20px;
  border-color: #c9a0a8;
  color: #6b4a52;
  font-size: 14px;
}
.nyangacha-root .nyangacha-stage .nyangacha-friend .nyangacha-friend-btn {
  color: #6b4a52;
  text-shadow: none;
}
.nyangacha-root .nyangacha-friend-btn:hover {
  background: rgba(242, 164, 160, 0.16);
}
/* PROFILE：既存のキャラ紹介と同じ。赤い点線が左右に伸びる見出しと、「項目：値」の 3 列の表、バナー画像（2:1） */
.nyangacha-root .nyangacha-profile {
  margin-top: 16px;
}
.nyangacha-root .nyangacha-profile-head {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.nyangacha-root .nyangacha-profile-head::before,
.nyangacha-root .nyangacha-profile-head::after {
  content: '';
  flex: 1;
  height: 0;
  border-top: 2px dotted #b60b0b;
}
.nyangacha-root .nyangacha-profile-label {
  padding: 0 0.75rem;
  font-weight: 700;
  color: #111827;
}
.nyangacha-root .nyangacha-profile-table {
  display: grid;
  grid-template-columns: auto auto auto;
  justify-content: center;
  row-gap: 4px;
  column-gap: 4px;
  margin: 0 auto 12px;
  font-size: 12px;
  line-height: 1.7;
  text-align: left;
  color: #374151;
}
.nyangacha-root .nyangacha-profile-row {
  display: contents;
}
.nyangacha-root .nyangacha-profile-gallery {
  width: 100%;
  margin-top: 0.5rem;
  border-radius: 0.75rem;
  overflow: hidden;
  background: #f3f4f6;
  aspect-ratio: 2 / 1;
  max-height: 50vh;
}
.nyangacha-root .nyangacha-profile-gallery img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nyangacha-root .nyangacha-note {
  margin: 12px 0 0;
  font-size: 12px;
  color: #c9cfee;
}
.nyangacha-root .nyangacha-live {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ===== 動きを減らす設定 ===== */
@media (prefers-reduced-motion: reduce) {
  .nyangacha-root .nyangacha-star,
  .nyangacha-root .nyangacha-aurora,
  .nyangacha-root .nyangacha-dust,
  .nyangacha-root .nyangacha-constellation,
  .nyangacha-root .nyangacha-moon,
  .nyangacha-root .nyangacha-planet-ring,
  .nyangacha-root .nyangacha-machine,
  .nyangacha-root .nyangacha-shooting {
    animation: none !important;
  }
  .nyangacha-root .nyangacha-dust {
    display: none;
  }
  .nyangacha-root .nyangacha-handle,
  .nyangacha-root .nyangacha-cap,
  .nyangacha-root .nyangacha-coin,
  .nyangacha-root .nyangacha-dropper,
  .nyangacha-root .nyangacha-svg,
  .nyangacha-root .nyangacha-capsule,
  .nyangacha-root .nyangacha-paw,
  .nyangacha-root .nyangacha-shard,
  .nyangacha-root .nyangacha-flash,
  .nyangacha-root .nyangacha-halo,
  .nyangacha-root [data-nyangacha-part="capsules"],
  .nyangacha-root [data-nyangacha-part="coin-slot"] {
    animation: none !important;
  }
  .nyangacha-root .nyangacha-shard,
  .nyangacha-root .nyangacha-paw,
  .nyangacha-root .nyangacha-flash {
    display: none;
  }
  .nyangacha-root .nyangacha-stage[data-stage="drop"] .nyangacha-capsule {
    opacity: 1;
    transform: translate(-10%, 0) scale(1.5);
  }
  .nyangacha-root .nyangacha-stage[data-stage="burst"] .nyangacha-capsule {
    opacity: 0;
  }
  .nyangacha-root .nyangacha-coin.is-inserted,
  .nyangacha-root .nyangacha-coin.is-left {
    opacity: 0;
  }
  .nyangacha-root .nyangacha-coin.is-returning {
    transition: none;
  }
  .nyangacha-root .nyangacha-stage[data-stage="reveal"] .nyangacha-card {
    animation: nyangacha-fade 0.4s ease-out 1 both !important;
  }
  .nyangacha-root .nyangacha-stage[data-stage="reveal"] .nyangacha-sky::before {
    animation: none !important;
  }
}

/* 画面を離れている間（別のタブ）は動きを止めて、電池と通信を節約する */
.nyangacha-root .nyangacha-stage[data-paused="true"] *,
.nyangacha-root .nyangacha-stage[data-paused="true"] *::before,
.nyangacha-root .nyangacha-stage[data-paused="true"] *::after {
  animation-play-state: paused !important;
}

/* 舞台の中の文字は、宇宙の背景の上で読めるよう、明るい色を明示する（テーマの h1〜h6・p・a の色指定に負けないよう、詳細度を上げる） */
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner h1,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner h2,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner h3,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner > div > p,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner > div > ul + p {
  color: #fff;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-sub,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-done-head,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-title {
  color: #fff;
  text-shadow: 0 0 12px rgba(207, 214, 255, 0.55), 0 1px 3px rgba(5, 8, 30, 0.8);
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-order,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-pager,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-note,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-whisper {
  color: #e6e9ff;
  text-shadow: 0 1px 3px rgba(5, 8, 30, 0.85);
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-remaining {
  color: #ffe3e0;
  text-shadow: 0 1px 3px rgba(5, 8, 30, 0.85);
}
/* 白いカードの中は、濃い色にもどす（上の指定が及ばないようにする） */
.nyangacha-root .nyangacha-stage .nyangacha-bubble,
.nyangacha-root .nyangacha-stage .nyangacha-card,
.nyangacha-root .nyangacha-stage .nyangacha-friend {
  color: #3b2a30;
  text-shadow: none;
}
.nyangacha-root .nyangacha-stage .nyangacha-btn {
  color: #3b1f24;
  text-shadow: none;
}
.nyangacha-root .nyangacha-stage .nyangacha-btn--ghost {
  color: #fff;
  text-shadow: 0 1px 3px rgba(5, 8, 30, 0.7);
}

.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-friend h3,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-friend .nyangacha-friend-name {
  color: #111827;
  text-shadow: none;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-friend .nyangacha-friend-label {
  color: #6b7280;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-friend .nyangacha-friend-desc {
  color: #4b5563;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-friend .nyangacha-friend-count {
  color: #6b7280;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-card p,
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-bubble {
  text-shadow: none;
}
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-card .nyangacha-card-head { color: #3b2a30; }
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-card .nyangacha-card-label { color: #8a6a70; }
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-card .nyangacha-card-outro { color: #6b5a60; }
.nyangacha-root .nyangacha-stage .nyangacha-stage-inner .nyangacha-bubble { color: #3b2a30; }

/* コインを指で動かしている間は、舞台のスクロールを止める（モバイルで、指の動きがスクロールに取られないように） */
.nyangacha-root .nyangacha-stage.is-coin-dragging {
  overflow: hidden;
  overscroll-behavior: contain;
}

/* 穴に落ちるカプセルの色（まわすたびに変わる。CSS 変数 --cap-a / --cap-b は、assets/nyangacha.js の見た目専用の関数が決める） */
.nyangacha-root .nyangacha-machine .nyangacha-cap-a {
  fill: var(--cap-a, #fff6d8);
}
.nyangacha-root .nyangacha-machine .nyangacha-cap-b {
  fill: var(--cap-b, #e9defa);
}

/* ===== 文章の折り返し =====
   日本語の文を、単語の途中で切らずに、読みやすく折り返す。
   - 文言には、意味の区切りで改行（\n → <br>）を入れてある
   - word-break: auto-phrase：対応ブラウザでは、文節で自動的に折り返す
   - line-break: strict：禁則処理（句読点・小さい「っ」「ゃ」などを行頭に出さない）
   - overflow-wrap: anywhere：長い文字列（英数字）が、枠からはみ出さない */
.nyangacha-root .nyangacha-stage {
  word-break: auto-phrase;
  line-break: strict;
  overflow-wrap: anywhere;
}
.nyangacha-root .nyangacha-bubble {
  line-height: 2;
}
