/* 表裏フリップ＝Qurioverse の署名的操作: 作品面（銀河）⇄ 思想面（曼荼羅／その媒体の裏面）。
   全銀河で同一のジェスチャ・意味・テンポ（rotateY 180 / var(--fade) / reduced-motion で cut）。
   裏面の"形"だけが媒体の性質に従う（D-12）。この1ファイル＋flip.js が署名機構の単一 SSOT
   ＝各銀河ラッパーはこれを link/script するだけ（骨格の複製ドリフトを防ぐ）。生成物 iframe は無改変（D-2）。 */
html, body { height: 100%; overflow: hidden; }

.flip-stage { position: fixed; inset: 0; z-index: 1; -webkit-perspective: 2200px; perspective: 2200px; } /* 大きく穏やかな遠近＝天体規模の緩慢な転回 */
.flip-card {
  position: absolute; inset: 0;
  -webkit-transform-style: preserve-3d; transform-style: preserve-3d;
  -webkit-transition: -webkit-transform var(--fade) ease;
  transition: transform var(--fade) ease; /* 1.6s ＝「すべて遅い」不変条件。reduced-motion で全 transition 無効化→回転せず面が瞬時入替＝cut degrade */
}
.flip-card.flipped { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); }
.flip-face {
  position: absolute; inset: 0; overflow: hidden;
  -webkit-backface-visibility: hidden; backface-visibility: hidden; /* 旧 WebKit 用 prefix 併記＝裏面透け（鏡像露呈）防止 */
}
.flip-face iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: var(--space-0); }
.flip-back { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); } /* pre-rotation ＝裏面が鏡像にならない（明朝／軸ラベルが左右反転しない） */

.overlay {
  position: fixed; right: 22px; top: 18px; z-index: 10;
  display: flex; gap: 12px; align-items: center;
  font-size: 12.5px; letter-spacing: 0.14em;
  animation: page-in var(--fade) ease both;
}
.overlay a, .overlay button {
  color: var(--muted); background: rgba(6, 4, 9, 0.55); /* = --space-0 α0.55（既存 wb.css の pill と同一リテラル。--panel-bg 化は review-ledger COULD） */
  border: 1px solid var(--line); border-radius: 999px;
  padding: 7px 18px; backdrop-filter: blur(4px);
  font: inherit; letter-spacing: inherit; cursor: pointer;
  transition: color var(--hover) ease, border-color var(--hover) ease;
}
.overlay a:hover, .overlay a:focus-visible,
.overlay button:hover, .overlay button:focus-visible,
.overlay button.active { color: var(--gold); border-color: var(--gold-dim); } /* .active ＝裏面表示中（aria-pressed は使わない: 文言トグルと二重シグナルになるため） */