/* Tulevaisuuswiki — the fiction layer.
   Deliberately not the blog: a cool, clinical encyclopedia printed some years
   from now. Sans-serif, hairline rules, monospace dates, an always-visible
   ribbon saying this is fiction. Loaded after site.css on wiki pages only. */

body.theme-wiki {
  --w-bg: #edf1f3;
  --w-page: #ffffff;
  --w-ink: #16212a;
  --w-ink-2: #3a4853;
  --w-muted: #66747f;
  --w-rule: #d3dce1;
  --w-link: #0f6674;
  --w-accent: #0e8a9a;
  --w-night: #0f1c24;
  --w-glow: #6cc3cf;
  background: var(--w-bg);
  color: var(--w-ink);
}
@media (prefers-color-scheme: dark) {
  body.theme-wiki {
    --w-bg: #0b1217;
    --w-page: #111b21;
    --w-ink: #dde8ec;
    --w-ink-2: #b3c4ca;
    --w-muted: #7d9098;
    --w-rule: #23323a;
    --w-link: #6cc3cf;
    --w-accent: #6cc3cf;
  }
}

.theme-wiki .masthead { border-bottom-color: var(--w-glow); }
.theme-wiki .nav a[aria-current="page"] { border-bottom-color: var(--w-glow); }
.theme-wiki .site-footer { background: var(--w-bg); border-top-color: var(--w-rule); }

/* Ribbon: the fiction disclaimer, never scrolled out of the header area. */
.ribbon {
  background: var(--w-night);
  background-image: repeating-linear-gradient(135deg, rgba(108,195,207,.09) 0 2px, transparent 2px 10px);
  color: #cfe0e4;
  border-bottom: 1px solid rgba(108,195,207,.3);
}
.ribbon-inner {
  max-width: 72rem; margin: 0 auto; padding: .55rem var(--gutter);
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1.2rem;
  font: .74rem/1.4 var(--mono);
}
.ribbon-mark {
  color: var(--w-night); background: var(--w-glow);
  padding: .15rem .5rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.ribbon-text { flex: 1 1 20rem; }
.ribbon-canon { color: var(--w-glow); }

/* Home -------------------------------------------------------------------- */

.wiki-home { max-width: 64rem; margin: 0 auto; padding: 3.5rem var(--gutter) 5rem; }
.wiki-kicker { font: 600 .74rem/1 var(--mono); text-transform: uppercase; letter-spacing: .14em; color: var(--w-accent); margin: 0 0 1rem; }
.wiki-home h1 {
  font: 650 clamp(2.2rem, 6vw, 3.6rem)/1.05 var(--sans);
  letter-spacing: -.035em;
  margin: 0 0 1.2rem;
  max-width: 14em;
  text-wrap: balance;
}
.wiki-dek { font: 400 1.15rem/1.55 var(--sans); color: var(--w-ink-2); max-width: 40rem; margin: 0; }

.canon-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.25rem; margin-top: 3rem; }
.canon-card {
  background: var(--w-page);
  border: 1px solid var(--w-rule);
  border-top: 4px solid var(--w-accent);
  padding: 1.4rem 1.5rem 1.3rem;
}
.canon-card h2 { font: 650 1.6rem/1.15 var(--sans); letter-spacing: -.02em; margin: .2rem 0 .6rem; }
.canon-card h2 a { text-decoration: none; }
.canon-card h2 a:hover { color: var(--w-accent); }
.canon-card p { margin: 0 0 .7rem; color: var(--w-ink-2); line-height: 1.5; }
.canon-span { color: var(--w-accent); margin: 0 !important; }
.canon-meta, .canon-inspired { font-size: .82rem; color: var(--w-muted) !important; margin-bottom: .2rem !important; }
.canon-meta a, .canon-inspired a { color: var(--w-link); }

/* Article layout ---------------------------------------------------------- */

.wiki-layout {
  max-width: 72rem; margin: 0 auto; padding: 0 var(--gutter) 4rem;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 2.5rem;
}
@media (min-width: 60rem) { .wiki-layout { grid-template-columns: 13rem minmax(0, 1fr); } }

.wiki-nav { font: .85rem/1.35 var(--sans); padding: 2rem 0 0; }
@media (min-width: 60rem) {
  .wiki-nav { position: sticky; top: 0; align-self: start; max-height: 100vh; overflow-y: auto; padding-bottom: 2rem; }
}
@media (max-width: 59.99rem) {
  .wiki-nav { order: 2; border-top: 1px solid var(--w-rule); margin-top: 2rem; columns: 2 12rem; }
  .wiki-nav > * { break-inside: avoid; }
}
.wiki-nav ul { list-style: none; padding: 0; margin: 0 0 1rem; }
.wiki-nav li { margin: 0; }
.wiki-nav a { display: block; padding: .22rem 0 .22rem .6rem; text-decoration: none; color: var(--w-ink-2); border-left: 2px solid transparent; }
.wiki-nav a:hover { color: var(--w-link); }
.wiki-nav a[aria-current="page"] { color: var(--w-ink); font-weight: 600; border-left-color: var(--w-accent); }
.wiki-nav-canon { margin: 0 0 .6rem; }
.wiki-nav-canon a { font: 650 1rem/1.2 var(--sans); color: var(--w-ink); padding-left: 0; border: 0; }
.wiki-nav-timeline a { font-family: var(--mono); font-size: .8rem; color: var(--w-link); }
.wiki-nav-group { font: 600 .66rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; color: var(--w-muted); margin: 1.1rem 0 .4rem; }
.wiki-nav-other a { padding-left: 0; border: 0; font-size: .8rem; color: var(--w-muted); margin-top: 1rem; }

.wiki-main { padding: 2rem 0 0; min-width: 0; }
.wiki-article, .wiki-main > .wiki-head, .wiki-group, .timeline-cta {
  background: var(--w-page);
  border: 1px solid var(--w-rule);
}
.wiki-article { padding: 1.8rem clamp(1.1rem, 3vw, 2.4rem) 2rem; }
.wiki-article::after { content: ""; display: table; clear: both; }
.wiki-main > .wiki-head { padding: 1.8rem clamp(1.1rem, 3vw, 2.4rem); border-bottom: 0; }

.wiki-crumbs { font: .75rem/1 var(--mono); color: var(--w-muted); margin: 0 0 .9rem; }
.wiki-crumbs a { color: var(--w-link); text-decoration: none; }
.wiki-crumbs .sep { margin: 0 .35em; }
.wiki-title {
  font: 650 clamp(1.9rem, 4.5vw, 2.6rem)/1.1 var(--sans);
  letter-spacing: -.03em;
  margin: 0;
  padding-bottom: .6rem;
  border-bottom: 1px solid var(--w-rule);
}
.wiki-aliases { font: .88rem/1.4 var(--sans); color: var(--w-muted); margin: .6rem 0 0; }
.wiki-head { margin-bottom: 1.4rem; }
.wiki-main > .wiki-head { margin-bottom: 0; }
.wiki-main > .wiki-head .wiki-dek { margin-top: .9rem; font-size: 1.05rem; }

/* Infobox ----------------------------------------------------------------- */

.infobox {
  float: right;
  width: min(19rem, 100%);
  margin: 0 0 1.2rem 1.8rem;
  border: 1px solid var(--w-rule);
  background: var(--w-bg);
  font: .84rem/1.4 var(--sans);
}
@media (max-width: 40rem) { .infobox { float: none; margin: 0 0 1.4rem; width: 100%; } }
.infobox-title { margin: 0; padding: .6rem .9rem; background: var(--w-night); color: #fff; font-weight: 650; font-size: .95rem; }
.infobox-type { margin: 0; padding: .35rem .9rem; font: .72rem/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--w-accent); border-bottom: 1px solid var(--w-rule); }
.infobox dl { margin: 0; display: grid; grid-template-columns: auto 1fr; }
.infobox dt, .infobox dd { margin: 0; padding: .45rem .9rem; border-bottom: 1px solid var(--w-rule); }
.infobox dt { font-weight: 600; color: var(--w-ink-2); padding-right: .3rem; }
.infobox dd { color: var(--w-ink); }
.infobox dl > :nth-last-child(-n+2) { border-bottom: 0; }
.infobox a { color: var(--w-link); }

/* Prose ------------------------------------------------------------------- */

.wiki-prose { font: 400 1.02rem/1.65 var(--sans); color: var(--w-ink); }
.wiki-prose > p:first-child { font-size: 1.1rem; }
.wiki-prose p, .wiki-prose ul, .wiki-prose ol, .wiki-prose .table-wrap, .wiki-prose blockquote { margin: 0 0 1em; }
.wiki-prose h2 {
  font: 650 1.4rem/1.25 var(--sans);
  letter-spacing: -.02em;
  margin: 1.9em 0 .6em;
  padding-bottom: .3rem;
  border-bottom: 1px solid var(--w-rule);
  clear: none;
}
.wiki-prose h3 { font: 650 1.05rem/1.3 var(--sans); margin: 1.5em 0 .4em; }
.wiki-prose a { color: var(--w-link); text-decoration: none; }
.wiki-prose a:hover { text-decoration: underline; }
.wiki-prose a.l-wiki::after { content: none; }
.wiki-prose a.ext::after { content: "↗"; font-size: .7em; vertical-align: .35em; margin-left: .1em; opacity: .6; }
.wiki-prose ul, .wiki-prose ol { padding-left: 1.3em; }
.wiki-prose li { margin: .25em 0; }
.wiki-prose blockquote { border-left: 3px solid var(--w-accent); padding-left: 1em; margin-left: 0; color: var(--w-ink-2); }
.wiki-prose table { border-collapse: collapse; width: 100%; font-size: .9rem; }
.wiki-prose th, .wiki-prose td { border: 1px solid var(--w-rule); padding: .45em .65em; text-align: left; vertical-align: top; }
.wiki-prose th { background: var(--w-bg); font-weight: 600; }
.table-wrap { overflow-x: auto; }

/* Timeline pages: bold date leads become a monospace gutter. */
.wiki-timeline ul { list-style: none; padding-left: 0; border-left: 2px solid var(--w-rule); margin-left: .3rem; }
.wiki-timeline li { position: relative; padding: .35rem 0 .35rem 1.2rem; }
.wiki-timeline li::before {
  content: ""; position: absolute; left: -6px; top: .95rem;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--w-page); border: 2px solid var(--w-accent);
}
.wiki-timeline li > strong:first-child { font: 600 .82rem/1.2 var(--mono); color: var(--w-accent); letter-spacing: .01em; }

.wiki-backlinks {
  clear: both;
  margin-top: 2.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--w-rule);
  font: .85rem/1.6 var(--sans);
  color: var(--w-ink-2);
}
.wiki-backlinks p { margin: 0 0 .5rem; }
.wiki-backlinks .label { font: 600 .66rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; color: var(--w-muted); margin-right: .6rem; }
.wiki-backlinks a { color: var(--w-link); text-decoration: none; }
.wiki-backlinks .from-present a { font-family: var(--serif); color: var(--accent); font-size: .95rem; }

/* Canon index ------------------------------------------------------------- */

.timeline-cta {
  display: grid; gap: .2rem;
  text-decoration: none;
  padding: 1.1rem clamp(1.1rem, 3vw, 2.4rem);
  background: var(--w-night) !important;
  color: #d8e6ea;
  border-color: var(--w-night) !important;
  background-image: repeating-linear-gradient(135deg, rgba(108,195,207,.08) 0 2px, transparent 2px 10px) !important;
}
.timeline-cta .mono { color: var(--w-glow); }
.timeline-cta strong { font: 650 1.3rem/1.2 var(--sans); color: #fff; }
.timeline-cta span:last-child { font-size: .9rem; color: #a9c0c6; }
.timeline-cta:hover strong { color: var(--w-glow); }

.wiki-group { border-top: 0; padding: 1.4rem clamp(1.1rem, 3vw, 2.4rem) .6rem; }
.wiki-group:last-child { border-bottom: 1px solid var(--w-rule); }
.wiki-group h2 { font: 600 .7rem/1 var(--mono); text-transform: uppercase; letter-spacing: .14em; color: var(--w-muted); margin: 0 0 .6rem; }
.wiki-index { list-style: none; padding: 0; margin: 0; }
.wiki-index li { padding: .75rem 0; border-top: 1px solid var(--w-rule); }
.wiki-index li > a { font: 650 1.08rem/1.3 var(--sans); color: var(--w-ink); text-decoration: none; }
.wiki-index li > a:hover { color: var(--w-link); }
.wiki-index-date { color: var(--w-accent); margin-left: .7rem; font-size: .76rem; }
.wiki-index p { margin: .25rem 0 0; font-size: .9rem; line-height: 1.5; color: var(--w-ink-2); }
