/* ============================================================
   litlink boost! — Creator App フェミニンテーマ
   LP世界観準拠: バイオレット×ピンクグラデ・白ベース・柔らかい影
   creator/index.html の最後に読み込む（tokens/boost.css を上書き）
   ============================================================ */
:root {
  /* ブランド: 紫→ピンクのグラデ世界観 */
  --violet:        #8B5CF6;
  --violet-dim:    #7C3AED;
  --violet-bright: #7C3AED;
  --violet-glow:   rgba(139,92,246,.30);
  --violet-trace:  rgba(139,92,246,.10);
  --energy:        #EC4899;           /* シアン廃止 → ピンク */
  --energy-glow:   rgba(236,72,153,.35);
  --xp:            #A855F7;

  /* ゲージ: 紫→ピンクの温度感 */
  --gauge-low:     #8B5CF6;
  --gauge-mid:     #A855F7;
  --gauge-near:    #EC4899;
  --gauge-full:    #F43F5E;

  /* 背景: 白ベース＋ラベンダーの光 */
  --bg-base:      #FBFAFE;
  --bg-surface:   #FFFFFF;
  --bg-elevated:  #F6F2FD;
  --bg-overlay:   rgba(26,22,37,.45);

  --text-primary:   #1A1625;
  --text-secondary: #6B6577;
  --text-muted:     #9B95A6;
  --text-inverse:   #FFFFFF;

  --shadow-sm: 0 1px 4px rgba(124,58,237,.06);
  --shadow-md: 0 4px 14px rgba(124,58,237,.10);
  --shadow-lg: 0 12px 32px rgba(124,58,237,.16);
  --shadow-violet: 0 10px 26px rgba(168,85,247,.28);
}

body, #app { background:
  radial-gradient(120% 60% at 50% 0%, #F3EFFE 0%, #FBFAFE 55%) fixed; }

/* ── カード: 白・角丸・やわらかい紫影 ── */
.stat-card, .panel, .campaign-card, .todo-item, .detail-card,
.notif-item, .score-card, .mypage-card {
  background: #fff;
  border: 1px solid #F0EDF7;
  box-shadow: 0 2px 10px rgba(124,58,237,.05);
  border-radius: 16px;
}

/* ── メインCTA: グラデーション ── */
.btn-primary, .btn-boost {
  background: linear-gradient(95deg, #8B5CF6 0%, #EC4899 100%) !important;
  color: #fff !important;
  border: none;
  border-radius: 16px;
  box-shadow: 0 10px 22px rgba(168,85,247,.35) !important;
  font-weight: 800;
}
.btn-primary:active, .btn-boost:active { transform: scale(.97); }
.btn-ghost { border-radius: 16px; border: 1.5px solid #E3DEF0; background: #fff; color: #1A1625; }

/* ── ホームゲージ: 極太黒 → グラデ文字 ── */
.home-ring-pct {
  font-weight: 800;
  background: linear-gradient(135deg, #8B5CF6 20%, #EC4899 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent !important;
  text-shadow: none !important;
}
.home-ring-pct.near, .home-ring-pct.full {
  background: linear-gradient(135deg, #EC4899 0%, #F43F5E 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent !important;
}
#home-ring { filter: drop-shadow(0 0 10px rgba(168,85,247,.30)); }

/* ── LIVEピル・バッジ: ピンクアクセント ── */
.live-pill { background: #fff; border: 1px solid #F0D6E4; box-shadow: 0 1px 4px rgba(124,58,237,.06); }
.live-pill .dot { background: #FF3B6B; }
.remain-counter { background: #FCE7F0; color: #E0357E; border: none; border-radius: 999px; font-weight: 700; }

/* ── ボトムナビ: 白＋ぼかし・アクティブ紫 ── */
#bottom-nav {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  border-top: 1px solid #F0EDF7;
  box-shadow: 0 -4px 20px rgba(124,58,237,.06);
}
#bottom-nav .nav-tab.active { color: #7C3AED; }
#bottom-nav .nav-tab.active .nav-icon { filter: none; }

/* ── XPバー・ランク: 紫グラデ ── */
.xp-bar-fill, .score-bar-fill { background: linear-gradient(90deg, #8B5CF6, #C77DDB) !important; }

/* ── 見出し: 900は800に丸めて柔らかく ── */
h1, h2, .welcome-title, .onboard-title, .section-title { font-weight: 800; }

/* ── 入力: 丸く・紫フォーカス ── */
.input { border-radius: 14px; border: 1.5px solid #E3DEF0; background: #fff; }
.input:focus { border-color: #A855F7; box-shadow: 0 0 0 3px rgba(168,85,247,.15); }

/* ── Untitled UI風フラット改修（2026-07 モック準拠） ── */
/* マーケットカード: リングセンター */
.mkc-ring-live { display:flex; align-items:center; justify-content:center; gap:3px;
  font-size:8.5px; font-weight:800; letter-spacing:.08em; color:#FF3B6B; }
.mkc-live-dot { width:5px; height:5px; border-radius:50%; background:#FF3B6B; }
.mkc-ring-pct { font-size:19px; font-weight:800; color:#1A1625; letter-spacing:-.02em;
  font-variant-numeric: tabular-nums; }
.mkc-ring-pct small { font-size:10px; font-weight:700; color:#6B6577; }
/* 画像枠: ブックマーク線画（左下） */
.mkc-img { position:relative; display:flex; align-items:center; justify-content:center; border-radius:14px; }
.mkc-bookmark { position:absolute; left:8px; bottom:8px; width:26px; height:26px;
  background:rgba(255,255,255,.85); border-radius:8px; display:flex; align-items:center; justify-content:center; }
/* メタ行: 線画アイコン整列 */
.mkc-meta { display:flex; align-items:center; gap:5px; }
/* フィルタチップ: 線画アイコン整列・アクティブは薄紫 */
.filter-chip { display:inline-flex; align-items:center; gap:5px; border-radius:999px; }
.filter-chip.active { background:linear-gradient(95deg,rgba(139,92,246,.14),rgba(236,72,153,.10));
  border:1px solid rgba(139,92,246,.4); color:#7C3AED; font-weight:700; }
/* 検索列 */
.mk-search { display:flex; align-items:center; gap:7px; border-radius:999px; background:#fff; border:1.5px solid #E3DEF0; }
.mk-filter-btn { display:inline-flex; align-items:center; gap:5px; border-radius:999px;
  background:#fff; border:1.5px solid #E3DEF0; color:#7C3AED; font-weight:700; }
/* 点滅・浮遊アニメーションの抑制（上品なフェードのみ残す） */
.live-pill .dot { animation: none; }
.remain-counter { animation: none !important; }
@media (prefers-reduced-motion: no-preference) {
  .live-pill .dot { animation: lb-pulse 2.4s ease-in-out infinite; }  /* ゆっくり */
}
/* ホームリング%: リング内に収める */
.home-ring-pct { font-size: clamp(40px, 14vw, 58px) !important; line-height: 1 !important; text-align: center; }
/* イニシャルアバター（絵文字廃止） */
.av-initial { background: linear-gradient(140deg, #C9A8F5, #F3A8D0) !important;
  color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; }

/* ── リング内%ピル（商品画像リング刷新 2026-07-08）: グラデ文字を白文字に戻す ── */
.home-ring-pct-pill .home-ring-pct,
.home-ring-pct-pill .home-ring-pct.near,
.home-ring-pct-pill .home-ring-pct.full {
  font-size: 22px !important;
  background: none !important;
  -webkit-background-clip: initial !important; background-clip: initial !important;
  color: #fff !important;
}