@charset "UTF-8";

/* The document stays on paper; the controls belong to a text editor. */
:root {
  --chrome: #e9ece3;
  --chrome-title: #e0e5d9;
  --chrome-light: #fffef8;
  --chrome-edge: #b7c0af;
  --chrome-shadow: #ccd3c5;
  --chrome-ink: #323b2e;
  --chrome-select: #394e38;
  --chrome-selected-ink: #fffef8;
}

[data-theme="dark"] {
  --chrome: #2c3429;
  --chrome-title: #323d2e;
  --chrome-light: #46513f;
  --chrome-edge: #56624e;
  --chrome-shadow: #1d251a;
  --chrome-ink: #e0e7d8;
  --chrome-select: #b7cda6;
  --chrome-selected-ink: #1c2818;
}

[data-theme="retro"] {
  color-scheme: dark;
  --paper: #130f08;
  --surface: #1b150b;
  --surface-raised: #21190c;
  --surface-hover: #352610;
  --ink: #edbb67;
  --muted: #b58c4d;
  --faint: #80653a;
  --line: #4b3616;
  --accent: #e2a33f;
  --accent-strong: #ffd189;
  --accent-soft: #382911;
  --accent-line: #765323;
  --selection: #654317;
  --code-paper: #21190b;
  --error: #f5a56c;
  --error-soft: #3b2012;
  --shadow: 0 16px 64px #000b, 0 0 0 1px #ffbb4114;
  --chrome: #21190d;
  --chrome-title: #291e0f;
  --chrome-light: #49331a;
  --chrome-edge: #715026;
  --chrome-shadow: #100b05;
  --chrome-ink: #edbb67;
  --chrome-select: #e2a33f;
  --chrome-selected-ink: #1a1004;
  --phosphor-text-glow: #ffb34030;
  --phosphor-cursor-glow: #ffc24aa6;
  --phosphor-cursor-halo: #ff9d004d;
  --phosphor-cursor-inset: #ffcb6b33;
  --phosphor-drop-cursor: #ffd47b;
  --phosphor-drop-glow: #ffc24a80;
  --phosphor-backdrop: #08050099;
}

[data-theme="matrix"] {
  color-scheme: dark;
  --paper: #070e09;
  --surface: #0b160e;
  --surface-raised: #102016;
  --surface-hover: #193523;
  --ink: #7bea91;
  --muted: #7eb58a;
  --faint: #5d8667;
  --line: #274c32;
  --accent: #45dc70;
  --accent-strong: #b0ffc3;
  --accent-soft: #173321;
  --accent-line: #39764c;
  --selection: #2b613b;
  --code-paper: #0e1d13;
  --error: #f1b582;
  --error-soft: #332217;
  --shadow: 0 16px 64px #000b, 0 0 0 1px #42ff7814;
  --chrome: #102016;
  --chrome-title: #13291b;
  --chrome-light: #244b31;
  --chrome-edge: #376847;
  --chrome-shadow: #040a06;
  --chrome-ink: #7bea91;
  --chrome-select: #45dc70;
  --chrome-selected-ink: #061109;
  --phosphor-text-glow: #48ff7830;
  --phosphor-cursor-glow: #58ff84a6;
  --phosphor-cursor-halo: #00e64d4d;
  --phosphor-cursor-inset: #98ffb033;
  --phosphor-drop-cursor: #b0ffc3;
  --phosphor-drop-glow: #58ff8480;
  --phosphor-backdrop: #020a0599;
}

:is([data-theme="retro"], [data-theme="matrix"]) {
  text-shadow: 0 0 3px var(--phosphor-text-glow);
}

.classic-titlebar.app-header {
  height: 30px;
  min-height: 30px;
  min-width: 0;
  gap: 9px;
  padding: 0 10px;
  background: var(--chrome-title);
  color: var(--chrome-ink);
  border-bottom: 1px solid var(--chrome-edge);
  box-shadow: inset 0 1px var(--chrome-light);
  font: 11px/1.4 var(--mono);
}
.classic-titlebar .brand {
  gap: 0;
  flex-shrink: 0;
  color: var(--accent-strong);
  font: 600 13px/1 var(--mono);
  letter-spacing: -.3px;
  white-space: nowrap;
}
.classic-titlebar .saved-indicator {
  display: inline-flex;
  flex-shrink: 0;
  margin: 0 0 0 auto;
  gap: 0;
  font: 10px/1.4 var(--mono);
  color: var(--muted);
}
.classic-titlebar .saved-indicator[data-error="true"] { color: var(--error); }
.classic-titlebar .saved-indicator > span { display: none; }

.classic-menubar {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  height: 29px;
  gap: 1px;
  padding: 2px 0;
  background: transparent;
  color: var(--chrome-ink);
  border: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  font: 12px/1.5 var(--mono);
}
.classic-menubar::-webkit-scrollbar { display: none; }
.classic-menubar > button {
  flex-shrink: 0;
  height: 23px;
  padding: 1px 10px;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: inherit;
  line-height: 1.5;
}
.classic-menubar u { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.classic-menubar > button:hover { border-color: var(--chrome-edge); box-shadow: inset 1px 1px var(--chrome-light); }
.classic-menubar > button[aria-expanded="true"],
.classic-menubar > button:focus-visible {
  color: var(--chrome-selected-ink);
  background: var(--chrome-select);
  border-color: var(--chrome-select);
  box-shadow: none;
  outline: none;
}

.document-tabs.document-bar {
  height: 34px;
  min-height: 34px;
  gap: 3px;
  padding: 4px 9px 0;
  align-items: stretch;
  background: var(--chrome);
  border-bottom: 1px solid var(--chrome-edge);
  font: 11px/1.4 var(--mono);
}
.tab-strip { flex: 0 1 auto; display: flex; align-items: stretch; gap: 3px; min-width: 0; margin-bottom: -1px; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: var(--chrome-edge) var(--chrome); }
.editor-tab {
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  min-width: 105px;
  max-width: 255px;
  height: 30px;
  border: 1px solid var(--chrome-edge);
  border-bottom-color: transparent;
  background: var(--chrome-title);
  box-shadow: inset 1px 1px var(--chrome-light);
  color: var(--muted);
}
.editor-tab:has(.tab-select[aria-selected="true"]), .editor-tab.active, .editor-tab.is-active {
  background: var(--paper);
  border-top-color: var(--accent);
  border-bottom-color: var(--paper);
  box-shadow: inset 0 1px var(--accent-line);
  color: var(--ink);
}
.tab-select {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  padding: 3px 7px 3px 10px;
  color: inherit;
  border-radius: 0;
  font: 11px/1.5 var(--mono);
}
.tab-select:hover { background: color-mix(in srgb, var(--chrome-light) 25%, transparent); }
.tab-select[aria-selected="true"] { font-weight: 600; }
.tab-select:focus-visible { position: relative; z-index: 1; outline: 1px dotted var(--accent); outline-offset: -4px; }
.tab-dirty { color: var(--accent-strong); margin-left: 5px; font-weight: 600; }
.editor-tab > .tab-dirty { align-self: center; margin: 0 4px 0 0; }
.tab-close {
  width: 24px;
  min-width: 24px;
  padding: 0;
  margin: 3px 3px 3px 0;
  border: 1px solid transparent;
  border-radius: 0;
  color: var(--muted);
  background: transparent;
  font: 11px/1 var(--mono);
}
.tab-close:hover { color: var(--chrome-selected-ink); background: var(--chrome-select); border-color: var(--chrome-select); }
.tab-close:focus-visible { outline: 1px dotted var(--accent); outline-offset: 0; }
.new-tab-button {
  align-self: flex-start;
  width: 36px;
  height: 30px;
  padding: 0;
  margin: 0 0 -1px;
  border: 1px solid var(--chrome-edge);
  border-bottom-color: transparent;
  border-radius: 0;
  background: var(--chrome-title);
  box-shadow: inset 1px 1px var(--chrome-light);
  color: var(--muted);
  font: 12px/1 var(--mono);
  flex-shrink: 0;
}
.new-tab-button:hover { color: var(--accent-strong); background: var(--chrome-light); border-color: var(--chrome-edge); }
.new-tab-button:focus-visible { outline: 1px dotted var(--accent); outline-offset: -4px; }

.editor-toolbar {
  height: 30px;
  min-height: 30px;
  gap: 12px;
  padding: 2px 13px;
  background: var(--chrome);
  border-bottom-color: var(--chrome-edge);
  font: 10px/1.5 var(--mono);
}
.editor-toolbar button { font-family: var(--mono); border-radius: 0; }
.view-switch { gap: 1px; }
.view-switch button { height: 23px; padding: 1px 8px; font: 10px/1.5 var(--mono); border: 1px solid transparent; }
.view-switch button[aria-pressed="true"] { color: var(--chrome-ink); background: var(--paper); border-color: var(--chrome-edge); box-shadow: inset 1px 1px var(--chrome-shadow); font-weight: 600; }
.view-switch button:hover { border-color: var(--chrome-edge); background: var(--paper); }
.editor-toolbar .toolbar-divider { display: block; height: 17px; width: 1px; background: var(--chrome-edge); box-shadow: 1px 0 var(--chrome-light); }
.editor-toolbar .format-actions { display: flex; gap: 2px; }
.editor-toolbar .format-button { height: 23px; min-width: 23px; gap: 0; padding: 1px 5px; border: 1px solid transparent; font: 11px/1.5 var(--mono); }
.editor-toolbar .format-button:hover { background: var(--paper); border-color: var(--chrome-edge); }
.editor-toolbar .bold-button { font-weight: 700; }
.editor-toolbar .italic-button { font-style: italic; }
.editor-toolbar .format-button small { display: none; }
.editor-toolbar .run-actions { gap: 13px; }
.editor-toolbar .run-current-button {
  flex-shrink: 0;
  height: 23px;
  padding: 1px 8px;
  border: 1px solid var(--chrome-edge);
  background: var(--chrome);
  color: var(--chrome-ink);
  box-shadow: inset 1px 1px var(--chrome-light), inset -1px -1px var(--chrome-shadow);
  font: 10px/1.5 var(--mono);
  white-space: nowrap;
}
.editor-toolbar .run-current-button:hover:enabled { border-color: var(--accent); background: var(--paper); color: var(--accent-strong); }
.editor-toolbar .run-current-button:active:enabled { box-shadow: inset 1px 1px var(--chrome-shadow); }
.editor-toolbar .run-current-button:disabled { color: var(--muted); opacity: .6; box-shadow: none; }
.editor-toolbar .run-current-button:focus-visible { outline: 1px dotted var(--accent); outline-offset: -4px; }
.editor-toolbar .runtime-indicator { font: 10px/1.5 var(--mono); }
.editor-toolbar .runtime-indicator > span { display: none; }
.editor-toolbar svg { display: none; }

.classic-menu {
  position: fixed;
  z-index: 60;
  min-width: 265px;
  max-width: calc(100vw - 12px);
  max-height: calc(100dvh - 70px);
  overflow-y: auto;
  padding: 4px 3px;
  background: var(--chrome);
  color: var(--chrome-ink);
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  box-shadow: inset 1px 1px var(--chrome-light), 3px 3px 0 #1d291b24;
  font: 11px/1.5 var(--mono);
  scrollbar-width: thin;
}
.classic-menu .menu-item { display: flex; align-items: center; justify-content: flex-start; gap: 9px; min-height: 27px; width: 100%; padding: 4px 10px 4px 5px; border-radius: 0; color: inherit; font: inherit; }
.classic-menu .menu-check { display: inline-block; flex: 0 0 25px; width: 25px; text-align: center; }
.classic-menu .menu-label { flex: 1; white-space: nowrap; }
.classic-menu .menu-item kbd { margin-left: 15px; padding: 0; border: 0; border-radius: 0; color: var(--muted); font: 10px/1.5 var(--mono); }
.classic-menu .menu-item:hover, .classic-menu .menu-item.selected, .classic-menu .menu-item.is-active, .classic-menu .menu-item:focus, .classic-menu .menu-item:focus-visible {
  background: var(--chrome-select);
  color: var(--chrome-selected-ink);
  outline: none;
}
.classic-menu .menu-item:hover kbd, .classic-menu .menu-item.selected kbd, .classic-menu .menu-item.is-active kbd, .classic-menu .menu-item:focus kbd { color: inherit; }
.classic-menu .menu-item:disabled, .classic-menu .menu-item[aria-disabled="true"] { color: var(--faint); background: transparent; opacity: .65; cursor: default; }
.classic-menu .menu-divider, .classic-menu [role="separator"] { height: 1px; margin: 4px 7px 4px 31px; padding: 0; border: 0; background: var(--chrome-edge); box-shadow: 0 1px var(--chrome-light); }

.status-bar { background: var(--chrome); border-top-color: var(--chrome-edge); font-family: var(--mono); }
.status-bar button, .status-bar .status-brand { font-family: var(--mono); border-radius: 0; }
.status-bar .help-button { width: 16px; height: 16px; border-radius: 0; border-color: var(--chrome-edge); }
.status-bar #wrap-state { height: 22px; padding: 2px 7px; border: 1px solid var(--chrome-edge); background: var(--paper); color: var(--chrome-ink); box-shadow: inset 1px 1px var(--chrome-light), inset -1px -1px var(--chrome-shadow); font-size: inherit; line-height: 1.2; }
.status-bar #wrap-state:hover { border-color: var(--accent); background: var(--chrome-light); color: var(--accent-strong); }
.status-bar #wrap-state[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--accent-strong); box-shadow: inset 1px 1px var(--chrome-shadow); }
.status-bar #wrap-state[aria-pressed="true"]:hover { border-color: var(--accent); }
.status-bar #wrap-state:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.status-bar #wrap-state:active { box-shadow: inset 1px 1px var(--chrome-shadow); }
.read-edit-action {
  position: fixed;
  z-index: 45;
  max-width: calc(100vw - 16px);
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  background: var(--chrome);
  color: var(--chrome-ink);
  box-shadow: inset 1px 1px var(--chrome-light), inset -1px -1px var(--chrome-shadow), 2px 2px 0 #1d291b18;
  font: 11px/1.4 var(--mono);
  white-space: nowrap;
}
.read-edit-action:hover { background: var(--chrome-select); color: var(--chrome-selected-ink); border-color: var(--chrome-select); box-shadow: none; }
.read-edit-action:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.reading-content .read-edit-target {
  outline: 1px solid var(--accent-line);
  outline-offset: 4px;
  background-color: color-mix(in srgb, var(--accent-soft) 45%, transparent);
}
.about-dialog { width: min(360px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 0; border: 1px solid var(--chrome-edge); border-radius: 0; background: var(--chrome); box-shadow: inset 1px 1px var(--chrome-light), var(--shadow); font: 12px/1.4 var(--mono); }
.about-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 8px 12px; border-bottom: 1px solid var(--chrome-edge); background: var(--chrome-title); }
.about-heading h2 { margin: 0; color: var(--chrome-ink); font: 600 13px/1.4 var(--mono); }
.about-heading button { min-width: 26px; height: 25px; padding: 0 3px; color: var(--muted); border: 1px solid transparent; border-radius: 0; font: 11px/1 var(--mono); }
.about-heading button:hover { background: var(--chrome-select); color: var(--chrome-selected-ink); border-color: var(--chrome-select); }
.about-version { margin: 16px 18px 12px; color: var(--muted); font-size: 11px; }
.about-links { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 0 18px 20px; }
.about-links a { color: var(--accent-strong); text-decoration-thickness: 1px; text-underline-offset: 3px; }

.workspace-confirm-dialog {
  width: min(400px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: 0;
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  background: var(--chrome);
  color: var(--chrome-ink);
  box-shadow: inset 1px 1px var(--chrome-light), var(--shadow);
  font: 12px/1.4 var(--mono);
}
.workspace-confirm-heading {
  padding: 7px 12px;
  border-bottom: 1px solid var(--chrome-edge);
  background: var(--chrome-title);
}
.workspace-confirm-heading h2 { margin: 0; overflow-wrap: anywhere; font: 600 12px/1.4 var(--mono); }
.workspace-confirm-message { margin: 14px 12px; overflow-wrap: anywhere; white-space: pre-line; }
.workspace-confirm-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; padding: 0 12px 12px; }
.workspace-confirm-actions button {
  min-width: 72px;
  min-height: 27px;
  padding: 4px 10px;
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  background: var(--chrome);
  color: var(--chrome-ink);
  box-shadow: inset 1px 1px var(--chrome-light), inset -1px -1px var(--chrome-shadow);
  font: 11px/1.4 var(--mono);
}
.workspace-confirm-actions button:hover { background: var(--paper); border-color: var(--accent); color: var(--accent-strong); }
.workspace-confirm-actions button:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.workspace-confirm-actions button:active { box-shadow: inset 1px 1px var(--chrome-shadow); }

.sxript-examples-dialog {
  width: min(420px, calc(100vw - 24px));
  max-height: calc(100dvh - 24px);
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  background: var(--chrome);
  color: var(--chrome-ink);
  box-shadow: inset 1px 1px var(--chrome-light), var(--shadow);
  font: 12px/1.4 var(--mono);
}
.sxript-examples-dialog[open] { display: flex; flex-direction: column; }
.sxript-examples-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  gap: 12px;
  padding: 7px 10px;
  border-bottom: 1px solid var(--chrome-edge);
  background: var(--chrome-title);
}
.sxript-examples-heading h2 { margin: 0; font: 600 12px/1.4 var(--mono); }
.sxript-examples-heading button {
  min-width: 26px;
  height: 25px;
  padding: 0 3px;
  border: 1px solid transparent;
  border-radius: 0;
  color: var(--muted);
  font: 11px/1 var(--mono);
}
.sxript-examples-search { display: flex; align-items: center; flex-shrink: 0; gap: 9px; padding: 10px 10px 0; }
.sxript-examples-search label { font-size: 11px; }
.sxript-examples-search input {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  padding: 4px 7px;
  border: 1px solid var(--chrome-edge);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  box-shadow: inset 1px 1px var(--chrome-shadow);
  font: 11px/1.4 var(--mono);
}
.sxript-examples-search input::placeholder { color: var(--muted); }
#sxript-examples-status { flex-shrink: 0; margin: 8px 10px; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.sxript-examples-list {
  min-height: 0;
  max-height: 390px;
  overflow-y: auto;
  margin: 0 10px 10px;
  border: 1px solid var(--chrome-edge);
  background: var(--paper);
  scrollbar-width: thin;
}
.sxript-examples-list:empty { display: none; }
.sxript-example-item {
  display: block;
  width: 100%;
  min-height: 30px;
  padding: 5px 9px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font: 11px/1.5 var(--mono);
  text-align: left;
  overflow-wrap: anywhere;
}
.sxript-examples-heading button:hover,
.sxript-example-item:hover,
.sxript-example-item:focus-visible {
  background: var(--chrome-select);
  color: var(--chrome-selected-ink);
  text-shadow: none;
}
.sxript-example-item:focus-visible { outline: 1px dotted currentColor; outline-offset: -3px; }
.sxript-example-item:disabled { opacity: .55; cursor: wait; }

:is([data-theme="retro"], [data-theme="matrix"]) .editor-body::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 10;
  pointer-events: none;
  background-image:
    radial-gradient(ellipse at 50% 45%, transparent 58%, #0003 100%),
    repeating-linear-gradient(to bottom, transparent 0 2px, #00000013 2px 3px);
}
/* Blend the whole blinking layer so the character beneath the block stays readable. */
:is([data-theme="retro"], [data-theme="matrix"]) .cm-editor .cm-cursorLayer { mix-blend-mode: difference; }
:is([data-theme="retro"], [data-theme="matrix"]) .cm-editor .cm-cursor {
  width: 1ch;
  margin-left: 0;
  border-left: 0;
  border-radius: 0;
  background: var(--ink);
  box-shadow: 0 0 5px var(--phosphor-cursor-glow), 0 0 13px var(--phosphor-cursor-halo), inset 0 0 5px var(--phosphor-cursor-inset);
}
:is([data-theme="retro"], [data-theme="matrix"]) .cm-editor .cm-dropCursor { border-left-color: var(--phosphor-drop-cursor); box-shadow: 0 0 5px var(--phosphor-drop-glow); }
:is([data-theme="retro"], [data-theme="matrix"]) .cm-editor .cm-matchingBracket { color: var(--accent-strong); background: var(--accent-soft); outline: 1px solid var(--accent-line); }
:is([data-theme="retro"], [data-theme="matrix"]) .cm-editor .cm-nonmatchingBracket { color: var(--error); background: var(--error-soft); }
:is([data-theme="retro"], [data-theme="matrix"]) .katex-error { color: var(--error) !important; }
:is([data-theme="retro"], [data-theme="matrix"]) dialog::backdrop { background: var(--phosphor-backdrop); }
:is([data-theme="retro"], [data-theme="matrix"]) .classic-menubar > button[aria-expanded="true"],
:is([data-theme="retro"], [data-theme="matrix"]) .classic-menubar > button:focus-visible,
:is([data-theme="retro"], [data-theme="matrix"]) .classic-menu .menu-item:hover,
:is([data-theme="retro"], [data-theme="matrix"]) .classic-menu .menu-item.is-active,
:is([data-theme="retro"], [data-theme="matrix"]) .classic-menu .menu-item:focus,
:is([data-theme="retro"], [data-theme="matrix"]) .tab-close:hover,
:is([data-theme="retro"], [data-theme="matrix"]) .about-heading button:hover,
:is([data-theme="retro"], [data-theme="matrix"]) .read-edit-action:hover { text-shadow: none; }

@media (max-width: 760px) {
  .classic-titlebar.app-header { gap: 8px; padding-inline: 10px; }
  .document-tabs.document-bar { padding-inline: 6px; }
  .editor-tab { min-width: 105px; max-width: 205px; }
  .editor-toolbar { gap: 8px; padding-inline: 9px; }
  .editor-toolbar .run-actions { gap: 0; }
  .editor-toolbar .runtime-indicator { display: none; }
  .status-bar { font-size: 9px; }
}
@media (max-width: 540px) {
  .classic-titlebar .brand { font-size: 12px; }
  .classic-titlebar .saved-indicator { display: none; }
  .classic-titlebar.app-header { gap: 6px; padding-inline: 8px; }
  .classic-menubar { gap: 0; padding-inline: 0; font-size: 11px; }
  .classic-menubar > button { padding-inline: 8px; }
  .editor-toolbar { gap: 7px; padding-inline: 7px; }
  .view-switch button { padding-inline: 6px; }
  .editor-toolbar .format-actions { gap: 0; }
  .editor-toolbar .format-button { min-width: 20px; padding-inline: 4px; font-size: 10px; }
  .editor-tab { max-width: 185px; }
}
@media (max-width: 380px) {
  .editor-toolbar .format-actions .bold-button, .editor-toolbar .format-actions .italic-button { display: none; }
  .classic-menubar > button { padding-inline: 7px; }
  .classic-menu { min-width: 245px; }
}
@media print {
  .classic-titlebar, .classic-menubar, .document-tabs, .classic-menu, .read-edit-action { display: none !important; }
  .reading-content .read-edit-target { outline: none; background-color: transparent; }
  :is([data-theme="retro"], [data-theme="matrix"]) {
    color-scheme: light;
    --paper: #fff;
    --surface: #f3f3ef;
    --surface-raised: #fff;
    --surface-hover: #eeede6;
    --ink: #111;
    --muted: #555;
    --faint: #777;
    --line: #ddd;
    --accent: #35553e;
    --accent-strong: #284531;
    --accent-soft: #eef1eb;
    --accent-line: #c4cfc1;
    --selection: #d5e5d3;
    --code-paper: #f4f4f0;
    --error: #a34535;
    --error-soft: #f8e9e3;
    --shadow: none;
    text-shadow: none;
  }
  :is([data-theme="retro"], [data-theme="matrix"]) .editor-body::after { display: none; }
  :is([data-theme="retro"], [data-theme="matrix"]) .cm-cursor,
  :is([data-theme="retro"], [data-theme="matrix"]) .cm-dropCursor { box-shadow: none; }
}