.timetable-instance ~ .timetable-instance { margin-top: 60px; }
.timetable-label { font-size: 24px; font-weight: 700; color: var(--text); margin-bottom: 16px; font-family: var(--sans-bold); }

.line-tabs { display: flex; gap: 8px; margin-bottom: 24px; flex-wrap: wrap; }
.line-tab {
  padding: 10px 24px; font-size: 18px; font-weight: 600;
  border: 2px solid var(--gray-200); background: var(--white);
  cursor: pointer; font-family: var(--sans); color: var(--gray-600);
  transition: all var(--transition);
}
.line-tab.red-tab.active   { background: #FDEDEC; border-color: #FDEDEC; color: #A93226; }
.line-tab.green-tab.active { background: #EAFAF1; border-color: #EAFAF1; color: #1E8449; }
.line-tab.blue-tab.active  { background: #EBF5FB; border-color: #EBF5FB; color: #1B6591; }
.line-tab.red-tab:not(.active):hover   { border-color: #C0392B; color: #C0392B; }
.line-tab.green-tab:not(.active):hover { border-color: #27AE60; color: #27AE60; }
.line-tab.blue-tab:not(.active):hover  { border-color: #2980B9; color: #2980B9; }
.line-timetable-panel { display: none; }
.line-timetable-panel.active { display: block; }

.timetable-tabs {
  display: grid; grid-template-columns: 1fr 1fr;
  background: var(--gray-100); border-radius: 10px 10px 0 0;
  overflow: hidden; border: 1px solid var(--gray-200); border-bottom: none;
}
.timetable-tab {
  padding: 16px 24px; font-size: 18px; font-weight: 600;
  color: var(--blue); background: var(--gray-100);
  border: none; cursor: pointer; font-family: var(--sans);
  text-align: center; transition: background var(--transition), color var(--transition);
}
.timetable-tab:first-child { border-radius: 10px 0 0 0; }
.timetable-tab:last-child  { border-radius: 0 10px 0 0; }
.timetable-tab.active { background: var(--blue); color: #fff; }

.timetable-time-tabs { display: flex; gap: 0; margin-bottom: 16px; border-bottom: 1px solid var(--gray-200); }
.timetable-time-tab {
  flex: 1; padding: 14px 0; font-size: 18px; font-weight: 500;
  border: none; background: none; cursor: pointer; font-family: var(--sans);
  color: var(--gray-400); text-align: center;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color var(--transition), border-color var(--transition);
}
.timetable-time-tab.active { color: var(--text); font-weight: 700; border-bottom: 2px solid var(--text); }
.timetable-time-tab:hover:not(.active) { color: var(--gray-600); }

.timetable-panel { display: none; border: 1px solid var(--gray-200); border-top: none; padding: 0 0 16px; }
.timetable-panel.active { display: block; }
.timetable-scroll { overflow-x: auto; }
.timetable-empty { padding: 24px 16px; text-align: center; font-size: 18px; color: var(--gray-600); }

.timetable-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 600px; }
.timetable-table th {
  background: var(--gray-100); padding: 9px 10px;
  font-size: 12px; font-weight: 600; color: var(--text);
  text-align: center; border: 1px solid var(--gray-200);
  letter-spacing: 0.02em; white-space: nowrap;
}
.timetable-table th.th-stop { text-align: left; min-width: 180px; background: var(--gray-100); }
.timetable-table th.th-dep  { min-width: 40px; }
.timetable-table th.th-time { min-width: 60px; }
.timetable-table .carrier-name {
  display: block; font-size: 10px; color: var(--text); font-weight: 400; margin-top: 2px;
}
.timetable-table td { padding: 9px 10px; border: 1px solid var(--gray-100); text-align: center; color: var(--text); font-size: 13px; vertical-align: middle; }
.timetable-table td.td-stop { text-align: left; font-weight: 600; background: #fff; }
.timetable-table td.td-dep-label { font-size: 12px; font-weight: 700; background: #fff; color: var(--blue); white-space: nowrap; }
.timetable-table td.td-arr-label { font-size: 12px; font-weight: 700; background: #fff; color: #B85C00; white-space: nowrap; }
.timetable-table td.td-time { font-variant-numeric: tabular-nums; }
.timetable-table td.td-dash { color: var(--gray-400); }
.timetable-table td.td-none { color: var(--gray-400); }

.stop-link {
  color: var(--blue); text-decoration: underline;
  cursor: pointer; font-weight: 600;
  display: inline-flex; align-items: center; gap: 4px;
  transition: opacity var(--transition);
}
.stop-link:hover { opacity: 0.7; }
.stop-link i { font-size: 10px; }

.timetable-notes { margin-top: 24px; font-size: 18px; color: var(--text); line-height: 1.8; }
.timetable-notes-box { border: 1px solid var(--gray-200); border-radius: 8px; padding: 20px 24px; }
.timetable-notes-box__title { font-size: 24px; font-weight: 700; color: var(--text); margin-bottom: 10px; font-family: var(--sans-bold); }
.timetable-notes-box ul { list-style: none; display: flex; flex-direction: column; gap: 6px; margin: 0; }
.timetable-notes-box li { font-size: 12px; color: var(--text); padding-left: 14px; position: relative; line-height: 1.7; }
.timetable-notes-box li::before { content: '・'; position: absolute; left: 0; color: var(--gray-400); }
.timetable-notes-box__alert { font-size: 12px; font-weight: 700; color: #B45309; margin: 10px 0 6px; }
.timetable-notes-box__caveat { font-size: 12px; color: var(--text); margin-top: 10px; }
.timetable-notes a,
.timetable-notes-box a { color: var(--blue); text-decoration: underline; }
.timetable-notes a:hover,
.timetable-notes-box a:hover { color: var(--blue-dark); }

@media (max-width: 768px) {
  .timetable-instance ~ .timetable-instance { margin-top: 24px; }
  .timetable-label { font-size: 16px; margin-bottom: 12px; }
  .line-tabs { gap: 6px; }
  .line-tab { padding: 8px 16px; font-size: 12px; }
  .timetable-table { font-size: 12px; min-width: 0; }
  .timetable-table th, .timetable-table td { padding: 8px 8px; }
  .timetable-tabs { overflow-x: auto; }
  .timetable-time-tabs { overflow-x: auto; }
  .timetable-empty { font-size: 12px; }
  .timetable-notes { font-size: 12px; }
  .timetable-notes-box__title { font-size: 16px; }
  .timetable-notes-box li { font-size: 12px; }
  .timetable-notes-box__alert { font-size: 12px; }
  .timetable-notes-box__caveat { font-size: 10px; }
  .timetable-tab { font-size: 12px; }
  .timetable-time-tab { font-size: 12px; }
}
