:root {
    --brand-primary: #713CFF;
    --brand-primary-dark: #4D22C7;
    --brand-primary-deep: #4D22C7;
    --brand-accent: #8B5CFF;
    --brand-deep: #4D22C7;
    --brand-black: #121217;
    --brand-black-soft: #211A35;
    --brand-background: #FAF9FF;
    --brand-white: #FFFFFF;
    --background: #FAF9FF;
    --beige-soft: #F3EFFF;
    --beige-selected: #E7DEFF;
    --text-primary: #121217;
    --text-secondary: #686276;
    --text-muted: #91899F;
    --border: #E9E3FF;
    --border-strong: #D4C8F7;
    --app-primary: #713CFF;
    --app-accent: #8B5CFF;
    --app-accent-light: #E7DEFF;
    --app-bg: #FAF9FF;
    --app-surface: #FFFFFF;
    --app-warm: #F3EFFF;
    --app-border: #E9E3FF;
    --app-text: #121217;
    --app-muted: #686276;
    --app-info: #4D22C7;
    --ink: #121217;
    --navy: #4D22C7;
    --primary: #713CFF;
    --primary2: #8B5CFF;
    --mint: #8B5CFF;
    --canvas: #FAF9FF;
    --surface: #FFFFFF;
    --line: #E9E3FF;
}

html, body, .app-shell, .content { background-color: var(--brand-background) !important; }
.app-shell { color: var(--brand-black); }

.app-head,
.ops-hero,
.booking-brand-hero,
.subscription-summary,
.edit-subscription-summary,
.selected-week-summary,
.mobile-date-filter,
.driver-trip-details,
.seven-go-map-badge {
    background: linear-gradient(135deg, var(--brand-deep), var(--brand-primary)) !important;
    color: var(--brand-white) !important;
}

.booking-brand-hero::before {
    background: radial-gradient(circle at 18% 20%, rgba(139, 92, 255, .42), transparent 34%),
        linear-gradient(115deg, transparent 48%, rgba(113, 60, 255, .16)) !important;
}
.booking-road-art {
    border-color: rgba(139, 92, 255, .86) !important;
    border-right-color: transparent !important;
    border-bottom-color: transparent !important;
}
.booking-road-art::after { background: var(--brand-deep) !important; box-shadow: 0 0 0 2px rgba(139,92,255,.35) !important; }
.booking-road-art span { background: #E7DEFF !important; color: var(--brand-deep) !important; }
.booking-brand-copy p { color: #D9CDFF !important; }

.app-head::before,
.app-head::after {
    background: radial-gradient(circle at 88% 15%, rgba(139, 92, 255, .38), transparent 36%) !important;
}

.btn.primary,
.booking-next-step,
.booking-back-step,
.return-change-btn,
.edit-subscription-btn,
.trip-start-button:not(:disabled) {
    border-color: var(--brand-primary) !important;
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)) !important;
    color: var(--brand-white) !important;
    box-shadow: 0 9px 24px rgba(113, 60, 255, .24) !important;
}

.home-primary, .booking-search-action {
    border-color: var(--brand-primary) !important;
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)) !important;
    color: var(--brand-white) !important;
    box-shadow: 0 7px 20px rgba(113,60,255,.24) !important;
}
.home-text-action, .forgot-password, .auth-register button,
.booking-next-strip small, .booking-quick-head small, .booking-quick-actions .app-icon {
    color: var(--brand-primary) !important;
}

.btn.primary :is(span, b),
.booking-next-step :is(span, b),
.booking-back-step :is(span, b),
.edit-subscription-btn::after { color: var(--brand-white) !important; }

.booking-back-step b,
.edit-subscription-btn::before {
    background: rgba(255, 255, 255, .18) !important;
    color: var(--brand-white) !important;
}

.bottom-nav { background: var(--brand-white) !important; border-color: #E9E3FF !important; }
.bottom-nav button.active {
    background: #EEE8FF !important;
    color: var(--brand-deep) !important;
}
.bottom-nav button.active::after { background: var(--brand-primary) !important; }
.bottom-nav button.active :is(svg, i, span) { color: var(--brand-deep) !important; }

.avatar-ring {
    border-color: rgba(255, 255, 255, .45) !important;
    background: linear-gradient(145deg, var(--brand-accent), var(--brand-deep)) !important;
    color: var(--brand-white) !important;
    box-shadow: 0 8px 20px rgba(77, 34, 199, .32) !important;
}
.app-shell .avatar-ring,
.app-shell .avatar-ring > span {
    overflow: hidden !important;
    border-radius: 50% !important;
}
.app-shell .avatar-ring > span {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: block !important;
}
.app-shell .avatar-ring > span > img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: inherit !important;
}
.online-dot, .online-toggle.on { background: #B49BFF !important; color: var(--brand-black) !important; }

.auth-page { background: var(--brand-background) !important; }
.ambient-one { background: radial-gradient(circle, rgba(113, 60, 255, .20), transparent 68%) !important; }
.ambient-two { background: radial-gradient(circle, rgba(139, 92, 255, .14), transparent 68%) !important; }
.auth-brand small, .section-head button, .mark-read, .subscriptions-heading small,
.booking-days-toolbar button, .subscription-price span { color: var(--brand-primary) !important; }
.auth-card input:focus, .form-control:focus {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 4px rgba(113, 60, 255, .12) !important;
}

.quick-card.featured,
.period-type-switch input:checked + span,
.week-calendar-day.range-start,
.driver-trip-day > header > span,
.attendance-actions button.active,
.stop-row button,
.floating-chat {
    background: var(--brand-deep) !important;
    color: var(--brand-white) !important;
    border-color: var(--brand-deep) !important;
}

.quick-card.featured i,
.weekday-picker input:checked + span,
.edit-weekday-picker input:checked + span,
.month-week-days input:checked + span,
.booking-step-title > span,
.booking-flow-progress span.active b,
.subscription-week-head > span,
.booking-month-week-head button,
.return-policy-icon {
    background: #E4DAFF !important;
    border-color: var(--brand-accent) !important;
    color: var(--brand-deep) !important;
}

.period-choice.active,
.booking-flow-progress span.active,
.return-day-banner,
.return-policy-head,
.subscription-week-head,
.week-calendar-day.in-range {
    background: #F0EBFF !important;
    border-color: #CDBDFF !important;
    color: var(--brand-deep) !important;
}

.notification-card.unread {
    background: #F4F0FF !important;
    border-color: #CDBDFF !important;
}
.notification-card > span, .week-calendar-day.today::after { background: var(--brand-primary) !important; }
.card, .quick-card, .notification-card, .booking-flow-card, .month-week-card,
.period-calendar, .booked-day, .driver-trip-day, .driver-run-card, .map-state {
    border-color: #E9E3FF !important;
}

.pill:not(.danger):not(.success):not(.warning) { background: #EEE8FF !important; color: var(--brand-deep) !important; }
.map-refresh { border-color: var(--brand-primary) !important; color: var(--brand-deep) !important; }
.map-refresh:active { background: var(--brand-primary) !important; color: var(--brand-white) !important; }
.bus-map-marker { background: var(--brand-deep) !important; }
.bus-map-marker::after { background: var(--brand-deep) !important; }
.seven-go-map-badge::before { background: var(--brand-accent) !important; box-shadow: 0 0 0 3px rgba(139,92,255,.24) !important; }

::selection { background: #D7CAFF; color: var(--brand-black); }

/* Clear contrast on every purple action */
.btn.primary,
.home-primary,
.booking-search-action,
.booking-next-step,
.booking-back-step,
.edit-subscription-btn,
.daily-trip-action,
.student-track-btn,
.student-route-btn,
.journey-ticket footer button,
.passenger-subscription-card > button,
.subscription-load-details,
.passenger-live-actions button,
.vehicle-details-trigger {
    color: #FFFFFF !important;
}
.btn.primary *,
.home-primary *,
.booking-search-action *,
.booking-next-step *,
.booking-back-step *,
.edit-subscription-btn *,
.daily-trip-action *,
.student-track-btn *,
.student-route-btn *,
.journey-ticket footer button *,
.passenger-subscription-card > button * {
    color: #FFFFFF !important;
}
button.is-loading { opacity: .82; pointer-events: none; }
button.is-loading::after {
    content: "";
    width: 15px;
    height: 15px;
    margin-inline-start: 8px;
    border: 2px solid rgba(255,255,255,.45);
    border-top-color: #FFFFFF;
    border-radius: 50%;
    animation: purple-action-spin .65s linear infinite;
}
@keyframes purple-action-spin { to { transform: rotate(360deg); } }

/* Trip status and trip pages */
.trip-operational-state.upcoming,
.passenger-status.upcoming,
.daily-state,
.journey-direction,
.subscription-state.active,
.subscription-state.pending {
    border-color: #CDBDFF !important;
    background: #E7DEFF !important;
    color: #4D22C7 !important;
}
.journeys-hero,
.live-trip-primary,
.passenger-live-head,
.driver-current-hero,
.driver-live-head,
.weekly-route-card {
    background: linear-gradient(135deg,#4D22C7,#713CFF) !important;
    color: #FFFFFF !important;
}
.journeys-hero :is(h1,h2,h3,b),
.live-trip-primary :is(h1,h2,h3,b),
.passenger-live-head :is(h1,h2,h3,b),
.weekly-route-card :is(h1,h2,h3,b) { color: #FFFFFF !important; }
.journeys-hero :is(p,small,span),
.live-trip-primary header small,
.weekly-route-card small { color: #D9CDFF !important; }
.live-trip-main-grid > div,
.live-direction-route > div,
.live-trip-essentials > div { background: rgba(255,255,255,.12) !important; border-color: rgba(255,255,255,.24) !important; }
.catch-status { background: #FFFFFF !important; color: #121217 !important; }
.catch-status b { color: #121217 !important; }
.catch-status small { color: #686276 !important; }
.live-progress-card > div span.done,
.live-progress-card > div span.destination,
.passenger-map-marker,
.destination-map-marker { background: #4D22C7 !important; color: #FFFFFF !important; border-color: #4D22C7 !important; }
.map-refresh,
.vehicle-details-trigger,
.passenger-live-actions button {
    border-color: #713CFF !important;
    background: linear-gradient(135deg,#713CFF,#8B5CFF) !important;
    color: #FFFFFF !important;
}

/* Compact mobile trip details */
dialog:has(.live-trip-primary) {
    width: min(100% - 12px, 520px) !important;
    max-height: calc(100dvh - 12px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 22px !important;
}
dialog:has(.live-trip-primary) .modal-head {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 58px;
    margin: 0 !important;
    padding: 9px 14px !important;
    background: #FFFFFF !important;
}
dialog:has(.live-trip-primary) #modal-body {
    max-height: calc(100dvh - 70px);
    padding: 8px 12px 14px;
    overflow-y: auto;
    overscroll-behavior: contain;
}
dialog:has(.live-trip-primary) .live-trip-primary { padding: 12px !important; border-radius: 17px !important; }
dialog:has(.live-trip-primary) .live-trip-primary h2 { margin: 7px 0 3px !important; font-size: 17px !important; line-height: 1.4 !important; }
dialog:has(.live-trip-primary) .live-trip-primary header small { font-size: 9px !important; line-height: 1.45 !important; }
dialog:has(.live-trip-primary) .live-direction-badge { padding: 5px 8px !important; background: rgba(255,255,255,.14) !important; color: #FFFFFF !important; font-size: 10px !important; }
dialog:has(.live-trip-primary) .live-direction-route { margin-top: 8px !important; }
dialog:has(.live-trip-primary) .live-direction-route { padding: 9px !important; }
dialog:has(.live-trip-primary) .live-direction-route small,
dialog:has(.live-trip-primary) .live-trip-essentials small { font-size: 8px !important; color: #D9CDFF !important; }
dialog:has(.live-trip-primary) .live-direction-route b,
dialog:has(.live-trip-primary) .live-trip-essentials b { margin-top: 2px !important; font-size: 11px !important; line-height: 1.4 !important; }
dialog:has(.live-trip-primary) .live-trip-essentials { margin-top: 7px !important; }
dialog:has(.live-trip-primary) .live-trip-essentials > div { padding: 8px !important; }
dialog:has(.live-trip-primary) .catch-status { margin-top: 7px !important; padding: 7px !important; }
dialog:has(.live-trip-primary) .catch-status b { font-size: 10px !important; }
dialog:has(.live-trip-primary) .catch-status small { font-size: 8px !important; line-height: 1.4 !important; }
dialog:has(.live-trip-primary) .live-map-toolbar { margin: 7px 0 5px !important; }
dialog:has(.live-trip-primary) .advanced-live-map { height: 190px !important; margin-bottom: 7px !important; border-radius: 15px !important; }
dialog:has(.live-trip-primary) .map-refresh { min-height: 38px !important; margin: 6px 0 !important; }
dialog:has(.live-trip-primary) .live-progress-card { margin-top: 7px !important; padding: 9px !important; }
dialog:has(.live-trip-primary) .live-progress-card > div { margin: 7px 0 4px !important; }
dialog:has(.live-trip-primary) .vehicle-details-trigger { min-height: 39px !important; margin-top: 7px !important; }
dialog:has(.live-trip-primary) .passenger-live-actions {
    position: sticky;
    bottom: -14px;
    z-index: 12;
    margin: 8px -12px -14px !important;
    padding: 8px 12px calc(10px + env(safe-area-inset-bottom)) !important;
    background: #FAF9FF !important;
    border-top: 1px solid #E9E3FF;
}
.journey-empty > i { background: #E7DEFF !important; color: #713CFF !important; }
.journey-empty > button { background: #F3EFFF !important; color: #4D22C7 !important; border-color: #CDBDFF !important; }

/* Passenger trip card corrections */
.journey-direction {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #4D22C7 !important;
    box-shadow: none !important;
}
.journey-direction :is(svg,i,span) { color: #713CFF !important; }
.journey-date-strip button.is-selected {
    border-color: #713CFF !important;
    background: linear-gradient(135deg,#713CFF,#8B5CFF) !important;
    color: #FFFFFF !important;
}
.journey-date-strip button.is-selected :is(small,b,span) { color: #FFFFFF !important; }
.journey-ticket footer button,
.daily-trip-action,
.student-route-btn,
.student-track-btn {
    border: 0 !important;
    background: linear-gradient(135deg,#713CFF,#8B5CFF) !important;
    color: #FFFFFF !important;
    box-shadow: 0 7px 18px rgba(113,60,255,.20) !important;
}
.journey-ticket footer button :is(svg,i,span),
.daily-trip-action :is(svg,i,span),
.student-route-btn :is(svg,i,span),
.student-track-btn :is(svg,i,span) { color: #FFFFFF !important; }

/* Subscription pages */
.subscriptions-heading {
    padding: 16px !important;
    border: 1px solid #E9E3FF !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, #FFFFFF, #F3EFFF) !important;
    box-shadow: 0 12px 30px rgba(77,34,199,.08) !important;
}
.subscriptions-heading small,
.subscriptions-heading h2 { color: #4D22C7 !important; }
.subscriptions-heading p { color: #686276 !important; }
.subscriptions-heading .btn span {
    background: rgba(255,255,255,.18) !important;
    color: #FFFFFF !important;
}
.passenger-subscription-card,
.subscription-detail-card {
    overflow: hidden;
    border: 1px solid #E9E3FF !important;
    background: #FFFFFF !important;
    box-shadow: 0 10px 26px rgba(77,34,199,.08) !important;
}
.passenger-subscription-card::before,
.subscription-detail-card::before { background: linear-gradient(90deg,#4D22C7,#713CFF,#8B5CFF) !important; }
.passenger-subscription-card header { background: #FAF9FF !important; border-color: #E9E3FF !important; }
.passenger-subscription-card header small,
.passenger-subscription-price span,
.subscription-price span { color: #713CFF !important; }
.passenger-subscription-period { background: #F3EFFF !important; border-color: #E9E3FF !important; }
.passenger-subscription-period > span {
    border: 1px solid #E9E3FF !important;
    background: #F3EFFF !important;
    color: #121217 !important;
}
.passenger-subscription-period > span:first-child { background: #E7DEFF !important; }
.passenger-subscription-period small { color: #686276 !important; }
.passenger-subscription-period b,
.passenger-subscription-price b { color: #121217 !important; }
.subscription-state:not(.rejected):not(.cancelled),
.passenger-subscription-card .pill:not(.danger) {
    background: #E7DEFF !important;
    color: #4D22C7 !important;
    border-color: #CDBDFF !important;
}
.passenger-subscription-card > button,
.subscription-load-details {
    border-color: #713CFF !important;
    background: linear-gradient(135deg,#713CFF,#8B5CFF) !important;
    box-shadow: 0 7px 18px rgba(113,60,255,.2) !important;
}
.subscription-week,
.booked-day,
.booking-flow-card,
.quote-box { border-color: #E9E3FF !important; background: #FFFFFF !important; }
.subscription-week-head,
.booking-flow-progress span.active,
.fixed-outbound,
.edit-note,
.booking-note { background: #F3EFFF !important; color: #4D22C7 !important; }
.subscription-week-head > span,
.booking-step-title > span,
.booking-flow-progress span.active b,
.weekday-picker input:checked + span,
.edit-day-toggle input:checked + span,
.month-week-days input:checked + span {
    background: #E7DEFF !important;
    border-color: #8B5CFF !important;
    color: #4D22C7 !important;
}

/* Subscription wizard branding */
dialog:has(.subscription-wizard),
dialog:has(.weekly-booking-shell),
dialog:has(.weekly-review) { background: #FAF9FF !important; }
dialog:has(.subscription-wizard) .modal-head,
dialog:has(.weekly-booking-shell) .modal-head,
dialog:has(.weekly-review) .modal-head { background: #FFFFFF !important; border-color: #E9E3FF !important; }
.subscription-wizard,
.weekly-booking-shell,
.weekly-review { color: #121217 !important; }
.subscription-stepper .active { color: #4D22C7 !important; }
.subscription-stepper .active i,
.subscription-stepper .done i { background: #713CFF !important; color: #FFFFFF !important; }
.subscription-stepper .done::before,
.subscription-stepper .active::before { background: #8B5CFF !important; }
.duration-options button.selected,
.monthly-mode button.selected,
.weekly-day.selected,
.weekly-time-options button.selected {
    border-color: #713CFF !important;
    background: #E7DEFF !important;
    color: #4D22C7 !important;
}
.wizard-next,
.wizard-summary [data-summary-next],
.wizard-summary [data-confirm-subscription],
.weekly-all,
.weekly-apply { background: linear-gradient(135deg,#713CFF,#8B5CFF) !important; color: #FFFFFF !important; }
.wizard-back,
.wizard-summary [data-summary-back] { background: #F3EFFF !important; color: #4D22C7 !important; }
.review-price { background: #F3EFFF !important; border-color: #CDBDFF !important; }
.subscription-success > i { background: #713CFF !important; color: #FFFFFF !important; }

/* Final cross-app design normalization */
:where(.app-shell,.content,dialog) *,
:where(.app-shell,.content,dialog) *::before,
:where(.app-shell,.content,dialog) *::after { box-sizing: border-box; }
:where(.content,dialog) :is(h1,h2,h3,h4,b,strong) { overflow-wrap: anywhere; }
:where(.content,dialog) :is(p,small,span,label) { line-height: 1.65; }
:where(.content,dialog) img { max-width: 100%; }
:where(.content,dialog) button { font-family: inherit; }
:where(.content,dialog) button:focus-visible,
.bottom-nav button:focus-visible {
    outline: 3px solid rgba(139,92,255,.34) !important;
    outline-offset: 2px !important;
}
.home-text-action,
.student-plan-card button,
.journey-empty > button,
.notification-tools button,
.mark-read,
.subscription-load-details { min-height: 40px !important; padding: 8px 11px !important; }
.home-leg,
.daily-trip-action,
.journey-ticket footer button,
.passenger-subscription-card > button { min-height: 44px !important; }

.app-head,
.booking-brand-hero,
.journeys-hero,
.ops-hero,
.profile-cover,
.driver-current-hero,
.driver-live-head,
.passenger-live-head,
.supervisor-detail-hero,
.supervisor-live-summary,
.weekly-route-card,
.selected-week-summary,
.subscription-summary,
.edit-subscription-summary {
    background: linear-gradient(135deg,#4D22C7 0%,#713CFF 68%,#8B5CFF 100%) !important;
    color: #FFFFFF !important;
}
:is(.app-head,.booking-brand-hero,.journeys-hero,.ops-hero,.profile-cover,.driver-current-hero,.driver-live-head,.passenger-live-head,.supervisor-detail-hero,.supervisor-live-summary,.weekly-route-card,.selected-week-summary,.subscription-summary,.edit-subscription-summary) :is(h1,h2,h3,h4,b,strong) { color: #FFFFFF !important; }
:is(.app-head,.booking-brand-hero,.journeys-hero,.ops-hero,.profile-cover,.driver-current-hero,.driver-live-head,.passenger-live-head,.supervisor-detail-hero,.supervisor-live-summary,.weekly-route-card,.selected-week-summary,.subscription-summary,.edit-subscription-summary) :is(p,small) { color: #D9CDFF !important; }

.card,
.student-schedule-card,
.student-plan-card,
.daily-trip-card,
.journey-ticket,
.notification-card,
.profile-section,
.profile-card,
.driver-run-card,
.supervisor-trip-card,
.ops-kpi,
.passenger-wallet-panel {
    border-color: #E9E3FF !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 9px 26px rgba(77,34,199,.07) !important;
}
.content { color: #121217 !important; }
.content :is(.section-head,.page-title) :is(h1,h2,h3) { color: #121217 !important; }
.content :is(.section-head,.page-title) :is(small,p,span) { color: #686276; }
.form-control,
:where(.content,dialog) :is(input,select,textarea) {
    border-color: #D4C8F7 !important;
    background: #FFFFFF !important;
    color: #121217 !important;
}
.form-control:focus,
:where(.content,dialog) :is(input,select,textarea):focus {
    border-color: #713CFF !important;
    box-shadow: 0 0 0 4px rgba(113,60,255,.13) !important;
}

.notification-card.unread,
.request-review-note:not(.rejected),
.profile-form details[open],
.return-policy,
.return-day-banner { background: #F3EFFF !important; border-color: #CDBDFF !important; }
.notification-card > i,
.profile-section > i,
.route-icon,
.quick-card i { background: #E7DEFF !important; color: #4D22C7 !important; }
.floating-chat { background: linear-gradient(135deg,#4D22C7,#713CFF) !important; color: #FFFFFF !important; }
.bottom-nav { background: rgba(255,255,255,.97) !important; border-color: #E9E3FF !important; box-shadow: 0 -8px 28px rgba(77,34,199,.10) !important; }

dialog {
    border: 1px solid #E9E3FF !important;
    background: #FAF9FF !important;
    color: #121217 !important;
}
dialog::backdrop { background: rgba(18,18,23,.58) !important; backdrop-filter: blur(6px); }
.modal-head { background: #FFFFFF; border-color: #E9E3FF !important; }
.modal-head button { background: #F3EFFF !important; color: #4D22C7 !important; }

@media (max-width: 390px) {
    .content { padding-inline: 12px !important; }
    .subscriptions-heading { padding: 13px !important; }
    .subscriptions-heading h2 { font-size: 18px !important; }
    .passenger-subscription-period { grid-template-columns: 1fr !important; }
    dialog:not(:has(.subscription-wizard)):not(:has(.weekly-booking-shell)):not(:has(.weekly-review)) {
        width: calc(100% - 10px) !important;
        max-height: calc(100dvh - 10px) !important;
    }
}

/* Trips uses the same account header as subscriptions and profile */
#app-screen[data-role="student"][data-page="trips"] {
    display: flex !important;
    flex-direction: column !important;
}
#app-screen[data-role="student"][data-page="trips"] .app-head {
    display: block !important;
    flex: 0 0 auto !important;
}
#app-screen[data-role="student"][data-page="trips"] #content {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding-top: 18px !important;
}
#app-screen[data-role="student"][data-page="trips"] .student-journeys {
    margin-inline: 0 !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-hero {
    margin: 0 0 13px !important;
    padding: 15px !important;
    border: 1px solid #E9E3FF !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg,#FFFFFF,#F3EFFF) !important;
    color: #121217 !important;
    box-shadow: 0 10px 28px rgba(77,34,199,.07) !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-title {
    margin-bottom: 12px !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-title h2 {
    margin: 2px 0 0 !important;
    color: #4D22C7 !important;
    font-size: 20px !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-title small {
    color: #713CFF !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-title > span {
    border-color: #CDBDFF !important;
    background: #E7DEFF !important;
    color: #4D22C7 !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-hero-route {
    padding: 11px !important;
    border: 1px solid #E9E3FF !important;
    border-radius: 14px !important;
    background: #FFFFFF !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-hero-route small {
    color: #686276 !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-hero-route b {
    color: #121217 !important;
}
#app-screen[data-role="student"][data-page="trips"] .journey-date-strip {
    margin-inline: 0 !important;
    padding-inline: 0 !important;
}
.app-shell .app-head {
    border-color: #8B5CFF !important;
    background: linear-gradient(135deg,#4D22C7 0%,#713CFF 72%,#8B5CFF 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 10px 28px rgba(77,34,199,.18) !important;
}
.app-shell .app-head::before {
    background: radial-gradient(circle at 88% 15%,rgba(255,255,255,.18),transparent 36%) !important;
}

/* Keep large surfaces violet without drifting into navy */
.app-shell .app-head,
.booking-brand-hero,
.journeys-hero,
.ops-hero,
.profile-cover,
.driver-current-hero,
.driver-live-head,
.passenger-live-head,
.supervisor-detail-hero,
.supervisor-live-summary,
.weekly-route-card,
.selected-week-summary,
.subscription-summary,
.edit-subscription-summary,
.live-trip-primary {
    background: linear-gradient(135deg,#713CFF 0%,#8B5CFF 100%) !important;
}

/* Passive information should not look like clickable cards */
.passenger-subscription-card > header,
.passenger-subscription-period,
.passenger-subscription-period > span,
.passenger-subscription-period > span:first-child {
    background: transparent !important;
    box-shadow: none !important;
}
.passenger-subscription-period {
    gap: 0 !important;
    border-top: 1px solid #E9E3FF !important;
    border-bottom: 1px solid #E9E3FF !important;
    border-inline: 0 !important;
    border-radius: 0 !important;
}
.passenger-subscription-period > span {
    border: 0 !important;
    border-radius: 0 !important;
}
.passenger-subscription-period > span + span {
    border-inline-start: 1px solid #E9E3FF !important;
}
#app-screen[data-role="student"][data-page="trips"] .journeys-hero-route {
    border: 0 !important;
    border-top: 1px solid #E9E3FF !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.passenger-subscription-card header small,
.passenger-subscription-price span,
.subscriptions-heading small,
.wizard-title small,
.booking-flow-card-head small {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
@media(max-width:390px){
    .passenger-subscription-period{grid-template-columns:1fr 1fr!important}
}

/* Purple launch screen */
.brand-splash {
    background: linear-gradient(145deg, #4D22C7 0%, #713CFF 58%, #8B5CFF 100%) !important;
}
.brand-splash::before {
    background:
        radial-gradient(circle at 22% 18%, rgba(255,255,255,.18), transparent 31%),
        radial-gradient(circle at 78% 76%, rgba(139,92,255,.7), transparent 38%),
        linear-gradient(145deg, #4D22C7 0%, #121217 100%) !important;
    filter: none !important;
}