@import url("./assets/w95fa.css");

/* Scope the kit to .p95. Theme attributes belong on that same element. */
.p95 {
  --p95-space-0: 0;
  --p95-space-1: 4px;
  --p95-space-2: 8px;
  --p95-space-3: 12px;
  --p95-space-4: 16px;
  --p95-space-5: 24px;
  --p95-space-6: 32px;
  --p95-space-7: 48px;
  --p95-space-8: 64px;
  --p95-font-ui: "W95FA", "MS Sans Serif", sans-serif;
  --p95-font-code: "Courier New", monospace;
  --p95-text-small: 14px;
  --p95-text-body: 16px;
  --p95-text-large: 20px;
  --p95-text-title: 24px;
  --p95-text-heading: 32px;
  --p95-text-display: 48px;
  --p95-leading-tight: 1.15;
  --p95-leading-body: 1.5;
  --p95-weight-normal: 400;
  --p95-weight-strong: 700;
  --p95-line: 1px;
  --p95-line-strong: 2px;
  --p95-radius-control: 7px 4px 8px 3px / 3px 7px 4px 6px;
  --p95-radius-window: 6px 9px 5px 8px / 8px 4px 7px 5px;
  --p95-sketch-width: 10px;
  --p95-sketch-outset: 4px;
  --p95-button-sketch-width: var(--p95-space-2);
  --p95-button-sketch-outset: var(--p95-line-strong);
  --p95-sketch-shape: polygon(2px 3px, 24% 1px, 53% 3px, 78% 1px, calc(100% - 2px) 3px, 100% 28%, calc(100% - 2px) 67%, 100% calc(100% - 3px), 73% calc(100% - 1px), 41% calc(100% - 3px), 2px 100%, 0 61%, 2px 28%);
  --p95-control-height: 36px;
  --p95-action-height: 44px;
  --p95-icon-size: 24px;
  --p95-content-width: 1200px;
  --p95-reading-width: 68ch;
  --p95-sidebar-width: 192px;
  --p95-field-width: 280px;
  --p95-dialog-width: 480px;
  --p95-duration: 100ms;
  --p95-backdrop-opacity: 0.6;
  --p95-color-desktop: #007b78;
  --p95-color-surface: #c6c6c1;
  --p95-color-surface-hover: #d8d8d2;
  --p95-color-surface-active: #b3b3ae;
  --p95-color-paper: #fafaf3;
  --p95-color-text: #22241f;
  --p95-color-text-muted: #4b4e46;
  --p95-color-text-disabled: #65675f;
  --p95-color-ink: #262822;
  --p95-color-edge-light: #fffff8;
  --p95-color-edge-shadow: #777a71;
  --p95-color-title: #000080;
  --p95-color-on-title: #ffffff;
  --p95-color-accent: #000080;
  --p95-color-on-accent: #ffffff;
  --p95-color-link: #000080;
  --p95-color-link-visited: #592867;
  --p95-color-focus: #000080;
  --p95-color-selection: #000080;
  --p95-color-on-selection: #ffffff;
  --p95-color-success: #18532f;
  --p95-color-success-surface: #e1efdf;
  --p95-color-warning: #684400;
  --p95-color-warning-surface: #fff0c5;
  --p95-color-danger: #8b2020;
  --p95-color-danger-surface: #fae2de;
  --p95-color-info: #163f7a;
  --p95-color-info-surface: #e3eafb;
  --p95-color-backdrop: #111a1a;
  --p95-color-grid: #176f6b;
  --p95-frame-image: url("./assets/frame.svg");
  --p95-button-frame-image: url("./assets/frame-button.svg");
  --p95-frame-danger-image: url("./assets/frame-danger.svg");
  --p95-rule-image: url("./assets/rule.svg");
  --p95-shadow-raised: none;
  --p95-shadow-inset: none;
  --p95-shadow-window: none;
  --p95-panel-padding: var(--p95-space-5);
  --p95-section-gap: var(--p95-space-6);
  --p95-control-gap: var(--p95-space-2);
  --p95-focus-ring: var(--p95-line-strong) dotted var(--p95-color-focus);
  color-scheme: light;
  color: var(--p95-color-text);
  background: var(--p95-color-desktop);
  font: var(--p95-weight-normal) var(--p95-text-body) / var(--p95-leading-body) var(--p95-font-ui);
  accent-color: var(--p95-color-accent);
}

.p95[data-p95-theme="dark"] {
  --p95-color-desktop: #173e3e;
  --p95-color-surface: #353b3b;
  --p95-color-surface-hover: #454d4d;
  --p95-color-surface-active: #292f2f;
  --p95-color-paper: #202626;
  --p95-color-text: #f3f3e9;
  --p95-color-text-muted: #bdc4b9;
  --p95-color-text-disabled: #9ba397;
  --p95-color-ink: #c8cfc2;
  --p95-color-edge-light: #626d65;
  --p95-color-edge-shadow: #131b1b;
  --p95-color-title: #151d47;
  --p95-color-on-title: #f5f5ee;
  --p95-color-accent: #bacaff;
  --p95-color-on-accent: #151d47;
  --p95-color-link: #b9cbff;
  --p95-color-link-visited: #e3bcf5;
  --p95-color-focus: #d8e2ff;
  --p95-color-selection: #b9cbff;
  --p95-color-on-selection: #151d47;
  --p95-color-success: #b8e4bd;
  --p95-color-success-surface: #243c2c;
  --p95-color-warning: #f6d78d;
  --p95-color-warning-surface: #433922;
  --p95-color-danger: #ffc0b6;
  --p95-color-danger-surface: #472b2b;
  --p95-color-info: #bfceff;
  --p95-color-info-surface: #29364c;
  --p95-color-backdrop: #050909;
  --p95-color-grid: #224b49;
  --p95-frame-image: url("./assets/frame-dark.svg");
  --p95-button-frame-image: url("./assets/frame-button-dark.svg");
  --p95-frame-danger-image: url("./assets/frame-danger-dark.svg");
  --p95-rule-image: url("./assets/rule-dark.svg");
  color-scheme: dark;
}

.p95 *, .p95 *::before, .p95 *::after { box-sizing: border-box; }
.p95 { margin: 0; }
.p95 ::selection { color: var(--p95-color-on-selection); background: var(--p95-color-selection); }
.p95 :focus-visible { outline: var(--p95-focus-ring); outline-offset: var(--p95-space-1); }
.p95 [hidden] { display: none !important; }
.p95 a { color: var(--p95-color-link); text-underline-offset: var(--p95-space-1); }
.p95 a:visited { color: var(--p95-color-link-visited); }
.p95 a:hover { text-decoration-thickness: var(--p95-line-strong); }
.p95 :is(button, input, select, textarea) { font: inherit; color: inherit; }
.p95 :is(h1, h2, h3, h4, h5, h6, p) { margin: 0; }
.p95 h1 { font-size: var(--p95-text-display); }
.p95 h2 { font-size: var(--p95-text-heading); }
.p95 h3 { font-size: var(--p95-text-title); }
.p95 :is(h1, h2, h3, h4, h5, h6) { line-height: var(--p95-leading-tight); font-weight: var(--p95-weight-normal); }
.p95 img { max-inline-size: 100%; block-size: auto; }
.p95 .p95-muted { color: var(--p95-color-text-muted); }
.p95 .p95-small { font-size: var(--p95-text-small); }
.p95 .p95-stack { display: grid; gap: var(--p95-space-4); }
.p95 .p95-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p95-control-gap); }
.p95 .p95-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--p95-field-width)), 1fr)); gap: var(--p95-space-5); }
.p95 .p95-sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.p95 .p95-skip { position: fixed; z-index: 10; inset: var(--p95-space-2) auto auto var(--p95-space-2); padding: var(--p95-space-3); background: var(--p95-color-paper); transform: translateY(-200%); }
.p95 .p95-skip:focus { transform: none; }

/* Nine-slice ink keeps stroke weight independent of a component's dimensions. */
.p95 .p95-window, .p95 .p95-panel { position: relative; min-inline-size: 0; border: var(--p95-line) solid var(--p95-color-ink); border-radius: var(--p95-radius-window); background: var(--p95-color-surface); box-shadow: var(--p95-shadow-raised); }
.p95 .p95-window { padding: var(--p95-space-1); box-shadow: var(--p95-shadow-raised), var(--p95-shadow-window); }
.p95 .p95-titlebar { position: relative; isolation: isolate; display: flex; align-items: center; gap: var(--p95-space-2); min-block-size: var(--p95-control-height); padding: var(--p95-space-1) var(--p95-space-2); color: var(--p95-color-on-title); }
.p95 .p95-titlebar::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; background: var(--p95-color-title); clip-path: var(--p95-sketch-shape); }
.p95 .p95-titlebar :is(h1, h2, h3) { flex: 1; font-size: var(--p95-text-body); overflow-wrap: anywhere; }
.p95 .p95-titlebar > .p95-button { min-block-size: var(--p95-icon-size); min-inline-size: var(--p95-icon-size); padding: 0 var(--p95-space-1); color: var(--p95-color-text); }
.p95 .p95-titlebar :focus-visible { outline-color: var(--p95-color-on-title); }
.p95 .p95-window-body { padding: var(--p95-panel-padding); }
.p95 .p95-panel { padding: var(--p95-panel-padding); }
.p95 .p95-inset { min-inline-size: 0; padding: var(--p95-space-4); background: var(--p95-color-paper); border: var(--p95-line) solid var(--p95-color-edge-shadow); box-shadow: var(--p95-shadow-inset); }
.p95 .p95-statusbar { display: flex; flex-wrap: wrap; gap: var(--p95-space-1); padding-block-start: var(--p95-space-1); font-size: var(--p95-text-small); }
.p95 .p95-statusbar > * { padding: var(--p95-space-1) var(--p95-space-2); box-shadow: var(--p95-shadow-inset); }
.p95 .p95-statusbar > :first-child { flex: 1; }
.p95 .p95-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p95-space-2); padding: var(--p95-space-2); border-block-end: var(--p95-line) solid var(--p95-color-edge-shadow); }

.p95 .p95-button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--p95-space-2); min-block-size: var(--p95-control-height); min-inline-size: var(--p95-control-height); padding: var(--p95-space-1) var(--p95-space-4); border: var(--p95-line) solid var(--p95-color-ink); border-radius: var(--p95-radius-control); color: var(--p95-color-text); background: var(--p95-color-surface); box-shadow: var(--p95-shadow-raised); text-decoration: none; cursor: pointer; }
.p95 .p95-button:visited { color: var(--p95-color-text); }
.p95 .p95-button:hover:not(:disabled) { background: var(--p95-color-surface-hover); }
.p95 .p95-button:active:not(:disabled), .p95 .p95-button[aria-pressed="true"] { background: var(--p95-color-surface-active); box-shadow: var(--p95-shadow-inset); }
.p95 .p95-button--primary { min-block-size: var(--p95-action-height); color: var(--p95-color-on-accent); background: var(--p95-color-accent); box-shadow: none; }
.p95 .p95-button--primary:visited { color: var(--p95-color-on-accent); }
.p95 .p95-button--primary:hover:not(:disabled), .p95 .p95-button--primary:active:not(:disabled), .p95 .p95-button--primary[aria-pressed="true"] { color: var(--p95-color-on-accent); background: var(--p95-color-accent); text-decoration: underline; text-underline-offset: var(--p95-space-1); }
.p95 .p95-button--danger { color: var(--p95-color-danger); }
.p95 .p95-button:disabled { color: var(--p95-color-text-disabled); cursor: not-allowed; border-style: dashed; }
.p95 .p95-icon { inline-size: var(--p95-icon-size); block-size: var(--p95-icon-size); flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.p95 .p95-tabs { display: flex; flex-wrap: wrap; gap: var(--p95-space-1); border-block-end: var(--p95-line-strong) solid var(--p95-color-ink); }
.p95 .p95-tabs > * { border-end-start-radius: 0; border-end-end-radius: 0; }
.p95 .p95-tabs [aria-selected="true"] { background: var(--p95-color-paper); box-shadow: none; text-decoration: underline; text-underline-offset: var(--p95-space-1); }
.p95 .p95-menu { position: relative; inline-size: fit-content; }
.p95 .p95-menu > summary { list-style: none; }
.p95 .p95-menu > summary::-webkit-details-marker { display: none; }
.p95 .p95-menu-list { position: absolute; z-index: 3; min-inline-size: var(--p95-sidebar-width); padding: var(--p95-space-1); background: var(--p95-color-surface); border: var(--p95-line) solid var(--p95-color-ink); box-shadow: var(--p95-shadow-window); }
.p95 .p95-menu-list > * { display: block; inline-size: 100%; padding: var(--p95-space-2); color: var(--p95-color-text); text-align: start; background: none; border: 0; text-decoration: none; cursor: pointer; }
.p95 .p95-menu-list > :is(:hover, :focus-visible) { color: var(--p95-color-on-selection); background: var(--p95-color-selection); }

.p95 .p95-field { display: grid; gap: var(--p95-space-1); min-inline-size: 0; }
.p95 .p95-input { inline-size: 100%; min-block-size: var(--p95-control-height); padding: var(--p95-space-2) var(--p95-space-3); background: var(--p95-color-paper); border: var(--p95-line) solid var(--p95-color-ink); border-radius: var(--p95-radius-control); box-shadow: var(--p95-shadow-inset); }
.p95 textarea.p95-input { resize: vertical; min-block-size: calc(var(--p95-control-height) * 3); }
.p95 .p95-input::placeholder { color: var(--p95-color-text-muted); opacity: 1; }
.p95 .p95-input:disabled { color: var(--p95-color-text-disabled); background: var(--p95-color-surface); border-style: dashed; cursor: not-allowed; }
.p95 .p95-input[aria-invalid="true"] { border: var(--p95-line-strong) solid var(--p95-color-danger); }
.p95 .p95-field-error { color: var(--p95-color-danger); }
.p95 .p95-choice { position: relative; min-inline-size: 0; }
.p95 .p95-choice-trigger { display: flex; align-items: center; justify-content: space-between; gap: var(--p95-space-2); text-align: start; cursor: pointer; }
.p95 .p95-choice-trigger::after { content: ""; flex-shrink: 0; border-inline: var(--p95-space-1) solid transparent; border-block-start: var(--p95-space-1) solid currentColor; }
.p95 .p95-choice-trigger[aria-expanded="true"]::after { transform: rotate(180deg); }
.p95 .p95-choice-popup { inset-block-start: calc(100% + var(--p95-space-1)); inset-inline: 0; min-inline-size: 0; max-block-size: calc(var(--p95-control-height) * 6); margin: 0; overflow-y: auto; list-style: none; background: var(--p95-color-paper); }
.p95 .p95-choice-popup > :is(.p95-choice-option, .p95-check) { display: flex; align-items: center; gap: var(--p95-space-2); min-block-size: var(--p95-control-height); cursor: pointer; }
.p95 .p95-choice-option::before { content: ""; inline-size: var(--p95-space-4); flex-shrink: 0; }
.p95 .p95-choice-option[aria-selected="true"]::before { content: "✓"; }
.p95 .p95-choice-popup > .p95-choice-option[data-active="true"] { color: var(--p95-color-on-selection); background: var(--p95-color-selection); }
.p95 .p95-choice-popup > .p95-choice-option[aria-disabled="true"], .p95 .p95-choice-popup > .p95-check:has(:disabled) { color: var(--p95-color-text-disabled); background: none; cursor: not-allowed; }
.p95 .p95-choice-chips { display: flex; flex-wrap: wrap; gap: var(--p95-space-2); margin: 0; padding: 0; list-style: none; }
.p95 .p95-choice-chip { min-block-size: var(--p95-icon-size); padding: 0 var(--p95-space-2); font-size: var(--p95-text-small); }
.p95 .p95-check { display: flex; align-items: center; gap: var(--p95-space-2); min-block-size: var(--p95-control-height); cursor: pointer; }
.p95 .p95-check input { inline-size: var(--p95-space-4); block-size: var(--p95-space-4); margin: var(--p95-space-1); flex-shrink: 0; }
.p95 .p95-check input:disabled { cursor: not-allowed; }
.p95 fieldset { min-inline-size: 0; margin: 0; padding: var(--p95-space-4); border: var(--p95-line) solid var(--p95-color-ink); border-radius: var(--p95-radius-window); background: var(--p95-color-surface); }
.p95 legend { position: relative; padding-inline: var(--p95-space-2); background: inherit; }
.p95 input[type="range"] { inline-size: 100%; min-block-size: var(--p95-control-height); }
.p95 .p95-badge { display: inline-block; padding: 0 var(--p95-space-2); border: var(--p95-line) solid currentColor; border-radius: var(--p95-radius-control); font-size: var(--p95-text-small); }
.p95 .p95-alert { padding: var(--p95-space-3) var(--p95-space-4); border: var(--p95-line) solid currentColor; border-inline-start-width: var(--p95-space-1); }
.p95 .p95-success { color: var(--p95-color-success); background: var(--p95-color-success-surface); }
.p95 .p95-warning { color: var(--p95-color-warning); background: var(--p95-color-warning-surface); }
.p95 .p95-danger { color: var(--p95-color-danger); background: var(--p95-color-danger-surface); }
.p95 .p95-info { color: var(--p95-color-info); background: var(--p95-color-info-surface); }
.p95 .p95-progress { inline-size: 100%; block-size: var(--p95-space-5); border: var(--p95-line) solid var(--p95-color-ink); background: var(--p95-color-paper); accent-color: var(--p95-color-accent); }
.p95 .p95-progress::-webkit-progress-bar { background: var(--p95-color-paper); box-shadow: var(--p95-shadow-inset); }
.p95 .p95-progress::-webkit-progress-value { background: repeating-linear-gradient(to right, var(--p95-color-accent) 0, var(--p95-color-accent) var(--p95-space-2), var(--p95-color-paper) var(--p95-space-2), var(--p95-color-paper) var(--p95-space-3)); }
.p95 .p95-progress::-moz-progress-bar { background: var(--p95-color-accent); }
.p95 .p95-skeleton { min-block-size: var(--p95-space-4); background: repeating-linear-gradient(135deg, var(--p95-color-surface) 0, var(--p95-color-surface) var(--p95-space-1), var(--p95-color-surface-hover) var(--p95-space-1), var(--p95-color-surface-hover) var(--p95-space-2)); }
.p95 .p95-empty { display: grid; justify-items: center; gap: var(--p95-space-3); padding: var(--p95-space-6); text-align: center; border: var(--p95-line) dashed var(--p95-color-ink); }
.p95 .p95-table-scroll { max-inline-size: 100%; overflow-x: auto; }
.p95 .p95-table { inline-size: 100%; border-collapse: separate; border-spacing: 0; background: var(--p95-color-paper); text-align: start; }
.p95 .p95-table caption { padding: var(--p95-space-2); text-align: start; color: var(--p95-color-text-muted); }
.p95 .p95-table :is(th, td) { padding: var(--p95-space-2) var(--p95-space-3); border: var(--p95-line) solid var(--p95-color-edge-shadow); text-align: start; overflow-wrap: anywhere; }
.p95 .p95-table th { background-color: var(--p95-color-surface); font-weight: var(--p95-weight-normal); }
.p95 .p95-table tbody tr:hover { background: var(--p95-color-surface-hover); }
.p95 .p95-dialog { max-inline-size: min(var(--p95-dialog-width), calc(100% - var(--p95-space-6))); color: var(--p95-color-text); }
.p95 .p95-dialog::backdrop { background: var(--p95-color-backdrop); opacity: var(--p95-backdrop-opacity); }

.p95 .p95-diagram { margin: 0; overflow-wrap: anywhere; }
.p95 .p95-diagram > figcaption { display: grid; gap: var(--p95-space-2); }
.p95 .p95-diagram h4 { font-size: var(--p95-text-large); }
.p95 .p95-flow { display: grid; justify-items: center; }
.p95 .p95-flow-node { inline-size: min(100%, var(--p95-field-width)); text-align: center; }
.p95 .p95-flow-arrow { display: block; color: var(--p95-color-ink); font-size: var(--p95-text-title); line-height: var(--p95-leading-tight); text-align: center; }
.p95 .p95-flow-arrow::before { content: "↓"; }
.p95 .p95-flow-branches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--p95-space-5); inline-size: 100%; }
.p95 .p95-flow-branch { position: relative; display: grid; justify-items: center; align-content: start; gap: var(--p95-space-2); min-inline-size: 0; padding-block-start: var(--p95-space-3); }
.p95 .p95-flow-branch::before { content: ""; position: absolute; inset-block-start: 0; block-size: var(--p95-space-4); inline-size: calc(50% + var(--p95-space-3)); border-block-start: var(--p95-line-strong) solid var(--p95-color-ink); }
.p95 .p95-flow-branch:first-child::before { inset-inline-start: 50%; border-inline-start: var(--p95-line-strong) solid var(--p95-color-ink); }
.p95 .p95-flow-branch:last-child::before { inset-inline-end: 50%; border-inline-end: var(--p95-line-strong) solid var(--p95-color-ink); }
.p95 .p95-flow-label { text-align: center; }
.p95 .p95-sequence { display: grid; gap: var(--p95-space-4); margin: 0; padding-inline-start: var(--p95-space-5); }
.p95 .p95-sequence > li::marker { font-size: var(--p95-text-large); }

/* Add .p95-prose to the HTML emitted by a Markdown renderer. No parser is included. */
.p95 .p95-prose { max-inline-size: var(--p95-reading-width); overflow-wrap: anywhere; }
.p95 .p95-prose > * + * { margin-block-start: var(--p95-space-4); }
.p95 .p95-prose :is(h1, h2, h3, h4, h5, h6) { margin-block: var(--p95-space-6) var(--p95-space-3); scroll-margin-block-start: var(--p95-space-5); }
.p95 .p95-prose > :first-child { margin-block-start: 0; }
.p95 .p95-prose h1 { font-size: var(--p95-text-heading); }
.p95 .p95-prose h2 { font-size: var(--p95-text-title); border-block-end: var(--p95-line) solid var(--p95-color-edge-shadow); padding-block-end: var(--p95-space-2); }
.p95 .p95-prose h3 { font-size: var(--p95-text-large); }
.p95 .p95-prose h4 { font-size: var(--p95-text-body); font-weight: var(--p95-weight-strong); }
.p95 .p95-prose h5 { font-size: var(--p95-text-body); text-decoration: underline; text-underline-offset: var(--p95-space-1); }
.p95 .p95-prose h6 { font-size: var(--p95-text-small); font-weight: var(--p95-weight-strong); }
.p95 .p95-prose :is(ul, ol) { padding-inline-start: var(--p95-space-5); }
.p95 .p95-prose li + li { margin-block-start: var(--p95-space-1); }
.p95 .p95-prose li > :is(ul, ol, p) { margin-block: var(--p95-space-2); }
.p95 .p95-prose .task-list-item { list-style: none; }
.p95 .p95-prose input[type="checkbox"] { margin-inline: calc(-1 * var(--p95-space-5)) var(--p95-space-2); }
.p95 .p95-prose blockquote { margin-inline: 0; padding: var(--p95-space-3) var(--p95-space-4); border-inline-start: var(--p95-space-1) solid var(--p95-color-edge-shadow); background: var(--p95-color-surface); }
.p95 .p95-prose blockquote > * + * { margin-block-start: var(--p95-space-2); }
.p95 .p95-prose :is(code, pre, kbd, samp) { font-family: var(--p95-font-code); font-size: var(--p95-text-small); }
.p95 .p95-prose :not(pre) > code { padding: 0 var(--p95-space-1); border: var(--p95-line) solid var(--p95-color-edge-shadow); background: var(--p95-color-surface); box-decoration-break: clone; }
.p95 .p95-prose pre { overflow-x: auto; max-inline-size: 100%; padding: var(--p95-space-4); border: var(--p95-line) solid var(--p95-color-ink); box-shadow: var(--p95-shadow-inset); background: var(--p95-color-surface); white-space: pre; overflow-wrap: normal; }
.p95 .p95-prose pre code { font-size: inherit; }
.p95 .p95-prose kbd { padding: var(--p95-space-1); border: var(--p95-line) solid var(--p95-color-ink); background: var(--p95-color-surface); box-shadow: var(--p95-shadow-raised); }
.p95 .p95-prose hr { margin-block: var(--p95-space-5); border: 0; border-block-start: var(--p95-line) dashed var(--p95-color-ink); }
.p95 .p95-prose table { display: block; max-inline-size: 100%; overflow-x: auto; border-collapse: separate; border-spacing: 0; }
.p95 .p95-prose :is(th, td) { padding: var(--p95-space-2) var(--p95-space-3); border: var(--p95-line) solid var(--p95-color-edge-shadow); text-align: start; }
.p95 .p95-prose th { background-color: var(--p95-color-surface); }
.p95 .p95-prose figure { margin-inline: 0; }
.p95 .p95-prose figcaption { margin-block-start: var(--p95-space-2); color: var(--p95-color-text-muted); font-size: var(--p95-text-small); }
.p95 .p95-prose :is(img, video, svg) { max-inline-size: 100%; block-size: auto; }
.p95 .p95-prose dt { font-weight: var(--p95-weight-strong); }
.p95 .p95-prose dd { margin-inline-start: var(--p95-space-5); }
.p95 .p95-prose :is(sup, sub) { font-size: var(--p95-text-small); }
.p95 .p95-prose mark { color: var(--p95-color-warning); background: var(--p95-color-warning-surface); }
.p95 .p95-prose :is(details, .footnotes) { padding: var(--p95-space-3); border: var(--p95-line) solid var(--p95-color-edge-shadow); }
.p95 .p95-prose summary { min-block-size: var(--p95-control-height); cursor: pointer; }
.p95 .p95-prose :is(.token.comment, .token.punctuation) { color: var(--p95-color-text-muted); }
.p95 .p95-prose :is(.token.keyword, .token.function) { color: var(--p95-color-link); }
.p95 .p95-prose .token.string { color: var(--p95-color-success); }

/* Tiling preserves stroke spacing in frames smaller than the source drawing. */
.p95 :is(.p95-window, .p95-panel, .p95-button, .p95-inset, .p95-input, .p95-menu-list, .p95-progress, .p95-empty, .p95-alert, .p95-badge, .p95-sketch, fieldset), .p95 .p95-prose :is(pre, kbd, details, .footnotes) {
  border: var(--p95-line-strong) solid transparent;
  border-image: var(--p95-frame-image) 12 / var(--p95-sketch-width) / var(--p95-sketch-outset) repeat;
  background-clip: padding-box;
}
.p95 :is(.p95-button, .p95-choice-trigger) { border-image: var(--p95-button-frame-image) 8 / var(--p95-button-sketch-width) / var(--p95-button-sketch-outset) stretch; }
.p95 .p95-input[aria-invalid="true"] { border-image: var(--p95-frame-danger-image) 12 / var(--p95-sketch-width) / var(--p95-sketch-outset) repeat; }
.p95 :is(.p95-toolbar, .p95-tabs), .p95 .p95-table :is(th, td), .p95 .p95-prose :is(th, td, h2, hr) {
  border: 0;
  padding-block-end: var(--p95-space-2);
  background-image: var(--p95-rule-image);
  background-position: bottom;
  background-size: 100% var(--p95-space-2);
  background-repeat: no-repeat;
}

/* The shared compact breakpoint is 640px; CSS variables cannot drive media queries. */
@media (max-width: 640px) {
  .p95 { --p95-panel-padding: var(--p95-space-4); --p95-section-gap: var(--p95-space-5); --p95-text-display: 32px; }
  .p95 .p95-flow-branches { grid-template-columns: minmax(0, 1fr); gap: var(--p95-space-4); }
  .p95 .p95-flow-branch { padding-block-start: 0; padding-inline-start: var(--p95-space-3); border-inline-start: var(--p95-line-strong) solid var(--p95-color-ink); }
  .p95 .p95-flow-branch::before, .p95 .p95-flow-branch .p95-flow-arrow { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .p95 *, .p95 *::before, .p95 *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  .p95 .p95-titlebar::before { background: Canvas; clip-path: none; }
  .p95 .p95-titlebar { color: CanvasText; }
  .p95 :focus-visible { outline: 2px solid Highlight; }
  .p95 .p95-choice-popup > .p95-choice-option[data-active="true"] { color: HighlightText; background: Highlight; forced-color-adjust: none; }
  .p95 :is(.p95-window, .p95-panel, .p95-button, .p95-inset, .p95-input, .p95-menu-list, .p95-progress, .p95-empty, .p95-alert, .p95-badge, .p95-sketch, fieldset), .p95 .p95-input[aria-invalid="true"], .p95 .p95-prose :is(pre, kbd, details, .footnotes) { border-image: none; border-color: ButtonText; }
  .p95 :is(.p95-toolbar, .p95-tabs), .p95 .p95-table :is(th, td), .p95 .p95-prose :is(th, td, h2, hr) { background-image: none; border-block-end: var(--p95-line) solid CanvasText; }
}
@media print {
  .p95 { color-scheme: light; background: white; color: black; }
  .p95 .p95-prose { max-inline-size: none; }
  .p95 .p95-window, .p95 .p95-panel { box-shadow: none; }
  .p95 .p95-prose pre { white-space: pre-wrap; }
}