/* app */
.leaflet-control-layers-toggle,.leaflet-retina .leaflet-control-layers-toggle{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233b4b45' stroke-width='1.8'%3E%3Cpath d='M3 7l9-4 9 4-9 4zM3 12l9 4 9-4M3 17l9 4 9-4'/%3E%3C/svg%3E");background-size:26px 26px;}
/* 山と湯マップ ─ 登山地図の余白に、湯までの道すじを刷る。
   左＝凡例の紙面（パネル）／右＝地図。等高線（主曲線・計曲線）と地形図の温泉記号を意匠の核にする */
:root{
  /* 紙・墨・苔・湯・湖 */
  --bg:#f6f3eb; --surface:#fffdf8; --surface-2:#f2f3eb; --sunk:#e7ece1;
  --ink:#263c31; --ink-2:#435448; --ink-3:#536153; --line:#d9ded1; --line-2:#e5e7dc;
  --moss:#204d3b; --moss-2:#326b50; --moss-l:#e7ede2; --moss-ink:#fffdf8;
  --yu:#a6472c; --yu-btn:#a6472c; --yu-l:#f5e8df; --yu-ink:#fffdf8;
  --lake:#1c5a86; --lake-l:#e2edf5; --lake-ink:#fffdf8;
  --ok:#11773f; --ok-l:#dcf1e4; --soon:#8a5800; --soon-l:#fbefd0; --off:#66756f; --off-l:#eaeeec; --before:#1c5a86; --before-l:#e2edf5;
  --star:#b87a00; --sun:#b3261e; --sat:#1c5a86;
  --contour:#1d5a45; --contour-a:.24; --ok-ink:#ffffff;
  /* 地図の下地（タイルが使えない環境） */
  --m-sea:#d3e3ea; --m-land:#e8ede5; --m-home:#fafbf7; --m-border:#95a597; --m-road:#e1b089; --m-mway:#cf8446; --m-river:#8db9d6; --m-lake:#bfd9e8; --m-label:#4f5f57;
  --shadow-1:0 1px 2px rgba(19,32,28,.06);
  --shadow-2:0 2px 4px rgba(19,32,28,.05),0 12px 32px -8px rgba(19,32,28,.16);
  --r:12px; --r-s:8px;
  --fs:17px;
  --f-display:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;
  --f-body:"BIZ UDPGothic","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,"Noto Sans JP",system-ui,sans-serif;
  --f-num:"Barlow Condensed","BIZ UDPGothic","Arial Narrow",sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0d1412; --surface:#141d1a; --surface-2:#18231f; --sunk:#0a0f0e;
    --ink:#e8efec; --ink-2:#b7c5bf; --ink-3:#8d9d96; --line:#29362f; --line-2:#1f2a26;
    --moss:#86d0ae; --moss-2:#5fb38f; --moss-l:#17312a; --moss-ink:#08130f;
    --yu:#ff8a5c; --yu-btn:#c04018; --yu-l:#3a2219; --yu-ink:#ffffff;
    --lake:#8fc4ea; --lake-l:#16293a; --lake-ink:#091824;
    --ok:#6ad39b; --ok-l:#14301f; --soon:#f2c457; --soon-l:#352b12; --off:#98a7a1; --off-l:#1e2825; --before:#8fc4ea; --before-l:#16293a;
    --star:#f2c14a; --sun:#ff8a80; --sat:#8fc4ea;
    --contour:#86d0ae; --contour-a:.15; --ok-ink:#07140d;
    --m-sea:#0c1920; --m-land:#18201d; --m-home:#1f2926; --m-border:#51625a; --m-road:#6f5842; --m-mway:#a2703f; --m-river:#36688a; --m-lake:#1c384b; --m-label:#9fb1a8;
    --shadow-1:0 1px 2px rgba(0,0,0,.4);
    --shadow-2:0 2px 4px rgba(0,0,0,.3),0 14px 32px -8px rgba(0,0,0,.55);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0d1412; --surface:#141d1a; --surface-2:#18231f; --sunk:#0a0f0e;
  --ink:#e8efec; --ink-2:#b7c5bf; --ink-3:#8d9d96; --line:#29362f; --line-2:#1f2a26;
  --moss:#86d0ae; --moss-2:#5fb38f; --moss-l:#17312a; --moss-ink:#08130f;
  --yu:#ff8a5c; --yu-btn:#c04018; --yu-l:#3a2219; --yu-ink:#ffffff;
  --lake:#8fc4ea; --lake-l:#16293a; --lake-ink:#091824;
  --ok:#6ad39b; --ok-l:#14301f; --soon:#f2c457; --soon-l:#352b12; --off:#98a7a1; --off-l:#1e2825; --before:#8fc4ea; --before-l:#16293a;
  --star:#f2c14a; --sun:#ff8a80; --sat:#8fc4ea;
  --contour:#86d0ae; --contour-a:.15; --ok-ink:#07140d;
  --m-sea:#0c1920; --m-land:#18201d; --m-home:#1f2926; --m-border:#51625a; --m-road:#6f5842; --m-mway:#a2703f; --m-river:#36688a; --m-lake:#1c384b; --m-label:#9fb1a8;
  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 2px 4px rgba(0,0,0,.3),0 14px 32px -8px rgba(0,0,0,.55);
}
html.fs-large{--fs:19px} html.fs-xlarge{--fs:21px}
html{font-size:var(--fs); height:100%; -webkit-text-size-adjust:100%}
*{box-sizing:border-box}
body{margin:0; min-height:100%; background:var(--bg); color:var(--ink); font-family:var(--f-body); line-height:1.7; font-feature-settings:"palt" 0; line-break:strict}
h1,h2,h3,.btn,.chip,.act,.empty,.mrow .n,.rank .rn,.tln,.bestbox .bn,.bestbox .bs,.st,.hero-lead,.lead,.mode button,.timebar .tlab,.sec,.blk-h,.popline a{word-break:auto-phrase}
button,input,select,textarea{font:inherit; color:inherit}
a{color:var(--lake); text-underline-offset:.18em; text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--lake); outline-offset:2px; border-radius:8px}
.num{font-variant-numeric:tabular-nums}
.numf{font-family:var(--f-num); font-variant-numeric:tabular-nums lining-nums; font-weight:600; letter-spacing:.01em}
[hidden]{display:none!important}
.vh{position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
::selection{background:color-mix(in srgb,var(--yu) 22%,transparent)}

/* ───────── ヘッダー ───────── */
.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:1000; background:color-mix(in srgb,var(--surface) 94%,transparent); backdrop-filter:saturate(1.4) blur(10px); -webkit-backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
.top .in{display:flex; align-items:center; gap:14px; padding:10px 20px; max-width:1680px; margin:0 auto}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); flex:none; border-radius:12px}
.brand .mk{width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:var(--moss-l); color:var(--moss)}
.brand .mk .yu{color:var(--yu)}
.brand .bt{font-family:var(--f-display); font-weight:800; font-size:1.3rem; letter-spacing:.12em; line-height:1}
.brand .bt small{display:block; font-family:var(--f-body); font-weight:400; font-size:.6rem; letter-spacing:.16em; color:var(--ink-3); margin-top:5px}
.search{position:relative; flex:1; min-width:0; max-width:640px}
.search input{width:100%; height:50px; border-radius:25px; border:1.5px solid var(--line); background:var(--surface-2); padding:0 48px 0 48px; font-size:1rem; transition:border-color .2s, background .2s, box-shadow .2s}
.search input::placeholder{color:var(--ink-3)}
.search input:hover{border-color:color-mix(in srgb,var(--moss) 40%,var(--line))}
.search input:focus{border-color:var(--moss); outline:none; background:var(--surface); box-shadow:0 0 0 4px color-mix(in srgb,var(--moss) 16%,transparent)}
.search .ic{position:absolute; left:17px; top:50%; transform:translateY(-50%); color:var(--ink-3); pointer-events:none}
.search .clr{position:absolute; right:6px; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%; border:0; background:transparent; color:var(--ink-3); cursor:pointer; font-size:1.25rem}
.search .clr:hover{background:var(--sunk)}
.sugg{position:absolute; left:0; right:0; top:calc(100% + 8px); background:var(--surface); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-2); list-style:none; margin:0; padding:6px; max-height:min(62vh,460px); overflow:auto; z-index:1100}
.sugg li{display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:12px; cursor:pointer; min-height:52px}
.sugg li[aria-selected="true"], .sugg li:hover{background:var(--moss-l)}
.sugg .t{font-weight:700}
.sugg .s{font-size:.8rem; color:var(--ink-3)}
.sugg .k{flex:none; width:44px; text-align:center; font-size:.72rem; font-weight:700; padding:3px 0; border-radius:8px}
.sugg .k.mt{background:var(--moss-l); color:var(--moss)} .sugg .k.on{background:var(--yu-l); color:var(--yu)}
.sugg .none{color:var(--ink-3); cursor:default}
.tb{display:flex; gap:8px; flex:none; margin-left:auto}
.tbtn{height:46px; min-width:46px; padding:0 14px; border-radius:23px; border:1px solid var(--line); background:var(--surface); cursor:pointer; display:inline-flex; align-items:center; gap:7px; font-size:.86rem; white-space:nowrap; transition:border-color .2s, background .2s}
.tbtn:hover{border-color:var(--moss)}
.tbtn[aria-pressed="true"]{background:var(--moss-l); border-color:var(--moss); color:var(--moss)}
.tbtn b{font-family:var(--f-display); font-weight:800}
.tbtn .cnt{background:var(--yu-btn); color:var(--yu-ink); border-radius:99px; font-size:.7rem; padding:0 7px; line-height:1.6; font-weight:700}

/* ───────── 骨組み ───────── */
.main{display:flex; flex-direction:column}
.panel{padding:18px 18px 96px; min-width:0; overflow-x:clip}
.mapwrap{position:relative; padding:14px 16px 0}
body[data-view="mt"] .mapwrap, body[data-view="yu"] .mapwrap, body[data-view="near"] .mapwrap, body[data-view="fav"] .mapwrap{order:-1}
#map{height:40vh; min-height:280px; border-radius:var(--r); border:1px solid var(--line); background:var(--m-sea); z-index:1; overflow:hidden}
body[data-view="home"] #map, body[data-view="about"] #map{height:56vh}
body[data-view="mt"] #map{height:34vh; min-height:250px}
@media (min-width:920px){
  html,body{height:100%}
  body{display:flex; flex-direction:column; overflow:hidden}
  .main{flex:1; min-height:0; flex-direction:row}
  .panel{width:clamp(420px,35vw,540px); flex:none; overflow-y:auto; overscroll-behavior:contain; padding:22px 28px 64px; border-right:1px solid var(--line); background:var(--bg); scrollbar-width:thin; scrollbar-color:var(--line) transparent}
  .mapwrap{flex:1; padding:0; min-width:0; order:0!important}
  #map, body[data-view] #map{height:100%; min-height:0; border-radius:0; border:0}
}
.panel>.v{animation:rise .42s var(--ease) both}
.panel>.v>*:nth-child(2){animation:rise .42s .04s var(--ease) both}
.panel>.v>*:nth-child(3){animation:rise .42s .08s var(--ease) both}
.panel>.v>*:nth-child(4){animation:rise .42s .12s var(--ease) both}
@keyframes rise{from{opacity:.001; transform:translateY(10px)}to{opacity:1; transform:none}}

/* ───────── 地図の道具 ───────── */
.maptools{position:absolute; z-index:500; right:28px; top:26px; display:flex; flex-direction:column; gap:8px}
@media (min-width:920px){ .maptools{right:16px; top:16px} }
.mtool{height:44px; padding:0 16px; border-radius:22px; border:1px solid var(--line); background:color-mix(in srgb,var(--surface) 94%,transparent); backdrop-filter:blur(8px); box-shadow:var(--shadow-2); cursor:pointer; font-size:.84rem; font-weight:700; display:inline-flex; align-items:center; gap:7px; transition:transform .15s var(--ease)}
.mtool:hover{border-color:var(--moss)}
.mtool:active{transform:scale(.97)}
.maplegend{position:absolute; z-index:500; left:28px; bottom:14px; background:color-mix(in srgb,var(--surface) 92%,transparent); backdrop-filter:blur(8px); border:1px solid var(--line); border-radius:12px; padding:7px 12px; font-size:.82rem; color:var(--ink-2); display:flex; gap:12px; flex-wrap:wrap; max-width:calc(100% - 56px)}
@media (min-width:920px){ .maplegend{left:16px; bottom:24px} }
.maplegend span{display:inline-flex; align-items:center; gap:6px}
.lg{width:12px; height:12px; display:inline-block; flex:none}
.lg.mt{clip-path:polygon(50% 0,100% 100%,0 100%); background:var(--ink-2)}
.lg.s-ok{border-radius:50%; background:var(--ok)} .lg.s-before{border-radius:50%; box-shadow:inset 0 0 0 2.5px var(--before)} .lg.s-off{border-radius:50%; background:var(--off)} .lg.off{border-radius:50%; background:var(--off)}
.lg.yu{border-radius:50%; background:var(--yu-btn); box-shadow:0 0 0 2px var(--surface)}
.lg.p{border-radius:3px; background:var(--lake)}

/* ───────── 共通の部品 ───────── */
.eyebrow{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0; font-size:.84rem; font-weight:700; letter-spacing:.14em; color:var(--ink-2)}
.eyebrow .numf{font-size:1.18rem; letter-spacing:0; color:var(--ink); line-height:1}
.eyebrow .sep{width:1px; height:12px; background:var(--line); margin:0 6px}
.eyebrow .cnts{display:inline-flex; gap:10px; white-space:nowrap}
.eyebrow .cnts>span{display:inline-flex; align-items:baseline; gap:3px}
.eyebrow .dot{width:10px; height:10px; border-radius:50%; flex:none}
.h1{font-family:var(--f-display); font-weight:800; font-size:1.7rem; line-height:1.35; margin:6px 0 8px; text-wrap:balance; letter-spacing:.04em}
.h2{font-family:var(--f-display); font-weight:800; font-size:1.3rem; line-height:1.3; margin:0; letter-spacing:.06em}
.h3{font-family:var(--f-display); font-weight:700; font-size:1.08rem; line-height:1.35; margin:0; letter-spacing:.05em}
.lead{color:var(--ink-2); margin:0 0 16px; font-size:.95rem; text-wrap:pretty}
.sec{margin:26px 0 10px; font-size:.78rem; letter-spacing:.16em; color:var(--ink-2); font-weight:700; display:flex; align-items:center; gap:10px}
.sec::after{content:""; flex:1; height:1px; background:var(--line)}
.blk{margin-top:30px}
.blk-h{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; padding-bottom:10px; border-bottom:2px solid var(--ink)}
.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip{white-space:nowrap; min-height:44px; padding:6px 16px; border-radius:22px; border:1px solid var(--line); background:var(--surface); cursor:pointer; display:inline-flex; align-items:center; gap:6px; font-size:.9rem; transition:background .18s, border-color .18s, color .18s, transform .12s}
.chip:hover{border-color:var(--moss)}
.chip:active{transform:scale(.97)}
.chip[aria-pressed="true"]{background:var(--ink); border-color:var(--ink); color:var(--bg)}
.chip.sm{min-height:42px; font-size:.86rem; padding:4px 14px}
.btn{white-space:nowrap; min-height:50px; padding:8px 18px; border-radius:14px; border:1px solid var(--line); background:var(--surface); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; text-decoration:none; color:var(--ink); font-size:.94rem; transition:background .18s, border-color .18s, transform .12s, box-shadow .18s; text-align:center; line-height:1.35}
.empty .btn{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.btn:hover{border-color:var(--ink-3)}
.btn:active{transform:scale(.98)}
.btn.go{background:var(--yu-btn); border-color:var(--yu-btn); color:var(--yu-ink); box-shadow:0 6px 16px -8px color-mix(in srgb,var(--yu-btn) 80%,transparent)}
.btn.go:hover{filter:brightness(1.07)}
.btn.pri{background:var(--ink); border-color:var(--ink); color:var(--bg)}
.btn.pri:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent}
.btn.block{width:100%}
.btn.btn-lg{min-height:56px; font-size:1rem; border-radius:16px; padding:10px 22px}
.note{font-size:.84rem; color:var(--ink-3)}
.msg{background:var(--lake-l); color:var(--ink); border-radius:14px; padding:12px 16px; font-size:.9rem; margin:12px 0}
.msg.warn{background:var(--soon-l)}
.back{border:0; background:none; color:var(--ink-2); cursor:pointer; padding:6px 10px 6px 0; min-height:44px; font-size:.88rem; display:inline-flex; align-items:center; gap:6px; font-weight:700}
.back:hover{color:var(--ink)}
.back::before{content:""; width:8px; height:8px; border-left:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); margin-right:2px}

/* モード切替（下山した／これから登る） */
.mode{display:grid; grid-template-columns:1fr 1fr; background:var(--sunk); border-radius:16px; padding:5px; gap:5px; margin:0}
.mode button{border:0; background:transparent; border-radius:12px; min-height:56px; cursor:pointer; font-weight:700; color:var(--ink-2); line-height:1.3; padding:8px 6px; transition:background .2s, color .2s, box-shadow .2s}
.mode button small{display:block; font-weight:400; font-size:.8rem; color:var(--ink-2); margin-top:2px}
.mode button[aria-pressed="true"]{background:var(--surface); color:var(--ink); box-shadow:var(--shadow-2)}
.mode button[aria-pressed="true"] small{color:var(--ink-2)}

/* ───────── ホーム：ヒーロー ───────── */
.hero{position:relative; margin:-18px -18px 0; padding:34px 18px 26px; overflow:hidden; border-bottom:1px solid var(--line); background:linear-gradient(180deg,var(--surface) 0%,var(--bg) 100%)}
@media (min-width:920px){ .hero{margin:-22px -28px 0; padding:44px 28px 28px} }
.hero-cv{position:absolute; inset:0; width:100%; height:100%; display:block; pointer-events:none}
.hero-in{position:relative; display:grid; gap:18px}
.hero-h{font-family:var(--f-display); font-weight:800; font-size:clamp(2.4rem,9vw,3.3rem); line-height:1.22; letter-spacing:.06em; margin:4px 0 0; text-wrap:balance}
.hero-h em{font-style:normal; color:var(--yu); position:relative}
.hero-lead{margin:0; font-size:1rem; color:var(--ink-2); max-width:30em; text-wrap:pretty}
.hero-acts{display:grid; grid-template-columns:1.3fr 1fr; gap:10px}
@media (max-width:380px){ .hero-acts{grid-template-columns:1fr} }
.hero-acts .btn svg{flex:none}
.hero-acts .btn.pri{background:var(--moss); border-color:var(--moss); color:var(--moss-ink)}

/* 人気の山（順位） */
.rank{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; column-gap:18px}
.rank li{border-bottom:1px solid var(--line-2)}
.rank button{width:100%; display:grid; grid-template-columns:1.9em 1fr; align-items:center; gap:6px; padding:12px 2px; min-height:52px; background:none; border:0; cursor:pointer; text-align:left; border-radius:8px; transition:background .15s}
.rank button:hover{background:var(--surface)}
.rank .rk{font-size:1.5rem; line-height:1; color:var(--ink)}
.rank li:nth-child(-n+3) .rk{font-size:1.8rem; font-weight:700}
.rank .rn{font-weight:700; min-width:0; overflow-wrap:anywhere}
.rank .rt{display:flex; align-items:baseline; justify-content:space-between; gap:4px 8px; flex-wrap:wrap; min-width:0}
.rank .re{font-size:.95rem; color:var(--ink-3); font-weight:500}
@media (max-width:420px){ .rank{column-gap:12px} .rank .rt{display:grid; gap:0} .rank .re{font-size:.88rem; line-height:1.1} }

/* 条件・地域 */
.pick{display:grid; gap:10px}
.pick .lab{font-size:.74rem; letter-spacing:.14em; color:var(--ink-3); font-weight:700}
.region{border-bottom:1px solid var(--line)}
.region:first-of-type{border-top:1px solid var(--line)}
.region summary{list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:14px 4px; min-height:58px; font-weight:700; font-size:1.02rem; border-radius:8px}
.region summary:hover{background:var(--surface)}
.region summary::-webkit-details-marker{display:none}
.region summary .dot{width:11px; height:11px; border-radius:50%; flex:none}
.region summary .c{margin-left:auto; color:var(--ink-3); font-weight:500; font-family:var(--f-num); font-size:1.1rem}
.region summary .c small{font-family:var(--f-body); font-size:.72rem; margin-left:2px}
.region summary::after{content:""; width:9px; height:9px; border-right:2px solid var(--ink-3); border-bottom:2px solid var(--ink-3); transform:rotate(45deg) translate(-2px,-2px); transition:transform .25s var(--ease); margin:0 6px 0 4px}
.region[open] summary::after{transform:rotate(225deg) translate(-2px,-2px)}
.mlist{list-style:none; margin:4px 0 14px; padding:0; display:grid; gap:6px}
.mrow{display:flex; align-items:center; gap:12px; width:100%; text-align:left; background:var(--surface); border:1px solid var(--line-2); border-radius:12px; padding:11px 14px; cursor:pointer; min-height:56px; transition:border-color .18s, transform .12s, box-shadow .18s}
.mrow:hover{border-color:var(--moss); box-shadow:var(--shadow-1)}
.mrow:active{transform:scale(.99)}
.mrow .n{font-weight:700; font-size:1rem}
.mrow .k{font-size:.8rem; color:var(--ink-3)}
.mrow .r{margin-left:auto; text-align:right; font-size:.8rem; color:var(--ink-3); white-space:nowrap}
.mrow .r b{color:var(--ink); font-family:var(--f-num); font-size:1.05rem}
.done{font-size:.7rem; color:var(--moss); background:var(--moss-l); border-radius:99px; padding:1px 8px; vertical-align:2px; font-weight:700}

/* ───────── 山のページ ───────── */
.mh{position:relative; display:grid; grid-template-columns:1fr auto; gap:14px; align-items:start; margin-top:4px; isolation:isolate}
.mh-cv{position:absolute; inset:-10px -16px -14px -16px; width:calc(100% + 32px); height:calc(100% + 24px); z-index:-1; pointer-events:none; -webkit-mask-image:linear-gradient(90deg,transparent 45%,#000 80%); mask-image:linear-gradient(90deg,transparent 45%,#000 80%)}
.mh .favbtn{position:relative; z-index:1; background:var(--surface)}
.mt-name{font-family:var(--f-display); font-weight:800; font-size:clamp(2.2rem,8vw,2.8rem); line-height:1.15; letter-spacing:.08em; margin:8px 0 4px; text-wrap:balance}
.kana{font-size:.95rem; color:var(--ink-2); letter-spacing:.12em; margin:0}
.mt-elev{display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 6px; margin-top:12px}
.mt-elev .l{font-size:.76rem; font-weight:700; color:var(--ink-3); letter-spacing:.14em; margin-right:4px}
.mt-elev b{font-size:2.4rem; line-height:1; color:var(--ink)}
.mt-elev .u{font-family:var(--f-num); font-size:1.2rem; color:var(--ink-2); font-weight:500}
.mt-plan{margin-left:14px; padding-left:14px; border-left:1px solid var(--line); font-weight:700; font-size:.92rem}
.mt-plan .l{display:block}
.mh-side{display:grid; justify-items:end; gap:8px}
.mh-ph{margin:6px 0 14px; position:relative; border-radius:18px; overflow:hidden; background:var(--sunk); animation:rise .5s var(--ease) both}
.mh-ph img{display:block; width:100%; height:auto; max-height:360px; object-fit:contain}
@media (max-width:640px){ .mh-ph img{max-height:260px} }
.mh-ph figcaption{position:static; padding:10px 14px; color:var(--ink-2); font-size:.74rem; white-space:normal; overflow-wrap:anywhere; line-height:1.7}
.mh-ph figcaption a{color:var(--lake)}
.favbtn{width:50px; height:50px; border-radius:50%; border:1px solid var(--line); background:var(--surface); cursor:pointer; font-size:1.35rem; color:var(--ink-3); display:grid; place-items:center; transition:transform .15s var(--ease), color .2s, border-color .2s}
.favbtn:hover{border-color:var(--star)}
.favbtn:active{transform:scale(.9)}
.favbtn[aria-pressed="true"]{color:var(--star); border-color:var(--star); background:color-mix(in srgb,var(--star) 10%,var(--surface))}
.phcr{font-size:.74rem; color:var(--ink-3); margin:8px 0 0; line-height:1.5; word-break:break-word}
.phcr a{color:inherit}
.popline{display:flex; align-items:flex-start; gap:10px; margin:16px 0 0}
.popline .pl{flex:none; font-size:.78rem; color:var(--ink-2); font-weight:700; letter-spacing:.14em; padding-top:7px}
.popline ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px; min-width:0}
@media (max-width:640px){ .popline ul{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-right:20px; -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent)} .popline ul::-webkit-scrollbar{display:none} .popline li{flex:none} }
.popline a{display:inline-flex; align-items:baseline; gap:4px; min-height:36px; padding:4px 11px; border-radius:10px; background:var(--surface); border:1px solid var(--line-2); text-decoration:none; color:var(--ink); white-space:nowrap}
.popline a:hover{border-color:var(--ink-3)}
.popline .src{font-size:.78rem; color:var(--ink-2); font-weight:700}
.popline b{font-size:1.25rem; line-height:1}
.popline .u{font-size:.72rem; color:var(--ink-2); font-weight:700}
.popline a.hy{font-size:.8rem; font-weight:700; color:var(--ink-2)}
.popline a.hy::before{content:""; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:8px solid var(--ink-2); margin-right:2px; align-self:center}
.mhacts{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.act{display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:0 14px 0 12px; border-radius:12px; border:1px solid var(--line); background:var(--surface); cursor:pointer; font-size:.88rem; font-weight:700; color:var(--ink-2); transition:border-color .18s, background .18s}
.act:hover{border-color:var(--ink-3); color:var(--ink)}
.act[aria-pressed="true"]{background:var(--moss-l); border-color:var(--moss); color:var(--moss)}
.mt-mode{margin-top:18px}
.facts{display:flex; flex-wrap:wrap; gap:6px 14px; margin:10px 0 0; font-size:.88rem}


/* 湯までの距離尺（この画面の署名）：行＝湯、横＝登山口からの車の分 */
.tl{margin-top:22px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px 16px 12px; box-shadow:var(--shadow-1); --nm:46%}
.tl-h{display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.tl-rows{list-style:none; margin:0; padding:0; display:grid; gap:2px}
.tlr{width:100%; display:grid; gap:3px; padding:6px 8px 7px; border:0; border-radius:10px; background:none; cursor:pointer; text-align:left; transition:background .15s}
.tlr:hover,.tlr.on{background:var(--surface-2)}
.tlr.on{box-shadow:inset 0 0 0 2px currentColor}
.tln{display:flex; align-items:center; gap:8px; min-width:0; font-size:.92rem; font-weight:700; color:var(--ink)}
.tln span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; min-width:0}
.tln i{font-style:normal; flex:none; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:.9rem; background:var(--ink); color:var(--bg)}
.tln b{flex:none; font-size:1.25rem; line-height:1; color:var(--ink)}
.tln b small{font-family:var(--f-body); font-size:.7rem; font-weight:700; color:var(--ink-2); margin-left:1px}
.tlt{position:relative; height:12px; margin:0 6px 0 12px}
.tlb{position:absolute; left:0; top:50%; height:4px; width:calc(var(--x) * 100%); background:currentColor; opacity:.3; transform:translateY(-50%); transform-origin:left; animation:draw .6s var(--d,0ms) var(--ease) both; border-radius:2px}
.tld{position:absolute; top:50%; left:calc(var(--x) * 100%); width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:currentColor; box-shadow:0 0 0 2px var(--surface); animation:pop .45s calc(var(--d,0ms) + .25s) var(--ease) both}
.tlr:hover .tld,.tlr.on .tld{box-shadow:0 0 0 2px var(--surface-2)}
.tlr.s-ok{color:var(--ok)} .tlr.s-soon{color:var(--soon)} .tlr.s-before{color:var(--before)} .tlr.s-off{color:var(--off)}
.tlr.s-before .tld{background:var(--surface); box-shadow:0 0 0 2px var(--surface),inset 0 0 0 2.5px var(--before)}
.tlr.s-off .tld{background:var(--surface); box-shadow:0 0 0 2px var(--surface),inset 0 0 0 2px var(--off)}
.tlr.s-off .tln{color:var(--ink-2)}
.tl-axis{padding:0 8px; margin:2px 0 6px}
.tl-scale{display:block; position:relative; height:26px; margin:0 6px 0 12px; border-bottom:1.5px solid var(--ink)}
.tl-t{position:absolute; top:0; left:calc(var(--x) * 100%); transform:translateX(-50%); font-family:var(--f-num); font-weight:600; font-size:.95rem; color:var(--ink-2); line-height:1.1; white-space:nowrap}
.tl-t::before{content:""; position:absolute; left:50%; top:calc(100% + 3px); width:1.5px; height:5px; background:var(--ink)}
.tl-t:first-child{transform:none; left:-2px; top:-1px}
.tl-t.last{transform:translateX(-100%)}
.tl-t.last::before{left:auto; right:0}
.tl-t:first-child::before{left:3px}
.tl-p0{font-style:normal; display:inline-grid; place-items:center; width:20px; height:20px; border-radius:5px; background:var(--lake); color:var(--lake-ink); font-size:.85rem}
.tl-more{margin:6px 0 0}
@keyframes draw{from{transform:translateY(-50%) scaleX(0)}to{transform:translateY(-50%) scaleX(1)}}
@keyframes pop{from{opacity:0; transform:scale(.4)}to{opacity:1; transform:none}}
.tl-leg{display:grid; grid-template-columns:1fr 1fr; gap:6px 12px; font-size:.82rem; color:var(--ink-2); margin-top:10px; padding-top:10px; border-top:1px dashed var(--line)}
.tl-leg span{white-space:nowrap}
.tl-leg i{display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:6px; vertical-align:-1px}
.tl-leg .s-ok{background:var(--ok)} .tl-leg .s-soon{background:var(--soon)} .tl-leg .s-before{box-shadow:inset 0 0 0 2.5px var(--before)} .tl-leg .s-off{box-shadow:inset 0 0 0 2px var(--off)}
@media (max-width:420px){ .tl{padding:14px 10px 10px} }

/* 登山口・駐車場 */
.thbox{margin-top:24px}
.thsel{display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; scrollbar-width:thin}
.thsel .chip{flex:none}
.park{margin-top:12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; font-size:.9rem}
.park .pn{font-weight:700; margin-bottom:4px; display:flex; gap:8px; align-items:center}
.park .pn::before{content:"P"; flex:none; width:24px; height:24px; border-radius:6px; background:var(--lake); color:var(--lake-ink); display:grid; place-items:center; font-family:var(--f-num); font-weight:700; font-size:.95rem}
.park .pf{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0}
.pill{display:inline-flex; align-items:center; gap:4px; font-size:.78rem; font-weight:700; border-radius:99px; padding:3px 11px; background:var(--sunk); color:var(--ink-2)}
.park .acts{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap}

.timebar{margin-top:16px; display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px}
.timebar .tv{display:grid; gap:4px}
.timebar .tlab{font-size:.86rem; font-weight:700; display:flex; align-items:center; gap:6px}
.timebar .tlab small{font-size:.72rem; padding:1px 7px; border-radius:6px; background:var(--sunk); color:var(--ink-2)}
.timebar input{justify-self:start}
.timebar .tv b{font-size:2.2rem; line-height:1}
.tstep{display:flex; gap:8px; flex-wrap:wrap; margin-left:auto; align-self:center}
.timebar input{height:48px; border:1px solid var(--line); border-radius:12px; padding:0 12px; background:var(--surface-2); font-family:var(--f-num); font-size:1.15rem; font-weight:600}
.timebar .now{margin-left:auto}
.timebar .note{flex-basis:100%}
.tools{margin-top:16px; display:grid; gap:10px}
.tools .row{display:flex; gap:8px; overflow-x:auto; padding:2px 24px 4px 2px; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent)}
.tools .row::-webkit-scrollbar{display:none}
.tools .row .chip{flex:none}
.tools .lab{font-size:.74rem; letter-spacing:.14em; color:var(--ink-3); font-weight:700}
.count{margin:22px 0 10px; font-size:.9rem; color:var(--ink-2)}
.count b{color:var(--ink); font-family:var(--f-num); font-size:1.3rem}
.moreb{margin-top:12px; border-style:dashed}
.timebar .sunv{padding-left:18px; border-left:1px solid var(--line)}
.timebar .sunv b{font-size:1.6rem; color:var(--ink)}
.timebar .warn{font-size:.8rem; font-weight:700; color:var(--soon)}
.timebar{display:grid!important; grid-template-columns:auto auto 1fr; align-items:end}
.timebar .tstep{grid-column:3; justify-self:end}
@media (max-width:440px){ .timebar{grid-template-columns:1fr 1fr} .timebar .tstep{grid-column:1/-1; justify-self:stretch; margin-left:0} .timebar .tstep .chip{flex:1; justify-content:center} }

/* 迷ったらここ */
.bestbox{margin-top:20px; position:relative; background:var(--surface); border:1.5px solid var(--ink); border-radius:var(--r); padding:16px 16px 14px; overflow:hidden}
.bestbox::before{content:"♨"; position:absolute; right:-6px; top:-22px; font-size:6.5rem; line-height:1; color:var(--ink); opacity:.06; pointer-events:none}
.bestbox .bl{font-size:.78rem; font-weight:700; letter-spacing:.16em; color:var(--ink-2)}
.bestbox .bn{font-family:var(--f-display); font-weight:800; font-size:1.35rem; margin-top:4px; line-height:1.35}
.bestbox .bs{font-size:.88rem; color:var(--ink-2); margin-top:2px}
.bestbox .ba{display:grid; grid-template-columns:2fr 1fr; gap:8px; margin-top:12px}

/* ───────── 温泉カード ───────── */
.olist{list-style:none; margin:0; padding:0; display:grid; gap:14px}
.oc{position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; scroll-margin-top:96px; transition:border-color .25s, box-shadow .25s}
.oc:hover{box-shadow:var(--shadow-2)}
.oc.hl{--hc:var(--ok); border-color:var(--hc); box-shadow:inset 0 0 0 1px var(--hc),var(--shadow-2)}
.oc.hl.st-soon{--hc:var(--soon)} .oc.hl.st-before{--hc:var(--before)} .oc.hl.st-off{--hc:var(--off)}
.oc.st-off{background:var(--surface-2)}
.oc .hd{display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:start}
.no{flex:none; width:36px; height:36px; border-radius:50%; background:var(--ink); color:var(--bg); font-family:var(--f-num); font-weight:700; display:grid; place-items:center; font-size:1.05rem; cursor:pointer; border:0; transition:transform .15s var(--ease)}
.no:hover{transform:scale(1.08)}
.oc.st-off .no{background:var(--sunk); color:var(--ink-3); box-shadow:inset 0 0 0 1px var(--line)}
.oc h3{margin:3px 0 0; font-size:1.14rem; line-height:1.4; font-weight:700; overflow-wrap:anywhere}
.oc .hd .stline{margin-top:8px}
.oc .ar{font-size:.8rem; color:var(--ink-3); margin-top:2px}
.oc .favbtn{width:46px; height:46px; font-size:1.2rem}
.oc .from{color:var(--lake); font-weight:700; font-size:.84rem; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.stline{display:flex; align-items:center; gap:6px 8px; margin-top:10px; flex-wrap:wrap}
.stline .tag{font-size:.8rem; padding:3px 10px}
.stw{display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; min-width:0}
.st{display:inline-flex; align-items:center; gap:7px; font-size:.86rem; font-weight:700; padding:4px 12px; border-radius:99px; white-space:nowrap}
.st::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor}
.st.ok{background:var(--ok-l); color:var(--ok)} .st.ok::before{box-shadow:0 0 0 0 currentColor; animation:beat 2.4s ease-out infinite}
.st.soon{background:var(--soon-l); color:var(--soon)} .st.off{background:var(--off-l); color:var(--off)} .st.before{background:var(--before-l); color:var(--before)}
@keyframes beat{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 55%,transparent)}70%,100%{box-shadow:0 0 0 7px transparent}}
.st small{font-size:.8em; font-weight:700; opacity:.9}
.st-sub{font-size:.86rem; color:var(--ink-2)}
.metrics{display:grid; grid-template-columns:repeat(var(--n,3),1fr); margin:12px 0 0; border:1px solid var(--line-2); border-radius:12px; background:var(--surface-2)}
.metrics>div{padding:8px 9px 9px; min-width:0}
.metrics>div+div{border-left:1px solid var(--line-2)}
.metrics dt{font-size:.7rem; color:var(--ink-3); font-weight:700; letter-spacing:.06em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.metrics dd{margin:1px 0 0; display:flex; align-items:baseline; gap:2px; min-width:0; white-space:nowrap}
.metrics b{font-size:1.55rem; line-height:1.05; color:var(--ink)}
.metrics b.txt{font-family:var(--f-body); font-size:1rem; font-weight:700; line-height:1.4}
.metrics .u{font-size:.8rem; color:var(--ink-2); font-weight:700}
.oc.st-off .metrics b{color:var(--ink-2)}
.amen{display:flex; flex-wrap:wrap; align-items:center; gap:2px 0; margin:10px 0 0; font-size:.88rem; line-height:1.4}
.amen{column-gap:14px!important}
.am{display:inline-flex; align-items:baseline; gap:5px; min-height:36px; padding:6px 2px; text-decoration:none; color:var(--ink); border-radius:6px; white-space:nowrap}
.am:hover{background:var(--surface-2)}
.am .aml{color:var(--ink-2); font-weight:700; font-size:.82rem}
.am b{font-weight:700}
.am.yes b{color:var(--ok)}
.am.paid b{color:var(--lake)}
.am.am-no b{color:var(--off)}
.am.un b{color:var(--ink-3)}
.am .kd{margin:0; font-size:.76rem; padding:0 6px}
.kd{margin:0}
.kd{display:inline-block; font-style:normal; font-size:.7rem; font-weight:700; border-radius:4px; padding:0 5px; margin-top:3px; align-self:flex-start; background:var(--sunk); color:var(--ink-2); letter-spacing:.02em}
.kd.k-off{background:var(--ok-l); color:var(--ok)} .kd.k-pub{background:var(--lake-l); color:var(--lake)} .kd.k-info{background:var(--off-l); color:var(--off)} .kd.k-rev{background:var(--yu-l); color:var(--yu)}
.tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.tag{font-size:.76rem; padding:2px 10px; border-radius:99px; background:var(--moss-l); color:var(--moss)}
.tag.meal{background:var(--sunk); color:var(--ink-2)} .tag.call{background:var(--soon-l); color:var(--soon)}
.oc .acts{display:grid; gap:8px; margin-top:12px}
.oc .acts .go{min-height:56px; font-size:1.02rem}
.acts2{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
@media (max-width:560px){ .acts2{grid-template-columns:1fr 1fr} }
html.fs-large .acts2,html.fs-xlarge .acts2{grid-template-columns:1fr 1fr}
.acts2 .btn{min-height:46px; font-size:.86rem; font-weight:700; padding:6px 8px}
.acts2 .logbtn[aria-pressed="true"]{background:var(--moss-l); border-color:var(--moss); color:var(--moss)}
.more{margin-top:12px; border-top:1px solid var(--line-2); padding-top:6px}
.more summary{cursor:pointer; color:var(--ink-2); font-size:.86rem; font-weight:700; min-height:44px; display:flex; align-items:center; gap:8px; list-style:none; border-radius:8px}
.more summary:hover{color:var(--ink)}
.more summary::-webkit-details-marker{display:none}
.more summary::before{content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .2s var(--ease); margin:0 4px 0 2px}
.more[open] summary::before{transform:rotate(45deg)}
.more .body{font-size:.88rem; display:grid; gap:12px; padding:6px 0 4px}
.more .body a{word-break:break-all}
.kv{display:grid; grid-template-columns:auto 1fr; gap:6px 14px; margin:0; font-size:.9rem}
.kv dt{color:var(--ink-3); font-size:.78rem; padding-top:2px; white-space:nowrap; font-weight:700}
.kv dd{margin:0; min-width:0}
.kv .pr{font-weight:700}
.tel{display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap}
.tel .num{font-weight:700; user-select:all}
.copy{min-height:38px; padding:2px 12px; border-radius:10px; border:1px solid var(--line); background:var(--surface-2); cursor:pointer; font-size:.8rem}
.chk{font-size:.76rem; color:var(--ink-3)} .chk.old{color:var(--soon); font-weight:700}
.near{display:flex; flex-wrap:wrap; gap:6px}
.near button{border:1px solid var(--line); background:var(--surface-2); border-radius:99px; padding:4px 13px; min-height:40px; cursor:pointer; font-size:.84rem}
.empty{background:var(--surface); border:1px dashed var(--line); border-radius:var(--r); padding:20px; text-align:center; color:var(--ink-2); text-wrap:balance}
.amsrc{margin:0; padding-left:18px; display:grid; gap:8px}
.amsrc q{color:var(--ink-3); font-size:.82rem}
.wkl{margin-top:12px; font-size:.74rem; color:var(--ink-3); font-weight:700}
.wk{display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin-top:6px}
.wk .wd{display:flex; flex-direction:column; align-items:center; font-size:.76rem; border-radius:9px; background:var(--surface-2); padding:4px 0 5px; line-height:1.25; border:1px solid var(--line-2)}
.wk .wd small{font-size:.64rem; color:var(--ink-3)}
.wk .wd b{font-size:.92rem}
.wk .wd.o b{color:var(--ok)} .wk .wd.x{background:var(--off-l)} .wk .wd.x b{color:var(--off)} .wk .wd.q b{color:var(--soon)}
.wk .su{color:var(--sun)} .wk .sa{color:var(--sat)}

/* マイページ */
.stats{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:8px}
.stats>div{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px; display:grid; gap:6px}
.stats .sl{font-size:.76rem; color:var(--ink-3); font-weight:700; letter-spacing:.1em}
.stats .sv{font-family:var(--f-num); font-size:2.4rem; font-weight:600; line-height:1}
.stats .sv small{font-family:var(--f-body); font-size:.8rem; color:var(--ink-3); font-weight:400}
.bar{height:6px; border-radius:3px; background:var(--sunk); overflow:hidden}
.bar i{display:block; height:100%; background:var(--moss)}

/* このサイトについて・フッター */
.linkbtn{background:none; border:0; padding:8px 0; min-height:44px; color:var(--lake); text-decoration:underline; font:inherit; cursor:pointer}
.about h2{font-family:var(--f-display); font-weight:800; font-size:1.15rem; margin:26px 0 10px; padding-top:16px; border-top:1px solid var(--line); letter-spacing:.05em}
.about ul{margin:0; padding-left:1.2em}
.about li{margin:0 0 8px; line-height:1.75}
.about p{line-height:1.85; margin:0 0 10px}
.foot{margin-top:36px; padding-top:16px; border-top:2px solid var(--ink); font-size:.76rem; color:var(--ink-3); line-height:1.8}
.foot b{color:var(--ink-2)}
.foot a{color:var(--ink-3)}
.foot .kd{margin:0 2px}

/* ───────── 地図の記号 ───────── */
.leaflet-container{font-family:var(--f-body); background:var(--m-sea)}
.mk-mt{position:relative; width:0; height:0}
.mk-mt i{position:absolute; left:-8px; top:-14px; width:16px; height:14px; background:var(--ink-2); clip-path:polygon(50% 0,100% 100%,0 100%)}
.mk-mt i::after{content:""; position:absolute; inset:3px 3px 0; background:color-mix(in srgb,var(--surface) 30%,transparent); clip-path:polygon(50% 0,100% 100%,0 100%)}
.mk-mt b{position:absolute; left:11px; top:-16px; white-space:nowrap; font-size:12px; font-weight:700; color:var(--ink); text-shadow:0 0 3px var(--surface),0 0 3px var(--surface),0 0 3px var(--surface),0 0 3px var(--surface); pointer-events:none; letter-spacing:.04em}
.z-lo .mk-mt b{display:none}
.mk-mt.sel i{left:-15px; top:-26px; width:30px; height:26px; background:var(--ink)}
.mk-mt.sel b{display:block!important; font-family:var(--f-display); font-weight:800; font-size:16px; left:18px; top:-27px; letter-spacing:.08em}
.mk-yu{width:34px; height:34px; margin:-17px 0 0 -17px; border-radius:50%; background:var(--yu-btn); color:var(--yu-ink); border:2.5px solid var(--surface); display:grid; place-items:center; font-family:var(--f-body); font-weight:700; font-size:16px; line-height:1; box-shadow:0 2px 6px rgba(0,0,0,.3)}
@media (max-width:919px){ .mk-yu{width:36px; height:36px; margin:-18px 0 0 -18px} }
.dim .mk-yu{opacity:.55}
.mk-yu.ok{background:var(--ok); color:var(--ok-ink)}
.mk-yu.off{background:var(--off)}
.mk-leg{position:absolute; left:0; top:0; pointer-events:none}
.mk-leg line{stroke:var(--ink); stroke-width:1.5; opacity:.55}
.mk-yu.soon{background:var(--soon); color:var(--surface)}
.mk-yu.before{background:var(--surface); color:var(--lake); border-color:var(--lake)}
.mk-yu.sm{width:12px; height:12px; margin:-6px 0 0 -6px; border-width:2px; font-size:0; box-shadow:0 1px 2px rgba(0,0,0,.3)}
.mk-yu.hl{outline:3px solid var(--ink); outline-offset:2px; transform:scale(1.18); z-index:1000}
.mk-yu.hot{transform:scale(1.22)}
.mk-yu{transition:transform .18s var(--ease)}
.route-anim{stroke-dasharray:1400; stroke-dashoffset:1400; animation:route .62s .12s cubic-bezier(.33,1,.68,1) forwards}
.route-tick{width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%; background:var(--ink); box-shadow:0 0 0 3px var(--surface),0 2px 6px rgba(0,0,0,.35)}
@keyframes route{to{stroke-dashoffset:0}}
.route-end{position:absolute; left:0; top:0; transform:translate(-50%,-50%); background:var(--ink); color:var(--bg); border-radius:12px; padding:5px 12px; white-space:nowrap; box-shadow:var(--shadow-2); animation:rise .35s .78s var(--ease) both}
.route-end b{font-size:20px}
.pv-line{stroke-dasharray:3 5}
.pv-card{position:absolute; left:16px; top:-18px; transform:translateY(-100%); background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:14px; padding:10px 14px; box-shadow:var(--shadow-2); white-space:nowrap; display:grid; gap:2px; animation:fade .22s var(--ease) both; font-size:13px}
@keyframes fade{from{opacity:0}to{opacity:1}}
.pv-card>b{font-family:var(--f-display); font-weight:800; font-size:18px; letter-spacing:.06em}
.pv-card>span{font-size:15px; color:var(--ink-2)}
.pv-card em{font-style:normal; color:var(--ink-2)}
.pv-card em b{font-size:16px; color:var(--ink)}
.pv-card::after{content:""; position:absolute; left:-10px; bottom:-12px; width:22px; height:1.5px; background:var(--ink); transform:rotate(-40deg); transform-origin:right}
.pv-pin{position:absolute; left:-9px; top:-24px; width:18px; height:16px; background:var(--ink); clip-path:polygon(50% 0,100% 100%,0 100%)}
.pv-dot{width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 2.5px var(--surface),0 0 0 4.5px var(--ink)}
.pv-min{transform:translate(-50%,-150%); background:var(--ink); color:var(--bg); border-radius:8px; padding:1px 7px; font-size:15px; white-space:nowrap; box-shadow:var(--shadow-1); animation:rise .25s var(--ease) both}
.pv-min small{font-family:var(--f-body); font-size:10px}
.route-end small{font-family:var(--f-body); font-size:11px; margin-left:2px}
body[data-view="mt"] .mk-mt:not(.sel) b{display:none}
.mk-p{width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:8px; background:var(--lake); color:var(--lake-ink); font-family:var(--f-body); font-weight:700; font-size:16px; display:grid; place-items:center; border:2px solid var(--surface); box-shadow:0 2px 6px rgba(0,0,0,.3)}
.mk-plbl.l{left:auto; right:20px}
.mk-plbl{position:absolute; left:20px; top:-11px; white-space:nowrap; font-size:13px; font-weight:700; color:var(--lake); text-shadow:0 0 3px var(--surface),0 0 3px var(--surface),0 0 3px var(--surface)}
.mk-me{width:18px; height:18px; margin:-9px 0 0 -9px; border-radius:50%; background:#1a73e8; border:3px solid #fff; box-shadow:0 0 0 6px rgba(26,115,232,.25)}
.mk-town{font-size:11px; color:var(--m-label); white-space:nowrap; transform:translate(-50%,-50%); font-weight:700; pointer-events:none}
.mk-pref{font-family:var(--f-display); font-size:15px; font-weight:700; letter-spacing:.4em; color:var(--m-label); opacity:.75; white-space:nowrap; transform:translate(-50%,-50%); pointer-events:none}
.leaflet-popup-content-wrapper{background:var(--surface); color:var(--ink); border-radius:16px; box-shadow:var(--shadow-2)}
.leaflet-popup-tip{background:var(--surface)}
.leaflet-popup-content{margin:14px 16px; font-size:14px; line-height:1.6; min-width:210px}
.leaflet-container a.leaflet-popup-close-button{width:32px; height:32px; font-size:20px; color:var(--ink-3)}
.pp h4{margin:0 0 6px; font-size:15px; padding-right:18px}
.pp .l{font-size:13px; color:var(--ink-2); margin-top:6px}
.pp .a{display:flex; gap:6px; margin-top:10px; flex-wrap:wrap}
.pp .a .btn{min-height:42px; font-size:13px; padding:6px 14px; border-radius:12px}
.leaflet-control-attribution{font-size:10px; background:color-mix(in srgb,var(--surface) 80%,transparent)!important; color:var(--ink-3)}
.leaflet-control-attribution a{color:var(--ink-2)}
.nearby-map .leaflet-control-attribution{background:#fffdf8!important;color:#263c31}
.nearby-map .leaflet-control-attribution a{color:#1c5a86}
:root[data-theme="dark"] .tiles-on .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.8)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .tiles-on .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.8)} }
.leaflet-bar{border:0!important; box-shadow:var(--shadow-2)!important; border-radius:14px!important; overflow:hidden}
.leaflet-bar a{background:var(--surface); color:var(--ink); border-color:var(--line)!important; width:40px!important; height:40px!important; line-height:40px!important; font-size:20px!important}
.leaflet-bar a:hover{background:var(--surface-2)}
.leaflet-control-layers{background:var(--surface); color:var(--ink); border-radius:14px!important; border:1px solid var(--line)!important; box-shadow:var(--shadow-2)!important}
.leaflet-control-layers-expanded{padding:10px 14px}

/* トースト・地図へ */
.toast{position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); transform:translate(-50%,20px); background:var(--ink); color:var(--bg); padding:12px 20px; border-radius:26px; font-size:.9rem; opacity:0; pointer-events:none; transition:opacity .2s, transform .25s var(--ease); z-index:2000; max-width:calc(100% - 32px); text-align:center}
.toast.on{opacity:1; transform:translate(-50%,0)}
.mapfab{position:fixed; left:0; right:0; bottom:0; z-index:1500; min-height:calc(58px + env(safe-area-inset-bottom,0px)); padding:0 16px env(safe-area-inset-bottom,0px); border:0; border-top:1px solid var(--line); background:var(--surface); box-shadow:0 -6px 18px -12px rgba(0,0,0,.25); color:var(--ink); font-weight:700; font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px}
.mapfab:active{background:var(--sunk)}

@media (max-width:640px){
  .top .in{flex-wrap:wrap; row-gap:10px; padding:10px 16px 12px}
  .search{order:3; flex-basis:100%; max-width:none}
  .tbtn .lbl{display:none}
  .panel{padding:18px 16px 96px}
  .hero{margin:-18px -16px 0; padding:30px 16px 24px}
  .mapwrap{padding:12px 16px 0}
}
@media (max-width:440px){ .metrics{grid-template-columns:1fr 1fr} .metrics>div{padding:8px 11px; display:flex; align-items:baseline; justify-content:space-between; gap:6px} .metrics dt{font-size:.76rem} .metrics .lf{display:none} .metrics b{font-size:1.4rem} .metrics>div:nth-child(3){border-left:0} .metrics>div:nth-child(n+3){border-top:1px solid var(--line-2)} }
@media (max-width:340px){ .amen{grid-template-columns:1fr} }
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation:none!important; transition:none!important; scroll-behavior:auto!important} }

@media (max-width:640px){
  .hero-acts .btn{padding:8px 12px}
  .maptools{right:24px; top:22px; flex-direction:row}
  .mtool{height:40px; padding:0 12px; font-size:.78rem}
  body:not([data-view="home"]):not([data-view="about"]) .maplegend{display:none}
  .leaflet-bar a{width:36px!important; height:36px!important; line-height:36px!important}
}

/* 地図が要らない画面は、スマホでは地図を出さない */
@media (max-width:919px){
  body[data-view="about"] .mapwrap, body[data-nomap="1"] .mapwrap{display:none}
  body[data-view="about"] .mapfab{display:none!important}
  .panel{padding-bottom:110px}
}
@media (max-width:480px){ .hero .eyebrow .sep{display:none} .hero .eyebrow .cnts{flex-basis:100%} }
@media (max-width:420px){ .brand .bt small{display:none} .tbtn{padding:0 12px} .tbtn .lbl{display:inline!important} }
.search input::-webkit-search-cancel-button{-webkit-appearance:none; appearance:none; display:none}
@media (max-width:440px){ html.fs-large .metrics>div, html.fs-xlarge .metrics>div{display:block} }
/* 帰る方面・帰り道 */
.homebar{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:10px 12px; background:var(--surface); border:1px solid var(--line); border-radius:14px}
.homebar .lab{margin:0}
.homebar select{min-height:44px; padding:0 36px 0 12px; border-radius:12px; border:1px solid var(--line); background:var(--surface-2); font-weight:700; font-size:1rem; color:var(--ink); appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--ink-2) 50%),linear-gradient(135deg,var(--ink-2) 50%,transparent 50%); background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%; background-size:5px 5px; background-repeat:no-repeat}
.homebar .note{flex-basis:100%}
.detour{display:inline-flex; align-items:center; gap:5px; font-size:.84rem; font-weight:700; color:var(--lake); white-space:nowrap}
.detour::before{content:""; width:14px; height:9px; border:2px solid currentColor; border-top:0; border-right:0; transform:skewX(-20deg); border-radius:0 0 0 4px}
.detour.on{color:var(--ok)}
/* 情報がちがう */
.rpt{display:flex; justify-content:flex-end; margin-top:6px}
.rptbtn{display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:4px 8px; border:0; background:none; color:var(--ink-3); font-size:.84rem; font-weight:700; cursor:pointer; border-radius:8px; text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:.3em}
.rptbtn:hover{color:var(--ink); background:var(--surface-2)}
.rptbox{margin-top:8px; padding:14px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line); display:grid; gap:10px; animation:rise .25s var(--ease) both}
.rpth{margin:0; font-weight:700}
.rptbox textarea{width:100%; min-height:64px; border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:var(--surface); font-size:1rem; resize:vertical}
.rpta{display:grid; grid-template-columns:1fr auto; gap:8px}
.rpta .btn[disabled]{opacity:.45; cursor:not-allowed}
.rptbox .note{margin:0}
.rptok{color:var(--ok)!important; font-weight:700}
/* ---- 場所ページ ---- */
.sugg .k.pl{background:var(--lake-l,#e3eef5); color:var(--lake)}
.kindtag{display:inline-block; padding:2px 10px; border-radius:999px; border:1.5px solid currentColor; letter-spacing:.06em; font-size:.8rem}
.kindtag.k-th{color:var(--lake)} .kindtag.k-hub{color:var(--ink)} .kindtag.k-spa{color:var(--yu)}
.pl-name{word-break:auto-phrase}
.plnote{margin:12px 0 0; padding:12px 14px; border-left:4px solid var(--ink); background:var(--surface); font-size:.95rem; line-height:1.75}
.chip .pf{display:inline-block; font-size:.72rem; font-weight:700; color:var(--ink-3); margin-right:6px; letter-spacing:.04em}
.chip[aria-pressed="true"] .pf{color:inherit; opacity:.85}
.thhint{margin:10px 0 0; font-size:.9rem; color:var(--ink-2); line-height:1.7}
.thhint b{color:var(--ink)}
.access{margin-top:16px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; font-size:.92rem}
.access .acc-car,.access .acc-bus{display:flex; gap:10px; align-items:baseline; margin-top:6px}
.access .acc-car b,.access .acc-bus b{flex:none; min-width:3em; font-size:.8rem; padding:2px 8px; border-radius:6px; background:var(--lake); color:var(--lake-ink); text-align:center}
.access .acc-bus b{background:var(--ink)}
.access .pf{display:flex; flex-wrap:wrap; gap:6px; margin:8px 0}
.access .acts{display:flex; gap:8px; margin-top:12px; flex-wrap:wrap}
.olist .grp{list-style:none; margin:18px 0 6px; font-family:var(--f-display); font-weight:700; font-size:1.05rem; color:var(--ink); padding-bottom:4px; border-bottom:2px solid var(--ink)}
.olist .grp:first-child{margin-top:4px}
.plchips .nocar{margin-left:6px; font-size:.72rem; color:var(--ink-3); font-weight:700}
.mk-hub{position:absolute; transform:translate(-50%,-50%); white-space:nowrap; padding:6px 12px; border-radius:999px; background:var(--ink); color:var(--surface); font-weight:700; font-size:14px; box-shadow:0 2px 8px rgba(0,0,0,.3)}
/* ---- バス・公共交通 ---- */
.access .acc-bus span{display:flex; flex-direction:column; gap:3px; min-width:0}
.access .bs-stop{font-weight:700; color:var(--ink)}
.access .bs-op{font-size:.85rem; color:var(--ink-2)}
.access .bs-l{line-height:1.6}
.access .bs-l i{font-style:normal; font-size:.78rem; font-weight:700; color:var(--ink-3); margin-right:6px; letter-spacing:.06em}
.access .bs-n{font-size:.86rem; color:var(--ink-2); line-height:1.6}
.access .bs-a{display:flex; flex-wrap:wrap; gap:4px 14px}
.access .bs-a a{color:var(--lake); font-weight:700; min-height:40px; display:inline-flex; align-items:center}
.access .bs-c,.access .nb{font-size:.78rem; color:var(--ink-3); line-height:1.6}
.access .nb{font-size:.88rem; color:var(--ink-2)}
.buswalk{display:inline-flex; align-items:center; gap:6px; margin-top:4px; font-size:.84rem; font-weight:700; color:var(--ink); text-decoration:none; border-bottom:1px dotted var(--ink-3)}
.buswalk b{font-size:.7rem; padding:1px 6px; border-radius:4px; background:var(--ink); color:var(--surface)}
.walkin{margin-top:4px; font-size:.84rem; font-weight:700; color:var(--moss)}
.parkbus{margin-top:8px; font-size:.86rem; color:var(--ink-2)}
.parkbus b{font-size:.7rem; padding:1px 6px; border-radius:4px; background:var(--ink); color:var(--surface); margin-right:6px}
.msg.alert{margin-top:12px; border-left:4px solid var(--yu); line-height:1.7}
.msg.alert b{display:block; color:var(--yu); margin-bottom:2px}
.reviewed-mountain-alert p{margin:.4rem 0}.reviewed-mountain-alert summary{padding:8px 0;min-height:44px;cursor:pointer}
/* ---- 会員割引 ---- */
.disc{display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 0}
.disc .dc{display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:3px 10px 3px 4px; border-radius:999px; border:1.5px solid var(--line-2); font-size:.86rem; font-weight:700; color:var(--ink); text-decoration:none; background:var(--surface)}
.disc .dc b{font-size:.72rem; padding:2px 7px; border-radius:999px; color:#fff; letter-spacing:.02em}
.disc .dc-jaf b{background:#1f4e9c} .disc .dc-mb b{background:#2c6e49}
html[data-theme="dark"] .disc .dc-jaf b{background:#3b6fc4}
.buswalk{align-items:flex-start; line-height:1.5}
.buswalk b,.parkbus b,.disc .dc b{flex:none; white-space:nowrap}
.buswalk b{margin-top:2px}
/* ---- 山行ノート・登山者の声 ---- */
.notebox{margin-top:12px; padding:14px; border:1.5px solid var(--moss); border-radius:14px; background:var(--surface-2); display:grid; gap:10px}
.notebox .rpth{margin:0; font-weight:700; font-family:var(--f-display); font-size:1.05rem}
.notebox .rpth .note{font-family:var(--f-body); font-weight:400}
.nb-row{display:grid; gap:6px}
.nb-l{font-size:.8rem; font-weight:700; color:var(--ink-2); letter-spacing:.06em}
.notebox input[type=date]{min-height:44px; font:inherit; padding:6px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--surface); color:var(--ink); max-width:220px}
.notebox textarea{width:100%; font:inherit; padding:8px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--surface); color:var(--ink)}
.nstar{display:flex; gap:4px}
.nstar button{width:46px; height:46px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface); font-size:1.5rem; line-height:1; color:var(--line-2); cursor:pointer}
.nstar button[aria-pressed="true"]{color:#c98a12; border-color:#c98a12}
.voice-l{margin:8px 0 0; font-size:.88rem; display:flex; gap:8px; align-items:center}
.voice-l b{font-size:.72rem; padding:2px 8px; border-radius:999px; background:var(--moss); color:var(--moss-ink); flex:none}
.vs{color:#c98a12; letter-spacing:.04em; white-space:nowrap}
.voices{list-style:none; margin:0 0 6px; padding:0; display:grid; gap:10px}
.voices li,.notes li{display:grid; gap:3px}
.vh{font-size:.84rem; font-weight:700; color:var(--ink-2)}
.vt{font-size:.84rem; color:var(--moss); font-weight:700}
.vx{font-size:.95rem; line-height:1.7}
.notes{list-style:none; margin:0; padding:0; display:grid; gap:0}
.notes li{padding:12px 0; border-bottom:1px solid var(--line)}
.notes .nh{display:flex; gap:10px; align-items:center; font-size:.86rem; color:var(--ink-2)}
.notes .nsh{font-size:.72rem; padding:1px 8px; border-radius:999px; background:var(--lake-l); color:var(--lake); font-weight:700}
.notes .np{display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; font-weight:700}
.notes .np .linkbtn{font-weight:700; min-height:40px; padding:4px 0}
.notes .arr{color:var(--ink-3)}
.notes .na{display:flex; gap:18px}
.notes .na .linkbtn{font-size:.86rem; min-height:40px}

/* ───────── 使いやすさの改善（2026-10-02） ───────── */
/* 横に流れて切れていたチップは折り返す */
.tools .row,.thsel{flex-wrap:wrap; overflow:visible; -webkit-mask-image:none; mask-image:none; padding:2px 0 4px}
@media (max-width:640px){ .popline ul{flex-wrap:wrap; overflow:visible; -webkit-mask-image:none; mask-image:none; padding-right:0} }
.note,.tools .lab,.blk-h .note{color:var(--ink-2)}
/* 条件（1行にたたむ） */
.cond{margin-top:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r)}
.cond>summary{list-style:none; display:flex; align-items:center; gap:12px; padding:12px 16px; cursor:pointer; min-height:56px; border-radius:var(--r)}
.cond>summary::-webkit-details-marker{display:none}
.cond .cl{flex:none; font-size:.76rem; letter-spacing:.14em; font-weight:700; color:var(--ink-2)}
.cond .cv{flex:1; min-width:0; font-weight:700; font-size:.96rem; line-height:1.5}
.cond .cf{font-size:.86rem; color:var(--lake)}
.cond .cc{flex:none; font-size:.86rem; font-weight:700; color:var(--lake); border:1px solid var(--line); border-radius:99px; padding:6px 14px; background:var(--surface-2)}
.cond .cc::after{content:"変える"} .cond[open] .cc::after{content:"閉じる"}
.cond .timebar{margin:0 16px 14px; border:0; border-top:1px solid var(--line-2); border-radius:0; padding:14px 0 0; background:none}
.cond .tools{margin:0 16px 16px}
/* 登山口をえらぶ */
.thpick{margin-top:18px}
.thpick .h3{margin:0 0 4px}
.thcards{display:grid; gap:10px; margin-top:12px}
.thcard{display:grid; gap:2px; text-align:left; padding:14px 44px 14px 16px; border:1.5px solid var(--line); border-radius:var(--r); background:var(--surface); cursor:pointer; font:inherit; color:inherit; min-height:72px; position:relative; transition:border-color .2s, box-shadow .2s}
.thcard::after{content:""; position:absolute; right:20px; top:50%; width:9px; height:9px; border-right:2px solid var(--ink-2); border-top:2px solid var(--ink-2); transform:translateY(-50%) rotate(45deg)}
.thcard:hover{border-color:var(--moss); box-shadow:var(--shadow-2)}
.thcard small{font-size:.76rem; font-weight:700; color:var(--lake)}
.thcard b{font-size:1.1rem; line-height:1.4}
.thcard span{font-size:.9rem; color:var(--ink-2)}
.thbox{margin-top:14px}
.parkd{margin-top:10px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r)}
.parkd>summary{list-style:none; padding:10px 16px; cursor:pointer; min-height:52px; display:flex; align-items:center; gap:10px; font-weight:700; font-size:.95rem; border-radius:var(--r)}
.parkd>summary::-webkit-details-marker{display:none}
.parkd>summary::after{content:""; margin-left:auto; flex:none; width:9px; height:9px; border-right:2px solid var(--ink-2); border-bottom:2px solid var(--ink-2); transform:rotate(45deg); transition:transform .2s}
.parkd[open]>summary::after{transform:rotate(-135deg)}
.parkd summary small{display:block; font-weight:400; font-size:.8rem; color:var(--ink-2)}
.parkd .pk{flex:none; font-style:normal; width:26px; height:26px; border-radius:6px; background:var(--lake); color:var(--lake-ink); display:grid; place-items:center; font-family:var(--f-num); font-weight:700}
.parkd .park{margin:0; border:0; border-top:1px solid var(--line-2); border-radius:0 0 var(--r) var(--r); background:none}
.parkd .park.access{padding:14px 16px; font-size:.9rem}
.mt-mode{margin-top:14px}
.msg.tmr{margin-top:14px; background:var(--before-l); color:var(--ink); border:1px solid color-mix(in srgb,var(--before) 35%,transparent); border-radius:var(--r); padding:12px 16px; font-size:.95rem; line-height:1.6}
/* 迷ったらここ（1行） */
.bestline{margin-top:14px; width:100%; display:grid; grid-template-columns:auto 1fr; gap:2px 12px; align-items:center; text-align:left; padding:12px 16px; border:1.5px solid var(--ink); border-radius:var(--r); background:var(--surface); cursor:pointer; font:inherit; color:inherit; min-height:60px}
.bestline .bl{grid-row:1/3; font-size:.76rem; font-weight:700; letter-spacing:.1em; color:var(--bg); background:var(--ink); border-radius:99px; padding:5px 12px; white-space:nowrap}
.bestline .bn{font-weight:700; font-size:1.05rem; line-height:1.4}
.bestline .bs{font-size:.86rem; color:var(--ink-2)}
.count{margin:18px 0 8px}
.count .hint{display:block; font-size:.84rem; color:var(--ink-2)}
.lax{padding:0 17px; margin:8px 0 8px}
/* 温泉の行（押すと開く） */
.oc{padding:0; overflow:hidden}
.oc .ochw{margin:0; font:inherit; line-height:inherit}
.och{display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:6px 12px; align-items:center; width:100%; text-align:left; background:none; border:0; padding:14px 16px; cursor:pointer; color:var(--off); font:inherit; min-height:72px}
button.och:hover{background:var(--surface-2)}
div.och{cursor:default; grid-template-columns:auto minmax(0,1fr) auto}
.och .no{cursor:inherit; align-self:start; margin-top:2px}
.ochm{min-width:0; display:grid; gap:5px}
.ochn{font-weight:700; font-size:1.12rem; line-height:1.4; color:var(--ink); overflow-wrap:anywhere}
.ochs{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px}
.och .st{white-space:normal; text-align:left; line-height:1.35; border-radius:16px}
.ochp{grid-column:2/-1; font-size:.92rem; font-weight:700; color:var(--ink-2); line-height:1.5}
.arrl{margin:10px 0 0; font-size:.95rem; color:var(--ink-2)} .arrl b{font-size:1.5rem; color:var(--ink); line-height:1}
.thline{display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:.86rem; font-weight:700; color:var(--ink-2); letter-spacing:.08em}
.thline .linkbtn{min-height:44px; letter-spacing:0}
.mt-mode .mode button{min-height:46px} .mt-mode .mode button small{display:none}
.ochd{white-space:nowrap; text-align:right; color:var(--ink); align-self:start}
.ochd b{font-size:1.8rem; line-height:1}
.ochd small{font-size:.78rem; font-weight:700; color:var(--ink-2); margin-left:2px}
.och .chev{width:10px; height:10px; border-right:2px solid var(--ink-2); border-bottom:2px solid var(--ink-2); transform:rotate(45deg); transition:transform .2s; margin:0 2px 6px 0}
.och[aria-expanded="true"] .chev{transform:rotate(-135deg); margin:6px 2px 0 0}
.och .tlt{grid-column:1/-1; margin:2px 6px 0 12px}
.och.s-ok{color:var(--ok)} .och.s-soon{color:var(--soon)} .och.s-before{color:var(--before)} .och.s-off{color:var(--off)}
.och.s-before .tld{background:var(--surface); box-shadow:0 0 0 2px var(--surface),inset 0 0 0 2.5px var(--before)}
.och.s-off .tld{background:var(--surface); box-shadow:0 0 0 2px var(--surface),inset 0 0 0 2px var(--off)}
.vh2{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); margin:0}
.ocb{padding:0 16px 16px; border-top:1px solid var(--line-2)}
.ocb[hidden]{display:none}
.ocb>.ar{margin-top:12px; font-size:.86rem; color:var(--ink-2)}
.ocb .stline{margin-top:8px}
.ocbar{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:8px}
.ocbar .btn{min-height:46px; font-size:.88rem; font-weight:700; padding:6px 8px}
.ocbar .btn[aria-pressed="true"]{border-color:var(--ink); background:var(--sunk)}
.ocbar .favyu[aria-pressed="true"]{color:var(--star)}
.oc .acts{grid-template-columns:minmax(0,1fr)}
.oc .acts .btn,.ocbar .btn{min-width:0; white-space:normal; line-height:1.3; text-align:center}
.acts2{grid-template-columns:repeat(3,minmax(0,1fr))!important}
html.fs-large .acts2,html.fs-xlarge .acts2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
html.fs-xlarge .ocbar{grid-template-columns:minmax(0,1fr)}
.am-un{font-size:.86rem; color:var(--ink-2); padding:6px 2px}
.plchips .nocar{margin-left:8px; font-size:.72rem; font-weight:700; color:var(--ink-2); background:var(--sunk); border-radius:99px; padding:2px 8px}
.hero-acts.one{display:flex}
.hero-acts.one .btn{flex:none}
.foot{font-size:.84rem; color:var(--ink-2)}
.about .kd{margin:0 2px}
/* スマホ：地図は上に統一、ヘッダーは流したら検索だけ、地図ボタンは小さく */
@media (max-width:919px){
  body[data-view="pl"] .mapwrap{order:-1}
  body:not([data-view="home"]):not([data-view="about"]) #map{height:26vh; min-height:190px}
  body.sc .top .brand .bt, body.sc .top .tb{display:none}
  body.sc .top .in{flex-wrap:nowrap; padding-top:8px; padding-bottom:8px; row-gap:0}
  body.sc .top .search{order:0; flex:1 1 auto}
  body.sc .top .search input{height:46px}
  .mapfab{left:auto; right:14px; bottom:calc(14px + env(safe-area-inset-bottom,0px)); min-height:50px; padding:0 18px; border:1px solid var(--line); border-radius:99px; box-shadow:var(--shadow-2); font-size:.92rem}
  .panel{padding-bottom:88px}
  body[data-nomap="1"] .mapfab{display:none!important}
  .toast{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}
.thsel .chip{white-space:normal; text-align:left; height:auto; min-height:44px; max-width:100%; padding-top:8px; padding-bottom:8px; line-height:1.35}
.hitou{display:inline-flex; align-items:center; font-size:.78rem; font-weight:700; color:#fff; background:#7a4a1e; border-radius:99px; padding:4px 11px; letter-spacing:.04em; white-space:nowrap}
.hg>.chips{min-width:0}
.hg .chip{white-space:normal; text-align:left; height:auto; min-height:44px; padding-top:8px; padding-bottom:8px; line-height:1.35; max-width:100%}
.hg{display:grid; grid-template-columns:3.2em 1fr; gap:6px 8px; align-items:start; margin-top:10px}
.hgl{font-size:.82rem; font-weight:700; color:var(--ink-2); padding-top:10px}
.hlist{list-style:none; margin:0; padding:0 0 8px; display:grid; gap:0}
.hlist li{padding:9px 0; border-bottom:1px solid var(--line-2); display:grid; gap:1px}
.hlist a{font-weight:700}
.hlist small{font-size:.8rem; color:var(--ink-2)}
.olist .grp small{display:block; font-weight:400; font-size:.8rem; color:var(--ink-2); letter-spacing:0}
.chip .nocar{margin-left:8px; font-size:.72rem; font-weight:700; color:var(--ink-2); background:var(--sunk); border-radius:99px; padding:2px 8px}

/* Verified bathing features */
.feature-entry .btn{margin-top:12px}
.feature-extra{margin:14px 0;font-size:.82rem}.feature-extra summary{cursor:pointer;margin-bottom:10px;color:var(--ink-2)}
.feature-selects{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.feature-selects label{font-size:.85rem;font-weight:700;display:flex;flex-direction:column;gap:6px;min-width:0}
.feature-selects select{width:100%;min-width:0;min-height:44px;border:1px solid var(--ink-3);border-radius:5px;padding:8px;background:var(--bg);color:var(--ink);font:inherit}
.feature-hint{margin-top:12px;line-height:1.7}
.feature-badges{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 14px}
.feature-badges span{font-size:.76rem;padding:3px 8px;border:1px solid var(--line);border-radius:4px;color:var(--ink-2)}
.feature-details{margin:14px 0}.feature-details .kv dd{overflow-wrap:anywhere}
.feature-date{display:block;color:var(--ink-3);font-size:.75rem;margin-top:4px}
.feature-results{margin:24px 0 10px}
/* Search results keep the map, selected conditions and list in the same context. */
.catalog-intro{padding-bottom:20px}.catalog-intro .back{margin-bottom:14px}.catalog-intro .h1{font-size:1.65rem;line-height:1.4;margin:0 0 8px}.catalog-intro p{color:var(--ink-2);font-size:.88rem;margin:0 0 18px}
.preset-row{display:flex;flex-wrap:wrap;gap:8px}.preset-row .chip{min-height:40px;font-size:.78rem}
.catalog-toolbar{position:sticky;top:var(--catalog-top,70px);z-index:30;background:var(--bg);padding:12px 0;border-block:1px solid var(--line);scroll-margin-top:var(--catalog-top,70px)}
.catalog-toolbar-row{display:flex;align-items:center;gap:10px}.catalog-toolbar-row h2{font-size:1.6rem;margin:0 auto 0 0;white-space:nowrap}.catalog-toolbar-row h2 small{font-size:.8rem;margin-left:4px}.catalog-toolbar .btn{min-height:44px;padding:7px 10px;font-size:.8rem;gap:5px}
.catalog-sort{min-width:0;max-width:42%}.catalog-sort select{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;padding:6px 24px 6px 8px;background:var(--surface);color:var(--ink);font:inherit;font-size:.8rem}
.filter-number{background:var(--ink);color:var(--bg);border-radius:50%;min-width:19px;line-height:19px;text-align:center;font-size:.72rem}
.active-filters{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.active-filters button{display:flex;align-items:center;gap:10px;min-height:36px;border:1px solid var(--line);border-radius:8px;background:var(--sunk);color:var(--ink);padding:5px 9px;font:inherit;font-size:.76rem;cursor:pointer}.active-filters button span{font-size:1rem}.active-filters .clear-all{background:none;border-color:transparent;text-decoration:underline;color:var(--ink-2)}
.catalog-filters{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;margin:14px 0}.catalog-filters[hidden]{display:none}.cf-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.cf-top h2{margin:0}.catalog-filters fieldset{border:0;padding:0;margin:18px 0}.catalog-filters legend{font-size:.92rem;font-weight:700;margin-bottom:10px}.catalog-filters legend small{display:inline-block;font-size:.7rem;font-weight:400;color:var(--ink-2);margin-left:8px}.catalog-filters .chip{min-height:44px}.pref-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px}.pref-choice{display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit;font-size:.78rem;cursor:pointer}.pref-choice small{font-size:.65rem;color:var(--ink-2)}.pref-choice[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}.pref-choice[aria-pressed="true"] small{color:inherit;opacity:.75}
.feature-extra summary{cursor:pointer;min-height:44px;padding:12px 0;font-size:.86rem}.feature-extra .chips{padding-bottom:12px}.cf-apply{background:var(--ink);color:var(--bg)}
.catalog-result-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;margin:12px 0 16px}.catalog-result-note p{font-size:.7rem;line-height:1.6;color:var(--ink-2);margin:0}.text-btn{font:inherit;font-size:.76rem;color:var(--ink);border:0;border-bottom:1px solid var(--ink-3);background:none;padding:7px 0;min-height:36px;cursor:pointer}.share-fallback{width:100%;min-height:70px;background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.oc-place{display:block;font-size:.75rem;line-height:1.4;color:var(--ink-2);font-weight:400}.card-features{display:flex;gap:5px;flex-wrap:wrap;margin-top:3px}.card-features>span{border:1px solid var(--line);background:var(--sunk);border-radius:5px;padding:3px 6px;font-size:.68rem;line-height:1.4;font-weight:500;color:var(--ink-2)}.card-features .tone:before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;box-shadow:0 0 0 1px var(--ink-3);background:var(--tone)}.tone-white{--tone:#f4f1e6}.tone-clear{--tone:#c5e9e8}.tone-brown{--tone:#a77b56}.tone-gold{--tone:#caa951}.tone-green{--tone:#759c78}.tone-blue{--tone:#8dbad1}.tone-black{--tone:#313538}.st-verify{font-size:.67rem;color:var(--ink-2);border-bottom:1px dotted var(--ink-3);font-weight:500;line-height:1.5}.ochs{gap:6px}.catalog-empty{text-align:left;font-size:.9rem;padding:24px 16px}.catalog-empty p{font-size:.8rem;line-height:1.8;color:var(--ink-2)}.catalog-empty button{display:flex;margin-top:12px;white-space:normal;font-size:.82rem;width:100%}
.catalog-map-controls{position:absolute;top:16px;left:70px;right:16px;display:flex;align-items:center;justify-content:center;gap:12px;z-index:700;pointer-events:none}.catalog-map-controls>span{font-size:.8rem;font-weight:700;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:30px;padding:10px 12px;white-space:nowrap}.catalog-map-controls>button{pointer-events:auto;min-height:44px;font:inherit;font-weight:700;font-size:.85rem;border:1px solid var(--ink-3);border-radius:30px;padding:8px 16px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-2);cursor:pointer}.catalog-map-controls[hidden],.catalog-switch[hidden]{display:none}
.catalog-switch{position:fixed;left:0;right:0;bottom:0;z-index:1500;display:flex;gap:8px;background:var(--surface);border-top:1px solid var(--line);padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px));box-shadow:0 -4px 20px -12px rgba(0,0,0,.2)}.catalog-switch button{flex:1;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer}.catalog-switch [aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
body[data-view="catalog"] .mapfab{display:none!important}body[data-view="catalog"] .panel>.v{animation:none}body[data-view="catalog"] .maplegend{display:none}body[data-view="catalog"] .olist{margin-top:0}
@media(min-width:920px){.catalog-toolbar{top:0;scroll-margin-top:0}.catalog-switch{display:none}.catalog-map-controls{right:130px}}
@media(max-width:919px){body[data-view="catalog"][data-catalog-mode="list"] .mapwrap{display:none}body[data-view="catalog"][data-catalog-mode="map"] .panel{display:none}body[data-view="catalog"][data-catalog-mode="map"] .mapwrap{display:block;padding:0;height:calc(100dvh - var(--catalog-top,70px) - 62px - env(safe-area-inset-bottom,0px))}body[data-view="catalog"][data-catalog-mode="map"] #map{height:100%;min-height:0;border:0;border-radius:0}.catalog-map-controls{left:52px;right:12px;top:12px;flex-wrap:wrap;gap:6px}.catalog-map-controls>button{font-size:.78rem;padding:8px 12px}.catalog-map-controls>span{padding:8px 10px;font-size:.7rem}body[data-view="catalog"] .panel{overflow-x:visible}body[data-view="catalog"] .top .in{transition:none}body[data-view="catalog"].sc .top .in{padding-block:10px}}
@media(max-width:380px){.catalog-toolbar-row{gap:6px}.catalog-toolbar .btn{font-size:.73rem;padding:7px}.catalog-sort select{font-size:.73rem}.catalog-intro .h1{font-size:1.48rem}.pref-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-filters{padding:14px}}

body[data-view="catalog"] .maptools{top:auto;bottom:55px;right:12px}
@media(max-width:420px){body[data-view="catalog"] .tbtn .lbl{display:none!important}body[data-view="catalog"] .catalog-intro{padding-bottom:12px}body[data-view="catalog"] .catalog-intro .back{margin-bottom:8px}body[data-view="catalog"] .catalog-intro p{font-size:.8rem;margin-bottom:10px}.preset-row{gap:6px}.preset-row .chip{min-height:36px}}
/* Visit planning, compact result cards and comparison. */
.catalog-context{display:grid;gap:0;margin-top:8px}
.catalog-context button{min-height:38px;width:100%;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:0;background:none;padding:7px 0;color:var(--ink-2);font:inherit;font-size:.8rem;cursor:pointer}
.catalog-context button span{color:var(--yu);font-size:1.15rem;margin-left:4px}
.catalog-result-note{margin:4px 0 14px;gap:2px}.catalog-result-note p{font-size:.75rem}.text-btn{min-height:44px}
.catalog-toolbar{padding:8px 0}.catalog-toolbar .btn,.catalog-sort select{font-size:.82rem}.catalog-sort{max-width:46%}
.cat-card-top{position:relative}.cat-och{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:14px 14px 8px;color:var(--ink)}
.cat-name{padding-right:42px;font-size:1.03rem;font-weight:700;line-height:1.55;overflow-wrap:anywhere}
.cat-och .oc-place{font-size:.79rem;line-height:1.5;padding-right:34px}
.cat-numbers{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:3px}
.cat-numbers>span{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.cat-numbers small{font-size:.74rem;color:var(--ink-2)}
.cat-numbers b{font-family:var(--f-num);font-size:1.25rem;line-height:1.2;font-variant-numeric:tabular-nums}
.cat-status{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding-top:3px}.cat-status .st{font-size:.75rem}.cat-status .hitou{font-size:.71rem}
.cat-och .card-features{padding-right:84px;min-height:44px;margin:0;align-content:center;gap:4px 8px}
.card-features>span{font-size:.74rem;padding:2px 0;border:0;border-radius:0;background:none;color:var(--ink-2);font-weight:400}
.card-features>span:not(.tone):before{content:'·';margin-right:4px;color:var(--ink-3)}
.cat-quick{display:contents}.cat-star,.compare-pick{cursor:pointer;font:inherit;background:var(--surface);border:1px solid var(--line);color:var(--ink);border-radius:10px;min-height:44px}
.cat-star{position:absolute;top:8px;right:8px;width:40px;font-size:1.5rem;line-height:1;border-color:transparent;background:none}
.cat-star[aria-pressed="true"]{color:var(--star)}.cat-card-top .compare-pick{position:absolute;right:12px;bottom:8px;padding:5px 10px;font-size:.77rem}
.compare-pick[aria-pressed="true"],.peek-actions [aria-pressed="true"]{border-color:var(--moss);color:var(--moss);background:var(--moss-l)}
.verified-detail{font-size:.86rem;line-height:1.8;margin:14px 0}.catalog-when{font-size:.85rem;color:var(--ink-2);padding:10px 0}
.catalog-dialog{border:1px solid var(--line);border-radius:20px;padding:0;background:var(--bg);color:var(--ink);width:min(680px,calc(100% - 32px));max-width:none;max-height:88dvh;box-shadow:var(--shadow-2);overflow:hidden}
.catalog-dialog[open]{display:flex;flex-direction:column}.catalog-dialog::backdrop{background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.sheet-open{overflow:hidden!important}.sheet-head{display:flex;flex:none;justify-content:space-between;gap:12px;align-items:center;padding:12px 20px;border-bottom:1px solid var(--line);background:var(--surface)}
.sheet-head h2{font-size:1.1rem;margin:0;line-height:1.5}.sheet-close,.peek-close{width:44px;height:44px;flex:none;border:0;background:transparent;color:var(--ink);font:inherit;font-size:1.5rem;cursor:pointer;border-radius:50%}
.sheet-close:hover,.peek-close:hover{background:var(--sunk)}.sheet-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 20px 18px;scrollbar-width:thin}
.sheet-scroll fieldset{border:0;border-bottom:1px solid var(--line);padding:0 0 20px;margin:20px 0}
.sheet-scroll legend{font-size:.92rem;font-weight:700;padding:0;margin-bottom:12px}.sheet-scroll legend small{display:block;font-size:.76rem;font-weight:400;color:var(--ink-2);margin-top:4px}
.sheet-scroll .note{font-size:.76rem;line-height:1.8;color:var(--ink-2);margin:10px 0 0}.sheet-scroll .chip{min-height:44px;height:auto;white-space:normal;text-align:left;font-size:.79rem;line-height:1.5;padding:8px 12px}
.seg{display:flex;gap:4px;padding:4px;background:var(--sunk);border:1px solid var(--line);border-radius:12px}
.seg button{flex:1;min-width:0;min-height:44px;padding:8px 6px;font:inherit;font-size:.8rem;line-height:1.5;cursor:pointer;border:1px solid transparent;border-radius:8px;background:none;color:var(--ink-2)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);border-color:var(--ink-3);box-shadow:var(--shadow-1);font-weight:700}
.date-pair{display:grid;grid-template-columns:1.2fr 1fr;gap:12px;margin-top:14px}.date-pair label{min-width:0;display:grid;gap:8px;font-size:.8rem}
.date-pair input{min-width:0;width:100%;min-height:44px;font:inherit;background:var(--surface);color:var(--ink);border:1px solid var(--ink-3);border-radius:8px;padding:8px}
.selected-all{display:flex;flex-wrap:wrap;gap:6px;padding-top:14px}.selected-all:empty{display:none}.remove-token{min-height:40px;max-width:100%;border:1px solid var(--line);border-radius:8px;background:var(--sunk);color:var(--ink);font:inherit;font-size:.76rem;padding:7px 10px;cursor:pointer;overflow-wrap:anywhere}.remove-token span{margin-left:6px}
.sheet-foot{display:flex;flex:none;gap:10px;padding:12px 20px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}
.sheet-foot .btn{min-height:48px;padding:8px 14px;font-size:.9rem;line-height:1.4}.sheet-foot .go{flex:1}.sheet-foot .ghost{flex:none}
.compare-bar{position:fixed;z-index:1490;left:12px;bottom:12px;width:calc(clamp(420px,35vw,540px) - 24px);display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-2);padding:10px 12px;font-size:.8rem}
.compare-bar[hidden]{display:none}.compare-bar .btn{min-height:44px;padding:8px 12px;font-size:.82rem}.compare-bar .text-btn{flex:none;border:0}.compare-bar .btn:disabled{opacity:.65;cursor:default}
body[data-comparing="1"] .panel{padding-bottom:100px}.compare-dialog{width:min(980px,calc(100% - 32px))}.compare-note{font-size:.8rem;line-height:1.7;color:var(--ink-2);margin:14px 0}
.compare-dialog .sheet-scroll{padding:0 16px 16px;display:flex;flex-direction:column}.compare-table-scroll{min-height:0;overflow:auto;border:1px solid var(--line);border-radius:10px;scrollbar-width:thin;overscroll-behavior:contain}
.compare-table-scroll table{border-collapse:separate;border-spacing:0;width:100%;font-size:.83rem;line-height:1.7;table-layout:fixed}
.compare-table-scroll th,.compare-table-scroll td{min-width:200px;width:200px;padding:12px;vertical-align:top;text-align:left;border-bottom:1px solid var(--line);border-right:1px solid var(--line);background:var(--surface);overflow-wrap:anywhere}
.compare-table-scroll th:first-child{width:100px;min-width:100px;position:sticky;left:0;z-index:2;background:var(--surface-2);font-size:.76rem}
.compare-table-scroll thead th{position:sticky;top:0;z-index:3;background:var(--surface-2)}.compare-table-scroll thead th:first-child{z-index:4}
.compare-table-scroll table p{margin:6px 0;font-size:.77rem;color:var(--ink-2)}.compare-table-scroll table small{font-size:.7rem;color:var(--ink-2)}.compare-table-scroll table a{font-size:.76rem}
.compare-table-scroll th .text-btn{display:block;text-align:left;min-height:44px;font-size:.74rem;font-weight:400}.compare-table-scroll tr:last-child>*{border-bottom:0}.compare-table-scroll tr>*:last-child{border-right:0}
.cat-cluster{display:flex;align-items:baseline;justify-content:center;gap:2px;width:44px;height:44px;line-height:40px;background:var(--yu-btn);color:var(--yu-ink);border:2px solid var(--surface);border-radius:50%;font-family:var(--f-num);font-weight:700;font-size:1.25rem;box-shadow:0 0 0 4px color-mix(in srgb,var(--yu-btn) 20%,transparent),var(--shadow-1)}.cat-cluster small{font-family:var(--f-body);font-size:.6rem}
.map-peek{position:absolute;z-index:1100;left:12px;right:12px;bottom:14px;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-2);max-height:45dvh;overflow:auto}
.map-peek[hidden]{display:none}.map-peek h2{font-size:1rem;line-height:1.6;margin:0 32px 3px 0}.map-peek p{font-size:.78rem;color:var(--ink-2);margin:0 0 8px}.peek-close{position:absolute;right:4px;top:4px}.peek-values{display:flex;align-items:baseline;gap:20px;font-size:.82rem}.peek-values b{font-size:1.25rem;font-family:var(--f-num)}.peek-actions{display:flex;gap:8px;margin-top:10px}.peek-actions .btn{flex:1;min-height:44px;font-size:.85rem;padding:8px}
@media(min-width:920px){.map-peek{display:none}html.fs-xlarge .compare-bar{flex-wrap:wrap}.sheet-scroll .pref-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:919px){
 .catalog-dialog{width:100%;margin:auto 0 0;max-height:92dvh;border-radius:20px 20px 0 0;border-bottom:0}
 .sheet-head{padding:10px 16px}.sheet-scroll{padding-inline:16px}.sheet-foot{padding-inline:16px}.sheet-scroll .feature-selects{gap:14px 10px}.sheet-scroll .feature-selects label{font-size:.78rem}.sheet-scroll select{font-size:16px}
 .compare-bar{left:8px;right:8px;width:auto;bottom:calc(66px + env(safe-area-inset-bottom,0px));padding:8px 10px;gap:6px}
 body[data-comparing="1"] .panel{padding-bottom:164px}body[data-comparing="1"] .toast{bottom:calc(146px + env(safe-area-inset-bottom,0px))}
 body[data-comparing="1"][data-catalog-mode="map"] .mapwrap{height:calc(100dvh - var(--catalog-top,70px) - 138px - env(safe-area-inset-bottom,0px))}
 body[data-peek="1"] .maptools{display:none}.compare-dialog .sheet-scroll{padding-inline:10px}.compare-table-scroll th:first-child{min-width:78px;width:78px;padding:10px 8px}.compare-table-scroll th,.compare-table-scroll td{width:190px;min-width:190px;padding:10px}
}
@media(max-width:350px){.cat-och{padding-inline:12px}.cat-numbers{gap:8px}.cat-numbers>span{gap:4px}.cat-numbers small{font-size:.7rem}.cat-och .card-features{padding-right:80px}.compare-bar{font-size:.73rem}.compare-bar .btn{font-size:.76rem;padding:7px 8px}.sheet-scroll .feature-selects{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.panel>.v,.panel>.v>*{animation:none!important}}


.catalog-intro{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding-bottom:14px!important}
.catalog-intro .h1{grid-column:1;grid-row:1;margin:0;font-size:1.5rem}.catalog-intro .back{grid-column:2;grid-row:1;margin:0!important;font-size:.78rem;min-height:44px}
.catalog-intro .preset-row{grid-column:1/-1;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;gap:6px}.catalog-intro .preset-row .chip{flex:none;min-height:44px}
.catalog-context{gap:0}.catalog-context button{line-height:1.5;padding-block:4px}
.catalog-pin-wrap{display:grid;place-items:center}.catalog-pin-wrap .mk-yu{margin:0}.catalog-pin-wrap:focus-visible,.cluster-wrap:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:50%}
@media(max-width:350px){.date-pair{grid-template-columns:1fr}}
/* Keep the map bright and legible even when the surrounding site is dark. */
.mapwrap{color:#203a32;color-scheme:light;--surface:#fff;--surface-2:#f2f5f3;--ink:#203a32;--ink-2:#4b6057;--ink-3:#63766d;--line:#c5d2c9;--bg:#f5f7f4;--moss:#247254;--moss-l:#e8f4ed;--moss-ink:#fff;--yu:#b04421;--yu-btn:#b74925;--yu-ink:#fff;--lake:#2868a7;--lake-ink:#fff;--shadow-2:0 2px 5px #203a3212,0 7px 20px #203a3224}
#map{--m-sea:#e1edf0;--m-land:#f1f3ee;--m-home:#fafbf5;--m-border:#aabdad;--m-road:#d8c5b0;--m-mway:#c9a27b;--m-river:#a3c5d5;--m-lake:#d0e7ee;--m-label:#3e5b4c;background:var(--m-sea)}
#map.tiles-on .leaflet-tile-pane{filter:none!important}#map .leaflet-tile{mix-blend-mode:normal}
#map[data-style="simple"] .leaflet-tile-pane{filter:saturate(.38) contrast(.92) brightness(1.035)!important}
#map .mk-yu,#map .mk-yu.off,#map .mk-yu.ok,#map .mk-yu.soon,#map .mk-yu.before{background:#b74925;color:#fff;border:2px solid #fff;box-shadow:0 1px 5px #203a3255}
#map .mk-yu.hl{outline:3px solid #193e31;outline-offset:3px;transform:scale(1.12)}
#map .mk-mt i{background:#236b4e}#map .mk-mt.sel i{background:#144e36}#map .mk-mt b{display:none!important}
#map .mk-mt i:after{background:#ffffff70}.map-mountain-wrap{display:grid;place-items:center}.map-mountain-wrap .mk-mt{transform:translateY(8px)}
.map-name-label{position:absolute;display:block;z-index:2;padding:4px 7px;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:700 12px/18px var(--f-body);height:26px;border-radius:6px;background:#fffffff5;color:#203a32;box-shadow:0 1px 4px #203a3228;border:1px solid #d7dfd9;pointer-events:none}
.map-name-label[hidden]{display:none}.map-group-wrap{display:grid;place-items:center}.map-group{display:flex;align-items:center;justify-content:center;gap:3px;width:64px;min-height:38px;border-radius:22px;border:2px solid white;box-shadow:0 2px 6px #263f3555;background:#b74925;color:#fff;font:700 17px var(--f-body)}.map-group i{font-style:normal;font-size:17px}.map-group small{font-size:10px;font-weight:400}.map-group.mountain{background:#236b4e}.map-group-wrap:focus-visible{outline:3px solid #203a32;outline-offset:3px;border-radius:24px}
.maptools,body[data-view="catalog"] .maptools{top:auto;bottom:26px;left:12px;right:12px;max-width:420px;margin:0 auto;display:flex;flex-direction:row;align-items:center;gap:4px;padding:6px;background:#fffffff5;border:1px solid #c5d2c9;border-radius:14px;box-shadow:var(--shadow-2);z-index:900}
.maptools .mtool{flex:none;min-width:44px;height:44px;padding:4px 7px;display:flex;justify-content:center;gap:3px;font-size:12px;border-radius:9px;box-shadow:none;background:white;color:#203a32;border-color:transparent}.maptools .mtool:hover{background:#edf4ef}.maptools .mtool svg{width:17px;height:17px}.maptools .mtool.loc{flex-direction:column;gap:1px;font-size:10px;line-height:1.15}
.map-style{flex:1;min-width:0}.map-style select{height:44px;width:100%;min-width:0;background:#f2f6f3;color:#203a32;border:1px solid #c5d2c9;border-radius:9px;font:700 13px var(--f-body);padding:7px 22px 7px 9px}
.maplegend,body[data-view="catalog"] .maplegend{display:flex;left:12px;bottom:91px;right:auto;max-width:calc(100% - 24px);margin:0;gap:8px;font:500 11px/1.5 var(--f-body);padding:5px 9px;border-radius:8px;background:#ffffffed;color:#415a4d;border:1px solid #c5d2c9;z-index:600;box-shadow:none}
.legend-mountain{color:#236b4e;font-weight:700}.legend-bath{color:#a53f1f;font-weight:700}.legend-parking{color:#2868a7;font-weight:700}
.catalog-map-controls{right:12px;left:60px;top:12px;justify-content:flex-start;flex-wrap:wrap;gap:5px}.catalog-map-controls>span{padding:6px 10px;font-size:11px}.catalog-map-controls>button{padding:7px 11px;font-size:12px;min-height:40px}
.map-peek{bottom:26px;background:#fff;color:#203a32;z-index:1200}.map-peek .card-features>span{color:#4b6057}.map-peek .btn{color:#203a32}.map-peek .btn.go{color:white}
body[data-peek="1"] .maptools,body[data-peek="1"] .maplegend{display:none}
.map-close{position:absolute;right:12px;top:12px;min-height:44px;border:1px solid #c5d2c9;background:#fff;color:#203a32;border-radius:12px;padding:8px 12px;font:700 13px var(--f-body);z-index:2000;box-shadow:var(--shadow-2);cursor:pointer}.map-close[hidden]{display:none}
.map-feedback{position:absolute;top:72px;left:60px;right:12px;padding:6px 8px;background:#fff;color:#4b6057;font-size:11px;line-height:1.5;z-index:700;border:1px solid #c5d2c9;border-radius:8px}.map-feedback[hidden]{display:none}
body.map-expanded-open{overflow:hidden!important}.mapwrap.map-expanded{position:fixed!important;inset:0!important;width:100%!important;height:100dvh!important;z-index:3000!important;padding:0!important;margin:0!important;display:block!important;background:#e1edf0}.mapwrap.map-expanded #map{height:100%!important;min-height:0!important;border:0;border-radius:0}.map-expanded .catalog-map-controls{right:100px}.map-expanded .map-peek{display:block;max-width:480px;margin:auto}.map-expanded .map-peek[hidden]{display:none}
@media(max-width:919px){body[data-view="mt"] #map,body[data-view="yu"] #map,body[data-view="pl"] #map,body[data-view="near"] #map,body[data-view="fav"] #map{height:42vh;min-height:300px}.mapwrap{padding:10px 12px 0}.maptools{left:24px;right:24px}.maplegend{left:24px}.map-feedback{left:70px;right:24px}body[data-view="catalog"] .maptools,.map-expanded .maptools{left:12px;right:12px}body[data-view="catalog"] .maplegend,.map-expanded .maplegend{left:12px}.map-expanded .map-feedback{left:60px;right:12px}.map-expanded .catalog-map-controls{right:96px}.leaflet-popup-content{min-width:170px;max-width:calc(100vw - 80px)} }
@media(max-width:350px){.maptools .mtool{padding:4px 5px;min-width:42px}.map-style select{font-size:12px}.maptools{gap:2px}.catalog-map-controls{gap:4px}.maplegend{font-size:10px}.catalog-map-controls>span{font-size:10px}}


body[data-view] .mapwrap .maplegend{display:flex}body[data-peek="1"] .mapwrap .maplegend{display:none}
.map-group{width:76px;white-space:nowrap}.map-group small{white-space:nowrap;flex:none}.map-group i{flex:none}
body[data-view] .map-expanded .catalog-map-controls{top:65px;left:60px;right:12px;flex-wrap:wrap}
@media(max-width:919px){body[data-view="mt"] .mapwrap #map,body[data-view="yu"] .mapwrap #map,body[data-view="pl"] .mapwrap #map,body[data-view="near"] .mapwrap #map,body[data-view="fav"] .mapwrap #map{height:42dvh;min-height:320px}}

/* Fullscreen map: a visible entry, safe-area spacing, and a viewport fallback for embedded browsers. */
.map-enter{position:absolute;top:12px;right:12px;z-index:1000;display:flex;align-items:center;gap:6px;min-height:44px;padding:8px 12px;border:1px solid #247254;border-radius:12px;background:#fff;color:#203a32;font:700 13px var(--f-body);box-shadow:var(--shadow-2);cursor:pointer}
.map-enter svg{width:18px;height:18px;flex:none}.map-enter:hover{background:#edf4ef}
.mapwrap .catalog-map-controls{right:124px}.catalog-map-controls>button{max-width:100%}
.map-expanded #mapExpand{display:none}.map-expanded .map-close{top:calc(12px + env(safe-area-inset-top,0px));right:calc(12px + env(safe-area-inset-right,0px))}
.mapwrap.map-expanded{height:100vh!important;height:100dvh!important;overscroll-behavior:none}
.map-expanded .leaflet-top{top:env(safe-area-inset-top,0px)}.map-expanded .leaflet-left{left:env(safe-area-inset-left,0px)}
body[data-view] .map-expanded .catalog-map-controls{top:calc(66px + env(safe-area-inset-top,0px));left:calc(60px + env(safe-area-inset-left,0px));right:calc(12px + env(safe-area-inset-right,0px))}
body[data-view] .map-expanded .maptools{bottom:calc(26px + env(safe-area-inset-bottom,0px));left:calc(12px + env(safe-area-inset-left,0px));right:calc(12px + env(safe-area-inset-right,0px))}
body[data-view] .map-expanded .maplegend{bottom:calc(91px + env(safe-area-inset-bottom,0px));left:calc(12px + env(safe-area-inset-left,0px))}
.map-expanded .map-peek{bottom:calc(26px + env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 180px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain}
body.map-expanded-open .mapfab,body.map-expanded-open #catalog-switch{visibility:hidden}

/* Place details: choose a map before choosing a route. */
.place-links{min-width:0;width:100%}.place-links>summary{display:flex;justify-content:center;gap:10px;list-style:none;cursor:pointer}.place-links>summary::-webkit-details-marker{display:none}.place-links[open]>summary>span{transform:rotate(180deg)}
.place-options{margin-top:8px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);text-align:left;overflow-wrap:anywhere}
.place-query{margin:0;font-size:.94rem;font-weight:750;line-height:1.5}.place-intro{margin:6px 0 12px;color:var(--ink-2);font-size:.8rem;line-height:1.6}.place-providers{display:grid;gap:7px}.place-provider{position:relative;display:grid;gap:3px;min-height:44px;padding:10px 30px 10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink)}.place-provider:hover{border-color:var(--moss)}.place-provider b{font-size:.92rem}.place-provider small{font-size:.75rem;color:var(--ink-2);line-height:1.5}.place-provider>span{position:absolute;right:12px;top:14px}
.place-copy{display:block;margin-top:8px;min-height:44px;padding:8px 0;border:0;background:none;color:var(--moss);font:700 .82rem var(--f-body);cursor:pointer;text-decoration:underline}.place-copy-status{margin:0 0 8px;color:var(--moss);font-size:.8rem;line-height:1.5}.place-routes{border-top:1px solid var(--line);margin-top:8px;padding-top:10px}.place-routes p{margin:0 0 6px;font-size:.82rem;font-weight:700}.place-routes>div{display:flex;flex-wrap:wrap;gap:8px}.place-routes a{display:flex;align-items:center;min-height:44px;font-size:.8rem;padding:6px 8px;border:1px solid var(--line);border-radius:8px;color:var(--moss)}.place-route-note{font-size:.74rem;line-height:1.7;color:var(--ink-2);margin:10px 0 0}
.park .acts .place-links,.access .acts .place-links{flex-basis:100%}.pp .a .place-links{flex-basis:100%}.pp .place-options{padding:10px}.pp .place-query{font-size:13px}.pp .place-intro,.pp .place-route-note{font-size:11px}
.mapwrap.place-popup-open .maptools,.mapwrap.place-popup-open .maplegend,.mapwrap.place-popup-open .map-enter{visibility:hidden}.map-peek>.place-links{margin-top:8px}.map-peek .place-options{max-height:min(380px,50dvh);overflow:auto;overscroll-behavior:contain}.map-peek> .place-links>summary{min-height:44px}.mapwrap .place-options{--ink:#203a32;--ink-2:#4b6057;--moss:#247254}
/* 日帰り・宿泊の切替 */
.use-choice{margin:16px 0;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.catalog-intro .use-choice{grid-column:1/-1;margin:4px 0 8px}
.use-choice h2{margin:0 0 10px}.use-choice p{margin:10px 0 0}.use-seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}.use-seg .chip{white-space:normal;justify-content:center;min-height:42px}
.lodging-info{padding:14px;border:1px solid #b3c5d6;border-radius:12px;background:var(--lake-l);margin:12px 0}.lodging-info h4{margin:0 0 8px;font-size:15px}.lodging-info h4 span{display:block;font-size:12px;color:var(--ink-2);margin-top:5px}.lodging-info p{margin:8px 0}.stay-book{background:var(--lake);color:var(--lake-ink);border-color:var(--lake)}
.st.stay{background:var(--lake-l);color:var(--lake)}.oc.st-stay{border-color:#b3c5d6}.mk-yu.stay{background:#1c5a86;border-color:#fff;color:#fff}
.st.verify{background:var(--sunk);color:var(--ink-2)}.mk-yu.verify{background:var(--ink-3);border-color:#fff;color:#fff}
.lodging-entry{background:var(--lake-l);padding:20px;border-radius:16px}.lodging-entry h2{margin-top:0}

.stay-tags,.stay-actions{display:flex;flex-wrap:wrap;gap:8px}.stay-tags span{font-size:12px;border-radius:20px;padding:4px 10px;background:var(--paper);color:var(--lake)}
.stay-book small{display:block;font-size:11px;font-weight:400;margin-top:3px}.affiliate-disclosure{font-size:12px;line-height:1.7;color:var(--ink-2)}.affiliate-disclosure b{display:inline-block;padding:1px 6px;border:1px solid currentColor;border-radius:4px;margin-right:4px}.affiliate-plans{margin:12px 0}
.lodging-optional>summary{cursor:pointer;font-weight:700;color:var(--lake)}.lodging-optional>div{padding-top:12px}.lodging-relations,.lodging-sources{font-size:12px;line-height:1.8;margin-top:12px}.lodging-relations summary,.lodging-sources summary{cursor:pointer}.lodging-info ul{padding-left:20px}.lodging-info li{margin:7px 0;overflow-wrap:anywhere}
/* ホームは山と駐車場を入口にし、補助の一覧は必要なときに開く。 */
.home-compact .hero{padding-top:24px;padding-bottom:22px}
.home-compact .hero-in{gap:12px}
.home-compact .hero-h{font-size:clamp(1.8rem,6.6vw,2.35rem);line-height:1.3;margin:0;letter-spacing:.04em}
.home-compact .hero-lead{font-size:.92rem;max-width:32em}
.home-compact .hero-acts .btn{min-height:46px;padding:8px 16px}
.home-compact .eyebrow{font-size:.76rem;letter-spacing:.08em}
.home-compact .eyebrow .numf{font-size:1.02rem}
.home-compact .home-recent{display:grid;gap:8px;margin-top:18px}
.home-compact .home-pick{margin-top:22px}
.home-compact .home-pick .blk-h{margin-bottom:8px;padding-bottom:8px}
.home-compact .home-regions{margin-top:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px;align-items:start}
.home-compact .home-regions>.region[open]{grid-column:1/-1}
.home-compact .home-regions>.region>summary{gap:6px;font-size:.88rem;min-height:54px;padding-block:12px;line-height:1.35}
.home-compact .home-regions .home-region-name{min-width:0;flex:1;overflow-wrap:anywhere}
.home-compact .home-regions>.region>summary .dot{width:8px;height:8px}
.home-compact .home-regions>.region>summary .c{font-size:.88rem;white-space:nowrap;flex:none}
.home-compact .home-regions>.region>summary::after{width:7px;height:7px;margin-right:2px;margin-left:1px;flex:none}
.home-fold{border-bottom:1px solid var(--line)}
.home-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:50px;padding:12px 4px;font-size:.91rem;font-weight:700;border-radius:8px}
.home-fold>summary:hover{background:var(--surface)}
.home-fold>summary::-webkit-details-marker{display:none}
.home-fold>summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s var(--ease);margin:0 6px 0 auto;flex:none}
.home-fold[open]>summary::after{transform:rotate(225deg) translate(-2px,-2px)}
.home-summary-note{margin-left:auto;font-weight:400;font-size:.78rem;color:var(--ink-3);white-space:nowrap}
.home-fold>summary .home-summary-note+*{margin-left:0}
.home-fold-body{padding:4px 0 14px}
.home-fold-body>p.note:last-child{margin-bottom:0}
.home-pick+.home-secondary{margin-top:16px}
.home-refine[open]{margin-bottom:12px}
.home-catalog-links{margin-top:18px}
.home-catalog-links>p{margin:0 0 8px}
.home-link-row{display:flex;flex-wrap:wrap;gap:8px}
.home-link-row .btn{font-size:.82rem;min-height:42px;padding:7px 12px;border-radius:12px}
.home-compact .foot{margin-top:20px}
@media(min-width:920px){.home-compact .hero{padding-top:28px;padding-bottom:24px}}
@media(max-width:480px){.home-compact .hero .eyebrow .cnts{flex-basis:auto}.home-compact .hero .eyebrow .sep{display:inline-block;margin-inline:2px}.home-compact .hero-h{font-size:1.95rem}.home-link-row .btn{flex:1 1 auto}.home-compact .home-regions .region>summary{min-height:52px;padding-block:11px}}
@media(max-width:350px){.home-compact .hero .eyebrow .sep{display:none}.home-compact .hero .eyebrow .cnts{flex-basis:100%}.home-compact .hero-h{font-size:1.75rem}.home-fold>summary{gap:6px;font-size:.85rem}.home-summary-note{font-size:.72rem}}
html.fs-large .home-compact .home-regions,html.fs-xlarge .home-compact .home-regions{grid-template-columns:minmax(0,1fr)}

/* 山の駐車場を起点にし、施設では地図と公式を主操作にする。 */
.parking-origin{padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);margin:12px 0 20px}
.parking-origin-head{display:flex;align-items:center;gap:10px}.parking-origin-head small,.parking-origin-head b{display:block}.parking-origin-head small{font-size:.75rem;color:var(--ink-2)}.parking-origin-head b{font-size:1.05rem;line-height:1.5}.parking-origin .pk{display:grid;place-items:center;flex:none;width:32px;height:32px;background:var(--lake);color:var(--lake-ink);border-radius:8px;font-style:normal;font-weight:700}.parking-origin>p{font-size:.86rem;margin:8px 0;line-height:1.7}.parking-origin .parking-map{margin-top:10px}.parking-origin .parkd{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0}.parking-origin .parkd>summary{padding:10px 0}.parking-purpose{margin:24px 0 12px}.parking-purpose h2{margin:10px 0}.parking-stay{border:1px solid var(--line);border-radius:var(--r);padding:0 14px;margin:24px 0;background:var(--surface)}.parking-stay>summary{min-height:54px;padding:14px 0;cursor:pointer;font-weight:700}.parking-stay>summary small{font-weight:400;color:var(--ink-2);margin-left:8px}.parking-stay>.btn{margin:0 0 16px}.stay-preview{list-style:none;padding:0;margin:12px 0}.stay-preview li{padding:12px 0;border-top:1px solid var(--line)}.stay-preview a{font-weight:700}.stay-preview small{display:block;color:var(--ink-2);font-size:.76rem;margin:4px 0}.stay-preview p{font-size:.84rem;line-height:1.7;margin:6px 0}
.facility-acts{display:block}.facility-acts>.acts2{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin-bottom:8px}.facility-acts>.acts2>.btn:only-child,.facility-acts>.acts2>.facility-map:only-child,.facility-acts>.acts2>.facility-map[open]{grid-column:1/-1}.facility-map>summary{min-height:44px}.stay-actions>.facility-map{flex-basis:100%}.place-links>summary.place-secondary{background:none;border:0;border-top:1px solid var(--line);box-shadow:none;border-radius:0;color:var(--ink-2);display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:10px 0;font-size:.82rem;font-weight:600}.facility-page{display:block;margin-top:8px;font-size:.82rem;min-height:40px}.lodging-bath{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:12px 0}.lodging-bath>summary{cursor:pointer;min-height:46px;padding:12px 0;font-size:.85rem;font-weight:600}.lodging-bath>div{padding-bottom:12px}.facility-relations{margin:14px 0 0;border-top:1px solid var(--line)}.facility-relations>summary{min-height:46px;padding:12px 0;font-weight:600}.facility-relations ul{padding-left:0;list-style:none}.facility-relations li{border-top:1px solid var(--line);padding-top:8px}.related-trail{display:grid;width:100%;gap:3px;background:transparent;border:0;color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-height:52px;padding:8px 0}.related-trail span{font-size:.84rem}.related-trail small{font-size:.76rem;color:var(--ink-2)}
.nearby-unconfirmed{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:20px 0}.nearby-unconfirmed>summary{cursor:pointer;padding:14px 0;min-height:50px;font-weight:600;font-size:.86rem}.nearby-unconfirmed>summary small{font-weight:400;color:var(--ink-2);margin-left:6px}
.daytrip-coverage{font-size:.84rem;line-height:1.75;color:var(--ink-2);margin:10px 0 14px;overflow-wrap:anywhere}.daytrip-coverage p{margin:5px 0}.daytrip-coverage strong{color:var(--ink);font-weight:600}.daytrip-other{border-top:1px solid var(--line);margin:20px 0}.daytrip-other>summary{cursor:pointer;min-height:50px;padding:14px 0;font-size:.86rem;font-weight:600;overflow-wrap:anywhere}.daytrip-other>summary small{font-weight:400;color:var(--ink-2);margin-left:6px}.nearby-unconfirmed .unknown-more>summary{cursor:pointer;min-height:46px;padding:12px 0;font-size:.84rem;color:var(--lake)}
.drive-sources{font-size:.78rem;line-height:1.75;color:var(--ink-2);margin:8px 0 14px;overflow-wrap:anywhere}.drive-sources>summary{cursor:pointer;min-height:44px;padding:10px 0}.drive-sources p{margin:5px 0}.drive-access{font-size:.82rem;line-height:1.65;padding:8px 12px;margin:0;border-top:1px solid var(--line);color:var(--ink-2)}.drive-access strong{color:var(--ink)}
/* ホームの主導線は検索。入力と候補は同じDOMを使い回す。 */
.header-search{flex:1;min-width:0;max-width:640px}
.search-row{display:flex;align-items:center;gap:8px}
.search-box{position:relative;flex:1;min-width:0}
.search-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.search-go{border:1px solid var(--moss);border-radius:12px;background:var(--moss);color:var(--moss-ink);min-height:54px;padding:0 16px;flex:none;font-weight:700;cursor:pointer}
.search-go:hover{background:var(--moss-2)}
body[data-view="home"] .header-search{flex:none;max-width:none}
body[data-view="home"] .hero{padding-block:22px 18px}
body[data-view="home"] .hero-in{gap:10px}
body[data-view="home"] .hero-h{font-size:clamp(1.65rem,6vw,2rem)}
.home-search-slot{margin-top:4px;min-width:0}
.home-search-slot .search{max-width:none}
.home-search-slot .search-label{position:static;display:block;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;font-size:1rem;font-weight:700;margin-bottom:8px;color:var(--moss)}
.home-search-slot input{height:54px;border:2px solid var(--moss);border-radius:12px;background:var(--surface);font-size:1rem;padding-left:40px;padding-right:40px}
.home-search-slot .ic{left:13px;color:var(--moss)}
.home-search-slot .clr{right:1px}
.home-search-slot .sugg{position:relative;top:auto;margin-top:10px;border-color:var(--moss);max-height:min(48dvh,360px);border-radius:12px;box-shadow:var(--shadow-1)}
.search-examples{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;font-size:.8rem;color:var(--ink-2);margin:0}
.search-example{padding:3px 0;min-height:38px;border:0;background:none;color:var(--lake);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-weight:700}
.home-search-flow{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;padding-top:8px;border-top:1px solid var(--line);margin:0;font-size:.78rem;color:var(--ink-2)}
.home-search-flow span:first-child{font-weight:700;color:var(--moss)}
@media(max-width:919px){
  .header-search{order:3;flex:1 1 100%;max-width:none}
  body[data-view="home"] .header-search{order:0;flex:none;margin-left:auto}
  body[data-view="home"] .top .in{flex-wrap:nowrap;gap:8px;padding-block:10px}
  body[data-view="home"] .top .tb{margin-left:0}
  body[data-view="home"] .top .brand .bt{font-size:1.1rem;letter-spacing:.03em}
  body[data-view="home"] .top .brand .bt small{display:none}
  body[data-view="home"] .top .tb .lbl{display:none!important}
  body.sc .header-search{order:0;flex:1 1 auto}
  body[data-view="home"].sc .header-search{flex:none}
}
@media(max-width:480px){body[data-view="home"] .hero-h{font-size:1.7rem}.search-go{padding-inline:12px}.home-search-slot input{font-size:.92rem}}
@media(max-width:480px){html.fs-xlarge body[data-view="home"] .top .brand .bt{display:none}}
@media(max-width:350px){body[data-view="home"] .top .brand .bt{display:none}body[data-view="home"] .top .in{gap:6px;padding-inline:12px}body[data-view="home"] .top .tbtn{padding-inline:8px;font-size:.8rem}body[data-view="home"] .hero-h{font-size:1.55rem}}
/* 日帰り温泉は、道のり・料金・受付を先に読み比べられるように。 */
.oc{border-radius:12px;box-shadow:none}
.oc:hover{box-shadow:none;border-color:var(--ink-3)}
.oc .och:not(.cat-och):not(.is-lodging){grid-template-columns:auto minmax(0,1fr) auto;gap:8px 10px}
.oc .ochm{min-width:0}
.oc .ochn{font-family:var(--f-display);font-size:1.15rem;line-height:1.55;letter-spacing:.02em}
.oc .no{width:28px;height:28px;border-radius:7px;font-size:1rem}
.oc .ochs{margin-top:7px}
.oc .ochs .st,.oc .cat-status .st{background:none;padding:0;border-radius:0;font-size:.78rem;line-height:1.6}
.oc .st.ok::before{animation:none}
.oc .ochs .hitou,.oc .cat-status .hitou{background:none;border:0;border-radius:0;color:var(--ink-2);padding:0;font-size:.7rem;font-weight:500;letter-spacing:0}
.oc .bath-facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(var(--facts,3),minmax(0,1fr));gap:6px;margin-top:6px;padding:10px 0 2px;border-top:1px solid var(--line-2);color:var(--ink)}
.oc .bath-facts>span{display:grid;align-content:start;gap:3px;min-width:0}
.oc .bath-facts small{font-family:var(--f-body);font-size:.72rem;font-weight:400;color:var(--ink-2);line-height:1.5}
.oc .bath-facts b{font-family:var(--f-num);font-size:1.2rem;font-weight:600;line-height:1.45;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.oc .bath-facts .fact-value{font-family:var(--f-num);font-size:1.2rem;font-weight:600;line-height:1.45;font-variant-numeric:tabular-nums}
.oc .bath-facts .fact-value b{font-size:inherit}.oc .bath-facts .fact-value small{margin-left:2px}
.oc .och>.card-features{grid-column:1/-1;margin-top:3px}
.oc .card-features{gap:4px 12px;line-height:1.6}
.oc .card-features>span{font-size:.76rem}
.oc .ochp{grid-column:1/-1;padding-left:0;font-size:.76rem}
.oc .cat-och{gap:5px;padding-top:16px}
.oc .cat-name{font-family:var(--f-display);font-size:1.15rem;letter-spacing:.02em}
.oc .cat-och .card-features{min-height:44px}
.oc .ocb{padding-top:2px}
.oc .card-visit{margin:10px 0 0}
.oc .card-cautions{margin-top:12px}
.oc .facility-acts{margin-top:12px}
.oc .facility-page{margin-top:0;min-height:44px}
.oc .ocbar{border-top:1px solid var(--line-2);padding-top:8px;margin-top:4px}
.oc .ocbar .btn{border:0;border-radius:6px;color:var(--ink-2);font-size:.8rem}
.oc .card-info{margin-top:8px}
.oc .card-info>summary{font-weight:500;font-size:.84rem;line-height:1.6}
.oc .card-info>.body{padding-top:10px}
.oc .card-feature-details{border-top:1px solid var(--line-2);padding-top:12px}
.oc .card-feature-details h4{font-size:.86rem;margin:0 0 12px}
.oc .card-feature-details .note{line-height:1.8;margin-bottom:0}
.oc .rpt{margin-top:6px}
.oc .rptbtn{font-size:.78rem;min-height:44px}
html.fs-large .oc .bath-facts,html.fs-xlarge .oc .bath-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
/* Compact page navigation; main search and action controls retain their layout. */
.page-crumbs{font-size:.76rem;color:var(--ink-2);margin:0 0 10px;line-height:1.5}
.page-crumbs ol{display:flex;align-items:center;flex-wrap:wrap;list-style:none;padding:0;margin:0;gap:0 5px}
.page-crumbs li{display:flex;align-items:center;min-width:0;max-width:100%;gap:5px;overflow-wrap:anywhere}
.page-crumbs li+li:before{content:'›';color:var(--ink-2);flex:none}
.page-crumbs a{display:inline-flex;align-items:center;min-height:36px;color:var(--moss);text-underline-offset:3px}
.page-crumbs [aria-current]{font-weight:600}
.page-directory,.page-related{margin:14px 0 8px;font-size:.8rem;text-align:left;border-top:1px solid var(--line)}
.page-directory summary,.page-related summary{padding:12px 0;min-height:44px;cursor:pointer;color:var(--ink-2)}
.page-directory nav,.page-related nav{display:flex;flex-wrap:wrap;gap:2px 16px;padding:0 0 8px}
.page-directory a,.page-related a{display:inline-flex;align-items:center;min-height:44px;max-width:100%;color:var(--moss);overflow-wrap:anywhere;text-underline-offset:3px}
a.related-trail{color:inherit;text-decoration:none}
.page-crumbs a:focus-visible,.page-directory a:focus-visible,.page-related a:focus-visible,a.related-trail:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.bath-kind-group{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.bath-kind-group .bath-kind{display:inline-flex;align-items:center;gap:4px;margin:0;padding:2px 6px;border:1px solid transparent;border-radius:5px;font-size:.68rem;line-height:1.5;font-weight:700}
.bath-kind-group .kind-onsen{color:#843b28;background:#f7e6dc;border-color:#e5c5b6}
.bath-kind-group .kind-sento{color:#245a76;background:#e5eff6;border-color:#bed5e4}
.bath-kind-group .kind-unknown,.bath-kind-group .kind-other{color:#535f58;background:#eef0ea;border-color:#d3d9d0}
.bath-kind-group [aria-hidden]{font-size:1.1em;line-height:1}
.catalog-around-link+small.note{display:block;margin-top:2px}
.mountain-guide-lead{margin:10px 0 16px;color:var(--ink-2);font-size:.86rem;line-height:1.75;overflow-wrap:anywhere}
.mountain-guide-details{margin-top:18px;border-top:1px solid var(--line)}
.mountain-guide-details>summary{min-height:44px;padding:12px 0;font-size:.86rem;font-weight:700;cursor:pointer}
.mountain-guide-questions{padding-bottom:12px}
.mountain-guide-questions section+section{margin-top:14px}
.mountain-guide-questions h3{margin:0 0 4px;font-size:.86rem;line-height:1.6}
.mountain-guide-questions p,.mountain-guide-questions li{margin:0;color:var(--ink-2);font-size:.82rem;line-height:1.8;overflow-wrap:anywhere}
.mountain-guide-questions ul{padding-left:20px}
.oc .bath-facts .fact-text{font-family:var(--f-body);font-size:.92rem;font-weight:600;line-height:1.6;overflow-wrap:anywhere}
@media(max-width:600px){.oc .bath-facts--4{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:10px}}
@media(max-width:600px){button.results-shortcut{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:8px;row-gap:1px;text-align:left}button.results-shortcut>span[aria-hidden]{grid-row:1 / 3}button.results-shortcut small{grid-column:2;margin-left:0;white-space:normal;font-size:.72rem;line-height:1.4}}