/* EAP 新しい見た目（U1）— .eapur-on の中の「決まった部品」だけに効く。画面全体の背景・文字の色・大きさは変えない（ページごとに確かめながら U2 以降で入れる）。
   色は :root の --eapur-*（設定の画面で変えられる） */
:root{--eapur-gold:#e8bb66;--eapur-text:#fff1d4;--eapur-sub:#d2c4a9;--eapur-ink:#120e09;--eapur-line:#ac8448;--eapur-button:#d7a952;--eapur-btn-text:#1a1005;--eapur-btn-edge:#ffdf9a;--eapur-nav:#0b0a07f5}

/* 品のカード（一覧） */
.eapur-on .eap-card{background:linear-gradient(180deg,#1c150d,var(--eapur-ink)) !important;border:1px solid var(--eapur-line) !important;border-radius:12px !important;box-shadow:0 6px 18px rgba(0,0,0,.45) !important;color:var(--eapur-text) !important}
.eapur-on .eap-card a:not(.eap-btn-primary):not(.eap-btn-outline){color:var(--eapur-text) !important}
.eapur-on .eap-card h2,.eapur-on .eap-card h3,.eapur-on .eap-card .title{color:var(--eapur-gold) !important;overflow-wrap:break-word !important}

/* ボタン（主・ふち）— 色と高さだけ変える（並び方 display は今のまま） */
.eapur-on .eap-btn-primary,.eapur-on .eap-card .eap-btn-primary{background:var(--eapur-button) !important;color:var(--eapur-btn-text) !important;border:1px solid var(--eapur-btn-edge) !important;border-radius:10px !important;min-height:46px !important;font-weight:700 !important;transition:filter .15s,transform .15s !important}
.eapur-on .eap-btn-primary:hover{filter:brightness(1.08) !important}
.eapur-on .eap-btn-primary:active{transform:translateY(1px) !important}
.eapur-on .eap-btn-outline,.eapur-on .eap-card .eap-btn-outline{background:transparent !important;color:var(--eapur-gold) !important;border:1px solid var(--eapur-line) !important;border-radius:10px !important;min-height:46px !important}
.eapur-on .eap-btn-primary:focus-visible,.eapur-on .eap-btn-outline:focus-visible,.eapur-on .edo-bottom-nav a:focus-visible,.eapur-on .medaka-tabs a:focus-visible,.eapur-on .medaka-tabs button:focus-visible{outline:2px solid var(--eapur-text) !important;outline-offset:2px !important}

/* 開催中・終了分のタブ */
.eapur-on .medaka-tabs{border-bottom:1px solid var(--eapur-line) !important}

/* 下の5つのボタンの帯（機能は今のまま・見た目だけ） */
.eapur-on .edo-bottom-nav{background:var(--eapur-nav) !important;border-top:1px solid var(--eapur-line) !important}
.eapur-on .edo-bottom-nav a,.eapur-on .edo-bottom-nav a *{color:var(--eapur-text) !important}
.eapur-on .edo-bottom-nav a{min-height:44px !important}

@media (prefers-reduced-motion:reduce){.eapur-on .eap-btn-primary{transition:none !important}}

/* 0.1.2 カードの中の文字を読める色にそろえる（今のCSSが白いカード用に濃い文字を !important で決めているため） */
.eapur-on .eap-card *{color:var(--eapur-text) !important;border-color:var(--eapur-line) !important}
.eapur-on .eap-card .eap-btn-primary,.eapur-on .eap-card .eap-btn-primary *{color:var(--eapur-btn-text) !important}
.eapur-on .eap-card .eap-btn-outline,.eapur-on .eap-card .eap-btn-outline *{color:var(--eapur-gold) !important}
.eapur-on .eap-card [class*=price],.eapur-on .eap-card [class*=price] *{color:var(--eapur-gold) !important}
/* カードの中の白い面（本文の箱・ボタンの段・証明のシール・お気に入り）を墨の色にそろえる（0.1.2・本番の画面で確かめ済み） */
.eapur-on .eap-card .body{background:transparent !important}
.eapur-on .eap-card .actions{background:rgba(0,0,0,.25) !important;border-top:1px solid rgba(172,132,72,.5) !important}
.eapur-on .eap-card .eappd-cert-sticker{background:#1c150d !important;border:1px solid var(--eapur-line) !important}
.eapur-on .eap-card .eap-v4-fav-btn{background:rgba(18,14,9,.85) !important;border:1px solid var(--eapur-line) !important}
.eapur-on .eap-card .eap-v4-fav-btn *{color:var(--eapur-gold) !important}
.eapur-on .eap-card .eap-btn-primary{text-decoration:none !important}

/* 0.2.0 U2 画面ごとの背景（.eapur-bg-on の時だけ）。板は今の夜空と看板より上・中身より下（z -1）。
   縦長の絵：スマホは画面いっぱい、広い画面はぼかした同じ絵の上に縦長のまま真ん中に置く。下ほど暗くして文字を読みやすく */
#eapur-bg{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:#0b0906}
#eapur-bg i{position:absolute;inset:-24px;background:var(--eapur-bg) center/cover no-repeat;filter:blur(16px) brightness(.45)}
#eapur-bg b{position:absolute;inset:0;background:var(--eapur-bg) center top/cover no-repeat}
@media (min-width:700px){#eapur-bg b{background-size:auto 100%}}
/* 0.2.1 動く背景：絵の上に重ね、再生が始まったらゆっくり浮かび上がる */
#eapur-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;opacity:0;transition:opacity 1.6s ease}
#eapur-bg video.on{opacity:1}
@media (min-width:700px){#eapur-bg video{object-fit:contain}}
@media (prefers-reduced-motion:reduce){#eapur-bg video{display:none}}
/* 0.2.2 暗い膜の濃さは --eapur-dim（設定の「背景の暗さ」0〜0.9）。上ほど薄く、下ほど濃い */
#eapur-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,9,6,calc(var(--eapur-dim,.4) * .125)),rgba(11,9,6,calc(var(--eapur-dim,.4) * .5)) 45%,rgba(11,9,6,var(--eapur-dim,.4)))}
/* 品の一覧の箱の黒い面を少しだけ透かす（カード・ボタンは今のまま） */
.eapur-on.eapur-bg-on .medaka-dashboard{background:rgba(17,17,17,calc(var(--eapur-dim,.4) * .625)) !important}
/* 透かすのは、箱の中の2つの面（操作の段・品の並ぶ面）だけ。タブ・小窓・引き出しは今のまま */
.eapur-on.eapur-bg-on .medaka-dashboard > .medaka-action-area,.eapur-on.eapur-bg-on .medaka-dashboard > div[style*="background:#111;"],.eapur-on.eapur-bg-on .medaka-dashboard > div[style*="background: #111;"],.eapur-on.eapur-bg-on .medaka-dashboard > div[style*="background-color:#111;"]{background-color:transparent !important}

/* 0.2.1 「表示列数:」の小さな文字（もとは濃い灰色で背景に沈む） */
.eapur-on .eap-cols-ui .label{color:var(--eapur-sub) !important}

/* 0.3.2 一覧のカードの下の段（店主「入札ページへの文字が小さい」「★が誰をフォローするのか分からない」）
   並び替えは見た目だけ（縦に2段）。押した時の働き・ボタンの名前（中のHTML）は今のまま。★の横に「出品者をフォロー／フォロー中」を文字で出す */
.eapur-on .eap-card .actions{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:6px !important}
.eapur-on .eap-card .actions .eap-btn-primary{width:100% !important;font-size:13px !important;line-height:1.3 !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:0 6px !important;box-sizing:border-box !important}
.eapur-on .eap-card .actions .eapsf-btn{width:100% !important;min-height:44px !important;height:auto !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:4px !important;font-size:12px !important;line-height:1.25 !important;white-space:normal !important;text-align:center !important;background:#120e09 !important;border:1px solid var(--eapur-line) !important;border-radius:8px !important;color:var(--eapur-gold) !important;padding:3px 6px !important;box-sizing:border-box !important}
.eapur-on .eap-card .actions .eapsf-btn *{color:var(--eapur-gold) !important}
.eapur-on .eap-card .actions .eapsf-btn .eapsf-tx{display:none !important}
.eapur-on .eap-card .actions .eapsf-btn::after{content:"出品者を\Aフォロー";white-space:pre;text-align:left;font-weight:700;color:var(--eapur-gold)}
.eapur-on .eap-card .actions .eapsf-btn[aria-pressed="true"]::after{content:"フォロー中"}
.eapur-on .eap-card .actions .eapsf-btn:focus-visible{outline:2px solid var(--eapur-text) !important;outline-offset:2px !important}

/* 0.3.3 わたしの取引のいま（.eapmd）：墨の面を少し透かして運河を見せる。和紙のカードは今のまま */
.eapur-on.eapur-bg-on .eapmd{background:rgba(15,11,9,calc(.55 + var(--eapur-dim,.4) * .5)) !important;background-image:none !important}

/* 0.5.0 背景を画面全体に固定（UI工房の見本と同じ）。印 .eapur-full が付いた時だけ。
   背景の板は切り取らずに全体へ。今の夜空の動く絵は板の後ろで見えないので、隠しておく。看板の文字（h1）は消さずに残す。 */
.eapur-full.eapur-bg-on #eapur-bg{clip-path:none !important;-webkit-clip-path:none !important}
.eapur-full.eapur-bg-on #canvas-container-edo{display:none !important}
.eapur-full.eapur-bg-on #edo-bg-text-layer *{animation:none !important}
/* 木の看板（第十三版の絵そのまま）。ページと一緒に流れる・押せない飾り */
#eapur-sign{position:absolute;left:50%;top:12px;transform:translateX(-50%);width:min(94vw,600px);height:auto;z-index:-1;pointer-events:none;filter:drop-shadow(0 10px 18px rgba(0,0,0,.65))}

/* 0.9.6 店主『江戸オクの図（看板）が前にきちゃってるページが多々』：看板は中身の後ろ・背景の前（z-index -1／背景は -2）。中身の札や文字の上には出さない */

/* 1.8.2 店主「まだテーマ負けしてる（出品フォーム）」：「ファイルを選択」のボタンはブラウザが描く部品で、地（薄い灰色）はそのまま・文字だけが入力欄の明るい色を受け継いで読めなかった。
   入力欄の色を変える所では、ファイルのボタンの色も必ず一緒に決める（どのページでも）。1つの書き方が分からないブラウザで全部が無効にならないよう、書き方ごとに分ける */
.eapur-on.eapur-on input[type=file]::file-selector-button{background:#120e09 !important;color:var(--eapur-gold,#e8bb66) !important;-webkit-text-fill-color:var(--eapur-gold,#e8bb66) !important;border:1px solid var(--eapur-line,#ac8448) !important;border-radius:999px !important;padding:8px 16px !important;margin-right:10px !important;font-weight:700 !important;min-height:40px !important;cursor:pointer}
.eapur-on.eapur-on input[type=file]::-webkit-file-upload-button{background:#120e09 !important;color:var(--eapur-gold,#e8bb66) !important;-webkit-text-fill-color:var(--eapur-gold,#e8bb66) !important;border:1px solid var(--eapur-line,#ac8448) !important;border-radius:999px !important;padding:8px 16px !important;margin-right:10px !important;font-weight:700 !important;min-height:40px !important;cursor:pointer}
/* 1.8.2 根っこの直し：新しい見た目は箱に -webkit-text-fill-color（中へ受け継がれる）を付けている。ほかの部品が「白い地に黒い文字」と決めた入力欄にまで
   明るい塗りが受け継がれ、白い地に白い文字になっていた（販売証明の一覧の番号の欄・出品フォームのファイルのボタン）。
   入力欄・文章の欄・選ぶ欄は、受け継いだ塗りを使わず、その欄自身の文字の色で塗る。新しい見た目が自分で色を決めている欄は、強い決まり（!important）のまま変わらない */
.eapur-on input,.eapur-on textarea,.eapur-on select{-webkit-text-fill-color:currentColor}

/* 1.23.0 横長の絵がある景色（御触書の間など）は、横長の画面ではそちらを使う */
@media (min-aspect-ratio:1/1){#eapur-bg.has-wide i,#eapur-bg.has-wide b{background-image:var(--eapur-bg-wide)}}

/* 1.24.6 終了分の一覧：一覧のプラグインがカードに直接書く「透け 0.6」（元の白い見た目用）で、後ろの絵が透けて読めなかった（店主の指摘）。
   新しい見た目ではカードは透けさせず、終わった品は写真だけ少し色を落として見分ける */
.eap-list .eap-card[style*="opacity"]{opacity:1!important}
.eap-list .eap-card[style*="opacity"] img,.eap-list .eap-card[style*="opacity"] video{filter:grayscale(.55) brightness(.85)}