.na-widget { --na-gumbel: #008080; --na-exponential: #486c98; --na-laplace: #825a89; width: min(760px, 100%); margin: 1.5rem auto; }
.na-widget.is-ready .na-fallback { display: none; }
.na-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.na-controls label { font-size: .85rem; font-weight: 600; }
.na-controls output { float: right; font-variant-numeric: tabular-nums; }
.na-controls input { display: block; width: 100%; accent-color: var(--na-gumbel); margin-top: .3rem; }
.na-widget :focus-visible { outline: 3px solid var(--na-gumbel); outline-offset: 3px; }
.na-plot { display: block; width: 100%; height: 300px; margin-top: .65rem; overflow: hidden; }
.na-plot text { fill: var(--bs-body-color); font: 12px "Latin Modern Sans", system-ui, sans-serif; }
.na-grid { stroke: var(--bs-border-color); stroke-width: 1; opacity: .65; }
.na-guide { stroke: var(--bs-secondary-color); stroke-width: 1.2; stroke-dasharray: 3 4; }
.na-curve { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.na-curve.na-gumbel { stroke: var(--na-gumbel); }
.na-curve.na-exponential { stroke: var(--na-exponential); stroke-dasharray: 7 4; }
.na-curve.na-laplace { stroke: var(--na-laplace); stroke-dasharray: 2 4; }
.na-marker { stroke: var(--bs-body-bg); stroke-width: 1.5; }
.na-marker.na-gumbel { fill: var(--na-gumbel); }
.na-marker.na-exponential { fill: var(--na-exponential); }
.na-marker.na-laplace { fill: var(--na-laplace); }
.na-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; text-align: center; }
.na-result span { font-size: .79rem; }
.na-result span::before { content: ""; display: inline-block; width: 18px; margin-right: .3rem; vertical-align: middle; border-top: 3px solid var(--na-gumbel); }
.na-exponential span::before { border-color: var(--na-exponential); border-top-style: dashed; }
.na-laplace span::before { border-color: var(--na-laplace); border-top-style: dotted; }
.na-result strong { display: block; font-size: 1.2rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.na-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .4rem .7rem; margin-top: .9rem; font-size: .78rem; }
.na-actions output { font-variant-numeric: tabular-nums; }
.na-actions button { font: inherit; color: var(--bs-body-color); background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: 5px; padding: .3rem .5rem; cursor: pointer; }
.na-actions button:disabled { opacity: .5; cursor: default; }
.na-log-control { display: block; width: fit-content; margin: .8rem auto .4rem; font-size: .78rem; }
.na-log-control input { accent-color: var(--na-gumbel); margin-right: .3rem; }
.na-widget figcaption { color: var(--bs-secondary-color); font-size: .82rem; line-height: 1.45; margin-top: .8rem; }
body.quarto-dark .na-widget { --na-gumbel: #62b8af; --na-exponential: #86a9ce; --na-laplace: #c39ac7; }
@media (max-width: 500px) {
  .na-controls { grid-template-columns: 1fr; gap: .6rem; }
  .na-plot { height: 280px; }
  .na-results { gap: .25rem; }
  .na-result span { font-size: .73rem; }
}
@media print {
  .na-widget.is-ready .na-live { display: none; }
  .na-widget.is-ready .na-fallback { display: block; }
}
