/* Approved mobile public profile. All new rules stay inside this page root. */
.mobile-public-profile { display: none; }
@media (max-width: 760px) {
  .detail-page { display: none; }
  .mobile-public-profile {
    display: block;
    --mp-ink: var(--rose-ink);
    --mp-muted: var(--rose-body);
    --mp-rose: var(--rose-accent);
    --mp-line: var(--rose-line);
    --mp-heading: var(--rose-heading-font);
    background: var(--rose-white);
    color: var(--mp-ink);
    min-height: 100svh;
    font-size: 14px;
    line-height: 1.5;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .mobile-public-profile *, .mobile-public-profile *::before, .mobile-public-profile *::after { box-sizing: border-box; }
  .mobile-public-profile :where(h1,h2,p,dl,dd) { margin: 0; }
  .mobile-public-profile :where(a,button) { -webkit-tap-highlight-color: transparent; }
  .mobile-public-profile svg { flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .mobile-public-profile .rose-header { padding: 4px 18px; min-height: 52px; flex-wrap: nowrap; gap: 8px; background: var(--rose-paper); border-color: var(--mp-line); }
  .mobile-public-profile .rose-brand { gap: 6px; min-height: 44px; font-family: var(--mp-heading); font-size: 22px; font-weight: 700; color: var(--mp-ink); }
  .mobile-public-profile .rose-brand img { width: 30px; height: 30px; }
  .mobile-public-profile .rose-header-actions { width: auto; margin-left: auto; flex-wrap: nowrap; gap: 8px; }
  .mobile-public-profile .rose-language { gap: 3px; }
  .mobile-public-profile .rose-language a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-size: 14px; padding: 0 3px; color: var(--mp-muted); }
  .mobile-public-profile .rose-language a[aria-current] { color: var(--mp-rose); text-decoration: underline; text-underline-offset: 7px; }
  .mobile-public-profile .rose-nav, .mobile-public-profile .rose-access { display: none; }
  .mobile-public-profile .rose-mobile-menu { position: relative; flex: none; }
  .mobile-public-profile .rose-menu-toggle { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--mp-rose); cursor: pointer; list-style: none; }
  .mobile-public-profile .rose-menu-toggle::-webkit-details-marker { display: none; }
  .mobile-public-profile .rose-menu-toggle svg { width: 22px; height: 22px; }
  .mobile-public-profile .rose-mobile-menu-links { position: absolute; z-index: 5; top: 100%; right: 0; display: grid; min-width: 160px; padding: 8px; border: 1px solid var(--mp-line); border-radius: 7px; background: var(--rose-white); box-shadow: 0 6px 20px #24172515; }
  .mobile-public-profile .rose-mobile-menu-links a { display: flex; align-items: center; min-height: 44px; padding: 6px 10px; color: var(--mp-ink); text-decoration: none; }
  .mobile-public-profile .mp-main { padding: 0 17px; max-width: 540px; margin-inline: auto; }
  .mobile-public-profile .mp-return-block { padding-top: 4px; }
  .mobile-public-profile .mp-return { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; color: var(--mp-rose); font-size: 15px; font-weight: 600; text-decoration: none; }
  .mobile-public-profile .mp-return svg { width: 18px; height: 18px; }
  .mobile-public-profile .mp-return-hint { color: var(--mp-muted); font-size: 14px; line-height: 1.5; margin: 0 0 10px; }
  .mobile-public-profile .mp-portrait { position: relative; aspect-ratio: 2.15 / 1; overflow: hidden; border-radius: 5px; background: #ede1df; }
  .mobile-public-profile .mp-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .mobile-public-profile .mp-portrait--missing { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #f2e8e6, #e4e4ec); }
  .mobile-public-profile .mp-no-photo { display: flex; align-items: center; flex-direction: column; gap: 6px; padding-bottom: 18px; color: var(--mp-muted); font-size: 14px; }
  .mobile-public-profile .mp-no-photo svg { width: 42px; height: 42px; }
  .mobile-public-profile .mp-preview-label { display: inline-flex; align-items: center; gap: 6px; position: absolute; left: 8px; bottom: 9px; max-width: calc(100% - 16px); border-radius: 22px; background: var(--rose-white); color: var(--mp-rose); padding: 4px 10px; font-size: 14px; line-height: 1.4; font-weight: 600; }
  .mobile-public-profile .mp-preview-label svg { width: 16px; height: 16px; }
  .mobile-public-profile .mp-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 13px; margin: 10px 0 4px; }
  .mobile-public-profile h1 { font-family: var(--mp-heading); font-size: 32px; line-height: 1.25; font-weight: 700; letter-spacing: -.02em; overflow-wrap: anywhere; }
  .mobile-public-profile .rose-status { color: var(--mp-muted); font-weight: 600; font-size: 15px; white-space: nowrap; }
  .mobile-public-profile .rose-status--available { color: var(--rose-available); }
  .mobile-public-profile .rose-status--working { color: var(--rose-working); }
  .mobile-public-profile .rose-status--resting { color: var(--rose-resting); }
  .mobile-public-profile .rose-status--away { color: var(--rose-away); }
  .mobile-public-profile .mp-status-note { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 7px; background: #fff6df; color: var(--mp-muted); font-size: 14px; line-height: 1.5; margin-top: 6px; }
  .mobile-public-profile .mp-status-note svg, .mobile-public-profile .mp-tg-card > .mp-card-heading > svg { width: 19px; height: 19px; color: #ef9400; }
  .mobile-public-profile .mp-review { font-size: 14px; line-height: 1.5; color: #9b620f; padding-top: 5px; }
  .mobile-public-profile .mp-facts { margin-top: 4px; }
  .mobile-public-profile .mp-facts > div { display: grid; grid-template-columns: minmax(106px, 38%) minmax(0, 1fr); gap: 8px; min-height: 32px; padding: 5px 2px; border-bottom: 1px solid var(--mp-line); align-items: start; }
  .mobile-public-profile .mp-facts dt { display: flex; align-items: center; gap: 8px; color: var(--mp-muted); font-size: 14px; }
  .mobile-public-profile .mp-facts dt svg { width: 17px; height: 17px; }
  .mobile-public-profile .mp-facts dd { font-size: 14px; overflow-wrap: anywhere; }
  .mobile-public-profile .mp-section { padding: 10px 2px; border-bottom: 1px solid var(--mp-line); }
  .mobile-public-profile h2 { font-family: var(--mp-heading); font-size: 20px; line-height: 1.3; color: var(--mp-ink); font-weight: 700; }
  .mobile-public-profile .mp-skill-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
  .mobile-public-profile .mp-skills { padding-block: 6px; }
  .mobile-public-profile .mp-skill-list > span { display: inline-block; padding: 6px 13px; border-radius: 6px; background: #fcebf1; color: var(--mp-rose); font-weight: 500; font-size: 14px; overflow-wrap: anywhere; max-width: 100%; }
  .mobile-public-profile .mp-summary p, .mobile-public-profile .mp-authorized p { color: var(--mp-muted); margin-top: 8px; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; white-space: pre-line; }
  .mobile-public-profile .mp-missing { color: var(--mp-muted); font-size: 14px; }
  .mobile-public-profile .mp-access-card, .mobile-public-profile .mp-target-card, .mobile-public-profile .mp-tg-card { border: 1px solid var(--mp-line); border-radius: 7px; margin-top: 8px; padding: 8px 9px; }
  .mobile-public-profile .mp-access-card { background: #fff2f6; border-color: #ffc2d4; }
  .mobile-public-profile .mp-card-heading { display: flex; align-items: center; gap: 11px; }
  .mobile-public-profile .mp-card-heading > svg { width: 27px; height: 27px; color: var(--mp-rose); }
  .mobile-public-profile .mp-card-heading p { color: var(--mp-muted); font-size: 14px; line-height: 1.5; margin-top: 3px; }
  .mobile-public-profile .mp-primary { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; padding: 8px 12px; margin-top: 8px; background: var(--mp-rose); border: 1px solid var(--mp-rose); border-radius: 5px; color: #fff; text-decoration: none; font-size: 15px; font-weight: 600; text-align: center; }
  .mobile-public-profile .mp-target-row { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; justify-content: space-between; margin-top: 6px; border: 1px solid #fbd8e3; border-radius: 6px; padding: 3px 5px 3px 10px; }
  .mobile-public-profile .mp-target-row p { flex: 1; min-width: 90px; color: var(--mp-rose); font-size: 14px; overflow-wrap: anywhere; }
  .mobile-public-profile .mp-target-row a { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--mp-rose); border-radius: 5px; color: var(--mp-rose); padding: 5px 9px; text-decoration: none; font-size: 14px; text-align: center; }
  .mobile-public-profile .mp-target-match { color: var(--mp-muted); margin: 7px 10px 0; font-size: 14px; }
  .mobile-public-profile .mp-target-error { color: #a0323d; margin: 7px 10px 0; font-size: 14px; }
  .mobile-public-profile .mp-tg-card { background: #fff7e5; border-color: #ffdea2; padding-bottom: 4px; }
  .mobile-public-profile .mp-tg-card h2 { color: var(--mp-ink); font-family: var(--mp-heading); font-size: 20px; font-weight: 700; }
  .mobile-public-profile .mp-tg-card .mp-card-heading { gap: 9px; }
  .mobile-public-profile .mp-tg-card .mp-card-heading p { font-size: 14px; }
  .mobile-public-profile .mp-submit-unavailable { display: block; width: 100%; min-height: 44px; margin-top: 8px; border: 1px solid var(--mp-line); border-radius: 5px; background: var(--rose-paper); color: var(--mp-muted); font-size: 14px; font-weight: 600; cursor: not-allowed; }
  .mobile-public-profile .mp-booking-note { display: flex; align-items: flex-start; gap: 8px; color: var(--mp-muted); font-size: 14px; line-height: 1.5; margin-top: 8px; background: #fcecf2; padding: 6px 10px; border-radius: 5px; }
  .mobile-public-profile .mp-booking-note svg { width: 15px; height: 15px; color: #c43c59; }
  .mobile-public-profile .mp-access-ready { margin: 10px 0 0; font-size: 14px; color: var(--rose-available); }
  .mobile-public-profile .mp-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 10px; border-top: 1px solid var(--mp-line); padding: 0 17px; margin: 8px auto 0; max-width: 574px; background: var(--rose-white); }
  .mobile-public-profile .mp-footer small { color: var(--mp-muted); font-size: 14px; line-height: 1.5; }
}
