/* YUGE：白い和紙に黒い筆文字、えんじ色の帯。ラーメンの紹介ポスターのように、白・黒・えんじだけで力強く */
:root {
  --bg: #faf8f4;
  --surface: #ffffff;
  --surface-2: #f5f2ec;
  --ink: #161412;
  --muted: #7d766d;
  --line: #e6e0d6;
  --accent: #9e1b1b;      /* えんじ */
  --accent-ink: #ffffff;
  --hot: #c0281e;
  --badge: #9e1b1b;
  --pmark: #9e1b1b;
  --side-dark: #9e1b1b;
  --side-ink: #161412;
  --side-pill: rgba(255, 255, 255, .92);
  --human-bg: #fbf1ef;
  --human-line: #d9a39d;
  --human-node: #ffffff;
  --bar-ink: #ffffff;
  --font-head: "Noto Sans JP", sans-serif;
  /* 和紙：白地に細かな繊維 */
  --washi: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='400'><filter id='w'><feTurbulence type='fractalNoise' baseFrequency='0.35 0.06' numOctaves='3' seed='3'/><feColorMatrix values='0 0 0 0 0.55  0 0 0 0 0.5  0 0 0 0 0.45  0 0 0 0.35 -0.1'/></filter><rect width='400' height='400' fill='%23fbfaf6'/><rect width='400' height='400' filter='url(%23w)'/></svg>");
  /* メニュー：和紙に、えんじの帯と筆の「湯気」 */
  --side:
    linear-gradient(180deg, transparent 0 96px, #9e1b1b 96px 104px, transparent 104px),
    var(--washi) 0 0 / 400px 400px;
}
body.resident { background: var(--washi) 0 0 / 400px 400px; background-attachment: fixed; }
.r-side { border: 2px solid #161412; box-shadow: 6px 6px 0 #161412, 0 24px 40px -18px rgba(0, 0, 0, .35); }
/* ブランド名は筆文字 */
.r-ptag { font-family: "Yuji Syuku", serif; font-size: 20px; letter-spacing: .12em; border: 0; background: none; padding: 0; }
.r-pmark { background: #161412; color: #fff; font-family: "Yuji Syuku", serif; }
.r-proj { padding-bottom: 30px; }
.r-menu a.on { background: #161412; color: #fff; box-shadow: 4px 4px 0 #9e1b1b; }
.r-menu a:hover { background: rgba(22, 20, 18, .06); }
.r-pill { border: 1.5px solid #161412; box-shadow: 3px 3px 0 #161412; }
.r-pill.dark { background: #9e1b1b; color: #fff; border-color: #9e1b1b; box-shadow: 3px 3px 0 #161412; }
/* 見出しは筆文字で大きく、下にえんじの帯 */
.r-head h1 { font-family: "Yuji Syuku", serif; font-size: 40px; font-weight: 400; letter-spacing: .08em; padding-bottom: 4px; border-bottom: 6px solid #9e1b1b; display: inline-block; }
.r-card { border: 1.5px solid #161412; box-shadow: 4px 4px 0 #161412; }
.r-note { border: 1.5px solid #161412; box-shadow: 3px 3px 0 #161412; }
.r-card h3 .ic, .r-note .ic, .r-kic { color: #9e1b1b; }
.r-kic { background: #fbf1ef; }
.r-kpi b { font-weight: 900; }
.r-btn { border: 1.5px solid #161412; box-shadow: 3px 3px 0 #161412; }
.r-btn.primary { background: #9e1b1b; border-color: #161412; box-shadow: 3px 3px 0 #161412; }
.r-btn:hover { transform: translate(-1px, -1px); }
.r-node.human { border-color: #9e1b1b; box-shadow: 0 4px 0 #9e1b1b; }
.r-node.human .who { color: #9e1b1b; }
.r-wf-bar { background: #161412; }
.r-chat-panel { border: 1.5px solid #161412; box-shadow: 6px 6px 0 #161412; }
.r-chat-head { background: #161412; color: #fff; }
.r-chat-head b { color: #fff; }
.r-chat-x { background: #9e1b1b; color: #fff; }
.r-chat-mini { border: 1.5px solid #161412; box-shadow: 3px 3px 0 #161412; }
