/* ブランドサイトの皮 — tsukubaonkyo.com
 *
 * **紙にする。**
 *
 * 子サイトは2つとも暗い。Rosso が冷たい黒 (#0b0c10)、Akadem がパネル由来の
 * 焦茶の黒 (#1a1613)。親がどちらかの暗さに寄ると、片方の製品サイトの
 * 続きに見えてしまう。かといって第三の暗色を持ち出すと血縁が切れる。
 *
 * そこで地に #E6DCC9 を使う。**これはパネルの "Tsukuba" の文字色そのもの**
 * (`plugin/ad1-plugin/src/editor.rs`)。Akadem の実物から取った値なので
 * 血縁はあるが、明暗が逆なので子には見えない。
 * 本文の墨 #1A1613 は Akadem サイトの地。**親子で地と文字が入れ替わる。**
 *
 * 比喩としては、子が「機械の表」で、親が「その機械の設計図が載っている紙」。
 *
 * 【ダークモードは付けない】
 *   prefers-color-scheme を入れると皮が2倍になり、検査も2倍になる。
 *   紙という比喩も壊れる。ここは固定でよい。
 *
 * 【製品への入口だけ、それぞれの色で差す】
 *   --rosso / --akadem は入口の2箇所にしか使わない。親のページの上で
 *   子の色が1回ずつ並ぶ、というのがこのページの唯一の色の仕事。
 *   どちらも紙の上で 4.5:1 を満たすまで暗くしてある (Rosso の #6a9bff を
 *   そのまま置くと 2.0:1 で読めない)。
 *
 * 【フォントは同梱しない】
 *   見出しは Bodoni Moda ではなく OS のディドー系に寄せる。
 *   **Bodoni を配らずに Bodoni の気配だけ借りる。** 無い環境でも崩れない */
:root {
  /* 面 */
  --bg:          #e6dcc9;   /* 紙。パネルのワードマーク #E6DCC9 そのもの */
  --bg-raise:    #f0e8d9;   /* 見出し帯の上端。紙をわずかに起こす */
  --rule:        rgba(74, 44, 23, .22);   /* 罫は木口 #4A2C17 を薄く */
  --pre-bg:      #dcd1bb;
  --code-bg:     rgba(74, 44, 23, .10);

  /* 文字 */
  --ink:         #1a1613;   /* Akadem サイトの地を、こちらでは墨として使う */
  --ink-dim:     #6b5b47;
  --ink-strong:  #120e0b;   /* パネルの地 */

  /* 差し色 — 紙の上で読める深さまで落とした琥珀 */
  --accent:      #8a4610;
  --accent-hot:  #b45f0d;
  --accent-soft: rgba(138, 70, 16, .35);

  /* 囲み */
  --note-edge:   #4a2c17;
  --note-bg:     rgba(74, 44, 23, .07);
  --warn-edge:   #b45f0d;
  --warn-bg:     rgba(180, 95, 13, .09);

  /* 字 */
  --sans:  -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", sans-serif;
  --mono:  ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
  --serif: "Bodoni 72", Didot, "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif;

  /* 製品への入口にだけ使う。ここ以外で使わないこと */
  --rosso:  #2b5bc4;   /* Rosso の #6a9bff を紙の上で読める深さまで落としたもの */
  --akadem: #8a4610;
}

/* 見出しだけディドー系に寄せる。地が紙なので、明朝の細い縦画が耐える */
h1 { font-family: var(--serif); font-weight: 600; letter-spacing: .01em; }

/* ------------------------------------------------------------------
   製品への入口。骨には無い、このページ専用の部品
   ------------------------------------------------------------------ */
.doors { margin: 0 0 8px; }
.door {
  display: block; text-decoration: none; color: inherit;
  border: 1px solid var(--rule); border-left: 3px solid var(--edge);
  border-radius: 0 4px 4px 0;
  padding: 18px 22px; margin: 0 0 14px;
  background: rgba(255, 255, 255, .28);
}
.door:hover { color: inherit; background: rgba(255, 255, 255, .55); }
.door .name {
  font-family: var(--serif); font-size: 23px; color: var(--edge);
  display: block; margin: 0 0 2px; letter-spacing: .01em;
}
.door .kind {
  font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink-dim); display: block; margin: 0 0 10px;
}
.door p { margin: 0; color: var(--ink); }
.door .go { color: var(--edge); font-size: 13px; display: block; margin-top: 10px; }
.door.rosso  { --edge: var(--rosso); }
.door.akadem { --edge: var(--akadem); }