/* Kurallı Okey — yasal metin sayfaları (oyunun yeşil-altın temasıyla, okunaklı açık zemin) */
:root {
  --yesil: #0E3B2C;
  --yesil-koyu: #082A1F;
  --altin: #E2B04A;
  --altin-acik: #F3D27A;
  --krem: #FBF6EA;
  --kagit: #FFFDF8;
  --yazi: #2A2118;
  --soluk: #6B5E4E;
  --cizgi: #E6DAC2;
  --uyari: #FFF3D6;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--krem);
  color: var(--yazi);
  font: 17px/1.65 -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
header {
  background: linear-gradient(180deg, var(--yesil) 0%, var(--yesil-koyu) 100%);
  border-bottom: 3px solid var(--altin);
  padding: 28px 16px 22px;
  text-align: center;
}
header .marka { color: var(--altin-acik); font: 700 13px/1 -apple-system, "Segoe UI", Roboto, Arial, sans-serif; letter-spacing: .28em; text-transform: uppercase; text-decoration: none; }
header h1 { margin: 10px 0 6px; color: #fff; font: 700 30px/1.2 Georgia, "Times New Roman", serif; }
header .tarih { color: rgba(255,255,255,.72); font-size: 14px; }
nav { background: var(--yesil-koyu); text-align: center; padding: 8px 12px; font-size: 14px; }
nav a { color: var(--altin-acik); text-decoration: none; margin: 0 8px; white-space: nowrap; display: inline-block; padding: 4px 0; }
nav a[aria-current="page"] { color: #fff; border-bottom: 2px solid var(--altin); }
main {
  max-width: 820px;
  margin: 24px auto 48px;
  background: var(--kagit);
  border: 1px solid var(--cizgi);
  border-radius: 14px;
  padding: 28px 32px;
}
h2 { font: 700 21px/1.35 Georgia, "Times New Roman", serif; color: var(--yesil); margin: 30px 0 8px; padding-top: 6px; border-top: 1px solid var(--cizgi); }
h2:first-of-type { border-top: 0; margin-top: 4px; }
h3 { font-size: 17px; margin: 18px 0 4px; color: var(--yesil); }
p, li { margin: 6px 0; }
ul, ol { padding-left: 22px; }
a { color: #1F6B4D; }
table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 15px; }
th, td { text-align: left; vertical-align: top; border: 1px solid var(--cizgi); padding: 8px 10px; }
th { background: #F4EBD6; color: var(--yesil); }
.not { background: var(--uyari); border: 1px solid #EBCB7E; border-radius: 10px; padding: 12px 16px; margin: 14px 0; }
.yer { background: #FFE1A6; padding: 0 4px; border-radius: 4px; }
.adim { counter-reset: adim; list-style: none; padding-left: 0; }
.adim li { counter-increment: adim; position: relative; padding-left: 40px; margin: 10px 0; }
.adim li::before { content: counter(adim); position: absolute; left: 0; top: 1px; width: 28px; height: 28px; border-radius: 50%; background: var(--yesil); color: var(--altin-acik); font-weight: 700; text-align: center; line-height: 28px; font-size: 15px; }
.kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-top: 10px; }
.kart { display: block; text-decoration: none; color: var(--yazi); background: #fff; border: 1px solid var(--cizgi); border-left: 4px solid var(--altin); border-radius: 10px; padding: 14px 16px; }
.kart strong { display: block; color: var(--yesil); font-size: 17px; margin-bottom: 2px; }
.kart span { color: var(--soluk); font-size: 14px; }
footer { text-align: center; color: var(--soluk); font-size: 14px; padding: 0 16px 36px; }
@media (max-width: 600px) {
  body { font-size: 16px; }
  header h1 { font-size: 24px; }
  main { margin: 12px 10px 32px; padding: 20px 16px; border-radius: 10px; }
  table, thead, tbody, tr, th, td { font-size: 14px; }
}
