* { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --kagit: #fdf9f0;
    --kagit-kenar: #e8e0cf;
    --murekkep: #2b2620;
    --soluk: #8a7f6d;
    --vurgu: #b03a2e;
    --mavi: #1f4e79;
}

body {
    font-family: Georgia, "Times New Roman", serif;
    background: radial-gradient(ellipse at center, #3d3630 0%, #221e1a 75%);
    color: #e8e0cf;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

/* ---------- Üst bar ---------- */
.ust-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 22px;
    flex-wrap: wrap;
}
.ust-bar h1 { font-size: 20px; font-weight: 700; letter-spacing: .5px; }
.guncelleme { display: block; font-size: 12px; color: #a89c86; margin-top: 2px; }

.dugme {
    font-family: inherit;
    font-size: 14px;
    padding: 9px 18px;
    border: 1px solid #6b5f4d;
    border-radius: 8px;
    background: #4a4238;
    color: #f0e9d8;
    cursor: pointer;
    transition: background .15s;
}
.dugme:hover { background: #5a5044; }
.dugme:disabled { opacity: .6; cursor: wait; }

/* ---------- Sahne ve kitap ---------- */
.sahne {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 6px 16px;
    min-height: 0;
}
.kitap-kapsayici {
    width: min(920px, calc(100vw - 110px));
}
#kitap { margin: 0 auto; }

.ok {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.15);
    color: #e8e0cf;
    font-size: 22px;
    width: 44px;
    height: 64px;
    border-radius: 10px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .15s;
}
.ok:hover { background: rgba(255,255,255,.18); }

/* ---------- Sayfalar ---------- */
.page {
    background: var(--kagit);
    color: var(--murekkep);
    border: 1px solid var(--kagit-kenar);
    overflow: hidden;
}
.page-ic {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 22px 24px 16px;
}

/* Kapak */
.page-kapak {
    background: linear-gradient(150deg, #1f4e79 0%, #16334d 60%, #102538 100%);
    color: #f0e9d8;
    border: none;
}
.page-kapak .page-ic { align-items: center; justify-content: center; text-align: center; gap: 14px; }
.kapak-cizgi { width: 60px; border-top: 2px solid #c9a84c; }
.kapak-ust { font-size: 13px; letter-spacing: 3px; text-transform: uppercase; color: #c9a84c; }
.kapak-baslik { font-size: 34px; line-height: 1.2; font-weight: 700; }
.kapak-alt { font-size: 14px; color: #b8c4d0; }
.kapak-tarih { font-size: 13px; color: #c9a84c; margin-top: 18px; }

/* Bölüm (şirket) kapağı */
.page-bolum {
    background: linear-gradient(150deg, #f5eeda 0%, #ece1c6 100%);
}
.page-bolum .page-ic { align-items: center; justify-content: center; text-align: center; gap: 12px; }
.bolum-no { font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: var(--soluk); }
.bolum-ad { font-size: 30px; font-weight: 700; color: var(--mavi); }
.bolum-sayi { font-size: 14px; color: var(--soluk); }

/* Haber sayfası */
.sayfa-baslik {
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--soluk);
    border-bottom: 1px solid var(--kagit-kenar);
    padding-bottom: 8px;
    margin-bottom: 12px;
}
.haber-liste { flex: 1; display: flex; flex-direction: column; gap: 4px; min-height: 0; }
.haber {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 9px 4px;
    border-bottom: 1px dotted #d5cab2;
}
.haber:hover .haber-baslik { color: var(--vurgu); }
.haber-baslik {
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--murekkep);
}
.haber-alt {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 5px;
    font-size: 11.5px;
    color: var(--soluk);
    font-family: "Segoe UI", sans-serif;
}
.haber-kaynak { color: var(--mavi); font-weight: 600; }
.haber-tarih { margin-left: auto; }
.sayfa-alt {
    text-align: center;
    font-size: 11px;
    color: var(--soluk);
    padding-top: 8px;
}

/* Arka kapak */
.page-arka {
    background: linear-gradient(150deg, #1f4e79 0%, #102538 100%);
    color: #b8c4d0;
    border: none;
}
.page-arka .page-ic { align-items: center; justify-content: center; text-align: center; gap: 10px; font-size: 14px; }

/* ---------- Alt bar ---------- */
.alt-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 22px 16px;
    font-size: 13px;
    color: #a89c86;
    flex-wrap: wrap;
    gap: 8px;
}

/* ---------- Yükleniyor ---------- */
.yukleniyor {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #221e1a;
    color: #e8e0cf;
    font-size: 18px;
    z-index: 50;
    transition: opacity .4s;
}
.yukleniyor.gizle { opacity: 0; pointer-events: none; }

/* ---------- Mobil ---------- */
@media (max-width: 640px) {
    .ust-bar h1 { font-size: 17px; }
    .ok { width: 34px; height: 52px; font-size: 17px; }
    .kitap-kapsayici { width: calc(100vw - 88px); }
    .ipucu { display: none; }
}