/* Original light SVG icon system. Background images are decorative; visible
   text and accessible names remain the source of each control's meaning. */
[data-icon] { --ui-icon: url('/assets/icons/compass.svg'); }
[data-icon="compass"] { --ui-icon: url('/assets/icons/compass.svg'); }
[data-icon="search"] { --ui-icon: url('/assets/icons/search.svg'); }
[data-icon="users"] { --ui-icon: url('/assets/icons/users.svg'); }
[data-icon="envelope"] { --ui-icon: url('/assets/icons/envelope.svg'); }
[data-icon="shield"] { --ui-icon: url('/assets/icons/shield.svg'); }
[data-icon="heart"] { --ui-icon: url('/assets/icons/heart.svg'); }
[data-icon="question"] { --ui-icon: url('/assets/icons/question.svg'); }
[data-icon="scale"] { --ui-icon: url('/assets/icons/scale.svg'); }
[data-icon="globe"] { --ui-icon: url('/assets/icons/globe.svg'); }
[data-icon="suitcase"] { --ui-icon: url('/assets/icons/suitcase.svg'); }
[data-icon="pin"] { --ui-icon: url('/assets/icons/pin.svg'); }
[data-icon="plus"] { --ui-icon: url('/assets/icons/plus.svg'); }
[data-icon="calendar"] { --ui-icon: url('/assets/icons/calendar.svg'); }
[data-icon="home"] { --ui-icon: url('/assets/icons/home.svg'); }
[data-icon="key"] { --ui-icon: url('/assets/icons/key.svg'); }
[data-icon="arrow"] { --ui-icon: url('/assets/icons/arrow.svg'); }
[data-icon="edit"] { --ui-icon: url('/assets/icons/edit.svg'); }
[data-icon="trash"] { --ui-icon: url('/assets/icons/trash.svg'); }
[data-icon="restore"] { --ui-icon: url('/assets/icons/restore.svg'); }
[data-icon="close"] { --ui-icon: url('/assets/icons/close.svg'); }
[data-icon="settings"] { --ui-icon: url('/assets/icons/settings.svg'); }
[data-icon="check"] { --ui-icon: url('/assets/icons/check.svg'); }
[data-icon="download"] { --ui-icon: url('/assets/icons/download.svg'); }
[data-icon="lock"] { --ui-icon: url('/assets/icons/lock.svg'); }
[data-icon="send"] { --ui-icon: url('/assets/icons/send.svg'); }
[data-icon="flag"] { --ui-icon: url('/assets/icons/flag.svg'); }
[data-icon="coffee"] { --ui-icon: url('/assets/icons/coffee.svg'); }
[data-icon="passport"] { --ui-icon: url('/assets/icons/passport.svg'); }
[data-icon="refresh"] { --ui-icon: url('/assets/icons/refresh.svg'); }
[data-icon="logout"] { --ui-icon: url('/assets/icons/logout.svg'); }
[data-icon="language"] { --ui-icon: url('/assets/icons/language.svg'); }
[data-icon]::before,
form button[type="submit"]::before {
  content: "";
  display: inline-block;
  flex: 0 0 auto;
  width: var(--icon-size, 24px);
  height: var(--icon-size, 24px);
  background: var(--ui-icon, url('/assets/icons/check.svg')) center / contain no-repeat;
  vertical-align: middle;
  pointer-events: none;
}
[data-icon]:not(.section-emblem), form button[type="submit"] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
button, a { touch-action: manipulation; }
.topbar {
  height: 76px;
  min-height: 76px;
  background: #fff;
  border-bottom: 1px solid #ece9e5;
  box-shadow: 0 2px 8px #25252504;
}
.topbar-inner { padding: 0 20px; max-width: 1180px; }
.brand { gap: 0; min-width: 0; }
.brand picture { display: block; }
.brand-logo { display: block; width: 320px; height: auto; }
.header-actions { gap: 10px; }
.round-button {
  width: 46px;
  height: 46px;
  padding: 8px;
  background: #fff7ef;
  border: 1px solid #fff0e3;
  box-shadow: none;
  transition: transform .18s ease, box-shadow .18s ease;
}
.round-button .icon, .round-button .wide-icon { width: 30px; height: 30px; filter: none; }
.round-button:hover { background: #ffead6; transform: translateY(-1px); box-shadow: none; }
.profile-button { min-height: 46px; background: #fff; color: #292929; border: 1px solid #e6e2df; }
.profile-button:hover { background: #fff5ec; }
.avatar-initial { background: #ffe5cf; color: #723a15; border-color: transparent; }
.dropdown { border: 1px solid #ded9c9; border-radius: 12px; box-shadow: 0 12px 36px #142a2730; padding: 7px; }
.dropdown a { border-radius: 6px; }
.dropdown a:hover { background: #fff2e6; color: #a94900; }
.dropdown a::before { width: 23px; height: 23px; }
.dropdown a[data-icon] { display: flex; }
.notice-wrap { max-width: 1140px; padding: 18px 20px; }
.notice { min-height: 0; background: #fff6e9; border-color: #f6e5cb; border-radius: 12px; padding: 14px 50px 15px 20px; color: #64533f; box-shadow: none; }
.notice strong { font: 700 16px Signika, sans-serif; --icon-size: 26px; }
.notice p { margin: 5px 0 0 34px; font-size: 13px; line-height: 1.6; }
.notice-close { opacity: .8; padding: 4px; top: 12px; right: 12px; width: 32px; height: 32px; }
.notice-close:hover { opacity: 1; }
body { background: #fff; color: #292929; }
.trips-main {
  background: #faf9f6;
  color: #292929;
  padding-bottom: 80px;
  border-top: 1px solid #f0eeea;
}
.trips-wrapper { max-width: 1040px; }
.trip-tabs { gap: 28px; padding: 24px 0 28px; font-size: 15px; letter-spacing: .03em; }
.trip-tabs a { padding: 7px 2px 12px; gap: 9px; color: #565656; --icon-size: 25px; }
.trip-tabs a.active::before { position: static; width: 30px; height: 30px; background: var(--ui-icon) center / contain no-repeat; }
.trip-tabs a.active { color: #a94900; border-bottom: 3px solid #ff8000; }
.trip-tabs a:hover { color: #a94900; }
.trip-tabs a:not(.active) { border-bottom: 2px solid transparent; }
.surface, .member-card, .trip-card {
  background: #fff;
  border: 1px solid #ebe6e0;
  border-radius: 16px;
  box-shadow: 0 4px 16px #33241806;
}
.surface { padding: 32px; }
.surface h1, .surface h2 { color: #252525; }
.surface h1[data-icon], .view-heading[data-icon] { --icon-size: 40px; gap: 12px; }
.surface h2[data-icon] { --icon-size: 29px; }
.view-heading { font-size: 32px; letter-spacing: -.5px; }
.primary-button, .surface .primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  border-radius: 9px;
  padding: 11px 19px;
  line-height: 1.3;
  box-shadow: none;
  transition: box-shadow .18s ease, transform .18s ease;
}
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 3px 8px #ff800018; }
.secondary-button { background: #fff; border-color: #d9d5d0; border-radius: 9px; line-height: 1.35; }
.secondary-button:hover { background: #fff2e6; }
.danger-button { border-radius: 9px; }
.primary-button[data-icon]::before, form button[type="submit"]::before { width: 25px; height: 25px; }
.surface input:not([type="checkbox"]), .surface textarea, .surface select,
.search-form input, .search-form select { border-radius: 9px; border-color: #d8d5d0; min-height: 48px; }
.surface input:not([type="checkbox"]):focus-visible, .surface textarea:focus-visible, .surface select:focus-visible { outline-color: #b84f00; }
.form-grid label { font-size: 15px; font-weight: 700; color: #3a3a3a; }
.form-grid input, .form-grid textarea, .form-grid select { font-weight: 400; }
.member-location { --icon-size: 21px; gap: 4px !important; }
.hosting-label { --icon-size: 22px; background: #eaf5ee; color: #335947; border-radius: 6px; }
.member-avatar { color: #a94e10; background: #fff0e1; border: 1px solid #f6dfca; }
.leg-badge { --icon-size: 20px; border-radius: 6px; background: #f4f1ec; }
.location-field[data-icon] { display: flex; --icon-size: 27px; gap: 4px; }
.location-field input { min-width: 0; }
.duration-button[data-icon] { display: flex; --icon-size: 27px; line-height: 1.35; }
.remove-leg { background: #fff2e5; border: 0; padding: 3px; justify-content: center; }
.remove-leg::before { width: 30px; height: 30px; }
.add-leg { background: #fff2e5; border: 1px solid #ffd7b4; border-radius: 12px; padding: 3px; }
.add-leg::before { width: 40px; height: 40px; }
.add-leg:hover { background: #ffe6d0; }
.trip-title, .trip-description { background: #fff; border: 1px solid #dcd7d0; color: #292929; }
.trip-title:focus, .trip-description:focus { background: #fff; border-color: #cf650a; }
.leg-fields { overflow: hidden; }
.empty-surface { text-align: center; padding: 36px 24px; background: #fff; border: 1px solid #ebe6e0; border-radius: 16px; }
.empty-surface::before { content: ""; display: block; margin: 0 auto 14px; width: 88px; height: 88px; background: var(--empty-art, url('/assets/icons/suitcase.svg')) center / contain no-repeat; }
#view[data-page="visitors"], #view[data-page="members"] { --empty-art: url('/assets/icons/globe.svg'); }
#view[data-page="messages"] { --empty-art: url('/assets/icons/envelope.svg'); }
#view[data-page="requests"] { --empty-art: url('/assets/icons/home.svg'); }
#view[data-page="admin"] { --empty-art: url('/assets/icons/shield.svg'); }
.empty-surface p { font-size: 20px; }
.empty-surface a.primary-button { text-decoration: none; }
.conversation-layout { border-radius: 16px; box-shadow: 0 6px 24px #29292908; }
.conversation-list { background: #faf8f5; }
.conversation-item.active { background: #fff0e1; }
.conversation-pane { background: #fff; }
.message { background: #f3f2ef; }
.message.mine { background: #fff0e1; }
.message-compose textarea { border-color: #d8d5d0; border-radius: 9px; }
.thread-refresh { --icon-size: 21px; }
#auth-form button[type="submit"] { --ui-icon: url('/assets/icons/key.svg'); }
#member-search button[type="submit"], #visitor-search button[type="submit"] { --ui-icon: url('/assets/icons/search.svg'); }
#message-form button[type="submit"], #stay-form button[type="submit"] { --ui-icon: url('/assets/icons/send.svg'); }
#report-form button[type="submit"] { --ui-icon: url('/assets/icons/flag.svg'); }
#trip-form button[type="submit"] { --ui-icon: url('/assets/icons/compass.svg'); }
.welcome-layout { display: grid; grid-template-columns: 1.08fr 1fr; overflow: hidden; border-radius: 20px; background: #fff; border: 1px solid #eee6dc; box-shadow: 0 8px 32px #56300b08; }
.welcome-scene { padding: 34px 30px 26px; background: #fff0df; color: #292929; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.eyebrow { margin: 0 0 14px; font: 700 11px/1.5 "Noto Sans", sans-serif; letter-spacing: .13em; text-transform: uppercase; color: #a44c13; }
.welcome-scene h2 { font: 700 36px/1.1 Signika, sans-serif; letter-spacing: -.75px; margin: 0; }
.welcome-landscape { position: relative; margin: 24px 0 22px; border-radius: 16px; overflow: hidden; background: #e1e8dc; }
.welcome-landscape img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.welcome-landscape figcaption { position: absolute; bottom: 12px; left: 12px; padding: 7px 10px; border-radius: 999px; background: #fffaf4f2; color: #3a4136; font-size: 11px; line-height: 1.3; }
.scene-caption { font: 19px/1.45 Signika, sans-serif; color: #59534d; margin: 0 0 18px; }
.scene-details { display: flex; gap: 18px; justify-content: center; padding-top: 15px; border-top: 1px solid #efdbc7; font: 13px/1.4 Signika, sans-serif; }
.scene-details span { --icon-size: 27px; gap: 6px !important; }
.welcome-layout .auth-panel, .welcome-layout .intro-panel { width: 100%; max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; padding: 38px 36px; align-self: center; }
.section-emblem { width: 66px; height: 66px; display: grid; place-items: center; background: #fff0e1; border: 1px solid #ffe5cc; border-radius: 18px; margin-bottom: 22px; }
.section-emblem::before { width: 51px; height: 51px; }
.welcome-layout .auth-panel h1 { font-size: 33px; letter-spacing: -.6px; margin-bottom: 9px; line-height: 1.15; }
.auth-lead { color: #66615c; font: 15px/1.5 Signika, sans-serif; margin: 0 0 24px; }
.auth-panel .eyebrow, .intro-panel .eyebrow { margin-bottom: 9px; font-size: 10px; }
.auth-panel .surface-actions { margin-top: 20px; }
.auth-panel .primary-button { width: 100%; }
.auth-panel .auth-links { column-gap: 18px; row-gap: 2px; margin: 20px 0; }
.auth-links button { font-size: 14px; text-underline-offset: 3px; }
.auth-panel .help-text { font-size: 12px; line-height: 1.7; }
.footer-main { background: #f4f1ec; border-top: 1px solid #e9e4dd; padding-top: 42px; }
.footer-columns { color: #625e58; font-size: 14px; line-height: 1.7; }
.footer-columns h2 { font-size: 13px; letter-spacing: .06em; color: #2b2b2b; gap: 9px; }
.footer-columns h2 img { height: 29px; width: 29px; max-width: none; filter: none; }
.footer-bottom { background: #eee9e2; color: #645f58; }
.language-control { --icon-size: 25px; }
.toast { border-radius: 10px; }
@media (min-width: 1200px) { .trips-wrapper { margin: 0 auto; } }
@media (max-width: 1100px) {
  .trips-wrapper { margin: 0 24px; }
  .welcome-layout .auth-panel, .welcome-layout .intro-panel { padding: 30px 26px; }
  .welcome-scene { padding: 30px 20px 24px; }
  .welcome-scene h2 { font-size: 32px; }
}
@media (max-width: 760px) {
  .welcome-layout { grid-template-columns: 1fr; }
  .welcome-scene { display: none; }
  .welcome-layout .auth-panel, .welcome-layout .intro-panel { padding: 28px; }
  .welcome-layout .auth-panel h1 { font-size: 30px; }
  .trip-tabs { gap: 18px; font-size: 14px; }
  .section-emblem { margin-bottom: 18px; }
}
@media (max-width: 600px) {
  .topbar { height: 68px; min-height: 68px; }
  .topbar-inner { padding: 0 12px; }
  .brand-logo { width: 146px; }
  .header-actions { gap: 4px; }
  .round-button { height: 36px; width: 36px; padding: 4px; }
  .round-button .icon, .round-button .wide-icon { width: 26px; height: 26px; }
  .profile-button { width: 36px; height: 36px; min-height: 36px; padding: 2px; }
  .notice-wrap { padding: 12px; }
  .notice { padding: 12px 35px 12px 13px; }
  .notice strong { font-size: 14px; --icon-size: 24px; padding-right: 0; }
  .notice p { margin-left: 0; margin-top: 5px; font-size: 12px; }
  .notice-close { top: 8px; right: 4px; }
  .trips-wrapper { margin: 0 16px; }
  .trip-tabs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; padding: 18px 0 22px; }
  .trip-tabs a { flex-direction: column; font-size: 11px; gap: 5px; padding: 0 0 8px; letter-spacing: 0; justify-content: flex-start; text-align: center; white-space: normal; line-height: 1.4; }
  .trip-tabs a, .trip-tabs a.active { --icon-size: 30px; }
  .trips-main { padding-bottom: 48px; }
  .surface { padding: 22px; border-radius: 12px; }
  .surface h1[data-icon], .view-heading[data-icon] { --icon-size: 34px; }
  .surface-actions { align-items: stretch; }
  .trip-title { font-size: 26px; }
  .welcome-layout { border-radius: 16px; }
  .welcome-layout .auth-panel, .welcome-layout .intro-panel { padding: 25px; }
  .welcome-layout .auth-panel h1 { font-size: 30px; }
  .auth-panel .form-grid { gap: 16px; }
  .auth-panel .help-text { font-size: 12px; }
  .form-actions { align-items: center; }
  .footer-columns { gap: 30px 4px; font-size: 13px; }
  .footer-columns h2 { gap: 6px; font-size: 12px; }
  .footer-columns h2 img { height: 26px; width: 26px; }
  .footer-main { padding: 30px 6px; }
  .empty-surface { padding: 28px 18px; }
}
@media (max-width: 380px) {
  .brand-logo { width: 132px; }
  .header-actions { gap: 2px; }
  .round-button, .profile-button { width: 34px; height: 34px; min-height: 34px; }
  .welcome-layout .auth-panel, .welcome-layout .intro-panel { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .round-button, .primary-button { transition: none; }
  .round-button:hover, .primary-button:hover { transform: none; }
}

:root { --orange: #ff8000; --text: #292929; }
body, .surface, .surface h1, .surface h2, .view-heading,
.trip-form, .trip-title, .trip-description, .trip-tabs, .primary-button,
.member-card, .member-card h2, .search-form, .leg-label, .location-field input,
.welcome-scene h2, .scene-caption, .scene-details, .auth-lead,
.footer-columns h2, .empty-surface, .conversation-item, .message {
  font-family: "Noto Sans", sans-serif;
}
.trip-tabs { text-transform: none; letter-spacing: 0; font-weight: 700; }
.trip-tabs a::after { display: none; }
.trip-tabs a.active::before { width: var(--icon-size); height: var(--icon-size); }
.trip-tabs a:not(.active) { border-bottom-width: 3px; }
.welcome-scene h2 { font-size: 33px; line-height: 1.18; letter-spacing: -1.2px; }
.welcome-layout .auth-panel h1 { font-size: 31px; font-weight: 800; letter-spacing: -1px; }
.scene-caption { font-size: 16px; line-height: 1.6; }
.section-emblem { width: 56px; height: 56px; border-radius: 16px; }
.section-emblem::before { width: 34px; height: 34px; }
.primary-button, .surface .primary-button { border-radius: 999px; font-weight: 700; }
.auth-panel .primary-button { min-height: 50px; }
.auth-panel .form-grid label { font-size: 14px; }
.surface input:not([type="checkbox"]), .surface textarea, .surface select { font-family: "Noto Sans", sans-serif; }
.trip-title { font-size: 32px; letter-spacing: -.8px; }
.trip-title::placeholder, .trip-description::placeholder { color: #77716a; }
.leg-fields, .dates-panel { background: #fff; border: 1px solid #e2dcd4; box-shadow: none; }
.trip-form .local-note, .trip-subtitle, .loading-state, .text-light, .database-note { color: #65615b; }
.language-control { color: #514d48; }
.footer-columns a:hover, .credits a:hover { color: #a94900; }
.footer-columns h2 { text-transform: none; letter-spacing: 0; font-size: 14px; }
.notice strong { font-family: "Noto Sans", sans-serif; font-size: 14px; }
.notice p { font-size: 12px; }
.footer-columns h2 img { width: 24px; height: 24px; }
@media (max-width: 600px) {
  .round-button .icon, .round-button .wide-icon { width: 22px; height: 22px; }
  .trip-tabs a, .trip-tabs a.active { --icon-size: 25px; }
  .trip-tabs a { font-size: 10px; }
  .welcome-layout .auth-panel h1 { font-size: 27px; }
  .trip-title { font-size: 25px; }
  .view-heading { font-size: 28px; }
  .scene-details { font-size: 12px; }
}
@media (min-width: 601px) and (max-width: 900px) {
  .brand-logo { width: 220px; }
  .profile-label { max-width: 70px; }
}

.destination-gallery { margin-top: 48px; padding-top: 32px; border-top: 1px solid #e9e4dd; }
.destination-heading { margin-bottom: 24px; }
.destination-heading .eyebrow { margin-bottom: 8px; }
.destination-heading h2 { margin: 0 0 9px; color: #282a27; font: 700 28px/1.25 "Noto Sans", sans-serif; letter-spacing: -.8px; }
.destination-heading > p:last-child { margin: 0; color: #686159; font-size: 14px; line-height: 1.65; }
.destination-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.destination-card { position: relative; margin: 0; min-width: 0; overflow: hidden; border: 1px solid #eae4dc; border-radius: 16px; background: #fff; }
.destination-card > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; background: #e9e7df; }
.destination-card figcaption { padding: 17px 16px 18px; }
.destination-card h3 { margin: 0 0 6px; color: #282a27; font: 700 18px/1.3 "Noto Sans", sans-serif; letter-spacing: -.3px; }
.destination-card p { margin: 0; color: #686159; font-size: 12px; line-height: 1.6; }
.destination-credit { margin: 14px 0 0; color: #777068; font-size: 11px; line-height: 1.6; }
.local-icon { display: inline-block; flex: 0 0 auto; width: 48px; height: 48px; border-radius: 50%; background: var(--local-icon) center / contain no-repeat; }
.destination-symbol { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; outline: 3px solid #fff; box-shadow: 0 2px 8px #282a2726; }
.local-moments { margin-top: 30px; padding: 26px 0 0; border-top: 1px solid #e9e4dd; }
.local-moments h3 { margin: 0 0 7px; color: #282a27; font: 700 20px/1.3 "Noto Sans", sans-serif; letter-spacing: -.5px; }
.local-moments > p { margin: 0; color: #686159; font-size: 13px; line-height: 1.6; }
.local-moments-grid { list-style: none; display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); gap: 12px; padding: 0; margin: 24px 0 0; }
.local-moments-grid li { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; font-size: 12px; color: #514d48; line-height: 1.4; }
@media (max-width: 900px) { .destination-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .local-moments-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px 12px; } }
@media (max-width: 600px) {
  .destination-gallery { margin-top: 32px; padding-top: 26px; }
  .destination-heading { margin-bottom: 18px; }
  .destination-heading h2 { font-size: 24px; }
  .destination-heading > p:last-child { font-size: 13px; }
  .destination-grid { gap: 14px; }
  .destination-card { border-radius: 12px; }
  .destination-card figcaption { padding: 12px; }
  .destination-card h3 { font-size: 16px; }
  .destination-card p { font-size: 11px; }
  .destination-symbol { top: 10px; right: 10px; width: 28px; height: 28px; outline-width: 2px; }
  .local-moments-grid { gap: 20px 8px; }
  .local-moments-grid li { font-size: 10px; }
  .local-moments-grid .local-icon { width: 42px; height: 42px; }
}