/* Analytics page — funnel, horizontal bar lists, bar cells, donut, disclosures. */

.up{color:var(--green);font-weight:600}.down{color:var(--red);font-weight:600}

/* the funnel: centred, narrowing, one hue deepening with depth */
.funnel{display:grid;gap:2px;max-width:820px}
.fn-row{display:grid;grid-template-columns:minmax(120px,180px) 1fr 72px;align-items:center;gap:10px;min-height:32px}
.fn-l{font:600 13px var(--font-b);color:var(--ink);text-align:right}
.fn-bar svg{display:block;width:100%;height:26px}
.fn-bar rect{fill:var(--blue-deep)}
.fn-n{font:700 14px var(--font-h);color:var(--navy);white-space:nowrap}
.fn-rate{display:grid;grid-template-columns:minmax(120px,180px) 1fr 72px;gap:10px}
.fn-rate span{grid-column:2;text-align:center;font-size:11.5px;color:var(--slate);padding:2px 0}
.fn-rate strong{color:var(--ink)}
@media(max-width:700px){.fn-row,.fn-rate{grid-template-columns:1fr}.fn-l{text-align:left;font-size:12px}.fn-rate span{grid-column:1}.fn-n{text-align:right}}

/* horizontal bar list */
.hbars{display:grid;gap:6px}
.hb{display:grid;grid-template-columns:minmax(90px,150px) 1fr auto;align-items:center;gap:10px;min-height:22px;font-size:12.5px}
.hb-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;color:var(--ink)}
.hb-bar svg{display:block;width:100%;height:10px}
.hb-bar rect{fill:var(--blue-deep)}
.hb-v{white-space:nowrap;text-align:right}
.hb-v strong{color:var(--navy)}
@media(max-width:700px){.hb{grid-template-columns:minmax(80px,110px) 1fr auto;font-size:12px}}

/* bar cells inside tables */
.bars-tbl td.bc{position:relative;min-width:90px}
.bars-tbl td.bc .bcb{position:absolute;left:4px;top:5px;bottom:5px;background:var(--blue-100);border-radius:3px;z-index:0;max-width:calc(100% - 8px)}
.bars-tbl td.bc .bcv{position:relative;z-index:1}
.bars-tbl td.clip code{font-size:12px}

/* donut */
.donut-wrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.donut{width:132px;height:132px;flex:none}
.donut circle.d0{stroke:var(--blue-deep)}.donut circle.d1{stroke:var(--amber)}.donut circle.d2{stroke:var(--purple)}.donut circle.d3{stroke:var(--green)}
.donut .dn{font:700 18px var(--font-h);fill:var(--navy);text-anchor:middle}
.donut .dl{font:600 9px var(--font-h);fill:var(--slate);text-anchor:middle;text-transform:capitalize}
.dlg{list-style:none;display:grid;gap:5px;font-size:12.5px;min-width:150px}
.dlg li{display:flex;align-items:center;gap:8px}
.dlg i{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}
.dlg i.d0{background:var(--blue-deep)}.dlg i.d1{background:var(--amber)}.dlg i.d2{background:var(--purple)}.dlg i.d3{background:var(--green)}
.dlg .dl-l{text-transform:capitalize;flex:1;font-weight:600}

/* disclosures: inside a card, and as a card */
.an-disc{margin-top:12px;border-top:1px solid var(--mist);padding-top:8px}
.an-disc>summary{cursor:pointer;font:600 12.5px var(--font-h);color:var(--blue-deep);min-height:32px;display:flex;align-items:center;gap:8px;list-style:none}
.an-disc>summary::-webkit-details-marker{display:none}
.an-disc>summary::before{content:'›';font-weight:700;transition:transform .15s}
.an-disc[open]>summary::before{transform:rotate(90deg)}
.an-disc>summary .muted{font:400 12px var(--font-b)}
.an-disc[open]>summary{margin-bottom:8px}
details.an-disc-card>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-16px -18px;padding:14px 18px;border-radius:var(--r);min-height:44px}
details.an-disc-card>summary::-webkit-details-marker{display:none}
details.an-disc-card>summary::before{content:'›';font:700 16px var(--font-h);color:var(--blue-deep);width:12px;transition:transform .15s}
details.an-disc-card[open]>summary::before{transform:rotate(90deg)}
details.an-disc-card[open]>summary{border-bottom:1px solid var(--mist);border-radius:var(--r) var(--r) 0 0}
details.an-disc-card>summary:hover{background:var(--cloud)}
details.an-disc-card .disc-t{font:700 14px var(--font-h);color:var(--ink)}
details.an-disc-card .disc-body{padding-top:14px}
@media(max-width:700px){details.an-disc-card>summary{margin:-14px -14px;padding:12px 14px}}