/*
 * 新案D(v5): 暗室の、暖かい黒。参考 ORYZO AI。決まりは docs/design/DESIGN-d.md(ここはその実装)。
 * html[data-design="v5"] のときだけ効く。v2 の「英語の飾りを外す」等は design-v2.css が v5 にも効いていて、ここで上書きする。
 * ⚠️ 店舗ごとの色より、この配色が勝つ(見比べるため)。文字の大きさは rem
 */

html[data-design="v5"] {
  --bg: #100904; --bg-panel: #382416; --bg-deep: #0B0603; --shade: #100904;
  --ink: #FFEDD7; --ink-dim: #B3A08A; --accent: #DC5000; --accent-soft: rgba(220, 80, 0, 0.12);
  --ok: #DC5000; --soon: #B3A08A; --line: #40372E; --jade: #6C5F51;
  --bg-rgb: 16, 9, 4; --shade-rgb: 16, 9, 4; --ink-rgb: 255, 237, 215; --accent-rgb: 220, 80, 0;
  --v2-rule: #40372E; --v2-radius: 0;
  --d-sans: Inter, 'Segoe UI', 'Zen Kaku Gothic New', sans-serif;
}
html[data-design="v5"] body { background: var(--bg) !important; }
html[data-design="v5"] body, html[data-design="v5"] h1, html[data-design="v5"] h2, html[data-design="v5"] h3, html[data-design="v5"] .serif,
html[data-design="v5"] button, html[data-design="v5"] .header-title-jp, html[data-design="v5"] .menu-row-jp,
html[data-design="v5"] .pickup-name, html[data-design="v5"] .cast-name, html[data-design="v5"] .today-name {
  font-family: var(--d-sans) !important; letter-spacing: 0 !important;
}

/* 見出し: 大きく・行間を詰める・下に点線 */
html[data-design="v5"] .section-title {
  font-size: 1.75rem !important; font-weight: 500 !important; line-height: 1.15 !important;
  display: block !important; padding-bottom: 12px; border-bottom: 1px dashed var(--line); margin-bottom: 16px !important;
}
html[data-design="v5"] .section-title::after { display: none; }
html[data-design="v5"] .header-title-jp { font-size: 1.125rem !important; font-weight: 500 !important; }
html[data-design="v5"] .top-header { background: rgba(16, 9, 4, 0.94) !important; border-bottom: 1px dashed var(--line) !important; }
html[data-design="v5"] .back-btn, html[data-design="v5"] .icon-btn, html[data-design="v5"] .home-menu-btn, html[data-design="v5"] .global-menu-btn {
  border: 1px solid rgba(255, 237, 215, 0.5) !important; border-radius: 22px !important; background: transparent !important;
}

/* ホームの頭: 左寄せ・大きい店名(欧文は大文字) */
html[data-design="v5"] .home-logo-header {
  background-image: none !important; text-align: left !important; align-items: flex-start !important;
  padding: 34px 18px 22px !important; border-bottom: 1px dashed var(--line);
}
html[data-design="v5"] .home-logo-header .store-name { font-size: 2.5rem !important; font-weight: 500 !important; line-height: 1 !important; text-transform: uppercase; }
html[data-design="v5"] .home-logo-header .store-name img { margin: 0 0 16px !important; max-height: 40px !important; }
html[data-design="v5"] .home-logo-header .store-name .sub { font-size: 0.8125rem !important; color: var(--ink-dim) !important; margin-top: 10px !important; text-transform: none; }
html[data-design="v5"] .hours-badge { background: transparent !important; justify-content: flex-start !important; flex-wrap: wrap; gap: 2px 16px !important; border-bottom: 1px dashed var(--line) !important; }

/* 写真: 角 0(切れ目をはっきり)・左右の余白は地の色 */
html[data-design="v5"] .pickup-photo, html[data-design="v5"] .today-photo, html[data-design="v5"] .cast-photo, html[data-design="v5"] .gallery-photo,
html[data-design="v5"] .rvideo-photo, html[data-design="v5"] .profile-reel-tile {
  border-radius: 0 !important; background-color: #0B0603 !important;
}
html[data-design="v5"] .pickup-photo.m-real::before, html[data-design="v5"] .today-photo.m-real::before, html[data-design="v5"] .cast-photo.m-real::before,
html[data-design="v5"] .gallery-photo.m-real::before { opacity: 0.35; }
/* 箱(バナー・イベント)は 12px */
html[data-design="v5"] .banner-slide, html[data-design="v5"] .event-banner { border-radius: 12px !important; }

/* 札・状態: Ember の文字だけ(面に色を塗らない) */
html[data-design="v5"] .cast-badge { background: transparent !important; color: #DC5000 !important; border: 1px solid #DC5000; border-radius: 22px !important; padding: 1px 8px !important; font-size: 0.6875rem !important; }
html[data-design="v5"] .cast-status-badge, html[data-design="v5"] .today-status { color: #FFEDD7 !important; }
html[data-design="v5"] .status-ok { color: #DC5000 !important; }
html[data-design="v5"] .cast-status-badge.status-ok, html[data-design="v5"] .today-status.status-ok { text-shadow: 0 1px 3px #000, 0 0 8px rgba(0, 0, 0, 0.8) !important; }
html[data-design="v5"] .status-ok .status-dot { background: #DC5000 !important; }
html[data-design="v5"] .status-soon .status-dot { background: #6C5F51 !important; }

/* 一覧: 2列・間 18px・名前を大きく */
html[data-design="v5"] .cast-grid { gap: 26px 18px !important; }
html[data-design="v5"] .cast-name, html[data-design="v5"] .pickup-name { font-size: 1.125rem !important; font-weight: 500 !important; margin-top: 8px; }
html[data-design="v5"] .today-name { font-size: 1rem !important; font-weight: 500 !important; }
html[data-design="v5"] .area-group-title { color: #DC5000 !important; border-bottom: 1px dashed var(--line); padding-bottom: 6px; }

/* 表・箱: 点線と 12px の箱 */
html[data-design="v5"] .price-quick, html[data-design="v5"] .profile-stats-table { border-top: 1px dashed var(--line) !important; }
html[data-design="v5"] .price-row { border-bottom: 1px dashed var(--line) !important; }
html[data-design="v5"] .price-amt { color: #FFEDD7 !important; font-weight: 500; font-variant-numeric: tabular-nums; }
html[data-design="v5"] .notice, html[data-design="v5"] .comment-block, html[data-design="v5"] .news-block > * {
  background: #382416 !important; border: 0 !important; border-radius: 12px !important;
}
html[data-design="v5"] .profile-tag { color: #DC5000 !important; }

/* ボタン: 主 = Bark Brown の丸い塗り、従 = クリームの線(角 22px) */
html[data-design="v5"] .reserve-fixed-btn.web, html[data-design="v5"] .sheet-cta, html[data-design="v5"] .gate-cta, html[data-design="v5"] .contact-cta:not(.line) {
  background: #382416 !important; color: #FFEDD7 !important; border: 0 !important; border-radius: 36px !important;
}
html[data-design="v5"] .reserve-fixed-btn.tel, html[data-design="v5"] .reserve-fixed-btn.line, html[data-design="v5"] .contact-cta.line {
  background: transparent !important; color: #FFEDD7 !important; border: 1px solid #FFEDD7 !important; border-radius: 22px !important;
}
html[data-design="v5"] .reserve-fixed-btn svg { stroke: currentColor !important; }
html[data-design="v5"] .contact-tab, html[data-design="v5"] .rank-toggle-btn { border-radius: 22px !important; }
html[data-design="v5"] .contact-tab.active, html[data-design="v5"] .rank-toggle-btn.active { background: #382416 !important; color: #FFEDD7 !important; }

/* 下のナビ: 点線、選んでいる所は点線の下線 */
html[data-design="v5"] .bottom-nav { background: rgba(16, 9, 4, 0.97) !important; border-top: 1px dashed var(--line) !important; }
html[data-design="v5"] .nav-item.active { color: #FFEDD7 !important; }
html[data-design="v5"] .nav-item.active .nav-icon svg { stroke: #FFEDD7 !important; }
html[data-design="v5"] .nav-item.active::before { display: none; }
html[data-design="v5"] .nav-item.active .nav-label-jp { text-decoration: underline dashed; text-underline-offset: 4px; }

html[data-design="v5"] .menu-row { border-bottom: 1px dashed var(--line) !important; }
html[data-design="v5"] .bottom-sheet { border-radius: 12px 12px 0 0 !important; background: #100904 !important; }
html[data-design="v5"] .gate-card { border-radius: 12px !important; }
