/* ==========================================================================
   iDomain — тема в стиле XP: цвета, окна, элементы управления, меню
   ========================================================================== */

:root {
  --font: Tahoma, "Segoe UI", Verdana, Geneva, sans-serif;
  --font-title: "Trebuchet MS", Tahoma, "Segoe UI", sans-serif;
  --font-start: "Franklin Gothic Medium", "Trebuchet MS", Tahoma, sans-serif;
  --font-mono: "Lucida Console", Consolas, "Courier New", monospace;

  --face: #ece9d8;
  --face-light: #f7f6f0;
  --gray-text: #aca899;
  --shadow-line: #aca899;
  --input-border: #7f9db9;
  --button-border: #003c74;
  --tooltip: #ffffe1;
  --taskbar-h: 30px;

  /* Схема «Синяя» */
  --select: #316ac5;
  --select-text: #fff;
  --title-active: linear-gradient(180deg, #0997ff 0%, #0053ee 8%, #0050ee 40%, #0066ff 88%, #0066ff 93%, #005bff 95%, #003dd7 96%, #003dd7 100%);
  --title-inactive: linear-gradient(180deg, #7697e7 0%, #7e9ee3 3%, #94afe8 6%, #97b4e9 8%, #82a5e4 14%, #7c9fe2 17%, #7996de 25%, #7b99e1 56%, #82a9e9 81%, #80a5e7 89%, #7b96e1 94%, #7a93df 97%, #abbae3 100%);
  --title-text: #fff;
  --title-shadow: 1px 1px #0f1089;
  --frame-active: #0831d9;
  --frame-inactive: #7a96df;
  --frame-shadow-active: inset -1px -1px #00138c, inset 1px 1px #0831d9, inset -2px -2px #001ea0, inset 2px 2px #166aee, inset -3px -3px #003bda, inset 3px 3px #0855dd;
  --frame-shadow-inactive: inset -1px -1px #6582f5, inset 1px 1px #8da4ef, inset -2px -2px #7b97eb, inset 2px 2px #a8bbf2, inset -3px -3px #8aa3ec, inset 3px 3px #9db3f0;
  --tbtn: radial-gradient(circle at 90% 90%, #0054e9 0%, #2263d5 55%, #4479e4 70%, #a3bbec 90%, #fff 100%);
  --tbtn-hover: radial-gradient(circle at 90% 90%, #1a68ff 0%, #3a7cff 55%, #66a0ff 70%, #c8dbff 90%, #fff 100%);
  --taskbar: linear-gradient(180deg, #1f2f86 0, #3165c4 3%, #3682e5 6%, #4490e6 10%, #3883e5 12%, #2b71e0 15%, #2663da 18%, #235bd6 20%, #2258d5 23%, #2157d6 38%, #245ddb 54%, #2562df 86%, #245fdc 89%, #2158d4 92%, #1d4ec0 95%, #1941a5 98%);
  --taskbar-text: #fff;
  --task-btn: #3c81f3;
  --task-btn-hover: #53a3ff;
  --task-btn-active: #1e52b7;
  --tray: linear-gradient(180deg, #0c59b9 1%, #139ee9 6%, #18b5f2 10%, #139beb 14%, #1290e8 19%, #0d8dea 63%, #0d9ff1 81%, #0f9eed 88%, #119be9 91%, #1392e2 94%, #137ed7 97%, #095bc9 100%);
  --tray-border: #1042af;
  --tray-glow: #18bbff;
  --start-head: linear-gradient(180deg, #1868ce 0%, #0e60cb 12%, #0e60cb 20%, #1164cf 32%, #1667cf 33%, #1b6cd3 47%, #1e70d9 54%, #2476dc 60%, #297ae0 65%, #3482e3 77%, #3786e5 79%, #428ee9 90%, #4791eb 100%);
  --start-head-text: #fff;
  --start-right: #d3e5fa;
  --start-border: #95bdee;
  --start-frame: #0b3e9e;
  --start-right-text: #0a246a;
  --taskpane: linear-gradient(180deg, #7ba2e7 0%, #6375d6 100%);
  --tp-head: linear-gradient(90deg, #ffffff 0%, #c6d3f7 100%);
  --tp-head-text: #215dc6;
  --tp-head-hover: #428eff;
  --tp-special: linear-gradient(90deg, #0054e3 0%, #2d6be4 100%);
  --tp-body: #d6dff7;
  --tp-link: #215dc6;
  --desktop-none: #004e98;
}

[data-scheme="olive"] {
  --select: #93a070;
  --title-active: linear-gradient(180deg, #d6e1b5 0%, #a9bc7f 7%, #91a865 30%, #8aa15b 62%, #97ae69 90%, #7a8f4c 100%);
  --title-inactive: linear-gradient(180deg, #eef1dd 0%, #dbe2c3 30%, #d1dab4 70%, #c3cca3 100%);
  --title-shadow: 1px 1px #4f5f2c;
  --frame-active: #8ba15b;
  --frame-inactive: #c7d0aa;
  --frame-shadow-active: inset -1px -1px #5d6e33, inset 1px 1px #a5b77b, inset -2px -2px #73864a, inset 2px 2px #b8c88f, inset -3px -3px #889d5b, inset 3px 3px #9fb274;
  --frame-shadow-inactive: inset -1px -1px #b1bd8d, inset 1px 1px #dfe6c9, inset -2px -2px #c0cb9f, inset 2px 2px #e6ecd4, inset -3px -3px #cbd5ad, inset 3px 3px #d6deba;
  --tbtn: radial-gradient(circle at 90% 90%, #6f8a3c 0%, #839d4f 55%, #9db46c 70%, #d4dfb5 90%, #fff 100%);
  --tbtn-hover: radial-gradient(circle at 90% 90%, #82a04a 0%, #96b25f 55%, #b1c681 70%, #e3ecc8 90%, #fff 100%);
  --taskbar: linear-gradient(180deg, #e4e9cc 0, #b6c48e 6%, #a3b47b 18%, #9cae73 50%, #95a86c 85%, #7f9157 100%);
  --task-btn: #a5b67c;
  --task-btn-hover: #b8c793;
  --task-btn-active: #7d8f53;
  --tray: linear-gradient(180deg, #d2dcb2 0, #b9c895 30%, #aebe88 100%);
  --tray-border: #7d8f53;
  --tray-glow: #e6eccf;
  --start-head: linear-gradient(180deg, #a6b97a 0%, #91a865 50%, #a3b67a 100%);
  --start-right: #e8edd8;
  --start-border: #b8c595;
  --start-frame: #6f823f;
  --start-right-text: #3d4a1d;
  --taskpane: linear-gradient(180deg, #cbd9ad 0%, #a8ba86 100%);
  --tp-head: linear-gradient(90deg, #ffffff 0%, #e2ebcb 100%);
  --tp-head-text: #56662d;
  --tp-head-hover: #829950;
  --tp-special: linear-gradient(90deg, #7a8f4c 0%, #97ae69 100%);
  --tp-body: #f1f4e6;
  --tp-link: #56662d;
}

[data-scheme="silver"] {
  --select: #b2b4bf;
  --select-text: #000;
  --title-active: linear-gradient(180deg, #ffffff 0%, #e4e5ed 10%, #d2d3de 45%, #c4c5d2 70%, #b2b3c5 92%, #9a9bb0 100%);
  --title-inactive: linear-gradient(180deg, #ffffff 0%, #f1f1f4 40%, #e6e6eb 100%);
  --title-text: #2b2b40;
  --title-shadow: 0 1px #fff;
  --frame-active: #b6b7c8;
  --frame-inactive: #dcdce4;
  --frame-shadow-active: inset -1px -1px #7c7d95, inset 1px 1px #e9e9f0, inset -2px -2px #9b9caf, inset 2px 2px #fff, inset -3px -3px #b0b1c2, inset 3px 3px #d2d3dc;
  --frame-shadow-inactive: inset -1px -1px #c4c4ce, inset 1px 1px #f5f5f8, inset -2px -2px #d3d3dc, inset 2px 2px #fff, inset -3px -3px #dcdce4, inset 3px 3px #ebebf0;
  --tbtn: linear-gradient(180deg, #fff 0%, #e2e3ea 50%, #c6c7d4 100%);
  --tbtn-hover: linear-gradient(180deg, #fff 0%, #eef0f8 50%, #d5d8ea 100%);
  --taskbar: linear-gradient(180deg, #ffffff 0, #e4e5ec 8%, #d5d6e0 30%, #cacbd8 70%, #b4b5c6 100%);
  --taskbar-text: #000;
  --task-btn: #e5e6ee;
  --task-btn-hover: #f4f4f8;
  --task-btn-active: #b9bac9;
  --tray: linear-gradient(180deg, #f6f6f9 0, #dcdde6 50%, #cccdd9 100%);
  --tray-border: #9a9bb0;
  --tray-glow: #fff;
  --start-head: linear-gradient(180deg, #f2f2f6 0%, #d5d6e0 55%, #c2c3d1 100%);
  --start-head-text: #222;
  --start-right: #eceef4;
  --start-border: #c3c5d4;
  --start-frame: #8d8ea6;
  --start-right-text: #222;
  --taskpane: linear-gradient(180deg, #d9dae5 0%, #b4b6c8 100%);
  --tp-head: linear-gradient(90deg, #ffffff 0%, #e2e3eb 100%);
  --tp-head-text: #3b3c55;
  --tp-head-hover: #6d6f8f;
  --tp-special: linear-gradient(90deg, #8d8ea6 0%, #b0b1c3 100%);
  --tp-body: #f3f3f7;
  --tp-link: #3b3c55;
}

/* --- основа --- */

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  height: 100%;
  overflow: hidden;
  background: #000;
  font: 11px var(--font);
  color: #000;
  -webkit-font-smoothing: auto;
  -webkit-tap-highlight-color: transparent;
}

body { user-select: none; -webkit-user-select: none; touch-action: manipulation; }
input, textarea, .selectable { user-select: text; -webkit-user-select: text; }
button { font: inherit; color: inherit; }
img { -webkit-user-drag: none; }
[hidden] { display: none !important; }

/* --- полосы прокрутки --- */

::-webkit-scrollbar { width: 17px; height: 17px; }
::-webkit-scrollbar-track { background: linear-gradient(90deg, #f3f1ec 0%, #fefefb 100%); }
::-webkit-scrollbar-track:horizontal { background: linear-gradient(180deg, #f3f1ec 0%, #fefefb 100%); }
::-webkit-scrollbar-corner { background: var(--face); }
::-webkit-scrollbar-thumb {
  border: 1px solid #fff;
  border-radius: 3px;
  background: linear-gradient(90deg, #c9d8fc 0%, #bacefb 45%, #a8c0f6 100%) padding-box;
  box-shadow: inset 0 0 0 1px #9bb4ee;
}
::-webkit-scrollbar-thumb:horizontal { background: linear-gradient(180deg, #c9d8fc 0%, #bacefb 45%, #a8c0f6 100%) padding-box; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(90deg, #dbe6ff 0%, #c9d9ff 45%, #b6cbfa 100%) padding-box; }
::-webkit-scrollbar-button:single-button {
  display: block;
  width: 17px;
  height: 17px;
  border: 1px solid #fff;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px #9bb4ee;
  background-color: #c4d4fb;
  background-repeat: no-repeat;
  background-position: center;
}
::-webkit-scrollbar-button:single-button:vertical:decrement { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6'%3E%3Cpath d='M1 5l3.5-3.5L8 5' fill='none' stroke='%234d6185' stroke-width='2'/%3E%3C/svg%3E"); }
::-webkit-scrollbar-button:single-button:vertical:increment { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6'%3E%3Cpath d='M1 1l3.5 3.5L8 1' fill='none' stroke='%234d6185' stroke-width='2'/%3E%3C/svg%3E"); }
::-webkit-scrollbar-button:single-button:horizontal:decrement { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='9'%3E%3Cpath d='M5 1L1.5 4.5 5 8' fill='none' stroke='%234d6185' stroke-width='2'/%3E%3C/svg%3E"); }
::-webkit-scrollbar-button:single-button:horizontal:increment { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='9'%3E%3Cpath d='M1 1l3.5 3.5L1 8' fill='none' stroke='%234d6185' stroke-width='2'/%3E%3C/svg%3E"); }
@supports not selector(::-webkit-scrollbar) {
  * { scrollbar-color: #b6c9f7 #f3f1ec; }
}

/* --- окно --- */

.windows-layer {
  position: absolute;
  inset: 0 0 var(--taskbar-h) 0;
  z-index: 10;
  pointer-events: none;
}

.window {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 160px;
  padding: 0 3px 3px;
  border-radius: 8px 8px 0 0;
  background: var(--frame-active);
  box-shadow: var(--frame-shadow-active), 2px 3px 10px rgba(0, 0, 0, .35);
  pointer-events: auto;
  outline: none;
  transform-origin: 0 0;
}
.window.opening { animation: win-open .18s ease-out; }
@keyframes win-open { from { opacity: 0; translate: 0 6px; } }
.window.inactive { background: var(--frame-inactive); box-shadow: var(--frame-shadow-inactive), 2px 3px 10px rgba(0, 0, 0, .25); }
.window.minimized { display: none; }
.window.maximized { border-radius: 0; box-shadow: none; padding: 0 0 0; }
.window.maximized .title-bar { border-radius: 0; }
.window.busy, .window.busy * { cursor: progress !important; }

.title-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: none;
  height: 29px;
  margin: 0 -3px;
  padding: 0 5px 1px 6px;
  border-radius: 8px 8px 0 0;
  background: var(--title-active);
  color: var(--title-text);
  touch-action: none;
}
.window.inactive .title-bar { background: var(--title-inactive); }
.window.maximized .title-bar { margin: 0; }
.title-icon { width: 16px; height: 16px; flex: none; }
.title-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font: bold 13px var(--font-title);
  text-shadow: var(--title-shadow);
  letter-spacing: .1px;
}
.window.inactive .title-text { opacity: .85; text-shadow: none; }
.title-controls { display: flex; gap: 2px; flex: none; }

.title-controls button {
  position: relative;
  width: 21px;
  height: 21px;
  padding: 0;
  border: 1px solid #fff;
  border-radius: 3px;
  background: var(--tbtn);
  box-shadow: inset -1px -1px 1px rgba(0, 0, 0, .15);
  cursor: default;
}
.title-controls button:hover { background: var(--tbtn-hover); }
.title-controls button:active { filter: brightness(.85); }
.window.inactive .title-controls button { opacity: .7; }
.title-controls .tc-close { background: radial-gradient(circle at 90% 90%, #cc4600 0%, #dc6527 55%, #cd7546 70%, #ffccb2 90%, #fff 100%); }
.title-controls .tc-close:hover { background: radial-gradient(circle at 90% 90%, #e24d00 0%, #f07a3c 55%, #ef9466 70%, #ffdccb 90%, #fff 100%); }
[data-scheme="silver"] .title-controls button { border-color: #8d8ea6; }
[data-scheme="silver"] .title-controls .tc-min::before,
[data-scheme="silver"] .title-controls .tc-max::before,
[data-scheme="silver"] .title-controls .tc-max::after { border-color: #3b3c55; background-color: #3b3c55; }

.tc-min::before {
  content: "";
  position: absolute;
  left: 4px;
  bottom: 4px;
  width: 7px;
  height: 3px;
  background: #fff;
}
.tc-max::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  width: 11px;
  height: 11px;
  border: 1px solid #fff;
  border-top-width: 3px;
}
[data-scheme="silver"] .tc-max::before { background: transparent !important; }
.window.maximized .tc-max::before { left: 3px; top: 7px; width: 8px; height: 8px; border-top-width: 2px; }
.window.maximized .tc-max::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 3px;
  width: 8px;
  height: 8px;
  border: 1px solid #fff;
  border-top-width: 2px;
  border-left: 0;
  border-bottom: 0;
  box-shadow: inset 0 0 0 0 transparent;
}
[data-scheme="silver"] .window.maximized .tc-max::after { background: transparent !important; }
.tc-close::before, .tc-close::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 8px;
  width: 13px;
  height: 2.5px;
  border-radius: 1px;
  background: #fff;
  transform: rotate(45deg);
}
.tc-close::after { transform: rotate(-45deg); }

.window-body {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--face);
  overflow: hidden;
}

/* края для изменения размера */
.rz { position: absolute; z-index: 2; touch-action: none; }
.rz-n { top: -3px; left: 8px; right: 8px; height: 6px; cursor: ns-resize; }
.rz-s { bottom: -3px; left: 8px; right: 8px; height: 7px; cursor: ns-resize; }
.rz-e { right: -3px; top: 8px; bottom: 8px; width: 7px; cursor: ew-resize; }
.rz-w { left: -3px; top: 8px; bottom: 8px; width: 7px; cursor: ew-resize; }
.rz-ne { right: -3px; top: -3px; width: 12px; height: 12px; cursor: nesw-resize; }
.rz-nw { left: -3px; top: -3px; width: 12px; height: 12px; cursor: nwse-resize; }
.rz-se { right: -3px; bottom: -3px; width: 14px; height: 14px; cursor: nwse-resize; }
.rz-sw { left: -3px; bottom: -3px; width: 12px; height: 12px; cursor: nesw-resize; }
.window.maximized .rz { display: none; }

/* модальность: родительское окно заблокировано */
.window.blocked .window-body::after { content: ""; position: absolute; inset: 0; z-index: 50; }

/* --- кнопки --- */

.btn {
  min-width: 75px;
  min-height: 23px;
  padding: 0 12px;
  border: 1px solid var(--button-border);
  border-radius: 3px;
  background: linear-gradient(180deg, #fff 0%, #ecebe6 86%, #d6d0c5 100%);
  box-shadow: none;
  font: 11px var(--font);
  color: #000;
  cursor: default;
}
.btn:hover { box-shadow: inset -1px 1px #fff0cf, inset 1px 2px #fdd889, inset -2px 2px #fbc761, inset 2px -2px #e5a01a; }
.btn:focus-visible, .btn.default { outline: none; box-shadow: inset -1px 1px #cee7ff, inset 1px 2px #98b8ea, inset -2px 2px #bcd4f6, inset 1px -1px #89ade4, inset 2px -2px #89ade4; }
.btn:focus-visible { outline: 1px dotted #000; outline-offset: -4px; }
.btn:active { background: linear-gradient(180deg, #cdcac3 0%, #e3e3db 8%, #e5e5de 94%, #f2f2f1 100%); box-shadow: none; }
.btn:disabled { color: var(--gray-text); border-color: #c9c7ba; background: #f5f4ea; box-shadow: none; }
.btn.small { min-width: 0; padding: 0 8px; }
.btn-row { display: flex; gap: 6px; justify-content: flex-end; }

/* --- поля ввода --- */

.xp input[type="text"], .xp input[type="email"], .xp input[type="tel"], .xp input[type="number"], .xp input[type="search"], .xp input:not([type]),
.xp select, .xp textarea {
  border: 1px solid var(--input-border);
  border-radius: 0;
  background: #fff;
  font: 11px var(--font);
  color: #000;
  outline: none;
}
.xp input[type="text"], .xp input[type="email"], .xp input[type="tel"], .xp input[type="number"], .xp input[type="search"], .xp input:not([type]) {
  height: 21px;
  padding: 2px 4px;
}
.xp select { height: 21px; padding: 0 2px; }
.xp textarea { padding: 3px 4px; resize: none; }
.xp input:disabled, .xp select:disabled, .xp textarea:disabled { background: var(--face-light); color: var(--gray-text); }
.xp input.invalid, .xp select.invalid { border-color: #d0021b; background: #fff6f6; }

.xp input[type="checkbox"], .xp input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0 5px 0 0;
  border: 1px solid #1c5180;
  background: linear-gradient(135deg, #dcdcd7 0%, #fff 100%);
  vertical-align: -2px;
}
.xp input[type="radio"] { border-radius: 50%; }
.xp input[type="checkbox"]:hover, .xp input[type="radio"]:hover { box-shadow: inset -2px -2px #f8b636, inset 2px 2px #fedf9c; }
.xp input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11'%3E%3Cpath d='M2 5.5l2.3 2.5L9 3' fill='none' stroke='%2321a121' stroke-width='2.2'/%3E%3C/svg%3E") center no-repeat;
}
.xp input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #b6f5a1, #21a121 70%);
}
.xp input:disabled[type="checkbox"], .xp input:disabled[type="radio"] { border-color: #cac8bb; background: #fff; }
.xp input[type="checkbox"]:focus-visible, .xp input[type="radio"]:focus-visible { outline: 1px dotted #000; outline-offset: 2px; }

.xp label.check { display: inline-flex; align-items: center; gap: 0; cursor: default; }

.xp input[type="range"] { accent-color: #2a5bd7; }

/* --- рамки, вкладки, прогресс --- */

.xp fieldset {
  margin: 0 0 10px;
  padding: 6px 10px 10px;
  border: 1px solid #d0d0bf;
  border-radius: 4px;
}
.xp legend { padding: 0 3px; color: #0046d5; }

.tabs { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.tab-list { display: flex; padding-left: 3px; position: relative; z-index: 1; margin-bottom: -1px; }
.tab {
  padding: 3px 8px 2px;
  margin-right: -1px;
  border: 1px solid #919b9c;
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, #fff 0%, #ecebe5 70%, #d8d2c2 100%);
  font: 11px var(--font);
  cursor: default;
}
.tab:hover { box-shadow: inset 0 2px #ffc83c; }
.tab[aria-selected="true"] {
  position: relative;
  margin-top: -2px;
  padding-bottom: 4px;
  background: #fcfcfe;
  box-shadow: inset 0 2px #ffc83c, inset 0 3px #e68b2c;
  border-top-color: #e68b2c;
}
.tab-panel {
  flex: 1;
  min-height: 0;
  padding: 10px 12px;
  border: 1px solid #919b9c;
  background: #fcfcfe;
  box-shadow: inset 1px 1px #fcfcfe, inset -1px -1px #f0f0ea, 1px 2px 2px #d0cfc4;
  overflow: auto;
}

.progress {
  position: relative;
  height: 16px;
  padding: 1px 2px;
  border: 1px solid #686868;
  border-radius: 4px;
  background: #fff;
  box-shadow: inset 0 0 1px #686868;
  overflow: hidden;
}
.progress > div {
  height: 100%;
  width: 0;
  background:
    repeating-linear-gradient(90deg, transparent 0 8px, #fff 8px 10px),
    linear-gradient(180deg, #acedad 0%, #7be47d 14%, #4cda50 28%, #2ed330 42%, #42d845 57%, #76e275 71%, #8fe791 85%, #fff 100%);
  transition: width .2s;
}
.progress.marquee > div { width: 30%; animation: progress-marquee 1.6s linear infinite; }
@keyframes progress-marquee { from { transform: translateX(-110%); } to { transform: translateX(380%); } }

/* --- всплывающие меню --- */

.menu {
  position: fixed;
  z-index: 20000;
  min-width: 150px;
  padding: 2px;
  border: 1px solid #aca899;
  background: #fff;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, .4);
  font: 11px var(--font);
  outline: none;
  animation: menu-in .12s ease-out;
}
@keyframes menu-in { from { opacity: 0; } to { opacity: 1; } }
.menu-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 20px;
  padding: 2px 22px 2px 20px;
  white-space: nowrap;
  cursor: default;
}
.menu.with-icons .menu-item { padding-left: 4px; }
.menu-item .icon { width: 16px; height: 16px; flex: none; }
.menu.large .menu-item { min-height: 26px; }
.menu.large .menu-item .icon { width: 24px; height: 24px; }
.menu-item.active { background: var(--select); color: var(--select-text); }
.menu-item.disabled { color: var(--gray-text); }
.menu-item.disabled.active { background: transparent; color: var(--gray-text); }
.menu-item.bold { font-weight: bold; }
.menu-item.checked::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 50%;
  width: 7px;
  height: 4px;
  margin-top: -4px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}
.menu-item.radio::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-radius: 50%;
  background: currentColor;
}
.menu-item.has-sub::after {
  content: "";
  position: absolute;
  right: 7px;
  top: 50%;
  margin-top: -4px;
  border: 4px solid transparent;
  border-left-color: currentColor;
  border-right-width: 0;
}
.menu-item .shortcut { margin-left: auto; padding-left: 20px; }
.menu-sep { height: 1px; margin: 3px 1px; background: #aca899; }

/* строка меню окна */
.menubar {
  display: flex;
  align-items: stretch;
  flex: none;
  height: 22px;
  padding: 0 2px;
  border-bottom: 1px solid #fff;
  box-shadow: 0 1px #d4d0c8;
  background: var(--face);
  font: 11px var(--font);
}
.menubar > button {
  padding: 0 7px;
  border: 0;
  background: none;
  cursor: default;
}
.menubar > button:hover, .menubar > button.open { background: var(--select); color: var(--select-text); }
.menubar-right { margin-left: auto; display: flex; align-items: center; padding: 0 4px 0 10px; border-left: 1px solid #d4d0c8; background: #fff; }

/* --- подсказки и фокус --- */

.tooltip {
  position: fixed;
  z-index: 30000;
  max-width: 320px;
  padding: 2px 5px;
  border: 1px solid #000;
  background: var(--tooltip);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, .3);
  font: 11px var(--font);
  pointer-events: none;
  white-space: pre-line;
}

.link {
  padding: 0;
  border: 0;
  background: none;
  color: #0033cc;
  text-decoration: underline;
  cursor: pointer;
  font: inherit;
}
.link:hover { color: #3366ff; }
