/* releases: view-specific styles (keep small; prefer panel.css components). The CI feed (Dağıtımlar) rows and their menu are here. */
.rel-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:14px 24px;flex-wrap:wrap}
.rel-ver{font-family:var(--mono);font-size:26px;font-weight:600;letter-spacing:-.01em;line-height:1.15;font-variant-numeric:tabular-nums}
.rel-ver.sm{font-size:15px}
.rel-adopt{flex:1 1 220px;max-width:320px;display:flex;flex-direction:column;gap:6px}
.rel-adopt-h{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--muted)}
.rel-adopt-h b{font-size:18px;color:var(--text);font-variant-numeric:tabular-nums}
.rel-adopt-s{display:flex;flex-direction:column;gap:5px;max-width:260px;font-size:12.5px;color:var(--muted)}
.rel-sha{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0}
.rel-sha code{font-family:var(--mono);font-size:12px;padding:2px 6px;border-radius:6px;background:var(--panel3);word-break:break-all}
.rel-copy{border:0;background:none;color:var(--muted);cursor:pointer;padding:3px;display:grid;border-radius:6px;flex:none}
.rel-copy span:where(.ic){width:14px;height:14px}
@media (hover:hover){.rel-copy:hover{color:var(--text);background:var(--panel2)}}
.rel-staged{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap}
.rel-staged-t{min-width:0;flex:1 1 260px;display:flex;flex-direction:column;gap:3px}
.rel-staged-n{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
.rel-small{font-size:12px}
.rel-card-note{margin:0;padding:10px 16px;border-top:1px solid var(--line);font-size:12px}
/* callouts: a neutral bordered box, no coloured background; the icon carries the tone, the border turns red only on a
   real error (no_live) */
.rel-callout{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;border:1px solid var(--line2);background:transparent;color:var(--muted);font-size:13px;line-height:1.5}
.rel-callout span:where(.ic){width:17px;height:17px;flex:none;color:var(--muted);margin-top:1px}
.rel-callout p{margin:0}
.rel-warn{margin:0;font-size:12.5px;color:var(--warn)}
.rel-impact{margin:0;font-size:12.5px}
.rel-sub-h{font-size:12px;color:var(--muted);font-weight:600;margin:0 0 8px}
.rel-notes{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.55;padding:12px 14px;border-radius:10px;background:var(--panel2);border:1px solid var(--line)}
.rel-ta{min-height:260px;font-size:13px}
.rel-count{text-align:right}
.rel-count.warn{color:var(--warn)}
.rel-callout.warn{color:var(--text)} .rel-callout.warn span:where(.ic){color:var(--warn)}
.rel-callout.bad{border-color:color-mix(in srgb,var(--bad) 40%,transparent);color:var(--text)} .rel-callout.bad span:where(.ic){color:var(--bad)}
.rel-warnings{gap:8px}
.rel-link{color:inherit;text-decoration:underline;text-underline-offset:2px}
.rel-fleet-x{display:flex;flex-direction:column;gap:3px;font-size:12.5px}
/* CI feed (Dağıtımlar): no coloured backgrounds (the status dot is the only coloured piece) */
.rel-jobs{display:flex;flex-direction:column;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line)}
.rel-job{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.rel-job-t{font-weight:600;min-width:0;overflow-wrap:anywhere}
.rel-filters{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line)}
.rel-deps{display:flex;flex-direction:column}
.rel-deps > .empty{padding:28px 16px}
/* a run = one line per cell (live 1, the owner 2026-10-26: a commit title wrapped to ~10 lines): the title column takes
   what the fixed ones leave (the feed spans the page), cut with "…" (whole in its title and in the run's side panel);
   the row opens that side panel */
.rel-dep{display:grid;grid-template-columns:minmax(0,1fr) 128px 104px minmax(0,.5fr) 84px 30px;align-items:center;gap:10px;padding:5px 16px;border-bottom:1px solid var(--line);cursor:pointer}
.rel-dep:last-child{border-bottom:0}
@media (hover:hover){.rel-dep:hover{background:var(--panel2)}}
.rel-dep-t{min-width:0;display:flex;flex-direction:column;gap:1px}
.rel-dep-t .rel-run-n{display:block;min-width:0;font-weight:600;line-height:18px;color:var(--text);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (hover:hover){.rel-dep-t .rel-run-n:hover{text-decoration:underline;text-underline-offset:2px}}
.rel-dep-t small{font-size:12px;line-height:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rel-st{display:flex;align-items:center;gap:7px;font-size:13px;white-space:nowrap}
.rel-dot{width:9px;height:9px;border-radius:50%;flex:none;background:var(--line2)}
.rel-dot.ready{background:var(--ok)} .rel-dot.error{background:var(--bad)} .rel-dot.canceled{background:var(--faint)}
.rel-dot.building{background:var(--warn);animation:rel-pulse 1.2s infinite}
.rel-dot.queued{background:transparent;border:2px solid var(--muted)}
@keyframes rel-pulse{50%{opacity:.35}}
.rel-late{display:inline-grid;color:var(--warn)} .rel-late span:where(.ic){width:14px;height:14px}
.rel-env{display:inline-flex;align-items:center;font-size:12.5px;white-space:nowrap;color:var(--muted)}
.rel-env.live{color:var(--text);font-weight:600} .rel-env.dry{color:var(--faint)}
.rel-src{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.rel-when{font-size:12px;line-height:18px;text-align:right;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
/* a run's side panel: the whole title and source wrap there */
.rel-whole{white-space:pre-wrap;overflow-wrap:anywhere}
.rel-run-st{gap:6px} .rel-run-st .rel-warn{margin:0}
.rel-more-w{position:relative;display:flex;justify-content:flex-end}
.rel-more{border:0;background:none;width:30px;height:30px;border-radius:7px;display:grid;place-items:center;color:var(--muted);cursor:pointer}
.rel-more span:where(.ic){width:16px;height:16px}
@media (hover:hover){.rel-more:hover{background:var(--panel3);color:var(--text)}}
.rel-menu{position:absolute;right:0;top:34px;z-index:30;min-width:250px;max-width:min(340px,86vw);background:var(--panel);border:1px solid var(--line2);border-radius:10px;box-shadow:var(--shadow);padding:6px}
.rel-menu hr{border:0;border-top:1px solid var(--line);margin:5px 0}
.rel-mi{display:flex;width:100%;align-items:center;gap:9px;padding:8px 10px;border:0;border-radius:7px;background:none;text-align:left;cursor:pointer;font-size:13px;color:var(--text)}
.rel-mi span:where(.ic){width:15px;height:15px;flex:none;color:var(--muted)}
.rel-mi span:where(:not(.ic)){min-width:0;overflow-wrap:anywhere}
.rel-mi:disabled{cursor:not-allowed;color:var(--faint)}
@media (hover:hover){.rel-mi:not(:disabled):hover{background:var(--panel2)}}
.rel-mi.acc{color:var(--accent-text);font-weight:600} .rel-mi.acc span:where(.ic){color:var(--accent-text)}
.rel-mi.bad{color:var(--bad)} .rel-mi.bad span:where(.ic){color:var(--bad)}
.rel-unv{padding:8px 10px;border-radius:8px;background:var(--warn-bg)}
@media (max-width:900px){
  .rel-dep{grid-template-columns:minmax(0,1fr) auto 34px;gap:6px 10px}
  .rel-dep-t{grid-column:1/2;grid-row:1}
  .rel-dep .rel-st{grid-column:2/3;grid-row:1}
  .rel-more-w{grid-column:3/4;grid-row:1}
  .rel-env-c{grid-column:1/-1;grid-row:2}
  .rel-src{grid-column:1/-1;grid-row:3}
  .rel-when{display:none}
}
/* the history list (v3 one-line list, decision C: compact for every role, the owner too): one line per cell, the version
   link with its source under it, every row at most 44 px. Column order = the history columns in releases.js: 1 Sürüm,
   2 Durum, 3 Yayınlandı, 4 İndirme, 5 Benimsenme, 6 ⋯ (the row's menu) */
.rel-list .tbl td{padding:5px 16px;line-height:18px;white-space:nowrap}
.rel-list .tbl td a.n{color:var(--text);font-family:var(--mono);font-weight:600;text-decoration:none}
@media (hover:hover){.rel-list .tbl td a.n:hover{color:var(--text);text-decoration:underline;text-underline-offset:2px}}
.rel-list .tbl td .sub{margin-top:0;font-size:12px;line-height:14px;white-space:nowrap}
.rel-list .tbl td .st{line-height:18px}
.rel-list .tbl th.rel-act,.rel-list .tbl td.rel-act{width:1%;text-align:right;padding-right:10px}
@media (max-width:560px){.rel-list .tbl th,.rel-list .tbl td{padding-left:10px;padding-right:10px}}