/* Shared by the React landing and the crawlable editorial pages. Scoped: never overrides Community tokens. */
.ty-site {
  --site-bg:#f5f7fb; --site-paper:#fff; --site-ink:#12233d; --site-muted:#52627a;
  --site-blue:#2455db; --site-blue-soft:#e9efff; --site-line:#dce3ef; --site-lime:#d7f7a6;
  --site-shadow:0 18px 54px #2038640b;
  color-scheme:light; background:var(--site-bg); color:var(--site-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; font-size:16px; line-height:1.6;
  min-height:100vh; overflow-wrap:anywhere;
}
.ty-site *, .ty-site *::before, .ty-site *::after { box-sizing:border-box }
.ty-site a { color:var(--site-blue); text-underline-offset:4px }
.ty-site button, .ty-site input, .ty-site select { font:inherit }
.ty-site button, .ty-site summary, .ty-site select { cursor:pointer }
.ty-site :focus-visible { outline:3px solid var(--site-blue); outline-offset:4px; box-shadow:none }
.ty-site h1,.ty-site h2,.ty-site h3,.ty-site p { margin-top:0 }
.ty-site h1,.ty-site h2,.ty-site h3 { letter-spacing:-.045em; line-height:1.1 }
.ty-site h2 { font-size:clamp(1.9rem,3.4vw,2.8rem); margin-bottom:22px }
.ty-site p { color:var(--site-muted) }
.ty-wrap { width:min(1184px,calc(100% - 64px)); margin-inline:auto }
.ty-skip { position:fixed; z-index:2147483647; left:16px; top:-100px; padding:12px 18px; background:var(--site-paper); border:2px solid currentColor }
.ty-skip:focus { top:12px }
.ty-header { display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:104px; border-bottom:1px solid var(--site-line) }
.ty-brand { display:flex; gap:12px; align-items:center; text-decoration:none; color:var(--site-ink)!important; font-size:1.45rem; letter-spacing:-.06em; font-weight:800; line-height:1.1 }
.ty-brand-symbol { width:44px; height:44px; display:grid; place-items:center; border-radius:14px; background:var(--site-blue); color:white; font-size:30px; flex:none }
.ty-brand-ya { color:var(--site-blue) }
.ty-brand small { display:block; font-size:10px; font-weight:500; letter-spacing:.02em; margin-top:6px }
.ty-nav { display:flex; align-items:center; gap:26px; flex-wrap:wrap }
.ty-nav a:not(.ty-button) { color:var(--site-ink); font-size:14px; font-weight:650; text-decoration:none; padding-block:12px }
.ty-nav a:hover,.ty-footer a:hover { text-decoration:underline }
.ty-button { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:52px; padding:13px 22px; border:1px solid transparent; border-radius:12px; color:white!important; background:var(--site-blue); font-weight:700; font-size:14px; text-decoration:none; line-height:1.4; text-align:center; transition:transform .15s ease,box-shadow .15s ease }
.ty-button:hover { transform:translateY(-1px); box-shadow:0 6px 16px #2455db25 }
.ty-button span { font-size:20px; line-height:1 }
.ty-button-small { min-height:44px; padding:10px 16px }
.ty-button-secondary { background:var(--site-paper); border-color:var(--site-line); color:var(--site-ink)!important }
.ty-hero { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:64px; padding-block:68px 76px }
.ty-eyebrow { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; margin-bottom:22px; color:var(--site-blue)!important }
.ty-dot { width:7px; height:7px; border-radius:50%; background:var(--site-blue); box-shadow:0 0 0 5px var(--site-blue-soft) }
.ty-hero h1 { font-size:clamp(3rem,5.5vw,5.15rem); line-height:1.01; margin-bottom:26px; letter-spacing:-.07em; font-weight:800 }
.ty-hero h1 span { color:var(--site-blue) }
.ty-lead { font-size:18px; line-height:1.65; max-width:540px; margin-bottom:28px }
.ty-search-panel { background:var(--site-paper); border:1px solid var(--site-line); border-radius:18px; padding:20px; box-shadow:var(--site-shadow) }
.ty-label { display:block; font-size:12px; font-weight:700; margin-bottom:6px }
.ty-input { width:100%; min-width:0; min-height:48px; border:1px solid var(--site-line); border-radius:9px; background:var(--site-bg); color:var(--site-ink); padding:11px 13px }
.ty-input::placeholder { color:var(--site-muted) }
.ty-country { margin-bottom:14px }
.ty-search-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:9px }
.ty-small { font-size:12px; line-height:1.5; margin:10px 0 0 }
.ty-hero-links { display:flex; gap:20px; align-items:center; flex-wrap:wrap; margin-top:20px; font-size:12px }
.ty-text-button { padding:0; min-height:44px; border:0; background:none; color:var(--site-blue); font-weight:700; text-align:left }
.ty-journey-visual { position:relative; border:1px solid var(--site-line); background:var(--site-paper); border-radius:28px; box-shadow:var(--site-shadow); transform:rotate(1.5deg); overflow:hidden }
.ty-visual-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; padding:24px 26px }
.ty-visual-heading .ty-eyebrow { margin:0; font-size:9px }
.ty-tag { color:var(--site-ink); font-size:11px; padding:5px 10px; border:1px solid var(--site-line); border-radius:100px }
.ty-route-art { position:relative; margin-inline:16px; background:var(--site-bg); border-radius:16px; overflow:hidden }
.ty-route-art svg { display:block; width:100%; height:auto }
.ty-street { stroke:var(--site-line); stroke-width:12 }
.ty-route-shadow { stroke:var(--site-paper); stroke-width:22 }
.ty-route-line { stroke:var(--site-blue); stroke-width:8; stroke-linecap:round; stroke-linejoin:round }
.ty-stop { fill:var(--site-paper); stroke:var(--site-blue); stroke-width:5 }
.ty-destination { fill:var(--site-lime); stroke:var(--site-ink); stroke-width:4 }
.ty-map-label { position:absolute; font-size:10px; font-weight:700; padding:5px 9px; border-radius:8px; background:var(--site-paper); box-shadow:0 4px 15px #12233d0f }
.ty-map-label-start { left:8%; bottom:6% }.ty-map-label-end { right:3%; bottom:15% }
.ty-bus-symbol { position:absolute; top:13%; left:55%; display:grid; place-items:center; width:46px; height:36px; background:var(--site-blue); color:white; border:3px solid var(--site-paper); border-radius:12px; font-size:22px; box-shadow:0 6px 20px #2455db30 }
.ty-visual-bottom { padding:24px 28px 26px }.ty-number { color:var(--site-blue); font-size:11px; font-weight:800; letter-spacing:.09em }
.ty-visual-bottom strong { display:block; font-size:23px; letter-spacing:-.04em; margin:8px 0 }.ty-visual-bottom p { font-size:12px; margin-bottom:10px }.ty-visual-bottom small { color:var(--site-muted); font-size:10px }
.ty-feature-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--site-line); border-bottom:1px solid var(--site-line); padding-block:28px; gap:32px }
.ty-feature-strip>div+div { border-left:1px solid var(--site-line); padding-left:32px }.ty-feature-strip h2 { font-size:18px; letter-spacing:-.03em; margin:10px 0 }.ty-feature-strip p { font-size:13px; margin:0 }
.ty-section { padding-block:72px }.ty-section-heading { display:flex; justify-content:space-between; gap:24px; align-items:flex-end; margin-bottom:26px }.ty-section-heading h2 { margin:0 }.ty-section-heading .ty-eyebrow { margin-bottom:14px }.ty-inline-link { font-size:13px; font-weight:700; padding-block:12px; flex-shrink:0 }
.ty-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px }.ty-guide-card { display:flex; flex-direction:column; min-width:0; padding:28px; border:1px solid var(--site-line); border-radius:18px; background:var(--site-paper); color:var(--site-ink)!important; text-decoration:none; transition:transform .15s ease,border-color .15s ease }
.ty-guide-card:hover { transform:translateY(-3px); border-color:var(--site-blue) }.ty-card-index { color:var(--site-blue); font-size:10px; font-weight:800; letter-spacing:.09em; margin-bottom:32px }.ty-guide-card h3 { font-size:25px; margin-bottom:15px }.ty-guide-card p { font-size:14px; flex:1; margin-bottom:28px }.ty-card-link { display:flex; justify-content:space-between; align-items:center; font-size:12px; font-weight:750; border-top:1px solid var(--site-line); padding-top:15px }.ty-card-link span { font-size:20px }
.ty-app-band { background:var(--site-ink); color:var(--site-paper); border-radius:24px; padding:44px 48px; display:grid; grid-template-columns:1.4fr 1fr; gap:64px; align-items:center }.ty-app-band .ty-eyebrow,.ty-app-band a:not(.ty-button) { color:var(--site-lime)!important }.ty-app-band h2 { color:#fff; margin-bottom:18px }.ty-app-band p { color:#d7e1ef; font-size:14px; max-width:440px }.ty-app-band a:not(.ty-button) { font-size:13px }.ty-store-links { display:grid; gap:12px }.ty-app-band .ty-button { background:var(--site-lime); color:#152938!important }.ty-app-band .ty-button-secondary { background:transparent; color:#fff!important; border-color:#58687e }
.ty-faq { max-width:800px }.ty-site details { border-bottom:1px solid var(--site-line); padding-block:18px }.ty-site summary { font-weight:700; padding-block:6px; min-height:44px }.ty-site details p { font-size:14px; margin:10px 0 }.ty-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; border-top:1px solid var(--site-line); padding-block:36px }.ty-footer strong { font-size:22px; letter-spacing:-.04em }.ty-footer p { font-size:12px; margin:4px 0 }.ty-footer nav { display:flex; flex-wrap:wrap; gap:18px; align-items:center }.ty-footer nav a { color:var(--site-ink); font-size:12px; padding-block:12px }.ty-footer small { flex-basis:100%; color:var(--site-muted); font-size:11px }
.ty-page-heading { padding-block:56px 28px; max-width:800px }.ty-page-heading h1 { font-size:clamp(2.6rem,5vw,4.5rem); margin-bottom:24px }.ty-page-heading .ty-lead { max-width:720px }.ty-breadcrumb { padding-top:28px; font-size:12px; color:var(--site-muted) }.ty-article-layout { display:grid; grid-template-columns:minmax(0,760px) 250px; gap:60px; padding-bottom:64px }.ty-reading { min-width:0 }.ty-reading h2 { font-size:26px; padding-top:24px; scroll-margin-top:24px }.ty-reading h3 { font-size:20px }.ty-reading p { font-size:16px; line-height:1.85; margin-bottom:20px }.ty-reading li { color:var(--site-muted); margin-bottom:12px; line-height:1.75 }.ty-reading .ty-note { border-left:3px solid var(--site-blue); background:var(--site-blue-soft); padding:18px 22px; margin-block:28px; border-radius:0 12px 12px 0 }.ty-toc { align-self:start; position:sticky; top:24px; border:1px solid var(--site-line); padding:22px; border-radius:14px; background:var(--site-paper); font-size:13px }.ty-toc strong { display:block; margin-bottom:16px }.ty-toc a { display:block; margin-block:14px }.ty-meta { font-size:12px; color:var(--site-muted); padding-block:10px; border-block:1px solid var(--site-line) }.ty-legal { max-width:850px; padding-bottom:64px }.ty-contact-card { padding:28px; border:1px solid var(--site-line); border-radius:18px; background:var(--site-paper); margin-bottom:28px }.ty-ad { margin:48px 0; padding-top:18px; border-top:1px solid var(--site-line); text-align:center; clear:both }.ty-ad-label { display:block; color:var(--site-muted); font-size:11px; text-transform:uppercase; letter-spacing:.1em; margin-bottom:16px }.ty-ad ins { display:block; min-height:280px }.ty-ad[hidden],.ty-ad-preferences[hidden] { display:none!important }.ty-ad-preferences { padding:18px 22px; margin-block:28px; border:1px solid var(--site-line); border-radius:12px; font-size:13px }.ty-ad-preferences p { font-size:13px; margin-bottom:12px }.ty-consent-actions { display:flex; flex-wrap:wrap; gap:12px }.ty-consent-actions button { min-height:44px; padding:9px 14px; border:1px solid var(--site-line); border-radius:9px; background:var(--site-paper); color:var(--site-ink) }
@media (prefers-color-scheme:dark) { .ty-site { color-scheme:dark; --site-bg:#101b2d; --site-paper:#17243a; --site-ink:#eef3fc; --site-muted:#b6c4da; --site-blue:#9ab9ff; --site-blue-soft:#213657; --site-line:#32425b; --site-shadow:none }.ty-site .ty-button,.ty-brand-symbol,.ty-bus-symbol { color:#101b2d!important }.ty-app-band { background:#20324c }.ty-app-band .ty-button-secondary { color:#fff!important } }
@media (max-width:1000px) { .ty-hero { gap:32px }.ty-nav { gap:16px }.ty-wrap { width:calc(100% - 40px) }.ty-article-layout { gap:28px; grid-template-columns:minmax(0,1fr) 220px }.ty-search-row { grid-template-columns:1fr }.ty-card-grid { gap:12px }.ty-guide-card { padding:22px } }
@media (max-width:720px) { .ty-wrap { width:calc(100% - 36px) }.ty-header { min-height:0; padding-block:20px; flex-wrap:wrap; gap:20px }.ty-brand { font-size:22px }.ty-nav { width:100%; justify-content:space-between; gap:10px }.ty-nav a:not(.ty-button) { font-size:12px }.ty-nav .ty-button { min-height:44px; font-size:12px; padding:10px 12px; gap:8px }.ty-hero { grid-template-columns:1fr; padding-block:38px 40px; gap:36px }.ty-hero h1 { font-size:clamp(3rem,12vw,4.4rem) }.ty-lead { font-size:16px }.ty-journey-visual { transform:none; max-width:480px; width:100%; margin:auto }.ty-visual-heading { padding:18px 22px }.ty-route-art { max-height:280px }.ty-feature-strip { grid-template-columns:1fr; gap:22px; padding-block:24px }.ty-feature-strip>div+div { border-left:0; border-top:1px solid var(--site-line); padding:22px 0 0 }.ty-section { padding-block:44px }.ty-section-heading { flex-direction:column; align-items:flex-start; gap:12px }.ty-card-grid { grid-template-columns:1fr; gap:16px }.ty-card-index { margin-bottom:22px }.ty-guide-card p { margin-bottom:20px }.ty-app-band { grid-template-columns:1fr; padding:30px 24px; gap:22px }.ty-article-layout { display:flex; flex-direction:column; gap:24px }.ty-toc { position:static; order:-1 }.ty-toc a { margin-block:10px }.ty-page-heading { padding-top:32px }.ty-page-heading h1 { font-size:2.6rem }.ty-hero-links { gap:8px 18px }.ty-footer { padding-block:28px }.ty-footer nav { gap:12px }.ty-visual-bottom { padding:20px 24px }.ty-site h2 { font-size:1.9rem }.ty-reading h2 { font-size:1.5rem }.ty-search-row { grid-template-columns:1fr } }
@media (prefers-reduced-motion:reduce) { .ty-site *,.ty-site *::before,.ty-site *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important }.ty-button:hover,.ty-guide-card:hover { transform:none } }
@media (forced-colors:active) { .ty-site :focus-visible { outline:3px solid Highlight }.ty-button,.ty-guide-card,.ty-input { border:1px solid ButtonText } }
