/* Строгий простой стиль в духе сайтов 2000-х: Verdana, синие подчёркнутые ссылки,
   серые плашки, рамки в 1px, обычные кнопки, таблицы с чередованием строк. */
:root {
  --bar: #3d4a5c;
  --bar-line: #a9b4c2;
  --head: #e4e7eb;
  --panel: #f4f4f4;
  --zebra: #f7f7f7;
  --hover: #eef2f7;
  --ink: #1a1a1a;
  --text: #444444;
  --muted: #6b6b6b;
  --line: #c8c8c8;
  --line-dark: #8c8c8c;
  --field-line: #7f9db9;
  --link: #1f3f73;
  --visited: #4b3a73;
  --ok: #2d6a2d;
  --danger: #b00000;
  --note-bg: #fffbdd;
  --note-head: #f5eab0;
  --note-line: #d9c77a;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #ffffff;
  color: var(--ink);
  font: 13px/1.5 Verdana, Tahoma, "DejaVu Sans", Arial, sans-serif;
}
a { color: var(--link); }
a:hover { color: #000000; }
h1, h2 { font-family: Arial, Helvetica, sans-serif; font-weight: bold; line-height: 1.3; }
h1 { font-size: 20px; margin: 0 0 12px; }
h2 { font-size: 15px; margin: 22px 0 8px; padding-bottom: 3px; border-bottom: 1px solid var(--line); }
code { font-family: "Courier New", Courier, monospace; }

.wrap { max-width: 960px; margin: 0 auto; padding-inline: 16px; }
main.wrap { padding-block: 16px 48px; }

/* Шапка */
.top { background: var(--bar); border-bottom: 3px solid var(--bar-line); color: #ffffff; }
.top-in { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 18px; min-height: 46px; padding-block: 6px; }
.brand { font: bold 18px Georgia, "Times New Roman", serif; letter-spacing: .02em; color: #ffffff; text-decoration: none; }
.brand:hover { color: #ffffff; text-decoration: underline; }
.top-left { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.top .top-btn { padding: 2px 12px; font-size: 12px; }
.top-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 14px; font-size: 12px; }
.top-nav form { margin: 0; }
.top-nav a, .top-nav .linkbtn { color: #ffffff; }
.who { color: #c9d1db; }
.linkbtn { padding: 0; border: 0; background: none; color: var(--link); font: inherit; text-decoration: underline; cursor: pointer; }

.crumbs { margin-bottom: 8px; font-size: 11px; color: var(--muted); }
.crumbs .sep { margin: 0 5px; }
.lead { max-width: 70ch; color: var(--text); }
.empty { color: var(--muted); font-style: italic; }
.hint { margin: 2px 0 0; font-size: 11px; color: var(--muted); }
.hint ul { margin: 2px 0; padding-left: 16px; }
.error, .errorlist { color: var(--danger); }
.meta { margin-top: 24px; padding-top: 6px; border-top: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.nowrap { white-space: nowrap; }

/* Каталог */
.catalog { margin: 14px 0 0; padding: 0; list-style: none; border: 1px solid var(--line); }
.catalog li + li { border-top: 1px solid var(--line); }
.catalog li:nth-child(even) a { background: var(--zebra); }
.catalog a { display: grid; grid-template-columns: 70px 1fr; gap: 1px 12px; padding: 7px 10px; color: inherit; text-decoration: none; }
.catalog a:hover { background: var(--hover); }
.entry-kind { grid-row: span 2; padding-top: 2px; font-size: 11px; color: var(--muted); }
.entry-title { font-size: 14px; font-weight: bold; color: var(--link); text-decoration: underline; }
.catalog a:visited .entry-title { color: var(--visited); }
.entry-desc { grid-column: 2; font-size: 12px; color: var(--text); }
@media (max-width: 560px) {
  .catalog a { grid-template-columns: 1fr; }
  .entry-kind { grid-row: auto; padding: 0; }
  .entry-desc { grid-column: 1; }
}

/* Оглавление в виде окна проводника: адресная строка, панель «Папки», список в таблице, строка состояния */
.explorer { border: 1px solid var(--line-dark); background: #ffffff; }
.ex-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 5px 8px; border-bottom: 1px solid var(--line-dark); background: linear-gradient(#f7f7f7, #e4e4e4); }
.ex-toolbar .btn { padding: 1px 10px; font-size: 12px; white-space: nowrap; }
.btn.is-disabled { border-color: var(--line); color: #a0a0a0; cursor: default; }
.btn.is-disabled:hover { border-color: var(--line); background: linear-gradient(#ffffff, #e1e1e1); color: #a0a0a0; }
.ex-address { display: flex; flex: 1 1 300px; align-items: center; gap: 6px; min-width: 0; }
.ex-address-label { font-size: 12px; color: var(--muted); }
.ex-path { display: flex; flex: 1; align-items: center; gap: 4px; min-width: 0; padding: 2px 6px; overflow: hidden; border: 1px solid var(--field-line); background: #ffffff; font-size: 12px; white-space: nowrap; }
.ex-path .sep { color: var(--muted); }
.ex-body { display: grid; grid-template-columns: 230px minmax(0, 1fr); min-height: 340px; }
.ex-tree { overflow: auto; padding-bottom: 8px; border-right: 1px solid var(--line-dark); }
.ex-pane-title { padding: 3px 8px; border-bottom: 1px solid var(--line); background: var(--head); font-size: 12px; font-weight: bold; }
.ex-folders { margin: 0; padding: 0 0 0 14px; list-style: none; }
.ex-folders.ex-root { padding: 4px 4px 0; }
.ex-row { display: flex; align-items: center; gap: 3px; padding: 1px 0; font-size: 12px; white-space: nowrap; }
summary.ex-row { cursor: pointer; list-style: none; }
summary.ex-row::-webkit-details-marker { display: none; }
.ex-row::before { content: ""; flex: none; width: 9px; height: 9px; }
summary.ex-row::before {
  content: "+";
  border: 1px solid #919b9c;
  background: #ffffff;
  color: #000000;
  font: 9px/8px "Courier New", monospace;
  text-align: center;
}
details[open] > summary.ex-row::before { content: "−"; }
.ex-row a { display: inline-flex; align-items: center; gap: 5px; padding: 1px 4px; color: #000000; text-decoration: none; }
.ex-row a:hover { text-decoration: underline; }
.ex-row.is-current > a { background: #316ac5; color: #ffffff; }
.ex-main { min-width: 0; padding: 10px 14px 14px; }
.ex-main h1 { margin: 0 0 8px; font-size: 18px; }
.ex-file-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ex-file-head h1 { margin: 0; }
.ex-status { padding: 2px 8px; border-top: 1px solid var(--line-dark); background: linear-gradient(#f2f2f2, #e2e2e2); font-size: 11px; color: var(--muted); }
.ex-list th { padding: 3px 8px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line-dark); background: linear-gradient(#fdfdfd, #e8e8e8); color: #000000; font-size: 12px; font-weight: normal; }
.ex-list td { padding: 4px 8px; border: 0; font-size: 12px; }
.ex-list tbody tr:hover td { background: var(--hover); }
.ex-main h2.ex-caption { margin: 14px 0 6px; padding: 0; border: 0; font-size: 13px; }
.ex-main > h2.ex-caption:first-child { margin-top: 0; }
.ex-main .table-scroll + h2.ex-caption { margin-top: 18px; }
.ex-name { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: bold; text-decoration: none; }
.ex-name:hover { text-decoration: underline; }

.ico { display: inline-block; flex: none; width: 16px; height: 16px; background: center / 16px 16px no-repeat; }
.ico-big { width: 32px; height: 32px; background-size: 32px 32px; }
.ico-folder { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 3.5h4.5l1.5 1.5h7v8.5h-13z' fill='%23f3d377' stroke='%23b08a2e'/%3E%3Cpath d='M1.5 6.5h13' stroke='%23d9b24f'/%3E%3C/svg%3E"); }
.ico-doc { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 1.5h6l3 3v10h-9z' fill='%23ffffff' stroke='%23707a86'/%3E%3Cpath d='M9.5 1.5v3h3' fill='none' stroke='%23707a86'/%3E%3Cpath d='M5.5 7.5h5M5.5 9.5h5M5.5 11.5h3' stroke='%239aa6b2'/%3E%3C/svg%3E"); }
.ico-root { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2.5' width='13' height='11' fill='%23dfe6ee' stroke='%235a6b80'/%3E%3Cpath d='M4.5 4.5v7M7 4.5v7M9.5 4.5v7' stroke='%233d4a5c' stroke-width='1.5'/%3E%3Cpath d='M11.3 4.8l1.8 6.4' stroke='%237a2e2a' stroke-width='1.5'/%3E%3C/svg%3E"); }

.props { margin: 2px 0 12px; border-collapse: collapse; font-size: 12px; }
.props th { padding: 2px 16px 2px 0; color: var(--muted); font-weight: normal; text-align: left; vertical-align: top; white-space: nowrap; }
.props td { padding: 2px 0; }

@media (max-width: 640px) {
  .ex-body { grid-template-columns: 1fr; min-height: 0; }
  .ex-tree { display: none; }
  .ex-col-opt { display: none; }
}

.explorer + h2 { margin-top: 26px; }

/* Витрина ресурсов на главной */
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; margin: 12px 0 0; padding: 0; list-style: none; }
.tile {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  aspect-ratio: 1 / 1;
  padding: 12px;
  border: 1px solid var(--line-dark);
  background: linear-gradient(#ffffff, var(--panel));
  color: inherit;
  text-decoration: none;
}
.tile:hover { border-color: #5a6b80; background: linear-gradient(#ffffff, var(--hover)); color: inherit; }
.tile-title {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  color: var(--link);
  font: bold 16px/1.3 Georgia, "Times New Roman", serif;
  text-decoration: underline;
  overflow-wrap: anywhere;
}
.tile-date { padding-top: 6px; border-top: 1px solid var(--line); font-size: 11px; color: var(--muted); }

.files { margin: 6px 0; padding: 0; list-style: none; }
.files li { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; border-bottom: 1px dotted var(--line-dark); overflow-wrap: anywhere; }
.files span { color: var(--muted); white-space: nowrap; }
.scope { padding-left: 20px; }
.tags { margin: 0 0 12px; }
.tag-cloud { line-height: 1.9; }
.tag-props td { line-height: 1.6; }
table.grid tr.grid-group th { background: #e4e4e4; text-align: left; }
h2.section-title { margin-top: 18px; border-bottom: 1px solid var(--line-dark); }
.count { font-size: 11px; color: var(--muted); }
.related { margin: 6px 0; padding: 0; list-style: none; }
.related li { padding: 5px 0; border-bottom: 1px dotted var(--line-dark); }

/* Кнопки */
.btn {
  display: inline-block;
  padding: 3px 12px;
  border: 1px solid var(--line-dark);
  border-radius: 2px;
  background: linear-gradient(#ffffff, #e1e1e1);
  color: #000000;
  font: 13px Verdana, Tahoma, Arial, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
.btn:hover { border-color: #5a6b80; background: linear-gradient(#ffffff, #d4d9df); color: #000000; }
.btn:active { background: #d6d6d6; }
.btn-primary { font-weight: bold; }
.btn-lg { padding: 5px 24px; font-size: 14px; }
.btn-danger { color: var(--danger); }
.btn-danger:hover { color: var(--danger); }

/* Сообщения */
.messages { margin: 0 0 14px; padding: 0; list-style: none; }
.messages li { margin-bottom: 6px; padding: 6px 10px; border: 1px solid var(--note-line); background: var(--note-bg); }
.messages .msg-error { border-color: #d99a9a; background: #fdeeee; color: var(--danger); }

/* Формы */
.form { max-width: 600px; }
.field { margin-bottom: 12px; }
.field > label { display: block; margin-bottom: 2px; font-weight: bold; }
label.check { display: flex; align-items: center; gap: 6px; font-weight: normal; }
input[type=text], input[type=password], input[type=number], input[type=email], textarea, select {
  width: 100%;
  padding: 3px 4px;
  border: 1px solid var(--field-line);
  border-radius: 0;
  background: #ffffff;
  color: #000000;
  font: 13px Verdana, Tahoma, Arial, sans-serif;
}
textarea { resize: vertical; }
:focus-visible { outline: 1px dotted #000000; outline-offset: 1px; }
.field div > div, .field ul { margin: 2px 0; padding: 0; list-style: none; }
.field div > div label, .field ul label { display: flex; align-items: center; gap: 6px; padding: 1px 0; font-weight: normal; }
input[type=file] { max-width: 100%; font: inherit; }
fieldset { margin: 0 0 14px; padding: 4px 12px 10px; border: 1px solid var(--line-dark); }
legend { padding: 0 4px; font-weight: bold; }
details summary { color: var(--link); cursor: pointer; }

/* Панели с серой плашкой-заголовком */
.panel { margin-block: 22px; padding: 0 14px 12px; border: 1px solid var(--line-dark); background: var(--panel); }
.panel h2 { margin: 0 -14px 10px; padding: 4px 14px; border-bottom: 1px solid var(--line-dark); background: var(--head); font-size: 13px; }
.panel-notice { border-color: var(--note-line); background: var(--note-bg); }
.panel-notice h2 { border-color: var(--note-line); background: var(--note-head); }
.panel-danger h2 { color: var(--danger); }
.copy { display: flex; flex-wrap: wrap; gap: 6px; }
.copy input { flex: 1 1 260px; font-family: "Courier New", Courier, monospace; font-size: 12px; }

/* Управление */
.manage-nav { display: flex; flex-wrap: wrap; gap: 3px 3px; margin-bottom: 14px; padding-left: 6px; border-bottom: 1px solid var(--line-dark); }
.manage-nav a { margin-bottom: -1px; padding: 4px 12px; border: 1px solid var(--line-dark); background: var(--head); color: #000000; text-decoration: none; }
.manage-nav a:hover { background: #d4d9df; }
.manage-nav a.on { border-bottom-color: #ffffff; background: #ffffff; font-weight: bold; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 12px; }
.kind { min-width: 56px; font-size: 11px; color: var(--muted); }
.badge { font-size: 11px; color: var(--danger); }
.badge::before { content: "["; }
.badge::after { content: "]"; }

.mtree, .tree { margin: 0; padding: 0; list-style: none; }
main > .mtree { border-top: 1px solid var(--line); }
.mtree .mtree, .tree .tree { margin-left: 8px; padding-left: 18px; border-left: 1px dotted var(--line-dark); }
.mrow { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 4px 4px; border-bottom: 1px solid #e2e2e2; }
.mrow:hover { background: var(--hover); }
.mrow > a { font-weight: bold; }
.mactions { display: flex; gap: 12px; margin-left: auto; font-size: 11px; }
.tree-row { display: flex; align-items: center; gap: 6px; padding: 2px 0; cursor: pointer; }
li.covered > .tree-row .tree-title { color: var(--muted); }

.table-scroll { overflow-x: auto; }
table.grid { width: 100%; border-collapse: collapse; border: 1px solid var(--line-dark); }
.grid th, .grid td { padding: 5px 8px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.grid th { background: var(--head); font-size: 12px; }
.grid tbody tr:nth-child(even) td { background: var(--zebra); }
.grid tr.muted td { color: var(--muted); }
.status { font-weight: bold; white-space: nowrap; }
.status-active { color: var(--ok); }
.status-revoked, .status-expired { color: var(--danger); }

/* Просмотр ресурса: полоса с кнопкой возврата и рамка с ресурсом на всю оставшуюся высоту */
body.viewer { display: flex; flex-direction: column; height: 100vh; height: 100dvh; overflow: hidden; }
.viewer-bar { flex: none; display: flex; align-items: center; gap: 12px; min-height: 34px; padding: 3px 10px; border-bottom: 3px solid var(--bar-line); background: var(--bar); color: #ffffff; }
.viewer-bar .btn { padding: 1px 10px; font-size: 12px; white-space: nowrap; }
.viewer-title { min-width: 0; overflow: hidden; font-size: 12px; color: #c9d1db; text-overflow: ellipsis; white-space: nowrap; }
.viewer-frame { display: block; flex: 1 1 auto; width: 100%; min-width: 0; border: 0; background: #ffffff; }
.viewer-body { display: flex; flex: 1 1 auto; min-height: 0; }
.viewer-menu { position: relative; margin-left: auto; }
.menu { position: absolute; top: calc(100% + 2px); right: 0; z-index: 20; min-width: 230px; margin: 0; padding: 2px; border: 1px solid var(--line-dark); background: #ffffff; box-shadow: 2px 2px 0 rgba(0, 0, 0, .18); list-style: none; }
.menu button { display: block; width: 100%; padding: 4px 10px; border: 0; background: none; color: #000000; font: 12px Verdana, Tahoma, Arial, sans-serif; text-align: left; cursor: pointer; }
.menu button:hover, .menu button:focus-visible { background: #316ac5; color: #ffffff; }
.viewer-panel { flex: none; width: 340px; overflow: auto; padding: 0 10px 12px; border-left: 1px solid var(--line-dark); background: var(--panel); color: var(--ink); font-size: 12px; }
.viewer-panel .panel-head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 -10px 6px; padding: 5px 10px; border-bottom: 1px solid var(--line-dark); background: var(--head); }
.viewer-panel .field { margin-bottom: 8px; }
.viewer-panel textarea { font-size: 12px; }
@media (max-width: 640px) {
  .viewer-panel { position: fixed; inset: 40px 0 0 0; z-index: 30; width: auto; border-left: 0; }
}

/* Отзывы */
.feedback { margin: 6px 0 12px; padding: 0; list-style: none; }
.fb { padding: 6px 0; border-bottom: 1px dotted var(--line-dark); }
.fb-head { font-size: 11px; color: var(--muted); }
.fb-quote, .fb-suggest, .fb-reply { margin-top: 3px; padding: 2px 6px; border-left: 3px solid; }
.fb-quote { border-color: #d99a9a; background: #fdf3f3; }
.fb-suggest { border-color: #8fbf8f; background: #f1f8f1; }
.fb-reply { border-color: var(--bar-line); background: var(--hover); }
.fb-text { margin-top: 3px; overflow-wrap: anywhere; }
.fb-delete { font-size: 11px; }
.fb-form .field > label.check { display: inline-flex; margin-right: 14px; }
.fb-form:not(.is-edit) .fb-edit-only { display: none; }
.fb-form.is-edit .fb-comment-only { display: none; }
.fb-mod .fb-mod-form { margin-top: 8px; }
.status-new { color: var(--warn); font-weight: bold; }
.status-accepted { color: var(--ok); font-weight: bold; }
.status-rejected { color: var(--danger); font-weight: bold; }

/* Вход и приглашение — рамка с тёмной плашкой */
.auth { max-width: 440px; margin: 24px auto 0; padding: 0 16px 14px; border: 1px solid var(--line-dark); background: var(--panel); }
.auth > h1 { margin: 0 -16px 12px; padding: 6px 16px; background: var(--bar); color: #ffffff; font-size: 15px; }