/* Guests' base (10/12): the shared rules the Guests redesign rides on. On the
   design branch they live in skin/money.css, overview.css and base.css as
   :is(.yw-money-page, ..., .yw-guests-page) roots or as generic rules on the
   classes Guests uses; testing's copies of those files moved on with each
   section, so Guests carries its own here, narrowed to .yw-guests-page with
   :where() so nothing else on testing moves. Loaded after skin/money.css. */
.yw-guests-page .yw-needs { flex: 1 1 auto; position: relative; display: flex; flex-direction: column; }
.yw-guests-page a.yw-more { display: inline-grid; place-items: center; width: 35px; height: 35px; border: 1px solid #e4e2e6; border-radius: 50%; background: transparent; color: #202024; font-size: 17px; line-height: 1; letter-spacing: 0; }
.yw-guests-page .yw-more button { display: inline-grid; place-items: center; width: 35px; height: 35px; border: 1px solid #e4e2e6; border-radius: 50%; background: transparent; color: transparent; font-size: 0; line-height: 1; letter-spacing: 0; }
.yw-guests-page .yw-more button::after { content: "\00b7\00b7\00b7"; color: #202024; font-size: 17px; letter-spacing: 1px; }
.yw-guests-page a.yw-more:hover { background: #eeeeee; }
.yw-guests-page .yw-more button:hover { background: #eeeeee; }
.yw-guests-page .yw-more button[aria-expanded="true"] { background: #eeeeee; }
.yw-guests-page .yw-more button:focus-visible { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-guests-page .yw-hero-value { margin: 19px 0 8px; font-size: clamp(38px, 3.6vw, 53px); font-weight: 500; line-height: 1.17; letter-spacing: -.05em; color: #202024; }
.yw-guests-page .yw-hero-status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: 11px; }
.yw-guests-page .yw-needs-row-actions { margin: 6px 0 2px 43px; }
.yw-guests-page .yw-needs-row-actions > div { margin: 0; }
.yw-guests-page .yw-needs-row-actions > div > div { flex-wrap: wrap; gap: 6px; }
.yw-guests-page .yw-hero-summary { margin: 16px 0 16px; color: #777; font-size: 13px; line-height: 1.5; }
.yw-guests-page .yw-hero-note { margin: -8px 0 16px; color: #929097; font-size: 12px; }
.yw-guests-page .yw-hero-status .yw-text-link { font-size: 12px; }
:where(.yw-guests-page) .yw-insight-art { position: absolute; inset: 0; z-index: -3; background-color: #f2eafe; background-position: center bottom; background-size: auto 80%; background-repeat: no-repeat; transition: opacity 350ms ease; transform-origin: 50% 80%; animation: yw-art-drift 26s ease-in-out infinite alternate; will-change: translate, scale; animation-duration: 29s; }
.yw-guests-page .yw-needs-more { position: absolute; top: 23px; right: 23px; z-index: 2; }
.yw-guests-page .yw-needs-card { position: relative; display: flex; min-height: 412px; flex: 1 1 auto; flex-direction: column; padding: 23px; border: 1px solid #e2e1e4; border-radius: 24px; background: #fbfbfb; box-shadow: 0 2px 3px rgba(0, 0, 0, .008); }
.yw-guests-page .yw-needs-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0 0 14px; padding-right: 44px; }
.yw-guests-page .yw-needs-card-head h2 { margin: 0; color: #202024; font-size: 19px; font-weight: 500; line-height: 1.3; letter-spacing: -.55px; }
.yw-guests-page .yw-needs-card-head p { margin: 3px 0 0; color: #929097; font-size: 12px; line-height: 1.5; }
.yw-guests-page .yw-needs-list { display: flex; flex: 1 1 auto; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.yw-guests-page .yw-needs-row { position: relative; display: flex; align-items: center; min-height: 74px; border-bottom: 1px solid #eae8ec; transition: padding .2s ease, border-color .2s ease; }
.yw-guests-page .yw-needs-row:last-child { border-bottom: 0; }
.yw-guests-page .yw-needs-row-link { display: flex; flex: 1 1 auto; min-width: 0; align-items: center; gap: 13px; padding: 12px 3px; color: inherit; text-decoration: none; }
.yw-guests-page .yw-needs-mark { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 50%; background: #f8e8ef; color: #bd6a91; }
.yw-guests-page .yw-needs-mark svg { width: 17px; height: 17px; }
.yw-guests-page .yw-needs-mark-legal { background: #fbf0dc; color: #b98234; }
.yw-guests-page .yw-needs-mark-mine { background: #eee7f8; color: #8a66bc; }
.yw-guests-page .yw-needs-row-copy { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; gap: 3px; }
.yw-guests-page .yw-needs-row-title { overflow: hidden; color: #202024; font-size: 12px; font-weight: 500; line-height: 1.4; text-overflow: ellipsis; }
.yw-guests-page .yw-needs-row-detail { overflow: hidden; color: #a09aa4; font-size: 10px; line-height: 1.45; text-overflow: ellipsis; }
.yw-guests-page .yw-needs-row-chevron { width: 14px; height: 14px; flex: 0 0 14px; stroke: #aaa4ad; stroke-width: 1.4; transition: transform .2s ease, stroke .2s ease; }
.yw-guests-page .yw-needs-row-link:hover .yw-needs-row-chevron { transform: translateX(3px); stroke: #8151b7; }
.yw-guests-page .yw-needs-row-link:focus-visible .yw-needs-row-chevron { transform: translateX(3px); stroke: #8151b7; }
.yw-guests-page .yw-needs-row-link:focus-visible { border-radius: 10px; outline: 2px solid #b993ff; outline-offset: -2px; }
.yw-guests-page .yw-needs-empty { margin: 14px 0; color: #77717c; font-size: 13px; line-height: 1.5; }
.yw-guests-page .yw-needs-empty a { color: #8553c2; }
.yw-guests-page .yw-needs-card-foot a { color: #8553c2; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; }
.yw-guests-page .yw-needs-card-foot { display: flex; min-height: 22px; align-items: flex-end; justify-content: flex-end; gap: 8px; margin-top: auto; padding-top: 10px; color: #a09aa4; font-size: 10px; }
.yw-guests-page .yw-needs > .yw-needs-card { min-height: 412px; padding: 23px; transition: border-color .2s ease, box-shadow .2s ease; }
.yw-guests-page .yw-needs-card > a:not(.yw-more) { display: inline-flex; align-self: flex-start; align-items: center; min-height: 34px; margin-top: 4px; padding: 0 12px; border: 1px solid #e3d9ee; border-radius: 10px; color: #7445a7; font-size: 12px; text-decoration: none; transition: background .16s, border-color .16s; }
.yw-guests-page .yw-needs-card > a:not(.yw-more):hover { border-color: #d5c4e6; background: #f5f0fa; }
.yw-guests-page .yw-needs > .yw-needs-card:hover { border-color: #d9d2e0; box-shadow: 0 8px 22px rgba(48, 32, 64, .045); }
@media (prefers-reduced-motion: reduce) { :where(.yw-guests-page) .yw-insight-art { animation: none; transition: none; translate: none; scale: none; } }
@media (max-width: 800px) { .yw-guests-page .yw-needs > .yw-needs-card { min-height: 0; } }
@media (max-width: 520px) { .yw-guests-page .yw-needs > .yw-needs-card { padding: 18px; } }
@media (max-width: 520px) { .yw-guests-page .yw-needs-more { top: 18px; right: 18px; } }
[data-theme-root].dark .yw-guests-page .yw-needs > .yw-needs-card { border-color: #1c2843; background: #0d1527; }
[data-theme-root].dark .yw-guests-page .yw-needs-card-head h2 { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page .yw-needs-row-title { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page .yw-needs-card-head p { color: #a297ab; }
[data-theme-root].dark .yw-guests-page .yw-needs-row-detail { color: #a297ab; }
[data-theme-root].dark .yw-guests-page .yw-needs-card-foot { color: #a297ab; }
[data-theme-root].dark .yw-guests-page .yw-needs-empty { color: #a297ab; }
[data-theme-root].dark .yw-guests-page .yw-needs-row { border-color: #1c2843; }
[data-theme-root].dark .yw-guests-page .yw-needs-mark { background: #4a3040; color: #e6a9c4; }
[data-theme-root].dark .yw-guests-page .yw-needs-mark-legal { background: #493c2c; color: #e6bd7f; }
[data-theme-root].dark .yw-guests-page .yw-needs-mark-mine { background: #3d3150; color: #c5a8ff; }
[data-theme-root].dark .yw-guests-page .yw-needs > .yw-needs-card:hover { border-color: #3b3350; box-shadow: 0 8px 22px rgba(0, 0, 0, .18); }
.yw-guests-page { font-family: var(--font-geist-sans), Geist, system-ui, sans-serif; font-size: 14px; letter-spacing: -.25px; --color-zinc-50: #f8f7f9; --color-zinc-100: #eeedf0; --color-zinc-200: #e2e1e4; --color-zinc-300: #d6d2da; --color-zinc-400: #a09aa4; --color-zinc-500: #8a8490; --color-zinc-600: #6f6975; --color-zinc-700: #59535f; --color-zinc-800: #131f35; --color-zinc-900: #202024; --color-zinc-950: #0a0f1e; --color-violet-50: #f6f1fb; --color-violet-100: #eee5fd; --color-violet-200: #e3d6f6; --color-violet-300: #cdb5ee; --color-violet-400: #a883ee; --color-violet-500: #8553c2; --color-violet-600: #7c3aed; --color-violet-700: #7433d4; --color-violet-800: #5d2bb0; --color-emerald-50: #eef7f3; --color-emerald-200: #cfe7dd; --color-emerald-300: #b5dccb; --color-emerald-500: #397965; --color-emerald-600: #279876; --color-emerald-700: #2f8a6d; --color-emerald-800: #397965; --color-rose-50: #fbf0f4; --color-rose-200: #f0d2dd; --color-rose-300: #e7b9cb; --color-rose-400: #d98aa9; --color-rose-500: #c85f84; --color-rose-600: #c85f84; --color-rose-700: #a96883; --color-rose-800: #9f6586; --color-amber-50: #fbf6ee; --color-amber-100: #f6ecdc; --color-amber-200: #ecdcc0; --color-amber-300: #e0c79c; --color-amber-600: #9a805f; --color-amber-700: #9a805f; --color-amber-800: #86704f; --color-amber-900: #6f5c40; margin-top: 18px; }
.yw-guests-page :is(button, input, select, textarea, table) { font-family: inherit; }
.yw-guests-page :is(.num, .tabular-nums) { font-variant-numeric: tabular-nums lining-nums; font-feature-settings: "tnum" 1, "lnum" 1; }
.yw-guests-page :is(.font-bold, .font-semibold) { font-weight: 500; }
.yw-guests-page :is(.text-2xl, .text-3xl, .text-4xl) { font-weight: 500; letter-spacing: -.04em; }
.yw-guests-page :where( :is(section, div, article, form, p, ul, ol)[class~="rounded-2xl"][class~="border"], section[data-panel], [data-ui="stat-card"], [data-ui="moves-card"], [data-ui="connect-prompt"], [data-ui="notice"] ) { border-color: #e2e1e4; border-radius: 24px; background-color: #fbfbfb; box-shadow: 0 2px 3px rgba(0, 0, 0, .008); }
.yw-guests-page :where(:is(section, div, article, form, p)[class~="rounded-2xl"][class~="p-4"], [data-ui="notice"], [data-ui="preparing"]) { padding: 23px; }
.yw-guests-page :where( :is([class~="rounded-2xl"][class~="border"], section[data-panel], .yw-card) :is([class~="rounded-2xl"], [class~="rounded-xl"])[class~="border"]:not([data-ui="segmented"], [data-ui="tab-bar"]) ) { border-color: transparent; border-radius: 14px; background-color: #f6f5f7; box-shadow: none; }
.yw-guests-page :where([class~="border-dashed"]) { border-color: #ddd3e6; border-radius: 24px; background-color: #fbfbfb; }
.yw-guests-page section[data-panel] > div:first-child { padding: 19px 23px 10px; background: transparent; }
.yw-guests-page section[data-panel] > div:first-child > h2 { color: #202024; font-size: 19px; font-weight: 500; line-height: 1.3; letter-spacing: -.55px; }
.yw-guests-page section[data-panel] > div:first-child > span.num { padding: 0; border-radius: 0; background: transparent; color: #99909e; font-size: 12px; font-weight: 400; }
.yw-guests-page section[data-panel] > div:last-child { padding: 14px 23px 23px; border-top-color: #eae8ec; }
.yw-guests-page [data-ui="section-label"] { color: #202024; font-size: 19px; font-weight: 500; line-height: 1.3; letter-spacing: -.55px; }
.yw-guests-page [data-ui="stat-card"] > div:first-child > div:first-child { color: #87818c; font-size: 12px; letter-spacing: 0; text-transform: none; }
.yw-guests-page [data-ui="stat-card"] > .num { margin-top: 6px; color: #202024; font-size: 27px; font-weight: 500; line-height: 1.15; letter-spacing: -.05em; }
.yw-guests-page [data-ui="stat-card"] > div:last-child:not(.num) { margin-top: 4px; color: #929097; font-size: 12px; }
.yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) { display: inline-flex; width: auto; max-width: 100%; gap: 2px; padding: 3px; border: 0; border-radius: 12px; background-color: #eeeded; }
.yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > :is(a, button, span) { padding: 7px 12px; border-radius: 9px; background: transparent; color: #6f6975; font-size: 12px; font-weight: 500; box-shadow: none; }
.yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > :is(a, button):hover { background-color: rgba(255, 255, 255, .6); color: #202024; }
.yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > [class~="bg-violet-600"] { background-color: #fff; background-image: none; color: #202024; box-shadow: 0 2px 6px rgba(0, 0, 0, .06); }
.yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > [class~="bg-violet-600"] > span[aria-label] { background-color: #7c3aed; }
.yw-guests-page table { font-variant-numeric: tabular-nums; }
.yw-guests-page thead :is(th, tr) { color: #766d7c; font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.yw-guests-page tbody tr { border-color: #eae8ec; }
.yw-guests-page tbody tr:hover { background-color: #faf8fc; }
.yw-guests-page tfoot tr { background-color: #f8f4fb; }
.yw-guests-page [data-ui="badge"] { padding: 4px 9px; border-radius: 20px; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .024); color: #59535f; font-size: 10px; font-weight: 500; letter-spacing: .03em; }
.yw-guests-page [data-ui="badge"][data-tone="push"] { color: #2f8a6d; }
.yw-guests-page [data-ui="badge"]:is([data-tone="rescue"], [data-tone="gold"]) { color: #a96883; }
.yw-guests-page [data-ui="badge"][data-tone="violet"] { color: #7433d4; }
.yw-guests-page [data-ui="badge"][data-tone="blue"] { color: #5f6aa3; }
.yw-guests-page [data-ui="count-chip"] { border-radius: 20px; background-color: #fff; color: #59535f; font-weight: 500; box-shadow: 0 2px 8px rgba(0, 0, 0, .024); --tw-ring-color: transparent; }
.yw-guests-page [data-ui="count-chip"][data-on] { background-color: #eee5fd; color: #7433d4; }
.yw-guests-page :is(button, a, span)[class~="rounded-lg"] { border-radius: 10px; }
.yw-guests-page :is(button, a)[class~="bg-violet-600"] { background-color: #7c3aed; background-image: none; }
.yw-guests-page :is(button, a)[class~="bg-violet-600"]:hover { background-color: #7130df; }
.yw-guests-page :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) { border-color: #e2e1e4; border-radius: 10px; }
.yw-guests-page :is(input, select, textarea):focus { border-color: #b993ff; }
.yw-guests-page a[class~="text-violet-600"] { color: #8553c2; }
.yw-guests-page [data-ui="connect-prompt"] { padding: 23px; }
.yw-guests-page [data-ui="connect-prompt"] > div:first-child { color: #8553c2; font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.yw-guests-page [data-ui="connect-prompt"] > h3 { color: #202024; font-size: 19px; font-weight: 500; letter-spacing: -.55px; }
.yw-guests-page :is([data-ui="notice"], [data-ui="preparing"]) > :first-child { color: #202024; font-size: 15px; font-weight: 500; }
.yw-guests-page :is([data-ui="notice"], [data-ui="preparing"], [data-ui="connect-prompt"]) p { color: #777; font-size: 13px; }
.yw-guests-page [data-ui="moves-card"] > header { padding: 20px 23px 14px; border-color: #eae8ec; }
.yw-guests-page [data-ui="moves-card"] > ol > li { border-color: #eae8ec; }
.yw-guests-page [data-ui="moves-card"] > div:last-child:not(:first-child) { padding: 12px 23px; border-color: #eae8ec; color: #929097; font-size: 12px; }
.yw-guests-page [data-ui="bulk-bar"] { border-color: #e5ddea; border-radius: 14px; background-color: rgba(253, 252, 254, .92); box-shadow: 0 8px 22px rgba(48, 32, 64, .06); padding: 10px 14px; }
.yw-guests-page [data-ui="bulk-bar"][data-state="idle"] { position: static; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.yw-guests-page [data-ui="bulk-bar"][data-state="idle"] > div:first-child { color: #929097; font-size: 12px; }
.yw-guests-page [data-ui="bulk-bar"] .text-violet-800 { color: #202024; }
[data-theme-root].dark .yw-guests-page { color: #f3eef8; --color-zinc-50: #101a2f; --color-zinc-100: #142036; --color-zinc-200: #1c2843; --color-zinc-300: #273656; --color-zinc-400: #8f8996; --color-zinc-500: #a297ab; --color-zinc-600: #c3b9cc; --color-zinc-700: #d9d2e3; --color-zinc-800: #ece6f2; --color-zinc-900: #f3eef8; --color-zinc-950: #faf8fc; --color-violet-50: #2f2638; --color-violet-100: #3f2d5c; --color-violet-200: #4a3a63; --color-violet-300: #5c4a78; --color-violet-500: #c5a8ff; --color-violet-700: #c9b1ff; --color-violet-800: #d9c8f0; --color-emerald-50: #26332e; --color-emerald-200: #345a4c; --color-emerald-300: #3f6b5a; --color-rose-50: #3a2a31; --color-rose-200: #5a3a4b; --color-rose-300: #6b4659; --color-amber-50: #3d3122; --color-amber-100: #45382a; --color-amber-200: #594a35; --color-amber-300: #6b5a40; }
[data-theme-root].dark .yw-guests-page :where( .bg-white, :is(section, div, article, form, p, ul, ol)[class~="rounded-2xl"][class~="border"], section[data-panel], [data-ui="stat-card"], [data-ui="moves-card"], [data-ui="connect-prompt"], [data-ui="notice"], .yw-card, [class~="border-dashed"] ) { border-color: #1c2843; background-color: #0d1527; background-image: none; box-shadow: none; }
[data-theme-root].dark .yw-guests-page :where( :is([class~="rounded-2xl"][class~="border"], section[data-panel], .yw-card) :is([class~="rounded-2xl"], [class~="rounded-xl"])[class~="border"]:not([data-ui="segmented"], [data-ui="tab-bar"]), .yw-money-drill-body, .yw-money-email pre ) { border-color: transparent; background-color: #142036; }
[data-theme-root].dark .yw-guests-page .yw-money-aging [data-surface="money.aging"] { border-color: transparent; background-color: transparent; }
[data-theme-root].dark .yw-guests-page .yw-money-owed [data-ui="moves-card"] { border-color: transparent; background-color: transparent; }
[data-theme-root].dark .yw-guests-page :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { border-color: #1c2843; background-color: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-guests-page :is([class*="text-rose-6"], [class*="text-rose-7"], [class*="text-rose-8"]) { color: #e69ac4; }
[data-theme-root].dark .yw-guests-page :is([class*="text-emerald-6"], [class*="text-emerald-7"], [class*="text-emerald-8"]) { color: #7fd3b4; }
[data-theme-root].dark .yw-guests-page :is([class*="text-amber-6"], [class*="text-amber-7"], [class*="text-amber-8"], [class*="text-amber-9"]) { color: #e6bd7f; }
[data-theme-root].dark .yw-guests-page :is(button, a)[class~="bg-violet-600"] { background-color: #7c3aed; background-image: none; box-shadow: none; }
[data-theme-root].dark .yw-guests-page :is(button, a)[class~="bg-violet-600"]:hover { background-color: #8b4dfb; }
[data-theme-root].dark .yw-guests-page a[class~="text-violet-600"] { color: #c5a8ff; }
[data-theme-root].dark .yw-guests-page :is([data-ui="section-label"], section[data-panel] > div:first-child > h2, [data-ui="connect-prompt"] > h3, [data-ui="notice"] > :first-child, [data-ui="preparing"] > :first-child) { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page [data-ui="stat-card"] > .num { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page :is([data-ui="stat-card"] > div:first-child > div:first-child, [data-ui="stat-card"] > div:last-child:not(.num), section[data-panel] > div:first-child > span.num) { color: #a297ab; }
[data-theme-root].dark .yw-guests-page :is([data-ui="notice"], [data-ui="preparing"], [data-ui="connect-prompt"]) p { color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page section[data-panel] > div:last-child { border-color: #1c2843; }
[data-theme-root].dark .yw-guests-page [data-ui="moves-card"] > :is(header, ol > li, div:last-child) { border-color: #1c2843; }
[data-theme-root].dark .yw-guests-page tbody tr { border-color: #1c2843; }
[data-theme-root].dark .yw-guests-page tbody tr:hover { background-color: #111b30; }
[data-theme-root].dark .yw-guests-page thead :is(th, tr) { color: #a297ab; }
[data-theme-root].dark .yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) { background-color: #142036; }
[data-theme-root].dark .yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > :is(a, button, span) { color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > :is(a, button):hover { background-color: #1c2843; color: #f3eef8; }
[data-theme-root].dark .yw-guests-page :is([data-ui="tab-bar"], [data-ui="segmented"]) > [class~="bg-violet-600"] { background-color: #3f2d5c; color: #c9b1ff; box-shadow: none; }
[data-theme-root].dark .yw-guests-page [data-ui="badge"] { background: #142036; box-shadow: none; color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page [data-ui="badge"][data-tone="push"] { color: #7fd3b4; }
[data-theme-root].dark .yw-guests-page [data-ui="badge"]:is([data-tone="rescue"], [data-tone="gold"]) { color: #e69ac4; }
[data-theme-root].dark .yw-guests-page [data-ui="badge"][data-tone="violet"] { color: #c9b1ff; }
[data-theme-root].dark .yw-guests-page [data-ui="badge"][data-tone="blue"] { color: #a9b4e6; }
[data-theme-root].dark .yw-guests-page [data-ui="count-chip"] { background-color: #142036; color: #c3b9cc; box-shadow: none; }
[data-theme-root].dark .yw-guests-page [data-ui="count-chip"][data-on] { background-color: #3f2d5c; color: #c9b1ff; }
[data-theme-root].dark .yw-guests-page [data-ui="bulk-bar"] { border-color: #1c2843; background-color: rgba(13, 21, 39, .94); box-shadow: 0 8px 22px rgba(0, 0, 0, .25); }
[data-theme-root].dark .yw-guests-page [data-ui="bulk-bar"][data-state="idle"] { background: transparent; box-shadow: none; }
[data-theme-root].dark .yw-guests-page [data-ui="bulk-bar"][data-state="picked"] .text-violet-800 { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page [data-ui="bulk-bar"][data-state="idle"] > div:first-child { color: #a297ab; }
[data-theme-root].dark .yw-guests-page :is(.yw-card-title, .yw-hero-value, .yw-money-lead, .yw-row-stat-value, .yw-row-stat dd, .yw-money-group, .yw-money-group-amount, .yw-money-lane-total, .yw-money-lines > li > strong) { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page :is(.yw-card-sub, .yw-hero-muted, .yw-row-stat, .yw-money-note, .yw-money-group-note, .yw-money-group-count, .yw-money-muted, .yw-money-empty) { color: #a297ab; }
[data-theme-root].dark .yw-guests-page .yw-money-note[data-tone="bad"] { color: #e69ac4; }
[data-theme-root].dark .yw-guests-page .yw-hero-summary { color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page .yw-money-lines > li { color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page .yw-money-table td { color: #c3b9cc; }
[data-theme-root].dark .yw-guests-page :is(.yw-text-link, .yw-money-drill-count, .yw-money-why .hw-info-label) { color: #c5a8ff; }
[data-theme-root].dark .yw-guests-page :is(.yw-row-stat, .yw-money-lines > li, .yw-money-table td, .yw-money-control-row, .yw-money-email, .yw-money-request, .yw-money-owed [data-ui="moves-card"] > ol, .yw-money-owed [data-ui="moves-card"] > ol > li) { border-color: #1c2843; }
[data-theme-root].dark .yw-guests-page .yw-hero-pill { background: #142036; box-shadow: none; color: #d9cfe3; }
[data-theme-root].dark .yw-guests-page .yw-hero-pill[data-pace="ahead"] { color: #7fd3b4; }
[data-theme-root].dark .yw-guests-page :is(a.yw-more, .yw-more button) { border-color: #1c2843; color: #f3eef8; }
[data-theme-root].dark .yw-guests-page .yw-more button::after { color: #f3eef8; }
[data-theme-root].dark .yw-guests-page :is(a.yw-more:hover, .yw-more button:hover, .yw-more button[aria-expanded="true"]) { background: #142036; }
[data-theme-root].dark .yw-guests-page .yw-money-group[data-owed-focus] { background: #2f2638; }
[data-theme-root].dark .yw-guests-page .yw-money-control-row .hw-info-label { color: #f3eef8; }
@media (hover: hover) { [data-theme-root].dark .yw-guests-page .yw-card:hover { border-color: #55505d; box-shadow: 0 8px 22px rgba(0, 0, 0, .18); } }
.yw-guests-page button:not(.hw-no-pop):not(:disabled):not([aria-disabled="true"]) { transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s, transform .2s, translate .2s, filter .2s; }
.yw-guests-page button:not(.hw-no-pop):not(:disabled):not([aria-disabled="true"]):not(.yw-dashboard-tab-option):active { transform: scale(.975); }
.yw-guests-page .yw-needs-list > .yw-needs-row { animation: yw-motion-row-in .38s cubic-bezier(.2, .8, .2, 1) backwards; }
.yw-guests-page .yw-needs-list > .yw-needs-row:nth-child(2) { animation-delay: 55ms; }
.yw-guests-page .yw-needs-list > .yw-needs-row:nth-child(3) { animation-delay: 100ms; }
.yw-guests-page .yw-needs-list > .yw-needs-row:nth-child(4) { animation-delay: 145ms; }
.yw-guests-page .yw-needs-list > .yw-needs-row:nth-child(5) { animation-delay: 190ms; }
.yw-guests-page .yw-needs-list > .yw-needs-row:hover { padding-left: 3px; }
@media (hover: hover) { .yw-guests-page .yw-card { transition: border-color .2s ease, box-shadow .2s ease; } }
@media (hover: hover) { .yw-guests-page .yw-card:hover { border-color: #d9d2e0; box-shadow: 0 8px 22px rgba(48, 32, 64, .045); } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-card { animation: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page button:not(.hw-no-pop):not(:disabled):not([aria-disabled="true"]) { animation: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs-list > .yw-needs-row { animation: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs > .yw-needs-card { animation: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs-row-chevron { animation: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page button:not(.hw-no-pop):not(:disabled):not([aria-disabled="true"]):active { transform: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs-list > .yw-needs-row:hover { padding-left: 0; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs-row-link:hover .yw-needs-row-chevron { transform: none; } }
@media (prefers-reduced-motion: reduce) { .yw-guests-page .yw-needs-row-link:focus-visible .yw-needs-row-chevron { transform: none; } }
@media (hover: hover) and (pointer: fine) { .yw-guests-page :is(a[href], button, [role="button"], [role="tab"], [role="menuitem"], input[type="submit"], input[type="button"], input[type="reset"]) :not(.hw-no-pop):not(:disabled):not([aria-disabled="true"]):hover { translate: none; } }

/* 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; }
}