/*
 * ⚠️⚠️ 会員限定の箱の見た目（⚠️ 版 0.2.2・⚠️ 2026-10-24）。
 *
 * ⚠️ 本体の暗いデザインに合わせる（⚠️ コメント欄と同じ色づかい）。
 *
 * ## ⚠️⚠️ なぜ作り直したか
 *
 *    ⚠️ 本番で、⚠️⚠️ **箱の中の文字がほとんど読めなかった**。
 *       ⚠️ 明るい灰色の箱に、⚠️ テーマの白い文字がかかっていた。
 *    ⚠️ 箱が明るくて、⚠️ 本体の暗いデザインに馴染んでいなかった。
 *
 * ## ⚠️⚠️ だから、箱の中の色は**すべてここで決める**
 *
 *    ⚠️ テーマの文字色・背景色に負けないよう、`!important` を付ける。
 *    ⚠️ ⚠️ **「指定しない」は、テーマに任せることになる。**
 *       ⚠️⚠️ **それが今回の不具合の原因だった。**
 *
 * ## ⚠️ 色は、コメント欄（pkt-comment-ui.css）から取っている
 *
 *    ⚠️ カードの背景 #1c1c1c ／ ⚠️ 角の丸み 8px
 *    ⚠️ オレンジ #ffa500 ／ ⚠️ オレンジの上の文字 #111
 *    ⚠️ 本文 #fff ／ ⚠️ 添える文 #c8c8c8 ／ ⚠️ 枠 #3d3d3d
 */

.pokka-members-only {
    box-sizing: border-box;
    margin: 2em 0;
    padding: 18px 16px;
    border-radius: 8px;
    text-align: center;
}

/*
 * ⚠️⚠️ **2つの class 名の両方に当てること。**
 *
 *    ⚠️ php が出すのは `pokka-members-only__lead`
 *    ⚠️ js が出すのは  `pokka-mo__lead`
 *    ⚠️ ⚠️ **前の版は js の方にしか当てていなかった。**
 *       ⚠️⚠️ **js が動く前の文は、色が決まっていなかった。**
 */
.pokka-members-only__lead,
.pokka-mo__lead {
    margin: 0 0 12px !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

.pokka-mo__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0;
}

/* ⚠️ コメント欄のボタンと同じ形（⚠️ 丸い・⚠️ 高さ44px） */
.pokka-members-only .pokka-mo__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid #ffa500 !important;
    border-radius: 999px !important;
    background: #ffa500 !important;
    color: #111 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.pokka-members-only .pokka-mo__button:hover,
.pokka-members-only .pokka-mo__button:focus {
    background: #ffcf80 !important;
    border-color: #ffcf80 !important;
    color: #111 !important;
}

/* ⚠️ 2つ目のボタン（⚠️ ログイン）は、枠だけ */
.pokka-members-only .pokka-mo__button--ghost {
    background: transparent !important;
    color: #ffa500 !important;
}

.pokka-members-only .pokka-mo__button--ghost:hover,
.pokka-members-only .pokka-mo__button--ghost:focus {
    background: rgba(255, 255, 255, .1) !important;
    border-color: #ffa500 !important;
    color: #ffa500 !important;
}

/*
 * ⚠️⚠️ **「登録は無料です」の一文は、読みやすく残すこと。**
 *
 *    ⚠️ 小さくしすぎない（⚠️ 13px）。
 *    ⚠️ 暗すぎない色にする（⚠️ #c8c8c8）。
 *    ⚠️ ⚠️ **コインに実利を持たせないための一文なので、消さない。**
 */
.pokka-members-only .pokka-mo__note {
    margin: 12px 0 0 !important;
    padding: 0 !important;
    color: #c8c8c8 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

/*
 * ⚠️ 読み込んだ本文は、記事と同じ見た目のままにする。
 *
 * ⚠️⚠️ **ここに色を付けないこと。** ⚠️ 箱ごと差し替わるので、
 *    ⚠️ 記事本文の見た目をそのまま使う。
 */
.pokka-mo__body {
    margin: 0;
}

/* ⚠️ スマートフォン */
@media (max-width: 480px) {
    .pokka-members-only {
        padding: 16px 12px;
    }

    .pokka-members-only .pokka-mo__button {
        width: 100%;
    }

    .pokka-mo__actions {
        flex-direction: column;
        gap: 8px;
    }
}

/*
 * ⚠️⚠️ **枠はオレンジ**（⚠️ 運営者の判断・2026-10-24）。
 *
 *    ⚠️ コメント欄の「案内の箱」と同じ形にする。
 *    ⚠️ ⚠️ **落ち着いた枠（#3d3d3d）の案もあったが、こちらを採った。**
 */
.pokka-members-only {
    border: 1px solid #ffa500;
    background: #1a1a1a !important;
}

/*
 * ⚠️⚠️ **編集者向けのプレビューの帯**（⚠️ 版 0.2.7）。
 *
 * ⚠️ ⚠️ **「いま見えているものは、読者には見えない」と伝えるためのもの。**
 *    ⚠️⚠️ **目立たせること。** ⚠️ 見落とすと、公開したつもりになる。
 */
.pokka-mo-preview {
    box-sizing: border-box;
    margin: 0 0 16px !important;
    padding: 12px 14px !important;
    border: 2px solid #ffa500 !important;
    border-radius: 6px !important;
    background: #ffa500 !important;
    color: #111 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

/*
 * ⚠️⚠️ **読み込んだ本文を、画面からはみ出させない**（⚠️ 版 0.2.8）。
 *
 * ## ⚠️⚠️ 本番で起きたこと（⚠️ 2026-10-25・⚠️ スマートフォン）
 *
 *    ⚠️ 本文を渡す口は**別の通信**なので、
 *    ⚠️⚠️ **スマートフォン用のテーマの決まりが効かず、
 *       ⚠️ パソコン用の幅（640px）のまま本文が作られていた。**
 *
 *    → ⚠️⚠️ **中身が画面からはみ出し、ページ全体が縮んで小さく見えた**
 *       （⚠️ 375 ÷ 640 ＝ 0.59）。
 *
 * ## ⚠️ 幅は、php の側でも合わせている
 *
 *    ⚠️ ここは**念のための押さえ**。
 *    ⚠️ ⚠️ **幅が伝わらなかったときも、はみ出させない。**
 */
.pokka-mo__body {
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* ⚠️⚠️ **大きさを持つものは、すべて画面に収める** */
.pokka-mo__body img,
.pokka-mo__body video,
.pokka-mo__body iframe,
.pokka-mo__body embed,
.pokka-mo__body object,
.pokka-mo__body .wp-video,
.pokka-mo__body .wp-video-shortcode,
.pokka-mo__body .mejs-container,
.pokka-mo__body .mejs-overlay,
.pokka-mo__body .mejs-poster,
.pokka-mo__body .mejs-mediaelement {
    max-width: 100% !important;
}

/*
 * ⚠️ 動画は、⚠️⚠️ **高さを幅に合わせる**（⚠️ 縦横の比を保つ）。
 *    ⚠️ ⚠️ **高さを決め打ちのままにすると、黒い帯が残る。**
 */
.pokka-mo__body video,
.pokka-mo__body .wp-video,
.pokka-mo__body .wp-video-shortcode,
.pokka-mo__body .mejs-container {

}

/* ⚠️ 本体の記事でよく使われる入れ物も、収める */
.pokka-mo__body .w600 {
    max-width: 100% !important;
}

/*
 * ⚠️ 表は、⚠️⚠️ **そこだけ横にすべらせる**（⚠️ ページ全体を広げない）。
 */
.pokka-mo__body table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

/* ⚠️⚠️ **長いアドレスが、横に突き抜けないように** */
.pokka-mo__body a,
.pokka-mo__body pre {
    overflow-wrap: break-word;
    word-break: break-word;
}

.pokka-mo__body pre {
    max-width: 100%;
    overflow-x: auto;
}

/*
 * ⚠️⚠️ **一覧の印（カテゴリの隣・コメントの右）は、やめた**
 *    （⚠️ 版 0.2.14・⚠️ 2026-10-27・⚠️ 運営者の判断）。
 *
 * ## ⚠️ なぜ
 *
 *    ⚠️ ⚠️ **ランキング・新着・関連記事には、囲いが無く、付けられなかった。**
 *    ⚠️⚠️ **「どこでも分かるように」には、届かなかった。**
 *
 * ## ⚠️⚠️ 代わりに
 *
 *    ⚠️ php が、⚠️⚠️ **題の文頭に「会員限定 › 」の文字**を付ける。
 *    ⚠️ js が、その文字を ⚠️⚠️ **下の札**に置き換える。
 *
 *    ⚠️ ⚠️ **js が動かなくても、文字のまま読める。**
 */

/*
 * ⚠️⚠️ **題の中の「会員限定」の札**（⚠️ 版 0.2.15・⚠️ 2026-10-27）。
 *
 * ## ⚠️⚠️ チケット型にする（⚠️ 参考画像のとおり）
 *
 *    ⚠️ 0.2.14 は、⚠️ **ただの四角**で出ていた。
 *
 *    ⚠️① ⚠️⚠️ **右の端に、内側への V の切り込み**（⚠️ リボンの端）
 *    ⚠️② ⚠️⚠️ **高さを、題の文字と同じくらいに**（⚠️ 上下の余白を詰める）
 *    ⚠️③ ⚠️⚠️ **題の文字と、ほとんど空けない**
 *
 *    ⚠️ 色（⚠️ オレンジ地・黒の太字）は、⚠️⚠️ **変えない。**
 *
 * ## ⚠️⚠️ すべてに !important を付ける理由
 *
 *    ⚠️ ⚠️ **本体のテーマが、題の中の要素に見た目を当てている。**
 *    ⚠️⚠️ **付けないと、負けて四角に戻る。**
 */
.pokka-mo-title-badge {
    display: inline-block !important;
    /*
     * ⚠️⚠️ **右を広くとる**（⚠️ 切り込みのぶん）。
     *    ⚠️ ⚠️ **狭いと、文字に切り込みが食い込みます。**
     *
     * ## ⚠️⚠️ 上の .1em は、運営者が本番で直した値（2026-10-28）
     *
     *    ⚠️ 0.2.15 を入れたあと、⚠️⚠️ **本番の css を直接1か所**直された。
     *    ⚠️ ⚠️ **札の文字が、少し上に寄って見えたため。**
     *
     *    ⚠️⚠️ **次の版で元に戻らないよう、ここにも入れてある。**
     *       ⚠️ ⚠️ **勝手に 0 へ戻さないこと。**
     */
    padding: .1em .95em 0 .5em !important;
    /* ⚠️⚠️ **角は丸めない**（⚠️ カテゴリの表記と同じ） */
    border-radius: 0 !important;
    border: 0 !important;
    background: #ffa500 !important;
    color: #111 !important;
    font-size: inherit !important;
    font-weight: 700 !important;
    /*
     * ⚠️⚠️ **高さは、題の文字と同じくらい**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *
     *    ⚠️ 0.2.14 は 1.5 で、⚠️⚠️ **上下に余白が付いて厚く見えた。**
     *    ⚠️ ⚠️ **1.25 まで詰める**（⚠️ これ以上詰めると、漢字の下が切れます）。
     */
    line-height: 1.25 !important;
    /*
     * ⚠️⚠️ **題の文字と、ほとんど空けない**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *    ⚠️ 0.2.14 は .4em で、⚠️ **離れて見えた。**
     */
    margin: 0 .1em 0 0 !important;
    /* ⚠️⚠️ **題が折り返しても、札だけは切らない** */
    white-space: nowrap !important;
    vertical-align: baseline !important;
    /* ⚠️ テーマの下線・影に、負けないように */
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    /*
     * ⚠️⚠️ **右の端に、内側への V の切り込み**（⚠️ 版 0.2.15・⚠️ 参考画像）。
     *
     *    ⚠️ ⚠️ **リボンの端のような形。** ⚠️ 左の端は、まっすぐ。
     *
     *    ⚠️ 点の順番：
     *       ⚠️ 左上 → ⚠️ 右上 → ⚠️⚠️ **右の真ん中（内側へ）** → ⚠️ 右下 → ⚠️ 左下
     *
     *    ⚠️⚠️ **clip-path が効かない古いブラウザでは、ただの四角**になります。
     *       ⚠️ ⚠️ **読めなくなることは、ありません。**
     */
    clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
}

/*
 * ⚠️⚠️ **続きを読むの箱の、上下の余白**（⚠️ 版 0.2.14・⚠️ 運営者の指定）。
 *
 *    ⚠️ 0.2.11〜0.2.13 は、⚠️ **囲い（.pokka-mo-wrap）に付けていた。**
 *    ⚠️ ⚠️ **囲いは、意見への回答の箱のためのもの。**
 *    ⚠️⚠️ **その箱を消したので、箱そのものに付け直す。**
 */
.pokka-members-only {
    margin: 7em 0 !important;
}

/*
 * ⚠️⚠️ **意見への回答の箱は、やめた**（⚠️ 版 0.2.14・⚠️ 2026-10-27）。
 *
 *    ⚠️ ⚠️ **0.2.12 を入れた直後から、会員登録が大きく減った。**
 *    ⚠️⚠️ **css も、まるごと外した。**
 *    ⚠️ ⚠️ **pokka-members-only-faq.json も、もう読まない。**
 */

/*
 * ⚠️⚠️ **記事ページの大見出しの札**（⚠️ 版 0.2.17・⚠️ 2026-10-29）。
 *
 * ## ⚠️⚠️ 題の文字には、1文字も足しません
 *
 *    ⚠️ php が `<body>` に `pokka-mo-single` を付けるので、
 *    ⚠️ ⚠️ **ここで札を描きます。**
 *
 *    ⚠️⚠️ **ブラウザのタブ・og:title・構造化データ・RSS には、
 *       ⚠️ 何も出ません**（⚠️ 版 0.2.16 のまま）。
 *
 * ## ⚠️ 見た目は、一覧の札とそろえること
 *
 *    ⚠️ ⚠️ **上の `.pokka-mo-title-badge` と、同じ値にしています。**
 *    ⚠️⚠️ **片方だけ直すと、一覧と記事ページで形が変わります。**
 *
 * ## ⚠️⚠️ h1 だけに付けること
 *
 *    ⚠️ ⚠️ **記事ページの中のランキングや関連記事には、
 *       ⚠️⚠️ js が札を付けます**（⚠️ 二重に出さないため）。
 *
 * ⚠️ 会員にも、会員でない人にも出ます（⚠️ 運営者の指示）。
 */
/*
 * ⚠️⚠️ **札は、大見出しの `<a>` に出すこと**（⚠️ 版 0.2.18・⚠️ 2026-10-29）。
 *
 * ## ⚠️⚠️ 版 0.2.17 で踏んだこと
 *
 *    ⚠️ 本番で、⚠️⚠️ **大見出しの札が、一覧の札より小さく見えました。**
 *
 *    ⚠️ ⚠️ **テーマを読んだところ、大きな文字は `<a>` に付いていました：**
 *
 *        ⚠️ h1.entry-title a { font-size: 22px; }   ⚠️ … ⚠️ PC
 *        ⚠️ h1.entry-title 自身には、文字の大きさの指定が **無い**
 *
 *    ⚠️⚠️ **`h1::before` は、h1 自身の大きさを受け継ぎます。**
 *       ⚠️ ⚠️ **だから小さくなっていました。**
 *
 * ## ⚠️ 一覧の札は、なぜ正しかったか
 *
 *    ⚠️ ⚠️ **js が `<a>` の中に `<span>` を入れているためです。**
 *    ⚠️⚠️ **22px を受け継いでいました。**
 *
 * ## ⚠️⚠️ だから、`<a>` に付け直します
 *
 *    ⚠️ ⚠️ **これで、一覧の札と同じ比率になります。**
 *    ⚠️⚠️ **PC（22px）も SP（16px）も、同じ考え方で合います。**
 *
 * ⚠️ 色・形・余白は、⚠️⚠️ **変えていません**（⚠️ 運営者の指示）。
 */
body.pokka-mo-single h1.entry-title a::before {
    content: "会員限定";

    display: inline-block !important;
    /*
     * ⚠️⚠️ **右を広くとる**（⚠️ 切り込みのぶん）。
     *    ⚠️ ⚠️ **狭いと、文字に切り込みが食い込みます。**
     *
     * ## ⚠️⚠️ 上の .1em は、運営者が本番で直した値（2026-10-28）
     *
     *    ⚠️ 0.2.15 を入れたあと、⚠️⚠️ **本番の css を直接1か所**直された。
     *    ⚠️ ⚠️ **札の文字が、少し上に寄って見えたため。**
     *
     *    ⚠️⚠️ **次の版で元に戻らないよう、ここにも入れてある。**
     *       ⚠️ ⚠️ **勝手に 0 へ戻さないこと。**
     */
    padding: .1em .95em 0 .5em !important;
    /* ⚠️⚠️ **角は丸めない**（⚠️ カテゴリの表記と同じ） */
    border-radius: 0 !important;
    border: 0 !important;
    background: #ffa500 !important;
    color: #111 !important;
    font-size: inherit !important;
    font-weight: 700 !important;
    /*
     * ⚠️⚠️ **高さは、題の文字と同じくらい**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *
     *    ⚠️ 0.2.14 は 1.5 で、⚠️⚠️ **上下に余白が付いて厚く見えた。**
     *    ⚠️ ⚠️ **1.25 まで詰める**（⚠️ これ以上詰めると、漢字の下が切れます）。
     */
    line-height: 1.25 !important;
    /*
     * ⚠️⚠️ **題の文字と、ほとんど空けない**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *    ⚠️ 0.2.14 は .4em で、⚠️ **離れて見えた。**
     */
    margin: 0 .1em 0 0 !important;
    /* ⚠️⚠️ **題が折り返しても、札だけは切らない** */
    white-space: nowrap !important;
    vertical-align: baseline !important;
    /* ⚠️ テーマの下線・影に、負けないように */
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    /*
     * ⚠️⚠️ **右の端に、内側への V の切り込み**（⚠️ 版 0.2.15・⚠️ 参考画像）。
     *
     *    ⚠️ ⚠️ **リボンの端のような形。** ⚠️ 左の端は、まっすぐ。
     *
     *    ⚠️ 点の順番：
     *       ⚠️ 左上 → ⚠️ 右上 → ⚠️⚠️ **右の真ん中（内側へ）** → ⚠️ 右下 → ⚠️ 左下
     *
     *    ⚠️⚠️ **clip-path が効かない古いブラウザでは、ただの四角**になります。
     *       ⚠️ ⚠️ **読めなくなることは、ありません。**
     */
    clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
}

/*
 * ⚠️ 大見出しに `<a>` が無いテーマのための、控え。
 *
 * ⚠️⚠️ **`<a>` があるときは、こちらを出しません**（⚠️ 二重に出さないため）。
 *    ⚠️ ⚠️ **`:has()` が効かない古いブラウザでは、この控えが落ちます。**
 *       ⚠️⚠️ **本番のテーマには `<a>` があるので、困りません**（⚠️ 実測）。
 */
body.pokka-mo-single h1.entry-title:not(:has(a))::before {
    content: "会員限定";

    display: inline-block !important;
    /*
     * ⚠️⚠️ **右を広くとる**（⚠️ 切り込みのぶん）。
     *    ⚠️ ⚠️ **狭いと、文字に切り込みが食い込みます。**
     *
     * ## ⚠️⚠️ 上の .1em は、運営者が本番で直した値（2026-10-28）
     *
     *    ⚠️ 0.2.15 を入れたあと、⚠️⚠️ **本番の css を直接1か所**直された。
     *    ⚠️ ⚠️ **札の文字が、少し上に寄って見えたため。**
     *
     *    ⚠️⚠️ **次の版で元に戻らないよう、ここにも入れてある。**
     *       ⚠️ ⚠️ **勝手に 0 へ戻さないこと。**
     */
    padding: .1em .95em 0 .5em !important;
    /* ⚠️⚠️ **角は丸めない**（⚠️ カテゴリの表記と同じ） */
    border-radius: 0 !important;
    border: 0 !important;
    background: #ffa500 !important;
    color: #111 !important;
    font-size: inherit !important;
    font-weight: 700 !important;
    /*
     * ⚠️⚠️ **高さは、題の文字と同じくらい**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *
     *    ⚠️ 0.2.14 は 1.5 で、⚠️⚠️ **上下に余白が付いて厚く見えた。**
     *    ⚠️ ⚠️ **1.25 まで詰める**（⚠️ これ以上詰めると、漢字の下が切れます）。
     */
    line-height: 1.25 !important;
    /*
     * ⚠️⚠️ **題の文字と、ほとんど空けない**（⚠️ 版 0.2.15・⚠️ 運営者の指示）。
     *    ⚠️ 0.2.14 は .4em で、⚠️ **離れて見えた。**
     */
    margin: 0 .1em 0 0 !important;
    /* ⚠️⚠️ **題が折り返しても、札だけは切らない** */
    white-space: nowrap !important;
    vertical-align: baseline !important;
    /* ⚠️ テーマの下線・影に、負けないように */
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    /*
     * ⚠️⚠️ **右の端に、内側への V の切り込み**（⚠️ 版 0.2.15・⚠️ 参考画像）。
     *
     *    ⚠️ ⚠️ **リボンの端のような形。** ⚠️ 左の端は、まっすぐ。
     *
     *    ⚠️ 点の順番：
     *       ⚠️ 左上 → ⚠️ 右上 → ⚠️⚠️ **右の真ん中（内側へ）** → ⚠️ 右下 → ⚠️ 左下
     *
     *    ⚠️⚠️ **clip-path が効かない古いブラウザでは、ただの四角**になります。
     *       ⚠️ ⚠️ **読めなくなることは、ありません。**
     */
    clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
    -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - .45em) 50%, 100% 100%, 0 100%) !important;
}

/*
 * ⚠️ 大見出しが折り返しても、札が行から切れないように。
 */
body.pokka-mo-single h1.entry-title {
    /* ⚠️⚠️ **テーマの指定を、消さないこと**（⚠️ 足すだけ） */
    display: block;
}

/*
 * ⚠️⚠️ **受け皿のボタン**（⚠️ 版 0.2.20・⚠️ 2026-11-02）。
 *
 *    ⚠️ ⚠️ **JavaScript が間に合わないとき、これだけが出ます。**
 *    ⚠️⚠️ **間に合えば、箱ごと作り替えられて消えます。**
 *
 *    ⚠️ ⚠️ **見た目は、JavaScript が作るものと同じにします。**
 *       ⚠️⚠️ **入れ替わったときに、ちらつかないためです。**
 */
.pokka-mo__fallback {
    /* ⚠️ いまは、ふつうのボタンと同じ見た目でよい */
}