@font-face{font-family:NunitoPoster;src:url('/near/illustration-theme-v1/nunito-900.ttf') format('truetype');font-weight:900;font-display:swap}
/*
 * Vargan Nearby — illustration theme v1.
 * Load after style.css, pwa.css, notifications.css (and profile.css in Account).
 * Deliberately overrides presentation only: map geometry, hidden states, tabs,
 * modal focus and all application actions remain owned by the existing code.
 */
body.vn-near-page,
#vn-account-settings {
  --vn-ink: #302a22;
  --vn-muted: #71634f;
  --vn-bg: #fff4df;
  --vn-paper: #fff9ec;
  --vn-line: #dfcaaa;
  --vn-accent: #ad3c19;
  --vn-accent-dark: #852b12;
  --vn-forest: #405a37;
  --vn-help: #405a37;
  --vn-seek: #a85c21;
  --vn-jam: #536d7b;
  --vn-lesson: #785b79;
  --vn-radius: 14px;
  color: var(--vn-ink);
  font-family: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
body.vn-near-page {
  background: var(--vn-bg);
  background-image: radial-gradient(#9a6e3510 .65px, transparent .8px);
  background-size: 5px 5px;
}
body.vn-near-page .vn-app {
  background: transparent;
  box-shadow: 0 0 0 1px #7c583318;
}
/* Quiet paper surfaces keep the real map, faces and active controls prominent. */
.vn-near-page .vn-header,
.vn-near-page .vn-map-head {
  background: var(--vn-paper);
}
.vn-near-page .vn-header {
  border-bottom: 1px solid var(--vn-line);
  gap: 10px;
}
.vn-near-page .vn-brand strong {
  font-family: NunitoPoster, Arial, sans-serif;
  color: var(--vn-accent);
  font-size: 21px;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.045em;
}
.vn-near-page .vn-brand small { color: var(--vn-muted); font-size: 11px; }
.vn-near-page .vn-brand img { box-shadow: none; }
.vn-near-page .vn-language {
  background: var(--vn-paper);
  border-color: var(--vn-line);
  color: var(--vn-forest);
  min-height: 40px;
  font-size: 12px;
}
.vn-near-page :is(h1, h2, h3),
.vn-near-page .vn-profile-card-head strong {
  font-family: inherit;
  font-weight: 800;
  letter-spacing: -.025em;
  color: var(--vn-ink);
}
.vn-near-page h1 { color: var(--vn-accent); }
.vn-near-page .vn-view-heading { margin-bottom: 14px; }
.vn-near-page .vn-view-heading h1 { font-size: 26px; }
.vn-near-page :is(button, a, input, select, textarea, [tabindex]):focus-visible,
#vn-account-settings :is(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--vn-forest);
  outline-offset: 3px;
}
/* One strong action color; green continues to mean help or an active choice. */
.vn-near-page .vn-button {
  min-height: 44px;
  border-color: #c9b394;
  border-radius: 11px;
  background: var(--vn-paper);
  color: var(--vn-ink);
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 2px 0 #87643b18;
}
.vn-near-page .vn-button:hover { background: #f7ead3; border-color: #b3956e; }
.vn-near-page .vn-primary,
.vn-near-page .vn-request .vn-actions .vn-primary {
  color: #fff9ec;
  background: var(--vn-accent);
  border-color: var(--vn-accent-dark);
  box-shadow: 0 2px 0 #792e191f;
}
.vn-near-page .vn-primary:hover,
.vn-near-page .vn-request .vn-actions .vn-primary:hover {
  color: #fff9ec;
  background: var(--vn-accent-dark);
  border-color: var(--vn-accent-dark);
}
.vn-near-page .vn-link-button,
.vn-near-page .vn-details summary { color: var(--vn-accent-dark); }
.vn-near-page .vn-icon-button,
.vn-near-page .vn-site-notices,
.vn-near-page .vn-pwa-install { color: var(--vn-forest); }
.vn-near-page .vn-icon-button:hover,
.vn-near-page .vn-pwa-install:hover { background: #eee6cf; }
.vn-near-page .vn-first-help {
  padding-top: 10px;
  padding-bottom: 10px;
  background: #f6e5c5;
  border-bottom-color: #dbc29b;
}
.vn-near-page .vn-first-help strong { font-size: 15px; font-weight: 800; color: var(--vn-forest); }
.vn-near-page .vn-first-help small { color: #655b48; font-size: 12px; }
.vn-near-page .vn-first-help > .vn-button { font-size: 13px; }
.vn-near-page .vn-map-toolbar { padding-top: 5px; padding-bottom: 5px; }
.vn-near-page .vn-segmented {
  background: #f1e5cf;
  border-color: #d2b996;
  border-radius: 11px;
}
.vn-near-page .vn-segmented button {
  color: #665b49;
  border-radius: 8px;
  font-family: inherit;
  font-weight: 700;
}
.vn-near-page .vn-segmented button[aria-pressed="true"] {
  color: #fff9ec;
  background: var(--vn-forest);
  box-shadow: none;
}
.vn-near-page .vn-map-tools > #vn-filter-toggle[aria-expanded="true"] {
  background: #e7eddb;
  color: var(--vn-forest);
  border-color: #b1be9c;
}
.vn-near-page .vn-map-tools .vn-help-shortcut { color: var(--vn-accent-dark); background: #f8e5be; }
/* Keep the existing map/list layout and dynamic city badge widths untouched. */
.vn-near-page .vn-near-body { border-color: #b8bc9d; border-radius: 16px; }
.vn-near-page .vn-map-wrap { background: #e4e8d5; }
.vn-near-page .vn-map-tiles { filter: saturate(.8) sepia(.13); }
.vn-near-page .vn-map-controls button {
  color: var(--vn-forest);
  background: var(--vn-paper);
  border-color: #bda982;
  box-shadow: 0 2px 0 #725a3422;
  border-radius: 10px;
}
.vn-near-page .vn-map-controls button:hover { background: #f0e5cf; }
.vn-near-page .vn-city-badge,
.vn-near-page .vn-city-more {
  background: #fff5df;
  border-color: #b39369;
  color: var(--vn-forest);
  box-shadow: 0 2px 0 #725a3422;
}
.vn-near-page .vn-city-caption strong { color: var(--vn-forest); font-weight: 700; }
.vn-near-page .vn-city-caption small { color: #70634b; }
.vn-near-page .vn-city-photos .vn-avatar { border-color: #fff5df; }
.vn-near-page .vn-marker { border-color: #fff5df; font-family: inherit; }
.vn-near-page .vn-marker.vn-city-person { border-color: var(--vn-accent); }
.vn-near-page .vn-marker.selected,
.vn-near-page .vn-city-person.selected { outline-color: var(--vn-accent); }
.vn-near-page .vn-marker-name { background: #fff5df; border-color: #cbb18a; color: var(--vn-forest); font-family: inherit; }
.vn-near-page .vn-overview-marker { background: var(--vn-forest); border-color: #fff5df; color: #fff9ec; font-family: inherit; }
.vn-near-page #vn-mobile-list.vn-map-list,
.vn-near-page .vn-map-note,
.vn-near-page .vn-map-empty,
.vn-near-page .vn-map-error {
  background: #fff9ecf5;
  color: var(--vn-ink);
  border-color: #cbb18a;
  box-shadow: 0 2px 8px #4c3a2310;
}
.vn-near-page .vn-map-empty strong { font-family: inherit; color: var(--vn-forest); }
.vn-near-page .vn-map-empty p { color: var(--vn-muted); }
/* Filter drawer stays collapsible. Do not add display rules to [hidden]. */
.vn-near-page .vn-map-filters { background: var(--vn-paper); border-color: #c9b18a; border-radius: 14px; }
.vn-near-page .vn-map-filters .vn-searchbar :is(input, select),
.vn-near-page .vn-results-heading input,
.vn-near-page .vn-view-heading input,
.vn-near-page .vn-section-heading input {
  border-color: #cbb493;
  color: var(--vn-ink);
  background: #fffdf6;
  border-radius: 9px;
}
.vn-near-page .vn-filter-chips button,
.vn-near-page .vn-online { background: #fff9ec; border-color: #d7c19e; color: #625642; font-size: 12px; }
.vn-near-page .vn-filter-chips button[aria-pressed="true"] { color: #fff9ec; background: var(--vn-forest); border-color: var(--vn-forest); }
.vn-near-page .vn-filter-chips button[aria-pressed="true"] .vn-dot { outline: 1px solid #fff9ec; outline-offset: 1px; }
.vn-near-page :is(.vn-online, .vn-checkline, .vn-location-controls) input { accent-color: var(--vn-forest); }
/* People, requests and profile sheets share the same readable paper cards. */
.vn-near-page .vn-near.list-mode .vn-results { background: var(--vn-bg); }
.vn-near-page .vn-results-heading { color: var(--vn-forest); }
.vn-near-page .vn-person,
.vn-near-page .vn-panel,
.vn-near-page .vn-request { background: var(--vn-paper); border-color: var(--vn-line); border-radius: 14px; box-shadow: 0 2px 0 #7e5b3310; }
.vn-near-page .vn-person { padding: 13px; }
.vn-near-page .vn-person:hover,
.vn-near-page .vn-person.selected { background: #f0efd9; border-color: #9aab7b; }
.vn-near-page .vn-person-name { font-size: 15px; font-weight: 800; }
.vn-near-page .vn-person-place { font-size: 12px; color: var(--vn-muted); line-height: 1.4; }
.vn-near-page .vn-person-bio { font-size: 13px; color: #625846; }
.vn-near-page .vn-person-foot { font-size: 12px; }
.vn-near-page .vn-person-foot strong { color: var(--vn-forest); }
.vn-near-page .vn-avatar { font-family: inherit; font-weight: 800; outline-color: #b6a482; }
.vn-near-page .vn-tag { font-size: 11px; font-weight: 600; padding: 4px 7px; background: #efe5cf; color: #625642; }
.vn-near-page .vn-tag.help { color: #365332; background: #e6ecd5; }
.vn-near-page .vn-tag.seek { color: #875021; background: #f5e4c8; }
.vn-near-page .vn-tag.jam { color: #3d5d70; background: #e4edf0; }
.vn-near-page .vn-tag.lesson { color: #6d4f72; background: #efe3ee; }
.vn-near-page .vn-friend-button { color: var(--vn-accent); background: transparent; }
.vn-near-page .vn-friend-button[aria-pressed="true"] { background: #f5e0b8; }
.vn-near-page .vn-panel { padding: 18px; }
.vn-near-page .vn-panel h2,
.vn-near-page .vn-request-heading h2 { font-size: 20px; }
.vn-near-page .vn-request-message { font-size: 14px; line-height: 1.5; }
.vn-near-page .vn-request-contact,
.vn-near-page .vn-mini-achievement,
.vn-near-page .vn-help-confirmation { background: #eaf0dd; border-color: #b7c5a0; border-radius: 11px; color: var(--vn-forest); }
.vn-near-page .vn-status { font-size: 11px; border-radius: 7px; }
.vn-near-page .vn-status:is(.accepted, .confirmed, .completed, .done) { background: #e5ecd4; color: #365332; }
.vn-near-page .vn-request-highlight { border-color: var(--vn-accent); background: #fff0d5; }
.vn-near-page .vn-dialog { background: var(--vn-paper); border-color: #c6ad86; box-shadow: -8px 0 32px #33271930; }
.vn-near-page .vn-dialog-heading,
.vn-near-page .vn-dialog-footer { background: #f8ecd4; border-color: #dcc4a0; }
.vn-near-page .vn-dialog-heading h2 { font-size: 22px; line-height: 1.25; }
.vn-near-page .vn-dialog-footer { flex-wrap: wrap; }
.vn-near-page .vn-dialog-footer .vn-button { white-space: normal; }
.vn-near-page .vn-dialog :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
  border-color: #cbb493;
  border-radius: 9px;
  background: #fffdf6;
  color: var(--vn-ink);
  min-height: 44px;
}
.vn-near-page .vn-profile-card-head strong { font-size: 24px; }
.vn-near-page .vn-profile-facts dt { font-size: 12px; }
.vn-near-page .vn-profile-facts dd { font-size: 14px; }
.vn-near-page .vn-help-copy,
.vn-near-page .vn-help-note { color: #685d4c; }
.vn-near-page .vn-toast { background: var(--vn-forest); border-color: #31472a; color: #fff9ec; font-size: 13px; }
.vn-near-page .vn-progress-number { font-family: inherit; color: var(--vn-accent); font-weight: 800; }
.vn-near-page .vn-badge strong { font-family: inherit; }
.vn-near-page .vn-rank-count { color: var(--vn-forest); }
/* Stable four-part navigation; current view is expressed by shape and color. */
.vn-near-page .vn-tabs { background: #fff7e5; border-color: #c8b08a; border-radius: 16px; box-shadow: 0 3px 0 #75553315; }
.vn-near-page .vn-tabs > :is(button, a) {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  border-radius: 11px;
  color: #655a46;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
}
.vn-near-page .vn-tabs > :is(button, a)[aria-current] { color: #fff9ec; background: var(--vn-forest); box-shadow: none; }
.vn-near-page .vn-counter,
.vn-near-page .vn-site-unread { background: var(--vn-accent); color: #fff9ec; }
/* Account settings are a separate embedded surface: never theme its host page. */
#vn-account-settings {
  background: var(--vn-paper);
  border-color: var(--vn-line);
  border-radius: 16px;
  box-shadow: 0 3px 0 #75553312;
  padding: 20px;
}
#vn-account-settings h2,
#ac-app #vn-account-settings h2 { color: var(--vn-accent); font-family: inherit; font-size: 25px; font-weight: 900; letter-spacing: -.035em; }
#vn-account-settings h3,
#ac-app #vn-account-settings h3 { color: var(--vn-forest); font-family: inherit; font-size: 17px; font-weight: 800; }
#vn-account-settings :is(a, .vn-profile-link, .vn-profile-details summary) { color: var(--vn-accent-dark); }
#vn-account-settings .vn-profile-button { color: var(--vn-ink); background: #fffdf6; border-color: #cbb493; border-radius: 10px; min-height: 44px; font-size: 13px; }
#vn-account-settings .vn-profile-button:hover { background: #f2e6d0; }
#vn-account-settings .vn-profile-primary { color: #fff9ec; background: var(--vn-accent); border-color: var(--vn-accent-dark); box-shadow: 0 2px 0 #792e1925; }
#vn-account-settings .vn-profile-primary:hover { background: var(--vn-accent-dark); }
#vn-account-settings .vn-settings-form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea),
#vn-account-settings .vn-profile-extra select { min-height: 44px; background: #fffdf6; border-color: #cbb493; color: var(--vn-ink); font-family: inherit; border-radius: 9px; }
#vn-account-settings .vn-settings-form label { font-size: 13px; }
#vn-account-settings .vn-settings-form label > span[aria-hidden] { color: var(--vn-accent); }
#vn-account-settings .vn-intents > label { background: #f6ead2; border-color: #dcc6a2; border-radius: 11px; }
#vn-account-settings .vn-intents > label:has(input:checked) { background: #e6edd7; border-color: #90a071; }
#vn-account-settings .vn-intents strong { font-size: 13px; }
#vn-account-settings .vn-intents small { color: #685d4b; font-size: 11px; }
#vn-account-settings :is(.vn-intents, .vn-checkline, .vn-location-controls, .vn-notice-options) input { accent-color: var(--vn-forest); }
#vn-account-settings :is(.vn-profile-hint, .vn-required-note, .vn-notice-status) { color: #71634f; font-size: 12px; line-height: 1.45; }
#vn-account-settings .vn-settings-heading p { color: #71634f; font-size: 13px; }
#vn-account-settings .vn-publication-status { background: #f6e8ca; border-color: #d6bb88; }
#vn-account-settings .vn-publication-status strong { color: #79501d; }
#vn-account-settings .vn-publication-status:is([data-state="map"], [data-state="list"]),
#vn-account-settings .vn-profile-success { background: #e8eed8; border-color: #b5c59b; color: #365332; }
#vn-account-settings .vn-publication-status:is([data-state="map"], [data-state="list"]) strong { color: #365332; }
#vn-account-settings .vn-publication-status[data-state="blocked"],
#vn-account-settings .vn-profile-error { background: #fbe6d9; border-color: #d7aa95; color: #882e1c; }
#vn-account-settings .vn-profile-location,
#vn-account-settings .vn-profile-extra,
#vn-account-settings .vn-profile-details,
#vn-account-settings .vn-profile-footer,
#vn-account-settings .vn-notice-settings,
#vn-account-settings .vn-pwa-settings { border-color: var(--vn-line); }
#vn-account-settings .vn-profile-dialog { background: var(--vn-paper); border-color: #c6ad86; color: var(--vn-ink); }
#vn-account-settings .vn-profile-dialog :is(header, footer) { background: #f8ecd4; }
#vn-account-settings .vn-profile-close { color: var(--vn-forest); width: 44px; height: 44px; }
#vn-account-settings .vn-map-controls button { width: 44px; height: 44px; color: var(--vn-forest); background: var(--vn-paper); }
#vn-account-settings .vn-picker-pin { color: var(--vn-accent); }
/* Installation dialogs are created under body, including from Account. */
body.vn-near-page .vn-pwa-dialog,
body:has(#vn-account-settings) .vn-pwa-dialog { background: #fff9ec; color: #302a22; border-color: #c6ad86; font-family: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
body.vn-near-page .vn-pwa-dialog h2,
body:has(#vn-account-settings) .vn-pwa-dialog h2 { font-family: inherit; font-weight: 800; color: #ad3c19; }
body.vn-near-page .vn-pwa-dialog button,
body:has(#vn-account-settings) .vn-pwa-dialog button { background: #ad3c19; border-color: #852b12; color: #fff9ec; }
@media (max-width: 600px) {
  .vn-near-page .vn-brand strong { font-size: 18px; }
  .vn-near-page .vn-brand small { font-size: 10px; }
  .vn-near-page .vn-header { gap: 5px; }
  .vn-near-page .vn-language { width: 45px; }
  .vn-near-page .vn-first-help { padding-top: 9px; padding-bottom: 9px; }
  .vn-near-page .vn-first-help strong { font-size: 14px; }
  .vn-near-page .vn-first-help small { font-size: 11px; }
  .vn-near-page .vn-first-help > .vn-button { font-size: 12px; padding-left: 10px; padding-right: 10px; }
  .vn-near-page .vn-view-heading h1 { font-size: 24px; }
  .vn-near-page .vn-content-view { padding: 16px 12px 20px; }
  .vn-near-page .vn-dialog-heading h2 { font-size: 21px; }
  .vn-near-page .vn-dialog-footer .vn-button { min-width: 0; }
  .vn-near-page .vn-tabs > :is(button, a) { font-size: 11px; }
  .vn-near-page .vn-dialog :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) { font-size: 16px; }
  #vn-account-settings { padding: 15px; }
  #vn-account-settings .vn-settings-heading { align-items: flex-start; flex-wrap: wrap; gap: 10px; }
  #vn-account-settings .vn-settings-heading > div { flex: 1 1 170px; }
  #vn-account-settings h2,
  #ac-app #vn-account-settings h2 { font-size: 24px; }
  #vn-account-settings .vn-profile-button { white-space: normal; }
  #vn-account-settings .vn-settings-form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) { font-size: 16px; }
  #vn-account-settings .vn-profile-extra select { font-size: 16px; }
}
@media (max-width: 360px) {
  .vn-near-page .vn-brand strong { font-size: 16px; }
  .vn-near-page .vn-first-help strong { font-size: 13px; }
  .vn-near-page .vn-first-help > .vn-button { font-size: 11px; padding-left: 8px; padding-right: 8px; }
  .vn-near-page .vn-brand { gap: 5px; }
  .vn-near-page .vn-map-tools > .vn-button { padding-left: 7px; padding-right: 7px; }
  #vn-account-settings .vn-intents > label { padding: 9px 7px; }
}

/* A small familiar illustration connects the working tool to its landing. */
.vn-near-page .vn-first-help > div { position:relative; padding-left:78px; }
.vn-near-page .vn-first-help > div::before { content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:68px; height:48px; background:url('/near/illustration-theme-v1/characters.webp') center/contain no-repeat; pointer-events:none; }
@media(max-width:600px){.vn-near-page .vn-first-help > div{padding-left:57px}.vn-near-page .vn-first-help > div::before{width:48px;height:42px}.vn-near-page .vn-first-help strong{font-size:13px}.vn-near-page .vn-first-help small{font-size:10px}}
@media(max-width:360px){.vn-near-page .vn-first-help > div{padding-left:0}.vn-near-page .vn-first-help > div::before{display:none}}

/* oberton-near-profile-mobile-v1:start */
@media (max-width: 600px) {
  /* The experience value needs a complete line, even when paid lessons are off. */
  #vn-account-settings .vn-experience-grid {
    grid-template-columns: minmax(0, 1fr) minmax(100px, .65fr);
    align-items: start;
    gap: 12px 10px;
  }
  #vn-account-settings .vn-experience-grid > label { min-width: 0; display: block; line-height: 1.4; }
  #vn-account-settings .vn-experience-grid > label:first-child { grid-column: 1 / -1; }
  #vn-account-settings #vn-price-field,
  #vn-account-settings #vn-currency-field { white-space: nowrap; }
  #vn-account-settings #vn-price-field > span[aria-hidden] { display: inline; }
  #vn-account-settings .vn-experience-grid :is(input, select) {
    height: 44px;
    min-height: 44px;
    width: 100%;
    margin-top: 6px;
    padding-block: 9px;
    font-size: 16px;
  }
  #vn-account-settings .vn-experience-grid select { padding-inline-end: 30px; }
  /* Keep the map link already present in the heading; remove its floating copy. */
  #ac-app:has(#vn-account-settings) .vn-account-map-return { display: none !important; }
  #vn-account-settings .vn-settings-heading { align-items: flex-start; }
  #vn-account-settings .vn-settings-heading #vn-settings-map {
    position: static;
    inset: auto;
    transform: none;
    max-width: 100%;
    flex: 0 0 auto;
  }
  /* Talk-Me remains available as a 48px button only on this profile surface. */
  body:has(#vn-account-settings) #supportTrigger {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    right: 12px !important;
    left: auto !important;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body:has(#vn-account-settings) #supportTrigger > .trigger-background {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 12px !important;
    border-radius: 50% !important;
    background: #405a37 !important;
    color: #fff9ec !important;
  }
  body:has(#vn-account-settings) #supportTrigger > .trigger-background > .text { display: none !important; }
  body:has(#vn-account-settings) #supportTrigger > .trigger-background > svg.icon {
    display: block !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
  }
  body:has(#vn-profile-dialog[open]) #supportTrigger { visibility: hidden !important; }
}
/* oberton-near-profile-mobile-v1:end */