:root{
  /* 縁日の木のもぐら叩き台: 芝の緑の地・明るい木の盤・法被の藍のボタン（ホームの THEME・play.js と同じ組） */
  --paper:#b4d7a2;
  --card:#d1e6c6;
  --board:#d8ba97;
  --ink:#2a1d12;
  --line:#93b281;
  --wood-dark:#6b4a2e;
  --wood-light:#9a6b43;
  --accent:#2c4a78;
  --accent-ink:#2c4a78;
  --accent-soft:#c9d6ea;
  --danger:#8f2324;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
/* 一番後ろ（枠の外）の色は共通の枠が決める。作品では塗らない */
html,body{margin:0;height:100%;overscroll-behavior:none}
body{color:var(--ink);touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}

#world{position:absolute;inset:0;background:var(--paper);overflow:hidden;font-size:22px}
.screen{position:absolute;inset:0;display:none}
.screen.on{display:block}
/* 遊ぶ場面は共通の帯（上 64px）の下に置く */
#sPlay{top:64px}
.stats b,.rkList .rk,.rkList .sc,.hist .s{font-family:'RocknRoll One',sans-serif;font-weight:400}

/* ---------- ホームの絵（共通の shell.home の h.art）: CPU 同士のデモ。押せない ---------- */
.sh-home .sh-foot{flex-wrap:wrap}
.mgRecords h3{font-size:20px;margin:4px 0 8px;color:var(--wood-dark)}
.mgRecords .stats{flex-wrap:wrap}
.mgRecords .stats div{flex:1 1 40%}
.rkNote{font-size:18px;margin:0 0 10px;opacity:.75}

/* ---------- 小さなウィンドウ（shell.panel）の中身。閉じている間は .mgStore にしまう ---------- */
.mgTabs{display:flex;gap:8px;margin:0 0 12px}

/* ---------- 遊び方の図とデモ（guide.js）の見た目は guide.js の中に持つ（部屋のページでも同じに出すため） ---------- */

/* ---------- 結果（共通の shell.result に足す 2 行） ---------- */
.mgRSub{margin:-6px 0 0;font-size:22px}
.mgRSub.new{color:#fff;background:var(--danger);padding:2px 12px;border-radius:4px}
.mgRRank{margin:0;font-size:18px;opacity:.75;min-height:24px}

/* ---------- ランキング・記録・設定 ---------- */
.mgSet .field{display:flex;align-items:center;gap:12px;font-size:20px;margin-bottom:16px;flex-wrap:wrap}
.mgSet .lbl{min-width:80px;opacity:.75}
.mgSet .seg{display:flex;gap:6px}
.rkList{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 24px;font-size:20px}
.rkList li{display:flex;gap:10px;padding:2px 6px;border-bottom:1px solid var(--line);min-width:0}
.rkList li.me{background:var(--accent-soft);border-radius:4px}
.rkList .rk{width:36px;flex:none}
.rkList .nm{flex:1;min-width:0;overflow-wrap:anywhere}
.rkMe{font-size:20px;margin:12px 0 0;color:var(--accent-ink)}
.stats{display:flex;gap:12px;margin:0 0 12px}
.stats div{border-top:1px solid var(--line);padding:8px 10px 4px;text-align:center;flex:1;min-width:0}
.stats span{display:block;font-size:16px;opacity:.7}
.stats b{font-size:34px;color:var(--accent-ink);white-space:nowrap}
.stats .top{flex:1.4}
.stats .top b{font-size:44px}
.hist{list-style:none;margin:0;padding:0;font-size:18px;display:grid;gap:2px}
.hist li{display:flex;flex-wrap:wrap;gap:4px 12px;border-bottom:1px solid var(--line);padding:2px 0}
.hist .d{opacity:.6;width:110px}
.hist .s{width:70px}
.vol{width:220px;max-width:100%;accent-color:var(--accent)}
.nameIn{width:260px;max-width:100%}

/* ---------- 顔の色: 縁日の木のもぐら叩き台 ----------
   地は芝の緑 #b4d7a2（HSL 色相 100・彩度 40%・明度 74%）、文字は焦げ茶 #2a1d12（10:1）、薄い文字 #4d3a26（6.8:1）。
   主なボタンは法被の藍 #2c4a78（色相 216。地の緑とはっきり別）に白い文字（8.9:1）。藍の文字は地 5.6:1・盤 4.8:1。
   盤は明るい木 #d8ba97（彩度 45%・明度 72%）に濃い木の縁。点の箱・ウィンドウは淡い芝 #d1e6c6（明度 84%）。
   強い朱・金・赤は提灯・題字・もぐらまわりの小さな面だけ */
.shell-stage{--ui-shade:rgba(180,215,162,.97);--ui-chip:var(--accent-soft);--ui-card:var(--card)}
/* 盤の外の地（帯の下も含む）。ホームのデモは一段だけ濃い芝で、ホームの地と分ける */
.shell-stage .mgb{--paper:#b4d7a2}
.shell-stage .mgDemo .mgb{--paper:#abd397}
.sh-home .sh-art{outline:2px solid var(--wood-dark);outline-offset:-2px}
.shell-stage .ui-btn{border-radius:6px;box-shadow:none}
.shell-stage .ui-btn.sub:not(.sh-sh *),.shell-stage .ui-chip{background:var(--card);color:var(--ink);border:2px solid var(--wood-dark);box-shadow:none}
.shell-stage .ui-btn.sub:not(.sh-sh *):hover,.shell-stage .ui-chip:hover{background:#dcedd3}
.shell-stage .ui-chip.on,.shell-stage .sh-tabs button[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.shell-stage .ui-input{background:#e4f0dd;color:var(--ink);border:2px solid var(--wood-dark)}
.shell-stage .shell-wait{color:var(--ui-sub)}
.shell-stage .sh-result li{border-radius:4px}
/* 小さなウィンドウ: 影の代わりに線で区切る（上の太い帯は意味が読めないので置かない） */
.shell-stage .sh-box{box-shadow:none;border:2px solid var(--wood-dark)}
.shell-stage .sh-box header{border-bottom:1px solid var(--line);margin-bottom:8px}
.shell-stage .sh-pic{box-shadow:none;border:1px solid var(--line)}