/* brutalist（纯真）：90 年代早期裸 HTML 质感。按 98.css 的 class 约定给出朴素皮肤：
   纯白底、黑字、1px 实线、蓝色下划线链接、系统字体，无圆角 / 阴影 / 渐变 / 过渡。 */

:root {
  --b-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
  --b-serif: "Times New Roman", Times, Georgia, serif;
}

*,
*::before,
*::after {
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transition: none !important;
  animation: none !important;
}

body {
  color: #000;
  background: #fff;
  font-family: var(--b-mono);
  line-height: 1.4;
}

h1, h2, h3, h4, legend, .title-bar-text {
  font-family: var(--b-serif);
  font-weight: bold;
}

a { color: #00f; text-decoration: underline; }
a:visited { color: #551a8b; }
a:hover { color: #f00; }

:focus-visible {
  outline: 1px dotted #000;
  outline-offset: 1px;
}

hr { border: 0; border-top: 1px solid #000; }

/* ---- 窗口 → 文档区块 ---- */
.window {
  background: #fff;
  border: 1px solid #000;
}
.title-bar {
  padding: 2px 4px;
  border-bottom: 1px solid #000;
}
.title-bar-text {
  font-size: 1.25em;
}
.title-bar-controls {
  display: none;
}
.window-body {
  margin: 8px;
}
.status-bar {
  display: flex;
  gap: 8px;
  padding: 2px 4px;
  border-top: 1px solid #000;
}
.status-bar-field {
  margin: 0;
  flex: 1;
}

/* ---- 按钮：Win95 斜面错觉，只靠边框，按下时反转 ---- */
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  min-height: 23px;
  padding: 0 10px;
  color: #000;
  background: #dfdfdf;
  font-family: var(--b-mono);
  border: 2px solid;
  border-color: #fff #808080 #808080 #fff;
  outline: 1px solid #000;
  outline-offset: 0;
  cursor: pointer;
}
button:active,
input[type="submit"]:active {
  border-color: #808080 #fff #fff #808080;
}
button:focus-visible {
  outline: 1px dotted #000;
  outline-offset: 1px;
}
button:disabled {
  color: #808080;
  cursor: default;
}

/* ---- 输入框 ---- */
input:not([type="checkbox"], [type="radio"], [type="submit"], [type="reset"], [type="button"]),
select,
textarea {
  padding: 2px 4px;
  color: #000;
  background: #fff;
  font-family: var(--b-mono);
  border: 1px solid #000;
}
input:focus,
select:focus,
textarea:focus {
  background: #ffffcc;
  outline: 1px dotted #000;
  outline-offset: 1px;
}
input[type="checkbox"],
input[type="radio"] {
  accent-color: #000;
}

/* ---- 表单行 ---- */
.field-row {
  display: flex;
  align-items: center;
}
.field-row > * + * {
  margin-left: 6px;
}
.field-row-stacked {
  display: flex;
  flex-direction: column;
}
.field-row-stacked > * + * {
  margin-top: 4px;
}
[class^="field-row"] + [class^="field-row"] {
  margin-top: 6px;
}
fieldset {
  margin: 0;
  padding: 4px 8px 8px;
  border: 1px solid #000;
}
legend {
  padding: 0 4px;
}

/* ---- 表格 ---- */
.sunken-panel {
  overflow: auto;
  border: 1px solid #000;
}
table {
  border-collapse: collapse;
}
th,
td {
  padding: 2px 4px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #000;
}
th {
  font-family: var(--b-serif);
}
tbody tr:last-child td {
  border-bottom: 0;
}

/* ---- 标签页（menu[role=tablist]） ---- */
menu[role="tablist"] {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  margin: 0;
  padding: 0 0 2px;
  list-style: none;
  border-bottom: 1px solid #000;
}
[role="tab"][aria-selected="true"] {
  font-weight: bold;
}
[role="tabpanel"] {
  padding: 6px 0;
}

/* 下拉菜单 */
.menu-drop > ul,
.start-menu > ul {
  padding: 2px 0;
}

pre,
code {
  font-family: var(--b-mono);
}
pre {
  padding: 4px;
  border: 1px solid #000;
}
blockquote {
  margin: 4px 0 4px 2em;
}