/* ============================================================
   BLADE QUEST サイト共通スタイル
   ============================================================ */
:root{
  --bg:#211d2e;
  --panel:#2d2842;
  --panel2:#362f4d;
  --line:#4a4165;
  --cyan:#4ce0d2;
  --magenta:#ff6b9d;
  --gold:#ffd166;
  --text:#f5f2fa;
  --sub:#bab0d6;
}
*{box-sizing:border-box;}
html,body{
  margin:0;padding:0;
  background:radial-gradient(ellipse at 50% -10%, #362f4d 0%, var(--bg) 55%);
  color:var(--text);
  font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  line-height:1.85;
  font-size:15.5px;
}
a{ color:var(--cyan); text-decoration:none; }
a:hover{ text-decoration:underline; }

.site-header{
  width:100%;max-width:960px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:12px;
  padding:18px 20px;
  border-bottom:1px solid var(--line);
}
.site-title{
  font-family:'Press Start 2P', monospace;
  font-size:13px;color:var(--cyan);
  text-shadow:0 0 10px rgba(76,224,210,0.4);
  letter-spacing:1px;
}
.site-nav{ display:flex; gap:18px; flex-wrap:wrap; }
.site-nav a{
  font-size:13.5px;color:var(--sub);font-weight:600;
  padding:4px 2px;border-bottom:2px solid transparent;
}
.site-nav a:hover, .site-nav a.active{
  color:var(--cyan); text-decoration:none; border-bottom:2px solid var(--cyan);
}

.site-main{
  width:100%;max-width:760px;margin:0 auto;
  padding:36px 22px 70px;
}
.site-main h1{
  font-family:'Press Start 2P', monospace;
  font-size:19px;line-height:1.7;color:var(--cyan);
  margin-bottom:22px;
}
.site-main h2{
  font-size:17px;color:var(--text);
  border-left:4px solid var(--cyan);
  padding-left:12px;margin:38px 0 14px;
}
.site-main h3{
  font-size:15px;color:var(--gold);margin:22px 0 8px;
}
.site-main p{ margin:12px 0; color:#e4dff2; }
.site-main ul, .site-main ol{ padding-left:22px; color:#e4dff2; }
.site-main li{ margin:6px 0; }
.lead{
  font-size:15.5px;color:var(--sub);
  border-left:3px solid var(--magenta);
  padding:10px 16px;background:rgba(255,107,157,0.09);
  border-radius:0 8px 8px 0;
}
.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px 22px;
  margin:18px 0;
}
.card h3{ margin-top:0; }
.btn-primary{
  display:inline-block;
  background:var(--cyan);color:#04231f;font-weight:700;
  padding:11px 24px;border-radius:8px;
  margin-top:14px;
}
.btn-primary:hover{ text-decoration:none; filter:brightness(1.08); }
table.info-table{ width:100%;border-collapse:collapse;margin:14px 0; }
table.info-table th, table.info-table td{
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);
  font-size:14px;
}
table.info-table th{ color:var(--gold);width:38%; }

.site-footer{
  width:100%;max-width:960px;margin:0 auto;
  text-align:center;color:var(--sub);font-size:12px;
  padding:26px 20px 40px;
  border-top:1px solid var(--line);
}
.site-footer a{ color:var(--sub); }
.site-footer a:hover{ color:var(--cyan); }
.footer-links{ margin-bottom:8px; }
.footer-links a{ margin:0 8px; }

.badge{
  display:inline-block;font-size:11px;color:var(--bg);
  background:var(--gold);padding:2px 8px;border-radius:20px;
  font-weight:700;margin-left:6px;vertical-align:middle;
}

.game-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:22px;
  margin:28px 0 10px;
}
.game-card{
  display:block;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.game-card:hover{
  transform:translateY(-4px);
  border-color:var(--cyan);
  text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,0.35);
}
.game-card .thumb{
  height:130px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Press Start 2P', monospace;
  font-size:15px;
  letter-spacing:1px;
  position:relative;
  overflow:hidden;
}
.game-card .thumb.bq{
  background:radial-gradient(ellipse at 30% 20%, #1e4a30 0%, #12321f 60%, #0d2419 100%);
  color:#4ce0d2;
  text-shadow:0 0 10px rgba(76,224,210,0.6);
}
.game-card .thumb.tm{
  background:radial-gradient(ellipse at 70% 70%, #241d18 0%, #100d16 55%, #050408 100%);
  color:#e8d98a;
  text-shadow:0 0 10px rgba(232,217,138,0.5);
}
.game-card .thumb.ct{
  background:radial-gradient(ellipse at 40% 30%, #3a2a1a 0%, #241708 60%, #150d05 100%);
  color:#ff9d4d;
  text-shadow:0 0 10px rgba(255,157,77,0.5);
}
.game-card .thumb.ns{
  background:radial-gradient(ellipse at 60% 40%, #2a1216 0%, #170a0c 60%, #0a0506 100%);
  color:#c94b4b;
  text-shadow:0 0 10px rgba(201,75,75,0.5);
}
.game-card .thumb.is{
  background:radial-gradient(ellipse at 50% 25%, #ffd9a0 0%, #ffb08a 55%, #4f90b0 100%);
  color:#20303f;
  text-shadow:0 0 8px rgba(255,255,255,0.6);
}
.game-card .thumb.bt{
  background:radial-gradient(ellipse at 45% 35%, #3a4038 0%, #1a1d18 55%, #060705 100%);
  color:#8fae9c;
  text-shadow:0 0 10px rgba(143,174,156,0.5);
}

.game-card .thumb .dot{
  position:absolute;width:6px;height:6px;border-radius:50%;
  background:currentColor;opacity:0.55;
}
.game-card .body{ padding:18px 20px 20px; }
.game-card .tag{
  display:inline-block;font-size:10px;color:var(--sub);
  background:rgba(255,255,255,0.06);padding:3px 9px;border-radius:20px;
  margin-bottom:10px;
}
.game-card h3{ margin:0 0 8px; color:var(--text); font-size:16px; }
.game-card p{ margin:0; color:var(--sub); font-size:13.5px; line-height:1.75; }
.game-card .play-link{
  display:inline-block;margin-top:14px;color:var(--cyan);font-size:13px;font-weight:600;
}
.more-soon{
  border:1px dashed var(--line);border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  color:var(--sub);font-size:13px;min-height:130px;
  text-align:center;padding:20px;
}