/*! Nexus Observatory reader tools (nexus-observatory-ui): the dock and the effects of each preference. Tokens only. */
.nxo-reader { position: fixed; inset-inline-end: 20px; bottom: calc(20px + var(--nxo-r-lift, 0px)); z-index: calc(var(--nxo-z-overlay, 1000) - 1); font: 400 14px/1.5 var(--nxo-sans, "IBM Plex Sans", system-ui, sans-serif); color: var(--nxo-t1); display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.nxo-reader * { box-sizing: border-box; }
.nxo-reader [hidden] { display: none !important; }
.nxo-reader-trigger { inline-size: 44px; block-size: 44px; display: inline-grid; place-items: center; border-radius: 5px; border: 1px solid var(--nxo-hair2); background: var(--nxo-surface); color: var(--nxo-t1); cursor: pointer; }
.nxo-reader-trigger:hover, .nxo-reader-trigger[aria-expanded="true"] { color: var(--nxo-accent); border-color: var(--nxo-accent); }
.nxo-reader button:focus-visible { outline: 2px solid var(--nxo-accent); outline-offset: 2px; }
.nxo-reader-sr { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nxo-reader-dialog { inline-size: min(320px, calc(100vw - 40px)); max-block-size: calc(100vh - 120px); overflow: auto; padding: 16px; border: 1px solid var(--nxo-hair2); border-radius: 5px; background: var(--nxo-surface); color: var(--nxo-t1); }
.nxo-reader-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px; }
.nxo-reader-title { margin: 0; font: 600 15px/1.3 var(--nxo-sans, system-ui, sans-serif); color: var(--nxo-t1); }
.nxo-reader-close { min-inline-size: 32px; min-block-size: 32px; border: 1px solid var(--nxo-hair); border-radius: 5px; background: transparent; color: var(--nxo-t1); font-size: 18px; line-height: 1; cursor: pointer; }
.nxo-reader-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.nxo-reader-tool { inline-size: 100%; min-block-size: 40px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border: 1px solid var(--nxo-hair); border-radius: 5px; background: transparent; color: var(--nxo-t1); font: inherit; text-align: start; cursor: pointer; }
.nxo-reader-tool:hover { border-color: var(--nxo-hair2); background: var(--nxo-hover, transparent); }
.nxo-reader-tool[aria-pressed="true"] { border-color: var(--nxo-accent); }
.nxo-reader-tool[aria-pressed="true"] .nxo-reader-state { color: var(--nxo-accent-text, var(--nxo-accent)); }
.nxo-reader-state { font: 500 12px/1 var(--nxo-mono, "IBM Plex Mono", ui-monospace, monospace); color: var(--nxo-t2); }
.nxo-reader-reset { margin-block-start: 12px; min-block-size: 36px; padding: 6px 12px; border: 1px solid var(--nxo-hair2); border-radius: 5px; background: transparent; color: var(--nxo-t1); font: inherit; cursor: pointer; }
.nxo-reader-note { margin: 8px 0 0; font-size: 12px; color: var(--nxo-t3); }
.nxo-reader-guide { position: fixed; inset-inline: 0; top: 0; block-size: 32px; pointer-events: none; z-index: calc(var(--nxo-z-overlay, 1000) - 2); border-block: 2px solid var(--nxo-accent); background: transparent; }
@media (prefers-reduced-motion: reduce) { .nxo-reader * { transition: none !important; } }
/* The preferences, on <html> (set before paint by the inline boot). */
html.nxo-r-size { font-size: calc(100% * var(--nxo-r-scale, 1)); }
html.nxo-r-size body { font-size: calc(1em * var(--nxo-r-scale, 1)); }
html.nxo-r-lines body, html.nxo-r-lines body * { line-height: 1.8 !important; }
html.nxo-r-spacing body, html.nxo-r-spacing body * { letter-spacing: .08em !important; word-spacing: .16em !important; }
html.nxo-r-contrast { --nxo-t2: var(--nxo-t1); --nxo-t3: var(--nxo-t1); --nxo-hair: var(--nxo-t2); --nxo-hair2: var(--nxo-t1); --nxo-muted: var(--nxo-t1); }
html.nxo-r-motion *, html.nxo-r-motion *::before, html.nxo-r-motion *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
html.nxo-r-font body, html.nxo-r-font body *:not(code):not(pre):not(kbd):not(samp) { font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important; }
html.nxo-r-links a { text-decoration: underline !important; text-underline-offset: 3px; }
html.nxo-r-focus :focus-visible { outline: 3px solid var(--nxo-accent) !important; outline-offset: 3px !important; }
html.nxo-r-cursor, html.nxo-r-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 9-6.5 1.5L16 20l-3 1.5-3.5-7.5L4 18z' fill='%23000' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E") 4 2, auto !important; }
