/* 生成物。編集しないこと。
   中身 = このテーマの theme.css + _shared/common.css。
   直すときは theme.css（テーマ固有）か _shared/common.css（全テーマ共通）を編集し、
   python sync_shared.py を実行する。 */
/* このテーマ固有のCSS。
   内訳: :root（テーマの4色）→ ベース（素のHTML用の土台）→ テーマの上書き。
   共通部分は ../_shared/common.css にあり、sync_shared.py が
   このファイルの後ろに連結して assets/css/style.css を作る。
   色や見た目を変えるときはこのファイルを編集する（style.css は生成物なので触らない）。 */

:root {
  --standalone-accent: #c08c76;
  --standalone-rail-bg: #fffdfb;
  --standalone-card-bg: #faf5f1;
  --standalone-text: #4a3a33;
}

html{scroll-behavior:smooth}
body{margin:0;background:#fdf9f6;color:#33241f;font-family:'Shippori Mincho','Hiragino Mincho ProN',serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:#8f5b47;text-decoration:none}
a:hover{color:#b8836b}
::selection{background:rgba(192,140,118,.2);color:#33241f}
@media (min-width:1024px){
#rail-left,#rail-right{display:flex!important}

#sp-header,#sp-cta,#sp-menu{display:none!important}
#main-col{margin-left:200px;margin-right:264px;padding-top:0!important}
#hero-img{height:100svh!important;min-height:620px!important}
#hero-card{max-width:600px!important;margin:-104px auto 0!important;padding:44px 48px 40px!important}
#be{font-size:46px!important}
#hero-name{font-size:50px!important}
#hero-script{display:block!important}
#profile-grid{grid-template-columns:minmax(230px,330px) 1fr!important}
#info-grid{grid-template-columns:1fr 1fr!important}
#photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#footer{padding-bottom:30px!important}
}

/* 08-nude — ローズベージュ／透明感
   狙い: 20代キャバ嬢、韓国風メイクの抜け感。07 の「格・上品」に対して
   「今っぽい・柔らかい」。影を極力消し、境界は罫線ではなく色差で作る。 */

body[data-birthday-theme="nude"] {
  background:
    radial-gradient(circle at 50% 6%, rgba(192, 140, 118, .1), transparent 32%),
    #fdf9f6;
}

body[data-birthday-theme="nude"] #rail-left,
body[data-birthday-theme="nude"] #rail-right,
body[data-birthday-theme="nude"] #sp-header {
  background: rgba(255, 253, 251, .97) !important;
  /* 影ではなく色差で段差を作る。 */
  box-shadow: none !important;
}

/* 写真と地を溶かす。07 より下端グラデを長く取り（56%→44% から効かせる）、
   境界線を感じさせない。 */
body[data-birthday-theme="nude"] #hero-img {
  background-image:
    linear-gradient(180deg, rgba(253, 249, 246, .3) 0%, transparent 24%, transparent 44%, rgba(253, 249, 246, .5) 72%, rgba(253, 249, 246, .88) 90%, #fdf9f6 100%),
    url("../images/hero.webp") !important;
  background-position: 0 0, center 20% !important;
}

body[data-birthday-theme="nude"] #hero-card {
  background: #fffdfb !important;
  border-color: rgba(192, 140, 118, .2) !important;
  box-shadow: none !important;
}

/* Cinzel より柔らかい書体で受ける。 */
body[data-birthday-theme="nude"] #be {
  font-family: "Cormorant Garamond", serif !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
}

body[data-birthday-theme="nude"] #hero-name {
  font-family: "Cormorant Garamond", serif !important;
  font-weight: 600 !important;
}

/* 罫線を使わず、隣り合うセクションのわずかな色差だけで切る。 */
body[data-birthday-theme="nude"] #main-col > section:not(#top) {
  background: #fdf9f6;
}

body[data-birthday-theme="nude"] #main-col > section:nth-of-type(even):not(#top) {
  background: #faf5f1;
}

body[data-birthday-theme="nude"] #profile-grid > div:first-child,
body[data-birthday-theme="nude"] #info-grid > div,
body[data-birthday-theme="nude"] #message > div:last-child,
body[data-birthday-theme="nude"] #photo-grid > div {
  box-shadow: none !important;
  border-color: rgba(192, 140, 118, .16) !important;
  /* 旧ビルドが焼き込んだ純白（#ffffff）は、この地（#fdf9f6）から浮くため揃える。 */
  background: #fffdfb !important;
}

/* [data-line-share] も併記する: build_standalone.py の convert_ctas_to_share が
   href="#reservation" を href="#" data-line-share へ書き換えるため、
   標準HTML側では href セレクタだけでは当たらない（2026-07-25 実測）。 */
body[data-birthday-theme="nude"] a[href="#reservation"],
body[data-birthday-theme="nude"] [data-line-share],
body[data-birthday-theme="nude"] #sp-cta {
  box-shadow: none !important;
}

/* COUNTDOWN の文字色だけ一段深くする（2026-07-25）。
   カウントダウンの色は --standalone-accent（指示書指定の #c08c76）を使うが、
   9.5px の "COUNTDOWN" では地に対して 2.85 しか出ず、07-white の同要素（4.31）を
   下回る。枠線は指定どおり accent のまま、文字だけ読める明度へ落とす。 */
body[data-birthday-theme="nude"] .bd-countdown {
  color: #9d6650;
}

@media (max-width: 1023px) {
  body[data-birthday-theme="nude"] #hero-img {
    background-position: 0 0, center 18% !important;
  }

  /* ---- 形: 横スクロールのギャラリー（2026-07-25 追加） ------------------
     狙いが「20代・Instagram的な抜け感」なので、写真は2列グリッドではなく
     指で送るカルーセルにする。SNSでの見方に近い所作になる。
     HTMLは触らず #photo-grid の display を差し替えるだけ。
     2枚目が少し覗く幅（62%）にして、横に続くことが分かるようにする。
     PC幅は base の3列グリッドのまま。 */
  body[data-birthday-theme="nude"] #photo-grid {
    display: flex !important;
    grid-template-columns: none !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    gap: 10px !important;
    padding-bottom: 12px !important;
    scrollbar-width: none;
  }

  body[data-birthday-theme="nude"] #photo-grid::-webkit-scrollbar {
    display: none;
  }

  body[data-birthday-theme="nude"] #photo-grid > div {
    flex: 0 0 62% !important;
    scroll-snap-align: center !important;
  }
}

/* 14テーマ共通のCSS。ここを直すと全テーマに効く（sync_shared.py で配布）。
   テーマ固有の色は各 NN-theme/theme.css の :root にある。 */
img.slot-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#rail-right.standalone-rail {
  position: fixed;
  right: 0;
  top: 0;
  bottom: 0;
  width: 264px;
  box-sizing: border-box;
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 12px !important;
  padding: 18px 16px !important;
  background: var(--standalone-rail-bg) !important;
  border-left: 1px solid color-mix(in srgb, var(--standalone-accent) 25%, transparent);
  overflow-y: auto !important;
  scrollbar-width: none;
}

.standalone-rail__card {
  box-sizing: border-box;
  border: 1px solid color-mix(in srgb, var(--standalone-accent) 42%, transparent);
  background: var(--standalone-card-bg);
  color: var(--standalone-text);
  padding: 15px;
}

.standalone-rail__eyebrow {
  margin: 0;
  color: var(--standalone-accent);
  font-family: "Cinzel", serif;
  font-size: 13px;
  letter-spacing: .12em;
}

.standalone-rail__date {
  margin: 8px 0 12px;
  color: var(--standalone-text);
  font-family: "Cormorant Garamond", serif;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: .07em;
}

.standalone-rail__meta {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 7px 8px;
  padding-top: 11px;
  border-top: 1px solid color-mix(in srgb, var(--standalone-accent) 22%, transparent);
  font-size: 14px;
  line-height: 1.65;
}

.standalone-rail__meta span {
  color: var(--standalone-accent);
  font-family: "Cinzel", serif;
  font-size: 13px;
  letter-spacing: .1em;
}

.standalone-rail__champagne {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: 13px;
}

.standalone-rail__champagne img {
  width: 74px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

.standalone-rail__champagne p {
  margin: 0;
  color: var(--standalone-text);
  font-size: 14px;
  line-height: 1.75;
}

.standalone-rail__gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.standalone-rail__gallery img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

#sp-menu {
  pointer-events: none !important;
}

#sp-menu.is-open {
  pointer-events: auto !important;
}

#sp-menu > div:first-child {
  opacity: 0 !important;
}

#sp-menu > div:nth-child(2) {
  transform: translateX(-104%) !important;
}

#sp-menu.is-open > div:first-child {
  opacity: 1 !important;
}

#sp-menu.is-open > div:nth-child(2) {
  transform: translateX(0) !important;
}

/* カウントダウン（2026-07-25 追加）。テーマ色に追随させるため、色は
   --standalone-accent / --standalone-text だけを使い、7テーマ共通の1定義で足りるようにする。 */
.bd-countdown {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  /* 下マージン: 直下の会場名（LUXE CABARET TOKYO 等）と枠線が接して読みづらかったため
     （2026-07-25 長島指摘）。上下で同量にすると詰まって見えるので下をやや厚くする。 */
  margin: 14px 0 20px;
  padding: 7px 18px;
  border: 1px solid color-mix(in srgb, var(--standalone-accent) 55%, transparent);
  color: var(--standalone-accent);
  font-family: "Cinzel", serif;
  letter-spacing: .18em;
  line-height: 1.4;
}

.bd-countdown__label {
  font-size: 13px;
  opacity: .85;
}

.bd-countdown__value {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .08em;
}

/* 右レール内は幅が狭いので詰める。 */
.standalone-rail__card .bd-countdown {
  margin: 0 0 12px;
  padding: 5px 12px;
}

.standalone-rail__card .bd-countdown__value {
  font-size: 15px;
}

/* 広い画面では「ステージ」を中央で止め、外側は地の色だけを伸ばす
   （2026-07-25 長島裁定）。

   実測（13-sunset）: 本文カラムの中身は元から max-width 880px で止まっていたが、
   #main-col と #hero-img だけは上限が無く、2560px で 2096px まで伸びていた。
   ヒーローは高さ 100svh 固定なので 2096x900（横2.3:1）になり、縦位置の人物写真が
   極端に切り取られる。
   あわせて左右の非対称も解消する: 左レール200px・右レール264px のため、
   #main-col の中心は画面中心より常に 32px 左へずれていた。

   ステージ幅 = 200(左レール) + 900(本文) + 264(右レール) = 1364px。
   1364px 以下では従来と1pxも変わらない。

   #rail-right の right:0 は validate_standalone.py の必須検査項目なので、
   上の宣言ブロックはそのまま残し、ここで上書きする。 */
@media (min-width: 1365px) {
  #rail-left {
    left: calc(50% - 682px) !important;
  }

  #rail-right.standalone-rail {
    right: calc(50% - 682px) !important;
  }

  #main-col {
    margin-left: calc(50% - 482px) !important;
    margin-right: calc(50% - 418px) !important;
  }
}

/* SP では右レールを出さない（2026-07-25 修正。長島裁定で根治）。
   ソース2系統でSPの隠し方が違うのが原因だった。
     Luxe Cabaret Birthday.dc.html（01〜06/10）
       … @media (max-width:1023px) で #rail-right に display:none!important → 正常。
     Luxe Cabaret Birthday White.dc.html（07〜09/11/12）
       … mobile-first で、SPの非表示を aside の【インライン style】に頼っている。
         #rail-left はインライン display:none だが #rail-right は display:flex。
         さらに build_right_rail() がその aside を差し替えるためインラインが消え、
         上の #rail-right.standalone-rail{display:flex}（id+class で詳細度が高い）が
         常時勝って、375px で264pxの固定パネルがヒーローに覆いかぶさっていた。
   検証時に display:flex を必須にしている validate_standalone.py の検査を残すため、
   宣言そのものは触らず、SP側だけを後から打ち消す。 */
@media (max-width: 1023px) {
  #rail-right.standalone-rail {
    display: none !important;
  }
}

/* ==========================================================================
   可読性（2026-07-26 追加。design-guide.md の基準に合わせる）

   【なぜ】375px 実測で、1テンプレあたり文字要素 135〜142 のうち
   72件（約53%）が 14px 未満、51件（約38%）が 12px 未満、最小 6.5px だった。
   さらに 14px 未満なのに letter-spacing が .12em を超えるものが 14種で 760件。
   ガイドはこれを名指しで禁止している（「小さな文字に大きな letter-spacing を
   指定して、実質的に読めなくすることは禁止」「高級感を理由に10px、11px、12pxへ
   縮小しない」）。夜職の客層は老眼世代を含むため、可読性は品質ではなく売上の問題。

   【やり方】サイズは共有マークアップのインライン style に入っているので、
   属性セレクタで拾って引き上げる。同じルールで字間も詰める——大きな見出しは
   インラインが 14px 以上なので、この一覧には掛からない。

   【小さいまま残すもの】ガイドの B/C 分類に当たるものだけ 12px で許容する。
     ◆ の装飾 … 内容理解に影響しない
     ロゴ下の TOKYO … 装飾的な英字ラベル
     ボタン下の SHARE / RESERVATION … 上に「LINEでシェア」「電話で予約」が
       14px 以上で出ている重複情報
   ========================================================================== */

[style*="font-size:6.5px"] { font-size: 12px !important; letter-spacing: .14em !important; }
[style*="font-size:7.5px"] { font-size: 12px !important; letter-spacing: .12em !important; }
[style*="font-size:8px"]   { font-size: 12px !important; letter-spacing: .12em !important; }
[style*="font-size:8.5px"] { font-size: 12px !important; letter-spacing: .12em !important; }
[style*="font-size:9.5px"] { font-size: 14px !important; letter-spacing: .1em !important; }
[style*="font-size:10px"]  { font-size: 14px !important; letter-spacing: .1em !important; }
[style*="font-size:10.5px"]{ font-size: 14px !important; letter-spacing: .08em !important; }
[style*="font-size:11px"]  { font-size: 14px !important; letter-spacing: .08em !important; }
[style*="font-size:11.5px"]{ font-size: 15px !important; letter-spacing: .06em !important; }
[style*="font-size:12px"]  { font-size: 15px !important; letter-spacing: .06em !important; }
[style*="font-size:12.5px"]{ font-size: 15px !important; letter-spacing: .06em !important; }
[style*="font-size:13px"]  { font-size: 16px !important; letter-spacing: .04em !important; }
[style*="font-size:13.5px"]{ font-size: 16px !important; letter-spacing: .04em !important; }

/* 重要情報は継承で小さくなることがあるため、意味で直接押さえる。
   ガイドは電話番号・住所・営業時間・料金・店舗情報を「12〜13px 許容の対象外」と
   名指ししている。data-site が付いているので確実に拾える。 */
[data-site="phone"],
[data-site="address"],
[data-site="openTime"],
[data-site="fee"] {
  font-size: 16px !important;
  letter-spacing: .04em !important;
}

/* 店名は装飾的な位置（ヒーローの小見出し等）にも出るため、階層を保って15px。 */
[data-site="brand"] {
  font-size: 15px !important;
  letter-spacing: .06em !important;
}

/* 日本語の本文は明朝なので行間 1.65 以上（ガイド 4章）。 */
[style*="line-height:1.5"],
[style*="line-height:1.55"],
[style*="line-height:1.6"] {
  line-height: 1.7 !important;
}

/* ---- タップ領域（ガイド8章: 最小44×44px）--------------------------------
   実測（375px / 1280px）で44px未満だった6種を個別に広げる。
   レイアウトを動かさずに当たり判定だけ広げたい箇所は、
   インライン要素の上下パディング（行送りに影響しない）と ::after を使う。 */

/* 本文中の地図リンク。インラインなので上下パディングは行の高さを変えない。 */
[data-site-href="map"] {
  padding: 13px 8px;
}

/* SPメニューの閉じるボタン（実測 32x36）。 */
#sp-menu button[data-menu-close] {
  min-width: 44px;
  min-height: 44px;
  padding: 8px !important;
}

/* SNSアイコン。SPメニューは幅に余裕があるので 44x44 を確保する。 */
#sp-menu a[aria-label] {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

/* PC左レールは幅200pxで 4個x44px（gap込み188px）が入らないため、
   高さ44pxを確保し、横は隣との間隔（gap:16px）ぶんまで当たり判定を広げる。
   結果は 34x44。幅は基準に届かないが、レールを広げずに取れる最大。 */
#rail-left a[aria-label] {
  min-height: 44px;
  align-items: center;
  position: relative;
}

#rail-left a[aria-label]::after {
  content: "";
  position: absolute;
  inset: 0 -8px;
}

/* 右レールの「MORE PHOTOS →」（実測 199x22）。 */
.standalone-rail__card a[href="#photo"] {
  padding: 11px 0;
}

/* ---- 字間の詰め残し（実測で .12em を超えていた2種）---------------------- */
.bd-countdown__label {
  letter-spacing: .1em;
}

/* ロゴ下の TOKYO。装飾だが .12em を超えないようにそろえる。 */
[style*="font-size:6.5px"] {
  letter-spacing: .12em !important;
}

/* ---- 9px の取りこぼし（2026-07-26 修正）--------------------------------
   PC左レールの日本語サブラベル（トップ／プロフィール…）が 9px のまま残っていた。
   英字（TOP/PROFILE）は 12px→15px に上がったのに日本語が 9px で、
   日本語の読み手には主従が逆転していた。ガイドのナビ基準は PC 14〜16px。

   9px は装飾（◆・SCROLL）とも共用されているため、ナビの中だけ 14px にする。 */
[style*="font-size:9px"] {
  font-size: 12px !important;
  letter-spacing: .12em !important;
}

nav [style*="font-size:9px"] {
  font-size: 14px !important;
  letter-spacing: .08em !important;
}