/* Owners' section «Studby» (studby-analytics.js). Same materials as «Вузы» (timetable-universities.css): white cards,
   hairline borders, iOS blue; dark theme in the iOS / Telegram «Ночь» palette. One accent series per chart. */
.sa-page{--sa-card:#fff;--sa-fg:#172331;--sa-muted:#64748b;--sa-line:#e7edf3;--sa-grid:#eef2f6;--sa-accent:#007aff;--sa-accent-soft:#e7f1ff;--sa-soft:#f2f6fb;--sa-f:#ff2d55;--sa-up:#17774b;--sa-down:#bb352e;display:grid;gap:18px;color:var(--sa-fg);min-width:0;font-size:14px}
.sa-page *{box-sizing:border-box}
.sa-page h1{margin:0;font-size:30px;letter-spacing:-.7px}
.sa-page h2{margin:0;font-size:18px;letter-spacing:-.2px}
.sa-page h3{margin:18px 0 10px;font-size:14px;color:var(--sa-muted);font-weight:600}
.sa-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sa-head p{margin:6px 0 0;color:var(--sa-muted)}
.sa-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sa-segment{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:var(--sa-soft);border:1px solid var(--sa-line)}
.sa-segment button{border:0;border-radius:9px;padding:7px 12px;min-height:34px;background:transparent;color:var(--sa-fg);font:inherit;font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap}
.sa-segment button[aria-pressed=true]{background:var(--sa-card);box-shadow:0 1px 3px rgb(15 23 42 / 12%);font-weight:600}
.sa-button{border:1px solid var(--sa-line);border-radius:12px;padding:8px 14px;min-height:40px;background:var(--sa-card);color:var(--sa-accent);font:inherit;font-weight:600;cursor:pointer}
.sa-button:disabled{opacity:.5;cursor:default}
.sa-page button:focus-visible{outline:3px solid var(--sa-accent);outline-offset:2px}
.sa-notice{padding:14px 16px;border-radius:16px;background:#fff4dd;color:#7a5010;line-height:1.5}
.sa-notice.is-error{background:#fff0ef;color:var(--sa-down)}
.sa-notice .sa-button{margin-left:10px;min-height:34px}
.sa-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sa-tile,.sa-panel{background:var(--sa-card);border:1px solid var(--sa-line);border-radius:22px;padding:20px;min-width:0}
.sa-tile{display:grid;gap:6px;align-content:start}
.sa-tile>span{color:var(--sa-muted)}
.sa-tile strong{font-size:32px;line-height:1.15;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.sa-tile small,.sa-caption{color:var(--sa-muted);font-size:13px;line-height:1.45}
.sa-caption{margin:6px 0 14px}
.sa-delta{font-weight:600}
.sa-delta.is-up{color:var(--sa-up)}
.sa-delta.is-down{color:var(--sa-down)}
.sa-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.sa-section-head p{margin:4px 0 0;color:var(--sa-muted);font-size:13px}
/* Bar chart: recessive grid and axis, thin rounded bars anchored to the baseline. */
.sa-chart{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;height:220px}
.sa-axis{display:flex;flex-direction:column;justify-content:space-between;padding-bottom:22px;color:var(--sa-muted);font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
.sa-axis span{transform:translateY(-50%)}.sa-axis span:last-child{transform:translateY(50%)}
.sa-plot{position:relative;display:grid;grid-template-rows:minmax(0,1fr) 22px;min-width:0}
.sa-grid{position:absolute;inset:0 0 22px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}
.sa-grid i{border-top:1px solid var(--sa-grid)}
.sa-bars{position:relative;display:grid;grid-template-columns:repeat(var(--sa-count),minmax(0,1fr));gap:2px;align-items:end;min-width:0}
.sa-bar{position:relative;height:100%;padding:0;border:0;background:transparent;cursor:default;display:flex;align-items:flex-end;justify-content:center}
.sa-bar i{display:block;width:min(100%,22px);height:var(--sa-h);min-height:2px;border-radius:4px 4px 0 0;background:var(--sa-accent)}
.sa-bar:hover i,.sa-bar:focus-visible i{filter:brightness(.88)}
.sa-bar.is-zero i{min-height:0}
.sa-dates{display:grid;grid-template-columns:repeat(var(--sa-count),minmax(0,1fr));align-items:end;color:var(--sa-muted);font-size:12px}
.sa-dates span{white-space:nowrap;justify-self:center;overflow:visible}
.sa-dates span:first-child{justify-self:start}.sa-dates span:last-child{justify-self:end}
.sa-tip{position:fixed;z-index:1000;padding:6px 10px;border-radius:10px;background:#172331;color:#fff;font-size:13px;font-weight:600;pointer-events:none;box-shadow:0 4px 14px rgb(15 23 42 / 20%);white-space:nowrap}
.sa-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.sa-chips span{padding:7px 11px;border-radius:10px;background:var(--sa-soft);color:var(--sa-muted);font-size:13px}
.sa-chips b{color:var(--sa-fg);margin-left:4px;font-variant-numeric:tabular-nums}
/* Two columns of panels; the last card of each column grows so both columns share one bottom edge. */
.sa-masonry{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}
.sa-column{display:flex;flex-direction:column;gap:14px;min-width:0}
.sa-column>.sa-panel:last-child{flex:1;display:flex;flex-direction:column}
/* A stretched card fills itself: coin tiles grow, funnel and list rows spread out; nothing floats above a blank bottom. */
.sa-column>.sa-panel:last-child>:is(.sa-mini,.sa-funnel,.sa-list){flex:1}
.sa-column>.sa-panel:last-child>.sa-mini{grid-auto-rows:1fr}
.sa-column>.sa-panel:last-child>:is(.sa-funnel,.sa-list){align-content:space-between}
/* Horizontal bars for the funnel and the lists: label and value above a thin track. */
.sa-funnel,.sa-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:12px}
.sa-funnel li,.sa-list li{display:grid;gap:6px;min-width:0}
.sa-funnel li>div,.sa-list li>div{display:flex;align-items:baseline;gap:10px;min-width:0}
.sa-funnel span,.sa-list span{flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.35}
.sa-funnel b,.sa-list b{font-variant-numeric:tabular-nums}
.sa-funnel small{width:58px;text-align:right;color:var(--sa-muted);font-variant-numeric:tabular-nums}
.sa-list li>small{color:var(--sa-muted);font-size:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sa-funnel i,.sa-list i{display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--sa-accent) var(--sa-w),var(--sa-soft) var(--sa-w))}
.sa-badge{font-style:normal;padding:2px 7px;border-radius:7px;background:#fff4dd;color:#946112;font-size:11px;font-weight:600}
/* Retention: one hue, stronger with the value; «…» for cohorts that have not reached the day yet. */
.sa-cohorts{width:100%;border-collapse:separate;border-spacing:3px;margin-top:10px;font-variant-numeric:tabular-nums}
.sa-cohorts th{font-weight:500;color:var(--sa-muted);font-size:12px;text-align:left;padding:4px 6px}
.sa-cohorts thead th:not(:first-child){text-align:center}
.sa-cohorts tbody th{color:var(--sa-fg);font-size:13px;white-space:nowrap}
.sa-cohorts td{text-align:center;padding:8px 4px;border-radius:8px;font-size:13px;font-weight:600;background:rgb(0 122 255 / var(--sa-a,0));color:var(--sa-fg)}
.sa-cohorts td:nth-child(2){background:none;font-weight:500;color:var(--sa-muted)}
.sa-cohorts td.is-wait{background:var(--sa-soft);color:var(--sa-muted);font-weight:400}
.sa-gender{display:flex;height:12px;border-radius:6px;overflow:hidden;gap:2px;margin-top:12px;background:var(--sa-soft)}
.sa-gender i{width:var(--sa-w)}
.sa-gender .is-m,.sa-legend .is-m{background:var(--sa-accent)}
.sa-gender .is-f,.sa-legend .is-f{background:var(--sa-f)}
.sa-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;color:var(--sa-muted);font-size:13px}
.sa-legend span{display:inline-flex;align-items:center;gap:6px}
.sa-legend i{width:10px;height:10px;border-radius:3px}
.sa-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.sa-mini div{display:grid;gap:4px;align-content:space-between;padding:12px;border-radius:14px;background:var(--sa-soft)}
.sa-mini span{color:var(--sa-muted);font-size:12px}
.sa-mini b{font-size:18px;font-variant-numeric:tabular-nums}
.sa-empty{color:var(--sa-muted);text-align:center;padding:24px 10px;margin:0}
html[data-theme=dark] .sa-page{--sa-card:#1c1c1e;--sa-fg:#f5f5f7;--sa-muted:#98989e;--sa-line:#38383a;--sa-grid:#2c2c2e;--sa-accent:#0a84ff;--sa-accent-soft:#0a84ff26;--sa-soft:#2c2c2e;--sa-f:#ff375f;--sa-up:#30d158;--sa-down:#ff6961}
html[data-theme=dark] .sa-segment button[aria-pressed=true]{background:#3a3a3c;box-shadow:none}
html[data-theme=dark] .sa-notice{background:#ff9f0a1a;color:#ffb340}
html[data-theme=dark] .sa-notice.is-error{background:#ff453a1a;color:#ff6961}
html[data-theme=dark] .sa-badge{background:#ff9f0a1a;color:#ff9f0a}
html[data-theme=dark] .sa-cohorts td{background:rgb(10 132 255 / var(--sa-a,0))}
html[data-theme=dark] .sa-cohorts td:nth-child(2){background:none}
html[data-theme=dark] .sa-cohorts td.is-wait{background:#2c2c2e}
html[data-theme=dark] .sa-tip{background:#f5f5f7;color:#1c1c1e}
@media(max-width:1100px){.sa-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.sa-masonry{grid-template-columns:1fr}.sa-column>.sa-panel:last-child{flex:none}.sa-column>.sa-panel:last-child>*{flex:none}}
@media(max-width:560px){.sa-page{gap:14px}.sa-page h1{font-size:26px}.sa-tile,.sa-panel{padding:16px;border-radius:18px}.sa-tiles{gap:10px}.sa-tile strong{font-size:26px}.sa-actions{width:100%}.sa-segment{width:100%;overflow-x:auto}.sa-segment button{flex:1;padding:7px 8px}.sa-chart{height:180px}.sa-mini{grid-template-columns:1fr 1fr}}
/* The CRM's global table look (capitals, borders, zebra) does not apply to the retention grid. */
.sa-page .sa-cohorts th,.sa-page .sa-cohorts td{border:0;box-shadow:none;text-transform:none;letter-spacing:0;height:auto;vertical-align:middle}
.sa-page .sa-cohorts thead th,.sa-page .sa-cohorts tbody th{background:none}
.sa-page .sa-cohorts tbody tr,.sa-page .sa-cohorts tbody tr:hover{background:none}