/* 展示室の骨格。角丸は使わない。影は壁に落ちる影だけ。 */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background-color:var(--wall)}
body{
  margin:0;
  /* 天井から光が落ちる分だけ上を明るくする。固定にしないので頁が長くても切れない */
  background:linear-gradient(180deg,var(--wall-lit) 0,rgba(243,240,234,0) 760px);
  color:var(--ink);
  font:400 var(--t-md)/var(--lh) var(--mincho);
  min-height:100vh;
  text-underline-offset:.24em;
}
svg.tooth{display:none}
main,header,footer{position:relative;z-index:2}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
img,svg{max-width:100%}
a{color:inherit;text-decoration:none}
p{margin:0 0 1.1em}
h1,h2,h3,h4{font-weight:400;margin:0}
::selection{background:var(--label-soft);color:var(--ink)}
:focus-visible{outline:1px solid var(--label);outline-offset:3px}

.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--gutter);top:10px;z-index:60;background:var(--plinth);padding:8px 14px;border:1px solid var(--ink)}

/* ------- 受付（画面の上に貼り付く） ------- */
.recep{position:sticky;top:0;z-index:20;background:rgba(243,240,234,.80);backdrop-filter:blur(12px);border-bottom:1px solid var(--hair-soft)}
.recep-in{max-width:var(--wrap);margin:0 auto;padding:22px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:var(--s-4)}
.recep .sign{display:flex;align-items:center;gap:12px}
.recep .sign svg{display:block}
.recep .sign small{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--ink-faint)}
.recep nav{display:flex;gap:var(--s-5);flex-wrap:wrap}
.recep nav a{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--ink-mid);padding-bottom:4px;border-bottom:1px solid transparent;transition:color var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease)}
.recep nav a:hover,.recep nav a[aria-current="page"]{color:var(--label);border-bottom-color:var(--label)}

/* ------- 玄関ホール ------- */
.hall{min-height:76vh;display:grid;align-content:center;justify-items:center;padding:var(--s-8) var(--gutter);text-align:center}
.hall .obj{filter:drop-shadow(var(--cast-1)) drop-shadow(var(--cast-2));margin-bottom:var(--s-5)}
.hall .obj svg{display:block}
.cap{margin-top:var(--s-6);text-align:left;border-left:1px solid var(--ink);padding-left:20px;max-width:440px}
.cap dl{margin:0}
.cap dt{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--ink-mid);margin-top:12px}
.cap dd{margin:3px 0 0;font-size:var(--t-md)}
.cap dd em{font-style:italic}

.title{font:400 var(--t-3xl)/var(--lh-tight) var(--latin),var(--mincho);font-style:italic;margin:0 auto var(--s-4);max-width:26ch;letter-spacing:.004em;text-wrap:balance}
.title b{font-style:normal;font-weight:400;color:var(--label);white-space:nowrap}
.lede{max-width:54ch;margin:0 auto;color:var(--ink-mid);font-size:var(--t-md);text-wrap:pretty}
.enter{margin-top:var(--s-6);display:inline-flex;gap:var(--s-5);align-items:center;flex-wrap:wrap;justify-content:center}
.enter a{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;padding-bottom:6px;border-bottom:1px solid var(--ink);transition:color var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease)}
.enter a.quiet{border-bottom-color:var(--hair);color:var(--ink-mid)}
.enter a:hover{color:var(--label);border-bottom-color:var(--label)}

/* ------- 展示室 ------- */
.room{padding:var(--s-7) 0;border-top:1px solid var(--hair);scroll-margin-top:84px}
.rh{display:flex;align-items:baseline;gap:var(--s-4);margin:0 0 var(--s-2);flex-wrap:wrap}
.rh h2{font:400 var(--t-xl)/var(--lh-tight) var(--mincho)}
.rh u{text-decoration:none;font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);color:var(--label)}
.rh span{margin-left:auto;font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-label);color:var(--ink-mid)}
.rd{color:var(--ink-mid);font-size:var(--t-sm);margin:0 0 var(--s-5);max-width:54ch;font-style:italic}

.plinths{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-6) var(--s-5);align-items:start}
@media (max-width:980px){.plinths{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.plinths{grid-template-columns:1fr}}
.pl{display:block}
.pl .art{height:136px;display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(var(--cast-3))}
.pl .art svg{display:block}
.pl .base{display:block;width:64%;margin:4px auto 0;height:1px;background:var(--ink);opacity:.62}
.pl .base::after{content:'';display:block;height:10px;background:linear-gradient(180deg,rgba(60,50,35,.13),rgba(60,50,35,0))}
.pl .lab{margin-top:22px}
.pl .lab u{display:block;text-decoration:none;font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-label);color:var(--label);margin-bottom:7px}
.pl .lab b{display:block;font-weight:400;font-size:var(--t-md);line-height:1.55}
.pl .lab p{margin:6px 0 0;font-size:12.5px;color:var(--ink-mid);line-height:1.78}
.pl a:hover .lab b{color:var(--label)}

.more{margin-top:var(--s-6);display:flex;flex-wrap:wrap;gap:0 var(--s-5)}
.more a{font-size:var(--t-sm);padding:7px 0;border-bottom:1px solid transparent}
.more a:hover{border-bottom-color:var(--label);color:var(--label)}

/* ------- ごあいさつ ------- */
.stmt{padding:var(--s-8) 0;border-top:1px solid var(--hair)}
.stmt .cols{display:grid;grid-template-columns:200px 1fr;gap:var(--s-6)}
.stmt h3{font:400 var(--t-plate)/1.9 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--ink-mid)}
.stmt p{font-size:var(--t-lg);line-height:var(--lh-loose);max-width:52ch;margin:0 0 var(--s-4)}
.stmt .three{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5);margin-top:var(--s-3)}
.stmt .three h4{margin:0 0 8px;font:400 var(--t-lg)/1.45 var(--mincho)}
.stmt .three p{margin:0;font-size:var(--t-sm);color:var(--ink-mid);line-height:1.9}
@media (max-width:860px){.stmt .cols{grid-template-columns:1fr;gap:var(--s-3)}.stmt .three{grid-template-columns:1fr}}

/* ------- 平面図 ------- */
.plan{padding:0 0 var(--s-8)}
.plan svg{width:100%;max-width:860px;height:auto;margin:0 auto;display:block}
.plan figcaption{text-align:center;margin-top:var(--s-3);font:400 var(--t-plate)/1.8 var(--plate);letter-spacing:var(--track-label);color:var(--ink-mid)}

/* ------- 出口 ------- */
footer{border-top:1px solid var(--hair);margin-top:var(--s-6)}
footer .wrap{padding-top:var(--s-5);padding-bottom:var(--s-5);display:flex;justify-content:space-between;gap:var(--s-4);flex-wrap:wrap;
  font:400 var(--t-plate)/1.8 var(--plate);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-mid)}
footer nav{display:flex;gap:var(--s-4);flex-wrap:wrap}
footer a:hover{color:var(--label)}


/* ------- 頁の見出し（目録・ご案内） ------- */
.chead{padding:var(--s-7) 0 var(--s-6)}
.chead .no{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--label);margin:0 0 var(--s-3)}
.chead h1{font:400 var(--t-3xl)/var(--lh-tight) var(--latin),var(--mincho);font-style:italic;margin:0 0 var(--s-3)}
.chead .lede{margin:0;max-width:52ch;text-align:left}

/* 受付の机（探す・絞る・並べる） */
.hall .eyebrow-plate{margin:0 0 var(--s-5);font-size:calc(var(--t-plate) + 1px)}
.eyebrow-plate{font:400 var(--t-plate)/1 var(--plate);letter-spacing:var(--track-plate);text-transform:uppercase;color:var(--ink-mid);margin:0 0 var(--s-4)}

/* ------- 共通の小物 ------- */
.muted{color:var(--ink-mid);font-size:var(--t-sm)}
.pill{display:inline-block;border:1px solid var(--hair);padding:3px 10px;font:400 var(--t-plate)/1.7 var(--plate);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-mid)}
.pill[data-state="off"]{border-color:var(--label);color:var(--label)}
kbd{font:400 11px/1 var(--mono);border:1px solid var(--hair);padding:2px 5px;background:var(--plinth)}
.prose{max-width:62ch}
.prose h2{font:400 var(--t-xl)/var(--lh-tight) var(--mincho);margin:var(--s-6) 0 var(--s-3)}
.prose h3{font:400 var(--t-lg)/1.5 var(--mincho);margin:var(--s-5) 0 var(--s-2)}
.prose ul{padding-left:1.2em;margin:0 0 1.1em}
.prose li{margin:.3em 0}
.prose a{border-bottom:1px solid var(--hair)}
.prose a:hover{border-bottom-color:var(--label);color:var(--label)}
.ledger{width:100%;border-collapse:collapse;font-size:var(--t-sm)}
.ledger th,.ledger td{text-align:left;padding:11px 14px 11px 0;border-bottom:1px solid var(--hair-soft);vertical-align:top}
.ledger th{font:400 var(--t-sm)/1.7 var(--mincho);color:var(--ink);white-space:nowrap}
.ledger thead th{font:400 var(--t-plate)/1.7 var(--plate);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-mid)}

/* 出現。展示室に入ると 1 点ずつ立ち上がる */
.rv{opacity:0;transform:translateY(14px);transition:opacity var(--dur-3) var(--ease),transform var(--dur-3) var(--ease)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}