.app-header{height:var(--header-height);background-color:var(--bg-card);border-bottom:1px solid var(--line-border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:100}.brand-logo{display:flex;align-items:center;gap:6px;text-decoration:none}.logo-name{font-size:20px;font-weight:800;color:var(--brand-primary);letter-spacing:-.5px}.logo-badge{font-size:11px;font-weight:700;background-color:var(--brand-accent-light);color:var(--brand-accent-dark);padding:2px 8px;border-radius:var(--radius-full)}.header-actions{display:flex;align-items:center;gap:10px}.btn-pwa-install{font-size:12px;font-weight:700;background-color:var(--brand-accent);color:#3a2400;padding:6px 10px;border-radius:var(--radius-full)}.btn-header-login{font-size:13px;font-weight:700;background-color:var(--brand-primary);color:#fff;padding:6px 14px;border-radius:var(--radius-md)}.user-profile-menu{display:flex;align-items:center;gap:8px}.user-phone{font-size:12px;font-weight:600;color:var(--text-ink);background:var(--bg-canvas);padding:4px 8px;border-radius:var(--radius-sm)}.btn-logout{font-size:12px;font-weight:600;color:var(--text-muted)}.btn-logout:hover{color:var(--color-bad)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:var(--app-max-width);height:var(--bottom-nav-height);background-color:var(--bg-card);border-top:1px solid var(--line-border);display:flex;justify-content:space-around;align-items:center;z-index:100;box-shadow:0 -2px 10px #00000008}.nav-tab{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--text-muted);text-decoration:none;font-size:11px;font-weight:600;flex:1;padding:8px 0;transition:color var(--transition-fast)}.nav-icon{font-size:18px}.nav-tab.active{color:var(--brand-primary);font-weight:700}.nav-tab:hover{color:var(--brand-primary)}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#15302f99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;z-index:1000;animation:fadeIn .2s ease}@media (min-width: 541px){.modal-backdrop{align-items:center}}.modal-content{background:var(--bg-card);width:100%;max-width:var(--app-max-width);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:24px;position:relative;box-shadow:var(--shadow-lg);animation:slideUp .25s cubic-bezier(.16,1,.3,1)}@media (min-width: 541px){.modal-content{border-radius:var(--radius-lg);margin:20px}}.modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:16px}.modal-close:hover{background-color:var(--bg-canvas)}.modal-badge{display:inline-block;background-color:var(--brand-accent-light);color:var(--brand-accent-dark);font-size:12px;font-weight:700;padding:4px 10px;border-radius:var(--radius-full);margin-bottom:8px}.modal-header h2{font-size:20px;font-weight:700;color:var(--text-ink);margin-bottom:4px}.modal-header p{font-size:13px;color:var(--text-muted);margin-bottom:20px}.modal-error{background-color:var(--color-bad-bg);color:var(--color-bad);padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;margin-bottom:16px}.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.form-group label{font-size:13px;font-weight:600;color:var(--text-ink)}.form-group input{padding:14px 16px;border-radius:var(--radius-md);border:1.5px solid var(--line-border);background-color:var(--bg-input);font-size:16px;outline:none;transition:border-color var(--transition-fast)}.form-group input:focus{border-color:var(--brand-primary)}.btn-primary{width:100%;padding:14px;background-color:var(--brand-accent);color:#3a2400;font-size:15px;font-weight:700;border-radius:var(--radius-md);transition:opacity var(--transition-fast)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{width:100%;padding:12px;color:var(--text-muted);font-size:13px;font-weight:600;margin-top:8px}.otp-resend-row{display:flex;justify-content:flex-end;margin-bottom:16px;font-size:13px}.resend-countdown{color:var(--text-muted)}.btn-link{color:var(--brand-primary);font-weight:600;text-decoration:underline}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.search-bar-wrapper{background:var(--bg-card);padding:16px;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--line-border);margin-bottom:20px}.corridor-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;margin-bottom:12px;border-bottom:1px dashed var(--line-border);scrollbar-width:none}.corridor-chips::-webkit-scrollbar{display:none}.chip{white-space:nowrap;font-size:12px;font-weight:600;padding:6px 12px;border-radius:var(--radius-full);background:var(--bg-canvas);color:var(--text-ink);border:1px solid var(--line-border);transition:all var(--transition-fast)}.chip.active,.chip:hover{background:var(--brand-accent);color:#3a2400;border-color:var(--brand-accent)}.search-form{display:flex;flex-direction:column;gap:10px}.search-input-group{display:flex;align-items:center;gap:8px}.search-input{flex:1;padding:12px 14px;background-color:var(--bg-input);border:1px solid var(--line-border);border-radius:var(--radius-md);font-size:14px;outline:none;transition:border-color var(--transition-fast)}.search-input:focus{border-color:var(--brand-primary)}.btn-swap{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background-color:var(--brand-accent-light);color:var(--brand-accent-dark);border-radius:var(--radius-full);font-size:16px;font-weight:700}.search-action-row{display:flex;gap:8px}.date-input{flex:1}.btn-search{padding:12px 20px;background-color:var(--brand-primary);color:#fff;font-size:14px;font-weight:700;border-radius:var(--radius-md);transition:background-color var(--transition-fast)}.btn-search:hover{background-color:var(--brand-primary-dark)}.trip-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;border:1px solid var(--line-border);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:12px;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.trip-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.trip-card.sold-out{opacity:.7}.trip-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.trip-route{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--text-ink)}.route-arrow{color:var(--brand-accent-dark);font-size:13px}.seat-badge{font-size:12px;font-weight:700;padding:4px 10px;border-radius:var(--radius-full);white-space:nowrap}.seat-badge.available{background-color:var(--color-ok-bg);color:var(--color-ok)}.seat-badge.sold-out{background-color:var(--color-bad-bg);color:var(--color-bad)}.trip-card-meta{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--text-muted)}.meta-item{display:flex;align-items:center;gap:4px}.meta-item.rating{color:var(--brand-accent-dark);font-weight:600}.trip-note{font-size:12px;font-style:italic;color:var(--text-muted);background:var(--bg-canvas);padding:8px 10px;border-radius:var(--radius-sm)}.trip-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:10px;border-top:1px dashed var(--line-border)}.trip-fare{display:flex;align-items:baseline;gap:2px}.fare-amount{font-size:18px;font-weight:800;color:var(--brand-primary)}.fare-unit{font-size:12px;color:var(--text-muted)}.btn-trip-detail{padding:8px 14px;background-color:var(--brand-accent);color:#3a2400;font-size:13px;font-weight:700;border-radius:var(--radius-md);text-decoration:none;transition:opacity var(--transition-fast)}.btn-trip-detail:hover{opacity:.9}.home-page-container{padding:16px;display:flex;flex-direction:column}.home-hero{margin-bottom:16px}.home-hero h1{font-size:22px;font-weight:800;color:var(--text-ink);margin-bottom:4px}.home-hero p{font-size:13px;color:var(--text-muted)}.trip-list{display:flex;flex-direction:column;gap:12px}.feed-status{text-align:center;padding:40px 20px;color:var(--text-muted);font-size:14px}.feed-status.error{color:var(--color-bad)}.btn-retry{margin-top:10px;padding:8px 16px;background:var(--brand-primary);color:#fff;border-radius:var(--radius-md);font-size:13px;font-weight:600}.feed-empty{text-align:center;padding:48px 24px;background:var(--bg-card);border-radius:var(--radius-lg);border:1px dashed var(--line-border);color:var(--text-muted);display:flex;flex-direction:column;align-items:center;gap:12px}.empty-icon{font-size:32px}.trip-detail-container{padding:16px;display:flex;flex-direction:column}.detail-top-bar{margin-bottom:12px}.btn-back-icon{font-size:14px;font-weight:600;color:var(--brand-primary);text-decoration:none}.detail-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;border:1px solid var(--line-border);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:16px}.detail-route-card{display:flex;flex-direction:column;position:relative;gap:16px;padding:10px 0}.timeline-node{display:flex;align-items:flex-start;gap:12px}.dot{width:14px;height:14px;border-radius:var(--radius-full);margin-top:4px;flex-shrink:0}.dot-origin{background-color:var(--brand-primary);border:3px solid #EAF2F1}.dot-dest{background-color:var(--brand-accent);border:3px solid var(--brand-accent-light)}.timeline-line{position:absolute;top:24px;bottom:24px;left:6px;width:2px;background-color:var(--line-border)}.node-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;font-weight:700}.timeline-node h3{font-size:16px;font-weight:700;color:var(--text-ink)}.detail-meta-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;background-color:var(--bg-canvas);padding:14px;border-radius:var(--radius-md)}.meta-box{display:flex;flex-direction:column;gap:2px}.box-label{font-size:11px;color:var(--text-muted);font-weight:600}.box-val{font-size:13px;font-weight:700;color:var(--text-ink)}.text-available{color:var(--color-ok)}.text-soldout{color:var(--color-bad)}.detail-driver-note{font-size:13px;color:var(--text-muted);background-color:#fffdf8;border-left:3px solid var(--brand-accent);padding:10px 12px;border-radius:0 var(--radius-sm) var(--radius-sm) 0}.reveal-notice-box{background-color:var(--color-info-bg);color:var(--color-info);padding:10px 14px;border-radius:var(--radius-md);font-size:12px;line-height:1.4}.booking-success-banner{background-color:var(--color-ok-bg);color:var(--color-ok);padding:14px;border-radius:var(--radius-md);font-size:14px;font-weight:700;text-align:center}.booking-section{display:flex;flex-direction:column;gap:14px;padding-top:14px;border-top:1px dashed var(--line-border)}.stepper-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:600}.stepper{display:flex;align-items:center;border:1px solid var(--line-border);border-radius:var(--radius-md);overflow:hidden}.stepper button{width:36px;height:36px;font-size:18px;font-weight:700;background-color:var(--bg-canvas);color:var(--text-ink)}.stepper button:disabled{opacity:.3}.seat-count{width:40px;text-align:center;font-weight:700}.note-input{width:100%;padding:12px 14px;background-color:var(--bg-input);border:1px solid var(--line-border);border-radius:var(--radius-md);font-size:14px;outline:none}.fare-summary-row{display:flex;justify-content:space-between;align-items:center;font-size:14px}.total-fare{font-size:20px;font-weight:800;color:var(--brand-primary)}.btn-book-action{width:100%;padding:14px;background-color:var(--brand-accent);color:#3a2400;font-size:16px;font-weight:800;border-radius:var(--radius-md);box-shadow:0 4px 12px #f4a3404d}.btn-book-action:disabled{background-color:var(--line-border);color:var(--text-muted);box-shadow:none;cursor:not-allowed}.trip-detail-status{text-align:center;padding:60px 20px;color:var(--text-muted)}.trip-detail-status.error{color:var(--color-bad)}.btn-back{display:inline-block;margin-top:14px;padding:10px 16px;background-color:var(--brand-primary);color:#fff;border-radius:var(--radius-md);text-decoration:none}.bookings-page-container{padding:16px;display:flex;flex-direction:column}.bookings-header{margin-bottom:16px}.bookings-header h2{font-size:20px;font-weight:800;color:var(--text-ink)}.bookings-unauth-box,.bookings-empty{text-align:center;padding:48px 24px;background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--line-border);display:flex;flex-direction:column;align-items:center;gap:12px}.unauth-icon,.empty-icon{font-size:36px}.bookings-unauth-box h3,.bookings-empty h3{font-size:16px;font-weight:700;color:var(--text-ink)}.bookings-unauth-box p,.bookings-empty p{font-size:13px;color:var(--text-muted);max-width:300px;margin-bottom:8px}.bookings-list{display:flex;flex-direction:column;gap:14px}.booking-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;border:1px solid var(--line-border);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:12px}.booking-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.booking-route{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--text-ink)}.booking-route .arrow{color:var(--brand-accent-dark);font-size:12px}.status-pill{font-size:12px;font-weight:700;padding:4px 10px;border-radius:var(--radius-full)}.pill-pending{background-color:var(--color-warn-bg);color:var(--color-warn)}.pill-accepted{background-color:var(--color-ok-bg);color:var(--color-ok)}.pill-declined{background-color:var(--color-bad-bg);color:var(--color-bad)}.pill-cancelled{background-color:#eeeff0;color:var(--text-muted)}.booking-meta{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--text-muted)}.driver-reveal-box{background-color:#eaf4f3;border:1px solid #C4E2DF;border-radius:var(--radius-md);padding:12px 14px;display:flex;justify-content:space-between;align-items:center}.driver-reveal-info{display:flex;flex-direction:column;gap:2px}.reveal-label{font-size:11px;font-weight:700;color:var(--brand-primary);text-transform:uppercase}.driver-name{font-size:14px;color:var(--text-ink)}.driver-phone{font-size:14px;font-weight:700;color:var(--brand-primary)}.btn-call-driver{background-color:var(--brand-primary);color:#fff;padding:8px 14px;border-radius:var(--radius-md);font-size:13px;font-weight:700;text-decoration:none}.reveal-waiting-notice{font-size:12px;color:var(--text-muted);background-color:var(--bg-canvas);padding:8px 12px;border-radius:var(--radius-sm)}.bookings-status{text-align:center;padding:40px;color:var(--text-muted)}:root{--brand-primary: #0E7C7B;--brand-primary-dark: #0A5F5E;--brand-accent: #F4A340;--brand-accent-dark: #D9822B;--brand-accent-light: #FBECD9;--bg-canvas: #FAF6F0;--bg-card: #FFFFFF;--bg-input: #FFFBF5;--text-ink: #15302F;--text-muted: #6B8786;--line-border: #EDE3D6;--color-ok: #1E9E6A;--color-ok-bg: #E4F4EC;--color-warn: #D9822B;--color-warn-bg: #FBECD9;--color-bad: #C8463A;--color-bad-bg: #F3E4E2;--color-info: #2563C9;--color-info-bg: #E2F0FF;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(21, 48, 47, .05);--shadow-md: 0 4px 12px rgba(21, 48, 47, .08);--shadow-lg: 0 8px 24px rgba(21, 48, 47, .12);--transition-fast: .15s ease;--app-max-width: 540px;--header-height: 56px;--bottom-nav-height: 64px}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body{font-family:Be Vietnam Pro,system-ui,-apple-system,sans-serif;background-color:var(--bg-canvas);color:var(--text-ink);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;justify-content:center}#root{width:100%;max-width:var(--app-max-width);min-height:100vh;background-color:var(--bg-canvas);position:relative;display:flex;flex-direction:column;box-shadow:0 0 40px #00000008}button{font-family:inherit;cursor:pointer;border:none;background:none}input,textarea{font-family:inherit;color:inherit}.app-layout{display:flex;flex-direction:column;min-height:100vh;position:relative}.app-main-content{flex:1;padding-bottom:calc(var(--bottom-nav-height) + 20px)}