/* M0 驗證頁共用樣式：紙色底、深墨色細框，主題色只當點綴（見規劃書 03 章） */
:root {
  --paper: #fcfbf8;
  --ink: #34323d;
  --muted: #6f6c78;
  --fuji: #cfd0e8;
  --tamago: #fcd983;
  --wasure: #97caed;
  --kobai: #e8a5bc;
  --yanagi: #b2cf8e;
  --ok: #3f7a3a;
  --bad: #a3364f;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--paper); color: var(--ink); }
body {
  font: 16px/1.6 -apple-system, "PingFang TC", "Noto Sans TC", system-ui, sans-serif;
  -webkit-text-size-adjust: 100%;
}
main { max-width: 880px; margin: 0 auto; padding: 16px 16px calc(32px + env(safe-area-inset-bottom)); }
h1 { font-size: 1.4rem; margin: 8px 0 4px; }
h2 { font-size: 1.1rem; margin: 20px 0 8px; }
p { margin: 6px 0; }
a { color: inherit; }
.muted { color: var(--muted); font-size: .9rem; }
.card {
  background: #fff8;
  border: 2px solid var(--ink);
  border-radius: 8px;
  box-shadow: 3px 3px 0 var(--ink);
  padding: 12px 14px;
  margin: 12px 0;
}
.card.fuji { background: color-mix(in srgb, var(--fuji) 35%, var(--paper)); }
.card.tamago { background: color-mix(in srgb, var(--tamago) 30%, var(--paper)); }
.card.wasure { background: color-mix(in srgb, var(--wasure) 25%, var(--paper)); }
.card.kobai { background: color-mix(in srgb, var(--kobai) 25%, var(--paper)); }
.card.yanagi { background: color-mix(in srgb, var(--yanagi) 30%, var(--paper)); }
a.card { display: block; text-decoration: none; }
a.card:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
button, select, input[type=text], textarea {
  font: inherit;
  color: var(--ink);
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 6px;
  min-height: 40px;
  padding: 4px 12px;
}
button { cursor: pointer; touch-action: manipulation; }
button:active { background: var(--tamago); }
button.on { background: var(--wasure); }
button.primary { background: var(--tamago); }
.row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ok { color: var(--ok); font-weight: 600; }
.bad { color: var(--bad); font-weight: 600; }
table { border-collapse: collapse; width: 100%; font-size: .9rem; }
th, td { border-bottom: 1px solid color-mix(in srgb, var(--ink) 25%, transparent); padding: 4px 6px; text-align: left; vertical-align: top; }
code, .mono { font-family: ui-monospace, Menlo, monospace; font-size: .85rem; word-break: break-all; }
.tag { display: inline-block; border: 1.5px solid var(--ink); border-radius: 4px; padding: 0 6px; font-size: .8rem; margin-right: 4px; background: var(--paper); }