/* Guests (10/11, owner: "Take a look at the guests tabs, they still use a old
   version of our design, we need to re design these 2 tabs with the new design
   we created ... fonts, font sizes, containers and container layouts, charts
   styles, animations, modals, everything ... from the dashboard tabs, and the
   pricing tabs"). Overview and All Reviews wear the shared root
   (.yw-guests-page is in skin/money.css and overview.css's root lists, so the
   cards, hero, tracks, rows, tables, buttons and fields are the Dashboard's);
   this file holds only what Guests adds: the grid, the hatched bar rows
   (yw-gx-bar), the column charts (yw-gx-col), the figures, the Wizard card's
   coast abstract, the review cards and the reply box. Type scale as the other
   redesigned tabs: rows and tables 14px, notes 12.5 to 13px, nothing under
   12px. Light rules first, their dark twins under [data-theme-root].dark at
   the foot, then reduced motion. */

/* ------------------------------------------------------------ the grid -- */
.yw-guests-page { margin-top: 18px; }
.yw-guests-page > * + * { margin-top: 16px; }
.yw-guests-grid { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, 1.06fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.yw-guests-grid > * { min-width: 0; margin: 0; }
.yw-guests-stack { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
.yw-guests-stack > * { margin: 0; }
.yw-guests-stack > :last-child { flex: 1 1 auto; }
.yw-guests-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.yw-guests-pair > * { min-width: 0; margin: 0; }
.yw-guests-pair > :only-child { grid-column: 1 / -1; }
/* The top (10/11, owner: "a lot of containers are wasting space"): three
   columns of cards at their own height. A card never stretches to match a
   neighbour, so nothing inside one is padding to fill a row. */
.yw-guests-wide { display: flex; flex-direction: column; gap: 16px; }
.yw-guests-wide > * { margin: 0; }
.yw-guests-page .yw-card { display: flex; flex-direction: column; }
.yw-gx-stay-slot { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; }
.yw-gx-stay-slot > .yw-card { flex: 1 1 auto; }
/* The one-line notices (add Google, an unknown site): a quiet card row. */
.yw-gx-nudge { flex-direction: row !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding: 16px 23px; text-decoration: none; }
.yw-gx-nudge-line { color: #202024; font-size: 14px; }
a.yw-gx-nudge:hover { border-color: #d9d2e0; }
.yw-guests-grid > .yw-needs { display: flex; flex-direction: column; }
.yw-guests-grid > .yw-needs > .yw-needs-card { flex: 1 1 auto; }
@media (max-width: 1180px) {
  .yw-guests-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yw-guests-grid > .yw-gx-insight { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .yw-guests-grid, .yw-guests-pair { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------- card furniture -- */
.yw-guests-page .yw-card-head { align-items: center; }
.yw-guests-page .yw-card-title .hw-info-label { text-align: left; }
.yw-gx-head-figure { flex-shrink: 0; color: #929097; font-size: 12.5px; white-space: nowrap; }
.yw-gx-empty { margin: 16px 0 0; color: #87818c; font-size: 13px; line-height: 1.5; }
.yw-gx-note { margin: 10px 0 0; color: #929097; font-size: 12.5px; line-height: 1.5; }
.yw-gx-note[data-tone="bad"] { color: #a96883; }
.yw-gx-rows-caption { margin: 18px 0 2px; color: #87818c; font-size: 12.5px; }
.yw-gx-scroll { min-height: 0; margin-top: 10px; }
/* The rows hang 8px past the card's text edge for their hover wash, so the
   scroller gives them that room on both sides and never scrolls sideways. */
.yw-gx-scroll[data-scroll="list"] { max-height: 340px; margin-right: -8px; margin-left: -8px; padding: 0 8px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d9cbe5 transparent; }

/* A figure that is not the hero: the Dashboard's 27px value, its unit grey. */
.yw-gx-figure { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 16px 0 12px; color: #202024; font-size: 34px; font-weight: 500; line-height: 1.1; letter-spacing: -.05em; }
.yw-gx-figure > span:not(.yw-hero-pill) { color: #929097; font-size: 13px; font-weight: 400; letter-spacing: -.2px; }
.yw-gx-figure > .yw-hero-pill { align-self: center; font-size: 12px; letter-spacing: 0; }
.yw-gx-track { margin-bottom: 4px; }

/* The hero: out of five beside the figure, its status line, the stars. */
.yw-gx-hero .yw-hero-value { margin: 16px 0 8px; }
.yw-gx-of { margin-left: 8px; color: #929097; font-size: 20px; font-weight: 400; letter-spacing: -.5px; }
.yw-gx-hero .yw-hero-status { gap: 8px; font-size: 12px; }
.yw-gx-hero .yw-hero-status .yw-hero-pill { font-size: 12px; }
.yw-gx-hero .yw-hero-muted { font-size: 12.5px; }
.yw-gx-hero .yw-hero-status a { color: #8553c2; }
.yw-gx-hero .yw-gx-bars { margin-top: 14px; }
.yw-gx-hero-empty { margin: 18px 0 6px; color: #87818c; font-size: 15px; }
.yw-gx-hero-stats { margin-top: 8px; }
.yw-gx-hero-stats .yw-row-stat, .yw-gx-replies-stats .yw-row-stat { padding: 12px 0; color: #59535f; font-size: 13px; }
.yw-gx-hero-stats .yw-row-stat dd, .yw-gx-replies-stats .yw-row-stat dd { color: #202024; font-size: 14px; }
.yw-gx-hero-stats .yw-row-stat dd a, .yw-gx-replies-stats .yw-row-stat dd a { color: inherit; text-decoration: none; }
.yw-gx-hero-stats .yw-row-stat dd a:hover, .yw-gx-replies-stats .yw-row-stat dd a:hover { color: #7c3aed; }
.yw-gx-replies-stats { margin-top: 10px; }
.yw-gx-partial { cursor: help; }

/* --------------------------------------------------------- the bar row -- */
.yw-gx-bars { margin: 6px 0 0; padding: 0; list-style: none; }
.yw-gx-bars > li + li { border-top: 1px solid #eae8ec; }
.yw-gx-bar { display: grid; grid-template-columns: minmax(0, 9.5rem) minmax(0, 1fr) minmax(4.5rem, auto); align-items: center; gap: 14px; margin: 0 -8px; padding: 11px 8px; border-radius: 10px; color: #59535f; font-size: 14px; text-decoration: none; transition: background .16s ease, opacity .2s ease; }
a.yw-gx-bar:hover, a.yw-gx-bar:focus-visible { background: #f6f2fa; }
a.yw-gx-bar:hover .yw-gx-bar-label { color: #7c3aed; }
a.yw-gx-bar:focus-visible { outline: 2px solid #b993ff; outline-offset: -2px; }
.yw-gx-bars[data-compact] .yw-gx-bar { grid-template-columns: 4.6rem minmax(0, 1fr) minmax(4.8rem, auto); padding: 6px 8px; }
.yw-gx-bars[data-compact] > li + li { border-top: 0; }
.yw-gx-bar-name { display: flex; min-width: 0; align-items: baseline; gap: 7px; }
.yw-gx-bar-label { overflow: hidden; color: #343039; text-overflow: ellipsis; white-space: nowrap; transition: color .16s ease; }
.yw-gx-bar-tag { flex-shrink: 0; color: #a59fab; font-size: 12px; }
.yw-gx-bar-name[data-under] { flex-direction: column; align-items: flex-start; gap: 2px; }
.yw-gx-bar-under { max-width: 100%; overflow: hidden; color: #929097; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
/* In the three-column rows the cards are narrow: a shorter name column so
   the bar keeps room. */
.yw-guests-grid .yw-gx-bar { grid-template-columns: minmax(0, 7.5rem) minmax(2.5rem, 1fr) auto; gap: 12px; }
.yw-guests-grid .yw-gx-bar-foot { padding-left: calc(7.5rem + 12px); }
.yw-gx-bar-track { position: relative; display: block; height: 8px; overflow: hidden; border-radius: 4px; background: #eeedf1; }
.yw-gx-bar-track > i { display: block; height: 100%; border-radius: inherit; background: repeating-linear-gradient(125deg, #9161df 0 2px, #dcccfa 2px 4px); transform-origin: left; animation: yw-scale-in 1.1s cubic-bezier(.2, .8, .2, 1) both; }
.yw-gx-bars > li:nth-child(2) .yw-gx-bar-track > i { animation-delay: 50ms; }
.yw-gx-bars > li:nth-child(3) .yw-gx-bar-track > i { animation-delay: 100ms; }
.yw-gx-bars > li:nth-child(4) .yw-gx-bar-track > i { animation-delay: 150ms; }
.yw-gx-bars > li:nth-child(n + 5) .yw-gx-bar-track > i { animation-delay: 200ms; }
.yw-gx-bar-track[data-tone="pink"] > i { background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); }
.yw-gx-bar-track[data-tone="grey"] > i { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #dcd7e0 2px 4px); }
.yw-gx-bar-note { color: #87818c; font-size: 13px; line-height: 1.4; }
.yw-gx-bar-note:last-child { grid-column: 2 / -1; }
.yw-gx-bar-note[data-tone="watch"] { color: #9a805f; }
.yw-gx-bar-note[data-tone="bad"] { color: #a96883; }
.yw-gx-bar-value { color: #202024; font-size: 14px; font-weight: 500; text-align: right; white-space: nowrap; }
.yw-gx-bar-value > span { margin-left: 7px; color: #929097; font-size: 13px; font-weight: 400; }
li[data-slowest] .yw-gx-bar-value > span { color: #a96883; }
li[data-selected] > .yw-gx-bar { background: #f3ecfb; }
li[data-selected] .yw-gx-bar-label { color: #6d28d9; font-weight: 500; }
li[data-dim] > .yw-gx-bar { opacity: .55; }
li[data-dim] > .yw-gx-bar:hover { opacity: 1; }
/* Two columns of rows in a full-width card (topics, team, people). */
.yw-gx-bars[data-cols="2"], .yw-gx-team-list[data-cols="2"], .yw-gx-people ul[data-cols="2"] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 44px; }
.yw-gx-bars[data-cols="2"] > li:nth-child(2), .yw-gx-team-list[data-cols="2"] > li:nth-child(2), .yw-gx-people ul[data-cols="2"] > li:nth-child(2) { border-top: 0; }
@media (max-width: 1000px) { .yw-gx-bars[data-cols="2"], .yw-gx-team-list[data-cols="2"], .yw-gx-people ul[data-cols="2"] { grid-template-columns: minmax(0, 1fr); } }
.yw-gx-bar-foot { margin: -6px 0 8px; padding-left: calc(9.5rem + 14px); color: #929097; font-size: 12.5px; }
.yw-gx-bar-foot[data-tone="bad"] { color: #a96883; }

/* ----------------------------------------------------- the column chart -- */
.yw-gx-card .yw-card-head { flex-wrap: wrap; row-gap: 10px; }
.yw-gx-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-left: auto; }
.yw-guests-page .yw-gx-filters button[aria-haspopup="listbox"] { height: 32px; padding: 0 11px; border-color: #e8e6e9; border-radius: 10px; background: #fff; box-shadow: 0 2px 6px #00000009; color: #202024; font-size: 12.5px; font-weight: 400; }
.yw-guests-page .yw-gx-filters button[aria-haspopup="listbox"]:hover { background: #faf8fc; }
.yw-gx-pager { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid #e8e6e9; border-radius: 12px; background: #fff; box-shadow: 0 2px 6px #00000009; }
.yw-gx-pager > a { display: inline-grid; width: 26px; height: 26px; place-items: center; border-radius: 8px; color: #59535f; }
.yw-gx-pager > a:hover { background: #f4f2f6; color: #7c3aed; }
.yw-gx-pager > a > svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.yw-gx-pager > span { min-width: 5.5rem; color: #202024; font-size: 12.5px; text-align: center; }
.yw-gx-chart { display: flex; flex: 1 1 auto; flex-direction: column; justify-content: flex-end; margin-top: 14px; }
.yw-gx-key { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 16px; margin-bottom: 10px; color: #59535f; font-size: 12px; }
.yw-gx-key > span { display: inline-flex; align-items: center; gap: 6px; }
.yw-gx-key i { display: inline-block; width: 12px; height: 8px; border-radius: 2px; }
.yw-gx-plot { display: grid; grid-template-columns: minmax(0, 1fr); }
.yw-gx-plot[data-axis] { grid-template-columns: 22px minmax(0, 1fr); column-gap: 6px; }
.yw-gx-axis { display: flex; flex-direction: column; justify-content: space-between; height: 184px; padding-bottom: 24px; color: #a9a0af; font-size: 12px; line-height: 1; text-align: right; }
.yw-gx-axis > span { transform: translateY(-50%); }
.yw-gx-axis > span:last-child { transform: translateY(50%); }
.yw-gx-cols { display: grid; gap: 3px; height: 208px; }
.yw-gx-cols[data-many] { gap: 1px; }
.yw-gx-col { display: flex; min-width: 0; flex-direction: column; height: 100%; padding: 0; border: 0; border-radius: 6px; background: transparent; cursor: default; transition: background .2s ease; }
.yw-gx-col:hover, .yw-gx-col[data-active="true"] { background: #f4eefb; }
.yw-gx-col:focus-visible { outline: 2px solid #7836e9; outline-offset: -2px; }
.yw-gx-rail { position: relative; display: block; flex: 1 1 auto; border-bottom: 1px solid #cfc8d5; background: linear-gradient(to bottom, #ece8f0 0 1px, transparent 1px calc(50% - .5px), #ece8f0 calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px)); }
.yw-gx-plot[data-axis] .yw-gx-rail { background: linear-gradient(to bottom, #ece8f0 0 1px, transparent 1px calc(25% - .5px), #ece8f0 calc(25% - .5px) calc(25% + .5px), transparent calc(25% + .5px) calc(50% - .5px), #ece8f0 calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px) calc(75% - .5px), #ece8f0 calc(75% - .5px) calc(75% + .5px), transparent calc(75% + .5px)); }
.yw-gx-stack { position: absolute; right: max(16%, calc(50% - 15px)); bottom: 0; left: max(16%, calc(50% - 15px)); display: flex; flex-direction: column-reverse; gap: 1px; border-radius: 3px 3px 0 0; transform-origin: bottom; animation: yw-gx-grow .7s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(min(var(--yw-gx-i, 0), 30) * 18ms); }
.yw-gx-cols[data-many] .yw-gx-stack { right: 12%; left: 12%; }
.yw-gx-stack > i { display: block; min-height: 2px; flex-basis: 0; }
.yw-gx-stack > i:last-of-type { border-radius: 3px 3px 0 0; }
.yw-gx-tag { position: absolute; bottom: calc(100% + 4px); left: 50%; color: #59535f; font-size: 12px; font-weight: 500; white-space: nowrap; transform: translateX(-50%); }
.yw-gx-cols[data-many] .yw-gx-tag { display: none; }
.yw-gx-cols[data-many] .yw-gx-col[data-active="true"] .yw-gx-tag { display: block; z-index: 2; padding: 1px 5px; border-radius: 6px; background: #fff; box-shadow: 0 2px 6px rgba(48, 32, 64, .08); }
.yw-gx-label { display: block; height: 24px; padding-top: 7px; overflow: visible; color: #8b8290; font-size: 12px; text-align: left; white-space: nowrap; }
.yw-gx-readout { min-height: 42px; margin-top: 8px; gap: 6px 18px; color: #87818c; font-size: 13px; }
.yw-gx-readout strong { font-size: 14px; }
@keyframes yw-gx-grow { from { transform: scaleY(0); } to { transform: none; } }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="violet"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="deep"] { background: #6d28d9; }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="soft"] { background: #c6aaf0; }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="grey"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #dcd7e0 2px 4px); }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="lilac"] { background: #e3d6f6; }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="slate"] { background: #8f8996; }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="pink"] { background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); }
:is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="rose"] { background: #e7a3c3; }

/* ------------------------------------------------------ the Wizard card -- */
/* The Guests abstract (10/11, owner: "here you have the identity"): the
   simplified coast, light by day and dark by night, the only identity pair
   no other card wears. It drifts with every Wizard picture (motion.css). */
.yw-insight-art[data-art="guests"] { background-image: url("/dashboard-landscapes/coast-simple-day.webp"); background-position: 62% 100%; background-size: auto 74%; }
.yw-gx-insight .yw-insight-tag, .yw-gx-insight .yw-insight-tag .hw-info-label { color: inherit; font-size: 12px; font-weight: 400; }
.yw-gx-insight .yw-insight-count { padding: 5px 10px; border-radius: 20px; background: rgba(255, 255, 255, .6); color: #5e4380; font-size: 12px; font-weight: 500; }
.yw-gx-insight .yw-insight-value span { font-size: 14px; }
.yw-gx-insight h3 { max-width: 300px; margin-top: 10px; font-size: 23px; }
.yw-gx-insight .yw-insight-bottom { gap: 12px; padding-top: 18px; }
.yw-gx-insight .yw-insight-link { font-size: 13px; }
.yw-gx-insight-report { display: inline-flex; align-items: center; gap: 5px; padding: 9px 12px; border-radius: 11px; background: rgba(48, 22, 82, .55); color: #fff; font-size: 13px; font-weight: 500; text-decoration: none; backdrop-filter: blur(10px); transition: background .16s ease; }
.yw-gx-insight-report:hover, .yw-gx-insight-report:focus-visible { background: rgba(48, 22, 82, .72); }

/* The reading state: the house dots, not a spinner. */
.yw-gx-reading { display: inline-flex; align-items: center; gap: 10px; }
.yw-gx-dots { display: inline-flex; gap: 4px; }
.yw-gx-dots > i { display: block; width: 6px; height: 6px; border-radius: 50%; background: #a883ee; animation: yw-gx-dot 1.1s ease-in-out infinite both; }
.yw-gx-dots > i:nth-child(2) { animation-delay: .15s; }
.yw-gx-dots > i:nth-child(3) { animation-delay: .3s; }
@keyframes yw-gx-dot { 0%, 80%, 100% { opacity: .25; transform: scale(.8); } 40% { opacity: 1; transform: none; } }

/* ------------------------------------------------------ team mentions -- */
.yw-gx-team-list { margin: 10px 0 0; padding: 0; list-style: none; }
.yw-gx-team-row { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-top: 1px solid #eae8ec; }
.yw-gx-team-row:first-child { border-top: 0; }
.yw-gx-team-row > details { min-width: 0; flex: 1 1 auto; }
.yw-gx-team-row summary { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.yw-gx-team-row summary::-webkit-details-marker { display: none; }
.yw-gx-team-name { color: #202024; font-size: 15px; font-weight: 500; }
.yw-gx-team-counts { display: flex; flex-wrap: wrap; gap: 4px 14px; color: #87818c; font-size: 13px; }
.yw-gx-team-counts > [data-tone="good"] { color: #2f8a6d; }
.yw-gx-team-counts > [data-tone="bad"] { color: #a96883; }
.yw-gx-team-counts > [data-tone="accent"] { color: #7433d4; }
.yw-gx-team-more { margin-left: auto; color: #929097; font-size: 12.5px; white-space: nowrap; }
.yw-gx-team-row details[open] .yw-gx-team-more { color: #7c3aed; }
.yw-gx-team-evidence { margin: 10px 0 2px; padding: 12px 14px; border-radius: 14px; background: #f6f5f7; list-style: none; }
.yw-gx-team-evidence > li { color: #59535f; font-size: 13px; line-height: 1.5; }
.yw-gx-team-evidence > li + li { margin-top: 6px; }
.yw-gx-team-evidence [data-tone="good"] { color: #2f8a6d; }
.yw-gx-team-evidence [data-tone="bad"] { color: #a96883; }
.yw-gx-team-evidence .yw-gx-team-date { margin-left: 4px; color: #a59fab; }
.yw-gx-people { margin-top: 18px; padding: 16px 18px; border-radius: 14px; background: #f6f5f7; }
.yw-gx-people-title { margin: 0; color: #202024; font-size: 14px; font-weight: 500; }
.yw-gx-people ul { margin: 6px 0 0; padding: 0; list-style: none; }
.yw-gx-people li { padding: 12px 0; border-top: 1px solid #e6e3e9; }
.yw-gx-people li:first-child { border-top: 0; }
.yw-gx-people-name { color: #202024; font-size: 14px; font-weight: 500; }
.yw-gx-people-meta { margin-left: 8px; color: #929097; font-size: 12.5px; }
.yw-gx-people-likely { margin-left: 8px; color: #7433d4; font-size: 12.5px; }
.yw-gx-people-quote { margin: 4px 0 0; color: #6f6975; font-size: 13px; }
.yw-gx-people-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.yw-gx-people-form input:not([type="hidden"]), .yw-gx-people-form select { height: 34px; padding: 0 11px; border: 1px solid transparent; border-radius: 10px; background: #fff; color: #202024; font-size: 13px; }
.yw-gx-people-form input:focus, .yw-gx-people-form select:focus { border-color: #b993ff; outline: none; }
.yw-gx-quiet-button { padding: 0; border: 0; background: none; color: #87818c; font-size: 13px; cursor: pointer; }
.yw-gx-quiet-button:hover { color: #202024; text-decoration: underline; text-underline-offset: 2px; }

/* ------------------------------------------------------------- dark -- */
[data-theme-root].dark :is(.yw-gx-head-figure, .yw-gx-empty, .yw-gx-note, .yw-gx-rows-caption, .yw-gx-of, .yw-gx-bar-tag, .yw-gx-bar-under, .yw-gx-bar-value > span, .yw-gx-bar-foot, .yw-gx-label, .yw-gx-axis, .yw-gx-readout, .yw-gx-figure > span:not(.yw-hero-pill), .yw-gx-team-counts, .yw-gx-team-more, .yw-gx-people-meta, .yw-gx-quiet-button, .yw-gx-team-evidence .yw-gx-team-date) { color: #a297ab; }
[data-theme-root].dark :is(.yw-gx-figure, .yw-gx-bar-value, .yw-gx-team-name, .yw-gx-people-name, .yw-gx-people-title, .yw-gx-pager > span, .yw-gx-hero-stats .yw-row-stat dd, .yw-gx-replies-stats .yw-row-stat dd) { color: #f3eef8; }
[data-theme-root].dark :is(.yw-gx-bar, .yw-gx-bar-label, .yw-gx-hero-stats .yw-row-stat, .yw-gx-replies-stats .yw-row-stat, .yw-gx-key, .yw-gx-tag, .yw-gx-people-quote, .yw-gx-team-evidence > li) { color: #d9d2e3; }
[data-theme-root].dark .yw-gx-bars > li + li, [data-theme-root].dark :is(.yw-gx-trend-row, .yw-gx-team-row, .yw-gx-people li) { border-top-color: #1c2843; }
[data-theme-root].dark a.yw-gx-bar:hover, [data-theme-root].dark a.yw-gx-bar:focus-visible { background: #142036; }
[data-theme-root].dark a.yw-gx-bar:hover .yw-gx-bar-label { color: #c5a8ff; }
[data-theme-root].dark li[data-selected] > .yw-gx-bar { background: #1c1430; }
[data-theme-root].dark li[data-selected] .yw-gx-bar-label { color: #c5a8ff; }
[data-theme-root].dark .yw-gx-bar-track { background: #142036; }
[data-theme-root].dark .yw-gx-bar-track > i { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #4a3a63 2px 4px); }
[data-theme-root].dark .yw-gx-bar-track[data-tone="pink"] > i { background: repeating-linear-gradient(125deg, #e07fb4 0 2px, #5a3a4b 2px 4px); }
[data-theme-root].dark .yw-gx-bar-track[data-tone="grey"] > i { background: repeating-linear-gradient(125deg, #8b8794 0 2px, #17243d 2px 4px); }
[data-theme-root].dark .yw-gx-bar-note[data-tone="watch"] { color: #e6bd7f; }
[data-theme-root].dark :is(.yw-gx-bar-note[data-tone="bad"], .yw-gx-note[data-tone="bad"], .yw-gx-bar-foot[data-tone="bad"], li[data-slowest] .yw-gx-bar-value > span, .yw-gx-team-counts > [data-tone="bad"], .yw-gx-team-evidence [data-tone="bad"]) { color: #e69ac4; }
[data-theme-root].dark :is(.yw-gx-team-counts > [data-tone="good"], .yw-gx-team-evidence [data-tone="good"]) { color: #7fd3b4; }
[data-theme-root].dark :is(.yw-gx-team-counts > [data-tone="accent"], .yw-gx-people-likely) { color: #c5a8ff; }
[data-theme-root].dark .yw-guests-page .yw-gx-filters button[aria-haspopup="listbox"], [data-theme-root].dark .yw-gx-pager { border-color: #1c2843; background: #142036; box-shadow: none; color: #f3eef8; }
[data-theme-root].dark .yw-gx-pager > a { color: #d9d2e3; }
[data-theme-root].dark .yw-gx-pager > a:hover { background: #1c2843; color: #c5a8ff; }
[data-theme-root].dark .yw-gx-col:hover, [data-theme-root].dark .yw-gx-col[data-active="true"] { background: #1c1430; }
[data-theme-root].dark .yw-gx-rail { border-bottom-color: #33405e; background: linear-gradient(to bottom, #1c2843 0 1px, transparent 1px calc(50% - .5px), #1c2843 calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px)); }
[data-theme-root].dark .yw-gx-plot[data-axis] .yw-gx-rail { background: linear-gradient(to bottom, #1c2843 0 1px, transparent 1px calc(25% - .5px), #1c2843 calc(25% - .5px) calc(25% + .5px), transparent calc(25% + .5px) calc(50% - .5px), #1c2843 calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px) calc(75% - .5px), #1c2843 calc(75% - .5px) calc(75% + .5px), transparent calc(75% + .5px)); }
[data-theme-root].dark .yw-gx-cols[data-many] .yw-gx-col[data-active="true"] .yw-gx-tag { background: #0d1527; box-shadow: none; }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="violet"] { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #4a3a63 2px 4px); }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="deep"] { background: #8b5cf6; }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="soft"] { background: #5c4a78; }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="grey"] { background: repeating-linear-gradient(125deg, #8b8794 0 2px, #243352 2px 4px); }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="lilac"] { background: #3d3157; }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="slate"] { background: #6b6574; }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="pink"] { background: repeating-linear-gradient(125deg, #e07fb4 0 2px, #5a3a4b 2px 4px); }
[data-theme-root].dark :is(.yw-gx-stack > i, .yw-gx-key i)[data-tone="rose"] { background: #9c5878; }
[data-theme-root].dark .yw-insight-art[data-art="guests"] { background-image: url("/dashboard-landscapes/coast-simple-night.webp"); }
[data-theme-root].dark .yw-gx-insight .yw-insight-count { background: rgba(255, 255, 255, .1); color: #d9c8f0; }
[data-theme-root].dark .yw-gx-insight-report { background: rgba(255, 255, 255, .14); }
[data-theme-root].dark .yw-gx-insight-report:hover { background: rgba(255, 255, 255, .22); }
[data-theme-root].dark :is(.yw-gx-team-evidence, .yw-gx-people) { background: #142036; }
[data-theme-root].dark .yw-gx-people-form :is(input:not([type="hidden"]), select) { background: #0d1527; color: #f3eef8; }
[data-theme-root].dark .yw-gx-quiet-button:hover { color: #f3eef8; }
[data-theme-root].dark .yw-gx-scroll[data-scroll="list"] { scrollbar-color: #33405e transparent; }

@media (prefers-reduced-motion: reduce) {
  .yw-gx-bar-track > i, .yw-gx-stack, .yw-gx-dots > i { animation: none; }
  .yw-gx-bar, .yw-gx-col { transition: none; }
}

/* ======================================================== All Reviews == */
/* 10/11: the filters are the header's one universal filter; what narrows
   the list now is a row of chips, each the way back out; the reviews are
   rows in one card that scrolls inside itself; a review's reply is the one
   tinted panel its row allows. */
.yw-gx-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.yw-gx-chip { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 8px 0 12px; border: 1px solid #e8e6e9; border-radius: 20px; background: #fff; box-shadow: 0 2px 6px #00000009; color: #343039; font-size: 13px; text-decoration: none; transition: background .16s ease, border-color .16s ease; }
.yw-gx-chip > span { display: inline-grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; color: #87818c; font-size: 13px; line-height: 1; }
.yw-gx-chip:hover { border-color: #d9cbe5; background: #faf7fd; }
.yw-gx-chip:hover > span { background: #eee5fd; color: #7433d4; }
.yw-gx-chip-clear { margin-left: 4px; color: #8553c2; font-size: 13px; font-weight: 500; text-decoration: none; }
.yw-gx-chip-clear:hover { text-decoration: underline; text-underline-offset: 2px; }

/* The list beside its side panel (10/11, owner: "a lot of containers are
   wasting space"): the reviews keep a readable width and the room beside
   them holds what the list contains, each count a filter. */
.yw-gx-all-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); gap: 16px; align-items: start; }
.yw-gx-all-body > * { margin: 0; }
.yw-gx-rail { position: sticky; top: 16px; }
.yw-gx-rail > .yw-gx-rows-caption:first-of-type { margin-top: 8px; }
.yw-gx-rail .yw-gx-bars[data-compact] .yw-gx-bar { grid-template-columns: minmax(0, 9rem) minmax(1.5rem, 1fr) auto; gap: 10px; padding: 7px 8px; }
.yw-gx-rail .yw-gx-bar-value { font-size: 13px; }
@media (max-width: 1100px) { .yw-gx-all-body { grid-template-columns: minmax(0, 1fr); } .yw-gx-rail { position: static; } }
/* On a phone or narrow tablet the list scrolls with the PAGE (10/19, Jacobo:
   "allow me to scroll ... all the way"). The inner scroll box above keeps the
   filters in view on a desktop, but on a small screen a box of
   100dvh-250px with overscroll contained traps the thumb inside a short
   window and the page never reaches the end of the list. */
@media (max-width: 760px) { .yw-gx-reviews { max-height: none; min-height: 0; overflow: visible; overscroll-behavior: auto; } }
.yw-gx-list .yw-card-head { flex-wrap: wrap; row-gap: 12px; padding-bottom: 14px; border-bottom: 1px solid #eae8ec; }
.yw-gx-list .yw-card-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.yw-gx-list .yw-card-title .yw-gx-list-compare { font-size: 13px; letter-spacing: 0; }
.yw-gx-list .yw-card-sub { font-size: 12.5px; }
.yw-gx-search { display: flex; flex: 0 1 320px; flex-wrap: wrap; justify-content: flex-end; margin-left: auto; }
.yw-gx-search input[type="search"] { width: 100%; height: 38px; padding: 0 14px; border: 1px solid transparent; border-radius: 10px; background: #f1eff3; color: #202024; font-size: 14px; }
.yw-gx-search input[type="search"]::placeholder { color: #a09aa4; }
.yw-gx-search input[type="search"]:focus { border-color: #b993ff; background: #fff; outline: none; }
.yw-gx-search > p { width: 100%; margin-top: 6px; color: #87818c; font-size: 13px; text-align: right; }

.yw-gx-reviews { max-height: calc(100dvh - 250px); min-height: 320px; margin: 0 -23px -23px; padding: 0 23px 8px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d9cbe5 transparent; list-style: none; }
.yw-gx-review { padding: 22px 0; border-top: 1px solid #eae8ec; scroll-margin-top: 12px; }
.yw-gx-review:first-child { border-top: 0; }
.yw-gx-review[data-focus] { margin: 0 -14px; padding: 22px 14px; border-radius: 16px; background: #f6f1fb; box-shadow: inset 0 0 0 1px #e3d6f6; }
.yw-gx-review-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; }
.yw-gx-avatar { display: inline-grid; width: 40px; height: 40px; place-items: center; border-radius: 50%; background: #eee5fd; color: #6d28d9; font-size: 15px; font-weight: 500; }
.yw-gx-review-name { margin: 0; overflow: hidden; color: #202024; font-size: 16px; font-weight: 500; letter-spacing: -.3px; text-overflow: ellipsis; white-space: nowrap; }
.yw-gx-review-meta { display: flex; flex-wrap: wrap; gap: 2px 12px; margin: 3px 0 0; color: #87818c; font-size: 13px; }
.yw-gx-review-meta > [data-tone="bad"] { color: #a96883; }
.yw-gx-review-score { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.yw-gx-stars { display: inline-flex; align-items: center; gap: 8px; }
.yw-gx-stars [class~="text-rose-700"] { color: #8a45f0; }
.yw-gx-stars [class~="text-zinc-300"] { color: #e2dcea; }
.yw-gx-stars [class*="text-[21px]"] { font-size: 18px; }
.yw-gx-stars [class*="text-[17px]"] { color: #202024; font-size: 15px; font-weight: 500; }
.yw-gx-raw { color: #929097; font-size: 12.5px; }
.yw-gx-state { display: inline-flex; align-items: center; gap: 7px; color: #59535f; font-size: 12.5px; white-space: nowrap; }
.yw-gx-state > i { display: block; width: 7px; height: 7px; border-radius: 50%; background: #a6a0ac; }
.yw-gx-state[data-tone="critical"] > i, .yw-gx-state[data-tone="watch"] > i { background: #d85e9e; }
.yw-gx-state[data-tone="good"] > i { background: #2f8a6d; }
.yw-gx-state[data-tone="accent"] > i { background: #7c3aed; }
.yw-gx-review-text { max-width: 78ch; margin: 14px 0 0 54px; color: #343039; font-size: 15px; line-height: 1.7; white-space: pre-wrap; }
.yw-gx-review-text mark { padding: 0 2px; border-radius: 4px; background: #f6ecdc; color: #202024; }
.yw-gx-review-quiet { margin: 10px 0 0 54px; color: #929097; font-size: 12.5px; }
.yw-gx-review-source .yw-gx-review-quiet { margin: 0; }
.yw-gx-themes-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0 54px; }
.yw-gx-theme { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 20px; background: #f1eff3; color: #59535f; font-size: 12px; cursor: help; }
.yw-gx-theme[data-sentiment="positive"] { background: #eee5fd; color: #6d28d9; }
.yw-gx-theme[data-sentiment="negative"] { background: #fbf0f4; color: #a96883; }
.yw-gx-review-source { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; margin: 10px 0 0 54px; }
.yw-gx-review-source > div { margin: 0; color: #929097; font-size: 12.5px; }
.yw-gx-review-source > div a { color: #8553c2; font-weight: 500; }
.yw-gx-reply-done, .yw-gx-replybox { margin: 14px 0 0 54px; padding: 14px 16px; border-radius: 14px; background: #f6f5f7; }
.yw-gx-reply-label { margin: 0 0 6px; color: #87818c; font-size: 12.5px; font-weight: 500; }
.yw-gx-reply-text { margin: 0; color: #59535f; font-size: 14px; line-height: 1.65; white-space: pre-wrap; }
.yw-gx-reply-error { margin: 0 0 8px; color: #a96883; font-size: 13px; }
.yw-guests-page .yw-gx-reply-input { padding: 10px 12px; border: 1px solid transparent; border-radius: 10px; background: #fff; color: #202024; font-size: 14px; line-height: 1.6; outline: none; }
.yw-guests-page .yw-gx-reply-input::placeholder { color: #a09aa4; }
.yw-guests-page .yw-gx-reply-input:focus { border-color: #b993ff; }
.yw-guests-page .yw-gx-btn { display: inline-flex; height: 34px; align-items: center; justify-content: center; padding: 0 14px; border: 0; border-radius: 10px; background: #7c3aed; color: #fff; font-size: 13px; font-weight: 500; cursor: pointer; transition: background .16s ease, transform .16s ease; }
.yw-guests-page .yw-gx-btn:hover { background: #7130df; }
.yw-guests-page .yw-gx-btn--quiet { background: #fff; box-shadow: inset 0 0 0 1px #e2e1e4; color: #343039; }
.yw-guests-page .yw-gx-btn--quiet:hover { background: #faf8fc; }
.yw-gx-review-none { color: #87818c; font-size: 14px; }
.yw-gx-more-row { padding: 18px 0 10px; text-align: center; }
.yw-gx-more { display: inline-flex; align-items: center; gap: 4px; height: 36px; padding: 0 16px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #e2e1e4; color: #343039; font-size: 13px; font-weight: 500; text-decoration: none; }
.yw-gx-more > span { color: #929097; font-weight: 400; }
.yw-gx-more:hover { background: #faf8fc; color: #7c3aed; }
.yw-gx-nudge-line[data-tone="bad"] { color: #a96883; }

[data-theme-root].dark .yw-gx-chip { border-color: #1c2843; background: #142036; box-shadow: none; color: #d9d2e3; }
[data-theme-root].dark .yw-gx-chip:hover { background: #1c2843; }
[data-theme-root].dark .yw-gx-chip > span { color: #a297ab; }
[data-theme-root].dark .yw-gx-chip:hover > span { background: #2a1f45; color: #c5a8ff; }
[data-theme-root].dark .yw-gx-chip-clear { color: #c5a8ff; }
[data-theme-root].dark .yw-gx-list .yw-card-head, [data-theme-root].dark .yw-gx-review { border-color: #1c2843; }
[data-theme-root].dark .yw-gx-search input[type="search"] { background: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-gx-search input[type="search"]:focus { background: #0d1527; }
[data-theme-root].dark .yw-gx-reviews { scrollbar-color: #33405e transparent; }
[data-theme-root].dark .yw-gx-review[data-focus] { background: #1c1430; box-shadow: inset 0 0 0 1px #3d3157; }
[data-theme-root].dark .yw-gx-avatar { background: #2a1f45; color: #c5a8ff; }
[data-theme-root].dark :is(.yw-gx-review-name, .yw-gx-stars [class*="text-[17px]"]) { color: #f3eef8; }
[data-theme-root].dark .yw-gx-review-text { color: #e4dfea; }
[data-theme-root].dark :is(.yw-gx-review-meta, .yw-gx-review-quiet, .yw-gx-raw, .yw-gx-reply-label, .yw-gx-review-source > div, .yw-gx-review-none, .yw-gx-more > span, .yw-gx-search > p) { color: #a297ab; }
[data-theme-root].dark .yw-gx-stars [class~="text-rose-700"] { color: #b993ff; }
[data-theme-root].dark .yw-gx-stars [class~="text-zinc-300"] { color: #33405e; }
[data-theme-root].dark .yw-gx-state { color: #d9d2e3; }
[data-theme-root].dark .yw-gx-review-text mark { background: #4a3d24; color: #f3eef8; }
[data-theme-root].dark .yw-gx-theme { background: #142036; color: #c3b9cc; }
[data-theme-root].dark .yw-gx-theme[data-sentiment="positive"] { background: #2a1f45; color: #c5a8ff; }
[data-theme-root].dark .yw-gx-theme[data-sentiment="negative"] { background: #3a2433; color: #f0b8d2; }
[data-theme-root].dark :is(.yw-gx-reply-done, .yw-gx-replybox) { background: #142036; }
[data-theme-root].dark .yw-gx-reply-text { color: #d9d2e3; }
[data-theme-root].dark .yw-guests-page .yw-gx-reply-input { background: #0d1527; color: #f3eef8; }
[data-theme-root].dark .yw-guests-page .yw-gx-btn--quiet, [data-theme-root].dark .yw-gx-more { background: #142036; box-shadow: inset 0 0 0 1px #1c2843; color: #f3eef8; }
[data-theme-root].dark :is(.yw-gx-review-meta > [data-tone="bad"], .yw-gx-reply-error, .yw-gx-nudge-line[data-tone="bad"]) { color: #e69ac4; }
[data-theme-root].dark .yw-gx-nudge-line { color: #f3eef8; }

/* ================================================= the forms, second pass == */
/* 10/11 (owner: "we are only using one single type of loading bar when we
   have multiple chart designs to choose from"): each card its own form, and
   every explaining sentence a hover. The hover is the app's black one
   (skin/hover.css tokens), opened by data-tip on the row or the mark. */
.yw-guests-page [data-tip] { position: relative; }
.yw-guests-page [data-tip]::after {
  position: absolute; bottom: calc(100% + 8px); left: 0; z-index: 12; width: max-content; max-width: 300px;
  padding: 7px 11px; border: 1px solid var(--yw-tip-line); border-radius: 8px; background: var(--yw-tip-bg);
  box-shadow: var(--yw-tip-shadow); color: var(--yw-tip-text); content: attr(data-tip);
  font-size: 12px; font-weight: 400; letter-spacing: 0; line-height: 1.4; text-align: left; text-transform: none; white-space: normal;
  opacity: 0; pointer-events: none; transform: translateY(4px); transition: opacity .16s ease, transform .24s cubic-bezier(.2, .8, .2, 1);
}
.yw-guests-page [data-tip]:is(:hover, :focus-visible)::after { opacity: 1; transform: translateY(0); transition-delay: .1s; }
/* Small marks hang their hover from their middle. */
.yw-guests-page :is(.yw-gx-split > i, .yw-gx-split-key > li, .yw-gx-spark > i, .yw-gx-spark-trend)[data-tip]::after { left: 50%; transform: translate(-50%, 4px); }
.yw-guests-page :is(.yw-gx-split > i, .yw-gx-split-key > li, .yw-gx-spark > i, .yw-gx-spark-trend)[data-tip]:is(:hover, :focus-visible)::after { transform: translate(-50%, 0); }
.yw-guests-page :is(.yw-gx-split > i, .yw-gx-spark > i)[data-tip]::after { white-space: nowrap; }

/* ---- the star split: one bar, five parts, its key ------------------------- */
.yw-gx-split-wrap { margin-top: 20px; }
.yw-gx-split { display: flex; gap: 2px; height: 12px; }
.yw-gx-split > i { display: block; min-width: 4px; flex-basis: 0; transform-origin: left; animation: yw-scale-in 1s cubic-bezier(.2, .8, .2, 1) backwards; }
.yw-gx-split > i:first-child { border-radius: 6px 0 0 6px; }
.yw-gx-split > i:last-child { border-radius: 0 6px 6px 0; }
.yw-gx-split > i:only-child { border-radius: 6px; }
.yw-gx-split-key { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; padding: 0; list-style: none; }
.yw-gx-split-key > li > :is(a, span) { display: inline-flex; align-items: center; gap: 6px; color: #59535f; font-size: 13px; text-decoration: none; white-space: nowrap; }
.yw-gx-split-key > li > a:hover .yw-gx-split-name { color: #7c3aed; }
.yw-gx-split-key i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.yw-gx-split-count { color: #202024; font-weight: 500; }
:is(.yw-gx-split, .yw-gx-split-key) i[data-tone="deep"] { background: #7c3aed; }
:is(.yw-gx-split, .yw-gx-split-key) i[data-tone="violet"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
:is(.yw-gx-split, .yw-gx-split-key) i[data-tone="grey"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #e2dee6 2px 4px); }
:is(.yw-gx-split, .yw-gx-split-key) i[data-tone="pink"] { background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); }
:is(.yw-gx-split, .yw-gx-split-key) i[data-tone="rose"] { background: #d85e9e; }
.yw-gx-split > i[data-tone="empty"] { background: #eeedf1; }
.yw-gx-hero .yw-gx-hero-stats { margin-top: 14px; }

/* ---- ratings by site: the pip meter --------------------------------------- */
.yw-gx-sitelist { margin: 8px 0 0; padding: 0; list-style: none; }
.yw-gx-sitelist > li + li { border-top: 1px solid #eae8ec; }
.yw-gx-site { display: grid; grid-template-columns: minmax(6rem, 1fr) auto 4rem 5.8rem; align-items: center; gap: 12px; margin: 0 -8px; padding: 11px 8px; border-radius: 10px; color: #59535f; font-size: 14px; text-decoration: none; transition: background .16s ease, opacity .2s ease; }
a.yw-gx-site:hover, a.yw-gx-site:focus-visible { background: #f6f2fa; }
a.yw-gx-site:hover .yw-gx-bar-label { color: #7c3aed; }
a.yw-gx-site:focus-visible { outline: 2px solid #b993ff; outline-offset: -2px; }
.yw-gx-site-name { display: flex; min-width: 0; flex-wrap: wrap; align-items: baseline; gap: 2px 7px; }
.yw-gx-site .yw-gx-bar-label { white-space: normal; }
.yw-gx-pips { display: inline-flex; gap: 3px; }
.yw-gx-pips > i { display: block; width: 11px; height: 11px; border-radius: 50%; background: #e6e3ea; }
.yw-gx-pips > i[data-fill="full"] { background: #8a45f0; }
.yw-gx-pips > i[data-fill="part"] { background: linear-gradient(90deg, #8a45f0 var(--yw-pip, 50%), #e6e3ea 0); }
.yw-gx-pips[data-tone="pink"] > i[data-fill="full"] { background: #d85e9e; }
.yw-gx-pips[data-tone="pink"] > i[data-fill="part"] { background: linear-gradient(90deg, #d85e9e var(--yw-pip, 50%), #e6e3ea 0); }
.yw-gx-site-score { color: #202024; font-size: 14px; font-weight: 500; text-align: right; white-space: nowrap; }
.yw-gx-site-score[data-tone="pink"] { color: #a96883; }
.yw-gx-site-count { color: #929097; font-size: 13px; text-align: right; white-space: nowrap; }
/* A narrow card (a laptop, a squeezed pane): the count goes under the name
   rather than squeezing it to nothing. */
@media (max-width: 1280px) {
  .yw-gx-site { grid-template-columns: minmax(6rem, 1fr) auto 4rem; row-gap: 2px; }
  .yw-gx-site-count { grid-column: 1; grid-row: 2; font-size: 12.5px; text-align: left; }
}
li[data-selected] > .yw-gx-site { background: #f3ecfb; }
li[data-selected] .yw-gx-site .yw-gx-bar-label { color: #6d28d9; font-weight: 500; }
li[data-dim] > .yw-gx-site { opacity: .55; }
li[data-dim] > .yw-gx-site:hover { opacity: 1; }

/* ---- reviews per stay: a target track per site ---------------------------- */
.yw-gx-stayrows { margin: 6px 0 0; padding: 0; list-style: none; }
.yw-gx-stayrows > li + li { border-top: 1px solid #eae8ec; }
.yw-gx-stayrow { display: grid; grid-template-columns: minmax(0, 8.5rem) minmax(2rem, 1fr) auto; align-items: center; gap: 12px; margin: 0 -8px; padding: 10px 8px; border-radius: 10px; color: #59535f; font-size: 14px; }
.yw-gx-stayrow:hover { background: #f6f2fa; }
.yw-gx-stayrow .yw-gx-bar-value { min-width: 5.5rem; }
.yw-gx-stayrow .yw-gx-bar-name { flex-wrap: wrap; gap: 2px 7px; }
.yw-gx-stayrow .yw-gx-bar-label { white-space: normal; line-height: 1.3; }
.yw-gx-stayrow .yw-gx-bar-tag[data-tone="bad"] { color: #a96883; }
.yw-gx-mini-track { position: relative; display: block; height: 10px; border-radius: 5px; background: #f0edf2; }
.yw-gx-mini-track > i { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 5px; background: repeating-linear-gradient(125deg, #d65e9e 0 2px, #f9dce9 2px 4px); transform-origin: left; animation: yw-scale-in 1s cubic-bezier(.2, .8, .2, 1) both; }
.yw-gx-mini-track > i[data-met] { background: repeating-linear-gradient(125deg, #a5a0ab 0 2px, #e5e2e9 2px 4px); }
.yw-gx-mini-track > b { position: absolute; top: -3px; width: 1.5px; height: 16px; background: #7a647e; }

/* ---- a few named columns (reviews per week) ------------------------------- */
.yw-gx-chart[data-few] .yw-gx-cols { width: min(100%, 26rem); margin: 0 auto; gap: 8px; height: 176px; }
.yw-gx-chart[data-few] .yw-gx-stack { right: 20%; left: 20%; }
.yw-gx-chart[data-few] .yw-gx-tag { font-size: 13px; }
.yw-gx-chart[data-few] .yw-gx-label { height: auto; min-height: 24px; text-align: center; white-space: normal; line-height: 1.25; }
.yw-gx-col-note { position: absolute; right: 0; bottom: 8px; left: 0; color: #9a805f; font-size: 12px; text-align: center; }

@keyframes yw-gx-draw { to { stroke-dashoffset: 0; } }

/* ---- complaints over time: small multiples -------------------------------- */
.yw-gx-sparks { margin-top: 6px; }
.yw-gx-spark-rows { margin: 0; padding: 0; list-style: none; }
.yw-gx-spark-row { display: grid; grid-template-columns: minmax(0, 14rem) 16rem 7rem 8rem auto; justify-content: start; align-items: center; gap: 18px 22px; padding: 10px 0; border-top: 1px solid #eae8ec; }
.yw-gx-spark-rows > .yw-gx-spark-row:first-child { border-top: 0; }
.yw-gx-spark-axisrow { padding: 4px 0 0; border-top: 0; }
.yw-gx-spark-name { overflow: hidden; color: #202024; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.yw-gx-spark-name a { color: inherit; text-decoration: none; }
.yw-gx-spark-name a:hover { color: #7c3aed; }
.yw-gx-spark { display: grid; align-items: end; height: 36px; gap: 3px; }
.yw-gx-spark > i { position: relative; display: flex; height: 100%; flex-direction: column; justify-content: flex-end; border-bottom: 1px solid #e2dee6; }
.yw-gx-spark > i[data-empty] { border-bottom: 1px dotted #c9c3cf; }
.yw-gx-spark > i > b { display: block; width: 100%; border-radius: 2px 2px 0 0; background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); transform-origin: bottom; animation: yw-gx-grow .6s cubic-bezier(.2, .7, .2, 1) both; }
.yw-gx-spark-axis { display: grid; color: #a9a0af; font-size: 11.5px; text-align: center; }
.yw-gx-spark-total { color: #202024; font-size: 14px; font-weight: 500; white-space: nowrap; }
.yw-gx-spark-total > span { margin-left: 5px; color: #929097; font-size: 12.5px; font-weight: 400; }
.yw-gx-spark-trend { justify-self: start; font-size: 12px; cursor: default; }
.yw-gx-spark-trend:not([data-pace]) { color: #87818c; }
/* The tracking word (theme-track.tsx) as a quiet status word, not a shout. */
.yw-gx-track { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.yw-gx-track :is(a, button) { padding: 0; border: 0; background: none; color: #87818c; font-size: 12.5px; font-weight: 400; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.yw-gx-track a[class*="rose"] { color: #a96883; }
.yw-gx-track a[class*="emerald"] { color: #2f8a6d; }
.yw-gx-track a[class*="violet"] { color: #7433d4; }
.yw-gx-track button:hover, .yw-gx-track a:hover { color: #7c3aed; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 1000px) { .yw-gx-spark-row { grid-template-columns: minmax(0, 8rem) minmax(6rem, 1fr) auto; } .yw-gx-spark-row > :nth-child(n + 4) { display: none; } }

/* ---- praise and complaints by topic: one axis ----------------------------- */
.yw-gx-topic-key { display: inline-flex; gap: 14px; color: #87818c; font-size: 12.5px; }
.yw-gx-topic-key > span { display: inline-flex; align-items: center; gap: 6px; }
.yw-gx-topic-key i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.yw-gx-topics { margin: 8px 0 0; padding: 0; list-style: none; }
.yw-gx-topics > li + li { border-top: 1px solid #eae8ec; }
.yw-gx-topics[data-cols="2"] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 44px; }
.yw-gx-topics[data-cols="2"] > li:nth-child(2) { border-top: 0; }
.yw-gx-topics[data-cols="2"] .yw-gx-topic { grid-template-columns: minmax(0, 13rem) 1.8rem minmax(2rem, 1fr) minmax(2rem, 1fr) 1.8rem; }
.yw-gx-topic { display: grid; grid-template-columns: minmax(0, 9rem) 1.8rem minmax(2rem, 1fr) minmax(2rem, 1fr) 1.8rem; align-items: center; gap: 8px; margin: 0 -8px; padding: 9px 8px; border-radius: 10px; color: #59535f; font-size: 14px; text-decoration: none; transition: background .16s ease; }
.yw-gx-topic:hover { background: #f6f2fa; }
.yw-gx-topic:hover .yw-gx-topic-name { color: #7c3aed; }
.yw-gx-topic-name { overflow: hidden; color: #343039; text-overflow: ellipsis; white-space: nowrap; transition: color .16s ease; }
.yw-gx-topic-neg { color: #a96883; font-size: 13px; font-weight: 500; text-align: right; }
.yw-gx-topic-pos { color: #6d28d9; font-size: 13px; font-weight: 500; }
.yw-gx-topic-track { position: relative; display: block; height: 10px; background: #f0edf2; }
.yw-gx-topic-track[data-side="neg"] { border-radius: 5px 0 0 5px; }
.yw-gx-topic-track[data-side="pos"] { border-radius: 0 5px 5px 0; border-left: 1.5px solid #a9a0af; }
.yw-gx-topic-track > i { position: absolute; top: 0; bottom: 0; animation: yw-scale-in 1s cubic-bezier(.2, .8, .2, 1) both; }
.yw-gx-topic-track[data-side="neg"] > i, :is(.yw-gx-topic-key) i[data-side="neg"] { right: 0; border-radius: 5px 0 0 5px; background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); transform-origin: right; }
.yw-gx-topic-track[data-side="pos"] > i, :is(.yw-gx-topic-key) i[data-side="pos"] { left: 0; border-radius: 0 5px 5px 0; background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); transform-origin: left; }
.yw-gx-topic-key i { border-radius: 3px; }

/* ---- complaints and praise: the donuts ------------------------------------ */
.yw-gx-donut-body { display: flex; align-items: center; gap: 26px; margin-top: 14px; }
.yw-gx-donut { position: relative; width: 140px; height: 140px; flex-shrink: 0; }
.yw-gx-donut > svg { width: 140px; height: 140px; transform-origin: center; animation: yw-gx-donut-in .7s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes yw-gx-donut-in { from { opacity: 0; transform: rotate(-24deg) scale(.92); } }
.yw-gx-donut path { stroke: #fbfbfb; stroke-width: 1.2; }
.yw-gx-donut-hole { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; pointer-events: none; }
.yw-gx-donut-hole > strong { color: #202024; font-size: 24px; font-weight: 500; letter-spacing: -.5px; }
.yw-gx-donut-hole > span { margin-top: 2px; color: #87818c; font-size: 12px; }
.yw-gx-legend { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; gap: 9px; margin: 0; padding: 0; list-style: none; }
.yw-gx-legend > li > :is(a, span) { display: flex; min-width: 0; align-items: baseline; gap: 10px; color: #59535f; font-size: 14px; text-decoration: none; }
.yw-gx-legend > li > a:hover .yw-gx-legend-label { color: #7c3aed; }
.yw-gx-legend i { width: 10px; height: 10px; flex-shrink: 0; align-self: center; border-radius: 3px; }
.yw-gx-legend-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yw-gx-legend strong { margin-left: auto; color: #202024; font-size: 15px; font-weight: 500; }
.yw-gx-legend-pct { min-width: 44px; color: #87818c; font-size: 13px; text-align: right; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone] { fill: #c5c0cb; background: #c5c0cb; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-0"] { fill: #d85e9e; background: #d85e9e; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-1"] { fill: #e283b4; background: #e283b4; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-2"] { fill: #eaa3c8; background: #eaa3c8; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-3"] { fill: #f1bfd9; background: #f1bfd9; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-4"] { fill: #f6d4e5; background: #f6d4e5; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-5"] { fill: #f9e3ee; background: #f9e3ee; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-0"] { fill: #7c3aed; background: #7c3aed; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-1"] { fill: #9a68f1; background: #9a68f1; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-2"] { fill: #b48cf2; background: #b48cf2; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-3"] { fill: #c9aaf5; background: #c9aaf5; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-4"] { fill: #dbc6f8; background: #dbc6f8; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-5"] { fill: #e9dcfb; background: #e9dcfb; }
:is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="other"] { fill: #dedae2; background: #dedae2; }

/* ---- the Wizard card: a fixed height, so its buttons sit at the foot ------- */
.yw-gx-insight { height: 380px; min-height: 0; }
.yw-guests-top > .yw-gx-insight { height: auto; min-height: 380px; }

/* ---- dark ----------------------------------------------------------------- */
[data-theme-root].dark :is(.yw-gx-split-key > li > a, .yw-gx-split-key > li > span, .yw-gx-site, .yw-gx-stayrow, .yw-gx-topic, .yw-gx-legend > li > a, .yw-gx-legend > li > span) { color: #d9d2e3; }
[data-theme-root].dark :is(.yw-gx-split-count, .yw-gx-site-score, .yw-gx-spark-name, .yw-gx-spark-total, .yw-gx-donut-hole > strong, .yw-gx-legend strong) { color: #f3eef8; }
[data-theme-root].dark :is(.yw-gx-site-count, .yw-gx-spark-total > span, .yw-gx-donut-hole > span, .yw-gx-legend-pct, .yw-gx-topic-key, .yw-gx-spark-axis, .yw-gx-track :is(a, button), .yw-gx-spark-trend:not([data-pace])) { color: #a297ab; }
[data-theme-root].dark :is(.yw-gx-sitelist > li + li, .yw-gx-stayrows > li + li, .yw-gx-topics > li + li, .yw-gx-spark-row) { border-top-color: #1c2843; }
[data-theme-root].dark :is(a.yw-gx-site:hover, .yw-gx-stayrow:hover, .yw-gx-topic:hover) { background: #142036; }
[data-theme-root].dark :is(a.yw-gx-site:hover .yw-gx-bar-label, .yw-gx-topic:hover .yw-gx-topic-name) { color: #c5a8ff; }
[data-theme-root].dark li[data-selected] > .yw-gx-site { background: #1c1430; }
[data-theme-root].dark li[data-selected] .yw-gx-site .yw-gx-bar-label { color: #c5a8ff; }
[data-theme-root].dark .yw-gx-topic-name { color: #e4dfea; }
[data-theme-root].dark :is(.yw-gx-split, .yw-gx-split-key) i[data-tone="deep"] { background: #a883ee; }
[data-theme-root].dark :is(.yw-gx-split, .yw-gx-split-key) i[data-tone="violet"], [data-theme-root].dark .yw-gx-topic-track[data-side="pos"] > i, [data-theme-root].dark .yw-gx-topic-key i[data-side="pos"] { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #4a3a63 2px 4px); }
[data-theme-root].dark :is(.yw-gx-split, .yw-gx-split-key) i[data-tone="grey"], [data-theme-root].dark .yw-gx-mini-track > i[data-met] { background: repeating-linear-gradient(125deg, #8b8794 0 2px, #243352 2px 4px); }
[data-theme-root].dark :is(.yw-gx-split, .yw-gx-split-key) i[data-tone="pink"], [data-theme-root].dark .yw-gx-mini-track > i, [data-theme-root].dark .yw-gx-spark > i > b, [data-theme-root].dark .yw-gx-topic-track[data-side="neg"] > i, [data-theme-root].dark .yw-gx-topic-key i[data-side="neg"] { background: repeating-linear-gradient(125deg, #e07fb4 0 2px, #5a3a4b 2px 4px); }
[data-theme-root].dark :is(.yw-gx-split, .yw-gx-split-key) i[data-tone="rose"] { background: #e07fb4; }
[data-theme-root].dark .yw-gx-split > i[data-tone="empty"], [data-theme-root].dark :is(.yw-gx-mini-track, .yw-gx-topic-track) { background: #142036; }
[data-theme-root].dark .yw-gx-mini-track > b { background: #c3b9cc; }
[data-theme-root].dark .yw-gx-topic-track[data-side="pos"] { border-left-color: #6b6574; }
[data-theme-root].dark .yw-gx-pips > i { background: #243352; }
[data-theme-root].dark .yw-gx-pips > i[data-fill="full"] { background: #a883ee; }
[data-theme-root].dark .yw-gx-pips > i[data-fill="part"] { background: linear-gradient(90deg, #a883ee var(--yw-pip, 50%), #243352 0); }
[data-theme-root].dark .yw-gx-pips[data-tone="pink"] > i[data-fill="full"] { background: #e07fb4; }
[data-theme-root].dark .yw-gx-pips[data-tone="pink"] > i[data-fill="part"] { background: linear-gradient(90deg, #e07fb4 var(--yw-pip, 50%), #243352 0); }
[data-theme-root].dark :is(.yw-gx-site-score[data-tone="pink"], .yw-gx-topic-neg, .yw-gx-stayrow .yw-gx-bar-tag[data-tone="bad"], .yw-gx-track a[class*="rose"]) { color: #e69ac4; }
[data-theme-root].dark .yw-gx-topic-pos { color: #c5a8ff; }
[data-theme-root].dark .yw-gx-track a[class*="emerald"] { color: #7fd3b4; }
[data-theme-root].dark .yw-gx-track a[class*="violet"] { color: #c5a8ff; }
[data-theme-root].dark .yw-gx-col-note { color: #e6bd7f; }
[data-theme-root].dark .yw-gx-spark > i { border-bottom-color: #1c2843; }
[data-theme-root].dark .yw-gx-spark > i[data-empty] { border-bottom-color: #33405e; }
[data-theme-root].dark .yw-gx-donut path { stroke: #0d1527; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-0"] { fill: #e07fb4; background: #e07fb4; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-1"] { fill: #b9618f; background: #b9618f; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-2"] { fill: #934d73; background: #934d73; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-3"] { fill: #6f3d5a; background: #6f3d5a; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-4"] { fill: #563247; background: #563247; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="negative-5"] { fill: #432a3a; background: #432a3a; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-0"] { fill: #a883ee; background: #a883ee; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-1"] { fill: #8b6ac4; background: #8b6ac4; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-2"] { fill: #6f549d; background: #6f549d; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-3"] { fill: #574279; background: #574279; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-4"] { fill: #45355e; background: #45355e; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="positive-5"] { fill: #372b4a; background: #372b4a; }
[data-theme-root].dark :is(.yw-gx-donut path, .yw-gx-legend i)[data-tone="other"] { fill: #243352; background: #243352; }

@media (prefers-reduced-motion: reduce) {
  .yw-gx-split > i, .yw-gx-mini-track > i, .yw-gx-spark > i > b, .yw-gx-topic-track > i, .yw-gx-donut > svg { animation: none; }
  .yw-guests-page [data-tip]::after, .yw-gx-site, .yw-gx-topic { transition: none; }
}

/* ---- 10/12: the Dashboard's grid and the Dashboard's charts ---------------
   Owner: "you didnt fix the layout on the container ... this is completely
   crooked" and "WHAT THE FUCK IS THAT LINE GRAPH ... can you read that chart".
   The top is two rows of three; every card in a row starts and ends on the
   same lines and spreads its content over its height (its last block sits on
   the bottom line). The trends are one row of three cards of one height, each
   the Revenue by month chart (skin/overview.css .yw-month-*). */
.yw-guests-top { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, 1.06fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.yw-guests-top > * { min-width: 0; margin: 0; }
.yw-guests-top > :last-child:nth-child(3n + 2) { grid-column: span 2; }
.yw-guests-top > :last-child:nth-child(3n + 1) { grid-column: 1 / -1; }
.yw-guests-top > :is(.yw-card, .yw-gx-stay-slot, .yw-needs) { display: flex; flex-direction: column; }
.yw-guests-top .yw-gx-stay-slot > .yw-card { display: flex; flex-direction: column; }
.yw-guests-top > .yw-needs > .yw-needs-card { flex: 1 1 auto; min-height: 0; }
.yw-guests-top .yw-needs-list > .yw-needs-row { flex: 1 1 0; min-height: 64px; max-height: 84px; }
.yw-guests-top > .yw-gx-insight { height: auto; min-height: 380px; }
/* The hero: figure and status at the top, the star split and the counts on
   the bottom line. */
.yw-guests-top > .yw-gx-hero > .yw-gx-split-wrap { margin-top: auto; padding-top: 18px; }
/* Ratings by site: the rows share the card's height, each centred. */
.yw-guests-top > .yw-gx-sites > .yw-gx-sitelist { display: flex; flex: 1 1 auto; flex-direction: column; }
.yw-guests-top > .yw-gx-sites > .yw-gx-sitelist > li { display: flex; flex: 1 1 0; min-height: 52px; max-height: 76px; }
.yw-guests-top > .yw-gx-sites > .yw-gx-sitelist > li > .yw-gx-site { flex: 1 1 auto; margin: 0 -8px; }
/* Reviews per stay and Replies: the rows on the bottom line. */
.yw-guests-top .yw-gx-stay > .yw-gx-stay-sites { display: flex; flex: 1 1 auto; flex-direction: column; }
.yw-guests-top .yw-gx-stay > .yw-gx-stay-sites > .yw-gx-stayrows { display: flex; flex: 1 1 auto; flex-direction: column; }
.yw-guests-top .yw-gx-stay > .yw-gx-stay-sites > .yw-gx-stayrows > li { display: flex; flex: 1 1 0; min-height: 52px; max-height: 64px; }
.yw-guests-top .yw-gx-stay > .yw-gx-stay-sites > .yw-gx-stayrows > li > .yw-gx-stayrow { flex: 1 1 auto; align-content: center; }
.yw-guests-top > .yw-gx-replies > .yw-gx-replies-stats { margin-top: auto; padding-top: 14px; }
@media (max-width: 1180px) {
  .yw-guests-top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yw-guests-top > :last-child:nth-child(3n + 2), .yw-guests-top > :last-child:nth-child(3n + 1) { grid-column: auto; }
  .yw-guests-top > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* Reviews per stay, by platform: every row the same two lines, the site and
   its figure, then its track against the target, or the reason in its place. */
.yw-gx-stayrow { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name value" "track track"; align-items: center; gap: 8px 12px; padding: 10px 8px 12px; }
.yw-gx-stayrow > .yw-gx-bar-name { grid-area: name; flex-wrap: nowrap; gap: 8px; }
.yw-gx-stayrow .yw-gx-bar-label { white-space: nowrap; line-height: 1.35; }
.yw-gx-stayrow > .yw-gx-bar-value { grid-area: value; min-width: 0; }
.yw-gx-stayrow > :is(.yw-gx-mini-track, .yw-gx-stayrow-gap) { grid-area: track; }
.yw-gx-stayrow > .yw-gx-mini-track { height: 8px; margin: 3px 0; }
.yw-gx-stayrow > .yw-gx-mini-track > b { top: -4px; height: 16px; }
.yw-gx-stayrow-gap { display: block; height: 14px; color: #a59fab; font-size: 12px; line-height: 14px; }
.yw-gx-stayrow-gap[data-tone="bad"] { color: #a96883; }

/* The trend row. */
.yw-guests-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.yw-guests-trio > * { min-width: 0; margin: 0; }
@media (max-width: 1180px) { .yw-guests-trio { grid-template-columns: minmax(0, 1fr); } }
.yw-gx-trendcard { display: flex; flex-direction: column; }
.yw-gx-trendcard > .yw-gx-empty { margin-top: auto; margin-bottom: auto; }
.yw-gx-mchart { display: flex; flex: 1 1 auto; flex-direction: column; margin-top: 14px; }
.yw-gx-mchart > .yw-month-compare-key { flex-wrap: wrap; margin-bottom: 12px; justify-content: flex-start; gap: 6px 14px; min-height: 18px; color: #87818c; font-size: 12px; }
.yw-gx-mchart > .yw-month-compare-key i { flex: 0 0 auto; }
.yw-gx-mchart > .yw-month-plot { padding-top: 6px; grid-template-columns: 34px minmax(0, 1fr); }
.yw-gx-mchart .yw-month-axis { padding-top: 23px; color: #a9a0af; font-size: 12px; }
.yw-gx-mchart .yw-month-column { padding: 0 3px; border: 0; background: transparent; font: inherit; cursor: pointer; }
.yw-gx-mchart .yw-month-column:hover, .yw-gx-mchart .yw-month-column[data-active="true"] { background: #f4eefb; }
.yw-gx-mchart .yw-month-column-value { font-size: 12.5px; }
.yw-gx-mchart .yw-month-column-label { font-size: 12px; }
.yw-gx-mchart[data-many] .yw-month-column-value { font-size: 12px; letter-spacing: -.3px; }
.yw-gx-mchart .yw-month-column[data-partial] .yw-month-column-value { color: #a09aa4; }
.yw-gx-mchart .yw-month-column[data-partial] .yw-gx-mstack { opacity: .5; }
.yw-gx-mchart > .yw-month-detail { min-height: 62px; align-content: flex-start; margin-top: auto; gap: 6px 16px; color: #87818c; font-size: 12.5px; }
.yw-gx-mchart > .yw-month-detail .yw-month-detail-period { font-size: 13px; }
.yw-gx-mchart > .yw-month-detail strong { font-size: 14px; }
.yw-gx-mchart > .yw-month-detail > span[data-tone="bad"], .yw-gx-mchart > .yw-month-detail > span[data-tone="bad"] strong { color: #b4467f; }
.yw-gx-mchart > .yw-month-detail > a { font-size: 12.5px; }
/* A column of parts, five stars at the bottom. */
.yw-gx-mstack { position: absolute; bottom: 0; left: 50%; display: flex; flex-direction: column-reverse; width: min(46%, 38px); overflow: hidden; border-radius: 3px 3px 0 0; transform: translateX(-50%); transform-origin: bottom; animation: yw-month-grow .65s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--yw-bar-i, 0) * 35ms); }
.yw-gx-mstack > i { display: block; flex-basis: 0; min-height: 2px; }
.yw-gx-mstack > i + i { border-bottom: 1px solid #fbfbfb; }
.yw-gx-mnote { position: absolute; right: 0; bottom: 8px; left: 0; color: #a06b24; font-size: 12px; line-height: 1.3; text-align: center; white-space: normal; }
/* Five stars and one or two stars are solid (the Dashboard's weekend and
   tonight read the same way), so the good base and the bad cap of a column
   read at a glance; the middle is hatched. */
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="deep"] { background: #7c3aed; }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="rose"] { background: #d85e9e; }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="violet"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="soft"] { background: repeating-linear-gradient(125deg, #b48af2 0 2px, #ebe1fc 2px 4px); }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="grey"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #dcd8e0 2px 4px); }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="pink"] { background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); }
:is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="slate"] { background: #d9d5de; }
.yw-gx-key-swatch { display: inline-block; width: 13px; height: 8px; border-radius: 2px; }

[data-theme-root].dark .yw-gx-mchart .yw-month-column:hover, [data-theme-root].dark .yw-gx-mchart .yw-month-column[data-active="true"] { background: #142036; }
[data-theme-root].dark .yw-gx-mchart .yw-month-column-rail { border-bottom-color: #33405e; background: linear-gradient(to bottom, #1c2843 0 1px, transparent 1px calc(50% - .5px), #1c2843 calc(50% - .5px) calc(50% + .5px), transparent calc(50% + .5px)); }
[data-theme-root].dark .yw-gx-mchart :is(.yw-month-compare-key, .yw-month-axis, .yw-month-column-label, .yw-month-detail) { color: #a297ab; }
[data-theme-root].dark .yw-gx-mchart .yw-month-column[data-partial] .yw-month-column-value { color: #8b8794; }
[data-theme-root].dark .yw-gx-mchart > .yw-month-detail > span[data-tone="bad"], [data-theme-root].dark .yw-gx-mchart > .yw-month-detail > span[data-tone="bad"] strong { color: #e69ac4; }
[data-theme-root].dark .yw-gx-mstack > i + i { border-bottom-color: #0d1527; }
[data-theme-root].dark .yw-gx-mnote { color: #e6bd7f; }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="deep"] { background: #a883ee; }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="rose"] { background: #e07fb4; }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="violet"] { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #3d3260 2px 4px); }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="soft"] { background: repeating-linear-gradient(125deg, #7d64ad 0 2px, #2c2847 2px 4px); }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="grey"] { background: repeating-linear-gradient(125deg, #8b8794 0 2px, #243352 2px 4px); }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="pink"] { background: repeating-linear-gradient(125deg, #e07fb4 0 2px, #5a3a4b 2px 4px); }
[data-theme-root].dark :is(.yw-gx-mstack > i, .yw-gx-key-swatch)[data-tone="slate"] { background: #33405e; }
[data-theme-root].dark .yw-gx-stayrow-gap { color: #8b8794; }
[data-theme-root].dark .yw-gx-stayrow-gap[data-tone="bad"] { color: #e69ac4; }
@media (prefers-reduced-motion: reduce) { .yw-gx-mstack { animation: none; } }

/* Replies by site (10/12): the per-stay rows' two lines, violet for the
   share answered; the rows share what the card has left. */
.yw-guests-top > .yw-gx-replies > .yw-gx-reply-sites { display: flex; flex: 1 1 auto; flex-direction: column; margin-top: 2px; }
.yw-gx-reply-sites > .yw-gx-stayrows { display: flex; flex: 1 1 auto; flex-direction: column; }
.yw-gx-reply-sites > .yw-gx-stayrows > li { display: flex; flex: 1 1 0; min-height: 52px; max-height: 64px; }
.yw-gx-reply-sites > .yw-gx-stayrows > li > .yw-gx-stayrow { flex: 1 1 auto; align-content: center; text-decoration: none; }
a.yw-gx-stayrow:hover .yw-gx-bar-label { color: #7c3aed; }
a.yw-gx-stayrow:focus-visible { outline: 2px solid #b993ff; outline-offset: -2px; }
.yw-gx-mini-track > i[data-tone="violet"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
[data-theme-root].dark .yw-gx-mini-track > i[data-tone="violet"] { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #3d3260 2px 4px); }
[data-theme-root].dark a.yw-gx-stayrow:hover .yw-gx-bar-label { color: #c5a8ff; }

/* On paper (10/12, keeping #3460's print on the redesigned list): the list
   drops its scroll box so every review prints, and a review never splits
   across two pages. The reply box and Show more carry print:hidden. */
@media print {
  .yw-gx-reviews { max-height: none; min-height: 0; overflow: visible; }
  .yw-gx-review { break-inside: avoid; }
}