@charset "UTF-8";
/*
  Skin Name: レトロファミコン (1983年配色)
  Description: 初代ファミコン本体の赤×金×象牙のレトロ配色スキン。
  Author: yasusho
  Version: 1.0.0
  Priority: 101
*/

:root{
  --rg-ink:       #2a1810;
  --rg-paper:     #f4ead5;
  --rg-paper-2:   #ece0c2;
  --rg-line:      #d8c89a;
  --rg-muted:     #6b5a4a;
  --rg-accent:    #b51a1a;   /* ファミコン赤 */
  --rg-accent-2:  #6b3410;   /* ダークウッド */
  --rg-accent-3:  #e8b923;   /* ゴールド */
  --rg-accent-4:  #4a7c2a;   /* 和グリーン */
  --rg-shadow:    4px 4px 0 var(--rg-ink);
  --rg-shadow-sm: 2px 2px 0 var(--rg-ink);
  --rg-font-dot:  "DotGothic16","Hiragino Sans","Noto Sans JP",monospace;
  --rg-font-body: "Kaisei Decol","Hiragino Mincho ProN","Yu Mincho",serif;
  --rg-font-en:   "Press Start 2P",monospace;
}
@import url('https://fonts.googleapis.com/css2?family=DotGothic16&family=Kaisei+Decol:wght@400;700&family=Press+Start+2P&display=swap');

body{ font-family:var(--rg-font-body); background:var(--rg-paper); color:var(--rg-ink); line-height:1.8; }
a{ color:var(--rg-accent); }
a:hover{ color:var(--rg-accent-2); }

/* 見出し */
.article h1,.article h2,.article h3,.article h4{
  font-family:var(--rg-font-dot); letter-spacing:.04em; color:var(--rg-ink);
}
.article h2{
  background:var(--rg-accent); color:#fff; padding:8px 14px;
  border:2px solid var(--rg-ink); box-shadow:var(--rg-shadow-sm);
  border-radius:0; font-size:1.25em;
}
.article h2::before{ content:"● "; color:var(--rg-accent-3); }
.article h3{
  border-left:6px solid var(--rg-accent-3);
  border-bottom:2px double var(--rg-ink);
  padding:4px 10px; border-radius:0; font-size:1.1em;
}
.article h4{ border:none; border-bottom:1px dotted var(--rg-ink); padding-bottom:2px; }

/* Header: 白背景＋赤いカラーバー */
#header{
  background:#fff; color:var(--rg-ink);
  border-bottom:4px solid var(--rg-accent); position:relative;
}
#header::after{
  content:""; position:absolute; left:0; right:0; bottom:-8px; height:4px;
  background:repeating-linear-gradient(90deg,
    var(--rg-accent) 0 10px, var(--rg-accent-3) 10px 20px, var(--rg-accent-2) 20px 30px);
}
.site-name-text,.header-container .site-name a:not(:has(img)){
  font-family:var(--rg-font-dot); color:var(--rg-ink)!important;
  letter-spacing:.08em; text-shadow:2px 2px 0 var(--rg-accent-3);
}
.header-container .site-name a img,.logo img,.logo-image,.site-name-text-link img{
  background:transparent; border:none; box-shadow:none; filter:none;
}
.tagline,.site-description{
  font-family:var(--rg-font-en); font-size:10px;
  color:var(--rg-accent); letter-spacing:.1em;
}

/* グロナビ */
#navi,.navi-in{ background:var(--rg-accent); }
#navi a{
  font-family:var(--rg-font-dot); color:#fff; letter-spacing:.05em;
  border-right:1px solid rgba(255,255,255,.2);
}
#navi a:hover{ background:var(--rg-accent-2); }

#main,.main{ background:transparent; }

/* Sidebar */
.sidebar .widget,#sidebar .widget{
  background:#fff; border:2px solid var(--rg-ink);
  box-shadow:var(--rg-shadow-sm); padding:14px; margin-bottom:20px; border-radius:0;
}
.sidebar h3,.sidebar .widget h3,#sidebar h3{
  font-family:var(--rg-font-dot); background:var(--rg-accent); color:#fff;
  margin:-14px -14px 12px; padding:8px 12px; border:none;
  border-bottom:3px solid var(--rg-accent-3); font-size:14px; letter-spacing:.05em;
}
.sidebar h3::before,#sidebar h3::before{ content:"◆ "; color:var(--rg-accent-3); }

.sidebar .author-box,.sidebar .author-widget,#sidebar .author-box,#sidebar .author-widget{
  display:grid; grid-template-columns:72px 1fr; gap:12px; align-items:start;
}
.sidebar .author-thumb,#sidebar .author-thumb,.sidebar .avatar,#sidebar .avatar{
  grid-column:1; grid-row:1 / span 3;
  width:72px!important; height:72px!important; margin:0!important; padding:0!important;
  border:2px solid var(--rg-ink); box-shadow:var(--rg-shadow-sm);
  border-radius:0; image-rendering:pixelated; object-fit:cover;
}
.sidebar .author-thumb img,#sidebar .author-thumb img{
  width:100%!important; height:100%!important; display:block; border-radius:0!important;
}
.sidebar .author-name,.sidebar .author-description,.sidebar .author-content,
#sidebar .author-name,#sidebar .author-description,#sidebar .author-content,
.sidebar .sns-share,#sidebar .sns-share{ grid-column:2; text-align:left!important; margin:0; }
.sidebar .author-name,#sidebar .author-name{
  font-family:var(--rg-font-dot); font-size:13px; font-weight:700; margin-bottom:4px;
}
.sidebar .author-description,#sidebar .author-description,
.sidebar .author-content,#sidebar .author-content{ font-size:12px; line-height:1.55; }

/* Buttons */
.btn,button,input[type="submit"]{
  font-family:var(--rg-font-dot); background:var(--rg-accent); color:#fff;
  border:2px solid var(--rg-ink); border-radius:0;
  box-shadow:var(--rg-shadow-sm); padding:8px 16px; letter-spacing:.05em;
}
.btn:hover,button:hover,input[type="submit"]:hover{
  transform:translate(-2px,-2px); box-shadow:4px 4px 0 var(--rg-ink); color:#fff;
}

/* Breadcrumb / Footer */
#breadcrumb,.breadcrumb{
  background:var(--rg-paper-2); border-top:2px solid var(--rg-ink); border-bottom:2px solid var(--rg-ink);
  font-family:var(--rg-font-dot); font-size:12px; padding:8px 14px;
}
#footer,.footer{
  background:var(--rg-accent-2); color:#fff;
  border-top:4px solid var(--rg-accent); position:relative;
}
#footer::before{
  content:""; position:absolute; top:-8px; left:0; right:0; height:4px;
  background:repeating-linear-gradient(90deg,
    var(--rg-accent) 0 10px, var(--rg-accent-3) 10px 20px, var(--rg-accent-2) 20px 30px);
}
#footer a{ color:var(--rg-accent-3); }
.copyright{ font-family:var(--rg-font-en); font-size:10px; letter-spacing:.1em; }

blockquote{
  background:#fff; border:2px solid var(--rg-ink); border-left:8px solid var(--rg-accent);
  border-radius:0; box-shadow:var(--rg-shadow-sm); padding:14px 18px;
}
code{
  font-family:var(--rg-font-dot); background:var(--rg-ink); color:var(--rg-accent-3);
  padding:1px 5px; border-radius:0;
}

/* Game Guide Top */
.game-guide-top{ max-width:960px; margin:0 auto; font-family:var(--rg-font-body); }
.game-guide-top .gg-hero{
  background:var(--rg-accent); color:#fff; padding:32px 20px; text-align:center;
  border:3px solid var(--rg-ink); box-shadow:inset 0 0 0 2px #f4ead5,6px 6px 0 var(--rg-ink);
  margin-bottom:28px; position:relative; overflow:hidden;
}
.game-guide-top .gg-hero h2{
  font-family:var(--rg-font-dot); font-size:30px; margin:0 0 6px; letter-spacing:.1em;
  text-shadow:3px 3px 0 var(--rg-ink); background:none!important; border:none!important;
  box-shadow:none!important; padding:0; color:#fff!important;
}
.game-guide-top .gg-hero p{ font-size:13px; margin:0; opacity:.95; color:#fff!important; }
.game-guide-top .gg-hero .gg-blink{
  margin-top:12px; font-family:var(--rg-font-en); font-size:10px;
  color:var(--rg-accent-3); letter-spacing:.15em; animation:gg-blink 1.2s steps(2) infinite;
}
@keyframes gg-blink{50%{opacity:0}}
.game-guide-top .gg-series{ margin-bottom:28px; }
.game-guide-top .gg-series-title{
  display:inline-block; font-family:var(--rg-font-dot); font-size:14px;
  padding:6px 14px; background:var(--rg-accent); color:#fff!important;
  border:2px solid var(--rg-ink); box-shadow:3px 3px 0 var(--rg-ink);
  margin-bottom:14px; letter-spacing:.08em;
}
.game-guide-top .gg-series-title::before{ content:"▶ "; color:var(--rg-accent-3); }
.game-guide-top .gg-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px;
}
.game-guide-top .gg-card{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  background:#fff; border:3px solid var(--rg-ink);
  box-shadow:4px 4px 0 var(--rg-ink); text-decoration:none!important;
  color:var(--rg-ink)!important; border-radius:0; transition:transform .1s,box-shadow .1s;
}
.game-guide-top .gg-card:hover{
  transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--rg-accent); color:var(--rg-ink)!important;
}
.game-guide-top .gg-card-icon{
  flex-shrink:0; width:48px; height:48px; border:2px solid var(--rg-ink);
  display:grid; place-items:center; image-rendering:pixelated;
}
.game-guide-top .gg-card-name{
  font-family:var(--rg-font-dot); font-size:13px; line-height:1.3; letter-spacing:.02em;
}
.game-guide-top .gg-card-sub{
  font-family:var(--rg-font-en); font-size:8px; color:var(--rg-muted);
  letter-spacing:.1em; margin-top:3px;
}

@media(max-width:768px){
  .game-guide-top .gg-hero h2{ font-size:22px; }
  .game-guide-top .gg-grid{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; }
  .game-guide-top .gg-card{ padding:10px; gap:8px; border-width:2px; box-shadow:3px 3px 0 var(--rg-ink); }
  .game-guide-top .gg-card-icon{ width:40px; height:40px; }
  .game-guide-top .gg-card-name{ font-size:12px; }
}
@media(max-width:480px){
  .game-guide-top .gg-grid{ grid-template-columns:1fr 1fr; gap:6px; }
  .game-guide-top .gg-card{ padding:8px; }
  .game-guide-top .gg-card-icon{ width:36px; height:36px; }
}
