/* FCBoard's light interface. Game cards, pitch and rarity colors retain their
   own visual meaning; chrome uses neutral surfaces and a single blue accent. */
html:has(> body.fc-modern) { background: #f5f5f7; color-scheme: light; }
body.fc-modern ::-webkit-scrollbar-thumb { background: #c5c5cd; }
body.fc-modern ::-webkit-scrollbar-thumb:hover { background: #a0a0a8; }
body.fc-modern {
  --bg-canvas: #f5f5f7;
  --bg-surface: #ffffff;
  --bg-surface-elevated: #f5f5f7;
  --bg-surface-overlay: #eeeef0;
  --bg-surface-glass: rgba(255,255,255,.94);
  --border-subtle: #e8e8ed;
  --border-default: #dedee3;
  --border-strong: #b9b9c1;
  --border-accent: #0071e3;
  --text-primary: #1d1d1f;
  --text-secondary: #64646b;
  --text-muted: #6e6e73;
  --text-accent: #0066cc;
  --text-gold: #805b00;
  --market-up: #13754b;
  --market-down: #c63343;
  --font-body: -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', 'Segoe UI', sans-serif;
  --font-display: var(--font-body);
  --font-mono: var(--font-body);
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 15px;
  letter-spacing: -.025em;
}
body.fc-modern :where(.text-white, .text-slate-100, .text-gray-100, .text-gray-200, .text-gray-300) { color: var(--text-primary); }
body.fc-modern :where(.text-gray-400, .text-gray-500, .text-slate-400, .text-slate-300) { color: var(--text-secondary); }
body.fc-modern :where([class*="text-cyan-"], [class*="text-sky-"], [class*="text-indigo-"], [class*="text-purple-"], [class*="text-violet-"]) { color: var(--text-accent); }
body.fc-modern :where([class*="text-amber-"], [class*="text-yellow-"]) { color: #805b00; }
body.fc-modern :where([class*="text-emerald-"], [class*="text-green-"]) { color: #13754b; }
body.fc-modern :where([class*="text-rose-"], [class*="text-red-"]) { color: #c63343; }
body.fc-modern :where([class*="border-gray-"], [class*="border-slate-"], [class*="divide-gray-"]) { border-color: var(--border-subtle); }
body.fc-modern :where([class*="border-cyan-"], [class*="border-sky-"], [class*="border-indigo-"]) { border-color: #cedff2; }
body.fc-modern :where([class*="bg-[#"], [class*="bg-gray-"], [class*="bg-slate-"]) { background-color: var(--bg-surface-elevated); }
body.fc-modern :where([class*="bg-cyan-"], [class*="bg-sky-"], [class*="bg-indigo-"], [class*="bg-purple-"]) { background-color: #edf5fd; }
body.fc-modern :where([class*="bg-gradient-to-"]) { background-image: none; }
.fc-modern .font-display { letter-spacing: -.03em; }
.fc-modern .font-mono { font-variant-numeric: tabular-nums; }
.fc-modern .font-black { font-weight: 700; }
.fc-modern .cockpit-panel { border: 1px solid var(--border-subtle); border-radius: 20px; box-shadow: none; background: var(--bg-surface); }
body.fc-modern :where(.shadow-lg, .shadow-md, .shadow-xl, .shadow-sm) { box-shadow: none; }
body.fc-modern :where(button, a, input, select, summary):focus-visible { outline: 3px solid #0071e3; outline-offset: 3px; }
body.fc-modern :where(input:not([type="checkbox"]):not([type="range"]), select, textarea) { color: var(--text-primary); background: #fff; border-color: var(--border-default); }
.fc-modern input::placeholder { color: #6e6e73; }
.fc-modern .btn-primary { background: #0071e3; color: #fff; border-radius: 10px; font-weight: 600; box-shadow: none; }
.fc-modern .btn-primary:hover { background: #0066cc; transform: none; box-shadow: none; }
.fc-modern .btn-secondary { background: #f5f5f7; border-color: var(--border-default); color: var(--text-primary); border-radius: 10px; }
.fc-modern .btn-secondary:hover { background: #e8e8ed; }
.fc-modern .search-dropdown { background: #fff; border-color: var(--border-default); border-radius: 14px; box-shadow: 0 12px 36px #1d1d1f14; }
.fc-modern .search-item { border-color: var(--border-subtle); }
.fc-modern .search-item:hover { background: #f5f5f7; }
.fc-modern .site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--border-subtle); backdrop-filter: blur(18px); }
.site-header-inner { max-width: 1280px; margin: auto; min-height: 72px; padding: 0 32px; display: flex; align-items: center; gap: 36px; }
.site-brand { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 750; letter-spacing: -.025em; flex-shrink: 0; color: #1d1d1f; }
.site-brand-mark { width: 40px; height: 40px; display: block; object-fit: contain; flex-shrink: 0;}
.site-nav { display: flex; flex: 1; align-items: center; justify-content: center; gap: 24px; }
.fc-modern .site-nav .nav-tab { padding: 27px 0; font-size: 13px; font-weight: 500; letter-spacing: -.025em; color: #64646b; border-radius: 0; white-space: nowrap; background: transparent; }
.fc-modern .site-nav .nav-tab.active { color: #1d1d1f; }
.fc-modern .site-nav .nav-tab:hover { color: #0066cc; background: transparent; }
.fc-modern .site-nav .nav-tab.active::after { height: 2px; bottom: 0; left: 0; right: 0; background: #1d1d1f; box-shadow: none; }
.header-alert { flex-shrink: 0; font-size: 12px; color: #0066cc; font-weight: 500; padding: 8px 13px; background: #edf5fd; border-radius: 999px; }
.fc-modern main.fc-ad-content { max-width: 1280px; padding: 44px 32px 64px; }
.tool-intro { display: flex; justify-content: space-between; align-items: center; gap: 32px; margin-bottom: 32px; }
.tool-intro h1 { font-size: 34px; font-weight: 700; letter-spacing: -.055em; line-height: 1.25; }
.tool-intro p { margin-top: 10px; color: var(--text-secondary); font-size: 14px; }
.tool-intro #headerSearchWrap { flex: 0 1 400px; min-width: 240px; max-width: 440px; }
.tool-intro #searchInput { min-height: 48px; background: #fff; border: 1px solid var(--border-default); border-radius: 12px; font-size: 14px; padding-left: 40px; }
.tool-intro .search-dropdown { top: 52px; }
.player-directory-link { display: block; width: fit-content; margin: 8px 0 0 auto; color: var(--text-accent); font-size: 12px; }
.player-directory-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.gacha-catalog-table .gacha-table :is(th, td):first-child { min-width: 280px; }
.fc-modern #marketView { grid-template-columns: minmax(0,1fr) 300px; gap: 24px; align-items: start; }
.market-workspace { grid-column: 1; grid-row: 1; min-width: 0; }
.market-sidebar { grid-column: 2; grid-row: 1 / span 3; min-width: 0; }
.market-history { grid-column: 1; grid-row: 2; min-width: 0; }
.fc-modern .player-showcase { padding: 28px; align-items: center; gap: 28px; }
.fc-modern .player-showcase .fc-card { width: 180px; height: 260px; background: #f5f5f7; border: 0; box-shadow: none; border-radius: 14px; padding: 12px; }
.fc-modern .fc-card::before, .fc-modern .fc-card-photo-bg { display: none; }
.fc-modern .fc-card:hover, .fc-modern .fc-card:hover .fc-card-photo { transform: none; box-shadow: none; }
.fc-modern .fc-card-photo { max-height: 145px; max-width: 100%; filter: none; }
.fc-modern .fc-card-footer { background: transparent; border: 0; backdrop-filter: none; padding: 6px 0 0; }
.fc-modern .fc-player-name { font-size: 15px; }
.fc-modern .player-showcase #currentPriceDisplay { color: var(--text-primary); font-size: clamp(23px,2.3vw,32px); letter-spacing: -.045em; }
.fc-modern .player-showcase [class*="bg-[#"] { background: transparent; border: 0; padding-left: 0; padding-right: 0; }
.fc-modern .player-showcase .grid:has(>button) { grid-template-columns: repeat(3,minmax(0,1fr)); }
.fc-modern .player-showcase .grid > button { background: #f5f5f7; color: #424247; border: 0; min-height: 36px; font-weight: 500; box-shadow: none; }
.fc-modern .player-showcase .grid > button:last-child { grid-column: auto; }
.fc-modern .grade-pill { background: #f5f5f7; border-color: transparent; color: #64646b; box-shadow: none; min-width: 28px; height: 30px; }
.fc-modern .grade-pill[class*="active-"] { background: #1d1d1f; border-color: #1d1d1f; color: #fff; box-shadow: none; }
.fc-modern .range-btn.bg-gray-700 { background: #fff; color: #1d1d1f; box-shadow: 0 1px 4px #1d1d1f12; }
.fc-modern #tabTrendingBtn.bg-indigo-600, .fc-modern #tabFavoritesBtn.bg-indigo-600 { background: #fff; color: #1d1d1f; box-shadow: 0 1px 4px #1d1d1f12; }
.fc-modern #marketView .watchlist-item { background: #fff; border-color: transparent; border-radius: 10px; }
.fc-modern #marketView .watchlist-item:hover { background: #f5f5f7; }
.fc-modern #marketView .watchlist-item.active { background: #edf5fd; border-color: #cee1f5; }
body.fc-modern :where(.history-disclosure, .tool-data-disclosure) > summary { padding: 20px 24px; font-size: 14px; font-weight: 600; cursor: pointer; }
.history-disclosure > summary span { font-size: 12px; font-weight: 400; color: var(--text-secondary); margin-left: 12px; }
.history-disclosure > div { max-height: 360px; }
.tool-data-disclosure { grid-column: 1; grid-row: 3; border-top: 1px solid var(--border-default); }
.tool-data-disclosure > summary { padding-left: 0; }
.disclosure-content { padding: 8px 0 24px; }
.fc-modern #metaView .tool-data-disclosure, .fc-modern #gachaView .tool-data-disclosure { width: 100%; }
.fc-modern footer { background: #f5f5f7; border-color: var(--border-default); }
.fc-modern footer a { color: #64646b; text-decoration: none; font-size: 12px; }
.fc-modern footer a:hover { color: #0066cc; text-decoration: underline; }
.fc-modern footer .text-gray-700 { display: none; }
.fc-modern .pulse-dot, .fc-modern .animate-pulse { animation: none; }
/* Custom rendered components use the same light surfaces. */
body.fc-modern :where(.gacha-package-card, .gacha-package-thumb, .gacha-item-thumb, .gacha-item-symbol, .gacha-item-tile, .compare-player-card, .multi-compare-card, .rt-section, .rt-rank-row, .rt-team-section, .rt-player-row, .rt-tactics-panel) { background: var(--bg-surface); border-color: var(--border-subtle); box-shadow: none; }
.fc-modern .rt-section :where(input, select, button:not(.rt-rank-row)) { background: #f5f5f7; border-color: var(--border-default); color: #1d1d1f; }
.fc-modern .rt-section :where(h2, h3, strong, dd, .rt-rank-name, .rt-player-settings) { color: #1d1d1f; }
.fc-modern .rt-section :where(p, dt, .rt-rank-meta, .rt-note, .rt-status) { color: var(--text-secondary); }
.fc-modern .rt-rank-row:hover, .fc-modern .rt-rank-row.is-selected { background: #edf5fd; border-color: #cedff2; box-shadow: none; }
body.fc-modern .rt-section :is(input, select, button:not(.rt-rank-row)) { background: #f5f5f7; border-color: var(--border-default); color: var(--text-primary); }
body.fc-modern .rt-section :is(label, .rt-rank-info, .rt-rank-score span, .rt-footnote, .rt-empty, .rt-eyebrow, .rt-participation, .rt-player-name small, .rt-player-settings small, .rt-pagination, .rt-comparison thead th) { color: var(--text-secondary); }
body.fc-modern .rt-section :is(.rt-player-name, .rt-subtitle, .rt-comparison table) { color: var(--text-primary); }
body.fc-modern .rt-section :is(.rt-heading a, .rt-selection a, .rt-position, .rt-setting-code, .rt-team-section h5) { color: var(--text-accent); }
body.fc-modern .rt-section :is(.rt-notice, .rt-different td) { background: #edf5fd; color: #215584; }
.fc-modern .meta-formation-card { background: #f5f5f7; border-color: var(--border-subtle); box-shadow: none; }
.fc-modern .meta-formation-card:hover, .fc-modern .meta-formation-card.selected { background: #edf5fd; border-color: #a6c9ee; box-shadow: none; }
.fc-modern .meta-formation-card .bg-cyan-400 { background: #0071e3; }
body.fc-modern #metaView > .grid:first-child > div { background: #fff; border-color: var(--border-subtle); }
body.fc-modern #metaView > .grid:first-child [class*="text-"] { color: var(--text-secondary); }
body.fc-modern #metaView > .grid:first-child [id^="metaHero"] { color: var(--text-primary); }
body.fc-modern #squadPitchBoard > div > span { color: #d0e9d8; }
body.fc-modern #squadPitchBoard [class*="text-cyan-"] { color: #a9d9ff; }
body.fc-modern #tabFavoritesBtn.bg-amber-600 { background: #fff; color: #1d1d1f; box-shadow: 0 1px 4px #1d1d1f12; }
.fc-modern #watchlistContainer > div { border-color: var(--border-subtle); }
.fc-modern #watchlistContainer .font-display { color: var(--text-secondary); }
.fc-modern #watchlistContainer .font-display.text-emerald-400 { color: #13754b; }
.fc-modern #watchlistContainer .font-display.text-rose-400 { color: #c63343; }
body.fc-modern #watchlistContainer [class*="bg-amber-"] { background: #eeeef0; color: #64646b; box-shadow: none; }
body.fc-modern .player-showcase #liquidityBadge { background: #f5f5f7; color: #64646b; border-color: var(--border-default); }
.fc-modern .prose-fc :where(p, ul, ol, td) { color: var(--text-secondary); }
.fc-modern .prose-fc :where(h2, h3, strong) { color: var(--text-primary); }
.fc-modern .prose-fc :where(th, .note, .formula) { background: #f5f5f7; color: var(--text-primary); border-color: var(--border-default); }
.fc-modern .prose-fc a { color: var(--text-accent); }
/* The football field and authentic reward cards are game content. */
.fc-modern #squadPitchBoard { background-color: #0f281a; }
.fc-modern #squadPitchBoard :where(.text-white, .text-gray-100, .text-gray-200, .text-gray-300) { color: #fff; }
.fc-modern .squad-slot :where(.squad-slot-name, .squad-slot-price) { color: #fff; }
body.fc-modern :where(.fc-player-card, .squad-slot) { --text-primary: #f8fafc; --text-secondary: #cbd5e1; }
@media (max-width: 1100px) {
  .site-header-inner { gap: 24px; }
  .site-nav { gap: 16px; }
  .fc-modern #marketView { grid-template-columns: minmax(0,1fr) 280px; gap: 20px; }
  .fc-modern .player-showcase { flex-direction: column; }
  .fc-modern .player-showcase .fc-card { width: 160px; height: 225px; }
}
@media (max-width: 767px) {
  .site-header-inner { padding: 14px 20px 0; flex-wrap: wrap; gap: 12px; justify-content: space-between; }
  .site-nav { order: 3; flex: 0 0 calc(100% + 40px); margin: 0 -20px; padding: 0 20px; justify-content: flex-start; overflow-x: auto; gap: 24px; scrollbar-width: none; }
  .site-nav::-webkit-scrollbar { display: none; }
  .fc-modern .site-nav .nav-tab { padding: 14px 0; }
  .fc-modern main.fc-ad-content { padding: 28px 16px 40px; }
  .tool-intro { flex-direction: column; align-items: stretch; gap: 22px; margin-bottom: 24px; }
  .tool-intro h1 { font-size: 28px; }
  .tool-intro p { font-size: 13px; }
  .tool-intro #headerSearchWrap { flex: auto; width: 100%; min-width: 0; max-width: none; }
  .fc-modern #marketView { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .market-workspace { grid-column: 1; grid-row: 1; }
  .market-sidebar { grid-column: 1; grid-row: 3; }
  .market-history { grid-column: 1; grid-row: 2; }
  .tool-data-disclosure { grid-column: 1; grid-row: 4; }
  .fc-modern .player-showcase { padding: 20px; gap: 20px; }
  .fc-modern .player-showcase .fc-card { width: 140px; height: 200px; }
  .fc-modern .fc-card-photo { max-height: 105px; }
  .fc-modern .fc-player-season-text { font-size: 10px; }
  .fc-modern .player-showcase .fc-card { height: 214px; }
  .fc-modern .tool-intro input { font-size: 16px !important; }
  .fc-modern .player-showcase .grid:has(>button) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fc-modern .player-showcase .grid > button:last-child { grid-column: 1 / -1; }
  .fc-modern .player-showcase .btn-primary, .fc-modern .player-showcase .btn-secondary { font-size: 12px; padding-inline: 10px; }
  .fc-modern .cockpit-panel { border-radius: 16px; }
  .fc-modern .rt-section { padding: 20px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .fc-modern *, .fc-modern *::before, .fc-modern *::after { transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

.market-mover-row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-subtle); font-size: 13px; }
.market-mover-row small { display: block; color: var(--text-secondary); font-size: 11px; margin-top: 4px; }
.market-mover-row > span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
