:root{
  --accent-brown:#7a5c3a;
  --accent-brown-soft:#e9e2d9;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Lexend Deca',sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background:#fff;color:#111;height:100vh;overflow:hidden
}

/* Header */
header.tvz-header{
  position:fixed;top:0;left:0;right:0;height:72px;background:#fff;
  border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between;
  padding:0 24px 0 72px;z-index:10
}
.tvz-brand{display:flex;align-items:baseline;gap:6px;line-height:1.1}
.tvz-brand-main{font-size:20px;font-weight:700;letter-spacing:.08em;color:var(--accent-brown)}
.tvz-brand-sub{font-size:13px;font-weight:300;letter-spacing:.06em;color:#6b7280}

/* User circle */
.tvz-user{position:relative;display:flex;align-items:center}
.tvz-user-btn{
  width:36px;height:36px;border-radius:50%;border:1px solid #e5e7eb;background:#f3f4f6;cursor:pointer;
  display:flex;align-items:center;justify-content:center
}
.tvz-user-btn svg{width:18px;height:18px;stroke:#111;stroke-width:2;fill:none}
.tvz-user-menu{
  position:absolute;right:0;top:44px;min-width:170px;background:#fff;border:1px solid #e5e7eb;border-radius:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.08);padding:8px;display:none;z-index:50
}
.tvz-user-menu.open{display:block}
.tvz-user-menu a{
  display:block;text-decoration:none;color:#111;padding:10px 12px;border-radius:10px;font-size:14px
}
.tvz-user-menu a:hover{background:#f3f4f6}

/* Sidebar */
.tvz-sidebar{
  position:fixed;top:72px;left:0;height:calc(100vh - 72px);width:72px;background:#fff;border-right:1px solid #e5e7eb;
  padding-top:16px;transition:width .25s ease,background .25s ease;overflow:visible
}
.tvz-sidebar.open{width:280px;background:#f3f4f6}

/* Sidebar toggle arrow (visible) */
.tvz-sidebar-toggle{
  position:absolute;
  top:12px;
  right:-14px;
  width:28px;
  height:28px;
  border-radius:999px;
  background:#ffffff;
  border:1px solid #e5e7eb;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:60;
  box-shadow:0 6px 16px rgba(0,0,0,0.08);
}
.tvz-sidebar-toggle svg{
  width:14px;
  height:14px;
  color:#6b7280;
  transition:transform .25s ease,color .15s ease;
}
.tvz-sidebar-toggle svg path{ stroke: currentColor; }
.tvz-sidebar.open .tvz-sidebar-toggle svg{ transform:rotate(180deg); }
.tvz-sidebar-toggle:hover svg{ color:#111; }



.tvz-menu{display:flex;flex-direction:column;gap:16px;padding:16px}
.tvz-menu-item{display:flex;align-items:center;gap:12px;font-size:14px;cursor:pointer;user-select:none;color:#111;white-space:nowrap}
.tvz-menu-item svg{width:20px;height:20px;flex-shrink:0;transition:color .15s ease;}
.tvz-menu-item{color:#111;}
.tvz-menu-item svg{color:#111;}
.tvz-menu-item:hover{color:var(--accent-brown);} 
.tvz-menu-item:hover svg{color:var(--accent-brown);}

.tvz-menu-text{opacity:0;transition:opacity .2s ease;font-weight:400}
.tvz-sidebar.open .tvz-menu-text{opacity:1}

.tvz-divider{height:1px;background:#e5e7eb;margin:16px 0}
.tvz-context{display:none}
.tvz-sidebar.open .tvz-context{display:block}
.tvz-era-title{font-size:13px;color:#6b7280;opacity:1;padding:0 16px;margin-bottom:10px;letter-spacing:.06em}
.tvz-lessons{padding:0 12px 16px 12px;display:flex;flex-direction:column;gap:10px}
.tvz-lesson{
  background:#e5e7eb;border-radius:25px;padding:10px 14px;font-size:13px;text-align:left;cursor:pointer;
  font-weight:300;color:#111;border:1px solid transparent;transition:background .15s ease,border-color .15s ease
}
.tvz-lesson:hover{background:#dde1e7}
.tvz-lesson.active{background:#d1d5db;border-color:transparent}
.tvz-lesson a{color:inherit;text-decoration:none;display:block}

/* Content */
.tvz-content{margin-top:72px;margin-left:72px;height:calc(100vh - 72px);overflow:auto;padding:56px 76px;transition:margin-left .25s ease}
.tvz-sidebar.open ~ .tvz-content{margin-top:72px;margin-left:72px;height:calc(100vh - 72px);overflow:auto;padding:56px 76px;transition:margin-left .25s ease}
.tvz-reading{max-width:760px;margin:0 auto;padding-bottom:80px}

/* Lesson title */
.tvz-lesson-title{padding-bottom:18px;border-bottom:1px solid #e5e7eb;margin-bottom:18px}
.tvz-lesson-title h1,.tvz-lesson-title h2{font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-0.02em;color:#111;margin-bottom:14px}
.tvz-meta{font-size:13px;font-weight:300;color:#6b7280;letter-spacing:0.02em}

/* Timeline */
.tvz-timeline-wrap{
  position:relative;margin:18px 0 26px;padding:10px 44px;border:1px solid #e5e7eb;border-radius:18px;background:#fff
}
.tvz-timeline{display:flex;gap:14px;overflow-x:auto;scroll-behavior:smooth;padding:10px 2px;scrollbar-width:none}
.tvz-timeline::-webkit-scrollbar{display:none}
.tvz-t-item{flex:0 0 auto;display:flex;align-items:center;gap:14px}
.tvz-t-card{min-width:220px;max-width:260px;border:1px solid #e5e7eb;background:#f9fafb;border-radius:18px;padding:12px 14px}
.tvz-t-year{font-size:13px;font-weight:600;letter-spacing:.04em;color:#111;margin-bottom:6px}
.tvz-t-text{font-size:13px;line-height:1.55;font-weight:300;color:#111;text-align:justify}
.tvz-t-connector{width:34px;height:2px;background:#d1d5db;border-radius:999px}
.tvz-t-arrow{
  position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:999px;border:1px solid #e5e7eb;
  background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center
}
.tvz-t-arrow:hover{background:#f9fafb}
.tvz-t-arrow.left{left:8px}
.tvz-t-arrow.right{right:8px}
.tvz-t-arrow svg{width:18px;height:18px;fill:none;stroke:#111;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* Sources */
.tvz-sources{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 26px}
.tvz-source-block{
  position:relative;border:1px solid #e5e7eb;border-radius:18px;background:#f9fafb;padding:18px 18px 16px;overflow:hidden
}
.tvz-source-quote{
  position:absolute;top:10px;left:12px;font-size:54px;line-height:1;font-weight:700;color:rgba(17,17,17,.10);
  user-select:none;pointer-events:none
}
.tvz-source-text{
  font-size:15px;line-height:1.85;font-weight:300;color:#111;text-align:justify;padding-left:18px
}
.tvz-source-meta{
  margin-top:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-left:18px
}
.tvz-chip{
  font-size:12px;font-weight:400;color:#6b7280;border:1px solid #e5e7eb;background:#fff;padding:6px 10px;border-radius:999px;letter-spacing:.02em
}
.tvz-author{font-size:12px;font-weight:500;color:#111;letter-spacing:.02em;margin-left:auto}
@media (min-width: 920px){.tvz-sources{grid-template-columns:1fr 1fr}}

/* Body */
.tvz-reading p{font-size:17px;line-height:1.6;text-align:justify;font-weight:300;color:#111;margin-bottom:14px;letter-spacing:0.005em}
.tvz-note{margin-top:22px;padding:14px 16px;border-radius:16px;background:#f9fafb;border:1px solid #eef2f7;color:#6b7280;font-size:13px;font-weight:300}

/* Scrollbar */
.tvz-content::-webkit-scrollbar{width:10px}
.tvz-content::-webkit-scrollbar-thumb{background:rgba(17,17,17,.12);border-radius:999px;border:3px solid #fff}



/* ===== Era selector (Korszakok) ===== */
.tvz-era-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:24px}
@media (min-width: 920px){
  .tvz-era-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:24px}
}

.tvz-era-bubble{border:1px solid #e5e7eb;border-radius:25px;background:#f9fafb;padding:18px 18px 16px 18px;overflow:hidden}

.tvz-era-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}

.tvz-era-icon{
  width:44px;height:44px;border-radius:14px;
  background:#ffffff;border:1px solid #e5e7eb;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  flex: 0 0 auto;
}
.tvz-era-icon img{width:100%;height:100%;object-fit:cover;display:block}

.tvz-era-titlewrap{min-width:0}
.tvz-era-name{font-size:16px;font-weight:600;color:#111;letter-spacing:-0.01em;line-height:1.2;display:block}
.tvz-era-subline{
  margin-top:4px;
  font-size:12px;
  font-weight:300;
  color:#6b7280;
}

.tvz-era-actions{ margin-left:auto; }
.tvz-era-actions a{
  text-decoration:none;
  font-size:12px;
  font-weight:500;
  color:var(--accent-brown);
  border:1px solid rgba(122,92,58,.25);
  background: var(--accent-brown-soft);
  padding:6px 10px;
  border-radius:999px;
  white-space:nowrap;
}
.tvz-era-actions a:hover{ filter:brightness(0.98); }

.tvz-era-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.tvz-era-list a{
  text-decoration:none;
  color:#111;
  font-size:13px;
  font-weight:300;
  line-height:1.55;
}
.tvz-era-list a:hover{ color: var(--accent-brown); }

.tvz-era-more{ margin-top:12px; }
.tvz-era-more a{
  text-decoration:none;
  font-size:12px;
  font-weight:400;
  color:#6b7280;
}
.tvz-era-more a:hover{ color:#111; }

/* FORCE sidebar toggle visibility */




/* ===== Word-like paragraph & list typography ===== */
.tvz-reading p {
  margin-bottom: 22px;
}

.tvz-reading ul,
.tvz-reading ol {
  margin: 18px 0 26px 32px;
  padding: 0;
}

.tvz-reading ul li,
.tvz-reading ol li {
  font-size: 17px;
  line-height: 2.1;
  font-weight: 300;
  margin-bottom: 10px;
}

.tvz-reading ul {
  list-style-type: disc;
}

.tvz-reading ul ul {
  list-style-type: circle;
  margin-top: 10px;
}

.tvz-reading ol {
  list-style-type: decimal;
}

.tvz-reading li p {
  margin-bottom: 8px;
}

/* Homepage: wider era bubbles */
body.home .tvz-reading{max-width:980px;}
@media (min-width: 820px){
  body.home .tvz-era-grid{grid-template-columns: 1fr 1fr;}
}

/* Era lesson list as gray bubbles */
.tvz-era-list a{
  display:block;
  padding:9px 14px;
  border-radius:18px;
  background:#e5e7eb;
  color:#111;
  font-size:13px;
  font-weight:300;
  text-decoration:none;
}
.tvz-era-list a:hover{
  background:#d1d5db;
}

/* FIX: Sidebar toggle always visible */
.tvz-sidebar{
  position:fixed;
  left:0;
  top:72px;
  z-index:40;
}
.tvz-sidebar-toggle{
  position:absolute;
  top:16px;
  right:-16px;
  width:32px;
  height:32px;
  border-radius:999px;
  background:#ffffff;
  border:1px solid #e5e7eb;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:60;
  box-shadow:0 8px 20px rgba(0,0,0,0.12);
}
.tvz-sidebar-toggle svg{
  width:14px;
  height:14px;
  color:#6b7280;
}
.tvz-sidebar.open .tvz-sidebar-toggle svg{
  transform:rotate(180deg);
}

/* Kronológia */
.tvz-timeline{
  margin-top:48px;
}
.tvz-timeline h2{
  font-size:22px;
  font-weight:600;
  margin-bottom:14px;
}
.tvz-timeline-track{
  display:flex;
  gap:14px;
  overflow-x:auto;
  padding-bottom:6px;
}
.tvz-timeline-item{
  min-width:180px;
  background:#f3f4f6;
  border-radius:18px;
  padding:12px 14px;
}
.tvz-timeline-year{
  font-weight:600;
  font-size:14px;
  margin-bottom:4px;
}
.tvz-timeline-event{
  font-size:13px;
  font-weight:300;
  line-height:1.6;
}

/* Forrás blokk */
.wp-block-quote{
  margin:28px 0;
  padding:18px 22px;
  border-left:4px solid #d1d5db;
  background:#f9fafb;
  border-radius:14px;
  font-weight:300;
  line-height:1.9;
}
.wp-block-quote cite{
  display:block;
  margin-top:10px;
  font-size:13px;
  font-style:normal;
  color:#6b7280;
}

/* Section titles inside lessons */
.tvz-section-title{
  font-size:18px;
  font-weight:600;
  margin: 18px 0 10px;
  letter-spacing:-0.01em;
}

.tvz-brand-link{color:inherit;text-decoration:none;}




.tvz-header{
  justify-content:flex-start !important;
}
.tvz-brand-link{
  margin-right:0 !important;
}


.tvz-header{
  justify-content:space-between !important;
}
.tvz-brand-link{
  margin-right:auto;
}


/* FINAL header alignment fix */
.tvz-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.tvz-brand-link{
  display:block;
  margin:0;
}
.tvz-brand{
  text-align:left;
}


/* Header: title hard-left, user hard-right (high specificity) */
header.tvz-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}
header.tvz-header .tvz-brand-link{
  display:flex !important;
  align-items:baseline !important;
  justify-content:flex-start !important;
  flex:0 0 auto !important;
  margin:0 !important;
  text-decoration:none !important;
  color:inherit !important;
}
header.tvz-header .tvz-brand{
  text-align:left !important;
  margin:0 !important;
}
header.tvz-header .tvz-user{
  margin-left:auto !important;
  flex:0 0 auto !important;
}