/* P&L (pnl/**, 10/03 to 10/11): Flash, Books and Trends in the dashboard
   design the owner reviewed on the design branch. Loaded after
   skin/money.css and skin/money-owner.css.

   The shared rows the design rides on (the Get Paid row stats, list
   scrollers, hover meta) are not in testing's money.css for Money pages, so
   this file carries them, narrowed to the P&L page with :where() so they add
   no weight and reach no other Money page. Then the design branch's P&L
   rules, which replace the wave 5 and Books (#3784) blocks that money.css
   carried, then the P&L skin itself. */

/* ---- the shared rows, from the design branch's Money skin ---- */
.yw-money-page:where(.yw-pnl-page) { font-family: var(--font-geist-sans), Geist, system-ui, sans-serif; font-size: 14px; letter-spacing: -.25px; /* The dashboard's warm greys (skin/base.css, overview.css): hairline #eae8ec, card border #e2e1e4, captions #929097, labels #87818c, row value #131f35, ink #202024. */ --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; /* The accent and its tints. */ --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; /* Good, bad and amber words (never values). */ --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; }
.hw-info-body .yw-money-hover-meta { display: block; margin-bottom: 8px; color: #8f8996; font-size: 11px; line-height: 1.45; }
:where(.yw-pnl-page) .yw-money-parts > .yw-row-stat, :where(.yw-pnl-page) .yw-money-parts > details > summary.yw-row-stat { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; row-gap: 9px; padding: 15px 0 14px; }
:where(.yw-pnl-page) .yw-money-grid:not(.yw-money-grid--after) > .yw-money-card { display: flex; flex-direction: column; }
:where(.yw-pnl-page) .yw-money-grid:not(.yw-money-grid--after) > .yw-money-card > .yw-money-card-body { display: flex; flex: 1 1 auto; flex-direction: column; }
:where(.yw-pnl-page) .yw-money-parts { display: flex; flex: 1 1 auto; flex-direction: column; justify-content: space-between; }
:where(.yw-pnl-page) .yw-money-parts .yw-row-stat-value { color: #202024; font-size: 22px; letter-spacing: -.7px; }
:where(.yw-pnl-page) .yw-money-parts > .yw-row-stat > span:first-child, :where(.yw-pnl-page) .yw-money-parts > details > summary > span:first-child { color: #59535f; font-size: 13px; }
[data-theme-root].dark .hw-info-body .yw-money-hover-meta { color: #a297ab; }
[data-theme-root].dark :where(.yw-pnl-page) .yw-money-parts .yw-row-stat-value { color: #f3eef8; }
[data-theme-root].dark :where(.yw-pnl-page) .yw-money-parts > .yw-row-stat > span:first-child, [data-theme-root].dark :where(.yw-pnl-page) .yw-money-parts > details > summary > span:first-child { color: #c3b9cc; }
[data-theme-root].dark .yw-money-page:where(.yw-pnl-page) .yw-row-stat[data-quiet] > .yw-row-stat-value { color: #8f8996; }
:where(.yw-pnl-page) .yw-money-overflow[data-scroll="list"] { max-height: 34rem; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ddd2e7 transparent; }
:where(.yw-pnl-page) .yw-money-overflow[data-scroll="list"] > .yw-money-table thead th { box-shadow: inset 0 -1px 0 #eae8ec; }
[data-theme-root].dark :where(.yw-pnl-page) .yw-money-overflow[data-scroll="list"] > .yw-money-table thead th { box-shadow: inset 0 -1px 0 #1c2843; }
[data-theme-root].dark :where(.yw-pnl-page) .yw-money-overflow[data-scroll="list"] { scrollbar-color: #273656 transparent; }
:where(.yw-pnl-page) .yw-money-note[data-tone="watch"] { color: #9a805f; }
[data-theme-root].dark :where(.yw-pnl-page) .yw-money-note[data-tone="watch"] { color: #e6bd7f; }

/* ---- yw-pnl-*: the design branch's money.css rules for this section ---- */
.yw-pnl-views { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; }
.yw-pnl-views + .yw-money-grid, .yw-pnl-views + .yw-pnl-trends > .yw-money-grid:first-child { margin-top: 14px; }
.yw-pnl-grid > :only-child { grid-column: 1 / -1; }
.yw-pnl-grid:has(> :nth-child(2)):not(:has(> :nth-child(3))) > :last-child:not(.yw-money-span-2) { grid-column: span 2; }
.yw-pnl-trends > .yw-money-grid + .yw-money-stack, .yw-pnl-trends > .yw-money-stack + .yw-money-grid { margin-top: 16px; }
.yw-pnl-close-status { margin: 14px 0 0; color: #343039; font-size: 13px; line-height: 1.5; }
.yw-pnl-close-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; }
.yw-pnl-notes { margin-top: 8px; }
.yw-pnl-notes > .yw-money-note { margin-top: 4px; }
.yw-pnl-note-lead { font-weight: 500; }
.yw-pnl-softopen { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.yw-pnl-softopen .yw-text-link, .yw-pnl-note-form .yw-text-link { padding: 0; border: 0; background: none; cursor: pointer; }
.yw-pnl-empty .yw-card-sub { max-width: 46rem; }
.yw-pnl-launch-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; color: #59535f; font-size: 13px; }
.yw-pnl-launch-form label { display: inline-flex; align-items: center; gap: 8px; }
.yw-money-page .yw-pnl-launch-form input[type="month"] { height: 36px; padding: 0 10px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #202024; font-size: 13px; }
.yw-pnl-scroll { margin-top: 14px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #ddd2e7 transparent; }
.yw-money-page .yw-pnl-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.yw-money-page .yw-pnl-table[data-wide] { min-width: 640px; }
.yw-money-page .yw-pnl-table th { padding: 10px 8px; color: #766d7c; font-size: 13px; font-weight: 500; line-height: 1.35; letter-spacing: 0; text-align: right; text-transform: none; white-space: nowrap; vertical-align: bottom; }
.yw-money-page .yw-pnl-table td { padding: 10px 8px; border-top: 1px solid #eae8ec; color: #49434e; line-height: 1.35; text-align: right; white-space: nowrap; vertical-align: top; }
.yw-money-page .yw-pnl-table :is(th, td):first-child { position: sticky; left: 0; z-index: 1; padding-left: 0; background: #fbfbfb; text-align: left; }
.yw-money-page .yw-pnl-table td:first-child { min-width: 12rem; max-width: 22rem; color: #343039; white-space: normal; }
.yw-money-page .yw-pnl-table tbody tr:hover > td { background-color: #faf8fc; }
.yw-money-page .yw-pnl-table [data-total] { background-color: #f8f4fb; }
.yw-money-page .yw-pnl-table tbody tr:hover > td[data-total] { background-color: #f3edf8; }
.yw-money-page .yw-pnl-table [data-sep] { border-left: 1px solid #e2e1e4; }
.yw-money-page .yw-pnl-row[data-strong] > td { color: #202024; font-weight: 500; }
.yw-money-page .yw-pnl-row[data-border] > td { border-top-color: #d9d4de; }
.yw-money-page .yw-pnl-row[data-indent] > td:first-child { padding-left: 14px; }
.yw-money-page .yw-pnl-row[data-muted] > td { color: #87818c; font-size: 13px; }
.yw-money-page :is(.yw-pnl-row > td[data-gap], .yw-pnl-gap) { color: #c3bdc8; }
.yw-money-page .yw-pnl-row[data-against] > td { background-color: #fbf0f4; }
.yw-money-page .yw-pnl-row[data-drill] { cursor: pointer; }
.yw-money-page .yw-pnl-row[data-drill]:focus-visible { outline: 2px solid #b993ff; outline-offset: -2px; }
.yw-money-page .yw-pnl-row > td[data-link]:hover { text-decoration: underline; text-decoration-color: #cdb5ee; text-underline-offset: 3px; }
.yw-pnl-label { display: inline-flex; align-items: center; gap: 5px; }
.yw-pnl-label-info { display: inline-flex; }
.yw-pnl-chevron { color: #a883ee; opacity: 0; transition: opacity .16s, transform .2s; }
.yw-pnl-row[data-drill]:hover .yw-pnl-chevron, .yw-pnl-row[data-drill]:focus-visible .yw-pnl-chevron { opacity: 1; transform: translateX(2px); }
.yw-pnl-pct { margin-top: 2px; color: #87818c; font-size: 11px; font-weight: 400; }
.yw-money-page .yw-pnl-section > td { padding: 18px 0 6px; border-top: 0; color: #87818c; font-size: 12px; font-weight: 500; text-align: left; white-space: nowrap; }
.yw-money-page .yw-pnl-table tbody tr.yw-pnl-section:hover, .yw-money-page .yw-pnl-table tbody tr.yw-pnl-section:hover > td { background-color: transparent; }
.yw-money-page .yw-pnl-table tbody tr.yw-pnl-section:hover > td:first-child { background-color: #fbfbfb; }
.yw-pnl-month-flag { display: block; max-width: 9rem; margin: 2px 0 0 auto; color: #87818c; font-size: 10px; font-weight: 500; white-space: normal; }
.yw-pnl-month-flag[data-tone="bad"], .yw-money-page .yw-pnl-table th[data-tone="bad"] .yw-pnl-month { color: #a96883; }
.yw-pnl-mtd { margin-left: 4px; color: #7433d4; font-size: 10px; font-weight: 500; }
.yw-pnl-cell-note { display: block; margin-top: 2px; color: #7433d4; font-size: 10px; font-weight: 400; white-space: normal; }
.yw-pnl-tbd { color: #a96883; font-weight: 500; text-decoration: none; }
.yw-pnl-tbd:hover, .yw-pnl-cell-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.yw-pnl-cell-link { color: inherit; text-decoration: none; }
.yw-pnl-info-bad { color: #a96883; font-weight: 500; }
.yw-pnl-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; margin-top: 16px; padding: 22px 16px; border: 1px dashed #ddd3e6; border-radius: 16px; background: #f8f6fa; text-align: center; cursor: pointer; transition: border-color .16s, background-color .16s; }
.yw-pnl-drop:hover, .yw-pnl-drop[data-drag] { border-color: #b993ff; background: #f6f1fb; }
.yw-pnl-drop-title { color: #202024; font-size: 13px; font-weight: 500; }
.yw-pnl-drop-sub { color: #929097; font-size: 12px; }
.yw-pnl-drop-input { max-width: 100%; margin-top: 10px; color: #6f6975; font-size: 12px; }
.yw-pnl-drop-input::file-selector-button { margin-right: 10px; padding: 7px 12px; border: 0; border-radius: 10px; background: #7c3aed; color: #fff; font: inherit; font-weight: 500; cursor: pointer; }
.yw-pnl-drop-closed { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 12px 0 0; padding: 0; border: 0; color: #87818c; font-size: 12px; }
.yw-pnl-drop-closed legend { float: left; margin-right: 4px; padding: 0; }
.yw-pnl-drop-closed label { display: inline-flex; align-items: center; gap: 6px; color: #343039; font-size: 13px; }
.yw-pnl-drop-failed { margin: 10px 0 0; padding: 0; color: #a96883; font-size: 12px; list-style: none; }
.yw-pnl-months { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; }
.yw-pnl-months-label { color: #87818c; font-size: 12px; }
.yw-pnl-months-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; margin-top: 7px; }
.yw-pnl-months-grid > span { padding: 6px 0; border-radius: 8px; background: #f0edf2; color: #a09aa4; font-size: 11px; font-weight: 500; text-align: center; }
.yw-pnl-months-grid > span[data-on] { background: #eee5fd; color: #7433d4; }
.yw-pnl-files { margin: 10px 0 0; padding: 0; list-style: none; }
.yw-pnl-files > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; padding: 11px 0; border-top: 1px solid #eae8ec; font-size: 13px; }
.yw-pnl-files > li:first-child { border-top: 0; }
.yw-pnl-file-name { min-width: 0; flex: 1 1 auto; color: #202024; font-weight: 500; text-decoration: none; }
a.yw-pnl-file-name:hover { color: #7c3aed; }
.yw-pnl-file-name[data-missing] { color: #87818c; font-weight: 400; }
.yw-pnl-delete { padding: 0; border: 0; background: none; color: #a09aa4; font-size: 11px; font-weight: 500; cursor: pointer; }
.yw-pnl-delete:hover { color: #a96883; }
.yw-pnl-delete:disabled { cursor: default; opacity: .6; }
.yw-pnl-note-form { display: flex; gap: 8px; margin-top: 5px; }
.yw-money-page .yw-pnl-note-form input[name="note"] { min-width: 0; flex: 1 1 auto; height: 28px; padding: 0 9px; border: 1px solid #e2e1e4; border-radius: 8px; background: #fff; font-size: 12px; }
.yw-pnl-flagged { color: #202024; font-weight: 500; }
.yw-pnl-flag-mark { margin-left: 5px; color: #9a805f; font-weight: 600; }
.yw-pnl-driver { margin-top: 2px; color: #929097; font-size: 11px; white-space: normal; }
.yw-pnl-flags { display: inline-flex; flex-wrap: wrap; gap: 4px 8px; }
.yw-pnl-confidence--spaced { margin-top: 12px; }
.yw-pnl-confidence .yw-row-stat-label { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.yw-pnl-dialog-wrap { position: fixed; inset: 0; z-index: 40; display: flex; align-items: center; justify-content: center; padding: 12px; }
.yw-pnl-dialog-backdrop { position: absolute; inset: 0; background: rgba(32, 32, 36, .34); }
.yw-pnl-dialog { position: relative; display: flex; flex-direction: column; width: 100%; max-width: 44rem; max-height: 85vh; overflow: hidden; border: 1px solid #e5ddea; border-radius: 24px; background: #fdfcfe; box-shadow: 0 15px 45px #3a214421, 0 3px 9px #3a214409; color: #202024; }
.yw-pnl-dialog-head { display: flex; align-items: flex-start; gap: 12px; padding: 21px 23px 14px; border-bottom: 1px solid #eae8ec; }
.yw-pnl-dialog-head > .min-w-0 { flex: 1 1 auto; }
.yw-pnl-dialog-title { color: #202024; font-size: 19px; font-weight: 500; line-height: 1.3; letter-spacing: -.55px; }
.yw-pnl-dialog-sub { margin-top: 3px; color: #929097; font-size: 12px; }
.yw-pnl-dialog-total { margin-top: 10px; color: #87818c; font-size: 12px; }
.yw-pnl-dialog-total strong { color: #202024; font-size: 17px; font-weight: 500; letter-spacing: -.4px; }
.yw-pnl-provenance { margin-top: 4px; color: #929097; font-size: 11px; }
.yw-pnl-provenance a { color: #8553c2; font-weight: 500; text-decoration: none; }
.yw-pnl-provenance a:hover { text-decoration: underline; }
.yw-pnl-dialog-close { display: inline-flex; flex-shrink: 0; align-items: center; height: 32px; padding: 0 12px; border: 1px solid #e4e2e6; border-radius: 10px; color: #59535f; font-size: 12px; font-weight: 500; text-decoration: none; transition: background-color .16s, color .16s; }
.yw-pnl-dialog-close:hover { background: #eeeeee; color: #202024; }
.yw-pnl-dialog-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 10px 23px 18px; }
.yw-pnl-dialog-foot { padding: 12px 23px; border-top: 1px solid #eae8ec; background: #fdfcfe; }
.yw-pnl-callout { margin: 6px 0 12px; padding: 12px 14px; border-radius: 14px; background: #f6f1fb; }
.yw-pnl-callout-lead { margin: 0; color: #202024; font-size: 12px; font-weight: 500; line-height: 1.5; }
.yw-pnl-callout-sub { margin: 4px 0 0; color: #6f6975; font-size: 11px; }
.yw-pnl-callout-form { margin-top: 10px; }
.yw-pnl-dialog-groups { display: flex; flex-direction: column; gap: 16px; }
.yw-pnl-dialog-group { margin: 6px 0 4px; color: #87818c; font-size: 12px; font-weight: 500; }
.yw-pnl-txs { margin: 0; padding: 0; list-style: none; }
.yw-pnl-txs > li { padding: 12px 0; border-top: 1px solid #eae8ec; }
.yw-pnl-txs > li:first-child { border-top: 0; }
.yw-pnl-txs--plain > li { padding: 6px 0; border-top: 0; }
.yw-pnl-tx { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.yw-pnl-tx input[type="checkbox"], .yw-pnl-pick-all input { width: 14px; height: 14px; accent-color: #7c3aed; }
.yw-pnl-tx-date { color: #929097; font-size: 11px; }
.yw-pnl-tx-name { min-width: 0; flex: 1 1 auto; color: #202024; font-size: 13px; font-weight: 500; }
.yw-pnl-tx-amount { color: #202024; font-size: 13px; font-weight: 500; }
.yw-pnl-tx-account { margin-top: 2px; color: #a09aa4; font-size: 11px; }
.yw-pnl-tx-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.yw-pnl-dialog-foot .yw-pnl-tx-form { margin-top: 0; }
.yw-pnl-pick-all { display: flex; align-items: center; gap: 8px; color: #87818c; font-size: 12px; font-weight: 500; }
.yw-pnl-picked { color: #59535f; font-size: 12px; font-weight: 500; }
.yw-money-page .yw-pnl-select { min-width: 14rem; height: 32px; padding: 0 9px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #202024; font-size: 12px; outline: none; }
.yw-money-page .yw-pnl-select:focus { border-color: #b993ff; }
@media (max-width: 1100px) {
.yw-pnl-grid > * { grid-column: auto; }
.yw-pnl-grid > :only-child, .yw-pnl-grid > .yw-money-span-2 { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
.yw-pnl-chevron, .yw-pnl-drop, .yw-pnl-dialog-close { transition: none; }
}
[data-theme-root].dark .yw-money-page :is(.yw-pnl-close-status, .yw-pnl-launch-form, .yw-pnl-drop-closed label) { color: #d9d2e3; }
[data-theme-root].dark .yw-money-page .yw-pnl-launch-form input[type="month"], [data-theme-root].dark .yw-money-page .yw-pnl-note-form input[name="note"], [data-theme-root].dark .yw-money-page .yw-pnl-select { border-color: #1c2843; background: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-money-page .yw-pnl-table :is(th, td):first-child { background: #0d1527; }
[data-theme-root].dark .yw-money-page .yw-pnl-table th { color: #a297ab; }
[data-theme-root].dark .yw-money-page .yw-pnl-table td { border-top-color: #1c2843; color: #d9d2e3; }
[data-theme-root].dark .yw-money-page .yw-pnl-table td:first-child { color: #ece6f2; }
[data-theme-root].dark .yw-money-page .yw-pnl-table tbody tr:hover > td { background-color: #111b30; }
[data-theme-root].dark .yw-money-page .yw-pnl-table [data-total] { background-color: #2f2638; }
[data-theme-root].dark .yw-money-page .yw-pnl-table tbody tr:hover > td[data-total] { background-color: #35293f; }
[data-theme-root].dark .yw-money-page .yw-pnl-table [data-sep] { border-left-color: #1c2843; }
[data-theme-root].dark .yw-money-page .yw-pnl-row[data-strong] > td { color: #f3eef8; }
[data-theme-root].dark .yw-money-page .yw-pnl-row[data-border] > td { border-top-color: #55505d; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-row[data-muted] > td, .yw-pnl-pct, .yw-pnl-section > td, .yw-pnl-month-flag, .yw-pnl-driver, .yw-pnl-months-label, .yw-pnl-drop-sub, .yw-pnl-drop-closed, .yw-pnl-file-name[data-missing]) { color: #a297ab; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-row > td[data-gap], .yw-pnl-gap) { color: #6f6975; }
[data-theme-root].dark .yw-money-page .yw-pnl-row[data-against] > td { background-color: #3a2a31; }
[data-theme-root].dark .yw-money-page .yw-pnl-table tbody tr.yw-pnl-section:hover > td:first-child { background-color: #0d1527; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-tbd, .yw-pnl-month-flag[data-tone="bad"], .yw-pnl-table th[data-tone="bad"] .yw-pnl-month, .yw-pnl-drop-failed, .yw-pnl-delete:hover) { color: #e69ac4; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-mtd, .yw-pnl-cell-note) { color: #c9b1ff; }
[data-theme-root].dark .yw-money-page .yw-pnl-chevron { color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-info-bad { color: #e69ac4; }
[data-theme-root].dark .yw-money-page .yw-pnl-drop { border-color: #273656; background: #101a2f; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-drop:hover, .yw-pnl-drop[data-drag]) { border-color: #8b6cc4; background: #2f2638; }
[data-theme-root].dark .yw-money-page :is(.yw-pnl-drop-title, .yw-pnl-file-name, .yw-pnl-flagged) { color: #f3eef8; }
[data-theme-root].dark .yw-money-page .yw-pnl-drop-input { color: #c3b9cc; }
[data-theme-root].dark .yw-money-page .yw-pnl-months-grid > span { background: #142036; color: #8f8996; }
[data-theme-root].dark .yw-money-page .yw-pnl-months-grid > span[data-on] { background: #3f2d5c; color: #c9b1ff; }
[data-theme-root].dark .yw-money-page .yw-pnl-files > li { border-color: #1c2843; }
[data-theme-root].dark .yw-money-page a.yw-pnl-file-name:hover { color: #c5a8ff; }
[data-theme-root].dark .yw-money-page .yw-pnl-delete { color: #8f8996; }
[data-theme-root].dark .yw-pnl-flag-mark { color: #e6bd7f; }
[data-theme-root].dark .yw-pnl-dialog-backdrop { background: rgba(0, 0, 0, .5); }
[data-theme-root].dark .yw-pnl-dialog { border-color: #1c2843; background: #0d1527; box-shadow: 0 15px 45px #00000066, 0 3px 9px #00000033; color: #f3eef8; }
[data-theme-root].dark :is(.yw-pnl-dialog-head, .yw-pnl-dialog-foot, .yw-pnl-txs > li) { border-color: #1c2843; }
[data-theme-root].dark .yw-pnl-dialog-foot { background: #0d1527; }
[data-theme-root].dark :is(.yw-pnl-dialog-title, .yw-pnl-dialog-total strong, .yw-pnl-callout-lead, .yw-pnl-tx-name, .yw-pnl-tx-amount) { color: #f3eef8; }
[data-theme-root].dark :is(.yw-pnl-dialog-sub, .yw-pnl-dialog-total, .yw-pnl-provenance, .yw-pnl-dialog-group, .yw-pnl-tx-date, .yw-pnl-tx-account, .yw-pnl-pick-all) { color: #a297ab; }
[data-theme-root].dark :is(.yw-pnl-callout-sub, .yw-pnl-picked) { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-provenance a { color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-dialog-close { border-color: #1c2843; color: #d9d2e3; }
[data-theme-root].dark .yw-pnl-dialog-close:hover { background: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-callout { background: #2f2638; }

/* ---- money-pnl.css from the design branch ---- */
/* P&L redesign (10/03): the new Dashboard design on this Money section.
   Loaded after skin/money.css, so a rule here at the same weight wins.
   Light rules first, their dark twins under [data-theme-root].dark.

   Owner: "continue with each of these tabs please take your time", after
   "use our new design ... explanations should be on the hover modals ...
   font types and font sizes ... container layouts and graphs ... add
   integrated scrollers ... correct sizing to containers". Every rule is
   scoped to the page root, .yw-pnl-page (pnl/page.tsx), and dresses what
   pnl/* renders: Flash (the hero, Below NOI, the month close, the
   statement), Books (the upload, the months on file, the uploaded statement,
   the balance sheet, the files), Trends (the scorecards, Why NOI moved,
   category variance, the month columns) and the line drill dialog. The
   wave 5 block of skin/money.css stays the base; these rules override it at
   the same weight or more. Values stay ink; only words, pills, marks and
   hatches take a tone. */

/* --------------------------------------------------------- the rows -- */
/* The top rows stretch (no --start on any P&L grid): every card in a row ends
   with the tallest, and its content spreads into the height instead of
   leaving a block empty. */
.yw-pnl-page .yw-pnl-books-top > .yw-money-card,
.yw-pnl-page .yw-pnl-trends-top > .yw-money-card,
.yw-pnl-page .yw-pnl-trends-charts > .yw-money-card,
.yw-pnl-page .yw-pnl-books-rest > .yw-money-card { display: flex; flex-direction: column; }

/* A pill: the dashboard's quiet secondary move (an Open link, a note's Save,
   a drill row's Save). */
.yw-pnl-page .yw-pnl-pill {
  display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; height: 30px; margin: 0; padding: 0 12px;
  border: 0; border-radius: 10px; background: #eeeded; color: #202024; font-size: 12px; font-weight: 500; line-height: 1;
  white-space: nowrap; text-decoration: none; cursor: pointer; transition: background-color .16s;
}
.yw-pnl-page .yw-pnl-pill:hover { background: #e8e4ed; color: #202024; text-decoration: none; }
.yw-pnl-page .yw-pnl-pill:focus-visible { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-pnl-page .yw-pnl-pill:disabled { cursor: wait; opacity: .6; }

/* ------------------------------------------------------- Flash: hero -- */
/* ToolSummaryHero (tool-summary-strip.tsx): the comparison is the one pill,
   the margin and the period its muted words. */
.yw-pnl-page .yw-pnl-hero .yw-hero-status { row-gap: 6px; }
.yw-pnl-page .yw-pnl-hero .yw-hero-muted { font-size: 11px; }

/* ------------------------------------------------- Flash: Below NOI -- */
/* The parts rows (Get Paid's Not chasing) without a track. 10/06 (owner:
   the figures were oversized next to an empty card): at row size, in the
   statement's order; the two cash flow subtotals carry a firmer hairline and
   an ink label, the bottom line the card's one larger figure. A line the
   statement cannot total says so in quiet words, never as a grey figure. */
.yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat { padding: 12px 0 11px; }
.yw-pnl-page .yw-pnl-below .yw-money-parts .yw-row-stat-value { font-size: 15px; font-weight: 500; letter-spacing: -.3px; }
.yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat[data-sub] { border-top-color: #d6d0dc; }
.yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat[data-sub] > .yw-row-stat-label { color: #202024; font-weight: 500; }
.yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat[data-strong] .yw-row-stat-value { font-size: 20px; letter-spacing: -.6px; }
.yw-pnl-page .yw-pnl-below .yw-money-parts .yw-row-stat-value[data-unstated] { color: #a09aa4; font-size: 13px; font-weight: 400; letter-spacing: -.2px; }

/* ------------------------------------------------ Flash: month close -- */
/* 10/06 (owner: "get some yield wizard dot personality on one of the
   cards"): the Wizard's violet insight card (skin/overview.css .yw-insight,
   as Get Paid's Collections agent wears it). The lake lodge at dusk, drawn
   in dots (halftone-scene.tsx "lodge"), fills the lower part behind the
   words and multiplies into the violet, its top fading out under the month.
   The state is the tag's pill, the month the big figure, the record the line
   under it, the one violet button at the foot. */
.yw-pnl-page .yw-insight.yw-pnl-close { height: auto; min-height: 0; }
.yw-pnl-page .yw-pnl-close-art { position: absolute; right: 0; bottom: 0; left: 0; z-index: -2; height: 72%; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 30%); mask-image: linear-gradient(180deg, transparent 0, #000 30%); pointer-events: none; }
.yw-pnl-page .yw-pnl-close-art > canvas { display: block; width: 100%; height: 100%; mix-blend-mode: multiply; }
.yw-pnl-page .yw-pnl-close .yw-insight-tag .hw-info-label { color: inherit; font-size: 10px; font-weight: 400; }
.yw-pnl-page .yw-pnl-close .yw-insight-count { padding: 5px 9px; border-radius: 20px; background: rgba(255, 255, 255, .55); color: #5e4380; font-weight: 500; }
.yw-pnl-page .yw-pnl-close[data-state="closed"] .yw-insight-count { color: #2f7f64; }
.yw-pnl-page .yw-pnl-close[data-state="changed"] .yw-insight-count { color: #a9507a; }
.yw-pnl-page .yw-pnl-close .yw-insight-value { margin-top: 20px; }
.yw-pnl-page .yw-pnl-close h3 { max-width: 300px; margin-top: 8px; font-size: 17px; line-height: 1.3; letter-spacing: -.4px; }
.yw-pnl-page .yw-pnl-close .yw-insight-main > .yw-money-note { max-width: 300px; margin-top: 8px; }
.yw-pnl-page .yw-pnl-close .yw-insight-bottom { padding-top: 18px; }
.yw-pnl-page .yw-pnl-close-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
/* The one violet primary of a card (the close, the empty statement's Save,
   the drill's batch Save): the house #7c3aed, a 10px radius, 12px words. */
.yw-pnl-page .yw-pnl-primary { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; height: 34px; margin: 0; padding: 0 14px; border: 0; border-radius: 10px; background: #7c3aed; color: #fff; font-size: 12px; font-weight: 500; line-height: 1; white-space: nowrap; cursor: pointer; box-shadow: 0 4px 12px rgba(78, 32, 139, .14); transition: background-color .16s; }
.yw-pnl-page .yw-pnl-primary:hover { background: #6d28d9; color: #fff; }
.yw-pnl-page .yw-pnl-primary:focus-visible { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-pnl-page .yw-pnl-primary:disabled { cursor: not-allowed; box-shadow: none; opacity: .45; }

/* ------------------------------------------------- Flash: statement -- */
.yw-pnl-page .yw-pnl-statement > .yw-card-head { align-items: center; }
.yw-pnl-page .yw-pnl-basis { flex-shrink: 0; padding: 5px 9px; border-radius: 20px; background: #f4f0fb; font-size: 10.5px; }

/* The scroller (10/03, owner: "add integrated scrollers"): the statement
   scrolls inside its card both ways, the month header held at the top and
   the line column at the left; the corner cell sits over both. */
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] { max-height: min(74vh, 52rem); margin-top: 14px; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th { position: sticky; top: 0; z-index: 2; background: #fbfbfb; box-shadow: inset 0 -1px 0 #e2e1e4; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th[data-total] { background: #f8f4fb; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th:first-child { z-index: 3; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table tbody tr:first-child > td { border-top: 0; }

/* The table (10/06, owner: "that table is very hard to read it doesent have
   any order or correct spacing is wasting a lot of blank space"). A fixed
   layout: the line column one width (the <col>), the month and Total columns
   sharing the rest evenly. The page sets --yw-pnl-n to the figure column
   count: the table never stretches a column past 11.5rem (a two month
   statement stays a compact block instead of stranding its figures at the
   far right) and never squeezes one under 7.5rem (it scrolls sideways
   instead). Rows are one line, about 37px. */
.yw-pnl-page .yw-pnl-table { table-layout: fixed; font-size: 13px; }
.yw-pnl-page .yw-pnl-table > colgroup > .yw-pnl-col-line { width: 14rem; }
.yw-pnl-page .yw-pnl-flash { min-width: calc(14rem + var(--yw-pnl-n, 6) * 7.5rem); max-width: calc(14rem + var(--yw-pnl-n, 6) * 11.5rem); }
.yw-pnl-page .yw-pnl-table th { height: 36px; padding: 0 8px 8px; color: #87818c; font-size: 11.5px; vertical-align: bottom; }
.yw-pnl-page .yw-pnl-table td { padding: 9px 8px; line-height: 18px; vertical-align: middle; }
.yw-pnl-page .yw-pnl-table td.num { overflow: visible; }
.yw-pnl-page .yw-pnl-table :is(th, td):first-child { padding-left: 2px; white-space: normal; }
.yw-pnl-page .yw-pnl-table :is(th, td):last-child { padding-right: 6px; }
.yw-pnl-page .yw-pnl-row > td { color: #49434e; }
.yw-pnl-page .yw-pnl-row > td:first-child { color: #343039; }
.yw-pnl-page .yw-pnl-row[data-strong] > td { color: #202024; font-weight: 500; }
.yw-pnl-page .yw-pnl-row[data-border] > td { border-top-color: #d6d0dc; }
.yw-pnl-page .yw-pnl-row[data-muted] > td { color: #6f6975; font-size: 12.5px; }
.yw-pnl-page .yw-pnl-row[data-muted] > td:first-child { color: #59535f; }
.yw-pnl-page .yw-pnl-row[data-indent] > td:first-child { padding-left: 16px; }
/* Flash NOI, the line the statement exists for: a quiet violet band. */
.yw-pnl-page .yw-pnl-table .yw-pnl-row[data-key] > td { background-color: #f6f2fc; color: #202024; font-weight: 600; }
.yw-pnl-page .yw-pnl-table .yw-pnl-row[data-key] > td[data-total] { background-color: #efe8f9; }
.yw-pnl-page .yw-pnl-table tbody tr.yw-pnl-row[data-key]:hover > td { background-color: #f0eafa; }
/* A section: its name over a firmer hairline, the first line under it
   without its own. */
.yw-pnl-page .yw-pnl-table .yw-pnl-section > td { padding: 18px 2px 7px; border-top: 0; border-bottom: 1px solid #dcd7e1; color: #59535f; font-size: 12px; font-weight: 500; letter-spacing: -.1px; }
.yw-pnl-page .yw-pnl-table tbody > .yw-pnl-section:first-child > td { padding-top: 12px; }
.yw-pnl-page .yw-pnl-table .yw-pnl-section + tr > td { border-top: 0; }
/* The percent of revenue: beside the dollars, smaller and quieter, in its
   own right-aligned slot so both line up down a column. A gap, or a line
   with no percent, holds the same slot. */
.yw-pnl-page .yw-pnl-v { white-space: nowrap; }
.yw-pnl-page .yw-pnl-pct { display: inline-block; min-width: 3.7em; margin: 0 0 0 6px; color: #929097; font-size: 10.5px; font-weight: 400; letter-spacing: -.1px; text-align: right; vertical-align: baseline; }
.yw-pnl-page .yw-pnl-pcts td.num[data-gap] { padding-right: calc(8px + 6px + 3.7 * 10.5px); }
.yw-pnl-page .yw-pnl-pcts td.num[data-gap]:last-child { padding-right: calc(6px + 6px + 3.7 * 10.5px); }
.yw-pnl-page .yw-pnl-row[data-strong] .yw-pnl-pct, .yw-pnl-page .yw-pnl-row[data-key] .yw-pnl-pct { color: #87818c; font-weight: 500; }
/* A row's label, its hover and its one flag word. */
.yw-pnl-page .yw-pnl-label { position: relative; display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
/* The drill chevron shows on hover and takes no room, so a label never
   wraps for a mark that is not there yet. */
.yw-pnl-page .yw-pnl-label > .yw-pnl-chevron { position: absolute; top: 0; right: -12px; }
.yw-pnl-page .yw-pnl-label > .hw-info-label { text-align: left; }
.yw-pnl-page .yw-pnl-row-flag { font-size: 10px; }
/* The month heads: the month, a small MTD pill, and a 6px mark when the
   month carries a note (pink when its costs look missing); the note is the
   month's hover. */
.yw-pnl-page .yw-pnl-month { display: inline-flex; align-items: center; gap: 5px; color: #6f6975; font-weight: 500; }
.yw-pnl-page .yw-pnl-table th[data-tone="bad"] .yw-pnl-month { color: #a96883; }
.yw-pnl-page .yw-pnl-mtd { margin: 0; padding: 1px 5px; border-radius: 6px; background: #f1eafd; color: #7433d4; font-size: 9.5px; font-weight: 500; }
.yw-pnl-page .yw-pnl-month-mark { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #c9c2cf; }
.yw-pnl-page .yw-pnl-month-mark[data-tone="watch"] { background: #c9a978; }
.yw-pnl-page .yw-pnl-month-mark[data-tone="bad"] { background: #d85e9e; }
/* Total revenue in a month that waits on a department: the word, in the
   dollars' place, its reason the hover. */
.yw-pnl-page .yw-pnl-waiting { display: inline-block; margin-right: calc(6px + 3.7 * 10.5px); color: #87818c; font-size: 11.5px; font-weight: 500; text-decoration: underline dotted #cbc4d1; text-underline-offset: 3px; }
/* A month's close record on Flash NOI: a small round mark before the figure
   (the dollars keep their right edge), the record its hover. */
.yw-pnl-page .yw-pnl-closed-cell { white-space: nowrap; }
.yw-pnl-page .yw-pnl-cell-mark { display: inline-grid; width: 15px; height: 15px; margin-right: 6px; place-items: center; border-radius: 50%; background: #efe8fb; color: #7c3aed; font-size: 9px; font-weight: 600; line-height: 1; vertical-align: 1px; cursor: help; }
.yw-pnl-page .yw-pnl-cell-mark[data-state="changed"] { background: #f8e8ef; color: #b9507a; }
.yw-pnl-page .yw-pnl-cell-mark[data-state="open"] { background: #efedf1; color: #87818c; }
/* TBD to categorize: the name in the bad tone, its count a quiet number. */
.yw-pnl-page .yw-pnl-tbd-link { color: inherit; text-decoration: none; }
.yw-pnl-page .yw-pnl-tbd-link:hover .yw-pnl-tbd { text-decoration: underline; text-underline-offset: 3px; }
.yw-pnl-page .yw-pnl-row[data-tbd]:hover .yw-pnl-chevron { opacity: 1; transform: translateX(2px); }
.yw-pnl-page .yw-pnl-count { color: #a59fab; font-size: 11px; font-weight: 400; }
/* The Total column: held at the right edge once the months scroll. */
.yw-pnl-page .yw-pnl-table[data-sticky-total] :is(th, td)[data-total] { position: sticky; right: 0; z-index: 1; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table[data-sticky-total] thead th[data-total] { z-index: 3; }
.yw-pnl-page .yw-pnl-notes { margin-top: 10px; }
.yw-pnl-page .yw-pnl-notes > .yw-money-note:first-child { margin-top: 0; }
/* The other statements wear the same skin (10/06): the uploaded statement
   as printed and its mapped fallback (Books), the balance sheet, and
   category variance (Trends). The printed labels run longer and its figures
   carry cents, so its columns are wider. */
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-variance) > colgroup > .yw-pnl-col-line { width: 17rem; }
.yw-pnl-page .yw-pnl-printed { min-width: calc(17rem + var(--yw-pnl-n, 3) * 9rem); max-width: calc(17rem + var(--yw-pnl-n, 3) * 13.5rem); }
.yw-pnl-page .yw-pnl-printed .yw-pnl-pp { min-width: 4.6em; }
.yw-pnl-page .yw-pnl-sheet > colgroup > .yw-pnl-col-line { width: 11rem; }
.yw-pnl-page .yw-pnl-sheet { min-width: calc(11rem + var(--yw-pnl-n, 3) * 8rem); max-width: calc(11rem + var(--yw-pnl-n, 3) * 12rem); }
.yw-pnl-page .yw-pnl-variance { min-width: 40rem; max-width: 64rem; }
.yw-pnl-page .yw-pnl-variance td:first-child { color: #202024; font-weight: 500; }
/* The drill dialog's title: its hover carries what the grey line said. */
.yw-pnl-page .yw-pnl-dialog-title .hw-info-label { font-weight: 500; text-align: left; }

/* ------------------------------------------------- Books: the top row -- */
/* The upload: the drop area grows to the row's height, the dashed quiet
   panel of the Commissions bills; Final and Draft the quiet segmented
   control. */
.yw-pnl-page .yw-pnl-upload .yw-pnl-drop { flex: 1 1 auto; min-height: 132px; margin-top: 14px; border: 1.5px dashed #ddd3e6; background: #faf8fc; }
.yw-pnl-page .yw-pnl-upload .yw-pnl-drop:hover { border-color: #cdb5ee; background: #faf8fc; }
.yw-pnl-page .yw-pnl-upload .yw-pnl-drop[data-drag] { border-color: #7c3aed; background: #f0e9fb; }
.yw-pnl-page .yw-pnl-drop-title { font-size: 13px; }
/* 10/06: no browser file button. The input sits hidden in the label (the
   whole area opens the picker); the quiet pill is what shows, and a keyboard
   focus rings the area. */
.yw-pnl-page .yw-pnl-upload .yw-pnl-drop { position: relative; gap: 10px; }
.yw-pnl-page .yw-pnl-drop-input { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; opacity: 0; clip: rect(0 0 0 0); }
.yw-pnl-page .yw-pnl-upload .yw-pnl-drop:has(> .yw-pnl-drop-input:focus-visible) { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-pnl-page .yw-pnl-drop:hover .yw-pnl-drop-pick { background: #e8e4ed; }
.yw-pnl-page .yw-pnl-drop-closed { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: 12px; color: #87818c; font-size: 12px; }
.yw-pnl-page .yw-pnl-drop-closed > legend { float: left; margin: 0; padding: 0; }
.yw-pnl-page .yw-pnl-seg { display: inline-flex; gap: 2px; margin-left: auto; padding: 3px; border-radius: 12px; background: #eeeded; }
.yw-pnl-page .yw-pnl-seg > label { position: relative; display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 9px; color: #6f6975; font-size: 12px; font-weight: 500; cursor: pointer; transition: background-color .16s, color .16s; }
.yw-pnl-page .yw-pnl-seg > label:hover { background: rgba(255, 255, 255, .6); color: #202024; }
.yw-pnl-page .yw-pnl-seg > label > input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.yw-pnl-page .yw-pnl-seg > label:has(> input:checked) { background: #fff; color: #202024; box-shadow: 0 2px 6px rgba(0, 0, 0, .06); }
.yw-pnl-page .yw-pnl-seg > label:has(> input:focus-visible) { outline: 2px solid #b993ff; outline-offset: 1px; }
.yw-pnl-page .yw-pnl-upload > .yw-money-note { margin-top: 10px; }

/* The months on file: the year grids sit at the foot of the card, like the
   hero's rows, so the row's height never strands them at the top. */
.yw-pnl-page .yw-pnl-months-card > .yw-pnl-months { gap: 16px; margin-top: auto; padding-top: 18px; }
/* 10/06: the count as the card's figure, the hero's type a size down. */
.yw-pnl-page .yw-pnl-months-count { display: flex; align-items: baseline; gap: 8px; margin: 18px 0 0; color: #202024; font-size: 38px; font-weight: 500; line-height: 1.1; letter-spacing: -1.6px; }
.yw-pnl-page .yw-pnl-months-count > span { color: #929097; font-size: 13px; font-weight: 400; letter-spacing: -.2px; }
.yw-pnl-page .yw-pnl-months-label { color: #87818c; font-size: 11.5px; font-weight: 500; }
.yw-pnl-page .yw-pnl-months-grid { gap: 4px; margin-top: 8px; }
.yw-pnl-page .yw-pnl-months-grid > span { padding: 7px 0; border-radius: 9px; background: #f2f0f4; color: #b0aab5; font-size: 10.5px; }
.yw-pnl-page .yw-pnl-months-grid > span[data-on] { background: #efe8fb; color: #7433d4; }

/* ------------------------------------- Books: balance sheet and files -- */
/* One row: the balance sheet across two columns, the files beside it with
   their list scrolling in the room the sheet leaves. Outweighs money.css's
   "a pair's last child spans two" rule. */
.yw-pnl-page .yw-pnl-grid.yw-pnl-books-rest > .yw-money-span-2 + .yw-pnl-files-card:last-child { grid-column: auto; }
.yw-pnl-page .yw-pnl-files-scroll { max-height: 26rem; margin-top: 10px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ddd2e7 transparent; }
.yw-pnl-page .yw-money-span-2 + .yw-pnl-files-card > .yw-pnl-files-scroll { flex: 1 1 0; min-height: 168px; max-height: none; }
.yw-pnl-page .yw-pnl-files { margin: 0; }
/* A file: the Dashboard's Needs you row. */
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 0 12px; padding: 11px 2px; border-top: 1px solid #eae8ec; font-size: 13px; transition: background-color .16s; }
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file:first-child { border-top: 0; }
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file:hover { background: #f8f6fa; }
.yw-pnl-page .yw-pnl-file-mark { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: #efe8fb; color: #7c3aed; font-size: 9.5px; font-weight: 600; letter-spacing: .04em; }
.yw-pnl-page .yw-pnl-file[data-missing] .yw-pnl-file-mark { background: #f0eef2; color: #87818c; }
.yw-pnl-page .yw-pnl-file-name { display: block; max-width: 100%; overflow: hidden; color: #202024; font-size: 13.5px; font-weight: 500; letter-spacing: -.2px; text-overflow: ellipsis; white-space: nowrap; }
.yw-pnl-page a.yw-pnl-file-name:hover { color: #7c3aed; text-decoration: underline; text-underline-offset: 2px; }
.yw-pnl-page .yw-pnl-file-name[data-missing] { color: #59535f; font-weight: 500; }
.yw-pnl-page .yw-pnl-file-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 0; margin-top: 3px; color: #929097; font-size: 12px; }
.yw-pnl-page .yw-pnl-file-meta > * + *::before { content: "·"; margin: 0 7px; color: #c3bdc8; font-weight: 400; }
.yw-pnl-page .yw-pnl-file-meta > .yw-money-flag { font-size: 11px; }
/* Delete: a quiet pill in the house pink, the one move that removes books. */
.yw-pnl-page .yw-pnl-delete { display: inline-flex; align-items: center; height: 28px; padding: 0 11px; border-radius: 10px; background: #eeeded; color: #c85f84; font-size: 11.5px; font-weight: 500; transition: background-color .16s, color .16s; }
.yw-pnl-page .yw-pnl-delete:hover { background: #f8e8ef; color: #b9507a; }
.yw-pnl-page .yw-pnl-delete:focus-visible { outline: 2px solid #e7b9cb; outline-offset: 2px; }
/* A flagged line's note: the input and its Save pill on one line. */
.yw-pnl-page .yw-pnl-note-form { align-items: center; margin-top: 6px; }
.yw-pnl-page .yw-pnl-note-form .yw-pnl-pill { height: 28px; padding: 0 10px; font-size: 11.5px; }

/* ---------------------------------------------------------- Trends -- */
/* Why NOI moved: the chart sits in the middle of the height the scorecards
   give the row, its key under it. */
.yw-pnl-page .yw-pnl-wf-card > .yw-wf { display: flex; flex: 1 1 auto; flex-direction: column; justify-content: center; margin-top: 12px; }
.yw-pnl-page .yw-wf-svg { min-width: 30rem; }
.yw-pnl-page .yw-wf-gap-total { fill: #d4b6fb; }
.yw-pnl-page .yw-wf-ink-total { fill: #8a45f0; }
.yw-pnl-page .yw-wf-gap-up { fill: #d8d3dc; }
.yw-pnl-page .yw-wf-ink-up { fill: #a6a0ac; }
.yw-pnl-page .yw-wf-gap-down { fill: #f8dae9; }
.yw-pnl-page .yw-wf-ink-down { fill: #d85e9e; }
.yw-pnl-page .yw-wf-axis { stroke: #cfc8d5; }
.yw-pnl-page .yw-wf-connector { stroke: #d6d2da; }
.yw-pnl-page .yw-wf-value { fill: #28232e; font-size: 11px; font-weight: 500; }
.yw-pnl-page .yw-wf-label { fill: #736b79; font-size: 10.5px; }
.yw-pnl-page .yw-wf-legend { gap: 6px 18px; margin-top: 12px; color: #8e8494; font-size: 10.5px; }
.yw-pnl-page .yw-wf-legend i { width: 13px; height: 8px; border-radius: 2px; }
.yw-pnl-page .yw-wf-legend i[data-tone="total"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
.yw-pnl-page .yw-wf-legend i[data-tone="up"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #d8d3dc 2px 4px); }
.yw-pnl-page .yw-wf-legend i[data-tone="down"] { background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); }

/* Category variance: the shared table in its scroller (data-scroll="list"). */
.yw-pnl-page .yw-pnl-driver { margin-top: 3px; color: #929097; font-size: 11px; line-height: 1.4; }

/* The month columns (pnl-columns.tsx): the Dashboard's month columns, one
   thin column per closed month, the bars hatched (violet the lead series,
   the met grey the second, a quiet solid the third), a month below zero in
   the house pink hanging under the zero line. The line under the chart says
   the hovered month. */
.yw-pnl-page .yw-pnl-cols { display: flex; flex: 1 1 auto; flex-direction: column; justify-content: flex-end; margin-top: 16px; }
.yw-pnl-page .yw-pnl-cols-key { justify-content: flex-start; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 10px; }
.yw-pnl-page .yw-pnl-cols-swatch { display: inline-block; width: 13px; height: 8px; border-radius: 2px; }
.yw-pnl-page .yw-pnl-cols-swatch[data-tone="violet"] { background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); }
.yw-pnl-page .yw-pnl-cols-swatch[data-tone="grey"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #d8d3dc 2px 4px); }
.yw-pnl-page .yw-pnl-cols-swatch[data-tone="solid"] { background: #c5c0cb; }
.yw-pnl-page .yw-pnl-cols .yw-month-scroll { padding-bottom: 2px; }
.yw-pnl-page .yw-pnl-cols .yw-month-columns { gap: 2px; }
.yw-pnl-page .yw-pnl-cols .yw-month-column { height: 172px; padding: 0 2px; border-radius: 6px; cursor: default; font: inherit; }
.yw-pnl-page .yw-pnl-cols .yw-month-column-rail { flex: 1 1 auto; height: auto; }
.yw-pnl-page .yw-pnl-cols .yw-month-column-rail[data-signed] { border-bottom-color: #ece8f0; }
.yw-pnl-page .yw-pnl-cols .yw-month-column-label { display: block; height: 14px; margin-top: 6px; color: #8b8290; font-size: 10px; text-align: center; }
.yw-pnl-page .yw-pnl-cols-zero { position: absolute; right: 0; left: 0; height: 1px; background: #cfc8d5; }
.yw-pnl-page .yw-pnl-cols-bars { position: absolute; inset: 0 14%; display: flex; justify-content: center; gap: 2px; }
.yw-pnl-page .yw-pnl-cols[data-series="1"] .yw-pnl-cols-bars { inset: 0 20%; }
.yw-pnl-page .yw-pnl-cols-slot { position: relative; flex: 1 1 0; max-width: 28px; height: 100%; }
.yw-pnl-page .yw-pnl-cols-bar { position: absolute; right: 0; left: 0; border-radius: 3px 3px 0 0; background: repeating-linear-gradient(125deg, #8a45f0 0 2px, #d4b6fb 2px 4px); transform-origin: bottom; animation: yw-pnl-grow .65s cubic-bezier(.2, .7, .2, 1) both; }
.yw-pnl-page .yw-pnl-cols-bar[data-tone="grey"] { background: repeating-linear-gradient(125deg, #a6a0ac 0 2px, #d8d3dc 2px 4px); }
.yw-pnl-page .yw-pnl-cols-bar[data-tone="solid"] { background: #c5c0cb; }
.yw-pnl-page .yw-pnl-cols-bar[data-tone="below"] { border-radius: 0 0 3px 3px; background: repeating-linear-gradient(125deg, #d85e9e 0 2px, #f8dae9 2px 4px); transform-origin: top; }
.yw-pnl-page .yw-pnl-cols .yw-month-detail { min-height: 42px; margin-top: 6px; gap: 4px 14px; }
@keyframes yw-pnl-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* ------------------------------------------------ the line drill dialog -- */
/* A row: the tick, the name over one quiet line (the date and the account),
   the amount at row size; the category and its Save under it, quiet. The
   footer's Save is the one violet. */
/* 10/06: above the page header, which is sticky at z-index 65 now (the
   dialog's 40 left its title under the period and Export controls). The
   hover panels (100) still open over it. */
.yw-pnl-page .yw-pnl-dialog-wrap { z-index: 70; }
.yw-pnl-page .yw-pnl-dialog-close { height: 30px; padding: 0 12px; border: 0; background: #eeeded; color: #202024; }
.yw-pnl-page .yw-pnl-dialog-close:hover { background: #e8e4ed; color: #202024; }
.yw-pnl-page .yw-pnl-dialog-total strong { font-size: 19px; letter-spacing: -.5px; }
.yw-pnl-page .yw-pnl-txs > li.yw-pnl-tx-item { padding: 12px 8px; transition: background-color .16s; }
.yw-pnl-page .yw-pnl-txs > li.yw-pnl-tx-item[data-picked] { background: #f6f1fd; }
.yw-pnl-page .yw-pnl-pick-all { padding: 4px 8px 10px; }
.yw-pnl-page .yw-pnl-tx { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; align-items: center; gap: 0 14px; }
.yw-pnl-page .yw-pnl-tx-item[data-plain] > .yw-pnl-tx, .yw-pnl-page .yw-pnl-txs--plain > .yw-pnl-tx { grid-template-columns: minmax(0, 1fr) auto; }
.yw-pnl-page .yw-pnl-txs--plain > .yw-pnl-tx { padding: 8px 0; }
.yw-pnl-page .yw-pnl-tx-main { display: flex; min-width: 0; flex-direction: column; }
.yw-pnl-page .yw-pnl-tx-name { overflow: hidden; color: #202024; font-size: 13.5px; font-weight: 500; letter-spacing: -.2px; text-overflow: ellipsis; white-space: nowrap; }
.yw-pnl-page .yw-pnl-tx-meta { margin-top: 2px; overflow: hidden; color: #929097; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.yw-pnl-page .yw-pnl-tx-amount { color: #202024; font-size: 15px; font-weight: 500; letter-spacing: -.3px; white-space: nowrap; }
.yw-pnl-page .yw-pnl-tx-item > .yw-pnl-tx-form { margin-top: 9px; padding-left: 28px; }
.yw-pnl-page .yw-pnl-tx-item[data-plain] > .yw-pnl-tx-form { padding-left: 0; }
.yw-pnl-page .yw-pnl-select { height: 30px; min-width: 13rem; }
.yw-pnl-page .yw-pnl-dialog-foot .yw-pnl-tx-form > button[type="submit"] { height: 32px; padding: 0 14px; border-radius: 10px; font-size: 12px; font-weight: 500; }
.yw-pnl-page .yw-pnl-callout .yw-pnl-callout-form button { height: 32px; padding: 0 14px; border-radius: 10px; font-size: 12px; font-weight: 500; }
/* The stay-date days and the gross entries hold their header while the
   dialog's body scrolls. */
.yw-pnl-page .yw-pnl-days thead th { position: sticky; top: 0; z-index: 1; background: #fdfcfe; box-shadow: inset 0 -1px 0 #eae8ec; }

/* ------------------------------------------------- the empty statement -- */
.yw-pnl-page .yw-pnl-empty-line { max-width: 46rem; margin: 12px 0 0; color: #59535f; font-size: 13px; line-height: 1.55; }

/* ---------------------------------------------------------- narrower -- */
@media (max-width: 1100px) {
  .yw-pnl-page .yw-pnl-grid.yw-pnl-books-rest > .yw-money-span-2 + .yw-pnl-files-card:last-child { grid-column: 1 / -1; }
  .yw-pnl-page .yw-money-span-2 + .yw-pnl-files-card > .yw-pnl-files-scroll { flex: 0 1 auto; min-height: 0; max-height: 26rem; }
  .yw-pnl-page .yw-pnl-trends-charts > :nth-child(3):last-child { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
  .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] { max-height: 70vh; }
  .yw-pnl-page .yw-pnl-tx-item > .yw-pnl-tx-form { padding-left: 0; }
  .yw-pnl-page .yw-pnl-select { min-width: 0; flex: 1 1 12rem; }
}
@media (prefers-reduced-motion: reduce) {
  .yw-pnl-page .yw-pnl-cols-bar { animation: none; }
  .yw-pnl-page :is(.yw-pnl-pill, .yw-pnl-delete, .yw-pnl-seg > label, .yw-pnl-files > li.yw-pnl-file, .yw-pnl-txs > li.yw-pnl-tx-item) { transition: none; }
}

/* -------------------------------------------------------------- dark -- */
/* The warm palette: card #2a2a30 / border #414148, raised #35353c, text
   #f3eef8 / #c3b9cc / #a297ab, violet text #c5a8ff. */
[data-theme-root].dark .yw-pnl-page .yw-pnl-pill { background: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-pill:hover { background: #1c2843; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-below .yw-money-parts .yw-row-stat-value[data-unstated] { color: #8f8996; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-below .yw-row-stat[data-strong] > .yw-row-stat-label { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat[data-sub] { border-top-color: #55505d; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-below .yw-money-parts > .yw-row-stat[data-sub] > .yw-row-stat-label { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-close-art > canvas { filter: invert(1) hue-rotate(180deg); mix-blend-mode: screen; opacity: .55; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-close .yw-insight-count { background: rgba(255, 255, 255, .1); color: #d9c8f0; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-close[data-state="closed"] .yw-insight-count { color: #7fd3b4; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-close[data-state="changed"] .yw-insight-count { color: #f0b8d2; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-primary { background: #8b4dfb; box-shadow: none; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-primary:hover { background: #7c3aed; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-basis { background: #3f2d5c; color: #c9b1ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] { scrollbar-color: #273656 transparent; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th { background: #0d1527; box-shadow: inset 0 -1px 0 #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th[data-total] { background: #2f2638; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-table th { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row > td { color: #d9d2e3; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row > td:first-child { color: #ece6f2; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-strong] > td { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-border] > td { border-top-color: #55505d; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-muted] > td { color: #b3a9bc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-muted] > td:first-child { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-key] > td { background-color: #322a3f; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-key] > td[data-total] { background-color: #3a2f49; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-table tbody tr.yw-pnl-row[data-key]:hover > td { background-color: #382f46; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-table .yw-pnl-section > td { border-bottom-color: #55505d; color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-pct { color: #8f8996; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-strong] .yw-pnl-pct, [data-theme-root].dark .yw-pnl-page .yw-pnl-row[data-key] .yw-pnl-pct { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-month { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-table th[data-tone="bad"] .yw-pnl-month { color: #e69ac4; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-mtd { background: #3f2d5c; color: #c9b1ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-month-mark { background: #6f6975; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-month-mark[data-tone="watch"] { background: #c9a978; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-month-mark[data-tone="bad"] { background: #e07fb4; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-waiting { color: #a297ab; text-decoration-color: #5b5663; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cell-mark { background: #3d3350; color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cell-mark[data-state="changed"] { background: #4d3345; color: #f0b8d2; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cell-mark[data-state="open"] { background: #142036; color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-count { color: #8f8996; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-variance td:first-child { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-upload .yw-pnl-drop { border-color: #273656; background: #101a2f; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-upload .yw-pnl-drop:hover { border-color: #5c4a78; background: #101a2f; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-upload .yw-pnl-drop[data-drag] { border-color: #8b4dfb; background: #3f2d5c; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-drop-input { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-drop-closed { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-seg { background: #142036; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-seg > label { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-seg > label:hover { background: #1c2843; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-seg > label:has(> input:checked) { background: #3f2d5c; color: #c9b1ff; box-shadow: none; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-months-label { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-months-count { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-months-count > span { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-months-grid > span { background: #142036; color: #8f8996; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-months-grid > span[data-on] { background: #3f2d5c; color: #c9b1ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files-scroll { scrollbar-color: #273656 transparent; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files > li.yw-pnl-file { border-color: #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files > li.yw-pnl-file:hover { background: #111b30; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-mark { background: #3d3350; color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file[data-missing] .yw-pnl-file-mark { background: #142036; color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-name { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page a.yw-pnl-file-name:hover { color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-name[data-missing] { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-meta { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-meta > * + *::before { color: #6f6975; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-delete { background: #142036; color: #e69ac4; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-delete:hover { background: #4d3345; color: #f0b8d2; }
[data-theme-root].dark .yw-pnl-page .yw-wf-gap-total { fill: #4a3a63; }
[data-theme-root].dark .yw-pnl-page .yw-wf-ink-total { fill: #a883ee; }
[data-theme-root].dark .yw-pnl-page .yw-wf-gap-up { fill: #17243d; }
[data-theme-root].dark .yw-pnl-page .yw-wf-ink-up { fill: #8b8794; }
[data-theme-root].dark .yw-pnl-page .yw-wf-gap-down { fill: #5a3a4b; }
[data-theme-root].dark .yw-pnl-page .yw-wf-ink-down { fill: #e07fb4; }
[data-theme-root].dark .yw-pnl-page .yw-wf-axis { stroke: #5b5063; }
[data-theme-root].dark .yw-pnl-page .yw-wf-connector { stroke: #55505d; }
[data-theme-root].dark .yw-pnl-page .yw-wf-value { fill: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-wf-label { fill: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-wf-legend { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-wf-legend i[data-tone="total"], [data-theme-root].dark .yw-pnl-page .yw-pnl-cols-swatch[data-tone="violet"], [data-theme-root].dark .yw-pnl-page .yw-pnl-cols-bar { background: repeating-linear-gradient(125deg, #a883ee 0 2px, #4a3a63 2px 4px); }
[data-theme-root].dark .yw-pnl-page .yw-wf-legend i[data-tone="up"], [data-theme-root].dark .yw-pnl-page .yw-pnl-cols-swatch[data-tone="grey"], [data-theme-root].dark .yw-pnl-page .yw-pnl-cols-bar[data-tone="grey"] { background: repeating-linear-gradient(125deg, #8b8794 0 2px, #17243d 2px 4px); }
[data-theme-root].dark .yw-pnl-page .yw-wf-legend i[data-tone="down"], [data-theme-root].dark .yw-pnl-page .yw-pnl-cols-bar[data-tone="below"] { background: repeating-linear-gradient(125deg, #e07fb4 0 2px, #5a3a4b 2px 4px); }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-cols-swatch, .yw-pnl-cols-bar)[data-tone="solid"] { background: #5b5663; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cols .yw-month-column-rail[data-signed] { border-bottom-color: #39323f; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cols-zero { background: #5b5063; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cols .yw-month-column-label { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-driver { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-dialog-close { background: #142036; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-dialog-close:hover { background: #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-txs > li.yw-pnl-tx-item[data-picked] { background: #33293f; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-tx-name, .yw-pnl-tx-amount) { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-tx-meta { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-days thead th { background: #0d1527; box-shadow: inset 0 -1px 0 #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-empty-line { color: #c3b9cc; }

/* Lead pass (10/03): the auto table layout handed one month column (Aug) the
   table's spare width, so the figures shrank to their content and the line
   column took the slack. 10/06: the owner read that as "wasting a lot of
   blank space" (the line column was 60% of the card). The fixed layout above
   replaces it: one line column width, the figure columns even. */
.yw-pnl-page .yw-pnl-table :is(th, td).num { white-space: nowrap; }

/* -- Books rebuilt (10/11, owner: "these need improvement with the new
   design, they are hard to understand and read because of the font size").
   The printed statement: a fixed line column, the months even, one line per
   row with the percent a quieter 12.5px figure beside 14px dollars, the
   bookkeeper's sections as section rows, the subtotals a tinted band, the
   change column its own tint, the header and the line column held while
   the statement scrolls inside its card. The balance sheet shares the row
   with the files; a file is a row with a round mark, the name, one quiet
   line and a Delete pill. */
.yw-pnl-page .yw-pnl-pill { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #59535f; font-size: 13px; font-weight: 500; white-space: nowrap; text-decoration: none; cursor: pointer; transition: border-color .16s, color .16s; }
.yw-pnl-page .yw-pnl-pill:hover { border-color: #c9b1ff; color: #7433d4; text-decoration: none; }
.yw-pnl-page .yw-pnl-pill:focus-visible { outline: 2px solid #b993ff; outline-offset: 2px; }
.yw-pnl-page .yw-pnl-statement .yw-pnl-scroll { margin-top: 16px; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] { max-height: min(74vh, 54rem); overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ddd2e7 transparent; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th { position: sticky; top: 0; z-index: 2; background: #fbfbfb; box-shadow: inset 0 -1px 0 #e2e1e4; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th[data-total] { background: #f8f4fb; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th:first-child { z-index: 3; }
.yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table tbody tr:first-child > td { border-top: 0; }
/* The fixed layout: the line column, then the figure columns sharing the rest. */
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) { table-layout: fixed; font-size: 14px; }
.yw-pnl-page .yw-pnl-printed > colgroup > .yw-pnl-col-line { width: 17rem; }
.yw-pnl-page .yw-pnl-printed { width: 100%; max-width: none; min-width: calc(17rem + var(--yw-pnl-n, 3) * 10rem); }
.yw-pnl-page .yw-pnl-sheet > colgroup > .yw-pnl-col-line { width: 12rem; }
.yw-pnl-page .yw-pnl-sheet { width: 100%; max-width: none; min-width: calc(12rem + var(--yw-pnl-n, 3) * 8.5rem); }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) th { height: 40px; padding: 0 8px 10px; color: #87818c; font-size: 12.5px; font-weight: 400; vertical-align: bottom; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) th:first-child { color: #87818c; }
.yw-pnl-page .yw-pnl-th-sub { display: block; margin-top: 1px; color: #a59fab; font-size: 12px; font-weight: 400; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) td { padding: 11px 8px; color: #202024; font-size: 14px; line-height: 20px; vertical-align: middle; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) td:first-child { padding-left: 2px; color: #343039; font-size: 14px; white-space: normal; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) :is(th, td):last-child { padding-right: 6px; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) :is(th, td).num { white-space: nowrap; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) td.num { overflow: visible; }
.yw-pnl-page .yw-pnl-v { white-space: nowrap; font-variant-numeric: tabular-nums; }
.yw-pnl-page .yw-pnl-pcts .yw-pnl-pct { display: inline-block; min-width: 4.4em; margin: 0 0 0 6px; color: #87818c; font-size: 12.5px; text-align: right; }
.yw-pnl-page .yw-pnl-printed .yw-pnl-pp { min-width: 4.8em; }
.yw-pnl-page .yw-pnl-pcts td.num[data-gap] { padding-right: calc(8px + 6px + 4.4em * .89); }
.yw-pnl-page .yw-pnl-pcts td.num[data-gap]:last-child { padding-right: calc(6px + 6px + 4.8em * .89); }
/* The subtotals: a tinted band, the dollars at 15px. */
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td { background-color: #f6f2fc; color: #202024; font-weight: 600; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td .yw-pnl-v { font-size: 15px; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td[data-total] { background-color: #efe8f9; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) tbody tr.yw-pnl-row[data-key]:hover > td { background-color: #f0eafa; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td:first-child { background-color: #f6f2fc; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] + .yw-pnl-row > td { border-top-color: #d9d4de; }
/* The bookkeeper's sections. */
.yw-pnl-page .yw-pnl-printed .yw-pnl-section > td { padding: 20px 2px 8px; border-top: 0; border-bottom: 1px solid #dcd7e1; color: #59535f; font-size: 13px; font-weight: 500; letter-spacing: -.1px; }
.yw-pnl-page .yw-pnl-printed tbody > .yw-pnl-section:first-child > td { padding-top: 12px; }
.yw-pnl-page .yw-pnl-printed .yw-pnl-section + tr > td { border-top: 0; }
.yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row > td[data-gap] { color: #c3bdc8; }
/* The balance sheet and the files share the row; the files fill their card. */
.yw-pnl-page .yw-pnl-books-rest { margin-top: 16px; }
.yw-pnl-page .yw-pnl-books-rest > .yw-money-card { display: flex; flex-direction: column; }
.yw-pnl-page .yw-pnl-books-rest > .yw-money-span-2 + .yw-pnl-files-card:last-child { grid-column: auto; }
.yw-pnl-page .yw-pnl-files-scroll { max-height: 26rem; margin-top: 10px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ddd2e7 transparent; }
.yw-pnl-page .yw-money-span-2 + .yw-pnl-files-card > .yw-pnl-files-scroll { flex: 1 1 0; min-height: 168px; max-height: none; }
.yw-pnl-page .yw-pnl-files { margin: 0; }
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 0 12px; padding: 12px 2px; border-top: 1px solid #eae8ec; font-size: 14px; transition: background-color .16s; }
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file:first-child { border-top: 0; }
.yw-pnl-page .yw-pnl-files > li.yw-pnl-file:hover { background: #f8f6fa; }
.yw-pnl-page .yw-pnl-file-mark { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: #efe8fb; color: #7c3aed; font-size: 10px; font-weight: 600; letter-spacing: .04em; }
.yw-pnl-page .yw-pnl-file[data-missing] .yw-pnl-file-mark { background: #f0eef2; color: #87818c; }
.yw-pnl-page .yw-pnl-file-name { display: block; max-width: 100%; overflow: hidden; color: #202024; font-size: 14px; font-weight: 500; letter-spacing: -.2px; text-overflow: ellipsis; white-space: nowrap; }
.yw-pnl-page a.yw-pnl-file-name:hover { color: #7c3aed; text-decoration: underline; text-underline-offset: 2px; }
.yw-pnl-page .yw-pnl-file-name[data-missing] { color: #59535f; font-weight: 500; }
.yw-pnl-page .yw-pnl-file-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 0; margin-top: 3px; color: #87818c; font-size: 12.5px; }
.yw-pnl-page .yw-pnl-file-meta > * + *::before { content: "·"; margin: 0 7px; color: #c3bdc8; font-weight: 400; }
.yw-pnl-page .yw-pnl-file-meta > .yw-money-flag { font-size: 12.5px; letter-spacing: 0; }
.yw-pnl-page .yw-pnl-delete { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border: 1px solid #e2e1e4; border-radius: 10px; background: #fff; color: #a96883; font-size: 13px; font-weight: 500; cursor: pointer; transition: border-color .16s, background-color .16s, color .16s; }
.yw-pnl-page .yw-pnl-delete:hover { border-color: #e6b3c6; background: #fbf0f4; color: #b9507a; }
.yw-pnl-page .yw-pnl-delete:focus-visible { outline: 2px solid #e7b9cb; outline-offset: 2px; }
.yw-pnl-page .yw-pnl-delete:disabled { cursor: default; opacity: .6; }
@media (max-width: 1100px) {
  .yw-pnl-page .yw-pnl-books-rest > .yw-money-span-2 + .yw-pnl-files-card:last-child { grid-column: 1 / -1; }
  .yw-pnl-page .yw-money-span-2 + .yw-pnl-files-card > .yw-pnl-files-scroll { flex: 0 1 auto; min-height: 0; max-height: 26rem; }
}
@media (prefers-reduced-motion: reduce) {
  .yw-pnl-page :is(.yw-pnl-pill, .yw-pnl-delete, .yw-pnl-files > li.yw-pnl-file) { transition: none; }
}

/* Books rebuilt (10/11), dark. */
[data-theme-root].dark .yw-pnl-page .yw-pnl-pill { border-color: #1c2843; background: #142036; color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-pill:hover { border-color: #5a4a6d; color: #c9b1ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] { scrollbar-color: #273656 transparent; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th { background: #0d1527; box-shadow: inset 0 -1px 0 #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-scroll[data-scroll="list"] > .yw-pnl-table thead th[data-total] { background: #2f2638; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) th, [data-theme-root].dark .yw-pnl-page .yw-pnl-th-sub { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) td { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) td:first-child { color: #ece6f2; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-pcts .yw-pnl-pct { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td { background-color: #2f2638; color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td:first-child { background-color: #2f2638; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] > td[data-total] { background-color: #35293f; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) tbody tr.yw-pnl-row[data-key]:hover > td { background-color: #382f46; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row[data-key] + .yw-pnl-row > td { border-top-color: #55505d; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-printed .yw-pnl-section > td { border-bottom-color: #55505d; color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-printed, .yw-pnl-sheet) .yw-pnl-row > td[data-gap] { color: #6f6975; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files-scroll { scrollbar-color: #273656 transparent; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files > li.yw-pnl-file { border-color: #1c2843; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-files > li.yw-pnl-file:hover { background: #111b30; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-mark { background: #3d3350; color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file[data-missing] .yw-pnl-file-mark { background: #142036; color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-name { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page a.yw-pnl-file-name:hover { color: #c5a8ff; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-name[data-missing] { color: #c3b9cc; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-meta { color: #a297ab; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-file-meta > * + *::before { color: #6f6975; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-delete { border-color: #1c2843; background: #142036; color: #e69ac4; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-delete:hover { border-color: #5a3a4a; background: #4d3345; color: #f0b8d2; }
/* The balance-sheet word on its own line: in the narrow card the month and it wrapped with a stray dot leading the second line. */
.yw-pnl-page .yw-pnl-file-meta > .yw-money-flag { flex-basis: 100%; margin-top: 2px; }
.yw-pnl-page .yw-pnl-file-meta > .yw-money-flag::before { content: none; }

/* Trends charts (10/11, owner: "some of these charts are hard to
   understand"): the figure on each bar, the zero line labeled, the key and
   the month labels at 12px, the line under the chart at 13px, a stacked bar
   square-cornered between its parts. */
.yw-pnl-page .yw-pnl-cols .yw-month-column { height: 200px; }
.yw-pnl-page .yw-pnl-cols .yw-month-column-label { height: 16px; margin-top: 7px; color: #87818c; font-size: 12px; }
.yw-pnl-page .yw-pnl-cols-key { margin-bottom: 12px; color: #59535f; font-size: 12px; }
.yw-pnl-page .yw-pnl-cols-tag { position: absolute; right: 0; left: 0; color: #202024; font-size: 12px; font-weight: 500; letter-spacing: -.2px; line-height: 1; text-align: center; white-space: nowrap; pointer-events: none; }
.yw-pnl-page .yw-pnl-cols-tag[data-below] { color: #a96883; }
.yw-pnl-page .yw-pnl-cols-zero-label { position: absolute; left: 0; margin-bottom: 3px; color: #a59fab; font-size: 11px; line-height: 1; transform: translateY(-2px); pointer-events: none; }
.yw-pnl-page .yw-pnl-cols[data-stack] .yw-pnl-cols-bars { inset: 0 24%; }
.yw-pnl-page .yw-pnl-cols-bar[data-stacked] { border-radius: 0; }
.yw-pnl-page .yw-pnl-cols-bar[data-stacked]:last-child { border-radius: 3px 3px 0 0; }
.yw-pnl-page .yw-pnl-cols .yw-month-detail { gap: 4px 14px; color: #87818c; font-size: 13px; }
.yw-pnl-page .yw-pnl-cols .yw-month-detail-period { font-size: 13px; }
.yw-pnl-page .yw-pnl-cols .yw-month-detail strong { font-size: 14px; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cols-tag { color: #f3eef8; }
[data-theme-root].dark .yw-pnl-page .yw-pnl-cols-tag[data-below] { color: #e69ac4; }
[data-theme-root].dark .yw-pnl-page :is(.yw-pnl-cols-key, .yw-pnl-cols .yw-month-column-label, .yw-pnl-cols .yw-month-detail, .yw-pnl-cols-zero-label) { color: #a297ab; }