:root{
  --brand:#00285e;
  --ink:#00285e;
  --paper:#fffefa;
  --muted:#5d6b85;
  --shadow:0 8px 28px rgba(0,0,0,.08);
  --font:'Rubik', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

*,
*::before,
*::after { box-sizing:border-box }

html, body { height:100% }
body{
  margin:0; font-family:var(--font); color:var(--ink);
  background:linear-gradient(180deg,#fff,#f4f7ff);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

/* Header */
.site-header{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:12px 16px; background:#fff; border-bottom:1px solid #e6eaf4;
}
.brand{display:flex; gap:10px; align-items:center}
.brand img{height:36px}
.brand h1{font-size:18px; margin:0; color:var(--brand)}
nav{display:flex; gap:10px; align-items:center}
.primary{
  background:var(--brand); color:#fff; border:0; border-radius:12px;
  padding:10px 14px; font-weight:600; cursor:pointer; box-shadow:var(--shadow);
}
.admin-link{color:var(--brand); text-decoration:none; font-weight:600}

/* Layout */
main{max-width:1200px; margin:20px auto; padding:0 16px}

/* === Flipbook (marad) === */
.book{ perspective:250vw; }
.book .pages{
  width: 60vw; height: 36vw; margin: 0 auto; position:relative; transform-style:preserve-3d;
}
.page{
  width:30vw; height:36vw; position:absolute; top:0; background:var(--paper);
  transform-origin:0 0; transform-style:preserve-3d; backface-visibility:hidden;
  transition: transform 1.2s; cursor:pointer; display:flex; align-items:start; justify-content:start;
  padding:2vw; text-align:start; overflow:hidden; border-radius:8px; color:var(--ink);
  box-shadow:0 .6em 1.4em -.3em rgba(0,0,0,.12);
}
.page .content{
  max-width:60ch; margin:0; padding-left:0.6em;
  word-break:normal; overflow-wrap:normal; hyphens:none;
}
.page img{ max-width:100%; height:auto; display:block; border-radius:12px; }

/* Oldalpárok */
.page:nth-child(odd){ right:0; border-radius:0 8px 8px 0;
  transform:rotateY(0deg);
  background-image:linear-gradient(to right, rgba(0,0,0,.06) 0%, rgba(0,0,0,0) 12%);
  pointer-events:all;
}
.page:nth-child(even){ left:0; border-radius:8px 0 0 8px; transform:rotateY(180deg); transform-origin:100% 0;
  background-image:linear-gradient(to left, rgba(0,0,0,.06) 0%, rgba(0,0,0,0) 12%);
  pointer-events:none;
}
.page.flipped:nth-child(odd){ transform:rotateY(-180deg); pointer-events:none; }
.page.flipped:nth-child(even){ transform:rotateY(0deg);   pointer-events:all; }

/* Borító stílusok */
.page.cover{
  background:linear-gradient(135deg,#0b3a88,#00285e);
  color:#fff; border:0; align-items:center; justify-content:center;
}
.page.cover .content{ max-width:none }

/* Szövegek */
h1,h2{ margin:.2em 0 .4em }
h1{ font-size:2.2rem; font-weight:700 }
h2{ font-size:1.4rem; font-weight:700 }
p{ line-height:1.65 }

/* Controls */
.book-controls{ display:flex; gap:12px; justify-content:center; align-items:center; margin:12px 0 4px; gap:30px; }
.book-controls button{
  width:44px; height:44px; border-radius:12px; border:1px solid #dfe6f6; background:#fff; cursor:pointer;
}
#pageIndicator{ color:var(--muted); font-weight:600 }

/* Tablet/mobil */
@media (max-width:1200px){
  .book .pages{ width:88vw; height:64vh; }
  .page{ width:44vw; height:64vh; font-size:clamp(14px,1.3vw,18px) }
}

/* Mobil fallback (oldalnézegető) */
#mobile-view{ display:none; }
@media (max-width: 768px){
  .book-wrap{ display:none }
  #mobile-view{ display:block; background:#fff; padding:20px; border-radius:16px; box-shadow:var(--shadow); }
  #mobile-view .mbook { background:#fff; border:1px solid #e6eaf4; border-radius:16px; box-shadow:var(--shadow); padding:10px; }
  #mobile-view .mctrls { display:flex; gap:12px; justify-content:center; align-items:center; padding:8px 0; }
  #mobile-view .mctrls button { width:44px; height:44px; border-radius:12px; border:1px solid #dfe6f6; background:#fff; }
  #mobile-view .mframe { padding:8px; }
  #mobile-view .page { position:relative; inset:auto; width:100%; height:auto; min-height:60vh; padding:16px; transform:none; box-shadow:none; border:1px solid #eef2fb; }
  #mobile-view .page .content { max-width:100%; padding-left:0; }
}

/* Entry blokkok a flipbook oldalain */
.entry{ margin:0 0 1rem; }
.entry .meta{ color:var(--muted); font-size:.9rem; margin:0 0 .5rem; }
.entry .body p{ margin:0 0 .8rem; }
.entry .body p:last-child{ margin-bottom:0; }

/* Modalok */
dialog::backdrop{ background:rgba(0,0,0,.35) }
dialog{ border:0; border-radius:16px; box-shadow:var(--shadow); padding:10px 20px }
.write-form{ padding:18px; min-width:min(92vw,560px) }
.write-form h2{ margin:6px 0 14px; color:var(--brand) }
.write-form label{ display:block; font-weight:400; margin:10px 0 6px }
.write-form input, .write-form textarea{
  width:100%; border:1px solid #dfe6f6; border-radius:10px; padding:10px 12px; font:inherit; color:var(--ink);
}
.write-form textarea{ min-height:140px; resize:vertical }
.actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:12px }
.actions button{ padding:10px 14px; border-radius:10px; border:1px solid #dfe6f6; cursor:pointer }
.actions .primary{ border:0 }
.legal{ color:var(--muted); font-size:12px; margin:8px 2px 6px }

/* Footer */
.site-footer{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:20px; color:var(--muted) }
.site-footer a{ color:var(--muted); text-decoration:none }
.site-footer a:hover{ color:var(--brand) }

/* Írási űrlap mobilon */
@media (max-width: 768px){
  dialog { width:min(92vw, 560px); }
  .write-form { min-width:unset; width:100%; }
  .write-form textarea { min-height:120px; }
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.2rem; }
}




/* 2 sornyi térköz a kész (lezárt) bejegyzések között */
.entry{ margin:0 0 2lh; }
@supports not (margin:1lh){ .entry{ margin:0 0 3.3em; } }

/* folytatás (nem végső fragment) ne hagyjon lukat az oldal alján */
.entry.cont{ margin-bottom:0; }

/* plusz: a lap utolsó bejegyzése se hagyjon lukat */
.page .content .entry:last-child{ margin-bottom:0; }

/* dátum jobbra */
.entry .meta.date{ text-align:right; }



/* amíg nem kész a font, ne villanjon a flipbook */
body:not(.fonts-ready) .book-wrap,
body:not(.fonts-ready) #mobile-view { visibility:hidden }

#pageIndicator,
#mindi {
  display: none !important;
}



html, body { height:100% }

/* ÚJ: teljes oldal mint flex oszlop */
body{
  display:flex;
  min-height:100vh;          /* mindig legalább viewport magas */
  flex-direction:column;
}

/* ÚJ: a fő tartalom töltse ki a maradékot */
main{
  flex:1 0 auto;
}

/* (opcionális) iOS Safari-hoz */
@supports (-webkit-touch-callout: none) {
  body{ min-height:-webkit-fill-available; }
}