/* =========================================================
   スコアの見方（Score Info）
   専用スロットから生成した「ⓘ スコアの見方」ボタンと
   説明パネルだけを表示する。
   860px 座標系（カードごと縮小される）に合わせた実寸指定。
   ========================================================= */

/* JS実行前の専用スロットはレイアウトに影響させない */
.sc-scoreinfo-slot{display:none!important}

/* --- トリガー配置ラッパ（カード左下） --- */
.sc-scoreinfo-trigger{position:absolute;left:22px;right:auto;top:auto;bottom:22px;z-index:40;transform:translate(-13px,13px)}

/* --- トリガーボタン（アイコン付き） --- */
.sc-scoreinfo-btn{appearance:none;-webkit-appearance:none;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;width:auto;min-width:0;height:38px;padding:0 12px 0 14px;border:1.5px solid #d7d7d7;border-radius:999px;background:rgba(255,255,255,.96);color:#505050;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans CJK JP","sans-serif-black","Yu Gothic","YuGothic","Meiryo",sans-serif;font-size:25px;font-weight:800;font-synthesis:weight;line-height:1;white-space:nowrap;cursor:pointer;box-shadow:0 2px 7px rgba(0,0,0,.08);-webkit-tap-highlight-color:transparent}
.sc-scoreinfo-btn:hover{border-color:#505050;background:#f7f7f7}
.sc-scoreinfo-btn .sc-si-ic{display:inline-flex;align-items:center;justify-content:center;font-size:26px;line-height:1;color:#505050;font-weight:800}

/* --- オーバーレイ（ボタン真上ポップ・全カード共通） --- */
.sc-scoreinfo-ov{position:absolute;z-index:60;display:none;left:9px;bottom:104px}
.sc-scoreinfo-ov.is-open{display:block}

/* --- パネル本体 --- */
/* 単体(.sc-ss)・2足・5足など差し込み先の text-align を継承しないよう、
   パネル内部は常に左揃えを基準にする（タブは各自 center 指定済み）。 */
.sc-si-panel{position:relative;text-align:left;background:#fff;border:1px solid #e5e5e5;border-radius:20px;box-shadow:0 14px 44px rgba(0,0,0,.22);overflow:hidden;color:#505050;width:660px;max-width:820px;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans CJK JP","Yu Gothic","YuGothic","Meiryo",sans-serif}

/* 右上×ボタン */
.sc-si-x{appearance:none;-webkit-appearance:none;margin:0;border:0;padding:0;box-shadow:none;font-family:inherit;line-height:1;position:absolute;top:14px;right:16px;width:52px;height:52px;border-radius:50%;background:#f2f2f2;color:#777;font-size:32px;font-weight:800;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:5}
.sc-si-x:hover{background:#e6e6e6;color:#555}

/* 上部タブ */
.sc-si-tabs{display:flex;border-bottom:2px solid #f0f0f0;padding-right:64px}
.sc-si-tab{appearance:none;-webkit-appearance:none;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;font-family:inherit;line-height:inherit;min-width:0;flex:1;text-align:center;padding:18px 4px;font-size:27px;font-weight:800;color:#aaa;cursor:pointer;border-bottom:4px solid transparent}
.sc-si-tab.is-on{color:#0072B2;border-bottom-color:#0072B2}

.sc-si-body{padding:22px 26px}

/* 100点の内訳（項目名→点満点→バー） */
.sc-si-bd-row{display:grid;grid-template-columns:var(--bd-name,300px) var(--bd-pts,170px) 1fr;align-items:center;padding:6px 0;font-size:28px;font-weight:800;text-align:left}
.sc-si-bd-row .l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;justify-self:start}
.sc-si-bd-row .p{text-align:left;font-variant-numeric:tabular-nums;white-space:nowrap;transform:translateX(var(--bd-pts-x,-60px))}
.sc-si-bd-row .bar{height:16px;background:#eceef1;border-radius:999px;overflow:hidden;margin-left:var(--bd-bar-x,-60px);width:var(--bd-bar-w,240px);max-width:100%;justify-self:start;align-self:center}
.sc-si-bd-row .bar > span{display:block;height:100%;background:#0072B2;border-radius:999px}
.sc-si-bd-row.is-total{border-top:2px solid #eee;margin-top:8px;padding-top:12px;color:#0072B2}

/* S〜D評価基準（バッジ→説明→バー） */
.sc-si-sd-row{display:grid;grid-template-columns:var(--sd-badge,62px) var(--sd-label,420px) 1fr;align-items:center;height:56px;font-size:28px;font-weight:800}
.sc-si-sd-row b{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:999px;background:var(--share-color,#777);color:#fff;font-size:28px;font-weight:800;line-height:1;box-shadow:0 0 0 5px #fff}
.sc-si-sd-row .sd-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.sc-si-sd-row .sd-bar{height:18px;background:#eceef1;border-radius:999px;overflow:hidden;margin-left:var(--sd-bar-x,-80px);width:var(--sd-bar-w,280px);max-width:100%;justify-self:start}
.sc-si-sd-row .sd-bar > span{display:block;height:100%;border-radius:999px}

/* 平均基準 */
.sc-si-avg{font-size:27px;font-weight:700;line-height:1.65;color:#505050;text-align:left}