/* templates/_theme_lab.html から出した（重さの直し a・11/02）。中身は前のまま */
/* ── ① 白：夜明けの白（明るい・紙のような温かみ） ── */
html[data-site-theme="dawn"] { color-scheme: light; }
html[data-site-theme="dawn"] body {
  --bg: #faf7f1;
  --surface: #ffffff;
  --surface-strong: #f3eee4;
  --border: #e7e0d2;
  --text: #24201a;
  --text-muted: #5d574c;
  --text-faint: #8b8476;
  --accent: #b5650d;
  --accent-contrast: #ffffff;
  --bad: #b3261e;
  background: radial-gradient(1200px 600px at 50% -10%, #fff3dc 0%, rgba(255,243,220,0) 60%), var(--bg);
}
html[data-site-theme="dawn"] select,
html[data-site-theme="dawn"] input,
html[data-site-theme="dawn"] textarea { background: #fff; color: var(--text); border-color: var(--border); }
html[data-site-theme="dawn"] .card { box-shadow: 0 1px 2px rgba(60,40,10,.05), 0 8px 24px rgba(60,40,10,.06); }
html[data-site-theme="dawn"] .ranked-track,
html[data-site-theme="dawn"] .horo-track,
html[data-site-theme="dawn"] .gauge,
html[data-site-theme="dawn"] .step-bar,
html[data-site-theme="dawn"] .balance-bar { background: #ece6da; }
html[data-site-theme="dawn"] .chart-table td,
html[data-site-theme="dawn"] .today-purposes li,
html[data-site-theme="dawn"] .reading-list li,
html[data-site-theme="dawn"] .steps li,
html[data-site-theme="dawn"] .buy-row,
html[data-site-theme="dawn"] .profile-row,
html[data-site-theme="dawn"] .planet-table td,
html[data-site-theme="dawn"] .scoring-table td,
html[data-site-theme="dawn"] .proof-table th, html[data-site-theme="dawn"] .proof-table td,
html[data-site-theme="dawn"] .confirm-table th, html[data-site-theme="dawn"] .confirm-table td { border-bottom-color: rgba(60,40,10,.08); }
html[data-site-theme="dawn"] .sheet-panel { background: #fff; box-shadow: 0 20px 60px rgba(60,40,10,.18); }
html[data-site-theme="dawn"] .sheet-backdrop { background: rgba(40,30,10,.35); }
html[data-site-theme="dawn"] .moon-dark { fill: rgba(40,30,10,.08); }
html[data-site-theme="dawn"] .tarot-slot-front { background: linear-gradient(135deg, #fbe7c6, #fff); }

/* ── ② 薄明：淡い夜空のグラデーション＋ゆっくり瞬く星（黒より明るく、夜の雰囲気は残す） ── */
html[data-site-theme="twilight"] body {
  --bg: #16183a;
  --surface: rgba(255,255,255,.07);
  --surface-strong: rgba(255,255,255,.11);
  --border: rgba(255,255,255,.14);
  --text: #f4f2fb;
  --text-muted: #c3bfdc;
  --text-faint: #9a95bd;
  --accent: #ffc76e;
  --accent-contrast: #1d1530;
  background: linear-gradient(180deg, #1b2050 0%, #2c2560 45%, #4a2f66 80%, #6b3b62 100%) fixed;
}
html[data-site-theme="twilight"] body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1;
  background-image:
    radial-gradient(1.2px 1.2px at 12% 18%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 28% 72%, #fff 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 46% 34%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 63% 12%, #fff 50%, transparent 51%),
    radial-gradient(1.3px 1.3px at 78% 58%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 88% 26%, #fff 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 7% 86%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 55% 90%, #fff 50%, transparent 51%);
  background-size: 420px 420px;
  opacity: .55;
  animation: tl-twinkle 6s ease-in-out infinite alternate;
}
html[data-site-theme="twilight"] .tab-bar { background: rgba(255,255,255,.06); border-radius: 14px; }
html[data-site-theme="twilight"] select,
html[data-site-theme="twilight"] input,
html[data-site-theme="twilight"] textarea { background: rgba(10,10,40,.35); }
@keyframes tl-twinkle { from { opacity: .35; } to { opacity: .7; } }

/* ── ③ ガラス：近未来的。ゆっくり動く光の帯＋すりガラスのカード ── */
html[data-site-theme="glass"] body {
  --bg: #060914;
  --surface: rgba(255,255,255,.06);
  --surface-strong: rgba(255,255,255,.1);
  --border: rgba(160,220,255,.22);
  --text: #eef6ff;
  --text-muted: #a9bfd6;
  --text-faint: #7f93ab;
  --accent: #6ee7f0;
  --accent-contrast: #04202a;
  background: var(--bg);
}
html[data-site-theme="glass"] body::before {
  content: ""; position: fixed; inset: -20%; pointer-events: none; z-index: -1;
  background:
    radial-gradient(40% 35% at 20% 30%, rgba(110,231,240,.35), transparent 70%),
    radial-gradient(35% 40% at 80% 20%, rgba(167,139,250,.35), transparent 70%),
    radial-gradient(45% 40% at 60% 85%, rgba(56,189,248,.25), transparent 70%);
  filter: blur(30px);
  animation: gl-drift 18s ease-in-out infinite alternate;
}
html[data-site-theme="glass"] .card,
html[data-site-theme="glass"] .tab-bar {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(160,220,255,.22);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.03) inset, 0 10px 40px rgba(0,0,0,.35);
}
html[data-site-theme="glass"] .entry-button.accent,
html[data-site-theme="glass"] button[type="submit"]:not(.text-button):not(.danger-button) {
  background: linear-gradient(90deg, #6ee7f0, #a78bfa); color: #061420; border: 0;
}
html[data-site-theme="glass"] select,
html[data-site-theme="glass"] input,
html[data-site-theme="glass"] textarea { background: rgba(0,10,30,.45); border-color: rgba(160,220,255,.25); }
@keyframes gl-drift { from { transform: translate3d(-3%, -2%, 0) rotate(0deg); } to { transform: translate3d(3%, 2%, 0) rotate(8deg); } }

/* ── ④ 星空（全画面）：画面いっぱいに動く星空。動画の代わりに、その場で描く（素材の権利の心配がない） ── */
/* 読み物（カード）を半透明にして、奥の星空がうっすら見えるように（お試し・社長 10/08） */
html[data-site-theme="cosmos"][data-sky="night"] .card,
html[data-site-theme="cosmos"][data-sky="night"] .tab-bar {
  background: rgba(6, 9, 26, .42);
  border-color: rgba(255, 255, 255, .10);
  -webkit-backdrop-filter: blur(2.5px); backdrop-filter: blur(2.5px);
}
html[data-site-theme="cosmos"] body {
  --bg: #02030a;
  --surface: rgba(8,10,25,.55);
  --surface-strong: rgba(20,24,50,.6);
  --border: rgba(255,255,255,.12);
  --text: #f6f5ff;
  --text-muted: #b9b8d6;
  --text-faint: #8d8cad;
  --accent: #ffcf7a;
  background: linear-gradient(180deg, var(--sky-top, #02030a), var(--sky-mid, #05081a) 62%, var(--sky-bottom, #0b1030)) fixed;
}
/* 背景（星空・光の帯）は z-index:-1 にして、中身を別の重なりに分けない（分けると月の「透かし」が背景に届かない） */
html[data-site-theme="cosmos"] #theme-lab-sky { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; z-index: -1; pointer-events: none; }
/* 海の動画（Pexels「Rippled Water at Night」dabatepatvideos・商用可・出典表示不要）。
   動画の上半分（遠くの波）だけを、画面の下の海の帯に合わせて出す。暗いところは「スクリーン」で透ける */
html[data-site-theme="cosmos"] #theme-lab-sea {
  position: fixed; left: -80vw; width: 180vw; z-index: -1; pointer-events: none;   /* 動画を横に広げて、右側（波が穏やか）を画面に */
  object-fit: cover; object-position: 50% 0%; mix-blend-mode: screen; opacity: .8;
  transition: filter 8s ease, opacity 8s ease;   /* 海の色も、朝夕はゆっくり変える */
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 6%, #000 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 6%, #000 100%);
}
html[data-sea="night"] #theme-lab-sea { filter: grayscale(1) brightness(1.5) sepia(.25) hue-rotate(185deg) saturate(1.3); }
html[data-sea="day"] #theme-lab-sea { filter: grayscale(1) brightness(2.2) contrast(1.2); opacity: .7; }
html[data-sea="dusk"] #theme-lab-sea { filter: brightness(1.3) saturate(1.2); }
html[data-site-theme="cosmos"] .card,
html[data-site-theme="cosmos"] .tab-bar { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
html[data-site-theme="cosmos"] .tab-bar { background: rgba(8,10,25,.45); border-radius: 14px; }
/* 昼（太陽が地平線より6度以上上）：空が明るいので、文字を濃く・カードを白っぽい半透明に */
/* 朝と夕方の切り替わり：文字・カード・枠の色を、急に変えずに数秒かけてなじませる（社長 10/08）
   ボタンやリンクは、押したときの反応が遅く見えないよう対象にしない。
   選ぶもの（タブ・label・入力欄・summary）も外した：占いの入力画面で、押してから色が変わるまで4秒かかり
   「しゅわしゅわ遅すぎ」になっていた（10/14）。押したらすぐ変わる */
html[data-site-theme="cosmos"] body,
html[data-site-theme="cosmos"] .card, html[data-site-theme="cosmos"] .tab-bar,
html[data-site-theme="cosmos"] h1, html[data-site-theme="cosmos"] h2, html[data-site-theme="cosmos"] h3,
html[data-site-theme="cosmos"] p, html[data-site-theme="cosmos"] li, html[data-site-theme="cosmos"] dt,
html[data-site-theme="cosmos"] dd {
  transition: background-color 4s ease, border-color 4s ease;   /* 文字の色はなじませない（途中で読めなくなる瞬間があった・人の感想 10/14） */
}
html[data-site-theme="cosmos"][data-sky-settling] *, html[data-site-theme="cosmos"][data-sky-settling] body { transition: none !important; }
html[data-site-theme="cosmos"][data-sky="day"] body {
  --surface: rgba(255,255,255,.74);
  --surface-strong: rgba(255,255,255,.84);
  --border: rgba(255,255,255,.75);
  --text: #0f1d33;
  --text-muted: #2f4360;
  --text-faint: #4d6280;
  --accent: #a2530a;
  --accent-contrast: #ffffff;
  color-scheme: light;
}
html[data-site-theme="cosmos"][data-sky="day"] .tab-bar { background: rgba(255,255,255,.4); }
html[data-site-theme="cosmos"][data-sky="day"] .tab,
html[data-site-theme="cosmos"][data-sky="day"] .tab-price,
html[data-site-theme="cosmos"][data-sky="day"] .tab-desc-line { color: #22344f; }   /* 昼の空でも、選んでいないタブの文字が読めるように */
/* 朝焼け・夕焼け（太陽が −10〜0.5度）：空が明るい橙なので、夜のままの透けたカードだと文字が沈む（社長 10/09）。
   カードを濃くして、小さな文字も明るくする */
html[data-site-theme="cosmos"][data-sky="twilight"] body {
  --surface: rgba(18,14,38,.74);
  --surface-strong: rgba(26,22,52,.82);
  --border: rgba(255,255,255,.18);
  --text-muted: #e2dff2;
  --text-faint: #c4c1dc;
}
html[data-site-theme="cosmos"][data-sky="twilight"] .card { background: rgba(18,14,38,.72); border-color: rgba(255,255,255,.16);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
html[data-site-theme="cosmos"][data-sky="twilight"] .tab-bar { background: rgba(18,14,38,.62); }
html[data-site-theme="cosmos"][data-sky="twilight"] .container > p,
html[data-site-theme="cosmos"][data-sky="twilight"] .tab-desc-line,
html[data-site-theme="cosmos"][data-sky="twilight"] .container > .field-note { text-shadow: 0 1px 6px rgba(10,8,30,.75); color: #f2f0ff; }
html[data-site-theme="cosmos"][data-sky="day"] select,
html[data-site-theme="cosmos"][data-sky="day"] input,
html[data-site-theme="cosmos"][data-sky="day"] textarea { background: rgba(255,255,255,.75); color: var(--text); }

/* ── 真ん中の月（わたしのそら・みんなのそら）：黒い玉に見えないように（2026-10-08 社長） ──
   月の絵は欠けている側が黒い写真。暗い背景では「スクリーン」で重ねると黒が透けて、光っている所だけが残る */
html[data-site-theme="now"] .moon-body,
html[data-site-theme="twilight"] .moon-body,
html[data-site-theme="glass"] .moon-body { border-radius: 50%; filter: none; }   /* 外側の光（filter）があると、重ね方が効かない */
html[data-site-theme="now"] .moon-body img,
html[data-site-theme="twilight"] .moon-body img,
html[data-site-theme="glass"] .moon-body img { mix-blend-mode: screen; filter: brightness(1.1) contrast(1.45); }  /* 暗い側（28,28,35）だけを黒に落とし、光っている縁は残す */
html[data-site-theme] .moon-body::after,
html[data-site-theme] .locked-moon::after {
  content: ""; position: absolute; border-radius: 50%; pointer-events: none;
  box-shadow: inset 0 0 10px 0 rgba(190,205,255,.07);             /* 欠けている側が、あるかないかくらいに見える */
  mix-blend-mode: screen;                                           /* 光っている側では、ほとんど見えない */
}
/* 写真の月は縁にいくほど暗いので、光って見える縁に合わせて少し内側に描く */
html[data-site-theme] .moon-body::after { inset: 2.5%; }
html[data-site-theme] .locked-moon::after { left: 3px; top: 3px; width: 102px; height: 102px; }
html[data-site-theme="dawn"] .moon-body::after,
html[data-site-theme="dawn"] .locked-moon::after { box-shadow: inset 0 0 10px 0 rgba(60,40,10,.06); mix-blend-mode: multiply; }
html[data-site-theme="cosmos"][data-sky="day"] .locked-moon::after { box-shadow: inset 0 0 10px 0 rgba(255,255,255,.2); }
/* 白：白地に黒い玉にならないよう、明暗を反転して「かけ合わせ」で重ねる。
   欠けている側は白に溶け、光っている所が鉛筆で描いたような月の形として残る。輪郭はうっすら */
html[data-site-theme="dawn"] .moon-body { border-radius: 50%; filter: none; }
html[data-site-theme="dawn"] .moon-body img { mix-blend-mode: multiply; filter: invert(1) contrast(1.5) brightness(1.15) sepia(.35); }
/* わたしのそら（ログイン前の案内）の大きな月も同じ。どの見た目でも黒い玉にしない */
html[data-site-theme] .locked-moon img { mix-blend-mode: screen; filter: brightness(1.1) contrast(1.45); }
html[data-site-theme] .locked-moon { border-radius: 50%; }
html[data-site-theme="dawn"] .locked-moon img { mix-blend-mode: multiply; filter: invert(1) contrast(1.5) brightness(1.15) sepia(.35); }
/* 星空：本物の月が空に出ているので、絵は出さずに文字だけ残す */
html[data-site-theme="cosmos"] .moon-track,
html[data-site-theme="cosmos"] .moon-sky { display: none; }
html[data-site-theme="cosmos"] .moon-caption { margin-top: 8px; }

@media (prefers-reduced-motion: reduce) {
  html[data-site-theme] body::before { animation: none; }
}

/* ── 切り替えボタン（ステージングだけに出る） ── */
#theme-lab {
  position: fixed; left: 12px; bottom: 12px; z-index: 9999;
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px;
  max-width: calc(100vw - 24px);
  padding: 6px 8px; border-radius: 14px;
  background: rgba(20,20,24,.88); color: #fff;
  font: 12px/1.2 "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
#theme-lab b { padding: 0 4px; font-weight: 700; opacity: .8; }
#theme-lab button {
  appearance: none; margin: 0; padding: 5px 9px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25); background: transparent; color: #fff;
  font: inherit; cursor: pointer; width: auto;
}
#theme-lab button[aria-pressed="true"] { background: #fff; color: #111; border-color: #fff; }
#theme-lab .tl-hide { border: 0; opacity: .6; }
/* 入力画面（ポップアップ）を開いているあいだは、空のボタンと見た目の切り替えを隠す（「次へ」「戻る」にかぶさるため） */
body.sheet-open #sky-ctl, body.sheet-open #theme-lab { display: none !important; }
/* 星空：空の時刻と場所（右下の丸いボタン → 開くと選べる） */
#sky-ctl {
  position: fixed; right: 12px; bottom: 12px; z-index: 9998;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
  font: 13px/1.3 "Hiragino Sans", "Yu Gothic", system-ui, sans-serif; color: #fff;
}
#sky-ctl[hidden], #sky-ctl .sky-ctl-panel[hidden] { display: none; }
html[data-ctl-away] #sky-ctl { opacity: 0; pointer-events: none; transition: opacity .2s ease; }   /* 送るボタンなどにかぶるときは引っこめる（吉原さん 10/12） */
/* ボタンのあいだ・まわりのすき間は素通り（社長 10/10：ボタンの近くに、なぞっても動かない所があった）。押せるのはボタンとパネルだけ */
#sky-ctl, #sky-ctl .sky-ctl-btns, #sky-ctl .birth-ctl { pointer-events: none; }
#sky-ctl button, #sky-ctl .sky-ctl-panel { pointer-events: auto; }
#sky-ctl .sky-ctl-btns { order: 2; display: flex; gap: 8px; align-items: center; }
#sky-ctl .sky-only-btn {
  appearance: none; width: auto; margin: 0; padding: 8px 14px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.3); background: rgba(10,14,40,.72); color: #fff; font: inherit; cursor: pointer;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 4px 18px rgba(0,0,0,.3);
}
#sky-ctl .sky-only-btn[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
#sky-ctl .sky-only-btn[data-wx] { position: relative; }
#sky-ctl .sky-only-btn[data-wx][data-nowx][aria-pressed="true"]::after { content: "×"; position: absolute; right: -3px; top: -5px; width: 16px; height: 16px;
  border-radius: 50%; background: #e5484d; color: #fff; font: 700 12px/16px sans-serif; text-align: center; box-shadow: 0 1px 4px rgba(0,0,0,.35); }   /* 天気の情報が無いとき（社長 10/15） */
#sky-ctl .sky-ctl-open {
  order: 2; appearance: none; width: auto; margin: 0; padding: 8px 14px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.3); background: rgba(10,14,40,.72); color: #fff; font: inherit; cursor: pointer;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 4px 18px rgba(0,0,0,.3);
}
#sky-ctl .sky-ctl-panel {
  order: 1; display: grid; gap: 10px; width: min(320px, calc(100vw - 24px));
  padding: 14px; border-radius: 14px; background: rgba(10,14,40,.86);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 8px 30px rgba(0,0,0,.35);
}
#sky-ctl .sky-ctl-head { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: 13px; }
#sky-ctl .sky-ctl-close { appearance: none; width: 32px; height: 32px; margin: -6px -6px -6px 0; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: #fff; font-size: 20px; line-height: 1; cursor: pointer; opacity: .8; }
#sky-ctl .sky-ctl-close:hover { background: rgba(255,255,255,.12); opacity: 1; }
#sky-ctl label { display: grid; gap: 6px; font-weight: 700; font-size: 12px; opacity: .95; }
#sky-ctl select { width: 100%; padding: 7px 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08); color: #fff; font: inherit; font-weight: 400; }
#sky-ctl select option { color: #111; }
#sky-ctl input[type="range"] { width: 100%; accent-color: #ffcf7a; }
#sky-ctl output { font-weight: 400; font-variant-numeric: tabular-nums; }
#sky-ctl .sky-ctl-ll { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#sky-ctl .sky-ctl-ll[hidden] { display: none; }
#sky-ctl .sky-ctl-ll input { width: 100%; padding: 6px 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08); color: #fff; font: inherit; font-weight: 400; }
#sky-ctl .sky-ctl-ll button { grid-column: 1 / -1; appearance: none; width: auto; margin: 0; padding: 7px 12px; border-radius: 999px;
  border: 0; background: #ffcf7a; color: #1d1530; font: inherit; font-weight: 700; cursor: pointer; }
#sky-ctl .sky-ctl-note { grid-column: 1 / -1; margin: 0; font-size: 11px; opacity: .75; }
#sky-ctl .sky-ctl-ok { appearance: none; width: 100%; margin: 0; padding: 9px 12px; border-radius: 999px;   /* 決定（吉原さん 10/31「× しかない」） */
  border: 0; background: #ffcf7a; color: #1d1530; font: inherit; font-weight: 700; cursor: pointer; }
#sky-ctl .sky-ctl-dir { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; font-weight: 700; }
#sky-ctl .sky-ctl-dir button { appearance: none; width: auto; margin: 0; padding: 5px 10px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; font-weight: 400; cursor: pointer; }
#sky-ctl .sky-ctl-dir button[aria-pressed="true"] { background: #fff; color: #111; }
#sky-ctl .sky-ctl-only { display: flex; align-items: center; gap: 8px; font-weight: 400; }
#sky-ctl .sky-ctl-only input { width: 18px; height: 18px; margin: 0; accent-color: #ffcf7a; }
/* 空だけを見る：ページの文字を隠して、どこをドラッグしても空が回る */
html[data-sky-only] .container { visibility: hidden; }
/* 星座を一瞬見せる（新しいトップで星座をえらんだとき・社長 10/11）：ページを消して、夜の空と海だけ */
html[data-site-theme] .container, html[data-site-theme] #sky-ctl { transition: opacity .6s ease; }
html[data-sky-peek] .container, html[data-sky-peek] #sky-ctl { opacity: 0; pointer-events: none; }
html[data-sky-peek] #sky-ctl { visibility: hidden; }
html[data-site-theme="cosmos"] body { touch-action: pan-y pinch-zoom; }   /* 横の指の動きは、海で向きを変えるのに使う */
html[data-sky-only] .container .site-head { visibility: visible; }
html[data-sky-only] .container #site-menu { visibility: visible; }   /* 空モードでも☰メニュー（社長 10/12） */
/* 空だけを見るあいだは、ページを動かさない（スクロールでスマホのバーが出入りして、海が上下していた・社長 10/09）。
   ロゴとログインは画面の上に固定して、いつも見えるように */
html[data-sky-only], html[data-sky-only] body { overflow: hidden; overscroll-behavior: none; }
html[data-sky-only] .container .site-head { position: fixed; top: calc(12px + env(safe-area-inset-top, 0px)); left: 16px; right: 16px; z-index: 50; margin: 0; }   /* ロゴとマイページ（ログイン）は残す（社長 10/08） */
html[data-sky-only], html[data-sky-only] body { touch-action: none; cursor: grab; -webkit-user-select: none; user-select: none; }
#sky-ctl .sky-ctl-sun { margin: 0; font-size: 12px; opacity: .9; }
#sky-ctl .sky-ctl-row { display: flex; flex-wrap: wrap; gap: 8px; }
#sky-ctl .sky-ctl-now[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
#sky-ctl .sky-ctl-now { appearance: none; width: auto; justify-self: start; margin: 0; padding: 6px 12px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; cursor: pointer; }
/* 空だけを見るときの案内（タップで戻る） */
.sky-hint { position: fixed; left: 50%; top: 42%; transform: translate(-50%, -50%); z-index: 9998; pointer-events: none;
  padding: 10px 18px; border-radius: 999px; background: rgba(10,14,40,.72); color: #fff; font-size: 14px;
  opacity: 0; transition: opacity .5s ease; width: max-content; max-width: calc(100vw - 32px); text-align: center; line-height: 1.5; }   /* 長い案内は、画面の中で折り返す */
.sky-hint.show { opacity: 1; }
.sky-hint.over-sheet { z-index: 10002; }   /* コピーの知らせは、シェア・カメラのシートの上に */
/* あなたが生まれた空（社長 10/10）：真ん中に大きな日時、上にカード、右下に「止める・本当の速さ・120倍」 */
#birth-clock { position: fixed; left: 0; right: 0; top: 40%; z-index: 9996; text-align: center; pointer-events: none;
  font: 700 clamp(1.5rem, 6.5vw, 2.6rem)/1.3 "Zen Old Mincho", serif; color: #fff; font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 18px rgba(0,0,0,.7), 0 0 4px rgba(0,0,0,.5); opacity: 0; transition: opacity .9s ease; }
#birth-clock.show { opacity: 1; }
#birth-card { position: fixed; left: 50%; bottom: calc(118px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 12px);
  width: min(92vw, 440px); z-index: 9997; padding: 12px 14px 6px; border-radius: 18px; text-align: center;
  background: rgba(10,14,40,.72); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.16); opacity: 0; pointer-events: none; transition: opacity .8s ease, transform .8s ease; }
#birth-card.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
#birth-card .bc-head { display: flex; align-items: center; gap: 8px; }
#birth-card .bc-share-mini { flex: none; appearance: none; width: auto; margin: 0 0 0 auto; padding: 4px 12px; border: 0; border-radius: 999px;
  background: #ffcf7a; color: #1d1530; font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; }
#birth-card.folded .bc-share-mini { display: none; }
#birth-card .bc-title { flex: 1; margin: 0; text-align: left; font: 700 .98rem/1.45 "Zen Old Mincho", serif; }
#birth-card .bc-fold { flex: none; appearance: none; width: auto; margin: 0; padding: 4px 9px;
  border: 1px solid rgba(255,255,255,.25); border-radius: 999px; background: transparent; color: rgba(255,255,255,.85);
  font: inherit; font-size: .72rem; cursor: pointer; }
#birth-card.folded { display: none; }
#sky-ctl .birth-peek[hidden] { display: none; }
/* どんな空の色でも読めるように、濃い紺の帯に金色の文字（社長 10/10：もうちょっとわかりやすい色に） */
#drag-hint p { position: fixed; left: 0; right: 0; z-index: 9996; width: fit-content; margin: 0 auto; padding: 6px 14px;
  border-radius: 999px; background: rgba(10,14,40,.78); border: 1px solid rgba(255,207,122,.55); text-align: center; pointer-events: none;
  color: #ffcf7a; font-size: .85rem; font-weight: 700; box-shadow: 0 4px 18px rgba(0,0,0,.35); opacity: 0; transition: opacity .6s ease; }
#drag-hint .dh-sky { top: 38%; display: flex; flex-direction: column; align-items: center; gap: 2px; border-radius: 22px; padding: 6px 16px; }
#drag-hint .dh-u, #drag-hint .dh-d { display: block; font-size: 1.2rem; line-height: 1; }
#drag-hint.show .dh-u { animation: dhU 1.2s ease-in-out infinite; }
#drag-hint.show .dh-d { animation: dhD 1.2s ease-in-out infinite; }
@keyframes dhU { 50% { transform: translateY(-6px); } }
@keyframes dhD { 50% { transform: translateY(6px); } }
#drag-hint.show p { opacity: 1; }
#drag-hint .dh-l, #drag-hint .dh-r { display: inline-block; margin: 0 8px; font-size: 1.2rem; vertical-align: -2px; }
#drag-hint.show .dh-l { animation: dhL 1.2s ease-in-out infinite; }
#drag-hint.show .dh-r { animation: dhR 1.2s ease-in-out infinite; }
@keyframes dhL { 50% { transform: translateX(-8px); } }
@keyframes dhR { 50% { transform: translateX(8px); } }
#compass-rose { position: fixed; left: 14px; top: calc(110px + env(safe-area-inset-top, 0px)); z-index: 9996; width: 48px; height: 48px;
  margin: 0; padding: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.4); background: rgba(10,14,40,.7); cursor: pointer; }
#compass-rose.is-link { border-color: #ff6b5e; box-shadow: 0 0 10px rgba(255,107,94,.6); }
#compass-rose.is-fixed { border-color: #5fd38d; box-shadow: 0 0 10px rgba(95,211,141,.6); }
#compass-rose .cr-dial { position: absolute; inset: 0; }
#compass-rose[hidden] { display: none; }
#compass-rose .cr-n { position: absolute; left: 50%; top: 2px; transform: translateX(-50%); font: 700 10px/1 sans-serif; color: #ff8a80; }
#compass-rose .cr-needle { position: absolute; left: 50%; top: 13px; width: 0; height: 0; transform: translateX(-50%);
  border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 16px solid #ff8a80; }
#sky-ctl [data-compass][hidden] { display: none; }
#birth-sheet { position: fixed; inset: 0; z-index: 10001; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0,0,0,.6); }
#birth-sheet[hidden] { display: none; }
#birth-sheet .bs-panel { display: grid; gap: 10px; width: min(92vw, 380px); padding: 18px 16px 14px; border-radius: 18px;
  background: rgba(14,18,44,.97); color: #fff; border: 1px solid rgba(255,255,255,.14); }
#birth-sheet .bs-title { margin: 0; font: 700 1.2rem/1.4 "Zen Old Mincho", serif; text-align: center; }
#birth-sheet .bs-sub { margin: 0 0 4px; text-align: center; font-size: .82rem; color: rgba(255,255,255,.8); }
#birth-sheet .bs-free { margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: #ffcf7a; color: #1d1530; font-weight: 700; font-size: .72rem; }
#birth-sheet .bs-row { display: grid; gap: 4px; font-size: .8rem; color: rgba(255,255,255,.85); }
#birth-sheet .bs-date { display: flex; align-items: center; gap: 6px; }
#birth-sheet input:not([type=checkbox]), #birth-sheet select { width: 100%; min-width: 0; padding: 9px 8px; border-radius: 10px; border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08); color: #fff; font: inherit; font-size: 1rem; text-align: center; }
#birth-sheet select option { color: #111; }
#birth-sheet .bs-check { display: flex; align-items: center; gap: 8px; font-size: .82rem; }
#birth-sheet .bs-check input { width: 18px; height: 18px; accent-color: #ffcf7a; }
#birth-sheet .bs-error { margin: 0; min-height: 1em; color: #ff8a80; font-size: .8rem; }
#birth-sheet .bc-main { display: block; width: 100%; margin: 0; padding: 12px; border: 0; border-radius: 999px; background: #ffcf7a; color: #1d1530; font: inherit; font-weight: 700; cursor: pointer; }
#birth-sheet .ss-sub { width: 100%; margin: 0; padding: 9px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; font-size: .85rem; cursor: pointer; }
#sky-ctl .angle-row { order: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; max-width: calc(100vw - 20px); }
#sky-ctl .angle-row[hidden] { display: none; }
#sky-ctl .angle-row .angle-btn { padding: 7px 10px; font-size: 12px; }
#sky-ctl .angle-row .angle-btn[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; }
#sky-ctl .angle-row.is-off .angle-btn { opacity: .45; }
#angle-card { position: fixed; left: 50%; top: calc(156px + env(safe-area-inset-top, 0px));   /* 「⤓ 水平線へ」（112px）の下に */ transform: translate(-50%, -8px); z-index: 9997;
  width: min(92vw, 420px); padding: 14px 16px 8px; border-radius: 16px; background: rgba(10,14,40,.82); color: #fff;
  border: 1px solid rgba(255,207,122,.4); opacity: 0; pointer-events: none; transition: opacity .5s ease, transform .5s ease; }
#angle-card.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
#angle-card.at-bottom { top: auto; bottom: calc(230px + env(safe-area-inset-bottom, 0px)); }
#angle-card { box-sizing: border-box; max-height: calc(100vh - 156px - 240px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow-y: auto; -webkit-overflow-scrolling: touch; }   /* 広げてもコントローラーの下に潜らない（社長 10/12） */
#angle-card .ac-sign { margin-top: 4px; }
#angle-card .ac-x { position: absolute; right: 6px; top: 6px; width: 30px; height: 30px; margin: 0; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: rgba(255,255,255,.75); font-size: 16px; cursor: pointer; }
#angle-card .ac-about { margin: 6px 0 6px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.14); font-size: .76rem; line-height: 1.7; color: rgba(255,255,255,.78); }
/* 小さい画面（iPhone 8 など）では、カードを詰めて星を隠さない（吉原さん 10/12） */
@media (max-height: 700px) { #angle-card { padding: 10px 12px 6px; } #angle-card .ac-main { font-size: .9rem; line-height: 1.5; margin-bottom: 4px; }
  #angle-card .ac-sign { font-size: .7rem; } #angle-card .ac-planet { margin-top: 4px; font-size: .8rem; } #angle-card .ac-more { margin-top: 4px; } }
#angle-card .ac-about:empty { display: none; }
#angle-card .ac-head { margin: 0 24px 4px 0; font-size: .72rem; letter-spacing: .04em; color: #ffcf7a; }   /* 何のカードか（社長 10/12） */
html[data-daytime] #angle-card .ac-head { color: var(--dg-rose); }
#angle-card .ac-about + .ac-main { margin-right: 0; }
#angle-card .ac-main { margin: 0 24px 6px 0; font: 700 1rem/1.7 "Zen Old Mincho", serif; }
#angle-card .ac-sign { margin: 0 0 4px; font-size: .76rem; color: rgba(255,255,255,.7); }
#angle-card .ac-planet { margin: 6px 0 0; font-size: .86rem; color: #ffcf7a; }
#angle-card .ac-more { margin-top: 6px; font-size: .74rem; color: rgba(255,255,255,.7); }
#angle-card .ac-more p { margin: 4px 0 6px; }
.tilt-reset { position: fixed; right: 14px; top: calc(112px + env(safe-area-inset-top, 0px)); z-index: 9998;   /* 時刻の下・右（左は方位磁石） */
  width: auto; margin: 0; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(255,207,122,.6);
  background: rgba(10,14,40,.8); color: #ffcf7a; font: 700 13px/1.3 sans-serif; cursor: pointer; }
.tilt-reset[hidden] { display: none; }
.hl-back { position: fixed; left: 14px; top: calc(108px + env(safe-area-inset-top, 0px)); z-index: 9998; width: auto; margin: 0; padding: 7px 14px;
  border-radius: 999px; border: 1px solid rgba(255,207,122,.6); background: rgba(10,14,40,.8); color: #ffcf7a; font: 700 13px/1.3 sans-serif; cursor: pointer; }
.hl-back[hidden] { display: none; }
html[data-daytime] .hl-back { background: rgba(255,255,255,.88); border-color: rgba(199,176,247,.95); color: #5b2f99; }
/* 昼の空の上の説明文（相性・日取りの見出しの下）が薄くて読めない（吉原さん 10/12）→ 濃いプラム色に */
html[data-daytime] .lede-text, html[data-daytime] .lede-ex { color: #4b3a5c; }
.hl-birth { position: fixed; z-index: 9997; margin: 0; width: auto; padding: 9px 16px; border-radius: 999px; border: 0; cursor: pointer;
  background: linear-gradient(135deg, #b794f6, #f78fb3); color: #fff; font: 700 13px/1.3 sans-serif; white-space: nowrap;
  box-shadow: 0 6px 20px rgba(120,80,170,.4); animation: hlIn .6s ease .4s both; }
.hl-birth[hidden] { display: none; }
@keyframes hlIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
#sky-ctl .birth-open[hidden], #sky-ctl .fs-btn[hidden] { display: none; }
#sky-ctl [data-nosun][aria-pressed="true"] { background: #ffcf7a; color: #1d1530; }
#share-sheet, #snap-sheet { position: fixed; inset: 0; z-index: 10001; display: none; align-items: center; justify-content: center;
  padding: 16px; background: rgba(0,0,0,.6); }
#share-sheet.show, #snap-sheet.show { display: flex; }
#share-sheet .ss-panel, #snap-sheet .ss-panel { width: min(92vw, 420px); max-height: calc(100vh - 32px); overflow: auto; padding: 14px; border-radius: 18px;
  background: rgba(14,18,44,.96); color: #fff; text-align: center; border: 1px solid rgba(255,255,255,.14); }
#share-sheet .ss-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 0 0 10px; padding: 4px; border-radius: 999px;
  background: rgba(255,255,255,.08); }
#share-sheet .ss-tab { margin: 0; padding: 8px 6px; border: 0; border-radius: 999px; background: transparent; color: rgba(255,255,255,.8);
  font: inherit; font-size: .85rem; cursor: pointer; }
#share-sheet .ss-tab[aria-selected="true"] { background: #ffcf7a; color: #1d1530; font-weight: 700; }
#share-sheet .ss-wait { display: none; margin: 40px 0; font-size: .88rem; }
#share-sheet .ss-horo-opt { margin-top: -4px; }
#share-sheet.inbirth .ss-horo-opt { display: none; }
#share-sheet .ss-sign { display: none; width: 100%; margin: 0 0 10px; padding: 8px 10px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; font: inherit; }
#share-sheet .ss-sign option { color: #111; }
#share-sheet.horo:not(.inbirth) .ss-sign { display: block; margin-top: 2px; }
#share-sheet.busy .ss-sign { display: none; }
#share-sheet.busy .ss-wait { display: flex; gap: 10px; align-items: center; justify-content: center; }
#share-sheet.busy .ss-stage, #share-sheet.busy .bc-opt, #share-sheet.busy .ss-btns, #share-sheet.busy .ss-tools { display: none; }
/* 何をシェアする？（吉原さん 10/12） */
#share-sheet .ss-title { margin: 2px 0 10px; font: 700 1.02rem/1.4 "Zen Old Mincho", serif; }
#share-sheet .ss-title-sm { font-size: .92rem; }
#share-sheet .ss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
#share-sheet .ss-grid[hidden], #share-sheet .ss-signs[hidden], #share-sheet .ss-pick[hidden], #share-sheet .ss-view[hidden], #share-sheet [data-opt][hidden], #share-sheet .ss-pick > .ss-close[hidden] { display: none; }
#share-sheet .ss-pk { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 0; padding: 12px 6px 10px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.07); color: #fff; font: inherit; cursor: pointer; }
#share-sheet .ss-pk:active { background: rgba(255,207,122,.25); }
#share-sheet .ss-pk .ss-pk-ic { font-size: 1.5rem; line-height: 1.2; }
#share-sheet .ss-pk b { font-size: .88rem; } #share-sheet .ss-pk small { font-size: .68rem; color: rgba(255,255,255,.7); line-height: 1.3; }
#share-sheet.inbirth [data-pick="sign"], #share-sheet.inbirth [data-pick="horo"], #share-sheet.inbirth [data-pick="dusk"], #share-sheet.inbirth [data-pick="other"] { display: none; }
#share-sheet .ss-sgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 10px; }
#share-sheet .ss-sg { margin: 0; padding: 8px 4px; border-radius: 12px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.07); color: #fff; font: inherit; font-size: .8rem; cursor: pointer; }
#share-sheet .ss-sg span { display: block; font-size: 1.2rem; color: #ffcf7a; font-family: "Segoe UI Symbol", "Noto Sans Symbols", sans-serif; }
#share-sheet .ss-sback { margin-bottom: 8px; }
#share-sheet .ss-tools { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 10px 0 8px; }
#share-sheet .ss-tools button { margin: 0; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; font-size: .78rem; cursor: pointer; }
#share-sheet .ss-tools button:disabled { opacity: .4; cursor: default; }
/* 選んだ文字の帯（11/01）：大きさ・色・消す。選んでいないときは出さない */
#share-sheet .ss-selbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; margin: 6px 0 0; padding: 6px 8px; border-radius: 12px; background: rgba(255,255,255,.08); }
#share-sheet .ss-selbar[hidden], #share-sheet.busy .ss-selbar { display: none; }
#share-sheet .ss-selbar > span { font-size: .7rem; color: #ffcf7a; margin-right: 2px; }
#share-sheet .ss-selbar button { margin: 0; padding: 4px 9px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: transparent; color: #fff; font: inherit; font-size: .74rem; cursor: pointer; }
#share-sheet .ss-selbar button[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
#share-sheet .ss-selbar .ss-dot { width: 24px; height: 24px; padding: 0; border: 2px solid rgba(255,255,255,.35); }
#share-sheet .ss-selbar .ss-dot[aria-pressed="true"] { border-color: #fff; box-shadow: 0 0 0 2px #ffcf7a; background-clip: padding-box; }
#share-sheet .ss-pal { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; flex: 0 0 100%; padding-top: 4px; }
#share-sheet .ss-pal[hidden] { display: none; }
#share-sheet.selecting .ss-tools { display: none; }   /* 選んだ文字を編集しているあいだ */
#share-sheet .ss-view > .ss-sign { display: none; }   /* 下には出さない（占い札の帯の中だけ） */
#share-sheet.horo:not(.inbirth) .ss-view > .ss-sign { display: none; }   /* 占いを点けても下に出さない（もとの .horo の決まりより強く・8c 11/01）。題材が「星座」のときは次の行で出す */
#share-sheet.kind-sign:not(.selecting) .ss-view > .ss-sign { display: block; }   /* 題材が「星座」のときは下でも選べる（admin4 11/01） */
#share-sheet .ss-signrow { display: none; align-items: center; gap: 6px; flex: 0 0 100%; font-size: .72rem; color: rgba(255,255,255,.75); }
#share-sheet.sel-horo .ss-signrow { display: flex; }
#share-sheet .ss-signrow .ss-sign { flex: 1; min-width: 0; margin: 0; }
#share-sheet .ss-selbar .ss-seldone { margin-left: auto; background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
#share-sheet .ss-selbar .ss-seltop { display: flex; align-items: center; gap: 6px; flex: 0 0 100%; }
#share-sheet .ss-colpick { position: relative; display: inline-flex;   /* 好きな色（.ss-pick は題材の選び画面の名前なので別の名前・8c の S 11/01） */ align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 999px; font-size: 13px; cursor: pointer;
  background: conic-gradient(red, yellow, lime, cyan, blue, magenta, red); border: 2px solid rgba(255,255,255,.35); }
#share-sheet .ss-colpick input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; border: 0; padding: 0; }
#share-sheet .ss-tools button[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
/* 仕上げる画面（11/01）：切り替えは「空」「文字」「その他」の3段。札の大きさ・見え方は占いを入れたときだけ */
#share-sheet .ss-tools { gap: 4px; margin: 6px 0 4px; }
#share-sheet .ss-tools button { padding: 4px 9px; font-size: .74rem; }
#share-sheet .ss-trow, #share-sheet .ss-card { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; width: 100%; }
#share-sheet .ss-trow > span, #share-sheet .ss-card > span { flex: 0 0 3.6em; font-size: .62rem; white-space: nowrap; color: rgba(255,255,255,.55); text-align: left; }
#share-sheet .ss-noterow { display: flex; gap: 6px; width: 100%; }
#share-sheet .ss-noterow[hidden] { display: none; }
#share-sheet .ss-noterow input { flex: 1; min-width: 0; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.08); color: #fff; font: inherit; font-size: 16px; }
#share-sheet .ss-when { margin: 0 0 8px; font-size: .78rem; color: #ffcf7a; text-align: center; }
#share-sheet .ss-when[hidden] { display: none; }
/* 時間モードの「LIVE」の印（11/01）：今の時刻・ふつうの速さのときだけ赤。ずらしていれば灰色で中身（+3時間・120倍など） */
.sky-live { display: inline-block; margin-right: .35em; padding: 0 .55em; border-radius: 999px; font-size: .72em; font-weight: 700; line-height: 1.6; background: rgba(255,255,255,.2); color: #fff; vertical-align: middle; white-space: nowrap; }
.sky-live.on { background: #d93636; }
.sky-live[hidden] { display: none; }
#sky-clock .ck-live { display: table; margin: 0 auto 2px; font-size: .72rem; }
html:not([data-sky-only]) #sky-ctl .sky-live { display: none; }
#share-sheet .ss-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#share-sheet .ss-wait-t { display: inline; }
#share-sheet .ss-stage { position: relative; margin: 0 auto; overflow: hidden; border-radius: 10px; background: #000; touch-action: none; cursor: grab; }
#share-sheet .ss-img { position: absolute; left: 0; top: 0; display: block; will-change: transform; }
#share-sheet .ss-ov { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
#share-sheet .ss-note { margin: 6px 0 0; font-size: .72rem; color: rgba(255,255,255,.65); }
#share-sheet.busy .ss-note { display: none; }
#share-sheet .ss-zoom-row { display: none; align-items: center; gap: 10px; margin: 10px 2px 0; font-size: .8rem; color: rgba(255,255,255,.85); }
#share-sheet.can-zoom .ss-zoom-row { display: flex; }
#share-sheet.busy .ss-zoom-row { display: none; }
#share-sheet .ss-zoom-row input { flex: 1; accent-color: #ffcf7a; }
#share-sheet .bc-opt { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 10px 0; font-size: .82rem; color: rgba(255,255,255,.88); }
#share-sheet .bc-opt input { width: 16px; height: 16px; margin: 0; accent-color: #ffcf7a; }
#share-sheet .ss-btns, #snap-sheet .ss-btns { display: grid; gap: 8px; }
#share-sheet .bc-main, #snap-sheet .bc-main { display: block; width: 100%; margin: 0; padding: 12px; border: 0; border-radius: 999px; background: #ffcf7a; color: #1d1530;
  font: inherit; font-weight: 700; cursor: pointer; }
#share-sheet .ss-sub, #snap-sheet .ss-sub { width: 100%; margin: 0; padding: 9px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3);
  background: transparent; color: #fff; font: inherit; font-size: .85rem; cursor: pointer; }
#birth-now { position: fixed; left: 50%; top: calc(66px + env(safe-area-inset-top, 0px)); transform: translateX(-50%); z-index: 9996;
  padding: 5px 14px; border-radius: 999px; background: rgba(10,14,40,.62); color: #fff; font-size: .82rem; white-space: nowrap;
  font-variant-numeric: tabular-nums; pointer-events: none; opacity: 0; transition: opacity .6s ease; }
#birth-now.show { opacity: 1; }
#birth-clock .ck-row { display: block; white-space: nowrap; }
#birth-clock .ck-time { margin-top: 4px; font-size: .78em; }
#birth-clock .ck { display: inline-block; text-align: right; font-variant-numeric: tabular-nums; }   /* 後ろの「年・月・日・:」に寄せる */
#birth-clock .ck4 { width: 2.4em; }
#birth-clock .ck2 { width: 1.25em; }
#birth-clock .bm-box { display: inline-block; padding: 16px 28px 18px; border-radius: 24px; background: rgba(10,14,40,.78);
  border: 1px solid rgba(255,207,122,.7); box-shadow: 0 0 36px rgba(255,207,122,.55), 0 8px 30px rgba(0,0,0,.35); }
#birth-clock .bm-time { display: block; font-size: 1.6em; letter-spacing: .04em; color: #ffcf7a; }
#birth-clock .bm-text { display: block; margin-top: 6px; font-size: .62em; letter-spacing: .14em; }
#born-glow { position: fixed; inset: 0; z-index: 9995; pointer-events: none; opacity: 0;
  background: radial-gradient(ellipse at 50% 45%, rgba(255,214,140,.7), rgba(255,190,120,.28) 45%, rgba(255,190,120,0) 75%); }
#born-glow.on { animation: bornGlow 4s ease both; }
@keyframes bornGlow { 0% { opacity: 0; } 25% { opacity: 1; } 60% { opacity: .7; } 100% { opacity: 0; } }
#birth-clock.born { animation: born 2.6s ease both; }
@keyframes born { 0% { opacity: 0; transform: scale(.96); text-shadow: 0 0 0 rgba(255,214,140,0); }
  20% { opacity: 1; transform: scale(1); text-shadow: 0 0 24px rgba(255,214,140,.95), 0 0 60px rgba(255,190,120,.6); }
  80% { opacity: 1; text-shadow: 0 0 18px rgba(255,214,140,.8), 0 0 40px rgba(255,190,120,.4); }
  100% { opacity: 0; transform: scale(1.03); text-shadow: 0 0 40px rgba(255,214,140,0); } }
#birth-card .bc-opt { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 0; font-size: .78rem;
  color: rgba(255,255,255,.85); font-weight: 400; cursor: pointer; }
#birth-card .bc-opt input { width: 16px; height: 16px; margin: 0; accent-color: #ffcf7a; }
#birth-card .bc-sub { margin: 6px 0 10px; text-align: left; font-size: .78rem; line-height: 1.6; color: rgba(255,255,255,.82); }
#birth-card .bc-main { display: block; padding: 12px; border-radius: 999px; background: #ffcf7a; color: #1d1530;
  font-weight: 700; text-decoration: none; }
#birth-card .bc-sub[hidden] { display: none; }
#birth-card .bc-why { margin: 12px 0 0; padding: 9px 12px; border-radius: 12px; background: rgba(255,207,122,.1); text-align: left;
  font-size: .8rem; line-height: 1.7; color: #fff2d6; }
#birth-card .bc-why b { color: #ffcf7a; }
html[data-daytime] #birth-card .bc-why { background: rgba(248,196,180,.25); color: var(--dg-ink); }
html[data-daytime] #birth-card .bc-why b { color: var(--dg-rose); }
#birth-card .bc-cta { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.14); }
#birth-card .bc-why + .bc-cta { margin-top: 10px; padding-top: 0; border-top: 0; }
#birth-card .bc-cta:empty { display: none; }
#birth-card .bc-cta form { margin: 0; }
#birth-card .bc-next { display: block; width: 100%; margin: 0; padding: 11px; border-radius: 999px; border: 1px solid #ffcf7a;
  background: transparent; color: #ffcf7a; font: inherit; font-weight: 700; text-decoration: none; text-align: center; cursor: pointer; }
#birth-card .bc-sub-link { display: inline-block; margin-top: 8px; color: #ffcf7a; font-size: .82rem; }
#birth-card button.bc-main { width: 100%; margin: 0; border: 0; font: inherit; font-weight: 700; cursor: pointer; }
#birth-card .bc-links { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 6px 18px; margin-top: 8px; }
#birth-card .bc-links button { appearance: none; width: auto; margin: 0; padding: 4px 6px; border: 0; background: transparent;
  color: rgba(255,255,255,.85); font: inherit; font-size: .8rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
#sky-ctl .birth-ctl { order: 2; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; max-width: calc(100vw - 20px); }
#sky-ctl .birth-ctl .bc-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; pointer-events: none; }
#sky-ctl .sky-top { position: fixed; top: calc(12px + env(safe-area-inset-top, 0px)); right: 12px; display: flex; align-items: center; gap: 6px; pointer-events: none; }   /* ☰（site-head・12px）と同じ高さにそろえる（吉原さん 10/12） */
html[data-sky-only] #sky-ctl .sky-top { right: 64px; }   /* 空モードでも☰（社長 10/12）。シェア・全画面は☰の左に */
#sky-ctl .sky-top .sky-only-btn { box-sizing: border-box; height: 34px; display: inline-flex; align-items: center; padding: 0 12px; font-size: 13px; }   /* ☰と同じ 34px */
#sky-ctl .sky-top .sky-only-btn[hidden] { display: none; }   /* display を指定したぶん、hidden が負けないように（吉原さん 10/12：空モードでないのにシェア・全画面が出た） */
/* 今この瞬間を撮る（吉原さん 10/31）：押すと一瞬白く光る（音なし）。撮った画像はシートに */
.snap-flash { position: fixed; inset: 0; z-index: 2147483000; background: #fff; opacity: .9; pointer-events: none; transition: opacity .38s ease-out; }
.snap-flash.go { opacity: 0; }
#snap-sheet .snap-img { display: block; width: 100%; max-height: 62vh; object-fit: contain; border-radius: 12px; margin: 0 auto 12px; }
#sky-ctl .snap-btn svg { display: block; }
/* 空モードのメニューを減らす（吉原さん 10/31・6人の審査 案①〜⑦）：元のボタンは隠して、まとめたボタンから押す */
#sky-ctl .birth-ctl [data-bm="stop"], #sky-ctl .birth-ctl [data-bm="real"], #sky-ctl .birth-ctl [data-bm="fast"], #sky-ctl .birth-ctl [data-bm="fast480"] { display: none; }
#sky-ctl .sky-top .fs-btn, #sky-ctl .sky-top .birth-peek { display: none !important; }   /* 直し11件 #9（吉原さん 11/03）：誕生空の「シェア ⌃」も出さず📷から */
#birth-card .bc-share-mini { display: none; }   /* 直し11件 #9：カードのシェアも📷に */   /* 全画面は☰へ・シェアは📷にまとめた */
#sky-ctl .bc-view-panel { pointer-events: auto; display: grid; gap: 6px; margin: 0 0 8px auto; width: min(300px, calc(100vw - 32px)); padding: 10px 12px;
  border-radius: 14px; background: rgba(10,14,40,.88); color: #fff; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 8px 30px rgba(0,0,0,.35); }
#sky-ctl .bc-view-panel[hidden] { display: none; }
#sky-ctl .bv-row { display: flex; align-items: center; gap: 10px; min-height: 40px; cursor: pointer; font-size: 14px; }
#sky-ctl .bv-row[hidden] { display: none; }
#sky-ctl .bv-row .bv-name { flex: 1; }
#sky-ctl .bv-row .bv-st { font-size: 12px; padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.14); white-space: nowrap; }
#sky-ctl .bv-row .bv-st.is-on { background: #ffcf7a; color: #1d1530; font-weight: 700; }
#sky-ctl .bv-row .sky-only-btn[data-wx]::after { display: none !important; }   /* 天気の赤い×はやめ、右の字で「出している／出していない」 */
#sky-ctl .sky-only-btn.birth-open { font-weight: 700; background: rgba(255,207,122,.95); color: #1d1530; border-color: #ffcf7a; }   /* 誕生空を目立たせる */
#sky-ctl .sky-top .sky-fortune { text-decoration: none; pointer-events: auto; }   /* 直し11件 #1（吉原さん 11/03）：<a> は button ではないので auto が付かず、押しても☰の帯（.site-head）に落ちていた */
html:not([data-sky-only]) #sky-ctl .sky-top .sky-fortune { display: none; }   /* 占いへの入口は空モードのときだけ */
.snap-choose { position: fixed; z-index: 10001; display: grid; gap: 6px; padding: 8px; border-radius: 14px; background: rgba(10,14,40,.94); box-shadow: 0 8px 30px rgba(0,0,0,.4);
  right: 12px; top: calc(56px + env(safe-area-inset-top, 0px)); }
.snap-choose[hidden] { display: none; }
.snap-choose button { appearance: none; margin: 0; padding: 10px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color: #fff; font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.site-menu .sm-fs { display: none; }
html[data-sky-only] .site-menu .sm-fs { display: block; }
/* トップでは時計の丸と左下のご意見を出さず（ご意見はページの下と時計の中）、「空を見る」を1つだけ濃く */
html:not([data-sky-only]) #sky-ctl .sky-ctl-open { display: none; }   /* 右下の統一：空の背景のページ全部（11/03・人の OK） */
.feedback-fab { display: none; }   /* ご意見の丸は全部のページで出さない（A 案・11/03）。入口はページの下 */
html:not([data-sky-only]) #sky-ctl [data-sky-only] { padding: 10px 20px; font-size: 1.02rem; font-weight: 700; background: rgba(255,207,122,.95); color: #1d1530; border-color: #ffcf7a; }
html[data-sky-only] .site-head .site-account { display: none; }   /* 空だけを見るときは、マイページ（ログイン）を消して、シェア・全画面・戻るを置く */
#sky-ctl .birth-ctl[hidden] { display: none; }
#sky-ctl .birth-ctl .sky-only-btn { padding: 8px 10px; }
@media (max-width: 400px) { #sky-ctl .birth-ctl, #sky-ctl .birth-ctl .bc-row { gap: 4px; } #sky-ctl .birth-ctl .sky-only-btn { padding: 7px 8px; font-size: 12px; } }
#sky-ctl .birth-day[hidden] { display: none; }
#share-sheet.solo .ss-tabs { display: none; }
html[data-sky-only] #sky-ctl [data-sky-fast] { display: none; }   /* 空だけを見るときは、右下の ⏩ と同じなので出さない */
/* 下のボタンの列を隠す「︾」・出す「︽」（金坂さん 10/21：ボタンの陰の地面やレアキャラも見たい）。上の段（今・止める…）の左はし。
   隠しても見えなくするだけで、場所はそのまま（海の幅・レアキャラの位置は変わらない）。「︽」だけは同じ場所に残る。押せる範囲は 44px 四方 */
#sky-ctl .birth-ctl .ctl-hide { position: relative; width: 44px; padding-left: 0; padding-right: 0; text-align: center; font-weight: 700; }
#sky-ctl .birth-ctl .ctl-hide span { display: inline-block; transform: scale(1.35); }   /* 矢印を大きく見せる（段の高さは変えない） */
/* 幅の小さいスマホ（iPhone SE など 360px 未満）でも、下のボタンを2段に収める（金坂さん 10/21：「︾」を足したら4段になった） */
@media (max-width: 359px) {
  #sky-ctl .birth-ctl, #sky-ctl .birth-ctl .bc-row { gap: 3px; }
  #sky-ctl .birth-ctl { max-width: calc(100vw - 12px); }
  #sky-ctl .birth-ctl .sky-only-btn { padding: 7px 5px; font-size: 11px; }
  #sky-ctl .birth-ctl .ctl-hide { width: 34px; }
  #sky-ctl .birth-ctl .ctl-hide::before { left: -10px; }   /* 押せる広さは横 44px のまま（左はしなので、となりのボタンにかからない） */
}
#sky-ctl .birth-ctl .ctl-hide::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%); }
html[data-sky-only][data-ctl-hide] #sky-ctl .birth-ctl { visibility: hidden; }
html[data-sky-only][data-ctl-hide] #sky-ctl .birth-ctl .ctl-hide { visibility: visible; }
html[data-sky-only]:not([data-sky-birth]) #sky-ctl .sky-ctl-open { position: fixed; left: 50%; top: calc(66px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); padding: 5px 14px; font-size: .82rem; white-space: nowrap; }
html[data-sky-birth] #sky-ctl .sky-ctl-open { display: none; }
/* 空に天気（本部 62 2026-10-14）：場所の札の下に「千葉市 くもり 18℃」。出典（MET Norway・CC BY 4.0）は札の下の小さい文字 */
#sky-weather { display: none; }
html[data-sky-only][data-sky-birth] #sky-weather.show { display: block; position: fixed; left: 50%; top: calc(98px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); z-index: 9996; text-align: center; pointer-events: none; white-space: nowrap; }   /* 誕生空：出典（ERA5）だけ、日時の札の下に */
html[data-sky-only]:not([data-sky-birth]) #sky-weather.show { display: block; position: fixed; left: 50%; top: calc(96px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); z-index: 6; text-align: center; pointer-events: none; white-space: nowrap; }
#sky-weather .wx-pill { display: none !important; padding: 3px 12px; border-radius: 999px; font-size: .76rem; color: #fff;
  background: rgba(10,14,40,.62); border: 1px solid rgba(255,255,255,.22); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
#sky-weather .wx-credit { display: block; margin-top: 2px; font-size: 9px; color: rgba(255,255,255,.62); text-shadow: 0 0 3px rgba(0,0,0,.8); pointer-events: auto; }
#sky-weather .wx-credit a { color: inherit; }
/* ⑬ 誕生空の地面の注釈（渡辺さん 10/26「当時の地面にしている？」→ 地面は今の景色。admin1：天気の出典の行には足さず、すぐ下の別の行に・同じ小さい字・誕生空のあいだはいつも出す）。文A（金坂さん 10/26 決定） */
#birth-ground-note { display: none; }
html[data-sky-only][data-sky-birth] #birth-ground-note { display: block; position: fixed; left: 50%; top: calc(124px + env(safe-area-inset-top, 0px)); transform: translateX(-50%);
  z-index: 9996; font-size: 9px; color: rgba(255,255,255,.62); text-shadow: 0 0 3px rgba(0,0,0,.8); white-space: nowrap; pointer-events: none; }
html[data-sky-only][data-sky-birth][data-daytime] #birth-ground-note { color: var(--dg-ink); text-shadow: 0 0 3px rgba(255,255,255,.9); font-size: 10px; }   /* 昼：天気の出典の行と同じ濃い字（上の行より優先順位を高く） */
/* オーロラ予報（#6 2026-10-18）：天気の出典の下に「オーロラ予報：出る確率 30%」。言い切らず、予報の確率として（親ハブ 10/18）。出典は NOAA SWPC */
#sky-aurora { display: none; }
html[data-sky-only]:not([data-sky-birth]) #sky-aurora.show { display: block; position: fixed; left: 50%; top: calc(120px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); z-index: 6; text-align: center; white-space: nowrap; font-size: 11px; color: rgba(190,255,215,.95);
  text-shadow: 0 0 4px rgba(0,0,0,.85); pointer-events: none; }
#sky-aurora .au-credit { display: block; margin-top: 1px; font-size: 9px; color: rgba(255,255,255,.62); pointer-events: auto; }
#sky-aurora .au-credit a { color: inherit; }
#sky-meteor { display: none; }
html[data-sky-only]:not([data-sky-birth]) #sky-meteor.show { display: block; position: fixed; left: 50%; top: calc(168px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); z-index: 6; text-align: center; white-space: nowrap; font-size: 11px; color: rgba(255,232,190,.95);
  text-shadow: 0 0 4px rgba(0,0,0,.85); pointer-events: none; }
#sky-meteor .au-credit { display: block; margin-top: 1px; font-size: 9px; color: rgba(255,255,255,.62); pointer-events: auto; }
#sky-meteor .au-credit a { color: inherit; }
/* #8 空モードの部品（渡辺さん 2026-10-26）
   ① 長い地名でも、上の札が画面からはみ出ない：札の幅は画面まで。地名だけ「…」で切り、時刻と天気は残す
   ② 時差のある場所は、札の時刻をその場所の時刻にして、下に小さく日本の時刻 */
html[data-sky-only]:not([data-sky-birth]) #sky-ctl .sky-ctl-open { max-width: calc(100vw - 24px); display: inline-flex; align-items: center; gap: .35em; }
#sky-ctl .sky-ctl-open [data-sky-label] { display: block; min-width: 0; }
#sky-ctl .sky-ctl-open .lb-line { display: flex; align-items: baseline; gap: .4em; min-width: 0; }
#sky-ctl .sky-ctl-open .lb-t, #sky-ctl .sky-ctl-open .lb-w { flex: none; }
#sky-ctl .sky-ctl-open .lb-p { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sky-ctl .sky-ctl-open .lb-jp { display: block; font-size: .8em; opacity: .78; line-height: 1.2; }
/* 札の下の天気の出典・オーロラ・流星群は、札（または大きな時計）の高さに合わせて下げる（--ck-h は JS が入れる。ふだんは 30px＝前と同じ位置） */
html[data-sky-only]:not([data-sky-birth]) #sky-weather.show { top: calc(66px + var(--ck-h, 30px) + env(safe-area-inset-top, 0px)); }
html[data-sky-only]:not([data-sky-birth]) #sky-aurora.show { top: calc(90px + var(--ck-h, 30px) + env(safe-area-inset-top, 0px)); }
html[data-sky-only]:not([data-sky-birth]) #sky-meteor.show { top: calc(138px + var(--ck-h, 30px) + env(safe-area-inset-top, 0px)); }
/* ⑫ 時計モード：上の札を押すと、その場で大きな時計に広がる（メニューは増やさない）。時計を押すと元の札に */
#sky-clock { display: none; }
html[data-sky-only][data-sky-clock]:not([data-sky-birth]) #sky-ctl .sky-ctl-open { visibility: hidden; }
/* 時計の見た目 C「やわらかい影」（渡辺さん 10/26：黒いカードと丸い枠は要らない）：板・枠・角丸・影・ぼかしは無し。
   文字のうしろに、ふちの無いうすいにじみ（夜は暗く・昼は白く）。夜は白い文字、昼は濃い紺の文字で、明るい空・雲・太陽の上でも読める */
html[data-sky-only][data-sky-clock]:not([data-sky-birth]) #sky-clock { display: block; position: fixed; left: 50%; top: calc(66px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%); z-index: 9997; width: min(340px, calc(100vw - 24px)); padding: 14px 8px 10px; text-align: center; color: #fff;
  font: 13px/1.35 "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
  background: radial-gradient(ellipse 60% 55% at 50% 45%, rgba(8,12,34,.38), rgba(8,12,34,0) 72%); }
html[data-sky-only][data-sky-clock][data-daytime]:not([data-sky-birth]) #sky-clock { color: var(--dg-ink, #22304a);
  background: radial-gradient(ellipse 70% 65% at 50% 45%, rgba(255,255,255,.7), rgba(255,255,255,0) 78%); }
#sky-clock .ck-face { appearance: none; display: block; width: 100%; margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
#sky-clock .ck-time { display: block; font-size: 60px; font-weight: 300; line-height: 1.05; letter-spacing: .04em; font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 2px rgba(0,0,0,.35), 0 0 18px rgba(0,0,0,.35); }
#sky-clock .ck-time small { font-size: .38em; margin-left: .15em; opacity: .75; }
#sky-clock .ck-sub { display: block; margin-top: 2px; }
#sky-clock .ck-jp { display: block; margin-top: 2px; font-size: 12px; opacity: .78; }
#sky-clock .ck-sub, #sky-clock .ck-jp { text-shadow: 0 1px 2px rgba(0,0,0,.5), 0 0 10px rgba(0,0,0,.35); }
#sky-clock .ck-btns { display: flex; gap: 18px; justify-content: center; margin-top: 6px; }
#sky-clock .ck-btns button { appearance: none; margin: 0; padding: 4px 2px; border: 0; border-radius: 0; background: none; color: inherit; font: inherit; font-size: 12px; opacity: .85;
  cursor: pointer; text-decoration: underline; text-decoration-color: rgba(255,255,255,.45); text-underline-offset: 3px; text-shadow: 0 1px 2px rgba(0,0,0,.5); }
/* 昼：文字を少し太く・白いにじみで読ませる */
html[data-daytime] #sky-clock .ck-time { font-weight: 400; }
html[data-daytime] #sky-clock .ck-time small { opacity: .9; }
html[data-daytime] #sky-clock .ck-time, html[data-daytime] #sky-clock .ck-sub, html[data-daytime] #sky-clock .ck-jp,
html[data-daytime] #sky-clock .ck-btns button { text-shadow: 0 0 2px rgba(255,255,255,.9), 0 0 14px rgba(255,255,255,.7); }
html[data-daytime] #sky-clock .ck-sub, html[data-daytime] #sky-clock .ck-jp, html[data-daytime] #sky-clock .ck-btns button { font-weight: 600; opacity: 1; }
html[data-daytime] #sky-clock .ck-btns button { text-decoration-color: rgba(34,48,74,.4); }
/* ⑪ 空モードで場所の札を開いたとき：時刻のバー・向き・速さのボタンは下の段と同じなので出さない（横になぞれば時刻・向きが変わる） */
html[data-sky-only] #sky-ctl .ctl-time, html[data-sky-only] #sky-ctl .sky-ctl-dir, html[data-sky-only] #sky-ctl .ctl-speed { display: none; }
#sky-ctl .ctl-fb { display: none; }
html[data-sky-only] #sky-ctl .ctl-fb { display: flex; }
/* ③ 空モードでも「ご意見・不具合」（左下の丸は下のボタンと重なるので出さない。札と時計から開く）。シートは空の部品より上に */
html[data-sky-only] #feedbackPageSheet { z-index: 10001; visibility: visible; touch-action: auto; cursor: auto; -webkit-user-select: text; user-select: text; }   /* 空モードはページの中身を隠すので、シートだけ見せる */
/* ⑩ オーロラ・流星群の札を × で消せる（押せるのは × だけ。札のほかの所は素通りのまま） */
#sky-aurora .info-x, #sky-meteor .info-x { pointer-events: auto; position: absolute; right: -30px; top: -2px; width: 24px; height: 24px; padding: 0;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.35); background: rgba(10,14,40,.6); color: #fff; font: 700 14px/22px sans-serif; cursor: pointer; }
/* ⑯ 星空を軽くしたら、小さく知らせる。押すと「高画質に戻す」を選べる（メニューは増やさない・渡辺さん 10/26） */
#sky-quality { display: none; }
html[data-sky-only]:not([data-sky-birth]) #sky-quality.show { display: block; position: fixed; left: 50%; transform: translateX(-50%); z-index: 9997;
  bottom: calc(132px + env(safe-area-inset-bottom, 0px)); width: max-content; max-width: calc(100vw - 24px); text-align: center;
  font: 12px/1.4 "Hiragino Sans", "Yu Gothic", system-ui, sans-serif; color: #fff; }
#sky-quality button { appearance: none; margin: 0; font: inherit; color: #fff; cursor: pointer; border: 1px solid rgba(255,255,255,.3);
  background: rgba(10,14,40,.72); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
#sky-quality .q-note { padding: 6px 14px; border-radius: 999px; }
#sky-quality .q-menu { display: grid; gap: 6px; margin-top: 6px; }
#sky-quality .q-menu[hidden] { display: none; }
#sky-quality .q-menu button { padding: 8px 14px; border-radius: 12px; text-align: left; }
#sky-quality .q-menu button[data-q="high"] { border-color: #ffcf7a; }
#sky-ctl .ctl-q { display: none; }
html[data-sky-only][data-sky-q-can] #sky-ctl .ctl-q { display: grid; gap: 6px; font-size: 12px; }
#sky-ctl .ctl-q .q-row { display: flex; gap: 6px; flex-wrap: wrap; }
#sky-ctl .ctl-q button[aria-pressed="true"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; font-weight: 700; }
#sky-ctl .ctl-q .q-help { opacity: .8; font-weight: 400; line-height: 1.45; }
#sky-aurora .info-x::before, #sky-meteor .info-x::before { content: ""; position: absolute; left: -10px; right: -10px; top: -10px; bottom: -10px; }
html[data-daytime] #sky-aurora.show, html[data-daytime] #sky-aurora .au-credit { color: var(--dg-ink); text-shadow: 0 0 3px rgba(255,255,255,.9); }
.ts-date .ts-wx { margin-left: .7em; font-size: .86em; letter-spacing: .04em; opacity: .95; }
.ts-hero.is-picked .ts-date .ts-wx { display: none; }
html[data-wx-top] .ts-catch, html[data-wx-top] .ts-date, html[data-wx-top] .ts-lead { text-shadow: 0 2px 14px rgba(5,8,30,.72), 0 0 3px rgba(5,8,30,.55); }   /* トップに雲があるとき、白い見出しが白い雲に溶けないように */
html[data-daytime] #sky-weather .wx-credit { color: var(--dg-ink); text-shadow: 0 0 3px rgba(255,255,255,.9); font-size: 10px; }   /* 時刻のパネル（いまの前後12時間）は、生まれた空では出さない */
/* 月の絵：黒い背景を、ページの側で透明にした絵に差し替えたもの（moon-alpha）。
   重ね方（スクリーン）が効かないiPhoneでも、昼の空に黒い円が出ないように（社長のiPhone 8・2026-10-09） */
html[data-site-theme] img.moon-alpha { mix-blend-mode: normal !important; filter: drop-shadow(0 0 16px rgba(235,235,245,.22)) !important; }
/* 昼の空では、暗い側を空にとけこませる（本物の昼の月と同じ。新月の日に黒い玉に見えないように・社長 10/10） */
html[data-site-theme="cosmos"][data-sky="day"] img.moon-alpha { mix-blend-mode: screen !important; filter: none !important; }
/* スマホでは、見た目の切り替え（左下・ステージングだけ）の上に置く */
@media (max-width: 640px) { #sky-ctl { right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); } }
/* 右下の「空を見る」・時刻のボタンに、ページのいちばん下の文字やボタンが隠れないよう、下に余白を足す（10/09） */
html[data-site-theme="cosmos"] .container { padding-bottom: 104px; }   /* 右下の「空」・日時のボタンに、ページの下が隠れないように（社長 10/12） */
/* ── 昼の空のときの見た目（社長 10/11：メニューなどが黒っぽい。女性が見るので、フェミニンに）。
   白いすりガラス＋プラム色の文字＋ピーチの差し色。太陽が出ているあいだ（data-daytime）だけ。夜・☀︎で消したときは、これまでどおりの紺と金 ── */
html[data-daytime] {
  --dg-glass: rgba(255,255,255,.66); --dg-glass-strong: rgba(255,255,255,.86); --dg-ink: #4b3a5c; --dg-ink-soft: rgba(75,58,92,.72);
  --dg-line: rgba(255,255,255,.9); --dg-shadow: 0 6px 22px rgba(120,86,150,.18);
  --dg-accent: linear-gradient(135deg, #fbc4b4, #f8d9a9); --dg-accent-ink: #5b2f3a; --dg-accent-line: #f3b39b; --dg-rose: #c0603d;
}
html[data-daytime] #sky-ctl .sky-only-btn, html[data-daytime] #sky-ctl .sky-ctl-open, html[data-daytime] .sky-hint,
html[data-daytime] #drag-hint p, html[data-daytime] .tilt-reset, html[data-daytime] #birth-now, html[data-daytime] #compass-rose,
html[data-daytime] #sky-weather .wx-pill {
  background: var(--dg-glass); color: var(--dg-ink); border-color: var(--dg-line); box-shadow: var(--dg-shadow);
}
html[data-daytime] #sky-ctl .sky-only-btn[aria-pressed="true"], html[data-daytime] #sky-ctl .angle-row .angle-btn[aria-pressed="true"],
html[data-daytime] #sky-ctl [data-nosun][aria-pressed="true"], html[data-daytime] #sky-ctl .sky-ctl-now[aria-pressed="true"] {
  background: var(--dg-accent); color: var(--dg-accent-ink); border-color: var(--dg-accent-line);
}
html[data-daytime] #drag-hint p { color: var(--dg-rose); border-color: var(--dg-accent-line); }
html[data-daytime] .tilt-reset { color: var(--dg-rose); border-color: var(--dg-accent-line); }
/* 時刻と場所のパネル */
html[data-daytime] #sky-ctl .sky-ctl-panel { background: var(--dg-glass-strong); color: var(--dg-ink); box-shadow: var(--dg-shadow); }
html[data-daytime] #sky-ctl .sky-ctl-close, html[data-daytime] #sky-ctl .sky-ctl-now, html[data-daytime] #sky-ctl .sky-ctl-dir button {
  color: var(--dg-ink); border-color: rgba(75,58,92,.22);
}
html[data-daytime] #sky-ctl .sky-ctl-dir button[aria-pressed="true"] { background: var(--dg-ink); color: #fff; }
html[data-daytime] #sky-ctl select, html[data-daytime] #sky-ctl .sky-ctl-ll input {
  background: rgba(255,255,255,.75); color: var(--dg-ink); border-color: rgba(75,58,92,.22);
}
html[data-daytime] #sky-ctl input[type="range"] { accent-color: #f0a58a; }
/* 生まれた日の空のカード・方角のカード・大きな日時 */
html[data-daytime] #birth-card, html[data-daytime] #angle-card {
  background: var(--dg-glass-strong); color: var(--dg-ink); border-color: var(--dg-line); box-shadow: var(--dg-shadow);
}
html[data-daytime] #birth-card .bc-sub, html[data-daytime] #angle-card .ac-about, html[data-daytime] #angle-card .ac-sign, html[data-daytime] #angle-card .ac-more { color: var(--dg-ink-soft); }
html[data-daytime] #birth-card .bc-fold, html[data-daytime] #angle-card .ac-x { color: var(--dg-ink); border-color: rgba(75,58,92,.25); }
html[data-daytime] #birth-card .bc-next { color: var(--dg-rose); border-color: var(--dg-accent-line); }
html[data-daytime] #birth-card .bc-sub-link, html[data-daytime] #angle-card .ac-planet { color: var(--dg-rose); }
html[data-daytime] #birth-clock .bm-box { background: var(--dg-glass-strong); color: var(--dg-ink); border-color: var(--dg-accent-line);
  box-shadow: 0 0 36px rgba(248,196,180,.55), var(--dg-shadow); }
html[data-daytime] #birth-clock .bm-time { color: var(--dg-rose); }
/* ── 昼の見た目の2案（社長 10/11：LINE占い寄り・ELLE寄りの両方を見たい）。?look=line / ?look=elle で切り替え（この端末で覚える。?look=off で元に）
   どちらも昼だけ。夜は紺と金のまま ── */
/* A. LINE占い寄り：白地に、ラベンダー〜ピンクのグラデーション。丸く、やわらかく */
html[data-look="line"][data-daytime] {
  --dg-ink: #3d2d63; --dg-ink-soft: rgba(61,45,99,.7);
  --dg-accent: linear-gradient(135deg, #b794f6, #f78fb3); --dg-accent-ink: #ffffff; --dg-accent-line: #e3b8f5; --dg-rose: #9b4fd1;
  --dg-shadow: 0 6px 22px rgba(155,79,209,.2);
}
html[data-look="line"][data-sky="day"] body { --accent: #9b4fd1; --text: #2e2350; --text-muted: #574a7a; }
html[data-look="line"][data-sky="day"] .tab.is-active { background: linear-gradient(135deg, #b794f6, #f78fb3); border-color: transparent; color: #fff; }
html[data-look="line"][data-sky="day"] .tab.is-active .tab-label, html[data-look="line"][data-sky="day"] .tab.is-active .tab-price,
html[data-look="line"][data-sky="day"] .tab.is-active .tab-desc { color: #fff; }
html[data-look="line"][data-sky="day"] .card { border-radius: 22px; border-color: rgba(227,184,245,.8); box-shadow: 0 8px 26px rgba(155,79,209,.12); }
html[data-look="line"][data-sky="day"] .card h2 { color: #6b3fb0; }
html[data-look="line"][data-sky="day"] .primary-button, html[data-look="line"][data-sky="day"] button[type="submit"]:not(.text-button) {
  background: linear-gradient(135deg, #b794f6, #f78fb3); color: #fff; border: 0; border-radius: 999px; }
/* A'. LINE占い寄りを、コンセプト（本物の空・やさしく・女性向け）に合わせて整える（社長 10/12）。
   紫を少し淡くして朝の目にやさしく（審査：色が強い）、文字の紫は濃くして読みやすく。☰メニューも昼はラベンダーの白 */
html[data-look="line"][data-daytime] { --dg-accent: linear-gradient(135deg, #c7b0f7, #f3b2cb); --dg-rose: #8a49c4; }
html[data-look="line"][data-sky="day"] .tab.is-active, html[data-look="line"][data-sky="day"] .primary-button,
html[data-look="line"][data-sky="day"] button[type="submit"]:not(.text-button) { background: linear-gradient(135deg, #c7b0f7, #f3b2cb); }
html[data-look="line"][data-sky="day"] .card h2 { color: #5b2f99; }
html[data-look="line"][data-daytime] .site-menu { background: rgba(255,255,255,.95); border-color: rgba(199,176,247,.9); box-shadow: 0 18px 50px rgba(120,80,170,.25); }
html[data-look="line"][data-daytime] .sm-item { color: #3d2d63; }
html[data-look="line"][data-daytime] .sm-main { background: rgba(199,176,247,.18); }
html[data-look="line"][data-daytime] .sm-item:hover, html[data-look="line"][data-daytime] .sm-item[aria-current="page"] { background: rgba(243,178,203,.28); }
html[data-look="line"][data-daytime] .sm-sub { border-top-color: rgba(61,45,99,.12); }
html[data-look="line"][data-daytime] .sm-account { border-color: rgba(61,45,99,.2); }
html[data-look="line"][data-daytime] .site-menu-btn { background: rgba(255,255,255,.7); border-color: rgba(199,176,247,.9); }
html[data-look="line"][data-daytime] .site-menu-btn { color: #5b2f99; }
/* LINE寄りの昼：ボタンの決まり（社長 10/12：形・色・大きさ・字までこだわって）
   ・いちばん押してほしいもの＝ラベンダー→ピンクのグラデーション、白い字、丸いカプセル
   ・選ぶボタン（占い方・テーマ）＝淡いラベンダーの地に、濃いプラムの字。角は16px
   ・ひかえめなボタン（シェア・ほかの星座をえらぶ）＝白い地に、ラベンダーの細いふちとプラムの字 */
html[data-look="line"][data-sky="day"] .preset-btn { background: linear-gradient(160deg, rgba(232,220,252,.96), rgba(250,224,236,.96)); color: #3d2056;
  box-shadow: 0 6px 18px rgba(138,73,196,.16); border: 1px solid rgba(199,176,247,.9); }
html[data-look="line"][data-sky="day"] .preset-btn small { color: #6b4a8f; opacity: 1; }
html[data-look="line"][data-sky="day"] .preset-btn.is-quiet { background: rgba(255,255,255,.75); color: #6a2fb0; border-color: rgba(199,176,247,.9); }
html[data-look="line"][data-sky="day"] .horo-share { background: rgba(255,255,255,.85); color: #6a2fb0; border: 1px solid rgba(199,176,247,.95); }
html[data-look="line"][data-sky="day"] .site-account { background: rgba(255,255,255,.7); border-color: rgba(199,176,247,.9); color: #3d2d63; }
html[data-look="line"][data-sky="day"] .site-account-icon { color: #8a49c4; }
/* ── 見やすさの直し（10/14・社長「黒に紫など見づらい組み合わせを全部見直して」）。
   WCAG AA（ふつうの文字 4.5・大きい文字 3.0）を目安に、stg の全公開ページ×昼夕夜で測った結果から
   （output/2026-10-14_文字と背景の見やすさチェック.md・道具 output/tools/review/contrast_audit.py） ── */
/* 1. 昼の文字の紫・うすい文字・赤を一段濃く（白地の上で 7 前後） */
html[data-site-theme="cosmos"][data-sky="day"] body { --bad: #b03a3a; }
html[data-look="line"][data-sky="day"] body { --accent: #6f35b0; --text-muted: #46386a; --text-faint: #4f4470; --bad: #b03a3a; }
html[data-look="line"][data-daytime] { --dg-rose: #6f35b0; --dg-ink-soft: rgba(61,45,99,.88);
  --dg-accent: linear-gradient(135deg, #7d4bc4, #c2508f); }
html[data-sky="day"] .tag.good { color: #1f7a4a; border-color: rgba(31,122,74,.45); }
html[data-sky="day"] .hidori-reasons li.plus::before { color: #1f7a4a; }
/* 2. 昼：カードの外で青空の上に直接ある文字に、白い半透明の下地を敷く（青空の上の灰・紫の字は 1.5〜2.9 だった） */
html[data-sky="day"] .container > p.field-note, html[data-sky="day"] .container > p.worry-note,
html[data-sky="day"] .container > p.birth-sky, html[data-sky="day"] .container > a.back-link,
html[data-sky="day"] .lede, html[data-sky="day"] .horo-head, html[data-sky="day"] .moon-caption,
html[data-sky="day"] .site-footer {
  background: rgba(255,255,255,.84); border-radius: 14px; padding: 8px 12px;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
html[data-sky="day"] .container > a.back-link { display: inline-block; }
html[data-sky="day"] .site-footer { border-top: 0; padding: 14px 12px; }
html[data-sky="day"] .site-footer a, html[data-sky="day"] .site-credit { color: #3d2d63; }
/* 夜明け・夕方・夜：白い字のまま、明るくなりかけの空（薄明の明るいほう）に溶けていた（金坂さん 2026-10-30：朝の白っぽい空でフッターが見えない）。
   濃紺の薄い下地を敷いて、どの時間帯でも 4.5 以上に */
html[data-sky="twilight"] .site-footer, html[data-sky="night"] .site-footer {
  background: rgba(14,16,40,.78); border-radius: 14px; border-top: 0; padding: 14px 12px;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
html[data-sky="twilight"] .site-footer, html[data-sky="twilight"] .site-footer a, html[data-sky="twilight"] .site-credit,
html[data-sky="night"] .site-footer, html[data-sky="night"] .site-footer a, html[data-sky="night"] .site-credit { color: #e6e1f5; }
html[data-sky="twilight"] .site-credit.feedback-foot button, html[data-sky="night"] .site-credit.feedback-foot button { background: rgba(14,16,40,.78) !important; color: #e6e1f5 !important; }   /* QA Q1・11/03 */
html[data-sky="day"] .passkey-login, html[data-sky="day"] .method-notes, html[data-sky="day"] .chart-details {
  background: rgba(255,255,255,.84); border-radius: 14px; padding: 10px 12px; }   /* 2回目の測定で残った半透明の箱 */
html[data-sky="day"] ::placeholder { color: #5f5f73; opacity: 1; }
/* 入力の枠（シート）：地が #141418 で決め打ちのまま、昼は文字だけ濃い紫になって「黒に紫」だった（社長 10/14）。昼は白い地に */
html[data-sky="day"] .sheet-panel { background: #fbf9ff; border-color: rgba(199,176,247,.9); box-shadow: 0 20px 60px rgba(90,60,140,.25); }
html[data-sky="day"] .sheet-backdrop { background: rgba(40,30,70,.45); }
html[data-sky="day"] pre { background: rgba(61,45,99,.06); }
/* 白い枠の中では、選ぶボタン（チップ）が白に溶けて押せる物に見えないので、淡いラベンダーの地と細いふちを */
html[data-sky="day"] .sheet-panel .focus-chip span, html[data-sky="day"] .sheet-panel .chip { background: rgba(199,176,247,.16); border-color: rgba(138,73,196,.35); color: #3d2d63; }
html[data-sky="day"] .sheet-panel .focus-chip input:checked + span, html[data-sky="day"] .sheet-panel .chips input[type="radio"]:checked + .chip { background: #6f35b0; border-color: #6f35b0; color: #fff; }
html[data-sky="day"] .sheet-panel select, html[data-sky="day"] .sheet-panel input:not([type="checkbox"]):not([type="radio"]), html[data-sky="day"] .sheet-panel textarea { border-color: rgba(138,73,196,.35); }
html[data-sky="day"] .scoring-table, html[data-sky="day"] .proof-table, html[data-sky="day"] .compare-table,
html[data-sky="day"] .planet-table { background: rgba(255,255,255,.84); }
/* 3. いちばん押してほしいボタン：淡いラベンダー→ピンクに白い字は 1.8〜2.5 だった。紫→ローズに濃くする */
html[data-look="line"][data-sky="day"] .tab.is-active, html[data-look="line"][data-sky="day"] .primary-button,
html[data-look="line"][data-sky="day"] button[type="submit"]:not(.text-button) { background: linear-gradient(135deg, #7d4bc4, #c2508f); }
/* 4. 昼のトップの見出し（白い字）：晴れた空の上で沈むので、影を濃く */
html[data-sky="day"] .ts-hero p, html[data-sky="day"] #ts-catch .ts-line {
  text-shadow: 0 1px 3px rgba(18,28,70,.6), 0 0 14px rgba(18,28,70,.4); }
/* 5. 夜・夕方：うすい文字を一段明るく、入力欄の見本の文字も明るく */
html[data-site-theme="cosmos"]:not([data-sky="day"]):not([data-sky="twilight"]) body { --text-faint: #a6a5c4; }   /* 朝夕は上の #c4c1dc のまま */
html[data-site-theme="cosmos"]:not([data-sky="day"]) ::placeholder { color: #a3a2c2; opacity: 1; }
/* B. ELLE寄り：白地に細い黒の線、明朝、余白。色は少なく、大人っぽく */
html[data-look="elle"][data-daytime] {
  --dg-glass: rgba(255,255,255,.84); --dg-glass-strong: rgba(255,255,255,.94); --dg-ink: #1d1b1a; --dg-ink-soft: rgba(29,27,26,.66);
  --dg-line: rgba(29,27,26,.55); --dg-shadow: none;
  --dg-accent: #1d1b1a; --dg-accent-ink: #ffffff; --dg-accent-line: #1d1b1a; --dg-rose: #8a5a44;
}
html[data-look="elle"][data-daytime] #sky-ctl .sky-only-btn, html[data-look="elle"][data-daytime] #sky-ctl .sky-ctl-open,
html[data-look="elle"][data-daytime] #birth-card, html[data-look="elle"][data-daytime] #angle-card, html[data-look="elle"][data-daytime] #sky-ctl .sky-ctl-panel {
  font-family: "Zen Old Mincho", serif; letter-spacing: .06em; border-width: 1px; -webkit-backdrop-filter: none; backdrop-filter: none;
}
html[data-look="elle"][data-sky="day"] body { --accent: #8a5a44; --text: #1d1b1a; --text-muted: #4a4542; --border: rgba(29,27,26,.18);
  --surface: rgba(255,255,255,.86); --surface-strong: rgba(255,255,255,.94); }
html[data-look="elle"][data-sky="day"] .card { border-radius: 4px; box-shadow: none; border: 1px solid rgba(29,27,26,.14); padding-top: 28px; padding-bottom: 28px; }
html[data-look="elle"][data-sky="day"] .card h2, html[data-look="elle"][data-sky="day"] .tab-label {
  font-family: "Zen Old Mincho", serif; font-weight: 400; letter-spacing: .08em; }
html[data-look="elle"][data-sky="day"] .tab { border-radius: 4px; }
html[data-look="elle"][data-sky="day"] .tab.is-active { background: #1d1b1a; border-color: #1d1b1a; }
html[data-look="elle"][data-sky="day"] .tab.is-active .tab-label, html[data-look="elle"][data-sky="day"] .tab.is-active .tab-price,
html[data-look="elle"][data-sky="day"] .tab.is-active .tab-desc { color: #fff; }
html[data-look="elle"][data-sky="day"] .primary-button, html[data-look="elle"][data-sky="day"] button[type="submit"]:not(.text-button) {
  background: #1d1b1a; color: #fff; border: 0; border-radius: 2px; font-family: "Zen Old Mincho", serif; letter-spacing: .1em; }
/* 直し11件 #2・#3（吉原さん 11/03）：太陽・地面の景色の左の丸も、出しているとき（＝「消す」を押していない）に金色。天気と同じ見え方に */
#sky-ctl .bv-row[data-inv] .sky-only-btn[aria-pressed="false"] { background: #ffcf7a; color: #1d1530; border-color: #ffcf7a; }
#sky-ctl .bv-row[data-inv] .sky-only-btn[aria-pressed="true"] { background: rgba(10,14,40,.72); color: #fff; border-color: rgba(255,255,255,.3); font-weight: inherit; }
/* 直し11件 #4（吉原さん 11/03）：見え方の窓の「✕ 閉じる」 */
#sky-ctl .bc-view-panel .bv-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; color: #fff; padding: 0 0 2px; }
#sky-ctl .bc-view-panel .bv-close { height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.6); background: rgba(255,255,255,.16); color: #fff; font-size: 13px; font-weight: 700; cursor: pointer; }
/* 直し11件 #6：流星群の札は押せる（放射点の方を向く） */
html[data-sky-only]:not([data-sky-birth]) #sky-meteor.show { pointer-events: auto; cursor: pointer; }
#sky-meteor .met-go { display: block; margin-top: 2px; font-size: 10px; color: rgba(255,232,190,.85); text-decoration: underline; text-underline-offset: 2px; }
/* 直し11件 #11：誕生空のあいだだけ「↩ いまの空へ」（占いのかわりに同じ所へ） */
#sky-ctl .sky-top .sky-back-now { display: none; }
html[data-sky-only][data-sky-birth] #sky-ctl .sky-top .sky-back-now { display: inline-flex; pointer-events: auto; background: rgba(255,214,140,.95); color: #2a1c05; border-color: rgba(255,214,140,1); font-weight: 700; }
html[data-sky-birth] #sky-ctl .sky-top .sky-fortune { display: none; }