/*
 * Thought.global — the shared ending (thought/finale/finale.php): "the wider sky, and the road home".
 * The homepage's ending (home/assets/world.css "VII — The wider sky") copied value for value and scoped to
 * .th-finale, so it looks the same inside any page module. Self-contained: own tokens, own glyph rules.
 *
 * Layering with the golden thread (thought/thread/): the section paints its sky BELOW the thread layer
 * (no z-index, no isolation here on purpose); the content wrap (3) and the seal (4) paint above it, so the
 * line passes behind the doors and through the seal, the lane star and into the observatory door.
 */

@font-face {
	font-family: "Thought Display";
	src: url("../../home/assets/fonts/fraunces-latin-var.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.th-finale {
	--thf2-night: #060a15; --thf2-ground: #080d16; --thf2-indigo: #0b1426;
	--thf2-gold: #c9a35e; --thf2-gold-hi: #e3c58c;
	--thf2-bone: #f1ede4; --thf2-bone-2: #d2cbbb; --thf2-bone-3: #a6aec0;
	--thf2-display: "Thought Display", "Iowan Old Style", Baskerville, Georgia, "Times New Roman", serif;
	--thf2-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--thf2-ease: cubic-bezier(.2, .7, .2, 1);
	--thf2-gutter: clamp(18px, 4vw, 48px);
	--thf2-lane: 14px; --thf2-indent: 64px; --thf2-seam: 150px;
	--thf2-stars: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='380'%3E%3Cg fill='%23f3ead2'%3E%3Ccircle cx='12' cy='22' r='.8' opacity='.7'/%3E%3Ccircle cx='64' cy='88' r='.6' opacity='.5'/%3E%3Ccircle cx='121' cy='31' r='1' opacity='.8'/%3E%3Ccircle cx='170' cy='140' r='.5' opacity='.45'/%3E%3Ccircle cx='232' cy='60' r='.7' opacity='.6'/%3E%3Ccircle cx='300' cy='18' r='.6' opacity='.5'/%3E%3Ccircle cx='352' cy='104' r='.9' opacity='.75'/%3E%3Ccircle cx='28' cy='196' r='.5' opacity='.45'/%3E%3Ccircle cx='96' cy='244' r='.8' opacity='.6'/%3E%3Ccircle cx='150' cy='300' r='.6' opacity='.5'/%3E%3Ccircle cx='210' cy='212' r='1.1' opacity='.85'/%3E%3Ccircle cx='268' cy='276' r='.5' opacity='.4'/%3E%3Ccircle cx='330' cy='230' r='.7' opacity='.6'/%3E%3Ccircle cx='370' cy='330' r='.6' opacity='.5'/%3E%3Ccircle cx='50' cy='350' r='.9' opacity='.7'/%3E%3Ccircle cx='190' cy='366' r='.5' opacity='.4'/%3E%3Ccircle cx='250' cy='150' r='.4' opacity='.4'/%3E%3Ccircle cx='80' cy='150' r='.4' opacity='.35'/%3E%3Ccircle cx='310' cy='170' r='.4' opacity='.35'/%3E%3C/g%3E%3C/svg%3E");
	position: relative; display: block; margin: 0; padding: 0; overflow-x: clip;
	color: var(--thf2-bone); font: 400 17px/1.6 var(--thf2-sans); text-align: left;
	background: radial-gradient(760px 380px at 50% 96%, rgba(243, 234, 210, .12), transparent 70%), var(--thf2-stars) 40px 120px / 380px 380px, linear-gradient(#0b1324, var(--thf2-night) 66%, var(--thf2-ground));
	-webkit-font-smoothing: antialiased;
}
.th-finale *, .th-finale *::before, .th-finale *::after { box-sizing: border-box; }
.th-finale :focus-visible { outline: 2px solid var(--thf2-gold-hi); outline-offset: 3px; border-radius: 12px; }

/* ---------- the seam: hills drawn in the colour of the section above, the seal on the thread ---------- */
.th-finale .th-finale-seam { position: relative; height: var(--thf2-seam); pointer-events: none; color: var(--th-finale-from, var(--thf2-night)); --seal-y: 80%; }
.th-finale .th-finale-edge { position: absolute; left: 0; top: -1px; display: block; width: 100%; height: calc(100% + 1px); }
.th-finale .th-finale-edge path { fill: currentColor; }
.th-finale .th-finale-seal { position: absolute; left: 50%; top: var(--seal-y); z-index: 4; display: grid; place-items: center; width: 58px; height: 58px; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle at 50% 34%, #1f2a48, #0b1426 72%); box-shadow: 0 0 0 1.5px var(--thf2-gold), 0 0 0 5px rgba(11, 20, 38, .9), 0 0 0 6px rgba(201, 163, 94, .45), 0 12px 30px -12px rgba(0, 0, 0, .7); color: var(--thf2-gold-hi); transition: box-shadow .6s var(--thf2-ease); }
.th-finale .th-finale-seal.is-lit { box-shadow: 0 0 0 1.5px var(--thf2-gold-hi), 0 0 0 5px rgba(11, 20, 38, .9), 0 0 0 6px rgba(227, 197, 140, .75), 0 0 34px 8px rgba(227, 197, 140, .38); }
.th-finale .th-finale-seal-n { display: grid; place-items: center; font: 500 19px/1 var(--thf2-display); font-variation-settings: "opsz" 48, "SOFT" 50; letter-spacing: .02em; }
.th-finale .th-finale-spark { width: 18px; height: 18px; flex: none; fill: currentColor; }
.th-finale .th-finale-place { position: absolute; left: 50%; top: calc(var(--seal-y) + 40px); transform: translateX(-50%); font: 700 10.5px/1 var(--thf2-sans); letter-spacing: .24em; text-transform: uppercase; white-space: nowrap; color: rgba(201, 163, 94, .85); }

/* ---------- the heading ---------- */
.th-finale .th-finale-wrap { position: relative; z-index: 3; width: min(1200px, 100% - 2 * var(--thf2-gutter)); margin-inline: auto; padding-top: clamp(40px, 4vw, 58px); }
.th-finale .th-finale-head { max-width: 820px; margin-inline: auto; text-align: center; }
.th-finale .th-finale-mark { display: flex; align-items: center; justify-content: center; gap: .65em; margin: 0 0 22px; font: 700 12.5px/1.2 var(--thf2-sans); letter-spacing: .17em; text-transform: uppercase; color: var(--thf2-gold); }
.th-finale .th-finale-num { display: inline-flex; align-items: center; padding-right: .8em; border-right: 1px solid rgba(201, 163, 94, .5); font: 500 16px/1 var(--thf2-display); font-variation-settings: "opsz" 36; letter-spacing: .04em; color: var(--thf2-gold-hi); }
.th-finale .th-finale-star { display: none; }
.th-finale .th-finale-title { margin: 0; font-family: var(--thf2-display); font-size: clamp(2.2rem, 1.25rem + 2.9vw, 3.9rem); line-height: 1.02; font-weight: 400; font-style: normal; font-variation-settings: "SOFT" 60, "WONK" 0, "opsz" 144; letter-spacing: -.018em; text-transform: none; text-wrap: balance; color: var(--thf2-bone); }
.th-finale .th-finale-title em { font-style: normal; font-weight: 420; font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144; color: var(--thf2-gold-hi); }
.th-finale .th-finale-note { max-width: 60ch; margin: 16px auto 0; color: var(--thf2-bone-2); font-size: 16.5px; line-height: 1.55; }

/* ---------- glyphs (the Brain's vocabulary; same rules as the homepage) ---------- */
.th-finale .th-finale-glyph { width: 26px; height: 26px; flex: none; fill: currentColor; }
.th-finale .th-finale-glyph .sh-brain-glyph__ring, .th-finale .th-finale-glyph .ring, .th-finale .th-finale-glyph .stroke, .th-finale .th-finale-glyph .sh-brain-glyph__open { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.th-finale .th-finale-glyph .sh-brain-glyph__open { stroke-dasharray: 4.2 3.6; }
.th-finale .th-finale-glyph .sh-brain-glyph__cut { fill: none; stroke: var(--thf2-night); stroke-width: 1.6; stroke-linecap: round; }
.th-finale .th-finale-glyph--debate path:first-child, .th-finale .th-finale-glyph--debate path + path { fill: none; stroke: currentColor; stroke-width: 1.6; }
.th-finale .th-finale-glyph--question circle { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-dasharray: 4.2 3.6; }
.th-finale .th-finale-glyph--probe circle { fill: none; stroke: currentColor; stroke-width: 1.6; }
.th-finale .th-finale-glyph--probe path { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

/* ---------- page-specific next steps (optional), above the doors ---------- */
.th-finale .th-finale-next { display: grid; gap: 12px; max-width: 780px; margin: 38px auto 0; }
.th-finale .th-finale-main { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 22px 26px; border: 1px solid rgba(201, 163, 94, .42); border-radius: 22px; color: var(--thf2-bone); text-decoration: none; background: radial-gradient(420px 160px at 0% 0%, rgba(201, 163, 94, .16), transparent 70%), rgba(6, 10, 21, .58); box-shadow: 0 18px 50px -30px rgba(0, 0, 0, .9); transition: border-color .22s var(--thf2-ease), background-color .22s var(--thf2-ease); }
.th-finale .th-finale-main:hover, .th-finale .th-finale-main:focus-visible { border-color: var(--thf2-gold-hi); background-color: rgba(11, 20, 38, .8); }
.th-finale .th-finale-main-star, .th-finale .th-finale-door-star { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; border: 1px solid rgba(201, 163, 94, .6); color: var(--thf2-gold-hi); background: radial-gradient(circle, rgba(201, 163, 94, .22), rgba(6, 10, 21, .9) 70%); box-shadow: 0 0 26px rgba(227, 197, 140, .16); transition: transform .22s var(--thf2-ease), box-shadow .22s var(--thf2-ease); }
.th-finale .th-finale-main-copy { display: grid; gap: 4px; min-width: 0; }
.th-finale .th-finale-main small, .th-finale .th-finale-more small { color: var(--thf2-gold); font: 700 11px/1.3 var(--thf2-sans); letter-spacing: .16em; text-transform: uppercase; }
.th-finale .th-finale-main strong { font: 450 clamp(1.3rem, 1.1rem + .6vw, 1.6rem)/1.2 var(--thf2-display); font-variation-settings: "SOFT" 60, "opsz" 72; overflow-wrap: anywhere; }
.th-finale .th-finale-main em, .th-finale .th-finale-more em { color: var(--thf2-bone-3); font-style: normal; font-size: 14px; line-height: 1.45; }
.th-finale .th-finale-main-go { color: var(--thf2-gold-hi); font-size: 22px; transition: transform .22s var(--thf2-ease); }
.th-finale .th-finale-main:hover .th-finale-main-go, .th-finale .th-finale-main:focus-visible .th-finale-main-go { transform: translateX(4px); }
.th-finale .th-finale-more { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.th-finale .th-finale-more li { margin: 0; }
.th-finale .th-finale-more a { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 14px; height: 100%; padding: 12px 16px; border: 1px solid rgba(201, 163, 94, .22); border-radius: 16px; color: var(--thf2-bone); text-decoration: none; background: rgba(6, 10, 21, .4); transition: border-color .22s var(--thf2-ease); }
.th-finale .th-finale-more a:hover, .th-finale .th-finale-more a:focus-visible { border-color: rgba(227, 197, 140, .7); }
.th-finale .th-finale-more-star { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(201, 163, 94, .45); color: var(--thf2-gold-hi); }
.th-finale .th-finale-more-star .th-finale-glyph { width: 20px; height: 20px; }
.th-finale .th-finale-more-copy { display: grid; gap: 2px; min-width: 0; }
.th-finale .th-finale-more b { font: 450 1.05rem/1.25 var(--thf2-display); overflow-wrap: anywhere; }
.th-finale .th-finale-or { display: flex; align-items: center; gap: 16px; max-width: 520px; margin: 52px auto 0; color: var(--thf2-gold); font: 700 11.5px/1.3 var(--thf2-sans); letter-spacing: .2em; text-transform: uppercase; }
.th-finale .th-finale-or::before, .th-finale .th-finale-or::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(201, 163, 94, .45)); }
.th-finale .th-finale-or::after { background: linear-gradient(90deg, rgba(201, 163, 94, .45), transparent); }
.th-finale.th-finale--next .th-finale-chart { margin-top: 14px; }

/* ---------- the doors constellation (the homepage's slots) ---------- */
.th-finale .th-finale-chart { position: relative; max-width: 1100px; height: 400px; margin: 34px auto 0; }
.th-finale .th-finale-chart-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.th-finale .th-finale-chart-path { fill: none; stroke: rgba(201, 163, 94, .5); stroke-width: 1.2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.th-finale .th-finale-chart-path--soft { stroke: rgba(201, 163, 94, .32); stroke-dasharray: 2 7; }
.th-finale .th-finale-chart ul { margin: 0; padding: 0; list-style: none; }
.th-finale .th-finale-door { position: absolute; left: var(--x); top: var(--y); margin: 0; transform: translate(-50%, -28px); }
.th-finale .th-finale-door a { display: grid; justify-items: center; gap: 8px; width: 176px; padding: 4px 8px 10px; border-radius: 16px; text-align: center; text-decoration: none; color: var(--thf2-bone); }
.th-finale .th-finale-door a:hover .th-finale-door-star, .th-finale .th-finale-door a:focus-visible .th-finale-door-star, .th-finale .th-finale-main:hover .th-finale-main-star, .th-finale .th-finale-main:focus-visible .th-finale-main-star { transform: scale(1.08); box-shadow: 0 0 0 4px rgba(227, 197, 140, .12), 0 0 34px 6px rgba(227, 197, 140, .45); }
.th-finale .th-finale-door b { font: 450 1.08rem/1.2 var(--thf2-display); }
.th-finale .th-finale-door b, .th-finale .th-finale-door small { text-shadow: 0 0 2px #070c19, 0 0 7px #070c19, 0 0 12px #070c19; }
.th-finale .th-finale-door small { color: var(--thf2-bone-3); font-size: 12.5px; line-height: 1.35; }
.th-finale .th-finale-closing { max-width: 54ch; margin: 18px auto 0; text-align: center; color: var(--thf2-bone-2); font: 400 1.18rem/1.5 var(--thf2-display); font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 24; }

/* ---------- the road home ---------- */
.th-finale .th-finale-home { position: relative; height: 260px; margin-top: 10px; }
.th-finale .th-finale-art { position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 100%; }
.th-finale .th-finale-stars circle { fill: #f3ead2; opacity: .75; }
.th-finale .th-finale-hill { fill: #04060c; }
.th-finale .th-finale-hill--far { fill: #0b1426; }
.th-finale .th-finale-road { fill: none; stroke: rgba(227, 197, 140, .4); stroke-width: 1.5; stroke-dasharray: 2 6; stroke-linecap: round; }
.th-finale .th-finale-obs-body, .th-finale .th-finale-obs-dome { fill: #04060c; }
.th-finale .th-finale-obs-slit { fill: #e8c27a; }
.th-finale .th-finale-obs-door { fill: #f2c879; transition: fill .6s var(--thf2-ease); }
.th-finale .th-finale-obs-door.is-lit { fill: #fff0c8; }
.th-finale .th-finale-obs-scope { fill: none; stroke: #04060c; stroke-width: 6; stroke-linecap: round; }
.th-finale .th-finale-tree path { fill: none; stroke: #04060c; stroke-width: 3; stroke-linecap: round; }
.th-finale .th-finale-tree circle { fill: #04060c; }
.th-finale .th-finale-obsy { filter: drop-shadow(0 0 1px rgba(160, 180, 220, .35)); }

/* ---------- the thread's lane (desktop), as on the homepage ---------- */
@media (min-width: 1100px) {
	.th-finale .th-finale-wrap { padding-left: var(--thf2-indent); }
	.th-finale .th-finale-head { padding-left: 0; }
	.th-finale .th-finale-star { display: block; position: absolute; left: var(--thf2-lane); width: 16px; height: 16px; margin-top: -1px; transform: translateX(-50%) rotate(45deg); border-radius: 3px; background: var(--thf2-indigo); box-shadow: 0 0 0 1.5px var(--thf2-gold), 0 0 0 4px rgba(201, 163, 94, .14); transition: box-shadow .5s var(--thf2-ease), background-color .5s var(--thf2-ease); }
	.th-finale .th-finale-star.is-lit { background: var(--thf2-gold-hi); box-shadow: 0 0 0 1.5px var(--thf2-gold-hi), 0 0 0 4px rgba(227, 197, 140, .25), 0 0 18px 3px rgba(227, 197, 140, .55); }
}

/* ---------- responsive (the homepage's breakpoints) ---------- */
@media (max-width: 1099px) { .th-finale .th-finale-num { font-size: 15px; } }
@media (max-width: 760px) {
	.th-finale { --thf2-seam: 112px; }
	.th-finale .th-finale-chart { height: auto; margin-top: 30px; }
	.th-finale .th-finale-chart-art { display: none; }
	.th-finale .th-finale-chart ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
	.th-finale .th-finale-door { position: static; transform: none; }
	.th-finale .th-finale-door a { width: auto; padding: 14px 8px; border: 1px solid rgba(201, 163, 94, .2); background: rgba(6, 10, 21, .4); }
	.th-finale .th-finale-main { grid-template-columns: auto minmax(0, 1fr); gap: 16px; padding: 18px; }
	.th-finale .th-finale-main-go { display: none; }
	.th-finale .th-finale-more { grid-template-columns: minmax(0, 1fr); }
	.th-finale .th-finale-or { margin-top: 40px; }
}
@media (max-width: 560px) {
	.th-finale .th-finale-seal { width: 48px; height: 48px; }
	.th-finale .th-finale-seal-n { font-size: 16px; }
	.th-finale .th-finale-place { top: calc(var(--seal-y) + 34px); font-size: 9.5px; letter-spacing: .2em; }
	.th-finale .th-finale-home { height: 200px; }
	.th-finale .th-finale-chart ul { grid-template-columns: minmax(0, 1fr); }
	.th-finale .th-finale-door a { grid-template-columns: 48px minmax(0, 1fr); justify-items: start; text-align: left; column-gap: 14px; row-gap: 2px; padding: 12px 14px; }
	.th-finale .th-finale-door-star { grid-row: 1 / span 2; width: 48px; height: 48px; }
	.th-finale .th-finale-main-star { width: 48px; height: 48px; }
}

/* ---------- motion off: complete and still ---------- */
@media (prefers-reduced-motion: reduce) {
	.th-finale *, .th-finale *::before, .th-finale *::after { transition: none !important; animation: none !important; }
}

/* ---------- print: the doors as a plain list ---------- */
@media print {
	.th-finale { background: #fff !important; color: #000 !important; }
	.th-finale .th-finale-seam, .th-finale .th-finale-chart-art, .th-finale .th-finale-home, .th-finale .th-finale-star { display: none !important; }
	.th-finale .th-finale-title, .th-finale .th-finale-door a, .th-finale .th-finale-main, .th-finale .th-finale-more a, .th-finale .th-finale-closing { color: #000 !important; }
	.th-finale .th-finale-chart { height: auto; }
	.th-finale .th-finale-door { position: static; transform: none; }
}