:root { --airport-blue: #1474be; --airport-blue-deep: #0b568e; --airport-blue-bright: #1678c5; --airport-blue-soft: #e8f3fb; --airport-background: #f3f5f8; --airport-ink: #21313c; --airport-muted: #778791; --airport-border: #e4e9ed; --surface: #fff; --success: #198754; --danger: #c93636; --shadow: 0 2px 12px rgba(38,63,82,.08); --radius: 8px; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #e9edf1; color: var(--airport-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
body { padding-bottom: env(safe-area-inset-bottom); }
button, input, textarea, select { font: inherit; }
button { border: 0; cursor: pointer; }
.app-shell { position: relative; width: 100%; min-height: 100vh; margin: 0 auto; padding-bottom: calc(72px + env(safe-area-inset-bottom)); background: var(--airport-background); }
.page { position: relative; width: 100%; max-width: 430px; min-height: 100vh; margin: 0 auto; padding: 0 14px 18px; }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; min-height: 64px; align-items: center; justify-content: space-between; padding: calc(10px + env(safe-area-inset-top)) 0 10px; color: #fff; background: var(--airport-blue); }
.topbar.hero { position: absolute; top: 0; right: -14px; left: -14px; padding-right: 14px; padding-left: 14px; background: transparent; pointer-events: none; }
.topbar.hero .brand-lockup, .topbar.hero .topbar-icon { pointer-events: auto; }
.topbar.light { color: var(--airport-ink); background: #fff; border-bottom: 1px solid #f0f2f4; }
.brand-lockup { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 0; color: inherit; text-align: left; background: transparent; }
.brand-symbol { display: grid; width: 34px; height: 34px; place-items: center; flex: 0 0 34px; color: var(--airport-blue); background: #fff; border-radius: 50%; font-weight: 700; }
.brand-lockup strong, .brand-lockup small { display: block; white-space: nowrap; }
.brand-lockup strong { font-size: 16px; }
.brand-lockup small { margin-top: 2px; color: currentColor; opacity: .7; font-size: 10px; }
.topbar-icon { display: grid; width: 36px; height: 34px; place-items: center; color: inherit; background: #ffffff24; border: 1px solid #ffffff45; border-radius: 18px; font-size: 18px; }
.topbar.light .brand-symbol { color: #fff; background: var(--airport-blue); }
.topbar.light .topbar-icon { color: var(--airport-blue); background: #f6f8fa; border-color: var(--airport-border); }
.hero-swipe { position: relative; height: 220px; margin: 0 -14px; color: #fff; background: var(--airport-blue); }
.hero-slide { position: relative; display: block; width: 100%; height: 220px; overflow: hidden; padding: 70px 22px 26px; color: #fff; text-align: left; background: var(--airport-blue); background-position: center; background-size: cover; }
.hero-slide.scene-runway { background: #176aa8; }
.hero-slide.scene-service { background: #2783c8; }
.hero-copy { position: relative; z-index: 2; display: block; width: 69%; }
.hero-copy strong, .hero-copy > span, .hero-copy em { display: block; }
.hero-copy strong { font-size: 23px; font-weight: 600; line-height: 1.3; }
.hero-copy > span { margin-top: 6px; color: #d7e9f7; font-size: 13px; line-height: 1.55; }
.hero-copy em { display: inline-flex; align-items: center; gap: 4px; margin-top: 9px; padding: 7px 12px; color: var(--airport-blue); background: #fff; border-radius: 17px; font-size: 13px; font-style: normal; }
.hero-art { position: absolute; right: -14px; bottom: 13px; width: 166px; height: 138px; }
.hero-art b { position: absolute; top: 17px; right: 25px; display: grid; width: 72px; height: 72px; place-items: center; color: #fff; background: #ffffff2b; border-radius: 50%; font-size: 42px; }
.hero-orbit { position: absolute; right: -12px; bottom: 12px; width: 162px; height: 102px; border-top: 2px dashed #ffffff66; border-radius: 50%; transform: rotate(-12deg); }
.hero-terminal { position: absolute; right: -12px; bottom: 0; width: 162px; height: 51px; background: #ffffff29; border-top: 3px solid #ffffff73; transform: skew(-19deg); }
.hero-dots { position: absolute; right: 0; bottom: 11px; left: 0; z-index: 3; display: flex; justify-content: center; gap: 6px; }
.hero-dots i { display: block; width: 5px; height: 5px; background: #fff8; border-radius: 5px; }
.hero-dots i.active { width: 16px; background: #fff; }
.section-block { margin-top: 16px; }
.home-service-board { overflow: hidden; padding: 0 10px 10px; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); }
.home-service-tabs { display: flex; min-height: 52px; border-bottom: 1px solid var(--airport-border); }
.home-service-tabs button { position: relative; flex: 1; color: #798690; background: transparent; font-size: 14px; }
.home-service-tabs button.active { color: var(--airport-blue); font-weight: 700; }
.home-service-tabs button.active::after { position: absolute; right: 50%; bottom: -1px; width: 32px; height: 3px; content: ''; background: var(--airport-blue); border-radius: 2px; transform: translateX(50%); }
.quick-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 11px 2px 5px; }
.quick-grid .service-card { border-bottom: 1px solid #f0f3f5; }
.service-card { min-width: 0; }
.service-main { display: flex; width: 100%; min-height: 64px; flex-direction: row; align-items: center; gap: 9px; padding: 7px 4px; color: var(--airport-ink); text-align: left; background: transparent; }
.service-main .service-icon { display: grid; width: 40px; height: 40px; flex: 0 0 40px; place-items: center; color: var(--airport-blue); background: #edf3ff; border-radius: 50%; font-size: 24px; }
.service-main strong { min-width: 0; font-size: 14px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.service-main small { display: block; overflow: hidden; color: var(--airport-muted); font-size: 11px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.quick-grid .service-main { align-items: center; }
.quick-grid .service-main .service-icon { width: 38px; height: 38px; flex-basis: 38px; background: transparent; font-size: 27px; }
.help-strip { display: flex; width: 100%; align-items: center; gap: 10px; margin-top: 8px; padding: 12px 4px 4px; color: var(--airport-ink); text-align: left; background: transparent; border-top: 1px solid #edf1f3; }
.help-icon { display: grid; width: 36px; height: 36px; place-items: center; flex: 0 0 36px; color: var(--airport-blue); background: var(--airport-blue-soft); border-radius: 50%; font-size: 20px; }
.help-strip strong, .help-strip small { display: block; }
.help-strip strong { font-size: 14px; }
.help-strip small { margin-top: 2px; color: var(--airport-muted); font-size: 12px; }
.help-action { margin-left: auto; color: var(--airport-blue); font-size: 13px; }
.section-heading, .page-heading, .catalog-heading { display: flex; align-items: center; justify-content: space-between; }
.section-heading h2, .page-heading h2, .catalog-heading h2 { margin: 0; font-size: 17px; font-weight: 600; }
.section-heading { padding: 0 2px 8px; }
.text-link { padding: 0; color: var(--airport-blue); background: transparent; font-size: 13px; }
.announcement-preview article, .announcement-item { display: flex; gap: 10px; padding: 12px 2px; border-bottom: 1px solid #edf2f5; }
.announcement-preview article > span, .announcement-item > span { display: grid; width: 33px; height: 33px; place-items: center; flex: 0 0 33px; color: var(--airport-blue); background: var(--airport-blue-soft); border-radius: 50%; }
.announcement-preview strong, .announcement-item h3 { font-size: 15px; }
.announcement-preview p, .announcement-item p { margin: 5px 0 0; color: var(--airport-muted); font-size: 12px; line-height: 1.5; }
.announcement-item small { display: block; margin-top: 6px; color: #82939f; font-size: 11px; }
.page-heading { padding: 14px 0 10px; }
.page-heading p, .subpage-heading p { margin: 4px 0 0; color: var(--airport-muted); font-size: 12px; }
.search-box { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 8px 13px; background: #fff; border: 1px solid var(--airport-border); border-radius: 20px; }
.search-box span { color: var(--airport-muted); font-size: 18px; }
.search-box input { width: 100%; border: 0; outline: 0; background: transparent; font-size: 14px; }
.service-layout { display: grid; grid-template-columns: 94px minmax(0, 1fr); min-height: calc(100vh - 198px - env(safe-area-inset-bottom)); margin: 0 -14px; border-top: 1px solid #edf0f2; }
.service-categories { background: #f5f6f8; }
.service-categories button { position: relative; display: block; width: 100%; min-height: 80px; padding: 10px 7px; color: #586976; background: transparent; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.service-categories button.active { color: var(--airport-ink); background: #fff; font-weight: 600; }
.service-categories button.active::before { position: absolute; top: 24px; bottom: 24px; left: 0; width: 3px; content: ''; background: var(--airport-blue-bright); }
.service-catalog { min-width: 0; padding: 17px 9px 20px; background: #fff; }
.catalog-heading { padding-bottom: 12px; }
.catalog-heading span { color: var(--airport-muted); font-size: 12px; }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px 4px; }
.service-grid .service-main { display: flex; min-height: 76px; flex-direction: column; justify-content: flex-start; gap: 6px; padding: 4px 1px; text-align: center; }
.service-grid .service-main .service-icon { width: 46px; height: 46px; flex-basis: 46px; color: var(--airport-blue); background: transparent; font-size: 30px; }
.service-grid .service-main strong { width: 100%; font-size: 13px; font-weight: 400; line-height: 1.4; }
.profile-panel { display: flex; width: calc(100% + 36px); min-height: 128px; align-items: center; gap: 14px; margin: 0 -18px; padding: 18px 22px 27px; color: var(--airport-ink); text-align: left; background: #edf6ff; }
.profile-panel > div { min-width: 0; flex: 1; }
.profile-panel h2 { margin: 0; font-size: 20px; font-weight: 500; }
.profile-panel p { margin: 7px 0 0; color: #6f8494; font-size: 13px; }
.avatar { display: grid; width: 54px; height: 54px; place-items: center; flex: 0 0 54px; color: #fff; background: var(--airport-blue); border-radius: 50%; font-size: 22px; }
.avatar.guest { color: var(--airport-blue); background: #fff; }
.profile-arrow { padding: 8px; color: #9eaab3; background: transparent; font-size: 21px; }
.mine-page { min-height: calc(100vh - 126px); padding: 0 18px 24px; background: #f3f5f8; }
.mine-shortcuts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; padding: 18px 0; }
.mine-shortcuts button { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: 5px; padding: 0 2px; color: var(--airport-ink); background: transparent; text-align: center; }
.shortcut-icon { display: grid; width: 38px; height: 38px; place-items: center; color: var(--airport-blue); background: transparent; font-size: 25px; }
.shortcut-icon.sky { color: #3e9bd0; }.shortcut-icon.azure { color: #1f8ac1; }.shortcut-icon.navy { color: #356eb0; }
.mine-shortcuts strong { font-size: 12px; font-weight: 500; }.mine-shortcuts small { color: var(--airport-muted); font-size: 10px; line-height: 1.2; }
.mine-section { margin-top: 4px; }.mine-section h3 { margin: 0 0 8px; font-size: 16px; }.mine-list { overflow: hidden; background: #fff; border: 1px solid var(--airport-border); border-radius: 7px; }
.mine-list button { display: flex; width: 100%; align-items: center; gap: 10px; padding: 14px; color: var(--airport-ink); background: #fff; border-bottom: 1px solid #edf1f3; text-align: left; font-size: 14px; }.mine-list button:last-child { border-bottom: 0; }.mine-list button span { color: var(--airport-blue); font-size: 19px; }.mine-list b { margin-left: auto; color: #9eaab3; font-size: 20px; font-weight: 400; }
.login-callout { margin-top: 6px; padding: 18px; background: #fff; border: 1px solid var(--airport-border); border-radius: 7px; }.login-callout h3 { margin: 0; font-size: 16px; }.login-callout p { margin: 7px 0 13px; color: var(--airport-muted); font-size: 13px; }.logout-button { width: 100%; margin-top: 22px; padding: 12px; color: var(--danger); background: #fff; border: 1px solid #f1d9d9; border-radius: 7px; }
.tabbar { position: fixed; right: 0; bottom: 0; left: 0; z-index: 40; display: grid; grid-template-columns: repeat(3, 1fr); width: min(100%, 430px); height: calc(70px + env(safe-area-inset-bottom)); margin: 0 auto; padding-bottom: env(safe-area-inset-bottom); background: #fffffffa; border-top: 1px solid #e8ecef; box-shadow: 0 -3px 12px #2b3e4d0d; }.tabbar button { display: flex; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #7e8b94; background: transparent; font-size: 14px; }.tabbar button span { font-size: 22px; }.tabbar button.active { color: var(--airport-blue-bright); font-weight: 600; }.tabbar small { font-size: 12px; }
.subpage { padding-bottom: calc(94px + env(safe-area-inset-bottom)); }.subpage-heading { display: flex; align-items: center; gap: 10px; padding: 14px 0; }.subpage-heading > button { width: 32px; height: 32px; color: var(--airport-blue); background: #fff; border: 1px solid var(--airport-border); border-radius: 50%; font-size: 22px; }.subpage-heading h2 { margin: 0; font-size: 18px; }.form-section { margin-bottom: 12px; padding: 15px 13px; background: #fff; border: 1px solid var(--airport-border); border-radius: 7px; }.form-field { display: block; margin-bottom: 13px; }.form-field > span { display: block; margin-bottom: 6px; color: var(--airport-ink); font-size: 13px; }.form-field input, .form-field textarea, .form-field select { width: 100%; padding: 11px; color: var(--airport-ink); background: #f6f8fa; border: 1px solid #e6eaed; border-radius: 5px; outline: 0; }.form-field textarea { min-height: 120px; resize: vertical; }.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color: var(--airport-blue); box-shadow: 0 0 0 3px #1474be24; }.check { display: flex; align-items: flex-start; gap: 7px; margin: 12px 0; color: var(--airport-muted); font-size: 12px; line-height: 1.5; }.check input { margin-top: 2px; accent-color: var(--airport-blue); }.btn { min-height: 40px; padding: 0 18px; color: #fff; background: var(--airport-blue); border-radius: 6px; font-size: 14px; }.btn.block { width: 100%; }.form-error { min-height: 18px; margin: 0 0 8px; color: var(--danger); font-size: 12px; }.history-list { display: grid; gap: 9px; }.history-item { display: block; width: 100%; padding: 14px; color: var(--airport-ink); text-align: left; background: #fff; border: 1px solid var(--airport-border); border-radius: 7px; }.history-item > div { display: flex; justify-content: space-between; gap: 8px; }.history-item p { margin: 8px 0; color: var(--airport-muted); font-size: 13px; line-height: 1.6; }.history-item small { color: #82939f; font-size: 11px; }.status { padding: 3px 7px; color: var(--airport-blue); background: var(--airport-blue-soft); border-radius: 10px; font-size: 11px; }.empty { padding: 28px 12px; color: var(--airport-muted); text-align: center; }.full-state { display: grid; min-height: 70vh; place-items: center; align-content: center; gap: 8px; padding: 20px; text-align: center; }.full-state span { color: var(--airport-blue); font-size: 30px; }.full-state h2 { margin: 0; font-size: 18px; }.full-state p { margin: 0 0 8px; color: var(--airport-muted); font-size: 13px; }.detail-copy, .sheet-content p { color: var(--airport-muted); line-height: 1.8; }.content-detail img { display: block; width: 100%; max-height: 180px; object-fit: cover; border-radius: 5px; }.content-body { white-space: pre-wrap; line-height: 1.8; }.sheet-backdrop { position: fixed; inset: 0; z-index: 60; background: #0f172a66; }.bottom-sheet { position: fixed; right: 0; bottom: 0; left: 0; z-index: 61; width: min(100%, 430px); max-height: 80vh; margin: 0 auto; overflow-y: auto; padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); background: #fff; border-radius: 14px 14px 0 0; box-shadow: 0 -8px 30px #172b3d26; }.sheet-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }.sheet-header h2 { margin: 0; font-size: 18px; }.sheet-header p { margin: 5px 0 0; color: var(--airport-muted); font-size: 12px; }.sheet-header > button { width: 32px; height: 32px; color: var(--airport-muted); background: #f4f6f8; border-radius: 50%; font-size: 22px; }.sheet-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 17px; }.sheet-actions .btn { width: 100%; }.auth-form .text-link { display: block; width: 100%; margin-top: 12px; text-align: center; }.text-link { color: var(--airport-blue); background: transparent; font-size: 13px; }.announcement-item h3 { margin: 0; font-size: 15px; }
.wechat-share-guide { padding: 3px 4px 0; text-align: center; }.wechat-share-icon { display: grid; width: 58px; height: 58px; margin: 0 auto 11px; place-items: center; color: #fff; background: #1aad19; border-radius: 50%; font-size: 31px; }.wechat-share-guide h3 { margin: 0; color: var(--airport-ink); font-size: 17px; font-weight: 600; }.wechat-share-guide > p { margin: 9px auto 0; max-width: 320px; color: var(--airport-muted); font-size: 13px; line-height: 1.8; }.wechat-share-guide > p b { color: var(--airport-ink); font-size: 18px; }.wechat-share-steps { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 19px 0 3px; }.wechat-share-steps > span { display: flex; min-width: 103px; flex-direction: column; align-items: center; gap: 6px; }.wechat-share-steps b { display: grid; width: 28px; height: 28px; place-items: center; color: #fff; background: var(--airport-blue); border-radius: 50%; font-size: 13px; }.wechat-share-steps small { color: var(--airport-muted); font-size: 11px; }.wechat-share-steps > i { color: #a7b4bd; font-size: 18px; font-style: normal; }
.toast { position: fixed; right: 50%; bottom: 86px; z-index: 80; max-width: calc(100% - 40px); padding: 10px 14px; color: #fff; background: #1f2937eb; border-radius: 6px; opacity: 0; pointer-events: none; transform: translate(50%, 8px); transition: .2s ease; }.toast.is-visible { opacity: 1; transform: translate(50%, 0); }
@media (min-width: 431px) { .app-shell { max-width: 430px; box-shadow: 0 0 30px #30424e1f; } .tabbar { left: 50%; transform: translateX(-50%); } }

/* Vue parity: these values mirror the legacy Vant build's app-specific layer. */
html { min-width: 320px; background: #e8edf1; }
body { min-width: 320px; background: var(--airport-background); font-size: 16px; }
.page, .subpage { width: 100%; margin: 0 auto; padding: 14px 14px 0; }
.home-page { position: relative; z-index: 0; padding: 0 12px; }
.topbar.hero { right: 0; left: 0; padding-right: 14px; padding-left: 14px; }
.brand-welcome { overflow: hidden; min-width: 0; margin: 0; padding: 7px 10px; color: #fff; background: #ffffff29; border: 1px solid rgba(255,255,255,.22); border-radius: 16px; font-size: 14px; font-weight: 500; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.home-page .hero-swipe { margin-right: -12px; margin-left: -12px; }
.quick-grid { gap: 8px; padding: 11px 6px 5px; }
.quick-item { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) 40px; align-items: center; gap: 6px; padding: 10px 8px 10px 12px; color: var(--airport-ink); text-align: left; background: #f7f8fa; border: 1px solid #f0f3f6; border-radius: 7px; }
.quick-item > span:first-child { min-width: 0; }
.quick-item strong, .quick-item small { display: block; }
.quick-item strong { overflow: hidden; font-size: 14px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.quick-item small { display: -webkit-box; overflow: hidden; margin-top: 7px; color: #6f7f8a; font-size: 13px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.quick-item .service-icon { width: 40px; height: 40px; place-self: center; color: var(--airport-blue); background: transparent; border-radius: 0; box-shadow: none; font-size: 29px; }
.help-strip { min-height: 62px; margin-top: 14px; padding: 11px 13px; background: var(--airport-blue-soft); border: 1px solid #d8e9f8; border-radius: 7px; }
.help-icon { color: #fff; background: var(--airport-blue); }
.help-strip small { margin-top: 5px; font-size: 13px; }
.page-heading { align-items: flex-end; padding: 3px 14px 10px; }
.page-heading h2 { margin: 4px 0 0; font-size: 21px; }
.catalog-heading { padding: 0 4px 14px; }
.catalog-heading h2 { font-size: 17px; font-weight: 500; }
.catalog-heading span { font-size: 13px; }
.service-page { padding-top: 10px; background: #fff; }
.profile-panel { min-height: 128px; margin: 0 -18px; padding: 18px 22px 27px; }
.profile-panel .avatar { width: 56px; height: 56px; flex-basis: 56px; color: #fff; background: #9dcaff; border: 3px solid #fff; font-size: 20px; font-weight: 600; box-shadow: 0 2px 9px #3172ae1f; }
.profile-panel .avatar.guest { color: var(--airport-blue); background: #fff; }
.mine-shortcuts { position: relative; z-index: 2; grid-template-columns: repeat(4, minmax(0, 1fr)); min-height: 116px; margin-top: -10px; padding: 12px 2px; background: #fff; border-radius: 7px; box-shadow: 0 3px 14px #293e4e0f; }
.mine-shortcuts button { justify-content: center; gap: 7px; }
.mine-shortcuts button + button { border-left: 1px solid #f0f2f4; }
.mine-shortcuts strong { max-width: 100%; font-size: 14px; font-weight: 400; }
.mine-shortcuts small { display: none; }
.mine-section { margin-top: 12px; }
.mine-list { border-radius: 6px; }
.mine-list button { min-height: 64px; padding: 11px 14px; font-size: 16px; }
.subpage-heading { display: none; }
.service-page .topbar, .mine-page .topbar { margin-right: -18px; margin-left: -18px; padding-right: 18px; padding-left: 18px; }
.home-page > .announcement-preview { display: none; }
.form-intro { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 16px; color: #fff; background: var(--airport-blue); border-radius: 7px; }
.form-intro > span { display: grid; width: 40px; height: 40px; flex: 0 0 40px; place-items: center; color: var(--airport-blue); background: #fff; border-radius: 50%; font-size: 19px; }
.form-intro h2 { margin: 0; font-size: 18px; }.form-intro p { margin: 6px 0 0; color: #d5e8f7; font-size: 14px; }
.category-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 8px; padding: 3px 0; }
.category-options label { display: flex; min-height: 36px; align-items: center; gap: 7px; font-size: 15px; }.category-options input { accent-color: var(--airport-blue); }
.form-section h3 { margin: 0 0 12px; font-size: 16px; }.form-section h3 small { margin-left: 4px; color: var(--airport-blue); font-size: 14px; font-weight: 400; }
.form-section .form-field { margin-bottom: 0; }.form-section .form-field > span:empty { display: none; }
.privacy-tip { display: flex; align-items: center; gap: 5px; margin: 9px 1px 0; color: var(--airport-muted); font-size: 14px; line-height: 1.45; }
.anonymous-cell { margin: 0 0 12px; padding: 12px 14px; background: #fff; border: 1px solid var(--airport-border); border-radius: 7px; }.anonymous-cell span { display: grid; gap: 3px; }.anonymous-cell small { color: var(--airport-muted); font-size: 12px; }
.booking-page, .booking-record-page { padding-bottom: calc(94px + env(safe-area-inset-bottom)); }
.booking-intro { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 16px; color: #fff; background: var(--airport-blue); border-radius: 7px; }.booking-intro > span { display: grid; width: 40px; height: 40px; flex: 0 0 40px; place-items: center; color: var(--airport-blue); background: #fff; border-radius: 50%; font-size: 20px; }.booking-intro h2 { margin: 0; font-size: 18px; }.booking-intro p { margin: 6px 0 0; color: #d5e8f7; font-size: 13px; line-height: 1.5; }
.booking-page .form-section { padding: 0; overflow: hidden; }.booking-page .form-section h3 { margin: 0; padding: 14px 13px 8px; }.booking-page .form-section .form-field { padding: 11px 13px; margin: 0; border-bottom: 1px solid #edf0f2; }.booking-page .form-section .form-field:last-child { border-bottom: 0; }.booking-page .form-field > span:first-child { width: 78px; margin: 0 0 6px; color: var(--airport-ink); }.booking-page .form-field input, .booking-page .form-field textarea, .booking-page .form-field select { background: transparent; border: 0; border-radius: 0; }.booking-page .form-field textarea { min-height: 90px; }.inline-options { display: flex; gap: 14px; }.inline-options label { display: flex; align-items: center; gap: 5px; }.inline-options input { width: auto; accent-color: var(--airport-blue); }
.booking-agreement { display: block; margin: 14px 4px; color: var(--airport-muted); font-size: 13px; line-height: 1.45; }.booking-record-page { min-height: calc(100vh - 92px - env(safe-area-inset-bottom)); }
.booking-rules-agreement { display: flex; align-items: flex-start; }.booking-rules-link { display: inline; margin-left: 4px; padding: 0; color: var(--airport-blue); background: transparent; font: inherit; text-decoration: underline; }.service-rules-content,.luggage-rules-content { width: 100%; min-width: 0; max-width: 100%; overflow-x: hidden; overflow-wrap: anywhere !important; word-break: break-word !important; white-space: normal !important; color: var(--airport-ink); font-size: 14px; line-height: 1.75; }.service-rules-content *,.luggage-rules-content * { box-sizing: border-box; min-width: 0; max-width: 100%; overflow-wrap: anywhere !important; word-break: break-word !important; white-space: normal !important; }.service-rules-content p,.luggage-rules-content p { margin: 0 0 10px; }.service-rules-content p:last-child,.luggage-rules-content p:last-child { margin-bottom: 0; }.service-rules-content img,.luggage-rules-content img { display: block; width: auto; max-width: 100%; height: auto; }.service-rules-content table,.luggage-rules-content table { display: table; width: 100% !important; max-width: 100%; table-layout: fixed; border-collapse: collapse; }.service-rules-content th,.service-rules-content td,.luggage-rules-content th,.luggage-rules-content td { min-width: 0; overflow-wrap: anywhere !important; word-break: break-word !important; white-space: normal !important; }.service-rules-content pre,.luggage-rules-content pre { max-width: 100%; overflow: hidden; white-space: pre-wrap !important; overflow-wrap: anywhere !important; }

/* Native controls matching the legacy Vant field rows and fixed action bars. */
.mine-page .profile-panel { display: flex; width: calc(100% + 36px); border: 0; cursor: pointer; }
.mine-page .profile-panel .profile-arrow { margin-left: auto; color: #9eaab3; background: transparent; font-size: 21px; }
.mine-list button > span:nth-child(2) { min-width: 0; flex: 1; }
.mine-list button > span:first-child { color: var(--airport-blue-bright); font-size: 17px; }
.mine-list button > span:nth-child(2) { color: var(--airport-ink); font-size: 14px; line-height: 1.45; }
.mine-list button > span:last-child { color: #a3adb5; font-size: 19px; }
.mine-icon { display: grid; width: 26px; height: 26px; place-items: center; color: var(--airport-blue-bright); font-size: 17px; }
.feedback-action-bar, .booking-action-bar { position: fixed; right: 0; bottom: 0; left: 0; z-index: 42; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: min(100%, 430px); margin: 0 auto; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: #fffffffa; border-top: 1px solid var(--airport-border); box-shadow: 0 -3px 12px #2b3e4d12; }
.feedback-detail .detail-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--airport-border); }
.feedback-detail .detail-meta small { color: var(--airport-muted); font-size: 12px; }
.feedback-detail-content { margin: 14px 0; color: var(--airport-ink); font-size: 14px; line-height: 1.65; white-space: pre-wrap; }
.feedback-detail .reply-item { margin-top: 9px; }
.feedback-record-content { display: -webkit-box; overflow: hidden; margin: 9px 0; color: var(--airport-muted); font-size: 14px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.reply-list { display: grid; gap: 8px; margin: 11px 0; }
.reply-item { padding: 10px 11px; background: var(--airport-blue-soft); border-left: 3px solid var(--airport-blue); border-radius: 4px; }
.reply-item strong { color: var(--airport-blue); font-size: 14px; font-weight: 600; }
.reply-item p { margin: 6px 0 5px; color: var(--airport-ink); font-size: 14px; line-height: 1.55; white-space: pre-wrap; }
.reply-item small, .reply-pending, .staff-reply-pending { color: var(--airport-muted); font-size: 13px; }
.feedback-reply-images { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.feedback-reply-images img { width: 96px; height: 72px; object-fit: cover; border: 1px solid #c9dce9; border-radius: 4px; background: #fff; }
.feedback-reply-images img.is-previewable { cursor: zoom-in; }
.staff-reply { padding: 10px 11px; background: var(--airport-blue-soft); border-left: 3px solid var(--airport-blue); border-radius: 4px; }
.staff-reply strong { color: var(--airport-blue); font-size: 14px; font-weight: 600; }
.staff-reply p { margin: 6px 0 5px; color: var(--airport-ink); font-size: 14px; line-height: 1.55; white-space: pre-wrap; }
.staff-reply-image { display: block; width: min(100%, 240px); max-height: 180px; margin-top: 8px; object-fit: cover; border-radius: 4px; }
.staff-reply-image.is-previewable { cursor: zoom-in; }
.feedback-action-bar .btn, .booking-action-bar .btn { width: 100%; min-height: 40px; border-radius: 20px; }
.booking-page .form-section .form-field { display: flex; min-height: 47px; align-items: center; padding: 11px 13px; margin: 0; border-bottom: 1px solid #edf0f2; }
.booking-page .form-field > span:first-child { width: 78px; flex: 0 0 78px; margin: 0; color: var(--airport-ink); }
.booking-page .form-field > input, .booking-page .form-field > textarea, .booking-page .form-field > select, .booking-page .form-field > .inline-options, .booking-page .form-field > .stepper { min-width: 0; flex: 1; }
.booking-page .form-field input, .booking-page .form-field textarea, .booking-page .form-field select { padding: 0; background: transparent; border: 0; border-radius: 0; }
.booking-page .form-field textarea { min-height: 90px; padding-top: 2px; }
.booking-page .form-field:has(textarea) { align-items: flex-start; }
.inline-options { display: flex; gap: 14px; align-items: center; }
.inline-options label { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.stepper { display: flex; width: 116px; height: 32px; align-items: center; justify-content: flex-end; }
.stepper button { display: grid; width: 28px; height: 28px; place-items: center; color: var(--airport-blue); background: #edf5fb; border-radius: 50%; font-size: 18px; }
.stepper input { width: 42px !important; flex: 0 0 42px !important; color: var(--airport-ink); text-align: center; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { margin: 0; appearance: none; }
.booking-select { width: 100%; min-width: 0; padding: 0 !important; color: var(--airport-ink); font: inherit; line-height: 24px; background: transparent !important; border: 0 !important; outline: 0; }
@media (min-width: 431px) { .feedback-action-bar, .booking-action-bar { left: 50%; transform: translateX(-50%); } }

/* Keep fixed controls aligned with the same centered 430px canvas as the page. */
.tabbar, .feedback-action-bar, .booking-action-bar { left: calc(50% - 215px); right: auto; transform: none; }
@media (max-width: 430px) { .tabbar, .feedback-action-bar, .booking-action-bar { left: 0; width: 100%; } }

/* Stable type scale shared by every native page. */
:root { --text-xs: 12px; --text-sm: 13px; --text-md: 14px; --text-lg: 16px; --text-xl: 20px; }
body { font-size: var(--text-md); line-height: 1.45; }
.topbar .main-page-title, .topbar .subpage-title { font-size: 18px; line-height: 1.3; }
.page-heading h2 { font-size: var(--text-xl); line-height: 1.35; }
.quick-item strong, .service-grid .service-main strong { font-size: var(--text-md); line-height: 1.4; }
.quick-item small, .help-strip small, .page-heading p, .catalog-heading span, .search-box input { font-size: var(--text-sm); line-height: 1.4; }
.service-categories button, .category-options label, .form-field, .booking-page .form-field, .mine-list button { font-size: var(--text-md); line-height: 1.45; }
.form-section h3, .booking-intro h2, .form-intro h2 { font-size: var(--text-lg); line-height: 1.35; }
.form-section h3 small { font-size: var(--text-sm); }
.tabbar button { font-size: var(--text-sm); line-height: 1.2; }
.tabbar small { font-size: var(--text-xs); line-height: 1.2; }
.feedback-action-bar .btn, .booking-action-bar .btn { font-size: var(--text-md); }

/* Compact form alignment: labels and controls keep a stable baseline at every supported width. */
.booking-page .form-field > span:first-child { flex: 0 0 82px; width: 82px; line-height: 1.45; }
.booking-page .form-field > input, .booking-page .form-field > textarea, .booking-page .form-field > select { min-width: 0; }
.booking-page .form-field input::placeholder, .booking-page .form-field textarea::placeholder { color: #9aa8b1; opacity: 1; }
.booking-page .form-field:has(textarea) { min-height: 112px; }
.booking-page .stepper { flex: 0 1 128px; width: 128px; margin-left: auto; }
.booking-page .inline-options { flex-wrap: wrap; row-gap: 6px; }
.booking-page .booking-radio-options { display: flex !important; flex-wrap: nowrap; align-items: center; gap: 16px; }
.feedback-action-bar, .booking-action-bar { min-height: 62px; }
.feedback-action-bar .btn, .booking-action-bar .btn { min-height: 42px; font-weight: 600; }
@media (max-width: 360px) {
  .booking-page .form-field > span:first-child { flex-basis: 74px; width: 74px; }
  .booking-page .inline-options { gap: 8px; }
  .booking-page .form-section .form-field { padding-right: 11px; padding-left: 11px; }
  .booking-action-bar, .feedback-action-bar { gap: 7px; padding-right: 10px; padding-left: 10px; }
}

/* Satisfaction survey */
.satisfaction-page { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }.survey-hero { display:flex; align-items:center; gap:12px; margin:0 -14px 14px; padding:21px 18px; color:#fff; background:linear-gradient(135deg,#157cc2,#49a58d); }.survey-hero>span { display:grid; width:44px; height:44px; place-items:center; flex:0 0 44px; color:#1975aa; background:#fff; border-radius:50%; font-size:24px; }.survey-hero h2 { margin:0; font-size:18px; }.survey-hero p { margin:5px 0 0; color:#e7f5f1; font-size:13px; line-height:1.55; }.survey-hint { margin:-3px 0 12px; color:var(--airport-muted); font-size:12px; line-height:1.55; }.survey-ticket-list { display:grid; gap:8px; }.survey-ticket { display:flex; align-items:flex-start; gap:9px; padding:11px; background:#f7fafb; border:1px solid #e5ecef; border-radius:6px; }.survey-ticket input { margin:4px 0 0; accent-color:var(--airport-blue); }.survey-ticket span { display:grid; min-width:0; gap:3px; }.survey-ticket strong { color:var(--airport-ink); font-size:14px; }.survey-ticket small { color:#82929b; font-size:11px; }.survey-ticket em { display:-webkit-box; overflow:hidden; color:#62747e; font-size:12px; font-style:normal; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.survey-overall { text-align:center; }.survey-overall>p { margin:0 0 12px; color:var(--airport-muted); font-size:13px; }.survey-stars { display:flex; justify-content:center; gap:8px; }.survey-stars button { padding:0; color:#d7dee2; background:transparent; font-size:34px; line-height:1; transition:color .15s,transform .15s; }.survey-stars button.active { color:#f2b444; }.survey-stars button:active { transform:scale(.9); }.survey-score-text { display:block; min-height:19px; margin-top:9px; color:#c28b26; font-size:13px; }.survey-dimension { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 0; border-bottom:1px solid #edf1f3; }.survey-dimension:last-child { border-bottom:0; }.survey-dimension>div:first-child { display:grid; min-width:0; gap:3px; }.survey-dimension strong { color:#40515a; font-size:14px; font-weight:500; }.survey-dimension small { color:#91a0a8; font-size:11px; }.survey-dimension .survey-stars { gap:2px; flex:0 0 auto; }.survey-dimension .survey-stars button { font-size:21px; }.survey-tags { display:flex; flex-wrap:wrap; gap:8px; }.survey-tag input { position:absolute; opacity:0; pointer-events:none; }.survey-tag span { display:block; padding:7px 10px; color:#57707b; background:#f5f8f9; border:1px solid #e1e8ea; border-radius:17px; font-size:12px; }.survey-tag input:checked+span { color:#1773a9; background:#eaf5fb; border-color:#9ac7df; }.survey-tag.negative input:checked+span { color:#ac643c; background:#fff5ec; border-color:#f0c7aa; }.survey-comment { width:100%; min-height:98px; padding:10px; color:var(--airport-ink); background:#f7f9fa; border:1px solid #e5eaed; border-radius:5px; outline:0; resize:vertical; }.survey-comment:focus { border-color:var(--airport-blue); box-shadow:0 0 0 3px #1474be24; }.survey-action-bar { position:fixed; right:0; bottom:0; left:calc(50% - 215px); z-index:42; width:min(100%,430px); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:#fffffffa; border-top:1px solid var(--airport-border); box-shadow:0 -3px 12px #2b3e4d12; }.survey-action-bar .btn { width:100%; min-height:42px; border-radius:21px; font-weight:600; }.survey-action-bar .btn:disabled { background:#9db7c7; cursor:wait; }.survey-completed { margin:14px 0 8px; padding:15px 13px; background:#fff; border:1px solid var(--airport-border); border-radius:7px; }.survey-section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }.survey-section-heading h3 { margin:0; font-size:16px; }.survey-section-heading span { color:var(--airport-muted); font-size:12px; }.survey-completed article { padding:10px 0; border-top:1px solid #edf1f3; }.survey-completed article>div { display:flex; align-items:center; justify-content:space-between; gap:8px; }.survey-completed article strong { font-size:13px; }.survey-completed article span { color:#edaf3f; font-size:14px; letter-spacing:1px; }.survey-completed article p { margin:5px 0; color:#687983; font-size:12px; line-height:1.45; }.survey-completed article small { color:#97a4aa; font-size:11px; }.survey-empty { display:grid; justify-items:center; padding:40px 18px; text-align:center; background:#fff; border:1px solid var(--airport-border); border-radius:7px; }.survey-empty>span { color:#5b9bc4; font-size:34px; }.survey-empty h3 { margin:12px 0 7px; font-size:17px; }.survey-empty p { max-width:270px; margin:0 0 16px; color:var(--airport-muted); font-size:13px; line-height:1.6; }
@media (max-width:430px) { .survey-action-bar { left:0; width:100%; } }.survey-action-bar { transform:none; }
.survey-five-star { width:100%; margin:0 0 14px; padding:10px 14px; color:#9b6913; background:#fff8e8; border:1px solid #f2d18a; border-radius:6px; font-size:14px; font-weight:600; }
.survey-hero { background:#1474be; }

/* Service request records: a readable summary and reply timeline for every form type. */
.booking-record-page { background: #f3f7f9; }
.records-intro { display: flex; align-items: center; gap: 11px; margin: -14px -14px 14px; padding: 18px 16px; color: #fff; background: #1474be; }
.records-intro-icon { display: grid; width: 42px; height: 42px; place-items: center; flex: 0 0 42px; color: #1474be; background: #fff; border-radius: 12px; font-size: 22px; }
.records-intro > div:nth-child(2) { min-width: 0; flex: 1; }
.records-intro h2 { margin: 0; font-size: 19px; line-height: 1.3; }
.records-intro p { margin: 4px 0 0; color: #d9edf9; font-size: 12px; line-height: 1.4; }
.records-intro > strong { display: grid; justify-items: end; font-size: 22px; line-height: 1; }
.records-intro > strong small { margin-top: 4px; color: #d9edf9; font-size: 10px; font-weight: 400; }
.booking-history-item { padding: 0; overflow: hidden; border: 0; border-radius: 10px; box-shadow: 0 4px 14px rgb(31 63 80 / 7%); }
.booking-record-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 15px 15px 11px; background: #fff; }
.booking-record-head > div { min-width: 0; }
.record-kicker { display: block; margin-bottom: 4px; color: #9aa9b2; font-size: 10px; letter-spacing: .5px; }
.booking-record-head h3 { overflow: hidden; margin: 0; color: #203d4e; font-size: 16px; font-weight: 650; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.booking-record-head .status { flex: 0 0 auto; padding: 5px 9px; font-size: 11px; font-weight: 600; }
.booking-record-head .status-pending { color: #a16b1d; background: #fff5df; }
.booking-record-head .status-completed { color: #197654; background: #e8f7ef; }
.booking-record-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 15px; color: #81939e; background: #f8fbfc; border-top: 1px solid #eef2f4; border-bottom: 1px solid #eef2f4; font-size: 11px; }
.booking-record-meta span, .booking-record-meta time { display: inline-flex; min-width: 0; align-items: center; gap: 4px; }
.booking-record-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booking-record-meta b { overflow: hidden; color: #476372; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; font-weight: 600; text-overflow: ellipsis; }
.booking-record-meta .native-icon { color: #3988b6; font-size: 14px; }
.booking-details { margin: 12px 15px 14px; padding: 12px; background: #f7fafb; border: 1px solid #e7eef1; border-radius: 8px; }
.booking-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.booking-section-title strong { color: #365767; font-size: 13px; }
.booking-section-title span { color: #9aa8af; font-size: 10px; }
.booking-details dl { display: grid; gap: 0; margin: 0; }
.booking-details dl > div { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 8px; padding: 7px 0; border-top: 1px solid #e8eef0; }
.booking-details dt { color: #8799a2; font-size: 11px; }
.booking-details dd { min-width: 0; margin: 0; color: #3e5967; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.staff-replies { margin: 0 15px 15px; padding-top: 2px; }
.staff-replies-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.staff-replies-heading strong { color: #365767; font-size: 13px; }
.staff-replies-heading span { color: #94a3ab; font-size: 11px; }
.staff-reply { margin-top: 7px; padding: 11px 12px; background: #eff7fb; border: 1px solid #d9ebf4; border-left: 3px solid #2b88bd; border-radius: 7px; }
.staff-reply-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.staff-reply-head strong { color: #2875a1; font-size: 12px; }
.staff-reply-head time { color: #91a1aa; font-size: 10px; }
.staff-reply p { margin: 7px 0 0; color: #3d5967; font-size: 13px; line-height: 1.65; }
.staff-reply-empty { color: #82949d !important; font-size: 12px !important; }
.staff-reply-images { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.staff-reply-image { display: block; width: 78px; height: 60px; margin: 0; object-fit: cover; border: 1px solid #cfe2eb; border-radius: 5px; background: #fff; }
.staff-reply-image.is-previewable { cursor: zoom-in; }
.staff-reply-pending { margin: 0 15px 15px; padding: 12px; color: #84959e; background: #fafcfc; border: 1px dashed #d9e5e9; border-radius: 7px; text-align: center; }
.records-empty { display: grid; justify-items: center; padding: 52px 20px; color: #778b95; background: #fff; border: 1px solid #e2eaee; border-radius: 10px; text-align: center; }
.records-empty > span { color: #6ba7c8; font-size: 34px; }
.records-empty h3 { margin: 10px 0 5px; color: #365565; font-size: 16px; }
.records-empty p { max-width: 280px; margin: 0; color: #8a9aa2; font-size: 12px; line-height: 1.6; }
@media (max-width: 360px) {
  .booking-record-meta { align-items: flex-start; flex-direction: column; gap: 5px; }
  .booking-record-head h3 { font-size: 15px; }
  .booking-details dl > div { grid-template-columns: 62px minmax(0, 1fr); }
}

/* Service detail sheets use a clearer reading hierarchy and an intentional action area. */
.sheet-backdrop { background: rgb(19 31 41 / 58%); backdrop-filter: blur(2px); }
.bottom-sheet { display: flex; width: min(calc(100% - 24px), 430px); max-height: min(80vh, 680px); flex-direction: column; overflow: hidden; padding: 10px 0 0; border: 1px solid rgb(255 255 255 / 76%); border-bottom: 0; border-radius: 16px 16px 0 0; box-shadow: 0 -12px 36px rgb(15 31 43 / 22%); }
.sheet-handle { display: block; width: 34px; height: 4px; margin: 0 auto 13px; flex: 0 0 auto; background: #d8e0e5; border-radius: 999px; }
.sheet-header { position: relative; display: block; flex: 0 0 auto; min-height: 49px; margin: 0; padding: 0 62px 15px 18px; }
.sheet-header > div { min-width: 0; }
.sheet-header h2 { color: #1d303b; font-size: 19px; font-weight: 650; line-height: 1.35; }
.sheet-header p { margin-top: 4px; color: #7f909a; font-size: 12px; line-height: 1.4; }
.sheet-header > button { position: absolute; top: 0; right: 18px; display: grid; width: 34px; height: 34px; place-items: center; color: #6f818c; background: #f4f7f8; border: 1px solid #e7edef; border-radius: 50%; font-size: 20px; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.sheet-header > button:hover { color: var(--airport-blue); background: #eaf4fb; }
.sheet-header > button:active { transform: scale(.94); }
.sheet-content { min-width: 0; min-height: 0; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 0 18px 18px; -webkit-overflow-scrolling: touch; }
.detail-copy, .sheet-content p { margin: 0; color: #5f727d; font-size: 14px; line-height: 1.75; }
.detail-copy { padding: 13px 14px; background: #f6f9fa; border: 1px solid #e8eef0; border-radius: 8px; }
.content-detail > p:not(:empty) { margin-bottom: 12px; padding: 11px 13px; color: #58707c; background: #eff7fb; border-left: 3px solid var(--airport-blue); border-radius: 4px; }
.content-detail { min-width: 0; padding: 1px 0; }.content-body { overflow-wrap: anywhere; color: #40545f; font-size: 14px; line-height: 1.8; }
.content-body p,.content-body h1,.content-body h2,.content-body h3,.content-body h4,.content-body ul,.content-body ol,.content-body blockquote { margin: 0 0 12px; }
.content-body ul,.content-body ol { padding-left: 20px; }
.content-body h1,.content-body h2,.content-body h3,.content-body h4 { color: var(--airport-ink); line-height: 1.45; }
.content-body img { display: block; max-width: 100%; height: auto; margin: 12px 0; border-radius: 6px; }
.content-body a { color: var(--airport-blue); text-decoration: underline; }
.content-body blockquote { padding: 9px 11px; color: var(--airport-muted); background: var(--airport-blue-soft); border-left: 3px solid var(--airport-blue); border-radius: 4px; }
.content-body code { padding: 1px 4px; color: #28536c; background: #edf3f6; border-radius: 3px; font-family: ui-monospace,SFMono-Regular,Consolas,monospace; font-size: .9em; }
.content-detail img { margin-bottom: 13px; border: 1px solid #e8eef0; border-radius: 8px; }
.content-detail img { width: auto; max-width: 100%; height: auto; max-height: none; object-fit: initial; }
.content-detail img { cursor: zoom-in; }
.image-preview { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 16px; }
.image-preview-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; background: rgb(9 20 28 / 82%); }
.image-preview-panel { position: relative; z-index: 1; display: flex; width: min(100%, 760px); max-height: calc(100vh - 32px); flex-direction: column; overflow: hidden; background: #162933; border-radius: 12px; box-shadow: 0 16px 45px rgb(0 0 0 / 35%); }
.image-preview-toolbar { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px 8px 14px; color: #e8f5fb; font-size: 13px; }
.image-preview-toolbar > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.image-preview-toolbar > div { display: flex; align-items: center; gap: 6px; }.image-preview-toolbar button { display: grid; width: 31px; height: 31px; place-items: center; color: #e8f5fb; background: #ffffff19; border: 1px solid #ffffff2b; border-radius: 7px; font-size: 17px; }.image-preview-toolbar button[data-image-preview="reset"] { width: auto; padding: 0 9px; font-size: 12px; }.image-preview-toolbar output { min-width: 39px; color: #b9d4df; font-size: 11px; text-align: center; }
.image-preview-stage { display: grid; min-height: 0; place-items: center; overflow: auto; padding: 12px; background: #0c1b22; }.image-preview-stage img { display: block; max-width: 100%; max-height: calc(100vh - 104px); transform-origin: center; transition: transform .16s ease; }
@media (max-width: 430px) { .image-preview { padding: 0; }.image-preview-panel { width: 100%; max-height: 100vh; border-radius: 0; }.image-preview-toolbar { padding-left: 12px; }.image-preview-stage { padding: 8px; }.image-preview-stage img { max-height: calc(100vh - 65px); } }

/* The base form label rule also matches the stepper's span, so restore its horizontal layout. */
.booking-page .form-field > .stepper { display: inline-flex; width: 128px; height: 32px; align-items: center; justify-content: flex-end; margin: 0 0 0 auto; color: inherit; font-size: inherit; }
.booking-page .stepper input { display: block; height: 28px; margin: 0; padding: 0 !important; line-height: 28px; }
.sheet-actions { z-index: 1; flex: 0 0 auto; gap: 10px; margin: 0; padding: 15px 18px calc(18px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #edf1f3; box-shadow: 0 -6px 14px rgb(25 48 61 / 5%); }
.sheet-actions .btn { min-height: 42px; border-radius: 7px; font-weight: 600; box-shadow: 0 3px 8px rgb(20 116 190 / 18%); }
.sheet-actions .btn:only-child { grid-column: 1 / -1; }
.sheet-actions .btn .native-icon { margin-left: 3px; vertical-align: -1px; }

.phone-service-card { display: flex; align-items: center; gap: 13px; padding: 16px; background: linear-gradient(135deg, #edf8ff, #f7fbfd); border: 1px solid #d8ebf7; border-radius: 12px; }
.phone-service-icon { display: grid; width: 44px; height: 44px; place-items: center; flex: 0 0 44px; color: #1474be; background: #fff; border: 1px solid #d9ebf7; border-radius: 50%; font-size: 23px; box-shadow: 0 3px 10px rgb(20 116 190 / 12%); }
.phone-service-copy { display: grid; min-width: 0; gap: 3px; }
.phone-service-copy span, .phone-service-copy small { color: #78909d; font-size: 12px; }
.phone-service-copy strong { color: #123d59; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 20px; letter-spacing: .3px; line-height: 1.2; }
.phone-service-call { display: flex !important; align-items: center; justify-content: center; gap: 8px; background: linear-gradient(135deg, #1474be, #0d8bd1); box-shadow: 0 6px 14px rgb(20 116 190 / 26%); }
.phone-service-call .native-icon { margin: 0 !important; font-size: 18px; }
@media (min-width: 431px) { .bottom-sheet { left: 50%; right: auto; transform: translateX(-50%); } }

.member-page { padding-bottom: 90px; }
.member-hero { display: flex; align-items: center; gap: 12px; margin: 0 -14px; padding: 24px 20px 20px; color: #fff; background: #1474be; }
.member-level-mark { display: grid; width: 48px; height: 48px; place-items: center; flex: 0 0 48px; color: #1a79b5; background: #fff; border-radius: 50%; font-size: 27px; }
.member-hero p { margin: 0 0 3px; color: #d9eef9; font-size: 12px; }.member-hero h2 { margin: 0; font-size: 21px; font-weight: 600; }.member-hero > strong { margin-left: auto; font-size: 24px; }.member-hero > strong small { display: block; color: #d9eef9; font-size: 11px; font-weight: 400; text-align: right; }
.member-progress { margin: 0 -14px 14px; padding: 13px 20px 16px; background: #fff; }.member-progress-label { display: flex; justify-content: space-between; gap: 10px; color: #748690; font-size: 12px; }.member-progress-track { height: 7px; margin-top: 9px; overflow: hidden; background: #e5eef3; border-radius: 6px; }.member-progress-track i { display: block; height: 100%; background: #2e92c7; border-radius: inherit; }
.member-section { margin-top: 12px; padding: 15px; background: #fff; border: 1px solid #edf1f3; border-radius: 8px; }.member-section-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }.member-section-title h3 { margin: 0; font-size: 16px; font-weight: 600; }.member-section-title span { color: #8a99a1; font-size: 11px; }.benefit-list { display: grid; gap: 9px; color: #526974; font-size: 13px; }.benefit-list div { display: flex; align-items: center; gap: 7px; }.benefit-list .native-icon { color: #24905d; }
.member-task-list { display: grid; gap: 3px; }.member-task { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid #f0f3f5; }.member-task:last-child { border-bottom: 0; }.member-task > div:first-child { min-width: 0; }.member-task strong { font-size: 14px; font-weight: 500; }.member-task p { margin: 4px 0 0; color: #84949d; font-size: 12px; line-height: 1.45; }.member-task-action { display: flex; min-width: 54px; flex-direction: column; align-items: flex-end; gap: 5px; }.member-task-action b { color: #dd7e31; font-size: 14px; }.btn.small { min-height: 30px; padding: 4px 12px; font-size: 12px; }.task-done { color: #24905d; font-size: 12px; }.task-pending { color: #d18a22; font-size: 12px; }.task-auto { max-width: 80px; color: #86979f; font-size: 11px; line-height: 1.35; text-align: right; }
.growth-ledger { display: grid; gap: 0; }.growth-ledger > div { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 10px 0; border-bottom: 1px solid #f0f3f5; }.growth-ledger > div:last-child { border-bottom: 0; }.growth-ledger span { color: #526974; font-size: 13px; }.growth-ledger b { color: #24905d; font-size: 14px; }.growth-ledger small { grid-column: 1 / -1; color: #9aa7ad; font-size: 11px; }
.member-hero h2 + small { display: block; margin-top: 4px; color: #d9eef9; font-size: 11px; }.member-link { padding: 0; color: var(--airport-blue); background: transparent; font-size: 12px; }.benefit-list div { align-items: flex-start; }.benefit-list > div > span { display: grid; width: 25px; height: 25px; place-items: center; flex: 0 0 25px; color: #1777b4; background: #eaf5fb; border-radius: 50%; }.benefit-list p { display: grid; gap: 3px; margin: 0; }.benefit-list strong { color: #425761; font-size: 13px; font-weight: 600; }.benefit-list small { color: #87969e; font-size: 11px; line-height: 1.45; }
.member-page { padding: 0 14px calc(92px + env(safe-area-inset-bottom)); background: #f4f7f9; }.member-page .topbar { margin: 0 -14px; background: #fff; }.member-hero { position: relative; min-height: 88px; gap: 11px; margin: 0 -14px; padding: 18px 20px; overflow: hidden; background: linear-gradient(105deg, #1478bd, #2498cc); box-shadow: 0 7px 17px #1474be24; }.member-hero::before { position: absolute; width: 118px; height: 118px; right: -55px; top: -59px; border: 1px solid #ffffff30; border-radius: 50%; content: ''; }.member-hero > * { position: relative; z-index: 1; }.member-level-mark { width: 43px; height: 43px; flex-basis: 43px; color: #1478b7; border-radius: 14px; box-shadow: 0 4px 11px #0b4a7729; font-size: 23px; }.member-identity { min-width: 0; }.member-hero p { margin: 0 0 3px; color: #e7f5fc; font-size: 11px; }.member-hero h2 { font-size: 19px; letter-spacing: .1px; text-shadow: 0 1px 1px #0a4d7c44; }.member-hero > strong { min-width: 50px; padding-bottom: 1px; font-size: 23px; text-shadow: 0 1px 1px #0a4d7c44; }.member-progress { margin: 0 -14px 16px; padding: 13px 20px 15px; border-radius: 0 0 18px 18px; box-shadow: 0 6px 18px #27475a12; }.member-progress-label { font-size: 12px; }.member-progress-label span:last-child { color: #2780b9; }.member-progress-track { height: 8px; margin-top: 9px; background: #e2edf3; }.member-progress-track i { background: linear-gradient(90deg, #1684c8, #51b6af); box-shadow: 0 2px 6px #167fc466; }
.member-section, .ticket-claim-card { margin-top: 13px; padding: 17px 16px; border: 0; border-radius: 13px; box-shadow: 0 5px 16px #183b5010; }.member-section-title { margin-bottom: 14px; }.member-section-title > div { display: grid; gap: 3px; }.member-section-title > div small { color: #9aaab4; font-size: 9px; font-weight: 700; letter-spacing: .8px; }.member-section-title h3 { color: #183342; font-size: 17px; }.member-link { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; }.member-link .native-icon { font-size: 14px; }.benefit-list { gap: 12px; }.benefit-list > div > span { width: 30px; height: 30px; flex-basis: 30px; color: #1880be; background: #e8f5fb; }.benefit-list strong { color: #244353; font-size: 14px; }.benefit-list small { font-size: 12px; }
.ticket-claim-card { padding: 0; overflow: hidden; background: #fff; border: 1px solid #dcebf2; box-shadow: 0 9px 22px #1172b71a; }.ticket-claim-heading { display: flex; align-items: center; gap: 10px; padding: 16px; color: #fff; background: linear-gradient(110deg, #136fb7, #2493ca); }.ticket-claim-icon { display: grid; width: 38px; height: 38px; place-items: center; flex: 0 0 38px; color: #177cb9; background: #fff; border-radius: 12px; font-size: 20px; }.ticket-claim-heading div { min-width: 0; flex: 1; }.ticket-claim-heading p { margin: 0 0 3px; color: #d8f0ff; font-size: 11px; }.ticket-claim-heading h3 { margin: 0; font-size: 17px; }.ticket-claim-heading > b { display: grid; justify-items: end; color: #fff; font-size: 19px; }.ticket-claim-heading > b small { color: #d8f0ff; font-size: 10px; font-weight: 400; }.ticket-claim-form { padding: 16px; }.ticket-claim-copy { margin: 0 0 14px; color: #607a87; font-size: 12px; line-height: 1.6; }.ticket-input-grid { display: grid; grid-template-columns: 1fr; gap: 11px; }.ticket-input-grid label { display: grid; gap: 6px; min-width: 0; }.ticket-input-grid span { color: #2b4a5b; font-size: 12px; font-weight: 600; }.ticket-input-grid input { width: 100%; min-width: 0; padding: 11px 10px; color: #1d3b4c; background: #f5f9fb; border: 1px solid #dce8ee; border-radius: 8px; outline: 0; font-size: 13px; }.ticket-input-grid input:focus { background: #fff; border-color: #1c8aca; box-shadow: 0 0 0 3px #1685c51c; }.ticket-security-tip { display: flex; align-items: flex-start; gap: 5px; margin: 12px 0 13px; color: #81959f; font-size: 11px; line-height: 1.5; }.ticket-security-tip .native-icon { margin-top: 1px; color: #319267; font-size: 14px; }.ticket-claim-form .form-error { margin: -5px 0 8px; }.ticket-submit { display: inline-flex; width: 100%; min-height: 43px; align-items: center; justify-content: center; gap: 4px; border-radius: 9px; background: linear-gradient(90deg, #126fb5, #278ec3); box-shadow: 0 6px 12px #1675b42e; font-weight: 600; }.ticket-claim-awaiting { display: flex; align-items: flex-start; gap: 10px; padding: 17px 16px; color: #8a641c; background: #fffaf0; }.ticket-claim-awaiting > span { display: grid; width: 30px; height: 30px; place-items: center; flex: 0 0 30px; color: #bb8424; background: #fff1d3; border-radius: 50%; }.ticket-claim-awaiting strong { display: block; color: #76531d; font-size: 13px; }.ticket-claim-awaiting p { margin: 4px 0 0; color: #9b7b48; font-size: 11px; line-height: 1.5; }.member-ledger-section { margin-top: 14px; }.growth-ledger > div { padding: 12px 0; }.growth-ledger > div:first-child { padding-top: 0; }.growth-ledger span { color: #405c6b; }.growth-ledger b { color: #0b9870; }
.ticket-deadline-tip { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 14px; padding: 10px 11px; color: #965a16; background: #fff7e9; border: 1px solid #f5d9a5; border-radius: 8px; }.ticket-deadline-tip > span { display: grid; width: 18px; height: 18px; place-items: center; flex: 0 0 18px; color: #d2871a; font-size: 16px; }.ticket-deadline-tip p { margin: 0; font-size: 11px; line-height: 1.55; }.ticket-deadline-tip strong { display: block; margin-bottom: 2px; color: #9d5d12; font-size: 12px; }.flight-record-section { margin-top: 14px; }.flight-record-list { display: grid; gap: 0; }.flight-record { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 10px; padding: 12px 0; border-bottom: 1px solid #edf2f4; }.flight-record:last-child { padding-bottom: 0; border-bottom: 0; }.flight-record-main { display: grid; gap: 3px; min-width: 0; }.flight-record-main strong { color: #365161; font-size: 13px; }.flight-record-main span { color: #7e929c; font-size: 12px; letter-spacing: 1px; }.flight-record-main small { color: #a1afb5; font-size: 10px; }.flight-record-status { display: grid; justify-items: end; align-content: start; gap: 4px; white-space: nowrap; }.flight-record-status b { font-size: 12px; }.flight-record-status small { color: #8799a1; font-size: 10px; }.flight-record.approved .flight-record-status b { color: #15926b; }.flight-record.rejected .flight-record-status b { color: #c55b4e; }.flight-record.pending .flight-record-status b { color: #c38424; }.flight-reject-reason { grid-column: 1 / -1; margin: 1px 0 0; padding: 7px 9px; color: #ad5d53; background: #fff5f3; border-radius: 6px; font-size: 11px; line-height: 1.5; }
@media (max-width: 360px) { .ticket-input-grid { grid-template-columns: 1fr; gap: 11px; }.ticket-claim-heading { padding: 14px; }.ticket-claim-form { padding: 14px; } }
.member-levels-page { padding-bottom: 86px; }.level-page-intro { display: flex; gap: 12px; margin: 0 -14px 14px; padding: 20px 18px; color: #fff; background: linear-gradient(135deg, #1474be, #4aa286); }.level-page-intro > span { display: grid; width: 42px; height: 42px; place-items: center; flex: 0 0 42px; color: #1d7eaf; background: #fff; border-radius: 50%; font-size: 23px; }.level-page-intro h2 { margin: 0; font-size: 18px; }.level-page-intro p { margin: 5px 0 0; color: #e3f3ed; font-size: 12px; line-height: 1.55; }.level-card-list { display: grid; gap: 12px; }.level-benefit-card { overflow: hidden; background: #fff; border: 1px solid #e7edf0; border-radius: 9px; }.level-benefit-card > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; background: #f3f8fa; }.level-code { color: #176b9e; font-size: 15px; font-weight: 650; }.level-benefit-card > div > strong { color: #74858d; font-size: 12px; font-weight: 500; }.level-benefit-card ul { display: grid; gap: 10px; margin: 0; padding: 13px 14px; list-style: none; }.level-benefit-card li { display: flex; align-items: flex-start; gap: 9px; }.level-benefit-card li > span { display: grid; width: 25px; height: 25px; place-items: center; flex: 0 0 25px; color: #1777b4; background: #eaf5fb; border-radius: 50%; }.level-benefit-card li p { display: grid; gap: 3px; margin: 0; }.level-benefit-card li b { color: #40525b; font-size: 13px; }.level-benefit-card li small { color: #81929b; font-size: 11px; line-height: 1.45; }.wechat-login { display: inline-flex; width: 100%; justify-content: center; gap: 5px; color: #25956c; }

.auth-wechat-guide { padding: 12px 2px 4px; text-align: center; }.auth-wechat-icon, .auth-loading-icon { color: #07c160; font-size: 42px; }.auth-wechat-guide p, .auth-loading p { margin: 8px 0 16px; color: var(--airport-muted); font-size: 13px; line-height: 1.7; }.auth-loading { text-align: center; }