/* A6: sistem durumu sayfası. Renkler cs2 :root token'larından; durum renkleri beyaz zeminde metin 4,5:1, grafik 3:1. */
.drm-sec { padding-top: 48px; }
.drm-wrap { max-width: 860px; }
.drm-h1 { font-size: clamp(30px, 4.4vw, 48px); margin-top: 10px; }
.drm-h2 { font-size: 22px; margin: 40px 0 14px; }
.drm-h3 { font-size: 17px; margin: 0; }
.drm-genel { display: flex; align-items: center; gap: 10px; margin-top: 18px; padding: 14px 18px; border-radius: var(--rs); font-weight: 600; font-size: 17px; }
.drm-nokta { width: 12px; height: 12px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.drm-not { font-size: 14px; color: var(--ink-soft); margin-top: 10px; }
.drm-calisiyor { background: var(--green-soft); color: var(--green-ink); }
.drm-sorunlu { background: #fdecec; color: var(--red-ink); }
.drm-olcum_yok { background: #eef0f4; color: #4b5263; }
.drm-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.drm-kart { background: var(--white); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 20px; }
.drm-kart-ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.drm-rozet { font-size: 13px; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.drm-acik { font-size: 14px; color: var(--body); margin: 8px 0 0; }
.drm-olcu { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px 16px; margin: 12px 0 0; }
.drm-olcu dt { font-size: 12px; color: var(--ink-soft); }
.drm-olcu dd { margin: 2px 0 0; font-size: 14px; color: var(--ink); font-variant-numeric: tabular-nums; }
.drm-ayrinti { font-size: 14px; color: var(--red-ink); margin: 10px 0 0; }
.drm-cubuk { display: flex; gap: 2px; margin-top: 14px; height: 28px; }
.drm-gun { flex: 1 1 0; min-width: 2px; border-radius: 2px; display: inline-block; }
.drm-cubuk .drm-gun { height: 100%; }
.drm-g-iyi { background: var(--green-d); }
.drm-g-sorunlu { background: var(--red-ink); }
.drm-g-yok { background: #7a8195; }
.drm-cubuk-alt { display: flex; justify-content: space-between; font-size: 12px; color: var(--ink-soft); margin: 4px 0 0; }
.drm-lejant { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--ink-soft); margin-top: 14px; }
.drm-lejant .drm-gun { width: 12px; height: 12px; vertical-align: -1px; }
.drm-bos { font-size: 15px; color: var(--body); }
.drm-olaylar, .drm-yontem { padding-left: 20px; font-size: 15px; color: var(--body); display: grid; gap: 8px; }
.drm-olay-not { display: block; font-size: 13px; color: var(--ink-soft); }