* { box-sizing: border-box; }
    body { margin: 0; color: #172f29; background: #f6f8f5; font: 16px/1.5 system-ui, sans-serif; }
    main { max-width: 1120px; margin: auto; padding: 24px; }
    header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 20px; }
    h1 { margin: 0; font-size: clamp(24px, 5vw, 36px); letter-spacing: -1px; }
    p { margin: 5px 0; }
    .eyebrow { color: #527167; font-size: 12px; font-weight: 700; letter-spacing: 2px; }
    button { border: 1px solid #b6c8bf; background: white; color: #172f29; padding: 10px 16px; border-radius: 8px; font: inherit; cursor: pointer; }
    button:focus-visible { outline: 3px solid #167c60; outline-offset: 3px; }
    #map { height: 65vh; min-height: 350px; border: 1px solid #c7d4cc; border-radius: 14px; }
    .info { display: flex; flex-wrap: wrap; gap: 10px 28px; padding: 16px 0; color: #527167; font-size: 14px; }
    #status { background: #e8efe9; padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; }
    #status.error { background: #fff0dd; color: #754a12; }
    .bus { background: #176b52; border: 2px solid white; color: white; border-radius: 50%; display: grid; place-items: center; font-size: 17px; box-shadow: 0 2px 6px #0004; }
    .bus.stale { background: #8b691f; }
    footer { color: #527167; font-size: 13px; }
    .bus-list { margin: 12px 0 24px; }
    .list-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
    h2 { font-size: 22px; margin: 0; }
    input { font: inherit; padding: 10px 12px; border: 1px solid #b6c8bf; border-radius: 8px; max-width: 100%; }
    .table-wrap { overflow-x: auto; margin-top: 12px; border: 1px solid #c7d4cc; border-radius: 10px; background: white; }
    table { width: 100%; border-collapse: collapse; font-size: 14px; text-align: left; }
    th, td { padding: 12px; border-bottom: 1px solid #e6ece7; min-width: 110px; }
    th { background: #e8efe9; font-size: 12px; text-transform: uppercase; letter-spacing: .5px; }
    td small { display: block; color: #68766e; max-width: 250px; margin-top: 4px; }
    .bus-link { font-size: 14px; padding: 5px 8px; }
    #scheduleNote { color: #527167; font-size: 13px; margin: 10px 0; }
    a { color: #176b52; }
    @media(max-width: 600px) { main { padding: 16px; } header { align-items: flex-start; } #map { height: 60vh; } }