/* My Traxx composition. Native app pixels; shared commands remain canonical. */
#traxx .fg-chapter-grid { grid-template-columns: minmax(0, 1fr); gap: 38px; }
#traxx .fg-entry { font-size: 18px; }
#traxx .fg-instructions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px 52px; align-items: start; }
#traxx .fg-instructions > .fg-steps { grid-column: 1; grid-row: 1; }
#traxx .fg-instructions > .fg-finish { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; }
#traxx .fg-instructions > .fg-notes { grid-column: 1; grid-row: 2; margin-top: 0; }
#traxx .fg-finish > h3 { margin-top: 24px; }
#traxx .fg-finish > h3:first-child { margin-top: 0; }
#traxx .beauty-traxx-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px; padding-top: 30px; border-top: 1px solid var(--line, #c8c2b7); }
#traxx .beauty-traxx-figure { margin: 0; min-width: 0; }
#traxx .beauty-traxx-heading { display: flex; align-items: baseline; gap: 14px; margin: 0 0 18px; }
#traxx .beauty-traxx-heading > span { font: 600 18px/1.5 var(--mono, monospace); color: var(--orange-deep, #aa5825); }
#traxx .beauty-traxx-heading h3 { margin: 0; font: 600 24px/1.3 var(--sans, sans-serif); }
#traxx .beauty-traxx-mount { padding: 10px; border: 1px solid #5f625f; border-radius: 20px; background: linear-gradient(150deg, #393d3d, #1b2022 72%); box-shadow: inset 0 1px 0 #777a76, 0 2px 0 #151a1b, 0 12px 25px rgb(35 38 37 / 12%); }
#traxx .beauty-traxx-screen { overflow: hidden; border: 1px solid #a29a8b; border-radius: 10px; background: #ede9e1; }
#traxx .beauty-traxx-screen img { display: block; width: 100%; height: auto; }
#traxx .beauty-traxx-screen-library { aspect-ratio: 1320 / 1560; }
#traxx .beauty-traxx-screen-library img { height: 100%; object-fit: cover; object-position: center top; }
#traxx .beauty-traxx-screen-share { aspect-ratio: 1270 / 1350; }
#traxx .beauty-traxx-figure figcaption { max-width: none; margin: 22px 2px 0; color: var(--muted, #625b50); font: 400 18px/1.65 "Open Sans", sans-serif; }
#traxx .beauty-traxx-figure figcaption > p { margin: 0; font: inherit; }
#traxx .beauty-traxx-figure figcaption > p + p { margin-top: 14px; }
#traxx .beauty-traxx-figure figcaption strong { color: var(--ink, #30291f); font-weight: 600; }
#traxx .beauty-traxx-provenance { padding-top: 14px; border-top: 1px solid var(--line, #c8c2b7); }
@media (max-width: 820px) {
  #traxx .fg-instructions { display: block; }
  #traxx .fg-instructions > .fg-finish { margin-top: 24px; }
  #traxx .fg-instructions > .fg-notes { margin-top: 24px; }
  #traxx .beauty-traxx-gallery { gap: 28px; }
}
@media (max-width: 620px) {
  #traxx .beauty-traxx-gallery { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  #traxx .beauty-traxx-heading h3 { font-size: 22px; }
  #traxx .beauty-traxx-mount { padding: 8px; border-radius: 17px; }
  #traxx .beauty-traxx-screen { border-radius: 8px; }
  #traxx .beauty-traxx-figure figcaption { margin-top: 20px; }
}
