/* HS_RESTORE_HOME_UI_1: presentation only, shared by web and native builds. */
:root {
  --hs-ui-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  --hs-ui-ink: #182238;
  --hs-ui-muted: #58667c;
  --hs-ui-line: #e5e9f1;
  --hs-ui-purple: #6843cd;
  --hs-ui-shadow: 0 4px 16px -8px rgb(30 41 68 / 14%);
}
.app-view { font-family: var(--hs-ui-font); color: var(--hs-ui-ink); }
.app-view :is(h1,h2,h3,h4,button,input,select,textarea) { font-family: var(--hs-ui-font); }
dialog :is(h1,h2,h3,h4,button,input,select,textarea) { font-family: var(--hs-ui-font); }
dialog :is(h2,h3,h4) { font-weight: 700; }
.topbar { border-bottom-color: var(--hs-ui-line); }
.topbar h1 { font-size: 24px; font-weight: 750; letter-spacing: -.65px; }

/* Restore the familiar hero and three full-width destinations. */
#tab-home.hs-home-restored { --hs-home-inset: 16px; padding-top: 1px; }
#tab-home .home-hero-premium {
  min-height: 0;
  margin: 15px var(--hs-home-inset) 24px;
  padding: 22px;
  border: 1px solid #ffffff14;
  border-radius: 24px;
  background: linear-gradient(120deg, #142345 0%, #252857 62%, #49367c 100%);
  box-shadow: 0 8px 24px -14px #25285766;
}
#tab-home .home-hero-copy { max-width: none; }
#tab-home .home-hero-premium::before { opacity: .48; }
#tab-home .home-hero-glow { opacity: .35; }
#tab-home .home-hero-premium .live-dot { font-size: 10px; font-weight: 650; letter-spacing: .13em; color: #d5e8fc; }
#tab-home .live-dot span { width: 6px; height: 6px; box-shadow: 0 0 0 4px #34d3991f; }
#tab-home .home-hero-premium h2 {
  max-width: 100%; margin: 14px 0 8px; color: #fff;
  font-size: 28px; line-height: 1.14; font-weight: 720; letter-spacing: -.8px;
  overflow-wrap: anywhere; text-wrap: pretty;
}
#tab-home .home-hero-premium p { max-width: 360px; font-size: 13px; line-height: 1.55; color: #e0e6f3; }
#tab-home .hero-community-portraits { width: 158px; height: 40px; margin: 15px 0 0; }
#tab-home .hero-community-avatar { width: 34px; height: 34px; top: 3px; border-width: 2px; box-shadow: 0 3px 10px #101a3729; }
#tab-home .hero-avatar-one { left: 0; }
#tab-home .hero-avatar-two { left: 46px; top: 0; }
#tab-home .hero-avatar-three { left: 92px; top: 4px; }
#tab-home .hero-community-route { top: 19px; left: 20px; right: 25px; opacity: .7; }
#tab-home .hero-community-pin { width: 23px; height: 23px; top: 2px; right: 0; border-radius: 8px; }
#tab-home .home-skyline { width: 155px; height: 87px; right: 14px; opacity: .2; }
#tab-home .home-section-intro { align-items: center; padding: 0 var(--hs-home-inset) 13px; gap: 10px; }
#tab-home .home-section-intro > div:first-child { min-width: 0; }
#tab-home .home-section-intro span { font-size: 9px; line-height: 14px; font-weight: 700; color: var(--hs-ui-purple); letter-spacing: .12em; }
#tab-home .home-section-intro h3 { margin: 4px 0 0; font: 700 20px/1.2 var(--hs-ui-font); letter-spacing: -.45px; }
#tab-home .home-city-chip { flex-shrink: 0; padding: 6px 8px; border-color: var(--hs-ui-line); background: #fff; color: #526179; font-size: 10px; font-weight: 600; box-shadow: none; }
#tab-home .home-three-card-stack { display: grid; grid-template-columns: minmax(0,1fr); gap: 11px; padding: 0 var(--hs-home-inset) 18px; }
#tab-home .home-three-card-stack .home-primary-card {
  --hs-card-accent: #6843cd;
  --hs-card-wash: #f1ecfd;
  display: grid; grid-template-columns: 44px minmax(0,1fr); grid-template-rows: auto auto;
  column-gap: 13px; row-gap: 0; grid-column: auto; min-height: 0;
  padding: 17px; border: 1px solid var(--hs-ui-line); border-radius: 20px;
  background: linear-gradient(115deg, #fff 64%, #faf8ff 100%);
  box-shadow: var(--hs-ui-shadow); text-align: left;
  animation: none; transition: border-color .16s ease, box-shadow .16s ease;
}
#tab-home .home-three-card-stack .meetups { --hs-card-accent: #087e84; --hs-card-wash: #e6f6f5; background: linear-gradient(115deg, #fff 64%, #f5fbfa 100%); }
#tab-home .home-three-card-stack .weekly { --hs-card-accent: #ac5923; --hs-card-wash: #fff0e2; background: linear-gradient(115deg, #fff 64%, #fffaf5 100%); }
#tab-home .home-primary-card::before, #tab-home .home-primary-card::after { display: none; }
#tab-home .home-primary-card .home-primary-icon {
  grid-column: 1; grid-row: 1; width: 44px; height: 44px; padding: 11px; margin: 0;
  border: 0; border-radius: 14px; background: var(--hs-card-wash)!important; color: var(--hs-card-accent); box-shadow: none!important;
}
#tab-home .home-primary-icon svg { width: 22px; height: 22px; }
#tab-home .home-primary-card .home-primary-copy { display: block; grid-column: 2; grid-row: 1; min-width: 0; padding: 0; }
#tab-home .home-primary-copy :is(small,strong,em) { display: block; grid-column: auto; grid-row: auto; }
#tab-home .home-primary-card .home-primary-copy small { font-size: 9px; line-height: 13px; letter-spacing: .11em; font-weight: 750; color: var(--hs-card-accent); }
#tab-home .home-primary-card .home-primary-copy strong { margin: 4px 0 0; font-family: var(--hs-ui-font); font-size: 20px; line-height: 1.2; font-weight: 720; letter-spacing: -.5px; color: var(--hs-ui-ink); text-wrap: pretty; }
#tab-home .home-primary-card .home-primary-copy em { margin: 7px 0 0; font-size: 13px; font-weight: 400; font-style: normal; line-height: 1.45; color: var(--hs-ui-muted); }
#tab-home .home-primary-card .home-primary-action {
  display: flex; grid-column: 2; grid-row: 2; align-self: auto; align-items: center; justify-content: space-between; gap: 10px;
  margin: 13px 0 0; padding: 0; min-height: 20px;
  font-size: 12px; font-weight: 650; line-height: 18px; color: var(--hs-ui-purple);
}
#tab-home .home-primary-card .home-primary-action b { display: block; width: auto; height: auto; border: 0; border-radius: 0; box-shadow: none; background: none; color: var(--hs-card-accent); font-size: 19px; line-height: 20px; font-weight: 500; }
#tab-home .home-primary-card:focus-visible { outline: 3px solid #a897e8; outline-offset: 3px; }
html.native-app #tab-home.hs-home-restored :is(.home-primary-card,.home-hero-premium) { animation: none; }
@media(hover:hover) { #tab-home .home-primary-card:hover { border-color: #bcb1df; box-shadow: 0 5px 20px -8px #30205c24; transform: none; } }

/* Keep the existing Shanghai illustration; bring it closer to the content. */
#tab-home .city-community-card { min-height: 152px; margin: 0 var(--hs-home-inset) 6px; border: 1px solid var(--hs-ui-line); border-radius: 20px; box-shadow: none; background: linear-gradient(125deg,#faf8ff,#f3fbfc 60%,#fffaf4); }
#tab-home .city-community-scene { opacity: .85; }
#tab-home .city-community-avatar { width: 46px; height: 46px; border-width: 2px; box-shadow: 0 5px 12px -5px #22324a38; }
#tab-home .city-person-one { left: 9%; top: 20%; }
#tab-home .city-person-two { left: 32%; top: 44%; }
#tab-home .city-person-three { right: 27%; top: 15%; }
#tab-home .city-person-four { right: 8%; top: 41%; }
#tab-home .city-community-location { width: 29px; height: 29px; right: 15%; bottom: 15%; border-width: 2px; border-radius: 10px; box-shadow: 0 4px 10px #6843cd22; }
#tab-home .city-flag { box-shadow: none; border-color: #e8edf3; }

/* Shared visual rhythm; do not touch routes, permissions or state classes. */
.bottom-nav { border-color: var(--hs-ui-line); box-shadow: 0 -4px 20px -12px #20304b26; }
.bottom-nav .nav-btn { font-family: var(--hs-ui-font); font-size: 10px; font-weight: 650; color: #626f83; border-radius: 14px; }
.bottom-nav .nav-btn.active { background: #f1ecfc; color: #6843cd; box-shadow: none; }
.bottom-nav .nav-icon { width: 23px; height: 23px; }
html.native-android .bottom-nav { border-radius: 22px; box-shadow: 0 6px 24px -12px #20304b38; }
/* The app-view already reserves the navigation/safe-area space. Avoid reserving it twice. */
.app-view .app-legal-footer { padding: 12px 16px 16px; gap: 0 4px; }
.app-view .app-legal-footer a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 7px; font-size: 11px; font-weight: 600; color: #59677c; }
.app-view .app-legal-footer small { font-size: 10px; line-height: 16px; color: #677489; }
html.native-app .app-view .app-legal-footer { padding-bottom: 16px; }

.discover-panel .discover-person-card, .meetup-card, .settings-list { border-color: var(--hs-ui-line); box-shadow: var(--hs-ui-shadow); border-radius: 20px; }
.discover-panel .discover-person-card { padding: 14px; }
.discover-panel .discover-person-card :is(.person-name,h3) { font-weight: 700; color: var(--hs-ui-ink); }
.discover-plus-strip { min-height: 68px; max-height: none; border: 1px solid #e3dcf4; border-radius: 16px; background: #f6f2fd; color: #30234b; box-shadow: none; }
.discover-plus-copy h4 { white-space: normal; font-weight: 650; }
.discover-plus-copy p { max-width: none; white-space: normal; color: #675778; }
.discover-plus-glow { display: none; }
.discover-plus-button { height: 44px; padding: 0 12px; border-color: #dacfee; color: #6843cd; background: #fff; border-radius: 12px; font-weight: 650; }
.meetups-hero { padding: 18px; border-radius: 24px; box-shadow: 0 8px 24px -14px #164e6366; }
.meetups-hero h2 { font-size: 22px; line-height: 1.2; font-weight: 700; letter-spacing: -.45px; }
.meetups-hero > div > span { font-weight: 650; }
.meetup-create-button { min-height: 44px; margin-top: 14px; padding: 10px 12px; border-radius: 12px; font-size: 13px; font-weight: 650; }
.meetup-card-body { padding: 14px 16px 16px; }
.meetup-facts { column-gap: 16px; row-gap: 8px; }
.meetup-fact { padding: 4px 0; border-radius: 0; background: transparent; min-width: 0; }
.meetup-fact b { font-size: 12px; line-height: 17px; }
.meetup-fact small { font-size: 11px; line-height: 16px; color: var(--hs-ui-muted); overflow-wrap: anywhere; }
.meetup-host-row { border-top: 1px solid #edf0f5; padding-top: 12px; }
.meetup-host-copy small { font-size: 11px; color: var(--hs-ui-muted); }
.meetup-card-action { min-height: 44px; font-size: 12px; font-weight: 700; border-radius: 12px; }
.meetup-detail-dialog, .profile-detail-dialog { border-radius: 24px; }
.meetup-detail-body { padding: 18px; }
.meetup-detail-body h2 { font-size: 24px; line-height: 1.2; letter-spacing: -.5px; font-weight: 700; }
.meetup-detail-grid { gap: 0 16px; margin: 16px 0; }
.meetup-detail-info { padding: 10px 0; border-radius: 0; border-bottom: 1px solid var(--hs-ui-line); background: none; min-width: 0; }
.meetup-detail-info span { font-size: 10px; font-weight: 650; color: var(--hs-ui-muted); }
.meetup-detail-info b { font-size: 13px; line-height: 19px; font-weight: 600; overflow-wrap: anywhere; }
.meetup-address-card { border-color: #ddeeea; background: #f1f9f7; border-radius: 14px; }
.meetup-detail-close, .city-week-detail-close, .dialog-close-inline { min-width: 44px; min-height: 44px; }
.city-week-event-title { border-radius: 16px; box-shadow: var(--hs-ui-shadow); }
.city-week-event-title strong { font-size: 15px; font-weight: 700; }
.city-week-detail-row { min-height: 0; padding: 10px 0; border: 0; border-bottom: 1px solid var(--hs-ui-line); border-radius: 0; background: none; }
.city-week-detail-row small { font-size: 10px; font-weight: 650; color: var(--hs-ui-muted); }
.city-week-detail-row strong { font-size: 13px; line-height: 19px; font-weight: 600; }
.profile-settings-section .settings-heading h3 { font: 700 18px/1.25 var(--hs-ui-font); letter-spacing: -.25px; }
.profile-edit-section { box-shadow: none; border-color: var(--hs-ui-line); border-radius: 18px; }
.profile-edit-section summary { min-height: 68px; padding: 13px 15px; }
.profile-section-copy small { font-size: 9px; font-weight: 650; }
.profile-section-copy strong { font-weight: 650; }
.profile-section-copy em { font-size: 12px; line-height: 17px; white-space: normal; color: var(--hs-ui-muted); }
.profile-form label { font-weight: 600; }
.profile-form :is(input,select,textarea) { font-weight: 400; border-radius: 12px; }
.settings-list .settings-row { min-height: 64px; padding: 12px 14px; }
.settings-list .settings-icon { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 11px; }
.settings-list .settings-copy small { font-size: 12px; line-height: 17px; color: var(--hs-ui-muted); }
.settings-list .settings-copy b { font-weight: 650; }
.app-view .empty-state { padding: 36px 24px; }
.app-view .empty-state p { font-size: 13px; line-height: 1.55; color: var(--hs-ui-muted); }
@media(min-width:600px) {
  #tab-home.hs-home-restored { --hs-home-inset: 20px; }
  #tab-home .home-hero-premium { padding: 24px; }
  #tab-home .home-three-card-stack .home-primary-card { padding: 18px 20px; }
  #tab-home .city-community-card { min-height: 164px; }
}
@media(max-width:350px) {
  #tab-home.hs-home-restored { --hs-home-inset: 12px; }
  #tab-home .home-hero-premium { padding: 19px; }
  #tab-home .home-hero-premium h2 { font-size: 25px; }
  #tab-home .home-three-card-stack .home-primary-card { padding: 15px; column-gap: 11px; }
  #tab-home .home-primary-card .home-primary-copy strong { font-size: 18px; }
  #tab-home .home-section-intro h3 { font-size: 18px; }
  #tab-home .home-city-chip { font-size: 9px; padding: 5px 7px; }
  #tab-home .city-community-avatar { width: 40px; height: 40px; }
}
@media(prefers-reduced-motion:reduce) { #tab-home .home-primary-card { animation: none!important; transition: none; } }
