/* SHOKEI STORE ── 共有ボタン（Web・アプリ共通）と、アプリ内表示（html.app-shell）のときだけ効く殻 */

/* 共有ボタン */
.kyoyu{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:48px;min-width:48px;padding:0 14px;border:1px solid var(--keisen-koi);border-radius:2px;background:var(--shiro,#fff);color:var(--sumi);font:inherit;font-size:12px;letter-spacing:.08em;cursor:pointer}
.kyoyu:hover{border-color:var(--sumi)}
.kyoyu svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pdp-buy .kyoyu span{display:none}
.kyoyu-row{margin:10px 0 0}
.kyoyu-row .kyoyu{height:34px;padding:0 12px;background:none;border-color:var(--keisen)}

/* ---- ここからアプリ内だけ ---- */
html.app-shell body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
/* Web 向けの案内（ホーム画面に追加・アプリで開く 等）は出さない */
html.app-shell [data-web-only],html.app-shell .a2hs,html.app-shell .app-banner,html.app-shell .obi-app{display:none!important}
/* 上部の帯：アプリでは下部タブがあるので、上のナビは薄く・小さく */
html.app-shell .ten-r .ten-link,html.app-shell .ten-order,html.app-shell .ten-lang{display:none}
html.app-shell .ten{padding-top:env(safe-area-inset-top,0px)}
/* 下部タブ */
.app-tab{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;grid-template-columns:repeat(5,1fr);height:calc(60px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:rgba(247,245,240,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--keisen);box-sizing:border-box}
html.app-shell .app-tab{display:grid}
.app-tab-i{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--usu);font-size:10.5px;letter-spacing:.06em;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:color .2s}
.app-tab-i svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.app-tab-i.on{color:var(--sumi)}
.app-tab-i.on svg{stroke-width:1.9}
.app-tab-i[data-tab=fav].on svg{fill:var(--sumi)}
.app-tab-i:active{opacity:.6}
.app-tab-n{position:absolute;top:6px;left:calc(50% + 6px);min-width:16px;height:16px;border-radius:8px;background:var(--shu);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;padding:0 4px;font-family:var(--font-go)}
.app-tab-n[hidden]{display:none}
/* 下に固定される部品はタブの上へ */
html.app-shell .bag-bar{bottom:calc(60px + env(safe-area-inset-bottom,0px))}
html.app-shell .toast{bottom:calc(140px + env(safe-area-inset-bottom,0px))}
html.app-shell .st-save-bar,html.app-shell .st-bottom{bottom:calc(60px + env(safe-area-inset-bottom,0px))}
/* 最近見た作品・フッターの余白 */
html.app-shell footer.ashi{padding-bottom:24px}
/* iOS：横の弾み・選択の抑制でアプリらしく */
html.app-ios body{-webkit-text-size-adjust:100%;overscroll-behavior-y:none}
html.app-shell img,html.app-shell a{-webkit-touch-callout:none}
html.app-shell .ten-btn,html.app-shell .fude,html.app-shell .app-tab-i{-webkit-user-select:none;user-select:none}

html.app-shell #an-obi{bottom:calc(76px + env(safe-area-inset-bottom,0px))}