:root {
  --zemin: #fef7ff; --yuzey: #ffffff; --yazi: #1d1b20; --soluk: #49454f;
  --mor: #8b1afe; --mor-acik: #f0dbff; --cizgi: #e7e0ec; --dugme-yazi: #ffffff;
}
@media (prefers-color-scheme: dark) {
  :root { --zemin: #141218; --yuzey: #1d1b20; --yazi: #e6e0e9; --soluk: #cac4d0; --mor: #d6b6ff; --mor-acik: #3b1866; --cizgi: #49454f; --dugme-yazi: #2a0053; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--zemin); color: var(--yazi); font: 16px/1.65 "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: var(--mor); font-weight: 600; }
.ust { border-bottom: 1px solid var(--cizgi); background: var(--yuzey); }
.ust div { max-width: 960px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ust .marka { display: flex; align-items: center; gap: 10px; color: var(--yazi); text-decoration: none; font-weight: 700; margin-right: auto; }
.ust .marka img { width: 36px; height: 36px; border-radius: 10px; }
.ust nav a { font-size: 15px; margin-left: 14px; text-decoration: none; }
main { max-width: 960px; margin: 0 auto; padding: 32px 16px 48px; }
main.metin { max-width: 760px; }
h1 { font-size: 32px; line-height: 1.25; margin: 8px 0 8px; }
h2 { font-size: 22px; margin: 36px 0 8px; }
h3 { font-size: 18px; margin: 20px 0 6px; }
p.alt { color: var(--soluk); margin-top: 0; }
.kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 20px; padding: 20px 24px; margin: 16px 0; }
.dugme { display: inline-block; background: var(--mor); color: var(--dugme-yazi); text-decoration: none; padding: 13px 22px; border-radius: 14px; }
.izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.izgara .kart { margin: 0; }
.kafalar { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 12px; }
.kafalar figure { margin: 0; text-align: center; font-size: 13px; color: var(--soluk); }
.kafalar img { width: 64px; height: 64px; object-fit: contain; display: block; margin: 0 auto 4px; }
.vitrin { text-align: center; padding: 24px 0 8px; }
.vitrin img { width: 112px; height: 112px; border-radius: 28px; }
.vitrin p { color: var(--soluk); max-width: 560px; margin: 8px auto 20px; font-size: 18px; }
details { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 16px; padding: 14px 18px; margin: 10px 0; }
summary { font-weight: 700; cursor: pointer; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--cizgi); vertical-align: top; }
th { color: var(--soluk); font-weight: 600; font-size: 14px; }
ol, ul { padding-left: 22px; }
li { margin: 6px 0; }
.yol { display: inline-block; background: var(--mor-acik); border-radius: 10px; padding: 2px 10px; font-weight: 600; }
.reklam { margin: 28px 0; min-height: 0; }
.alt-bilgi { border-top: 1px solid var(--cizgi); color: var(--soluk); font-size: 14px; }
.alt-bilgi div { max-width: 960px; margin: 0 auto; padding: 20px 16px 32px; display: flex; gap: 8px 18px; flex-wrap: wrap; }
.alt-bilgi span { margin-right: auto; }
