/* 生成物。編集しないこと。
   中身 = このテーマの 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: #a9342c;
  --standalone-rail-bg: #fdfbf5;
  --standalone-card-bg: #f7f2e8;
  --standalone-text: #1c1a17;
}

html{scroll-behavior:smooth}
body{margin:0;background:#fdfbf5;color:#1c1a17;font-family:'Shippori Mincho','Hiragino Mincho ProN',serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:#a9342c;text-decoration:none}
a:hover{color:#a9342c}
::selection{background:rgba(169,52,44,.2);color:#1c1a17}
@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}
}

/* 09-wa — 和・朱と墨
   狙い: 和装・着物・花魁風の撮影をした人。他社テンプレにほぼ無い差別化枠。
   地は生成り。朱は面で使わず線と小さい文字だけに絞る（面で使うと安っぽくなる）。
   角丸はゼロ。見出しは Shippori Mincho を主役にする。 */

body[data-birthday-theme="wa"] {
  background: #fdfbf5;
}

body[data-birthday-theme="wa"] #rail-left,
body[data-birthday-theme="wa"] #rail-right,
body[data-birthday-theme="wa"] #sp-header {
  background: rgba(253, 251, 245, .97) !important;
  box-shadow: none !important;
}

body[data-birthday-theme="wa"] #hero-img {
  background-image:
    linear-gradient(180deg, rgba(253, 251, 245, .2) 0%, transparent 26%, transparent 56%, rgba(253, 251, 245, .55) 84%, #fdfbf5 100%),
    url("../images/hero.webp") !important;
  background-position: 0 0, center 19% !important;
}

/* 角丸ゼロ・朱のヘアライン。影は落とすが色は墨側に寄せる。 */
body[data-birthday-theme="wa"] #hero-card {
  border-radius: 0 !important;
  border-color: rgba(169, 52, 44, .3) !important;
  box-shadow: 0 16px 44px rgba(28, 26, 23, .09) !important;
}

body[data-birthday-theme="wa"] #be,
body[data-birthday-theme="wa"] #hero-name {
  font-family: "Shippori Mincho", "Hiragino Mincho ProN", serif !important;
}

body[data-birthday-theme="wa"] #be {
  font-weight: 700 !important;
  letter-spacing: .12em !important;
}

body[data-birthday-theme="wa"] #hero-name {
  font-weight: 600 !important;
  letter-spacing: .34em !important;
  text-indent: .34em !important;
}

/* Great Vibes の筆記体は和の面立てと衝突するため出さない。 */
body[data-birthday-theme="wa"] #hero-script {
  display: none !important;
}

body[data-birthday-theme="wa"] #main-col > section:not(#top) {
  background: #fdfbf5;
}

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

/* PC のセクション見出しに朱の縦罫を一本立てる（和の面立て）。
   見出しそのものを vertical-rl にすると Cinzel の欧文が寝てしまうため、
   縦組みではなく縦罫で処理する。SP では出さない（幅が足りない）。 */
@media (min-width: 1024px) {
  body[data-birthday-theme="wa"] #main-col > section:not(#top) > div:first-child {
    position: relative;
  }

  body[data-birthday-theme="wa"] #main-col > section:not(#top) > div:first-child::before {
    content: "";
    position: absolute;
    top: -22px;
    left: 50%;
    width: 1px;
    height: 18px;
    background: rgba(169, 52, 44, .55);
  }
}

body[data-birthday-theme="wa"] #profile-grid > div:first-child,
body[data-birthday-theme="wa"] #info-grid > div,
body[data-birthday-theme="wa"] #message > div:last-child,
body[data-birthday-theme="wa"] #photo-grid > div {
  border-radius: 0 !important;
  border-color: rgba(169, 52, 44, .2) !important;
  box-shadow: none !important;
  /* 旧ビルドが焼き込んだ純白（#ffffff）は生成りの地から浮くため揃える。 */
  background: #fdfbf5 !important;
}

/* CTA は墨のベタに朱のヘアライン。朱を面で使わないという方針をここで守る
   （影を残すと朱の光が面になって出るため落とす）。
   [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="wa"] a[href="#reservation"],
body[data-birthday-theme="wa"] [data-line-share],
body[data-birthday-theme="wa"] #sp-cta,
body[data-birthday-theme="wa"] #sp-cta a {
  border-radius: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 1023px) {
  body[data-birthday-theme="wa"] #hero-img {
    background-position: 0 0, center 17% !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;
}