/* node_modules/@observablehq/framework/src/client/stdlib/inputs.css */ .inputs-3a86ea { --length1: 3.25px; --length2: 6.5px; --length3: 13px; --label-width: 120px; --input-width: 240px; font: 13px/1.2 var(--sans-serif); } form.inputs-3a86ea { display: flex; align-items: center; flex-wrap: wrap; min-height: 25.5px; margin: var(--length3) 0; } form.inputs-3a86ea > label { width: 100%; padding-bottom: 3px; } form.inputs-3a86ea-toggle { flex-wrap: nowrap; } form.inputs-3a86ea-toggle > label { align-self: start; padding: 5px 0 4px 0; margin-right: var(--length2); } form.inputs-3a86ea-toggle > label, form.inputs-3a86ea-toggle .inputs-3a86ea-input { width: initial; } @media only screen and (min-width: 30em) { form.inputs-3a86ea { flex-wrap: nowrap; width: calc(var(--input-width) + var(--label-width)); max-width: 100%; margin: initial; } form.inputs-3a86ea > label { flex-shrink: 0; align-self: start; padding: 5px 0 4px 0; width: var(--label-width); margin-right: var(--length2); } } .inputs-3a86ea button, .inputs-3a86ea input, .inputs-3a86ea select, .inputs-3a86ea table, .inputs-3a86ea textarea { color: inherit; font: inherit; box-sizing: border-box; } .inputs-3a86ea button, .inputs-3a86ea input { line-height: normal; } .inputs-3a86ea button { margin: 0; } .inputs-3a86ea button + button { margin-left: var(--length1); } .inputs-3a86ea-textarea { --input-width: 520px; } .inputs-3a86ea-textarea > div { width: 100%; text-align: right; } .inputs-3a86ea-textarea > div textarea { display: block; width: 100%; margin: 0; padding: 4px; min-height: calc(2.5em + 8px); max-height: calc(14em + 8px); resize: vertical; } .inputs-3a86ea-textarea > div button { margin: 4px 0 0; } .inputs-3a86ea input[type=radio], .inputs-3a86ea input[type=checkbox] { margin-right: var(--length2); } .inputs-3a86ea-input { display: flex; align-items: center; width: 100%; } .inputs-3a86ea-input > input, .inputs-3a86ea-input > button, .inputs-3a86ea-input > output { width: inherit; min-width: 0; } .inputs-3a86ea-input > button, .inputs-3a86ea-input > output, .inputs-3a86ea-input > input[type=number] { flex-shrink: 2.5; } .inputs-3a86ea-input > output { white-space: pre; margin-left: var(--length2); } .inputs-3a86ea-input > button { margin-left: var(--length1); } .inputs-3a86ea-input > input[type=number] { font-variant-numeric: tabular-nums; flex-shrink: 1.5; text-overflow: ellipsis; } .inputs-3a86ea-input > input[type=color] ~ output { font-family: ui-monospace, var(--monospace); } .inputs-3a86ea-input:not(:only-child) > input[type=color] ~ output { flex-shrink: 1; } .inputs-3a86ea-input > input[type=range] { margin: 0; margin-left: var(--length2); } .inputs-3a86ea-input > input[type=date], .inputs-3a86ea-input > input[type=datetime-local] { height: 22px; } form.inputs-3a86ea-checkbox { width: auto; max-width: 640px; } .inputs-3a86ea-checkbox div label { display: inline-flex; align-items: center; margin-right: var(--length3); } form.inputs-3a86ea-table { display: block; overflow-y: auto; width: 100%; } .inputs-3a86ea-table table { max-width: initial; min-height: 33px; margin: 0; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; } .inputs-3a86ea-table tr:not(:last-child) td, .inputs-3a86ea-table tr:not(:last-child) th { border-bottom: solid 1px var(--theme-foreground-faintest); } .inputs-3a86ea-table thead tr td, .inputs-3a86ea-table thead tr th { border-bottom: solid 1px var(--theme-foreground-fainter); } .inputs-3a86ea-table thead th span { display: inline-block; width: 0.5em; margin-left: -0.5em; } .inputs-3a86ea-table td, .inputs-3a86ea-table th { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 3px 6.5px 3px 0; } .inputs-3a86ea-table tr > :not(:first-of-type) { padding-left: var(--length2); } .inputs-3a86ea-table tr > :last-of-type { padding-right: var(--length3); } .inputs-3a86ea-table tr > :first-of-type { text-overflow: unset; width: 19px; } .inputs-3a86ea-table tr > :first-of-type input { opacity: 0; margin: 0 3px 1px 4px; } .inputs-3a86ea-table tr:hover > :first-of-type input:enabled, .inputs-3a86ea-table tr > :first-of-type input:focus, .inputs-3a86ea-table tr > :first-of-type input:checked, .inputs-3a86ea-table tr > :first-of-type input[type=checkbox]:indeterminate { opacity: inherit; } .inputs-3a86ea-table thead tr { border-bottom: none; } .inputs-3a86ea-table thead th { position: sticky; top: 0; background: var(--theme-background); cursor: ns-resize; } .inputs-3a86ea-table tbody tr:first-child td { padding-top: 4px; }