/* Home · Estación: station signage on the site's paper, with one olive line colour (--rail) for the active leg, today and the station number. */
body.home-page {
  --ground:#f6f7f2; --ink:#202420; --muted:#5b6259; --hair:#d9ded4; --hair-strong:#b7c0b0; --rail:#365440; --rail-soft:#607d67; --rail-deep:#2a4333;
  --jp:'Zen Kaku Gothic New','Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light; background:var(--ground); color:var(--ink); font-family:var(--jp); font-size:17px; line-height:1.6;
  scrollbar-color:var(--hair) var(--ground);
}
.home-page ::selection { background:#dbe5d3; color:var(--ink); }
.home-page a:focus-visible,.home-page summary:focus-visible { outline:3px solid var(--rail); outline-offset:3px; }
.home-page .skip-link { background:var(--ink); }
.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* Header: signage bar */
.home-page .site-header { background:var(--ground); border-bottom:1px solid var(--hair); }
.home-page .site-header-inner { max-width:1280px; min-height:68px; padding:0 40px; }
.home-page .site-brand { gap:10px; font-family:var(--jp); font-size:21px; font-weight:900; letter-spacing:0; }
.home-page .brand-number { width:auto; height:auto; min-width:30px; padding:2px 6px; background:none; color:var(--rail); border:2px solid var(--rail); border-radius:6px; font:700 15px/1.2 var(--jp); font-variant-numeric:tabular-nums; }
.home-page .site-nav { gap:4px; }
.home-page .site-nav a { display:inline-flex; align-items:center; min-height:44px; padding:0 14px; font:500 15px var(--jp); color:var(--muted); border-radius:0; border-bottom:3px solid transparent; }
.home-page .site-nav a:hover { background:none; color:var(--ink); border-bottom-color:var(--hair); }
.home-page .site-nav a[aria-current="page"] { background:none; color:var(--ink); font-weight:700; border-bottom-color:var(--rail); }

.home-shell { max-width:1280px; margin:0 auto; padding:56px 40px 32px; }
.home-shell h1,.home-shell h2,.home-shell h3 { font-family:var(--jp); }

/* Today */
.today { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr); grid-template-areas:"head plan" "body plan"; grid-template-rows:auto 1fr; column-gap:clamp(40px,5vw,72px); padding-bottom:40px; }
.today-head { grid-area:head; }
.today-body { grid-area:body; }
.today-plan { grid-area:plan; align-self:stretch; display:flex; flex-direction:column; justify-content:center; padding-left:clamp(28px,3.4vw,48px); border-left:1px solid var(--hair); }
.today-meta { display:flex; flex-wrap:wrap; gap:4px 20px; margin:0 0 22px; font-size:16px; color:var(--muted); font-variant-numeric:tabular-nums; }
.today-meta span:first-child { color:var(--ink); font-weight:700; }
.today-meta span:empty { display:none; }
.today h1 { margin:0 0 18px; font-size:clamp(2.25rem,min(6.6vw,calc(50vw / var(--run,1))),6rem); word-break:auto-phrase; line-height:1.1; font-weight:900; letter-spacing:-.02em; text-wrap:balance; }
.jp-run { white-space:nowrap; }
.today-focus { max-width:58ch; margin:0 0 36px; font-size:19px; line-height:1.7; color:var(--muted); }
.today-focus[hidden] { display:none; }
.today h2 { margin:0 0 12px; font-size:15px; font-weight:700; color:var(--muted); letter-spacing:0; }
.jp-group + .jp-group { margin-top:32px; }
.jp-targets,.jp-words { display:flex; flex-wrap:wrap; gap:10px 36px; margin:0; padding:0; list-style:none; font-size:24px; line-height:2.1; font-weight:500; }
.jp-targets li,.jp-words li { padding:0; }
.jp-targets { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr)); gap:0 36px; }
.jp-targets li { word-break:auto-phrase; overflow-wrap:anywhere; padding:6px 0; border-top:1px solid var(--hair); }
.home-page ruby { ruby-align:center; }
.home-page ruby rt { font-size:.62em; font-weight:500; color:var(--muted); }

/* Session panel: station number, date, one action */
.session-number { margin:0; font-size:clamp(4.5rem,9vw,8.5rem); font-weight:900; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--rail); }
.session-date { margin:10px 0 28px; font-size:22px; font-weight:500; text-transform:uppercase; letter-spacing:.02em; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 30px; background:var(--rail); color:var(--ground); font:700 18px var(--jp); text-decoration:none; border-radius:2px; transition:background-color .2s var(--ease); }
.button-wide { display:flex; justify-content:space-between; gap:16px; width:100%; }
.button:hover { background:var(--rail-deep); color:#fff; }
.arrow { flex:none; }

/* Second route today (when both routes run) */
.second-route { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 24px; padding:16px 0; border-top:1px solid var(--hair); }
.second-route[hidden] { display:none; }
.second-route-text { margin:0; display:flex; flex-wrap:wrap; gap:2px 16px; }
.second-route-text span { color:var(--muted); }
.text-link { display:inline-flex; align-items:center; min-height:44px; color:var(--ink); font-weight:700; text-underline-offset:.3em; text-decoration-thickness:1px; text-decoration-color:var(--hair); }
.text-link:hover { text-decoration-color:var(--rail); color:var(--rail); }

/* One collapsed grammar entry */
.grammar { margin-top:48px; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
.grammar summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; font-size:19px; font-weight:700; cursor:pointer; list-style:none; }
.grammar summary::-webkit-details-marker { display:none; }
.plus { position:relative; flex:none; width:18px; height:18px; }
.plus::before,.plus::after { content:''; position:absolute; background:var(--ink); border-radius:1px; }
.plus::before { left:0; right:0; top:8px; height:2px; }
.plus::after { top:0; bottom:0; left:8px; width:2px; transition:transform .25s var(--ease); }
.grammar[open] .plus::after { transform:scaleY(0); }
.grammar-body { max-width:74ch; padding:4px 0 36px; }
.grammar-unit + .grammar-unit { margin-top:36px; padding-top:28px; border-top:1px solid var(--hair); }
.grammar-unit h3 { margin:0 0 12px; font-size:21px; font-weight:700; }
.grammar-unit ul { margin:0; padding-left:1.2em; }
.grammar-unit li { margin:10px 0; font-size:17px; line-height:1.8; }
.grammar-unit p { margin:14px 0 0; font-size:17px; line-height:1.8; }
.grammar-unit code { padding:1px 6px; background:#eceee6; border-radius:2px; font:600 .98em/1.7 var(--jp); }

/* Footer */
.home-page .home-footer { font-family:var(--jp); letter-spacing:0; text-transform:none; flex-direction:row; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:4px 32px; margin-top:64px; padding-top:20px; border-top:1px solid var(--hair); font-size:15px; color:var(--muted); }
.home-footer nav { display:flex; flex-wrap:wrap; gap:0 28px; }
.home-footer a { display:inline-flex; gap:8px; align-items:center; min-height:44px; color:var(--ink); font-weight:700; text-decoration:none; }
.home-footer a:hover { color:var(--rail); }
.home-footer a span { font-weight:400; color:var(--muted); font-variant-numeric:tabular-nums; }

@media (max-width:900px) {
  .home-page .site-header-inner { padding:12px 20px 0; min-height:0; }
  .home-shell { padding:36px 20px 24px; }
  .today { grid-template-columns:minmax(0,1fr); grid-template-rows:none; grid-template-areas:"head" "plan" "body"; }
  .today-plan { margin:8px 0 40px; padding:0; border-left:0; }
  .today h1 { font-size:clamp(2.25rem,min(11vw,calc((100vw - 40px) / var(--run,1))),4rem); }
  .today-focus { margin-bottom:28px; font-size:18px; }
  .jp-targets,.jp-words { font-size:22px; }
}
@media (prefers-reduced-motion:reduce) { .stations .fill,.today-mark { animation:none; } .button,.plus::after { transition:none; } }