/* DCF workbench uses the application's paper, grey and brown palette. */ .dcf-calculator { --df-bg:var(--bg); --df-paper:var(--surface); --df-ink:var(--ink); --df-muted:#75716c; --df-line:var(--line); --df-accent:var(--accent); --df-soft:var(--accent-soft); --df-field:#faf9f7; --df-accent-line:#d7c7b6; --df-chart-secondary:#cbbba9; --df-error:#a63f32; --df-error-bg:#fff1ee; --df-low:#c4e6d1; --df-fair:#f1e0b3; --df-high:#efc7bd; --df-good:#287c54; --df-fair-ink:#786950; --df-high-ink:#b94c42; --df-warning-bg:#f6f2eb; display:grid; grid-template-columns:minmax(0,1fr); gap:20px; min-width:0; padding:26px; background:var(--df-bg); color:var(--df-ink); border:1px solid var(--df-line); border-radius:12px; font-size:13px; line-height:1.65; } .dcf-calculator * {box-sizing:border-box;} .dcf-calculator>* {min-width:0;} .dcf-calculator [hidden] {display:none!important;} .dcf-calculator :is(h2,h3,h4,p) {margin:0;} .dcf-calculator h2 {font-size:26px;font-weight:500;letter-spacing:-.7px;} .dcf-calculator h3 {font-size:14px;font-weight:500;} .dcf-calculator h4 {display:flex;align-items:center;gap:9px;font-size:12px;font-weight:500;} .dcf-calculator h4>span {font-size:11px;color:var(--df-accent);} .dcf-calculator b,.dcf-calculator strong {font-weight:500;font-variant-numeric:tabular-nums;} .dcf-calculator .df-muted {font-size:11px;color:var(--df-muted);line-height:1.7;} .dcf-calculator .df-header {display:flex;align-items:center;justify-content:space-between;gap:16px;} .dcf-calculator .df-eyebrow {font-size:11px;letter-spacing:1.5px;color:var(--df-accent);margin-bottom:4px;} .dcf-calculator .df-subtitle {margin-top:5px;font-size:12px;color:var(--df-muted);} .dcf-calculator .df-header-actions {display:flex;align-items:center;gap:12px;flex-shrink:0;} .dcf-calculator .df-header-mark {font-size:11px;white-space:nowrap;color:var(--df-muted);} .dcf-calculator button { font:inherit; font-size:11px; color:var(--df-accent); background:var(--df-paper); border:1px solid var(--df-line); border-radius:6px; padding:7px 11px; cursor:pointer; transition:background .15s,border-color .15s; } .dcf-calculator button:hover {background:var(--df-soft);border-color:var(--df-accent-line);} .dcf-calculator button:disabled {opacity:.4;cursor:default;} .dcf-calculator :is(input,select,button,summary):focus-visible {outline:2px solid var(--df-accent);outline-offset:3px;} .dcf-calculator .df-help-trigger {display:grid;place-items:center;width:34px;height:34px;padding:0;color:var(--df-muted);border-radius:50%;} .dcf-calculator .df-profile-bar {display:flex;flex-wrap:wrap;align-items:center;gap:10px;} .dcf-calculator .df-company-buttons {display:flex;flex-wrap:wrap;gap:10px;min-width:0;} .dcf-calculator .df-company-chip {position:relative;display:inline-flex;min-width:0;max-width:100%;} .dcf-calculator .df-company-buttons button {color:var(--df-muted);overflow-wrap:anywhere;max-width:100%;padding:7px 13px;} .dcf-calculator .df-company-buttons button[aria-pressed=true] {background:var(--df-soft);border-color:var(--df-accent-line);color:var(--df-accent);font-weight:500;} .dcf-calculator [data-new-company] {border-style:dashed;background:transparent;} .dcf-calculator .df-save-status {margin-left:auto;color:var(--df-muted);font-size:11px;} .dcf-calculator .df-new-company {display:flex;flex-wrap:wrap;align-items:end;gap:10px;} .dcf-calculator .df-new-company label {flex:1;min-width:160px;} .dcf-calculator .df-company-error {color:var(--df-error);font-size:12px;} .dcf-calculator label {display:grid;align-content:start;gap:6px;min-width:0;font-size:11px;color:var(--df-muted);} .dcf-calculator input,.dcf-calculator select { min-width:0; width:100%; height:39px; padding:8px 10px; font:inherit; font-size:13px; font-variant-numeric:tabular-nums; color:var(--df-ink); background:var(--df-field); border:1px solid var(--df-line); border-radius:5px; } .dcf-calculator input:focus,.dcf-calculator select:focus {border-color:var(--df-accent);background:var(--df-paper);} .dcf-calculator input::placeholder {font-size:11px;color:var(--muted);} .dcf-calculator details {padding:0;border:0;} .dcf-calculator summary {font-size:11px;color:var(--df-accent);cursor:pointer;} .dcf-calculator .df-overview {display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;background:var(--df-paper);border:1px solid var(--df-line);border-radius:10px;overflow:hidden;} .dcf-calculator .df-stat {display:flex;flex-direction:column;gap:8px;min-width:0;padding:20px 18px;} .dcf-calculator .df-stat+.df-stat {border-left:1px solid var(--df-line);} .dcf-calculator .df-stat h3 {font-size:11px;color:var(--df-muted);font-weight:400;} .dcf-calculator .df-stat-value {font-size:30px;font-weight:500;letter-spacing:-1px;line-height:1.4;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;} .dcf-calculator .df-stat-main {background:var(--df-soft);} .dcf-calculator .df-stat-main .df-stat-value {color:var(--df-accent);} .dcf-calculator [data-buy],.dcf-calculator [data-zone-low],.dcf-calculator [data-deviation][data-price-relation=discount] {color:var(--df-good);} .dcf-calculator [data-zone-high],.dcf-calculator [data-deviation][data-price-relation=premium] {color:var(--df-high-ink);} .dcf-calculator .df-stat-position .df-stat-value {display:flex;align-items:center;min-height:42px;font-size:22px;letter-spacing:-.5px;} .dcf-calculator :is(.df-market,.df-form,.df-results,.df-cashflow-section) {min-width:0;padding:20px;background:var(--df-paper);border:1px solid var(--df-line);border-radius:10px;} .dcf-calculator .df-section-head,.dcf-calculator .df-market-head {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;} .dcf-calculator .df-section-head {margin-bottom:16px;} .dcf-calculator .df-market-head p {margin-top:3px;} .dcf-calculator .df-zone-badge {padding:3px 8px;font-size:11px;white-space:nowrap;border-radius:4px;} .dcf-calculator .df-zone-badge[data-zone=低估] {background:var(--df-low);color:var(--df-good);} .dcf-calculator .df-zone-badge[data-zone=合理] {background:var(--df-fair);color:var(--df-fair-ink);} .dcf-calculator .df-zone-badge[data-zone=高估] {background:var(--df-high);color:var(--df-high-ink);} .dcf-calculator .df-price-controls {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:16px;margin-top:14px;} .dcf-calculator .df-price-fields {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0;} .dcf-calculator .df-interval-fields {min-width:0;} .dcf-calculator .df-price-chart {width:100%;min-width:0;height:180px;overflow:hidden;} .dcf-calculator .df-zone-keys {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;} .dcf-calculator .df-zone-key {display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:5px;padding:8px 10px;background:var(--df-field);border-radius:5px;font-size:11px;} .dcf-calculator .df-zone-key strong {font-size:11px;} .dcf-calculator .df-zone-dot {display:inline-block;width:5px;height:5px;margin-right:6px;border-radius:50%;background:var(--df-good);} .dcf-calculator .df-zone-key:nth-child(2) .df-zone-dot {background:var(--df-fair-ink);} .dcf-calculator .df-zone-key:nth-child(3) .df-zone-dot {background:var(--df-high-ink);} .dcf-calculator .df-market-message,.dcf-calculator .df-interval-note {margin-top:12px;} .dcf-calculator .df-market .df-error {margin-top:12px;} .dcf-calculator .df-layout {display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:20px;} .dcf-calculator .df-parameter-group {border-top:1px solid var(--df-line);padding-top:18px;margin-top:18px;} .dcf-calculator .df-parameter-group .df-section-head {margin-bottom:12px;} .dcf-calculator .df-fields {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;} .dcf-calculator .df-parameter-group>h4 {margin-bottom:12px;} .dcf-calculator .df-parameter-group>.df-muted {margin-top:10px;} .dcf-calculator .df-quiet-button {border:0;background:transparent;padding:2px 0;} .dcf-calculator .df-stages {display:grid;gap:8px;} .dcf-calculator .df-stage-row {display:grid;grid-template-columns:minmax(55px,1fr) 65px minmax(70px,1fr) 22px;align-items:center;gap:8px;padding:10px;background:var(--df-field);border:1px solid var(--df-line);border-radius:6px;} .dcf-calculator .df-stage-row input {height:34px;padding:6px;background:var(--df-paper);} .dcf-calculator .df-stage-row button {padding:2px;border:0;background:transparent;color:var(--df-muted);font-size:17px;} .dcf-calculator .df-stage-name {min-width:0;font-size:12px;} .dcf-calculator .df-stage-name small {display:block;font-size:11px;color:var(--df-muted);} .dcf-calculator .df-stage-key {font-size:11px;color:var(--df-muted);} .dcf-calculator .df-total {margin-top:10px;} .dcf-calculator .df-result-line {display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;font-size:12px;} .dcf-calculator .df-result-line>* {min-width:0;overflow-wrap:anywhere;} .dcf-calculator .df-result-line b {text-align:right;} .dcf-calculator .df-sum {border-top:1px solid var(--df-line);margin:6px 0;} .dcf-calculator .df-equity {border-top:1px solid var(--df-line);margin-top:7px;padding-top:13px;} .dcf-calculator .df-equity b {font-size:22px;} .dcf-calculator .df-shares-note {text-align:right;} .dcf-calculator .df-value-per-share {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:12px;margin-top:14px;background:var(--df-soft);border-radius:6px;font-size:12px;} .dcf-calculator .df-value-per-share strong {font-size:24px;color:var(--df-accent);overflow-wrap:anywhere;} .dcf-calculator .df-value-per-share small {font-size:11px;} .dcf-calculator .df-composition {display:flex;gap:2px;height:7px;margin:23px 0 8px;border-radius:4px;overflow:hidden;background:var(--df-line);} .dcf-calculator .df-segment-a {background:var(--df-accent);} .dcf-calculator .df-segment-b {background:var(--df-chart-secondary);} .dcf-calculator .df-legend {display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:11px;color:var(--df-muted);} .dcf-calculator .df-terminal-note {padding:12px;margin-top:18px;background:var(--df-field);border-radius:6px;font-size:11px;color:var(--df-muted);} .dcf-calculator .df-cashflow-chart {height:300px;width:100%;min-width:0;} .dcf-calculator .df-cashflow-section h3 {margin-bottom:4px;} .dcf-calculator .df-table-section {margin-top:16px;padding-top:14px;border-top:1px solid var(--df-line);} .dcf-calculator .df-table-wrap {max-width:100%;margin-top:12px;overflow-x:auto;} .dcf-calculator table {border-collapse:collapse;white-space:nowrap;font-variant-numeric:tabular-nums;width:100%;font-size:11px;} .dcf-calculator th,.dcf-calculator td {text-align:right;border-bottom:1px solid var(--df-line);padding:10px 8px;} .dcf-calculator th {color:var(--df-muted);background:var(--df-field);font-weight:400;} .dcf-calculator th:first-child,.dcf-calculator td:first-child {text-align:left;} .dcf-calculator .df-foot {display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:var(--df-muted);font-size:11px;} .dcf-calculator .df-error {color:var(--df-error);background:var(--df-error-bg);border:1px solid var(--df-high);border-radius:6px;padding:12px 14px;font-size:12px;} .dcf-calculator .df-warning {color:var(--df-fair-ink);background:var(--df-warning-bg);border-radius:6px;padding:12px 14px;font-size:12px;} /* Keep the existing three-second dwell behavior for company deletion. */ .dcf-calculator .df-company-buttons .df-company-delete {position:absolute;top:-7px;right:-7px;display:grid;place-items:center;width:20px;height:20px;padding:0;border:1px solid var(--df-accent-line);border-radius:50%;background:var(--df-paper);color:var(--df-muted);font-size:16px;line-height:1;z-index:1;opacity:0;visibility:hidden;transition:opacity .15s,visibility 0s;} .dcf-calculator .df-company-chip:is(:hover,:focus-within) .df-company-delete {opacity:1;visibility:visible;transition:opacity .15s 3s,visibility 0s 3s;} .dcf-calculator .df-company-buttons .df-company-delete:hover {color:var(--df-error);border-color:var(--df-error);background:var(--df-error-bg);} .dcf-calculator .df-company-empty {padding:28px 20px;border:1px dashed var(--df-line);border-radius:10px;color:var(--df-muted);text-align:center;} .dcf-calculator[data-empty=true] :is(.df-overview,.df-market,.df-layout,.df-cashflow-section,.df-foot,.df-error,.df-warning) {display:none!important;} @media (width>=1500px) {.tools-layout .content:has(.dcf-calculator) {max-width:1280px;}} @media (width<=1100px) { .dcf-calculator {padding:20px;gap:18px;} .dcf-calculator .df-stat {padding:16px 12px;} .dcf-calculator .df-stat-value {font-size:27px;} .dcf-calculator .df-stat-position .df-stat-value {font-size:20px;min-height:38px;} .dcf-calculator .df-layout {gap:16px;} .dcf-calculator :is(.df-form,.df-results) {padding:16px;} .dcf-calculator .df-stage-row {grid-template-columns:minmax(48px,1fr) 52px minmax(65px,1fr) 20px;gap:6px;padding:8px;} .dcf-calculator .df-save-status {width:100%;margin-left:0;} } @media (width<=950px) { .dcf-calculator .df-layout {grid-template-columns:1fr;} .dcf-calculator .df-overview {grid-template-columns:repeat(2,minmax(0,1fr));} .dcf-calculator .df-stat:nth-child(3) {border-left:0;border-top:1px solid var(--df-line);} .dcf-calculator .df-stat:nth-child(4) {border-top:1px solid var(--df-line);} } @media (width<=680px) { .dcf-calculator {padding:16px;gap:16px;border-radius:10px;} .dcf-calculator h2 {font-size:23px;} .dcf-calculator .df-header-mark {display:none;} .dcf-calculator .df-header-actions {gap:6px;} .dcf-calculator .df-market {padding:16px;} .dcf-calculator .df-price-controls {grid-template-columns:minmax(0,1fr);gap:12px;} .dcf-calculator .df-zone-keys {gap:8px;} .dcf-calculator .df-zone-key {display:grid;padding:8px;gap:4px;} .dcf-calculator .df-cashflow-section {padding:16px;} .dcf-calculator .df-cashflow-chart {height:260px;} } @media (width<=460px) { .dcf-calculator {padding:12px;} .dcf-calculator input,.dcf-calculator select {font-size:16px;} .dcf-calculator .df-fields {gap:10px;} .dcf-calculator .df-stage-row {grid-template-columns:minmax(42px,1fr) 48px minmax(56px,1fr) 20px;gap:5px;padding:7px;} .dcf-calculator .df-stage-name {font-size:11px;} .dcf-calculator .df-stage-name small {font-size:11px;} .dcf-calculator .df-stat-value {font-size:25px;} .dcf-calculator .df-stat-position .df-stat-value {font-size:20px;min-height:35px;} } @media (hover:none) {.dcf-calculator .df-company-buttons .df-company-delete {opacity:1;visibility:visible;transition:none;}} @media (pointer:coarse) { .dcf-calculator input,.dcf-calculator select {min-height:44px;height:auto;font-size:16px;} .dcf-calculator button:not(.df-company-delete) {min-height:44px;} .dcf-calculator .df-help-trigger {width:44px;} } @media (prefers-reduced-motion:reduce) {.dcf-calculator * {transition:none!important;}} @media (prefers-reduced-motion:reduce) and (hover:hover) {.dcf-calculator .df-company-chip:is(:hover,:focus-within) .df-company-delete {transition:visibility 0s 3s!important;}} /* Concept documentation dialog. */ .dcf-calculator .df-help-dialog { width:min(860px,calc(100% - 32px)); max-width:none; max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid var(--df-line); border-radius:12px; background:var(--df-paper); color:var(--df-ink); box-shadow:0 18px 60px rgb(51 51 51 / 15%); overflow:hidden} .dcf-calculator .df-help-dialog[open] { display:flex; flex-direction:column} .dcf-calculator .df-help-dialog::backdrop { background:rgb(51 51 51 / 35%)} .dcf-calculator .df-help-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px 16px; border-bottom:1px solid var(--df-line)} .dcf-calculator .df-help-head h2 { margin:0 0 4px; font-size:20px; letter-spacing:0} .dcf-calculator .df-help-close { flex-shrink:0; width:32px; height:32px; padding:0; font-size:22px; line-height:1; color:var(--df-muted)} .dcf-calculator .df-help-nav { display:flex; flex-shrink:0; flex-wrap:wrap; gap:8px; padding:12px 24px; border-bottom:1px solid var(--df-line); background:var(--df-field)} .dcf-calculator .df-help-body { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:20px 24px 24px; font-size:13px; line-height:1.85} .dcf-calculator .df-help-lead { padding:14px 16px; background:var(--df-soft); border-radius:7px} .dcf-calculator .df-help-body section { padding-top:24px; outline-offset:-2px} .dcf-calculator .df-help-body h3 { margin-bottom:10px; color:var(--df-accent); font-size:15px} .dcf-calculator .df-help-body section p+p { margin-top:10px} .dcf-calculator .df-help-formula { margin:12px 0; padding:12px 14px; border-left:3px solid var(--df-accent-line); background:var(--df-field); font-variant-numeric:tabular-nums; overflow-wrap:anywhere} .dcf-calculator .df-help-table { margin:12px 0; overflow-x:auto} .dcf-calculator .df-help-table table { font-size:12px; white-space:normal} .dcf-calculator .df-help-table :is(th,td) { padding:10px; text-align:left} .dcf-calculator .df-help-source { margin-top:24px; padding-top:14px; border-top:1px solid var(--df-line); font-size:11px; color:var(--df-muted)} .dcf-calculator .df-help-source a { color:var(--df-accent); text-underline-offset:3px} @media (width<=680px) { .dcf-calculator .df-header-actions {gap:6px} .dcf-calculator .df-help-head {padding:16px} .dcf-calculator .df-help-nav {padding:12px 16px;gap:6px} .dcf-calculator .df-help-body {padding:16px} .dcf-calculator .df-help-table :is(th,td) {padding:8px 6px} }