:root{--color-primary:#e23744;--color-primary-dark:#c4202e;--color-primary-light:#fce4ec;--color-navy:#1b2a4a;--color-navy-light:#243656;--color-navy-muted:#3d5175;--color-bg:#f0f2f5;--color-bg-card:#fff;--color-bg-input:#fff;--color-text:#1a1a2e;--color-text-secondary:#555770;--color-text-muted:#8e90a6;--color-text-on-dark:#fff;--color-text-on-dark-muted:#ffffffb3;--color-border:#dfe1e6;--color-border-focus:#e23744;--color-success:#0d8050;--color-success-bg:#e6f5ec;--color-warning:#c87000;--color-warning-bg:#fff4e0;--color-danger:#d32f2f;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 2px 12px #00000014;--shadow-lg:0 4px 24px #0000001a;--shadow-card:0 2px 16px #00000014;--shadow-card-hover:0 4px 20px #0000001f;--shadow-focus:0 0 0 3px #e2374426;--radius-sm:4px;--radius-md:8px;--radius-lg:10px;--radius-full:100px;--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--transition:.2s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased}body{font-family:var(--font-family);color:var(--color-text);background:var(--color-bg);min-height:100vh;font-size:15px;line-height:1.5}.app{flex-direction:column;min-height:100vh;display:flex}.navbar{background:var(--color-navy);align-items:center;padding:14px 32px;display:flex}.navbar__brand{align-items:center;gap:10px;text-decoration:none;display:flex}.navbar__icon{font-size:22px}.navbar__title{color:var(--color-text-on-dark);letter-spacing:-.01em;font-size:18px;font-weight:700}.navbar__title span{color:var(--color-primary)}.hero{background:var(--color-navy);text-align:center;padding:40px 32px 64px}.hero__subtitle{color:var(--color-text-on-dark-muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:8px;font-size:13px;font-weight:500}.hero__title{color:var(--color-text-on-dark);letter-spacing:-.02em;margin-bottom:8px;font-size:30px;font-weight:700;line-height:1.25}.hero__title span{color:var(--color-primary)}.hero__desc{color:var(--color-text-on-dark-muted);max-width:440px;margin:0 auto;font-size:15px}.search-card{z-index:10;background:var(--color-bg-card);border-radius:var(--radius-lg);max-width:800px;box-shadow:var(--shadow-lg);margin:-36px auto 0;padding:24px;position:relative}.search-form{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.search-form__stations{flex:2;align-items:flex-end;gap:8px;min-width:300px;display:flex}.search-form__field{flex:1;min-width:0}.search-form__label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px;font-size:11px;font-weight:600;display:block}.search-form__swap-btn{border:1px solid var(--color-border);width:34px;height:34px;color:var(--color-navy);cursor:pointer;transition:all var(--transition);background:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-bottom:3px;font-size:16px;display:flex}.search-form__swap-btn:hover{background:var(--color-navy);color:#fff;border-color:var(--color-navy);transform:rotate(180deg)}.search-form__date-field{flex:.7;min-width:140px}.search-form__date-input{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-input);width:100%;font-family:var(--font-family);color:var(--color-text);transition:border-color var(--transition);outline:none;padding:9px 12px;font-size:14px}.search-form__date-input:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus)}.search-form__submit{border-radius:var(--radius-md);background:var(--color-primary);color:#fff;font-family:var(--font-family);cursor:pointer;transition:background var(--transition);white-space:nowrap;border:none;align-items:center;gap:6px;min-height:40px;padding:9px 22px;font-size:14px;font-weight:600;display:flex}.search-form__submit:hover:not(:disabled){background:var(--color-primary-dark)}.search-form__submit:disabled{opacity:.5;cursor:not-allowed}.station-input{width:100%;position:relative}.station-input__field{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-input);width:100%;font-family:var(--font-family);color:var(--color-text);transition:border-color var(--transition);outline:none;padding:9px 32px 9px 12px;font-size:14px}.station-input__field::placeholder{color:var(--color-text-muted)}.station-input__field:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-focus)}.station-input__clear{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;padding:2px;font-size:18px;line-height:1;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.station-input__clear:hover{color:var(--color-danger)}.station-input__dropdown{border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:50;background:#fff;max-height:220px;animation:.1s ddIn;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto}@keyframes ddIn{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}.station-input__option{cursor:pointer;border-bottom:1px solid #f4f4f5;justify-content:space-between;align-items:center;padding:10px 12px;transition:background .1s;display:flex}.station-input__option:last-child{border-bottom:none}.station-input__option:hover,.station-input__option--active{background:#f7f8fa}.station-input__option-name{color:var(--color-text);font-size:13px;font-weight:500}.station-input__option-code{color:var(--color-navy);border-radius:var(--radius-full);letter-spacing:.04em;background:#edf0f5;padding:2px 8px;font-size:11px;font-weight:700}.station-input__no-results{color:var(--color-text-muted);text-align:center;padding:12px;font-size:13px}.results-section{max-width:800px;margin:28px auto 60px;padding:0 24px}.results-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:20px;display:flex}.results-header__title{color:var(--color-text);font-size:16px;font-weight:600}.results-header__count{color:var(--color-text-secondary);border-radius:var(--radius-full);background:#edf0f5;padding:4px 12px;font-size:12px;font-weight:600}.results-list{flex-direction:column;gap:12px;display:flex}.train-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:box-shadow var(--transition), border-color var(--transition);padding:20px 24px}.train-card:hover{box-shadow:var(--shadow-card-hover);border-color:#c6c9d0}.train-card__header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px;display:flex}.train-card__name{color:var(--color-text);font-size:16px;font-weight:600}.train-card__number{color:var(--color-navy);border-radius:var(--radius-full);letter-spacing:.04em;background:#edf0f5;padding:3px 10px;font-size:11px;font-weight:700}.train-card__journey{align-items:center;gap:20px;margin-bottom:16px;display:flex}.train-card__station{flex:1}.train-card__station-time{color:var(--color-text);letter-spacing:-.02em;font-size:24px;font-weight:700}.train-card__station-name{color:var(--color-text-secondary);margin-top:2px;font-size:13px}.train-card__station-code{color:var(--color-text);font-weight:600}.train-card__station--end{text-align:right}.train-card__route-line{flex:1;align-items:center;min-width:60px;display:flex;position:relative}.train-card__route-dot{border:2px solid var(--color-primary);z-index:1;background:#fff;border-radius:50%;flex-shrink:0;width:8px;height:8px}.train-card__route-dash{background:var(--color-border);flex:1;height:1px}.train-card__route-icon{z-index:2;color:var(--color-text-muted);background:#fff;padding:0 6px;font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.train-card__footer{border-top:1px solid #f2f3f5;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding-top:14px;display:flex}.train-card__seats{flex-wrap:wrap;gap:6px;display:flex}.train-card__seat-badge{border-radius:var(--radius-full);color:var(--color-text-secondary);background:#f4f5f7;padding:3px 8px;font-size:11px;font-weight:500}.train-card__seat-badge--available{background:var(--color-success-bg);color:var(--color-success);font-weight:600}.train-card__schedule-status{border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.04em;padding:3px 10px;font-size:11px;font-weight:600}.train-card__schedule-status--active{background:var(--color-success-bg);color:var(--color-success)}.train-card__schedule-status--no-schedule{background:var(--color-warning-bg);color:var(--color-warning)}.state-message{text-align:center;padding:56px 24px}.state-message__icon{margin-bottom:12px;font-size:40px}.state-message__title{color:var(--color-text);margin-bottom:6px;font-size:16px;font-weight:600}.state-message__desc{color:var(--color-text-muted);max-width:340px;margin:0 auto;font-size:13px}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin;display:inline-block}.spinner--dark{border-color:#dfe1e6;border-top-color:var(--color-primary);width:24px;height:24px}@keyframes spin{to{transform:rotate(360deg)}}.footer{text-align:center;color:var(--color-text-muted);border-top:1px solid var(--color-border);background:#fff;margin-top:auto;padding:20px;font-size:13px}@media (width<=768px){.hero{padding:28px 16px 48px}.hero__title{font-size:24px}.search-card{margin:-28px 12px 0;padding:16px}.search-form{flex-direction:column;align-items:stretch}.search-form__stations{flex-direction:column;min-width:0}.search-form__swap-btn{align-self:center;margin:0;transform:rotate(90deg)}.search-form__swap-btn:hover{transform:rotate(270deg)}.search-form__date-field{min-width:0}.search-form__submit{justify-content:center;width:100%}.train-card{padding:16px}.train-card__journey{gap:12px}.train-card__station-time{font-size:20px}.results-section{padding:0 12px}}
