/* style.css - 基本のスタイル */
:root{
  --bg:#f6f8fb;
  --card:#ffffff;
  --accent:#2b6cb0;
  --muted:#6b7280;
  --radius:12px;
  --maxw:900px;
  --pad:20px;
}

*{box-sizing:border-box}
html,body{
	height:100%;
	margin:0;
	font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,'Noto Sans JP','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
	background:var(--bg);
	color:#111
}
.container{
	text-align: center;
	max-width:var(--maxw);
	margin:30px auto;
	padding:0 16px
}
.site-header{
	text-align: center;
	background:linear-gradient(90deg,var(--accent),#4c9bd6);
	color:white;
	padding:40px 16px;
}
.site-header h1{
	margin:0;
	font-size:1.6rem
}
.subtitle{
	margin-top:6px;
	opacity:0.95
}

.card{
	background:var(--card);
	padding:var(--pad);
	border-radius:10px;
	margin-top:16px;
	box-shadow:0 6px 14px rgba(16,24,40,0.06)
}
.card h2{
	margin:0 0 8px 0
	font-size:1.4rem
}
.card p, .card li{
	color:var(--muted);line-height:1.6
}

.card.small{
	max-width:520px
}

.site-footer{
	text-align:center;
	padding:22px 16px;color:var(--muted);
	font-size:0.9rem;margin-top:30px
}
code{
	background:#f3f4f6;
	padding:2px 6px;
	border-radius:6px;
	font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, 'Courier New', monospace;
	font-size:0.95rem
}