/* Roma rakami: iki giris yan yana, ortada yon degistirme; altta dokum ve tablolar. */
.rom { display: grid; gap: 18px; }
.rom-cift { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 16px; align-items: end; }
.rom-cift.ters .rom-bolme[data-taraf=a] { order: 3; }
.rom-cift.ters .rom-takas { order: 2; }
.rom-cift.ters .rom-bolme[data-taraf=b] { order: 1; }
.arac-panel .rom-bolme input[type=text] { min-height: 58px; font-size: 24px; font-weight: 650; letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.arac-panel #rom-roma { font-family: Georgia, 'Times New Roman', serif; letter-spacing: 2px; }
.rom input[aria-invalid=true] { border-color: #f87171; }
.rom-roma-satir { display: flex; gap: 8px; }
.rom-roma-satir input { flex: 1; min-width: 0; }
.rom-roma-satir .arac-dugme { width: auto; min-height: 58px; }
.rom-takas {
  display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 7px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--bg); color: var(--text); font-size: 20px; line-height: 1;
}
.rom-takas:hover { border-color: var(--accent); color: var(--accent); }
.rom-dokum > strong { font-size: 20px; letter-spacing: 0; line-height: 1.4; }
.rom .arac-durum strong { font-family: Georgia, 'Times New Roman', serif; letter-spacing: 1px; }
.rom-tablolar { display: grid; gap: 20px; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: start; padding-top: 18px; border-top: 1px solid var(--line); }
.rom-tablolar .arac-panel-baslik { font-size: 17px; margin-bottom: 12px; }
.rom-semboller { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }
.rom-semboller li { display: grid; justify-items: center; gap: 2px; padding: 10px 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.rom-semboller strong { font-family: Georgia, 'Times New Roman', serif; font-size: 24px; }
.rom-semboller span { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.rom-tablo { font-size: 13.5px; }
.rom-tablo td, .rom-tablo th { padding: 7px 14px; }
.rom-tablolar .arac-tablo-kap { max-height: 360px; overflow: auto; }
@media (max-width: 720px) {
  .rom-cift { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .rom-takas { justify-self: center; transform: rotate(90deg); margin: 0; }
  .rom-tablolar { grid-template-columns: minmax(0, 1fr); }
}