ナビの面も、pill ボタンも、リンクもアイコンもすべて #0068b7（背景 234 要素）。黄色 #f8b500 は「特急券を買う」動線にしか出てこない（可視 3 要素）ので、他の CTA に流用しない。面はグレーではなく青みのオフホワイト 4 種から選ぶ。
運行情報バーは機能ごとに色を変える。#0068b7（詳細）/ #c2e0f6（走行位置）/ #2891e1（遅延証明書）/ #f8b500（特急券）/ #6094bb（デジタルきっぷ）。5 つのタイルが並ぶこと自体がこのサイトの顔なので、1 色に揃えない。
CSS Custom Properties は 0 個。色も余白も生値で書かれている。トークンが無いこと自体が実装の実態なので、再実装ではこのページの変数のように名前を与えて使う。
font-weight は 400（114 要素）と 500（42 要素）だけ。700 は 1 要素も無い。@font-face も Noto Sans JP の 400 / 500 の 2 本しか読み込んでいない。階層はサイズと色で作る。字間は body に 0.04em を 1 回書いて継承させる（実測 0.64px が 147/156 要素）。
行間は 1.60 と 1.30 の 2 値。読ませる文章が 1.60（103 要素）、一覧・ナビ・リード文が 1.30（43 要素）。「一覧は詰める、文章は空ける」という切り分けで、中間の値を作らない。
字間は継承。body の 0.04em（＝16px × 0.04 = 0.64px）が 147 要素に降りてくる。14px の要素も 44px の見出しも 0.64px のまま。「サイズ × 0.04em」で計算し直すと別物になる。例外は下層の p 2 要素（0.56px ＝ 14px で再宣言）と、カルーセルの Previous / Next（normal・9 要素）だけ。
font-feature-settings: "palt" が 846 要素（下層 699 要素）。本文・ナビ・フッターまで全面適用。palt ＋ 0.04em の組み合わせがこのサイトの字送りで、片方だけでは再現できない。
角丸は ボタン 900px（pill）／ カード 20px ／ タイル 5px の3段。影は黒を使わず、紺 rgba(5,48,81,α) を 5px 8px 30px（X に 5px ずらす）で、透明度だけ 0.08 / 0.1 / 0.35 と変える。
影に色が付いている。通常カード rgba(5,48,81,.08)、特集 .1、特急車両のカードだけ .35 と濃い（9 要素）。黄色の CTA は rgba(4,65,102,.12)。rgba(0,0,0,…) は 1 件も無い。
pill の角丸は 900px。9999px でも 50% でもない実装値。ボタンの上下 padding は 9px 25px 6px のように上を 3px 多く取る（和文のベースライン補正）。
| 項目 | 値 | 実測 |
|---|---|---|
| Container | 1280px | トップ 13 要素 / 下層 14 要素 |
| Container（SP） | 345px | 2 要素 |
| Gap | — | 0 件。余白は margin / padding で作っている |
| Breakpoint（PC） | print, screen and (min-width: 951px) | 1618 件。print を PC 側に含めている |
| Breakpoint（SP） | only screen and (max-width: 950.98px) | 1580 件 |
| Breakpoint（補助） | 871px / 1100px | 18 件 / 数件 |
印刷時に PC レイアウトで出す設計。メディアクエリの PC 側が print, screen and (min-width: 951px) で始まる。時刻表・きっぷ案内を紙に出す利用を想定した鉄道サイトらしい実装。