/* Copyright nxrix, 2026 */
/* 
 * Portions derived from Observable Notebook-Kit
 * Copyright 2025 Observable, Inc.
 * ISC License - See NOTICE.md
 */

@font-face {
  font-family: "Estedad";
  src: url("../fonts/estedad/estedad.woff2");
  font-weight: normal;
  font-style: normal;
}

:root {
  --serif: "Source Serif 4", ui-serif, serif;
  --sans-serif: "Estedad", ui-sans-serif, sans-serif;
  --ac: #85f;
  --sac: #85fa;
}

:root[data-theme="light"] {
  --c0: #fff;
  --c1: #eee;
  --c2: #ddd;
  --c3: #ccc;
  --c4: #bbb;
  --c5: #aaa;
  --c6: #999;
  --c7: #888;
  --c8: #777;
  --c9: #666;
  --ca: #555;
  --cb: #444;
  --cc: #333;
  --cd: #222;
  --ce: #111;
  --cf: #000;
  --ar: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyNHB4IiBmaWxsPSIjMWQxYTI0Ij48cGF0aCBkPSJNNDgwLTM0NCAyNDAtNTg0bDU2LTU2IDE4NCAxODQgMTg0LTE4NCA1NiA1Ni0yNDAgMjQwWiIvPjwvc3ZnPg==");
}
:root, :root[data-theme="dark"] {
  --c0: #000;
  --c1: #111;
  --c2: #222;
  --c3: #333;
  --c4: #444;
  --c5: #555;
  --c6: #666;
  --c7: #777;
  --c8: #888;
  --c9: #999;
  --ca: #aaa;
  --cb: #bbb;
  --cc: #ccc;
  --cd: #ddd;
  --ce: #eee;
  --cf: #fff;
  --ar: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyNHB4IiBmaWxsPSIjZTdlMGVlIj48cGF0aCBkPSJNNDgwLTM0NCAyNDAtNTg0bDU2LTU2IDE4NCAxODQgMTg0LTE4NCA1NiA1Ni0yNDAgMjQwWiIvPjwvc3ZnPg==");
}

* {
  unicode-bidi: plaintext;
  -webkit-tap-highlight-color: transparent;
  scrollbar-color: var(--c5) var(--c3);
}

::selection {
  background: var(--sac);
  color: #eee;
}

:focus-visible {
  outline: 2px solid var(--ac);
  outline-offset: 1px;
}

html {
  font: 14px/1.5 var(--sans-serif);
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: var(--c1);
  color: var(--ce);
}
body { margin: 0 14px; }
body.fullscreen { margin: 0; }

/*h1 { padding-top: 1rem;}*/
h1 { font-size: 2.4285em; } /* 2em */
h2 { font-size: 1.8214em; } /* 1.5em */
h3 { font-size: 1.4207em; } /* 1.17em */
h4 { font-size: 1.2142em; } /* 1em */
h5 { font-size: 1.0078em; } /* 0.83em */
h6 { font-size: 0.8135em; } /* 0.67em */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.15;
  margin-top: 0;
  margin-bottom: 0.25rem;
}

a[href], a.link {
  color: var(--ac);
  text-decoration-color: var(--ac);
  text-decoration: none;
  cursor: pointer;
}
a[href]:hover, a.link:hover { text-decoration: underline; }

pre, code { font-family: monospace; }
pre { padding: 2px 0; }

img { max-width: 100%; }

p, table, figure, figcaption, h1, h2, h3, h4, h5, h6 { max-width: 640px; }

/* ol ul */

hr {
  box-sizing: border-box;
  width: 100%;
  margin: 2rem 0;
  border: none;
  border-bottom: 1px solid var(--c3);
}

button, input, select, textarea, optgroup, option {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
button, input, select, textarea {
  background-color: var(--c1);
  border: 1px solid var(--c3);
  outline-color: var(--ac);
  accent-color: var(--ac);
  border-radius: 4px;
}

input[type="checkbox"], input[type="range"] {
  vertical-align: middle;
}

button { cursor: pointer; }

select {
  appearance: none;
  height: calc(1lh + 4px);
  padding: 0 28px 0 8px;
  background-repeat: no-repeat;
  background-size: auto 75%;
  background-position: right 4px center;
  background-image: var(--ar);
}

table {
  border-collapse: collapse;
  margin: 1rem 0;
}
table pre, table code {
  font-size: inherit;
  line-height: inherit;
}
th > pre:only-child, td > pre:only-child {
  margin: 0;
  padding: 0;
}
thead tr {
  border-bottom: solid 1px var(--c3);
}
tr:not(:last-child) {
  border-bottom: solid 1px var(--c2);
}
th, td {
  padding: 2px 8px 2px 0;
}
th:last-child, td:last-child {
  padding-right: 0;
}
th {
  text-align: left;
  vertical-align: bottom;
}
td {
  color: var(--cb);
  vertical-align: top;
}

code.highlighter-rouge {
  background: var(--c2);
  outline: 1px solid var(--c3);
  border-radius: 4px;
  padding: 0 2px;
  margin: 0 2px;
}
div.highlighter-rouge {
  width: fit-content;
  max-width: 100%;
  border: 1px solid var(--c3);
  border-radius: 8px;
  overflow: hidden;
  margin: 1rem 0;
}
.highlighter-rouge div {
  width: 100%;
  height: 100%;
  overflow: auto;
}
.highlighter-rouge pre {
  width: fit-content;
  height: fit-content;
  font-family: monospace;
  font-size: 14px;
  margin: 1rem;
  padding: 0;
}
.highlighter-rouge code {
  margin: 0;
}
.highlighter-rouge .highlight pre code span.p {
  color: #ff9500;
}
.highlighter-rouge .highlight pre code span.dl {
  color: #B44AFF;
}
.highlighter-rouge .highlight pre code span.s {
  color: #B44AFF;
}
.highlighter-rouge .highlight pre code span.s2 {
  color: #B44AFF;
}
.highlighter-rouge .highlight pre code span.se {
  color: #de1b45;
}
.highlighter-rouge .highlight pre code span.sr {
  color: #a01a3d;
}
.highlighter-rouge .highlight pre code span.o {
  color: #8944cf;
}
.highlighter-rouge .highlight pre code span.nx {
  /*color: #DE1b45;*/
}
.highlighter-rouge .highlight pre code span.nt {
  color: #00AE85;
}
.highlighter-rouge .highlight pre code span.na {
  color: #8b7fb0;
}
.highlighter-rouge .highlight pre code span.cm {
  color: #8b7fb0;
}
.highlighter-rouge .highlight pre code span.c1 {
  color: #8b7fb0;
}
.highlighter-rouge .highlight pre code span.kc {
  color: #de1b45;
}
.highlighter-rouge .highlight pre code span.mi {
  color: #1888de;
}
.highlighter-rouge .highlight pre code span.k {
  color: #00AE85;
}
.highlighter-rouge .highlight pre code span.kd {
  color: #00AE85;
}