/* A restrained paper-card interaction layer, shared across all three sizes. */
select {font:inherit;color:inherit}
select:focus-visible {outline:2px solid var(--violet);outline-offset:3px}
main {overflow-x:clip}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.flip-deck {--shuffle-travel:clamp(32px,18%,84px);position:relative;min-width:0;isolation:isolate;margin:0 7px 14px 0}
.flip-deck.is-shuffling {z-index:5}
.deck-tab {position:absolute;bottom:-10px;right:24px;color:#9c899f;font-size:8px;letter-spacing:.12em;line-height:8px;z-index:4;pointer-events:none}
.deck-rotor {display:grid;position:relative}
.deck-face {grid-area:1/1;position:relative;padding:24px;display:flex;flex-direction:column;min-width:0;border-color:#ddd4e1;background:var(--surface);box-shadow:0 10px 28px #41304808;transform-origin:center;z-index:2;transform:translate(0,0) scale(1)}
.deck-back {background:#fefcf9}
.deck-face[aria-hidden="true"] {pointer-events:none;z-index:1;transform:translate(10px,12px) scale(.988);background:#eee7f0;border-color:#d8cbdc;box-shadow:0 8px 16px #4130480c}
.deck-face[aria-hidden="true"]>* {visibility:hidden}
.is-shuffling .deck-face>* {visibility:visible}
.is-shuffling .deck-face {will-change:transform;background:var(--surface);box-shadow:0 16px 30px #41304816}
.deck-tools {position:absolute;z-index:6;top:24px;right:24px}
.scope-switch {display:inline-flex;gap:3px;padding:4px;border:1px solid #e6dfe9;background:#f2edf3;border-radius:10px}
.scope-switch button {border:0;background:transparent;color:#85798e;padding:6px 18px;border-radius:7px;min-height:32px;font-size:12px;transition:background .18s,color .18s,box-shadow .18s}
.scope-switch button[aria-pressed="true"] {background:#fffdfb;color:#5b4c69;box-shadow:0 2px 6px #55406312;font-weight:600}
.detail-heading {margin-bottom:14px;min-width:0}
.detail-eyebrow {display:block;color:#a38672;font-size:10px;letter-spacing:.09em;margin-bottom:5px}
.detail-heading h3,.conversion-heading h3 {margin:0;font-size:16px;font-weight:600;letter-spacing:.01em}
.detail-heading p {font-size:11px;color:#8c8089;margin:7px 0 0}
.detail-foot {display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:17px;border-top:1px solid #ece6df;color:#92858d;font-size:10px;line-height:1.7}
.detail-foot svg {width:17px;height:17px;fill:none;stroke:#9b8da6;stroke-width:1.4;stroke-linejoin:round}
.detail-foot>span:not(:only-child) {display:block}
.detail-empty {padding:20px 0;color:#958891;font-size:12px;line-height:1.8}
.detail-empty .text-link {display:block;margin-top:8px}
.performance-deck .detail-heading {padding-right:155px;margin-bottom:10px}
.performance-context {display:flex;align-items:center;gap:7px;color:#8f818d;font-size:11px;min-height:38px}
.scope-dot {height:6px;width:6px;border-radius:50%;background:#a597b2}
.performance-body {display:grid;grid-template-columns:170px minmax(220px,1fr) minmax(155px,.6fr);gap:22px;align-items:center;margin:12px 0 22px}
.achievement-ring {width:170px;height:170px;display:block}
.achievement-ring text {fill:#61556f;font-size:28px;font-weight:500;font-variant-numeric:tabular-nums}
.achievement-ring .ring-unit {font-size:13px}
.achievement-ring .ring-label {font-size:10px;font-weight:400;fill:#9c8da1}
.performance-figures {display:grid;grid-template-columns:1fr 1fr;gap:15px 18px}
.performance-figures small,.performance-aside>small {display:block;color:#9a8a94;font-size:11px;margin-bottom:5px}
.performance-figures strong {display:block;font:500 32px/1.4 'Noto Serif SC','Songti SC',serif;color:#554760;font-variant-numeric:tabular-nums}
.performance-figures b {font-size:17px;font-weight:500;font-variant-numeric:tabular-nums}
.performance-actual {grid-column:1/-1}
.performance-aside {border-left:1px solid #e5dce7;padding-left:27px}
.performance-aside>b {font-size:28px;font-weight:500;display:block;line-height:1.4;font-variant-numeric:tabular-nums}
.performance-aside>b em {font-style:normal;font-size:11px;font-weight:400;color:#8f808b}
.performance-aside>span {display:block;font-size:10px;color:#9e8f97;margin:7px 0 18px}
.efficiency-inline {font-size:11px;color:#8b7b88}
.efficiency-inline strong {font-size:17px;color:#746080;margin:0 4px;font-weight:500}
.employee-picker,.detail-filter {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;color:#9a8b95;font-size:11px}
.employee-picker select,.detail-filter select {max-width:65%;border:1px solid #ded4e4;background:#f7f2f9;border-radius:7px;padding:7px 30px 7px 11px;color:#695575;font-size:12px;min-height:36px;cursor:pointer}
.performance-deck .employee-picker {justify-content:flex-start}
.performance-deck .employee-picker select {min-width:128px}
.efficiency-deck {--shuffle-travel:clamp(20px,16%,36px);margin-bottom:0;align-self:stretch}
.efficiency-deck .deck-tab {display:none}
.efficiency-deck .deck-rotor {height:100%}
.efficiency-deck .deck-face {padding:0;min-height:132px}
.metric-flip-button {border:0;border-radius:12px;background:transparent;text-align:left;padding:20px;color:var(--ink);width:100%;height:100%;display:flex;flex-direction:column;align-items:flex-start}
.metric-label {display:flex;align-items:center;justify-content:space-between;width:100%;gap:5px;font-size:11px;color:#938390}
.metric-label svg {width:17px;height:17px;fill:none;stroke:#a090ab;stroke-width:1.3}
.metric-flip-button strong {display:block;font:600 clamp(20px,2.2vw,30px) 'Noto Serif SC','Songti SC',serif;margin:8px 0 6px;white-space:nowrap}
.metric-flip-button em {font-style:normal}
.metric-caption,.metric-flip-button>small {font-size:10px;color:#9a8b96}
.metric-flip-button>small {color:#a287a4;margin-top:4px}
.detail-split {gap:22px;align-items:stretch}
.chart-detail {display:flex;flex-direction:column;padding:24px}
.chart-detail .donut-panel {flex:1;min-height:270px}
.rounded-donut {width:min(100%,300px)}
.overlap-donut {overflow:visible}
.donut-segment[role="button"],.donut-overlap[data-detail-action] {cursor:pointer;outline:none}
.donut-focus {opacity:0;transition:opacity .2s}
.donut-segment[aria-pressed="true"] .donut-focus {opacity:.16}
.donut-segment[role="button"]:hover .donut-focus {opacity:.22}
.donut-segment[role="button"]:focus-visible .donut-focus {opacity:.5;stroke-width:36px}
.donut-value {font-size:29px;font-weight:500;fill:#49404e;font-variant-numeric:tabular-nums}
.donut-caption {font-size:11px;fill:#9c8f96;letter-spacing:.04em}
.donut-share {font-size:11px;fill:#776781;font-variant-numeric:tabular-nums}
.chart-selection-note {text-align:center;font-size:10px;color:#a1919e;min-height:18px;margin:4px 0 9px}
.donut-key {display:grid;grid-template-columns:1fr 1fr;gap:5px 10px;margin:6px -7px 0}
.donut-key>span,.donut-key>button {display:flex;align-items:center;gap:7px;color:#8c7e86;font-size:11px;white-space:nowrap;border:1px solid transparent;border-radius:7px;padding:10px 7px;background:transparent;text-align:left;min-height:40px}
.donut-key>button:hover {background:#f5f0f5}
.donut-key>button[aria-pressed="true"] {background:#f3edf5;border-color:#e7dce9;color:#685274}
.donut-key>button:focus-visible,.detail-row:focus-visible {outline:2px solid #9c89ad;outline-offset:2px}
.donut-key b {margin-left:auto;color:#766a76;font-size:11px;font-weight:500}
.donut-key i,.row-name>i {display:inline-block;width:7px;height:7px;flex:none;background:var(--swatch);border-radius:3px}
.table-deck .deck-rotor {height:100%;min-height:620px}
.table-deck .deck-face {padding:22px;min-width:0}
.table-deck .detail-heading {margin-bottom:20px}
.detail-table-header,.detail-row {display:grid;grid-template-columns:minmax(80px,1fr) minmax(64px,.6fr) minmax(48px,.5fr) 14px;gap:10px;align-items:center}
.detail-table-header {color:#a09199;font-size:10px;background:#f7f3ee;border-radius:7px;padding:10px}
.detail-table-header>span:not(:first-child),.detail-row>span:nth-child(3) {text-align:right}
.detail-row {border:0;border-bottom:1px solid #eee7e3;background:transparent;color:#867783;width:100%;padding:18px 10px;min-height:62px;text-align:left;font-size:11px;border-radius:0;transition:background .18s,color .18s}
.detail-row:not(.static):hover {background:#f4eef7;color:#675575;border-radius:7px}
.detail-row[aria-pressed="true"] {background:#f4eef7;border-radius:7px}
.detail-row b {text-align:right;font-weight:500;color:#514657;font-variant-numeric:tabular-nums;white-space:nowrap}
.row-name {display:flex;align-items:center;gap:9px;font-weight:500;color:#625667}
.detail-row>svg,.contribution-row>svg {width:14px;height:14px;fill:none;stroke:#b3a4bb;stroke-width:1.4;transition:transform .18s}
.detail-row:hover>svg,.contribution-row:hover>svg {transform:translateX(3px);stroke:#716080}
.detail-row.compact,.detail-table-header.compact {grid-template-columns:1fr 80px 65px}
.back-heading {display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-4px 0 17px}
.back-heading>span {font-size:10px;color:#a2929e;letter-spacing:.05em}
.back-button {border:0;color:#7d638e;background:#f0e9f4;border-radius:7px;padding:8px 10px;font-size:11px;min-height:34px}
.back-button:hover {background:#e7daee}
.contribution-total,.personal-total {display:flex;align-items:center;justify-content:space-between;gap:8px;margin:18px 0 12px}
.contribution-total>span,.personal-total>span {font-size:11px;color:#998792}
.contribution-total>b,.personal-total>strong {font-size:21px;color:#695571;font-weight:500;font-variant-numeric:tabular-nums}
.contribution-total small {font-size:11px;font-weight:400}
.contribution-row {display:grid;grid-template-columns:30px 1fr 72px 12px;gap:10px;align-items:center;width:100%;background:none;border:0;border-bottom:1px solid #eee7e3;border-radius:0;text-align:left;padding:9px 0;color:inherit;min-height:48px}
.contribution-row:hover {background:#f5eff8}
.avatar {display:grid;place-items:center;flex:none;border-radius:9px;width:28px;height:28px;background:var(--avatar-tone,#ede5f0);color:#8b7395;font-size:11px}
.contribution-name {min-width:0}
.contribution-name>b {font-size:11px;font-weight:500;display:block;overflow-wrap:anywhere}
.contribution-name>i {display:block;max-width:125px;height:3px;border-radius:3px;background:#eee8f1;margin-top:6px;overflow:hidden}
.contribution-name em {display:block;height:100%;background:#afa0bc;border-radius:3px}
.contribution-value {text-align:right;font-variant-numeric:tabular-nums}
.contribution-value b {display:block;font-size:11px;font-weight:500;color:#786282}
.contribution-value small {display:block;font-size:9px;color:#a596a2}
.contribution-list {padding-bottom:14px;max-height:370px;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.contribution-list+.detail-foot {display:block}
.customer-deck .deck-rotor {min-height:620px}
.segment-tabs {display:flex;gap:4px;padding:4px;background:#f2edf3;border-radius:8px}
.segment-tabs button {flex:1;border:0;background:none;border-radius:6px;padding:7px 3px;min-height:33px;font-size:11px;color:#93839c;white-space:nowrap}
.segment-tabs [aria-pressed="true"] {background:#fffdfb;color:#6c507d;box-shadow:0 2px 5px #68527012;font-weight:500}
.customer-owner-list {padding-bottom:15px;max-height:400px;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.customer-owner-row {display:grid;grid-template-columns:28px 1fr 65px 55px;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f0e8e2;min-height:45px;font-size:11px}
.customer-owner-row>b {font-weight:500;overflow-wrap:anywhere}
.customer-owner-row>span:not(.avatar) {text-align:right;color:#7e658b;font-variant-numeric:tabular-nums}
.customer-owner-row>small {text-align:right;color:#a698a1;font-variant-numeric:tabular-nums}
.pool-row {border-top:1px dashed #dcd0c5;border-bottom:0;margin-top:7px;color:#9c8067}
.pool-row .avatar {color:#9e856f}
.ownership-table {min-width:0}
.conversion-card {padding:25px 26px 0;overflow:hidden}
.conversion-heading {display:flex;justify-content:space-between;align-items:center;gap:15px}
.conversion-heading::after {display:none;content:"左右滑动，查看完整转化路径 →";font-size:10px;color:#a48daa;margin-top:8px}
.chart-unit {font-size:10px;color:#9c8d9e;white-space:nowrap}
.chart-unit i {display:inline-block;width:14px;height:3px;border-radius:3px;background:#8b799a;margin:0 7px 3px 0}
.conversion-scroll {overflow-x:auto;margin:6px -10px 12px;scrollbar-width:thin;scrollbar-color:#c8bdd0 transparent}
.conversion-chart {display:block;width:100%;min-width:580px;max-height:360px}
.chart-gridline {stroke:#ece5e0;stroke-dasharray:3 5}
.axis-caption {font-size:10px;fill:#a3979e}
.point-value {font-size:14px;font-weight:500;fill:#6a5979;font-variant-numeric:tabular-nums}
.stage-label {font-size:11px;fill:#807280}
.drop-label {font-size:10px;fill:#b09a8c}
.conversion-insight {display:flex;align-items:center;gap:12px;padding:14px 16px;background:#f4eee7;border:1px solid #ece0d4;border-radius:8px;margin:0 0 22px}
.insight-mark {width:30px;height:30px;display:grid;place-items:center;background:#e8dbcc;border-radius:8px;flex:none;color:#9f7757;font-size:19px}
.conversion-insight b {display:block;font-size:12px;font-weight:500;color:#927052}
.conversion-insight div>span {display:block;font-size:10px;color:#a18e7f;margin-top:3px}
.conversion-summary {display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #eee5de;margin:0 -26px;padding:18px 26px;background:#fbf8f4;gap:15px}
.conversion-summary>div {border-right:1px solid #e9dfd6;padding-left:17px}
.conversion-summary>div:first-child {padding-left:0}
.conversion-summary>div:last-child {border-right:0}
.conversion-summary small {display:block;font-size:10px;color:#a2909a;margin-bottom:4px}
.conversion-summary b {font-size:20px;font-weight:500;color:#76607f;font-variant-numeric:tabular-nums}
.owner-details {margin:0 0 6px;padding:13px 15px;border:1px solid #e7dfd8;border-radius:9px;background:#fcf9f5}
.owner-details>summary {font-size:12px;color:#7c6887;cursor:pointer;padding:3px 0}
.owner-details[open]>.form-grid {margin-top:18px}
.owner-entry {border:1px solid #e7dfd8;border-radius:9px;overflow:hidden}
.owner-entry .owner-details {margin:0;border:0;border-top:1px solid #e7dfd8;border-radius:0}

@media (max-width:1180px) {
  .performance-body {grid-template-columns:145px minmax(175px,1fr) minmax(120px,.6fr);gap:15px}
  .achievement-ring {width:145px;height:145px}
  .performance-aside {padding-left:18px}
  .table-deck .deck-face,.chart-detail {padding:18px}
  .detail-table-header,.detail-row {grid-template-columns:minmax(72px,1fr) 60px 48px 12px;gap:6px;padding-left:5px;padding-right:5px}
  .donut-key {gap:12px}
}
@media (max-width:940px) {
  .performance-body {grid-template-columns:135px 1fr;gap:13px}
  .performance-aside {grid-column:1/-1;border-left:0;border-top:1px solid #e5dce7;padding:14px 0 0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4px 12px}
  .performance-aside>span {margin:0}
  .performance-aside>b {grid-column:2;grid-row:1;text-align:right;font-size:20px}
  .efficiency-inline {grid-column:2;grid-row:2;text-align:right}
  .chart-detail .donut-panel {min-height:260px}
  .chart-detail {padding:23px}
  .detail-split {gap:22px}
  .table-deck .deck-face {padding:24px}
  .detail-table-header,.detail-row {grid-template-columns:1fr 80px 70px 14px;gap:10px;padding-left:10px;padding-right:10px}
  .table-deck .deck-rotor {min-height:620px}
}
@media (max-width:680px) {
  .flip-deck {--shuffle-travel:34px}
  .efficiency-deck {--shuffle-travel:22px}
  .deck-tools {right:16px;top:17px}
  .scope-switch button {padding:5px 13px;font-size:11px;min-height:31px}
  .deck-face,.table-deck .deck-face {padding:18px}
  .deck-tab {right:22px}
  .performance-deck .detail-heading {padding-right:115px}
  .detail-heading h3,.conversion-heading h3 {font-size:15px}
  .detail-heading p {font-size:10px}
  .performance-body {grid-template-columns:125px 1fr;gap:8px 13px;margin:13px 0 18px}
  .achievement-ring {width:125px;height:125px}
  .performance-figures {gap:11px 10px}
  .performance-figures strong {font-size:25px}
  .performance-figures b {font-size:13px}
  .performance-figures small,.performance-aside>small {font-size:10px}
  .performance-aside {margin-top:12px}
  .performance-aside>span,.efficiency-inline {font-size:9px}
  .efficiency-inline strong {font-size:15px}
  .metric-flip-button {padding:14px;min-height:115px}
  .metric-flip-button strong {font-size:20px}
  .metric-label,.metric-caption,.metric-flip-button>small {font-size:9px}
  .metric-label svg {width:15px;height:15px}
  .efficiency-deck .deck-face {min-height:115px}
  .chart-detail {padding:18px}
  .chart-detail .donut-panel {min-height:250px}
  .rounded-donut {width:265px;max-width:100%}
  .donut-key {margin-top:7px;gap:5px 8px}
  .donut-key>span,.donut-key>button,.donut-key b {font-size:10px}
  .detail-table-header,.detail-row {grid-template-columns:minmax(70px,1fr) 62px 47px 12px;gap:7px;padding-left:5px;padding-right:5px}
  .detail-row {font-size:11px;min-height:65px}
  .detail-row.compact,.detail-table-header.compact {grid-template-columns:1fr 72px 57px}
  .detail-foot {font-size:9px;padding-top:14px}
  .back-heading {margin-bottom:14px}
  .customer-owner-row {grid-template-columns:28px 1fr 55px 45px;gap:8px}
  .ownership-table td,.ownership-table th {padding:12px 9px;font-size:10px}
  .conversion-card {padding:19px 17px 0}
  .conversion-heading {display:block}
  .chart-unit {display:block;font-size:9px;margin-top:9px}
  .conversion-scroll {margin:8px -17px 14px;padding:0 8px 5px}
  .conversion-chart {min-width:760px;max-height:none}
  .conversion-heading::after {display:block}
  .conversion-chart .axis-caption {font-size:12px}
  .conversion-chart .stage-label {font-size:13px}
  .conversion-chart .point-value {font-size:16px}
  .conversion-chart .drop-label {font-size:12px}
  .conversion-insight {padding:12px;align-items:flex-start;gap:9px;margin-bottom:18px}
  .conversion-insight b {font-size:11px}
  .conversion-insight div>span {font-size:9px;line-height:1.8}
  .conversion-summary {margin:0 -17px;padding:16px 17px;gap:8px}
  .conversion-summary>div {padding-left:7px}
  .conversion-summary small {font-size:9px}
  .conversion-summary b {font-size:18px}
}
@media (prefers-reduced-motion:reduce) {
  .scope-switch button,.detail-row,.detail-row>svg,.contribution-row>svg,.donut-focus {transition:none}
}
