/* regina.agency — deploy/regina/build.py が書き出すページの見た目。
 *
 * 夜の世界観で統一するので、配色は暗い1種類だけにしてある（利用者の明暗の設定では切り替えない）。
 * 色・書体は作品ごとに body の theme-* で変える。ブランド（トップ・お知らせ・お問い合わせ）は
 * 黒に近い紫の地に象牙色と金で、ロゴ（王冠の紋章）に合わせて見出しは Cinzel。
 *   ayakashi  漆黒に金と朱。麻の葉の和柄を薄く敷く。
 *   zombie    暗い緑がかった黒にピンク。見出しはタイプライター体で、テープで貼ったラベル風。
 *   wingup    夜空の紺に真鍮色。見出しは古い活字体（IM Fell English）。
 */
:root {
  --bg: #0d0b11;
  --bg-2: #16131c;
  --bg-3: #1f1b27;
  --text: #f3ede3;
  --muted: #a59eae;
  --accent: #c9a86a;
  --accent-2: #e6cf9a;
  --line: rgba(243, 237, 227, .12);
  --on-accent: #17120a;
  --h-font: "Cinzel", "Times New Roman", serif;
  --h-weight: 600;
  --h-track: .06em;
  --body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ital: "Cormorant Garamond", Georgia, serif;
  --radius: 14px;
  color-scheme: dark;
}
.theme-ayakashi {
  --bg: #0b0909; --bg-2: #150f10; --bg-3: #1f1617;
  --text: #f5ece0; --muted: #b3a491;
  --accent: #d6b25e; --accent-2: #c8323b; --line: rgba(214, 178, 94, .18); --on-accent: #1a1206;
}
.theme-zombie {
  --bg: #0e1312; --bg-2: #151c1a; --bg-3: #1d2724;
  --text: #ece6d8; --muted: #9daaa3;
  --accent: #ff5a92; --accent-2: #e9e1cd; --line: rgba(236, 230, 216, .13); --on-accent: #2a0612;
  --h-font: "Special Elite", "Courier New", monospace; --h-weight: 400; --h-track: .02em;
}
.theme-wingup {
  --bg: #0d1826; --bg-2: #13233a; --bg-3: #1a2f4b;
  --text: #f1e9da; --muted: #a6b2c2;
  --accent: #d39b47; --accent-2: #8cc0e6; --line: rgba(211, 155, 71, .2); --on-accent: #1d1305;
  --h-font: "IM Fell English", Georgia, serif; --h-weight: 400; --h-track: .01em;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 400 16px/1.75 var(--body);
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent-2); text-underline-offset: 3px; }
a:hover { color: var(--text); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--accent); color: var(--on-accent); padding: 8px 14px; z-index: 50; }
.skip:focus { left: 16px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.wrap { width: min(1160px, 100% - 32px); margin-inline: auto; }
.wrap.narrow { width: min(760px, 100% - 32px); }
.center { text-align: center; }
.muted { color: var(--muted); }
.split { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
@media (max-width: 820px) { .split { grid-template-columns: 1fr; } }

/* 見出し */
.h { font: var(--h-weight) clamp(1.6rem, 1.1rem + 2vw, 2.4rem)/1.2 var(--h-font); letter-spacing: var(--h-track); margin: 0 0 .9em; text-wrap: balance; }
.h.big { font-size: clamp(2rem, 1.3rem + 3vw, 3.2rem); }
.h.small { font-size: 1.3rem; }
.h::after { content: ""; display: block; width: 56px; height: 2px; margin-top: .45em; background: linear-gradient(90deg, var(--accent), transparent); }
.center .h::after { margin-inline: auto; }
.kicker { font: 600 .74rem/1.4 var(--body); letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin: 0 0 .9rem; }
.kicker a { color: inherit; }

/* ボタン */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4em; min-height: 46px; padding: .7em 1.5em; border-radius: 999px;
  background: var(--accent); color: var(--on-accent); border: 1px solid var(--accent); font: 600 .95rem/1 var(--body); letter-spacing: .04em;
  text-decoration: none; cursor: pointer; transition: transform .2s, background .2s, color .2s; }
.btn:hover { transform: translateY(-1px); background: var(--accent-2); border-color: var(--accent-2); color: var(--on-accent); }
.btn.ghost { background: transparent; color: var(--text); border-color: var(--line); }
.btn.ghost:hover { border-color: var(--accent); color: var(--accent); background: transparent; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 1.4rem 0 0; }

/* ストアのバッジ（公式画像。縦横比を変えずに高さだけそろえる） */
.stores { display: flex; flex-wrap: wrap; gap: 12px; margin: 1.6rem 0 0; align-items: center; }
.stores .store { display: block; border-radius: 10px; transition: transform .2s, box-shadow .2s; }
.stores .store:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0, 0, 0, .45); }
.stores img { height: 48px; width: auto; }
.stores.big { justify-content: center; }
.stores.big img { height: 58px; }
.stores.small img { height: 40px; }

/* ヘッダー */
.bar { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.bar-in { width: min(1160px, 100% - 32px); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; min-height: 64px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; }
.brand span, .foot-logo span { font: 600 1.15rem/1 "Cinzel", serif; letter-spacing: .28em; padding-left: .1em; }
.brand-mark { height: 32px; width: auto; }
.nav ul { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.nav a { display: block; padding: .5em .8em; color: var(--text); text-decoration: none; font: 500 .9rem/1.2 var(--body); letter-spacing: .03em; border-radius: 8px; }
.nav a:hover, .nav a[aria-current] { color: var(--accent); }
.nav-sep { width: 1px; height: 18px; background: var(--line); margin: 0 6px; }
.nav-toggle, .nav-button { display: none; }
@media (max-width: 900px) {
  .nav-button { display: grid; gap: 5px; padding: 12px; margin-right: -12px; cursor: pointer; }
  .nav-button span { display: block; width: 22px; height: 2px; background: var(--text); transition: transform .2s, opacity .2s; }
  .nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--bg-2); border-bottom: 1px solid var(--line); display: none; }
  .nav ul { flex-direction: column; align-items: stretch; padding: 8px 16px 16px; }
  .nav a { padding: .85em .4em; font-size: 1rem; border-bottom: 1px solid var(--line); border-radius: 0; }
  .nav-sep { display: none; }
  .nav-toggle:checked ~ .nav { display: block; }
  .nav-toggle:checked + .nav-button span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle:checked + .nav-button span:nth-child(2) { opacity: 0; }
  .nav-toggle:checked + .nav-button span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

.sec { padding: clamp(56px, 8vw, 104px) 0; }
.sec + .sec { border-top: 1px solid var(--line); }

/* ---------------- トップ */
.hero-home { position: relative; min-height: min(78vh, 720px); display: grid; place-items: center; overflow: hidden; isolation: isolate; text-align: center; }
.slides { position: absolute; inset: 0; z-index: -2; }
.slides span { position: absolute; inset: -4%; background: center / cover no-repeat; opacity: 0; filter: saturate(.9); animation: slide 18s infinite; }
.slides span:nth-child(1) { animation-delay: 0s; opacity: 1; }
.slides span:nth-child(2) { animation-delay: 6s; }
.slides span:nth-child(3) { animation-delay: 12s; }
@keyframes slide { 0% { opacity: 0; transform: scale(1.06); } 6% { opacity: 1; } 33% { opacity: 1; } 40% { opacity: 0; transform: scale(1); } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .slides span:nth-child(1) { opacity: 1; } }
.hero-home::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: radial-gradient(ellipse at center, rgba(13, 11, 17, .55) 0%, rgba(13, 11, 17, .86) 62%, var(--bg) 100%), linear-gradient(180deg, transparent 55%, var(--bg)); }
.hero-home-in { padding: 64px 16px; }
.hero-home h1 { margin: 0; }
.hero-logo { width: min(420px, 78vw); margin-inline: auto; filter: drop-shadow(0 10px 40px rgba(0, 0, 0, .6)); }
.tagline { font: italic 500 clamp(1.25rem, 1rem + 1.2vw, 1.75rem)/1.4 var(--ital); color: var(--accent-2); margin: 1rem 0 0; letter-spacing: .02em; }
.hero-home .hero-actions { justify-content: center; margin-top: 2rem; }

.game-cards { display: grid; gap: 28px; }
.game-card { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); background: var(--bg-2); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; }
.game-card:nth-child(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.game-card:nth-child(even) .game-card-art { order: 2; }
.game-card-art { display: block; overflow: hidden; background: #000; }
.game-card-art img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.game-card:hover .game-card-art img { transform: scale(1.04); }
.game-card-body { padding: clamp(24px, 3.5vw, 44px); align-self: center; }
.game-card h3 { font: var(--h-weight) clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem)/1.15 var(--h-font); letter-spacing: var(--h-track); margin: 0 0 .6rem; }
.game-card h3 a { color: var(--text); text-decoration: none; }
.game-card p { margin: 0 0 1rem; color: color-mix(in srgb, var(--text) 86%, var(--muted)); }
.game-card .stores { margin: 0 0 1.2rem; }
@media (max-width: 820px) {
  .game-card, .game-card:nth-child(even) { grid-template-columns: 1fr; }
  .game-card:nth-child(even) .game-card-art { order: 0; }
}

.news-list { list-style: none; margin: 0 0 1.5rem; padding: 0; border-top: 1px solid var(--line); }
.news-list li { display: grid; grid-template-columns: 11em 1fr auto; gap: 8px 24px; align-items: baseline; padding: 1.05rem 0; border-bottom: 1px solid var(--line); }
.news-list time { color: var(--muted); font-variant-numeric: tabular-nums; font-size: .92rem; }
.news-list a { color: var(--text); text-decoration: none; font-weight: 500; }
.news-list a:hover { color: var(--accent); }
.news-list .cat { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--line); border-radius: 999px; padding: .2em .8em; }
@media (max-width: 560px) { .news-list li { grid-template-columns: 1fr; } .news-list .cat { justify-self: start; } }
.more-link { color: var(--accent); font-weight: 600; text-decoration: none; }
.more-link::after { content: " →"; }

/* ---------------- お知らせ */
.post-date { color: var(--muted); margin: -.4rem 0 2rem; }
.post-figs { display: grid; gap: 20px; margin-bottom: 2rem; }
.post-figs figure { margin: 0; }
.post-figs img { border-radius: var(--radius); border: 1px solid var(--line); }

/* ---------------- 作品ページ */
.hero-game { position: relative; overflow: hidden; isolation: isolate; padding: clamp(40px, 7vw, 96px) 0 clamp(48px, 7vw, 88px); }
.hero-bg { position: absolute; inset: -40px; z-index: -1; background: var(--key) center / cover no-repeat; filter: blur(28px) saturate(1.1); opacity: .5; transform: scale(1.1); }
.hero-game::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 78%, transparent) 46%, color-mix(in srgb, var(--bg) 40%, transparent) 100%), linear-gradient(180deg, transparent 60%, var(--bg)); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.title { font: var(--h-weight) clamp(2.4rem, 1.4rem + 4.4vw, 4.6rem)/1.02 var(--h-font); letter-spacing: var(--h-track); margin: 0 0 1.2rem; text-wrap: balance; }
.lead p { margin: 0 0 .8rem; font-size: 1.06rem; color: color-mix(in srgb, var(--text) 90%, var(--muted)); max-width: 34em; }
.hero-art { position: relative; }
.hero-art .key { width: 100%; border-radius: 18px; border: 1px solid var(--line); box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .03); }
/* アプリのアイコンは題名の上に。キービジュアルに重ねると作品ロゴを隠す（高橋の指摘） */
.title-row { display: flex; align-items: center; gap: 16px; margin-bottom: 1.1rem; }
.title-row .kicker { margin: 0; }
.app-icon { width: clamp(64px, 7vw, 84px); height: auto; flex: 0 0 auto; border-radius: 22%; border: 1px solid var(--line); box-shadow: 0 10px 28px rgba(0, 0, 0, .55); }
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-art { order: -1; margin-bottom: 24px; }
}

.gallery .h { margin-bottom: 1.4rem; }
/* 横に送る列（スクリーンショット・キャラクター）。見出しと同じ幅の中に収め、スクロールバーは隠して
 * 左右のボタンで送る。以前は画面の端から端まで広げていたため、広い画面ではスナップで列の頭が見出しより
 * 左にずれて止まり、太いスクロールバーも目立っていた（高橋の指摘「横スクロールバーはダサい」）。 */
.rail { position: relative; }
.rail-track { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 18px;
  scrollbar-width: none; -ms-overflow-style: none; overscroll-behavior-x: contain; }
.rail-track::-webkit-scrollbar { display: none; }
.rail.has-more-right .rail-track { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.rail.has-more-left .rail-track { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%); mask-image: linear-gradient(90deg, transparent, #000 12%); }
.rail.has-more-left.has-more-right .rail-track { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.rail-btn { position: absolute; top: calc(50% - 30px); z-index: 2; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 70%, transparent); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  color: var(--text); font: 400 28px/1 var(--body); cursor: pointer; display: grid; place-items: center; padding: 0 0 3px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .45); transition: opacity .2s, background .2s, color .2s; }
.rail-btn:hover { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.rail-btn[hidden] { display: none; }
.rail-btn:disabled { opacity: 0; pointer-events: none; }
.rail-btn.prev { left: -12px; }
.rail-btn.next { right: -12px; }
@media (max-width: 640px) { .rail-btn { width: 40px; height: 40px; font-size: 24px; } .rail-btn.prev { left: 4px; } .rail-btn.next { right: 4px; } }
.shot { flex: 0 0 clamp(170px, 22vw, 236px); margin: 0; scroll-snap-align: start; }
.shot a { display: block; border-radius: 22px; overflow: hidden; border: 1px solid var(--line); background: #000; box-shadow: 0 16px 40px rgba(0, 0, 0, .45); transition: transform .25s; }
.shot a:hover { transform: translateY(-4px); }
.shot img { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; }
.shot figcaption, .cast-card figcaption { margin-top: .7rem; text-align: center; font: var(--h-weight) 1.05rem/1.2 var(--h-font); letter-spacing: var(--h-track); color: var(--accent); }

/* キャラクター（公式の紹介映像の、名前と台詞の場面。16:9 の大きなカードを横に送る） */
.characters .h { margin-bottom: 1.4rem; }
.chara { flex: 0 0 min(760px, 86%); margin: 0; scroll-snap-align: start; }
.chara img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 18px; border: 1px solid var(--line); box-shadow: 0 24px 60px rgba(0, 0, 0, .5); }
.chara figcaption { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem 1rem; margin-top: .9rem; }
.chara-name { font: var(--h-weight) 1.5rem/1.1 var(--h-font); letter-spacing: var(--h-track); color: var(--accent); }
.chara-quote { font: italic 500 1.12rem/1.4 var(--ital); color: var(--accent-2); }
.theme-ayakashi .chara-quote { color: color-mix(in srgb, var(--text) 82%, var(--accent)); }

.prose p { margin: 0 0 1.15rem; font-size: 1.04rem; }
.phone { margin: 0; justify-self: center; width: min(300px, 100%); }
.phone img { border-radius: 26px; border: 1px solid var(--line); box-shadow: 0 24px 60px rgba(0, 0, 0, .5); }

.features { background: var(--bg-2); }
.feature-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.feature-list li { position: relative; padding: 1.05rem 1.2rem 1.05rem 3.1rem; background: var(--bg-3); border: 1px solid var(--line); border-radius: var(--radius); }
.feature-list li::before { content: ""; position: absolute; left: 1.15rem; top: 1.45rem; width: 12px; height: 12px; transform: rotate(45deg); background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 22%, transparent); }

.yt { position: relative; max-width: 960px; margin-inline: auto; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; border: 1px solid var(--line); background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.yt a, .yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.yt img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: opacity .2s; }
.yt a:hover img { opacity: 1; }
.yt .play { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%; background: var(--accent); box-shadow: 0 10px 40px rgba(0, 0, 0, .5); }
.yt .play::after { content: ""; position: absolute; left: 34px; top: 27px; border-style: solid; border-width: 15px 0 15px 24px; border-color: transparent transparent transparent var(--on-accent); }

.story { background: var(--bg-2); }
.story-text p { font: 400 1.08rem/1.95 var(--body); margin: 0 0 1.4rem; }
.story-text .say { display: inline-block; margin: .25rem 0; font: italic 500 1.32rem/1.5 var(--ital); color: var(--accent-2); }
.cast { display: flex; justify-content: center; align-items: flex-end; gap: clamp(16px, 4vw, 48px); margin-top: 3rem; flex-wrap: wrap; }
.cast-card { margin: 0; }
.cast-card img { height: clamp(320px, 46vw, 560px); width: auto; filter: drop-shadow(0 18px 40px rgba(0, 0, 0, .55)); }
.cast-card.is-shot img { height: clamp(300px, 40vw, 480px); border-radius: 22px; border: 1px solid var(--line); }

.download { background: radial-gradient(ellipse at center top, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%); }
.spec-list { margin: 0; border-top: 1px solid var(--line); }
.spec-list .row { display: grid; grid-template-columns: 13em 1fr; gap: 6px 24px; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.spec-list dt { color: var(--accent); font-weight: 600; letter-spacing: .02em; }
.spec-list dd { margin: 0; }
@media (max-width: 560px) { .spec-list .row { grid-template-columns: 1fr; } }
.game-copy { margin: 1.6rem 0 0; color: var(--muted); font-size: .9rem; }

.others { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.other { position: relative; display: block; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); color: var(--text); text-decoration: none; }
.other img { width: 100%; aspect-ratio: 1024 / 500; object-fit: cover; transition: transform .5s; }
.other:hover img { transform: scale(1.04); }
.other span { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2rem 1rem .8rem; background: linear-gradient(transparent, rgba(0, 0, 0, .85)); font-weight: 600; }

/* 拡大表示 */
.lightbox { padding: 0; border: 0; background: transparent; max-width: 96vw; max-height: 94vh; }
.lightbox::backdrop { background: rgba(5, 4, 8, .9); backdrop-filter: blur(4px); }
.lightbox img { max-width: 96vw; max-height: 92vh; width: auto; height: auto; border-radius: 18px; }
.lb-close { position: fixed; top: 14px; right: 18px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(0, 0, 0, .5); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }

/* ---------------- お問い合わせ */
.card { background: var(--bg-2); border: 1px solid var(--line); border-radius: 20px; padding: clamp(22px, 4vw, 40px); margin-top: 2rem; }
.imel-form .row { margin-bottom: 1.25rem; }
.imel-form label { display: block; font-weight: 600; margin-bottom: .45rem; }
.imel-form label em { font-style: normal; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--on-accent); background: var(--accent); border-radius: 999px; padding: .15em .6em; margin-left: .5em; vertical-align: 2px; }
.imel-form input, .imel-form select, .imel-form textarea { width: 100%; font: inherit; font-size: 16px; color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: .75em .9em; }
.imel-form textarea { resize: vertical; min-height: 180px; }
.imel-form input:focus, .imel-form select:focus, .imel-form textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.imel-form .err { display: block; color: #ff8a8a; font-size: .88rem; margin-top: .35rem; }
.imel-form .bad input, .imel-form .bad textarea, .imel-form .bad select { border-color: #ff8a8a; }
.imel-form .cf-turnstile { margin: .5rem 0 1.2rem; }
.imel-form .form-status { font-weight: 600; min-height: 1.5em; margin: .8rem 0 0; }
.imel-form .form-status.ok { color: #8fe0a6; }
.imel-form .form-status.ng { color: #ff8a8a; }
.imel-form button:disabled { opacity: .6; cursor: default; }

/* ---------------- フッター */
.foot { border-top: 1px solid var(--line); background: var(--bg-2); padding: 56px 0 24px; }
.foot-in { width: min(1160px, 100% - 32px); margin-inline: auto; display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 32px; }
.foot-logo { display: flex; align-items: center; gap: 12px; margin: 0; }
.foot-mark { height: 44px; width: auto; }
.foot-tag { color: var(--muted); font: italic 500 1.15rem/1.4 var(--ital); margin: .8rem 0 1rem; }
.social { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; }
.social a { display: inline-flex; align-items: center; gap: .5em; padding: .5em .9em; border: 1px solid var(--line); border-radius: 999px; color: var(--text); text-decoration: none; font-size: .9rem; }
.social a:hover { border-color: var(--accent); color: var(--accent); }
.social svg { width: 16px; height: 16px; fill: currentColor; }
.foot-h { font: 600 .74rem/1 var(--body); letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin: .4rem 0 1rem; }
.foot-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.foot-nav a { color: var(--text); text-decoration: none; }
.foot-nav a:hover { color: var(--accent); }
.copy { width: min(1160px, 100% - 32px); margin: 40px auto 0; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .86rem; }
@media (max-width: 720px) { .foot-in { grid-template-columns: 1fr 1fr; } .foot-brand { grid-column: 1 / -1; } }

/* ---------------- 作品ごとの飾り */
/* AYAKASHI: 麻の葉の和柄（金の細線）を地に薄く */
.theme-ayakashi .features, .theme-ayakashi .story {
  background-color: var(--bg-2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cg fill='none' stroke='%23d6b25e' stroke-opacity='.07' stroke-width='1'%3E%3Cpath d='M28 0v32.3M0 16.2l28 16.1 28-16.1M0 16.2v32.3l28 16.1 28-16.1V16.2M28 64.7V97M0 48.5l28-16.2 28 16.2M0 80.8l28-16.1 28 16.1'/%3E%3C/g%3E%3C/svg%3E");
}
.theme-ayakashi .title { background: linear-gradient(180deg, #f7e7bf 0%, #d6b25e 60%, #a8802f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.theme-ayakashi .kicker::before { content: "妖 · "; color: var(--accent-2); }
.theme-ayakashi .h::after { background: linear-gradient(90deg, var(--accent-2), var(--accent), transparent); }

/* Zombie: 見出しをテープで貼ったラベル風に。少し傾ける */
.theme-zombie .h { display: inline-block; background: #e9e1cd; color: #161b19; padding: .25em .7em .2em; transform: rotate(-1.2deg); box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }
.theme-zombie .h::after { display: none; }
.theme-zombie .h.small { font-size: 1.15rem; }
.theme-zombie .title { font-size: clamp(2.6rem, 1.4rem + 4.8vw, 5rem); text-shadow: 0 0 28px rgba(255, 90, 146, .35); }
.theme-zombie .title::first-letter { color: var(--accent); }
.theme-zombie .hero-game::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .18; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"); }
.theme-zombie .feature-list li::before { background: var(--accent); }

/* Wing up: 真鍮の歯車を見出しの前に。地は夜空のグラデーション */
.theme-wingup .h::before { content: ""; display: inline-block; width: .8em; height: .8em; margin-right: .4em; vertical-align: -.05em;
  background: radial-gradient(circle, var(--bg) 0 28%, transparent 29%), conic-gradient(from 0deg, var(--accent) 0 8%, transparent 8% 12.5%, var(--accent) 12.5% 20.5%, transparent 20.5% 25%, var(--accent) 25% 33%, transparent 33% 37.5%, var(--accent) 37.5% 45.5%, transparent 45.5% 50%, var(--accent) 50% 58%, transparent 58% 62.5%, var(--accent) 62.5% 70.5%, transparent 70.5% 75%, var(--accent) 75% 83%, transparent 83% 87.5%, var(--accent) 87.5% 95.5%, transparent 95.5%);
  border-radius: 50%; -webkit-mask: radial-gradient(circle, #000 0 70%, transparent 71%); mask: radial-gradient(circle, #000 0 70%, transparent 71%); }
.theme-wingup .center .h::before { display: none; }
.theme-wingup .title { color: #f6e3bf; text-shadow: 0 2px 0 #7a5320, 0 0 30px rgba(211, 155, 71, .25); }
.theme-wingup .story-text .say { font-family: "IM Fell English", Georgia, serif; }