/* Sizes in em: Zakra sets the root font-size to 62.5%, so rem would shrink everything. */
/* World of Boing directory blocks. Colours/fonts come from Elementor globals (theme variants swap them). */
.wob-list, .wob-links, .wob-career ol { list-style: none; margin: 0; padding: 0; }
.wob-list li { padding: .45em 0; border-bottom: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.06)); }
.wob-conn + .wob-conn { margin-top: 1.75em; }
.wob-conn h3 { margin: 0 0 .4em; }
.wob-role, .wob-via { color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-role:not(:empty)::before { content: "· "; }
.wob-years {
	font-family: var(--e-global-typography-data-font-family, "Boing Mono"), monospace;
	font-size: .875em; color: var(--e-global-color-txtsecondary, #98A8B8); white-space: nowrap;
}
.wob-approx { text-decoration: underline dotted; text-underline-offset: .2em; cursor: help; }
.wob-links { display: flex; flex-wrap: wrap; gap: .25em 1.25em; }
.wob-sources { padding-left: 1.5em; color: var(--e-global-color-txtsecondary, #98A8B8); font-size: .875em; }
.wob-sources li { margin: .3em 0; }
.wob-facts { display: flex; flex-wrap: wrap; gap: .5em 2em; margin: 0; }
.wob-facts dt { font-family: var(--e-global-typography-label-font-family, "Boing"), sans-serif; font-size: .8125em; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-facts dd { margin: 0; }
.wob-unverified { margin: .75em 0 0; padding-left: .75em; border-left: 2px solid var(--e-global-color-warning, #E08010); color: var(--e-global-color-txtsecondary, #98A8B8); font-size: .875em; }

/* Career strip: one row per affiliation/credit; the bar is placed on a shared year axis. */
.wob-career { --track: var(--e-global-color-bgsunken, #0A1018); }
.wob-career__row { display: grid; grid-template-columns: 8.5em 1fr; gap: .15em .75em; padding: .4em 0; border-bottom: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.06)); }
.wob-career__track { grid-column: 2; position: relative; height: 10px; background: var(--track); border-radius: 2px; }
.wob-career__bar {
	position: absolute; top: 0; bottom: 0; border-radius: 2px;
	left: calc((var(--s) - var(--min)) / var(--span) * 100%);
	width: max(4px, calc((var(--e) - var(--s)) / var(--span) * 100%));
	background: var(--e-global-color-primary, #00B0D0);
}
.wob-career__row--credit .wob-career__bar { top: 3px; bottom: 3px; background: var(--e-global-color-secondary, #E08010); }
.wob-career__axis { position: relative; height: 1.4em; margin-left: 9.25em; }
.wob-career__axis span {
	position: absolute; left: calc((var(--y) - var(--min)) / var(--span) * 100%); transform: translateX(-50%);
	font-family: var(--e-global-typography-data-font-family, "Boing Mono"), monospace; font-size: .75em; color: var(--e-global-color-txttertiary, #506070);
}
.wob-career__legend { margin: .25em 0 0; font-size: .8125em; color: var(--e-global-color-txtsecondary, #98A8B8); }
@media (max-width: 767px) {
	.wob-career__row { grid-template-columns: 1fr; }
	.wob-career__track, .wob-career__axis { display: none; } /* the list carries the same facts */
}

/* Headings that blocks add for themselves (title="") */
.wob-h { margin: 2em 0 .75em; }

/* Directory: letters, filters, count */
.wob-az { display: flex; flex-wrap: wrap; gap: .15em; margin-bottom: 1em; font-family: var(--e-global-typography-label-font-family, "Boing"), sans-serif; }
.wob-az a { min-width: 2em; padding: .3em .4em; text-align: center; text-decoration: none; border-radius: 4px; }
.wob-az a[aria-current] { background: var(--e-global-color-accentsubtle, rgba(0,176,208,.1)); color: var(--e-global-color-txtprimary, #E0E8F0); }
.wob-filters { display: flex; flex-wrap: wrap; align-items: end; gap: .75em 1.25em; padding: .75em 0; border-top: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.06)); border-bottom: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.06)); }
.wob-filters label { display: flex; flex-direction: column; gap: .25em; font-size: .8125em; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-filters select { min-width: 12em; }
.wob-count { margin: .75em 0 0; font-size: .875em; color: var(--e-global-color-txtsecondary, #98A8B8); }

/* Search results / loop rows */
.wob-result-meta { margin: .2em 0 0; font-size: .875em; }
.wob-type { font-family: var(--e-global-typography-label-font-family, "Boing"), sans-serif; color: var(--e-global-color-secondary, #E08010); margin-right: .5em; }

.wob-lead { font-size: var(--e-global-typography-lead-font-size, 18px); line-height: 1.6; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-lead p { margin: 0; }


/* Directory and search lists */
.wob-rows { list-style: none; margin: 0; padding: 0; }
.wob-row { padding: .9em 0; border-bottom: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.06)); }
.wob-row__title { margin: 0 0 .2em; font-family: var(--e-global-typography-h4-font-family, "Boing"), sans-serif; font-size: var(--e-global-typography-h4-font-size, 20px); line-height: 1.3; }
.wob-row__summary { margin: 0; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-pages { display: flex; flex-wrap: wrap; gap: .4em; margin-top: 1.5em; font-family: var(--e-global-typography-label-font-family, "Boing"), sans-serif; }
.wob-pages .page-numbers { padding: .3em .6em; border-radius: 4px; text-decoration: none; }
.wob-pages .current { background: var(--e-global-color-accentsubtle, rgba(0,176,208,.1)); }
.wob-empty { color: var(--e-global-color-txtsecondary, #98A8B8); }

.wob-filters select { padding: .45em .6em; border-radius: 4px; border: 1px solid var(--e-global-color-borderdefault, rgba(224,232,240,.12));
	background: var(--e-global-color-bgsunken, #0A1018); color: var(--e-global-color-text, #E0E8F0); font: inherit; }

/* Header controls on the dark theme: Elementor's menu toggle defaults to light-theme colours. */
.elementor-menu-toggle { color: var(--e-global-color-txtprimary, #E0E8F0) !important; background: transparent !important; }
.elementor-menu-toggle svg { fill: currentColor !important; } /* Elementor's own fill rule is more specific */

/* Search boxes are the theme's search form (WordPress Search widget) with Relevanssi Live Ajax Search.
   Its script places results in page coordinates, but the Elementor widget wrapper is the positioned parent:
   anchor the panel under the form instead. Zakra's popup close button has no job here. */
.zak-search-container .zak-icon--close { display: none; }
.zak-search-form { position: relative; }
.zak-search-form .relevanssi-live-search-results { left: auto !important; right: 0; top: 100% !important; min-width: 20em; min-height: 0; height: auto !important; margin-top: .25em;
	background: var(--e-global-color-bgelevated, #1A2836); border: 1px solid var(--e-global-color-borderdefault, rgba(224,232,240,.12)); border-radius: 4px; box-shadow: 0 8px 24px rgba(0,0,0,.4); }
.zak-search-form .relevanssi-live-search-result { padding: .4em .75em; border: 0; }
.zak-search-form .relevanssi-live-search-result a { color: var(--e-global-color-txtprimary, #E0E8F0); }
.zak-search-form .relevanssi-live-search-result:hover, .zak-search-form .relevanssi-live-search-result[aria-selected="true"] { background: var(--e-global-color-accentsubtle, rgba(0,176,208,.1)); }
.zak-search-form .relevanssi-live-search-result-status { padding: .4em .75em; font-size: .875em; color: var(--e-global-color-txtsecondary, #98A8B8); }

/* Relationship graphs ([wob_graph], [wob_atlas]) */
.wob-graph { position: relative; margin: 0 0 1.5em; }
.wob-skip { position: absolute; left: -9999px; }
.wob-skip:focus { position: static; display: inline-block; margin-bottom: .5em; }
.wob-graph__controls { display: flex; flex-wrap: wrap; gap: .75em 1.5em; align-items: end; margin-bottom: .75em; font-size: .875em; }
.wob-graph__controls fieldset { border: 0; margin: 0; padding: 0; display: flex; gap: .75em; align-items: center; flex-wrap: wrap; }
.wob-graph__controls legend { float: left; margin-right: .5em; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-graph__controls input[type="range"] { width: 8em; vertical-align: middle; }
.wob-graph__controls output { display: inline-block; min-width: 2.5em; }
.wob-graph__controls input[type="search"], .wob-graph__controls select { background: var(--e-global-color-bgsunken, #0A1018); color: var(--e-global-color-text, #E0E8F0);
	border: 1px solid var(--e-global-color-borderdefault, rgba(224,232,240,.12)); border-radius: 4px; padding: .3em .5em; width: 11em; }
.wob-graph__controls button { padding: .35em .8em; border-radius: 4px; }
.wob-graph__controls button[aria-pressed="true"] { outline: 2px solid var(--e-global-color-primary, #00B0D0); }
.wob-graph__body { position: relative; }
.wob-graph__canvas { height: 28em; border: 1px solid var(--e-global-color-bordersubtle, rgba(224,232,240,.08)); border-radius: 4px; background: var(--e-global-color-bgsunken, #0A1018); }
.wob-graph__card:not(:empty) { margin-top: .75em; font-size: .9375em; }
.wob-graph__card p { margin: 0 0 .3em; }
.wob-graph__name { font-weight: 700; }
.wob-graph__kind { color: var(--e-global-color-txtsecondary, #98A8B8); font-size: .875em; }
.wob-graph__legend { display: flex; flex-wrap: wrap; gap: .25em 2em; margin-top: .6em; font-size: .8125em; color: var(--e-global-color-txtsecondary, #98A8B8); }
.wob-graph__legend ul { display: flex; flex-wrap: wrap; gap: .25em 1.1em; list-style: none; margin: 0; padding: 0; }
.wob-key { display: inline-block; width: .8em; height: .8em; margin-right: .4em; vertical-align: -.05em; background: #E0E8F0; border-radius: 50%; }
.wob-key--organization { background: #98A8B8; border-radius: 2px; }
.wob-key--work { background: #4C5E70; border-radius: 0; clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
.wob-key--line, .wob-key--dashed { width: 1.6em; height: 0; border-radius: 0; background: none; border-top: 2px solid #4A5A6C; vertical-align: .25em; }
.wob-key--dashed { border-top-style: dashed; }
/* Atlas: full viewport under the header, card beside the canvas on wide screens. */
.wob-graph--atlas { padding: 1em 24px 0; }
.wob-graph--atlas .wob-graph__canvas { height: calc(100vh - 14em); min-height: 24em; }
@media (min-width: 64em) {
	.wob-graph--atlas .wob-graph__body { display: grid; grid-template-columns: 1fr 18em; gap: 1em; }
	.wob-graph--atlas .wob-graph__card:not(:empty) { margin-top: 0; }
}
@media (max-width: 40em) { .wob-graph__canvas { height: 22em; } }