@charset "UTF-8";
/* ============================================================
   九星気学 鑑定ルーム
   「全星全能ポラリス」と同じ作法（游ゴシック・clamp・金の細線）に、
   墨と土の色をのせています。
   ============================================================ */

:root{
  /* ── 赤紫と金 ──
     背景の色を変えたいときは、この3つを変えてください。 */
  --bg        : #220A1C;   /* いちばん深い赤紫 */
  --bg-2      : #300F28;   /* 赤紫（やや明るい） */
  --bg-3      : #3C1532;   /* 箱の中の面 */

  --text      : #FFFFFF;   /* 白 */
  --text-dim  : #DFD4DC;   /* 控えめな白 */

  --gold      : #D9BB77;   /* 金 */
  --gold-2    : #F2DFAC;   /* 金のひかり（ふちや光沢に） */
  --gold-3    : #A8863F;   /* 金のかげ */
  --gold-soft : rgba(217,187,119,.55);

  --shu       : #FF9178;   /* 朱（凶・注意） */
  --midori    : #A8D49A;   /* 緑（吉） */
  --line-1    : rgba(242,223,172,.26);
  --line-2    : rgba(242,223,172,.13);

  /* ── 九星の文字色 ──
     赤紫・金・白の3色でそろえているので、九星はすべて白にしています。
     五行ごとに色を分けたくなったら、下の5つを
       水 #8FB6E0 ／ 土 #CE9552 ／ 木 #93C87F ／ 金 #DAD6CC ／ 火 #F08A72
     に戻すだけで、五行の色に切りかわります。 */
  --g-sui     : #FFFFFF;   /* 水 */
  --g-do      : #FFFFFF;   /* 土 */
  --g-moku    : #FFFFFF;   /* 木 */
  --g-kin     : #FFFFFF;   /* 金 */
  --g-ka      : #FFFFFF;   /* 火 */

  /* ── 文字 ── */
  --font:"Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体",
         "Yu Gothic","游ゴシック","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",
         Meiryo,"メイリオ",sans-serif;
  --mincho:"Yu Mincho","游明朝","YuMincho","Hiragino Mincho ProN",
           "ヒラギノ明朝 ProN W3","MS PMincho",serif;
  --pad: 14px;
}

*,*::before,*::after{box-sizing:border-box}
html{ -webkit-text-size-adjust:100% }
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  line-height:2;
  letter-spacing:.07em;
  overflow-x:hidden;
}
/* ページのいちばん上に、金の細い帯 */
body::before{
  content:""; position:fixed; inset:0 0 auto 0; height:3px; z-index:40;
  background:linear-gradient(90deg,var(--gold-3),var(--gold-2) 22%,var(--gold) 50%,var(--gold-2) 78%,var(--gold-3));
  pointer-events:none;
}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none !important}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit}

/* ============================================================
   背景（和紙の地に、方位盤の線をうっすら）
   ============================================================ */
.ground{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(1100px 620px at 72% 10%, rgba(242,223,172,.17), transparent 60%),
    radial-gradient(880px 560px at 12% 74%, rgba(196,54,124,.16), transparent 64%),
    radial-gradient(760px 620px at 50% 46%, rgba(118,20,80,.26), transparent 72%),
    linear-gradient(180deg, #2E0D26 0%, #220A1C 46%, #15050F 100%);
}
/* 和紙の繊維 */
.ground::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(94deg, rgba(242,223,172,.040) 0 1px, transparent 1px 8px),
    repeating-linear-gradient(176deg, rgba(242,223,172,.028) 0 1px, transparent 1px 10px);
  opacity:.9;
}
/* うっすら浮かぶ方位盤 */
.ground::after{
  content:""; position:absolute;
  width:min(78vmin,760px); aspect-ratio:1;
  right:-10vmin; top:8vh;
  border:1px solid rgba(242,223,172,.14);
  background-image:
    linear-gradient(to right,  rgba(242,223,172,.09) 0 1px, transparent 1px),
    linear-gradient(to bottom, rgba(242,223,172,.09) 0 1px, transparent 1px);
  background-size:33.333% 33.333%;
  transform:rotate(-6deg);
  opacity:.75;
}

/* ============================================================
   土台
   ============================================================ */
/* ★スマホ幅の1列。パソコンでも同じ見た目になります */
.wrap{ position:relative; z-index:1; max-width:560px; margin:0 auto; padding:0 var(--pad) }
.narrow{ max-width:560px; margin-inline:auto }

/* ============================================================
   入口（合言葉）
   ============================================================ */
#gate{
  position:fixed; inset:0; z-index:50;
  display:grid; place-items:center; padding:1.5rem;
  background:linear-gradient(180deg,#14110D 0%,#1E1A14 60%,#100E0A 100%);
}
.gate__box{
  width:min(440px,100%); text-align:center;
  border:1px solid var(--line-1);
  background:rgba(20,17,13,.72);
  padding:clamp(1.8rem,5vw,2.8rem) clamp(1.3rem,4vw,2.2rem);
}
.gate__mark{
  width:88px; height:88px; margin:0 auto 1.1rem;
  display:grid; place-items:center; border-radius:50%;
  border:1px solid var(--gold);
  box-shadow:0 0 0 4px rgba(242,223,172,.10), inset 0 0 18px rgba(242,223,172,.10);
  font-family:var(--mincho); font-size:2rem; color:var(--gold);
  letter-spacing:0;
}
.gate__name{ font-family:var(--mincho); font-size:1.5rem; margin:0 0 .2rem; letter-spacing:.2em }
.gate__en{ color:var(--text-dim); font-size:.72rem; letter-spacing:.24em; margin:0 0 1.4rem }
.gate__lead{ font-size:.86rem; color:var(--text-dim); line-height:1.9; margin:0 0 1.5rem }
.gate__label{ display:block; font-size:.66rem; letter-spacing:.26em; color:var(--text-dim); margin-bottom:.5rem }
.pw-wrap{ position:relative }
.pw-wrap input{
  width:100%; padding:.85rem 2.9rem .85rem 1rem;
  background:rgba(242,237,225,.05); color:var(--text);
  border:1px solid var(--line-1); border-radius:0;
  font-size:1rem; text-align:center; letter-spacing:.16em;
}
.pw-wrap input:focus{ outline:none; border-color:var(--gold-soft) }
.pw-eye{
  position:absolute; right:.5rem; top:50%; transform:translateY(-50%);
  background:none; border:0; color:var(--text-dim); cursor:pointer; padding:.4rem; line-height:0;
}
.gate__error{ color:var(--shu); font-size:.8rem; min-height:1.6em; margin:.7rem 0 0 }
.gate__note{ font-size:.7rem; color:var(--text-dim); line-height:1.8; margin:1.3rem 0 0 }

/* ============================================================
   ボタン
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  width:100%; margin-top:1.1rem; padding:.9rem 1.4rem;
  background:linear-gradient(135deg,var(--gold-2) 0%,var(--gold) 48%,var(--gold-3) 100%);
  color:#2A0A1E;
  border:0; border-radius:0; cursor:pointer;
  box-shadow:0 2px 10px rgba(217,187,119,.22);
  font-size:.92rem; font-weight:700; letter-spacing:.14em;
  transition:filter .2s, transform .2s;
}
.btn:hover{ filter:brightness(1.08) }
.btn:active{ transform:translateY(1px) }
.btn--ghost{
  background:rgba(242,223,172,.05); color:var(--text);
  border:1px solid var(--gold-soft); font-weight:400; box-shadow:none;
}
.btn--ghost:hover{ border-color:var(--gold-soft); color:var(--gold) }
.btn--sm{ width:auto; margin-top:0; padding:.55rem 1.1rem; font-size:.78rem }
.btn__arrow{ transition:transform .2s }
.btn:hover .btn__arrow{ transform:translateX(3px) }

/* ============================================================
   見出し
   ============================================================ */
.hero{ padding:clamp(3.5rem,11vh,7rem) 0 clamp(2rem,6vh,3.5rem); text-align:center }
.hero__eyebrow{ font-size:.68rem; letter-spacing:.32em; color:var(--gold); margin:0 0 1.1rem }
.hero__h{
  font-family:var(--mincho); font-weight:400;
  font-size:clamp(1.6rem,5.4vw,2.7rem); line-height:1.6;
  letter-spacing:.14em; margin:0 0 1.2rem;
}
.hero__lead{ font-size:.9rem; color:var(--text-dim); line-height:2.1; margin:0 auto; max-width:34em }
.rule{ width:1px; height:clamp(2.5rem,7vh,4.5rem); margin:0 auto; background:linear-gradient(var(--gold-2),transparent) }

.sec{ padding:clamp(2.5rem,8vh,4.5rem) 0 }
.sec__h{
  font-family:var(--mincho); font-weight:400;
  font-size:clamp(1.15rem,3.4vw,1.55rem); letter-spacing:.16em;
  margin:0 0 .4rem; display:flex; align-items:center; gap:.7rem;
}
.sec__h::before{ content:""; width:1.8rem; height:1px; background:linear-gradient(90deg,var(--gold-3),var(--gold-2)); flex:none }
.sec__sub{ font-size:.8rem; color:var(--text-dim); margin:0 0 1.8rem; padding-left:2.3rem }

/* ============================================================
   部屋のカード（入口のメニュー）
   ============================================================ */
.rooms{ display:grid; gap:1px; background:var(--line-2); grid-template-columns:1fr }
.room{ background:var(--bg-2) }
.room__link{ display:block; padding:clamp(1.5rem,4vw,2.1rem); height:100%; transition:background .25s }
.room__link:hover{ background:var(--bg-3) }
.room__badge{
  width:3.1rem; height:3.1rem; display:grid; place-items:center;
  border:1px solid var(--gold); margin-bottom:1.1rem;
  background:linear-gradient(135deg, rgba(242,223,172,.14), rgba(242,223,172,.02));
  box-shadow:inset 0 0 12px rgba(242,223,172,.12);
  font-family:var(--mincho); color:var(--gold-2); font-size:1.15rem; letter-spacing:0;
}
.room__no{ font-size:.62rem; letter-spacing:.2em; color:var(--text-dim); display:block; margin-bottom:.35rem }
.room__h{ font-family:var(--mincho); font-weight:400; font-size:1.1rem; letter-spacing:.1em; margin:0 0 .2rem }
.room__en{ font-size:.63rem; letter-spacing:.2em; color:var(--gold); margin:0 0 .9rem }
.room__b{ font-size:.8rem; color:var(--text-dim); line-height:1.95; margin:0 0 1.1rem }
.room__go{ font-size:.76rem; color:var(--gold); letter-spacing:.1em }
.room--soon .room__link{ cursor:default; opacity:.5 }
.room--soon .room__link:hover{ background:var(--bg-2) }

/* ============================================================
   もどるリンク・ページの頭
   ============================================================ */
.topbar{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.1rem var(--pad); border-bottom:1px solid var(--gold-soft);
  background:linear-gradient(180deg, rgba(60,21,50,.55), transparent);
}
.topbar__back{ font-size:.78rem; color:var(--text-dim); letter-spacing:.1em }
.topbar__back:hover{ color:var(--gold) }
.topbar__name{ font-family:var(--mincho); font-size:.86rem; letter-spacing:.18em; color:var(--gold) }

/* ============================================================
   入力のかたち
   ============================================================ */
.panel{
  background:linear-gradient(180deg, rgba(60,21,50,.92), rgba(42,13,34,.92));
  border:1px solid var(--line-1);
  box-shadow:inset 0 1px 0 rgba(242,223,172,.12);
  padding:clamp(1.3rem,4vw,2.2rem);
}
.panel + .panel{ margin-top:1.3rem }
.field{ margin-bottom:1.3rem }
.field:last-child{ margin-bottom:0 }
.field > label,.field__label{
  display:block; font-size:.74rem; letter-spacing:.14em;
  color:var(--text-dim); margin-bottom:.5rem;
}
.field__note{ font-size:.72rem; color:var(--text-dim); line-height:1.8; margin:.45rem 0 0 }
input[type="text"],input[type="number"],select,textarea{
  width:100%; padding:.72rem .9rem;
  background:rgba(242,237,225,.05); color:var(--text);
  border:1px solid var(--line-1); border-radius:0; font-size:.95rem;
}
input:focus,select:focus,textarea:focus{ outline:none; border-color:var(--gold-soft) }
select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--text-dim) 50%),linear-gradient(135deg,var(--text-dim) 50%,transparent 50%);
  background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:2.2rem }
.ymd{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:.6rem }
.ymd input{ text-align:center }
.ymd input::-webkit-inner-spin-button,.ymd input::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0 }
.ymd input{ -moz-appearance:textfield }
.hm{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; max-width:16rem }
.hm input{ text-align:center }
.row{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center }
.err{ color:var(--shu); font-size:.82rem; margin:.8rem 0 0; min-height:1.5em }
.msg{ font-size:.8rem; color:var(--gold); margin:.7rem 0 0; min-height:1.5em }
.msg--warn{ color:var(--shu) }

/* 保存した方 */
.people{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.8rem }
.chip{
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid var(--line-1); background:rgba(242,237,225,.04);
  padding:.4rem .7rem; font-size:.78rem; cursor:pointer;
}
.chip:hover{ border-color:var(--gold-soft); color:var(--gold) }
.chip__x{ color:var(--text-dim); font-size:.9rem; line-height:1; padding:0 .1rem }
.chip__x:hover{ color:var(--shu) }
.people__empty{ font-size:.78rem; color:var(--text-dim) }

/* ============================================================
   鑑定結果
   ============================================================ */
.result{ margin-top:2rem }
.card{
  background:linear-gradient(180deg, rgba(60,21,50,.92), rgba(42,13,34,.92));
  border:1px solid var(--line-1);
  box-shadow:inset 0 1px 0 rgba(242,223,172,.14), 0 2px 14px rgba(0,0,0,.28);
  padding:clamp(1.3rem,4vw,2rem); margin-bottom:1.3rem;
}
.card__h{
  font-family:var(--mincho); font-weight:400; font-size:1.02rem;
  letter-spacing:.14em; margin:0 0 1.1rem; padding-bottom:.7rem;
  border-bottom:0; color:var(--gold-2); position:relative;
}
.card__h::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg,var(--gold),rgba(217,187,119,.08));
}

/* 三本柱（本命星・月命星・傾斜） */
.pillars{ display:grid; gap:1px; background:var(--line-2); grid-template-columns:1fr 1fr }
.pillar{ background:var(--bg-3); padding:1.4rem 1.2rem; text-align:center }
.pillar__k{ font-size:.68rem; letter-spacing:.22em; color:var(--text-dim); margin:0 0 .9rem }
.pillar__star{
  width:4.6rem; height:4.6rem; margin:0 auto .8rem;
  display:grid; place-items:center;
  border:1px solid currentColor; border-radius:50%;
  box-shadow:0 0 0 3px rgba(242,223,172,.14), inset 0 0 14px rgba(242,223,172,.10);
  font-family:var(--mincho); font-size:1.5rem; letter-spacing:0;
}
.pillar__v{ font-family:var(--mincho); font-size:1.18rem; letter-spacing:.1em; margin:0 0 .25rem }
.pillar__s{ font-size:.73rem; color:var(--text-dim); margin:0; line-height:1.8 }

/* 五行の色 */
.g-水{ color:var(--g-sui) }
.g-土{ color:var(--g-do) }
.g-木{ color:var(--g-moku) }
.g-金{ color:var(--g-kin) }
.g-火{ color:var(--g-ka) }

/* 事実の一覧 */
.facts{ display:grid; gap:1px; background:var(--line-2); grid-template-columns:1fr }
.fact{ background:var(--bg-3); padding:.95rem 1.1rem }
.fact__k{ font-size:.68rem; letter-spacing:.16em; color:var(--text-dim); margin:0 0 .3rem }
.fact__v{ font-size:.92rem; margin:0; line-height:1.8 }

/* 箇条書き */
.list{ margin:0; padding:0; list-style:none }
.list li{ position:relative; padding-left:1.15rem; font-size:.87rem; line-height:2.05 }
.list li::before{ content:""; position:absolute; left:0; top:1em; width:.42rem; height:1px; background:var(--gold-2) }
.tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0; list-style:none }
.tags li{ border:1px solid var(--line-1); padding:.25rem .6rem; font-size:.78rem; color:var(--text-dim) }
.block{ margin-bottom:1.5rem }
.block:last-child{ margin-bottom:0 }
.block__h{ font-size:.76rem; letter-spacing:.16em; color:var(--gold-2); margin:0 0 .6rem }
.lead-line{ font-family:var(--mincho); font-size:1.05rem; line-height:2; letter-spacing:.08em; margin:0 0 1.3rem; color:var(--text) }

/* ============================================================
   九星盤（3×3・南が上）
   ============================================================ */
.ban-wrap{ display:grid; gap:1.4rem; grid-template-columns:1fr }
.ban-box{ min-width:0 }
.ban,.cell{ min-width:0 }
.ban-box{ text-align:center }
.ban-title{ font-size:.76rem; letter-spacing:.14em; color:var(--gold); margin:0 0 .2rem }
.ban-note{ font-size:.72rem; color:var(--text-dim); margin:0 0 .8rem }
.ban{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line-1); border:1px solid var(--gold);
  box-shadow:0 0 0 1px rgba(242,223,172,.18), 0 3px 16px rgba(0,0,0,.3);
  max-width:300px; margin:0 auto;
}
.cell{
  background:linear-gradient(180deg,#43183A,#36122E); aspect-ratio:1;
  display:grid; place-content:center; gap:.1rem; padding:.3rem;
  position:relative;
}
.cell__dir{ font-size:.6rem; letter-spacing:.08em; color:var(--text-dim); line-height:1.4 }
.cell__star{ font-family:var(--mincho); font-size:1.18rem; letter-spacing:0; line-height:1.3 }
.cell__kyu{ font-size:.58rem; color:var(--text-dim); letter-spacing:.04em; line-height:1.4 }
.cell--me{ background:linear-gradient(180deg,#6A4A24,#4E3318); box-shadow:inset 0 0 0 2px var(--gold-2), 0 0 12px rgba(242,223,172,.25) }
.cell--me .cell__dir,.cell--me .cell__kyu{ color:#F0E2BE }
.cell--center{ background:linear-gradient(180deg,#54224A,#3F1636); box-shadow:inset 0 0 0 1px rgba(242,223,172,.3) }
.cell--center .cell__star{ color:var(--gold-2) }
/* 吉方位・凶方位のお部屋で使う色 */
.cell--kyo{ background:linear-gradient(180deg,#5A1A2C,#431222); box-shadow:inset 0 0 0 1px rgba(255,145,120,.55) }
.cell--kichi{ background:linear-gradient(180deg,#1F3B2C,#162A20); box-shadow:inset 0 0 0 1px rgba(168,212,154,.6) }
.cell__tag{ font-size:.55rem; letter-spacing:0; line-height:1.35; color:var(--shu); text-align:center }
.cell--kichi .cell__tag{ color:var(--midori) }
.cell--me.cell--kyo,.cell--me.cell--kichi{ box-shadow:inset 0 0 0 2px var(--gold-2), 0 0 12px rgba(242,223,172,.25) }
/* 吉凶の一覧 */
.houi{ display:grid; gap:1px; background:var(--line-2); margin:0 }
.houi__row{ background:var(--bg-3); display:grid; grid-template-columns:7.5rem 5rem 1fr; gap:.8rem; padding:.7rem 1rem; align-items:baseline }
.houi__n{ font-size:.82rem; font-weight:700 }
.houi__n--kyo{ color:var(--shu) }
.houi__n--kichi{ color:var(--midori) }
.houi__d{ font-size:.86rem }
.houi__w{ font-size:.76rem; color:var(--text-dim); line-height:1.75 }
@media (max-width:520px){
  .houi__row{ grid-template-columns:1fr; gap:.15rem }
}
.ban-legend{ font-size:.72rem; color:var(--text-dim); margin:.8rem 0 0; line-height:1.8 }

/* 注意の帯 */
.notice{
  border:1px solid var(--gold-soft); background:rgba(242,223,172,.07);
  padding:1rem 1.2rem; font-size:.82rem; line-height:1.95; margin-bottom:1.3rem;
}
.notice--warn{ border-color:rgba(255,145,120,.45); background:rgba(180,40,70,.18) }
.notice__h{ font-size:.76rem; letter-spacing:.14em; color:var(--gold-2); margin:0 0 .4rem }
.notice--warn .notice__h{ color:var(--shu) }
.notice p{ margin:0 0 .5rem }
.notice p:last-child{ margin:0 }

/* 節入り一覧 */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch }
table.sekki{ border-collapse:collapse; width:100%; min-width:430px; font-size:.8rem }
table.sekki th,table.sekki td{ border:1px solid var(--line-2); padding:.45rem .6rem; text-align:left; white-space:nowrap }
table.sekki th{ color:var(--text-dim); font-weight:400; font-size:.72rem; letter-spacing:.1em; background:var(--bg-3) }
table.sekki tr.is-me td{ background:#5A3E1E; color:#F8F2EA }
table.sekki tr.is-star td{ background:#4A1B3E }
table.sekki tr.is-me.is-star td{ background:#5A3E1E }
table.sekki td.mid{ color:var(--shu) }

/* プロンプト */
.prompt-box{
  width:100%; min-height:16rem; resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.78rem; line-height:1.85; letter-spacing:.02em;
}
.prompt-tools{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.9rem; align-items:center }

/* 足もと */
.foot{ border-top:1px solid var(--line-2); padding:2.2rem 0 3rem; text-align:center }
.foot p{ font-size:.72rem; color:var(--text-dim); margin:.2rem 0; line-height:1.9 }

/* ============================================================
   PDF・印刷（白い紙に、黒い文字で）
   ------------------------------------------------------------
   ★色の変数ごと白黒に置きかえるので、本文中の
     style="color:var(--text-dim)" のような指定も、まとめて読める色になります。
   ============================================================ */
@page{ size:A4; margin:14mm 12mm }

@media print{
  :root{
    --bg        : #FFFFFF;
    --bg-2      : #FFFFFF;
    --bg-3      : #F7F5F2;
    --text      : #1A1A1A;
    --text-dim  : #585858;
    --gold      : #7A6028;
    --gold-2    : #5E4A1C;
    --gold-3    : #A08A50;
    --gold-soft : #C4B88E;
    --shu       : #A32C18;
    --midori    : #2C6638;
    --line-1    : #C9C9C9;
    --line-2    : #E3E3E3;
    --g-sui:#1A1A1A; --g-do:#1A1A1A; --g-moku:#1A1A1A; --g-kin:#1A1A1A; --g-ka:#1A1A1A;
  }

  .ground,.topbar,.panel,.prompt-tools,.no-print,#gate,.hero,.jump,.foot{ display:none !important }
  body::before{ display:none }

  body{ background:#fff; color:#1A1A1A; line-height:1.75; letter-spacing:.02em }
  .wrap{ max-width:none; padding:0 }
  .narrow{ max-width:none }

  /* ── PDFのいちばん上の見出し ── */
  .print-head{ display:block !important; margin:0 0 8mm; border-bottom:1.5pt solid #7A6028; padding-bottom:3mm }
  .print-head__t{ font-family:var(--mincho); font-size:15pt; letter-spacing:.14em; margin:0 0 2mm }
  .print-head__n{ font-size:12pt; margin:0 0 1mm }
  .print-head__d{ font-size:9pt; color:#585858; margin:0 }

  /* ── 箱 ── */
  .card{
    background:#fff; border:0.6pt solid #C9C9C9; box-shadow:none;
    break-inside:avoid; page-break-inside:avoid;
    margin:0 0 5mm; padding:4mm;
  }
  .card__h{ color:#5E4A1C; border-bottom:0.6pt solid #DDD; font-size:11.5pt; margin-bottom:3mm; padding-bottom:2mm }
  .card__h::after{ display:none }

  /* ── 中身 ── */
  .pillars,.facts,.houi,.yomi{ background:#C9C9C9; gap:0.6pt }
  .pillar,.fact,.houi__row,.yomi__row{ background:#F7F5F2 }
  .pillar__star{ box-shadow:none; border:0.6pt solid #7A6028 }
  .yomi__row--clear{ background:#EFF4EE }

  /* ── 盤 ── */
  .ban{ border:0.8pt solid #7A6028; box-shadow:none; background:#C9C9C9; max-width:62mm }
  .cell{ background:#FFF; box-shadow:none }
  .cell--center{ background:#F0EDE6; box-shadow:none }
  .cell--me{ background:#EDE6D4; box-shadow:inset 0 0 0 1pt #7A6028 }
  .cell--kyo{ background:#F6E7E3; box-shadow:inset 0 0 0 .8pt #A32C18 }
  .cell--kichi{ background:#E8F0E7; box-shadow:inset 0 0 0 .8pt #2C6638 }
  .ban-wrap{ gap:5mm }

  /* ── 帯・表 ── */
  .notice{ background:#FAF7EF; border:0.6pt solid #CBBB8E }
  .notice--warn{ background:#FBF0EE; border-color:#D8A79B }
  table.sekki{ font-size:8.5pt }
  table.sekki th{ background:#F0EDE6 }
  table.sekki th,table.sekki td{ border:0.5pt solid #D5D5D5 }
  table.sekki tr.is-me td{ background:#EDE6D4; color:#1A1A1A }
  table.sekki tr.is-star td{ background:#F3EFE6 }
  .table-scroll{ overflow:visible }

  /* ── 鑑定文 ── */
  .bunsho-box,.bunsho-tools,.bunsho-count{ display:none !important }
  .bunsho-print{
    display:block !important; white-space:pre-wrap;
    font-size:10.5pt; line-height:1.85; color:#1A1A1A;
  }

  /* ── 署名 ── */
  .print-sig{ display:block !important; color:#8A8A8A; font-size:8pt; text-align:right; margin-top:4mm }
}
.print-head{ display:none }
.print-sig{ display:none }

/* ============================================================
   スマホの見た目（これがこのサイトの本番です）
   ------------------------------------------------------------
   ★パソコンで開いても、スマホと同じ見た目になるようにしています。
     （幅のひろい画面では、まんなかにスマホ幅の1列で出ます）
   ・画面のはしの余白をせまくして、中身を広く使います
   ・文字は12px未満を作りません（読みづらいので）
   ・入力欄は16px以上（これ未満だとiPhoneで勝手に拡大されます）
   ・ボタンは指でさわれるよう、たて48px以上
   ============================================================ */
  body{ line-height:1.9; letter-spacing:.04em }
  .ground::after{ display:none }

  /* ── 見出し ── */
  .hero{ padding:2.4rem 0 1.5rem }
  .hero__eyebrow{ font-size:.76rem; letter-spacing:.18em; margin-bottom:.8rem }
  .hero__h{ font-size:1.55rem; letter-spacing:.1em; margin-bottom:.9rem }
  .hero__lead{ font-size:.92rem; line-height:1.95 }
  .sec{ padding:2rem 0 }
  .sec__h{ font-size:1.18rem }
  .sec__sub{ font-size:.86rem; padding-left:0; margin-bottom:1.2rem }

  /* ── 箱 ── */
  .card,.panel{ padding:1.1rem .95rem }
  .card__h{ font-size:1.02rem; margin-bottom:.9rem }
  .topbar{ padding:.85rem var(--pad) }
  .topbar__back{ font-size:.86rem }
  .topbar__name{ font-size:.86rem }

  /* ── 入力 ── */
  .field > label,.field__label{ font-size:.87rem; margin-bottom:.45rem }
  .field__note{ font-size:.83rem; line-height:1.85 }
  input[type="text"],input[type="number"],select,textarea{
    font-size:16px; padding:.85rem .8rem;   /* 16px未満はiPhoneが拡大します */
  }
  .ymd{ grid-template-columns:1.25fr 1fr 1fr; gap:.4rem }
  .hm{ max-width:none }
  .err,.msg{ font-size:.88rem }
  .chip{ font-size:.87rem; padding:.55rem .75rem }
  .people__empty{ font-size:.87rem }

  /* ── ボタンは大きく、たて並びに ── */
  .btn{ font-size:.95rem; padding:.95rem 1.1rem }
  .btn--sm{ width:100%; min-height:48px; font-size:.92rem; padding:.8rem 1rem }
  .row{ gap:.5rem }
  .row > .btn--sm{ flex:1 1 100% }
  /* 前の日／今日／次の日 は横3つのまま */
  .row--nav{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:.4rem }
  .row--nav > .btn--sm{ width:auto; font-size:.84rem; padding:.7rem .3rem }

  /* ── 盤を大きく ── */
  .ban{ max-width:100% }
  .cell{ padding:.25rem }
  .cell__dir{ font-size:.75rem }
  .cell__star{ font-size:1.4rem }
  .cell__kyu{ font-size:.75rem }
  .cell__tag{ font-size:.7rem; word-break:break-all }
  .ban-title{ font-size:.87rem }
  .ban-note{ font-size:.81rem }
  .ban-legend{ font-size:.81rem; line-height:1.85 }
  .ban-wrap{ gap:1.6rem }

  /* ── 四つの星は2×2に ── */
  .pillars{ grid-template-columns:1fr 1fr }
  .pillar{ padding:1rem .5rem }
  .pillar__k{ font-size:.78rem; letter-spacing:.14em; margin-bottom:.6rem }
  .pillar__star{ width:3.5rem; height:3.5rem; font-size:1.25rem; margin-bottom:.6rem }
  .pillar__v{ font-size:1.0rem; letter-spacing:.04em }
  .pillar__s{ font-size:.8rem; line-height:1.7 }

  /* ── 事実の一覧 ── */
  .fact{ padding:.8rem .9rem }
  .fact__k{ font-size:.79rem; letter-spacing:.08em }
  .fact__v{ font-size:.95rem; line-height:1.75 }

  /* ── 文章 ── */
  .list li{ font-size:.92rem; line-height:1.95 }
  .tags li{ font-size:.85rem; padding:.3rem .6rem }
  .notice{ font-size:.89rem; padding:.9rem 1rem; line-height:1.9 }
  .notice__h{ font-size:.85rem }
  .lead-line{ font-size:1.02rem; line-height:1.95 }
  .block__h{ font-size:.85rem }

  /* ── 表を画面に収める ── */
  table.sekki{ min-width:0; width:100%; font-size:.81rem }
  table.sekki th,table.sekki td{ padding:.45rem .3rem; white-space:normal; line-height:1.6 }
  table.sekki th{ font-size:.76rem; letter-spacing:.02em }

  /* ── 吉凶の一覧 ── */
  .houi__row{ grid-template-columns:1fr; gap:.15rem; padding:.8rem .9rem }
  .houi__n{ font-size:.92rem }
  .houi__d{ font-size:.95rem }
  .houi__w{ font-size:.85rem }

  /* ── 部屋のカード ── */
  .room__link{ padding:1.2rem 1rem }
  .room__badge{ width:2.8rem; height:2.8rem; font-size:1.05rem; margin-bottom:.8rem }
  .room__no{ font-size:.7rem }
  .room__h{ font-size:1.08rem }
  .room__en{ font-size:.7rem; margin-bottom:.7rem }
  .room__b{ font-size:.88rem; line-height:1.9 }
  .room__go{ font-size:.86rem }

  /* ── そのほか ── */
  .prompt-box{ font-size:.8rem; min-height:14rem }
  .foot p{ font-size:.79rem }
  .gate__box{ padding:1.6rem 1.1rem }

/* ============================================================
   鑑定文（ここに書いた文章が、そのままPDFに入ります）
   ============================================================ */
.bunsho-box{
  width:100%; min-height:22rem; resize:vertical;
  font-family:var(--font); font-size:16px; line-height:1.95; letter-spacing:.03em;
  background:rgba(255,255,255,.06); color:var(--text);
  border:1px solid var(--gold-soft); padding:.9rem .85rem;
}
.bunsho-box:focus{ outline:none; border-color:var(--gold-2) }
.bunsho-print{ display:none }
.bunsho-tools{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.8rem }
.bunsho-count{ font-size:.82rem; color:var(--text-dim); margin:.6rem 0 0 }

/* ============================================================
   方位の早見表（年・月・日・刻をまとめて見る）
   ============================================================ */
.yomi{ display:grid; gap:1px; background:var(--line-2) }
.yomi__row{ background:linear-gradient(180deg,#3F1735,#33112B); padding:.75rem .9rem }
.yomi__row--clear{ background:linear-gradient(180deg,#20382A,#16281E) }
.yomi__dir{ display:flex; align-items:baseline; gap:.6rem; margin-bottom:.5rem }
.yomi__d{ font-size:1.05rem; font-weight:700 }
.yomi__k{ font-size:.78rem; color:var(--text-dim) }
.yomi__ok{ font-size:.8rem; color:var(--midori); margin-left:auto }
.yomi__cs{ display:flex; flex-wrap:wrap; gap:.35rem }
.yomi__c{
  font-size:.8rem; border:1px solid var(--line-1);
  padding:.32rem .5rem; line-height:1.45;
}
.yomi__c b{ font-weight:400; color:var(--text-dim); margin-right:.3em }
.yomi__c--ok{ color:var(--midori); border-color:rgba(168,212,154,.4) }
.yomi__c--kyo{ color:var(--shu); border-color:rgba(255,145,120,.45) }
.yomi__c--ouki{ color:var(--midori); border-color:rgba(168,212,154,.7); background:rgba(168,212,154,.12) }

/* ============================================================
   鑑定書の中身へとぶリンク（長いページ用）
   ============================================================ */
.jump{
  border:1px solid var(--gold-soft);
  background:linear-gradient(180deg, rgba(242,223,172,.08), rgba(242,223,172,.02));
  padding:.9rem 1rem; margin-bottom:1.3rem;
}
.jump__h{ font-size:.78rem; letter-spacing:.14em; color:var(--gold-2); margin:0 0 .6rem }
.jump__list{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0; list-style:none }
.jump__list a{
  display:inline-flex; align-items:center; min-height:44px;   /* 指でさわれる大きさ */
  border:1px solid var(--line-1);
  padding:.4rem .8rem; font-size:.86rem; color:var(--text); line-height:1.4;
}
.jump__list a:hover{ border-color:var(--gold-soft); color:var(--gold) }