:root {
  --zemin: #f6f7f9; --kart: #fff; --yazi: #1d2330; --soluk: #667085; --cizgi: #e4e7ec;
  --ana: #2f5bea; --ana-koyu: #1f45c4; --basari: #127a4a; --basari-zemin: #e7f6ee;
  --hata: #b42318; --hata-zemin: #fdecea; --uyari-zemin: #fff6e0; --radius: 10px;
}
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
       background: var(--zemin); color: var(--yazi); }
a { color: var(--ana); }
h1 { font-size: 1.6rem; margin: 0 0 1rem; } h2 { font-size: 1.2rem; margin: 1.5rem 0 .75rem; }
.ust { background: var(--kart); border-bottom: 1px solid var(--cizgi); }
.ust .ic { max-width: 1100px; margin: 0 auto; padding: .8rem 16px; display: flex;
           align-items: center; gap: 1rem; flex-wrap: wrap; }
.logo { font-weight: 700; font-size: 1.15rem; text-decoration: none; color: var(--yazi); }
.logo small { font-weight: 400; color: var(--soluk); font-size: .75rem; margin-left: .35rem; }
.ust nav { margin-left: auto; display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.sayfa { max-width: 1100px; margin: 0 auto; padding: 1.5rem 16px 3rem; }
.dar { max-width: 460px; }
.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--radius);
        padding: 1.25rem; margin-bottom: 1rem; }
label { display: block; font-weight: 600; margin: .8rem 0 .3rem; font-size: .92rem; }
input[type=text], input[type=email], input[type=password], select, textarea {
  width: 100%; padding: .6rem .7rem; border: 1px solid var(--cizgi); border-radius: 8px;
  font: inherit; background: #fff; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--ana); outline-offset: -1px; }
.ipucu { color: var(--soluk); font-size: .85rem; margin-top: .25rem; }
.dugme { display: inline-block; background: var(--ana); color: #fff; border: 0; border-radius: 8px;
         padding: .6rem 1rem; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
.dugme:hover { background: var(--ana-koyu); }
.dugme.ikincil { background: #fff; color: var(--yazi); border: 1px solid var(--cizgi); }
.dugme.tehlike { background: #fff; color: var(--hata); border: 1px solid var(--hata); }
.dugme.kucuk { padding: .3rem .6rem; font-size: .85rem; }
.bildirim { padding: .7rem .9rem; border-radius: 8px; margin-bottom: 1rem; }
.bildirim.basari { background: var(--basari-zemin); color: var(--basari); }
.bildirim.hata { background: var(--hata-zemin); color: var(--hata); }
.bildirim.uyari { background: var(--uyari-zemin); }
.satir-form { display: inline; margin: 0; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .55rem .5rem; border-bottom: 1px solid var(--cizgi); vertical-align: top; }
th { font-size: .82rem; color: var(--soluk); font-weight: 600; }
.tablo-kap { overflow-x: auto; }
.rozet { display: inline-block; padding: .1rem .5rem; border-radius: 99px; font-size: .78rem;
         background: var(--zemin); border: 1px solid var(--cizgi); }
.rozet.dogrulandi, .rozet.aktif { background: var(--basari-zemin); color: var(--basari); border-color: transparent; }
.rozet.hata, .rozet.askida, .rozet.kapali { background: var(--hata-zemin); color: var(--hata); border-color: transparent; }
.panel-duzen { display: grid; grid-template-columns: 210px 1fr; gap: 1.5rem; }
.yan-menu a { display: block; padding: .5rem .7rem; border-radius: 8px; text-decoration: none; color: var(--yazi); }
.yan-menu a.secili, .yan-menu a:hover { background: var(--kart); border: 1px solid var(--cizgi); }
.taklit-bandi { background: #7a2e0e; color: #fff; padding: .5rem 16px; text-align: center; }
.taklit-bandi button { margin-left: .75rem; }
code, .kod { font-family: ui-monospace, Consolas, monospace; background: var(--zemin);
             padding: .1rem .35rem; border-radius: 5px; word-break: break-all; }
.izgara-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 760px) {
  .panel-duzen, .izgara-2 { grid-template-columns: 1fr; }
  .yan-menu { display: flex; gap: .25rem; overflow-x: auto; }
}