/* /Components/Admin/Pages/AdminHome.razor.rz.scp.css */
/* 管理ハブ専用スタイル（CSS isolation）。
   公開サイト・管理画面と同じブランド配色（深い緑灰 #1f2a2a・緑 #6f9484・淡緑 #a3bcac）で、
   落ち着いた中にも上質さのあるダッシュボードに仕上げる。 */
.hub[b-93dqqkinql] {
    --hub-ink: #1f2a2a;
    --hub-pine: #6f9484;
    --hub-sage: #a3bcac;
    --hub-sage-soft: #e8efea;
    --hub-track: #e3ebe5;
    --hub-paper: #ffffff;
    --hub-line: #e4e8e3;
    --hub-text: #23302d;
    --hub-text-soft: #5f6d68;
    --hub-radius-lg: 22px;
    --hub-radius-md: 16px;
    display: block;
}

/* ───────── ヒーロー ───────── */
.hub-hero[b-93dqqkinql] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 26px 48px;
    padding: 34px 38px;
    border-radius: var(--hub-radius-lg);
    background: linear-gradient(135deg, #1f2a2a 0%, #284038 62%, #325047 100%);
    color: #fff;
    box-shadow: 0 20px 44px -26px rgba(31, 42, 42, .65);
}

.hub-hero__glow[b-93dqqkinql] {
    position: absolute;
    top: -45%;
    right: -8%;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(163, 188, 172, .32), rgba(163, 188, 172, 0) 70%);
    pointer-events: none;
}

.hub-hero__body[b-93dqqkinql] {
    position: relative;
    flex: 1 1 360px;
}

.hub-hero__eyebrow[b-93dqqkinql] {
    margin: 0 0 12px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--hub-sage);
}

.hub-hero__title[b-93dqqkinql] {
    margin: 0;
    font-size: clamp(1.5rem, 1.05rem + 1.7vw, 2.1rem);
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: .01em;
}

/* Blazor の FocusOnNavigate が遷移後にこの見出し（tabindex=-1）へ
   プログラム的にフォーカスを移すため、暗いヒーロー上に既定のフォーカスリングが
   出てしまう。非対話の見出しなので視覚リングは抑制する（AT への読み上げには影響しない）。 */
.hub-hero__title:focus[b-93dqqkinql],
.hub-hero__title:focus-visible[b-93dqqkinql] {
    outline: none;
}

.hub-hero__name[b-93dqqkinql] {
    color: #d8e7dc;
}

.hub-hero__lead[b-93dqqkinql] {
    margin: 14px 0 0;
    max-width: 38em;
    font-size: .95rem;
    line-height: 1.85;
    color: rgba(255, 255, 255, .74);
}

.hub-hero__stats[b-93dqqkinql] {
    position: relative;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.hub-stat[b-93dqqkinql] {
    padding-left: 24px;
    border-left: 1px solid rgba(255, 255, 255, .16);
}

.hub-stat:first-child[b-93dqqkinql] {
    padding-left: 0;
    border-left: 0;
}

.hub-stat dt[b-93dqqkinql] {
    margin: 0 0 8px;
    font-size: .72rem;
    letter-spacing: .16em;
    color: rgba(255, 255, 255, .6);
}

.hub-stat dd[b-93dqqkinql] {
    margin: 0;
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    color: #fff;
}

.hub-stat dd span[b-93dqqkinql] {
    margin-left: 5px;
    font-size: .82rem;
    font-weight: 500;
    color: rgba(255, 255, 255, .6);
}

.hub-stat--meta .hub-stat__date[b-93dqqkinql] {
    font-size: 1.02rem;
    font-weight: 600;
    letter-spacing: .02em;
}

/* ───────── セクション見出し ───────── */
.hub-section-head[b-93dqqkinql] {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 42px 2px 18px;
}

.hub-section-head__title[b-93dqqkinql] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .05em;
    color: var(--hub-ink);
}

.hub-section-head__rule[b-93dqqkinql] {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--hub-line), transparent);
}

/* ───────── モジュールカード ───────── */
.hub-grid[b-93dqqkinql] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(264px, 360px));
    justify-content: start;
    gap: 20px;
}

.hub-card[b-93dqqkinql] {
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 22px 22px 14px;
    background: var(--hub-paper);
    border: 1px solid var(--hub-line);
    border-radius: var(--hub-radius-md);
    box-shadow: 0 1px 2px rgba(31, 42, 42, .04);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.hub-card:hover[b-93dqqkinql] {
    transform: translateY(-4px);
    border-color: var(--hub-sage);
    box-shadow: 0 24px 38px -24px rgba(31, 42, 42, .45);
}

.hub-card__head[b-93dqqkinql] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.hub-card__badge[b-93dqqkinql] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: var(--hub-pine);
    background: var(--hub-sage-soft);
    transition: background .22s ease, color .22s ease, transform .22s ease;
}

.hub-card:hover .hub-card__badge[b-93dqqkinql] {
    background: var(--hub-pine);
    color: #fff;
    transform: rotate(-4deg);
}

.hub-card__badge[b-93dqqkinql]  .mud-icon-root {
    font-size: 1.6rem;
    color: inherit;
    fill: currentColor;
}

.hub-card__title[b-93dqqkinql] {
    margin: 0;
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--hub-ink);
}

.hub-card__desc[b-93dqqkinql] {
    margin: 0 0 18px;
    min-height: 3.1em;
    font-size: .88rem;
    line-height: 1.75;
    color: var(--hub-text-soft);
}

.hub-card__metrics[b-93dqqkinql] {
    margin-top: auto;
}

.hub-card__count[b-93dqqkinql] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.hub-card__count-num[b-93dqqkinql] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    color: var(--hub-ink);
    font-variant-numeric: tabular-nums;
}

.hub-card__count-label[b-93dqqkinql] {
    font-size: .8rem;
    font-weight: 600;
    color: var(--hub-pine);
}

.hub-card__total[b-93dqqkinql] {
    margin-top: 5px;
    font-size: .78rem;
    color: var(--hub-text-soft);
}

.hub-card__bar[b-93dqqkinql] {
    margin-top: 12px;
    height: 6px;
    border-radius: 99px;
    background: var(--hub-track);
    overflow: hidden;
}

.hub-card__bar-fill[b-93dqqkinql] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--hub-pine), var(--hub-sage));
    transition: width .55s ease;
}

.hub-card__actions[b-93dqqkinql] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding-top: 6px;
    border-top: 1px solid var(--hub-line);
}

.hub-card__actions[b-93dqqkinql]  .mud-button-root {
    text-transform: none;
}

/* 「管理する」= カード全面を覆うリンク（stretched link）。
   .hub-card を基準に ::after を全面へ広げ、カードのどこをクリックしても一覧へ遷移させる。
   純 CSS のため JS 不要・静的 SSR でも動作し、実体は <a> なのでキーボード操作・支援技術にも対応する。 */
.hub-card__open[b-93dqqkinql] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .85rem;
    font-weight: 600;
    color: var(--hub-pine);
    text-decoration: none;
    transition: gap .22s ease, color .22s ease;
}

.hub-card__open[b-93dqqkinql]::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: var(--hub-radius-md);
}

.hub-card__open[b-93dqqkinql]  .mud-icon-root {
    font-size: 1.15rem;
    transition: transform .22s ease;
}

.hub-card:hover .hub-card__open[b-93dqqkinql] {
    gap: 9px;
    color: var(--hub-ink);
}

.hub-card:hover .hub-card__open[b-93dqqkinql]  .mud-icon-root {
    transform: translateX(2px);
}

/* キーボード操作時は stretched link 自身のリングを隠し、カード全体に可視リングを出す。 */
.hub-card:focus-within[b-93dqqkinql] {
    border-color: var(--hub-sage);
    box-shadow: 0 0 0 3px rgba(111, 148, 132, .3);
}

.hub-card__open:focus-visible[b-93dqqkinql] {
    outline: none;
}

/* 「新規」= 別アクション。stretched link の上に重ねて個別にクリックできるようにする。 */
.hub-card__new[b-93dqqkinql] {
    position: relative;
    z-index: 1;
}

/* ───────── レスポンシブ ─────────
   スマートフォンでは 8 モジュールぶんのカードが縦に延々と続き、
   全体を見渡せなくなる。説明文を省き、余白・バッジ・数値を詰めて
   1 枚あたりの高さを抑える（各カードの機能は変えない）。 */
@media (max-width: 600px) {
    .hub-hero[b-93dqqkinql] {
        gap: 18px 24px;
        padding: 22px 18px;
        border-radius: 18px;
    }

    .hub-hero__lead[b-93dqqkinql] {
        margin-top: 10px;
        font-size: .875rem;
        line-height: 1.75;
    }

    .hub-hero__stats[b-93dqqkinql] {
        width: 100%;
        gap: 18px;
    }

    .hub-stat[b-93dqqkinql] {
        padding-left: 18px;
    }

    .hub-stat dd[b-93dqqkinql] {
        font-size: 1.65rem;
    }

    .hub-stat--meta .hub-stat__date[b-93dqqkinql] {
        font-size: .95rem;
    }

    .hub-section-head[b-93dqqkinql] {
        margin: 26px 2px 12px;
        gap: 12px;
    }

    .hub-section-head__title[b-93dqqkinql] {
        font-size: .95rem;
    }

    .hub-grid[b-93dqqkinql] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .hub-card[b-93dqqkinql] {
        padding: 14px 14px 8px;
        border-radius: 14px;
    }

    .hub-card__head[b-93dqqkinql] {
        gap: 12px;
        margin-bottom: 10px;
    }

    .hub-card__badge[b-93dqqkinql] {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

    .hub-card__badge[b-93dqqkinql]  .mud-icon-root {
        font-size: 1.35rem;
    }

    .hub-card__title[b-93dqqkinql] {
        font-size: 1.02rem;
    }

    /* 説明文はカード名から内容が分かるため、狭い画面では省く。 */
    .hub-card__desc[b-93dqqkinql] {
        display: none;
    }

    /* 「公開中 n 件」と「登録 n 件」を 1 行にまとめる。 */
    .hub-card__count[b-93dqqkinql] {
        display: inline-flex;
    }

    .hub-card__count-num[b-93dqqkinql] {
        font-size: 1.6rem;
    }

    .hub-card__total[b-93dqqkinql] {
        display: inline;
        margin-top: 0;
        margin-left: 10px;
    }

    .hub-card__bar[b-93dqqkinql] {
        margin-top: 8px;
    }

    .hub-card__actions[b-93dqqkinql] {
        margin-top: 10px;
    }

    /* 指で押しやすいよう、カード内リンクの高さを確保する。 */
    .hub-card__open[b-93dqqkinql] {
        min-height: 40px;
    }
}

/* ───────── ホバーできない端末 ───────── */
@media (hover: none) {
    /* タップ後にホバー状態が残り、カードが浮いたままになるのを防ぐ。 */
    .hub-card:hover[b-93dqqkinql] {
        transform: none;
        box-shadow: 0 1px 2px rgba(31, 42, 42, .04);
        border-color: var(--hub-line);
    }

    .hub-card:hover .hub-card__badge[b-93dqqkinql] {
        transform: none;
        background: var(--hub-sage-soft);
        color: var(--hub-pine);
    }
}

/* ───────── モーション配慮 ───────── */
@media (prefers-reduced-motion: reduce) {
    .hub-card[b-93dqqkinql],
    .hub-card__badge[b-93dqqkinql],
    .hub-card__bar-fill[b-93dqqkinql],
    .hub-card__open[b-93dqqkinql],
    .hub-card__open[b-93dqqkinql]  .mud-icon-root {
        transition: none;
    }

    .hub-card:hover[b-93dqqkinql] {
        transform: none;
    }

    .hub-card:hover .hub-card__badge[b-93dqqkinql] {
        transform: none;
    }
}
/* /Components/Admin/Shared/HeroImageUploadField.razor.rz.scp.css */
/* MudFileUpload の InputFile（input[type=file]）を透明のままドロップ領域全面に重ねる。
   MudBlazor 9.5 では CustomContent 使用時に標準のドラッグ検知領域が描画されないため、
   常時表示の input 自身にクリック・ドロップをネイティブに受け付けさせる
   （ImageUploadEditor と同じ方式。スコープ付き CSS はコンポーネントを跨がないため重複定義する）。
   位置の基準は position:relative を持つ .mud-file-upload ルート要素。 */
[b-vv4n4m0y85] .image-upload-drop-input {
    position: absolute;
    inset: 0;
    overflow: hidden;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

[b-vv4n4m0y85] .image-upload-drop-input:disabled {
    cursor: default;
}

/* input 自体は不可視のため、キーボードフォーカス時はドロップ領域側にリングを表示する */
[b-vv4n4m0y85] .image-upload-drop-input:focus-visible ~ .mud-file-upload-custom-content .mud-paper {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}
/* /Components/Admin/Shared/ImageUploadEditor.razor.rz.scp.css */
/* MudFileUpload の InputFile（input[type=file]）を透明のままドロップ領域全面に重ねる。
   MudBlazor 9.5 では CustomContent 使用時に標準のドラッグ検知領域が描画されないため、
   常時表示の input 自身にクリック・ドロップをネイティブに受け付けさせる
   （公式ドキュメント FileUploadDragAndDropCustomScenarioExample と同じ方式）。
   位置の基準は position:relative を持つ .mud-file-upload ルート要素。 */
[b-092dgmsijr] .image-upload-drop-input {
    position: absolute;
    inset: 0;
    overflow: hidden;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

[b-092dgmsijr] .image-upload-drop-input:disabled {
    cursor: default;
}

/* input 自体は不可視のため、キーボードフォーカス時はドロップ領域側にリングを表示する */
[b-092dgmsijr] .image-upload-drop-input:focus-visible ~ .mud-file-upload-custom-content .mud-paper {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-91szl1iotf] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-91szl1iotf] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-w5xsatvbip],
.components-reconnect-repeated-attempt-visible[b-w5xsatvbip],
.components-reconnect-failed-visible[b-w5xsatvbip],
.components-pause-visible[b-w5xsatvbip],
.components-resume-failed-visible[b-w5xsatvbip],
.components-rejoining-animation[b-w5xsatvbip] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-retrying[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-failed[b-w5xsatvbip],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-w5xsatvbip] {
    display: block;
}


#components-reconnect-modal[b-w5xsatvbip] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-w5xsatvbip 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-w5xsatvbip 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-w5xsatvbip 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-w5xsatvbip]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-w5xsatvbip 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-w5xsatvbip {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-w5xsatvbip {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-w5xsatvbip {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-w5xsatvbip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-w5xsatvbip] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-w5xsatvbip] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-w5xsatvbip] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-w5xsatvbip] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-w5xsatvbip] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-w5xsatvbip] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-w5xsatvbip 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-w5xsatvbip] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-w5xsatvbip {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Public/Layout/PageTransitionLoader.razor.rz.scp.css */
/* ====================================================================
   PageTransitionLoader.razor.css（スコープ CSS）
   Enhanced Navigation 用ローディング UI の見た目。

   デザイン: 葬儀社にふさわしい静かな所作。プロトタイプ01 のデザイントークン
     （セージグリーン／紙色）と落ち着いた減速イージング（--ease-calm）に揃える。
     これらのトークンは公開サイトの app.css（:root）で定義され、本コンポーネントは
     PublicLayout でのみ描画されるため確実に解決できる。万一に備え既定値も併記する。

   状態クラス（page-transition.js が付与）:
     .active         … ローダー表示・バーのアニメーション開始
     .show-indicator … 中央スピナー＋テキストを表示（遅延表示）
     .completing     … バーを 100% まで伸ばしてフェードアウト
   ==================================================================== */

/* === ベースコンテナ（既定は不可視・非操作） === */
.page-transition-loader[b-zvnqki91na] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition:
        opacity 0.2s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1)),
        visibility 0.2s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1));
}

.page-transition-loader.active[b-zvnqki91na] {
    opacity: 1;
    visibility: visible;
}

/* === 上部プログレスバー === */
.progress-track[b-zvnqki91na] {
    position: fixed;
    inset-block-start: 0;
    inset-inline: 0;
    block-size: 3px;
    overflow: hidden;
    background: transparent;
}

.progress-bar[b-zvnqki91na] {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    block-size: 100%;
    inline-size: 0;
    border-radius: 0 2px 2px 0;
    background: linear-gradient(
        90deg,
        var(--color-sage-dark, #365a4d) 0%,
        var(--color-sage, #6f8a77) 50%,
        var(--color-leaf, #8ba56e) 100%
    );
    background-size: 200% 100%;
    transition: width 0.3s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1));
}

/* 実完了を待たず、なめらかに 90% まで伸ばし続ける（読み込み中の合図） */
.page-transition-loader.active .progress-bar[b-zvnqki91na] {
    animation:
        koei-pt-progress-b-zvnqki91na 2.2s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1)) infinite,
        koei-pt-shimmer-b-zvnqki91na 1.6s ease-in-out infinite;
}

@keyframes koei-pt-progress-b-zvnqki91na {
    0%   { inline-size: 0; }
    25%  { inline-size: 32%; }
    55%  { inline-size: 62%; }
    85%  { inline-size: 84%; }
    100% { inline-size: 90%; }
}

@keyframes koei-pt-shimmer-b-zvnqki91na {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* バー先端の淡い光（控えめに左右へ流す） */
.progress-glow[b-zvnqki91na] {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    block-size: 100%;
    inline-size: 100%;
    opacity: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgb(111 138 119 / 0.35) 50%,
        transparent 100%
    );
    animation: koei-pt-glow-b-zvnqki91na 1.6s ease-in-out infinite;
}

.page-transition-loader.active .progress-glow[b-zvnqki91na] {
    opacity: 1;
}

@keyframes koei-pt-glow-b-zvnqki91na {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* === ごく淡いコンテンツフェード === */
.content-veil[b-zvnqki91na] {
    position: fixed;
    inset: 0;
    opacity: 0;
    background: rgb(255 253 248 / 0.28); /* --color-paper を薄く敷く */
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
    transition: opacity 0.3s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1));
}

.page-transition-loader.active .content-veil[b-zvnqki91na] {
    opacity: 1;
    transition-delay: 0.15s; /* バーに少し遅れて静かに掛かる */
}

/* === 中央インジケーター（遅延表示） === */
.loading-indicator[b-zvnqki91na] {
    position: fixed;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    opacity: 0;
    transition: opacity 0.3s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1));
}

/* .show-indicator が付いたときだけ現れる（速い遷移ではちらつかせない） */
.page-transition-loader.show-indicator .loading-indicator[b-zvnqki91na] {
    opacity: 1;
}

.loading-spinner[b-zvnqki91na] {
    display: block;
    inline-size: 2rem;
    block-size: 2rem;
    color: var(--color-sage-dark, #365a4d);
}

.loading-spinner svg[b-zvnqki91na] {
    inline-size: 100%;
    block-size: 100%;
    animation: koei-pt-spin-b-zvnqki91na 1s linear infinite;
}

@keyframes koei-pt-spin-b-zvnqki91na {
    to { transform: rotate(360deg); }
}

.loading-text[b-zvnqki91na] {
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: var(--color-muted, #5b6967);
    background: rgb(255 253 248 / 0.92); /* paper */
    padding: 0.375rem 0.875rem;
    border-radius: 9999px;
    box-shadow: 0 2px 10px rgb(31 42 42 / 0.10);
}

/* === 完了アニメーション === */
.page-transition-loader.completing .progress-bar[b-zvnqki91na] {
    inline-size: 100% !important;
    transition: width 0.2s ease-out;
    animation: none;
}

.page-transition-loader.completing[b-zvnqki91na] {
    opacity: 0;
    transition: opacity 0.3s var(--ease-calm, cubic-bezier(0.22, 0.61, 0.36, 1)) 0.1s;
}

/* === レスポンシブ === */
@media (max-width: 640px) {
    .loading-spinner[b-zvnqki91na] {
        inline-size: 1.75rem;
        block-size: 1.75rem;
    }
    .loading-text[b-zvnqki91na] {
        font-size: 0.75rem;
        padding: 0.3125rem 0.75rem;
    }
}

/* === モーション軽減（アクセシビリティ） === */
@media (prefers-reduced-motion: reduce) {
    .progress-bar[b-zvnqki91na],
    .progress-glow[b-zvnqki91na],
    .loading-spinner svg[b-zvnqki91na] {
        animation: none;
    }
    /* アニメーションなしでも「進行中」が分かるよう一定量だけ表示 */
    .page-transition-loader.active .progress-bar[b-zvnqki91na] {
        inline-size: 45%;
    }
    .content-veil[b-zvnqki91na],
    .loading-indicator[b-zvnqki91na] {
        transition: none;
    }
}