/* Settings, connections (10/15): this section's own look on the shared base
   (settings.css). The tab is settings/connections-panel.tsx: Accounts (the
   catalog, connections-catalog.tsx, its rows integration-card.tsx and their
   popup connection-dialog.tsx, the bank row bank-connector-card.tsx, then
   api-keys-card.tsx and wizard-logins-card.tsx under it) and Links
   (links-panel.tsx).

   What this file adds to the base:
     .yw-conn-seg                   Accounts / Links and the category filter,
                                    the Dashboard's quiet segmented control
     .yw-conn-bar                   search, the filter, the connected count
     .yw-conn-group / .yw-conn-rows one card per category, rows in two
                                    columns on a wide screen
     .yw-conn-row                   name (its sentence on hover), the status
                                    as a dot and a word, the quiet actions
     .yw-conn-status                the dot and the word; green, rose and
                                    amber are the only colours, on the dot,
                                    and on the word only when it is bad news
     .yw-conn-more                  the round "···" that opens a row's popup
     .yw-conn-dialog / .yw-conn-pop-*  the popup behind a row
     .yw-conn-quiet                 the quiet button look for a SubmitButton,
                                    which cannot carry data-variant */

.yw-conn { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
.yw-conn-groups, .yw-conn-links { display: flex; min-width: 0; flex-direction: column; gap: 16px; }

/* The quiet segmented control (the Dashboard's, as on the Floor). */
.yw-conn-subtabs { display: flex; }
.yw-conn-seg { display: inline-flex; max-width: 100%; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 12px; background: #eeeded; }
.yw-conn-seg > :is(a, button) { display: inline-flex; min-height: 28px; align-items: center; padding: 0 12px; border: 0; border-radius: 9px; background: transparent; color: #6f6975; font: inherit; font-size: 12px; font-weight: 500; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background .16s, color .16s; }
.yw-conn-seg > :is(a, button):hover { background: rgba(255, 255, 255, .6); color: #202024; }
.yw-conn-seg > :is([aria-current], [aria-selected="true"]) { background: #fff; color: #202024; box-shadow: 0 2px 6px rgba(0, 0, 0, .06); }
.yw-conn-seg > :is(a, button):focus-visible { outline: 2px solid #b993ff; outline-offset: 1px; }

/* The catalog bar: search, the filter, the count. No hero. */
.yw-conn-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.yw-conn-search { display: flex; min-width: 0; min-height: 36px; flex: 1 1 220px; max-width: 340px; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #e2e1e4; border-radius: 12px; background: #fff; color: #a59fab; transition: border-color .16s, box-shadow .16s; }
.yw-conn-search:focus-within { border-color: #b993ff; box-shadow: 0 0 0 3px rgba(185, 147, 255, .22); }
.yw-conn-search > svg { flex-shrink: 0; }
.yw-conn-search > input { width: 100%; min-width: 0; border: 0; background: transparent; color: #202024; font: inherit; font-size: 13px; outline: none; }
.yw-conn-search > input::placeholder { color: #a59fab; }
.yw-conn-count { margin-left: auto; color: #929097; font-size: 12px; white-space: nowrap; }
.yw-conn-banner { margin: 0; color: #59535f; font-size: 13px; line-height: 1.5; }
.yw-conn-banner:is([data-tone="warn"], [data-tone="bad"]) { color: #c85f84; }
.yw-conn-empty { margin: 0; color: #929097; font-size: 13px; text-align: center; }
.yw-conn-empty[data-start] { margin-top: 10px; text-align: left; }

/* A category's rows: two columns on a wide screen, hairlines between. A
   long list scrolls inside its card (.yw-tasks-scroll, floor.css), never
   stretching the page (owner 10/15). */
.yw-settings-page .yw-tasks-scroll > :is(.yw-conn-rows, .yw-set-rows, .yw-conn-access-list) { margin-top: 0; }
.yw-settings-page .yw-tasks-scroll { padding-bottom: 4px; }
/* Logins for the Wizard: two columns of sites, as the catalog lays out its
   rows, so a short row is not one line across the whole card (10/15). */
.yw-conn-logins .yw-set-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
.yw-conn-logins .yw-set-rows > .yw-set-row:nth-child(2) { border-top: 0; }
@media (max-width: 900px) { .yw-conn-logins .yw-set-rows { grid-template-columns: minmax(0, 1fr); } .yw-conn-logins .yw-set-rows > .yw-set-row:nth-child(2) { border-top: 1px solid #eae8ec; } }
.yw-conn-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; margin: 6px 0 0; padding: 0; list-style: none; }
.yw-conn-rows[data-single] { grid-template-columns: minmax(0, 1fr); }
.yw-conn-row { display: grid; min-width: 0; min-height: 54px; grid-template-columns: minmax(0, 1fr) 132px auto; align-items: center; gap: 4px 16px; padding: 10px 0; border-top: 1px solid #eae8ec; }
.yw-conn-rows > .yw-conn-row:nth-child(-n+2) { border-top: 0; }
.yw-conn-rows[data-single] > .yw-conn-row:nth-child(2) { border-top: 1px solid #eae8ec; }
.yw-conn-rows[data-single] > .yw-conn-row { grid-template-columns: minmax(0, 1fr) minmax(120px, auto) auto; }
.yw-conn-group[data-soon] .yw-conn-row { min-height: 44px; grid-template-columns: minmax(0, 1fr); }
.yw-conn-group[data-soon] .yw-conn-name { color: #87818c; font-weight: 400; }
.yw-conn-row[data-highlight] { margin: 0 -8px; padding-right: 8px; padding-left: 8px; border-radius: 14px; background: #f6f2fc; box-shadow: 0 0 0 2px #dccbf6; }
.yw-conn-main { min-width: 0; }
.yw-conn-name { display: block; min-width: 0; overflow: hidden; color: #202024; font-size: 14px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.yw-conn-note { display: block; margin-top: 2px; overflow: hidden; color: #929097; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.yw-conn-note [data-tone="bad"], .yw-conn-note[data-tone="bad"] { color: #c85f84; }
.yw-conn-url { color: inherit; text-decoration: none; }
.yw-conn-url:hover { color: #8553c2; text-decoration: underline; }
.yw-conn-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 12px; }
@media (max-width: 1180px) {
  .yw-conn-rows { grid-template-columns: minmax(0, 1fr); }
  .yw-conn-rows > .yw-conn-row:nth-child(2) { border-top: 1px solid #eae8ec; }
}
@media (max-width: 560px) {
  .yw-conn-row, .yw-conn-rows[data-single] > .yw-conn-row { grid-template-columns: minmax(0, 1fr) auto; }
  .yw-conn-row > .yw-conn-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .yw-conn-count { margin-left: 0; }
}

/* The status: a small dot and a word. */
.yw-conn-status { display: inline-flex; min-width: 0; align-items: center; gap: 7px; color: #929097; font-size: 12px; white-space: nowrap; }
.yw-conn-status > i { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #cfccd3; }
.yw-conn-status[data-status="connected"] > i { background: #2fa57d; }
.yw-conn-status[data-status="error"] { color: #c85f84; }
.yw-conn-status[data-status="error"] > i { background: #d65e8a; }
.yw-conn-status[data-status="stale"] { color: #b7791f; }
.yw-conn-status[data-status="stale"] > i { background: #d39b32; }

/* The round "···" and the quiet look for a SubmitButton. */
.yw-conn-more { display: inline-grid; width: 32px; height: 32px; flex-shrink: 0; place-items: center; padding: 0; border: 1px solid #e4e2e6; border-radius: 50%; background: transparent; color: #59535f; cursor: pointer; transition: background .16s, border-color .16s; }
.yw-conn-more:hover { border-color: #d5c4e6; background: #f8f5fb; }
.yw-conn-more:focus-visible { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-set-btn.yw-conn-quiet { border: 1px solid #e2e1e4; background: #fff; color: #202024; }
.yw-set-btn.yw-conn-quiet:hover { border-color: #d5c4e6; background: #f8f5fb; }

/* The bank's Plaid buttons, drawn by expenses/plaid-link.tsx, wear the row's
   quiet button ("Connect") or its text action ("Add a bank"). */
.yw-settings-page .yw-conn-plaid button { min-height: 34px; padding: 0 14px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #202024; font: inherit; font-size: 13px; font-weight: 500; white-space: nowrap; }
.yw-settings-page .yw-conn-plaid button:hover { border-color: #d5c4e6; background: #f8f5fb; }
.yw-settings-page .yw-conn-plaid[data-look="link"] button { min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; color: #8553c2; font-weight: 400; }
.yw-settings-page .yw-conn-plaid[data-look="link"] button:hover { background: none; text-decoration: underline; }

/* The popup behind a row: the Dashboard's card as a dialog. */
.yw-conn-dialog { border: 1px solid #e2e1e4; border-radius: 24px; background: #fbfbfb; color: #202024; box-shadow: 0 24px 60px rgba(20, 16, 28, .18); font-size: 14px; letter-spacing: -.25px; }
.yw-conn-dialog-head { display: flex; align-items: center; gap: 12px; padding: 20px 22px 8px; }
.yw-conn-dialog-close { display: inline-grid; width: 32px; height: 32px; flex-shrink: 0; place-items: center; margin-left: auto; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #929097; font: inherit; font-size: 20px; line-height: 1; cursor: pointer; }
.yw-conn-dialog-close:hover { background: #f1f0f3; color: #202024; }
.yw-conn-dialog-body { display: flex; flex-direction: column; gap: 16px; padding: 6px 22px 22px; color: #59535f; font-size: 13px; line-height: 1.5; }
.yw-conn-pop-status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.yw-conn-pop-ago { color: #929097; font-size: 12px; }
.yw-conn-pop-text { margin: 6px 0 0; color: #59535f; font-size: 13px; line-height: 1.5; }
.yw-conn-pop-text[data-tone="bad"] { color: #c85f84; }
.yw-conn-pop-section { margin: 0; }
.yw-conn-pop-h { margin: 0 0 6px; color: #202024; font-size: 13px; font-weight: 500; letter-spacing: -.2px; }
.yw-conn-pop-list, .yw-conn-pop-steps { margin: 0; padding-left: 18px; color: #59535f; font-size: 13px; line-height: 1.6; }
.yw-conn-pop-steps { list-style: decimal; }
.yw-conn-pop-list { list-style: disc; }
.yw-conn-pop-list[data-plain] { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; padding-left: 0; list-style: none; }
.yw-conn-pop-service { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.yw-conn-pop-detail { min-width: 0; flex: 1 1 200px; color: #59535f; }
.yw-conn-pop-service > .yw-conn-status { flex-shrink: 0; font-size: 13px; }
.yw-conn-pop-service > .yw-conn-status:not([data-status="error"], [data-status="stale"]) { color: #202024; }
[data-theme-root].dark .yw-conn-pop-service > .yw-conn-status:not([data-status="error"], [data-status="stale"]) { color: #f3eef8; }
.yw-conn-pop-caption { margin: 8px 0 0; color: #929097; font-size: 12px; line-height: 1.5; }
.yw-conn-pop-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }

/* Links: the paste box, the addresses, the foot line. */
.yw-conn-paste-form { margin-top: 14px; }
.yw-settings-page .yw-conn-paste-form input[name="url"] { min-height: 34px; padding: 0 10px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #202024; font: inherit; font-size: 13px; }
.yw-settings-page .yw-conn-paste-form input[name="url"]:focus { border-color: #b993ff; outline: none; box-shadow: 0 0 0 3px rgba(185, 147, 255, .22); }
.yw-settings-page .yw-conn-paste-form button[type="submit"] { min-height: 34px; padding: 0 14px; border-radius: 10px; background: #7c3aed; font-size: 13px; font-weight: 500; }
.yw-settings-page .yw-conn-paste-form button[type="submit"]:hover { background: #6d28d9; }
.yw-conn-addr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; margin-top: 12px; }
.yw-conn-addr-form { display: flex; min-width: 0; flex-wrap: wrap; align-items: flex-end; gap: 8px 10px; }
.yw-conn-addr-form > .yw-field { min-width: 0; flex: 1 1 220px; }
.yw-conn-addr-form > :is(p, div[role]) { flex-basis: 100%; }
@media (max-width: 760px) { .yw-conn-addr { grid-template-columns: minmax(0, 1fr); } }
.yw-conn-foot { margin: 0; color: #929097; font-size: 12px; }
.yw-conn-foot .yw-set-link { font-size: 12px; }

/* API keys and the Wizard's logins. */
.yw-conn-keys .yw-set-rows, .yw-conn-logins .yw-set-rows { margin-top: 10px; }
.yw-conn-access > .yw-tasks-scroll { margin-top: 4px; }
.yw-conn-key-name { margin: 0; color: #202024; font-size: 14px; font-weight: 500; }
.yw-conn-code { padding: 2px 6px; border-radius: 6px; background: #f1f0f3; color: #59535f; font-family: var(--font-geist-mono), ui-monospace, monospace; font-size: 12px; word-break: break-all; }
.yw-conn-inline-form { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.yw-conn-key-form { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.yw-conn-key-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.yw-conn-key-line > .yw-field { min-width: 0; flex: 1 1 260px; }
.yw-conn-key-scopes { display: flex; flex-wrap: wrap; gap: 6px 14px; color: #59535f; font-size: 13px; }
.yw-conn-key-scopes > label { display: inline-flex; align-items: center; gap: 5px; }
.yw-conn-key-confirm { display: flex; align-items: flex-start; gap: 8px; color: #c85f84; font-size: 13px; line-height: 1.5; }
.yw-conn-key-confirm > input { margin-top: 3px; }
.yw-conn-key-token { display: flex; flex-direction: column; gap: 4px; }
.yw-conn-key-token > p[data-tone="ok"] { margin: 0; color: #279876; font-weight: 500; }
.yw-conn-login-row { align-items: flex-start; }
.yw-conn-login-row .yw-set-row-sub { margin-top: 2px; }
.yw-conn-access { margin-top: 16px; }
.yw-conn-access-list { margin: 4px 0 0; padding: 0; color: #929097; font-size: 12px; line-height: 1.6; list-style: none; }

/* Dark theme. */
[data-theme-root].dark .yw-conn-seg { background: #142036; }
[data-theme-root].dark .yw-conn-seg > :is(a, button) { color: #c3b9cc; }
[data-theme-root].dark .yw-conn-seg > :is(a, button):hover { background: #1c2843; color: #f3eef8; }
[data-theme-root].dark .yw-conn-seg > :is([aria-current], [aria-selected="true"]) { background: #243352; color: #f3eef8; box-shadow: none; }
[data-theme-root].dark .yw-conn-search { border-color: #1c2843; background: #0b1122; }
[data-theme-root].dark .yw-conn-search > input { color: #f3eef8; }
[data-theme-root].dark :is(.yw-conn-row, .yw-conn-rows[data-single] > .yw-conn-row:nth-child(2)) { border-color: #1c2843; }
[data-theme-root].dark .yw-conn-row[data-highlight] { background: #1c1730; box-shadow: 0 0 0 2px #3f2d5c; }
[data-theme-root].dark :is(.yw-conn-name, .yw-conn-key-name, .yw-conn-pop-h) { color: #f3eef8; }
[data-theme-root].dark :is(.yw-conn-status, .yw-conn-note, .yw-conn-count, .yw-conn-pop-ago, .yw-conn-pop-caption, .yw-conn-access-list, .yw-conn-foot, .yw-conn-empty) { color: #a297ab; }
[data-theme-root].dark .yw-conn-status > i { background: #4a4553; }
[data-theme-root].dark .yw-conn-status[data-status="connected"] > i { background: #3fbf93; }
[data-theme-root].dark .yw-conn-status[data-status="error"] { color: #e58aab; }
[data-theme-root].dark .yw-conn-status[data-status="error"] > i { background: #e58aab; }
[data-theme-root].dark .yw-conn-status[data-status="stale"] { color: #e0b25c; }
[data-theme-root].dark .yw-conn-status[data-status="stale"] > i { background: #e0b25c; }
[data-theme-root].dark :is(.yw-conn-more, .yw-set-btn.yw-conn-quiet, .yw-settings-page .yw-conn-plaid[data-look="quiet"] button) { border-color: #3c3746; background: #26232c; color: #f3eef8; }
[data-theme-root].dark .yw-settings-page .yw-conn-plaid[data-look="link"] button { color: #c9b1ff; }
[data-theme-root].dark .yw-conn-dialog { border-color: #1c2843; background: #0d1527; color: #f3eef8; }
[data-theme-root].dark .yw-conn-dialog-close:hover { background: #1c2843; color: #f3eef8; }
[data-theme-root].dark :is(.yw-conn-dialog-body, .yw-conn-pop-text, .yw-conn-pop-list, .yw-conn-pop-steps, .yw-conn-pop-detail, .yw-conn-banner, .yw-conn-key-scopes) { color: #c3b9cc; }
[data-theme-root].dark .yw-settings-page .yw-conn-paste-form input[name="url"] { border-color: #1c2843; background: #0b1122; color: #f3eef8; }
[data-theme-root].dark .yw-conn-code { background: #1c2843; color: #c3b9cc; }

/* Settings, people (10/15): this section's own look on the shared base (settings.css).

   Three sections wear this file: Assistant (tab henry), People (tab team)
   and Billing (tab billing). The additions to the shared vocabulary are
   scoped to those three tabs, so another section's file can never meet them:
     .yw-set-stack            cards stacked in one grid column
     .yw-set-form             fields two to a row (.yw-field), actions last
     .yw-set-row-main/-end    a row's left column (label over caption) and
                              its right cluster (value, link, button)
     .yw-set-row-fill         a form that IS the row (code entry, ceiling)
     .yw-set-note             one grey line (data-tone ok, warn, bad)
     .yw-set-sub-head         a plain sub-title inside a card
     .yw-set-btn-quiet        the quiet button for a SubmitButton, which
                              cannot carry data-variant
   People's own parts are .yw-sp-*, Billing's .yw-sb-*. */

:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-stack { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-grid > [data-wide] { grid-column: 1 / -1; }

/* Fields. */
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form { display: grid; gap: 14px 16px; margin-top: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form[data-tight] { margin-top: 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form-one { grid-template-columns: minmax(0, 1fr); }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form > .yw-set-row[data-flush] { min-height: 0; padding: 0; border-top: 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form > .yw-set-row[data-flush] > .yw-set-row-label { flex-shrink: 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-trunc { display: inline-block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form > .yw-set-actions { grid-column: 1 / -1; margin-top: 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-field-label { display: inline-flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 4px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-field[data-indent] { margin-left: 24px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) :is(.yw-set-select, .yw-sp-input) { display: block; width: 100%; min-height: 34px; padding: 0 10px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #202024; font: inherit; font-size: 13px; letter-spacing: -.2px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) :is(.yw-set-select, select.yw-sp-input) { padding-right: 28px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) :is(.yw-set-select, .yw-sp-input):focus { border-color: #b993ff; outline: none; box-shadow: 0 0 0 3px rgba(185, 147, 255, .22); }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) :is(.yw-set-select, .yw-sp-input):disabled { opacity: .6; cursor: not-allowed; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-sp-input[data-size="num"] { width: 104px; text-align: right; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-sp-input[data-size="code"] { width: 160px; }

/* Rows. */
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-main { display: flex; min-width: 0; flex: 1 1 auto; flex-direction: column; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-end { display: inline-flex; min-width: 0; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 14px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-ink { color: #202024; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-sub[data-tone="ok"] { color: #279876; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-sub[data-tone="warn"] { color: #b7791f; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-sub[data-tone="bad"] { color: #c85f84; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row[data-wrap] { flex-wrap: wrap; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row[data-dense] { min-height: 38px; padding: 6px 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-fill { display: flex; width: 100%; min-width: 0; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-flash { flex-basis: 100%; font-size: 12px; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-flash:empty { display: none; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-row-flash p { font-size: 12px; font-weight: 400; }

/* Lines and sub-titles. */
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-note { margin: 10px 0 0; color: #929097; font-size: 12px; line-height: 1.5; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-note[data-first] { margin-top: 0; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-note[data-tone="ok"] { color: #279876; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-note[data-tone="warn"] { color: #b7791f; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-note[data-tone="bad"] { color: #c85f84; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-sub-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 20px 0 2px; color: #202024; font-size: 14px; font-weight: 500; letter-spacing: -.25px; }

/* Actions. */
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-btn-quiet { border: 1px solid #e2e1e4; background: #fff; color: #202024; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-btn-quiet:hover { border-color: #d5c4e6; background: #f8f5fb; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-actions[data-start] { justify-content: flex-start; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-actions > :is(p[role="alert"], p[role="status"]) { margin-right: auto; font-size: 13px; font-weight: 400; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-link[data-quiet] { color: #59535f; }
:is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-link:disabled { opacity: .5; cursor: default; }

@media (max-width: 640px) {
  :is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form { grid-template-columns: minmax(0, 1fr); }
  :is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-form > .yw-field[data-span] { grid-column: auto; }
}

/* ---- People ------------------------------------------------------------ */

.yw-sp { display: flex; min-width: 0; flex-direction: column; gap: 16px; }

/* The roster: name (role as a caption), contact, access, actions. */
.yw-sp-list { margin: 0; padding: 0; list-style: none; }
.yw-sp-row { display: grid; align-items: center; gap: 4px 18px; padding: 11px 0; border-top: 1px solid #eae8ec; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.5fr) minmax(0, 1fr) 132px; }
.yw-sp-list > .yw-sp-row:first-child { border-top: 0; }
.yw-sp-row[data-head] { margin-top: 12px; padding: 0 0 7px; border-top: 0; border-bottom: 1px solid #eae8ec; color: #929097; font-size: 12px; }
.yw-sp-who { display: flex; min-width: 0; flex-direction: column; }
.yw-sp-name { color: #202024; font-size: 14px; }
.yw-sp-cap { display: flex; flex-wrap: wrap; gap: 0 6px; margin-top: 2px; color: #929097; font-size: 12px; }
.yw-sp-cap > span + span::before { content: "·"; margin-right: 6px; color: #c4c0c9; }
.yw-sp-cap > [data-tone="bad"] { color: #c85f84; }
.yw-sp-contact { min-width: 0; color: #59535f; font-size: 13px; overflow-wrap: anywhere; }
.yw-sp-contact[data-quiet] { color: #929097; }
.yw-sp-contact[data-contact-line] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.yw-sp-contact .yw-set-link { overflow-wrap: anywhere; }
.yw-sp-access, .yw-sp-badge { color: #929097; font-size: 13px; }
.yw-sp-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; white-space: nowrap; }
.yw-sp-mono { font-family: var(--font-geist-mono), ui-monospace, monospace; overflow-wrap: anywhere; color: #59535f; }
.yw-sp-inline-cap { margin-left: 8px; color: #929097; font-size: 12px; font-weight: 400; }
@media (max-width: 760px) {
  .yw-sp-row { grid-template-columns: minmax(0, 1fr) 132px; }
  .yw-sp-row[data-head] { display: none; }
  .yw-sp-list > .yw-sp-row > :is(.yw-sp-contact, .yw-sp-access) { grid-column: 1; }
  .yw-sp-list > .yw-sp-row > .yw-sp-actions { grid-column: 2; grid-row: 1; }
}

/* Add a person and the access section: no box inside the card. */
.yw-sp-add { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.yw-sp-add > .yw-set-actions { margin-top: 0; }
.yw-sp-access { display: flex; flex-direction: column; gap: 14px; }
.yw-sp-access-body { display: flex; flex-direction: column; gap: 10px; }
.yw-sp-access > .yw-sp-group > .yw-sp-access-body { margin-top: 12px; }
.yw-sp-sentence { margin: 0; color: #202024; font-size: 13px; line-height: 1.5; }
.yw-sp-check { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; color: #202024; font-size: 13px; }
.yw-sp-check[data-top] { align-items: flex-start; }
.yw-sp-check > input[type="checkbox"] { width: 15px; height: 15px; margin: 0; accent-color: #7c3aed; }
.yw-sp-check[data-top] > input[type="checkbox"] { margin-top: 2px; }
.yw-sp-check-sub { color: #929097; font-size: 12px; }
.yw-sp-check-sub[data-tone="bad"] { color: #c85f84; }
.yw-sp-checks { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 0; list-style: none; }
ul.yw-sp-checks { flex-direction: column; }
.yw-sp-group { padding-top: 14px; border-top: 1px solid #eae8ec; }
.yw-sp-group-head { margin: 0 0 8px; color: #202024; font-size: 14px; font-weight: 500; }
.yw-sp-fieldset { display: flex; min-width: 0; flex-direction: column; gap: 10px; margin: 0; padding: 0; border: 0; }
.yw-sp-fieldset:disabled { opacity: .7; }

/* A fold (the page checklist, targets, usage tracking, the sheet's More):
   a row with a chevron, its body under a hairline. */
.yw-sp-fold { border-top: 1px solid #eae8ec; }
.yw-sp-fold-head { display: flex; min-height: 42px; align-items: center; gap: 8px; color: #202024; font-size: 14px; list-style: none; cursor: pointer; }
.yw-sp-fold-head::-webkit-details-marker { display: none; }
.yw-sp-fold-sub { color: #929097; font-size: 12px; }
.yw-sp-fold-chev { margin-left: auto; color: #a59fab; font-size: 12px; transition: transform .16s; }
.yw-sp-fold[open] > .yw-sp-fold-head > .yw-sp-fold-chev { transform: rotate(180deg); }
.yw-sp-fold-body { display: flex; flex-direction: column; gap: 12px; padding: 4px 0 12px; }
.yw-sp-pick-space + .yw-sp-pick-space { padding-top: 10px; border-top: 1px solid #eae8ec; }
.yw-sp-pick-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.yw-sp-pick-head .yw-sp-check { font-weight: 500; }
.yw-sp-pick-list { display: flex; flex-direction: column; gap: 6px; margin: 8px 0 0 23px; padding: 0; list-style: none; }
.yw-sp-pick-tool { display: inline-flex; min-width: 0; flex: 1 1 0; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.yw-sp-pick-covers { flex-basis: 100%; color: #929097; font-size: 12px; }

/* The person popup: the card's title in the head, sections with hairlines. */
.yw-sp-modal { border: 1px solid #e2e1e4; border-radius: 24px; background: #fbfbfb; color: #202024; box-shadow: 0 24px 60px rgba(0, 0, 0, .18); font-family: var(--font-geist-sans), Geist, system-ui, sans-serif; font-size: 14px; letter-spacing: -.25px; }
.yw-sp-modal::backdrop { background: rgba(20, 16, 28, .45); }
.yw-sp-modal-head { display: flex; align-items: flex-start; gap: 12px; padding: 20px 23px 14px; border-bottom: 1px solid #eae8ec; }
.yw-sp-modal-head > div { min-width: 0; }
.yw-sp-modal-close { margin-left: auto; flex-shrink: 0; padding: 2px 8px; border: 0; border-radius: 10px; background: none; color: #929097; font-size: 20px; line-height: 1; cursor: pointer; }
.yw-sp-modal-close:hover { background: #f0eef3; color: #202024; }
.yw-sp-modal-body { min-height: 0; flex: 1 1 auto; overflow-y: auto; padding: 4px 23px 20px; }
.yw-sp-sheet { display: flex; flex-direction: column; }
.yw-sp-section { padding: 16px 0; border-top: 1px solid #eae8ec; }
.yw-sp-sheet > .yw-sp-section:first-child { border-top: 0; }
.yw-sp-section-title { margin: 0 0 12px; color: #202024; font-size: 15px; font-weight: 500; letter-spacing: -.3px; }
.yw-sp-fold-head > .yw-sp-section-title { margin: 0; }
details.yw-sp-section { padding-bottom: 0; }
details.yw-sp-section > .yw-sp-fold-head { min-height: 0; }
details.yw-sp-section > .yw-sp-fold-body { padding-top: 14px; }
.yw-sp-login { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #eae8ec; color: #929097; font-size: 12px; }
.yw-sp-picture { display: flex; flex-direction: column; gap: 6px; color: #87818c; font-size: 12px; }
.yw-sp-picture-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.yw-sp-picture-row form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.yw-sp-file { color: #59535f; font-size: 12px; }
.yw-sp-file::file-selector-button { margin-right: 8px; padding: 4px 10px; border: 1px solid #e2e1e4; border-radius: 8px; background: #fff; color: #202024; font: inherit; cursor: pointer; }
.yw-sp-more-form { display: flex; flex-direction: column; gap: 4px; }
.yw-sp-more-form > .yw-sp-fold:first-of-type { border-top: 0; }

/* Presets. */
.yw-sp-editor { display: flex; flex-direction: column; gap: 16px; margin-top: 12px; }
.yw-sp-editor-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.yw-sp-editor-head > .yw-sp-section-title { margin: 0; }
.yw-sp-editor-head > .yw-set-link { margin-left: auto; }

/* Access and guest-details history. */
.yw-sp-log { color: #202024; font-size: 13px; overflow-wrap: anywhere; }
.yw-sp-log-verb { color: #929097; }

/* ---- Billing ----------------------------------------------------------- */

.yw-sb { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
.yw-sb-flashes { display: flex; flex-direction: column; gap: 4px; }
.yw-sb-flashes > .yw-set-note { margin: 0; color: #59535f; font-size: 13px; }

/* Credits: the month's use as the hero, the track under it. */
/* Credits across the top: the figures left, where they went right (10/15). */
.yw-sb-credits-body { display: grid; gap: 0 40px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.yw-sb-credits-body:not(:has(> .yw-sb-credits-where)) { grid-template-columns: minmax(0, 1fr); }
.yw-sb-credits-main, .yw-sb-credits-where { min-width: 0; }
[data-settings-tab="billing"] .yw-sb-credits-where > .yw-set-sub-head { margin-top: 16px; }
@media (max-width: 900px) { .yw-sb-credits-body { grid-template-columns: minmax(0, 1fr); } }
.yw-sb-hero { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 16px 0 12px; }
.yw-sb-hero-value { color: #202024; font-size: clamp(34px, 3.2vw, 46px); font-weight: 500; line-height: 1.1; letter-spacing: -.05em; }
.yw-sb-hero-of { color: #929097; font-size: 13px; }
.yw-sb-track[data-step="pace"] .yw-track-fill { background: repeating-linear-gradient(125deg, #c98a2b 0 2px, #f2dcb5 2px 4px); }
.yw-sb-track:is([data-step="warn"], [data-step="spent"]) .yw-track-fill { background: repeating-linear-gradient(125deg, #c85f84 0 2px, #f1cfdc 2px 4px); }
.yw-sb-sub-figure { color: #59535f; font-size: 13px; font-weight: 400; }
.yw-sb-prices { display: flex; min-width: 220px; flex-direction: column; gap: 3px; }
.yw-sb-price { display: flex; justify-content: space-between; gap: 16px; }
.yw-sb-prices-note { display: block; margin: 4px 0; }
.yw-sb-money { display: inline-flex; align-items: center; gap: 6px; color: #929097; }

/* Plans: the tiers side by side with a hairline between, no box. */
.yw-sb-tiers { display: grid; margin-top: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.yw-sb-tiers[data-count="1"] { grid-template-columns: minmax(0, 1fr); }
.yw-sb-tiers[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.yw-sb-tier { display: flex; min-width: 0; flex-direction: column; gap: 6px; padding: 4px 20px; border-left: 1px solid #eae8ec; }
.yw-sb-tier:first-child { padding-left: 0; border-left: 0; }
.yw-sb-tier:last-child { padding-right: 0; }
.yw-sb-tier-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0; color: #202024; font-size: 14px; font-weight: 500; }
.yw-sb-tier-mine { color: #279876; font-size: 12px; font-weight: 400; }
.yw-sb-tier-price { display: flex; align-items: baseline; gap: 6px; margin: 0; color: #202024; font-size: 28px; font-weight: 500; letter-spacing: -.04em; }
.yw-sb-tier-unit { color: #929097; font-size: 13px; letter-spacing: -.2px; }
.yw-sb-tier-job { margin: 0; color: #929097; font-size: 12px; line-height: 1.5; }
.yw-sb-tier-list { display: flex; flex-direction: column; gap: 4px; margin: 6px 0 0; padding: 0; list-style: none; color: #59535f; font-size: 13px; }
.yw-sb-tier-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 10px; }
.yw-sb-tier-actions > .yw-sb-tier-job { flex-basis: 100%; }
.yw-sb-plan-rows { margin-top: 18px; border-top: 1px solid #eae8ec; }
.yw-sb-plan-rows > .yw-set-row:first-child { border-top: 0; }
@media (max-width: 760px) {
  .yw-sb-tiers, .yw-sb-tiers[data-count] { grid-template-columns: minmax(0, 1fr); }
  .yw-sb-tier { padding: 14px 0; border-top: 1px solid #eae8ec; border-left: 0; }
  .yw-sb-tier:first-child { padding-top: 4px; border-top: 0; }
}

/* ---- Dark theme --------------------------------------------------------- */

[data-theme-root].dark :is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) :is(.yw-set-select, .yw-sp-input, .yw-set-btn-quiet) { border-color: #3c3746; background: #26232c; color: #f3eef8; }
[data-theme-root].dark :is(.yw-set-row-ink, .yw-set-sub-head, .yw-sp-name, .yw-sp-sentence, .yw-sp-check, .yw-sp-group-head, .yw-sp-fold-head, .yw-sp-section-title, .yw-sp-log, .yw-sb-hero-value, .yw-sb-tier-name, .yw-sb-tier-price) { color: #f3eef8; }
[data-theme-root].dark :is(.yw-sp-contact, .yw-sp-mono, .yw-sb-tier-list, .yw-sb-sub-figure, .yw-sp-file) { color: #c3b9cc; }
[data-theme-root].dark :is(.yw-sp-row, .yw-sp-group, .yw-sp-fold, .yw-sp-section, .yw-sp-login, .yw-sp-pick-space, .yw-sb-tier, .yw-sb-plan-rows, .yw-sp-modal-head) { border-color: #34303c; }
[data-theme-root].dark .yw-sp-modal { border-color: #34303c; background: #1d1a22; color: #f3eef8; }
[data-theme-root].dark .yw-sp-modal-close:hover { background: #2c2833; color: #f3eef8; }
[data-theme-root].dark :is([data-settings-tab="henry"], [data-settings-tab="team"], [data-settings-tab="billing"]) .yw-set-link[data-quiet] { color: #c3b9cc; }

/* ---- Inner scrollers (10/15, owner: "the integrated scroller on
   containers that get too long"): a list that can grow scrolls inside its
   card (.yw-tasks-scroll, skin/floor.css), and the roster's head row stays
   pinned with the card's own background. ---- */
.yw-tasks-scroll > .yw-sp-row[data-head] { position: sticky; top: 0; z-index: 1; margin-top: 0; padding-top: 4px; background: #fbfbfb; }
.yw-sp-fold > .yw-tasks-scroll { margin-top: 0; }
.yw-sb-price-list { display: flex; max-height: 260px; flex-direction: column; gap: 3px; margin: 2px -4px; padding: 0 4px; }
[data-theme-root].dark .yw-tasks-scroll > .yw-sp-row[data-head] { background: #1f1d24; }

/* Rate parity (10/7, Wave 1 of docs plan "Rate Parity: simplify"): one
   screen, one question, "is any booking site cheaper than you?", on the
   Dashboard Overview's skin. Skin and layout only: every figure is
   lib/parity-board.ts's (buildParityBoard, parityNightTable, parityFixesFor).

   The page wears the kit (`yw-kit yw-parity` on its root, skin/kit.css):
   .yw-card, CardHead, .yw-hero-value, HeroPill, RowStats, NeedsCard. This
   file only places the cards and draws the night table.

   Desktop: two columns.
     lead     hero, then Needs you (only when something is wrong), then one
              card per running channel test (Wave 3, 10/8)
     nights   the table card: the night to look at first, then every other
              checked night, all expanded (no folds)
   Phone (<= 900px): one column in that source order.
   Every colour here has a [data-theme-root].dark twin at the bottom. */

.yw-parity-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.38fr); gap: 14px; align-items: start; margin-top: 12px; }
.yw-parity-grid > [data-slot] { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.yw-parity .yw-card-head { margin-bottom: 4px; }
.yw-parity .yw-hero-value { overflow-wrap: anywhere; }
.yw-parity .yw-hero-value[data-tone="bad"] { color: #b84d78; }
.yw-parity .yw-hero-value[data-tone="warn"] { color: #a8702a; }
.yw-parity .yw-hero-status .yw-status-dot { margin-right: 2px; }
.yw-parity .yw-row-stats { margin-top: 4px; }
.yw-parity .yw-row-stat dd { text-align: right; }
.yw-parity-stat-sub { display: block; margin-top: 2px; color: #929097; font-size: 11px; font-weight: 400; }
.yw-parity-stat-warn { color: #b84d78; }
.yw-parity-run { margin-top: 10px; }
.yw-parity-run-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0; color: #929097; font-size: 12px; }
.yw-parity-running { display: inline-flex; align-items: center; gap: 6px; color: #7445a7; font-weight: 500; }
.yw-parity-running-dot { width: 6px; height: 6px; border-radius: 50%; background: #8e4af0; animation: yw-parity-pulse 1.2s ease-in-out infinite; }
.yw-parity-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; padding: 9px 12px; border-radius: 12px; background: #fbf0dc; color: #8a5a1c; font-size: 12px; }
.yw-parity-check-now { color: #8553c2; font-size: 12px; font-weight: 500; }
.yw-parity-check-now:hover, .yw-parity-check-now:focus-visible { text-decoration: underline; text-underline-offset: 2px; }
.yw-parity-check-now-button { display: inline-flex; align-items: center; min-height: 34px; margin-top: 12px; padding: 0 12px; border: 1px solid #e3d9ee; border-radius: 10px; color: #7445a7; font-size: 12px; font-weight: 500; }
.yw-parity-check-now-button:hover { border-color: #d5c4e6; background: #f5f0fa; }

/* The Needs rows' actions: the fix "?" beside Assign, on the face of the row. */
.yw-parity .yw-needs-row-actions > .yw-parity-row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.yw-parity .yw-needs-row { min-height: 60px; }
.yw-parity .yw-needs-row-title { white-space: normal; }

/* The fix panel behind the "?" (fix-dot.tsx). */
.yw-parity-fix-panel { position: absolute; right: 0; top: 32px; z-index: 40; width: min(22rem, calc(100vw - 2rem)); padding: 14px; border: 1px solid #e2e1e4; border-radius: 16px; background: #fff; box-shadow: 0 10px 28px rgba(48, 32, 64, .12); text-align: left; }
.yw-parity-fix-panel h3 { margin: 0; color: #202024; font-size: 13px; font-weight: 500; }
.yw-parity-fix-amount { margin: 2px 0 0; font-size: 12px; }
.yw-parity-fix-amount[data-tone="bad"] { color: #b84d78; }
.yw-parity-fix-amount[data-tone="warn"] { color: #a8702a; }
.yw-parity-fix-panel ol { margin: 8px 0 0; padding-left: 16px; color: #59535f; font-size: 12px; line-height: 1.55; list-style: decimal; }
.yw-parity-fix-panel ol > li + li { margin-top: 3px; }
.yw-parity-fix-checks { margin-top: 8px; padding-top: 8px; border-top: 1px solid #eae8ec; color: #87818c; font-size: 11px; line-height: 1.5; }
.yw-parity-fix-checks h4 { margin: 0 0 3px; color: #929097; font-size: 10px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.yw-parity-fix-links { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #eae8ec; }
.yw-parity-fix-links a { color: #8553c2; font-size: 12px; font-weight: 500; }
.yw-parity-fix-trigger { display: inline-grid; place-items: center; width: 26px; height: 26px; border: 1px solid #f0d3df; border-radius: 50%; background: #f8e8ef; color: #b84d78; font-size: 11px; font-weight: 600; }
.yw-parity-fix-trigger[data-tone="warn"] { border-color: #f0dfbf; background: #fbf0dc; color: #a8702a; }

/* ------------------------------------------------- channel test card -- */
.yw-parity-test .yw-hero-value { font-size: 26px; }
.yw-parity-test-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.yw-parity-test-decide { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 1px solid #e3d9ee; border-radius: 10px; color: #7445a7; font-size: 12px; font-weight: 500; }
.yw-parity-test-decide:hover, .yw-parity-test-decide:focus-visible { border-color: #d5c4e6; background: #f5f0fa; }
.yw-parity-test-limit { margin: 12px 0 0; padding-top: 10px; border-top: 1px solid #eae8ec; color: #929097; font-size: 11px; line-height: 1.5; }

/* The Results list of channel tests (results/channel-tests-card.tsx). */
.yw-ct-table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 13px; }
.yw-ct-table th { padding: 6px 8px 6px 0; color: #929097; font-size: 10px; font-weight: 500; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
.yw-ct-table td { padding: 9px 8px 9px 0; border-top: 1px solid #eeedf1; color: #343039; vertical-align: top; }
.yw-ct-table td[data-num], .yw-ct-table th[data-num] { text-align: right; }
.yw-ct-sub { display: block; margin-top: 1px; color: #a09aa4; font-size: 11px; }
.yw-ct-verdict[data-kind="stop_loss"] { color: #b84d78; font-weight: 500; }
.yw-ct-verdict[data-kind="switching"], .yw-ct-verdict[data-kind="holding"], .yw-ct-verdict[data-kind="kept"] { color: #2f8a6d; }
.yw-ct-wrap { overflow-x: auto; }
.yw-ct-results { margin-top: 24px; }

/* ------------------------------------------- booking sites at a glance -- */
.yw-parity-glance-list { margin: 6px 0 0; padding: 0; list-style: none; }
.yw-parity-glance-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid #eeedf1; font-size: 13px; }
.yw-parity-glance-row:first-child { border-top: 0; }
.yw-parity-glance-site { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 12px; min-width: 0; color: #343039; }
.yw-parity-glance-count { color: #59535f; font-size: 12px; white-space: nowrap; }
.yw-parity-glance-gap { display: inline-flex; align-items: flex-start; gap: 10px; min-width: 150px; justify-content: flex-end; text-align: right; }
.yw-parity-glance-gap .yw-parity-status { min-width: 52px; }
.yw-parity-glance-row[data-status="none"] .yw-parity-site, .yw-parity-glance-row[data-status="none"] .yw-parity-glance-count { color: #a09aa4; font-weight: 400; }

/* ------------------------------------------------------ the night table -- */
.yw-parity-night { padding: 16px 0 6px; border-top: 1px solid #eae8ec; }
.yw-parity-night:first-of-type { border-top: 0; padding-top: 10px; }
.yw-parity-night-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.yw-parity-night-head h3 { margin: 0; color: #202024; font-size: 15px; font-weight: 500; letter-spacing: -.2px; }
.yw-parity-night[data-primary] .yw-parity-night-head h3 { font-size: 17px; }
.yw-parity-first { margin-left: 6px; color: #8553c2; font-size: 11px; font-weight: 500; }
.yw-parity-tone { color: #87818c; font-size: 12px; }
.yw-parity-tone[data-tone="bad"] { color: #b84d78; }
.yw-parity-tone[data-tone="warn"] { color: #a8702a; }
.yw-parity-tone[data-tone="ok"] { color: #2f8a6d; }
.yw-parity-base { margin: 3px 0 0; color: #929097; font-size: 12px; }
.yw-parity-empty { margin: 8px 0 6px; color: #87818c; font-size: 13px; }
.yw-parity-empty[data-tone="warn"] { color: #a8702a; }
.yw-parity-table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 13px; }
.yw-parity-table th { padding: 6px 6px 6px 0; color: #929097; font-size: 10px; font-weight: 500; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
.yw-parity-table th[data-num], .yw-parity-table td[data-num] { text-align: right; }
.yw-parity-table td { padding: 9px 6px 9px 0; border-top: 1px solid #eeedf1; color: #343039; vertical-align: top; }
.yw-parity-table th:last-child, .yw-parity-table td:last-child { padding-right: 0; }
.yw-parity-table tr[data-kind="own"] td { background: #f6f3fa; }
.yw-parity-table tr[data-kind="own"] td:first-child { padding-left: 8px; border-radius: 8px 0 0 8px; }
.yw-parity-table tr[data-kind="own"] td:last-child { border-radius: 0 8px 8px 0; }
.yw-parity-site { display: block; font-weight: 500; }
.yw-parity-note { display: block; margin-top: 1px; color: #a09aa4; font-size: 11px; }
.yw-parity-price { font-weight: 500; white-space: nowrap; }
.yw-parity-muted { color: #a09aa4; }
.yw-parity-vs { white-space: nowrap; }
.yw-parity-vs[data-status="under"] { color: #b84d78; font-weight: 500; }
.yw-parity-vs[data-status="above"] { color: #2f8a6d; }
.yw-parity-pct { display: block; color: #a09aa4; font-size: 11px; font-weight: 400; }
.yw-parity-status { display: inline-flex; align-items: center; gap: 6px; color: #59535f; font-size: 12px; white-space: nowrap; }
.yw-parity-status .yw-status-dot { box-shadow: none; }
.yw-parity-other { margin: 8px 0 4px; color: #87818c; font-size: 12px; line-height: 1.5; }
.yw-parity-other strong { color: #59535f; font-weight: 500; }
.yw-parity-foot { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid #eae8ec; color: #929097; font-size: 12px; line-height: 1.5; }
.yw-parity-foot p { margin: 0; }
.yw-parity-foot p + p { margin-top: 4px; }

@keyframes yw-parity-pulse { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .yw-parity-running-dot { animation: none; } }

/* ---------------------------------------------------------------- phone -- */
@media (max-width: 900px) {
  .yw-parity-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .yw-parity .yw-card { padding: 18px; }
  .yw-parity-table { font-size: 12px; }
  .yw-parity-table td { padding-top: 8px; padding-bottom: 8px; }
  /* The word beside the dot goes; the dot and the "vs you" figure carry it. */
  .yw-parity-glance-site { grid-template-columns: minmax(0, 1fr); }
  .yw-parity-glance-gap { min-width: 0; }
  .yw-parity-glance-gap .yw-parity-status { min-width: 0; }
  .yw-parity-status-word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  /* The glance card has the room: its word stays. */
  .yw-parity-glance .yw-parity-status-word { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
}

/* ----------------------------------------------------------------- dark -- */
[data-theme-root].dark .yw-parity .yw-card { border-color: #414148; background: #2a2a30; box-shadow: none; }
[data-theme-root].dark .yw-parity .yw-hero-value[data-tone="bad"], [data-theme-root].dark .yw-parity-stat-warn, [data-theme-root].dark .yw-parity-tone[data-tone="bad"], [data-theme-root].dark .yw-parity-vs[data-status="under"], [data-theme-root].dark .yw-parity-fix-amount[data-tone="bad"] { color: #e6a9c4; }
[data-theme-root].dark .yw-parity .yw-hero-value[data-tone="warn"], [data-theme-root].dark .yw-parity-tone[data-tone="warn"], [data-theme-root].dark .yw-parity-empty[data-tone="warn"], [data-theme-root].dark .yw-parity-fix-amount[data-tone="warn"] { color: #e6bd7f; }
[data-theme-root].dark .yw-parity-tone[data-tone="ok"], [data-theme-root].dark .yw-parity-vs[data-status="above"] { color: #7fd3b4; }
[data-theme-root].dark .yw-parity-stat-sub, [data-theme-root].dark .yw-parity-run-line, [data-theme-root].dark .yw-parity-tone, [data-theme-root].dark .yw-parity-base, [data-theme-root].dark .yw-parity-empty, [data-theme-root].dark .yw-parity-table th, [data-theme-root].dark .yw-parity-note, [data-theme-root].dark .yw-parity-muted, [data-theme-root].dark .yw-parity-pct, [data-theme-root].dark .yw-parity-other, [data-theme-root].dark .yw-parity-foot, [data-theme-root].dark .yw-parity-fix-checks, [data-theme-root].dark .yw-parity-fix-checks h4 { color: #a297ab; }
[data-theme-root].dark .yw-parity-night-head h3, [data-theme-root].dark .yw-parity-table td, [data-theme-root].dark .yw-parity-fix-panel h3 { color: #f3eef8; }
[data-theme-root].dark .yw-parity-status, [data-theme-root].dark .yw-parity-other strong, [data-theme-root].dark .yw-parity-fix-panel ol { color: #d9cfe3; }
[data-theme-root].dark .yw-parity-night, [data-theme-root].dark .yw-parity-foot, [data-theme-root].dark .yw-parity-fix-checks, [data-theme-root].dark .yw-parity-fix-links { border-top-color: #414148; }
[data-theme-root].dark .yw-parity-table td, [data-theme-root].dark .yw-parity-glance-row { border-top-color: #38383f; }
[data-theme-root].dark .yw-parity-glance-site { color: #f3eef8; }
[data-theme-root].dark .yw-parity-glance-count { color: #d9cfe3; }
[data-theme-root].dark .yw-parity-glance-row[data-status="none"] .yw-parity-site, [data-theme-root].dark .yw-parity-glance-row[data-status="none"] .yw-parity-glance-count { color: #a297ab; }
[data-theme-root].dark .yw-parity-table tr[data-kind="own"] td { background: #33303b; }
[data-theme-root].dark .yw-parity-first, [data-theme-root].dark .yw-parity-check-now, [data-theme-root].dark .yw-parity-fix-links a { color: #c5a8ff; }
[data-theme-root].dark .yw-parity-running { color: #c5a8ff; }
[data-theme-root].dark .yw-parity-running-dot { background: #c5a8ff; }
[data-theme-root].dark .yw-parity-banner { background: #493c2c; color: #e6bd7f; }
[data-theme-root].dark .yw-parity-check-now-button { border-color: #4a3f5c; color: #c5a8ff; }
[data-theme-root].dark .yw-parity-check-now-button:hover { border-color: #5c4a78; background: #35303f; }
[data-theme-root].dark .yw-parity-fix-panel { border-color: #414148; background: #2a2a30; box-shadow: 0 10px 28px rgba(0, 0, 0, .35); }
[data-theme-root].dark .yw-parity-test-decide { border-color: #4a3f5c; color: #c5a8ff; }
[data-theme-root].dark .yw-parity-test-decide:hover, [data-theme-root].dark .yw-parity-test-decide:focus-visible { border-color: #5c4a78; background: #35303f; }
[data-theme-root].dark .yw-parity-test-limit, [data-theme-root].dark .yw-ct-table th, [data-theme-root].dark .yw-ct-sub { color: #a297ab; }
[data-theme-root].dark .yw-parity-test-limit { border-top-color: #414148; }
[data-theme-root].dark .yw-ct-table td { border-top-color: #38383f; color: #f3eef8; }
[data-theme-root].dark .yw-ct-verdict[data-kind="stop_loss"] { color: #e6a9c4; }
[data-theme-root].dark .yw-ct-verdict[data-kind="switching"], [data-theme-root].dark .yw-ct-verdict[data-kind="holding"], [data-theme-root].dark .yw-ct-verdict[data-kind="kept"] { color: #7fd3b4; }
[data-theme-root].dark .yw-parity-fix-trigger { border-color: #5a3a4a; background: #4a3040; color: #e6a9c4; }
[data-theme-root].dark .yw-parity-fix-trigger[data-tone="warn"] { border-color: #5a4a33; background: #493c2c; color: #e6bd7f; }

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