/* 经营看板. Colors and sizes are those of theme.css: ink in three levels, one accent, amber for what waits to be done, red for what is late.
   Figures are text in ink; a mark, a line or a bar beside them carries the color. Nothing moves. */
@media screen{
 .qf-ui .main .dash-year{display:flex;flex-direction:row;align-items:center;gap:8px;margin:0;font-size:14px;color:var(--qf-ink-2);white-space:nowrap}
 .qf-ui .main .dash-year select:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]){width:auto;min-width:6.5rem;height:38px;min-height:38px;margin:0;padding-top:0;padding-bottom:0}
 .qf-ui .dash-icon{flex:none;width:16px;height:16px}
 /* A panel's own heading: its name, and to the right what the drawing under it is read by */
 .qf-ui .main .dash-months>.heading,.qf-ui .main .dash-owed>.heading{align-items:center;margin-bottom:8px}
 .qf-ui .dash-months>.heading h2 small{margin-left:6px;font-weight:400}

 /* The five headline figures: the year's three with how the months have gone, the two that wait with how far they have come */
 .qf-ui .dash-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 16px}
 .qf-ui .dash-tile{background:var(--qf-card);border:1px solid var(--qf-line);border-radius:14px;padding:14px 16px;min-width:0}
 .qf-ui .dash-tile>span{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--qf-ink-2)}
 .qf-ui .dash-tile.warn .dash-icon{color:var(--qf-amber)}
 .qf-ui .dash-tile strong{display:block;margin-top:4px;font-size:26px;font-weight:600;line-height:1.3;color:var(--qf-ink);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
 .qf-ui .dash-tile strong i{margin-left:4px;font-style:normal;font-size:13px;font-weight:400;color:var(--qf-ink-3)}
 .qf-ui .dash-tile small{display:block;margin-top:2px}
 .qf-ui .dash-visual{display:flex;align-items:center;height:28px;margin:6px 0 4px}
 .qf-ui .dash-spark{display:block;width:100%;height:28px;overflow:visible}
 .qf-ui .dash-spark .line{fill:none;stroke:var(--qf-accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
 .qf-ui .dash-spark .area{fill:var(--qf-accent);fill-opacity:.1}
 .qf-ui .dash-meter{display:block;width:100%;height:6px}
 .qf-ui .dash-meter .track{fill:var(--qf-line)}
 .qf-ui .dash-meter .fill{fill:var(--qf-accent)}

 /* The year's months, a measure at a time */
 .qf-ui .dash-switch{display:flex;gap:6px;flex:none;margin-left:auto}
 .qf-ui .main .dash-switch button{min-width:4rem}
 .qf-ui .main .dash-switch button[aria-pressed=true]{border-color:var(--qf-accent);background:var(--qf-accent-soft);color:var(--qf-accent)}
 .qf-ui .dash-fig{margin:8px 0 0;min-width:0}
 .qf-ui .dash-plot{display:flex;align-items:flex-start;gap:6px}
 .qf-ui .dash-axis{flex:0 0 34px;display:block;overflow:visible}
 .qf-ui .dash-svg{flex:1 1 0;min-width:0;display:block;overflow:visible}
 .qf-ui .dash-svg svg{overflow:hidden}
 .qf-ui .dash-plot text{font-size:12px;fill:var(--qf-ink-3);font-variant-numeric:tabular-nums}
 .qf-ui .dash-svg .peak{fill:var(--qf-ink);font-weight:600}
 .qf-ui .dash-svg .grid{stroke:var(--qf-line);stroke-width:1}
 .qf-ui .dash-svg .base{stroke:var(--qf-line-2);stroke-width:1}
 .qf-ui .dash-svg .bar{fill:var(--qf-accent)}
 .qf-ui .dash-svg .narrow{display:none}
 .qf-ui .dash-svg .hit{fill:transparent;outline:none}
 .qf-ui .dash-svg .hit:hover,.qf-ui .dash-svg .hit:focus-visible{fill:rgba(63,108,134,.08)}
 .dash-tip{position:fixed;z-index:60;pointer-events:none;padding:6px 10px;border-radius:8px;background:var(--qf-ink,#262624);color:#fff;font-size:13px;line-height:1.4;white-space:nowrap}
 .dash-tip[hidden]{display:none}
 .qf-ui .dash-apart{margin:6px 0 0;font-size:13px;color:var(--qf-ink-3)}
 .qf-ui .dash-more>summary{padding:8px 0;font-size:14px;color:var(--qf-accent);cursor:pointer}
 .qf-ui .dash-empty{margin:4px 0;font-size:14px;color:var(--qf-ink-3)}

 /* What customers still owe: a row a customer, its bar in three parts, opened to its sums and its items */
 .qf-ui .dash-legend{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px 16px;flex:0 1 auto;margin-left:auto;font-size:13px;color:var(--qf-ink-2)}
 .qf-ui .dash-legend span{display:flex;align-items:center;gap:6px;white-space:nowrap}
 .qf-ui .dash-legend span::before{content:'';width:10px;height:10px;border-radius:2px;background:var(--qf-accent)}
 .qf-ui .dash-legend .unpaid::before{background:var(--qf-amber)}
 .qf-ui .dash-legend .rest::before{background:var(--qf-line-2)}
 .qf-ui .dash-ledger-head,.qf-ui .dash-customer>summary{display:grid;grid-template-columns:minmax(11rem,2fr) minmax(8rem,3fr) repeat(2,minmax(7rem,1fr));gap:0 18px;align-items:center}
 .qf-ui .dash-ledger-head{padding:0 12px 8px 30px;border-bottom:1px solid var(--qf-line);font-size:13px;color:var(--qf-ink-3)}
 .qf-ui .dash-ledger .num{text-align:right;font-variant-numeric:tabular-nums}
 .qf-ui .dash-customer{border-bottom:1px solid var(--qf-line)}
 .qf-ui .dash-customer>summary{position:relative;list-style:none;padding:12px 12px 12px 30px;font-size:14px;color:var(--qf-ink-2);cursor:pointer}
 .qf-ui .dash-customer>summary::-webkit-details-marker{display:none}
 .qf-ui .dash-customer>summary::before{content:'';position:absolute;left:11px;top:50%;width:7px;height:7px;border-right:1.6px solid var(--qf-ink-3);border-bottom:1.6px solid var(--qf-ink-3);transform:translateY(-65%) rotate(-45deg)}
 .qf-ui .dash-customer[open]>summary::before{transform:translateY(-75%) rotate(45deg)}
 .qf-ui .dash-customer>summary:hover{background:var(--qf-soft)}
 .qf-ui .dash-customer .who{font-weight:600;color:var(--qf-ink);overflow-wrap:anywhere}
 .qf-ui .dash-customer .who small{display:block;font-weight:400}
 .qf-ui .dash-customer .split{min-width:0}
 .qf-ui .dash-split{display:block;width:100%;height:10px}
 .qf-ui .dash-split .back{fill:var(--qf-accent)}
 .qf-ui .dash-split .unpaid{fill:var(--qf-amber)}
 .qf-ui .dash-split .rest{fill:var(--qf-line-2)}
 .qf-ui .dash-split .gap{fill:var(--qf-card)}
 .qf-ui .dash-customer>summary:hover .dash-split .gap{fill:var(--qf-soft)}
 .qf-ui .dash-ledger .owed{font-weight:600;color:var(--qf-ink)}
 .qf-ui .dash-sum{margin:0 0 8px 30px;font-size:13px;color:var(--qf-ink-2);font-variant-numeric:tabular-nums}
 .qf-ui .dash-customer>.table-wrap{margin:0 0 12px 30px}
 .qf-ui .dash-customer>.dash-statement{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px 30px}
 .qf-ui .main .dash-link{display:inline;padding:0;min-height:0;border:0;border-radius:0;background:none;color:var(--qf-accent);font:inherit;font-weight:500;text-align:left;text-decoration:none;white-space:normal;overflow-wrap:anywhere;cursor:pointer}
 .qf-ui .main .dash-link:hover{text-decoration:underline;background:none}
 .qf-ui .dash-link+small{display:block}

 /* How the work stands, and how long each type takes */
 /* Side by side only where each of the two is given 46rem, which holds the table of times whole (five columns, two of them bars: some 616px with the names of type
    in use, and the panel's own margins); otherwise the two stand one over the other. No width of screen is named, for the side bar and the page's margins change with it.
    The bars give way before the table does: they are as long as there is room for, between 3rem and 6.5rem, and are not counted at their drawing's own width. */
 .qf-ui .dash-pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(46rem,100%),1fr));gap:0 16px;align-items:start}
 .qf-ui .dash-facts{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}
 .qf-ui .main .dash-facts>*{flex:1 1 6.5rem;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:0;padding:10px 12px;border:0;border-radius:10px;background:var(--qf-soft);font-size:13px;font-weight:400;line-height:1.65;color:var(--qf-ink-2);text-align:left}
 .qf-ui .main .dash-facts>button:hover{background:var(--qf-accent-soft)}
 .qf-ui .dash-facts strong{font-size:20px;font-weight:600;line-height:1.3;color:var(--qf-ink)}
 .qf-ui .dash-facts>div>span{display:flex;align-items:center;gap:6px}
 .qf-ui .main .dash-facts>.late{background:var(--qf-red-soft)}
 .qf-ui .dash-facts>.late .dash-icon,.qf-ui .dash-facts>.late strong{color:var(--qf-red)}
 .qf-ui .dash-people .late{font-weight:600;color:var(--qf-red)}
 .qf-ui .dash-cycles td small{display:block}
 .qf-ui .dash-bar{display:flex;align-items:center;gap:8px;min-width:7.5rem}
 .qf-ui .dash-bar svg{flex:0 1 6.5rem;min-width:3rem;height:8px;overflow:visible;contain:size}
 .qf-ui .dash-bar path{fill:var(--qf-accent)}
 .qf-ui .dash-bar.running path{fill:#c5d3db}
 .qf-ui .dash-bar b{font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums}

 /* What the records still lack */
 .qf-ui .dash-gap{border-top:1px solid var(--qf-line)}
 .qf-ui .dash-gaps h2+.dash-gap{border-top:0}
 .qf-ui .dash-gap>summary{display:flex;align-items:center;gap:10px;padding:12px 0;font-size:15px;color:var(--qf-ink);cursor:pointer}
 .qf-ui .dash-gap>summary b{padding:1px 9px;border-radius:999px;background:var(--qf-amber-soft);color:var(--qf-amber);font-size:13px;font-weight:600}
 .qf-ui .dash-gap-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:8px 0;border-top:1px solid var(--qf-line)}
 .qf-ui .dash-gap-row>span:first-child{flex:1 1 14rem;min-width:0;overflow-wrap:anywhere}
 .qf-ui .dash-gap-row .row-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}

 /* Projects to be done again: the near ones under the heading, the rest folded below as the gaps are; red only for those past due */
 .qf-ui .dash-due-list>.dash-gap-row:first-child{border-top:0}
 .qf-ui .dash-revisions .dash-due{color:var(--qf-ink-2);font-variant-numeric:tabular-nums}
 .qf-ui .dash-revisions .dash-due.late{color:var(--qf-red);font-weight:600}
 .qf-ui .dash-revisions .dash-gap-calm>summary b{background:var(--qf-soft);color:var(--qf-ink-2)}

 /* Where five figures in a row would crowd one another: the year's three, then the two that wait */
 @media(max-width:1280px){
  .qf-ui .dash-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}
  .qf-ui .dash-tile{grid-column:span 2}
  .qf-ui .dash-tile.owed{grid-column:span 3}
 }
 @media(max-width:900px){
  .qf-ui .dash-ledger-head{display:none}
  .qf-ui .dash-customer>summary{grid-template-columns:1fr 1fr;gap:6px 12px}
  .qf-ui .dash-customer .who,.qf-ui .dash-customer .split{grid-column:1/-1}
  .qf-ui .dash-customer>summary .num{text-align:left}
  .qf-ui .dash-customer>summary .num::before{content:attr(data-label);display:block;font-size:12px;font-weight:400;color:var(--qf-ink-3)}
  .qf-ui .dash-sum,.qf-ui .dash-customer>.table-wrap,.qf-ui .dash-customer>.dash-statement{margin-left:0}
 }
 @media(max-width:700px){.qf-ui .main .dash-year select:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]){height:44px;min-height:44px}
  /* On a phone: what was signed across the top, the rest two by two; the chart's columns thin, and the buttons that switch it share the row. */
  .qf-ui .dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .qf-ui .dash-tile,.qf-ui .dash-tile.owed{grid-column:auto}
  .qf-ui .dash-tile:first-child{grid-column:1/-1}
  .qf-ui .dash-tile strong{font-size:20px}
  .qf-ui .dash-svg .wide{display:none}
  .qf-ui .dash-svg .narrow{display:inline}
  .qf-ui .main .dash-months>.heading,.qf-ui .main .dash-owed>.heading{align-items:stretch}
  .qf-ui .dash-switch{width:100%;margin-left:0}
  .qf-ui .dash-legend{justify-content:flex-start;margin-left:0}
  .qf-ui .main .dash-switch button{flex:1 1 0;min-width:0}
  /* The three figures of the commissions are sums to the cent with a line under each: on a phone each takes a row, not two and then one. */
  .qf-ui .main .dash-commissions>*{flex-basis:100%}}
}

/* 2026-10-25: the look borrowed from the admin template the owner showed - a tinted badge before each figure, the month chart as three lines on one scale, the
   year's signed total by company (a ring) and by type (bars). The three series colours clear the data-viz checks on the light surface (the brand's own blue and
   green read grey beside each other); the badges keep the brand tints. */
.qf-ui{--qf-series-1:#2f74a6;--qf-series-2:var(--qf-amber);--qf-series-3:#2a9a66;--qf-series-4:#7a4fa3}
.qf-ui .dash-badge{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;margin-right:8px;flex:none}
.qf-ui .dash-badge .dash-icon{color:inherit}
.qf-ui .dash-badge-blue{background:var(--qf-accent-soft);color:var(--qf-accent)}
.qf-ui .dash-badge-amber{background:var(--qf-amber-soft);color:var(--qf-amber)}
.qf-ui .dash-badge-green{background:var(--qf-green-soft);color:var(--qf-green)}
.qf-ui .dash-badge-red{background:var(--qf-red-soft);color:var(--qf-red)}
.qf-ui .dash-badge-grey{background:var(--qf-soft);color:var(--qf-ink-2)}
.qf-ui .dash-tile>span{align-items:center}
.qf-ui .dash-legend .s1::before{background:var(--qf-series-1)}
.qf-ui .dash-legend .s2::before{background:var(--qf-series-2)}
.qf-ui .dash-legend .s3::before{background:var(--qf-series-3)}
.qf-ui .dash-legend .s4::before{background:var(--qf-series-4)}
.qf-ui .dash-svg.dash-lines svg{overflow:visible}
.qf-ui .dash-lines .line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.qf-ui .dash-lines .area{fill-opacity:.08}
.qf-ui .dash-lines .dot{stroke:#fff;stroke-width:2}
.qf-ui .dash-lines .line.s1{stroke:var(--qf-series-1)}.qf-ui .dash-lines .area.s1,.qf-ui .dash-lines .dot.s1{fill:var(--qf-series-1)}
.qf-ui .dash-lines .line.s2{stroke:var(--qf-series-2)}.qf-ui .dash-lines .area.s2,.qf-ui .dash-lines .dot.s2{fill:var(--qf-series-2)}
.qf-ui .dash-lines .line.s3{stroke:var(--qf-series-3)}.qf-ui .dash-lines .area.s3,.qf-ui .dash-lines .dot.s3{fill:var(--qf-series-3)}
.qf-ui .dash-lines .line.s4{stroke:var(--qf-series-4)}.qf-ui .dash-lines .area.s4,.qf-ui .dash-lines .dot.s4{fill:var(--qf-series-4)}
.qf-ui .dash-share h2 small,.qf-ui .dash-kinds h2 small{margin-left:8px;font-size:13px;font-weight:400;color:var(--qf-ink-3)}
.qf-ui .dash-share-body{display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;align-items:center;margin-top:12px}
.qf-ui .dash-donut{width:180px;height:180px}
.qf-ui .dash-donut path{stroke:#fff;stroke-width:2}
.qf-ui .dash-donut .ring{fill:none;stroke-width:22}
.qf-ui .dash-donut .s1{fill:var(--qf-series-1)}.qf-ui .dash-donut .s2{fill:var(--qf-series-2)}.qf-ui .dash-donut .s3{fill:var(--qf-series-3)}.qf-ui .dash-donut .s4{fill:var(--qf-series-4)}
.qf-ui .dash-donut .ring.s1{stroke:var(--qf-series-1)}.qf-ui .dash-donut .ring.s2{stroke:var(--qf-series-2)}.qf-ui .dash-donut .ring.s3{stroke:var(--qf-series-3)}.qf-ui .dash-donut .ring.s4{stroke:var(--qf-series-4)}
.qf-ui .dash-donut .n{font-size:26px;font-weight:600;fill:var(--qf-ink);font-variant-numeric:tabular-nums}
.qf-ui .dash-donut .l{font-size:12px;fill:var(--qf-ink-3)}
.qf-ui .dash-share-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--qf-line);font-size:14px}
.qf-ui .dash-share-row:last-child{border-bottom:0}
.qf-ui .dash-share-row i{width:10px;height:10px;border-radius:3px}
.qf-ui .dash-share-row .s1{background:var(--qf-series-1)}.qf-ui .dash-share-row .s2{background:var(--qf-series-2)}.qf-ui .dash-share-row .s3{background:var(--qf-series-3)}.qf-ui .dash-share-row .s4{background:var(--qf-series-4)}
.qf-ui .dash-share-row b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.qf-ui .dash-share-row small{color:var(--qf-ink-3);min-width:34px;text-align:right}
.qf-ui .dash-kind-list{margin-top:12px}
.qf-ui .dash-kind-row{display:grid;grid-template-columns:150px minmax(0,1fr) 64px;gap:12px;align-items:center;padding:7px 0;font-size:14px}
.qf-ui .dash-kind-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qf-ui .dash-kind-bar{display:flex;align-items:center;min-width:0}
.qf-ui .dash-kind-bar .dash-meter{height:8px}
.qf-ui .dash-kind-bar .dash-meter rect{height:8px;rx:4}
.qf-ui .dash-kind-bar .dash-meter .fill{fill:var(--qf-series-1)}
.qf-ui .dash-shares{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;margin:0 0 16px}
.qf-ui .dash-shares .panel{margin:0}
@media (max-width:900px){.qf-ui .dash-shares{grid-template-columns:minmax(0,1fr)}}
.qf-ui .dash-kind-row b{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
@media (max-width:760px){.qf-ui .dash-share-body{grid-template-columns:140px minmax(0,1fr)}.qf-ui .dash-donut{width:140px;height:140px}.qf-ui .dash-kind-row{grid-template-columns:110px minmax(0,1fr) 56px}}
/* 健康灯 (2026-10-25): the three lights over 在办与逾期, each a way into the ledger. */
.qf-ui .dash-health{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}.qf-ui .dash-health button{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--qf-line);border-radius:999px;padding:4px 12px;font-size:13px;line-height:1.4;background:var(--qf-card);min-height:0;color:var(--qf-ink)}.qf-ui .dash-health strong{font-weight:600;margin-left:2px}