/* 常世電算 文書管理システム TD-DMS
 *
 * 1968年創業の電算受託会社が、社内文書の照会に使い続けている業務端末。
 * 公開サイト(モダンなコーポレートサイト)とは世代がまるで違う。
 * 黒地に琥珀色の単色表示、等幅フォント、罫線で区切られた画面構成。
 */
* { box-sizing: border-box; }
html { background: #0b0b09; }
body {
  margin: 0; padding: 0;
  background: #0b0b09;
  color: #d8b06a;
  font-family: "SF Mono", "Menlo", "Consolas", "MS Gothic", "Osaka-Mono", monospace;
  font-size: 14px; line-height: 1.9;
  letter-spacing: .02em;
}
a { color: #f0c98a; }
a:hover { background: #d8b06a; color: #0b0b09; text-decoration: none; }

.term { max-width: 860px; margin: 0 auto; padding: 0 18px; }

/* 画面上部のシステム行 */
.scr-top {
  border-bottom: 1px solid #6b5326;
  padding: 10px 0 8px; margin-bottom: 0;
  display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  font-size: 12.5px; color: #9c7d43;
}
.scr-top .sys { letter-spacing: .12em; }

/* 画面見出し */
.scr-head { padding: 20px 0 14px; border-bottom: 1px dashed #5c4820; }
.scr-kind { font-size: 12px; color: #9c7d43; letter-spacing: .16em; }
h1 {
  font-size: 19px; font-weight: normal; margin: 10px 0 14px;
  color: #f4dcac; line-height: 1.65;
}
.scr-fields { font-size: 12.5px; color: #b39257; }
.scr-fields div { display: flex; gap: 10px; }
.scr-fields dt { color: #8a6f3c; min-width: 8.5em; }

/* 状態表示(反転) */
.st { background: #d8b06a; color: #0b0b09; padding: 0 8px; letter-spacing: .06em; }

/* システムメッセージ */
.scr-msg {
  border: 1px solid #6b5326; padding: 11px 14px; margin: 22px 0;
  font-size: 12.5px; color: #c6a15c; background: #16140f;
}
.scr-msg::before { content: "* "; }

/* 本文 */
.doc { padding: 6px 0 10px; }
.doc p { margin: 0 0 18px; }
.doc strong { color: #ffe6b0; font-weight: normal; border-bottom: 1px solid #8a6f3c; }
.doc h2 {
  font-size: 14px; font-weight: normal; margin: 30px 0 12px;
  color: #f4dcac; letter-spacing: .08em;
}
.doc h2::before { content: "── "; color: #8a6f3c; }
.doc ul { padding-left: 20px; }
.doc li { margin-bottom: 6px; }

/* 文書情報 */
.scr-info { border-top: 1px dashed #5c4820; margin-top: 34px; padding-top: 18px; font-size: 12.5px; }
.scr-info div { display: flex; gap: 10px; padding: 4px 0; }
.scr-info dt { color: #8a6f3c; min-width: 10em; }
.scr-info dd { margin: 0; color: #c6a15c; }

/* 画面下部のキー表示 */
.scr-keys {
  border-top: 1px solid #6b5326; margin-top: 40px; padding: 12px 0 10px;
  font-size: 12.5px; color: #9c7d43;
}
.scr-keys a { margin-right: 22px; }
.scr-keys .k { color: #6b5326; }

footer { padding: 6px 0 30px; font-size: 11.5px; color: #6b5326; line-height: 1.85; }
footer .fic { display: block; }

@media (max-width: 720px) {
  body { font-size: 13px; }
  .term { padding: 0 14px; }
  h1 { font-size: 16px; }
  .scr-fields div, .scr-info div { flex-direction: column; gap: 0; }
  .scr-fields dt, .scr-info dt { min-width: 0; }
  .scr-keys a { display: block; margin: 6px 0; }
}