/* PESYJE MOBILE APP V4 — Scoped exclusively to an installed, small-screen PWA.
   The website (including mobile browsers) and desktop PWA keep their current UI. */
@media screen and (max-width:767px) {
  html.pma-v4 {
    --pma-accent: #008f91;
    --pma-bg: #f6f9fa;
    --pma-card: #ffffff;
    --pma-text: #192936;
    --pma-muted: #5b717d;
    --pma-line: #e2edef;
    --pma-safe: env(safe-area-inset-bottom, 0px);
    background: var(--pma-bg);
    scroll-padding-bottom: calc(108px + var(--pma-safe));
    width: 100%;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
  }
  html.pma-v4[data-pesyje-theme="dark"],
  html.pma-v4[data-theme="dark"],
  html.pma-v4.dark {
    --pma-bg: #111b21;
    --pma-card: #1c2b32;
    --pma-text: #f2f8f9;
    --pma-muted: #b5c9d0;
    --pma-line: #354d55;
  }
  html.pma-v4 body {
    max-width: 100% !important;
    overflow-x: clip !important;
    box-sizing: border-box;
    background: var(--pma-bg);
    padding-bottom: calc(112px + var(--pma-safe)) !important;
    -webkit-font-smoothing: antialiased;
  }
  html.pma-v4 *, html.pma-v4 *::before, html.pma-v4 *::after { box-sizing: border-box; }
  html.pma-v4 :is(main, section, article, .container, .row, .col, .ps-shell, .ps-main, .ps-columns) { min-width:0; }
  html.pma-v4 :is(.ps-social, #py30-main, .pr-main, .ps-main, .ps-review-card) { max-width: 100%; }
  html.pma-v4 :is(.ps-review-card, .ps-post-body, .pr-review-card) { overflow-wrap: anywhere; }
  html.pma-v4 :is(.ps-post-body img, .ps-photo-grid img, .pr-review-card img, .ps-review-card img) {
    max-width: 100%; height: auto;
  }

  /* Existing five REAL actions — not a second footer. Fixed CSS viewport anchor. */
  html.pma-v4 body #pesyjeMobileFooter.pesyje-mobile-footer,
  html.pma-v4 body #pesyjeMobileFooter.pesyje-mobile-footer.collapsed {
    position: fixed !important;
    inset: auto 8px max(8px, var(--pma-safe)) 8px !important;
    transform: none !important;
    translate: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 510px !important;
    height: 76px !important;
    margin: 0 auto !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    z-index: 2147483000 !important;
  }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-footer-shell {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 76px !important;
    min-height: 76px !important;
    padding: 7px 4px 6px !important;
    margin: 0 !important;
    background: color-mix(in srgb, var(--pma-card) 94%, transparent) !important;
    border: 1px solid var(--pma-line) !important;
    border-radius: 25px !important;
    box-shadow: 0 8px 28px rgba(0, 20, 28, .20) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    transform: none !important;
    pointer-events: auto !important;
  }
  html.pma-v4 #pesyjeMobileFooter :is(.pesyje-mobile-item, .pesyje-mobile-item-button, .pesyje-mobile-center) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 62px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 4px 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 3px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    color: var(--pma-muted) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: visible;
  }
  html.pma-v4 #pesyjeMobileFooter :is(.pesyje-mobile-item, .pesyje-mobile-item-button).active,
  html.pma-v4 #pesyjeMobileFooter .pma-current { color: var(--pma-accent) !important; }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-item > span:last-child,
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-center-label {
    color: inherit !important;
    width: 100%;
    max-width: 100% !important;
    text-align: center;
    display: block !important;
    font-size: clamp(9px, 2.65vw, 11px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    line-height: 1.2 !important;
  }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-item-icon {
    width: 31px !important; height: 29px !important;
    font-size: 20px !important;
    line-height: 1 !important;
    flex: none;
  }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-center-circle {
    width: 47px !important; height: 47px !important;
    min-width: 47px !important;
    border: 4px solid color-mix(in srgb, var(--pma-accent) 22%, var(--pma-card)) !important;
    border-radius: 50% !important;
    background: var(--pma-accent) !important;
    color: #ffffff !important;
    font-size: 18px !important;
    flex: 0 0 auto !important;
    transform: none !important;
  }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-center {
    justify-content: flex-start !important;
    height: 68px !important;
    padding-top: 0 !important;
  }
  html.pma-v4 #pesyjeMobileFooter .pesyje-mobile-center-label { color: var(--pma-accent) !important; }
  html.pma-v4.pma-v4-keyboard #pesyjeMobileFooter { display: none !important; }
  html.pma-v4.pma-v4-keyboard body { padding-bottom: var(--pma-safe) !important; }

  /* True modal sheets still use the site's existing discover and notification handlers. */
  html.pma-v4 .pesyje-mobile-sheet {
    max-width: 100% !important;
    border-radius: 22px 22px 0 0 !important;
    max-height: min(84dvh, 720px) !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--pma-card) !important;
    color: var(--pma-text) !important;
    padding-bottom: max(18px, var(--pma-safe)) !important;
  }
  html.pma-v4 .pesyje-mobile-sheet-list { display: flex; flex-direction: column; gap: 5px; }
  html.pma-v4 .pesyje-mobile-sheet-list .pma-v4-link-row {
    display: flex; align-items: center; gap: 13px;
    min-height: 54px; padding: 9px 12px;
    border-radius: 12px; background: var(--pma-bg);
    border: 1px solid var(--pma-line);
    text-decoration: none; color: var(--pma-text);
  }
  html.pma-v4 .pma-v4-link-row .pma-v4-row-icon {
    width: 36px; height: 36px; border-radius: 11px;
    display: grid; place-items: center; flex: none;
    color: var(--pma-accent); background: color-mix(in srgb, var(--pma-accent) 13%, var(--pma-card));
  }
  html.pma-v4 .pma-v4-row-name { flex: 1; min-width: 0; font-size: 14px; font-weight: 700; }
  html.pma-v4 .pma-v4-row-name small { display: block; font-size: 11px; }
  html.pma-v4 .pma-v4-link-row > i:last-child { color: var(--pma-muted); }

  /* Homepage: real server-rendered hero/search/categories/cards, native mobile proportions. */
  html.pma-v4 #py30-main { min-width: 0 !important; overflow: clip; }
  html.pma-v4 #py30-main .py30-container {
    width: 100%; max-width: 100%; padding-left: 16px !important; padding-right: 16px !important;
  }
  html.pma-v4 #py30-main .py30-hero {
    padding: 18px 0 26px !important;
    min-height: 0 !important;
    height: auto !important;
  }
  html.pma-v4 #py30-main .py30-hero-grid { display: block !important; }
  html.pma-v4 #py30-main .py30-hero-copy { min-width: 0; width: 100%; }
  html.pma-v4 #py30-main .py30-hero-copy h1,
  html.pma-v4 #py30-main #py30-title {
    font-size: clamp(29px, 8vw, 38px) !important;
    line-height: 1.13 !important;
    letter-spacing: -.045em !important;
    max-width: 12ch;
    text-wrap: balance;
    margin: 9px 0 10px !important;
  }
  html.pma-v4 #py30-main .py30-hero-copy > p {
    font-size: 13px !important;
    line-height: 1.48 !important;
    max-width: 38ch;
    margin: 0 0 15px !important;
  }
  html.pma-v4 #py30-main .py30-eyebrow {
    max-width: 100%; font-size: 11px !important;
    white-space: normal !important; padding: 6px 10px !important;
  }
  html.pma-v4 #py30-main .py30-hero-stats { display: none !important; }
  html.pma-v4 #py30-main .py30-search-wrap {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    position: relative;
    z-index: 18;
  }
  html.pma-v4 #py30-main .py30-search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
    padding: 10px !important;
    border-radius: 17px !important;
    height: auto !important;
    min-height: 0 !important;
    box-shadow: 0 12px 26px rgba(0,0,0,.14);
  }
  html.pma-v4 #py30-main .py30-search-field,
  html.pma-v4 #py30-main .py30-location-field {
    display: flex !important;
    width: 100% !important; min-width: 0 !important;
    min-height: 43px !important; height: 43px !important;
    border-radius: 10px !important;
    padding-inline: 12px !important;
  }
  html.pma-v4 #py30-main .py30-search :is(input, select) {
    width: 100% !important; min-width: 0 !important;
    font-size: 15px !important;
    height: 40px !important;
  }
  html.pma-v4 #py30-main .py30-search .py30-button {
    min-height: 43px !important; height: 43px !important;
    width: 100% !important; margin: 0 !important;
    border-radius: 11px !important;
    font-size: 14px !important;
  }
  html.pma-v4 #py30-main .py30-popular { display: none !important; }
  html.pma-v4 .pma-v4-quick-links {
    width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
    padding: 12px 15px 14px; gap: 8px;
    background: var(--pma-card);
  }
  html.pma-v4 .pma-v4-quick-links a {
    display: flex; align-items: center; justify-content: center;
    flex-direction: column; gap: 7px;
    min-width: 0; min-height: 65px; padding: 7px 3px;
    font-size: 12px; font-weight: 700; text-align: center;
    text-decoration: none; color: var(--pma-text);
    border: 1px solid var(--pma-line); border-radius: 13px;
    background: var(--pma-bg);
  }
  html.pma-v4 .pma-v4-quick-links a i { font-size: 18px; color: var(--pma-accent); }
  html.pma-v4 #py30-main .py30-categories { padding-top: 18px !important; padding-bottom: 5px !important; }
  html.pma-v4 #py30-main .py30-section { margin-top: 25px !important; }
  html.pma-v4 #py30-main .py30-section-heading h2,
  html.pma-v4 #py30-main .py38-category-heading h2 {
    font-size: 19px !important; line-height: 1.2 !important; letter-spacing: -.03em;
  }
  html.pma-v4 #py30-main .py30-section-heading p,
  html.pma-v4 #py30-main .py38-category-heading p {
    font-size: 12px !important; line-height: 1.45 !important;
  }
  html.pma-v4 #py30-main .py30-section-heading,
  html.pma-v4 #py30-main .py38-category-heading { gap: 8px !important; align-items: flex-start; }
  html.pma-v4 #py30-main .py30-section-heading .py30-view-all,
  html.pma-v4 #py30-main .py38-category-heading .py30-view-all { font-size: 11px !important; flex: 0 0 auto; }
  html.pma-v4 #py30-main .py30-category-strip {
    display: flex !important; flex-wrap: nowrap !important; gap: 9px !important;
    overflow-x: auto !important; overscroll-behavior-x: contain;
    padding: 7px 2px 14px !important;
    scrollbar-width: none; scroll-snap-type: x proximity;
  }
  html.pma-v4 #py30-main .py30-category-strip::-webkit-scrollbar { display: none; }
  html.pma-v4 #py30-main .py30-category {
    flex: 0 0 104px !important; min-width: 104px !important; max-width: 104px !important;
    min-height: 103px !important; padding: 10px 7px !important;
    border-radius: 14px !important; scroll-snap-align: start;
    font-size: 11px !important; line-height: 1.25 !important;
  }
  html.pma-v4 #py30-main .py31-category-image,
  html.pma-v4 #py30-main .py30-category .py30-icon-box { width: 44px !important; height: 44px !important; }
  html.pma-v4 #py30-main .py31-category-image img { width: 42px !important; height: 42px !important; object-fit: contain; }
  html.pma-v4 #py30-main .py30-track {
    display: flex !important; gap: 12px !important;
    overflow-x: auto !important; scroll-snap-type: x proximity;
    overscroll-behavior-x: contain; scrollbar-width: none;
    padding: 7px 1px 17px !important;
  }
  html.pma-v4 #py30-main .py30-track::-webkit-scrollbar { display: none; }
  html.pma-v4 #py30-main .py30-card {
    flex: 0 0 min(74vw, 280px) !important;
    width: min(74vw, 280px) !important;
    min-width: 0 !important;
    max-width: min(74vw, 280px) !important;
    border-radius: 15px !important;
    scroll-snap-align: start;
  }
  html.pma-v4 #py30-main .py30-card h3 { font-size: 14px !important; }
  html.pma-v4 #py30-main .py30-card-body { padding: 12px !important; }
  html.pma-v4 #py30-main .py30-card-media { height: 142px !important; }
  html.pma-v4 #py30-main .py30-card-media .py31-cover-link,
  html.pma-v4 #py30-main .py30-card-media .py31-real-cover { max-height: 142px !important; }

  /* Timeline, public Reviews and profile use real posts, likes, comments and rating artwork. */
  html.pma-v4 .ps-social { padding: 14px 10px 18px !important; }
  html.pma-v4 .ps-social .ps-shell { width: 100%; max-width: 100%; padding: 0 !important; }
  html.pma-v4 :is(.ps-columns, .ps-timeline-columns) {
    display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 12px !important;
  }
  html.pma-v4 .ps-social :is(.ps-sidebar, .ps-timeline-suggestions) { display: none !important; }
  html.pma-v4 .ps-social .ps-main { width: 100%; margin: 0 !important; }
  html.pma-v4 .ps-social :is(.ps-panel, .ps-review-card) {
    max-width: 100%; border-radius: 16px !important;
    background: var(--pma-card) !important;
    border-color: var(--pma-line) !important;
  }
  html.pma-v4 .ps-timeline-hero {
    display: grid !important; grid-template-columns: auto minmax(0,1fr) !important;
    gap: 9px !important; padding: 13px !important; border-radius: 15px !important;
    background: var(--pma-card) !important;
  }
  html.pma-v4 .ps-timeline-hero h1 { color: var(--pma-text) !important; font-size: 20px !important; }
  html.pma-v4 .ps-timeline-hero p { color: var(--pma-muted) !important; font-size: 12px !important; }
  html.pma-v4 .ps-timeline-hero .ps-button { grid-column: 1/-1; margin: 0 !important; width: 100%; }
  html.pma-v4 .ps-social .ps-composer { padding: 13px !important; }
  html.pma-v4 .ps-social .ps-composer-form { min-width: 0; width: 100%; }
  html.pma-v4 .ps-social .ps-composer-form :is(input, button) { min-width: 0; }
  html.pma-v4 .ps-social .ps-stream-heading h2 { font-size: 18px !important; color: var(--pma-text) !important; }
  html.pma-v4 .ps-social .ps-review-card { padding: 15px 12px !important; margin-bottom: 12px !important; }
  html.pma-v4 .ps-social .ps-review-card :is(h3, strong, b) { color: var(--pma-text); }
  html.pma-v4 .ps-social .ps-review-card :is(p, small, time, .ps-muted) { color: var(--pma-muted); }
  html.pma-v4 .ps-social .ps-review-card button { min-height: 36px; }
  html.pma-v4 .ps-social .ps-post-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; }
  html.pma-v4 .ps-social .ps-post-actions > * { min-width: 0; text-align: center; }
  html.pma-v4 .ps-social .ps-post-cta { max-width: 100%; overflow-wrap: anywhere; }
  html.pma-v4 .ps-social .ps-photo-grid { max-width: 100%; overflow: hidden; border-radius: 11px; }
  html.pma-v4 .ps-social .ps-photo-grid img { object-fit: cover; }
  html.pma-v4 :is(.ps-social, .pr-main) :is(input, textarea, select) {
    max-width: 100%; color: var(--pma-text); background: var(--pma-card);
  }
  html.pma-v4 :is(.ps-social, .pr-main) :is(input, textarea)::placeholder { color: var(--pma-muted) !important; opacity:.86; }

  /* Review creation: original star assets and publish endpoint stay untouched. */
  html.pma-v4 .ratings.ratings-selective { max-width: 100%; display: flex; flex-wrap: nowrap; gap: min(2vw,7px); }
  html.pma-v4 .ratings.ratings-selective .rating { flex: 0 1 auto; min-width: 0; }
  html.pma-v4 .ratings.ratings-selective img { max-width: 100%; object-fit: contain; }
  html.pma-v4 .pma-v4-draft {
    color: var(--pma-muted); margin-top: 9px;
    font-size: 12px; line-height: 1.35;
  }
  html.pma-v4 .pma-v4-draft-prompt {
    display:flex; align-items:center; flex-wrap:wrap; gap:7px;
    background: var(--pma-card); color: var(--pma-text);
    border: 1px solid var(--pma-line); border-radius: 12px;
    padding: 9px; margin-bottom: 5px;
  }
  html.pma-v4 .pma-v4-draft-prompt strong { flex:1; min-width: 130px; }
  html.pma-v4 .pma-v4-draft-prompt button {
    padding: 7px 10px; min-height: 36px;
    border-radius: 8px; border: 1px solid var(--pma-line);
    font-size: 12px; font-weight: 700;
  }
  html.pma-v4 .pma-v4-restore { background: var(--pma-accent); color: #fff; }
  html.pma-v4 .pma-v4-discard { background: var(--pma-bg); color: var(--pma-text); }

  html.pma-v4 .pma-v4-network {
    position: fixed; z-index: 2147483200; top: max(8px, env(safe-area-inset-top,0px));
    left: 12px; right: 12px; margin: 0 auto; max-width: 420px;
    padding: 10px 14px; border-radius: 11px;
    font-size: 13px; font-weight: 700; text-align: center;
    background: #183a44; color:#fff;
    opacity: 0; visibility: hidden; transform:translateY(-10px);
    transition: opacity .2s, transform .2s, visibility .2s;
    pointer-events: none;
  }
  html.pma-v4 .pma-v4-network.pma-show { visibility:visible; opacity:1; transform:none; }
  html.pma-v4 .pma-v4-top {
    position: fixed; right: 15px; bottom: calc(99px + var(--pma-safe));
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid var(--pma-line); color: var(--pma-accent);
    background: var(--pma-card); box-shadow: 0 6px 19px rgba(0,0,0,.14);
    opacity:0; visibility:hidden; transform:translateY(10px); transition:.2s;
    z-index:2147481000;
  }
  html.pma-v4 .pma-v4-top.pma-visible { opacity:1;visibility:visible;transform:none; }
  html.pma-v4.pma-v4-keyboard .pma-v4-top { display:none; }

  @media (prefers-reduced-motion: reduce) {
    html.pma-v4 *, html.pma-v4 *::before, html.pma-v4 *::after {
      scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important;
    }
  }
}
@media screen and (max-width:767px) {
  html.pma-v4 #py30-main .py30-track { transform: none !important; }
  html.pma-v4 #py30-main .py30-carousel { width:100%; max-width:100%; overflow:hidden; }
  html.pma-v4 #py30-main .py30-carousel-controls { display:none!important; }
}