:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--page:#fff;--paper:#fff;--ink:#11120f;--ink-soft:#555750;--ink-muted:#797b73;--rule:#d8d9d5;--rule-strong:#11120f;--accent:#1557ff;--delta-up:#c7392f;--delta-down:#087b52;--live:#087b52;--surface-1:var(--paper);--surface-2:#f2f3f1;--grid:#e8e9e6;--baseline:#b8bab4;--text-primary:var(--ink);--text-secondary:var(--ink-soft);--text-muted:var(--ink-muted);--border:var(--rule);--border-strong:var(--rule-strong);--font:"Inter", "IBM Plex Sans Thai", system-ui, -apple-system, "Segoe UI", "Noto Sans Thai", sans-serif;--mono:"SFMono-Regular", Consolas, "Liberation Mono", monospace;--type-micro:12px;--type-meta:13px;--type-label:14px;--type-body:17px;--type-heading:clamp(24px, 2vw, 28px)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--page);min-width:320px;color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;line-height:1.5}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}img{max-width:100%;display:block}.skip-link{z-index:100;color:#fff;background:var(--accent);padding:8px 12px;position:fixed;top:8px;left:8px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}.shell{border-inline:1px solid var(--rule);width:min(100% - 40px,1440px);margin-inline:auto}.topbar{border-bottom:1px solid var(--rule-strong);justify-content:space-between;align-items:center;gap:24px;min-height:92px;padding:0 28px;display:flex}.brand{align-items:center;gap:13px;display:flex}.brand-index{background:var(--ink);width:38px;height:44px;color:var(--paper);font:700 var(--type-micro)/1.05 var(--mono);letter-spacing:.08em;padding:5px 0 0 7px}.brand-name{letter-spacing:.08em;font-size:16px;font-weight:800}.brand-sub{color:var(--ink-muted);font-size:var(--type-meta)}.data-status{color:var(--ink-soft);font:600 var(--type-micro)/1 var(--mono);letter-spacing:.04em;grid-template-columns:auto auto auto;align-items:center;gap:9px;display:grid}.data-status .dot{background:var(--ink-muted);width:7px;height:7px}.data-status.live .dot{background:var(--live);animation:2.2s ease-in-out infinite live-pulse}.data-status time{border-left:1px solid var(--rule);color:var(--ink-muted);font-family:var(--font);letter-spacing:0;padding-left:12px}.hero{border-bottom:1px solid var(--rule-strong);grid-template-columns:repeat(12,minmax(0,1fr));min-height:440px;display:grid}.hero-copy{border-right:1px solid var(--rule);grid-column:1/span 7;padding:62px 28px 52px}.eyebrow,.section-index,.station-rail-label span,.footer-label{font:700 var(--type-micro)/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.eyebrow{color:var(--accent);padding-bottom:12px}.hero h1{letter-spacing:-.055em;max-width:760px;margin-top:24px;font-size:clamp(48px,6vw,88px);font-weight:700;line-height:.98}.hero-copy p{max-width:600px;color:var(--ink-soft);font-size:var(--type-body);margin-top:32px;line-height:1.72}.hero-price{background:var(--ink);color:var(--paper);flex-direction:column;grid-column:8/-1;justify-content:flex-end;padding:62px 28px 38px;display:flex}.hero-price-label{color:#b9bab3;font-size:var(--type-label);border-bottom:1px solid #454640;justify-content:space-between;gap:16px;padding-bottom:13px;display:flex}.hero-price-value{letter-spacing:-.07em;font-variant-numeric:tabular-nums;justify-content:space-between;align-items:flex-end;gap:16px;padding-block:26px 18px;font-size:clamp(64px,8vw,118px);font-weight:600;line-height:.85;display:flex}.hero-price-value .unit{color:#b9bab3;font:600 var(--type-label)/1.2 var(--font);letter-spacing:0;white-space:nowrap;padding-bottom:5px}.hero-sparkline{color:#478dff;width:100%;height:94px;margin-top:4px}.hero-sparkline svg{width:100%;height:100%;display:block;overflow:visible}.sparkline-rule{stroke:#2e302d;stroke-width:1px;vector-effect:non-scaling-stroke}.sparkline-line{fill:none;stroke:currentColor;stroke-width:2.25px;stroke-dasharray:1;stroke-dashoffset:1px;vector-effect:non-scaling-stroke;animation:.9s cubic-bezier(.22,.61,.36,1) .35s forwards sparkline-draw}.sparkline-dot{fill:currentColor;stroke:var(--ink);stroke-width:2px;vector-effect:non-scaling-stroke}.hero-price-date{color:#898b83;font:500 var(--type-meta)/1 var(--mono);margin-top:auto;padding-top:36px}.topbar,.hero-copy,.hero-price,.station-rail,.price-overview,.chart-section,.grid-2>.card,.station-section{animation:.4s cubic-bezier(.22,.61,.36,1) both rise-in}.topbar{animation-delay:20ms}.hero-copy{animation-delay:50ms}.hero-price{animation-delay:80ms}.station-rail{animation-delay:.12s}.price-overview{animation-delay:.16s}.chart-section{animation-delay:.2s}.grid-2>.card:first-child{animation-delay:.24s}.grid-2>.card:last-child{animation-delay:.28s}.station-section{animation-delay:.32s}.station-rail{border-bottom:1px solid var(--rule-strong);background:var(--paper);grid-template-columns:180px 1fr;min-height:132px;display:grid}.station-rail-label{border-right:1px solid var(--rule);flex-direction:column;justify-content:space-between;padding:24px 28px;display:flex}.station-rail-label span{color:var(--ink-muted)}.station-rail-label strong{font-size:16px}.station-rail ul{grid-template-columns:repeat(6,minmax(0,1fr));list-style:none;display:grid}.station-rail li{border-right:1px solid var(--rule);flex-direction:column;justify-content:center;align-items:center;gap:8px;min-width:0;padding:20px 14px 15px;transition:background-color .18s,transform .18s;display:flex}.station-rail li:last-child{border-right:0}.station-rail li:hover{background:var(--surface-2);transform:translateY(-2px)}.station-rail img{object-fit:contain;width:72px;height:48px}.station-rail li:nth-child(3) img,.station-rail li:nth-child(5) img,.station-rail li:nth-child(6) img{width:48px}.station-rail li span{color:var(--ink-muted);font-size:var(--type-micro);text-align:center;line-height:1.35}.price-overview{border-bottom:1px solid var(--rule-strong)}.overview-head{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:flex-end;gap:24px;min-height:96px;padding:22px 28px;display:flex}.overview-head>div{align-items:baseline;gap:18px;display:flex}.overview-head h2{font-size:var(--type-heading);letter-spacing:-.025em}.overview-head p{color:var(--ink-muted);font-size:var(--type-meta)}.section-index{color:var(--accent)}.tiles{background:var(--paper);grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.tile{border-right:1px solid var(--rule);flex-direction:column;min-width:0;min-height:196px;padding:22px 18px 16px;transition:background-color .18s,transform .18s,box-shadow .18s;display:flex}.tile:last-child{border-right:0}.tile:hover{box-shadow:inset 0 2px 0 var(--accent);background:#f7f8f6;transform:translateY(-2px)}.tile-head{color:var(--ink-soft);font-size:var(--type-label);align-items:center;gap:8px;font-weight:600;display:flex}.swatch{flex:none;width:8px;height:8px}.tile-value{letter-spacing:-.04em;font-variant-numeric:tabular-nums;margin-top:12px;font-size:clamp(30px,2.5vw,38px);font-weight:600;line-height:1}.tile-value .unit{color:var(--ink-muted);font-size:var(--type-micro);letter-spacing:0;margin-left:4px;font-weight:500}.tile-delta{font:600 var(--type-micro)/1 var(--mono);white-space:nowrap;align-items:center;gap:5px;margin-top:11px;display:flex}.tile-delta.up{color:var(--delta-up)}.tile-delta.down{color:var(--delta-down)}.tile-delta.flat{color:var(--ink-muted)}.tile-delta .vs{color:var(--ink-muted);font-family:var(--font);font-weight:400}.tile-spark{margin-top:auto}.tile-spark polyline{stroke-dasharray:1;stroke-dashoffset:1px;animation:.8s cubic-bezier(.22,.61,.36,1) .55s forwards sparkline-draw}.card{background:var(--paper);border-bottom:1px solid var(--rule-strong)}.chart-section{padding-bottom:20px}.card-head{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:flex-start;gap:24px;min-height:112px;padding:27px 28px;display:flex}.section-heading{align-items:flex-start;gap:20px;display:flex}.card-title{font-size:var(--type-heading);letter-spacing:-.025em;font-weight:700;line-height:1.2}.card-desc{max-width:680px;color:var(--ink-muted);font-size:var(--type-label);margin-top:7px;line-height:1.55}.range-tabs{border:1px solid var(--rule);display:flex}.range-tabs button{border:0;border-right:1px solid var(--rule);min-height:42px;color:var(--ink-soft);font-size:var(--type-meta);cursor:pointer;background:0 0;padding:9px 15px;font-weight:600;transition:background-color .18s,color .18s}.range-tabs button:last-child{border-right:0}.range-tabs button:hover{background:var(--surface-2)}.range-tabs button.active{background:var(--ink);color:var(--paper)}.legend{flex-wrap:wrap;gap:7px 18px;padding:20px 28px 6px;display:flex}.legend-chip{color:var(--ink-soft);font-size:var(--type-meta);cursor:pointer;background:0 0;border:0;border-bottom:1px solid #0000;align-items:center;gap:8px;padding:4px 0;font-weight:600;display:inline-flex}.legend-chip .key{flex:none;width:18px;height:3px}.legend-chip:hover{border-bottom-color:var(--ink);color:var(--ink)}.legend-chip.off{opacity:.35;text-decoration:line-through}.chart-wrap{margin:0 14px}.recharts-cartesian-axis-tick text{fill:var(--ink-muted);font-family:var(--mono);font-size:var(--type-micro)}.recharts-cartesian-grid line{stroke:var(--grid)}.tip{border:1px solid var(--ink);background:var(--paper);min-width:210px;padding:12px 14px;box-shadow:6px 6px #11120f21}.tip-date{color:var(--ink-soft);font:600 var(--type-meta)/1 var(--mono);margin-bottom:10px}.tip-row{font-size:var(--type-meta);align-items:center;gap:8px;padding:4px 0;display:flex}.tip-row .key{flex:none;width:14px;height:3px}.tip-row .name{color:var(--ink-soft);white-space:nowrap;flex:1;padding-right:14px}.tip-row .val{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:700}.grid-2{border-bottom:1px solid var(--rule-strong);grid-template-columns:5fr 7fr;display:grid}.grid-2 .card{border-bottom:0}.grid-2>.card{min-width:0}.comparison-card{border-right:1px solid var(--rule-strong)}.bars{flex-direction:column;gap:17px;padding:24px 28px 34px;display:flex}.bar-row{font-size:var(--type-label);grid-template-columns:132px 1fr 58px;align-items:center;gap:12px;display:grid}.bar-row .name{color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.bar-track{background:var(--surface-2);height:9px;position:relative}.bar-fill{min-width:3px;transition:width .35s;position:absolute;inset:0 auto 0 0}.bar-row .val{font:700 var(--type-meta)/1 var(--mono);text-align:right}.table-scroll{width:100%;max-width:100%;overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:620px;font-size:var(--type-meta)}th{border-bottom:1px solid var(--baseline);color:var(--ink-muted);font:600 var(--type-micro)/1.3 var(--mono);letter-spacing:.04em;text-align:right;text-transform:uppercase;padding:13px 14px}th:first-child,td:first-child{text-align:left}td{border-bottom:1px solid var(--grid);text-align:right;font-variant-numeric:tabular-nums;padding:13px 14px}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#f7f8f6}.fuel-cell{white-space:nowrap;align-items:center;gap:9px;font-weight:600;display:flex}.chg{font-family:var(--mono);font-weight:600}.chg.up{color:var(--delta-up)}.chg.down{color:var(--delta-down)}.chg.flat{color:var(--ink-muted)}.price-now{font:700 var(--type-meta)/1 var(--mono)}td.best,.best-hint{color:var(--delta-down);font-weight:700}.station-section .card-head{min-height:92px}.station-table-head{flex-direction:column;align-items:flex-end;gap:5px;min-width:72px;display:inline-flex}.station-table-head img{object-fit:contain;width:44px;height:28px}.footer{background:var(--ink);color:#a7a9a1;min-height:126px;font-size:var(--type-meta);justify-content:space-between;align-items:flex-start;gap:32px;padding:28px;line-height:1.65;display:flex}.footer>div{flex-wrap:wrap;align-items:center;gap:12px 20px;display:flex}.footer-label{color:#fff}.footer a{color:#c8c9c2;border-bottom:1px solid #555750;text-decoration:none}.footer a:hover{color:#fff}.footer .footer-credit{color:#fff;font-weight:700}.footer p{text-align:right;max-width:380px}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media (width<=1100px){.hero-copy{grid-column:1/span 6}.hero-price{grid-column:7/-1}.tiles{grid-template-columns:repeat(3,1fr)}.tile{border-bottom:1px solid var(--rule)}.tile:nth-child(3n){border-right:0}.tile:nth-child(n+4){border-bottom:0}.grid-2{grid-template-columns:1fr}.comparison-card{border-right:0;border-bottom:1px solid var(--rule-strong)!important}}@media (width<=820px){.shell{border-inline:0;width:100%}.hero{grid-template-columns:1fr}.hero-copy,.hero-price{grid-column:auto}.hero-copy{border-right:0;padding-block:46px}.hero-price{min-height:270px}.station-rail{grid-template-columns:1fr}.station-rail-label{border-right:0;border-bottom:1px solid var(--rule);min-height:72px}.station-rail ul{grid-template-columns:repeat(3,1fr)}.station-rail li:nth-child(3){border-right:0}.station-rail li:nth-child(-n+3){border-bottom:1px solid var(--rule)}.card-head{flex-direction:column}.range-tabs{width:100%;overflow-x:auto}.range-tabs button{flex:1 0 auto}}@media (width<=600px){.topbar{min-height:72px;padding:0 16px}.brand-sub,.data-status time{display:none}.brand-name{font-size:13px}.hero-copy,.hero-price,.overview-head,.card-head{padding-inline:18px}.hero h1{font-size:clamp(43px,14vw,64px)}.hero-copy p{font-size:16px}.hero-price-value{font-size:clamp(64px,24vw,96px)}.hero-sparkline{height:72px}.hero-price-date{padding-top:24px}.station-rail-label{padding-inline:18px}.tiles{grid-template-columns:repeat(2,1fr)}.tile:nth-child(3n){border-right:1px solid var(--rule)}.tile:nth-child(2n){border-right:0}.tile:nth-child(n+4){border-bottom:1px solid var(--rule)}.tile:nth-child(n+5){border-bottom:0}.overview-head{flex-direction:column;align-items:flex-start;gap:6px}.overview-head p{padding-left:38px}.section-heading{gap:13px}.card-title{font-size:22px}.legend{padding-inline:18px}.chart-wrap{margin-inline:0;overflow:hidden}.bars{padding-inline:18px}.bar-row{grid-template-columns:94px 1fr 48px;gap:8px}.footer{flex-direction:column;padding:24px 18px}.footer p{text-align:left}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-name:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.data-status.live .dot{animation:none}.sparkline-line,.tile-spark polyline{stroke-dashoffset:0;animation:none}}@keyframes rise-in{0%{opacity:1;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes live-pulse{0%,to{box-shadow:0 0 #087b5200}45%{box-shadow:0 0 0 5px #087b5229}}@keyframes sparkline-draw{to{stroke-dashoffset:0}}