/* お客さまの画面の見た目「ひと昔前のゲーム」（2026-09-27）。お客さまの画面だけが、各画面の <style> の後に読む。
   色・枠・ドット絵のどんぐり・星・帯・動きは、全部この1枚に置く（画面ごとに書き写さない）。
   部品を外す時は、下の「── 名前」のかたまりを消す。画面の側に残る印（昔-頭・昔-舞台 など）は、飾りが無くても読める形にしてある。
   絵は外から読まない（data: の中に書く）。字は端末に入っている物だけを使う。
   🔵 端末が暗い設定でも、この画面は明るい色のまま（画面ごとに明るい色を直に書いた所が多く、暗くすると読めなくなる所が出るため）。 */

[hidden]{display:none!important}

/* ── 字：見出しの太い字（Windows に入っている創英角ゴシックUB。無い端末は太いゴシックで出る） */
@font-face{font-family:"昔の角字";font-weight:700;
  src:local("HGSSoeiKakugothicUB"),local("HGS創英角ｺﾞｼｯｸUB"),local("HGSoeiKakugothicUB"),local("HG創英角ｺﾞｼｯｸUB")}

/* ── 色（増やした色＝紫・黄・青・緑。2色に戻す時は --紫〜--緑 を --橙 と --墨 に寄せる） */
html:root{
  --地:#f6d8ad; --紙:#fff7ea; --墨:#161310; --薄墨:#5b4a38; --影:#161310;
  --橙:#e2620e; --紫:#3a1f68; --黄:#ffd23a; --青:#2f66d0; --緑:#26964a;
  --窓:#101018; --帯:#161310;
  --角字:"昔の角字","Hiragino Sans","Hiragino Kaku Gothic ProN","BIZ UDPGothic","Yu Gothic",sans-serif;
  color-scheme:light;
  /* 画面ごとの色の名前を、ここの色へ寄せる（画面の側の色の決め方はそのまま効く） */
  --bg:var(--地); --card:var(--紙); --panel:var(--紙); --surface:var(--紙); --paper:var(--紙);
  --surface-alt:#fbe7c6; --surface-soft:#fbe7c6; --soft:#fbe0bb; --accent-soft:#fbe0bb; --brand-soft:#fbe0bb; --quiet:#fbe7c6;
  --ink:var(--墨); --text:var(--墨); --muted:var(--薄墨); --sub:var(--薄墨); --line:#b99570;
  --accent:#c9560a; --accent-dark:#9c3f05; --accent-strong:#9c3f05; --brand:#c9560a; --brand-deep:#9c3f05;
  --shadow:4px 4px 0 var(--影);
}
html{background:var(--地)}
body{background:var(--地);color:var(--墨);font-family:"BIZ UDPGothic","Yu Gothic UI","Hiragino Kaku Gothic ProN","Hiragino Sans",system-ui,sans-serif}
a{color:var(--accent)}

/* ── 見出し */
h1{font-family:var(--角字);font-weight:700;font-size:21px;line-height:1.35;letter-spacing:.02em}
h1::before{content:"★ ";content:"★ " / "";color:var(--橙)}
h1.title{font-size:24px}
h2{font-family:var(--角字);font-weight:700;letter-spacing:.02em}
h2::before{content:"■ ";content:"■ " / "";color:var(--橙)}
.wrap > h2{border-left:0;padding-left:0}
h3{font-family:var(--角字);font-weight:700}

/* ── 見出しの黒い帯と星（店名と画面の名前） */
.昔-頭{position:relative;display:block;margin:0;background:var(--帯);color:#fff;padding:12px 88px 12px 16px;
  border:0;border-bottom:4px solid var(--橙);border-radius:0;box-shadow:none;overflow:hidden;
  font-family:var(--角字);font-weight:700;font-size:20px;line-height:1.35;letter-spacing:.02em}
.昔-頭:not(:has(.brand))::before{content:"★ ";content:"★ " / "";color:var(--橙)}
.昔-頭 .topbar-inner{display:block;max-width:none;margin:0;padding:0}
.昔-頭 .brand{margin:0;font-family:var(--角字);font-weight:700;font-size:20px;line-height:1.35;letter-spacing:.02em;color:#fff}
.昔-頭 .brand::before{content:"★ ";content:"★ " / "";color:var(--橙)}
.昔-頭 .brand img{display:inline-block!important;vertical-align:middle}
.昔-頭 .quiet{display:inline-block!important;margin-top:4px;border:2px solid #fff;padding:0 8px;
  font:700 12px/1.6 "BIZ UDPGothic","Yu Gothic UI",sans-serif;letter-spacing:0;color:#fff}
.昔-頭 .tagline{margin:6px 0 0;color:var(--黄);font:700 12px/1.5 "BIZ UDPGothic","Yu Gothic UI",sans-serif;letter-spacing:0}
.昔-頭::after{content:"";position:absolute;right:12px;bottom:6px;width:64px;height:34px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 22' shape-rendering='crispEdges'%3E%3Cg fill='%23ffd23a'%3E%3Cpath d='M6 2h2v2h2v2H8v2H6V6H4V4h2z'/%3E%3Cpath d='M30 10h2v2h2v2h-2v2h-2v-2h-2v-2h2z'/%3E%3C/g%3E%3Cg fill='%23fff'%3E%3Crect x='18' y='4' width='2' height='2'/%3E%3Crect x='38' y='2' width='2' height='2'/%3E%3Crect x='14' y='16' width='2' height='2'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
/* 2026-10-29 ハスイ「右上の★みたいなドット絵を消して。押せそうで気になる」＝帯の右の星は出さない（お客さまの画面も店員の画面も） */
.昔-頭::after{display:none}

/* ── 舞台：話の窓・ドット絵のどんぐり・地面と星（外す時は、ここを .昔-名札,.昔-どんぐり{display:none} の1行にする） */
.昔-舞台{position:relative;margin:14px 0;padding:14px 88px 34px 12px;border:3px solid var(--影);
  background:var(--紫) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none'%3E%3Cg fill='%23fff' opacity='.7'%3E%3Crect x='92' y='4' width='1' height='2'/%3E%3Crect x='84' y='12' width='1' height='2'/%3E%3Crect x='96' y='20' width='1' height='2'/%3E%3C/g%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.昔-舞台::after{content:"";position:absolute;left:0;right:0;bottom:0;height:24px;background-color:#b5561c;
  background-image:linear-gradient(#5a2a0a 3px,transparent 3px),linear-gradient(90deg,#5a2a0a 3px,transparent 3px);
  background-size:24px 12px,24px 12px}
.昔-話{position:relative;z-index:1;min-height:84px;padding:14px 12px 10px;background:var(--窓);color:#fff;
  border:3px solid #fff;border-radius:6px;box-shadow:0 0 0 3px var(--窓);font-size:14.5px;line-height:1.65;
  --ink:#fff;--text:#fff;--muted:#fff;--accent:var(--黄);--accent-dark:var(--黄)}
.昔-話 > :not(.昔-名札){margin:0;max-width:none;color:#fff;font-size:14.5px;line-height:1.65}
.昔-話 a{color:var(--黄);font-weight:700}
.昔-話 b,.昔-話 strong{color:#fff}
.昔-名札{position:absolute;left:10px;top:-13px;background:var(--窓);border:2px solid #fff;border-radius:4px;
  padding:0 8px;font-size:12px;font-weight:700;line-height:1.6;color:#fff}
.昔-どんぐり{position:absolute;z-index:1;right:14px;bottom:24px;width:64px;height:72px;cursor:pointer;image-rendering:pixelated;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 18' shape-rendering='crispEdges'%3E%3Cpath fill='%232b1a0c' d='M8 0h3v1h-3zM7 1h1v1h-1zM9 1h1v1h-1zM5 2h7v1h-7zM3 3h2v1h-2zM12 3h2v1h-2zM2 4h1v1h-1zM14 4h1v1h-1zM1 5h1v1h-1zM15 5h1v1h-1zM1 6h1v1h-1zM15 6h1v1h-1zM2 7h13v1h-13zM2 8h1v1h-1zM14 8h1v1h-1zM2 9h1v1h-1zM14 9h1v1h-1zM2 10h1v1h-1zM14 10h1v1h-1zM2 11h1v1h-1zM14 11h1v1h-1zM2 12h1v1h-1zM14 12h1v1h-1zM3 13h1v1h-1zM13 13h1v1h-1zM3 14h1v1h-1zM13 14h1v1h-1zM4 15h1v1h-1zM12 15h1v1h-1zM5 16h2v1h-2zM10 16h2v1h-2zM7 17h3v1h-3z'/%3E%3Cpath fill='%234f2f16' d='M8 1h1v1h-1z'/%3E%3Cpath fill='%23a8703a' d='M5 3h1v1h-1zM7 3h1v1h-1zM9 3h1v1h-1zM11 3h1v1h-1zM3 4h1v1h-1zM5 4h1v1h-1zM7 4h1v1h-1zM9 4h1v1h-1zM11 4h1v1h-1zM13 4h1v1h-1zM3 5h1v1h-1zM5 5h1v1h-1zM7 5h1v1h-1zM9 5h1v1h-1zM11 5h1v1h-1zM13 5h1v1h-1z'/%3E%3Cpath fill='%237a4a22' d='M6 3h1v1h-1zM8 3h1v1h-1zM10 3h1v1h-1zM4 4h1v1h-1zM6 4h1v1h-1zM8 4h1v1h-1zM10 4h1v1h-1zM12 4h1v1h-1zM2 5h1v1h-1zM4 5h1v1h-1zM6 5h1v1h-1zM8 5h1v1h-1zM10 5h1v1h-1zM12 5h1v1h-1zM14 5h1v1h-1zM2 6h13v1h-13z'/%3E%3Cpath fill='%23c97f3c' d='M3 8h1v1h-1zM5 8h9v1h-9zM4 9h2v1h-2zM7 9h3v1h-3zM11 9h3v1h-3zM4 10h2v1h-2zM7 10h3v1h-3zM11 10h3v1h-3zM3 11h1v1h-1zM5 11h7v1h-7zM13 11h1v1h-1zM3 12h4v1h-4zM10 12h4v1h-4zM4 13h9v1h-9zM4 14h9v1h-9zM5 15h7v1h-7zM7 16h3v1h-3z'/%3E%3Cpath fill='%23eab071' d='M4 8h1v1h-1zM3 9h1v1h-1zM3 10h1v1h-1z'/%3E%3Cpath fill='%231a0f06' d='M6 9h1v1h-1zM10 9h1v1h-1zM6 10h1v1h-1zM10 10h1v1h-1zM7 12h3v1h-3z'/%3E%3Cpath fill='%23f08b8b' d='M4 11h1v1h-1zM12 11h1v1h-1z'/%3E%3C/svg%3E") center/contain no-repeat}

/* 🔵 2026-09-27：店員の画面（<body class="店員">）も、このファイルを 昔のゲーム_店員.css から読む。
   お客さまの画面の部品に合わせて決めた所（部品の名前が店員の画面では別の物を指す所）は、頭に :where(body:not(.店員)) を付けて
   お客さまの画面だけに効かせる。:where() は強さが0なので、お客さまの画面では当たる物も強さも順番も前と同じ（見た目は変わらない）。 */
/* ── 説明書の頁（大きな枠と、ずらした影） */
.panel,.card{
  border:3px solid var(--墨);border-radius:0;box-shadow:5px 5px 0 var(--影)}
:where(body:not(.店員)) .way,:where(body:not(.店員)) .step,:where(body:not(.店員)) .qa,:where(body:not(.店員)) .meta,
:where(body:not(.店員)) .shelf,:where(body:not(.店員)) .result-card,:where(body:not(.店員)) .page > .complete,:where(body:not(.店員)) .rows > .row{
  border:3px solid var(--墨);border-radius:0;box-shadow:5px 5px 0 var(--影)}
.cards > .card{box-shadow:3px 3px 0 var(--影)}
/* 頁の中に並ぶ小さな枠 */
:where(body:not(.店員)) .items > .item,:where(body:not(.店員)) .history > .entry,:where(body:not(.店員)) .h-row,
:where(body:not(.店員)) .stat > div,:where(body:not(.店員)) .items-list > .item,:where(body:not(.店員)) .item-image{border-radius:0}
:where(body:not(.店員)) .items > .item,:where(body:not(.店員)) .history > .entry,:where(body:not(.店員)) .h-row,
:where(body:not(.店員)) .stat > div,:where(body:not(.店員)) .items-list > .item{border:2px solid var(--墨);background:#fff}
:where(body:not(.店員)) .item-image{border:2px solid var(--墨)}
/* 札（状態・等級など） */
:where(body:not(.店員)) .state,:where(body:not(.店員)) .grade,:where(body:not(.店員)) .kind,:where(body:not(.店員)) .chip,
:where(body:not(.店員)) .cond,:where(body:not(.店員)) .days,:where(body:not(.店員)) .lot-count,:where(body:not(.店員)) .chips span,
:where(body:not(.店員)) .picker button,:where(body:not(.店員)) .filters button,:where(body:not(.店員)) nav.tabs a{border-radius:0;border:2px solid var(--墨)}
:where(body:not(.店員)) .filters{border-radius:0}
/* 番号の棚（番号を選ぶ）の升目 */
.number-grid .number{border-radius:0;border:2px solid var(--墨)}
.number-grid .number.sold{border-color:#9d9488}
.legend-mark{border-radius:0}
.bottom-bar{border-top:3px solid var(--墨)}
/* 知らせの箱 */
.error,.ok,.done,.rule,.notice,.hold-notice,.hold-notice-done,.return-notice-done,.perk,.gift,.left,.count,.kigen,.hitokoto,.banner,.error-box,.reveal-status,.suggest,.agree,.code,.ann{border-radius:0}
.tk{border-radius:4px}

/* ── 窓（黒い地に白い縁。数や状態を見せる所） */
:where(body:not(.店員)) .balance-box,:where(body:not(.店員)) .quote,:where(body:not(.店員)) .codebox,
:where(body:not(.店員)) .lot-info,:where(body:not(.店員)) .list > .item > .row{
  background:var(--窓);color:#fff;border:3px solid #fff;border-radius:6px;box-shadow:0 0 0 3px var(--窓);
  --ink:#fff;--text:#fff;--muted:#d8c8b0;--accent:var(--黄);--accent-dark:var(--黄)}
:where(body:not(.店員)) .balance-box,:where(body:not(.店員)) .quote,:where(body:not(.店員)) .codebox,
:where(body:not(.店員)) .lot-info{margin-left:3px;margin-right:3px}
:where(body:not(.店員)) .balance-value,:where(body:not(.店員)) .quote b,:where(body:not(.店員)) .code{font-family:var(--角字)}

/* ── のこりの目盛り（--全 と --残 を持たせると、残りの分だけ升目が点く） */
.昔-目盛り{position:relative;flex-basis:100%;height:14px;margin-top:8px;border:2px solid #fff;background:var(--窓)}
.昔-目盛り::before{content:"";position:absolute;top:1px;bottom:1px;left:1px;
  width:calc((100% - 2px) * var(--残,0) / var(--全,1));
  background:linear-gradient(90deg,var(--黄) calc(100% - 1px),transparent 0) 0 0/calc(100% / var(--残,1)) 100% repeat-x}
.昔-目盛りの字{flex-basis:100%;margin-top:3px;text-align:right;font:11px/1.4 "BIZ UDPGothic",sans-serif;color:#ddd}

/* ── 命令の窓（主なボタン）。「»」が付いた行が選ばれている印。押すと沈む */
/* 🔵 ボタンはお客さまの画面だけ（店員の画面は btn danger 等の赤いボタンまで黒くなり、表の中の小さなボタンも大きくなるため。店員の画面は 昔のゲーム_店員.css で別に決める） */
:where(body:not(.店員)) .btn:not(.sub),:where(body:not(.店員)) button.go,:where(body:not(.店員)) button.get,
:where(body:not(.店員)) button.big:not(.sub),:where(body:not(.店員)) .actions button:not(.sub),:where(body:not(.店員)) a.go,
:where(body:not(.店員)) .go .go-main,:where(body:not(.店員)) .card .button:not(.secondary),:where(body:not(.店員)) .result-card .button.primary,
:where(body:not(.店員)) .order-button,:where(body:not(.店員)) button.primary,:where(body:not(.店員)) main > .card > button{
  position:relative;background:var(--窓);color:#fff;border:3px solid #fff;border-radius:6px;box-shadow:0 0 0 3px var(--窓);
  font-family:var(--角字);font-weight:700;font-size:17px;letter-spacing:.02em;text-align:left;text-decoration:none;
  padding-left:34px;padding-right:12px;cursor:pointer}
:where(body:not(.店員)) :is(.btn:not(.sub),button.go,button.get,button.big:not(.sub),.actions button:not(.sub),a.go,.go .go-main,
.card .button:not(.secondary),.result-card .button.primary,.order-button,button.primary,main > .card > button)::before{
  content:"»";content:"»" / "";position:absolute;left:11px;top:50%;transform:translateY(-54%);font-size:20px;line-height:1}
:where(body:not(.店員)) :is(.btn:not(.sub),button.go,button.get,button.big:not(.sub),.actions button:not(.sub),a.go,.go .go-main,
.card .button:not(.secondary),.result-card .button.primary,.order-button,button.primary,main > .card > button):is(:hover,:focus-visible):not(:disabled){
  background:var(--窓);color:var(--黄)}
:where(body:not(.店員)) :is(.btn:not(.sub),button.go,button.get,button.big:not(.sub),.actions button:not(.sub),a.go,.go .go-main,
.card .button:not(.secondary),.result-card .button.primary,.order-button,button.primary,main > .card > button):active:not(:disabled){
  color:var(--黄);transform:translateY(2px)}
:where(body:not(.店員)) :is(.btn:not(.sub),button.go,button.get,button.big:not(.sub),.actions button:not(.sub),a.go,.go .go-main,
.card .button:not(.secondary),.result-card .button.primary,.order-button,button.primary,main > .card > button):disabled{
  background:#5e554c;border-color:#d8c8b0;box-shadow:0 0 0 3px #5e554c;color:#d8c8b0;opacity:1;cursor:not-allowed}
:where(body:not(.店員)) :is(.btn:not(.sub),button.go,button.get,button.big:not(.sub),.actions button:not(.sub),a.go,.go .go-main,
.card .button:not(.secondary),.result-card .button.primary,.order-button,button.primary,main > .card > button):disabled::before{content:none}

/* 控えめなボタン（紙の地に黒い縁。指した時だけ「»」が出る） */
:where(body:not(.店員)) .btn.sub,:where(body:not(.店員)) button.big.sub,:where(body:not(.店員)) .actions button.sub,
:where(body:not(.店員)) a.back,:where(body:not(.店員)) .go .go-sub,:where(body:not(.店員)) button.copy,:where(body:not(.店員)) .more,
:where(body:not(.店員)) .reset-button,:where(body:not(.店員)) .line-guide,:where(body:not(.店員)) .result-card .button:not(.primary),
:where(body:not(.店員)) .card .button.secondary,:where(body:not(.店員)) .tools button,:where(body:not(.店員)) .nav button,
:where(body:not(.店員)) .bar button:not(.primary){
  position:relative;background:var(--紙);color:var(--墨);border:3px solid var(--墨);border-radius:0;box-shadow:3px 3px 0 var(--影);
  font-weight:700;text-decoration:none;cursor:pointer}
:where(body:not(.店員)) :is(.btn.sub,button.big.sub,.actions button.sub,a.back,.go .go-sub,button.copy,.more,.reset-button,.line-guide,
.result-card .button:not(.primary),.card .button.secondary,.tools button,.nav button,.bar button:not(.primary)):is(:hover,:focus-visible):not(:disabled){
  background:#fff1d6;color:var(--墨)}
:where(body:not(.店員)) :is(.btn.sub,button.big.sub,.actions button.sub,a.back,.go .go-sub,button.copy,.more,.reset-button,.line-guide,
.result-card .button:not(.primary),.card .button.secondary,.tools button,.nav button,.bar button:not(.primary)):is(:hover,:focus-visible):not(:disabled)::before{
  content:"»";content:"»" / "";position:absolute;left:8px;top:50%;transform:translateY(-54%);font-size:18px;line-height:1;color:var(--橙)}
:where(body:not(.店員)) :is(.btn.sub,button.big.sub,.actions button.sub,a.back,.go .go-sub,button.copy,.more,.reset-button,.line-guide,
.result-card .button:not(.primary),.card .button.secondary,.tools button,.nav button,.bar button:not(.primary)):active:not(:disabled){
  transform:translate(2px,2px);box-shadow:1px 1px 0 var(--影)}
:where(body:not(.店員)) :is(.btn.sub,button.big.sub,.actions button.sub,a.back,.go .go-sub,button.copy,.more,.reset-button,.line-guide,
.result-card .button:not(.primary),.card .button.secondary,.tools button,.nav button,.bar button:not(.primary)):disabled{
  background:#eadbc4;color:#8a7a66;border-color:#8a7a66;box-shadow:none;cursor:not-allowed}

/* 入れる欄 */
input:not([type=checkbox]):not([type=radio]):not(#昔),select:not(#昔),textarea:not(#昔){
  border:3px solid var(--墨);border-radius:0;background:#fff;color:var(--墨)}
input:not([type=checkbox]):not([type=radio]):not(#昔):focus,select:not(#昔):focus,textarea:not(#昔):focus{
  outline:3px solid var(--橙);outline-offset:1px}
input[type=checkbox],input[type=radio]{accent-color:var(--橙)}

/* ── 売り場（弾を選ぶ）の頁：紫の帯に弾の名前、表紙の画像、状態の窓、命令の窓 */
:where(body:not(.店員)) .list > .item{display:flex;flex-direction:column;align-items:stretch;padding:0 0 16px;background:var(--紙);
  border:4px solid var(--墨);border-radius:0;box-shadow:6px 6px 0 var(--影)}
:where(body:not(.店員)) .list > .item:hover{border-color:var(--墨)}
:where(body:not(.店員)) .list > .item:disabled{opacity:.6}
:where(body:not(.店員)) .list > .item > *{margin-left:12px;margin-right:12px}
:where(body:not(.店員)) .list > .item > .name{order:-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:10px 12px;
  background:var(--紫);color:var(--黄);border-bottom:4px solid var(--墨);font-family:var(--角字);font-weight:700;font-size:21px;line-height:1.3}
.昔-第{background:var(--黄);color:#161310;font:900 13px/1.5 "BIZ UDPGothic",sans-serif;padding:1px 8px;border:2px solid #161310}
:where(body:not(.店員)) .list > .item > img{width:calc(100% - 24px)!important;min-width:0;height:auto;margin-bottom:14px!important;border:3px solid var(--墨);border-radius:0!important}
:where(body:not(.店員)) .list > .item > .row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 14px;padding:10px 14px 12px;
  font-family:var(--角字);font-size:15px;color:#fff;margin-left:15px;margin-right:15px}
:where(body:not(.店員)) .list > .item > .row strong{color:#fff;font-size:18px}
:where(body:not(.店員)) .list > .item > .row .left-none{color:#ffb4a3}
:where(body:not(.店員)) .list > .item > .perk{margin-top:14px;border-radius:0;border-left-width:4px}
:where(body:not(.店員)) .list > .item > .go{position:relative;display:block;margin:18px 15px 0;padding:8px 8px 8px 34px;background:var(--窓);color:#fff;
  border:3px solid #fff;border-radius:6px;box-shadow:0 0 0 3px var(--窓);font-family:var(--角字);font-size:18px;font-weight:700}
:where(body:not(.店員)) .list > .item > .go::before{content:"»";content:"»" / "";position:absolute;left:11px;top:50%;transform:translateY(-54%);font-size:20px;line-height:1}
:where(body:not(.店員)) .list > .item:is(:hover,:focus-visible) > .go{color:var(--黄)}
:where(body:not(.店員)) .list > .item:active:not(:disabled) > .go{transform:translateY(2px)}
:where(body:not(.店員)) .list > .item:disabled > .go::before{content:none}
:where(body:not(.店員)) .list > a{display:block!important;margin:10px 0 22px!important;padding:8px 12px;background:var(--紙);color:var(--墨)!important;
  border:3px solid var(--墨);box-shadow:3px 3px 0 var(--影);font-weight:700;font-size:14px!important;text-decoration:none}
:where(body:not(.店員)) .list > a:is(:hover,:focus-visible){background:#fff1d6}
:where(body:not(.店員)) .list ~ .note::before{content:"※ ";content:"※ " / "";color:var(--橙);font-weight:900}
.昔-点{list-style:none;margin:0 0 18px;padding:0;font-size:13px;color:var(--薄墨)}
.昔-点 li{position:relative;padding-left:1.1em}
.昔-点 li::before{content:"●";content:"●" / "";position:absolute;left:0;top:.2em;color:var(--橙);font-size:.8em}
.昔-点 a{color:var(--accent);font-weight:700}

/* ── 番号つきの説明図 */
.昔-説明図{margin:26px 0 0;padding:12px;background:var(--紙);border:4px solid var(--墨)}
.昔-説明図 h3{margin:4px 0 8px;font-size:17px}
.昔-説明図 h3::before{content:"■ ";content:"■ " / "";color:var(--橙)}
.昔-説明図 svg{display:block;width:100%;max-width:300px;height:auto;margin:0 auto 6px;color:var(--墨)}
.昔-説明図 ol{list-style:none;margin:0;padding:0;font-size:13px}
.昔-説明図 li{display:flex;gap:8px;align-items:baseline;padding:3px 0;border-top:1px dashed var(--薄墨)}
.昔-説明図 p{margin:6px 0 0;font-size:13px}
.昔-丸,.step .no,.steps li::before{background:var(--黄);color:#161310;border:2px solid #161310;font-weight:900}
.昔-丸{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px}

/* ── 下の黒い太帯（橋が足す下のメニューも同じ黒にそろえる） */
body::after{content:"";display:block;height:26px;background:var(--帯);border-top:4px solid var(--橙)}
body > nav:not([class]){background:var(--帯)!important;border-top:4px solid var(--橙)!important}
body > nav:not([class]) a{position:relative;color:#fff!important;font-family:var(--角字);font-weight:700!important;font-size:14px;white-space:nowrap}
body > nav:not([class]) a[style*="700"]{color:var(--黄)!important}
body > nav:not([class]) a[style*="700"]::before{content:"»";content:"»" / "";position:absolute;left:3px;top:50%;transform:translateY(-54%)}

/* ── 動き（端末が「動きを減らす」の時は全部止まる） */
@media (prefers-reduced-motion: no-preference){
  .昔-話{transform-origin:50% 0;animation:昔-開く .24s steps(4) both}
  .panel,.card,.way,.step,.qa,.meta,.shelf,.result-card,.list > .item,.rows > .row,.昔-説明図{animation:昔-出る .2s steps(2) .2s both}
  :is(.list > .item,.rows > .row,.steps > .step,.cards > .card):nth-child(2){animation-delay:.25s}
  :is(.list > .item,.rows > .row,.steps > .step,.cards > .card):nth-child(3){animation-delay:.3s}
  :is(.list > .item,.rows > .row,.steps > .step,.cards > .card):nth-child(4){animation-delay:.35s}
  :is(.list > .item,.rows > .row,.steps > .step,.cards > .card):nth-child(n+5){animation-delay:.4s}
  .昔-どんぐり.跳ぶ{animation:昔-跳ぶ .5s steps(5)}
}
@keyframes 昔-開く{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes 昔-出る{from{opacity:0}to{opacity:1}}
@keyframes 昔-跳ぶ{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}