/* UAP Encyclopedia — classic encyclopedia layout (contents left, serif headings, infobox right,
   numbered references, categories) on liquid-glass panels. Used by article pages of kind "wiki" and the Articles main page. */
:root {
  --wk-link: #8ab4ff;
  --wk-link-visited: #b9a6ff;
  --wk-serif: "Linux Libertine", "Georgia", "Times", "Source Serif Pro", serif;
  --wk-rule: rgba(255, 255, 255, .16);
  --wk-box-h: rgba(120, 160, 255, .14);
  --wk-box-h2: rgba(94, 240, 192, .12);
  --wk-infobox: rgba(255, 255, 255, .05);
}
:root[data-theme="light"] {
  --wk-link: #3366cc;
  --wk-link-visited: #6a60b0;
  --wk-rule: #a2a9b1;
  --wk-box-h: #cedff2;
  --wk-box-h2: #cef2e0;
  --wk-infobox: rgba(248, 249, 250, .78);
}

/* ---------- Article page ---------- */
.wk-page { width: 100%; max-width: 1400px; margin: 0 auto; padding: 14px clamp(10px, 2vw, 24px) 56px; }
.wk-shell { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 20px; align-items: start; }
.wk-side { position: sticky; top: calc(var(--topbar-h) + 14px); display: grid; gap: 14px; max-height: calc(100vh - var(--topbar-h) - 28px); overflow: auto; scrollbar-width: thin; }
.wk-sbox { border-radius: 16px; padding: 12px 14px; font-size: 14px; }
.wk-sbox-h { font-weight: 700; font-size: 13px; padding-bottom: 6px; margin-bottom: 6px; border-bottom: 1px solid var(--wk-rule); color: var(--text-2); }
.wk-toc { display: grid; gap: 1px; }
.wk-toc a, .wk-nav a { display: block; padding: 4px 6px; border-radius: 8px; color: var(--wk-link); text-decoration: none; line-height: 1.3; }
.wk-toc a:hover, .wk-nav a:hover { background: var(--field); text-decoration: none; }
.wk-toc a[data-level="3"] { padding-left: 18px; font-size: 13px; }
.wk-toc a[data-level="4"] { padding-left: 30px; font-size: 13px; }
.wk-toc a.is-active { color: var(--text); font-weight: 700; background: var(--field); }
.wk-nav { display: grid; }

.wk-main { border-radius: 22px; padding: clamp(16px, 3vw, 34px) clamp(16px, 3.4vw, 44px) 28px; min-width: 0; }
.wk-title { font-family: var(--wk-serif); font-weight: 400; font-size: clamp(28px, 4.2vw, 40px); line-height: 1.2; margin: 0; padding-bottom: 6px; border-bottom: 1px solid var(--wk-rule); letter-spacing: 0; }
.wk-tabbar { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-bottom: 1px solid var(--wk-rule); margin-bottom: 8px; font-size: 14px; }
.wk-tabbar > div { display: flex; gap: 2px; flex-wrap: wrap; }
.wk-tabbar a, .wk-tabbar button { padding: 8px 10px 7px; color: var(--wk-link); background: none; border: 0; border-bottom: 2px solid transparent; font: inherit; cursor: pointer; text-decoration: none; border-radius: 0; }
.wk-tabbar a:hover, .wk-tabbar button:hover { border-bottom-color: var(--wk-rule); text-decoration: none; }
.wk-tabbar .on { color: var(--text); border-bottom-color: var(--text); }
.wk-tagline { font-size: 13px; color: var(--text-2); margin: 4px 0 14px; }
.wk-tagline a { color: var(--wk-link); }

.wk-ambox { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 18px; padding: 10px 14px; border: 1px solid var(--wk-rule); border-left: 8px solid #fc3; border-radius: 4px 12px 12px 4px; background: rgba(255, 204, 51, .08); font-size: 14px; line-height: 1.5; }
.wk-ambox > span { font-size: 26px; line-height: 1; }
.wk-ambox a { color: var(--wk-link); }

/* body text */
.wk-body { font-size: 16px; line-height: 1.65; overflow-wrap: break-word; }
.wk-body::after { content: ""; display: table; clear: both; }
.wk-body p { margin: .5em 0 1em; }
.wk-body a { color: var(--wk-link); text-decoration: none; }
.wk-body a:hover { text-decoration: underline; }
.wk-body a.wl { border: 0; text-decoration: none; }
.wk-body a.wl:hover { text-decoration: underline; }
.wk-body h2 { font-family: var(--wk-serif); font-weight: 400; font-size: 1.6em; line-height: 1.3; margin: 1.1em 0 .4em; padding-bottom: 3px; border-bottom: 1px solid var(--wk-rule); letter-spacing: 0; overflow: hidden; }
.wk-body h3 { font-size: 1.15em; font-weight: 700; margin: .9em 0 .3em; }
.wk-body ul, .wk-body ol { margin: .3em 0 1em 1.6em; padding: 0; }
.wk-body li { margin-bottom: .2em; }
.wk-body sup.cite { font-size: .72em; line-height: 0; white-space: nowrap; }
.wk-body sup.cite a { color: var(--wk-link); }
.wk-body blockquote { margin: 1em 2em; padding: 0 1em; border-left: 3px solid var(--wk-rule); color: var(--text-2); }

/* infobox */
.wk-body .infobox { float: right; clear: right; width: 290px; max-width: 290px; margin: .3em 0 1em 1.4em; padding: 4px; border: 1px solid var(--wk-rule); border-radius: 10px; background: var(--wk-infobox); font-size: 13.5px; line-height: 1.45; -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); box-shadow: none; }
.wk-body .infobox-title { font-family: var(--wk-serif); font-weight: 700; font-size: 1.2em; text-align: center; padding: 8px; margin: 0 0 4px; border: 0; border-radius: 7px; background: var(--wk-box-h); }
.wk-body .infobox table { width: 100%; border-collapse: collapse; }
.wk-body .infobox th, .wk-body .infobox td { padding: 5px 6px; vertical-align: top; border: 0; border-top: 1px solid var(--panel-line); }
.wk-body .infobox tr:first-child th, .wk-body .infobox tr:first-child td { border-top: 0; }
.wk-body .infobox th { width: 38%; text-align: left; font-weight: 700; color: var(--text); white-space: normal; padding-right: 8px; }

/* references */
.wk-body .references { margin: 0; padding: 0; border: 0; font-size: 14px; color: var(--text); columns: 2 22em; column-gap: 2em; }
.wk-body .references ol { margin: 0 0 0 1.8em; display: block; }
.wk-body .references li { break-inside: avoid; margin-bottom: .35em; }
.wk-body .references li:target { background: rgba(138, 180, 255, .16); border-radius: 4px; }
.wk-body .references small { color: var(--text-2); }
.wk-body .see-also { margin: 1em 0; padding: 12px 14px; border: 1px solid var(--wk-rule); border-radius: 12px; background: var(--wk-infobox); }
.wk-body .see-also-title { font-family: var(--wk-serif); font-size: 1.15em; text-transform: none; letter-spacing: 0; color: var(--text); margin-bottom: 6px; }
.wk-body .see-also ul { columns: 2 14em; margin: 0 0 0 1.2em; }
.wk-body .wiki-events li small { color: var(--text-2); }

.wk-cats { margin-top: 26px; padding: 8px 12px; border: 1px solid var(--wk-rule); border-radius: 10px; font-size: 13.5px; background: var(--wk-infobox); }
.wk-cats a { color: var(--wk-link); }
.wk-foot { margin: 16px 0 0; font-size: 12.5px; color: var(--text-2); }
.wk-talk { max-width: 1100px; margin: 22px auto 0; padding: 18px 22px; border-radius: 22px; }
.wk-talk h2 { font-family: var(--wk-serif); font-weight: 400; }
.wk-talk-note { margin: -4px 0 12px; font-size: 14px; }
.wk-toc-m { display: none; border-radius: 12px; padding: 8px 12px; margin: 0 0 14px; font-size: 14px; }
.wk-toc-m summary { font-weight: 700; cursor: pointer; }
.wk-toc-m summary span { color: var(--text-2); font-weight: 400; }
.wk-toc-m nav { display: grid; margin-top: 6px; }
.wk-toc-m nav a { color: var(--wk-link); padding: 4px 0; }
.wk-toc-m nav a[data-level="3"] { padding-left: 14px; }

@media (max-width: 980px) {
  .wk-shell { grid-template-columns: minmax(0, 1fr); }
  .wk-side { display: none; }
  .wk-toc-m { display: block; }
}
@media (max-width: 640px) {
  .wk-page { padding-left: 8px; padding-right: 8px; }
  .wk-main { border-radius: 18px; padding: 16px 16px 22px; }
  .wk-body { font-size: 15.5px; }
  .wk-body .infobox { float: none; width: auto; max-width: none; margin: 0 0 1em; }
  .wk-tabbar a, .wk-tabbar button { padding: 7px 7px 6px; }
  .wk-body .references { columns: 1; }
}

/* ---------- Main page (/articles) ---------- */
.wkm { max-width: 1240px; }
.wk-tabs { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; flex-wrap: wrap; border-bottom: 1px solid var(--wk-rule); margin: 4px 0 16px; }
.wk-tabs-l { display: flex; gap: 2px; flex-wrap: wrap; }
.wk-tabs-l a { padding: 9px 12px 8px; color: var(--wk-link); border-bottom: 2px solid transparent; text-decoration: none; font-size: 15px; }
.wk-tabs-l a:hover { border-bottom-color: var(--wk-rule); text-decoration: none; }
.wk-tabs-l a[aria-current] { color: var(--text); border-bottom-color: var(--text); font-weight: 600; }
.wk-tabs-r { display: flex; gap: 8px; padding-bottom: 8px; }
.wkm-welcome { border-radius: 24px; padding: 22px clamp(16px, 3vw, 30px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 420px); gap: 14px 24px; align-items: center; margin-bottom: 18px; }
.wkm-welcome h1 { font-family: var(--wk-serif); font-weight: 400; font-size: clamp(26px, 3.6vw, 36px); line-height: 1.2; margin: 0; letter-spacing: 0; }
.wkm-welcome h1 span { color: var(--wk-link); }
.wkm-welcome p { margin: 4px 0 0; color: var(--text-2); }
.wkm-count { font-size: 14px; }
.wkm-count b { color: var(--text); }
.wkm-search { display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 14px; border-radius: 999px; background: var(--field); border: 1px solid var(--panel-line); }
.wkm-search svg { width: 18px; height: 18px; fill: var(--text-2); flex: none; }
.wkm-search input { flex: 1; min-width: 0; border: 0; background: none; color: var(--text); font-size: 16px; padding: 6px 0; outline: none; }
.wkm-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14px; }
.wkm-links a { color: var(--wk-link); }
.wkm-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 18px; align-items: start; }
.wkm-col { display: grid; gap: 18px; }
.wkm-box { border-radius: 20px; overflow: hidden; }
.wkm-wide { margin-top: 18px; }
.wkm-h { font-family: var(--wk-serif); font-weight: 700; font-size: 18px; margin: 0; padding: 8px 16px; background: var(--wk-box-h2); border-bottom: 1px solid var(--wk-rule); letter-spacing: 0; }
.wkm-news .wkm-h, .wkm-otd .wkm-h, .wkm-wide .wkm-h { background: var(--wk-box-h); }
.wkm-b { padding: 12px 16px 14px; margin: 0; font-size: 15px; line-height: 1.55; }
ul.wkm-b, .wkm-b ul { padding-left: 34px; margin: 0; }
.wkm-b li { margin-bottom: 6px; }
.wkm-b a { color: var(--wk-link); }
.wkm-ft { font-weight: 700; }
.wkm-small { font-size: 13px; color: var(--text-2); margin: 6px 0 0; }
.wkm-b.wk-pills a { color: var(--text); }
.wkm-decades { display: grid; gap: 6px; }
.wkm-decades b { display: inline-block; min-width: 54px; font-family: var(--wk-serif); }
.wkm-decades a { margin-right: 8px; font-variant-numeric: tabular-nums; }
.wkm-other li { margin-bottom: 4px; }
@media (max-width: 820px) {
  .wkm-welcome, .wkm-grid { grid-template-columns: minmax(0, 1fr); }
  .wk-tabs-r .btn span { display: none; }
}
@media (max-width: 560px) {
  .wk-tabs-l a { padding: 8px 8px 7px; font-size: 14px; }
  .wk-tabs-r .btn.ghost { display: none; }
}
.wk-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.wk-pills a { padding: 5px 12px; border-radius: 999px; background: var(--field); border: 1px solid var(--panel-line); color: var(--text); font-size: 14px; text-decoration: none; }
.wk-pills a:hover { border-color: var(--wk-link); text-decoration: none; }

/* pictures (app/wiki_pics.php): main picture in the infobox, one beside each section */
.wk-body .infobox-image { margin: 0 0 6px; }
.wk-fig { float: right; clear: right; width: 300px; margin: .35em 0 1em 1.4em; padding: 4px; border: 1px solid var(--wk-rule); border-radius: 10px; background: var(--wk-infobox); font-size: 12.5px; line-height: 1.4; }
.wk-fig.wk-fig-main { float: none; width: auto; margin: 0; border: 0; padding: 0; background: none; }
.wk-fig-img { display: block; border-radius: 7px; overflow: hidden; background: rgba(0, 0, 0, .25); }
.wk-fig img { display: block; width: 100%; height: auto; max-height: 360px; object-fit: contain; margin: 0 auto; }
.wk-fig-illus img { aspect-ratio: 16 / 9; object-fit: cover; }
.wk-fig figcaption { padding: 6px 4px 2px; color: var(--text-2); }
.wk-fig .wk-credit { display: block; margin-top: 3px; font-size: 11px; opacity: .8; }
.wk-fig .wk-credit a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; }
.wk-body h2 + .wk-fig + p { margin-top: .5em; }
@media (max-width: 760px) {
  .wk-fig { float: none; width: auto; margin: .4em 0 1em; }
  .wk-fig img { max-height: 300px; }
}

/* Contents list: no dot (it sat on top of the first letters); the current section gets a bar on the left edge instead */
.wk-toc .toc-link::before, .wk-toc-m .toc-link::before { content: none; display: none; }
.wk-toc a.toc-link { padding-left: 8px; border-left: 2px solid transparent; border-radius: 0 8px 8px 0; }
.wk-toc a.toc-link.is-active { border-left-color: var(--accent); }
.wk-body .dead-link { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 6px; font-size: 11px; font-weight: 600; color: var(--danger, #ff6b6b); background: rgba(255, 80, 80, .12); vertical-align: 1px; }

/* Today's featured article (Articles main page and /wiki) */
.wkm-feat-pic { width: 240px; margin: 2px 0 8px 14px; }
.wk-featured { padding: 18px 20px; border-radius: 20px; margin: 18px 0; overflow: hidden; }
.wk-featured h2 { margin: 0 0 10px; font-size: 20px; }
.wk-featured::after { content: ""; display: table; clear: both; }
.wk-featured p { margin: 0 0 10px; line-height: 1.55; }
@media (max-width: 760px) { .wkm-feat-pic { float: none; width: auto; margin: 0 0 10px; } }