.htmxo-comparison > nav, .htmxo-comparison [role=tablist] { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.htmxo-comparison > nav button { width: auto; margin: 0; }
.htmxo-comparison [role=tab][aria-selected=true] { text-decoration: underline; }
.htmxo-comparison > [data-htmxo-compare-home] > section[hidden], .htmxo-comparison > [data-htmxo-compare-grid] > section[hidden] { display: none !important; }
.htmxo-comparison > dialog > article { width: 96vw; max-width: 96vw; height: 94vh; max-height: 94vh; display: flex; flex-direction: column; }
.htmxo-comparison > dialog > article > header { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; }
.htmxo-comparison > dialog fieldset, .htmxo-comparison > fieldset { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.htmxo-comparison > dialog fieldset label, .htmxo-comparison > fieldset label { width: auto; }
.htmxo-comparison[data-htmxo-presentation=inline] { display: flex; flex-direction: column; max-height: var(--htmxo-comparison-height, 100dvh); }
.htmxo-comparison > dialog [data-htmxo-compare-grid], .htmxo-comparison > [data-htmxo-compare-grid] { display: flex; flex: 1; min-height: 0; gap: 1rem; overflow: auto; }
.htmxo-comparison[data-htmxo-presentation=inline] > [data-htmxo-compare-grid] { flex: 1 1 auto; }
.htmxo-comparison > dialog [data-htmxo-compare-grid] > section, .htmxo-comparison > [data-htmxo-compare-grid] > section { flex: 1 0 var(--htmxo-comparison-pane-width, 20rem); min-width: var(--htmxo-comparison-pane-width, 20rem); overflow: auto; }
.htmxo-comparison section { overflow-wrap: anywhere; }