/* Retain each desktop photograph's authored frame in the phone layout. */
@media (max-width: 700px) {
  /* Category links remain two complete chapters, separate from photo albums. */
  body[data-page] main :is(.gift-card-link,.gift-set-card-link) { height: auto; min-height: 0; }
  body[data-page] main .gift-card-photo { flex: 0 0 auto; }
  body[data-page] main .gift-card-title .gift-card-arrow { display: none; }
  body[data-page="/dong-san-pham"] main .gift-collections-grid { gap: 52px; }
  body[data-page="/dong-san-pham"] main .gift-card-copy { margin: 0 0 24px; }
  body[data-page="/dong-san-pham"] main .gift-card+.gift-card {
    padding-top: 32px; border-top: 1px solid var(--line);
  }

  /* Tea Connect: organic opening, arched portrait and asymmetric workshop. */
  body[data-page] main .meet-hero-photo {
    width: min(88%, 440px); height: auto; aspect-ratio: auto;
    align-self: center; margin: 16px auto 20px;
    border-radius: 48% 48% 43% 40%; transform: rotate(3deg);
  }
  body[data-page] main .meet-hero-photo::before { display: block; }
  body[data-page] main .meet-hero-photo img {
    display: block; height: auto; border-radius: inherit;
    object-fit: contain !important;
  }
  body[data-page] main .meet-portrait {
    width: min(72%, 240px); height: auto; margin-inline: auto; align-self: center;
    border: 1px solid #b5bd9977; border-radius: 48% 48% 3px 3px;
    overflow: hidden;
  }
  body[data-page] main .meet-workshop-photo {
    border-radius: 40% 42% 5% 35%; overflow: hidden;
  }
  body[data-page] main .meet-benefits-art {
    width: min(86%, 390px); margin: 20px auto 30px; align-self: center;
  }
  body[data-page] main .meet-benefits-art::before { display: block; inset: -12px -12px 24px; }
  body[data-page] main .meet-benefits-photo {
    border-radius: 48% 48% 43% 43%; transform: rotate(-5deg);
    overflow: hidden;
  }
  body[data-page] main .meet-benefits-art figcaption { transform: rotate(-5deg); }
  body[data-page] main .tea-registration-art {
    width: min(88%, 380px); margin: 20px auto 24px;
  }
  body[data-page] main .tea-registration-art::before { display: block; }
  body[data-page] main .tea-registration-art img {
    border-radius: 46% 4% 40% 4% / 44% 4% 40% 4%;
  }

  /* The invitation remains a swipable album; each photo keeps its own contour. */
  body[data-page] main .meet-invitation-photo-main {
    border-radius: clamp(68px, 8vw, 120px) 12px 12px 12px;
  }
  body[data-page] main .meet-invitation-photo-detail {
    border-radius: 13px; border: 5px solid var(--cms-background, var(--paper));
  }
  body[data-page] main .meet-invitation-collage [data-mobile-slide] {
    overflow: hidden !important;
  }
  body[data-page] main .meet-invitation-collage .meet-invitation-photo-main {
    border-radius: clamp(68px, 8vw, 120px) 12px 12px 12px !important;
  }
  body[data-page] main .meet-invitation-collage .meet-invitation-photo-detail {
    border-radius: 13px !important;
    border: 5px solid var(--cms-background, var(--paper)) !important;
  }
  body[data-page] main .meet-invitation-collage [data-mobile-slide] img {
    border-radius: 0 !important;
  }

  /* Keep the existing tea-shoot corner ornament around the homepage photo. */
  body[data-page="/"] main .home-connect-figure {
    width: calc(100% - 20px); margin-inline: auto;
  }
  body[data-page="/"] main .home-connect-figure::before { display: block; inset: -10px; }
  body[data-page="/"] main .home-connect-figure img { border-radius: 14px; }

  /* Gift frames retain their arches, fine inner lines and floating depth. */
  body[data-page] main .gift-card--souvenirs .gift-card-photo {
    border-radius: 44% 44% 0 0 / 40% 40% 0 0; overflow: hidden;
  }
  body[data-page] main .gift-detail-hero--souvenirs .gift-detail-photo {
    border-radius: 43% 43% 0 0 / 37% 37% 0 0; overflow: hidden;
  }
  body[data-page] main .gift-detail-hero--souvenirs .gift-detail-photo img {
    border-radius: inherit;
  }
  body[data-page] main .gift-detail-hero--gifts .gift-detail-photo {
    width: calc(100% - 10px); box-shadow: 10px 10px 0 #e4ddcb;
  }
  body[data-page] main .gift-detail-photo::after { display: block; }
  body[data-page] main .gift-set-page .gift-ambassador-photo {
    border: 1px solid #c6cabb; border-radius: 8px;
    box-shadow: 6px 6px 0 var(--tone-soft); overflow: hidden;
  }
  body[data-page] main .gift-set-page .gift-ambassador-photo img { border-radius: 8px; }
  body[data-page] main .gift-set-card .gift-set-card-photo { border-radius: 8px; }
  body[data-page] main .gift-set-card-photo img { border-radius: 8px; }
  body[data-page] main .gift-detail-page--ambassadors .gift-detail-photo {
    width: calc(100% - 16px); margin: 8px auto;
  }
  body[data-page] main .gift-detail-page--ambassadors .gift-detail-photo::after {
    display: block; inset: -8px; border: 1px solid #ffffffa3;
    box-shadow: 0 16px 28px #06110a33;
  }
  body[data-page] main .gift-detail-page--ambassadors .gift-detail-photo img {
    border: 1px solid #ffffff8c; border-radius: 4px;
    box-shadow: 0 3px 10px #05100859, 0 18px 32px #05100880;
  }
  body[data-page] main [data-mobile-gallery] .gift-card--souvenirs .gift-card-photo {
    border-radius: 44% 44% 0 0 / 40% 40% 0 0 !important; overflow: hidden !important;
  }
  body[data-page] main [data-mobile-gallery] .gift-card-photo::after { display: block !important; }
  body[data-page] main [data-mobile-gallery] .gift-set-card .gift-set-card-photo {
    border-radius: 8px !important; overflow: hidden !important;
  }
  body[data-page] main [data-mobile-gallery] .gift-set-card-photo img {
    border-radius: 8px !important;
  }
  body[data-page] main [data-mobile-gallery] .gift-set-card[data-gift-priority="flagship"] .gift-set-card-photo img {
    border: 1px solid #c5b27a8c; border-radius: 8px !important;
    box-shadow: 0 12px 22px #07120c45;
  }

  /* Destination photographs keep the alternating curves from the PC layout. */
  body[data-page] main .ct-location-photo { isolation: isolate; }
  body[data-page] main .ct-location-photo::before { display: block !important; inset: -7px; }
  body[data-page] main .ct-location-photo figure {
    border-radius: 43% 7% 37% 4% / 25% 5% 19% 4%; overflow: hidden;
  }
  body[data-page] main .ct-location:nth-child(even) .ct-location-photo figure {
    border-radius: 4% 42% 6% 40% / 4% 22% 5% 19%;
  }
  body[data-page] main [data-mobile-gallery] [data-mobile-slide] .ct-location-photo {
    width: calc(100% - 16px) !important; margin: 18px 8px 8px !important;
  }
  body[data-page] main [data-mobile-gallery] [data-mobile-slide] .ct-location-photo figure {
    border-radius: 43% 7% 37% 4% / 25% 5% 19% 4% !important; overflow: hidden !important;
  }
  /* Clones use the source location's contour, independent of their DOM position. */
  body[data-page] main [data-mobile-gallery] .ct-location[data-gallery-frame="even"] .ct-location-photo figure {
    border-radius: 4% 42% 6% 40% / 4% 22% 5% 19% !important;
  }
  body[data-page] main [data-mobile-gallery] .ct-location[data-gallery-frame="even"] .ct-location-photo::before {
    border-radius: 4% 42% 6% 40% / 4% 22% 5% 19%; transform: rotate(3deg);
  }
  body[data-page] main [data-mobile-gallery] .ct-location[data-gallery-frame="odd"] .ct-location-photo::before {
    border-radius: 43% 7% 37% 4% / 25% 5% 19% 4%; transform: rotate(-3deg);
  }

  /* The small photograph in the introduction retains its white gallery edge. */
  body[data-page] main .about-opening-photo-inset {
    border: 6px solid var(--paper); box-shadow: 0 14px 26px #1d332b22;
  }
  body[data-page] main .about-opening-photos [data-mobile-slide].about-opening-photo-inset {
    border: 6px solid var(--paper) !important; box-shadow: 0 14px 26px #1d332b22 !important;
  }

  /* Founder: the portrait and its offset line share the original arch. */
  body[data-page] main .founder-portrait { padding: 11px 0 0 11px; }
  body[data-page] main .founder-portrait::before { display: block; }
  body[data-page] main .founder-cover .founder-portrait .media-frame {
    border-radius: 44% 44% 0 0 / 29% 29% 0 0; overflow: hidden;
  }
  body[data-page] main .founder-breadcrumb { flex-wrap: wrap; }
  body[data-page] main .founder-index a { min-height: 44px; }
  body[data-page] main .founder-profile-table { table-layout: fixed; }
  body[data-page] main .founder-profile-table :is(th,td) { overflow-wrap: break-word; }

  /* Library: retain the museum palette, photograph edges and artwork arches. */
  body[data-page="/thu-vien"].gallery-museum main .archive-room--region {
    --archive-paper: #182e23; --archive-ink: #f2f0e5; --archive-muted: #c0cdb9;
    --archive-accent: #ccd8ad; --archive-edge: #b2c79b38;
    --ink: var(--archive-ink); --muted: var(--archive-muted);
    --olive-text: var(--archive-accent); --line: var(--archive-edge);
    background: var(--archive-paper); color: var(--archive-ink);
  }
  body[data-page="/thu-vien"].gallery-museum main .archive-room--tea { background: #e8ecdf; }
  body[data-page] main .archive-card { border-radius: 10px; }
  body[data-page] main .archive-card .archive-photo {
    border-radius: 9px; border: 1px solid var(--archive-edge);
    box-shadow: 0 14px 34px #142c1e0b; overflow: hidden;
  }
  body[data-page] main .archive-caption-head { flex-wrap: wrap; gap: 8px 16px; }
  body[data-page] main .archive-description {
    display: block; -webkit-line-clamp: unset; max-height: none; overflow: visible;
  }
  body[data-page] main [data-mobile-gallery] [data-mobile-slide] .atelier-photo {
    padding: 5px !important; border: 1px solid #b8b29677;
    box-shadow: 0 16px 32px -20px #4c492b66;
  }
  body[data-page] main [data-mobile-gallery] [data-mobile-slide] .atelier-photo img {
    width: 100% !important; inset: auto !important;
  }
  body[data-page] main .atelier-artwork--2 .atelier-photo { border-radius: 48% 48% 3px 3px; }
  body[data-page] main .atelier-artwork--2 .atelier-photo img { border-radius: 48% 48% 0 0; }
  body[data-page] main .atelier-artwork--6 .atelier-photo { border-radius: 45% 45% 3px 3px; }
  body[data-page] main .atelier-artwork--6 .atelier-photo img { border-radius: 45% 45% 0 0; }

  /* Tea overview: the two sculpted photographs keep their different silhouettes. */
  body[data-page] main .tea-chapter--flower .tea-chapter-photo {
    width: calc(100% - 10px); margin: 0 10px 10px 0;
    border-radius: 49% 49% 3% 3% / 30% 30% 3% 3%; box-shadow: 8px 10px 0 #d1d7c3;
  }
  body[data-page] main :is(.tea-chapter--fermented,.tea-chapter--shan_tuyet) .tea-chapter-photo {
    width: calc(100% - 10px); margin: 0 0 10px 10px;
    border-radius: 48% 4% 44% 4% / 35% 3% 30% 3%; box-shadow: -8px 10px 0 #cbd5c8;
  }
  body[data-page] main :is(.tea-chapter--flower,.tea-chapter--fermented,.tea-chapter--shan_tuyet) .tea-chapter-photo::after { display: block; }

  /* Tea detail: soften full photographs without fixing their height or crop. */
  body[data-page^="/dong-san-pham"] main .fermented-page .media-frame,
  body[data-page^="/dong-san-pham"] main .fermented-page .fermented-brew-photo,
  body[data-page^="/dong-san-pham"] main .fermented-page .media-frame img,
  body[data-page^="/dong-san-pham"] main .fermented-page .fermented-brew-photo img {
    border-radius: 8px !important;
  }
  body[data-page^="/dong-san-pham"] main .fermented-page :is(.fermented-hero-art,.ngoc-variety-art) {
    isolation: isolate; padding: 0 8px 8px 0;
  }
  body[data-page^="/dong-san-pham"] main .fermented-page :is(.fermented-photo-line,.ngoc-variety-art>span) {
    display: block; inset: 8px 0 0 8px; z-index: -1;
    border: 1px solid var(--line); border-radius: 8px;
  }
  body[data-page^="/dong-san-pham"] main .fermented-page .fermented-variety {
    padding: 14px !important; border: 1px solid var(--line) !important;
    border-radius: 8px; background: var(--paper);
  }
  body[data-page^="/dong-san-pham"] main .fermented-page .tea-process-art:not(:has(.tea-process-photo--pending))::before { display: block; }
  body[data-page^="/dong-san-pham"] main .fermented-page .tea-process-photo:not(.tea-process-photo--pending) {
    border-radius: 45% 50% 46% 49%;
  }

  /* Homepage and introduction: lines belong to their photograph, not the track. */
  body[data-page="/"] main :is(#hanh-trinh,#doi-moi,#hop-sach) .editorial-visual {
    width: calc(100% - 8px); margin-bottom: 8px;
  }
  body[data-page="/"] main :is(#hanh-trinh,#doi-moi,#hop-sach) .editorial-visual::after { display: block; inset: 8px -8px -8px 8px; }
  body[data-page="/"] main :is(#hanh-trinh,#doi-moi,#hop-sach) .editorial-visual .media-frame { border-radius: 8px; overflow: hidden; }
  body[data-page="/"] main .home-moments .home-gallery-photo>.media-frame {
    border-radius: 14px; box-shadow: 0 8px 24px #182d210e; overflow: hidden;
  }
  body[data-page="/"] main .home-moments .home-gallery-photo[data-mobile-slide="0"]>.media-frame { border-radius: 14px 28px 14px 14px; }
  body[data-page="/"] main .home-moments .home-gallery-photo[data-mobile-slide="1"]>.media-frame { border-radius: 28px 14px 14px 14px; }
  body[data-page="/gioi-thieu"] main .about-project-visual::after { display: block; }
  body[data-page="/gioi-thieu"] main .about-heritage-main .about-heritage-image::after {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: url("/about-art-contour.svg") center / 100% 100% no-repeat;
  }

  /* Dark panels use their own text palette so the PC treatment stays readable. */
  body[data-page] main .meet-host {
    --ink: #f3f0df; --muted: #cdd8c8; --olive-text: #c9cda8; --line: #c6d3b733;
    background: #1c3427; color: var(--ink); border-radius: 48% 48% 0 0 / 28px 28px 0 0;
  }
  body[data-page] main .gift-set-grid[data-mobile-gallery] .gift-set-card[data-gift-priority="flagship"] {
    --ink: #faf4e5; --muted: #d2d8c8; --olive-text: #e6d298; --line: #a88f5c80;
    padding: 14px !important; border: 1px solid #a88f5c80 !important; border-radius: 10px;
    background: #1a2d23 !important; box-shadow: 0 10px 24px #1a2d2317;
  }
  body[data-page] main .gift-card-photo::after { display: block; }
  body[data-page] main [data-mobile-gallery] .ct-location-photo::before { display: block !important; }
  body[data-page] main .mobile-gallery-shell>.meet-invitation-orbit {
    display: block; position: absolute; inset: 8px 0 auto; width: 100%;
    height: calc(100% - 38px); max-height: 540px; z-index: -1; opacity: .5; pointer-events: none;
  }
  body[data-page] main :is(.archive-caption small,.media-caption,.home-gallery-credit) {
    max-width: 100%; font-size: 10px; line-height: 1.7; overflow-wrap: break-word;
  }
  /* Keep names and story copy; remove duplicate numbering and photographic filler. */
  body[data-page] main :is(.home-gallery-caption,.home-gallery-meta,.media-caption,
    .archive-description,.archive-caption-head small,.atelier-artwork figcaption small,.book-story-photo figcaption,
    .gift-card-photo figcaption,.gift-detail-photo figcaption,.about-project-visual figcaption,
    .meet-invitation-note,.about-art-note,.archive-zoom,.atelier-zoom,.meet-tea-arrow,.ct-social-arrow) { display: none !important; }
  body[data-page="/dong-san-pham/tra-len-men"] main .fermented-variety-note { display: none !important; }
  body[data-page] main :is(.founder-source,.about-vision-link,.meet-benefits-invite,
    .about-tea-card-label,.tea-registration-submit)>span[aria-hidden="true"],
  body[data-page] main .archive-directory-link>i[aria-hidden="true"] {
    position: relative; display: inline-block; flex: 0 0 12px; width: 12px; height: 12px;
    font-size: 0 !important; line-height: 0; vertical-align: middle;
  }
  body[data-page] main :is(.founder-source,.about-vision-link,.meet-benefits-invite,
    .about-tea-card-label,.tea-registration-submit)>span[aria-hidden="true"]::before,
  body[data-page] main .archive-directory-link>i[aria-hidden="true"]::before {
    content: ""; position: absolute; top: 0; right: 0; width: 9px; height: 9px;
    border-top: 1px solid currentColor; border-right: 1px solid currentColor;
  }
  body[data-page] main :is(.founder-source,.about-vision-link,.meet-benefits-invite,
    .about-tea-card-label,.tea-registration-submit)>span[aria-hidden="true"]::after,
  body[data-page] main .archive-directory-link>i[aria-hidden="true"]::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 15px; height: 1px;
    background: currentColor; transform: rotate(-45deg); transform-origin: left center;
  }
  body[data-page] main .archive-directory-link>i[aria-hidden="true"] { transform: rotate(90deg); }
  body[data-page] main .home-gallery-photo { padding-bottom: 0 !important; }
  body[data-page] main .archive-caption-head { gap: 0; }
  body[data-page] main .archive-picture figcaption { padding-bottom: 0; }
  body[data-page] main :is(h1,h2,h3,p,a,strong) { overflow-wrap: break-word; }
  body[data-page] main :is(input,textarea,select) { font-size: 16px; }
  body[data-page] main :is(input,select,button) { min-height: 44px; }
  body[data-page] main :is(input,textarea,select)::placeholder { font-size: 14px; }
  body[data-page] .interest-box { width: 112px; height: 52px; }
  /* Let the original doubled strip flow continuously from right to left on phones. */
  body[data-page="/"] main .home-seals { padding-block: 44px; }
  body[data-page="/"] main .home-seals-head { margin-bottom: 22px; }
  body[data-page="/"] main .home-seals-title { font-size: var(--mobile-heading); }
  body[data-page="/"] main .home-seals-group { gap: 24px; padding-right: 24px; }
  body[data-page="/"] main .home-seal { width: 164px; height: 110px; }
  body[data-page="/"] main .home-seals-track { animation-duration: 72s; }
  body[data-page="/"] main .home-seals-window:active .home-seals-track { animation-play-state: paused; }
  @media (prefers-reduced-motion: reduce) {
    body[data-page] main :is(.meet-hero-photo,.meet-benefits-photo,.meet-benefits-art figcaption) { transform: none; }
  }
}