.osb [hidden] { display: none !important; }
.osb-ayarlar { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px 28px; margin-bottom: 8px; }
.osb-grup { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.osb-grup > legend, .osb-ayarlar .fmt-field-label { display: block; margin: 0 0 8px; padding: 0; line-height: 1.4; }
.osb-sec { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 8px); cursor: pointer; }
.osb-sec:has(input:checked) { border-color: var(--fmt-accent); background: var(--fmt-accent-soft); font-weight: 600; }
.osb-sec:has(input:focus-visible) { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.osb-hedef-ayar { display: flex; flex-wrap: wrap; gap: 14px 24px; flex-basis: 100%; }
.osb-hedef-ayar .fmt-field { display: flex; flex-direction: column; margin: 0; }
.osb:not([data-kip="hedef"]):not([data-kip="merdiven"]) .osb-hedef-ayar, .osb:not([data-kip="merdiven"]) .osb-esik, .osb[data-kip="merdiven"] .osb-sure { display: none; }
.osb-sayi { box-sizing: border-box; width: 6.5em; min-height: 44px; padding: 0 10px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 8px); background: var(--fmt-surface); color: inherit; font: inherit; font-variant-numeric: tabular-nums; }
.osb-sayi:focus-visible, .osb input[type="range"]:focus-visible { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.osb-gecikme { flex: 1 1 260px; max-width: 420px; }
.osb-gecikme input[type="range"] { width: 100%; min-height: 44px; accent-color: var(--fmt-accent); }
.osb-gecikme .fmt-hint { margin: 0; }
.osb-gecikme output { font-variant-numeric: tabular-nums; }
.osb-tus-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.osb-tus-ad { min-width: 5em; font-weight: 700; }
.osb-tus-satir .fmt-btn { min-height: 44px; }
.osb-mesaj { min-height: 1.5em; margin: 6px 0; color: var(--fmt-warn); font-weight: 600; }
.osb-alan { padding: 16px; border: 2px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); background: var(--fmt-surface); }
.osb[data-asama="test"] .osb-alan, .osb[data-asama="geri"] .osb-alan { border-color: var(--fmt-accent); }
.osb-canli { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 20px; }
.osb-canli-bpm { font-size: 3rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.osb-canli-bpm small { font-size: 1rem; font-weight: 600; color: var(--fmt-muted); }
.osb-canli-yan { display: grid; gap: 2px; min-width: 11em; color: var(--fmt-muted); font-variant-numeric: tabular-nums; }
.osb-canli-yan > span { min-height: 1.4em; white-space: nowrap; }
.osb-canli-grafik { display: block; width: 100%; height: 140px; margin-top: 12px; }
.osb-durum { display: flex; align-items: center; justify-content: center; min-height: 3.2em; margin: 6px 0; font-size: 1.1rem; font-weight: 700; text-align: center; }
.osb-pedler { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.osb[data-kip="tek"] .osb-pedler { grid-template-columns: 1fr; }
.osb-ped { min-height: 120px; border: 2px solid currentColor; border-radius: var(--fmt-radius); background: var(--fmt-accent-soft); color: inherit; font: inherit; font-size: 1.6rem; font-weight: 800; cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
.osb-ped:focus-visible { outline: 2px solid var(--fmt-accent); outline-offset: 2px; }
.osb-ped.osb-basili { border-color: var(--fmt-accent); background: var(--fmt-accent); color: var(--body-bg-color); }
.osb-eylem { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.osb-eylem .fmt-btn { min-height: 44px; }
.osb-sonuc { margin-top: 16px; }
.osb-sonuc-ic { padding: 16px; border: 1px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); background: var(--fmt-surface); }
.osb-uyari { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--fmt-danger); border-radius: var(--arac-r-kucuk, 8px); background: var(--fmt-danger-bg); color: var(--fmt-danger); font-weight: 700; }
.osb-merdiven-sonuc { margin: 0 0 12px; font-size: 1.1rem; font-weight: 700; }
.osb-ozet { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.osb-ozet > div { display: flex; flex-direction: column; }
.osb-buyuk { font-size: 3.2rem; font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; }
.osb-alt { color: var(--fmt-muted); }
.osb-sayac { margin: 6px 0 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.osb-olcu { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0; }
.osb-olcu dt { color: var(--fmt-muted); font-size: .9rem; }
.osb-olcu dd { margin: 0; font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.osb:not([data-sonuc-kip="akis"]) .osb-sadece-akis, .osb:not([data-sonuc-kip="hedef"]) .osb-sadece-hedef { display: none; }
.osb-yargi { margin-top: 16px; }
.osb-yargi-say { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0 0 10px; padding: 0; list-style: none; font-variant-numeric: tabular-nums; }
.osb-yargi-say b { font-size: 1.3rem; }
.osb-y300 b { color: var(--fmt-info); }
.osb-y100 b { color: var(--fmt-ok); }
.osb-y50 b { color: var(--fmt-warn); }
.osb-yiska b { color: var(--fmt-danger); }
.osb-cubuk { position: relative; height: 28px; border: 1px solid var(--fmt-border-strong); border-radius: 4px; background: var(--fmt-danger-bg); overflow: hidden; }
.osb-cubuk-p50, .osb-cubuk-p100, .osb-cubuk-p300 { position: absolute; top: 0; bottom: 0; }
.osb-cubuk-p50 { background: color-mix(in srgb, var(--fmt-warn) 30%, transparent); }
.osb-cubuk-p100 { background: color-mix(in srgb, var(--fmt-ok) 35%, transparent); }
.osb-cubuk-p300 { background: color-mix(in srgb, var(--fmt-info) 40%, transparent); }
.osb-cubuk-orta { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; margin-left: -1px; background: currentColor; }
.osb-cubuk-izler span { position: absolute; top: 4px; bottom: 4px; width: 2px; margin-left: -1px; background: currentColor; opacity: .55; }
.osb-cubuk-etiket { display: flex; justify-content: space-between; margin-top: 4px; color: var(--fmt-muted); font-size: .85rem; }
.osb-grafik { display: block; width: 100%; height: 200px; margin-top: 16px; }
.osb-kisa { margin: 10px 0 0; }
.osb-sonuc-eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.osb-sonuc-eylem .fmt-btn { min-height: 44px; }
.osb-paylas { color: var(--fmt-muted); }
.osb-yedek { box-sizing: border-box; width: 100%; min-height: 44px; margin-top: 8px; padding: 0 8px; border: 1px solid var(--fmt-border-strong); border-radius: var(--arac-r-kucuk, 6px); background: var(--fmt-surface); color: inherit; font: inherit; }
.osb-tablo-kap { margin-top: 20px; }
.osb-tablo { width: 100%; border-collapse: collapse; font-size: .92rem; }
.osb-tablo caption { margin-bottom: 6px; font-weight: 700; text-align: left; }
.osb-tablo th, .osb-tablo td { padding: 6px 8px; border-top: 1px solid var(--fmt-border); text-align: left; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.osb-tablo thead th { color: var(--fmt-muted); font-weight: 600; }
.osb-d-rahat { color: color-mix(in srgb, var(--fmt-ok) 65%, currentColor); font-weight: 700; }
.osb-d-sinirda { color: color-mix(in srgb, var(--fmt-warn) 65%, currentColor); font-weight: 700; }
.osb-d-henuz { color: var(--fmt-muted); }
.osb-haritalar { margin-top: 20px; }
.osb-baslik { margin: 0 0 6px; font-size: 1.1rem; }
.osb-harita-liste { display: grid; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.osb-harita-liste li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 6px 10px; border: 1px solid var(--fmt-border); border-radius: var(--arac-r-kucuk, 8px); }
.osb-harita-liste li.osb-onerilen { border: 2px solid currentColor; }
.osb-harita-liste a { color: var(--baglanti, inherit); }
.osb-harita-bpm { color: var(--fmt-muted); font-variant-numeric: tabular-nums; }
.osb-dene { font-weight: 700; }
.osb-gecmis { margin-top: 20px; }
.osb-gecmis .fmt-btn { min-height: 44px; margin-top: 10px; }
.osb-rekor, .osb-oynaklik { margin: 0 0 8px; font-weight: 700; }
.osb-yontem { margin: 20px 0; padding: 12px 16px; border: 1px solid var(--fmt-border-strong); border-radius: var(--fmt-radius); }
.osb-yontem h2 { margin-top: 0; }
.osb-bagimsiz { margin-top: 20px; color: var(--fmt-muted); font-size: .9rem; }
@media (max-width: 560px) {
    .osb-ayarlar { gap: 10px 16px; }
    .osb-sec { min-height: 44px; padding: 0 10px; gap: 6px; }
    .osb-ped { min-height: 150px; }
    .osb-canli-bpm { font-size: 2.4rem; }
    .osb-buyuk { font-size: 2.5rem; }
    .osb-tablo { font-size: .8rem; }
    .osb-tablo th, .osb-tablo td { padding: 6px 4px; }
}
@media (prefers-reduced-motion: no-preference) {
    .osb-ped { transition: background-color .06s, border-color .06s; }
}
@media (forced-colors: active) {
    .osb-sec:has(input:checked), .osb-harita-liste li.osb-onerilen { outline: 2px solid CanvasText; }
    .osb-ped.osb-basili { outline: 3px solid Highlight; }
}
