/* トモネコのゲーム: ポータル(ドキュメントルート)。ゲーム本体と同じ配色。 */
:root {
  --bg: #1a1626;
  --panel: #262038;
  --line: #3e3656;
  --text: #f4f0ff;
  --muted: #a89cc4;
  --accent: #f2c744;
  --accent-text: #2a1a12;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); font-family: system-ui, -apple-system, 'Hiragino Sans', 'Noto Sans JP', sans-serif; }
.portal { max-width: 640px; margin: 0 auto; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); }
.portal-head { text-align: center; padding: 16px 0 8px; }
.portal-hero { image-rendering: pixelated; width: 96px; height: 96px; }
h1 { font-size: 1.6rem; margin: 8px 0 4px; }
h2 { font-size: 1.05rem; color: var(--muted); margin: 24px 0 8px; }
h3 { font-size: 1.1rem; margin: 0 0 4px; }
p { margin: 0 0 6px; line-height: 1.6; }
.portal-lead { color: var(--muted); }
.wallet { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.wallet h2 { margin: 0 0 4px; }
.wallet-gold { font-size: 1.8rem; font-weight: 700; color: var(--accent); }
.wallet-note { color: var(--muted); font-size: 0.9rem; }
.game-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.game-card { display: flex; gap: 14px; align-items: flex-start; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.game-card img { image-rendering: pixelated; flex: none; border-radius: 8px; }
.game-body { flex: 1; min-width: 0; }
.game-links { display: flex; gap: 14px; align-items: center; margin-top: 8px; }
.game-links a { color: var(--accent); }
.btn { display: inline-block; min-height: 44px; line-height: 44px; padding: 0 22px; background: var(--accent); color: var(--accent-text) !important; border-radius: 10px; text-decoration: none; font-weight: 700; }