.technology-page { max-width: 65rem; margin: 2rem auto; padding: 0 1rem; overflow-wrap: anywhere; line-height: 1.6; }
.technology-page a { color: var(--accent-strong); text-underline-offset: .15em; }
.technology-page button { padding: .5rem 1rem; }
.technology-reference { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); padding: 1rem 1.25rem; margin-top: 1.5rem; scroll-margin-top: 6rem; }
.technology-reference h2 { margin-top: 0; }
.technology-page .technology-disclosure { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.technology-page .technology-disclosure > summary { padding: .5rem 1rem; min-height: 2.75rem; }
.technology-page .technology-explanation { border: 0; max-width: none; }
.technology-ranks { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.technology-ranks th, .technology-ranks td { padding: .4rem .65rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.technology-ranks thead th { background: var(--surface-raised); }
.technology-ranks th:first-child { width: 4rem; white-space: nowrap; }
.technology-ranks tbody tr:last-child > * { border-bottom: 0; }
@media (max-width: 30rem) {
	.technology-reference { padding: 1rem .75rem; }
	.technology-ranks { font-size: .9rem; }
	.technology-ranks th, .technology-ranks td { padding: .4rem; }
	.technology-ranks th:first-child { width: 3.5rem; }
}
#technology-timeline li { margin-block: .6rem; }
.khanate-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-block: 1.5rem; }
.khanate-heading h1 { flex: 1 1 12rem; margin: 0; }
.khanate-vassals { margin-block: 1.5rem; border: 1px solid var(--border); border-radius: var(--radius); padding: .75rem 1rem; background: var(--surface); }
.khanate-vassals summary { cursor: pointer; }
.khanate-vassals > summary { font-size: 1.1rem; }
.khanate-vassal-label { display: inline; }
.khanate-vassal-stats { display: block; font-size: .9rem; color: var(--text-muted); padding-left: 1.5rem; }
.khanate-vassal-finder { display: block; font-size: .9rem; padding-left: 1.5rem; }
.khanate-vassals ul { padding-left: 1.5rem; }
.khanate-vassals li { margin-block: .5rem; }
.khanate-vassal-marker { display: inline-flex; vertical-align: middle; margin-right: .5rem; }
.khanate-coat { display: inline-flex; width: 8rem; height: 8rem; flex: 0 0 8rem; }
html[data-heraldry="coats"] .khanate-coat .heraldry-emblem.coat-loaded,
html[data-heraldry="coats"] .khanate-coat .coat-image { width: 8rem; height: 8rem; flex-basis: 8rem; }
.technology-page h1 { font-size: 1.8rem; }
.technology-date-table { width: 100%; border-collapse: collapse; margin-block: 1.5rem; }
.technology-date-table caption { text-align: left; font-size: 1.17rem; font-weight: 700; margin-bottom: .5rem; }
.technology-date-table th, .technology-date-table td { text-align: left; vertical-align: top; padding: .5rem; border-bottom: 1px solid var(--border); }
.technology-date-table th { width: 40%; padding-left: 0; font-weight: 400; }
.technology-date-table td { padding-right: 0; }
.khanate-city-table-scroll { max-width: 100%; overflow-x: auto; }
.khanate-city-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.khanate-city-table caption { text-align: left; margin-bottom: .5rem; }
.khanate-city-table th, .khanate-city-table td { padding: .5rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.khanate-city-table thead { background: var(--surface-raised); }
.khanate-city-table tbody th { font-weight: 400; min-width: 9rem; }
