/* ============================================
   らいとマッチ - Brand Design System
   Dark × Gold Luxury Theme
   ============================================ */

/* --- Base Reset & Transitions --- */
* {
    transition-property: color, background-color, border-color, box-shadow, opacity, transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

html {
    scroll-behavior: smooth;
}

/* --- Selection color --- */
::selection {
    background: rgba(201, 168, 78, 0.3);
    color: #EAEAEA;
}

/* --- Upload area hover effects --- */
.upload-area-active {
    border-color: #C9A84E !important;
    background-color: rgba(201, 168, 78, 0.05) !important;
}

/* --- Image preview styling --- */
.preview-container {
    position: relative;
    overflow: hidden;
    border-radius: 0.75rem;
}

.preview-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.preview-container .remove-btn {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.7);
    border: 1px solid rgba(201, 168, 78, 0.3);
    color: #C9A84E;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.75rem;
    opacity: 0;
    transition: opacity 0.2s;
}

.preview-container:hover .remove-btn {
    opacity: 1;
}

/* --- Loading overlay --- */
.loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(10, 10, 10, 0.85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.loading-card {
    background: #1a1a1a;
    border: 1px solid rgba(201, 168, 78, 0.15);
    border-radius: 1.5rem;
    padding: 2.5rem;
    text-align: center;
    max-width: 400px;
    width: 90%;
    box-shadow:
        0 25px 50px -12px rgba(0, 0, 0, 0.5),
        0 0 60px rgba(201, 168, 78, 0.05);
}

/* --- Pulse animation for loading --- */
@keyframes pulse-dot {
    0%, 80%, 100% {
        transform: scale(0.6);
        opacity: 0.3;
    }
    40% {
        transform: scale(1);
        opacity: 1;
    }
}

.pulse-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #C9A84E;
    margin: 0 5px;
    animation: pulse-dot 1.4s ease-in-out infinite;
}

.pulse-dot:nth-child(2) {
    animation-delay: 0.2s;
}

.pulse-dot:nth-child(3) {
    animation-delay: 0.4s;
}

/* --- Toast animation --- */
@keyframes slide-up {
    from {
        transform: translateY(1rem);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.toast-show {
    animation: slide-up 0.3s ease-out;
}

/* --- Gold glow effect for buttons --- */
.btn-gold {
    position: relative;
    overflow: hidden;
}

.btn-gold::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(201, 168, 78, 0.2), transparent, rgba(201, 168, 78, 0.1));
    opacity: 0;
    transition: opacity 0.3s;
}

.btn-gold:hover::before {
    opacity: 1;
}

/* --- Subtle gold border glow on cards --- */
.card-glow {
    position: relative;
}

.card-glow::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(201, 168, 78, 0.1), transparent, rgba(201, 168, 78, 0.05));
    z-index: -1;
    opacity: 0;
    transition: opacity 0.4s;
}

.card-glow:hover::after {
    opacity: 1;
}

/* --- Decorative line (match stick accent) --- */
.accent-line {
    width: 2px;
    height: 24px;
    background: linear-gradient(to bottom, #C9A84E, transparent);
    border-radius: 1px;
}

/* --- Light breathing animation --- */
@keyframes breathe {
    0%, 100% { opacity: 0.4; transform: scale(0.95); }
    50% { opacity: 0.7; transform: scale(1.05); }
}

.glow-breathe {
    animation: breathe 3s ease-in-out infinite;
}

/* --- Scrollbar styling (dark) --- */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* --- Input focus ring override --- */
input:focus, textarea:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(201, 168, 78, 0.3);
    border-color: #C9A84E !important;
}

/* --- Subtle text gradient for headings --- */
.text-gold-gradient {
    background: linear-gradient(135deg, #d4b85a, #C9A84E, #b8973f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ============================================================
   カッザーマコラボ: そよかぜ — Summer Breeze Theme v3
   爽やか・風が吹いてる・明るく柔らかい
   ============================================================ */

/* === Keyframes === */

@keyframes kz-bg-breathe {
    0%   { background-position: 0% 0%; }
    25%  { background-position: 60% 35%; }
    50%  { background-position: 100% 100%; }
    75%  { background-position: 38% 68%; }
    100% { background-position: 0% 0%; }
}

@keyframes kz-orb-float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    28%  { transform: translate(62px, -44px) scale(1.09); }
    56%  { transform: translate(-34px, 36px) scale(0.94); }
    80%  { transform: translate(26px, -18px) scale(1.04); }
}

/* 二枚目のオーブ層 */
@keyframes kz-orb-float-b {
    0%, 100% { transform: translate(0, 0) scale(1) rotate(0deg); }
    30%  { transform: translate(-48px, 28px) scale(1.06) rotate(3deg); }
    60%  { transform: translate(38px, -22px) scale(0.96) rotate(-2deg); }
    82%  { transform: translate(-18px, 18px) scale(1.02) rotate(1deg); }
}

/* 細い風ライン層（遅い） */
@keyframes kz-wind-slow {
    from { transform: translateX(-28%) skewY(-2.5deg); }
    to   { transform: translateX(28%) skewY(-2.5deg); }
}

/* 太い風シーン層（速い） */
@keyframes kz-wind-fast {
    0%   { transform: translateX(-22%) skewY(-1.8deg); opacity: 0.18; }
    50%  { opacity: 0.30; }
    100% { transform: translateX(22%) skewY(-1.8deg); opacity: 0.18; }
}

/* 光のシマー */
@keyframes kz-shimmer {
    from { background-position: -200% center; }
    to   { background-position:  200% center; }
}

/* 要素入場 */
@keyframes kz-rise {
    from { opacity: 0; transform: translateY(26px) scale(0.974); }
    to   { opacity: 1; transform: translateY(0)    scale(1); }
}

@keyframes kz-hero-in {
    from { opacity: 0; transform: translateY(22px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* カードの息吹 */
@keyframes kz-glow-breathe {
    0%, 100% {
        opacity: 0.80;
        transform: scale(0.95);
        box-shadow: 0 0 14px rgba(56, 189, 248, 0.38);
    }
    50% {
        opacity: 1;
        transform: scale(1.07);
        box-shadow: 0 0 28px rgba(103, 232, 249, 0.56);
    }
}

/* 風パーティクルのドリフト */
@keyframes kz-particle-drift {
    0%   { transform: translate(0, 0) scale(1); opacity: 0; }
    8%   { opacity: 1; }
    88%  { opacity: 0.55; }
    100% { transform: translate(var(--dx, 80px), var(--dy, -220px)) scale(0.55); opacity: 0; }
}

/* 風スキャンライン */
@keyframes kz-scanline {
    0%   { transform: translateX(-130%) rotate(var(--rot, -16deg)); opacity: 0; }
    8%   { opacity: 1; }
    92%  { opacity: 1; }
    100% { transform: translateX(130%) rotate(var(--rot, -16deg)); opacity: 0; }
}

/* テキストグラデーションアニメ */
@keyframes kz-grad-flow {
    from { background-position: 0% center; }
    to   { background-position: 200% center; }
}

/* === Body === */
body.theme-collab-kazama {
    font-family: "Noto Sans JP", sans-serif !important;
    background: linear-gradient(
        158deg,
        #fdf8f0 0%,
        #e8f7fd 14%,
        #c8effe 30%,
        #d8f5eb 50%,
        #e8e4ff 70%,
        #d0f4ff 86%,
        #edfff7 100%
    ) !important;
    background-size: 280% 280% !important;
    animation: kz-bg-breathe 34s ease-in-out infinite !important;
    color: #334155 !important;
    overflow-x: hidden;
}

/* オーブ層 A：大きな柔らかい光の玉 */
body.theme-collab-kazama::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 92% 72% at  4% 10%, rgba(186, 230, 253, 0.76), transparent 58%),
        radial-gradient(ellipse 74% 62% at 97% 84%, rgba(110, 231, 183, 0.66), transparent 56%),
        radial-gradient(ellipse 58% 50% at 52%  1%, rgba(221, 214, 254, 0.54), transparent 54%),
        radial-gradient(ellipse 66% 56% at 86% 10%, rgba(165, 243, 252, 0.58), transparent 58%),
        radial-gradient(ellipse 52% 46% at 14% 94%, rgba(167, 243, 208, 0.52), transparent 52%),
        radial-gradient(ellipse 48% 42% at 50% 50%, rgba(254, 243, 199, 0.32), transparent 68%);
    animation: kz-orb-float 36s ease-in-out infinite;
}

/* 風ライン層：複数スピードの細い白線 */
body.theme-collab-kazama::after {
    content: "";
    position: fixed;
    inset: -55% -28%;
    z-index: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(
            -19deg,
            transparent,
            transparent 52px,
            rgba(255, 255, 255, 0.76) 52px,
            rgba(255, 255, 255, 0.76) 53px,
            transparent 53px,
            transparent 104px,
            rgba(255, 255, 255, 0.46) 104px,
            rgba(255, 255, 255, 0.46) 104.5px,
            transparent 104.5px,
            transparent 156px,
            rgba(255, 255, 255, 0.30) 156px,
            rgba(255, 255, 255, 0.30) 156.4px
        );
    animation: kz-wind-slow 46s linear infinite alternate;
}

body.theme-collab-kazama > nav,
body.theme-collab-kazama > main {
    position: relative;
    z-index: 1;
}

/* 風パーティクル＆スキャンライン（JSで注入） */
body.theme-collab-kazama #kz-wind-layer {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

body.theme-collab-kazama #kz-wind-layer .kz-p {
    position: absolute;
    border-radius: 50%;
    animation: kz-particle-drift var(--dur, 22s) var(--del, 0s) linear infinite;
}

body.theme-collab-kazama #kz-wind-layer .kz-scan {
    position: absolute;
    left: 0;
    right: 0;
    height: 1.5px;
    animation: kz-scanline var(--dur, 16s) var(--del, 0s) linear infinite;
    border-radius: 2px;
}

/* === ナビゲーション === */
body.theme-collab-kazama nav {
    border-color: rgba(186, 230, 253, 0.58) !important;
    background: rgba(255, 255, 255, 0.84) !important;
    backdrop-filter: blur(30px) saturate(1.65) brightness(1.04);
    -webkit-backdrop-filter: blur(30px) saturate(1.65) brightness(1.04);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.97) inset,
        0 6px 34px -10px rgba(14, 165, 233, 0.20),
        0 0 0 1px rgba(186, 230, 253, 0.42);
}

body.theme-collab-kazama nav .text-gray-100 { color: #0f172a !important; }
body.theme-collab-kazama nav .text-gray-500 { color: #64748b !important; }

body.theme-collab-kazama nav .bg-gold-500 {
    background: linear-gradient(135deg, #38bdf8, #34d399) !important;
}
body.theme-collab-kazama nav .bg-gold-500\/60 {
    background: rgba(56, 189, 248, 0.50) !important;
}
body.theme-collab-kazama nav a.group:hover .rounded-full {
    box-shadow: 0 0 26px rgba(56, 189, 248, 0.72) !important;
}

/* === アクセントカラー: スカイ/ミント/ウォームゴールド === */
body.theme-collab-kazama .text-gold-500,
body.theme-collab-kazama .hover\:text-gold-500:hover,
body.theme-collab-kazama .group-hover\:text-gold-500:hover {
    color: #0ea5e9 !important;
}
body.theme-collab-kazama .text-gold-500\/80,
body.theme-collab-kazama .text-gold-500\/90,
body.theme-collab-kazama .text-gold-500\/60 {
    color: rgba(14, 165, 233, 0.88) !important;
}
body.theme-collab-kazama .border-gold-500\/30,
body.theme-collab-kazama .border-gold-500\/20,
body.theme-collab-kazama .border-gold-500\/35,
body.theme-collab-kazama .border-gold-500\/25,
body.theme-collab-kazama .hover\:border-gold-500\/30:hover,
body.theme-collab-kazama .hover\:border-gold-500\/50:hover,
body.theme-collab-kazama .group-hover\:border-gold-500\/50:hover {
    border-color: rgba(56, 189, 248, 0.46) !important;
}
body.theme-collab-kazama .bg-gold-500 {
    background: linear-gradient(135deg, #38bdf8, #34d399) !important;
}
body.theme-collab-kazama .shadow-gold-500\/10,
body.theme-collab-kazama .hover\:shadow-gold-500\/20:hover {
    --tw-shadow-color: rgba(14, 165, 233, 0.22);
}
body.theme-collab-kazama .text-gold-gradient {
    background: linear-gradient(
        125deg,
        #0369a1 0%,
        #0ea5e9 25%,
        #22d3ee 50%,
        #34d399 75%,
        #0ea5e9 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: kz-grad-flow 5.5s linear infinite;
}
body.theme-collab-kazama .from-gold-600,
body.theme-collab-kazama .to-gold-500 {
    --tw-gradient-from: #0284c7 !important;
    --tw-gradient-to:   #22d3ee !important;
}

/* === サーフェス: クリスタルフロストガラス === */
body.theme-collab-kazama .bg-dark-800 {
    background-color: transparent !important;
}
body.theme-collab-kazama .bg-dark-700,
body.theme-collab-kazama .bg-dark-700\/90 {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(18px) saturate(1.45);
    -webkit-backdrop-filter: blur(18px) saturate(1.45);
}
body.theme-collab-kazama .bg-dark-600 {
    background: rgba(236, 253, 255, 0.90) !important;
}
body.theme-collab-kazama .bg-dark-500,
body.theme-collab-kazama .bg-dark-500\/90 {
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(22px) saturate(1.55);
    -webkit-backdrop-filter: blur(22px) saturate(1.55);
}
body.theme-collab-kazama .bg-dark-500\/60 {
    background: rgba(255, 255, 255, 0.62) !important;
}
body.theme-collab-kazama .bg-dark-400 {
    background: rgba(224, 242, 254, 0.92) !important;
}
body.theme-collab-kazama .bg-dark-300 {
    background: rgba(240, 253, 255, 0.96) !important;
}
body.theme-collab-kazama .border-dark-200\/50,
body.theme-collab-kazama .border-dark-200\/30,
body.theme-collab-kazama .border-dark-200\/20,
body.theme-collab-kazama .border-dark-100\/50 {
    border-color: rgba(186, 230, 253, 0.72) !important;
}

/* === テキストカラー === */
body.theme-collab-kazama .text-gray-100 { color: #0f172a !important; }
body.theme-collab-kazama .text-gray-200 { color: #1e293b !important; }
body.theme-collab-kazama .text-gray-300 { color: #334155 !important; }
body.theme-collab-kazama .text-gray-400 { color: #64748b !important; }
body.theme-collab-kazama .text-gray-500 { color: #64748b !important; }
body.theme-collab-kazama .text-gray-600 { color: #94a3b8 !important; }
body.theme-collab-kazama .text-dark-200  { color: #cbd5e1 !important; }
body.theme-collab-kazama .hover\:text-gray-300:hover { color: #475569 !important; }
body.theme-collab-kazama .text-emerald-400 { color: #2dd4bf !important; }
body.theme-collab-kazama .text-amber-500\/90 { color: rgba(245, 158, 11, 0.9) !important; }

/* === シャドウ === */
body.theme-collab-kazama .shadow-black\/40,
body.theme-collab-kazama .shadow-black\/60,
body.theme-collab-kazama .shadow-black\/50,
body.theme-collab-kazama .shadow-black\/20 {
    --tw-shadow: 0 20px 40px -12px rgba(14, 165, 233, 0.14);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* === カード: クリスタルガラス + 浮き上がり === */
body.theme-collab-kazama .card-glow {
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.92) inset,
        0 2px 0 rgba(255, 255, 255, 0.97) inset,
        0 8px 36px -10px rgba(14, 165, 233, 0.14),
        0 1px 3px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.42s cubic-bezier(0.22, 1, 0.36, 1),
                transform   0.42s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
body.theme-collab-kazama .card-glow:hover {
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.96) inset,
        0 2px 0 rgba(255, 255, 255, 0.99) inset,
        0 18px 52px -12px rgba(14, 165, 233, 0.30),
        0 0 0 1.5px rgba(56, 189, 248, 0.40),
        0 1px 4px rgba(0, 0, 0, 0.06) !important;
    transform: translateY(-5px) !important;
}
body.theme-collab-kazama .card-glow::after {
    background: linear-gradient(135deg, rgba(56, 189, 248, 0.22), transparent 40%, rgba(110, 231, 183, 0.18));
}

/* === Glow breathe === */
body.theme-collab-kazama .glow-breathe {
    animation: kz-glow-breathe 4.8s ease-in-out infinite;
}

/* === 生成ボタン: 風のシマーグラデーション === */
body.theme-collab-kazama #generate-btn {
    background: linear-gradient(
        122deg,
        #0369a1 0%,
        #0ea5e9 16%,
        #22d3ee 36%,
        #34d399 52%,
        #10b981 66%,
        #0ea5e9 82%,
        #0369a1 100%
    ) !important;
    background-size: 250% auto !important;
    animation: kz-shimmer 3.0s linear infinite !important;
    color: #f8fafc !important;
    border: 1px solid rgba(255, 255, 255, 0.52) !important;
    box-shadow:
        0 0 0 5px rgba(56, 189, 248, 0.16),
        0 18px 56px -12px rgba(14, 165, 233, 0.55),
        0 3px 0 rgba(255, 255, 255, 0.38) inset !important;
    transition: box-shadow 0.35s ease, transform 0.35s ease !important;
}
body.theme-collab-kazama #generate-btn:hover:not(:disabled) {
    box-shadow:
        0 0 0 7px rgba(56, 189, 248, 0.24),
        0 24px 64px -10px rgba(14, 165, 233, 0.66),
        0 3px 0 rgba(255, 255, 255, 0.46) inset !important;
    transform: translateY(-3px) !important;
}
body.theme-collab-kazama #generate-btn .text-dark-800 {
    color: #f8fafc !important;
}

/* === ローディングオーバーレイ === */
body.theme-collab-kazama .loading-overlay {
    background: rgba(224, 242, 254, 0.88);
    backdrop-filter: blur(16px);
}
body.theme-collab-kazama .loading-card {
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(186, 230, 253, 0.86);
    box-shadow:
        0 25px 50px -12px rgba(14, 165, 233, 0.18),
        0 0 52px rgba(56, 189, 248, 0.10);
}
body.theme-collab-kazama .pulse-dot {
    background: linear-gradient(135deg, #38bdf8, #34d399);
}

/* === トースト === */
body.theme-collab-kazama #toast .bg-dark-300 {
    background: rgba(255, 255, 255, 0.97) !important;
    border-color: rgba(186, 230, 253, 0.90) !important;
    color: #1e293b !important;
    box-shadow: 0 18px 52px -12px rgba(14, 165, 233, 0.26);
}
body.theme-collab-kazama #toast .text-gray-100 {
    color: #0f172a !important;
}

/* === スプラッシュ === */
body.theme-collab-kazama #splash-screen {
    background: linear-gradient(160deg, #c8effe 0%, #e2faf4 40%, #ede8ff 72%, #c8effe 100%);
    background-size: 200% 200%;
    animation: kz-bg-breathe 12s ease-in-out infinite;
}
body.theme-collab-kazama #splash-hint { color: #64748b !important; }
body.theme-collab-kazama #splash-screen #sp-jp    { fill: #0f172a !important; }
body.theme-collab-kazama #splash-screen #sp-en    { fill: #64748b !important; }
body.theme-collab-kazama #splash-screen #sp-dot   { fill: #0ea5e9 !important; }
body.theme-collab-kazama #splash-screen #sp-stick { stroke: #38bdf8 !important; }
body.theme-collab-kazama #splash-screen #sp-glow  { fill: #38bdf8 !important; }
body.theme-collab-kazama #splash-screen #sp-spark { fill: #22d3ee !important; }

/* === アップロードエリア === */
body.theme-collab-kazama .upload-area-active {
    border-color: #38bdf8 !important;
    background-color: rgba(56, 189, 248, 0.05) !important;
}
body.theme-collab-kazama .preview-container .remove-btn {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(56, 189, 248, 0.42);
    color: #0284c7;
}

/* === スクロールバー === */
body.theme-collab-kazama ::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.44);
}
body.theme-collab-kazama ::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 116, 139, 0.60);
}

/* === セレクション === */
body.theme-collab-kazama ::selection {
    background: rgba(56, 189, 248, 0.28);
    color: #0f172a;
}

/* === フォーカスリング === */
body.theme-collab-kazama input:focus,
body.theme-collab-kazama textarea:focus {
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.28);
    border-color: #38bdf8 !important;
}

/* === モーダル背景 === */
body.theme-collab-kazama .bg-black\/70,
body.theme-collab-kazama .bg-black\/80 {
    background-color: rgba(15, 23, 42, 0.36) !important;
}

/* === グラデ区切り線 === */
body.theme-collab-kazama .to-dark-100   { --tw-gradient-to:   rgb(186 230 253) !important; }
body.theme-collab-kazama .from-dark-100 { --tw-gradient-from: rgb(186 230 253) !important; }

/* === 入場アニメーション === */
body.theme-collab-kazama main .max-w-6xl.mx-auto > div:first-child {
    animation: kz-hero-in 0.92s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.theme-collab-kazama main .grid.grid-cols-1.lg\:grid-cols-2 > div:nth-child(1) {
    animation: kz-rise 0.82s 0.12s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.theme-collab-kazama main .grid.grid-cols-1.lg\:grid-cols-2 > div:nth-child(2) {
    animation: kz-rise 0.82s 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.theme-collab-kazama .grid.grid-cols-1.md\:grid-cols-3 > div:nth-child(1) {
    animation: kz-rise 0.76s 0.06s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.theme-collab-kazama .grid.grid-cols-1.md\:grid-cols-3 > div:nth-child(2) {
    animation: kz-rise 0.76s 0.18s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.theme-collab-kazama .grid.grid-cols-1.md\:grid-cols-3 > div:nth-child(3) {
    animation: kz-rise 0.76s 0.30s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.theme-collab-kazama #dashboard-grid > div {
    animation: kz-rise 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.theme-collab-kazama #dashboard-grid > div:nth-child(1) { animation-delay: 0.04s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(2) { animation-delay: 0.09s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(3) { animation-delay: 0.14s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(4) { animation-delay: 0.19s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(5) { animation-delay: 0.24s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(6) { animation-delay: 0.29s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(7) { animation-delay: 0.34s; }
body.theme-collab-kazama #dashboard-grid > div:nth-child(8) { animation-delay: 0.39s; }

body.theme-collab-kazama #dashboard-grid > div:hover {
    border-color: rgba(56, 189, 248, 0.54) !important;
    box-shadow: 0 12px 40px -8px rgba(14, 165, 233, 0.26) !important;
}

/* === モーションオフ === */
@media (prefers-reduced-motion: reduce) {
    body.theme-collab-kazama,
    body.theme-collab-kazama::before,
    body.theme-collab-kazama::after {
        animation: none !important;
    }
    body.theme-collab-kazama {
        background: linear-gradient(165deg, #d8f5ff 0%, #e2faf4 50%, #f3eeff 100%) !important;
        background-size: auto !important;
    }
    body.theme-collab-kazama .text-gold-gradient,
    body.theme-collab-kazama #generate-btn {
        animation: none !important;
    }
    body.theme-collab-kazama main .max-w-6xl.mx-auto > div:first-child,
    body.theme-collab-kazama main .grid > div,
    body.theme-collab-kazama #dashboard-grid > div,
    body.theme-collab-kazama .glow-breathe {
        animation: none !important;
    }
    body.theme-collab-kazama .card-glow {
        transition: none !important;
    }
    body.theme-collab-kazama #kz-wind-layer {
        display: none !important;
    }
}