.tone-green { background: #e2f0d9 !important; }

/* The online report uses the same compact report canvas as the local browser build. */
body { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Arial, sans-serif; background: #f5f5f7; color: #1d1d1f; }
.online-header { height: auto; min-height: 58px; padding: 17px 28px; background: rgba(255,255,255,.94); }
.online-header .brand { font-size: 20px; font-weight: 700; letter-spacing: 0; color: #1d1d1f; }
.one-screen { max-width: 1800px; padding: 20px 28px; }
.panel { border-radius: 8px; border-color: #e5e5ea; box-shadow: 0 1px 2px rgba(0,0,0,.035); }
.panel-heading { display: flex; align-items: center; gap: 8px; }
.panel-heading h2, .panel-heading h3 { margin: 0; }
.panel-toggle { width: 26px; height: 26px; padding: 0; border-radius: 6px; background: #f2f2f7; color: #1d1d1f; font-size: 18px; line-height: 1; }
.control-panel { padding: 14px 16px; }
.control-panel > .panel-heading { margin-bottom: 12px; }
.control-panel.report-config-collapsed > .control-body { display: none; }
.control-panel.report-config-collapsed > .panel-heading { margin-bottom: 0; }
.report-area { margin-top: 14px; }
.report-tabs { padding: 14px 16px; }
.portfolio-block { margin-top: 12px; }
.portfolio-cards { grid-template-columns: repeat(9, minmax(0,1fr)); gap: 5px; }
.portfolio-cards .card { min-height: 44px; padding: 7px; font-size:12px; }
.section-heading { align-items: center; }
.section-heading h3 { margin: 0; }
.summary-table { max-height: 420px; }
.funnel-panel .hint { margin: 8px 0 0 34px; }
.collapsible-body { margin-top: 10px; }
.report-area .table-wrap { border-radius: 8px; }
.online-user { display:flex; align-items:center; gap:10px; font-size:13px; }
.panel.is-collapsed > :not(.panel-heading) { display:none !important; }
.panel-heading .hint { margin-left:4px; }
.report-tools { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.column-options { position:relative; margin:0; padding:0; border:0; }
.column-options summary { cursor:pointer; list-style:none; padding:9px 14px; border-radius:7px; background:#f2f2f7; font-weight:650; }
.column-options summary::-webkit-details-marker { display:none; }
.column-options[open] > summary { background:#e8f1ff; color:#1554a2; }
.column-popover { position:absolute; z-index:40; top:44px; left:0; width:min(920px,calc(100vw - 80px)); overflow:hidden; background:#fff; border:1px solid #d1d1d6; border-radius:11px; box-shadow:0 18px 46px rgba(0,0,0,.18); }
.column-list { position:static; width:auto; max-height:520px; overflow:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px; background:#fff; border:0; box-shadow:none; }
.column-group { min-width:0; border:1px solid #e5e5ea; border-radius:9px; overflow:hidden; background:#fbfbfd; }
.column-group-title { margin:0; padding:8px 10px; background:#f2f2f7; color:#3a3a3c; font-size:11px; font-weight:750; text-transform:uppercase; letter-spacing:.035em; }
.column-group-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:#e9e9ee; }
.column-option { display:grid; grid-template-columns:18px 7px minmax(0,1fr); align-items:center; gap:7px; min-height:42px; padding:7px 9px; background:#fff; font-size:11px; line-height:1.18; font-weight:550; cursor:pointer; }
.column-option:hover { background:#f4f8ff; }
.column-option input { width:16px; height:16px; margin:0; padding:0; accent-color:#007aff; }
.column-option-swatch { width:5px; height:26px; border-radius:99px; background:#d1d1d6; }
.column-option.option-orange .column-option-swatch { background:#f5a97f; }
.column-option.option-lilac .column-option-swatch { background:#a99bc3; }
.column-option.option-green .column-option-swatch { background:#8bc57e; }
.column-option.option-yellow .column-option-swatch { background:#e6c75b; }
.column-option.option-red .column-option-swatch { background:#ef6b73; }
.column-option.charge-option-base .column-option-swatch { background:#172554; }.column-option.charge-option-return .column-option-swatch { background:#ef4444; }.column-option.charge-option-promotion .column-option-swatch { background:#7c3aed; }.column-option.charge-option-delivery .column-option-swatch { background:#007aff; }.column-option.charge-option-fbo .column-option-swatch { background:#f59e0b; }.column-option.charge-option-partner .column-option-swatch { background:#10b981; }.column-option.charge-option-reward .column-option-swatch { background:#ec4899; }.column-option.charge-option-compensation .column-option-swatch { background:#06b6d4; }.column-option.charge-option-other .column-option-swatch { background:#64748b; }
.column-option.charge-option-base input { accent-color:#172554; }.column-option.charge-option-return input { accent-color:#ef4444; }.column-option.charge-option-promotion input { accent-color:#7c3aed; }.column-option.charge-option-delivery input { accent-color:#007aff; }.column-option.charge-option-fbo input { accent-color:#f59e0b; }.column-option.charge-option-partner input { accent-color:#10b981; }.column-option.charge-option-reward input { accent-color:#ec4899; }.column-option.charge-option-compensation input { accent-color:#06b6d4; }.column-option.charge-option-other input { accent-color:#64748b; }
.column-actions { position:static; display:flex; gap:8px; justify-content:flex-end; padding:10px 12px; background:#f8f8fa; border-top:1px solid #e5e5ea; }
.column-actions button { padding:8px 12px; font-size:12px; }
.scale-control { display:flex; align-items:center; gap:8px; }
.table-search { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:650; color:#3a3a3c; }
.table-search input { width:230px; min-height:36px; margin:0; padding:7px 10px; border:1px solid #c7c7cc; border-radius:7px; background:#fff; font:inherit; }
.table-search input:focus { border-color:#007aff; outline:3px solid rgba(0,122,255,.16); }
.search-count { min-width:112px; color:#636366; font-size:11px; }
.job-progress { min-width:520px; margin-top:8px; display:grid; grid-template-columns:1fr auto; gap:5px 12px; }
.job-progress .progress-track { grid-column:1/-1; height:8px; background:#e5e5ea; border-radius:99px; overflow:hidden; }
.job-progress .progress-fill { height:100%; background:#007aff; border-radius:99px; transition:width .25s ease; }
#report-table { --table-scale-factor:1; --article-column-width:calc(96px * var(--table-scale-factor)); --name-column-width:calc(260px * var(--table-scale-factor)); width:max-content; min-width:100%; font-size:var(--table-font-size,13px); }
#report-table th,#report-table td { min-width:calc(104px * var(--table-scale-factor)); max-width:calc(240px * var(--table-scale-factor)); }
#report-table th { padding:calc(8px * var(--table-scale-factor)) calc(6px * var(--table-scale-factor)); background:#eef1f5; color:#2c2c2e; font-size:calc(10.5px * var(--table-scale-factor)); line-height:1.15; font-weight:750; text-align:center; vertical-align:middle; white-space:normal; }
#report-table tbody td,#report-table tfoot td { padding:calc(7px * var(--table-scale-factor)) calc(6px * var(--table-scale-factor)); text-align:center; vertical-align:middle; font-variant-numeric:tabular-nums; line-height:1.2; }
#report-table tbody tr:nth-child(even):not(.header-totals):not(.totals-row):not(.totals-labels) td { background:#fafbfd; }
#report-table tbody tr:not(.header-totals):not(.totals-row):not(.totals-labels):hover td { background:#eef6ff; }
#report-table td.article,#report-table td.name { text-align:left; }
#report-table td.article { color:#0066cc; font-weight:650; cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px; }
#report-table tbody tr.is-selected > td { background:#dcecff !important; box-shadow:inset 0 3px #007aff,inset 0 -3px #007aff !important; }
#report-table tbody tr.is-selected > td:first-child { box-shadow:inset 3px 0 #007aff,inset 0 3px #007aff,inset 0 -3px #007aff !important; }
#report-table tbody tr.is-selected > td:last-child { box-shadow:inset -3px 0 #007aff,inset 0 3px #007aff,inset 0 -3px #007aff !important; }
#report-table tr > :nth-child(1) { position:sticky; left:0; z-index:3; min-width:var(--article-column-width); max-width:var(--article-column-width); background:#fff; }
#report-table tr > :nth-child(2) { position:sticky; left:var(--article-column-width); z-index:3; min-width:var(--name-column-width); max-width:var(--name-column-width); background:#fff; white-space:normal; overflow-wrap:anywhere; }
#report-table thead .column-headers th { position:sticky; top:0; z-index:7; background:#eef1f5; box-shadow:inset 0 -1px #c7c7cc; }
#report-table thead .column-headers > :nth-child(1),#report-table thead .column-headers > :nth-child(2) { z-index:9; background:#eef1f5; }
#report-table .header-totals > :nth-child(1),#report-table .header-totals > :nth-child(2) { z-index:8; background:#f5f5f7; }
#report-table td.bad { background:#fff0ef !important; color:#9e271f; box-shadow:inset 0 -4px #ff453a; font-weight:700; }
#report-table td.hot,#report-table td.warn { background:#fff8e6 !important; color:#855b08; box-shadow:inset 0 -4px #ffb020; font-weight:650; }
#report-table td.good { background:#edf9f1 !important; color:#147648; box-shadow:inset 0 -4px #34c759; font-weight:650; }
.totals-row td { border-top:2px solid #c7c7cc; background:#f5f5f7; }
#report-table .header-totals td { position:sticky; top:var(--report-header-height,42px); z-index:6; border-bottom:2px solid #c7c7cc; background:#f5f5f7; font-weight:750; }
#report-table .totals-labels th { position:static; font-size:calc(10.5px * var(--table-scale-factor)); line-height:1.15; font-weight:750; color:#2c2c2e; text-align:center; vertical-align:middle; white-space:normal; }
#report-table tfoot .totals-row td,#report-table tfoot .totals-labels th { background:#f5f5f7; }
.cost-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.cost-table { max-height:360px; }
.manual-cost-input { width:130px; }
.funnel-tools { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 10px; }
.funnel-column-options .column-popover { width:min(760px,calc(100vw - 80px)); }
.funnel-summary { width:max-content; min-width:100%; overflow:visible; border:1px solid #dde5ef; border-radius:9px; background:#fff; font-size:10px; }
.funnel-summary th,.funnel-summary td { padding:4px 5px; line-height:1.1; min-width:62px; text-align:center; vertical-align:middle; font-variant-numeric:tabular-nums; }
.funnel-summary th { background:#f1f5f9 !important; color:#334155; font-size:9px; line-height:1.08; font-weight:750; white-space:normal; }
.funnel-summary > thead > tr > :nth-child(1),.funnel-summary > tbody > tr.funnel-product-row > :nth-child(1) { position:sticky; left:0; z-index:3; min-width:82px; max-width:82px; background:#fff; }
.funnel-summary > thead > tr > :nth-child(2),.funnel-summary > tbody > tr.funnel-product-row > :nth-child(2) { position:sticky; left:82px; z-index:3; min-width:190px; max-width:190px; background:#fff; white-space:normal; overflow-wrap:anywhere; }
.funnel-summary > thead { position:sticky; top:0; z-index:6; }
.funnel-summary > thead > tr > th { top:auto; background:#f1f5f9 !important; box-shadow:inset 0 -1px #c7c7cc; }
.funnel-summary > thead > tr > :nth-child(1),.funnel-summary > thead > tr > :nth-child(2) { z-index:8; background:#f1f5f9 !important; }
.funnel-summary td.article,.funnel-summary td.name { text-align:left; }
.funnel-summary tbody .funnel-product-row:nth-child(4n+1) td { background:#fafbfd; }
.funnel-summary .funnel-product-row:hover td { background:#eef6ff; }
.funnel-product-row { cursor:pointer; }
.funnel-summary .funnel-product-row.is-selected > td { background:#eaf3ff !important; box-shadow:inset 0 1px #7ab8ff,inset 0 -1px #7ab8ff !important; }
.funnel-summary .funnel-product-row.is-selected > td:first-child { box-shadow:inset 4px 0 #007aff,inset 0 1px #7ab8ff,inset 0 -1px #7ab8ff !important; }
.funnel-summary .funnel-product-row.is-selected > td:last-child { box-shadow:inset -1px 0 #7ab8ff,inset 0 1px #7ab8ff,inset 0 -1px #7ab8ff !important; }
.funnel-link { color:#007aff; font-weight:650; }
.funnel-detail td { padding:5px; background:#fbfbfd !important; }
.funnel-detail[hidden] { display:none; }
.funnel-detail .table-wrap { max-height:none; }
.funnel-list-wrap { max-height:68vh; overflow:auto; overscroll-behavior:contain; }
.funnel-matrix { width:max-content; min-width:100%; font-size:10px; }
.funnel-matrix th,.funnel-matrix td { padding:3px 4px; line-height:1.1; min-width:62px; text-align:center; vertical-align:middle; font-variant-numeric:tabular-nums; }
.funnel-matrix th { background:#f1f5f9; color:#334155; font-size:9px; }
.funnel-matrix th.metric-name,.funnel-matrix td.metric-name { position:sticky; left:0; z-index:4; width:240px; min-width:240px; max-width:240px; text-align:left; white-space:normal; overflow-wrap:anywhere; word-break:normal; hyphens:auto; line-height:1.25; background:#eef4fb; font-weight:600; }
.funnel-matrix tr.funnel-section td,.funnel-matrix tr.funnel-ad-section td { background:#dcecff !important; color:#174b96; font-weight:750; text-align:left; border-top:2px solid #7fb5f5; }
.funnel-matrix tr.funnel-ad-subsection td,.funnel-matrix tr.funnel-share td { background:#fff8e6 !important; color:#855b08; font-weight:700; text-align:left; }
.funnel-matrix tr.funnel-product-title td { background:#eaf3ff !important; color:#174b96; font-size:16px; font-weight:750; text-align:left; }
.funnel-matrix tr.funnel-product-name td { background:#334155 !important; color:#fff; text-align:left; font-weight:600; }
.negative-charge-percent { display:block; margin-top:3px; color:#a43838; font-size:8px; font-weight:700; line-height:1.1; white-space:nowrap; }
.charge-summary-layout { display:grid; grid-template-columns:minmax(470px, .9fr) minmax(500px,1.1fr); gap:18px; align-items:start; }
.charge-donut { display:grid; grid-template-columns:180px minmax(240px,1fr); gap:18px; align-items:center; padding:12px; border:1px solid #e5e7eb; border-radius:10px; background:#fbfdff; }
.donut-visual { position:relative; width:180px; height:180px; }
.donut-ring { width:100%; height:100%; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(15,23,42,.06); }
.donut-ring::after { content:""; position:absolute; inset:38px; border-radius:50%; background:#fff; box-shadow:0 0 0 1px rgba(15,23,42,.05); }
.donut-center { position:absolute; inset:48px; z-index:1; display:grid; place-content:center; text-align:center; }
.donut-center b { font-size:24px; }.donut-center span { color:#64748b; font-size:11px; }
.donut-legend { display:grid; gap:7px; max-height:280px; overflow:auto; }
.donut-legend>div { display:grid; grid-template-columns:10px minmax(100px,1fr) auto 48px; align-items:center; gap:7px; font-size:10px; }
.donut-legend i { display:block; width:10px; height:10px; border-radius:50%; box-shadow:0 0 0 1px rgba(15,23,42,.14); }.donut-legend span { line-height:1.15; }.donut-legend b { text-align:right; }.donut-legend em { font-style:normal; color:#64748b; text-align:right; }
.donut-color-base { background:#172554; }.donut-color-return { background:#ef4444; }.donut-color-promotion { background:#7c3aed; }.donut-color-delivery { background:#007aff; }.donut-color-fbo { background:#f59e0b; }.donut-color-partner { background:#10b981; }.donut-color-reward { background:#ec4899; }.donut-color-compensation { background:#06b6d4; }.donut-color-other { background:#64748b; }.donut-color-remainder { background:#22a06b; }
.donut-legend .donut-base { margin-bottom:3px; padding-bottom:7px; border-bottom:1px solid #dbe3ed; font-weight:750; }
.donut-legend .donut-remainder { color:#18704c; }
.charge-tone-base { background:#eef1ff!important; box-shadow:inset 0 -4px #172554; }.charge-tone-return { background:#fff0f0!important; box-shadow:inset 0 -4px #ef4444; }.charge-tone-promotion { background:#f5efff!important; box-shadow:inset 0 -4px #7c3aed; }.charge-tone-delivery { background:#edf5ff!important; box-shadow:inset 0 -4px #007aff; }.charge-tone-fbo { background:#fff7e6!important; box-shadow:inset 0 -4px #f59e0b; }.charge-tone-partner { background:#ecfbf5!important; box-shadow:inset 0 -4px #10b981; }.charge-tone-reward { background:#fff0f7!important; box-shadow:inset 0 -4px #ec4899; }.charge-tone-compensation { background:#eafcff!important; box-shadow:inset 0 -4px #06b6d4; }.charge-tone-other { background:#f1f5f9!important; box-shadow:inset 0 -4px #64748b; }
#report-table th[class*="charge-tone-"],#report-table .totals-labels th[class*="charge-tone-"] { color:#26364d; }
#summary-table tbody tr[class*="charge-tone-"] td { background:inherit; }
.funnel-summary th { min-width:86px; max-width:112px; overflow-wrap:anywhere; hyphens:auto; }
.funnel-matrix td.metric-chart-trigger { cursor:help; color:#174b96; text-decoration:underline dotted; text-underline-offset:3px; }
.funnel-notes-row td { background:#f7faff !important; border-top:1px solid #c9d8eb; border-bottom:1px solid #c9d8eb; }
.funnel-notes-row td.metric-name { color:#174b96; font-weight:750; }
.funnel-note-cell { min-width:112px !important; padding:4px !important; }
.funnel-note-cell.has-note { background:#edf6ff !important; }
.funnel-note-cell textarea { display:block; width:104px; min-height:42px; resize:vertical; padding:5px; border:1px solid #b9cce4; border-radius:6px; background:rgba(255,255,255,.7); font:10px/1.2 inherit; }
.funnel-note-cell textarea:focus { border-color:#007aff; outline:2px solid rgba(0,122,255,.14); }
.funnel-note-cell button { margin-top:2px; min-height:20px; padding:2px 5px; font-size:8px; line-height:1.1; border-radius:4px; }
.funnel-note-cell small { display:block; min-height:11px; margin-top:2px; color:#3975b8; font-size:8px; }
.funnel-note-readonly { width:104px; max-height:80px; overflow:auto; white-space:normal; text-align:left; font-size:10px; }
.funnel-note-actions { display:flex; align-items:center; justify-content:space-between; gap:3px; }
.funnel-note-actions .funnel-note-delete,.note-feed-delete { min-width:20px; min-height:20px; padding:2px!important; border:1px solid #e2b7b7; background:#fff5f5; color:#a92f2f; font-size:9px; line-height:1; }
.funnel-pending-row td { background:#fff7df!important; color:#7a5a00; font-size:9px; white-space:normal; }
.funnel-pending-row td.metric-name { font-weight:750; }
.pending-day-cell { background:#fffaf0!important; color:#9a7a26; }
.funnel-note-colors { display:flex; align-items:center; justify-content:center; gap:3px; margin-top:3px; }
.funnel-note-cell .funnel-note-color { width:10px; min-width:10px; min-height:10px; height:10px; margin:0; padding:0; border:1px solid #fff; border-radius:50%; background:#cbd5e1; box-shadow:0 0 0 1px rgba(15,23,42,.22); cursor:pointer; transition:transform .12s ease,box-shadow .12s ease; }
.funnel-note-cell .funnel-note-color[data-note-color="yellow"] { background:#f2c94c; }.funnel-note-cell .funnel-note-color[data-note-color="red"] { background:#ef5350; }.funnel-note-cell .funnel-note-color[data-note-color="green"] { background:#35b56f; }.funnel-note-cell .funnel-note-color[data-note-color="blue"] { background:#3f8cff; }
.funnel-note-cell .funnel-note-color:hover { transform:scale(1.12); }.funnel-note-cell .funnel-note-color.is-selected { box-shadow:0 0 0 1px #fff,0 0 0 2px #007aff; transform:scale(1.08); }.funnel-note-cell .funnel-note-color:disabled { opacity:.55; cursor:wait; }
.funnel-note-cell.note-marker-yellow,.funnel-note-cell.note-marker-red,.funnel-note-cell.note-marker-green,.funnel-note-cell.note-marker-blue { position:relative; box-shadow:none!important; }
.funnel-note-cell.note-marker-yellow::before,.funnel-note-cell.note-marker-red::before,.funnel-note-cell.note-marker-green::before,.funnel-note-cell.note-marker-blue::before { content:""; position:absolute; z-index:2; right:5px; bottom:-4px; left:5px; height:9px; border:2px solid #fff; border-radius:999px; box-shadow:0 1px 4px rgba(15,23,42,.16); pointer-events:none; }
.funnel-note-cell.note-marker-yellow { background:#fffdf2!important; }.funnel-note-cell.note-marker-yellow textarea { background:#fff9d9; border-color:#e6c75b; }.funnel-note-cell.note-marker-yellow::before { background:#f2c94c; }
.funnel-note-cell.note-marker-red { background:#fff7f7!important; }.funnel-note-cell.note-marker-red textarea { background:#ffe7e7; border-color:#ef9a98; }.funnel-note-cell.note-marker-red::before { background:#ef5350; }
.funnel-note-cell.note-marker-green { background:#f5fff9!important; }.funnel-note-cell.note-marker-green textarea { background:#e4f8ec; border-color:#86d5aa; }.funnel-note-cell.note-marker-green::before { background:#35b56f; }
.funnel-note-cell.note-marker-blue { background:#f5f9ff!important; }.funnel-note-cell.note-marker-blue textarea { background:#e5efff; border-color:#8ab6f5; }.funnel-note-cell.note-marker-blue::before { background:#3f8cff; }
.notes-feed-tools { display:flex; align-items:end; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.notes-feed-panel #notes-feed-root { max-height:360px; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding-right:5px; }
.notes-sort { display:grid; gap:4px; color:#536176; font-size:11px; font-weight:650; }.notes-sort select { min-width:150px; padding:8px; }
.note-create { position:relative; margin-left:auto; }.note-create>summary { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#007aff; color:#fff; cursor:pointer; font-size:22px; font-weight:500; list-style:none; }.note-create>summary::-webkit-details-marker { display:none; }
.note-create form { position:absolute; z-index:20; right:0; top:40px; width:min(430px,calc(100vw - 48px)); display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:14px; border:1px solid #cdd8e7; border-radius:10px; background:#fff; box-shadow:0 14px 36px rgba(15,23,42,.18); }.note-create form label { display:grid; gap:4px; color:#536176; font-size:11px; font-weight:650; }.note-create form label:first-child,.note-create form label:nth-child(3) { grid-column:1/-1; }.note-create form textarea { min-height:76px; resize:vertical; }.note-create form button { justify-self:start; }.note-create form small { align-self:center; color:#3975b8; }
.notes-feed-list { display:grid; gap:8px; }.note-feed-item { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(320px,1.5fr) auto; gap:14px; align-items:center; padding:10px 12px 10px 16px; border:1px solid #e1e7ef; border-left:6px solid #cbd5e1; border-radius:9px; background:#fff; }.note-feed-item.note-marker-yellow { border-left-color:#f2c94c; background:#fffdf2; }.note-feed-item.note-marker-red { border-left-color:#ef5350; background:#fff7f7; }.note-feed-item.note-marker-green { border-left-color:#35b56f; background:#f5fff9; }.note-feed-item.note-marker-blue { border-left-color:#3f8cff; background:#f5f9ff; }
.note-feed-meta { display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; min-width:0; }.note-feed-article { width:auto; min-height:0; margin:0; padding:0; border:0; background:transparent; color:#174b96; font:inherit; font-weight:750; text-decoration:underline dotted; text-underline-offset:3px; cursor:pointer; }.note-feed-article:hover { color:#007aff; }.note-feed-article:focus-visible { border-radius:3px; outline:2px solid rgba(0,122,255,.35); outline-offset:2px; }.note-feed-meta span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.note-feed-meta time { color:#64748b; font-size:11px; }.note-feed-item p { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }.note-feed-actions { display:flex; align-items:end; gap:7px; }.note-feed-actions label { display:grid; gap:2px; color:#64748b; font-size:9px; }.note-feed-actions select { padding:5px; font-size:10px; }.notes-empty { margin:12px 0!important; }
@media (max-width: 900px) { .notes-feed-panel #notes-feed-root { max-height:320px; }.note-feed-item { grid-template-columns:1fr; }.note-create { margin-left:0; }.note-create form { left:0; right:auto; }.note-feed-actions { justify-content:space-between; } }
.charge-trend-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin:18px 0 8px; padding-top:15px; border-top:1px solid #dce4ee; }.charge-trend-heading>div { display:grid; gap:3px; }.charge-trend-heading b { font-size:14px; }.charge-trend-heading span { color:#64748b; font-size:10px; }
.charge-trend-scroll { overflow-x:auto; border:1px solid #dce4ee; border-radius:10px; background:linear-gradient(180deg,#f8fbff,#fff); }.charge-trend-chart { display:block; width:100%; min-width:860px; height:auto; }.charge-trend-grid { stroke:#dce5ef; stroke-width:1; stroke-dasharray:4 4; }.charge-trend-axis,.charge-trend-day-tick { stroke:#8493a8; stroke-width:1; }.charge-trend-zero { stroke:#56677e; stroke-width:1.4; }.charge-trend-axis-label { fill:#65758b; font-size:10px; }.charge-trend-axis-title { fill:#3e5068; font-size:11px; font-weight:700; }.charge-trend-line { fill:none; stroke-width:2.7; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round; }
.charge-trend-legend { display:grid; gap:8px; margin-top:10px; padding:11px 13px; border:1px solid #e0e6ee; border-radius:9px; background:#fbfcfe; }.charge-trend-legend>div { display:flex; align-items:center; gap:9px 18px; flex-wrap:wrap; }.charge-trend-legend label { display:flex; grid-template-columns:none; align-items:center; gap:7px; color:#334155; font-size:10px; cursor:pointer; }.charge-trend-legend input { width:auto; margin:0; }.charge-trend-legend .charge-trend-color-dot { flex:0 0 auto; width:10px; height:10px; border:2px solid #fff; border-radius:50%; box-shadow:0 0 0 1px rgba(15,23,42,.28); }.charge-trend-color-base { background:#1677ff; }.charge-trend-color-returns { background:#ef4444; }.charge-trend-color-fbo { background:#f59e0b; }.charge-trend-color-promotion { background:#7c3aed; }.charge-trend-color-profit { background:#16a66a; }.charge-trend-legend small { color:#64748b; font-size:9px; }.charge-trend-loading,.charge-trend-error { margin:16px 0!important; }
.metric-chart-tooltip { position:fixed; z-index:1000; width:340px; padding:10px; border:1px solid #c9d8eb; border-radius:9px; background:#fff; box-shadow:0 12px 32px rgba(15,23,42,.22); pointer-events:none; }
.metric-chart-tooltip>b { display:block; margin-bottom:5px; color:#17324d; font-size:12px; }
.metric-chart-tooltip svg { display:block; width:100%; height:112px; background:linear-gradient(180deg,#f4f8ff,#fff); border-radius:6px; }
.metric-chart-tooltip polyline { fill:none; stroke:#007aff; stroke-width:2.5; vector-effect:non-scaling-stroke; }.metric-chart-tooltip .chart-axis,.metric-chart-tooltip .chart-tick { stroke:#8091a7; stroke-width:1; }.metric-chart-tooltip .chart-grid { stroke:#dbe4ef; stroke-width:1; stroke-dasharray:3 3; }.metric-chart-tooltip .chart-axis-label { fill:#607086; font-size:9px; }
.metric-chart-tooltip>div { display:flex; justify-content:space-between; color:#64748b; font-size:9px; }
@media (max-width: 1000px) { .charge-summary-layout { grid-template-columns:1fr; }.charge-donut { grid-template-columns:160px 1fr; }.donut-visual { width:160px; height:160px; } }
@media (max-width: 900px) { .portfolio-cards { grid-template-columns: repeat(4, minmax(130px,1fr)); } }
@media (max-width: 800px) { .portfolio-cards { grid-template-columns: repeat(2, minmax(130px,1fr)); } .one-screen { padding: 14px; } .column-popover { width:calc(100vw - 28px); left:-1px; } .column-list { grid-template-columns:1fr; } .column-group-items { grid-template-columns:1fr; } .table-search { width:100%; } .table-search input { min-width:0; flex:1; } }