* { box-sizing: border-box; }
body {
  margin: 0; color: #263238; background: #FAFAFA;
  font-family: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", Meiryo, sans-serif;
  line-height: 1.7;
}
header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 18px; background: #263238; color: #fff;
}
header a { color: #fff; text-decoration: none; margin-left: 14px; }
.brand { font-weight: 700; margin-left: 0; }
main { max-width: 860px; margin: 0 auto; padding: 18px; overflow-wrap: break-word; }
footer { text-align: center; color: #60747D; font-size: 12px; padding: 24px 0; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.15rem; margin-top: 1.6em; }
.accent { color: var(--accent); }
.note { color: #5B727E; font-size: 0.88rem; }
.dim { color: #60747D; }
.flash {
  max-width: 860px; margin: 10px auto 0; padding: 10px 16px;
  background: #FFF8E1; border-left: 4px solid #F9A825; font-size: 0.92rem;
}
.pill {
  display: inline-block; font-size: 0.75rem; padding: 1px 10px; margin-left: 6px;
  background: #ECEFF1; border-radius: 999px; color: #455A64; vertical-align: middle;
}
.pill.ok { background: #E8F5E9; color: #2E7D32; }
/* 下書き・取消済など「このままではお客様に届かない」状態の名指しに使う。
   既定のグレーのままだと他のメタ情報に埋もれて読み飛ばされる(U2-1) */
.pill.warn { background: #FFF3E0; color: #B9430B; font-weight: 700; }
.btn {
  display: inline-block; border: 0; cursor: pointer; text-decoration: none;
  background: var(--accent); color: #fff; padding: 9px 20px; border-radius: 8px;
  font-size: 0.95rem;
}
.btn.small { padding: 5px 12px; font-size: 0.85rem; }
.btn.danger { background: #C62828; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.card {
  background: #fff; border: 1px solid #E0E0E0; border-top: 4px solid var(--accent);
  border-radius: 10px; padding: 14px 16px; text-decoration: none; color: inherit;
}
.card h2 { margin: 0 0 6px; color: var(--accent); }
table.cal { width: 100%; border-collapse: collapse; background: #fff; }
.cal th, .cal td { border: 1px solid #E0E0E0; vertical-align: top; padding: 4px; }
.cal th { background: #ECEFF1; font-size: 0.8rem; }
.cal th.sun { color: #C62828; } .cal th.sat { color: #1565C0; }
.cal td { height: 74px; width: 14.3%; }
.cal td.other { background: #F5F5F5; color: #B0BEC5; }
.cal td.today .daynum { background: var(--accent); color: #fff; border-radius: 50%; }
.daynum { width: 24px; height: 24px; line-height: 24px; text-align: center; font-size: 0.85rem; }
.slotchip {
  display: block; font-size: 0.72rem; margin-top: 3px; padding: 2px 5px;
  border-radius: 5px; text-decoration: none; line-height: 1.4;
}
/* 狭幅では長い状態文言が3〜4行に折り返し判読困難になるため短縮表示に差し替える(U3-6) */
.slotchip .chip-short { display: none; }
.st-open { background: #E3F2FD; color: #1565C0; }
.st-pending { background: #FFF3E0; color: #BF360C; }
.st-confirmed { background: #E8F5E9; color: #2E7D32; }
.st-cancelled { background: #ECEFF1; color: #546E7A; }
.st { padding: 2px 10px; border-radius: 999px; font-size: 0.8rem; }
.progress-wrap { margin: 18px 0; }
.progress:not(.pill) { height: 18px; background: #ECEFF1; border-radius: 999px; overflow: hidden; }
.progress:not(.pill) .bar { height: 100%; background: var(--accent); transition: width .3s; }
.progress-label { margin: 6px 0 0; }
.progress-label.ok { color: #2E7D32; font-weight: 700; }
table.info, table.list { border-collapse: collapse; background: #fff; width: 100%; }
.info th, .info td, .list th, .list td { border: 1px solid #E0E0E0; padding: 8px 12px; text-align: left; }
.info th { width: 8em; background: #ECEFF1; font-weight: 600; }
.list th { background: #ECEFF1; font-size: 0.85rem; }
.form label { display: block; margin: 12px 0; font-weight: 600; }
.form input, .form select, .form textarea {
  display: block; width: 100%; max-width: 480px; margin-top: 4px; padding: 8px;
  border: 1px solid #B0BEC5; border-radius: 6px; font-size: 1rem; font-family: inherit;
}
.form.narrow { max-width: 480px; }
.form input[type=color] { width: 80px; height: 40px; padding: 2px; }
.svc-block {
  background: #fff; border: 1px solid #E0E0E0; border-left: 5px solid var(--accent);
  border-radius: 10px; padding: 6px 18px 16px; margin: 18px 0;
}
.approve-card {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  flex-wrap: wrap; background: #FFF8E1; border: 1px solid #FFE082;
  border-radius: 8px; padding: 10px 14px; margin: 8px 0;
}
.approve-actions form { display: inline; }
.calnav { display: flex; gap: 8px; }
@media (max-width: 600px) {
  /* 固定高さだと折り返した状態文言が切れるため、内容に追従させる(U3-6) */
  .cal td { height: auto; min-height: 60px; }
  .slotchip { font-size: 0.72rem; }
  .slotchip .chip-full { display: none; }
  .slotchip .chip-short { display: inline; }
  /* U3-3: th 8em固定だと本文列が約11字/行になり縦長の壁になる(/legal・確認画面)。
     法定内容は変えずレイアウトのみ縦積みにする */
  body.legal-page .info th,
  body.legal-page .info td { display: block; width: auto; }
}

/* ---- v2: プラットフォームランディング・テナントカード・管理テーマ ---- */
.landing main { max-width: 1060px; }
.landing section { margin: 34px 0; }
.hero { text-align: center; padding: 40px 18px 24px; }
.hero-label { color: #607D8B; font-size: 0.85rem; letter-spacing: .06em; margin: 0; }
.hero h1 { font-size: 1.9rem; line-height: 1.4; letter-spacing: .02em; margin: 8px 0; }
.hero .sub { color: #455A64; font-size: 1.05rem; margin: 0 0 8px; }
.hero .lead { color: #607D8B; max-width: 680px; margin: 12px auto 20px; text-align: left; }
.hero .btn { background: #37474F; }
.steps { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 700px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.step { background: #fff; border: 1px solid #E0E0E0; border-radius: 10px; padding: 14px 16px; }
.step .num {
  display: inline-flex; width: 36px; height: 36px; border-radius: 50%;
  background: #37474F; color: #fff; align-items: center; justify-content: center;
  font-weight: 700;
}
.step h3 { margin: 8px 0 6px; font-size: 1rem; }
.step p { margin: 0; font-size: 0.92rem; }
.tenant-card { display: flex; flex-direction: column; gap: 6px; }
.tenant-card p { margin: 0; }
.tenant-card .badge-row { margin-top: auto; text-align: right; padding-top: 6px; }
.tenant-head { display: flex; align-items: center; }
.tenant-head h2 { margin: 0; }
.monogram {
  width: 36px; height: 36px; border-radius: 50%; background: var(--accent);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; margin-right: 8px; flex: none;
}
.pill.progress { background: #FFF3E0; color: #BF360C; margin-left: 0; }
.pill.ok { margin-left: 0; }
.small { font-size: 0.82rem; }
.center { text-align: center; }
.card:hover { border-color: #B0BEC5; }
.biz { background: #ECEFF1; border-radius: 10px; padding: 24px 20px; }
.biz .btn.neutral { background: #90A4AE; }
.nowrap { white-space: nowrap; }
form.inline { display: inline; }
/* sysadminテナント一覧: 名前列は広く保ち、操作ボタン群は折り返し可(2行OK) */
.list td.t-name { min-width: 12em; }
.list td.ops { white-space: normal; min-width: 13em; }
.list td.ops .btn { margin: 2px 2px 2px 0; }
/* sysadminテナント一覧: 企画列に幅を譲る。プラン列はセレクト(選択肢の文言が長く
   列幅を支配する)を上限付きで縦積みにし、変更ボタンは下の行へ */
.list td.svcs { min-width: 14em; }
.list td.plan select { display: block; max-width: 14em; margin-bottom: 4px; }
body.admin header { background: #455A64; }
body.sysadmin header { background: #7F1D1D; }
.card-hero {
  width: 100%; height: 140px; object-fit: cover; border-radius: 8px;
  display: block; margin-bottom: 4px;
}
.hero-banner img {
  width: 100%; max-height: 260px; object-fit: cover;
  border-radius: 10px; display: block;
}
.thumb { max-width: 260px; max-height: 120px; border-radius: 6px; vertical-align: middle; }
/* ---- v22: 説明画像ギャラリー(ヒーロー画像直下の横帯)。JSゼロ ----
   スクロールできることを矢印やドットではなく「4枚目の見切れ」で伝える。
   1枚の幅を (帯幅 - 隙間2つ) / 3.3 にしてあるので、3枚ちょうどはスクロールなしで
   収まり、4枚目からは端に約3割が覗く。上限260pxは、980px幅のデスクトップで
   1枚が主役級に育ってヒーロー画像と競合しないための頭打ち。
   スナップは start 揃えの mandatory — 指を離した位置で画像が半端に切れて止まらない */
.gallery-strip {
  display: flex; gap: 10px; margin: 0 0 26px; padding-bottom: 6px;
  overflow-x: auto; scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.gallery-strip::-webkit-scrollbar { height: 6px; }
.gallery-strip::-webkit-scrollbar-thumb { background: #C7D0C9; border-radius: 3px; }
.gallery-item {
  flex: 0 0 auto; width: calc((100% - 20px) / 3.3); max-width: 260px;
  margin: 0; scroll-snap-align: start;
}
.gallery-item img {
  display: block; width: 100%; height: 150px; object-fit: cover;
  border-radius: 6px; border: 1px solid #DCE2DC; background: #F2F2F2;
}
.gallery-item figcaption {
  margin-top: 5px; font-size: .72rem; line-height: 1.45; color: #657168;
}
@media (max-width: 700px) {
  /* 帯の幅は本文どおり。画像の高さだけ下げて、ヒーロー直下で縦を食い過ぎないようにする */
  .gallery-item img { height: 92px; }
}
.inline-label { font-weight: normal; }
.inline-label input { display: inline; width: auto; }
/* 同意チェックのラベル内で複数の同意事項を短い箇条書きに分ける(文言は不変・U3-8) */
.consent-list { margin: 6px 0 0; padding-left: 1.15em; }
.consent-list li + li { margin-top: 5px; }
@media (max-width: 700px) {
  table.list { display: block; overflow-x: auto; }
}

/* ---- v4: 割引バナー・SNS共有・折りたたみリスト・拡張マークダウン ---- */
.tier-banner {
  background: #FFF3E0; border: 1px solid #FFB74D; border-radius: 8px;
  padding: 10px 14px; font-size: 0.95rem;
}
/* 予約フォームの代表者注意。人数で2名以上を選んだときだけ表示する。
   :has() 未対応ブラウザでは常時表示に退行(隠れたままではなく出る方に倒す=安全側) */
.rep-note {
  background: #FFF3E0; border: 1px solid #FFB74D; border-radius: 8px;
  padding: 9px 13px; margin: 6px 0 10px;
  color: #B33F00; font-weight: 600; font-size: 0.93rem;
}
@supports selector(:has(*)) {
  .form:has(select[name="headcount"] option[value="1"]:checked) .rep-note { display: none; }
}
/* 最終確認画面の人数欄に添える同旨の注意(常時表示・小さめ) */
.rep-note-inline { color: #B33F00; font-weight: 600; font-size: 0.88rem; }
/* おトク比較(通常サービス比の総額アピール。人数割引バナーと並置される) */
.deal-banner {
  background: #FCE9EE; border: 1px solid #E58AA0; border-radius: 8px;
  padding: 10px 14px; font-size: 0.95rem;
}
.deal-label { display: inline-block; margin-right: 8px; padding: 2px 8px;
  color: #FFF; background: #C2185B; border-radius: 2px; font-size: .72rem; letter-spacing: .04em; }
.pill.deal { background: #FCE9EE; color: #AD1A50; margin-left: 0; }
.share-box {
  background: #E8F5E9; border: 1px solid #A5D6A7; border-radius: 10px;
  padding: 12px 16px; margin: 16px 0;
}
.share-box h3 { margin: 0 0 8px; font-size: 1rem; }
.map-embed { margin: 10px 0; border-radius: 10px; overflow: hidden; border: 1px solid #ccc; }
.map-embed iframe { display: block; width: 100%; height: 320px; border: 0; }
.share-box .qr { background: #fff; padding: 6px; border-radius: 6px; }
details.slot-list { margin: 14px 0; }
details.slot-list summary {
  cursor: pointer; font-weight: 600; padding: 10px 14px;
  background: #fff; border: 1px solid #E0E0E0; border-radius: 8px;
}
details.slot-list[open] summary { border-radius: 8px 8px 0 0; }
details.slot-list table { border-top: 0; }
.richtext p { margin: 0.5em 0; }
.richtext h3 { font-size: 1.05rem; margin: 1.2em 0 0.3em; color: var(--accent); }
.rt-s { font-size: 0.82rem; }
.rt-l { font-size: 1.25rem; }
.rt-xl { font-size: 1.6rem; font-weight: 700; }

/* ---- v5: 公式デザインテンプレート(店舗綜合ページ用 tpl-*) ----
   body.tpl-* は base.html の背景色インライン指定より詳細度が高く、テンプレ配色が優先される */
body.tpl-noir { background: #1A1C20; color: #ECEFF1; }
body.tpl-noir .card, body.tpl-noir .svc-block { background: #24262C; border-color: #3A3D45; color: #ECEFF1; }
body.tpl-noir .card h2 { color: #fff; }
body.tpl-noir h1.accent { color: #fff; border-bottom: 2px solid var(--accent); padding-bottom: 6px; }
body.tpl-noir .note, body.tpl-noir .dim { color: #90A4AE; }
body.tpl-washi { background: #F6F1E7; }
body.tpl-washi h1.accent, body.tpl-washi .card h2 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif; }
body.tpl-washi .card { border-radius: 0; border: 1px solid #D9CFBB; border-left: 4px solid var(--accent); background: #FFFDF7; }
body.tpl-pop { background: #FFF8E1; }
body.tpl-pop .card { border-radius: 22px; border-top-width: 6px; }
body.tpl-pop .pill { border-radius: 999px; }
body.tpl-pop h1.accent { letter-spacing: .05em; }
body.tpl-mint { background: #E6F4F1; }
body.tpl-mint .card { border-radius: 14px; border: 1px solid #B2DFDB; border-top: 4px solid var(--accent); background: #FCFFFE; }
body.tpl-sunset { background: linear-gradient(165deg, #FFF3E0 0%, #FFE0B2 55%, #FFCCBC 100%) fixed; }
body.tpl-sunset .card { background: rgba(255,255,255,.93); }
body.tpl-ocean { background: linear-gradient(180deg, #E1F5FE, #B3E5FC) fixed; }
body.tpl-ocean .card { border-radius: 12px; border-top: 4px solid #0277BD; background: rgba(255,255,255,.95); }
body.tpl-forest { background: #EDF3EA; }
body.tpl-forest .card { border-top-color: #2E7D32; background: #FBFDF9; border-radius: 12px; }
body.tpl-mono { background: #fff; }
body.tpl-mono .card { border: 2px solid #263238; border-radius: 0; border-top-width: 2px; }
body.tpl-mono h1.accent { color: #111; border-bottom: 3px solid #111; padding-bottom: 6px; }
body.tpl-mono .pill { background: #fff; border: 1px solid #263238; color: #263238; }
body.tpl-luxe { background: #FAF7F0; }
body.tpl-luxe h1.accent, body.tpl-luxe .card h2 { font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", serif; }
body.tpl-luxe h1.accent { color: #8D6E13; }
body.tpl-luxe .card { border: 1px solid #D8C690; border-top: 4px solid #B8962E; background: #FFFEFA; }

/* ---- v5: 公式デザインテンプレート(トップのカード用 card-tpl-*) ---- */
.card-tpl-ribbon { position: relative; overflow: hidden; }
.card-tpl-ribbon::after {
  content: '注目'; position: absolute; top: 12px; right: -28px; transform: rotate(45deg);
  background: var(--accent); color: #fff; padding: 2px 32px; font-size: .72rem;
}
.card-tpl-ticket { border: 2px dashed #90A4AE; border-radius: 14px; background: #FFFDF5; }
.card-tpl-photo { padding: 0; overflow: hidden; }
.card-tpl-photo .card-hero { border-radius: 6px 6px 0 0; height: 170px; margin-bottom: 0; }
.card-tpl-photo .tenant-head, .card-tpl-photo p { padding: 0 16px; }
.card-tpl-photo .tenant-head { padding-top: 10px; }
.card-tpl-photo .badge-row { padding: 0 16px 14px; }
.card-tpl-minimal { border: 1px solid #CFD8DC; border-top-width: 1px; background: transparent; }
.card-tpl-gradient { background: linear-gradient(145deg, #ffffff, #ECEFF1); border-top: 4px solid var(--accent); }
.card-tpl-night { background: #263238; color: #ECEFF1; border-color: #37474F; }
.card-tpl-night h2 { color: #fff; }
.card-tpl-night .dim, .card-tpl-night .note { color: #B0BEC5; }
.card-tpl-stamp .tenant-head h2 {
  display: inline-block; border: 2px solid var(--accent); border-radius: 8px;
  padding: 1px 10px; transform: rotate(-2deg);
}
.card-tpl-magazine { border-radius: 0; border: 1px solid #263238; border-top: 8px solid #263238; }
.card-tpl-magazine h2 { letter-spacing: .06em; }
.card-tpl-frame { outline: 1px solid var(--accent); outline-offset: -8px; padding: 22px 24px; }

/* ---- v6: 検索・タグ・マイページ ---- */
.searchbar { display: flex; gap: 8px; margin: 12px 0; max-width: 560px; }
.searchbar input {
  flex: 1; padding: 9px 12px; border: 1px solid #B0BEC5; border-radius: 8px;
  font-size: 1rem; font-family: inherit;
}
.tag {
  display: inline-block; font-size: 0.8rem; padding: 2px 10px; margin: 2px 4px 2px 0;
  background: #ECEFF1; border-radius: 999px; color: #455A64; text-decoration: none;
}
a.tag:hover { background: #CFD8DC; }
.tag.on { background: var(--accent); color: #fff; }
.tagcloud { margin: 8px 0; }
.inline-label.small { font-size: 0.8rem; font-weight: normal; }
.account-book {
  background: #E8F5E9; border: 1px solid #A5D6A7; border-radius: 8px;
  padding: 10px 14px; margin: 12px 0; font-size: 0.92rem;
}

/* ---- v7: あつまる予約 ランディングページ ---- */
body.landing {
  --landing-ink: #102a43;
  --landing-green: #285c35;
  --landing-green-dark: #1d4728;
  --landing-orange: #e45b16;
  --landing-cream: #f8f4e9;
  --landing-line: #dcd6c8;
  color: var(--landing-ink);
  background:
    radial-gradient(circle at 8% 12%, rgba(228, 91, 22, .06), transparent 23rem),
    radial-gradient(circle at 92% 4%, rgba(40, 92, 53, .08), transparent 28rem),
    #f8f5ec;
}
body.landing > header {
  width: 100%; padding: 14px max(4vw, 24px); color: var(--landing-ink);
  background: rgba(250, 248, 241, .98); border-bottom: 1px solid rgba(16, 42, 67, .1);
}
body.landing > header a { color: var(--landing-ink); }
body.landing > header .brand {
  position: relative; display: inline-flex; align-items: center; min-height: 38px;
  margin-left: 0; padding-left: 38px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1.18rem; font-weight: 700; letter-spacing: .08em;
}
body.landing > header .brand::before {
  content: ""; position: absolute; left: 0; width: 22px; height: 22px; border-radius: 50%;
  background: var(--landing-orange); border: 2px solid var(--landing-orange);
  box-shadow: inset 0 0 0 5px #faf8f1;
}
body.landing > header nav { display: flex; align-items: center; gap: 8px; }
body.landing > header nav a {
  margin-left: 0; padding: 7px 10px; font-size: .88rem; font-weight: 600;
  border-radius: 7px;
}
body.landing > header nav a:last-child {
  margin-left: 8px; padding-inline: 15px; border: 1px solid var(--landing-green);
}
.landing main { max-width: 1180px; margin: 0 auto; padding: 28px 24px 0; }
.landing section { margin: 0; }
.landing h1, .landing h2, .landing h3 { color: var(--landing-ink); }
.sr-only {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}

.landing-hero {
  display: grid; grid-template-columns: minmax(360px, .86fr) minmax(520px, 1.14fr);
  min-height: 560px; overflow: hidden; background: rgba(255, 253, 247, .82);
  border: 1px solid rgba(16, 42, 67, .11); border-radius: 4px 24px 24px 4px;
  box-shadow: 0 20px 55px rgba(34, 49, 34, .09);
}
.hero-copy {
  position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center;
  padding: 54px 38px 52px; background:
    radial-gradient(circle at 4% 78%, rgba(228, 91, 22, .08), transparent 11rem),
    linear-gradient(110deg, #fcfaf3 0%, #fcfaf3 91%, rgba(252, 250, 243, .7) 100%);
}
.hero-copy::after {
  display: none;
}
.hero-kicker, .section-kicker {
  margin: 0 0 12px; color: var(--landing-orange); font-size: 1rem; font-weight: 800;
  letter-spacing: .08em;
}
.hero-kicker { margin-bottom: 14px; letter-spacing: .09em; }
.landing p,
.landing h1,
.landing h2,
.landing h3,
body.public-page p,
body.public-page h1,
body.public-page h2,
body.public-page h3 {
  line-break: strict;
}
.landing p,
body.public-page p { text-wrap: pretty; }
@supports (word-break: auto-phrase) {
  .landing p,
  .landing h1,
  .landing h2,
  .landing h3,
  body.public-page p,
  body.public-page h1,
  body.public-page h2,
  body.public-page h3 {
    word-break: auto-phrase;
  }
}
.hero-copy h1 {
  margin: 0 0 20px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(3rem, 4.2vw, 3.9rem); font-weight: 600; line-height: 1.25;
  letter-spacing: .025em;
}
.hero-copy h1 span { display: block; white-space: nowrap; }
.hero-bridge {
  margin: 0 0 14px; color: var(--landing-green); font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1.08rem; font-weight: 700; line-height: 1.8; letter-spacing: .03em;
}
.hero-lead { margin: 0; max-width: 35rem; color: #425466; font-size: .91rem; line-height: 1.9; }
.hero-lead > span,
.section-heading > p:last-child > span { display: block; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 25px; }
.landing .hero-cta {
  display: inline-flex; align-items: center; gap: 10px; padding: 13px 21px;
  background: var(--landing-green); border-radius: 6px; font-weight: 700; letter-spacing: .03em;
  box-shadow: 0 5px 12px rgba(40, 92, 53, .14);
}
.landing .hero-cta:hover { background: var(--landing-green-dark); }
.search-glyph {
  position: relative; display: inline-block; flex: none; width: 15px; height: 15px;
  border: 2px solid currentColor; border-radius: 50%;
}
.search-glyph::after {
  content: ""; position: absolute; right: -5px; bottom: -3px; width: 7px; height: 2px;
  background: currentColor; transform: rotate(45deg); transform-origin: left center;
}
.hero-assurance { color: var(--landing-green-dark); font-size: .78rem; font-weight: 700; }
.hero-assurance::before {
  content: "✓"; display: inline-grid; place-items: center; width: 22px; height: 22px;
  margin-right: 6px; color: #fff; background: var(--landing-green); border-radius: 50%;
}
.hero-media { position: relative; min-width: 0; overflow: hidden; background: #dfe8d3; }
.hero-media > img { width: 100%; height: 100%; min-height: 560px; object-fit: cover; object-position: 52% center; display: block; }
.hero-media::after {
  content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 37, 24, .04), transparent 30%, rgba(0, 0, 0, .03));
  pointer-events: none;
}
.hero-status {
  position: absolute; z-index: 2; left: 26px; right: 26px; bottom: 25px;
  display: grid; grid-template-columns: 1.06fr .94fr; background: rgba(255, 255, 252, .96);
  border: 1px solid rgba(16, 42, 67, .14); border-radius: 7px;
  box-shadow: 0 10px 24px rgba(14, 32, 25, .17); overflow: hidden;
}
.status-progress { position: relative; padding: 18px 22px 17px; border-right: 1px solid var(--landing-line); }
.status-example {
  position: absolute; top: 12px; right: 14px; color: #66766b; font-size: .62rem;
  font-weight: 700; letter-spacing: .08em;
}
.status-count { display: flex; align-items: baseline; gap: 7px; margin: 0 0 8px; color: #23323d; }
.status-count span { margin-right: 3px; font-size: .82rem; font-weight: 700; }
.status-count strong { color: var(--landing-ink); font-size: 2.2rem; line-height: 1; }
.demo-progress { width: calc(100% - 30px); height: 8px; margin: 7px 0 10px; background: #e5e5df; border-radius: 99px; overflow: hidden; }
.demo-progress span { display: block; width: 60%; height: 100%; background: linear-gradient(90deg, #167a74, #285c35); border-radius: inherit; }
.status-to-go { margin: 0; color: var(--landing-orange); font-size: .84rem; font-weight: 800; }
.status-to-go::before { content: "● ● ●"; margin-right: 7px; font-size: .58rem; letter-spacing: -1px; }
.status-benefits { display: grid; align-content: center; padding: 12px 18px; }
.status-benefits p { position: relative; margin: 0; padding: 8px 0 8px 27px; }
.status-benefits p + p { border-top: 1px solid #e7e4da; }
.status-benefits p::before {
  content: "✓"; position: absolute; left: 0; top: 9px; display: grid; place-items: center;
  width: 19px; height: 19px; color: #fff; background: var(--landing-green); border-radius: 50%; font-size: .68rem;
}
.status-benefits strong, .status-benefits span { display: block; }
.status-benefits strong { font-size: .72rem; }
.status-benefits span { margin-top: 2px; color: #68756e; font-size: .62rem; }

.audience-benefits {
  position: relative; z-index: 3; display: grid; grid-template-columns: 1fr 1fr; margin: -1px 28px 0 !important;
  background: #fffefa; border: 1px solid var(--landing-line); border-radius: 0 0 4px 4px;
  box-shadow: 0 8px 18px rgba(38, 49, 42, .06);
}
.audience-benefits article { display: grid; grid-template-columns: 56px 1fr; gap: 17px; align-items: center; padding: 24px 28px; }
.audience-benefits article + article { border-left: 1px solid var(--landing-line); }
.benefit-icon {
  display: grid; place-items: center; width: 54px; height: 54px; color: var(--landing-green);
  background: transparent; border: 1px solid #c8d5c6; border-radius: 50%;
}
.benefit-icon svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.benefit-label { margin: 0 0 2px; color: var(--landing-green); font-size: .75rem; font-weight: 800; letter-spacing: .08em; }
.audience-benefits h3 { margin: 0 0 3px; font-size: .98rem; line-height: 1.45; }
.audience-benefits article div > p:last-child { margin: 0; color: #68756e; font-size: .75rem; line-height: 1.55; }
.industry-band { padding: 34px 12px 44px; text-align: center; }
.industry-band p { margin: 0 0 12px; color: #485a4d; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-weight: 700; }
.industry-band div { display: flex; justify-content: center; flex-wrap: wrap; gap: 0; }
.industry-band span { padding: 2px 14px; color: var(--landing-green); border-left: 1px solid #b9c9b9; font-size: .74rem; font-weight: 700; }
.industry-band span:last-child { border-right: 1px solid #b9c9b9; }

.experience-section { padding: 62px 52px 56px; background: #fffefa; border-block: 1px solid rgba(16, 42, 67, .14); }
.section-heading { max-width: 650px; margin-bottom: 26px; }
.section-heading.centered { margin-inline: auto; text-align: center; }
.section-heading h2 { margin: 0 0 8px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(1.7rem, 3vw, 2.3rem); letter-spacing: .04em; }
.section-heading > p:last-child { margin: 0; color: #62717b; font-size: .9rem; }
.landing .landing-search { position: relative; display: grid; grid-template-columns: 1fr auto; max-width: none; margin: 0 0 11px; }
.landing .landing-search::before {
  content: ""; position: absolute; z-index: 1; left: 16px; top: 14px; width: 12px; height: 12px;
  border: 2px solid var(--landing-ink); border-radius: 50%;
}
.landing .landing-search::after {
  content: ""; position: absolute; z-index: 1; left: 28px; top: 27px; width: 7px; height: 2px;
  background: var(--landing-ink); transform: rotate(45deg); transform-origin: left center;
}
.landing .landing-search input { min-width: 0; padding: 13px 16px 13px 46px; border-color: #b9c2be; border-radius: 6px; background: linear-gradient(90deg, transparent 0 43px, #e3e7e1 43px 44px, transparent 44px), #fff; }
.landing .landing-search button { min-width: 130px; background: var(--landing-green); border-radius: 6px; font-weight: 700; }
.experience-section .tagcloud { margin: 0 0 25px; }
.experience-section .tag { background: #f0f3ec; border: 1px solid #d6dfd2; color: var(--landing-green); }
.landing-cards { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 18px; }
.landing .landing-cards .tenant-card {
  position: relative; display: flex; min-width: 0; overflow: hidden; padding: 0 0 45px;
  background: #fff; border: 1px solid #dfe2dc; border-top-width: 1px; border-radius: 4px;
  box-shadow: none; transition: border-color .2s ease;
}
.landing .landing-cards .tenant-card:hover { border-color: #8ba18e; }
.landing .landing-cards .card-hero { width: 100%; height: 190px; margin: 0; border-radius: 0; object-fit: cover; }
.tenant-card-body { display: flex; flex: 1; flex-direction: column; gap: 7px; padding: 16px 18px 13px; }
.card-overline { color: var(--landing-green) !important; font-size: .66rem; font-weight: 800; letter-spacing: .09em; }
.landing .landing-cards .tenant-head, .landing .landing-cards .tenant-card p { padding-inline: 0; }
.landing .landing-cards .tenant-head { padding-top: 0; }
.landing .landing-cards .tenant-head h2 { color: var(--landing-ink); font-size: 1.15rem; line-height: 1.45; }
.tenant-copy { min-height: 2.8em; color: #53616a; font-size: .82rem; line-height: 1.6; }
.next-slot { padding-top: 8px !important; color: #364852; font-size: .76rem; line-height: 1.65; border-top: 1px solid #edf0eb; }
.next-slot span { margin-right: 8px; color: var(--landing-green); font-weight: 800; }
.landing .landing-cards .badge-row { margin-top: auto; padding: 3px 0 0; text-align: left; }
.landing .landing-cards .pill.progress { color: #B9430B; background: #FFF6ED; border: 1px solid #E68D5D; }
.landing .landing-cards .pill.ok { border: 1px solid #96c39d; }
.card-link {
  position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between;
  padding: 10px 18px; color: var(--landing-green); background: #f5f7f1; border-top: 1px solid #e4e8e0;
  font-size: .73rem; font-weight: 800;
}
.empty-note { padding: 30px; background: #f5f7f1; border-radius: 8px; text-align: center; }

.steps-wrap { padding: 82px 28px; }
.landing .landing-steps { grid-template-columns: repeat(3, 1fr); gap: 0; border-block: 1px solid #cdd6cb; }
.landing .landing-steps .step { position: relative; padding: 30px 28px 32px; border: 0; border-radius: 0; background: transparent; }
.landing .landing-steps .step + .step { border-left: 1px solid #cdd6cb; }
.landing .landing-steps .step::after { display: none; }
.landing .landing-steps .num {
  display: block; width: auto; height: auto; margin-bottom: 14px; color: var(--landing-orange);
  background: transparent; font-family: Georgia, serif; font-size: 1.8rem; line-height: 1;
}
.landing .landing-steps h3 { margin: 0 0 9px; font-size: 1.02rem; }
.landing .landing-steps .step > p:last-child { color: #56675d; font-size: .82rem; line-height: 1.75; }

.trust-wrap { margin-bottom: 76px !important; padding: 58px 52px 48px; background: var(--landing-ink); border-radius: 4px; color: #edf3f0; }
.trust-wrap .section-kicker { color: #f0a271; }
.trust-wrap .section-heading h2 { color: #fff; }
.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255,255,255,.18); }
.trust-grid article { padding: 26px 25px; background: var(--landing-ink); }
.trust-grid article > span { color: #f0a271; font-family: Georgia, serif; font-size: 1.3rem; }
.trust-grid h3 { margin: 8px 0 6px; color: #fff; font-size: .97rem; }
.trust-grid p { margin: 0; color: #c5d2ce; font-size: .8rem; line-height: 1.7; }
.trust-wrap .note { margin: 26px auto 0; max-width: 760px; color: #aebdb8; font-size: .72rem; }

.landing .biz {
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; margin-bottom: 48px;
  padding: 64px 58px; color: #24382a; background: #e6ecdf;
  border: 1px solid #cad5c6; border-left: 5px solid var(--landing-green); border-radius: 3px;
}
.biz-copy h2 { margin: 0 0 19px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(1.9rem, 3.5vw, 2.75rem); line-height: 1.42; }
.biz-copy > p:not(.section-kicker) { margin: 0 0 12px; color: #4c5f51; font-size: .9rem; }
.landing .biz .btn.neutral { margin-top: 10px; color: #fff; background: var(--landing-green); }
.biz-points { display: grid; align-content: center; gap: 12px; }
.biz-points p {
  display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 13px; align-items: center;
  margin: 0; padding: 12px 16px; background: rgba(255,255,255,.68);
  border-left: 3px solid var(--landing-orange);
}
.biz-point-icon { display: block; width: 48px; height: 48px; object-fit: contain; }
.biz-points .biz-point-copy { min-width: 0; }
.biz-points strong, .biz-points span { display: block; }
.biz-points strong { font-size: .88rem; }
.biz-points span { color: #647166; font-size: .73rem; }
.legal-note { margin: 0 0 50px; }
.legal-note a { color: var(--landing-green); font-weight: 700; }
body.landing > footer { padding: 30px 20px; color: #84918c; background: #102a43; }

@media (max-width: 900px) {
  .landing-hero { grid-template-columns: 1fr; border-radius: 12px; }
  .hero-copy { padding: 50px 46px 44px; }
  .hero-media > img { min-height: 520px; }
  .hero-status { max-width: 620px; margin-inline: auto; }
  .audience-benefits { margin-inline: 16px !important; }
  .experience-section { padding: 52px 34px; }
  .landing .biz { gap: 32px; padding: 52px 40px; }
}

@media (max-width: 700px) {
  body.landing > header { padding: 10px 16px; }
  body.landing > header .brand { padding-left: 31px; font-size: 1rem; letter-spacing: .04em; }
  body.landing > header .brand::before { width: 20px; height: 20px; }
  body.landing > header nav { gap: 0; }
  body.landing > header nav a { padding: 6px 7px; font-size: .76rem; }
  body.landing > header nav a:last-child { display: none; }
  .landing main { padding: 16px 12px 0; }
  .hero-copy { padding: 40px 26px 36px; }
  .hero-copy h1 { font-size: clamp(2.35rem, 10.5vw, 3rem); }
  .hero-copy h1 span { white-space: nowrap; }
  .hero-bridge br { display: none; }
  .hero-media > img { min-height: 460px; object-position: 57% center; }
  .hero-status { left: 12px; right: 12px; bottom: 12px; grid-template-columns: 1fr; }
  .status-progress { padding: 14px 18px 12px; border-right: 0; }
  .status-count strong { font-size: 1.8rem; }
  .status-benefits { grid-template-columns: 1fr 1fr; padding: 0 14px 9px; border-top: 1px solid var(--landing-line); }
  .status-benefits p + p { border-top: 0; border-left: 1px solid #e7e4da; padding-left: 34px; }
  .status-benefits p + p::before { left: 7px; }
  .audience-benefits { grid-template-columns: 1fr; margin-inline: 7px !important; }
  .audience-benefits article { padding: 20px 18px; }
  .audience-benefits article + article { border-left: 0; border-top: 1px solid var(--landing-line); }
  .industry-band { padding: 30px 10px 38px; }
  .experience-section { padding: 42px 18px; }
  .landing .landing-search { grid-template-columns: 1fr; }
  .landing .landing-search button { width: 100%; }
  .landing-cards { grid-template-columns: 1fr; }
  .landing .landing-steps { grid-template-columns: 1fr; }
  .landing .landing-steps .step + .step { border-left: 0; border-top: 1px solid #cdd6cb; }
  .steps-wrap { padding: 65px 12px; }
  .trust-wrap { padding: 48px 20px 38px; border-radius: 4px; }
  .trust-grid { grid-template-columns: 1fr; }
  .landing .biz { grid-template-columns: 1fr; padding: 46px 24px; border-radius: 3px; }
}

@media (max-width: 430px) {
  body.landing > header nav a:first-child { display: none; }
  .hero-copy { padding-inline: 21px; }
  .hero-copy h1 { letter-spacing: .01em; }
  .hero-bridge { font-size: .98rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-media > img { min-height: 490px; }
  .status-benefits strong { font-size: .72rem; }
  .status-benefits span { font-size: .66rem; }
  .audience-benefits article { grid-template-columns: 46px 1fr; gap: 12px; }
  .benefit-icon { width: 44px; height: 44px; }
  .benefit-icon svg { width: 27px; height: 27px; }
}

/* ---- v8: 公開下層ページ・公式プリセット・管理コンソール ---- */
body.public-page {
  --page-ink: #102A43;
  --page-green: #285C35;
  --page-orange: #E45B16;
  --page-paper: #FFFEFA;
  --page-line: #D8DDD5;
  color: var(--page-ink);
  background-image:
    linear-gradient(rgba(40, 92, 53, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(40, 92, 53, .018) 1px, transparent 1px);
  background-size: 32px 32px;
}
body.public-page > header {
  padding: 14px max(4vw, 24px); color: var(--page-ink);
  background: rgba(250, 248, 241, .97); border-bottom: 1px solid rgba(16, 42, 67, .12);
}
body.public-page > header a { color: var(--page-ink); }
body.public-page > header .brand {
  position: relative; display: inline-flex; align-items: center; min-height: 36px;
  margin-left: 0; padding-left: 38px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1.12rem; letter-spacing: .07em;
}
body.public-page > header .brand::before {
  content: ""; position: absolute; left: 0; width: 21px; height: 21px;
  background: var(--page-orange); border: 2px solid var(--page-orange); border-radius: 50%;
  box-shadow: inset 0 0 0 5px #FAF8F1;
}
body.public-page > header nav { display: flex; align-items: center; gap: 4px; }
body.public-page > header nav a {
  margin: 0; padding: 7px 10px; border-radius: 4px; font-size: .84rem; font-weight: 600;
}
body.public-page > header nav a:hover { background: rgba(40, 92, 53, .08); }
body.public-page > main {
  max-width: 980px; margin: 30px auto 54px; padding: 42px 46px 50px;
  background: rgba(255, 254, 250, .95); border: 1px solid rgba(16, 42, 67, .12);
  border-radius: 5px; box-shadow: 0 16px 45px rgba(30, 45, 36, .08);
}
body.public-page > footer {
  padding: 30px 20px; color: #9AA8A3; background: #102A43;
}
body.public-page > footer a { color: #E4ECE8; }
body.public-page h1 {
  margin: .25em 0 .7em; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.8rem, 4vw, 2.45rem); font-weight: 600; line-height: 1.35;
  letter-spacing: .035em;
}
body.public-page h1.accent { color: var(--accent); }
body.public-page h2 {
  margin: 2.2em 0 .9em; padding-bottom: .45em; font-size: 1.18rem;
  border-bottom: 1px solid var(--page-line);
}
body.public-page h3 { color: var(--page-ink); }
body.public-page main > p:first-child { margin-top: 0; }
body.public-page main > p:first-child > a {
  color: #68786F; font-size: .8rem; font-weight: 700; text-decoration: none;
}
body.public-page main > p:first-child > a:hover { color: var(--accent); }
body.public-page .hero-banner { margin: -42px -46px 30px; }
body.public-page .hero-banner img {
  width: 100%; max-height: 360px; border-radius: 4px 4px 0 0;
  object-fit: cover; object-position: center;
}
body.public-page .cards { gap: 20px; }
body.public-page .card {
  padding: 18px 20px; border: 1px solid #DCE2DC; border-top: 3px solid var(--accent);
  border-radius: 5px; box-shadow: 0 6px 18px rgba(25, 45, 32, .055);
  transition: border-color .18s ease, transform .18s ease;
}
body.public-page .card:hover { border-color: var(--accent); transform: translateY(-2px); }
body.public-page .card-hero { height: 180px; margin: -18px -20px 12px; width: calc(100% + 40px); border-radius: 3px 3px 0 0; }
body.public-page .tenant-card .badge-row { text-align: left; }
body.public-page .tag { color: #355744; background: #EFF3ED; border: 1px solid #D5DED2; }
body.public-page .btn {
  padding: 10px 19px; border-radius: 4px; font-weight: 700;
  box-shadow: 0 4px 10px rgba(30, 50, 35, .1);
}
body.public-page .btn:hover { filter: brightness(.94); }
body.public-page .searchbar { max-width: 680px; }
body.public-page .searchbar input {
  padding: 11px 13px; background: #fff; border-color: #ABB8B1; border-radius: 4px;
}
body.public-page table.info,
body.public-page table.list {
  border-collapse: separate; border-spacing: 0; overflow: hidden;
  border: 1px solid #D9E0DA; border-radius: 4px; box-shadow: 0 4px 14px rgba(25, 45, 32, .04);
}
body.public-page .info th,
body.public-page .info td,
body.public-page .list th,
body.public-page .list td {
  padding: 11px 13px; border: 0; border-bottom: 1px solid #E4E9E4;
}
body.public-page .info tr:last-child > *,
body.public-page .list tr:last-child > * { border-bottom: 0; }
body.public-page .info th,
body.public-page .list th { background: #EEF2ED; color: #35463C; }
body.public-page .list tr:nth-child(even) td { background: rgba(239, 243, 237, .45); }
body.public-page .form.narrow,
body.slot-page .form {
  max-width: 620px; padding: 24px 28px 28px; background: #FAFBF8;
  border: 1px solid #D9E0DA; border-left: 4px solid var(--accent); border-radius: 4px;
}
body.public-page .form label { margin: 16px 0; color: #283B30; font-size: .88rem; }
body.public-page .form input,
body.public-page .form select,
body.public-page .form textarea {
  max-width: none; padding: 10px 11px; background: #fff; border-color: #AAB7AF;
  border-radius: 3px;
}
body.public-page .form input:focus,
body.public-page .form select:focus,
body.public-page .form textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 28%, transparent);
  outline-offset: 1px; border-color: var(--accent);
}
body.public-page .svc-block {
  padding: 16px 22px 20px; background: #FBFCF9; border-color: #DCE2DC;
  border-left-color: var(--accent); border-radius: 4px;
}
body.public-page .progress:not(.pill) { height: 12px; background: #E3E8E3; }
body.public-page .progress:not(.pill) .bar { background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 68%, #fff)); }
body.public-page .tier-banner,
body.public-page .deal-banner,
body.public-page .share-box,
body.public-page .account-book { border-radius: 3px; }
body.public-page .tier-banner { color: #62330E; background: #FFF4E8; border-color: #E9A46C; }
body.public-page .deal-banner { color: #6E1732; background: #FBEDF1; border-color: #DB8FA3; }
body.public-page .share-box { color: #24442F; background: #EFF6EE; border-color: #B8D0B7; }
body.public-page details.slot-list summary {
  padding: 13px 16px; background: #F8FAF6; border-color: #D7DED7; border-radius: 4px;
}
body.public-page details.slot-list[open] summary { border-radius: 4px 4px 0 0; }
body.public-page .richtext { color: #3C4C43; }
body.public-page .richtext h3 { margin-top: 1.6em; }
body.calendar-page > main { max-width: 1120px; }
body.calendar-page table.cal {
  border-collapse: separate; border-spacing: 0; overflow: hidden;
  border: 1px solid #D5DDD6; border-radius: 4px; box-shadow: 0 8px 24px rgba(25, 45, 32, .055);
}
body.calendar-page .cal th { padding: 9px 5px; color: #405047; background: #EDF1EC; border-color: #D5DDD6; }
body.calendar-page .cal td { height: 96px; padding: 7px; background: #fff; border-color: #E0E5E0; }
body.calendar-page .cal td.other { background: #F4F5F2; }
body.calendar-page .slotchip { padding: 4px 6px; border-radius: 3px; }
body.slot-page .progress-wrap {
  padding: 18px 20px; background: #F6F8F4; border: 1px solid #DBE2DA; border-radius: 4px;
}
body.public-page.slot-page .info .slot-datetime-row > th,
body.public-page.slot-page .info .slot-datetime-row > td {
  background: #F3F6F1;
  background: color-mix(in srgb, var(--accent) 9%, #FFF);
  font-size: 1.03rem; font-weight: 700; line-height: 1.65;
}
body.public-page.slot-page .info .slot-datetime-row > th {
  padding-left: 17px; box-shadow: inset 4px 0 0 var(--accent);
}
body.slot-page .share-box { display: grid; grid-template-columns: 1fr auto; gap: 8px 24px; align-items: center; }
body.slot-page .share-box h3 { grid-column: 1 / -1; }
body.slot-page .share-box p { margin: 3px 0; }
body.legal-page > main,
body.reservation-page > main { max-width: 880px; }

/* テナントプリセットの共通トークン。standardはサービス個別の背景色を維持する。 */
body.tpl-standard {
  --tpl-surface: rgba(255, 254, 250, .96); --tpl-alt: #EFF3ED; --tpl-line: #D7DED7;
  --tpl-text: #102A43; --tpl-muted: #68786F; --tpl-header: #FAF8F1; --tpl-header-text: #102A43;
  --tpl-radius: 5px; --tpl-shadow: 0 16px 45px rgba(30, 45, 36, .08);
}
body.tpl-noir {
  --tpl-surface: #1B2025; --tpl-alt: #242A30; --tpl-line: #363D44;
  --tpl-text: #EDF0F2; --tpl-muted: #AAB3BA; --tpl-header: #0B0E10; --tpl-header-text: #F7F8F8;
  --tpl-radius: 2px; --tpl-shadow: 0 18px 46px rgba(0, 0, 0, .3);
  background: #111417;
}
body.tpl-washi {
  --tpl-surface: rgba(255, 252, 244, .96); --tpl-alt: #EEE5D5; --tpl-line: #CDBFA8;
  --tpl-text: #302C27; --tpl-muted: #756B5D; --tpl-header: #EFE5D5; --tpl-header-text: #302C27;
  --tpl-radius: 0; --tpl-shadow: 0 12px 34px rgba(72, 58, 38, .09);
  background:
    repeating-linear-gradient(7deg, rgba(94, 75, 48, .025) 0 1px, transparent 1px 7px),
    #F4EFE4;
}
body.tpl-pop {
  --tpl-surface: #FFFEFA; --tpl-alt: #FFF0B0; --tpl-line: #33434B;
  --tpl-text: #25343B; --tpl-muted: #617078; --tpl-header: #FFED8A; --tpl-header-text: #25343B;
  --tpl-radius: 17px; --tpl-shadow: 5px 5px 0 rgba(37, 52, 59, .18);
  background: #FFF5D2;
}
body.tpl-mint {
  --tpl-surface: rgba(253, 255, 254, .97); --tpl-alt: #DDF2EC; --tpl-line: #A9CEC3;
  --tpl-text: #173D38; --tpl-muted: #5C7772; --tpl-header: #D6EEE7; --tpl-header-text: #173D38;
  --tpl-radius: 10px; --tpl-shadow: 0 18px 44px rgba(31, 92, 79, .11);
  background: linear-gradient(150deg, #E6F4F1, #D6ECE7) fixed;
}
body.tpl-sunset {
  --tpl-surface: rgba(255, 252, 247, .95); --tpl-alt: #FBE0C9; --tpl-line: #DDAE8D;
  --tpl-text: #4B3027; --tpl-muted: #80675E; --tpl-header: #7D4035; --tpl-header-text: #FFF8F0;
  --tpl-radius: 8px; --tpl-shadow: 0 20px 48px rgba(112, 52, 35, .16);
  background: linear-gradient(155deg, #FFF1DE 0%, #F7C9AA 55%, #D98F82 100%) fixed;
}
body.tpl-ocean {
  --tpl-surface: rgba(250, 254, 255, .96); --tpl-alt: #DDF1F7; --tpl-line: #A9CEDA;
  --tpl-text: #153846; --tpl-muted: #5D7883; --tpl-header: #0D5069; --tpl-header-text: #F4FCFF;
  --tpl-radius: 6px; --tpl-shadow: 0 18px 46px rgba(15, 77, 98, .15);
  background: linear-gradient(180deg, #E8F7FB, #C5E6F0) fixed;
}
body.tpl-forest {
  --tpl-surface: rgba(252, 253, 249, .96); --tpl-alt: #E4EBDD; --tpl-line: #B7C5AD;
  --tpl-text: #223925; --tpl-muted: #637364; --tpl-header: #243F2A; --tpl-header-text: #F6FAF4;
  --tpl-radius: 5px; --tpl-shadow: 0 18px 45px rgba(34, 63, 40, .14);
  background:
    radial-gradient(circle at 8% 12%, rgba(45, 91, 53, .12), transparent 25rem),
    #E8EFE3;
}
body.tpl-mono {
  --tpl-surface: #FFF; --tpl-alt: #F2F2F2; --tpl-line: #1F2529;
  --tpl-text: #111; --tpl-muted: #606060; --tpl-header: #111; --tpl-header-text: #FFF;
  --tpl-radius: 0; --tpl-shadow: none;
  background: #FFF;
}
body.tpl-luxe {
  --tpl-surface: rgba(255, 253, 247, .97); --tpl-alt: #F1E8D2; --tpl-line: #BCA66D;
  --tpl-text: #352F25; --tpl-muted: #776D5B; --tpl-header: #28251F; --tpl-header-text: #F6EBD0;
  --tpl-radius: 2px; --tpl-shadow: 0 20px 50px rgba(62, 50, 25, .15);
  background: linear-gradient(140deg, #F7F1E5, #E9DEC7) fixed;
}
body.public-page[class*="tpl-"] { color: var(--tpl-text); }
body.public-page[class*="tpl-"] > header { color: var(--tpl-header-text); background: var(--tpl-header); }
body.public-page[class*="tpl-"] > header a { color: var(--tpl-header-text); }
body.public-page[class*="tpl-"] > header .brand::before {
  background: var(--accent); border-color: var(--accent); box-shadow: inset 0 0 0 5px var(--tpl-header);
}
body.public-page[class*="tpl-"] > main {
  color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line);
  border-radius: var(--tpl-radius); box-shadow: var(--tpl-shadow);
}
body.public-page[class*="tpl-"] h1,
body.public-page[class*="tpl-"] h2,
body.public-page[class*="tpl-"] h3 { color: var(--tpl-text); }
body.public-page[class*="tpl-"] h1.accent { color: var(--accent); }
body.public-page[class*="tpl-"] h2 { border-color: var(--tpl-line); }
body.public-page[class*="tpl-"] .note,
body.public-page[class*="tpl-"] .dim { color: var(--tpl-muted); }
body.public-page[class*="tpl-"] .card,
body.public-page[class*="tpl-"] .svc-block,
body.public-page[class*="tpl-"] .form.narrow,
body.public-page[class*="tpl-"].slot-page .form,
body.public-page[class*="tpl-"] details.slot-list summary {
  color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line);
  border-radius: var(--tpl-radius);
}
body.public-page[class*="tpl-"] .info,
body.public-page[class*="tpl-"] .list { color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line); border-radius: var(--tpl-radius); }
body.public-page[class*="tpl-"] .info th,
body.public-page[class*="tpl-"] .list th { color: var(--tpl-text); background: var(--tpl-alt); }
body.public-page[class*="tpl-"] .info td,
body.public-page[class*="tpl-"] .info th,
body.public-page[class*="tpl-"] .list td,
body.public-page[class*="tpl-"] .list th { border-color: var(--tpl-line); }
body.public-page[class*="tpl-"] .list tr:nth-child(even) td { background: color-mix(in srgb, var(--tpl-alt) 54%, transparent); }
body.public-page[class*="tpl-"] .form input,
body.public-page[class*="tpl-"] .form select,
body.public-page[class*="tpl-"] .form textarea {
  color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line);
}
body.public-page[class*="tpl-"] .progress-wrap { color: var(--tpl-text); background: var(--tpl-alt); border-color: var(--tpl-line); border-radius: var(--tpl-radius); }
body.public-page[class*="tpl-"] .progress { background: color-mix(in srgb, var(--tpl-line) 70%, transparent); }
body.public-page[class*="tpl-"] .richtext { color: var(--tpl-text); }
body.public-page[class*="tpl-"] .tag { color: var(--tpl-text); background: var(--tpl-alt); border-color: var(--tpl-line); }
body.public-page[class*="tpl-"] table.cal { color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line); border-radius: var(--tpl-radius); }
body.public-page[class*="tpl-"] .cal th { color: var(--tpl-text); background: var(--tpl-alt); border-color: var(--tpl-line); }
body.public-page[class*="tpl-"] .cal td { color: var(--tpl-text); background: var(--tpl-surface); border-color: var(--tpl-line); }
body.public-page[class*="tpl-"] .cal td.other { color: var(--tpl-muted); background: var(--tpl-alt); }
body.tpl-noir > footer { background: #090B0D; }
body.tpl-noir a:not(.btn) { color: #B9D9E5; }
body.tpl-noir .st-open { color: #B9D9E5; background: #203642; }
body.tpl-noir .st-pending { color: #FFD0A3; background: #49321E; }
body.tpl-noir .st-confirmed { color: #BFE5C6; background: #23422B; }
body.tpl-noir .tier-banner { color: #FFD7B5; background: #3E2B1D; border-color: #805536; }
body.tpl-noir .deal-banner { color: #FFC3D2; background: #46222D; border-color: #7E4254; }
body.tpl-noir .pill.deal { color: #FFC3D2; background: #46222D; }
body.tpl-noir .share-box,
body.tpl-noir .account-book { color: #CFE8D3; background: #203A27; border-color: #416B49; }
body.tpl-washi h1,
body.tpl-washi h2,
body.tpl-washi h3,
body.tpl-luxe h1,
body.tpl-luxe h2,
body.tpl-luxe h3 { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; }
body.tpl-washi .card { border-top-width: 1px; border-left: 4px solid var(--accent); }
body.tpl-pop .card,
body.tpl-pop .svc-block { border: 2px solid var(--tpl-line); box-shadow: 4px 4px 0 rgba(37, 52, 59, .16); }
body.tpl-pop .btn { border: 2px solid #25343B; box-shadow: 3px 3px 0 #25343B; }
body.tpl-mono > main,
body.tpl-mono .card,
body.tpl-mono .info,
body.tpl-mono .list,
body.tpl-mono .form.narrow,
body.tpl-mono.slot-page .form { border-width: 2px; }
body.tpl-mono .btn { border: 2px solid #111; border-radius: 0; box-shadow: none; }
body.tpl-mono .pill,
body.tpl-mono .st,
body.tpl-mono .tag { border: 1px solid #111; border-radius: 0; }
body.tpl-luxe h1.accent { color: #8D6E13; }
body.tpl-luxe .card,
body.tpl-luxe .svc-block { border-top-color: #B8962E; }

/* ランディング上のカードプリセットを現行カード構造に合わせて再定義 */
.landing .landing-cards .card-tpl-ribbon::after {
  z-index: 3; top: 12px; right: 12px; padding: 3px 9px; transform: none;
  background: var(--accent); border-radius: 2px; font-weight: 700; letter-spacing: .08em;
}
.landing .landing-cards .card-tpl-ticket {
  border: 2px dashed #8E9B94; border-radius: 2px;
  background: linear-gradient(90deg, #FFFDF7, #FFFDF7);
}
.landing .landing-cards .card-tpl-ticket .card-link { border-top-style: dashed; }
.landing .landing-cards .card-tpl-photo .card-hero { height: 235px; }
.landing .landing-cards .card-tpl-photo .tenant-card-body { padding-top: 19px; }
.landing .landing-cards .card-tpl-minimal {
  background: transparent; border: 0; border-block: 1px solid #AEB8B2; border-radius: 0;
}
.landing .landing-cards .card-tpl-minimal .card-link { background: transparent; }
.landing .landing-cards .card-tpl-gradient {
  background: linear-gradient(145deg, #FFF 15%, color-mix(in srgb, var(--accent) 9%, #F4F6F2));
  border-top: 4px solid var(--accent);
}
.landing .landing-cards .card-tpl-night {
  color: #EDF1F2; background: #1C2428; border-color: #354148;
}
.landing .landing-cards .card-tpl-night h2,
.landing .landing-cards .card-tpl-night .card-overline { color: #FFF !important; }
.landing .landing-cards .card-tpl-night .tenant-copy,
.landing .landing-cards .card-tpl-night .next-slot { color: #C0CACE; border-color: #374348; }
.landing .landing-cards .card-tpl-night .card-link { color: #E8F0EC; background: #11181B; border-color: #374348; }
.landing .landing-cards .card-tpl-stamp .tenant-head h2 {
  padding: 3px 10px; border: 2px solid var(--accent); border-radius: 2px; transform: rotate(-1deg);
}
.landing .landing-cards .card-tpl-magazine {
  border: 1px solid #1D2529; border-top: 9px solid #1D2529; border-radius: 0;
}
.landing .landing-cards .card-tpl-magazine h2 {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 1.35rem; letter-spacing: .04em;
}
.landing .landing-cards .card-tpl-frame {
  padding: 0 0 45px; outline: 1px solid var(--accent); outline-offset: -7px;
  border: 5px solid #F6F1E6; border-radius: 0;
}
.landing .landing-cards .card-tpl-frame .tenant-card-body { padding-inline: 25px; }

/* 事業者・マスター管理コンソール */
body.console-page {
  --console-ink: #172B24;
  --console-muted: #66766F;
  --console-surface: #FFF;
  --console-line: #D8E0DB;
  margin: 0; color: var(--console-ink);
  background: #EDF1EE;
}
body.admin.console-page { --console-nav: #173D32; --console-accent: #2D6A56; }
body.sysadmin.console-page { --console-nav: #40262B; --console-accent: #8A3F48; }
body.console-page > header {
  padding: 13px max(3vw, 22px); background: var(--console-nav);
  border-bottom: 3px solid var(--console-accent);
}
body.console-page > header .brand { margin: 0; color: #F4F7F5; font-size: .98rem; letter-spacing: .045em; }
body.console-page > header .brand a { color: inherit; }
body.console-page > header nav { display: flex; gap: 6px; }
body.console-page > header nav a {
  margin: 0; padding: 6px 10px; color: #F4F7F5; border: 1px solid rgba(255,255,255,.2);
  border-radius: 3px; font-size: .78rem;
}
body.console-page > main { max-width: 1180px; margin: 0 auto; padding: 34px 28px 60px; }
body.console-page > footer {
  padding: 24px 20px; color: #586860; background: #E4E9E6; border-top: 1px solid #D2DAD5;
}
body.console-page h1 {
  margin: 0 0 24px; font-size: clamp(1.55rem, 3vw, 2rem); line-height: 1.35; letter-spacing: .02em;
}
body.console-page h2 {
  margin: 2.1em 0 .85em; padding-bottom: .5em; font-size: 1.08rem;
  border-bottom: 2px solid var(--console-line);
}
body.console-page a { color: var(--console-accent); }
body.console-page .note,
body.console-page .dim { color: var(--console-muted); }
body.console-page .btn {
  color: #FFF; background: var(--console-accent); border-radius: 3px; font-weight: 700;
  box-shadow: 0 3px 8px rgba(20, 40, 30, .12);
}
body.console-page .btn:hover { color: #FFF; filter: brightness(.9); }
body.console-page .btn:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--console-accent) 38%, #FFF);
  outline-offset: 2px;
}
body.console-page .btn.danger { color: #FFF; background: #A23939; }
body.console-page .flash {
  max-width: 1124px; margin-top: 16px; background: #FFF6D9; border-color: #D99B1F;
}
body.console-page .svc-block {
  padding: 18px 22px 22px; background: var(--console-surface); border: 1px solid var(--console-line);
  border-left: 5px solid var(--accent); border-radius: 4px; box-shadow: 0 7px 18px rgba(26, 45, 35, .055);
}
body.console-page .approve-card { background: #FFF8DF; border-radius: 3px; }
body.console-page table.info,
body.console-page table.list {
  border-collapse: separate; border-spacing: 0; overflow: hidden;
  border: 1px solid var(--console-line); border-radius: 4px; background: #FFF;
}
body.console-page .info th,
body.console-page .info td,
body.console-page .list th,
body.console-page .list td {
  padding: 10px 12px; border: 0; border-bottom: 1px solid #E4E9E6;
}
body.console-page .info th,
body.console-page .list th { color: #344A40; background: #E8EEEA; }
body.console-page .list tr:nth-child(even) td { background: #F8FAF8; }
body.console-page .info tr:last-child > *,
body.console-page .list tr:last-child > * { border-bottom: 0; }
body.console-page .form {
  max-width: 860px; padding: 24px 28px 30px; background: #FFF;
  border: 1px solid var(--console-line); border-radius: 4px;
  box-shadow: 0 8px 22px rgba(26, 45, 35, .055);
}
body.console-page .form.narrow { max-width: 560px; }
body.console-page .form label {
  margin: 0; padding: 14px 0; color: #2B4036; border-bottom: 1px solid #E7ECE8;
  font-size: .88rem;
}
body.console-page .form label:last-of-type { border-bottom: 0; }
body.console-page .form input,
body.console-page .form select,
body.console-page .form textarea {
  max-width: 620px; padding: 9px 10px; background: #FBFCFB; border-color: #AAB8B0; border-radius: 3px;
}
body.console-page .form input:focus,
body.console-page .form select:focus,
body.console-page .form textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--console-accent) 25%, transparent);
  border-color: var(--console-accent);
}
body.console-page .form h2 { margin-top: 2.4em; }
body.console-page .form .inline-label { display: flex; align-items: center; gap: 8px; }
body.console-page .form .inline-label input { flex: none; margin: 0; }
/* U3-2: 任意セクション(キャンセル料・人数割引・おトク比較・タグ)の折りたたみ。
   details/summaryはJS不要で既存方針(details.slot-list)と同じ。summaryがh2相当の
   見出しを兼ねる */
body.console-page .form details.settings-fold {
  margin: 2.4em 0 .85em; padding-bottom: .2em; border-bottom: 1px solid var(--console-line);
}
body.console-page .form details.settings-fold summary {
  cursor: pointer; padding: 0 0 .5em; color: var(--console-ink); font-size: 1.08rem;
  font-weight: 700; list-style: none;
}
body.console-page .form details.settings-fold summary::-webkit-details-marker { display: none; }
body.console-page .form details.settings-fold summary::before { content: '▸ '; color: var(--console-accent); }
body.console-page .form details.settings-fold[open] summary::before { content: '▾ '; }
/* :last-of-type は同じ親を持つ兄弟内でしか働かないため、折りたたみ内では
   「そのセクション最後のlabel」がフォーム全体の最終labelと同じ扱いを誤って受ける。
   罫線を復元し、本来の意図(フォーム末尾のlabelにだけ罫線を出さない)を保つ */
body.console-page .form details.settings-fold label:last-of-type { border-bottom: 1px solid #E7ECE8; }
/* U3-2: 保存ボタンをスクロール中も届く位置に固定する(長いフォーム対策) */
body.console-page .form .save-bar {
  position: sticky; bottom: 0; z-index: 2;
  margin: 24px -28px -30px; padding: 14px 28px;
  background: #FFF; border-top: 1px solid var(--console-line);
  border-radius: 0 0 4px 4px; box-shadow: 0 -6px 18px rgba(20, 40, 30, .07);
}
body.sysadmin.console-page .svc-block { border-left-color: var(--console-accent); }

/* デザイン選択画面の視覚見本 */
.preset-gallery {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 10px; max-width: 820px; margin: 10px 0 28px;
}
.preset-sample {
  position: relative; padding: 9px; background: #FAFBFA; border: 1px solid #D6DFD9;
  border-radius: 3px;
}
.preset-sample.is-current { border: 2px solid var(--console-accent); padding: 8px; }
.preset-sample > strong { display: block; margin-top: 6px; font-size: .68rem; line-height: 1.35; }
.preset-sample > small {
  position: absolute; top: 13px; right: 13px; padding: 1px 5px; color: #FFF;
  background: var(--console-accent); border-radius: 2px; font-size: .56rem;
}
.preset-canvas,
.preset-card-canvas {
  position: relative; display: block; height: 72px; overflow: hidden;
  background: var(--preview-bg, #EFF2EF); border: 1px solid var(--preview-line, #CDD5D0);
  border-radius: var(--preview-radius, 2px);
}
.preset-canvas i {
  display: block; height: 16px; background: var(--preview-head, #244A3B);
}
.preset-canvas b,
.preset-canvas em {
  position: absolute; display: block; background: var(--preview-surface, #FFF);
  border: 1px solid var(--preview-line, #CDD5D0);
}
.preset-canvas b { left: 8px; right: 8px; top: 25px; height: 12px; }
.preset-canvas em { left: 8px; width: 42%; top: 44px; height: 18px; border-left: 3px solid var(--preview-accent, #E45B16); }
.preset-tenant-noir { --preview-bg:#111417; --preview-head:#07090A; --preview-surface:#242A30; --preview-line:#3A4248; --preview-accent:#B8962E; }
.preset-tenant-washi { --preview-bg:#F1E9DA; --preview-head:#D8C8AE; --preview-surface:#FFFCF4; --preview-line:#BBAA8E; --preview-accent:#7D4E2D; }
.preset-tenant-pop { --preview-bg:#FFF2B8; --preview-head:#F06A45; --preview-surface:#FFF; --preview-line:#263238; --preview-radius:12px; --preview-accent:#1976D2; }
.preset-tenant-mint { --preview-bg:#DDF2EC; --preview-head:#5BAE98; --preview-surface:#FCFFFE; --preview-line:#9FCABC; --preview-radius:8px; --preview-accent:#287A67; }
.preset-tenant-sunset { --preview-bg:#F6BE9C; --preview-head:#7D4035; --preview-surface:#FFF8F0; --preview-line:#D9A17F; --preview-radius:6px; --preview-accent:#D65A3A; }
.preset-tenant-ocean { --preview-bg:#CBE8F1; --preview-head:#0D5069; --preview-surface:#FAFEFF; --preview-line:#8EBFD0; --preview-radius:5px; --preview-accent:#1685A8; }
.preset-tenant-forest { --preview-bg:#DFE9D8; --preview-head:#28472E; --preview-surface:#FCFDF9; --preview-line:#9EB494; --preview-accent:#3F7A47; }
.preset-tenant-mono { --preview-bg:#FFF; --preview-head:#111; --preview-surface:#FFF; --preview-line:#111; --preview-radius:0; --preview-accent:#111; }
.preset-tenant-luxe { --preview-bg:#EDE2CB; --preview-head:#28251F; --preview-surface:#FFFDF7; --preview-line:#BCA66D; --preview-accent:#B8962E; }
.preset-card-canvas { background: #F2F4F1; }
.preset-card-canvas i { display: block; height: 37px; background: linear-gradient(135deg, #94AA9B, #D6DED8); }
.preset-card-canvas b { display: block; width: 58%; height: 6px; margin: 8px 7px 0; background: #31453A; }
.preset-card-canvas em { display: block; width: 78%; height: 4px; margin: 5px 7px 0; background: #AEB9B2; }
.preset-card-ribbon .preset-card-canvas::after {
  content: "注目"; position: absolute; top: 5px; right: 5px; padding: 1px 4px;
  color: #FFF; background: #C7532D; font-size: .5rem;
}
.preset-card-ticket .preset-card-canvas { border: 2px dashed #7D8B83; border-radius: 0; }
.preset-card-photo .preset-card-canvas i { height: 52px; }
.preset-card-minimal .preset-card-canvas { background: transparent; border-inline: 0; border-radius: 0; }
.preset-card-gradient .preset-card-canvas { background: linear-gradient(145deg, #FFF, #DCE8E0); }
.preset-card-night .preset-card-canvas { background: #1D2529; border-color: #39464C; }
.preset-card-night .preset-card-canvas b { background: #FFF; }
.preset-card-stamp .preset-card-canvas b { width: 48%; height: 12px; border: 2px solid #446C55; background: transparent; transform: rotate(-2deg); }
.preset-card-magazine .preset-card-canvas { border-top: 7px solid #1D2529; border-radius: 0; }
.preset-card-frame .preset-card-canvas { outline: 2px solid #8B6C3E; outline-offset: -6px; border: 4px solid #EDE5D7; border-radius: 0; }

@media (max-width: 760px) {
  body.public-page > header { padding: 10px 14px; }
  body.public-page > header .brand { padding-left: 29px; font-size: .96rem; }
  body.public-page > header .brand::before { width: 18px; height: 18px; }
  body.public-page > header nav a { padding: 9px 6px; font-size: .72rem; }
  body.public-page > header nav a:last-child { display: none; }
  body.public-page > main {
    margin: 14px 10px 34px; padding: 28px 19px 36px; border-radius: 3px;
  }
  body.public-page .hero-banner { margin: -28px -19px 24px; }
  body.public-page .hero-banner img { max-height: 250px; }
  body.public-page .card-hero { height: 170px; margin-inline: -20px; }
  body.public-page .searchbar { flex-direction: column; }
  body.public-page .searchbar .btn { width: 100%; }
  body.public-page .form.narrow,
  body.slot-page .form { padding: 20px 17px 24px; }
  body.slot-page .share-box { display: block; }
  /* U3-1: table.cal 自身を display:block+min-width にすると、内容(無名テーブル)が
     自身より広くならず overflow-x:auto が発火しない(自己参照のバグ)。table は
     display:table のまま、.table-scroll(既存の汎用ラッパ)側で横スクロールさせる。
     main の overflow:hidden はスクロール自体を殺してしまうため撤去する */
  .table-scroll table.cal { min-width: 700px; }
  /* U4: 枠一覧・締切間近リスト(table.list を .table-scroll で包んだもの)も同じ手法。
     日付セルの2段化で浮いた幅は開催枠名列に回る。最小幅は窮屈になりすぎない程度に確保 */
  .table-scroll table.list { min-width: 600px; }
  /* U3-6: タップ目標(推奨44px)に近づける */
  .btn.small { padding: 9px 14px; }
  body.console-page > header { padding: 10px 14px; }
  body.console-page > header .brand { font-size: .84rem; }
  body.console-page > main { padding: 25px 14px 45px; }
  body.console-page .form { padding: 20px 16px 24px; }
  body.console-page .form .save-bar { margin: 20px -16px -24px; padding: 12px 16px; }
  body.console-page table.list { display: block; overflow-x: auto; }
  .preset-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- v9: 生成テクスチャを使った質感とプリセットの描き分け ---- */
body.landing {
  background-image:
    radial-gradient(circle at 8% 12%, rgba(228, 91, 22, .06), transparent 23rem),
    radial-gradient(circle at 92% 4%, rgba(40, 92, 53, .08), transparent 28rem),
    url("design/washi-fiber-v1.webp");
  background-size: auto, auto, 560px 560px;
  background-blend-mode: normal, normal, multiply;
}
body.landing > header,
.landing .hero-copy {
  background-image: url("design/washi-fiber-v1.webp");
  background-size: 520px 520px;
  background-blend-mode: multiply;
}
.landing .landing-cards .tenant-card-body {
  background-image:
    linear-gradient(rgba(255, 254, 250, .93), rgba(255, 254, 250, .93)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 430px 430px;
}
.landing .landing-cards .card-tpl-ribbon .tenant-card-body,
.landing .landing-cards .card-tpl-stamp .tenant-card-body {
  background-image:
    linear-gradient(rgba(255, 253, 246, .9), rgba(255, 253, 246, .94)),
    url("design/craft-blockprint-v1.webp");
  background-position: center, 24% 18%;
  background-size: auto, 390px 390px;
}
.landing .landing-cards .card-tpl-gradient .tenant-card-body {
  background-image:
    linear-gradient(rgba(250, 253, 248, .88), rgba(250, 253, 248, .94)),
    url("design/kyoto-contours-v1.webp");
  background-size: auto, 460px 460px;
}
.landing .landing-cards .card-tpl-night .tenant-card-body {
  background-image:
    linear-gradient(rgba(28, 36, 40, .88), rgba(28, 36, 40, .94)),
    url("design/kyoto-contours-v1.webp");
  background-size: auto, 450px 450px;
}

body.public-page.tpl-standard > main,
body.public-page.tpl-washi > main,
body.public-page.tpl-mono > main,
body.public-page.tpl-luxe > main {
  background-image:
    linear-gradient(rgba(255, 254, 250, .88), rgba(255, 254, 250, .94)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 560px 560px;
}
body.public-page.tpl-mint > main,
body.public-page.tpl-ocean > main,
body.public-page.tpl-forest > main {
  background-image:
    linear-gradient(rgba(250, 254, 252, .9), rgba(250, 254, 252, .94)),
    url("design/kyoto-contours-v1.webp");
  background-size: auto, 620px 620px;
}
body.public-page.tpl-pop > main,
body.public-page.tpl-sunset > main {
  background-image:
    linear-gradient(rgba(255, 253, 247, .91), rgba(255, 253, 247, .95)),
    url("design/craft-blockprint-v1.webp");
  background-size: auto, 560px 560px;
}
body.public-page.tpl-noir > main {
  background-image:
    linear-gradient(rgba(27, 32, 37, .9), rgba(27, 32, 37, .95)),
    url("design/sumi-grain-v1.webp");
  background-size: auto, 520px 520px;
}

body.public-page .btn,
body.landing .btn,
body.console-page .btn {
  background-image:
    linear-gradient(rgba(255, 255, 255, .035), rgba(0, 0, 0, .09)),
    url("design/sumi-grain-v1.webp");
  background-size: auto, 210px 210px;
  background-blend-mode: normal, soft-light;
}
body.console-page {
  background-image: url("design/washi-fiber-v1.webp");
  background-size: 580px 580px;
  background-blend-mode: multiply;
}
body.console-page > header {
  background-image: url("design/sumi-grain-v1.webp");
  background-size: 360px 360px;
  background-blend-mode: soft-light;
}
body.console-page .form,
body.console-page .svc-block {
  background-image:
    linear-gradient(rgba(255, 255, 255, .91), rgba(255, 255, 255, .95)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 520px 520px;
}

@media (max-width: 760px) {
  body.landing { background-size: auto, auto, 430px 430px; }
  body.console-page { background-size: 430px 430px; }
  .landing .landing-cards .tenant-card-body { background-size: auto, 360px 360px; }
}

/* ---- v10: 顧客マイページの温かい紙面設計 ---- */
body.public-page.account-page {
  --accent: #9A4B32;
  --account-ink: #3D3028;
  --account-muted: #75665C;
  --account-line: #D8C8B0;
  --account-paper: #FFF9EE;
  color: var(--account-ink);
  background:
    radial-gradient(circle at 10% 8%, rgba(190, 101, 55, .12), transparent 25rem),
    radial-gradient(circle at 94% 20%, rgba(173, 132, 72, .1), transparent 28rem),
    linear-gradient(rgba(242, 233, 216, .82), rgba(237, 224, 204, .88)),
    url("design/washi-fiber-v1.webp") !important;
  background-size: auto, auto, auto, 560px 560px;
}
body.account-page > header {
  color: var(--account-ink); background-color: rgba(250, 244, 232, .96);
  background-image: url("design/washi-fiber-v1.webp"); background-size: 500px 500px;
  background-blend-mode: multiply; border-bottom-color: #D8C3A5;
}
body.account-page > header a { color: var(--account-ink); }
body.account-page > header .brand::before {
  background: #C5653F; border-color: #C5653F; box-shadow: inset 0 0 0 5px #F8E9D6;
}
body.account-page > header nav a:hover { background: rgba(154, 75, 50, .09); }
body.account-page > main {
  position: relative; max-width: 1020px; overflow: hidden;
  color: var(--account-ink); background-color: var(--account-paper);
  background-image:
    linear-gradient(rgba(255, 249, 238, .88), rgba(255, 249, 238, .94)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 520px 520px; border-color: var(--account-line);
  box-shadow: 0 18px 52px rgba(87, 58, 37, .12);
}
body.account-page > main::before {
  content: ""; display: block; height: 10px; margin: -42px -46px 32px;
  background-image:
    linear-gradient(rgba(154, 75, 50, .6), rgba(154, 75, 50, .6)),
    url("design/craft-blockprint-v1.webp");
  background-position: center; background-size: auto, 300px 300px;
}
body.account-page h1 {
  margin-bottom: 24px; color: #513629; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.8rem, 4vw, 2.45rem); letter-spacing: .045em;
}
body.account-page h2 {
  margin-top: 2.5em; padding: 0 0 .55em 14px; color: #513629;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 1.25rem;
  border-bottom: 1px solid #D8C8B0; border-left: 4px solid #B66B46;
}
body.account-page h3 { color: #513629; }
body.account-page .note,
body.account-page .dim { color: var(--account-muted); }
body.account-page .note a { color: #84422F; font-weight: 700; }
body.account-page .pill {
  color: #694633; background: #F2E2CB; border: 1px solid #D7B992; border-radius: 999px;
}
body.account-page table.info,
body.account-page table.list { border-color: #D9C9B2; box-shadow: 0 5px 16px rgba(91, 61, 39, .055); }
body.account-page .info th,
body.account-page .list th { color: #593D2E; background: #F2E4CE; border-color: #DDCDB6; }
body.account-page .info td,
body.account-page .list td { background: rgba(255, 252, 246, .83); border-color: #E5D8C5; }
body.account-page .svc-block {
  padding: 20px 24px 24px; background-color: #FFFAF1;
  background-image:
    linear-gradient(rgba(255, 250, 241, .88), rgba(255, 250, 241, .94)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 460px 460px; border-color: #DDCDB6;
  border-left-color: var(--accent); box-shadow: 0 8px 22px rgba(91, 61, 39, .07);
}
body.account-page .btn:not(.danger) { background-color: #91472F; }
body.account-page .btn:hover { filter: brightness(.93); }
body.public-page.account-page .form {
  background-color: #FFF9EE;
  background-image:
    linear-gradient(rgba(255, 249, 238, .88), rgba(255, 249, 238, .94)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 460px 460px; border-color: #D8C4A7;
  box-shadow: 0 10px 30px rgba(87, 58, 37, .09);
}
body.account-page .form label { color: #513B2F; border-color: #E7DAC8; }
body.account-page .form input,
body.account-page .form select,
body.account-page .form textarea {
  color: #3D3028; background: #FFFCF7; border-color: #BFAE97;
}
body.account-page .form input:focus,
body.account-page .form select:focus,
body.account-page .form textarea:focus { border-color: #9A4B32; outline-color: rgba(154, 75, 50, .2); }
body.account-auth-page > main { max-width: 700px; }
body.account-auth-page .form.narrow { width: 100%; max-width: 540px; }
body.account-auth-page > main > .note {
  max-width: 560px; padding: 13px 16px; background: rgba(243, 229, 207, .58);
  border-left: 3px solid #C5845D;
}

@media (max-width: 760px) {
  body.public-page.account-page { background-size: auto, auto, auto, 430px 430px; }
  body.account-page > main::before { margin: -28px -19px 24px; }
  body.account-page h1 { font-size: 1.75rem; }
  body.account-page h2 { font-size: 1.12rem; }
  body.account-page .svc-block { padding: 17px 16px 20px; }
  body.account-home table.list { display: block; overflow-x: auto; }
}

/* v11: Adopt the F2 gathering-rings mark across public-facing headers. */
body.landing > header .brand::before,
body.public-page > header .brand::before,
body.public-page[class*="tpl-"] > header .brand::before,
body.account-page > header .brand::before {
  background: #FBF2E2 url("design/atsumaru-mark-f2.webp") center / cover no-repeat;
  border: 0;
  box-shadow: 0 0 0 1px rgba(16, 42, 67, .12);
}
body.landing > header .brand::before { width: 26px; height: 26px; }
body.public-page > header .brand::before { width: 25px; height: 25px; }

@media (max-width: 700px) {
  body.landing > header .brand::before { width: 22px; height: 22px; }
  body.public-page > header .brand::before { width: 21px; height: 21px; }
}

/* ---- v12: expanded content hierarchy and editorial illustrations ---- */
.flow-illustration {
  margin: 30px 0 34px; overflow: hidden; background: #F8F1E3;
  border: 1px solid #D7CDBB; border-radius: 4px;
  box-shadow: 0 12px 30px rgba(43, 55, 43, .08);
}
.flow-illustration img {
  display: block; width: 100%; aspect-ratio: 2.35 / 1; object-fit: cover; object-position: center;
}
.trust-grid article { position: relative; min-width: 0; }
.trust-grid .trust-icon {
  display: block; width: 76px; height: 76px; margin: -2px 0 12px; object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .16));
}
.trust-grid article > span { position: absolute; top: 32px; right: 25px; }
.biz-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.landing .biz .biz-actions .btn { margin: 0; }
.landing .biz .btn.biz-outline {
  color: var(--landing-green); background: transparent; border: 1px solid var(--landing-green);
  box-shadow: none;
}
.landing .biz .btn.biz-outline:hover { color: #FFF; background-color: var(--landing-green); }

body.info-page {
  --info-ink: #102A43; --info-green: #285C35; --info-orange: #D95819;
  --info-paper: #FFFDF7; --info-soft: #F2EEE3; --info-line: #D8D0BF;
  color: var(--info-ink);
  background:
    radial-gradient(circle at 8% 10%, rgba(217, 88, 25, .08), transparent 25rem),
    radial-gradient(circle at 92% 18%, rgba(40, 92, 53, .09), transparent 28rem),
    #EEE8DB url("design/washi-fiber-v1.webp") !important;
  background-size: auto, auto, auto, 560px 560px !important;
  background-blend-mode: normal, normal, normal, multiply;
}
body.info-page > main { max-width: 1080px; padding: 0 50px 56px; overflow: hidden; }
.page-lead {
  margin: 0 -50px 38px; padding: 48px 50px 42px;
  background:
    linear-gradient(100deg, rgba(255, 253, 247, .97), rgba(242, 238, 227, .91)),
    url("design/washi-fiber-v1.webp");
  background-size: auto, 520px 520px; border-bottom: 1px solid var(--info-line);
}
.page-lead.compact { padding-bottom: 34px; }
.page-lead h1 { margin: 0 0 12px; color: var(--info-ink); font-size: clamp(2rem, 4vw, 2.8rem); }
.page-lead > p:last-child { max-width: 760px; margin: 0; color: #526359; font-size: .96rem; line-height: 1.9; }
.page-eyebrow,
.status-kicker {
  margin: 0 0 8px; color: var(--info-orange); font-size: .68rem; font-weight: 800;
  letter-spacing: .16em; text-transform: uppercase;
}
.explain-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 0 0 52px; }
.explain-grid article {
  display: grid; grid-template-columns: 76px 1fr; gap: 15px; align-items: center;
  min-width: 0; padding: 21px 19px; background: rgba(255, 253, 247, .78);
  border: 1px solid var(--info-line); border-radius: 4px;
}
.explain-grid img { width: 72px; height: 72px; object-fit: contain; }
body.info-page .explain-grid h2 {
  margin: 0 0 5px; padding: 0; color: var(--info-ink); border: 0; font-size: .94rem;
}
.explain-grid p { margin: 0; color: #627067; font-size: .74rem; line-height: 1.65; }
.pricing-section { margin: 52px 0; }
.section-title-row { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 17px; }
.section-title-row h2,
body.info-page .pricing-section > h2 { margin: 0; padding: 0 0 10px; border: 0; font-size: 1.38rem; }
.section-title-row > p { margin: 0 0 8px; padding: 5px 11px; color: var(--info-green); background: #EAF1E8; border: 1px solid #C5D4C2; font-size: .75rem; font-weight: 800; }
.table-scroll { width: 100%; overflow-x: auto; }
body.pricing-page .pricing-table { min-width: 720px; box-shadow: none; }
body.pricing-page .pricing-table th { padding-block: 14px; background: var(--info-ink); color: #FFF; }
body.pricing-page .pricing-table td { padding-block: 15px; vertical-align: top; }
body.pricing-page .pricing-table tr:nth-child(even) td { background: #F6F3E9; }
.fine-print {
  margin: 14px 0 0; padding: 16px 20px 16px 36px; color: #657168;
  background: rgba(242, 238, 227, .7); border-left: 3px solid #BFAE91;
}
.fine-print li + li { margin-top: 5px; }
.pricing-choice-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: 18px; margin: 58px 0; }
.info-panel { padding: 30px 30px 32px; border: 1px solid var(--info-line); border-radius: 4px; }
.onsite-panel { background: #EDF3E9; border-top: 4px solid var(--info-green); }
.card-panel { background: #FFF8EC; border-top: 4px solid var(--info-orange); }
body.info-page .info-panel h2 { margin: 0 0 14px; padding: 0; border: 0; font-size: 1.22rem; }
.info-panel > p:last-child { margin-bottom: 0; color: #56665C; font-size: .88rem; }
.feature-list { margin: 0; padding: 0; list-style: none; }
.feature-list li { position: relative; padding: 13px 0 13px 24px; border-top: 1px solid rgba(16, 42, 67, .11); }
.feature-list li:first-child { border-top: 0; }
.feature-list li::before {
  content: ""; position: absolute; left: 0; top: 21px; width: 8px; height: 8px;
  background: var(--info-orange); border-radius: 50%; box-shadow: 0 0 0 4px rgba(217, 88, 25, .1);
}
.feature-list strong,
.feature-list span { display: block; }
.feature-list strong { color: var(--info-ink); font-size: .88rem; }
.feature-list span { margin-top: 2px; color: #647067; font-size: .77rem; line-height: 1.68; }
.common-features { padding: 32px 34px; background: rgba(255, 253, 247, .72); border: 1px solid var(--info-line); }
.feature-list.two-column { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
.feature-list.two-column li:nth-child(2) { border-top: 0; }
.page-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--info-line); }
body.info-page .page-actions .btn.neutral { background-color: #687970; }

body.signup-page > main { max-width: 1120px; }
.signup-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 38px; align-items: start; }
.signup-overview { position: sticky; top: 24px; padding: 29px 28px; background: #EEF3E9; border: 1px solid #C9D4C4; border-top: 4px solid var(--info-green); }
.signup-overview > img { display: block; width: 108px; height: 108px; margin: -8px 0 12px; object-fit: contain; }
body.info-page .signup-overview h2 { margin: 0 0 12px; padding: 0; border: 0; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 1.35rem; line-height: 1.55; }
.signup-overview > p { color: #59685E; font-size: .84rem; }
.signup-overview a { color: var(--info-green); font-weight: 800; }
.signup-notes { margin: 20px 0; padding: 0; list-style: none; }
.signup-notes li { padding: 12px 0; border-top: 1px solid #CED8C9; }
.signup-notes strong,
.signup-notes span { display: block; }
.signup-notes strong { color: var(--info-green); font-size: .83rem; }
.signup-notes span { margin-top: 3px; color: #69766D; font-size: .73rem; line-height: 1.6; }
body.public-page .signup-form.form.narrow { max-width: none; padding: 27px 32px 32px; background: #FFFDF8; border-left-width: 1px; }
body.info-page .signup-form h2 { margin: 0 0 10px; padding-bottom: 13px; border-bottom: 2px solid var(--info-line); }
.status-panel { max-width: 720px; margin: 46px auto 20px; padding: 36px 38px; background: #F2F5EE; border: 1px solid #C8D4C5; border-left: 5px solid var(--info-green); }
.mail-panel { background: #FFF7E9; border-color: #E2C59E; border-left-color: var(--info-orange); }
body.info-page .status-panel h2 { margin: 0 0 12px; padding: 0; border: 0; font-size: 1.3rem; }

body.service-page > main { max-width: 1040px; }
.service-page .breadcrumb { margin-bottom: 16px; }
.service-overview { margin: 0 0 38px; padding-bottom: 28px; border-bottom: 1px solid var(--tpl-line, var(--page-line)); }
.service-overview h1 { margin-bottom: 13px; }
.service-overview .richtext { max-width: 760px; font-size: .94rem; line-height: 1.9; }
.service-overview > .note { max-width: 760px; padding: 10px 13px; background: var(--tpl-alt, #F2F4EF); border-left: 3px solid var(--accent); }
.tier-banner,
.deal-banner { padding: 13px 16px; }
.tier-label { display: inline-block; margin-right: 8px; padding: 2px 8px; color: #FFF; background: #B95519; border-radius: 2px; font-size: .72rem; letter-spacing: .04em; }
.service-panel { margin: 26px 0; padding: 26px 28px 29px; background: color-mix(in srgb, var(--tpl-alt, #EFF3ED) 64%, transparent); border: 1px solid var(--tpl-line, #D7DED7); border-radius: var(--tpl-radius, 4px); }
body.service-page .service-panel > h2 { margin: 0 0 18px; padding: 0 0 11px; border-bottom: 1px solid var(--tpl-line, #D7DED7); }
.payment-panel { border-left: 4px solid var(--accent); }
/* v22: お支払い方法の折りたたみ。summaryが従来のh2(決済方式名込み)を
   兼ねるので、閉じていても支払い条件は見える。見た目はservice-panel > h2に
   揃え、開閉記号だけdetails.slot-list/settings-foldの流儀(▸/▾)に合わせる */
.pay-fold summary {
  cursor: pointer; list-style: none;
  margin: 0 0 18px; padding: 0 0 11px; border-bottom: 1px solid var(--tpl-line, #D7DED7);
  font-size: 1.18rem; font-weight: 700;
}
.pay-fold summary::-webkit-details-marker { display: none; }
.pay-fold summary::before { content: '▸ '; color: var(--accent); }
.pay-fold[open] summary::before { content: '▾ '; }
.availability-panel { padding-bottom: 22px; background: color-mix(in srgb, var(--tpl-surface, #FFF) 90%, transparent); }
.availability-panel .calnav { justify-content: flex-end; margin-top: -48px; }
.location-panel > p:first-of-type { font-weight: 700; }
.location-panel .map-embed { margin: 15px 0; border-color: var(--tpl-line, #CCC); border-radius: var(--tpl-radius, 4px); }
.service-share { margin: 28px 0; padding: 23px 26px; border-left: 4px solid #3E7B50; }
body.service-page .service-share h3 { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 1.12rem; }
.service-share .qr { box-shadow: 0 4px 12px rgba(25, 45, 32, .09); }
.cancel-panel { background: color-mix(in srgb, #FFF4E8 58%, var(--tpl-surface, #FFF)); }
.service-legal { margin-top: 34px; padding-top: 18px; border-top: 1px solid var(--tpl-line, #D7DED7); font-size: .82rem; }
body.pay-page > main { max-width: 840px; }
body.pay-page .info,
body.reservation-page .info { box-shadow: 0 9px 24px rgba(25, 45, 32, .07); }
body.pay-page #pay-form { margin: 28px 0 20px; }
body.reservation-page h2.accent { margin-top: 2.5em; }

.console-actionbar,
.svc-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.console-actionbar .btn,
.svc-actions .btn { margin: 0; }
.console-actionbar { margin: 0 0 28px; padding: 13px; background: rgba(255,255,255,.58); border: 1px solid var(--console-line); }
.console-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: -7px 0 18px; }
body.console-page .console-metrics .pill { display: block; margin: 0; padding: 10px 11px; color: #30463A; background: #E8EEEA; border: 1px solid #D1DAD4; border-radius: 3px; text-align: center; font-weight: 700; }
.svc-actions { margin: 0 -6px 24px; padding: 12px; background: #F0F4F1; border-block: 1px solid #DCE4DE; }
body.console-page .svc-block h3 { display: flex; align-items: center; gap: 8px; margin: 27px 0 12px; color: #2B4036; font-size: .94rem; }
.section-flag { display: inline-block; padding: 2px 7px; color: #FFF; background: #5F7568; border-radius: 2px; font-size: .75rem; letter-spacing: .08em; }
.section-flag.urgent { background: #B8542C; }
body.console-page table.list th { white-space: nowrap; letter-spacing: .01em; }
body.console-page table.list td { vertical-align: middle; }
body.console-page form.inline input[type="text"] { min-height: 36px; padding: 7px 9px; border: 1px solid #AAB8B0; border-radius: 3px; }
body.console-page h1 .pill { margin-top: 4px; }

@media (max-width: 900px) {
  .explain-grid { grid-template-columns: 1fr; }
  .explain-grid article { grid-template-columns: 68px 1fr; }
  .explain-grid img { width: 64px; height: 64px; }
  .pricing-choice-grid,
  .signup-layout { grid-template-columns: 1fr; }
  .signup-overview { position: static; }
  .console-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .flow-illustration { margin: 22px 0 26px; }
  .flow-illustration img { aspect-ratio: 2 / 1; }
  .trust-grid .trust-icon { width: 68px; height: 68px; }
  body.info-page > main { margin-inline: 10px; padding: 0 19px 38px; }
  .page-lead { margin: 0 -19px 28px; padding: 34px 21px 30px; }
  .page-lead h1 { font-size: 1.85rem; }
  .explain-grid { margin-bottom: 38px; }
  .pricing-section { margin: 40px 0; }
  .pricing-choice-grid { margin: 42px 0; }
  .info-panel,
  .common-features { padding: 24px 20px; }
  .feature-list.two-column { grid-template-columns: 1fr; }
  .feature-list.two-column li:nth-child(2) { border-top: 1px solid rgba(16, 42, 67, .11); }
  .page-actions .btn { width: 100%; text-align: center; }
  .signup-overview { padding: 24px 20px; }
  body.public-page .signup-form.form.narrow { padding: 22px 18px 26px; }
  .status-panel { margin-top: 30px; padding: 27px 22px; }
  .service-panel { padding: 21px 18px 23px; }
  .availability-panel .calnav { justify-content: flex-start; margin-top: 0; }
  .service-share { display: block; padding: 20px 18px; }
  .console-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .console-actionbar { padding: 10px; }
  .console-actionbar .btn { flex: 1 1 180px; text-align: center; }
  .biz-points p { grid-template-columns: 46px minmax(0, 1fr); padding: 11px 13px; }
  .biz-point-icon { width: 44px; height: 44px; }
}

/* ---- v18: 特商法表記の未入力警告(管理画面のみ。公開ページには出さない) ---- */
/* .flash(黄)より強い赤系。見落とすと新規プランを公開できないので目立たせる */
.legal-warn {
  background: #FDECEA; border: 1px solid #F5C6C0; border-left: 5px solid #C62828;
  border-radius: 8px; padding: 12px 16px; margin: 16px 0;
}
.legal-warn strong { color: #B71C1C; }
.legal-warn p { margin: 6px 0 0; font-size: 0.92rem; }
.legal-warn table.list { margin-top: 10px; background: #fff; }

/* ---- v24: 特商法表記のモーダル(最終確認画面の補助UI) ---- */
/* 法定表記は全項目を載せるため必ず縦に長い。画面内に収めて自前でスクロールさせ、
   背後の申し込みフォームを見失わせない(閉じれば元の位置に戻る)。
   テンプレート(tpl-noir 等)が body 側で色を変えるので、色は明示的に指定する */
.legal-dialog {
  max-width: 640px; width: calc(100% - 32px); max-height: 85vh; overflow-y: auto;
  padding: 18px 20px 22px; border: 1px solid #D5DEE2; border-radius: 10px;
  color: #24333B; background: #fff;
}
.legal-dialog h2 { margin-top: 0; }
.legal-dialog form[method="dialog"] { margin-top: 16px; }
.legal-dialog::backdrop { background: rgba(0, 0, 0, .5); }
/* 押せることが見た目で分からないと、特商法表記への導線が単なる強調文字に見える */
a[data-legal-modal] { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; }

/* ---- v23: 本格運用向けの公開導線・ブランド・情報密度の再整理 ---- */
.brand-copy {
  display: grid; gap: 2px; line-height: 1; text-align: left;
}
.brand-copy small {
  color: #6B786F; font-family: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", Meiryo, sans-serif;
  font-size: .68rem; font-weight: 700; letter-spacing: .11em;
}
.brand-copy strong {
  color: inherit; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1.3rem; font-weight: 700; letter-spacing: .09em;
}
body.landing > header .brand,
body.public-page > header .brand {
  min-height: 46px; padding-left: 48px;
}
body.landing > header .brand::before,
body.public-page > header .brand::before {
  width: 34px; height: 34px;
}

.landing-routebar {
  position: relative; z-index: 3; display: grid; grid-template-columns: repeat(3, 1fr);
  margin: -1px 28px 20px; background: #FFFEFA; border: 1px solid var(--landing-line);
  box-shadow: 0 8px 22px rgba(38, 49, 42, .07);
}
.landing-routebar a {
  display: grid; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: auto auto;
  column-gap: 12px; padding: 15px 20px; color: var(--landing-ink); text-decoration: none;
  transition: background-color .18s ease, color .18s ease;
}
.landing-routebar a + a { border-left: 1px solid var(--landing-line); }
.landing-routebar a:hover { color: var(--landing-green); background: #F4F7F0; }
.landing-routebar a > span {
  grid-row: 1 / 3; align-self: center; color: var(--landing-orange);
  font-family: Georgia, serif; font-size: 1.1rem;
}
.landing-routebar strong { font-size: .94rem; line-height: 1.4; }
.landing-routebar small { margin-top: 1px; color: #657168; font-size: .74rem; }

.landing .experience-section {
  padding: 44px 44px 40px; border: 1px solid rgba(16, 42, 67, .14);
  box-shadow: 0 15px 35px rgba(38, 49, 42, .055);
}
.landing-cards {
  grid-template-columns: repeat(auto-fill, minmax(280px, 340px));
  justify-content: start; align-items: stretch;
}
.landing .landing-cards .tenant-card { width: 100%; }
.landing .landing-cards .card-hero { height: 168px; }
@media (min-width: 701px) {
  .landing .landing-cards:has(> .tenant-card:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }
  .landing .landing-cards .tenant-card:only-child:has(.card-hero) {
    display: grid; grid-template-columns: minmax(300px, 36%) minmax(0, 1fr); grid-template-rows: 1fr auto;
    width: 100%; max-width: none; padding: 0;
  }
  .landing .landing-cards .tenant-card:only-child:has(.card-hero) .card-hero {
    grid-column: 1; grid-row: 1 / 3; width: 100%; height: 100%; min-height: 230px;
  }
  .landing .landing-cards .tenant-card:only-child:has(.card-hero) .tenant-card-body {
    grid-column: 2; grid-row: 1; padding: 18px 22px 13px;
  }
  .landing .landing-cards .tenant-card:only-child:has(.card-hero) .card-link {
    position: static; grid-column: 2; grid-row: 2;
  }
}

.landing-context {
  margin-top: 20px !important; padding: 48px 44px 40px;
  background: rgba(255, 253, 247, .62); border-block: 1px solid rgba(16, 42, 67, .12);
}
.landing-context .section-heading { max-width: 720px; margin-bottom: 0; }
.landing-context .audience-benefits {
  margin: 24px 0 0 !important; border-radius: 3px; box-shadow: none;
  border-top: 4px solid var(--landing-green);
}
.landing-context .audience-benefits article { padding-block: 22px; }
.landing-context .industry-band { padding: 22px 0 0; }
.landing-context .industry-band p { font-size: .91rem; }
.landing-context .industry-band div { gap: 7px; }
.landing-context .industry-band span {
  padding: 4px 11px; background: #F1F4ED; border: 1px solid #D2DBCE !important;
  border-radius: 999px; font-size: .7rem;
}

.landing .steps-wrap { padding-top: 52px; padding-bottom: 52px; }
.landing .steps-wrap .section-heading { margin-bottom: 0; }
.landing .flow-illustration { margin: 24px 0 26px; }
.landing .flow-illustration img { aspect-ratio: 2.55 / 1; }
.landing .landing-steps .step { padding: 24px 25px 25px; }
.trust-wrap .section-heading h2 span { display: inline; }
.trust-wrap .section-heading h2 span + span::before { content: ""; }
.trust-grid article { min-height: 230px; }
.trust-grid h3 { font-size: 1rem; }

.landing .biz { box-shadow: 0 16px 35px rgba(40, 61, 43, .07); }
.biz-copy > p:not(.section-kicker) { max-width: 42rem; line-height: 1.85; }
.biz-points p { border-top: 1px solid rgba(40, 92, 53, .08); border-right: 1px solid rgba(40, 92, 53, .08); border-bottom: 1px solid rgba(40, 92, 53, .08); }

@media (min-width: 701px) {
  .hero-lead { font-size: .98rem; }
  .section-heading > p:last-child { font-size: 1rem; line-height: 1.8; }
  .card-overline { font-size: .72rem; }
  .tenant-copy { font-size: .92rem; line-height: 1.72; }
  .next-slot { font-size: .85rem; line-height: 1.7; }
  .card-link { font-size: .8rem; }
  .audience-benefits h3 { font-size: 1.06rem; }
  .audience-benefits article div > p:last-child { font-size: .88rem; line-height: 1.7; }
  .landing-context .industry-band p { font-size: 1rem; }
  .landing-context .industry-band span { font-size: .79rem; }
  .landing .landing-steps h3 { font-size: 1.08rem; }
  .landing .landing-steps .step > p:last-child { font-size: .94rem; line-height: 1.8; }
  .trust-wrap { margin-bottom: 52px !important; padding: 44px 40px 38px; }
  .trust-grid article { min-height: 0; padding: 22px; }
  .trust-grid .trust-icon { width: 70px; height: 70px; margin-bottom: 9px; }
  .trust-grid article > span { top: 27px; right: 22px; }
  .trust-grid h3 { font-size: 1.04rem; }
  .trust-grid p { font-size: .92rem; line-height: 1.75; }
  .trust-wrap .note { margin-top: 20px; font-size: .8rem; line-height: 1.75; }
  .landing .biz { gap: 42px; margin-bottom: 36px; padding: 48px 46px; }
  .biz-copy > p:not(.section-kicker) { font-size: 1rem; line-height: 1.85; }
  .biz-points { gap: 9px; }
  .biz-points p { padding: 10px 14px; }
  .biz-points strong { font-size: .96rem; }
  .biz-points span { font-size: .84rem; line-height: 1.65; }
}

.site-footer {
  padding: 42px max(4vw, 24px) 30px !important; color: #C8D2CE !important;
  background: #102A43 !important; text-align: left;
}
.footer-inner {
  display: grid; grid-template-columns: minmax(260px, 1fr) minmax(400px, auto);
  gap: 10px 48px; max-width: 1120px; margin: 0 auto;
}
.footer-brand { display: flex; align-items: center; gap: 13px; }
.footer-mark {
  display: block; flex: none; width: 42px; height: 42px; border-radius: 50%;
  background: #FBF2E2 url("design/atsumaru-mark-f2.webp") center / cover no-repeat;
  box-shadow: 0 0 0 1px rgba(255,255,255,.18);
}
.footer-brand > span:last-child { display: grid; gap: 2px; }
.footer-brand small { color: #AFC0B9; font-size: .68rem; font-weight: 700; letter-spacing: .11em; }
.footer-brand strong {
  color: #FFF; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1.32rem; letter-spacing: .09em;
}
.footer-copy { margin: 2px 0 0 55px; color: #AFC0B9; font-size: .82rem; }
.footer-links {
  grid-column: 2; grid-row: 1 / 3; display: grid; grid-template-columns: repeat(2, minmax(0, auto));
  align-content: start; gap: 8px 24px;
}
.site-footer .footer-links a {
  color: #E9EFEC; font-size: .75rem; font-weight: 700; text-decoration: none;
}
.site-footer .footer-links a:hover { color: #F0A271; }
.footer-note {
  grid-column: 1 / -1; margin: 24px 0 0; padding-top: 18px;
  color: #849993; font-size: .67rem; border-top: 1px solid rgba(255,255,255,.13);
}

body.public-page h1,
body.public-page h2,
.landing h1,
.landing h2 { text-wrap: balance; }
body.public-page .form input,
body.public-page .form select,
body.public-page .form textarea { min-height: 44px; }
body.public-page a:focus-visible,
body.public-page button:focus-visible,
body.landing a:focus-visible,
body.landing button:focus-visible,
body.landing input:focus-visible {
  outline: 3px solid rgba(228, 91, 22, .42); outline-offset: 3px;
}

@media (max-width: 900px) {
  .landing-routebar { margin-inline: 16px; }
  .landing-routebar a { padding-inline: 17px; }
  .landing-context { padding-inline: 34px; }
  .footer-inner { grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.2fr); gap-inline: 32px; }
}

@media (max-width: 700px) {
  body.landing > header .brand,
  body.public-page > header .brand { min-height: 40px; padding-left: 41px; }
  body.landing > header .brand::before,
  body.public-page > header .brand::before { width: 28px; height: 28px; }
  .brand-copy small { font-size: .56rem; letter-spacing: .07em; }
  .brand-copy strong { font-size: 1.08rem; letter-spacing: .06em; }

  .landing-routebar { margin: -1px 7px 24px; }
  .landing-routebar a {
    display: flex; min-width: 0; gap: 6px; justify-content: center; align-items: baseline;
    padding: 13px 5px; text-align: center;
  }
  .landing-routebar a > span { font-size: .72rem; }
  .landing-routebar strong { font-size: .72rem; white-space: nowrap; }
  .landing-routebar small { display: none; }

  .landing .experience-section { padding: 38px 18px 42px; }
  .landing .section-heading h2 { font-size: 1.75rem; line-height: 1.42; }
  .landing-cards { grid-template-columns: minmax(0, 1fr); }
  .landing .landing-cards .card-hero { height: 150px; }

  .landing-context { margin-top: 24px !important; padding: 54px 18px 42px; }
  .landing-context .audience-benefits { margin-top: 25px !important; }
  .landing-context .audience-benefits article { padding: 20px 17px; }
  .landing-context .industry-band { padding-top: 25px; }
  .landing-context .industry-band p { font-size: .84rem; }
  .landing-context .industry-band div { gap: 6px; }
  .landing-context .industry-band span { padding: 3px 9px; font-size: .67rem; }

  .landing .steps-wrap { padding: 56px 12px; }
  .trust-wrap .section-heading h2 { font-size: 1.65rem; line-height: 1.4; }
  .trust-wrap .section-heading h2 span { display: block; }
  .trust-grid article { min-height: 0; padding: 24px 20px; }
  .trust-grid article > span { top: 27px; right: 20px; }

  .landing .biz { margin-bottom: 34px; }
  .page-lead { display: block; }
  .page-lead h1 { width: auto; }
  .site-footer { padding: 36px 24px 26px !important; }
  .footer-inner { grid-template-columns: 1fr; gap: 10px; }
  .footer-copy { margin-left: 55px; }
  .footer-links {
    grid-column: 1; grid-row: auto; grid-template-columns: 1fr 1fr;
    margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.13);
  }
  .footer-note { grid-column: 1; margin-top: 16px; }
}

@media (max-width: 430px) {
  .brand-copy small { max-width: 7.8rem; white-space: nowrap; }
  .landing-routebar strong { font-size: .68rem; }
  .footer-links { grid-template-columns: 1fr; }
}