/* scienceWiki — Bilim Tarihi Zaman Çizelgesi */
.tl-grid { grid-template-columns: 290px minmax(0, 1fr) 330px; }
.tl-stage { background: radial-gradient(circle at 50% 40%, #0d1424 0%, #05070c 85%); justify-content: flex-start; }
.tl-body { position: relative; display: flex; height: min(72vh, 760px); min-height: 520px; }
.tl-lanelabels { flex: 0 0 92px; padding-top: 34px; border-right: 1px solid var(--border); background: rgba(6, 8, 13, 0.6); z-index: 2; }
.tl-lanelabel { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2px; font-size: 18px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
.tl-lanelabel span { font-size: 10.5px; font-weight: 800; color: var(--c); text-transform: uppercase; letter-spacing: 0.04em; }
.tl-lanelabel.off { opacity: 0.3; }
.tl-scroller { position: relative; flex: 1; overflow-x: auto; overflow-y: hidden; cursor: grab; }
.tl-scroller.dragging { cursor: grabbing; user-select: none; }
.tl-track { position: relative; min-height: 100%; }
.tl-era { position: absolute; top: 0; bottom: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--c) 14%, transparent), color-mix(in srgb, var(--c) 4%, transparent)); border-left: 1px solid color-mix(in srgb, var(--c) 45%, transparent); pointer-events: none; }
.tl-era span { position: absolute; top: 3px; left: 6px; font-size: 10.5px; font-weight: 800; color: var(--c); white-space: nowrap; text-transform: uppercase; letter-spacing: 0.04em; }
.tl-tick { position: absolute; top: 18px; bottom: 0; border-left: 1px dashed rgba(148, 163, 184, 0.13); pointer-events: none; }
.tl-tick span { position: absolute; top: -1px; left: 3px; font-family: var(--mono); font-size: 9.5px; color: rgba(148, 163, 184, 0.85); white-space: nowrap; }
.tl-lane { position: absolute; left: 0; right: 0; border-top: 1px solid rgba(255, 255, 255, 0.06); background: linear-gradient(90deg, color-mix(in srgb, var(--c) 5%, transparent), transparent); pointer-events: none; }
.tl-lane.off { display: none; }
.tl-ev {
  position: absolute; height: 25px; padding: 0 8px; border-radius: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-size: 11px; font-weight: 700; color: var(--text); text-align: left;
  background: color-mix(in srgb, var(--c) 18%, rgba(9, 12, 22, 0.92)); border: 1px solid color-mix(in srgb, var(--c) 55%, transparent);
  border-left: 3px solid var(--c); transition: transform 0.12s ease, box-shadow 0.12s ease; z-index: 1;
}
.tl-ev.exp { box-shadow: 0 0 0 1px rgba(251, 191, 36, 0.25); }
.tl-ev:hover, .tl-ev.sel { transform: translateY(-1px); box-shadow: 0 6px 18px -6px var(--c); z-index: 3; background: color-mix(in srgb, var(--c) 32%, rgba(9, 12, 22, 0.95)); }
.tl-dot { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--c); box-shadow: 0 0 8px var(--c); z-index: 1; }
.tl-dot.sel { outline: 2px solid #fff; }
.tl-lanechips { display: flex; flex-wrap: wrap; gap: 5px; }
.tl-lanechip { cursor: pointer; }
.tl-lanechip.off { opacity: 0.35; filter: grayscale(0.6); }
.tl-check { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); cursor: pointer; }
.tl-museum { display: flex; flex-direction: column; gap: 4px; max-height: 46vh; overflow-y: auto; }
.tl-museum-item { display: grid; grid-template-columns: 52px 1fr; gap: 0 8px; text-align: left; padding: 6px 8px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.07); border-left: 3px solid var(--c); background: rgba(255, 255, 255, 0.025); }
.tl-museum-item b { grid-row: span 2; font-family: var(--mono); font-size: 11px; color: var(--c); }
.tl-museum-item span { font-size: 12px; font-weight: 700; }
.tl-museum-item small { font-size: 11px; color: var(--muted); }
.tl-museum-item:hover { border-color: var(--c); }
.tl-title { font-size: 18px; line-height: 1.25; }
.tl-person { font-size: 12.5px; color: var(--cyan); font-weight: 700; }
.tl-desc { font-size: 12.8px; line-height: 1.6; }
.tl-exp { border-radius: 10px; padding: 9px 10px; background: rgba(251, 191, 36, 0.07); border: 1px solid rgba(251, 191, 36, 0.3); }
.tl-exp b { color: #fbbf24; font-size: 12px; }
.tl-exp p { font-size: 12.3px; line-height: 1.55; margin-top: 4px; }
.tl-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.tl-empty { font-size: 12px; color: var(--muted); }
.tl-vertical { flex: 1; overflow-y: auto; padding: 10px; display: flex; flex-direction: column; gap: 6px; }
.tl-vera { font-family: var(--display); font-size: 14px; margin-top: 8px; }
.tl-vitem { display: grid; grid-template-columns: 62px 1fr; gap: 0 8px; text-align: left; padding: 8px 10px; border-radius: 10px; border-left: 3px solid var(--c); background: rgba(255, 255, 255, 0.03); border-top: 1px solid rgba(255, 255, 255, 0.06); }
.tl-vitem b { grid-row: span 2; font-family: var(--mono); font-size: 12px; color: var(--c); }
.tl-vitem span { font-size: 13px; font-weight: 700; }
.tl-vitem small { font-size: 11.5px; color: var(--muted); }
.tl-vitem.sel { background: color-mix(in srgb, var(--c) 15%, transparent); }
@media (max-width: 1220px) { .tl-grid { grid-template-columns: 270px minmax(0, 1fr); } }
@media (max-width: 860px) { .tl-grid { grid-template-columns: 1fr; } .tl-body { height: 70vh; } }
.tl-actions .lp-btn, .sc-actions .lp-btn { white-space: normal; text-align: left; line-height: 1.35; }