/* falakbin.ir's daily knowledge: /facts (FactPages), /today (TodayPages) and
   /web (WebPages). Loaded after public.css and pages.css. */

.flk-sk-flip { transform: scaleX(-1); }

/* ---- The fact ---------------------------------------------------------------- */
.flk-kn-fact { max-width: 52rem; margin: 22px 0 10px; padding: 26px 28px; border-radius: 24px; border: 1px solid var(--line);
    background: radial-gradient(520px 260px at 90% 0%, rgba(255, 194, 71, .1), transparent 70%), linear-gradient(160deg, var(--surface), var(--bg-2)); }
.flk-kn-fact .flk-kicker a { color: inherit; }
.flk-kn-fact h1 { margin: 6px 0 4px; font-size: clamp(1.5rem, 3.8vw, 2.3rem); font-weight: 900; line-height: 1.35; }
.flk-kn-date { margin: 0 0 16px; color: var(--muted); font-size: .88rem; }
.flk-kn-prose p { margin: 0 0 .95rem; line-height: 2.15; font-size: 1.05rem; }
.flk-kn-source { margin: 18px 0 16px; padding: 14px 16px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--line-soft); font-size: .9rem; }
.flk-kn-source p { margin: 6px 0 0; }
.flk-kn-source-h { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-weight: 850; }
.flk-kn-source-h .flk-i { color: var(--teal-ink); }
.flk-kn-source blockquote { margin: 0; padding: 8px 12px; border-inline-end: 3px solid var(--teal); border-radius: 8px; background: var(--teal-soft); text-align: left; font-style: italic; line-height: 1.8; }
.flk-kn-licence { color: var(--muted); font-size: .8rem; }
.flk-kn-pager { margin-top: 12px; }
@media (max-width: 760px) { .flk-kn-fact { padding: 18px 16px; } }

.flk-kn-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; align-items: start; }
@media (max-width: 900px) { .flk-kn-two { grid-template-columns: minmax(0, 1fr); } }
.flk-kn-cols { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.flk-kn-cols a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 1fr) 52px; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px;
    background: var(--surface); border: 1px solid var(--line-soft); color: var(--fg); text-decoration: none; font-size: .88rem; }
.flk-kn-cols a:hover { border-color: var(--teal); }
.flk-kn-cols b { font-variant-numeric: tabular-nums; text-align: left; font-size: .8rem; }
.flk-kn-cols progress { width: 100%; height: 10px; appearance: none; border: 0; border-radius: 6px; background: var(--surface-2); overflow: hidden; }
.flk-kn-cols progress::-webkit-progress-bar { background: var(--surface-2); border-radius: 6px; }
.flk-kn-cols progress::-webkit-progress-value { background: var(--c1); border-radius: 6px; }
.flk-kn-cols progress::-moz-progress-bar { background: var(--c1); border-radius: 6px; }
.flk-kn-list { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.flk-kn-list a { display: flex; flex-direction: column; padding: 8px 12px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line-soft); color: var(--fg); text-decoration: none; }
.flk-kn-list a:hover { border-color: var(--teal); }
.flk-kn-list b { font-weight: 800; font-size: .92rem; }
.flk-kn-list small { color: var(--muted); font-size: .76rem; }
.flk-kn-cta { display: flex; flex-wrap: wrap; gap: 8px; }
.flk-kn-chips { margin: 0 0 16px; }
.flk-kn-cards { list-style: none; margin: 0 0 16px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.flk-kn-cards a { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line-soft); color: var(--fg); text-decoration: none; }
.flk-kn-cards a:hover { border-color: var(--teal); }
.flk-kn-cards small { color: var(--orange-ink); font-size: .76rem; font-weight: 800; }
.flk-kn-cards b { font-weight: 850; line-height: 1.6; }
.flk-kn-cards span { color: var(--muted); font-size: .86rem; line-height: 1.9; }

/* ---- On this day -------------------------------------------------------------------- */
.flk-kn-hero { align-items: center; }
.flk-kn-daynav { display: flex; flex-wrap: wrap; gap: 8px; }
.flk-kn-year { max-width: 52rem; }
.flk-kn-told { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; color: var(--muted); font-size: .84rem; }
.flk-kn-story { margin: 0 0 12px; padding: 16px 18px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); border-inline-start: 4px solid var(--kn, var(--c1)); }
.flk-kn-story h2 { margin: 2px 0 6px; font-size: 1.15rem; font-weight: 850; line-height: 1.5; }
.flk-kn-story > p:last-child { margin: 0; line-height: 2.1; }
.flk-kn-story-head { display: flex; align-items: baseline; gap: 10px; margin: 0; color: var(--muted); font-size: .8rem; }
.flk-kn-year-big { font-size: 1.6rem; font-weight: 900; color: var(--fg); font-variant-numeric: tabular-nums; }
.flk-kn-brief { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.flk-kn-brief li { display: flex; gap: 12px; align-items: baseline; padding: 8px 12px; border-radius: 12px; background: var(--surface); border-inline-start: 3px solid var(--kn, var(--c1)); font-size: .92rem; line-height: 1.9; }
.flk-kn-brief b { flex: none; min-width: 3em; font-variant-numeric: tabular-nums; }
.flk-kn-g-sky { --kn: var(--c1); }
.flk-kn-g-matter { --kn: var(--c3); }
.flk-kn-g-life { --kn: var(--c5); }
.flk-kn-g-earth { --kn: var(--c4); }
.flk-kn-g-tech { --kn: var(--c6); }
.flk-kn-g-other { --kn: var(--muted); }
.flk-qz-key i.flk-kn-g-sky, .flk-qz-key i.flk-kn-g-matter, .flk-qz-key i.flk-kn-g-life, .flk-qz-key i.flk-kn-g-earth, .flk-qz-key i.flk-kn-g-tech, .flk-qz-key i.flk-kn-g-other { background: var(--kn); }
.flk-kn-line { margin: 0; padding: 12px 14px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.flk-kn-line-scroll { overflow-x: auto; }
.flk-kn-line svg { display: block; width: 100%; min-width: 640px; height: auto; }
.flk-kn-tick { stroke: var(--line); stroke-opacity: .45; stroke-width: 1; }
.flk-kn-tick50 { stroke: var(--line); stroke-width: 1; }
.flk-kn-axis, .flk-kn-lane { fill: var(--muted); font-size: 12px; font-family: inherit; }
.flk-kn-lane { direction: rtl; }
.flk-kn-pool { fill: var(--muted); fill-opacity: .45; }
.flk-kn-pool:hover { fill-opacity: 1; }
.flk-kn-dot { fill: var(--kn); stroke: var(--surface); stroke-width: 2; }
.flk-qz-key i.flk-kn-pool-key { background: var(--muted); opacity: .5; }

/* ---- The Persian science web -------------------------------------------------------------- */
.flk-kn-tabs { margin: 0 0 14px; width: max-content; max-width: 100%; }
.flk-kn-top { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; counter-reset: top; }
.flk-kn-top li { counter-increment: top; }
.flk-kn-top a { display: flex; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line-soft); color: var(--fg); text-decoration: none; }
.flk-kn-top a:hover { border-color: var(--teal); }
.flk-kn-top a::before { content: counter(top, persian); flex: none; display: grid; place-items: center; width: 1.9em; height: 1.9em; border-radius: 8px; background: var(--teal-soft); color: var(--teal-ink); font-weight: 800; font-size: .85rem; }
.flk-kn-top span { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.flk-kn-top b { font-weight: 800; line-height: 1.7; }
.flk-kn-top small { color: var(--muted); font-size: .76rem; }
.flk-kn-panel[hidden] { display: none; }
.flk-kn-sources { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.flk-kn-sources li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 1.2fr) 58px; gap: 10px; align-items: center; font-size: .88rem; }
.flk-kn-sources progress { width: 100%; height: 10px; appearance: none; border: 0; border-radius: 6px; background: var(--surface-2); overflow: hidden; }
.flk-kn-sources progress::-webkit-progress-bar { background: var(--surface-2); border-radius: 6px; }
.flk-kn-sources progress::-webkit-progress-value { background: var(--c1); border-radius: 6px; }
.flk-kn-sources progress::-moz-progress-bar { background: var(--c1); border-radius: 6px; }
.flk-kn-sources b { font-variant-numeric: tabular-nums; text-align: left; font-size: .8rem; }
.flk-kn-quiet { opacity: .55; }

/* The day before and after (as on /apod). */
.flk-ap-pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.flk-ap-pager a { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line-soft); text-decoration: none; color: var(--fg); min-width: 0; }
.flk-ap-pager a:hover { border-color: var(--teal); }
.flk-ap-pager small { color: var(--muted); font-size: .76rem; }
.flk-ap-pager b { font-weight: 800; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flk-ap-prev { grid-column: 1; }
.flk-ap-next { grid-column: 2; text-align: left; }
.flk-qz-key { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; margin: 10px 0 0; color: var(--muted); font-size: .76rem; }
.flk-qz-key span { display: inline-flex; align-items: center; gap: 5px; }
.flk-qz-key i, .flk-qz-maps figcaption i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
.flk-qz-k-a { background: #e9c46a; } .flk-qz-k-b { background: #f4a259; } .flk-qz-k-c { background: #ff8c1a; } .flk-qz-k-d { background: #f2542d; } .flk-qz-k-e { background: #c81d25; }