/* MORI：明るい木のテーブルに、黒い石の板と白いバット。色とりどりの秋野菜。字は細い明朝とイタリックの英字 */
:root {
  --bg: #efe4d2;
  --surface: #fffdf9;
  --surface-2: #f8f2e8;
  --ink: #2b2620;
  --muted: #857a6c;
  --line: #e6dccb;
  --accent: #2b2b2b;      /* 石の黒 */
  --accent-ink: #ffffff;
  --hot: #c76b3c;
  --ok: #6f8f3a;
  --badge: #c76b3c;
  --pmark: #2b2b2b;
  --side-dark: #2b2b2b;
  --side-ink: #2b2620;
  --side-pill: rgba(255, 253, 249, .92);
  --human-bg: #fbf3e6;
  --human-line: #c76b3c;
  --human-node: #f2c49b;
  --bar-ink: #f2c49b;
  --radius: 8px;
  --font-head: "Zen Old Mincho", serif;
  /* メニュー：明るいタモの木の天板 */
  --side:
    linear-gradient(90deg, rgba(0, 0, 0, .06), transparent 20%, transparent 80%, rgba(0, 0, 0, .08)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='700'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.06 0.004' numOctaves='4' seed='4'/><feColorMatrix values='0 0 0 0 0.6  0 0 0 0 0.42  0 0 0 0 0.24  0 0 0 1 -0.42'/></filter><rect width='300' height='700' fill='%23e3c79d'/><rect width='300' height='700' filter='url(%23g)'/></svg>") 0 0 / 300px 700px;
}
body.resident {
  background:
    linear-gradient(rgba(239, 228, 210, .82), rgba(239, 228, 210, .82)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='900' height='300'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.004 0.06' numOctaves='4' seed='8'/><feColorMatrix values='0 0 0 0 0.6  0 0 0 0 0.42  0 0 0 0 0.24  0 0 0 1 -0.4'/></filter><rect width='900' height='300' fill='%23dcbf94'/><rect width='900' height='300' filter='url(%23g)'/></svg>") 0 0 / 900px 300px;
  background-attachment: fixed;
}
.r-side { box-shadow: 0 2px 0 #c9a77a, 0 24px 50px -18px rgba(90, 60, 30, .45); }
.r-ptag { border: 0; background: #2b2b2b; color: #fff; font-family: "Cormorant Garamond", serif; font-style: italic; letter-spacing: .2em; font-size: 14px; }
.r-menu a.on { background: #2b2b2b; color: #fff; }
.r-menu a.on .ic { color: #f2c49b; }
.r-pill.dark { background: #2b2b2b; }
.r-head h1 { font-family: "Zen Old Mincho", serif; font-weight: 700; letter-spacing: .08em; }
.r-crumb::before { content: "Cooking Design Studio"; font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 14px; color: #c76b3c; margin-right: 8px; }
.r-card { box-shadow: 0 0 0 1px var(--line), 0 14px 26px -20px rgba(90, 60, 30, .5); }
.r-card h3 .ic, .r-note .ic { color: #c76b3c; }
.r-kic { background: #2b2b2b; color: #f2c49b; }
.r-lead { border-left: 5px solid #6f8f3a; }
.r-btn.primary { background: #2b2b2b; color: #fff; }
.r-btn.primary .ic { color: #f2c49b; }
.r-chat-head { background: #2b2b2b; color: #fff; box-shadow: inset 0 -4px 0 #c76b3c; }
.r-chat-x { color: #fff; }

/* ── 会員サイト ── */
.mr-site { display: grid; gap: 16px; }
.mr-hero { position: relative; overflow: hidden; display: grid; gap: 10px; padding: 22px 26px; border-radius: 10px; color: #fff; min-height: 240px;
  background: radial-gradient(60% 90% at 78% 50%, rgba(255, 255, 255, .07), transparent 70%), linear-gradient(100deg, #262626 0 52%, #303030 100%);
  box-shadow: 0 18px 30px -16px rgba(0, 0, 0, .55); }
.mr-hero > :not(.mr-hero-plate) { position: relative; z-index: 1; }
.mr-hero-plate { position: absolute; right: 2%; top: 6%; bottom: 6%; width: 46%; border-radius: 8px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='0.02 0.5' numOctaves='3' seed='2'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .07 0'/></filter><rect width='300' height='300' filter='url(%23s)'/></svg>"), #1d1d1d;
  box-shadow: inset 0 0 0 1px #111, 0 18px 28px -10px rgba(0, 0, 0, .8); transform: rotate(-3deg); }
@media (max-width: 760px) { .mr-hero-plate { opacity: .45; width: 70%; } }
.mr-logo { margin: 0; font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 30px; letter-spacing: .2em; display: grid; line-height: 1; }
.mr-logo small { font-family: "Zen Old Mincho", serif; font-style: normal; font-size: 11px; letter-spacing: .2em; color: #d8cdbd; margin-top: 4px; }
.mr-theme h2 { margin: 2px 0 8px; font-family: "Zen Old Mincho", serif; font-size: clamp(24px, 3vw, 34px); font-weight: 700; line-height: 1.35; letter-spacing: .06em; }
.mr-theme p { margin: 0; font-size: 13px; color: #d8cdbd; max-width: 34em; }
.mr-k { margin: 26px 0 0; font-size: 11px; letter-spacing: .16em; color: #857a6c; }
.mr-hero .mr-k { margin: 6px 0 0; color: #f2c49b; }
.mr-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.mr-card { position: relative; padding: 16px; border-radius: 10px; background: #fffdf9; box-shadow: 0 0 0 1px var(--line), 0 14px 26px -20px rgba(90, 60, 30, .5); }
.mr-card h3 { margin: 4px 0 10px; font-family: "Zen Old Mincho", serif; font-size: 18px; }
.mr-play { grid-column: span 2; }
@media (max-width: 760px) { .mr-play { grid-column: auto; } }
.mr-by { position: absolute; right: 10px; top: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px 2px 2px; border-radius: 99px; background: #f3ebde; font-size: 10.5px; cursor: pointer; }
.mr-by em { font-style: normal; color: #5e5448; }
.mr-by.working { box-shadow: inset 0 0 0 1.5px var(--c); }
.mr-by.working em::before { content: "作業中・"; color: var(--c); font-weight: 700; }
.mr-by.got { animation: mrGot 1.2s ease-out; }
@keyframes mrGot { 0% { box-shadow: 0 0 0 0 var(--c); } 100% { box-shadow: 0 0 0 12px transparent; } }
/* 黒い石の皿 */
.mr-slate { position: relative; height: 320px; border-radius: 6px; overflow: hidden;
  background: radial-gradient(60% 50% at 30% 30%, rgba(255, 255, 255, .06), transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='0.02 0.5' numOctaves='3' seed='2'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .07 0'/></filter><rect width='300' height='300' filter='url(%23s)'/></svg>"), #262626;
  box-shadow: inset 0 0 0 1px #111, 0 16px 24px -12px rgba(0, 0, 0, .6); }
.mr-pc { position: absolute; display: block; transform: translate(-50%, -50%) rotate(var(--r)) scale(var(--s, 1)); filter: drop-shadow(0 6px 5px rgba(0, 0, 0, .55)) drop-shadow(0 1px 1px rgba(0, 0, 0, .4)); animation: mrDrop .35s ease-out; }
.mr-pc { height: auto; user-select: none; pointer-events: none; }
.mr-slate .mr-pc.mv { pointer-events: auto; cursor: grab; touch-action: none; }
.mr-slate .mr-pc.grab { cursor: grabbing; animation: none; filter: drop-shadow(0 16px 12px rgba(0, 0, 0, .6)); }
.mr-slate .mr-pc.out { opacity: .4; }
.mr-slate { touch-action: none; }
@keyframes mrDrop { from { transform: translate(-50%, -80%) rotate(var(--r)) scale(calc(var(--s, 1) * 1.25)); opacity: 0; } }
.mr-ingr { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.mr-ingr button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 6px; border: 1px solid var(--line); border-radius: 99px; background: #fff; font-size: 12.5px; cursor: pointer; }
.mr-ingr button img { flex: none; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .3)); }
.mr-ingr button:hover { border-color: #2b2b2b; }
.mr-hint { margin: 10px 0 0; padding: 8px 12px; border-radius: 6px; background: #f8f2e8; font-size: 12.5px; }
.mr-acts { display: flex; gap: 6px; margin-top: 8px; }
.mr-acts button { padding: 4px 12px; border: 1px solid var(--line); border-radius: 99px; background: #fff; font-size: 12px; cursor: pointer; }
.mr-slots { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mr-slots button { width: 100%; display: grid; grid-template-columns: 90px 1fr auto; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-align: left; cursor: pointer; font-size: 13px; }
.mr-slots em { font-style: normal; font-size: 11.5px; font-weight: 700; color: #6f8f3a; }
.mr-slots button:disabled { opacity: .55; cursor: default; }
.mr-slots button:disabled em { color: #c76b3c; }
.mr-slots button.on { border-color: #2b2b2b; background: #2b2b2b; color: #fff; }
.mr-slots button.on em { color: #f2c49b; }
.mr-small { margin: 10px 0 0; font-size: 11.5px; color: var(--muted); }
.mr-recipe ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 13px; }
.mr-ps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mr-ps figure { margin: 0; }
.mr-mini { position: relative; aspect-ratio: 1; border-radius: 6px; background: #262626; overflow: hidden; }
.mr-mini .mr-pc { animation: none; }
.mr-ps figcaption { display: grid; margin-top: 4px; font-size: 11.5px; }
.mr-ps figcaption small { color: #6f8f3a; font-size: 10.5px; }
@media (prefers-reduced-motion: reduce) { .mr-by.got, .mr-pc { animation: none; } }

/* ── 受講生カルテ（料理） ── */
.mr-kt { --kt: #2b2b2b; }
.mr-kt .kt-head h3 { font-family: "Zen Old Mincho", serif; }
.mr-kt .kt-k { font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 13px; letter-spacing: .08em; color: #a0743f; }
.mr-kt .kt-card, .mr-kt .kt-list button { border-radius: 10px; background: #fffdf9; box-shadow: 0 0 0 1px var(--line), 0 12px 22px -18px rgba(90, 60, 30, .5); }
.mr-kt .kt-list button.on { box-shadow: 0 0 0 2px #2b2b2b; }
.mr-kt .kt-av { background: #2b2b2b; }
.kt-al { margin-left: 6px; font-style: normal; font-size: 10px; font-weight: 800; color: #fff; background: #c0392b; padding: 0 6px; border-radius: 4px; }
.kt-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 14px 18px; border-radius: 10px; color: #fff; background: repeating-linear-gradient(-45deg, #b03a2e 0 14px, #a5352a 14px 28px); box-shadow: 0 12px 24px -16px rgba(150, 40, 30, .8); }
.kt-alert b { font-size: 16px; }
.kt-alert span { font-size: 18px; font-weight: 900; padding: 2px 14px; border-radius: 6px; background: #fff; color: #b03a2e; }
.kt-alert em { font-style: normal; font-size: 13px; padding: 2px 10px; border-radius: 6px; background: rgba(255, 255, 255, .2); }
.kt-alert small { flex-basis: 100%; font-size: 11.5px; opacity: .9; }
.kt-alert.none { color: #2b2620; background: #f3ebde; box-shadow: none; }
.kt-stamps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 8px; }
.kt-stamps i { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; font-style: normal; font-size: 12px; color: #c9b9a3; border: 2px dashed #e0d4c1; }
.kt-stamps i.on { font-family: "Zen Old Mincho", serif; font-size: 18px; font-weight: 700; color: #fff; border: 0; background: radial-gradient(circle at 35% 30%, #d9824c, #a64a24); transform: rotate(-8deg); box-shadow: 0 4px 8px -3px rgba(120, 50, 20, .6); }
.kt-dishes { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.kt-dishes figure { margin: 0; }
.kt-slate { position: relative; aspect-ratio: 4 / 3; border-radius: 6px; background: #262626; overflow: hidden; box-shadow: inset 0 0 0 1px #111; }
.kt-slate .mr-pc { animation: none; }
.kt-dishes figcaption { display: grid; margin-top: 6px; font-size: 12.5px; }
.kt-dishes small { font-size: 11px; color: #6f8f3a; }
.mr-kt .kt-next { padding: 8px 10px; border-left: 3px solid #c76b3c; background: #f8f2e8; border-radius: 0 8px 8px 0; }
.mr-kt .kt-ask { background: #f3ebde; margin-right: 4px; }

/* できた！ボタンと採点 */
.mr-acts { flex-wrap: wrap; align-items: center; }
.mr-how { font-size: 11px; color: var(--muted); }
.mr-done { margin-left: auto; padding: 9px 20px !important; border: 0 !important; border-radius: 99px; font-weight: 800; color: #fff !important; background: #2b2b2b !important; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .5); }
.mr-score { margin-top: 12px; display: grid; gap: 12px; padding: 16px; border-radius: 10px; background: #2b2b2b; color: #fff; }
@media (min-width: 900px) { .mr-score { grid-template-columns: 220px 1fr; align-items: center; } .mr-score .mr-done { grid-column: 1 / -1; justify-self: end; } }
.mr-sc-top { text-align: center; }
.mr-sc-top .mr-k { margin: 0; color: #f2c49b; }
.mr-sc-n { font-family: "Cormorant Garamond", serif; font-size: 72px; font-weight: 600; line-height: 1; }
.mr-sc-n small { font-family: "Zen Old Mincho", serif; font-size: 18px; margin-left: 4px; }
.mr-sc-word { margin: 4px 0; font-family: "Zen Old Mincho", serif; font-size: 15px; }
.mr-score .mr-small { color: #c9bfb2; }
.mr-sc-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mr-sc-rows li { display: grid; grid-template-columns: 70px 1fr 52px; grid-template-rows: auto auto; gap: 2px 10px; align-items: center; font-size: 12.5px; }
.mr-sc-rows i { height: 8px; border-radius: 99px; background: linear-gradient(90deg, #f2c49b calc(var(--p) * 1%), rgba(255, 255, 255, .12) 0); }
.mr-sc-rows b { text-align: right; font-size: 15px; } .mr-sc-rows b small { font-size: 10px; color: #c9bfb2; }
.mr-sc-rows em { grid-column: 2 / -1; font-style: normal; font-size: 11px; color: #c9bfb2; }
.mr-score .mr-done { background: #f2c49b !important; color: #2b2b2b !important; margin: 0; }
