/* ================= 配色テーマ（麻雀バリエーション） =================
   default: 紺（ネイビー×金）
   jantaku: 雀卓の緑（ラシャ深緑×金）
   chun:    中の赤（漆黒×赤×金）
   hai:     牌の白（象牙ライト×發の緑×中の赤）
====================================================================== */

:root{ --cta-text:#0a1628; }

[data-theme="jantaku"]{
  --navy:#082418; --navy2:#0c2f20; --card:#123a29;
  --gold:#e8c35c; --gold2:#f2dc9a;
  --water:#3fae7a; --water2:#8fdcb4;
  --text:#eaf3ee; --muted:#95b5a5;
  --border:rgba(255,255,255,.09);
  --cta-text:#082418;
}
[data-theme="jantaku"] .hero{
  background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(63,174,122,.16),transparent),var(--navy);
}
/* 雀卓の羅紗の質感（うっすら明るい中央→暗い縁のビネット） */
[data-theme="jantaku"] body{
  background:
    radial-gradient(ellipse 120% 90% at 50% 0%, rgba(63,174,122,.07), transparent 60%),
    radial-gradient(ellipse 140% 120% at 50% 45%, #0c3120 0%, #082418 75%, #051a11 100%);
  background-attachment:fixed;
}
/* 差し色: 中の赤（準備中チップ・的中率などの一点強調） */
[data-theme="jantaku"] .paid .soon{
  background:rgba(192,57,43,.18); color:#ff9a8c; border-color:rgba(192,57,43,.5);
}
[data-theme="jantaku"] .hero h1 em{
  color:var(--gold);
  text-shadow:0 0 24px rgba(232,195,92,.25);
}
[data-theme="jantaku"] .badge{ border-color:rgba(232,195,92,.25); color:#e9f2ec; }
/* 購入者ページ: 買い目を象牙の牌プレートに乗せる */
[data-theme="jantaku"] .buy{
  background:linear-gradient(165deg,#fcf8ec 0%,#efe8d2 75%,#e2d8bc 100%);
  color:#14603d;
  box-shadow:0 4px 0 #c9bc97,0 6px 10px rgba(0,0,0,.4);
  border:none;
}
[data-theme="jantaku"] .buy.mio{ color:#c0392b; }
[data-theme="jantaku"] .rname{ color:#f2dc9a; }
/* 万舟カードを赤牌風に（金枠＋赤文字の一点豪華） */
[data-theme="jantaku"] .mcard .pay{ color:#f0c96a; }
[data-theme="jantaku"] .mcard{ border-color:rgba(232,195,92,.4); }

[data-theme="chun"]{
  --navy:#160e10; --navy2:#211217; --card:#2b161d;
  --gold:#e8b64c; --gold2:#f5d78e;
  --water:#d05560; --water2:#f09aa2;
  --text:#f4ecec; --muted:#b39a9e;
  --border:rgba(255,255,255,.09);
  --cta-text:#160e10;
}
[data-theme="chun"] .hero{
  background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(208,85,96,.15),transparent),var(--navy);
}

[data-theme="hai"]{
  --navy:#f0e9d8; --navy2:#e5dcc5; --card:#fbf8ef;
  --gold:#9a6d0b; --gold2:#7a5608;
  --water:#1d7a4f; --water2:#14603d;
  --text:#2c2a24; --muted:#7a7466;
  --red:#c0392b; --green:#1d7a4f;
  --border:rgba(0,0,0,.14);
  --cta-text:#fffdf5;
}
[data-theme="hai"] .hero{
  background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(29,122,79,.12),transparent),var(--navy);
}
[data-theme="hai"] header{ background:rgba(240,233,216,.92); }
[data-theme="hai"] .nav a.cta{ background:#c0392b; }
[data-theme="hai"] .btn.gold{ background:#c0392b; color:#fffdf5; }
[data-theme="hai"] .paid{ background:linear-gradient(160deg,#e9f2e6,var(--card)); border-color:rgba(29,122,79,.35); }
[data-theme="hai"] .mcard{ border-color:rgba(154,109,11,.45); }

/* CTAの文字色をテーマ変数化（暗色テーマは濃紺文字、牌テーマは白文字） */
.nav a.cta{ color:var(--cta-text) !important; }
.btn.gold{ color:var(--cta-text) !important; }
.gate button{ color:var(--cta-text) !important; }

/* ヘッダー内スイッチャー */
.theme-sw{ display:inline-flex; gap:7px; margin-left:16px; vertical-align:middle }
.theme-sw button{
  width:20px; height:20px; border-radius:50%; cursor:pointer;
  border:2px solid rgba(255,255,255,.35); padding:0;
}
[data-theme="hai"] .theme-sw button{ border-color:rgba(0,0,0,.25); }
.theme-sw button.on{ border-color:#e8b64c; box-shadow:0 0 0 2px rgba(232,182,76,.35); }
.theme-sw .t-default{ background:linear-gradient(135deg,#0a1628 55%,#e8b64c 55%); }
.theme-sw .t-jantaku{ background:linear-gradient(135deg,#0c3a26 55%,#e8c35c 55%); }
.theme-sw .t-chun{ background:linear-gradient(135deg,#1c1013 55%,#d05560 55%); }
.theme-sw .t-hai{ background:linear-gradient(135deg,#f0e9d8 55%,#1d7a4f 55%); }

body{ transition:background .25s, color .25s; }