/* Retention Rate Calculator: customer analytics dashboard */
.rt-lh{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.app.rt .rt-mode{width:auto;order:0}
.rt-mode button{padding:4px 10px;font-size:12.5px}
.rt-sub{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--slate);padding-top:14px;border-top:1px solid var(--rule)}
.rt-sub em{font-style:normal;font-size:10px;letter-spacing:.06em;background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:1px 6px}
.rt-panel{border:1px solid var(--rule);border-radius:14px;overflow:hidden}
.rt-ph{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--rule)}
.rt-ph b{font-weight:600;font-size:15px}
.rt-ph small{font-family:var(--mono);font-size:11.5px;color:var(--slate)}
/* breakdown table */
.rt-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.rt-table th,.rt-table td{padding:9px 16px;text-align:left;font-weight:500}
.rt-table thead th{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--slate);font-weight:400;background:#FBFBF8;border-bottom:1px solid var(--rule)}
.rt-table thead th:first-child{width:38%}
.rt-table thead th:nth-child(3){width:17%}
.rt-table thead th:last-child{width:15%}
.rt-table tbody tr + tr{border-top:1px solid #F1F1EC}
.rt-table tbody th{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-table tbody th i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:9px;vertical-align:0}
.rt-table .rt-num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.rt-table thead .rt-num{font-weight:400}
.rt-table td.rt-num:last-child{color:var(--slate);font-weight:500}
.rt-tot{background:#FBFBF8}
.rt-tot th{font-weight:600}
.rt-bar{display:block;height:10px;background:var(--paper);border-radius:999px;overflow:hidden}
.rt-bar i{display:block;height:100%;width:0;border-radius:999px;transition:width .6s cubic-bezier(.3,.7,.3,1)}
.rt .d-start{background:#9CA3AF}
.rt .d-kept{background:var(--ink)}
.rt .d-lost{background:var(--red)}
.rt .d-new{background:var(--lime)}
.rt .d-end{background:var(--blue)}
/* projected cohort row */
.rt-cohort{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:3px;padding:14px 16px 6px}
.rt-cell{position:relative;display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 0 6px;border-radius:6px;background:rgba(61,90,254,var(--a,.1));color:var(--ink);font-variant-numeric:tabular-nums;transition:background-color .5s,color .3s;min-width:0}
.rt-cell.dark{color:#fff}
.rt-cell small{font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;opacity:.75}
.rt-cell b{font-size:11.5px;font-weight:600;white-space:nowrap}
.rt-cell span{font-size:10px;opacity:.75}
.rt-cell.on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--lime)}
.rt-key{display:flex;justify-content:space-between;gap:6px 14px;flex-wrap:wrap;padding:6px 16px 12px;font-size:12.5px;color:var(--slate)}
.rt-key span{display:flex;align-items:center;gap:7px}
.rt-key b{color:var(--ink);font-weight:600}
.rt-key-m{width:10px;height:10px;border-radius:3px;box-shadow:0 0 0 2px var(--lime)}
.rt-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.rt-stats div{padding:12px 16px;display:flex;flex-direction:column;gap:2px;min-width:0}
.rt-stats div + div{border-left:1px solid var(--rule)}
.rt-stats small{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--slate)}
.rt-stats b{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.rt-stats span{font-size:12.5px;color:var(--slate)}
@media(max-width:600px){
  .rt .app-sel{margin-left:auto}
  .rt-table th,.rt-table td{padding:9px 10px}
  .rt-table thead th:first-child{width:auto}
  .rt-table thead th:nth-child(3){width:64px}
  .rt-table thead th:last-child{width:58px}
  .rt-share,.rt-share-h{display:none}
  .rt-cohort{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;padding:12px}
  .rt-cell b{font-size:12px}
  .rt-stats{grid-template-columns:1fr 1fr}.rt-stats div:first-child{grid-column:1/-1}
  .rt-stats div + div{border-left:0;border-top:1px solid var(--rule)}.rt-stats div:last-child{border-left:1px solid var(--rule)}
}