/* One current identity at every viewport width, including browser zoom.
   The established scene geometry above 1023px remains in its own stylesheets. */
@media (max-width:1023px) {
  html { scrollbar-gutter:stable; }
  body.desktop-scene {
    background-color:#f8f3eb;
    background-image:linear-gradient(to bottom,transparent 850px,#f8f3eb 1000px),var(--delivery-room,url('/assets/optimized/model-preview/room-more-floor.webp'));
    background-position:0 0,right top;
    background-size:100% 100%,auto 1000px;
    background-repeat:no-repeat;
  }
  .hd-header { padding:20px 20px 10px; min-height:0; gap:18px; align-items:center; flex-wrap:wrap; }
  .hd-header .hd-logo { width:clamp(230px,36vw,320px); max-width:100%; transform:none; }
  .hd-header-actions { gap:14px; margin-left:auto; max-width:100%; }
  .hd-header .mg-booking { width:auto; min-width:210px; min-height:52px; font-size:1.125rem; padding:10px 18px; }
  .hd-menu > summary { width:44px; height:52px; }
  .hd-menu > summary svg { width:30px; height:30px; }
  .hd-menu > nav { top:62px; width:min(350px,calc(100vw - 48px)); }
  .hd-menu-content { padding:10px 14px; }
  .hd-back,.large-text .hd-back { position:relative; left:auto; top:auto; margin:6px 20px 16px; }
  .hp-pilot,.hd-pilot { padding-top:12px; }
  .hp-pilot .hp-map,.hd-pilot .hd-map {
    width:calc(100% - 40px); height:auto!important; aspect-ratio:auto;
    display:flex; flex-direction:column; gap:20px; padding:0; max-width:720px;
  }
  .hp-pilot .hp-figure,.hd-pilot .hd-portrait {
    position:relative; inset:auto!important; transform:none; height:auto!important;
    width:100%!important; max-width:400px; margin:0 auto; z-index:0;
  }
  .hd-pilot .hd-portrait { max-width:360px; }
  .hp-pilot .hp-figure img,.hd-pilot .hd-portrait img { width:100%; height:auto; }
  .hd-pilot .hd-portrait img { mask-image:linear-gradient(to bottom,#000 88%,transparent); }
  .hp-pilot .hp-wall-art,.hd-pilot .hp-wall-art,
  .hp-pilot .hp-floor-clip,.hp-connectors,.hd-connectors { display:none!important; }
  .hp-pilot .hp-labels,.hd-pilot .hd-labels {
    position:static; inset:auto; height:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;
  }
  .hp-labels .mg-area,.hd-labels .mg-area,.large-text :is(.hp-labels,.hd-labels) .mg-area {
    position:relative; inset:auto!important; transform:none; width:auto; min-width:0;
    min-height:52px; padding:12px 14px; white-space:normal; font-size:1.25rem; text-align:center;
  }
  .hd-pilot .mg-whole { position:relative; inset:auto; transform:none; align-self:center; min-width:0; max-width:100%; }
  .hp-pilot .hp-image-error,.hd-pilot .hd-image-error { position:static; width:auto; margin:0; padding:16px; }
  .hd-bottom,.large-text .hd-bottom { width:calc(100% - 40px); padding:24px 0 4px; margin:0 auto; max-width:720px; }
  .mg-modes { gap:8px; }
  .mg-mode { font-size:1.25rem; padding:10px 8px; min-width:0; }
  :is(.home-pilot-area,.head-area,.area-desktop-page) form.mg-search { margin:10px 0 0; gap:8px; padding:4px 12px; }
  .mg-search input { font-size:1rem; }
  .hd-support { width:calc(100% - 40px); max-width:720px; margin:4px auto 0; }
  .hd-alternative .choice-list { grid-template-columns:1fr; gap:0; }
  .hd-alternative .choice-row { padding:10px 8px; }
  .hd-ornament,.mg-area-page .hd-ornament { width:calc(100% - 40px); height:72px; max-width:720px; }
  .mg-area-page { min-height:0; padding:6px 0 16px; }
  .mg-area-content,.mg-page-introduction,.mg-page-body { width:calc(100% - 40px); max-width:720px; }
  .mg-content-page .mg-area-heading,.mg-content-page[data-page-kind="service"] .mg-area-heading { padding:0; }
  .mg-area-heading h1,.mg-content-page .mg-area-heading h1,.mg-content-page[data-page-kind="service"] .mg-area-heading h1 { font-size:clamp(2rem,6vw,3rem); line-height:1.15; }
  .mg-area-heading p { font-size:1.25rem; }
  .mg-area-intro,.mg-content-page .mg-area-intro { padding:20px; }
  .mg-area-intro br { display:none; }
  .mg-area-cards { gap:18px; }
  .mg-area-card-caption { padding:14px; gap:12px; }
  .mg-area-card-title { font-size:1.5rem; }
  .mg-area-card-description { font-size:1.0625rem; }
  .mg-page-body { padding:0 0 20px; }
  .mg-page-body :is(.service-list,.choice-list,.contact-grid,.booking-option-list) { grid-template-columns:1fr; }
  .mg-page-body :is(.service-card,.choice-row,.contact-card) { min-height:0; padding:22px; }
  .mg-page-body :is(.service-name,.choice-row>span) { font-size:1.375rem; }
  .mg-page-photo { height:220px; }
  .mg-page-photo[data-editorial-photo="face"],.mg-page-photo[data-editorial-photo="eyes"] { height:280px; }
  .mg-area-discovery { padding-top:10px; }
  .large-text .hd-header-actions { flex:1; justify-content:space-between; gap:8px; }
  .large-text .hd-header .mg-booking { min-width:0; flex:1; }
  .large-text :is(.hp-pilot .hp-labels,.hd-pilot .hd-labels,.mg-modes,.mg-area-cards) { grid-template-columns:1fr; }
  .large-text .hd-header .mg-booking > .mg-icon { display:none; }
  .large-text .hd-menu > nav { width:calc(100vw - 48px); }
}
@media (max-width:599px) {
  .hd-header { justify-content:center; gap:12px; }
  .hd-header .hd-logo { width:260px; }
  .hd-header-actions { width:100%; justify-content:space-between; margin:0; }
  .hd-header .mg-booking { flex:1; min-width:0; max-width:300px; }
  .mg-area-cards { grid-template-columns:1fr; }
  .hp-pilot .hp-figure { max-width:320px; }
  .hd-pilot .hd-portrait { max-width:300px; }
}

/* Odbiór 87: only the mobile home. The shared Head and desktop keep their layout. */
@media (max-width:1023px) {
  body.home-pilot-area {
    background-image:linear-gradient(to bottom,transparent 600px,#f8f3eb 700px),var(--delivery-room,url('/assets/optimized/model-preview/room-more-floor.webp'));
    background-size:100% 100%,auto 700px;
    background-position:0 0,right -85px top;
  }
  body.home-pilot-area .hd-header {
    display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:2px 12px;
    width:100%; max-width:440px; padding:8px 16px 4px; align-items:center;
  }
  body.home-pilot-area .hd-header .hd-logo { width:clamp(220px,62vw,248px); max-width:100%; }
  body.home-pilot-area .hd-header-actions { display:contents; }
  body.home-pilot-area .hd-header .mg-booking {
    grid-column:1 / -1; grid-row:2; width:100%; max-width:none; min-width:0;
    min-height:44px; padding:8px 16px; font-size:1.125rem;
  }
  body.home-pilot-area .hd-menu { grid-column:2; grid-row:1; }
  body.home-pilot-area .hd-menu > summary { width:44px; height:44px; }
  body.home-pilot-area .hd-menu > nav { top:48px; width:min(350px,calc(100vw - 40px)); }
  body.home-pilot-area .hp-pilot { padding-top:6px; }
  body.home-pilot-area .hp-pilot .hp-map {
    display:block; width:calc(100% - 16px); max-width:420px; padding:0 0 24px;
    height:auto!important;
    /* Keep the 24px geometry basis for percentage labels and SVG unchanged.
       Reclaim 12px of that empty trailing space in document flow only. */
    margin-bottom:-12px;
  }
  body.home-pilot-area .hp-pilot .hp-figure {
    position:relative; width:min(320px,calc(100vw - 60px))!important;
    max-width:none; height:auto!important; inset:auto!important; transform:none; margin:0 auto;
  }
  body.home-pilot-area .hp-pilot .hp-labels { position:absolute; inset:0; display:block; }
  body.home-pilot-area .hp-labels .mg-area {
    position:absolute; width:clamp(84px,24vw,100px); min-height:44px; padding:8px 7px;
    font-size:1.1875rem; line-height:1.2; white-space:nowrap;
    transform:translateY(-50%); margin:0;
  }
  /* Same sides and order as desktop, along two gently bowed threads. */
  body.home-pilot-area .hp-labels [data-home-label="head"] { left:12px!important; top:6%!important; }
  body.home-pilot-area .hp-labels [data-home-label="hands"] { left:1.3333px!important; top:27%!important; }
  body.home-pilot-area .hp-labels [data-home-label="hips"] { left:1.3333px!important; top:48%!important; }
  body.home-pilot-area .hp-labels [data-home-label="legs"] { left:12px!important; top:69%!important; }
  body.home-pilot-area .hp-labels [data-home-label="neck"] { right:12px!important; top:6%!important; }
  body.home-pilot-area .hp-labels [data-home-label="decolletage"] { right:3px!important; top:21.75%!important; }
  body.home-pilot-area .hp-labels [data-home-label="back"] { right:0!important; top:37.5%!important; }
  body.home-pilot-area .hp-labels [data-home-label="belly"] { right:3px!important; top:53.25%!important; }
  body.home-pilot-area .hp-labels [data-home-label="bikini"] { right:12px!important; top:69%!important; }
  body.home-pilot-area .hp-mobile-lines-ready:not(.hp-figure-failed) .hp-connectors { display:block!important; }
  body.home-pilot-area .hp-connectors-rear { z-index:2; }
  body.home-pilot-area .hp-pilot .hp-floor-clip { display:block!important; mask-image:none; }
  body.home-pilot-area .hp-pilot .hp-floor [data-floor-reflection] { opacity:.22; }
  body.home-pilot-area .hp-pilot .hd-bottom { padding:8px 0 4px; margin:0 auto; max-width:420px; }
  body.home-pilot-area .hp-pilot .hd-support,
  body.home-pilot-area .hp-pilot .hd-ornament { max-width:420px; }
  body.home-pilot-area .hp-image-error:not([hidden]) { position:relative; z-index:4; margin-top:8px; }
}

/* Odbiór 90: the mobile Head has its own portrait-and-choices composition.
   Keep these rules separate from the accepted home and all desktop geometry. */
@media (max-width:1023px) {
  body.head-area {
    background-image:linear-gradient(to bottom,transparent 600px,#f8f3eb 700px),var(--delivery-room,url('/assets/optimized/model-preview/room-more-floor.webp'));
    background-size:100% 100%,auto 700px;
    background-position:0 0,right -85px top;
  }
  body.head-area .hd-header {
    display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:2px 12px;
    width:100%; max-width:440px; padding:8px 16px 4px; align-items:center;
  }
  body.head-area .hd-header .hd-logo { width:clamp(220px,62vw,248px); max-width:100%; }
  body.head-area .hd-header-actions { display:contents; }
  body.head-area .hd-header .mg-booking {
    grid-column:1 / -1; grid-row:2; width:100%; max-width:none; min-width:0;
    min-height:44px; padding:8px 16px; font-size:1.125rem;
  }
  body.head-area .hd-menu { grid-column:2; grid-row:1; }
  body.head-area .hd-menu > summary { width:44px; height:44px; }
  body.head-area .hd-menu > nav { top:48px; width:min(350px,calc(100vw - 40px)); }
  body.head-area .hd-pilot { padding-top:0; }
  body.head-area .hd-back { display:flex; width:calc(100% - 40px); max-width:420px; margin:4px auto 8px; }
  body.head-area .hd-pilot .hd-map { max-width:420px; gap:12px; }
  /* Native aspect ratio and the whole transparent canvas: no crop or object-fit zoom. */
  body.head-area .hd-pilot .hd-portrait { max-width:280px; margin:0 auto 4px; }
  body.head-area .hd-pilot .hd-labels {
    grid-template-rows:repeat(3,auto); grid-auto-flow:column; gap:10px;
  }
  body.head-area .hd-pilot .mg-whole { width:100%; }
  body.head-area .hd-bottom,
  body.head-area .hd-support,
  body.head-area .hd-ornament { max-width:420px; }
  .large-text body.head-area .hd-pilot .hd-labels { grid-template-rows:none; grid-auto-flow:row; }
}

/* Odbiór 92: balanced pairs, readable labels and a stable shared portrait stage.
   Larger text keeps the accessible flowing layout above instead of tiny targets. */
@media (max-width:1023px) {
  body.head-area { background-position:0 0,right -135px top; }
  body.head-area .hd-large-labels .mg-modes { grid-template-columns:1fr; }
  body.head-area .hd-pilot .hd-connectors { --mg-line-width:.65px; }
  body.head-area .hd-pilot .hd-connectors circle { r:2.25px; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-map {
    display:block; width:calc(100% - 16px); max-width:440px; padding-top:10px;
  }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-portrait {
    display:flex; align-items:center; aspect-ratio:1122 / 1402;
    width:calc(100% - 168px)!important; max-width:272px; margin:0 auto 28px;
  }
  /* The full shoulders remain opaque; the short fade only softens the bottom.
     Labels flank the hair and finish below the shoulders; no new image crop. */
  body.head-area .hd-pilot .hd-portrait img { mask-image:linear-gradient(to bottom,#000 94%,transparent); }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels {
    position:absolute; inset:0 0 auto; height:calc(100% - 68px); display:block;
  }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels .mg-area {
    position:absolute; width:108px; min-height:46px; padding:8px 9px;
    font-size:1.1875rem; line-height:1.2; white-space:nowrap; transform:translateY(-50%); z-index:2;
  }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="brows"] { left:20px!important; top:10%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="eyes"] { left:0!important; top:38%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="lips"] { left:0!important; top:66%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="neck"] { left:20px!important; top:94%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="hair"] { right:20px!important; top:10%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="cheeks"] { right:0!important; top:38%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="subchin"] { right:0!important; top:66%!important; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-labels [data-head-label="decolletage"] { right:20px!important; top:94%!important; }
  html:not(.large-text) body.head-area .hd-mobile-lines-ready:not(.hd-portrait-failed) .hd-connectors { display:block!important; z-index:1; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .mg-whole { display:flex; width:calc(100% - 32px); margin:12px auto 0; }
}

/* Odbiór 93: one action row on mobile Head. Enlarged text keeps the flowing fallback. */
@media (min-width:350px) and (max-width:1023px) {
  /* The return link shares this row from the scene below. Let the empty half
     of the header pass taps through while its real controls remain interactive. */
  html:not(.large-text) body.head-area:not(:has(.hd-large-labels)) .hd-header { pointer-events:none; }
  html:not(.large-text) body.head-area:not(:has(.hd-large-labels)) .hd-header :is(.hd-logo,.mg-booking,.hd-menu) { pointer-events:auto; }
  html:not(.large-text) body.head-area:not(:has(.hd-large-labels)) .hd-header .mg-booking {
    width:calc(50% - 4px); justify-self:end; font-size:1rem; padding:8px 10px;
  }
  html:not(.large-text) body.head-area:not(:has(.hd-large-labels)) .hd-header .mg-booking > .mg-icon { display:none; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) { padding-top:16px; }
  html:not(.large-text) body.head-area .hd-pilot:not(.hd-large-labels) .hd-back {
    position:absolute; top:-48px; left:max(20px,calc(50% - 200px));
    width:calc(50% - 24px); max-width:192px; margin:0; gap:6px;
    font-size:1rem; white-space:nowrap;
  }
}

:root{--delivery-room:url("/assets/optimized/model-preview/room-more-floor.webp")}
@media(max-width:1023px){:root{--delivery-room:image-set(url("/assets/optimized/model-preview/room-more-floor.960.webp") 1x,url("/assets/optimized/model-preview/room-more-floor.webp") 2x)}}