/* =====================================================
   SPI ミニクイズ（記事埋め込み用）
   見た目とインタラクションは spi-exam（模試）と同じ
   デザイントークンに揃え、外側のページヘッダーは無し
   ===================================================== */
.spi-mini {
    /* ブランドカラー（reashu.com 公式） */
    --m-green: #2AA59A;       /* メイン */
    --m-green-dark: #1f8a80;
    --m-green-light: #DFFAF6; /* 背景 */
    --m-orange: #FF9300;      /* アクセント */
    --m-orange-light: #FFB45C;
    --m-blue: #4a7fd0;
    --m-blue-dark: #3a6cbb;
    --m-red: #e04e4e;
    --m-red-light: #fdecec;
    --m-yellow: #f1c40f;
    --m-text: #1f2328;
    --m-muted: #6a737d;
    --m-border: #e1e4e8;
    --m-surface: #f6f8fa;
    --m-line: #06C755;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
    color: var(--m-text);
    background: #fff;
    border: 1px solid var(--m-border);
    border-radius: 10px;
    padding: 1.6em 1.6em 1.4em;
    margin: 1.8em 0;
    line-height: 1.75;
}
.spi-mini * { box-sizing: border-box; }
.spi-mini-screen[hidden] { display: none !important; }

/* ===== タイトル（SANGO等テーマの entry-content h3 デフォルトを打ち消し） ===== */
.spi-mini .spi-mini-title {
    margin: 0 0 .6em !important;
    padding: 0 0 0 .7em !important;
    border: 0 !important;
    border-left: 4px solid var(--m-green) !important;
    background: none !important;
    font-size: 1.25em;
    font-weight: 700;
    color: var(--m-text);
    line-height: 1.4;
}
.spi-mini .spi-mini-title::before,
.spi-mini .spi-mini-title::after { content: none !important; display: none !important; }

.spi-mini-lead {
    margin: 0 0 1em;
    font-size: .95em;
    color: var(--m-muted);
}

/* ===== ボタン ===== */
.spi-mini-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45em;
    padding: .75em 1.6em;
    border-radius: 6px;
    border: 1.5px solid transparent;
    font: inherit;
    font-weight: 700;
    font-size: 1em;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s, transform .05s, box-shadow .15s;
}
.spi-mini-btn:active:not(:disabled) { transform: translateY(1px); }
.spi-mini-btn-primary {
    background: var(--m-green);
    color: #fff;
    border-color: var(--m-green);
}
.spi-mini-btn-primary:hover { background: var(--m-green-dark); border-color: var(--m-green-dark); }
.spi-mini-btn-next {
    background: var(--m-blue);
    color: #fff;
    border-color: var(--m-blue);
    padding: .8em 1.8em;
}
.spi-mini-btn-next:hover:not(:disabled) { background: var(--m-blue-dark); border-color: var(--m-blue-dark); }
.spi-mini-btn-next:disabled {
    background: #b0bec5;
    border-color: #b0bec5;
    cursor: not-allowed;
    opacity: .7;
}
.spi-mini-btn-ghost {
    background: #fff;
    color: var(--m-green-dark);
    border-color: var(--m-green);
}
.spi-mini-btn-ghost:hover { background: var(--m-green); color: #fff; }

/* 開始画面の派手CTAボタン（オレンジ） */
.spi-mini-btn-cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6em;
    padding: 1em 2em;
    background: linear-gradient(180deg, var(--m-orange-light) 0%, var(--m-orange) 100%);
    color: #fff;
    border: 0;
    border-radius: 10px;
    font: inherit;
    font-weight: 800;
    font-size: 1.05em;
    letter-spacing: .03em;
    cursor: pointer;
    box-shadow:
        0 6px 14px rgba(255, 147, 0, .35),
        inset 0 1px 0 rgba(255, 255, 255, .28);
    transition: transform .15s ease, box-shadow .2s ease, filter .15s ease;
}
.spi-mini-btn-cta:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow:
        0 10px 22px rgba(255, 147, 0, .42),
        inset 0 1px 0 rgba(255, 255, 255, .28);
}
.spi-mini-btn-cta:active { transform: translateY(0); }
.spi-mini-btn-cta-icon { flex: none; }
.spi-mini-btn-cta-arrow {
    flex: none;
    transition: transform .25s ease;
}
.spi-mini-btn-cta:hover .spi-mini-btn-cta-arrow { transform: translateX(4px); }

/* フッターのキャッチコピー */
.spi-mini-intro-footnote {
    position: relative;
    z-index: 1;
    margin: 1.1em auto 0;
    font-size: .85em;
    color: var(--m-muted);
    font-style: italic;
    letter-spacing: .02em;
}

/* ===== 開始画面（ワクワク版） ===== */
.spi-mini-intro {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 2.4em 9em 2em;
    margin: -1.6em -1.6em -1.4em;
    border-radius: 10px;
    background:
        radial-gradient(circle at 12% 18%, rgba(42, 165, 154, .08) 0, transparent 28%),
        radial-gradient(circle at 88% 82%, rgba(42, 165, 154, .10) 0, transparent 32%),
        linear-gradient(180deg, var(--m-green-light) 0%, #FFFFFF 90%);
}
.spi-mini-intro > * { position: relative; z-index: 1; }
.spi-mini-intro-illust { z-index: 0; }

/* 背景の抽象ブロブ */
.spi-mini-intro-blob {
    position: absolute;
    border-radius: 50%;
    background: var(--m-green-light);
    opacity: .55;
    pointer-events: none;
    z-index: 0;
}
.spi-mini-intro-blob-1 { width: 120px; height: 120px; top: -30px;  left: -40px;  background: #D8F1EE; opacity: .7; }
.spi-mini-intro-blob-2 { width: 80px;  height: 80px;  top: 30%;    right: -30px; background: #B6E9E4; opacity: .5; }
.spi-mini-intro-blob-3 { width: 60px;  height: 60px;  bottom: -20px; left: 20%;  background: #FCE952; opacity: .35; }

/* イラスト */
.spi-mini-intro-illust {
    position: absolute;
    z-index: 0;
    pointer-events: none;
    user-select: none;
    object-fit: contain;
    opacity: .95;
}
.spi-mini-intro-illust-left {
    left: -10px;
    top: 38%;
    transform: translateY(-50%);
    width: 130px;
    height: auto;
}
.spi-mini-intro-illust-right {
    right: -10px;
    top: 42%;
    transform: translateY(-50%);
    width: 145px;
    height: auto;
}
.spi-mini-intro-illust-bar {
    right: 12px;
    bottom: 12px;
    width: 60px;
    height: auto;
    opacity: .7;
}

/* タグライン */
.spi-mini-intro-tagline {
    position: relative;
    z-index: 1;
    margin: 0 0 .6em;
    font-size: .92em;
    font-weight: 600;
    color: var(--m-green-dark);
    display: inline-flex;
    align-items: center;
    gap: .5em;
}
.spi-mini-intro-tagline-mark {
    color: var(--m-green);
    font-weight: 700;
    font-size: 1.1em;
}

/* メインタイトル（SANGO等テーマの entry-content h3 デフォルトを打ち消し） */
.spi-mini .spi-mini-intro-h1 {
    position: relative;
    z-index: 1;
    margin: 0 auto .35em !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 0 !important;
    background: none !important;
    font-size: 1.55em;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: .03em;
    line-height: 1.35;
    text-align: center;
}
.spi-mini .spi-mini-intro-h1::before,
.spi-mini .spi-mini-intro-h1::after { content: none !important; display: none !important; }

/* リード */
.spi-mini-intro-lead {
    position: relative;
    z-index: 1;
    margin: 0 auto 1.1em;
    max-width: 32em;
    font-size: .95em;
    color: var(--m-muted);
    line-height: 1.7;
}

/* バッジ群 */
.spi-mini-intro-meta {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    gap: .55em;
    flex-wrap: wrap;
    margin-bottom: 1.4em;
}
.spi-mini-badge {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    padding: .45em 1em;
    background: #fff;
    color: var(--m-green-dark);
    border: 1.5px solid #B6E9E4;
    border-radius: 999px;
    font-size: .9em;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(38, 166, 154, .08);
}
.spi-mini-badge-icon { flex: none; color: var(--m-green); }
.spi-mini-badge-line {
    background: rgba(6, 199, 85, .12);
    color: #04863a;
    border-color: rgba(6, 199, 85, .25);
}

/* ===== 出題画面：ヘッダー（タイトル + 解答状況） ===== */
.spi-mini-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    margin-bottom: 1.3em;
}
.spi-mini .spi-mini-header-title {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 0 !important;
    background: none !important;
    font-size: 1.1em;
    font-weight: 700;
    color: var(--m-text);
    line-height: 1.4;
    flex: 1;
    min-width: 0;
}
.spi-mini .spi-mini-header-title::before,
.spi-mini .spi-mini-header-title::after { content: none !important; display: none !important; }

.spi-mini-status {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    flex: none;
    font-size: .9em;
    color: var(--m-muted);
    background: var(--m-surface);
    padding: .35em .8em;
    border-radius: 999px;
}
.spi-mini-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--m-yellow);
    flex: none;
}
.spi-mini-status-label { font-weight: 500; }
.spi-mini-status-count {
    font-weight: 700;
    color: var(--m-text);
    font-size: 1em;
}
.spi-mini-status-count [data-role="answered"] {
    color: var(--m-green-dark);
    font-size: 1.1em;
}
.spi-mini-status-slash { color: var(--m-muted); margin: 0 .15em; font-weight: 500; }


/* ===== 本体：左=問題 / 右=選択肢（模試と同じ2列レイアウト） ===== */
.spi-mini-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.6em;
    margin-bottom: 1.2em;
}

/* 問題カード（模試の .spi-quiz-question と同等デザイン） */
.spi-mini-q {
    background: #f6fffe;
    border: 1.5px solid var(--m-green);
    border-left: 5px solid var(--m-green);
    border-radius: 8px;
    padding: 1.2em 1.4em;
}
.spi-mini-q-text {
    margin: 0;
    font-size: 0.9em;
    font-weight: 500;
    line-height: 1.7;
    color: var(--m-text);
    white-space: pre-wrap;
}
.spi-mini-q-text strong { font-weight: 500; }
.spi-mini-q-text .spi-mini-qnum {
    font-weight: 800;
    color: var(--m-green-dark);
    margin-right: .25em;
    font-size: 1.05em;
}
/* v4.9.1 polish：自動検知ルートで wpautop が生成する <p> 段落の縦マージンを抑制。
   既存ルール（.spi-mini-q-text は white-space: pre-wrap）を一切変更せず追記のみ。 */
.spi-mini-q-text p { margin: 0.4em 0; }
.spi-mini-q-text p:first-child { margin-top: 0; }
.spi-mini-q-text p:last-child  { margin-bottom: 0; }

/* 選択肢（模試の .spi-quiz-choice と同等デザイン） */
/* SANGO等テーマの entry-content > ul の枠線・背景・li::before / ::marker を完全打ち消し */
.spi-mini ul.spi-mini-choices,
.spi-mini .spi-mini-choices,
.spi-mini .spi-mini-choices li {
    list-style: none !important;
    list-style-type: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}
.spi-mini .spi-mini-choices li::before,
.spi-mini .spi-mini-choices li::after,
.spi-mini .spi-mini-choices li::marker {
    content: none !important;
    display: none !important;
    background: none !important;
}
.spi-mini ul.spi-mini-choices,
.spi-mini-choices {
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: .5em;
}
.spi-mini-choices li {
    margin: 0 !important;
    padding: 0 !important;
    text-indent: 0;
}

.spi-mini-choice {
    display: flex;
    align-items: center;
    gap: .8em;
    width: 100%;
    background: #fff;
    border: 1px solid var(--m-border);
    border-radius: 6px;
    padding: .9em 1.2em;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.spi-mini-choice:hover { border-color: var(--m-green); }
.spi-mini-choice.is-selected {
    border-color: var(--m-green);
    background: var(--m-green-light);
}
.spi-mini-choice input[type="radio"] {
    margin: 0;
    accent-color: var(--m-green);
    width: 18px;
    height: 18px;
    flex: none;
    cursor: pointer;
}
.spi-mini-choice-text {
    flex: 1;
    color: var(--m-text);
    font-weight: 500;
}

.spi-mini-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: .4em;
}
.spi-mini-actions-result { justify-content: center; margin-top: 1.4em; }

/* ===== 結果画面：ゲート（spi-exam の gate と同じ見た目） ===== */
/* ページ表示時、ブラウザのスクロールアンカリングでクイズ位置に飛ばされるのを防ぐ */
[data-spi-mini] { overflow-anchor: none; }

.spi-mini-gate {
    display: flex;
    justify-content: center;
    padding: 1em 0 .5em;
}
.spi-mini-gate[hidden] { display: none; }
.spi-mini-gate-card {
    width: 100%;
    max-width: 460px;
    background: linear-gradient(180deg, #FBFFFE 0%, #F2FBFA 100%);
    border: 1.4px solid #B6E9E4;
    border-radius: 18px;
    padding: 40px 32px 36px;
    text-align: center;
    box-shadow: 0 8px 24px rgba(38, 166, 154, .10);
}
.spi-mini-gate-icon {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
}
.spi-mini .spi-mini-gate-title {
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    background: none;
    font-size: 1.25em;
    font-weight: 600;
    color: var(--m-green-dark);
    line-height: 1.6;
    letter-spacing: .02em;
    text-align: center;
}
.spi-mini .spi-mini-gate-title::before,
.spi-mini .spi-mini-gate-title::after { content: none; display: none; }
.spi-mini-gate-note {
    display: block;
    margin: 0 0 24px;
    font-size: .88em;
    color: #e07b3a;
    font-weight: 600;
}
.spi-mini-gate-perks {
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.spi-mini-gate-perk {
    display: inline-flex;
    align-items: center;
    padding: 4px 14px 4px 26px;
    background: #E4F8F6;
    color: var(--m-green-dark);
    border-radius: 100px;
    font-size: .82em;
    font-weight: 600;
    line-height: 1.6;
    position: relative;
}
.spi-mini-gate-perk::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #26A69A;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 5l2 2 4-4' stroke='white' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}
.spi-mini-gate-line {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 360px;
    padding: 12px 14px 12px 20px;
    background: var(--m-line);
    color: #fff;
    border-radius: 10px;
    font-weight: 600;
    font-size: .92em;
    letter-spacing: 0;
    text-decoration: none;
    box-shadow: 0 6px 14px rgba(6, 199, 85, .28);
    transition: transform .18s ease, box-shadow .18s ease;
    box-sizing: border-box;
}
.spi-mini-gate-line:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(6, 199, 85, .34);
    color: #fff;
}
.spi-mini-gate-line img.spi-line-mark {
    display: block;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
    flex: none;
}
.spi-mini-gate-line span { text-align: center; word-break: keep-all; }
.spi-mini-gate-divider {
    display: flex;
    align-items: center;
    margin: 22px 0 16px;
    color: var(--m-muted);
    font-size: .8em;
}
.spi-mini-gate-divider::before,
.spi-mini-gate-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--m-border);
}
.spi-mini-gate-divider span { padding: 0 12px; }
.spi-mini-gate-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 24px;
}
.spi-mini-gate-input {
    width: 100%;
    padding: 14px 16px;
    border: 1.4px solid #D6E5E2;
    border-radius: 8px;
    font-size: 1em;
    background: #fff;
    color: var(--m-text);
    box-sizing: border-box;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.spi-mini-gate-input:focus {
    outline: none;
    border-color: var(--m-green);
    box-shadow: 0 0 0 3px rgba(38, 166, 154, .18);
}
.spi-mini-gate-input.is-error { border-color: #E66B6B; }
.spi-mini-gate-submit {
    width: 100%;
    padding: 12px 22px;
    background: var(--m-green);
    color: #fff;
    border: 0;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1em;
    cursor: pointer;
    transition: background .15s ease, transform .15s ease;
}
.spi-mini-gate-submit:hover {
    background: var(--m-green-dark);
    transform: translateY(-1px);
}
.spi-mini-gate-error {
    margin: 4px 0 0;
    color: #E66B6B;
    font-size: .85em;
}
.spi-mini-gate-error[hidden] { display: none; }

/* ===== 結果本体 ===== */
.spi-mini-result-body[hidden] { display: none; }
.spi-mini-result-body .spi-mini-title { margin-bottom: 1em; }

.spi-mini-score-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    flex-wrap: wrap;
    background: var(--m-surface);
    border-radius: 10px;
    padding: 1.2em 1.4em;
    margin-bottom: .9em;
    border-left: 5px solid var(--m-green);
}
.spi-mini-score-card.is-high { border-left-color: var(--m-green); background: var(--m-green-light); }
.spi-mini-score-card.is-mid  { border-left-color: var(--m-yellow); background: #fffbe6; }
.spi-mini-score-card.is-low  { border-left-color: var(--m-red);    background: var(--m-red-light); }

.spi-mini-score-main { display: flex; align-items: baseline; gap: .15em; }
.spi-mini-score-num {
    font-size: 2.4em;
    font-weight: 800;
    color: var(--m-green-dark);
    line-height: 1;
}
.spi-mini-score-card.is-mid .spi-mini-score-num { color: #b08800; }
.spi-mini-score-card.is-low .spi-mini-score-num { color: var(--m-red); }
.spi-mini-score-slash { font-size: 1.4em; color: var(--m-muted); margin: 0 .1em; }
.spi-mini-score-total { font-size: 1.4em; font-weight: 700; color: var(--m-muted); }
.spi-mini-score-unit { margin-left: .4em; font-size: .95em; color: var(--m-muted); font-weight: 500; }
.spi-mini-score-pct {
    font-size: 1.5em;
    font-weight: 800;
    color: var(--m-text);
}

/* スコア帯別カード（Lognavi CTA を内包） */
.spi-mini-tier-card {
    display: flex;
    align-items: flex-start;
    gap: 1em;
    padding: 1.1em 1.2em;
    background: #FFF7EE;
    border: 1.5px solid #FFD9B2;
    border-radius: 12px;
    margin-bottom: 1.4em;
}
.spi-mini-tier-card[hidden] { display: none; }
.spi-mini-tier-card.is-high { background: #EAF7F5; border-color: #B6E9E4; }
.spi-mini-tier-card.is-mid  { background: #FFFBE6; border-color: #F4E6A1; }
.spi-mini-tier-card.is-low  { background: #FFF1E5; border-color: #FFC79A; }

.spi-mini-tier-emoji {
    flex: none;
    font-size: 2em;
    line-height: 1.1;
    width: 2em;
    height: 2em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .04);
}
.spi-mini-tier-body { flex: 1; min-width: 0; }

.spi-mini .spi-mini-tier-label {
    margin: 0 0 .3em !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    font-size: 1.05em;
    font-weight: 700;
    color: #E07A55;
    line-height: 1.4;
}
.spi-mini-tier-card.is-high .spi-mini-tier-label { color: var(--m-green-dark); }
.spi-mini-tier-card.is-mid  .spi-mini-tier-label { color: #b08800; }

.spi-mini .spi-mini-tier-msg {
    margin: 0 0 .7em !important;
    padding: 0 !important;
    font-size: .9em;
    color: var(--m-text);
    line-height: 1.6;
}

.spi-mini-tier-cta {
    display: inline-flex;
    align-items: center;
    gap: .45em;
    padding: .6em 1.1em;
    background: var(--m-orange);
    color: #fff !important;
    border-radius: 8px;
    font-weight: 700;
    font-size: .92em;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(255, 147, 0, .25);
    transition: transform .15s ease, background .15s ease, box-shadow .2s ease;
}
.spi-mini-tier-cta:hover {
    background: #E07A00;
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(255, 147, 0, .35);
    color: #fff !important;
}
.spi-mini-tier-cta img { display: block; flex: none; border-radius: 4px; }

.spi-mini .spi-mini-review-heading {
    margin: 1.4em 0 .7em !important;
    padding: 0 0 .35em !important;
    font-size: 1.05em;
    font-weight: 700;
    color: var(--m-text);
    border-bottom: 2px solid var(--m-green);
}

.spi-mini-review { display: grid; gap: .9em; }
.spi-mini-review-item {
    border: 1px solid var(--m-border);
    border-left: 5px solid var(--m-green);
    border-radius: 8px;
    background: #fff;
    padding: .9em 1.1em;
}
.spi-mini-review-item.is-wrong { border-left-color: var(--m-red); }

.spi-mini-review-head {
    display: flex;
    align-items: center;
    gap: .6em;
    margin-bottom: .4em;
}
.spi-mini-review-qno {
    display: inline-flex;
    align-items: center;
    padding: .15em .65em;
    background: var(--m-surface);
    color: var(--m-text);
    border-radius: 999px;
    font-weight: 700;
    font-size: .82em;
}
.spi-mini-review-verdict {
    font-weight: 700;
    font-size: .92em;
    color: var(--m-green-dark);
}
.spi-mini-review-item.is-wrong .spi-mini-review-verdict { color: var(--m-red); }

.spi-mini-review-question {
    margin: 0 0 .6em;
    font-weight: 500;
    line-height: 1.7;
}

/* テーマ依存スタイルを打ち消し */
.spi-mini .spi-mini-review-dl,
.spi-mini .spi-mini-review-dl dt,
.spi-mini .spi-mini-review-dl dd {
    background: none !important;
}
.spi-mini .spi-mini-review-dl dt::before,
.spi-mini .spi-mini-review-dl dd::before {
    content: none !important;
    display: none !important;
}
.spi-mini-review-dl {
    margin: 0;
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .35em .9em;
    font-size: .95em;
    line-height: 1.7;
}
.spi-mini-review-dl dt {
    color: var(--m-muted);
    font-weight: 700;
    font-size: .88em;
    padding-top: .1em;
}
.spi-mini-review-dl dd { margin: 0; }
.spi-mini-review-dl dd strong { color: var(--m-green-dark); font-weight: 700; }
.spi-mini-review-item.is-wrong .spi-mini-review-dl dd strong { color: var(--m-red); }

/* ===== Lognavi 誘導カード（もう一度解くの直上） ===== */
.spi-mini-lognavi {
    margin: 1.8em auto .8em;
    max-width: 520px;
}
.spi-mini-lognavi-card {
    padding: 1.8em 1.6em;
    background: #fff;
    border: 1px solid #EAF2F1;
    border-radius: 18px;
    box-shadow: 0 8px 22px rgba(42, 165, 154, .06);
}
.spi-mini-lognavi-eyebrow {
    display: flex;
    align-items: center;
    gap: .6em;
    margin: 0 0 .9em;
}
.spi-mini-lognavi-tag {
    display: inline-block;
    padding: .2em .7em;
    background: var(--m-green-light);
    color: var(--m-green-dark);
    font-size: .7em;
    font-weight: 600;
    letter-spacing: .12em;
    border-radius: 999px;
}
.spi-mini-lognavi-brandname {
    font-size: .82em;
    font-weight: 600;
    color: var(--m-green-dark);
    letter-spacing: .04em;
}
.spi-mini .spi-mini-lognavi-headline {
    margin: 0 0 .75em !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    font-size: 1.25em;
    font-weight: 500;
    line-height: 1.55;
    color: #1a1a1a;
    letter-spacing: .02em;
}
.spi-mini .spi-mini-lognavi-headline::before,
.spi-mini .spi-mini-lognavi-headline::after { content: none !important; display: none !important; }
.spi-mini-lognavi-headline .is-accent { color: var(--m-green); font-weight: 600; }
.spi-mini-lognavi-lead {
    margin: 0 0 1.4em;
    font-size: .9em;
    line-height: 1.7;
    color: #5d6f6c;
}
.spi-mini-lognavi-lead strong { color: var(--m-green-dark); font-weight: 600; }

.spi-mini ul.spi-mini-lognavi-feats {
    list-style: none !important;
    margin: 0 0 1.5em !important;
    padding: 1em 1.1em !important;
    background: #F8FCFB;
    border-radius: 12px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: .6em;
}
.spi-mini .spi-mini-lognavi-feats li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35em;
    padding: 0 !important;
    margin: 0 !important;
    font-size: .78em;
    color: #5d6f6c;
    text-align: center;
    flex: 1;
    background: none !important;
    list-style: none !important;
}
.spi-mini .spi-mini-lognavi-feats li::before,
.spi-mini .spi-mini-lognavi-feats li::after,
.spi-mini .spi-mini-lognavi-feats li::marker {
    content: none !important;
    display: none !important;
}
.spi-mini-lognavi-feat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--m-green-light);
    color: var(--m-green);
    border-radius: 50%;
}
.spi-mini-lognavi-feat-text { font-weight: 500; }
.spi-mini-lognavi-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5em;
    padding: .95em 1.4em;
    background: var(--m-green);
    color: #fff;
    border-radius: 12px;
    font-weight: 500;
    font-size: .95em;
    letter-spacing: .04em;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(42, 165, 154, .22);
    transition: transform .22s cubic-bezier(.2,.8,.2,1),
                box-shadow .22s cubic-bezier(.2,.8,.2,1),
                background .18s ease;
}
.spi-mini-lognavi-cta:hover {
    transform: translateY(-2px);
    background: var(--m-green-dark);
    box-shadow: 0 12px 24px rgba(42, 165, 154, .32);
    color: #fff;
}
.spi-mini-lognavi-cta-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: rgba(255, 255, 255, .18);
    border-radius: 50%;
}
@media (max-width: 540px) {
    .spi-mini-lognavi { margin: 1.4em 0 .6em; }
    .spi-mini-lognavi-card { padding: 1.4em 1.2em; }
    .spi-mini .spi-mini-lognavi-headline { font-size: 1.1em; }
    .spi-mini-lognavi-lead { font-size: .85em; margin-bottom: 1.1em; }
    .spi-mini ul.spi-mini-lognavi-feats { padding: .9em .6em !important; gap: .4em; }
    .spi-mini .spi-mini-lognavi-feats li { font-size: .72em; }
    .spi-mini-lognavi-feat-icon { width: 30px; height: 30px; }
}

/* ===== エラー ===== */
.spi-mini-error {
    margin: 1.5em 0;
    padding: .8em 1em;
    border: 1px solid var(--m-red);
    background: var(--m-red-light);
    color: var(--m-red);
    border-radius: 6px;
}

/* ===== タブレット〜スマホ：2列→1列にスタック ===== */
@media (max-width: 720px) {
    .spi-mini-body {
        grid-template-columns: 1fr;
        gap: 1em;
    }
    .spi-mini-q { padding: 1em 1.1em; }
}

/* ===== スマホ ===== */
@media (max-width: 540px) {
    .spi-mini { padding: 1.2em 1em 1.1em; border-radius: 8px; margin: 1.5em 0; }
    .spi-mini .spi-mini-title { font-size: 1.1em; }
    .spi-mini-intro { padding: 1.8em 1em 1.4em; margin: -1.2em -1em -1.1em; border-radius: 8px; }
    .spi-mini-intro-h1 { font-size: 1.3em; }
    .spi-mini-intro-tagline { font-size: .85em; }
    .spi-mini-btn-cta { padding: .9em 1.6em; font-size: 1em; }
    .spi-mini-intro-footnote { font-size: .8em; }
    /* モバイルではイラストは小さく＆位置を控えめに */
    .spi-mini-intro-illust-left  { width: 70px; left: -20px; opacity: .35; }
    .spi-mini-intro-illust-right { width: 75px; right: -25px; opacity: .35; }
    .spi-mini-intro-illust-bar   { display: none; }
    .spi-mini-q-text { font-size: .95em; }
    .spi-mini-choice { padding: .7em .85em; }
    .spi-mini-btn-next { padding: .75em 1.4em; }
    .spi-mini-header { flex-wrap: wrap; gap: .6em; }
    .spi-mini-header-title { font-size: 1em; flex: 1 1 100%; }
    .spi-mini-status { padding: .25em .65em; font-size: .85em; }
    .spi-mini-score-main { gap: .1em; }
    .spi-mini-score-num { font-size: 2em; }
    .spi-mini-score-pct { font-size: 1.3em; }
    .spi-mini-review-dl {
        grid-template-columns: 1fr;
        gap: .15em 0;
    }
    .spi-mini-review-dl dt { padding-top: .5em; }
    .spi-mini-gate-card { padding: 28px 18px 24px; }
    .spi-mini .spi-mini-gate-title { font-size: 1.05em; line-height: 1.55; word-break: keep-all; overflow-wrap: anywhere; margin-bottom: 14px; }
    .spi-mini-gate-note { font-size: .82em; word-break: keep-all; overflow-wrap: anywhere; margin-bottom: 20px; }
    .spi-mini-gate-perks { gap: 8px; margin-bottom: 24px; }
    .spi-mini-gate-perk { font-size: .78em; padding: 3px 12px 3px 24px; }
    .spi-mini-gate-perk::before { left: 8px; width: 9px; height: 9px; }
    .spi-mini-gate-line { padding: 10px 12px; font-size: .88em; gap: 6px; }
    .spi-mini-gate-line img.spi-line-mark { width: 28px; height: 28px; }
    .spi-mini-gate-form { margin-top: 18px; gap: 10px; }
    .spi-mini-gate-input { padding: 12px 14px; }
}